		@@ -1,2 +0,2 @@
		var e=s(require("@babel/runtime/helpers/extends")),{cx:a,css:r}=require("emotion"),t=s(require("react")),{Box:n}=require("@contentful/f36-core"),{TabFocusTrap:o}=require("@contentful/f36-utils"),{CloseIcon:i,DragIcon:l}=require("@contentful/f36-icons"),c=s(require("@contentful/f36-tokens"));function s(e){return e&&e.__esModule?e.default:e}var d,u,g,f,m={};d=m,u="Pill",g=()=>v,Object.defineProperty(d,u,{get:g,set:f,enumerable:!0,configurable:!0});const b=e=>r({border:"none",borderTopRightRadius:c.borderRadiusSmall,borderBottomRightRadius:c.borderRadiusSmall,padding:c.spacingXs,background:"transparent",transition:`background ${c.transitionDurationShort} ${c.transitionEasingDefault}`,...(e=>{switch(e){case"active":default:return{borderLeft:`1px solid ${c.gray400}`,"&:hover, &:focus":{background:c.gray300,cursor:"pointer"}}}})(e)},""),p={fill:c.gray600,verticalAlign:"middle"},h={padding:c.spacingXs,paddingRight:0},y=e=>r({display:"inline-flex",fontFamily:c.fontStackPrimary,alignItems:"center",borderRadius:c.borderRadiusSmall,border:"none",padding:0,maxWidth:"100%",...(e=>{switch(e){case"active":return{background:c.gray300};case"deleted":return{background:c.gray200,textDecoration:"line-through",opacity:"0.5"};default:return{background:c.gray200}}})(e)},"");const v=t.forwardRef(((s,d)=>{const{label:u,onClose:g,testId:f="cf-ui-pill",onDrag:m,className:v,dragHandleComponent:k,variant:x="idle",...R}=s,E=(e=>({closeButton:b(e),label:r({color:c.gray700,lineHeight:c.lineHeightM,padding:c.spacingXs,fontSize:c.fontSizeM,flexGrow:2,whiteSpace:"nowrap",textOverflow:"ellipsis",overflow:"hidden"},""),icon:r(p,""),dragIcon:r(h,""),pill:y(e)}))(x);return t.createElement(n,e({as:"div",className:a(E.pill,v),"data-test-id":f,onDrag:m,ref:d},R),m&&(k\|\|t.createElement("span",{"aria-label":"Drag handler",className:E.dragIcon},t.createElement(l,{className:E.icon,variant:"muted"}))),t.createElement("span",{title:u,className:E.label},u),g&&t.createElement("button",{type:"button","aria-label":"close",onClick:g,className:E.closeButton},t.createElement(o,null,t.createElement(i,{className:E.icon,variant:"muted"}))))}));var k,x;v.displayName="Pill",k=module.exports,x=m,Object.keys(x).forEach((function(e){"default"!==e&&"__esModule"!==e&&Object.defineProperty(k,e,{enumerable:!0,get:function(){return x[e]}})}));
		var e=s(require("@babel/runtime/helpers/extends")),{cx:a,css:r}=require("emotion"),t=s(require("react")),{Box:n}=require("@contentful/f36-core"),{TabFocusTrap:o}=require("@contentful/f36-utils"),{DragIcon:i,CloseIcon:l}=require("@contentful/f36-icons"),c=s(require("@contentful/f36-tokens"));function s(e){return e&&e.__esModule?e.default:e}var d,u,g,f,m={};d=m,u="Pill",g=()=>v,Object.defineProperty(d,u,{get:g,set:f,enumerable:!0,configurable:!0});const b=e=>r({border:"none",borderTopRightRadius:c.borderRadiusSmall,borderBottomRightRadius:c.borderRadiusSmall,padding:c.spacingXs,background:"transparent",transition:`background ${c.transitionDurationShort} ${c.transitionEasingDefault}`,...(e=>{switch(e){case"active":default:return{borderLeft:`1px solid ${c.gray400}`,"&:hover, &:focus":{background:c.gray300,cursor:"pointer"}}}})(e)},""),p={fill:c.gray600,verticalAlign:"middle"},h={padding:c.spacingXs,paddingRight:0},y=e=>r({display:"inline-flex",fontFamily:c.fontStackPrimary,alignItems:"center",borderRadius:c.borderRadiusSmall,border:"none",padding:0,maxWidth:"100%",...(e=>{switch(e){case"active":return{background:c.gray300};case"deleted":return{background:c.gray200,textDecoration:"line-through",opacity:"0.5"};default:return{background:c.gray200}}})(e)},"");const v=t.forwardRef(((s,d)=>{const{label:u,onClose:g,testId:f="cf-ui-pill",onDrag:m,className:v,dragHandleComponent:k,variant:x="idle",...R}=s,E=(e=>({closeButton:b(e),label:r({color:c.gray700,lineHeight:c.lineHeightM,padding:c.spacingXs,fontSize:c.fontSizeM,flexGrow:2,whiteSpace:"nowrap",textOverflow:"ellipsis",overflow:"hidden"},""),icon:r(p,""),dragIcon:r(h,""),pill:y(e)}))(x);return t.createElement(n,e({as:"div",className:a(E.pill,v),"data-test-id":f,onDrag:m,ref:d},R),m&&(k\|\|t.createElement("span",{"aria-label":"Drag handler",className:E.dragIcon},t.createElement(i,{className:E.icon,variant:"muted"}))),t.createElement("span",{title:u,className:E.label},u),g&&t.createElement("button",{type:"button","aria-label":"close",onClick:g,className:E.closeButton},t.createElement(o,null,t.createElement(l,{className:E.icon,variant:"muted"}))))}));var k,x;v.displayName="Pill",k=module.exports,x=m,Object.keys(x).forEach((function(e){"default"!==e&&"__esModule"!==e&&Object.defineProperty(k,e,{enumerable:!0,get:function(){return x[e]}})}));
		//# sourceMappingURL=main.js.map

package.json

		{
		"name": "@contentful/f36-pill",
		"version": "4.0.1-next-v4-6652.2269+bf759ac5",
		"version": "4.0.1-next-v4-6660.2272+367dfd9f",
		"description": "Forma 36: Pill component",
		@@ -10,6 +10,6 @@ "scripts": {
		"@babel/runtime": "^7.6.2",
		"@contentful/f36-core": "4.0.1-next-v4-6652.2269+bf759ac5",
		"@contentful/f36-icons": "4.0.1-next-v4-6652.2269+bf759ac5",
		"@contentful/f36-tokens": "4.0.1-next-v4-6652.2269+bf759ac5",
		"@contentful/f36-utils": "4.0.1-next-v4-6652.2269+bf759ac5",
		"@contentful/f36-core": "4.0.1-next-v4-6660.2272+367dfd9f",
		"@contentful/f36-icons": "4.0.1-next-v4-6660.2272+367dfd9f",
		"@contentful/f36-tokens": "4.0.1-next-v4-6660.2272+367dfd9f",
		"@contentful/f36-utils": "4.0.1-next-v4-6660.2272+367dfd9f",
		"emotion": "^10.0.17"
		@@ -38,3 +38,3 @@ },
		},
		"gitHead": "bf759ac52a20cf22ef5dc413d6fac04d494b7687"
		"gitHead": "367dfd9f774c8e6d2c22ab58fa94518b7f14fc20"
		}

@contentful/f36-pill - npm Package Compare versions

New alerts

Fixed alerts

Dependency changes