motion-start 0.0.1 → 0.1.0

package/dist/render/html/visual-element.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"visual-element.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/render/html/visual-element.ts"],"names":[],"mappings":"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"}

package/{src/render/html/visual-element.ts → dist/render/html/visual-element.js}

@@ -1,129 +1,111 @@
-/** 
-based on framer-motion@4.1.17,
-Copyright (c) 2018 Framer B.V.
-*/
-import type { DOMVisualElementOptions } from "../dom/types";
-import type { VisualElementConfig } from "../types";
-import type { HTMLRenderState } from "./types";
-
-
-/** 
-based on framer-motion@4.1.15,
-Copyright (c) 2018 Framer B.V.
-*/
-import { __assign, __rest } from 'tslib';
-import { getBoundingBox } from '../dom/projection/measure.js';
-import { isCSSVariable } from '../dom/utils/is-css-variable.js';
-import { parseDomVariant } from '../dom/utils/parse-dom-variant.js';
-import { getDefaultValueType } from '../dom/value-types/defaults.js';
-import { visualElement } from '../index.js';
-import { checkTargetForNewValues, getOrigin } from '../utils/setters.js';
-import { buildLayoutProjectionTransform, buildLayoutProjectionTransformOrigin } from './utils/build-projection-transform.js';
-import { buildHTMLStyles } from './utils/build-styles.js';
-import { renderHTML } from './utils/render.js';
-import { scrapeMotionValuesFromProps } from './utils/scrape-motion-values.js';
-import { isTransformProp } from './utils/transform.js';
-
-function getComputedStyle(element: HTMLElement) {
-    return window.getComputedStyle(element);
-}
-var htmlConfig = {
-    treeType: "dom",
-    readValueFromInstance: function (domElement, key) {
-        if (isTransformProp(key)) {
-            var defaultType = getDefaultValueType(key);
-            return defaultType ? defaultType.default || 0 : 0;
-        }
-        else {
-            var computedStyle = getComputedStyle(domElement);
-            return ((isCSSVariable(key)
-                ? computedStyle.getPropertyValue(key)
-                : computedStyle[key]) || 0);
-        }
-    },
-    sortNodePosition: function (a, b) {
-        /**
-         * compareDocumentPosition returns a bitmask, by using the bitwise &
-         * we're returning true if 2 in that bitmask is set to true. 2 is set
-         * to true if b preceeds a.
-         */
-        return a.compareDocumentPosition(b) & 2 ? 1 : -1;
-    },
-    getBaseTarget: function (props, key) {
-        var _a;
-        return (_a = props.style) === null || _a === void 0 ? void 0 : _a[key];
-    },
-    measureViewportBox: function (element, _a) {
-        var transformPagePoint = _a.transformPagePoint;
-        return getBoundingBox(element, transformPagePoint);
-    },
-    /**
-     * Reset the transform on the current Element. This is called as part
-     * of a batched process across the entire layout tree. To remove this write
-     * cycle it'd be interesting to see if it's possible to "undo" all the current
-     * layout transforms up the tree in the same way this.getBoundingBoxWithoutTransforms
-     * works
-     */
-    resetTransform: function (element, domElement, props) {
-        var transformTemplate = props.transformTemplate;
-        domElement.style.transform = transformTemplate
-            ? transformTemplate({}, "")
-            : "none";
-        // Ensure that whatever happens next, we restore our transform on the next frame
-        element.scheduleRender();
-    },
-    restoreTransform: function (instance, mutableState) {
-        instance.style.transform = mutableState.style.transform;
-    },
-    removeValueFromRenderState: function (key, _a) {
-        var vars = _a.vars, style = _a.style;
-        delete vars[key];
-        delete style[key];
-    },
-    /**
-     * Ensure that HTML and Framer-specific value types like `px`->`%` and `Color`
-     * can be animated by Motion.
-     */
-    makeTargetAnimatable: function (element, _a, _b, isMounted) {
-        var transformValues = _b.transformValues;
-        if (isMounted === void 0) { isMounted = true; }
-        var transition = _a.transition, transitionEnd = _a.transitionEnd, target = __rest(_a, ["transition", "transitionEnd"]);
-        var origin = getOrigin(target, transition || {}, element);
-        /**
-         * If Framer has provided a function to convert `Color` etc value types, convert them
-         */
-        if (transformValues) {
-            if (transitionEnd)
-                transitionEnd = transformValues(transitionEnd);
-            if (target)
-                target = transformValues(target);
-            if (origin)
-                origin = transformValues(origin);
-        }
-        if (isMounted) {
-            checkTargetForNewValues(element, target, origin);
-            var parsed = parseDomVariant(element, target, origin, transitionEnd);
-            transitionEnd = parsed.transitionEnd;
-            target = parsed.target;
-        }
-        return __assign({ transition: transition,
-            transitionEnd: transitionEnd }, target);
-    },
-    scrapeMotionValuesFromProps: scrapeMotionValuesFromProps,
-    build: function (element, renderState, latestValues, projection, layoutState, options, props) {
-        if (element.isVisible !== undefined) {
-            renderState.style.visibility = element.isVisible
-                ? "visible"
-                : "hidden";
-        }
-        var isProjectionTranform = projection.isEnabled && layoutState.isHydrated;
-        buildHTMLStyles(renderState, latestValues, projection, layoutState, options, props.transformTemplate, isProjectionTranform ? buildLayoutProjectionTransform : undefined, isProjectionTranform
-            ? buildLayoutProjectionTransformOrigin
-            : undefined);
-    },
-    render: renderHTML,
-} as VisualElementConfig<HTMLElement, HTMLRenderState, DOMVisualElementOptions>;
-var htmlVisualElement = visualElement<HTMLElement>(htmlConfig);
-
-export { getComputedStyle, htmlConfig, htmlVisualElement };
-
+/**
+based on framer-motion@4.1.15,
+Copyright (c) 2018 Framer B.V.
+*/
+import { getBoundingBox } from '../dom/projection/measure.js';
+import { isCSSVariable } from '../dom/utils/is-css-variable.js';
+import { parseDomVariant } from '../dom/utils/parse-dom-variant.js';
+import { getDefaultValueType } from '../dom/value-types/defaults.js';
+import { visualElement } from '../index.js';
+import { checkTargetForNewValues, getOrigin } from '../utils/setters.js';
+import { buildLayoutProjectionTransform, buildLayoutProjectionTransformOrigin, } from './utils/build-projection-transform.js';
+import { buildHTMLStyles } from './utils/build-styles.js';
+import { renderHTML } from './utils/render.js';
+import { scrapeMotionValuesFromProps } from './utils/scrape-motion-values.js';
+import { isTransformProp } from './utils/transform.js';
+function getComputedStyle(element) {
+    return window.getComputedStyle(element);
+}
+var htmlConfig = {
+    treeType: 'dom',
+    readValueFromInstance: (domElement, key) => {
+        if (isTransformProp(key)) {
+            var defaultType = getDefaultValueType(key);
+            return defaultType ? defaultType.default || 0 : 0;
+        }
+        else {
+            var computedStyle = getComputedStyle(domElement);
+            // @ts-expect-error
+            return (isCSSVariable(key) ? computedStyle.getPropertyValue(key) : computedStyle[key]) || 0;
+        }
+    },
+    sortNodePosition: (a, b) => {
+        /**
+         * compareDocumentPosition returns a bitmask, by using the bitwise &
+         * we're returning true if 2 in that bitmask is set to true. 2 is set
+         * to true if b preceeds a.
+         */
+        return a.compareDocumentPosition(b) & 2 ? 1 : -1;
+    },
+    getBaseTarget: (props, key) => {
+        var _a; // @ts-expect-error
+        return (_a = props.style) === null || _a === void 0 ? void 0 : _a[key];
+    },
+    measureViewportBox: (element, _a) => {
+        var transformPagePoint = _a.transformPagePoint;
+        return getBoundingBox(element, transformPagePoint);
+    },
+    /**
+     * Reset the transform on the current Element. This is called as part
+     * of a batched process across the entire layout tree. To remove this write
+     * cycle it'd be interesting to see if it's possible to "undo" all the current
+     * layout transforms up the tree in the same way this.getBoundingBoxWithoutTransforms
+     * works
+     */
+    resetTransform: (element, domElement, props) => {
+        var transformTemplate = props.transformTemplate;
+        domElement.style.transform = transformTemplate ? transformTemplate({}, '') : 'none';
+        // Ensure that whatever happens next, we restore our transform on the next frame
+        element.scheduleRender();
+    },
+    restoreTransform: (instance, mutableState) => {
+        // @ts-expect-error
+        instance.style.transform = mutableState.style.transform;
+    },
+    removeValueFromRenderState: (key, _a) => {
+        var vars = _a.vars, style = _a.style;
+        delete vars[key];
+        delete style[key];
+    },
+    /**
+     * Ensure that HTML and Framer-specific value types like `px`->`%` and `Color`
+     * can be animated by Motion.
+     */
+    makeTargetAnimatable: (element, _a, _b, isMounted) => {
+        var transformValues = _b.transformValues;
+        if (isMounted === void 0) {
+            isMounted = true;
+        }
+        var { transition, transitionEnd, ...target } = _a; // @ts-expect-error
+        var origin = getOrigin(target, transition || {}, element);
+        /**
+         * If Framer has provided a function to convert `Color` etc value types, convert them
+         */
+        if (transformValues) {
+            if (transitionEnd)
+                transitionEnd = transformValues(transitionEnd);
+            if (target)
+                target = transformValues(target);
+            if (origin)
+                origin = transformValues(origin);
+        }
+        if (isMounted) {
+            checkTargetForNewValues(element, target, origin); // @ts-expect-error
+            var parsed = parseDomVariant(element, target, origin, transitionEnd);
+            transitionEnd = parsed.transitionEnd;
+            target = parsed.target;
+        }
+        return Object.assign({ transition: transition, transitionEnd: transitionEnd }, target);
+    },
+    scrapeMotionValuesFromProps: scrapeMotionValuesFromProps,
+    build: (element, renderState, latestValues, projection, layoutState, options, props) => {
+        if (element.isVisible !== undefined) {
+            renderState.style.visibility = element.isVisible ? 'visible' : 'hidden';
+        }
+        var isProjectionTranform = projection.isEnabled && layoutState.isHydrated;
+        buildHTMLStyles(renderState, latestValues, projection, layoutState, options, props.transformTemplate, isProjectionTranform ? buildLayoutProjectionTransform : undefined, isProjectionTranform ? buildLayoutProjectionTransformOrigin : undefined);
+    },
+    render: renderHTML,
+};
+var htmlVisualElement = visualElement(htmlConfig);
+export { getComputedStyle, htmlConfig, htmlVisualElement };

package/dist/render/index.d.ts

@@ -0,0 +1,8 @@
+/**
+based on framer-motion@4.1.17,
+Copyright (c) 2018 Framer B.V.
+*/
+import type { VisualElement, VisualElementConfig, VisualElementOptions } from './types';
+declare var visualElement: <Instance = any, MutableState = any, Options extends {} = {}>({ treeType, build, getBaseTarget, makeTargetAnimatable, measureViewportBox, render: renderInstance, readValueFromInstance, resetTransform, restoreTransform, removeValueFromRenderState, sortNodePosition, scrapeMotionValuesFromProps, }: VisualElementConfig<Instance, MutableState, Options>) => ({ parent, props, presenceId, blockInitialAnimation, visualState }: VisualElementOptions<Instance, any>, options?: Options) => VisualElement<Instance, any>;
+export { visualElement };
+//# sourceMappingURL=index.d.ts.map

package/dist/render/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/lib/motion-start/render/index.ts"],"names":[],"mappings":"AAAA;;;EAGE;AACF,OAAO,KAAK,EAAkB,aAAa,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAC;AA8BxG,QAAA,IAAI,aAAa,GAAa,QAAQ,QAAQ,YAAY,QAAQ,OAAO,SAAS,EAAE,kPAajF,mBAAmB,CAAC,QAAQ,EAAE,YAAY,EAAE,OAAO,CAAC,yEAEc,oBAAoB,CAAC,QAAQ,EAAE,GAAG,CAAC,YAC5F,OAAO,iCAqvBlB,CAAC;AAUF,OAAO,EAAE,aAAa,EAAE,CAAC"}