motion-start 0.0.1 → 0.1.0

package/dist/render/html/UseStyle.svelte

@@ -0,0 +1,32 @@
+<!-- based on framer-motion@4.0.3,
+Copyright (c) 2018 Framer B.V. -->
+
+<script lang="ts" context="module">
+  import { copyRawValuesOnly } from "./use-props.js";
+</script>
+
+<script lang="ts">
+  import UseInitialMotionValues from "./UseInitialMotionValues.svelte";
+
+  export let visualState, props, isStatic;
+  $: styleProp = props.style || {};
+  let style = {};
+  /**
+   * Copy non-Motion Values straight into style
+   */
+  const cRVO = copyRawValuesOnly;
+  $: cRVO(style, styleProp, props);
+
+  const toStyle = (s1: { s1: {}; props: any; style: {} }) => {
+    Object.assign(style, s1);
+    if (props.transformValues) {
+      style = props.transformValues(style);
+    }
+
+    return style;
+  };
+</script>
+
+<UseInitialMotionValues {props} {visualState} {isStatic} let:styles={s1}>
+  <slot styles={toStyle({ s1, props, style })} />
+</UseInitialMotionValues>

package/dist/render/html/UseStyle.svelte.d.ts

@@ -0,0 +1,36 @@
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+type $$__sveltets_2_PropsWithChildren<Props, Slots> = Props & (Slots extends {
+    default: any;
+} ? Props extends Record<string, never> ? any : {
+    children?: any;
+} : {});
+declare const UseStyle: $$__sveltets_2_IsomorphicComponent<$$__sveltets_2_PropsWithChildren<{
+    visualState: any;
+    props: any;
+    isStatic: any;
+}, {
+    default: {
+        styles: {};
+    };
+}>, {
+    [evt: string]: CustomEvent<any>;
+}, {
+    default: {
+        styles: {};
+    };
+}, {}, string>;
+type UseStyle = InstanceType<typeof UseStyle>;
+export default UseStyle;
+//# sourceMappingURL=UseStyle.svelte.d.ts.map

package/dist/render/html/UseStyle.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UseStyle.svelte.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/render/html/UseStyle.svelte.ts"],"names":[],"mappings":"AAwCA,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AACD,KAAK,gCAAgC,CAAC,KAAK,EAAE,KAAK,IAAI,KAAK,GACvD,CAAC,KAAK,SAAS;IAAE,OAAO,EAAE,GAAG,CAAA;CAAE,GACzB,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,GACnC,GAAG,GACH;IAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;CAAE,GAClB,EAAE,CAAC,CAAC;AAId,QAAA,MAAM,QAAQ;;;;;;;;;;;;;;cAAmF,CAAC;AAChF,KAAK,QAAQ,GAAG,YAAY,CAAC,OAAO,QAAQ,CAAC,CAAC;AAChD,eAAe,QAAQ,CAAC"}

package/dist/render/html/config-motion.d.ts

@@ -0,0 +1,13 @@
+import { scrapeMotionValuesFromProps } from './utils/scrape-motion-values.js';
+declare var htmlMotionConfig: {
+    scrapeMotionValuesFromProps: typeof scrapeMotionValuesFromProps;
+    createRenderState: () => {
+        style: {};
+        transform: {};
+        transformKeys: never[];
+        transformOrigin: {};
+        vars: {};
+    };
+};
+export { htmlMotionConfig };
+//# sourceMappingURL=config-motion.d.ts.map

package/dist/render/html/config-motion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"config-motion.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/render/html/config-motion.ts"],"names":[],"mappings":"AAcA,OAAO,EAAE,2BAA2B,EAAE,MAAM,iCAAiC,CAAC;AAE9E,QAAA,IAAI,gBAAgB;;;;;;;;;CAIoD,CAAC;AAEzE,OAAO,EAAE,gBAAgB,EAAE,CAAC"}

package/dist/render/html/config-motion.js

