Mission Control Dashboard - Initial implementation

node_modules/motion-dom/dist/es/render/html/HTMLVisualElement.mjs

@@ -0,0 +1,45 @@
+import { isCSSVariableName } from '../../animation/utils/is-css-variable.mjs';
+import { transformProps } from '../utils/keys-transform.mjs';
+import { defaultTransformValue, readTransformValue } from '../dom/parse-transform.mjs';
+import { measureViewportBox } from '../../projection/utils/measure.mjs';
+import { DOMVisualElement } from '../dom/DOMVisualElement.mjs';
+import { buildHTMLStyles } from './utils/build-styles.mjs';
+import { renderHTML } from './utils/render.mjs';
+import { scrapeMotionValuesFromProps } from './utils/scrape-motion-values.mjs';
+
+function getComputedStyle(element) {
+    return window.getComputedStyle(element);
+}
+class HTMLVisualElement extends DOMVisualElement {
+    constructor() {
+        super(...arguments);
+        this.type = "html";
+        this.renderInstance = renderHTML;
+    }
+    readValueFromInstance(instance, key) {
+        if (transformProps.has(key)) {
+            return this.projection?.isProjecting
+                ? defaultTransformValue(key)
+                : readTransformValue(instance, key);
+        }
+        else {
+            const computedStyle = getComputedStyle(instance);
+            const value = (isCSSVariableName(key)
+                ? computedStyle.getPropertyValue(key)
+                : computedStyle[key]) || 0;
+            return typeof value === "string" ? value.trim() : value;
+        }
+    }
+    measureInstanceViewportBox(instance, { transformPagePoint }) {
+        return measureViewportBox(instance, transformPagePoint);
+    }
+    build(renderState, latestValues, props) {
+        buildHTMLStyles(renderState, latestValues, props.transformTemplate);
+    }
+    scrapeMotionValuesFromProps(props, prevProps, visualElement) {
+        return scrapeMotionValuesFromProps(props, prevProps, visualElement);
+    }
+}
+
+export { HTMLVisualElement, getComputedStyle };
+//# sourceMappingURL=HTMLVisualElement.mjs.map

node_modules/motion-dom/dist/es/render/html/HTMLVisualElement.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"HTMLVisualElement.mjs","sources":["../../../../src/render/html/HTMLVisualElement.ts"],"sourcesContent":["import type { Box } from \"motion-utils\"\nimport type { AnyResolvedKeyframe } from \"../../animation/types\"\nimport { isCSSVariableName } from \"../../animation/utils/is-css-variable\"\nimport type { MotionNodeOptions } from \"../../node/types\"\nimport { transformProps } from \"../utils/keys-transform\"\nimport {\n    defaultTransformValue,\n    readTransformValue,\n} from \"../dom/parse-transform\"\nimport { measureViewportBox } from \"../../projection/utils/measure\"\nimport { DOMVisualElement } from \"../dom/DOMVisualElement\"\nimport type { DOMVisualElementOptions } from \"../dom/types\"\nimport type { ResolvedValues, MotionConfigContextProps } from \"../types\"\nimport type { VisualElement } from \"../VisualElement\"\nimport { HTMLRenderState } from \"./types\"\nimport { buildHTMLStyles } from \"./utils/build-styles\"\nimport { renderHTML } from \"./utils/render\"\nimport { scrapeMotionValuesFromProps } from \"./utils/scrape-motion-values\"\n\nexport function getComputedStyle(element: HTMLElement) {\n    return window.getComputedStyle(element)\n}\n\nexport class HTMLVisualElement extends DOMVisualElement<\n    HTMLElement,\n    HTMLRenderState,\n    DOMVisualElementOptions\n> {\n    type = \"html\"\n\n    readValueFromInstance(\n        instance: HTMLElement,\n        key: string\n    ): AnyResolvedKeyframe | null | undefined {\n        if (transformProps.has(key)) {\n            return this.projection?.isProjecting\n                ? defaultTransformValue(key)\n                : readTransformValue(instance, key)\n        } else {\n            const computedStyle = getComputedStyle(instance)\n            const value =\n                (isCSSVariableName(key)\n                    ? computedStyle.getPropertyValue(key)\n                    : computedStyle[key as keyof typeof computedStyle]) || 0\n\n            return typeof value === \"string\" ? value.trim() : (value as number)\n        }\n    }\n\n    measureInstanceViewportBox(\n        instance: HTMLElement,\n        { transformPagePoint }: MotionNodeOptions & Partial<MotionConfigContextProps>\n    ): Box {\n        return measureViewportBox(instance, transformPagePoint)\n    }\n\n    build(\n        renderState: HTMLRenderState,\n        latestValues: ResolvedValues,\n        props: MotionNodeOptions\n    ) {\n        buildHTMLStyles(renderState, latestValues, props.transformTemplate)\n    }\n\n    scrapeMotionValuesFromProps(\n        props: MotionNodeOptions,\n        prevProps: MotionNodeOptions,\n        visualElement: VisualElement\n    ) {\n        return scrapeMotionValuesFromProps(props, prevProps, visualElement)\n    }\n\n    renderInstance = renderHTML\n}\n"],"names":[],"mappings":";;;;;;;;;AAmBM,SAAU,gBAAgB,CAAC,OAAoB,EAAA;AACjD,IAAA,OAAO,MAAM,CAAC,gBAAgB,CAAC,OAAO,CAAC;AAC3C;AAEM,MAAO,iBAAkB,SAAQ,gBAItC,CAAA;AAJD,IAAA,WAAA,GAAA;;QAKI,IAAA,CAAA,IAAI,GAAG,MAAM;QA4Cb,IAAA,CAAA,cAAc,GAAG,UAAU;IAC/B;IA3CI,qBAAqB,CACjB,QAAqB,EACrB,GAAW,EAAA;AAEX,QAAA,IAAI,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;AACzB,YAAA,OAAO,IAAI,CAAC,UAAU,EAAE;AACpB,kBAAE,qBAAqB,CAAC,GAAG;AAC3B,kBAAE,kBAAkB,CAAC,QAAQ,EAAE,GAAG,CAAC;QAC3C;aAAO;AACH,YAAA,MAAM,aAAa,GAAG,gBAAgB,CAAC,QAAQ,CAAC;AAChD,YAAA,MAAM,KAAK,GACP,CAAC,iBAAiB,CAAC,GAAG;AAClB,kBAAE,aAAa,CAAC,gBAAgB,CAAC,GAAG;kBAClC,aAAa,CAAC,GAAiC,CAAC,KAAK,CAAC;AAEhE,YAAA,OAAO,OAAO,KAAK,KAAK,QAAQ,GAAG,KAAK,CAAC,IAAI,EAAE,GAAI,KAAgB;QACvE;IACJ;AAEA,IAAA,0BAA0B,CACtB,QAAqB,EACrB,EAAE,kBAAkB,EAAyD,EAAA;AAE7E,QAAA,OAAO,kBAAkB,CAAC,QAAQ,EAAE,kBAAkB,CAAC;IAC3D;AAEA,IAAA,KAAK,CACD,WAA4B,EAC5B,YAA4B,EAC5B,KAAwB,EAAA;QAExB,eAAe,CAAC,WAAW,EAAE,YAAY,EAAE,KAAK,CAAC,iBAAiB,CAAC;IACvE;AAEA,IAAA,2BAA2B,CACvB,KAAwB,EACxB,SAA4B,EAC5B,aAA4B,EAAA;QAE5B,OAAO,2BAA2B,CAAC,KAAK,EAAE,SAAS,EAAE,aAAa,CAAC;IACvE;AAGH;;;;"}

node_modules/motion-dom/dist/es/render/html/utils/build-styles.mjs

