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

@contentful/f36-inputs

Package Overview
Dependencies
Maintainers
100
Versions
73
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@contentful/f36-inputs - npm Package Compare versions

Comparing version 4.0.1-next-v4-4389.1990 to 4.0.1-next-v4-4457.1996

2

dist/main.js

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

function e(e){return e&&e.__esModule?e.default:e}function o(e,o,t){Object.defineProperty(e,o,{get:t,enumerable:!0})}function t(e,o){return Object.keys(o).forEach((function(t){"default"!==t&&"__esModule"!==t&&Object.defineProperty(e,t,{enumerable:!0,get:function(){return o[t]}})})),e}var{Box:r}=require("@contentful/f36-core"),n=e(require("@contentful/f36-tokens")),{Done:i,Minus:l}=require("@contentful/f36-icons"),a=require("react"),c=e(a),{useCallback:d,useRef:s,useEffect:u}=a,{cx:b,css:h}=require("emotion"),f=e(require("@babel/runtime/helpers/extends")),g={},p={};const m={container:h({position:"relative",textOverflow:"ellipsis",lineHeight:n.lineHeightL,margin:"0",width:n.spacingM,height:n.spacingM,minHeight:n.spacingM,overflow:"visible"},""),input:h({display:"inline-block",fontSize:n.fontSizeM,opacity:"0",position:"absolute",margin:"0",width:n.spacingM,height:n.spacingM,zIndex:n.zIndexDefault,cursor:"pointer","&:focus + label":{outline:"none",border:`2px solid ${n.colorPrimary}`,boxShadow:n.glowPrimary},"&:checked + label":{borderColor:n.colorBlueMid,background:n.colorBlueMid},"&:disabled + label":{borderColor:n.colorElementDark,background:n.colorElementDark}},""),inputDisabled:h({name:"vdhlfv",styles:"cursor:not-allowed;"}),inputRadioButton:h({"&:checked":{"& + label::before":{background:n.colorWhite},"&:disabled + label::before":{background:n.colorTextLightest}},"&:disabled + label::before":{background:n.colorElementDarkest}},""),inputCheckbox:h({"&:checked, &:indeterminate":{"& + label":{borderColor:n.colorBlueMid,background:n.colorBlueMid},"&:disabled + label svg":{fill:n.colorTextLightest}},"&:disabled":{"& + label":{borderColor:n.colorElementDark,background:n.colorElementDark,"& svg":{fill:n.colorElementDark}}}},""),ghost:h({background:n.colorWhite,width:n.spacingM,height:n.spacingM,border:`2px solid ${n.colorElementDark}`,fill:n.colorWhite,display:"flex",alignItems:"center",justifyContent:"center",boxSizing:"border-box"},""),ghostRadioButton:h({borderRadius:"50%","&:before":{content:'""',borderRadius:"50%",backgroundColor:n.colorWhite,width:n.borderRadiusMedium,height:n.borderRadiusMedium}},""),ghostCheckbox:h({borderRadius:"20%",svg:{width:n.spacingS,minWidth:n.spacingS,minHeight:n.spacingS,height:n.spacingS}},"")},k=({isChecked:e,className:o,isDisabled:t=!1,id:n,label:a,name:h,onBlur:g,onChange:p,onFocus:k,isRequired:x=!1,testId:E="cf-ui-controlled-input",type:v="checkbox",value:C,canBlurOnEsc:y=!0,isIndeterminate:M,inputProps:R,...w},B)=>{const D=s(null),I=b(m.input,{[m.inputRadioButton]:"radio"===v,[m.inputCheckbox]:"checkbox"===v,[m.inputDisabled]:t},null==R?void 0:R.className),q=b(m.container,o),S=d((e=>{e.persist(),"Escape"===e.nativeEvent.code&&y&&e.currentTarget.blur()}),[y]);u((()=>{D.current.indeterminate=M}),[M]);const z={size:"medium",variant:t?"secondary":"white"};return c.createElement(r,f({as:"div",display:"inline-block",ref:B,testId:E},w,{className:q}),c.createElement("input",f({},R,{className:I,value:C,name:h,checked:e,type:v,ref:D,onChange:e=>{p&&p(e)},onBlur:e=>{g&&g(e)},onFocus:e=>{k&&k(e)},"aria-label":a,id:n,required:x,disabled:t,onKeyDown:S})),"radio"===v?c.createElement("label",{className:b(m.ghost,m.ghostRadioButton),htmlFor:n}):c.createElement("label",{className:b(m.ghost,m.ghostCheckbox),htmlFor:n},M?c.createElement(l,z):c.createElement(i,z)))},x=c.forwardRef(k);exports.ControlledInput=x,o(p,"ControlledInput",(function(){return x})),t(g,p);var E={};const v=({testId:e="cf-ui-checkbox",...o},t)=>c.createElement(x,f({testId:e,type:"checkbox",ref:t},o)),C=c.forwardRef(v);exports.Checkbox=C,o(E,"Checkbox",(function(){return C})),t(g,E);var y={};const M=({testId:e="cf-ui-radio-button",...o},t)=>c.createElement(x,f({testId:e,type:"radio",ref:t},o)),R=c.forwardRef(M);exports.RadioButton=R,o(y,"RadioButton",(function(){return R})),t(g,y);
var e=g(require("@babel/runtime/helpers/extends")),{cx:o,css:t}=require("emotion"),r=require("react"),i=g(r),{useCallback:n,useRef:l,useEffect:a}=r,{Done:c,Minus:d}=require("@contentful/f36-icons"),{Box:s}=require("@contentful/f36-core"),u=g(require("@contentful/f36-tokens"));function b(e,o){return Object.keys(o).forEach((function(t){"default"!==t&&"__esModule"!==t&&Object.defineProperty(e,t,{enumerable:!0,get:function(){return o[t]}})})),e}function h(e,o,t,r){Object.defineProperty(e,o,{get:t,set:r,enumerable:!0,configurable:!0})}function g(e){return e&&e.__esModule?e.default:e}var f={},m={};h(m,"ControlledInput",(()=>x));const p={container:t({position:"relative",textOverflow:"ellipsis",lineHeight:u.lineHeightL,margin:"0",width:u.spacingM,height:u.spacingM,minHeight:u.spacingM,overflow:"visible"},""),input:t({display:"inline-block",fontSize:u.fontSizeM,opacity:"0",position:"absolute",margin:"0",width:u.spacingM,height:u.spacingM,zIndex:u.zIndexDefault,cursor:"pointer","&:focus + label":{outline:"none",border:`2px solid ${u.colorPrimary}`,boxShadow:u.glowPrimary},"&:checked + label":{borderColor:u.colorBlueMid,background:u.colorBlueMid},"&:disabled + label":{borderColor:u.colorElementDark,background:u.colorElementDark}},""),inputDisabled:t({name:"vdhlfv",styles:"cursor:not-allowed;"}),inputRadioButton:t({"&:checked":{"& + label::before":{background:u.colorWhite},"&:disabled + label::before":{background:u.colorTextLightest}},"&:disabled + label::before":{background:u.colorElementDarkest}},""),inputCheckbox:t({"&:checked, &:indeterminate":{"& + label":{borderColor:u.colorBlueMid,background:u.colorBlueMid},"&:disabled + label svg":{fill:u.colorTextLightest}},"&:disabled":{"& + label":{borderColor:u.colorElementDark,background:u.colorElementDark,"& svg":{fill:u.colorElementDark}}}},""),ghost:t({background:u.colorWhite,width:u.spacingM,height:u.spacingM,border:`2px solid ${u.colorElementDark}`,fill:u.colorWhite,display:"flex",alignItems:"center",justifyContent:"center",boxSizing:"border-box"},""),ghostRadioButton:t({borderRadius:"50%","&:before":{content:'""',borderRadius:"50%",backgroundColor:u.colorWhite,width:u.borderRadiusMedium,height:u.borderRadiusMedium}},""),ghostCheckbox:t({borderRadius:"20%",svg:{width:u.spacingS,minWidth:u.spacingS,minHeight:u.spacingS,height:u.spacingS}},"")},k=({isChecked:t,className:r,isDisabled:u=!1,id:b,label:h,name:g,onBlur:f,onChange:m,onFocus:k,isRequired:x=!1,testId:v="cf-ui-controlled-input",type:E="checkbox",value:y,canBlurOnEsc:M=!0,isIndeterminate:C,inputProps:w,...R},B)=>{const D=l(null),I=o(p.input,{[p.inputRadioButton]:"radio"===E,[p.inputCheckbox]:"checkbox"===E,[p.inputDisabled]:u},null==w?void 0:w.className),q=o(p.container,r),S=n((e=>{e.persist(),"Escape"===e.nativeEvent.code&&M&&e.currentTarget.blur()}),[M]);a((()=>{D.current.indeterminate=C}),[C]);const z={size:"medium",variant:u?"secondary":"white"};return i.createElement(s,e({as:"div",display:"inline-block",ref:B,testId:v},R,{className:q}),i.createElement("input",e({},w,{className:I,value:y,name:g,checked:t,type:E,ref:D,onChange:e=>{m&&m(e)},onBlur:e=>{f&&f(e)},onFocus:e=>{k&&k(e)},"aria-label":h,id:b,required:x,disabled:u,onKeyDown:S})),"radio"===E?i.createElement("label",{className:o(p.ghost,p.ghostRadioButton),htmlFor:b}):i.createElement("label",{className:o(p.ghost,p.ghostCheckbox),htmlFor:b},C?i.createElement(d,z):i.createElement(c,z)))},x=i.forwardRef(k);var v={};h(v,"Checkbox",(()=>y));const E=({testId:o="cf-ui-checkbox",...t},r)=>i.createElement(x,e({testId:o,type:"checkbox",ref:r},t)),y=i.forwardRef(E);var M={};h(M,"RadioButton",(()=>w));const C=({testId:o="cf-ui-radio-button",...t},r)=>i.createElement(x,e({testId:o,type:"radio",ref:r},t)),w=i.forwardRef(C);b(f,m),b(f,v),b(f,M),b(module.exports,f);
//# sourceMappingURL=main.js.map

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