@@ -0,0 +1,13 @@
+// export declare const htmlMotionConfig: ;
+/**
+based on framer-motion@4.0.3,
+Copyright (c) 2018 Framer B.V.
+*/
+import { createHtmlRenderState } from './utils/create-render-state.js';
+import { scrapeMotionValuesFromProps } from './utils/scrape-motion-values.js';
+var htmlMotionConfig = {
+    //@ts-ignore
+    scrapeMotionValuesFromProps: scrapeMotionValuesFromProps,
+    createRenderState: createHtmlRenderState,
+};
+export { htmlMotionConfig };

package/dist/render/html/supported-elements.d.ts

@@ -0,0 +1,12 @@
+/**
+based on framer-motion@4.1.17,
+Copyright (c) 2018 Framer B.V.
+*/
+type UnionStringArray<T extends Readonly<string[]>> = T[number];
+/**
+ * @internal
+ */
+export declare const htmlElements: readonly ["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", "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", "webview"];
+export type HTMLElements = UnionStringArray<typeof htmlElements>;
+export {};
+//# sourceMappingURL=supported-elements.d.ts.map

package/dist/render/html/supported-elements.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"supported-elements.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/render/html/supported-elements.ts"],"names":[],"mappings":"AAAA;;;EAGE;AACF,KAAK,gBAAgB,CAAC,CAAC,SAAS,QAAQ,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC;AAChE;;GAEG;AACH,eAAO,MAAM,YAAY,m8BAAo8B,CAAC;AAC99B,MAAM,MAAM,YAAY,GAAG,gBAAgB,CAAC,OAAO,YAAY,CAAC,CAAC"}

package/{src/render/html/supported-elements.ts → dist/render/html/supported-elements.js}

@@ -1,10 +1,4 @@
-/** 
-based on framer-motion@4.1.17,
-Copyright (c) 2018 Framer B.V.
-*/
-type UnionStringArray<T extends Readonly<string[]>> = T[number];
-/**
- * @internal
- */
-export const htmlElements = ["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", "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", "webview"] as const;
-export type HTMLElements = UnionStringArray<typeof htmlElements>;
+/**
+ * @internal
+ */
+export const htmlElements = ["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", "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", "webview"];

package/{src/render/html/types.ts → dist/render/html/types.d.ts}

