@interop-ui/react-presence - npm Package Compare versions

Comparing version 0.0.1-2 to 0.2.0-rc.1

dist/index.d.ts

 import * as React from "react";
-export type PresenceProps = {
+export interface PresenceProps {
     present: boolean;
@@ -7,5 +7,5 @@ children: React.ReactElement | ((props: {
     }) => React.ReactElement);
-};
+}
 export const Presence: React.FC<PresenceProps>;
 
 //# sourceMappingURL=index.d.ts.map

dist/index.js

@@ -1,2 +0,2 @@
-var n,e,t=require("@xstate/fsm"),r=t.createMachine,i=t.interpret,u=require("@interop-ui/react-utils").useComposedRefs,o=(n={},e=require("react"),Object.keys(e).forEach((function(t){"default"!==t&&"__esModule"!==t&&Object.defineProperty(n,t,{enumerable:!0,get:function(){return e[t]}})})),n);function a(n,e){return function(n){if(Array.isArray(n))return n}(n)||function(n,e){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(n)))return;var t=[],r=!0,i=!1,u=void 0;try{for(var o,a=n[Symbol.iterator]();!(r=(o=a.next()).done)&&(t.push(o.value),!e||t.length!==e);r=!0);}catch(n){i=!0,u=n}finally{try{r||null==a.return||a.return()}finally{if(i)throw u}}return t}(n,e)||function(n,e){if(!n)return;if("string"==typeof n)return c(n,e);var t=Object.prototype.toString.call(n).slice(8,-1);"Object"===t&&n.constructor&&(t=n.constructor.name);if("Map"===t||"Set"===t)return Array.from(n);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return c(n,e)}(n,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function c(n,e){(null==e||e>n.length)&&(e=n.length);for(var t=0,r=new Array(e);t<e;t++)r[t]=n[t];return r}function s(n,e){return function(n){if(Array.isArray(n))return n}(n)||function(n,e){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(n)))return;var t=[],r=!0,i=!1,u=void 0;try{for(var o,a=n[Symbol.iterator]();!(r=(o=a.next()).done)&&(t.push(o.value),!e||t.length!==e);r=!0);}catch(n){i=!0,u=n}finally{try{r||null==a.return||a.return()}finally{if(i)throw u}}return t}(n,e)||function(n,e){if(!n)return;if("string"==typeof n)return f(n,e);var t=Object.prototype.toString.call(n).slice(8,-1);"Object"===t&&n.constructor&&(t=n.constructor.name);if("Map"===t||"Set"===t)return Array.from(n);if("Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t))return f(n,e)}(n,e)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function f(n,e){(null==e||e>n.length)&&(e=n.length);for(var t=0,r=new Array(e);t<e;t++)r[t]=n[t];return r}var l=function(n){var e=n.present,t=n.children,c=function(n){var e=s(o.useState(),2),t=e[0],u=e[1],c=s(o.useState(),2),f=c[0],l=c[1],m=o.useRef(n),v=o.useRef(),y=function(n){var e=a(o.useState((function(){return i(r(n))})),1)[0],t=a(o.useState(n.initial),2),u=t[0],c=t[1],s=a(o.useState(n.context),2),f=s[0],l=s[1];return o.useEffect((function(){var n=e.subscribe((function(n){c(n.value),l(n.context)}));return e.start(),function(){n.unsubscribe(),e.stop()}}),[e]),o.useMemo((function(){return{state:u,context:f,send:e.send}}),[u,f,e])}({id:"presence",initial:n?"mounted":"unmounted",states:{mounted:{on:{UNMOUNT:"unmounted",ANIMATION_OUT:"unmountSuspended",TRANSITION_OUT:"unmountSuspended"}},unmountSuspended:{on:{ANIMATION_END:"unmounted",TRANSITION_END:"unmounted"}},unmounted:{on:{MOUNT:"mounted"}}}}),p=y.state,A=y.send;return o.useEffect((function(){if(t){var n=getComputedStyle(t);v.current=d(n),l(n)}}),[t]),o.useEffect((function(){return function(){var n,e,t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:function(){},r=requestAnimationFrame((function(){n=requestAnimationFrame((function(){e=requestAnimationFrame(t)}))}));return function(){cancelAnimationFrame(r),cancelAnimationFrame(n),cancelAnimationFrame(e)}}((function(){var e=m.current,t=v.current,r=d(f),i=String(t)!==String(r);v.current=r,m.current=n,A(n?"MOUNT":e&&i?"none"===(null==f?void 0:f.display)?"UNMOUNT":"ANIMATION_OUT":"UNMOUNT")}))}),[n,f,A]),o.useEffect((function(){if(t){var e=function(e){var r=m.current,i=!n&&r;e.target===t&&i&&A("TRANSITION_OUT")},r=function(n){n.target===t&&A("TRANSITION_END")},i=function(n){n.target===t&&A("ANIMATION_END")};return t.addEventListener("animationcancel",i),t.addEventListener("animationend",i),t.addEventListener("transitionrun",e),t.addEventListener("transitioncancel",r),t.addEventListener("transitionend",r),function(){t.removeEventListener("animationcancel",i),t.removeEventListener("animationend",i),t.removeEventListener("transitionrun",e),t.removeEventListener("transitioncancel",r),t.removeEventListener("transitionend",r)}}}),[t,n,A]),{ref:function(n){return u(n)},isPresent:["mounted","unmountSuspended"].includes(p)}}(e),f="function"==typeof t?t({present:c.isPresent}):o.Children.only(t),l=u(c.ref,f.ref);return"function"==typeof t||c.isPresent?o.cloneElement(f,{ref:l}):null};function d(n){return(null==n?void 0:n.animationName)||"none"}exports.Presence=l,l.displayName="Presence";
+var e,n,t=require("@interop-ui/react-use-layout-effect").useLayoutEffect,u=require("@interop-ui/react-compose-refs").useComposedRefs,r=(e={},n=require("react"),Object.keys(n).forEach((function(t){"default"!==t&&"__esModule"!==t&&Object.defineProperty(e,t,{enumerable:!0,get:function(){return n[t]}})})),e);const o=e=>{const{present:n,children:o}=e,c=function(e){const[n,u]=r.useState(),o=r.useRef({}),c=r.useRef(e),i=r.useRef("none"),d=e?"mounted":"unmounted",[a,f]=function(e,n){return r.useReducer(((e,t)=>{const u=n[e][t];return null!=u?u:e}),e)}(d,{mounted:{UNMOUNT:"unmounted",ANIMATION_OUT:"unmountSuspended"},unmountSuspended:{MOUNT:"mounted",ANIMATION_END:"unmounted"},unmounted:{MOUNT:"mounted"}});return r.useEffect((()=>{const e=s(o.current);i.current="mounted"===a?e:"none"}),[a]),t((()=>{const n=o.current,t=c.current;if(t!==e){const u=i.current,r=s(n);if(e)f("MOUNT");else if("none"===r||"none"===(null==n?void 0:n.display))f("UNMOUNT");else{const e=u!==r;f(t&&e?"ANIMATION_OUT":"UNMOUNT")}c.current=e}}),[e,f]),t((()=>{if(n){const e=e=>{const t=s(o.current).includes(e.animationName);e.target===n&&t&&f("ANIMATION_END")};return n.addEventListener("animationcancel",e),n.addEventListener("animationend",e),()=>{n.removeEventListener("animationcancel",e),n.removeEventListener("animationend",e)}}}),[n,f]),{isPresent:["mounted","unmountSuspended"].includes(a),ref:r.useCallback((e=>{e&&(o.current=getComputedStyle(e)),u(e)}),[])}}(n),i="function"==typeof o?o({present:c.isPresent}):r.Children.only(o),d=u(c.ref,i.ref);return"function"==typeof o||c.isPresent?/*#__PURE__*/r.cloneElement(i,{ref:d}):null};function s(e){return(null==e?void 0:e.animationName)||"none"}exports.Presence=o,o.displayName="Presence";
 //# sourceMappingURL=index.js.map

dist/index.module.js

@@ -1,2 +0,2 @@
-import{createMachine as e,interpret as n}from"@xstate/fsm";import{useComposedRefs as t}from"@interop-ui/react-utils";import*as r from"react";export const Presence=s=>{const{present:o,children:u}=s,a=function(t){const[s,o]=r.useState(),[u,a]=r.useState(),c=r.useRef(t),m=r.useRef(),{state:d,send:N}=function(t){const[i]=r.useState((()=>n(e(t)))),[s,o]=r.useState(t.initial),[u,a]=r.useState(t.context);return r.useEffect((()=>{const e=i.subscribe((e=>{o(e.value),a(e.context)}));return i.start(),()=>{e.unsubscribe(),i.stop()}}),[i]),r.useMemo((()=>({state:s,context:u,send:i.send})),[s,u,i])}({id:"presence",initial:t?"mounted":"unmounted",states:{mounted:{on:{UNMOUNT:"unmounted",ANIMATION_OUT:"unmountSuspended",TRANSITION_OUT:"unmountSuspended"}},unmountSuspended:{on:{ANIMATION_END:"unmounted",TRANSITION_END:"unmounted"}},unmounted:{on:{MOUNT:"mounted"}}}});return r.useEffect((()=>{if(s){const e=getComputedStyle(s);m.current=i(e),a(e)}}),[s]),r.useEffect((()=>function(e=(()=>{})){let n,t;const r=requestAnimationFrame((()=>{n=requestAnimationFrame((()=>{t=requestAnimationFrame(e)}))}));return()=>{cancelAnimationFrame(r),cancelAnimationFrame(n),cancelAnimationFrame(t)}}((()=>{const e=c.current,n=m.current,r=i(u),s=String(n)!==String(r);m.current=r,c.current=t,N(t?"MOUNT":e&&s?"none"===(null==u?void 0:u.display)?"UNMOUNT":"ANIMATION_OUT":"UNMOUNT")}))),[t,u,N]),r.useEffect((()=>{if(s){const e=e=>{const n=c.current,r=!t&&n;e.target===s&&r&&N("TRANSITION_OUT")},n=e=>{e.target===s&&N("TRANSITION_END")},r=e=>{e.target===s&&N("ANIMATION_END")};return s.addEventListener("animationcancel",r),s.addEventListener("animationend",r),s.addEventListener("transitionrun",e),s.addEventListener("transitioncancel",n),s.addEventListener("transitionend",n),()=>{s.removeEventListener("animationcancel",r),s.removeEventListener("animationend",r),s.removeEventListener("transitionrun",e),s.removeEventListener("transitioncancel",n),s.removeEventListener("transitionend",n)}}}),[s,t,N]),{ref:e=>o(e),isPresent:["mounted","unmountSuspended"].includes(d)}}(o),c="function"==typeof u?u({present:a.isPresent}):r.Children.only(u),m=t(a.ref,c.ref);return"function"==typeof u||a.isPresent?r.cloneElement(c,{ref:m}):null};function i(e){return(null==e?void 0:e.animationName)||"none"}Presence.displayName="Presence";
+import{useLayoutEffect as e}from"@interop-ui/react-use-layout-effect";import{useComposedRefs as n}from"@interop-ui/react-compose-refs";import*as t from"react";export const Presence=u=>{const{present:o,children:s}=u,i=function(n){const[u,o]=t.useState(),s=t.useRef({}),i=t.useRef(n),c=t.useRef("none"),m=n?"mounted":"unmounted",[d,a]=function(e,n){return t.useReducer(((e,t)=>{const r=n[e][t];return null!=r?r:e}),e)}(m,{mounted:{UNMOUNT:"unmounted",ANIMATION_OUT:"unmountSuspended"},unmountSuspended:{MOUNT:"mounted",ANIMATION_END:"unmounted"},unmounted:{MOUNT:"mounted"}});return t.useEffect((()=>{const e=r(s.current);c.current="mounted"===d?e:"none"}),[d]),e((()=>{const e=s.current,t=i.current;if(t!==n){const u=c.current,o=r(e);if(n)a("MOUNT");else if("none"===o||"none"===(null==e?void 0:e.display))a("UNMOUNT");else{const e=u!==o;a(t&&e?"ANIMATION_OUT":"UNMOUNT")}i.current=n}}),[n,a]),e((()=>{if(u){const e=e=>{const n=r(s.current).includes(e.animationName);e.target===u&&n&&a("ANIMATION_END")};return u.addEventListener("animationcancel",e),u.addEventListener("animationend",e),()=>{u.removeEventListener("animationcancel",e),u.removeEventListener("animationend",e)}}}),[u,a]),{isPresent:["mounted","unmountSuspended"].includes(d),ref:t.useCallback((e=>{e&&(s.current=getComputedStyle(e)),o(e)}),[])}}(o),c="function"==typeof s?s({present:i.isPresent}):t.Children.only(s),m=n(i.ref,c.ref);return"function"==typeof s||i.isPresent?/*#__PURE__*/t.cloneElement(c,{ref:m}):null};function r(e){return(null==e?void 0:e.animationName)||"none"}Presence.displayName="Presence";
 //# sourceMappingURL=index.module.js.map

package.json

 {
   "name": "@interop-ui/react-presence",
-  "version": "0.0.1-2",
+  "version": "0.2.0-rc.1",
   "license": "MIT",
@@ -15,17 +15,22 @@ "source": "src/index.ts",
   "scripts": {
-    "build": "parcel build src/index.ts --no-cache",
     "clean": "rm -rf dist",
-    "version": "yarn version",
-    "prepublish": "yarn clean && yarn build"
+    "version": "yarn version"
   },
   "dependencies": {
-    "@interop-ui/react-utils": "0.0.1-16",
-    "@xstate/fsm": "^1.5.1"
+    "@babel/runtime": "^7.13.10",
+    "@interop-ui/react-compose-refs": "0.2.0-rc.1",
+    "@interop-ui/react-use-layout-effect": "0.2.0-rc.1"
   },
-  "devDependencies": {
-    "parcel": "^2.0.0-beta.1"
-  },
   "peerDependencies": {
     "react": ">=16.8"
-  }
+  },
+  "homepage": "https://radix-ui.com/primitives",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/radix-ui/primitives.git"
+  },
+  "bugs": {
+    "url": "https://github.com/radix-ui/primitives/issues"
+  },
+  "stableVersion": "0.1.0"
 }

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