@@ -0,0 +1,66 @@
+import { getValueAsType } from '../../../value/types/utils/get-as-type.mjs';
+import { numberValueTypes } from '../../../value/types/maps/number.mjs';
+import { transformProps } from '../../utils/keys-transform.mjs';
+import { isCSSVariableName } from '../../../animation/utils/is-css-variable.mjs';
+import { buildTransform } from './build-transform.mjs';
+
+function buildHTMLStyles(state, latestValues, transformTemplate) {
+    const { style, vars, transformOrigin } = state;
+    // Track whether we encounter any transform or transformOrigin values.
+    let hasTransform = false;
+    let hasTransformOrigin = false;
+    /**
+     * Loop over all our latest animated values and decide whether to handle them
+     * as a style or CSS variable.
+     *
+     * Transforms and transform origins are kept separately for further processing.
+     */
+    for (const key in latestValues) {
+        const value = latestValues[key];
+        if (transformProps.has(key)) {
+            // If this is a transform, flag to enable further transform processing
+            hasTransform = true;
+            continue;
+        }
+        else if (isCSSVariableName(key)) {
+            vars[key] = value;
+            continue;
+        }
+        else {
+            // Convert the value to its default value type, ie 0 -> "0px"
+            const valueAsType = getValueAsType(value, numberValueTypes[key]);
+            if (key.startsWith("origin")) {
+                // If this is a transform origin, flag and enable further transform-origin processing
+                hasTransformOrigin = true;
+                transformOrigin[key] =
+                    valueAsType;
+            }
+            else {
+                style[key] = valueAsType;
+            }
+        }
+    }
+    if (!latestValues.transform) {
+        if (hasTransform || transformTemplate) {
+            style.transform = buildTransform(latestValues, state.transform, transformTemplate);
+        }
+        else if (style.transform) {
+            /**
+             * If we have previously created a transform but currently don't have any,
+             * reset transform style to none.
+             */
+            style.transform = "none";
+        }
+    }
+    /**
+     * Build a transformOrigin style. Uses the same defaults as the browser for
+     * undefined origins.
+     */
+    if (hasTransformOrigin) {
+        const { originX = "50%", originY = "50%", originZ = 0, } = transformOrigin;
+        style.transformOrigin = `${originX} ${originY} ${originZ}`;
+    }
+}
+
+export { buildHTMLStyles };
+//# sourceMappingURL=build-styles.mjs.map

node_modules/motion-dom/dist/es/render/html/utils/build-styles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"build-styles.mjs","sources":["../../../../../src/render/html/utils/build-styles.ts"],"sourcesContent":["import { getValueAsType } from \"../../../value/types/utils/get-as-type\"\nimport { numberValueTypes } from \"../../../value/types/maps/number\"\nimport { transformProps } from \"../../utils/keys-transform\"\nimport { isCSSVariableName } from \"../../../animation/utils/is-css-variable\"\nimport { ResolvedValues } from \"../../types\"\nimport { HTMLRenderState } from \"../types\"\nimport { buildTransform } from \"./build-transform\"\nimport type { MotionNodeOptions } from \"../../../node/types\"\n\nexport function buildHTMLStyles(\n    state: HTMLRenderState,\n    latestValues: ResolvedValues,\n    transformTemplate?: MotionNodeOptions[\"transformTemplate\"]\n) {\n    const { style, vars, transformOrigin } = state\n\n    // Track whether we encounter any transform or transformOrigin values.\n    let hasTransform = false\n    let hasTransformOrigin = false\n\n    /**\n     * Loop over all our latest animated values and decide whether to handle them\n     * as a style or CSS variable.\n     *\n     * Transforms and transform origins are kept separately for further processing.\n     */\n    for (const key in latestValues) {\n        const value = latestValues[key]\n\n        if (transformProps.has(key)) {\n            // If this is a transform, flag to enable further transform processing\n            hasTransform = true\n            continue\n        } else if (isCSSVariableName(key)) {\n            vars[key] = value\n            continue\n        } else {\n            // Convert the value to its default value type, ie 0 -> \"0px\"\n            const valueAsType = getValueAsType(value, numberValueTypes[key])\n\n            if (key.startsWith(\"origin\")) {\n                // If this is a transform origin, flag and enable further transform-origin processing\n                hasTransformOrigin = true\n                transformOrigin[key as keyof typeof transformOrigin] =\n                    valueAsType\n            } else {\n                style[key] = valueAsType\n            }\n        }\n    }\n\n    if (!latestValues.transform) {\n        if (hasTransform || transformTemplate) {\n            style.transform = buildTransform(\n                latestValues,\n                state.transform,\n                transformTemplate\n            )\n        } else if (style.transform) {\n            /**\n             * If we have previously created a transform but currently don't have any,\n             * reset transform style to none.\n             */\n            style.transform = \"none\"\n        }\n    }\n\n    /**\n     * Build a transformOrigin style. Uses the same defaults as the browser for\n     * undefined origins.\n     */\n    if (hasTransformOrigin) {\n        const {\n            originX = \"50%\",\n            originY = \"50%\",\n            originZ = 0,\n        } = transformOrigin\n        style.transformOrigin = `${originX} ${originY} ${originZ}`\n    }\n}\n"],"names":[],"mappings":";;;;;;SASgB,eAAe,CAC3B,KAAsB,EACtB,YAA4B,EAC5B,iBAA0D,EAAA;IAE1D,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,eAAe,EAAE,GAAG,KAAK;;IAG9C,IAAI,YAAY,GAAG,KAAK;IACxB,IAAI,kBAAkB,GAAG,KAAK;AAE9B;;;;;AAKG;AACH,IAAA,KAAK,MAAM,GAAG,IAAI,YAAY,EAAE;AAC5B,QAAA,MAAM,KAAK,GAAG,YAAY,CAAC,GAAG,CAAC;AAE/B,QAAA,IAAI,cAAc,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;;YAEzB,YAAY,GAAG,IAAI;YACnB;QACJ;AAAO,aAAA,IAAI,iBAAiB,CAAC,GAAG,CAAC,EAAE;AAC/B,YAAA,IAAI,CAAC,GAAG,CAAC,GAAG,KAAK;YACjB;QACJ;aAAO;;YAEH,MAAM,WAAW,GAAG,cAAc,CAAC,KAAK,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC;AAEhE,YAAA,IAAI,GAAG,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE;;gBAE1B,kBAAkB,GAAG,IAAI;gBACzB,eAAe,CAAC,GAAmC,CAAC;AAChD,oBAAA,WAAW;YACnB;iBAAO;AACH,gBAAA,KAAK,CAAC,GAAG,CAAC,GAAG,WAAW;YAC5B;QACJ;IACJ;AAEA,IAAA,IAAI,CAAC,YAAY,CAAC,SAAS,EAAE;AACzB,QAAA,IAAI,YAAY,IAAI,iBAAiB,EAAE;AACnC,YAAA,KAAK,CAAC,SAAS,GAAG,cAAc,CAC5B,YAAY,EACZ,KAAK,CAAC,SAAS,EACf,iBAAiB,CACpB;QACL;AAAO,aAAA,IAAI,KAAK,CAAC,SAAS,EAAE;AACxB;;;AAGG;AACH,YAAA,KAAK,CAAC,SAAS,GAAG,MAAM;QAC5B;IACJ;AAEA;;;AAGG;IACH,IAAI,kBAAkB,EAAE;AACpB,QAAA,MAAM,EACF,OAAO,GAAG,KAAK,EACf,OAAO,GAAG,KAAK,EACf,OAAO,GAAG,CAAC,GACd,GAAG,eAAe;QACnB,KAAK,CAAC,eAAe,GAAG,CAAA,EAAG,OAAO,IAAI,OAAO,CAAA,CAAA,EAAI,OAAO,CAAA,CAAE;IAC9D;AACJ;;;;"}

