Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@contentful/f36-popover

Package Overview
Dependencies
Maintainers
102
Versions
329
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@contentful/f36-popover - npm Package Compare versions

Comparing version 4.0.1-next-v4-6811.2284 to 4.0.1-next-v4-6831.2285

2

dist/main.js

@@ -1,2 +0,2 @@

var e=require("react"),t=b(e),{useMemo:o,useEffect:r,useCallback:n,useState:s}=e,{mergeRefs:l,useId:a}=require("@contentful/f36-core"),{usePopper:i}=require("react-popper"),u=b(require("@babel/runtime/helpers/extends")),{cx:c,css:p}=require("emotion"),{Portal:d}=require("@contentful/f36-utils"),f=b(require("@contentful/f36-tokens"));function m(e,t,o,r){Object.defineProperty(e,t,{get:o,set:r,enumerable:!0,configurable:!0})}function b(e){return e&&e.__esModule?e.default:e}var v={};m(v,"Popover",(()=>x)),m(v,"PopoverTrigger",(()=>y)),m(v,"PopoverContent",(()=>O));const P=t.createContext(void 0),g=()=>{const e=t.useContext(P);if(void 0===e)throw new Error("usePopoverContext must be used within a PopoverContextProvider");return e},h=P.Provider;function x(e){const{children:u,isOpen:c,placement:p="bottom-start",isFullWidth:d=!1,isAutoalignmentEnabled:f=!0,usePortal:m=!0,closeOnBlur:b=!0,closeOnEsc:v=!0,onClose:P,autoFocus:g=!0}=e,[x,y]=s(null),[E,O]=s(null),{attributes:q,forceUpdate:C,styles:k}=i(x,E,{placement:p,modifiers:[{name:"offset",options:{offset:[0,4]}},{...w,enabled:d},{name:"preventOverflow",enabled:f,options:{mainAxis:!0}},{name:"flip",enabled:f}]});r((()=>{c&&g&&E&&E.focus({preventScroll:!0})}),[c,E]),r((()=>{C&&C()}),[u,C]);const B=a(null,"popover-content"),D=n((()=>{P&&P()}),[P]),I=o((()=>({isOpen:c,usePortal:m,getTriggerProps:(e=null)=>({ref:l(y,e),"aria-expanded":Boolean(c),"aria-controls":B}),getPopoverProps:(e={},t=null)=>({...e,...q.popper,style:{...e.style||{},...k.popper},ref:l(O,t),id:B,onBlur:t=>{if(e.onBlur&&e.onBlur(t),!b)return;const o=t.relatedTarget,r=E===o||E.contains(o),n=x===o||x.contains(o);r||n||D()},onKeyDown:t=>{e.onKeyDown&&e.onKeyDown(t),v&&"Escape"===t.key&&D()}})})),[c,q,k,m,B,v,b,E,x,D]);return t.createElement(h,{value:I},u)}const w={name:"sameWidth",enabled:!0,phase:"beforeWrite",requires:["computeStyles"],fn:({state:e})=>{e.styles.popper.width=`${e.rects.reference.width}px`},effect:({state:e})=>()=>{const t=e.elements.reference;e.elements.popper.style.width=`${t.offsetWidth}px`}},y=e=>{const o=t.Children.only(e.children),{getTriggerProps:r}=g();return t.cloneElement(o,{...o.props,...r(o.props.ref),"aria-haspopup":"dialog"})},E=(e,o)=>{const{children:r,className:n,testId:s="cf-ui-popover-content",...l}=e,a={container:p({background:f.colorWhite,border:0,borderRadius:f.borderRadiusMedium,boxShadow:f.boxShadowDefault,zIndex:f.zIndexDropdown},"")},{isOpen:i,getPopoverProps:m,usePortal:b}=g(),v=t.createElement("div",u({},m(l,o),{className:c(a.container,n),"data-test-id":s,tabIndex:-1,role:"dialog","data-position-absolute":!0}),r);return i?b?t.createElement(d,null,v):v:null},O=t.forwardRef(E);var q,C;q=module.exports,C=v,Object.keys(C).forEach((function(e){"default"!==e&&"__esModule"!==e&&Object.defineProperty(q,e,{enumerable:!0,get:function(){return C[e]}})}));
var e=require("react"),t=b(e),{useCallback:o,useState:r,useMemo:n,useEffect:s}=e,{useId:l,mergeRefs:a}=require("@contentful/f36-core"),{usePopper:i}=require("react-popper"),u=b(require("@babel/runtime/helpers/extends")),{cx:c,css:p}=require("emotion"),{Portal:d}=require("@contentful/f36-utils"),f=b(require("@contentful/f36-tokens"));function m(e,t,o,r){Object.defineProperty(e,t,{get:o,set:r,enumerable:!0,configurable:!0})}function b(e){return e&&e.__esModule?e.default:e}var v={};m(v,"Popover",(()=>x)),m(v,"PopoverTrigger",(()=>y)),m(v,"PopoverContent",(()=>O));const P=t.createContext(void 0),g=()=>{const e=t.useContext(P);if(void 0===e)throw new Error("usePopoverContext must be used within a PopoverContextProvider");return e},h=P.Provider;function x(e){const{children:u,isOpen:c,placement:p="bottom-start",isFullWidth:d=!1,isAutoalignmentEnabled:f=!0,usePortal:m=!0,closeOnBlur:b=!0,closeOnEsc:v=!0,onClose:P,autoFocus:g=!0}=e,[x,y]=r(null),[E,O]=r(null),{attributes:q,forceUpdate:C,styles:k}=i(x,E,{placement:p,modifiers:[{name:"offset",options:{offset:[0,4]}},{...w,enabled:d},{name:"preventOverflow",enabled:f,options:{mainAxis:!0}},{name:"flip",enabled:f}]});s((()=>{c&&g&&E&&E.focus({preventScroll:!0})}),[c,E]),s((()=>{C&&C()}),[u,C]);const B=l(null,"popover-content"),D=o((()=>{P&&P()}),[P]),I=n((()=>({isOpen:c,usePortal:m,getTriggerProps:(e=null)=>({ref:a(y,e),"aria-expanded":Boolean(c),"aria-controls":B}),getPopoverProps:(e={},t=null)=>({...e,...q.popper,style:{...e.style||{},...k.popper},ref:a(O,t),id:B,onBlur:t=>{if(e.onBlur&&e.onBlur(t),!b)return;const o=t.relatedTarget,r=E===o||E.contains(o),n=x===o||x.contains(o);r||n||D()},onKeyDown:t=>{e.onKeyDown&&e.onKeyDown(t),v&&"Escape"===t.key&&D()}})})),[c,q,k,m,B,v,b,E,x,D]);return t.createElement(h,{value:I},u)}const w={name:"sameWidth",enabled:!0,phase:"beforeWrite",requires:["computeStyles"],fn:({state:e})=>{e.styles.popper.width=`${e.rects.reference.width}px`},effect:({state:e})=>()=>{const t=e.elements.reference;e.elements.popper.style.width=`${t.offsetWidth}px`}},y=e=>{const o=t.Children.only(e.children),{getTriggerProps:r}=g();return t.cloneElement(o,{...o.props,...r(o.props.ref),"aria-haspopup":"dialog"})},E=(e,o)=>{const{children:r,className:n,testId:s="cf-ui-popover-content",...l}=e,a={container:p({background:f.colorWhite,border:0,borderRadius:f.borderRadiusMedium,boxShadow:f.boxShadowDefault,zIndex:f.zIndexDropdown},"")},{isOpen:i,getPopoverProps:m,usePortal:b}=g(),v=t.createElement("div",u({},m(l,o),{className:c(a.container,n),"data-test-id":s,tabIndex:-1,role:"dialog","data-position-absolute":!0}),r);return i?b?t.createElement(d,null,v):v:null},O=t.forwardRef(E);var q,C;q=module.exports,C=v,Object.keys(C).forEach((function(e){"default"!==e&&"__esModule"!==e&&Object.defineProperty(q,e,{enumerable:!0,get:function(){return C[e]}})}));
//# sourceMappingURL=main.js.map