@@ -1,64 +1,54 @@
-/** 
-based on framer-motion@4.1.17,
-Copyright (c) 2018 Framer B.V.
-*/
-import type { DetailedHTMLFactory, ForwardRefExoticComponent, HTMLAttributes, PropsWithoutRef, ReactHTML, RefAttributes } from "react";
-import type { MotionProps } from "../../motion/types";
-import type { ResolvedValues } from "../types";
-import type { HTMLElements } from "./supported-elements";
-export interface TransformOrigin {
-    originX?: number | string;
-    originY?: number | string;
-    originZ?: number | string;
-}
-export interface HTMLRenderState {
-    /**
-     * A mutable record of transforms we want to apply directly to the rendered Element
-     * every frame. We use a mutable data structure to reduce GC during animations.
-     */
-    transform: ResolvedValues;
-    /**
-     * A mutable record of transform keys we want to apply to the rendered Element. We order
-     * this to order transforms in the desired order. We use a mutable data structure to reduce GC during animations.
-     */
-    transformKeys: string[];
-    /**
-     * A mutable record of transform origins we want to apply directly to the rendered Element
-     * every frame. We use a mutable data structure to reduce GC during animations.
-     */
-    transformOrigin: TransformOrigin;
-    /**
-     * A mutable record of styles we want to apply directly to the rendered Element
-     * every frame. We use a mutable data structure to reduce GC during animations.
-     */
-    style: ResolvedValues;
-    /**
-     * A mutable record of CSS variables we want to apply directly to the rendered Element
-     * every frame. We use a mutable data structure to reduce GC during animations.
-     */
-    vars: ResolvedValues;
-}
-/**
- * @public
- */
-export type ForwardRefComponent<T, P> = ForwardRefExoticComponent<PropsWithoutRef<P> & RefAttributes<T>>;
-/**
- * Support for React component props
- */
-type UnwrapFactoryAttributes<F> = F extends DetailedHTMLFactory<infer P, any> ? P : never;
-type UnwrapFactoryElement<F> = F extends DetailedHTMLFactory<any, infer P> ? P : never;
-type HTMLAttributesWithoutMotionProps<Attributes extends HTMLAttributes<Element>, Element extends HTMLElement> = {
-    [K in Exclude<keyof Attributes, keyof MotionProps>]?: Attributes[K];
-};
-/**
- * @public
- */
-export type HTMLMotionProps<TagName extends keyof ReactHTML> = HTMLAttributesWithoutMotionProps<UnwrapFactoryAttributes<ReactHTML[TagName]>, UnwrapFactoryElement<ReactHTML[TagName]>> & MotionProps;
-/**
- * Motion-optimised versions of React's HTML components.
- *
- * @public
- */
-export type HTMLMotionComponents = {
-    [K in HTMLElements]: ForwardRefComponent<UnwrapFactoryElement<ReactHTML[K]>, HTMLMotionProps<K>>;
-};
+/**
+based on framer-motion@4.1.17,
+Copyright (c) 2018 Framer B.V.
+*/
+import type { SvelteHTMLElements } from 'svelte/elements';
+import type { MotionProps } from '../../motion/types';
+import type { ResolvedValues } from '../types';
+import type { HTMLElements } from './supported-elements';
+import type { Component } from 'svelte';
+export interface TransformOrigin {
+    originX?: number | string;
+    originY?: number | string;
+    originZ?: number | string;
+}
+export interface HTMLRenderState {
+    /**
+     * A mutable record of transforms we want to apply directly to the rendered Element
+     * every frame. We use a mutable data structure to reduce GC during animations.
+     */
+    transform: ResolvedValues;
+    /**
+     * A mutable record of transform keys we want to apply to the rendered Element. We order
+     * this to order transforms in the desired order. We use a mutable data structure to reduce GC during animations.
+     */
+    transformKeys: string[];
+    /**
+     * A mutable record of transform origins we want to apply directly to the rendered Element
+     * every frame. We use a mutable data structure to reduce GC during animations.
+     */
+    transformOrigin: TransformOrigin;
+    /**
+     * A mutable record of styles we want to apply directly to the rendered Element
+     * every frame. We use a mutable data structure to reduce GC during animations.
+     */
+    style: ResolvedValues;
+    /**
+     * A mutable record of CSS variables we want to apply directly to the rendered Element
+     * every frame. We use a mutable data structure to reduce GC during animations.
+     */
+    vars: ResolvedValues;
+}
+/**
+ * @public
+ */
+export type ForwardRefComponent<T extends Record<string, any>, P extends Record<string, any>> = Component<T & P>;
+/**
+ * Motion-optimised versions of React's HTML components.
+ *
+ * @public
+ */
+export type HTMLMotionComponents = {
+    [K in HTMLElements]: ForwardRefComponent<MotionProps, SvelteHTMLElements[K]>;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/render/html/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/render/html/types.ts"],"names":[],"mappings":"AAAA;;;EAGE;AACF,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC/C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACzD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAExC,MAAM,WAAW,eAAe;IAC/B,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAC1B;AACD,MAAM,WAAW,eAAe;IAC/B;;;OAGG;IACH,SAAS,EAAE,cAAc,CAAC;IAC1B;;;OAGG;IACH,aAAa,EAAE,MAAM,EAAE,CAAC;IACxB;;;OAGG;IACH,eAAe,EAAE,eAAe,CAAC;IACjC;;;OAGG;IACH,KAAK,EAAE,cAAc,CAAC;IACtB;;;OAGG;IACH,IAAI,EAAE,cAAc,CAAC;CACrB;AACD;;GAEG;AACH,MAAM,MAAM,mBAAmB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,IAAI,SAAS,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;AAEjH;;;;GAIG;AACH,MAAM,MAAM,oBAAoB,GAAG;KACjC,CAAC,IAAI,YAAY,GAAG,mBAAmB,CAAC,WAAW,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAC;CAC5E,CAAC"}

package/dist/render/html/types.js

@@ -0,0 +1 @@
+export {};

package/dist/render/html/use-props.d.ts

@@ -0,0 +1,11 @@
+import type { MotionValue } from '../../value';
+import type { MotionProps } from '../../motion/types';
+import type { ResolvedValues } from '../types';
+export type useStyle = (props: MotionProps, visualState: ResolvedValues, isStatic: boolean) => ResolvedValues;
+export type useHTMLProps = (props: MotionProps, visualState: ResolvedValues, isStatic: boolean) => any;
+export { default as UseHTMLProps } from './UseHTMLProps.svelte';
+export { default as UseStyle } from './UseStyle.svelte';
+export declare function copyRawValuesOnly(target: ResolvedValues, source: {
+    [key: string]: string | number | MotionValue;
+}, props: MotionProps): void;
+//# sourceMappingURL=use-props.d.ts.map

package/dist/render/html/use-props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-props.d.ts","sourceRoot":"","sources":["../../../../../src/lib/motion-start/render/html/use-props.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAC;AACtD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE/C,MAAM,MAAM,QAAQ,GAAG,CAAC,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,EAAE,OAAO,KAAK,cAAc,CAAC;AAC9G,MAAM,MAAM,YAAY,GAAG,CAAC,KAAK,EAAE,WAAW,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,EAAE,OAAO,KAAK,GAAG,CAAC;AAEvG,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAChE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAExD,wBAAgB,iBAAiB,CAChC,MAAM,EAAE,cAAc,EACtB,MAAM,EAAE;IACP,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,WAAW,CAAC;CAC7C,EACD,KAAK,EAAE,WAAW,QAOlB"}

package/dist/render/html/use-props.js

@@ -0,0 +1,15 @@
+/**
+based on framer-motion@4.1.17,
+Copyright (c) 2018 Framer B.V.
+*/
+import { isForcedMotionValue } from '../../motion/utils/is-forced-motion-value';
+import { isMotionValue } from '../../value/utils/is-motion-value';
+export { default as UseHTMLProps } from './UseHTMLProps.svelte';
+export { default as UseStyle } from './UseStyle.svelte';
+export function copyRawValuesOnly(target, source, props) {
+    for (const key in source) {
+        if (!isMotionValue(source[key]) && !isForcedMotionValue(key, props)) {
+            target[key] = source[key];
+        }
+    }
+}

package/dist/render/html/utils/build-projection-transform.d.ts

@@ -0,0 +1,21 @@
+/**
+based on framer-motion@4.1.17,
+Copyright (c) 2018 Framer B.V.
+*/
+import type { BoxDelta, Point2D } from "../../../types/geometry";
+import type { ResolvedValues } from "../../types";
+import type { LayoutState } from "../../utils/state";
+export type BuildProjectionTransform = (box: BoxDelta, treeScale: Point2D, transform?: ResolvedValues) => string;
+export type BuildProjectionTransformOrigin = (layout: LayoutState) => string;
+/**
+ * Build a transform style that takes a calculated delta between the element's current
+ * space on screen and projects it into the desired space.
+ */
+declare function buildLayoutProjectionTransform({ x, y }: BoxDelta, treeScale: Point2D, latestTransform?: ResolvedValues): string;
+/**
+ * Take the calculated delta origin and apply it as a transform string.
+ */
+declare function buildLayoutProjectionTransformOrigin({ deltaFinal, }: LayoutState): string;
+declare var identityProjection: string;
+export { buildLayoutProjectionTransform, buildLayoutProjectionTransformOrigin, identityProjection };
+//# sourceMappingURL=build-projection-transform.d.ts.map

package/dist/render/html/utils/build-projection-transform.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"build-projection-transform.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/motion-start/render/html/utils/build-projection-transform.ts"],"names":[],"mappings":"AAAA;;;EAGE;AACF,OAAO,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AACjE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AACrD,MAAM,MAAM,wBAAwB,GAAG,CAAC,GAAG,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,CAAC,EAAE,cAAc,KAAK,MAAM,CAAC;AACjH,MAAM,MAAM,8BAA8B,GAAG,CAAC,MAAM,EAAE,WAAW,KAAK,MAAM,CAAC;AAS7E;;;GAGG;AACH,iBAAS,8BAA8B,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,CAAC,EAAE,cAAc,GAAG,MAAM,CAqBxH;AACD;;GAEG;AACH,iBAAS,oCAAoC,CAAC,EAAE,UAAU,GAAG,EAAE,WAAW,UAEzE;AACD,QAAA,IAAI,kBAAkB,QAAyF,CAAC;AAEhH,OAAO,EAAE,8BAA8B,EAAE,oCAAoC,EAAE,kBAAkB,EAAE,CAAC"}