node_modules/motion-dom/dist/es/render/html/utils/build-transform.mjs

@@ -0,0 +1,64 @@
+import { getValueAsType } from '../../../value/types/utils/get-as-type.mjs';
+import { numberValueTypes } from '../../../value/types/maps/number.mjs';
+import { transformPropOrder } from '../../utils/keys-transform.mjs';
+
+const translateAlias = {
+    x: "translateX",
+    y: "translateY",
+    z: "translateZ",
+    transformPerspective: "perspective",
+};
+const numTransforms = transformPropOrder.length;
+/**
+ * Build a CSS transform style from individual x/y/scale etc properties.
+ *
+ * This outputs with a default order of transforms/scales/rotations, this can be customised by
+ * providing a transformTemplate function.
+ */
+function buildTransform(latestValues, transform, transformTemplate) {
+    // The transform string we're going to build into.
+    let transformString = "";
+    let transformIsDefault = true;
+    /**
+     * Loop over all possible transforms in order, adding the ones that
+     * are present to the transform string.
+     */
+    for (let i = 0; i < numTransforms; i++) {
+        const key = transformPropOrder[i];
+        const value = latestValues[key];
+        if (value === undefined)
+            continue;
+        let valueIsDefault = true;
+        if (typeof value === "number") {
+            valueIsDefault = value === (key.startsWith("scale") ? 1 : 0);
+        }
+        else {
+            const parsed = parseFloat(value);
+            valueIsDefault = key.startsWith("scale") ? parsed === 1 : parsed === 0;
+        }
+        if (!valueIsDefault || transformTemplate) {
+            const valueAsType = getValueAsType(value, numberValueTypes[key]);
+            if (!valueIsDefault) {
+                transformIsDefault = false;
+                const transformName = translateAlias[key] || key;
+                transformString += `${transformName}(${valueAsType}) `;
+            }
+            if (transformTemplate) {
+                transform[key] = valueAsType;
+            }
+        }
+    }
+    transformString = transformString.trim();
+    // If we have a custom `transform` template, pass our transform values and
+    // generated transformString to that before returning
+    if (transformTemplate) {
+        transformString = transformTemplate(transform, transformIsDefault ? "" : transformString);
+    }
+    else if (transformIsDefault) {
+        transformString = "none";
+    }
+    return transformString;
+}
+
+export { buildTransform };
+//# sourceMappingURL=build-transform.mjs.map

node_modules/motion-dom/dist/es/render/html/utils/build-transform.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"build-transform.mjs","sources":["../../../../../src/render/html/utils/build-transform.ts"],"sourcesContent":["import { getValueAsType } from \"../../../value/types/utils/get-as-type\"\nimport { numberValueTypes } from \"../../../value/types/maps/number\"\nimport { transformPropOrder } from \"../../utils/keys-transform\"\nimport { ResolvedValues } from \"../../types\"\nimport { HTMLRenderState } from \"../types\"\nimport type { MotionNodeOptions } from \"../../../node/types\"\n\nconst translateAlias = {\n    x: \"translateX\",\n    y: \"translateY\",\n    z: \"translateZ\",\n    transformPerspective: \"perspective\",\n}\n\nconst numTransforms = transformPropOrder.length\n\n/**\n * Build a CSS transform style from individual x/y/scale etc properties.\n *\n * This outputs with a default order of transforms/scales/rotations, this can be customised by\n * providing a transformTemplate function.\n */\nexport function buildTransform(\n    latestValues: ResolvedValues,\n    transform: HTMLRenderState[\"transform\"],\n    transformTemplate?: MotionNodeOptions[\"transformTemplate\"]\n) {\n    // The transform string we're going to build into.\n    let transformString = \"\"\n    let transformIsDefault = true\n\n    /**\n     * Loop over all possible transforms in order, adding the ones that\n     * are present to the transform string.\n     */\n    for (let i = 0; i < numTransforms; i++) {\n        const key = transformPropOrder[i] as keyof typeof translateAlias\n        const value = latestValues[key]\n\n        if (value === undefined) continue\n\n        let valueIsDefault = true\n        if (typeof value === \"number\") {\n            valueIsDefault = value === (key.startsWith(\"scale\") ? 1 : 0)\n        } else {\n            const parsed = parseFloat(value)\n            valueIsDefault = key.startsWith(\"scale\") ? parsed === 1 : parsed === 0\n        }\n\n        if (!valueIsDefault || transformTemplate) {\n            const valueAsType = getValueAsType(value, numberValueTypes[key])\n\n            if (!valueIsDefault) {\n                transformIsDefault = false\n                const transformName = translateAlias[key] || key\n                transformString += `${transformName}(${valueAsType}) `\n            }\n\n            if (transformTemplate) {\n                transform[key] = valueAsType\n            }\n        }\n    }\n\n    transformString = transformString.trim()\n\n    // If we have a custom `transform` template, pass our transform values and\n    // generated transformString to that before returning\n    if (transformTemplate) {\n        transformString = transformTemplate(\n            transform,\n            transformIsDefault ? \"\" : transformString\n        )\n    } else if (transformIsDefault) {\n        transformString = \"none\"\n    }\n\n    return transformString\n}\n"],"names":[],"mappings":";;;;AAOA,MAAM,cAAc,GAAG;AACnB,IAAA,CAAC,EAAE,YAAY;AACf,IAAA,CAAC,EAAE,YAAY;AACf,IAAA,CAAC,EAAE,YAAY;AACf,IAAA,oBAAoB,EAAE,aAAa;CACtC;AAED,MAAM,aAAa,GAAG,kBAAkB,CAAC,MAAM;AAE/C;;;;;AAKG;SACa,cAAc,CAC1B,YAA4B,EAC5B,SAAuC,EACvC,iBAA0D,EAAA;;IAG1D,IAAI,eAAe,GAAG,EAAE;IACxB,IAAI,kBAAkB,GAAG,IAAI;AAE7B;;;AAGG;AACH,IAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,aAAa,EAAE,CAAC,EAAE,EAAE;AACpC,QAAA,MAAM,GAAG,GAAG,kBAAkB,CAAC,CAAC,CAAgC;AAChE,QAAA,MAAM,KAAK,GAAG,YAAY,CAAC,GAAG,CAAC;QAE/B,IAAI,KAAK,KAAK,SAAS;YAAE;QAEzB,IAAI,cAAc,GAAG,IAAI;AACzB,QAAA,IAAI,OAAO,KAAK,KAAK,QAAQ,EAAE;AAC3B,YAAA,cAAc,GAAG,KAAK,MAAM,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;QAChE;aAAO;AACH,YAAA,MAAM,MAAM,GAAG,UAAU,CAAC,KAAK,CAAC;AAChC,YAAA,cAAc,GAAG,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,GAAG,MAAM,KAAK,CAAC,GAAG,MAAM,KAAK,CAAC;QAC1E;AAEA,QAAA,IAAI,CAAC,cAAc,IAAI,iBAAiB,EAAE;YACtC,MAAM,WAAW,GAAG,cAAc,CAAC,KAAK,EAAE,gBAAgB,CAAC,GAAG,CAAC,CAAC;YAEhE,IAAI,CAAC,cAAc,EAAE;gBACjB,kBAAkB,GAAG,KAAK;gBAC1B,MAAM,aAAa,GAAG,cAAc,CAAC,GAAG,CAAC,IAAI,GAAG;AAChD,gBAAA,eAAe,IAAI,CAAA,EAAG,aAAa,CAAA,CAAA,EAAI,WAAW,IAAI;YAC1D;YAEA,IAAI,iBAAiB,EAAE;AACnB,gBAAA,SAAS,CAAC,GAAG,CAAC,GAAG,WAAW;YAChC;QACJ;IACJ;AAEA,IAAA,eAAe,GAAG,eAAe,CAAC,IAAI,EAAE;;;IAIxC,IAAI,iBAAiB,EAAE;AACnB,QAAA,eAAe,GAAG,iBAAiB,CAC/B,SAAS,EACT,kBAAkB,GAAG,EAAE,GAAG,eAAe,CAC5C;IACL;SAAO,IAAI,kBAAkB,EAAE;QAC3B,eAAe,GAAG,MAAM;IAC5B;AAEA,IAAA,OAAO,eAAe;AAC1B;;;;"}

