Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
framer-motion
Advanced tools
framer-motion - npm Package Compare versions
Comparing version 0.3.5 to 0.4.0
@@ -5,2 +5,12 @@ # Changelog | ||
| ## [0.4.0] 2019-02-12 | ||
| ### Changed | ||
| - Standardizing `(event, pointInfo)` as signature for gesture callbacks. | ||
| ### Fixed | ||
| - Gesture priority bugs | ||
| ## [0.3.2] 2019-02-08 | ||
@@ -7,0 +17,0 @@ |
@@ -18,1007 +18,5 @@ { | ||
| { | ||
| "kind": "Class", | ||
| "canonicalReference": "(MotionValue:class)", | ||
| "docComment": "/**\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Content", | ||
| "text": "export declare class " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "MotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " = any> " | ||
| } | ||
| ], | ||
| "releaseTag": "Public", | ||
| "name": "MotionValue", | ||
| "members": [ | ||
| { | ||
| "kind": "Constructor", | ||
| "canonicalReference": "(:constructor,instance,0)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Content", | ||
| "text": "constructor(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "init" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ", { " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "transformer" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ", " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "parent" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " }?: " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Config" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ");" | ||
| } | ||
| ], | ||
| "isStatic": false, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 0, | ||
| "parameters": [ | ||
| { | ||
| "parameterName": "init", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 3, | ||
| "endIndex": 4 | ||
| } | ||
| }, | ||
| { | ||
| "parameterName": "{ transformer, parent }", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 9, | ||
| "endIndex": 13 | ||
| } | ||
| } | ||
| ] | ||
| }, | ||
| { | ||
| "kind": "Method", | ||
| "canonicalReference": "(addChild:instance,0)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "addChild" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "config" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Config" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "): " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "MotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "isStatic": false, | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 9, | ||
| "endIndex": 13 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 0, | ||
| "parameters": [ | ||
| { | ||
| "parameterName": "config", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 4, | ||
| "endIndex": 8 | ||
| } | ||
| } | ||
| ], | ||
| "name": "addChild" | ||
| }, | ||
| { | ||
| "kind": "Method", | ||
| "canonicalReference": "(addRenderSubscription:instance,0)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "addRenderSubscription" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "subscription" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Subscriber" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "): " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "() => boolean" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "isStatic": false, | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 9, | ||
| "endIndex": 10 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 0, | ||
| "parameters": [ | ||
| { | ||
| "parameterName": "subscription", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 4, | ||
| "endIndex": 8 | ||
| } | ||
| } | ||
| ], | ||
| "name": "addRenderSubscription" | ||
| }, | ||
| { | ||
| "kind": "Method", | ||
| "canonicalReference": "(addUpdateSubscription:instance,0)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "addUpdateSubscription" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "subscription" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Subscriber" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "): " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "() => boolean" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "isStatic": false, | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 9, | ||
| "endIndex": 10 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 0, | ||
| "parameters": [ | ||
| { | ||
| "parameterName": "subscription", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 4, | ||
| "endIndex": 8 | ||
| } | ||
| } | ||
| ], | ||
| "name": "addUpdateSubscription" | ||
| }, | ||
| { | ||
| "kind": "Method", | ||
| "canonicalReference": "(control:instance,0)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "control" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "controller" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "ActionFactory" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ", " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "config" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "PopmotionTransitionProps" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ", " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "transformer" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "?: " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Transformer" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "): " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Promise" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<{}>" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "isStatic": false, | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 17, | ||
| "endIndex": 19 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 0, | ||
| "parameters": [ | ||
| { | ||
| "parameterName": "controller", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 4, | ||
| "endIndex": 5 | ||
| } | ||
| }, | ||
| { | ||
| "parameterName": "config", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 8, | ||
| "endIndex": 9 | ||
| } | ||
| }, | ||
| { | ||
| "parameterName": "transformer", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 12, | ||
| "endIndex": 16 | ||
| } | ||
| } | ||
| ], | ||
| "name": "control" | ||
| }, | ||
| { | ||
| "kind": "Method", | ||
| "canonicalReference": "(destroy:instance,0)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "destroy" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(): " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "void" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "isStatic": false, | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 3 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 0, | ||
| "parameters": [], | ||
| "name": "destroy" | ||
| }, | ||
| { | ||
| "kind": "Method", | ||
| "canonicalReference": "(get:instance,0)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "get" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(): " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "isStatic": false, | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 3 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 0, | ||
| "parameters": [], | ||
| "name": "get" | ||
| }, | ||
| { | ||
| "kind": "Method", | ||
| "canonicalReference": "(getVelocity:instance,0)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "getVelocity" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(): " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "number" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "isStatic": false, | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 3 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 0, | ||
| "parameters": [], | ||
| "name": "getVelocity" | ||
| }, | ||
| { | ||
| "kind": "Property", | ||
| "canonicalReference": "(notifySubscriber:instance)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "notifySubscriber" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "subscriber" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Subscriber" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">) => void" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "releaseTag": "Public", | ||
| "name": "notifySubscriber", | ||
| "propertyTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 9 | ||
| }, | ||
| "isStatic": false | ||
| }, | ||
| { | ||
| "kind": "Method", | ||
| "canonicalReference": "(removeChild:instance,0)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "removeChild" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "child" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "MotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "): " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "void" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "isStatic": false, | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 6, | ||
| "endIndex": 7 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 0, | ||
| "parameters": [ | ||
| { | ||
| "parameterName": "child", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 4, | ||
| "endIndex": 5 | ||
| } | ||
| } | ||
| ], | ||
| "name": "removeChild" | ||
| }, | ||
| { | ||
| "kind": "Property", | ||
| "canonicalReference": "(scheduleVelocityCheck:instance)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "scheduleVelocityCheck" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "() => import(\"framesync/lib/types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Process" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "releaseTag": "Public", | ||
| "name": "scheduleVelocityCheck", | ||
| "propertyTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 4 | ||
| }, | ||
| "isStatic": false | ||
| }, | ||
| { | ||
| "kind": "Method", | ||
| "canonicalReference": "(set:instance,0)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "set" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "v" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ", " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "render" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "?: " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "boolean" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "): " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "void" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "isStatic": false, | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 10, | ||
| "endIndex": 11 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 0, | ||
| "parameters": [ | ||
| { | ||
| "parameterName": "v", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 4, | ||
| "endIndex": 5 | ||
| } | ||
| }, | ||
| { | ||
| "parameterName": "render", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 8, | ||
| "endIndex": 9 | ||
| } | ||
| } | ||
| ], | ||
| "name": "set" | ||
| }, | ||
| { | ||
| "kind": "Property", | ||
| "canonicalReference": "(setChild:instance)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "setChild" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "child" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "MotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<any>) => void" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "releaseTag": "Public", | ||
| "name": "setChild", | ||
| "propertyTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 7 | ||
| }, | ||
| "isStatic": false | ||
| }, | ||
| { | ||
| "kind": "Method", | ||
| "canonicalReference": "(stop:instance,0)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "stop" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(): " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "void" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "isStatic": false, | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 3 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 0, | ||
| "parameters": [], | ||
| "name": "stop" | ||
| }, | ||
| { | ||
| "kind": "Method", | ||
| "canonicalReference": "(subscribeTo:instance,0)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "subscribeTo" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "subscriptions" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Set" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Subscriber" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">>" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ", " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "subscription" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Subscriber" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "): " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "() => boolean" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "isStatic": false, | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 18, | ||
| "endIndex": 19 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 0, | ||
| "parameters": [ | ||
| { | ||
| "parameterName": "subscriptions", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 4, | ||
| "endIndex": 10 | ||
| } | ||
| }, | ||
| { | ||
| "parameterName": "subscription", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 13, | ||
| "endIndex": 17 | ||
| } | ||
| } | ||
| ], | ||
| "name": "subscribeTo" | ||
| }, | ||
| { | ||
| "kind": "Property", | ||
| "canonicalReference": "(velocityCheck:instance)", | ||
| "docComment": "", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "velocityCheck" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "({ " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "timestamp" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " }: " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "FrameData" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ") => void" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "releaseTag": "Public", | ||
| "name": "velocityCheck", | ||
| "propertyTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 7 | ||
| }, | ||
| "isStatic": false | ||
| } | ||
| ], | ||
| "implementsTokenRanges": [] | ||
| }, | ||
| { | ||
| "kind": "Function", | ||
| "canonicalReference": "(unwrapMotionValue:0)", | ||
| "docComment": "/**\n * If the provided value is a MotionValue, this returns the actual value, otherwise just the value itself\n *\n * @param - value\n *\n * @public\n */\n", | ||
| "canonicalReference": "(useAnimation:0)", | ||
| "docComment": "/**\n * Manually start, stop and sequence animations\n *\n * @remarks\n *\n * `useAnimation` is used to manually start, stop and sequence animations.\n *\n * Create an animation controller with `useAnimation`:\n * ```jsx\n * const animation = useAnimation()\n * ```\n *\n * Pass this to one or more components that you want to animate via the `animate` property:\n * ```jsx\n * return <motion.div animate={animation} />\n * ```\n *\n * Now you can start animations with `animation.start`. It accepts the same properties as the `animate` prop:\n * ```jsx\n * const animation = useAnimation()\n * const moveRight = () => animation.start({\n * x: 100,\n * transition: { duration: 1 }\n * })\n *\n * return <motion.div animate={animation} onClick={moveRight} />\n * ```\n *\n * `start` returns a `Promise`, so animations can be sequenced using `async` functions:\n * ```jsx\n * const sequence = async () => {\n * await animation.start({ opacity: 1 })\n * return animation.start({ scale: 2 })\n * }\n * ```\n *\n * `useAnimation` can optionally accept `variants`:\n * ```jsx\n * const animation = useAnimation({\n * visible: { opacity: 1 },\n * hidden: { opacity: 0 }\n * })\n * ```\n *\n * That can be later referenced by `start`:\n * ```jsx\n * animation.start('visible')\n * ```\n *\n * @params variants - List of variants. Optional\n *\n * @returns Animation controller with `start` and `stop` methods\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
@@ -1031,50 +29,38 @@ { | ||
| "kind": "Reference", | ||
| "text": "unwrapMotionValue" | ||
| "text": "useAnimation" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| "text": "(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| "text": "variants" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">(" | ||
| "text": "?: " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "value" | ||
| "text": "Variants" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| "text": ", " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| "text": "defaultTransition" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " | " | ||
| "text": "?: " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "MotionValue" | ||
| "text": "Transition" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "): " | ||
@@ -1084,3 +70,3 @@ }, | ||
| "kind": "Reference", | ||
| "text": "V" | ||
| "text": "AnimationGroupControls" | ||
| }, | ||
@@ -1093,4 +79,4 @@ { | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 14, | ||
| "endIndex": 15 | ||
| "startIndex": 11, | ||
| "endIndex": 12 | ||
| }, | ||
@@ -1101,15 +87,22 @@ "releaseTag": "Public", | ||
| { | ||
| "parameterName": "value", | ||
| "parameterName": "variants", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 7, | ||
| "endIndex": 13 | ||
| "startIndex": 5, | ||
| "endIndex": 6 | ||
| } | ||
| }, | ||
| { | ||
| "parameterName": "defaultTransition", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 9, | ||
| "endIndex": 10 | ||
| } | ||
| } | ||
| ], | ||
| "name": "unwrapMotionValue" | ||
| "name": "useAnimation" | ||
| }, | ||
| { | ||
| "kind": "Function", | ||
| "canonicalReference": "(usePanGesture:0)", | ||
| "docComment": "/**\n * @param - handlers\n *\n * @param - ref\n *\n * @public\n */\n", | ||
| "canonicalReference": "(useCycle:0)", | ||
| "docComment": "/**\n * Cycles through a series of states.\n *\n * @remarks\n *\n * `useCycle` works similar to React's `useState`.\n *\n * It's provided an array of possible states, and returns an array of two arguments.\n *\n * The first item is the current state. The second item is a function that cycles to the next state.\n * ```jsx\n * const [x, cycleX] = useCycle([0, 100, 200])\n *\n * return <motion.div animate={{ x }} onClick={cycleX} />\n * ```\n *\n * By default, the initial state is the first item in the provided array (`0` in the above example).\n *\n * `useCycle` accepts a second parameter, that can set a different index. For example:\n * ```jsx\n * const [x, cycleX] = useCycle([0, 100, 200], 2)\n * ```\n *\n * `x` would initially be `200`.\n *\n * The returned `cycleState` function, by default, cycles to the next item in the array.\n *\n * Optionally, it accepts an index that will cycle to a specific item in the array.\n *\n * @param items - An array of the possible states\n *\n * @param initialIndex - Index of initial state. Optional, defaults to 0\n *\n * @returns [currentState, cycleState]\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
@@ -1122,14 +115,22 @@ { | ||
| "kind": "Reference", | ||
| "text": "usePanGesture" | ||
| "text": "useCycle" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "handlers" | ||
| "text": "T" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "items" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
@@ -1139,6 +140,10 @@ }, | ||
| "kind": "Reference", | ||
| "text": "PanHandlers" | ||
| "text": "T" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "[]" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ", " | ||
@@ -1148,31 +153,35 @@ }, | ||
| "kind": "Reference", | ||
| "text": "ref" | ||
| "text": "initialIndex" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| "text": "?: " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "RefObject" | ||
| "kind": "Content", | ||
| "text": "number" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| "text": "): " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "[" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Element" | ||
| "text": "T" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">" | ||
| "text": ", (" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "): " | ||
| "kind": "Reference", | ||
| "text": "i" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "undefined" | ||
| "text": "?: any) => void]" | ||
| }, | ||
@@ -1186,3 +195,3 @@ { | ||
| "startIndex": 14, | ||
| "endIndex": 15 | ||
| "endIndex": 19 | ||
| }, | ||
@@ -1193,12 +202,12 @@ "releaseTag": "Public", | ||
| { | ||
| "parameterName": "handlers", | ||
| "parameterName": "items", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 5, | ||
| "endIndex": 6 | ||
| "startIndex": 7, | ||
| "endIndex": 9 | ||
| } | ||
| }, | ||
| { | ||
| "parameterName": "ref", | ||
| "parameterName": "initialIndex", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 9, | ||
| "startIndex": 12, | ||
| "endIndex": 13 | ||
@@ -1208,8 +217,8 @@ } | ||
| ], | ||
| "name": "usePanGesture" | ||
| "name": "useCycle" | ||
| }, | ||
| { | ||
| "kind": "Function", | ||
| "canonicalReference": "(usePanGesture:1)", | ||
| "docComment": "", | ||
| "canonicalReference": "(useGestures:0)", | ||
| "docComment": "/**\n * Add pan and tap gesture recognition to an element.\n *\n * @remarks\n *\n * `useGestures` is an unopinionated way to add pan and tap gesture recognition to an element.\n *\n * ## Pan\n *\n * A pan is defined as when a user's pointer presses an element and move beyond and initial threshold.\n *\n * The pan gesture can be handled with three event handlers: `onPanStart`, `onPan` and `onPanEnd`.\n *\n * Each event handler function receives the originating pointer event as its first argument.\n *\n * As a second argument, the following pointer information is provided as x/y coordinates:\n *\n * - `point`: The point, relative to the page - `delta`: The movement from the previous pan movement - `offset`: The movement from the point's origin, - `velocity`: The velocity of the point\n *\n * ## Tap\n *\n * A tap is defined as a user pressing their pointer on an element and releasing it on the same element.\n *\n * The tap gesture can be handled with three event handlers: `onTapStart`, `onTap`, `onTapCancel`.\n *\n * Each event handler function receives the originating pointer event as its first argument.\n *\n * As a second argument, the following pointer information is provided as x/y coordinates:\n *\n * - `point`: The point, relative to the page\n *\n * @param - props\n *\n * @param - ref\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
@@ -1222,31 +231,27 @@ { | ||
| "kind": "Reference", | ||
| "text": "usePanGesture" | ||
| "text": "useGestures" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "handlers" | ||
| "text": "P" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| "text": " extends " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "PanHandlers" | ||
| "text": "GestureHandlers" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "): " | ||
| "text": ">(" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "{\n " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "onPointerDown" | ||
| "text": "props" | ||
| }, | ||
@@ -1259,68 +264,33 @@ { | ||
| "kind": "Reference", | ||
| "text": "EventHandler" | ||
| "text": "P" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";\n}" | ||
| "text": ", " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 7, | ||
| "endIndex": 12 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 1, | ||
| "parameters": [ | ||
| { | ||
| "parameterName": "handlers", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 5, | ||
| "endIndex": 6 | ||
| } | ||
| } | ||
| ], | ||
| "name": "usePanGesture" | ||
| }, | ||
| { | ||
| "kind": "Function", | ||
| "canonicalReference": "(useTapGesture:0)", | ||
| "docComment": "/**\n * @param - handlers\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Content", | ||
| "text": "export declare function " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "useTapGesture" | ||
| "text": "ref" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "handlers" | ||
| "text": "RefObject" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "TapHandlers" | ||
| "text": "Element" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " & " | ||
| "text": ">" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "ControlsProp" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
@@ -1331,22 +301,6 @@ "text": "): " | ||
| "kind": "Content", | ||
| "text": "{\n " | ||
| "text": "void" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "onPointerDown" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "EventHandler" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";\n}" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
@@ -1356,4 +310,4 @@ } | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 9, | ||
| "endIndex": 14 | ||
| "startIndex": 18, | ||
| "endIndex": 19 | ||
| }, | ||
@@ -1364,15 +318,22 @@ "releaseTag": "Public", | ||
| { | ||
| "parameterName": "handlers", | ||
| "parameterName": "props", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 5, | ||
| "endIndex": 8 | ||
| "startIndex": 9, | ||
| "endIndex": 10 | ||
| } | ||
| }, | ||
| { | ||
| "parameterName": "ref", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 13, | ||
| "endIndex": 17 | ||
| } | ||
| } | ||
| ], | ||
| "name": "useTapGesture" | ||
| "name": "useGestures" | ||
| }, | ||
| { | ||
| "kind": "Function", | ||
| "canonicalReference": "(useTapGesture:1)", | ||
| "docComment": "", | ||
| "canonicalReference": "(useMotionValue:0)", | ||
| "docComment": "/**\n * For advanced use-cases, you can assume external control of the motion values used by `motion` components.\n *\n * This is usually used in conjunction with `useTransform`.\n *\n * ## Import\n * ```javascript\n * import { useMotionValue } from 'framer-motion'\n * ```\n *\n * ## Usage\n *\n * Motion values are created with the `useMotionValue` hook, providing it an initial value:\n * ```javascript\n * const x = useMotionValue(0)\n * ```\n *\n * This can be passed to a motion component via the `motionValue` prop:\n * ```javascript\n * const MotionComponent = motion.div()\n *\n * export const () => {\n * const x = useMotionValue(0)\n *\n * return <MotionComponent motionValues={{ x }} />\n * }\n * ```\n *\n * @param - {number | string} init - The initial state of the `MotionValue`\n *\n * @returns `MotionValue`\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
@@ -1385,46 +346,38 @@ { | ||
| "kind": "Reference", | ||
| "text": "useTapGesture" | ||
| "text": "useMotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "handlers" | ||
| "text": "T" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| "text": ">(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "TapHandlers" | ||
| "text": "init" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " & " | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "ControlsProp" | ||
| "text": "T" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ", " | ||
| "text": "): " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "ref" | ||
| "text": "MotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "RefObject" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
@@ -1434,3 +387,3 @@ }, | ||
| "kind": "Reference", | ||
| "text": "Element" | ||
| "text": "T" | ||
| }, | ||
@@ -1443,10 +396,2 @@ { | ||
| "kind": "Content", | ||
| "text": "): " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "undefined" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ";" | ||
@@ -1456,24 +401,17 @@ } | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 16, | ||
| "endIndex": 17 | ||
| "startIndex": 9, | ||
| "endIndex": 13 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "overloadIndex": 1, | ||
| "overloadIndex": 0, | ||
| "parameters": [ | ||
| { | ||
| "parameterName": "handlers", | ||
| "parameterName": "init", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 5, | ||
| "startIndex": 7, | ||
| "endIndex": 8 | ||
| } | ||
| }, | ||
| { | ||
| "parameterName": "ref", | ||
| "parameterTypeTokenRange": { | ||
| "startIndex": 11, | ||
| "endIndex": 15 | ||
| } | ||
| } | ||
| ], | ||
| "name": "useTapGesture" | ||
| "name": "useMotionValue" | ||
| }, | ||
@@ -1483,3 +421,3 @@ { | ||
| "canonicalReference": "(useTransformedValue:0)", | ||
| "docComment": "/**\n * @param - value\n *\n * @param - transform\n *\n * @public\n */\n", | ||
| "docComment": "/**\n * Creates a new `MotionValue` that takes the output of another `MotionValue` and transforms it with a function\n *\n * @param value - `MotionValue`\n *\n * @param transform - Function that accepts the output of `value` and returns a new value.\n *\n * @returns `MotionValue`\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
@@ -1566,3 +504,3 @@ { | ||
| "canonicalReference": "(useTransformedValue:1)", | ||
| "docComment": "", | ||
| "docComment": "/**\n * Creates a new `MotionValue` that takes the output of another `MotionValue` and transforms between the `from` range to the `to` range.\n *\n * @remarks\n *\n * Options: - `clamp`: Default `true`. Clamps output to the provided array\n *\n * @param value - `MotionValue`\n *\n * @param from - A linear series of numbers (either all increasing or decreasing)\n *\n * @param to - A series of numbers, colors or strings. Must be the same length as `from`.\n *\n * @param options - Options\n *\n * @returns `MotionValue`\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
@@ -1697,412 +635,80 @@ { | ||
| { | ||
| "kind": "Variable", | ||
| "canonicalReference": "motion", | ||
| "docComment": "/**\n * @internalremarks At some point we might want to explore a \"headless\" component that renders only `children` in the event\n *\n * @public\n */\n", | ||
| "kind": "Function", | ||
| "canonicalReference": "(useViewportScrollValues:0)", | ||
| "docComment": "/**\n * Provides `MotionValue`s that update when the viewport scrolls.\n *\n * @remarks\n *\n * This makes it possible to transform viewport scrolls into other values.\n *\n * Four `MotionValue`s are returned:\n *\n * - `scrollX`/`scrollY`: The x/y scroll offset in pixels. - `scrollXProgress`/`scrollYProgress`: The x/y scroll offset as a progress value between `0` and `1`.\n * ```jsx\n * const { scrollX } = useViewportScrollValues()\n * ```\n *\n * @returns `{ scrollX, scrollY, scrollXProgress, scrollYProgress }` `MotionValue`s\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "motion" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| "text": "export declare function " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "MotionComponents" | ||
| } | ||
| ], | ||
| "releaseTag": "Public", | ||
| "name": "motion", | ||
| "variableTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 3 | ||
| } | ||
| }, | ||
| { | ||
| "kind": "Variable", | ||
| "canonicalReference": "useAnimation", | ||
| "docComment": "/**\n * @param - variants\n *\n * @param - defaultTransition\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "useAnimation" | ||
| "text": "useViewportScrollValues" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| "text": "(): " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "(" | ||
| "text": "{\n " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "variants" | ||
| "text": "scrollX" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "?: " | ||
| "text": ": import(\".\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Variants" | ||
| "text": "MotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " | undefined, " | ||
| "text": "<number>;\n " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "defaultTransition" | ||
| "text": "scrollY" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "?: import(\"../types\")." | ||
| "text": ": import(\".\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "TransitionMap" | ||
| "text": "MotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " | (import(\"../types\")." | ||
| "text": "<number>;\n " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "TransitionOrchestration" | ||
| "text": "scrollXProgress" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " & import(\"../types\")." | ||
| "text": ": import(\".\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Tween" | ||
| "text": "MotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ") | (import(\"../types\")." | ||
| "text": "<number>;\n " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "TransitionOrchestration" | ||
| "text": "scrollYProgress" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " & import(\"../types\")." | ||
| "text": ": import(\".\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Spring" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ") | (import(\"../types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "TransitionOrchestration" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " & import(\"../types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Decay" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ") | (import(\"../types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "TransitionOrchestration" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " & import(\"../types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Inertia" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ") | (import(\"../types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "TransitionOrchestration" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " & import(\"../types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Keyframes" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ") | (import(\"../types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "TransitionOrchestration" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " & import(\"../types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Physics" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ") | (import(\"../types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "TransitionOrchestration" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " & import(\"../types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Just" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ") | (import(\"../types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "TransitionOrchestration" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " & import(\"../types\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "None" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ") | undefined) => " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "AnimationManager" | ||
| } | ||
| ], | ||
| "releaseTag": "Public", | ||
| "name": "useAnimation", | ||
| "variableTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 44 | ||
| } | ||
| }, | ||
| { | ||
| "kind": "Variable", | ||
| "canonicalReference": "useCycle", | ||
| "docComment": "/**\n * Cycles through a series of states.\n *\n * @remarks\n *\n * `useCycle` works similar to React's `useState`.\n *\n * It's provided an array of possible states, and returns an array of two arguments.\n *\n * The first item is the current state. The second item is a function that cycles to the next state.\n * ```jsx\n * const [x, cycleX] = useCycle([0, 100, 200])\n *\n * return <Frame animate={{ x }} onClick={cycleX} />\n * ```\n *\n * By default, the initial state is the first item in the provided array (`0` in the above example).\n *\n * `useCycle` accepts a second parameter, that can set a different index. For example:\n * ```jsx\n * const [x, cycleX] = useCycle([0, 100, 200], 2)\n * ```\n *\n * `x` would initially be `200`.\n *\n * The returned `cycleState` function, by default, cycles to the next item in the array.\n *\n * Optionally, it accepts an index that will cycle to a specific item in the array.\n *\n * @param items - An array of the possible states\n *\n * @param initialIndex - Index of initial state. Optional, defaults to 0\n *\n * @returns [currentState, cycleState]\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "useCycle" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "T" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "items" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "T" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "[], " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "initialIndex" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "?: number) => [" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "T" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ", (" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "i" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "?: any) => void]" | ||
| } | ||
| ], | ||
| "releaseTag": "Public", | ||
| "name": "useCycle", | ||
| "variableTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 15 | ||
| } | ||
| }, | ||
| { | ||
| "kind": "Variable", | ||
| "canonicalReference": "useGestures", | ||
| "docComment": "/**\n * @param - props\n *\n * @param - ref\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "useGestures" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "P" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": " extends " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "GestureHandlers" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "props" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "P" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ", " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "ref" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "RefObject" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "Element" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">) => void" | ||
| } | ||
| ], | ||
| "releaseTag": "Public", | ||
| "name": "useGestures", | ||
| "variableTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 17 | ||
| } | ||
| }, | ||
| { | ||
| "kind": "Variable", | ||
| "canonicalReference": "useMotionValue", | ||
| "docComment": "/**\n * For advanced use-cases, you can assume external control of the motion values used by `motion` components.\n *\n * This is usually used in conjunction with `useTransform`.\n *\n * ## Import\n * ```javascript\n * import { useMotionValue } from 'framer-motion'\n * ```\n *\n * ## Usage\n *\n * Motion values are created with the `useMotionValue` hook, providing it an initial value:\n * ```javascript\n * const x = useMotionValue(0)\n * ```\n *\n * This can be passed to a motion component via the `motionValue` prop:\n * ```javascript\n * const MotionComponent = motion.div()\n *\n * export const () => {\n * const x = useMotionValue(0)\n *\n * return <MotionComponent motionValues={{ x }} />\n * }\n * ```\n *\n * @param - {number | string} init - The initial state of the `MotionValue`\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "useMotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "T" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">(" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "init" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "T" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ") => " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "MotionValue" | ||
@@ -2112,28 +718,26 @@ }, | ||
| "kind": "Content", | ||
| "text": "<" | ||
| "text": "<number>;\n}" | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "T" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ">" | ||
| "text": ";" | ||
| } | ||
| ], | ||
| "returnTypeTokenRange": { | ||
| "startIndex": 3, | ||
| "endIndex": 20 | ||
| }, | ||
| "releaseTag": "Public", | ||
| "name": "useMotionValue", | ||
| "variableTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 13 | ||
| } | ||
| "overloadIndex": 0, | ||
| "parameters": [], | ||
| "name": "useViewportScrollValues" | ||
| }, | ||
| { | ||
| "kind": "Variable", | ||
| "canonicalReference": "useViewportScrollValues", | ||
| "docComment": "/**\n * `useViewportScroll` provides `MotionValue`s that update when the viewport scrolls.\n *\n * This makes it possible to transform viewport scroll into other values.\n *\n * For instance, highlighting different table of contents items to correspond with page scroll.\n *\n * @public\n */\n", | ||
| "canonicalReference": "motion", | ||
| "docComment": "/**\n * Components optimised for use in gestures and animation.\n *\n * @internalremarks We should look into allowing `dragMomentum` and/or other props to config the `inertia` animation props.\n *\n * @remarks\n *\n * `motion` components offer a simple API for adding gestures and animation.\n *\n * They're optimized for motion to keep interfaces running at a smooth 60fps.\n *\n * ## Animation\n *\n * - TODO\n *\n * ## Gestures\n *\n * - TODO\n *\n * ## Supported elements\n *\n * All HTML and SVG elements are supported.\n *\n * ## Supported values\n *\n * All CSS and SVG properties are supported.\n *\n * ### Transforms\n *\n * Transform values can be animated as separate values: - `x`, `y`, `z`, - `rotate`, `rotateX`, `rotateY`, `rotateZ`, - `scale`, `scaleX`, `scaleY`, `scaleZ`, - `skewX`, `skewY`, - `originX`, `originY` - `perspective`\n *\n * ### Value conversion\n *\n * For HTML elements, `x`, `y`, `width`, `height`, `top`, `left`, `bottom` and `right` can be animated between different value types:\n * ```jsx\n * const variants = {\n * closed: { x: 0 },\n * open: { x: 'calc(50vw - 50%)' }\n * }\n * ```\n *\n * ### Path drawing\n *\n * `motion.path` has support for three properties that make it easier to work with path drawing animations than `stroke-dashoffset` and `stroke-dasharray` directly: - `pathLength` - `pathSpacing` - `pathOffset`\n *\n * These are all set as a percentage of the total path length, from `0` to `100`, which is automatically measured by Framer Motion.\n * ```jsx\n * {\n * empty: { pathLength: 0 },\n * fill: { pathLength: 100 }\n * }\n * ```\n *\n * @param animate - Either properties to animate to, variant label, array of variant labels, or `AnimationController`\n *\n * @param initial - Properties, variant label or array of variant labels to start in\n *\n * @param variants - Object of variants\n *\n * @param transition - Default transition\n *\n * @param style - Supports `MotionValue`s and separate `transform` values.\n *\n * @param hover - Properties or variant label to animate to while the hover gesture is recognised\n *\n * @param press - Properties or variant label to animate to while the component is pressed\n *\n * @param onAnimationComplete - Callback when animation to `animate` is complete\n *\n * @param onUpdate - Callback with latest motion values, fired once per frame\n *\n * @param onPanStart - Callback when the pan gesture begins on this element\n *\n * @param onPan - Callback when the pan gesture is recognised on this element\n *\n * @param onPanEnd - Callback when the pan gesture ends on this element\n *\n * @param onTapStart - Callback when the tap gesture starts on this element\n *\n * @param onTap - Callback when the tap gesture successfully ends on this element\n *\n * @param onTapCancel - Callback when the tap gesture ends outside this element\n *\n * @param dragEnabled - `true | 'x' | 'y' | 'lockDirection'` Sets which directions the component can be dragged in\n *\n * @param dragConstraints - An object of optional `top`, `left`, `right`, `bottom` pixel values, beyond which dragging is constrained\n *\n * @param dragElastic - The degree of movement allowed outside constraints. Set to `false` for no movement. Defaults to `0.5`\n *\n * @param dragMomentum - Apply momentum from the pan gesture to the component when dragging finishes. Defaults to `true`\n *\n * @param dragPropagation - Allows drag gesture propagation to child components. Defaults to `false`\n *\n * @param render - Set to `false` to block rendering the latest motion values on the component - can be used to temporarily disable animations for performance reasons. Defaults to `true`\n *\n * @public\n */\n", | ||
| "excerptTokens": [ | ||
| { | ||
| "kind": "Reference", | ||
| "text": "useViewportScrollValues" | ||
| "text": "motion" | ||
| }, | ||
@@ -2145,75 +749,11 @@ { | ||
| { | ||
| "kind": "Content", | ||
| "text": "() => {\n " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "scrollX" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": import(\".\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "MotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<number>;\n " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "scrollY" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": import(\".\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "MotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<number>;\n " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "scrollXProgress" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": import(\".\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "MotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<number>;\n " | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "scrollYProgress" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": ": import(\".\")." | ||
| }, | ||
| { | ||
| "kind": "Reference", | ||
| "text": "MotionValue" | ||
| }, | ||
| { | ||
| "kind": "Content", | ||
| "text": "<number>;\n}" | ||
| "text": "MotionComponents" | ||
| } | ||
| ], | ||
| "releaseTag": "Public", | ||
| "name": "useViewportScrollValues", | ||
| "name": "motion", | ||
| "variableTypeTokenRange": { | ||
| "startIndex": 2, | ||
| "endIndex": 19 | ||
| "endIndex": 3 | ||
| } | ||
@@ -2220,0 +760,0 @@ } |
@@ -22,2 +22,3 @@ import { Action } from 'popmotion'; | ||
| private overrides; | ||
| private activeOverrides; | ||
| private resolvedOverrides; | ||
@@ -39,2 +40,4 @@ private defaultTransition?; | ||
| getHighestPriority(): number; | ||
| setOverride(definition: AnimationDefinition, overrideIndex: number): void; | ||
| startOverride(overrideIndex: number): Promise<any> | undefined; | ||
| clearOverride(overrideIndex: number): void; | ||
@@ -44,3 +47,2 @@ apply(definition: VariantLabels | TargetAndTransition): void; | ||
| start(definition: AnimationDefinition, opts?: AnimationOptions): Promise<any>; | ||
| setPriorityAnimation(definition: AnimationDefinition, priority: number): void; | ||
| isHighestPriority(priority: number): boolean; | ||
@@ -61,3 +63,3 @@ private animate; | ||
| declare class AnimationManager { | ||
| declare class AnimationGroupControls { | ||
| private hasMounted; | ||
@@ -223,4 +225,88 @@ private defaultTransition; | ||
| /** | ||
| * Components optimised for use in gestures and animation. | ||
| * | ||
| * @internalremarks | ||
| * We should look into allowing `dragMomentum` and/or other props to config the `inertia` animation props. | ||
| * | ||
| * @remarks | ||
| * `motion` components offer a simple API for adding gestures and animation. | ||
| * | ||
| * They're optimized for motion to keep interfaces running at a smooth 60fps. | ||
| * | ||
| * ## Animation | ||
| * | ||
| * - TODO | ||
| * | ||
| * ## Gestures | ||
| * | ||
| * - TODO | ||
| * | ||
| * ## Supported elements | ||
| * | ||
| * All HTML and SVG elements are supported. | ||
| * | ||
| * ## Supported values | ||
| * | ||
| * All CSS and SVG properties are supported. | ||
| * | ||
| * ### Transforms | ||
| * | ||
| * Transform values can be animated as separate values: | ||
| * - `x`, `y`, `z`, | ||
| * - `rotate`, `rotateX`, `rotateY`, `rotateZ`, | ||
| * - `scale`, `scaleX`, `scaleY`, `scaleZ`, | ||
| * - `skewX`, `skewY`, | ||
| * - `originX`, `originY` | ||
| * - `perspective` | ||
| * | ||
| * ### Value conversion | ||
| * | ||
| * For HTML elements, `x`, `y`, `width`, `height`, `top`, `left`, `bottom` and `right` can be animated between different value types: | ||
| * | ||
| * ```jsx | ||
| * const variants = { | ||
| * closed: { x: 0 }, | ||
| * open: { x: 'calc(50vw - 50%)' } | ||
| * } | ||
| * ``` | ||
| * | ||
| * ### Path drawing | ||
| * | ||
| * `motion.path` has support for three properties that make it easier to work with path drawing animations than `stroke-dashoffset` and `stroke-dasharray` directly: | ||
| * - `pathLength` | ||
| * - `pathSpacing` | ||
| * - `pathOffset` | ||
| * | ||
| * These are all set as a percentage of the total path length, from `0` to `100`, which is automatically measured by Framer Motion. | ||
| * | ||
| * ```jsx | ||
| * { | ||
| * empty: { pathLength: 0 }, | ||
| * fill: { pathLength: 100 } | ||
| * } | ||
| * ``` | ||
| * | ||
| * @param animate - Either properties to animate to, variant label, array of variant labels, or `AnimationController` | ||
| * @param initial - Properties, variant label or array of variant labels to start in | ||
| * @param variants - Object of variants | ||
| * @param transition - Default transition | ||
| * @param style - Supports `MotionValue`s and separate `transform` values. | ||
| * @param hover - Properties or variant label to animate to while the hover gesture is recognised | ||
| * @param press - Properties or variant label to animate to while the component is pressed | ||
| * @param onAnimationComplete - Callback when animation to `animate` is complete | ||
| * @param onUpdate - Callback with latest motion values, fired once per frame | ||
| * @param onPanStart - Callback when the pan gesture begins on this element | ||
| * @param onPan - Callback when the pan gesture is recognised on this element | ||
| * @param onPanEnd - Callback when the pan gesture ends on this element | ||
| * @param onTapStart - Callback when the tap gesture starts on this element | ||
| * @param onTap - Callback when the tap gesture successfully ends on this element | ||
| * @param onTapCancel - Callback when the tap gesture ends outside this element | ||
| * @param dragEnabled - `true | 'x' | 'y' | 'lockDirection'` Sets which directions the component can be dragged in | ||
| * @param dragConstraints - An object of optional `top`, `left`, `right`, `bottom` pixel values, beyond which dragging is constrained | ||
| * @param dragElastic - The degree of movement allowed outside constraints. Set to `false` for no movement. Defaults to `0.5` | ||
| * @param dragMomentum - Apply momentum from the pan gesture to the component when dragging finishes. Defaults to `true` | ||
| * @param dragPropagation - Allows drag gesture propagation to child components. Defaults to `false` | ||
| * @param render - Set to `false` to block rendering the latest motion values on the component - can be used to temporarily disable animations for performance reasons. Defaults to `true` | ||
| * | ||
| * @public | ||
| * @internalremarks At some point we might want to explore a "headless" component that renders only `children` in the event | ||
| */ | ||
@@ -240,8 +326,3 @@ export declare const motion: MotionComponents; | ||
| export declare interface MotionPlugins { | ||
| transformPagePoint: (point: Point) => Point; | ||
| } | ||
| /** | ||
| * | ||
| * @internal | ||
@@ -251,8 +332,12 @@ * @internalremarks For now I think this should remain a private API for our own use | ||
| */ | ||
| export declare const MotionPlugins: ({ children, ...props }: MotionPluginProps) => JSX.Element; | ||
| export declare function MotionPlugins({ children, ...props }: MotionPluginProps): JSX.Element; | ||
| export declare interface MotionPlugins { | ||
| transformPagePoint: (point: Point) => Point; | ||
| } | ||
| declare interface MotionProps extends GestureHandlers, DraggableProps { | ||
| ref?: Ref<Element>; | ||
| style?: MotionStyle; | ||
| animate?: AnimationManager | TargetAndTransition | VariantLabels; | ||
| animate?: AnimationGroupControls | TargetAndTransition | VariantLabels; | ||
| initial?: Target | VariantLabels; | ||
@@ -262,4 +347,4 @@ variants?: Variants; | ||
| inherit?: boolean; | ||
| render?: boolean; | ||
| onUpdate?: OnUpdate; | ||
| render?: boolean; | ||
| onAnimationComplete?: () => void; | ||
@@ -295,3 +380,3 @@ [key: string]: any; | ||
| /** | ||
| * @public | ||
| * @internal | ||
| */ | ||
@@ -420,3 +505,3 @@ export declare class MotionValue<V = any> { | ||
| declare type TapHandler = (session: TapInfo, event: Event) => void; | ||
| declare type TapHandler = (event: Event, session: TapInfo) => void; | ||
@@ -508,4 +593,4 @@ declare interface TapHandlers { | ||
| * If the provided value is a MotionValue, this returns the actual value, otherwise just the value itself | ||
| * @param value | ||
| * @public | ||
| * | ||
| * @internal | ||
| */ | ||
@@ -515,8 +600,61 @@ export declare function unwrapMotionValue<V>(value: V | MotionValue<V>): V; | ||
| /** | ||
| * Manually start, stop and sequence animations | ||
| * | ||
| * @param variants | ||
| * @param defaultTransition | ||
| * @remarks | ||
| * `useAnimation` is used to manually start, stop and sequence animations. | ||
| * | ||
| * Create an animation controller with `useAnimation`: | ||
| * | ||
| * ```jsx | ||
| * const animation = useAnimation() | ||
| * ``` | ||
| * | ||
| * Pass this to one or more components that you want to animate via the `animate` property: | ||
| * | ||
| * ```jsx | ||
| * return <motion.div animate={animation} /> | ||
| * ``` | ||
| * | ||
| * Now you can start animations with `animation.start`. It accepts the same properties as the `animate` prop: | ||
| * | ||
| * ```jsx | ||
| * const animation = useAnimation() | ||
| * const moveRight = () => animation.start({ | ||
| * x: 100, | ||
| * transition: { duration: 1 } | ||
| * }) | ||
| * | ||
| * return <motion.div animate={animation} onClick={moveRight} /> | ||
| * ``` | ||
| * | ||
| * `start` returns a `Promise`, so animations can be sequenced using `async` functions: | ||
| * | ||
| * ```jsx | ||
| * const sequence = async () => { | ||
| * await animation.start({ opacity: 1 }) | ||
| * return animation.start({ scale: 2 }) | ||
| * } | ||
| * ``` | ||
| * | ||
| * `useAnimation` can optionally accept `variants`: | ||
| * | ||
| * ```jsx | ||
| * const animation = useAnimation({ | ||
| * visible: { opacity: 1 }, | ||
| * hidden: { opacity: 0 } | ||
| * }) | ||
| * ``` | ||
| * | ||
| * That can be later referenced by `start`: | ||
| * | ||
| * ```jsx | ||
| * animation.start('visible') | ||
| * ``` | ||
| * | ||
| * @params variants - List of variants. Optional | ||
| * @returns Animation controller with `start` and `stop` methods | ||
| * | ||
| * @public | ||
| */ | ||
| export declare const useAnimation: (variants?: Variants | undefined, defaultTransition?: import("../types").TransitionMap | (import("../types").TransitionOrchestration & import("../types").Tween) | (import("../types").TransitionOrchestration & import("../types").Spring) | (import("../types").TransitionOrchestration & import("../types").Decay) | (import("../types").TransitionOrchestration & import("../types").Inertia) | (import("../types").TransitionOrchestration & import("../types").Keyframes) | (import("../types").TransitionOrchestration & import("../types").Physics) | (import("../types").TransitionOrchestration & import("../types").Just) | (import("../types").TransitionOrchestration & import("../types").None) | undefined) => AnimationManager; | ||
| export declare function useAnimation(variants?: Variants, defaultTransition?: Transition): AnimationGroupControls; | ||
@@ -537,3 +675,3 @@ /** | ||
| * | ||
| * return <Frame animate={{ x }} onClick={cycleX} /> | ||
| * return <motion.div animate={{ x }} onClick={cycleX} /> | ||
| * ``` | ||
@@ -561,6 +699,37 @@ * | ||
| */ | ||
| export declare const useCycle: <T>(items: T[], initialIndex?: number) => [T, (i?: any) => void]; | ||
| export declare function useCycle<T>(items: T[], initialIndex?: number): [T, (i?: any) => void]; | ||
| /** | ||
| * Add pan and tap gesture recognition to an element. | ||
| * | ||
| * @remarks | ||
| * `useGestures` is an unopinionated way to add pan and tap gesture recognition to an element. | ||
| * | ||
| * ## Pan | ||
| * | ||
| * A pan is defined as when a user's pointer presses an element and move beyond and initial threshold. | ||
| * | ||
| * The pan gesture can be handled with three event handlers: `onPanStart`, `onPan` and `onPanEnd`. | ||
| * | ||
| * Each event handler function receives the originating pointer event as its first argument. | ||
| * | ||
| * As a second argument, the following pointer information is provided as x/y coordinates: | ||
| * | ||
| * - `point`: The point, relative to the page | ||
| * - `delta`: The movement from the previous pan movement | ||
| * - `offset`: The movement from the point's origin, | ||
| * - `velocity`: The velocity of the point | ||
| * | ||
| * ## Tap | ||
| * | ||
| * A tap is defined as a user pressing their pointer on an element and releasing it on the same element. | ||
| * | ||
| * The tap gesture can be handled with three event handlers: `onTapStart`, `onTap`, `onTapCancel`. | ||
| * | ||
| * Each event handler function receives the originating pointer event as its first argument. | ||
| * | ||
| * As a second argument, the following pointer information is provided as x/y coordinates: | ||
| * | ||
| * - `point`: The point, relative to the page | ||
| * | ||
| * @param props | ||
@@ -570,3 +739,3 @@ * @param ref | ||
| */ | ||
| export declare const useGestures: <P extends GestureHandlers>(props: P, ref: RefObject<Element>) => void; | ||
| export declare function useGestures<P extends GestureHandlers>(props: P, ref: RefObject<Element>): void; | ||
@@ -605,5 +774,7 @@ /** | ||
| * @param {number | string} init - The initial state of the `MotionValue` | ||
| * @returns `MotionValue` | ||
| * | ||
| * @public | ||
| */ | ||
| export declare const useMotionValue: <T>(init: T) => MotionValue<T>; | ||
| export declare function useMotionValue<T>(init: T): MotionValue<T>; | ||
@@ -614,3 +785,3 @@ /** | ||
| * @param ref | ||
| * @public | ||
| * @internal | ||
| */ | ||
@@ -624,5 +795,4 @@ export declare function usePanGesture(handlers: PanHandlers, ref: RefObject<Element>): undefined; | ||
| /** | ||
| * | ||
| * @param handlers | ||
| * @public | ||
| * @internal | ||
| */ | ||
@@ -636,5 +806,8 @@ export declare function useTapGesture(handlers: TapHandlers & ControlsProp): { | ||
| /** | ||
| * Creates a new `MotionValue` that takes the output of another `MotionValue` and transforms it with a function | ||
| * | ||
| * @param value | ||
| * @param transform | ||
| * @param value - `MotionValue` | ||
| * @param transform - Function that accepts the output of `value` and returns a new value. | ||
| * @returns `MotionValue` | ||
| * | ||
| * @public | ||
@@ -644,13 +817,40 @@ */ | ||
| /** | ||
| * Creates a new `MotionValue` that takes the output of another `MotionValue` and transforms between the `from` range to the `to` range. | ||
| * | ||
| * @remarks | ||
| * Options: | ||
| * - `clamp`: Default `true`. Clamps output to the provided array | ||
| * | ||
| * @param value - `MotionValue` | ||
| * @param from - A linear series of numbers (either all increasing or decreasing) | ||
| * @param to - A series of numbers, colors or strings. Must be the same length as `from`. | ||
| * @param options - Options | ||
| * @returns `MotionValue` | ||
| * | ||
| * @public | ||
| */ | ||
| export declare function useTransformedValue(value: MotionValue<number>, from: number[], to: any[], options?: TransformerOptions): MotionValue; | ||
| /** | ||
| * `useViewportScroll` provides `MotionValue`s that update when the viewport scrolls. | ||
| * Provides `MotionValue`s that update when the viewport scrolls. | ||
| * | ||
| * This makes it possible to transform viewport scroll into other values. | ||
| * @remarks | ||
| * | ||
| * For instance, highlighting different table of contents items to correspond with page scroll. | ||
| * This makes it possible to transform viewport scrolls into other values. | ||
| * | ||
| * Four `MotionValue`s are returned: | ||
| * | ||
| * - `scrollX`/`scrollY`: The x/y scroll offset in pixels. | ||
| * - `scrollXProgress`/`scrollYProgress`: The x/y scroll offset as a progress value between `0` and `1`. | ||
| * | ||
| * ```jsx | ||
| * const { scrollX } = useViewportScrollValues() | ||
| * ``` | ||
| * | ||
| * @returns `{ scrollX, scrollY, scrollXProgress, scrollYProgress }` `MotionValue`s | ||
| * | ||
| * @public | ||
| */ | ||
| export declare const useViewportScrollValues: () => { | ||
| export declare function useViewportScrollValues(): { | ||
| scrollX: import(".").MotionValue<number>; | ||
@@ -657,0 +857,0 @@ scrollY: import(".").MotionValue<number>; |
| { | ||
| "name": "framer-motion", | ||
| "version": "0.3.5", | ||
| "version": "0.4.0", | ||
| "main": "dist/framer-motion.cjs.js", | ||
| "module": "dist/framer-motion.es.js", | ||
| "types": "dist/index.d.ts", | ||
| "types": "dist/framer-motion.d.ts", | ||
| "author": "Framer Motion", | ||
@@ -8,0 +8,0 @@ "license": "MIT", |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is too big to display
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Worsened metrics
- Total package byte prevSize
- decreased by-1.13%
546888
- Lines of code
- decreased by-5%
12363
No dependency changes