package/{src/render/html/utils/build-projection-transform.ts → dist/render/html/utils/build-projection-transform.js}

@@ -1,53 +1,39 @@
-/** 
-based on framer-motion@4.1.17,
-Copyright (c) 2018 Framer B.V.
-*/
-import type { BoxDelta, Point2D } from "../../../types/geometry";
-import type { ResolvedValues } from "../../types";
-import type { LayoutState } from "../../utils/state";
-export type BuildProjectionTransform = (box: BoxDelta, treeScale: Point2D, transform?: ResolvedValues) => string;
-export type BuildProjectionTransformOrigin = (layout: LayoutState) => string;
-
-
-/** 
-based on framer-motion@4.0.3,
-Copyright (c) 2018 Framer B.V.
-*/
-import { zeroLayout } from '../../utils/state.js';
-
-/**
- * Build a transform style that takes a calculated delta between the element's current
- * space on screen and projects it into the desired space.
- */
-function buildLayoutProjectionTransform({ x, y }: BoxDelta, treeScale: Point2D, latestTransform?: ResolvedValues): string {
-    /**
-     * The translations we use to calculate are always relative to the viewport coordinate space.
-     * But when we apply scales, we also scale the coordinate space of an element and its children.
-     * For instance if we have a treeScale (the culmination of all parent scales) of 0.5 and we need
-     * to move an element 100 pixels, we actually need to move it 200 in within that scaled space.
-     */
-    var xTranslate = x.translate / treeScale.x;
-    var yTranslate = y.translate / treeScale.y;
-    var transform = "translate3d(" + xTranslate + "px, " + yTranslate + "px, 0) ";
-    if (latestTransform) {
-        var rotate = latestTransform.rotate, rotateX = latestTransform.rotateX, rotateY = latestTransform.rotateY;
-        if (rotate)
-            transform += "rotate(" + rotate + ") ";
-        if (rotateX)
-            transform += "rotateX(" + rotateX + ") ";
-        if (rotateY)
-            transform += "rotateY(" + rotateY + ") ";
-    }
-    transform += "scale(" + x.scale + ", " + y.scale + ")";
-    return !latestTransform && transform === identityProjection ? "" : transform;
-}
-/**
- * Take the calculated delta origin and apply it as a transform string.
- */
-function buildLayoutProjectionTransformOrigin({ deltaFinal, }: LayoutState) {
-    return deltaFinal.x.origin * 100 + "% " + deltaFinal.y.origin * 100 + "% 0";
-}
-var identityProjection = buildLayoutProjectionTransform(zeroLayout.delta, zeroLayout.treeScale, { x: 1, y: 1 });
-
-export { buildLayoutProjectionTransform, buildLayoutProjectionTransformOrigin, identityProjection };
-
+/**
+based on framer-motion@4.0.3,
+Copyright (c) 2018 Framer B.V.
+*/
+import { zeroLayout } from '../../utils/state.js';
+/**
+ * Build a transform style that takes a calculated delta between the element's current
+ * space on screen and projects it into the desired space.
+ */
+function buildLayoutProjectionTransform({ x, y }, treeScale, latestTransform) {
+    /**
+     * The translations we use to calculate are always relative to the viewport coordinate space.
+     * But when we apply scales, we also scale the coordinate space of an element and its children.
+     * For instance if we have a treeScale (the culmination of all parent scales) of 0.5 and we need
+     * to move an element 100 pixels, we actually need to move it 200 in within that scaled space.
+     */
+    var xTranslate = x.translate / treeScale.x;
+    var yTranslate = y.translate / treeScale.y;
+    var transform = "translate3d(" + xTranslate + "px, " + yTranslate + "px, 0) ";
+    if (latestTransform) {
+        var rotate = latestTransform.rotate, rotateX = latestTransform.rotateX, rotateY = latestTransform.rotateY;
+        if (rotate)
+            transform += "rotate(" + rotate + ") ";
+        if (rotateX)
+            transform += "rotateX(" + rotateX + ") ";
+        if (rotateY)
+            transform += "rotateY(" + rotateY + ") ";
+    }
+    transform += "scale(" + x.scale + ", " + y.scale + ")";
+    return !latestTransform && transform === identityProjection ? "" : transform;
+}
+/**
+ * Take the calculated delta origin and apply it as a transform string.
+ */
+function buildLayoutProjectionTransformOrigin({ deltaFinal, }) {
+    return deltaFinal.x.origin * 100 + "% " + deltaFinal.y.origin * 100 + "% 0";
+}
+var identityProjection = buildLayoutProjectionTransform(zeroLayout.delta, zeroLayout.treeScale, { x: 1, y: 1 });
+export { buildLayoutProjectionTransform, buildLayoutProjectionTransformOrigin, identityProjection };