node_modules/motion-dom/dist/es/render/html/utils/render.mjs

@@ -0,0 +1,18 @@
+function renderHTML(element, { style, vars }, styleProp, projection) {
+    const elementStyle = element.style;
+    let key;
+    for (key in style) {
+        // CSSStyleDeclaration has [index: number]: string; in the types, so we use that as key type.
+        elementStyle[key] = style[key];
+    }
+    // Write projection styles directly to element style
+    projection?.applyProjectionStyles(elementStyle, styleProp);
+    for (key in vars) {
+        // Loop over any CSS variables and assign those.
+        // They can only be assigned using `setProperty`.
+        elementStyle.setProperty(key, vars[key]);
+    }
+}
+
+export { renderHTML };
+//# sourceMappingURL=render.mjs.map

node_modules/motion-dom/dist/es/render/html/utils/render.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.mjs","sources":["../../../../../src/render/html/utils/render.ts"],"sourcesContent":["import type { MotionStyle } from \"../../VisualElement\"\nimport { HTMLRenderState } from \"../types\"\n\nexport function renderHTML(\n    element: HTMLElement,\n    { style, vars }: HTMLRenderState,\n    styleProp?: MotionStyle,\n    projection?: any\n) {\n    const elementStyle = element.style\n\n    let key: string\n    for (key in style) {\n        // CSSStyleDeclaration has [index: number]: string; in the types, so we use that as key type.\n        elementStyle[key as unknown as number] = style[key] as string\n    }\n\n    // Write projection styles directly to element style\n    projection?.applyProjectionStyles(elementStyle, styleProp)\n\n    for (key in vars) {\n        // Loop over any CSS variables and assign those.\n        // They can only be assigned using `setProperty`.\n        elementStyle.setProperty(key, vars[key] as string)\n    }\n}\n"],"names":[],"mappings":"AAGM,SAAU,UAAU,CACtB,OAAoB,EACpB,EAAE,KAAK,EAAE,IAAI,EAAmB,EAChC,SAAuB,EACvB,UAAgB,EAAA;AAEhB,IAAA,MAAM,YAAY,GAAG,OAAO,CAAC,KAAK;AAElC,IAAA,IAAI,GAAW;AACf,IAAA,KAAK,GAAG,IAAI,KAAK,EAAE;;QAEf,YAAY,CAAC,GAAwB,CAAC,GAAG,KAAK,CAAC,GAAG,CAAW;IACjE;;AAGA,IAAA,UAAU,EAAE,qBAAqB,CAAC,YAAY,EAAE,SAAS,CAAC;AAE1D,IAAA,KAAK,GAAG,IAAI,IAAI,EAAE;;;QAGd,YAAY,CAAC,WAAW,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAW,CAAC;IACtD;AACJ;;;;"}

