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

@contentful/f36-popover

Package Overview
Dependencies
Maintainers
105
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-9019.2404 to 4.0.1-next-v4-9049.2406

2

dist/main.js

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

var e=require("react"),t=b(e),{useEffect:o,useCallback:r,useState:n,useMemo: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",(()=>C)),m(v,"PopoverTrigger",(()=>E)),m(v,"PopoverContent",(()=>y));const g=t.createContext(void 0),h=()=>{const e=t.useContext(g);if(void 0===e)throw new Error("usePopoverContext must be used within a PopoverContextProvider");return e},P=g.Provider;const x={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`}},w=(e,o)=>{const{children:r,className:n,testId:s="cf-ui-popover-content",role:l="dialog",...a}=e,i={container:p({background:f.colorWhite,border:0,borderRadius:f.borderRadiusMedium,boxShadow:f.boxShadowDefault,zIndex:f.zIndexDropdown},"")},{isOpen:m,getPopoverProps:b,usePortal:v}=h(),g=t.createElement("div",u({},a,b(a,o),{className:c(i.container,n),"data-test-id":s,tabIndex:-1,role:l,"data-position-absolute":!0}),r);return m?v?t.createElement(d,null,g):g:null},y=t.forwardRef(w),E=e=>{var o;const r=t.Children.only(e.children),{getTriggerProps:n}=h();return t.cloneElement(r,{...n(r.ref),"aria-haspopup":null!==(o=r.props["aria-haspopup"])&&void 0!==o?o:"dialog"})},C=function(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:g,autoFocus:h=!0}=e,[w,y]=n(null),[E,C]=n(null),{attributes:O,forceUpdate:q,styles:k}=i(w,E,{placement:p,modifiers:[{name:"offset",options:{offset:[1,4]}},{...x,enabled:d},{name:"preventOverflow",enabled:f,options:{mainAxis:!0}},{name:"flip",enabled:f}]});o((()=>{c&&h&&E&&E.focus({preventScroll:!0})}),[c,E]),o((()=>{q&&q()}),[u,q]);const B=l(null,"popover-content"),D=r((()=>{g&&g()}),[g]),I=s((()=>({isOpen:c,usePortal:m,getTriggerProps:(e=null)=>({ref:a(y,e),"aria-expanded":Boolean(c),"aria-controls":B}),getPopoverProps:(e={},t=null)=>({...O.popper,style:{...e.style||{},...k.popper},ref:a(C,t),id:B,onBlur:t=>{if(e.onBlur&&e.onBlur(t),!b)return;const o=t.relatedTarget,r=E===o||E.contains(o),n=w===o||w.contains(o);r||n||D()},onKeyDown:t=>{e.onKeyDown&&e.onKeyDown(t),v&&"Escape"===t.key&&D()}})})),[c,O,k,m,B,v,b,E,w,D]);return t.createElement(P,{value:I},u)};var O,q;C.Content=y,C.Trigger=E,O=module.exports,q=v,Object.keys(q).forEach((function(e){"default"!==e&&"__esModule"!==e&&Object.defineProperty(O,e,{enumerable:!0,get:function(){return q[e]}})}));
var e=require("react"),t=b(e),{useState:o,useCallback:r,useMemo:n,useEffect: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",(()=>C)),m(v,"PopoverTrigger",(()=>E)),m(v,"PopoverContent",(()=>y));const g=t.createContext(void 0),h=()=>{const e=t.useContext(g);if(void 0===e)throw new Error("usePopoverContext must be used within a PopoverContextProvider");return e},P=g.Provider;const x={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`}},w=(e,o)=>{const{children:r,className:n,testId:s="cf-ui-popover-content",role:l="dialog",...a}=e,i={container:p({background:f.colorWhite,border:0,borderRadius:f.borderRadiusMedium,boxShadow:f.boxShadowDefault,zIndex:f.zIndexDropdown},"")},{isOpen:m,getPopoverProps:b,usePortal:v}=h(),g=t.createElement("div",u({},a,b(a,o),{className:c(i.container,n),"data-test-id":s,tabIndex:-1,role:l,"data-position-absolute":!0}),r);return m?v?t.createElement(d,null,g):g:null},y=t.forwardRef(w),E=e=>{var o;const r=t.Children.only(e.children),{getTriggerProps:n}=h();return t.cloneElement(r,{...n(r.ref),"aria-haspopup":null!==(o=r.props["aria-haspopup"])&&void 0!==o?o:"dialog"})},C=function(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:g,autoFocus:h=!0}=e,[w,y]=o(null),[E,C]=o(null),{attributes:O,forceUpdate:q,styles:k}=i(w,E,{placement:p,modifiers:[{name:"offset",options:{offset:[1,4]}},{...x,enabled:d},{name:"preventOverflow",enabled:f,options:{mainAxis:!0}},{name:"flip",enabled:f}]});s((()=>{c&&h&&E&&E.focus({preventScroll:!0})}),[c,E]),s((()=>{q&&q()}),[u,q]);const B=a(null,"popover-content"),D=r((()=>{g&&g()}),[g]),I=n((()=>({isOpen:c,usePortal:m,getTriggerProps:(e=null)=>({ref:l(y,e),"aria-expanded":Boolean(c),"aria-controls":B}),getPopoverProps:(e={},t=null)=>({...O.popper,style:{...e.style||{},...k.popper},ref:l(C,t),id:B,onBlur:t=>{if(e.onBlur&&e.onBlur(t),!b)return;const o=t.relatedTarget,r=E===o||E.contains(o),n=w===o||w.contains(o);r||n||D()},onKeyDown:t=>{e.onKeyDown&&e.onKeyDown(t),v&&"Escape"===t.key&&D()}})})),[c,O,k,m,B,v,b,E,w,D]);return t.createElement(P,{value:I},u)};var O,q;C.Content=y,C.Trigger=E,O=module.exports,q=v,Object.keys(q).forEach((function(e){"default"!==e&&"__esModule"!==e&&Object.defineProperty(O,e,{enumerable:!0,get:function(){return q[e]}})}));
//# sourceMappingURL=main.js.map

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

import e,{useMemo as o,useCallback as t,useEffect as r,useState 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",(()=>y)),f(m,"PopoverTrigger",(()=>w)),f(m,"PopoverContent",(()=>x));const v=e.createContext(void 0),b=()=>{const o=e.useContext(v);if(void 0===o)throw new Error("usePopoverContext must be used within a PopoverContextProvider");return o},g=v.Provider;const P={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`}},h=(o,t)=>{const{children:r,className:n,testId:s="cf-ui-popover-content",role:a="dialog",...l}=o,f={container:c({background:d.colorWhite,border:0,borderRadius:d.borderRadiusMedium,boxShadow:d.boxShadowDefault,zIndex:d.zIndexDropdown},"")},{isOpen:m,getPopoverProps:v,usePortal:g}=b(),P=e.createElement("div",i({},l,v(l,t),{className:p(f.container,n),"data-test-id":s,tabIndex:-1,role:a,"data-position-absolute":!0}),r);return m?g?e.createElement(u,null,P):P:null},x=e.forwardRef(h),w=o=>{var t;const r=e.Children.only(o.children),{getTriggerProps:n}=b();return e.cloneElement(r,{...n(r.ref),"aria-haspopup":null!==(t=r.props["aria-haspopup"])&&void 0!==t?t:"dialog"})},y=function(i){const{children:p,isOpen:c,placement:u="bottom-start",isFullWidth:d=!1,isAutoalignmentEnabled:f=!0,usePortal:m=!0,closeOnBlur:v=!0,closeOnEsc:b=!0,onClose:h,autoFocus:x=!0}=i,[w,y]=n(null),[C,E]=n(null),{attributes:O,forceUpdate:T,styles:B}=l(w,C,{placement:u,modifiers:[{name:"offset",options:{offset:[1,4]}},{...P,enabled:d},{name:"preventOverflow",enabled:f,options:{mainAxis:!0}},{name:"flip",enabled:f}]});r((()=>{c&&x&&C&&C.focus({preventScroll:!0})}),[c,C]),r((()=>{T&&T()}),[p,T]);const D=s(null,"popover-content"),I=t((()=>{h&&h()}),[h]),S=o((()=>({isOpen:c,usePortal:m,getTriggerProps:(e=null)=>({ref:a(y,e),"aria-expanded":Boolean(c),"aria-controls":D}),getPopoverProps:(e={},o=null)=>({...O.popper,style:{...e.style||{},...B.popper},ref:a(E,o),id:D,onBlur:o=>{if(e.onBlur&&e.onBlur(o),!v)return;const t=o.relatedTarget,r=C===t||C.contains(t),n=w===t||w.contains(t);r||n||I()},onKeyDown:o=>{e.onKeyDown&&e.onKeyDown(o),b&&"Escape"===o.key&&I()}})})),[c,O,B,m,D,b,v,C,w,I]);return e.createElement(g,{value:S},p)};y.Content=x,y.Trigger=w;export{y as Popover,w as PopoverTrigger,x as PopoverContent};
import e,{useEffect as o,useMemo as t,useCallback as r,useState 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",(()=>y)),f(m,"PopoverTrigger",(()=>w)),f(m,"PopoverContent",(()=>x));const v=e.createContext(void 0),b=()=>{const o=e.useContext(v);if(void 0===o)throw new Error("usePopoverContext must be used within a PopoverContextProvider");return o},g=v.Provider;const P={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`}},h=(o,t)=>{const{children:r,className:n,testId:s="cf-ui-popover-content",role:a="dialog",...l}=o,f={container:c({background:d.colorWhite,border:0,borderRadius:d.borderRadiusMedium,boxShadow:d.boxShadowDefault,zIndex:d.zIndexDropdown},"")},{isOpen:m,getPopoverProps:v,usePortal:g}=b(),P=e.createElement("div",i({},l,v(l,t),{className:p(f.container,n),"data-test-id":s,tabIndex:-1,role:a,"data-position-absolute":!0}),r);return m?g?e.createElement(u,null,P):P:null},x=e.forwardRef(h),w=o=>{var t;const r=e.Children.only(o.children),{getTriggerProps:n}=b();return e.cloneElement(r,{...n(r.ref),"aria-haspopup":null!==(t=r.props["aria-haspopup"])&&void 0!==t?t:"dialog"})},y=function(i){const{children:p,isOpen:c,placement:u="bottom-start",isFullWidth:d=!1,isAutoalignmentEnabled:f=!0,usePortal:m=!0,closeOnBlur:v=!0,closeOnEsc:b=!0,onClose:h,autoFocus:x=!0}=i,[w,y]=n(null),[C,E]=n(null),{attributes:O,forceUpdate:T,styles:B}=l(w,C,{placement:u,modifiers:[{name:"offset",options:{offset:[1,4]}},{...P,enabled:d},{name:"preventOverflow",enabled:f,options:{mainAxis:!0}},{name:"flip",enabled:f}]});o((()=>{c&&x&&C&&C.focus({preventScroll:!0})}),[c,C]),o((()=>{T&&T()}),[p,T]);const D=s(null,"popover-content"),I=r((()=>{h&&h()}),[h]),S=t((()=>({isOpen:c,usePortal:m,getTriggerProps:(e=null)=>({ref:a(y,e),"aria-expanded":Boolean(c),"aria-controls":D}),getPopoverProps:(e={},o=null)=>({...O.popper,style:{...e.style||{},...B.popper},ref:a(E,o),id:D,onBlur:o=>{if(e.onBlur&&e.onBlur(o),!v)return;const t=o.relatedTarget,r=C===t||C.contains(t),n=w===t||w.contains(t);r||n||I()},onKeyDown:o=>{e.onKeyDown&&e.onKeyDown(o),b&&"Escape"===o.key&&I()}})})),[c,O,B,m,D,b,v,C,w,I]);return e.createElement(g,{value:S},p)};y.Content=x,y.Trigger=w;export{y as Popover,w as PopoverTrigger,x as PopoverContent};
//# sourceMappingURL=module.js.map
{
"name": "@contentful/f36-popover",
"version": "4.0.1-next-v4-9019.2404+c3d467c8",
"version": "4.0.1-next-v4-9049.2406+5faa18e9",
"description": "Forma 36: Popover component",

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

"@babel/runtime": "^7.6.2",
"@contentful/f36-core": "4.0.1-next-v4-9019.2404+c3d467c8",
"@contentful/f36-tokens": "4.0.1-next-v4-9019.2404+c3d467c8",
"@contentful/f36-utils": "4.0.1-next-v4-9019.2404+c3d467c8",
"@contentful/f36-core": "4.0.1-next-v4-9049.2406+5faa18e9",
"@contentful/f36-tokens": "4.0.1-next-v4-9049.2406+5faa18e9",
"@contentful/f36-utils": "4.0.1-next-v4-9049.2406+5faa18e9",
"@popperjs/core": "^2.4.4",

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

},
"gitHead": "c3d467c8a8eb69d3a772f83aa054cb3873ba0ce9"
"gitHead": "5faa18e9d612fc29225fb7357033b6a330aebc2c"
}
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