No bug tracker

Maintenance

Package does not have a linked bug tracker in package.json.

Found 1 instance in 1 package

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Improved metrics

Dev dependency count

0

decreased by-100%

Number of low maintenance alerts

1

decreased by-50%

Number of low quality alerts

2

decreased by-33.33%

Number of low supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

22716

decreased by-29.1%

Dependency count

4

increased by33.33%

Lines of code

25

decreased by-34.21%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@babel/runtime@^7.13.10

• + Added@interop-ui/react-compose-refs@0.2.0-rc.1

• + Added@interop-ui/react-use-layout-effect@0.2.0-rc.1

• + Added@babel/runtime@7.26.9(transitive)

• + Added@interop-ui/react-compose-refs@0.2.0-rc.1(transitive)

• + Added@interop-ui/react-use-layout-effect@0.2.0-rc.1(transitive)

• + Addedregenerator-runtime@0.14.1(transitive)

• - Removed@interop-ui/react-utils@0.0.1-16

• - Removed@xstate/fsm@^1.5.1

• - Removed@interop-ui/react-polymorphic@0.0.1-3(transitive)

• - Removed@interop-ui/react-utils@0.0.1-16(transitive)

• - Removed@interop-ui/utils@0.0.1-8(transitive)

• - Removed@xstate/fsm@1.6.5(transitive)