node_modules/motion-dom/dist/es/render/html/utils/scrape-motion-values.mjs

@@ -0,0 +1,22 @@
+import { isMotionValue } from '../../../value/utils/is-motion-value.mjs';
+import { isForcedMotionValue } from '../../utils/is-forced-motion-value.mjs';
+
+function scrapeMotionValuesFromProps(props, prevProps, visualElement) {
+    const style = props.style;
+    const prevStyle = prevProps?.style;
+    const newValues = {};
+    if (!style)
+        return newValues;
+    for (const key in style) {
+        if (isMotionValue(style[key]) ||
+            (prevStyle && isMotionValue(prevStyle[key])) ||
+            isForcedMotionValue(key, props) ||
+            visualElement?.getValue(key)?.liveStyle !== undefined) {
+            newValues[key] = style[key];
+        }
+    }
+    return newValues;
+}
+
+export { scrapeMotionValuesFromProps };
+//# sourceMappingURL=scrape-motion-values.mjs.map

node_modules/motion-dom/dist/es/render/html/utils/scrape-motion-values.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"scrape-motion-values.mjs","sources":["../../../../../src/render/html/utils/scrape-motion-values.ts"],"sourcesContent":["import { isMotionValue } from \"../../../value/utils/is-motion-value\"\nimport type { MotionNodeOptions } from \"../../../node/types\"\nimport { isForcedMotionValue } from \"../../utils/is-forced-motion-value\"\nimport type { VisualElement } from \"../../VisualElement\"\n\nexport function scrapeMotionValuesFromProps(\n    props: MotionNodeOptions,\n    prevProps: MotionNodeOptions,\n    visualElement?: VisualElement\n) {\n    const style = (props as any).style\n    const prevStyle = (prevProps as any)?.style\n    const newValues: { [key: string]: any } = {}\n\n    if (!style) return newValues\n\n    for (const key in style) {\n        if (\n            isMotionValue(style[key]) ||\n            (prevStyle && isMotionValue(prevStyle[key])) ||\n            isForcedMotionValue(key, props) ||\n            visualElement?.getValue(key)?.liveStyle !== undefined\n        ) {\n            newValues[key] = style[key]\n        }\n    }\n\n    return newValues\n}\n"],"names":[],"mappings":";;;SAKgB,2BAA2B,CACvC,KAAwB,EACxB,SAA4B,EAC5B,aAA6B,EAAA;AAE7B,IAAA,MAAM,KAAK,GAAI,KAAa,CAAC,KAAK;AAClC,IAAA,MAAM,SAAS,GAAI,SAAiB,EAAE,KAAK;IAC3C,MAAM,SAAS,GAA2B,EAAE;AAE5C,IAAA,IAAI,CAAC,KAAK;AAAE,QAAA,OAAO,SAAS;AAE5B,IAAA,KAAK,MAAM,GAAG,IAAI,KAAK,EAAE;AACrB,QAAA,IACI,aAAa,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;aACxB,SAAS,IAAI,aAAa,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,CAAC;AAC5C,YAAA,mBAAmB,CAAC,GAAG,EAAE,KAAK,CAAC;YAC/B,aAAa,EAAE,QAAQ,CAAC,GAAG,CAAC,EAAE,SAAS,KAAK,SAAS,EACvD;YACE,SAAS,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC;QAC/B;IACJ;AAEA,IAAA,OAAO,SAAS;AACpB;;;;"}