function e(e,o,t){Object.defineProperty(e,o,{get:t,enumerable:!0})}function o(e,o){return Object.keys(o).forEach((function(t){"default"!==t&&"__esModule"!==t&&Object.defineProperty(e,t,{enumerable:!0,get:function(){return o[t]}})})),e}import{Box as t}from"@contentful/f36-core";import r from"@contentful/f36-tokens";import{Done as n,Minus as i}from"@contentful/f36-icons";import l,{useCallback as a,useRef as c,useEffect as d}from"react";import{cx as s,css as u}from"emotion";import b from"@babel/runtime/helpers/esm/extends";var h={},m={};const p={container:u({position:"relative",textOverflow:"ellipsis",lineHeight:r.lineHeightL,margin:"0",width:r.spacingM,height:r.spacingM,minHeight:r.spacingM,overflow:"visible"},""),input:u({display:"inline-block",fontSize:r.fontSizeM,opacity:"0",position:"absolute",margin:"0",width:r.spacingM,height:r.spacingM,zIndex:r.zIndexDefault,cursor:"pointer","&:focus + label":{outline:"none",border:`2px solid ${r.colorPrimary}`,boxShadow:r.glowPrimary},"&:checked + label":{borderColor:r.colorBlueMid,background:r.colorBlueMid},"&:disabled + label":{borderColor:r.colorElementDark,background:r.colorElementDark}},""),inputDisabled:u({name:"vdhlfv",styles:"cursor:not-allowed;"}),inputRadioButton:u({"&:checked":{"& + label::before":{background:r.colorWhite},"&:disabled + label::before":{background:r.colorTextLightest}},"&:disabled + label::before":{background:r.colorElementDarkest}},""),inputCheckbox:u({"&:checked, &:indeterminate":{"& + label":{borderColor:r.colorBlueMid,background:r.colorBlueMid},"&:disabled + label svg":{fill:r.colorTextLightest}},"&:disabled":{"& + label":{borderColor:r.colorElementDark,background:r.colorElementDark,"& svg":{fill:r.colorElementDark}}}},""),ghost:u({background:r.colorWhite,width:r.spacingM,height:r.spacingM,border:`2px solid ${r.colorElementDark}`,fill:r.colorWhite,display:"flex",alignItems:"center",justifyContent:"center",boxSizing:"border-box"},""),ghostRadioButton:u({borderRadius:"50%","&:before":{content:'""',borderRadius:"50%",backgroundColor:r.colorWhite,width:r.borderRadiusMedium,height:r.borderRadiusMedium}},""),ghostCheckbox:u({borderRadius:"20%",svg:{width:r.spacingS,minWidth:r.spacingS,minHeight:r.spacingS,height:r.spacingS}},"")},f=({isChecked:e,className:o,isDisabled:r=!1,id:u,label:h,name:m,onBlur:f,onChange:g,onFocus:k,isRequired:x=!1,testId:C="cf-ui-controlled-input",type:v="checkbox",value:E,canBlurOnEsc:y=!0,isIndeterminate:R,inputProps:w,...I},M)=>{const B=c(null),D=s(p.input,{[p.inputRadioButton]:"radio"===v,[p.inputCheckbox]:"checkbox"===v,[p.inputDisabled]:r},null==w?void 0:w.className),S=s(p.container,o),z=a((e=>{e.persist(),"Escape"===e.nativeEvent.code&&y&&e.currentTarget.blur()}),[y]);d((()=>{B.current.indeterminate=R}),[R]);const N={size:"medium",variant:r?"secondary":"white"};return l.createElement(t,b({as:"div",display:"inline-block",ref:M,testId:C},I,{className:S}),l.createElement("input",b({},w,{className:D,value:E,name:m,checked:e,type:v,ref:B,onChange:e=>{g&&g(e)},onBlur:e=>{f&&f(e)},onFocus:e=>{k&&k(e)},"aria-label":h,id:u,required:x,disabled:r,onKeyDown:z})),"radio"===v?l.createElement("label",{className:s(p.ghost,p.ghostRadioButton),htmlFor:u}):l.createElement("label",{className:s(p.ghost,p.ghostCheckbox),htmlFor:u},R?l.createElement(i,N):l.createElement(n,N)))};export const ControlledInput=l.forwardRef(f);e(m,"ControlledInput",(function(){return ControlledInput})),o(h,m);var g={};const k=({testId:e="cf-ui-checkbox",...o},t)=>l.createElement(ControlledInput,b({testId:e,type:"checkbox",ref:t},o));export const Checkbox=l.forwardRef(k);e(g,"Checkbox",(function(){return Checkbox})),o(h,g);var x={};const C=({testId:e="cf-ui-radio-button",...o},t)=>l.createElement(ControlledInput,b({testId:e,type:"radio",ref:t},o));export const RadioButton=l.forwardRef(C);e(x,"RadioButton",(function(){return RadioButton})),o(h,x);
import e from"@babel/runtime/helpers/esm/extends";import{cx as o,css as t}from"emotion";import r,{useCallback as i,useEffect as n,useRef as a}from"react";import{Minus as l,Done as c}from"@contentful/f36-icons";import{Box as s}from"@contentful/f36-core";import d from"@contentful/f36-tokens";function u(e,o){return Object.keys(o).forEach((function(t){"default"!==t&&"__esModule"!==t&&Object.defineProperty(e,t,{enumerable:!0,get:function(){return o[t]}})})),e}function b(e,o,t,r){Object.defineProperty(e,o,{get:t,set:r,enumerable:!0,configurable:!0})}var m={},h={};b(h,"ControlledInput",(()=>p));const f={container:t({position:"relative",textOverflow:"ellipsis",lineHeight:d.lineHeightL,margin:"0",width:d.spacingM,height:d.spacingM,minHeight:d.spacingM,overflow:"visible"},""),input:t({display:"inline-block",fontSize:d.fontSizeM,opacity:"0",position:"absolute",margin:"0",width:d.spacingM,height:d.spacingM,zIndex:d.zIndexDefault,cursor:"pointer","&:focus + label":{outline:"none",border:`2px solid ${d.colorPrimary}`,boxShadow:d.glowPrimary},"&:checked + label":{borderColor:d.colorBlueMid,background:d.colorBlueMid},"&:disabled + label":{borderColor:d.colorElementDark,background:d.colorElementDark}},""),inputDisabled:t({name:"vdhlfv",styles:"cursor:not-allowed;"}),inputRadioButton:t({"&:checked":{"& + label::before":{background:d.colorWhite},"&:disabled + label::before":{background:d.colorTextLightest}},"&:disabled + label::before":{background:d.colorElementDarkest}},""),inputCheckbox:t({"&:checked, &:indeterminate":{"& + label":{borderColor:d.colorBlueMid,background:d.colorBlueMid},"&:disabled + label svg":{fill:d.colorTextLightest}},"&:disabled":{"& + label":{borderColor:d.colorElementDark,background:d.colorElementDark,"& svg":{fill:d.colorElementDark}}}},""),ghost:t({background:d.colorWhite,width:d.spacingM,height:d.spacingM,border:`2px solid ${d.colorElementDark}`,fill:d.colorWhite,display:"flex",alignItems:"center",justifyContent:"center",boxSizing:"border-box"},""),ghostRadioButton:t({borderRadius:"50%","&:before":{content:'""',borderRadius:"50%",backgroundColor:d.colorWhite,width:d.borderRadiusMedium,height:d.borderRadiusMedium}},""),ghostCheckbox:t({borderRadius:"20%",svg:{width:d.spacingS,minWidth:d.spacingS,minHeight:d.spacingS,height:d.spacingS}},"")},g=({isChecked:t,className:d,isDisabled:u=!1,id:b,label:m,name:h,onBlur:g,onChange:p,onFocus:k,isRequired:x=!1,testId:E="cf-ui-controlled-input",type:v="checkbox",value:C,canBlurOnEsc:y=!0,isIndeterminate:M,inputProps:R,...w},B)=>{const D=a(null),I=o(f.input,{[f.inputRadioButton]:"radio"===v,[f.inputCheckbox]:"checkbox"===v,[f.inputDisabled]:u},null==R?void 0:R.className),S=o(f.container,d),z=i((e=>{e.persist(),"Escape"===e.nativeEvent.code&&y&&e.currentTarget.blur()}),[y]);n((()=>{D.current.indeterminate=M}),[M]);const N={size:"medium",variant:u?"secondary":"white"};return r.createElement(s,e({as:"div",display:"inline-block",ref:B,testId:E},w,{className:S}),r.createElement("input",e({},R,{className:I,value:C,name:h,checked:t,type:v,ref:D,onChange:e=>{p&&p(e)},onBlur:e=>{g&&g(e)},onFocus:e=>{k&&k(e)},"aria-label":m,id:b,required:x,disabled:u,onKeyDown:z})),"radio"===v?r.createElement("label",{className:o(f.ghost,f.ghostRadioButton),htmlFor:b}):r.createElement("label",{className:o(f.ghost,f.ghostCheckbox),htmlFor:b},M?r.createElement(l,N):r.createElement(c,N)))},p=r.forwardRef(g);var k={};b(k,"Checkbox",(()=>E));const x=({testId:o="cf-ui-checkbox",...t},i)=>r.createElement(p,e({testId:o,type:"checkbox",ref:i},t)),E=r.forwardRef(x);var v={};b(v,"RadioButton",(()=>y));const C=({testId:o="cf-ui-radio-button",...t},i)=>r.createElement(p,e({testId:o,type:"radio",ref:i},t)),y=r.forwardRef(C);u(m,h),u(m,k),u(m,v);export{p as ControlledInput,E as Checkbox,y as RadioButton};
//# sourceMappingURL=module.js.map
{
"name": "@contentful/f36-inputs",
"version": "4.0.1-next-v4-4389.1990+46acac9e",
"version": "4.0.1-next-v4-4457.1996+a8e784c0",
"description": "Forma 36: Input React Components",

@@ -25,5 +25,5 @@ "license": "MIT",

"@babel/runtime": "^7.6.2",
"@contentful/f36-core": "4.0.1-next-v4-4389.1990+46acac9e",
"@contentful/f36-icons": "4.0.1-next-v4-4389.1990+46acac9e",
"@contentful/f36-tokens": "4.0.1-next-v4-4389.1990+46acac9e",
"@contentful/f36-core": "4.0.1-next-v4-4457.1996+a8e784c0",
"@contentful/f36-icons": "4.0.1-next-v4-4457.1996+a8e784c0",
"@contentful/f36-tokens": "4.0.1-next-v4-4457.1996+a8e784c0",
"emotion": "^10.0.17"

@@ -37,3 +37,3 @@ },

},
"gitHead": "46acac9e2ca6e5eab92567ca267a3066f2bafce0"
"gitHead": "a8e784c0a708a6ff8f86b1e95e882b7333126c48"
}

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

Sorry, the diff of this file is not supported yet

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