package/dist/render/html/utils/build-styles.d.ts

@@ -0,0 +1,13 @@
+/**
+based on framer-motion@4.1.17,
+Copyright (c) 2018 Framer B.V.
+*/
+import type { MotionProps } from "../../../motion/types";
+import type { HTMLRenderState } from "../types";
+import type { ResolvedValues } from "../../types";
+import type { LayoutState, TargetProjection } from "../../utils/state";
+import type { DOMVisualElementOptions } from "../../dom/types";
+import type { BuildProjectionTransform, BuildProjectionTransformOrigin } from "./build-projection-transform";
+declare function buildHTMLStyles(state: HTMLRenderState, latestValues: ResolvedValues, projection: TargetProjection | undefined, layoutState: LayoutState | undefined, options: DOMVisualElementOptions, transformTemplate?: MotionProps["transformTemplate"], buildProjectionTransform?: BuildProjectionTransform, buildProjectionTransformOrigin?: BuildProjectionTransformOrigin): void;
+export { buildHTMLStyles };
+//# sourceMappingURL=build-styles.d.ts.map

package/dist/render/html/utils/build-styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"build-styles.d.ts","sourceRoot":"","sources":["../../../../../../src/lib/motion-start/render/html/utils/build-styles.ts"],"names":[],"mappings":"AAAA;;;EAGE;AACF,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACzD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAChD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClD,OAAO,KAAK,EAAE,WAAW,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACvE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAC/D,OAAO,KAAK,EAAE,wBAAwB,EAAE,8BAA8B,EAAE,MAAM,8BAA8B,CAAC;AAc7G,iBAAS,eAAe,CAAC,KAAK,EAAE,eAAe,EAAE,YAAY,EAAE,cAAc,EAAE,UAAU,EAAE,gBAAgB,GAAG,SAAS,EAAE,WAAW,EAAE,WAAW,GAAG,SAAS,EAAE,OAAO,EAAE,uBAAuB,EAAE,iBAAiB,CAAC,EAAE,WAAW,CAAC,mBAAmB,CAAC,EAAE,wBAAwB,CAAC,EAAE,wBAAwB,EAAE,8BAA8B,CAAC,EAAE,8BAA8B,QAgG1W;AAED,OAAO,EAAE,eAAe,EAAE,CAAC"}