@@ -1,2 +0,2 @@

import e,{useEffect as o,useCallback as t,useMemo as r,useState as n}from"react";import{mergeRefs as s,useId as a}from"@contentful/f36-core";import{usePopper as l}from"react-popper";import i from"@babel/runtime/helpers/esm/extends";import{cx as p,css as c}from"emotion";import{Portal as u}from"@contentful/f36-utils";import d from"@contentful/f36-tokens";function f(e,o,t,r){Object.defineProperty(e,o,{get:t,set:r,enumerable:!0,configurable:!0})}var m={};f(m,"Popover",(()=>g)),f(m,"PopoverTrigger",(()=>x)),f(m,"PopoverContent",(()=>y));const b=e.createContext(void 0),v=()=>{const o=e.useContext(b);if(void 0===o)throw new Error("usePopoverContext must be used within a PopoverContextProvider");return o},P=b.Provider;function g(i){const{children:p,isOpen:c,placement:u="bottom-start",isFullWidth:d=!1,isAutoalignmentEnabled:f=!0,usePortal:m=!0,closeOnBlur:b=!0,closeOnEsc:v=!0,onClose:g,autoFocus:x=!0}=i,[w,y]=n(null),[C,E]=n(null),{attributes:O,forceUpdate:B,styles:D}=l(w,C,{placement:u,modifiers:[{name:"offset",options:{offset:[0,4]}},{...h,enabled:d},{name:"preventOverflow",enabled:f,options:{mainAxis:!0}},{name:"flip",enabled:f}]});o((()=>{c&&x&&C&&C.focus({preventScroll:!0})}),[c,C]),o((()=>{B&&B()}),[p,B]);const I=a(null,"popover-content"),S=t((()=>{g&&g()}),[g]),T=r((()=>({isOpen:c,usePortal:m,getTriggerProps:(e=null)=>({ref:s(y,e),"aria-expanded":Boolean(c),"aria-controls":I}),getPopoverProps:(e={},o=null)=>({...e,...O.popper,style:{...e.style||{},...D.popper},ref:s(E,o),id:I,onBlur:o=>{if(e.onBlur&&e.onBlur(o),!b)return;const t=o.relatedTarget,r=C===t||C.contains(t),n=w===t||w.contains(t);r||n||S()},onKeyDown:o=>{e.onKeyDown&&e.onKeyDown(o),v&&"Escape"===o.key&&S()}})})),[c,O,D,m,I,v,b,C,w,S]);return e.createElement(P,{value:T},p)}const h={name:"sameWidth",enabled:!0,phase:"beforeWrite",requires:["computeStyles"],fn:({state:e})=>{e.styles.popper.width=`${e.rects.reference.width}px`},effect:({state:e})=>()=>{const o=e.elements.reference;e.elements.popper.style.width=`${o.offsetWidth}px`}},x=o=>{const t=e.Children.only(o.children),{getTriggerProps:r}=v();return e.cloneElement(t,{...t.props,...r(t.props.ref),"aria-haspopup":"dialog"})},w=(o,t)=>{const{children:r,className:n,testId:s="cf-ui-popover-content",...a}=o,l={container:c({background:d.colorWhite,border:0,borderRadius:d.borderRadiusMedium,boxShadow:d.boxShadowDefault,zIndex:d.zIndexDropdown},"")},{isOpen:f,getPopoverProps:m,usePortal:b}=v(),P=e.createElement("div",i({},m(a,t),{className:p(l.container,n),"data-test-id":s,tabIndex:-1,role:"dialog","data-position-absolute":!0}),r);return f?b?e.createElement(u,null,P):P:null},y=e.forwardRef(w);export{g as Popover,x as PopoverTrigger,y as PopoverContent};
import e,{useState as o,useEffect as t,useCallback as r,useMemo as n}from"react";import{useId as s,mergeRefs as a}from"@contentful/f36-core";import{usePopper as l}from"react-popper";import i from"@babel/runtime/helpers/esm/extends";import{cx as p,css as c}from"emotion";import{Portal as u}from"@contentful/f36-utils";import d from"@contentful/f36-tokens";function f(e,o,t,r){Object.defineProperty(e,o,{get:t,set:r,enumerable:!0,configurable:!0})}var m={};f(m,"Popover",(()=>g)),f(m,"PopoverTrigger",(()=>x)),f(m,"PopoverContent",(()=>y));const b=e.createContext(void 0),v=()=>{const o=e.useContext(b);if(void 0===o)throw new Error("usePopoverContext must be used within a PopoverContextProvider");return o},P=b.Provider;function g(i){const{children:p,isOpen:c,placement:u="bottom-start",isFullWidth:d=!1,isAutoalignmentEnabled:f=!0,usePortal:m=!0,closeOnBlur:b=!0,closeOnEsc:v=!0,onClose:g,autoFocus:x=!0}=i,[w,y]=o(null),[C,E]=o(null),{attributes:O,forceUpdate:B,styles:D}=l(w,C,{placement:u,modifiers:[{name:"offset",options:{offset:[0,4]}},{...h,enabled:d},{name:"preventOverflow",enabled:f,options:{mainAxis:!0}},{name:"flip",enabled:f}]});t((()=>{c&&x&&C&&C.focus({preventScroll:!0})}),[c,C]),t((()=>{B&&B()}),[p,B]);const I=s(null,"popover-content"),S=r((()=>{g&&g()}),[g]),T=n((()=>({isOpen:c,usePortal:m,getTriggerProps:(e=null)=>({ref:a(y,e),"aria-expanded":Boolean(c),"aria-controls":I}),getPopoverProps:(e={},o=null)=>({...e,...O.popper,style:{...e.style||{},...D.popper},ref:a(E,o),id:I,onBlur:o=>{if(e.onBlur&&e.onBlur(o),!b)return;const t=o.relatedTarget,r=C===t||C.contains(t),n=w===t||w.contains(t);r||n||S()},onKeyDown:o=>{e.onKeyDown&&e.onKeyDown(o),v&&"Escape"===o.key&&S()}})})),[c,O,D,m,I,v,b,C,w,S]);return e.createElement(P,{value:T},p)}const h={name:"sameWidth",enabled:!0,phase:"beforeWrite",requires:["computeStyles"],fn:({state:e})=>{e.styles.popper.width=`${e.rects.reference.width}px`},effect:({state:e})=>()=>{const o=e.elements.reference;e.elements.popper.style.width=`${o.offsetWidth}px`}},x=o=>{const t=e.Children.only(o.children),{getTriggerProps:r}=v();return e.cloneElement(t,{...t.props,...r(t.props.ref),"aria-haspopup":"dialog"})},w=(o,t)=>{const{children:r,className:n,testId:s="cf-ui-popover-content",...a}=o,l={container:c({background:d.colorWhite,border:0,borderRadius:d.borderRadiusMedium,boxShadow:d.boxShadowDefault,zIndex:d.zIndexDropdown},"")},{isOpen:f,getPopoverProps:m,usePortal:b}=v(),P=e.createElement("div",i({},m(a,t),{className:p(l.container,n),"data-test-id":s,tabIndex:-1,role:"dialog","data-position-absolute":!0}),r);return f?b?e.createElement(u,null,P):P:null},y=e.forwardRef(w);export{g as Popover,x as PopoverTrigger,y as PopoverContent};
//# sourceMappingURL=module.js.map
{
"name": "@contentful/f36-popover",
"version": "4.0.1-next-v4-6811.2284+e70f58a9",
"version": "4.0.1-next-v4-6831.2285+a36c0a0f",
"description": "Forma 36: Popover component",

@@ -10,5 +10,5 @@ "scripts": {

"@babel/runtime": "^7.6.2",
"@contentful/f36-core": "4.0.1-next-v4-6811.2284+e70f58a9",
"@contentful/f36-tokens": "4.0.1-next-v4-6811.2284+e70f58a9",
"@contentful/f36-utils": "4.0.1-next-v4-6811.2284+e70f58a9",
"@contentful/f36-core": "4.0.1-next-v4-6831.2285+a36c0a0f",
"@contentful/f36-tokens": "4.0.1-next-v4-6831.2285+a36c0a0f",
"@contentful/f36-utils": "4.0.1-next-v4-6831.2285+a36c0a0f",
"@popperjs/core": "^2.4.4",

@@ -39,3 +39,3 @@ "emotion": "^10.0.17",

},
"gitHead": "e70f58a9db293569e511c624deb789c471a1bb53"
"gitHead": "a36c0a0f6b84fd2eba07adac8e15dbc5cf1c460d"
}
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc