New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@leafygreen-ui/button

Package Overview
Dependencies
Maintainers
4
Versions
119
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@leafygreen-ui/button - npm Package Compare versions

Comparing version 8.0.0 to 8.0.1

dist/ts3.4/Button.d.ts
dist/ts3.4/index.d.ts

11

CHANGELOG.md
# @leafygreen-ui/button
## 8.0.1
### Patch Changes
- dac3f38b: Fixes a publishing error that prevented UMD modules from being distributed
- Updated dependencies [dac3f38b]
- @leafygreen-ui/box@3.0.1
- @leafygreen-ui/leafygreen-provider@2.0.1
- @leafygreen-ui/lib@6.0.1
- @leafygreen-ui/palette@3.0.1
## 8.0.0

@@ -4,0 +15,0 @@

6

dist/index.js

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

import Button from './Button';
export { Size, Variant } from './Button';
export default Button;
//# sourceMappingURL=index.js.map
!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react"),require("prop-types"),require("@leafygreen-ui/emotion"),require("@leafygreen-ui/palette"),require("@leafygreen-ui/leafygreen-provider"),require("polished"),require("@leafygreen-ui/box")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@leafygreen-ui/emotion","@leafygreen-ui/palette","@leafygreen-ui/leafygreen-provider","polished","@leafygreen-ui/box"],e):e((n="undefined"!=typeof globalThis?globalThis:n||self)["@leafygreen-ui/button"]={},n.React,n.PropTypes,n["@leafygreen-ui/emotion"],n["@leafygreen-ui/palette"],n["@leafygreen-ui/leafygreen-provider"],n.polished,n["@leafygreen-ui/box"])}(this,(function(n,e,r,o,t,a,i,l){"use strict";function u(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var s,c,d,f,g=u(e),p=u(r),b=u(l);function h(n,e,r){return e in n?Object.defineProperty(n,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):n[e]=r,n}function y(){return(y=Object.assign||function(n){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var o in r)Object.prototype.hasOwnProperty.call(r,o)&&(n[o]=r[o])}return n}).apply(this,arguments)}function x(n,e){var r=Object.keys(n);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(n);e&&(o=o.filter((function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable}))),r.push.apply(r,o)}return r}function m(n,e){if(null==n)return{};var r,o,t=function(n,e){if(null==n)return{};var r,o,t={},a=Object.keys(n);for(o=0;o<a.length;o++)r=a[o],e.indexOf(r)>=0||(t[r]=n[r]);return t}(n,e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(n);for(o=0;o<a.length;o++)r=a[o],e.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(n,r)&&(t[r]=n[r])}return t}function k(n,e){return e||(e=n.slice(0)),Object.freeze(Object.defineProperties(n,{raw:{value:Object.freeze(e)}}))}function v(){var n=k(["\n // Usually for this to take effect, you would need the element to be\n /* ￿positioned￿. Due to an obscure part of CSS spec, flex children */\n // respect z-index without the position property being set.\n //\n // https://www.w3.org/TR/css-flexbox-1/#painting\n z-index: 1;\n display: inline-flex;\n flex-grow: 1;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n "]);return v=function(){return n},n}function C(){var n=k(["\n color: ",";\n border-color: ",";\n background-color: ",";\n background-image: none;\n box-shadow: none;\n pointer-events: none;\n"]);return C=function(){return n},n}function w(){var n=k(["\n position: relative;\n // Establishes the root element as a new stacking context\n // so that the z-index of the span within the button doesn't\n // appear above other elements on the page that it shouldn't.\n z-index: 0;\n border-radius: 3px;\n box-sizing: border-box;\n cursor: pointer;\n display: inline-flex;\n align-items: stretch;\n font-family: Akzidenz, 'Helvetica Neue', Helvetica, Arial, sans-serif;\n font-weight: normal;\n text-decoration: none;\n text-transform: none;\n transition: all 120ms ease;\n user-select: none;\n padding: 0;\n\n &:hover {\n text-decoration: none;\n }\n\n // We're using CSS pseudo elements here in order to\n // transition the gradients between button pseudo classes.\n &:before,\n &:after {\n content: '';\n transition: 0.15s opacity ease-in-out;\n opacity: 0;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n }\n\n &:not(:disabled) {\n &:focus,\n &:hover {\n &:before {\n opacity: 1;\n }\n }\n\n &:active:after {\n opacity: 1;\n }\n }\n"]);return w=function(){return n},n}function O(){var n=k(["\n &:focus {\n text-decoration: none;\n\n &:not(:disabled):before {\n opacity: 1;\n }\n }\n"]);return O=function(){return n},n}function j(){var n=k(["\n margin-right: 8px;\n "]);return j=function(){return n},n}function z(){var n=k(["\n margin-right: 5px;\n "]);return z=function(){return n},n}function P(){var n=k(["\n margin-right: 4px;\n "]);return P=function(){return n},n}function S(){var n=k(["\n margin-right: 2px;\n "]);return S=function(){return n},n}function N(){var n=k(["\n padding: 0 20px;\n "]);return N=function(){return n},n}function D(){var n=k(["\n padding: 0 12px;\n "]);return D=function(){return n},n}function E(){var n=k(["\n padding: 0 10px;\n "]);return E=function(){return n},n}function q(){var n=k(["\n padding: 0 8px;\n "]);return q=function(){return n},n}function T(){var n=k(["\n height: 45px;\n font-size: 16px;\n "]);return T=function(){return n},n}function L(){var n=k(["\n height: 32px;\n font-size: 14px;\n "]);return L=function(){return n},n}function X(){var n=k(["\n height: 25px;\n font-size: 14px;\n "]);return X=function(){return n},n}function I(){var n=k(["\n height: 22px;\n font-size: 11px;\n text-transform: uppercase;\n font-weight: bold;\n "]);return I=function(){return n},n}function R(){var n=k(["\n color: ",";\n border: 1px solid ",";\n background-color: ",";\n background-image: linear-gradient(\n ",",\n ","\n );\n box-shadow: inset 0 -1px 0 ",";\n\n &:before {\n background-image: linear-gradient(\n ",",\n ","\n );\n box-shadow: 0 1px 4px ",",\n inset 0 -1px 0 ",";\n }\n\n &:after {\n background-image: linear-gradient(\n ",",\n ","\n );\n box-shadow: inset 0 2px 2px ",";\n }\n\n &:focus,\n &:hover {\n color: ",";\n }\n "]);return R=function(){return n},n}function A(){var n=k(["\n color: ",";\n border: 1px solid ",";\n background-color: ",";\n background-image: linear-gradient(#e45b26, #b63016);\n box-shadow: inset 0 -1px 0 0 ",";\n\n &:before {\n background-color: ",";\n background-image: linear-gradient(#e45b26, ",");\n box-shadow: 0 1px 4px ",",\n inset 0 -1px 0 ",";\n }\n\n &:after {\n background-color: ",";\n background-image: linear-gradient(#ad231b, #e45b26);\n box-shadow: inset 0 2px 2px ",";\n }\n\n &:focus,\n &:hover {\n color: ",";\n }\n "]);return A=function(){return n},n}function H(){var n=k(["\n color: ",";\n background-color: transparent;\n background-image: none;\n border: 1px solid ",";\n box-shadow: none;\n\n &:before {\n background-color: #129f4c;\n background-image: linear-gradient(#129f4c, #148040);\n box-shadow: 0 1px 4px ",",\n inset 0 -1px 0 #158242;\n }\n\n &:after {\n background-color: ",";\n background-image: linear-gradient(#148040, #129f4c);\n box-shadow: inset 0 2px 2px ",";\n }\n\n &:not(:disabled) {\n &:focus,\n &:hover,\n &:active {\n border-color: #158242;\n color: ",";\n }\n }\n "]);return H=function(){return n},n}function K(){var n=k(["\n color: ",";\n border: 1px solid #158242;\n background-color: ",";\n background-image: linear-gradient(",", #18964c);\n box-shadow: inset 0 -1px 0 #158242;\n\n &:before {\n background-color: #129f4c;\n background-image: linear-gradient(#129f4c, #148040);\n box-shadow: 0 1px 4px ",",\n inset 0 -1px 0 #158242;\n }\n\n &:after {\n background-color: ",";\n background-image: linear-gradient(#148040, #129f4c);\n box-shadow: inset 0 2px 2px ",";\n }\n\n &:focus,\n &:hover {\n color: ",";\n }\n "]);return K=function(){return n},n}function U(){var n=k(["\n color: ",";\n border: 1px solid ",";\n background-color: ",";\n background-image: linear-gradient(\n ",",\n ","\n );\n box-shadow: inset 0 -1px 0 ",";\n\n &:before {\n border-color: ",";\n background-color: ",";\n background-image: linear-gradient(",", #dde4e2);\n box-shadow: inset 0 -1px 0 ",",\n 0 1px 4px ",";\n }\n\n &:after {\n border-color: ",";\n background-color: ",";\n background-image: linear-gradient(#dde4e2, ",");\n box-shadow: inset 0 2px 2px ",";\n }\n\n &:focus,\n &:hover {\n color: ",";\n }\n "]);return U=function(){return n},n}var _={Default:"default",Primary:"primary",Info:"info",Danger:"danger",Dark:"dark"},B={XSmall:"xsmall",Small:"small",Normal:"normal",Large:"large"},M=(h(s={},_.Default,o.css(U(),t.uiColors.gray.dark2,t.uiColors.gray.light1,t.uiColors.gray.light3,t.uiColors.white,t.uiColors.gray.light2,t.uiColors.gray.light1,t.uiColors.gray.light1,t.uiColors.gray.light2,t.uiColors.gray.light3,t.uiColors.gray.light1,i.transparentize(.9,t.uiColors.black),t.uiColors.gray.light1,t.uiColors.gray.light3,t.uiColors.gray.light3,i.transparentize(.9,t.uiColors.black),t.uiColors.gray.dark2)),h(s,_.Primary,o.css(K(),t.uiColors.white,t.uiColors.green.base,t.uiColors.green.base,i.transparentize(.9,t.uiColors.black),t.uiColors.green.base,t.uiColors.green.dark2,t.uiColors.white)),h(s,_.Info,o.css(H(),t.uiColors.green.base,t.uiColors.green.base,i.transparentize(.9,t.uiColors.black),t.uiColors.green.base,t.uiColors.green.dark2,t.uiColors.white)),h(s,_.Danger,o.css(A(),t.uiColors.white,t.uiColors.red.dark2,t.uiColors.red.base,t.uiColors.red.dark2,t.uiColors.red.dark2,t.uiColors.red.dark2,i.transparentize(.9,t.uiColors.black),t.uiColors.red.dark2,t.uiColors.red.dark2,t.uiColors.red.dark2,t.uiColors.white)),h(s,_.Dark,o.css(R(),t.uiColors.white,t.uiColors.gray.dark2,t.uiColors.gray.dark1,t.uiColors.gray.base,t.uiColors.gray.dark1,t.uiColors.gray.dark2,t.uiColors.gray.base,t.uiColors.gray.dark2,i.transparentize(.9,t.uiColors.black),t.uiColors.gray.dark2,t.uiColors.gray.dark1,t.uiColors.gray.base,t.uiColors.gray.dark2,t.uiColors.white)),s),V=(h(c={},B.XSmall,o.css(I())),h(c,B.Small,o.css(X())),h(c,B.Normal,o.css(L())),h(c,B.Large,o.css(T())),c),W=(h(d={},B.XSmall,o.css(q())),h(d,B.Small,o.css(E())),h(d,B.Normal,o.css(D())),h(d,B.Large,o.css(N())),d),F=(h(f={},B.XSmall,o.css(S())),h(f,B.Small,o.css(P())),h(f,B.Normal,o.css(z())),h(f,B.Large,o.css(j())),f),G=o.css(O()),J=o.css(w()),Q=o.css(C(),t.uiColors.gray.base,t.uiColors.gray.light1,t.uiColors.gray.light2),Y=g.default.forwardRef((function(n,e){var r=n.className,t=n.children,i=n.disabled,l=void 0!==i&&i,u=n.variant,s=void 0===u?_.Default:u,c=n.size,d=void 0===c?B.Normal:c,f=n.glyph,p=m(n,["className","children","disabled","variant","size","glyph"]),k=a.useUsingKeyboardContext().usingKeyboard,C=function(n){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?x(Object(r),!0).forEach((function(e){h(n,e,r[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(r)):x(Object(r)).forEach((function(e){Object.defineProperty(n,e,Object.getOwnPropertyDescriptor(r,e))}))}return n}({ref:e,className:o.cx(J,V[d],M[s],h({},Q,l),h({},G,k),r)},"string"!=typeof p.href&&{disabled:l},{"aria-disabled":l}),w=o.css(v()),O=f&&t?g.default.cloneElement(f,{className:o.cx(h({},F[d],null!=f))}):f,j=g.default.createElement("span",{className:o.cx(w,W[d])},O,t);return"string"==typeof p.href?g.default.createElement(b.default,y({as:"a"},C,p),j):g.default.createElement(b.default,y({as:"button",type:"button"},C,p),j)}));Y.displayName="Button",Y.propTypes={variant:p.default.oneOf(Object.values(_)),size:p.default.oneOf(Object.values(B)),className:p.default.string,children:p.default.node,disabled:p.default.bool,as:p.default.oneOfType([p.default.element,p.default.elementType,p.default.func]),href:p.default.string,glyph:p.default.element},n.Size=B,n.Variant=_,n.default=Y,Object.defineProperty(n,"__esModule",{value:!0})}));
//# sourceMappingURL=index.js.map

12

package.json
{
"name": "@leafygreen-ui/button",
"version": "8.0.0",
"version": "8.0.1",
"description": "leafyGreen UI Kit Button",

@@ -23,14 +23,14 @@ "main": "./dist/index.js",

"dependencies": {
"@leafygreen-ui/lib": "^6.0.0",
"@leafygreen-ui/palette": "^3.0.0",
"@leafygreen-ui/box": "^3.0.0",
"@leafygreen-ui/lib": "^6.0.1",
"@leafygreen-ui/palette": "^3.0.1",
"@leafygreen-ui/box": "^3.0.1",
"lodash": "^4.17.20"
},
"devDependencies": {
"@leafygreen-ui/icon": "^7.0.0"
"@leafygreen-ui/icon": "^7.0.1"
},
"peerDependencies": {
"@leafygreen-ui/leafygreen-provider": "^2.0.0"
"@leafygreen-ui/leafygreen-provider": "^2.0.1"
},
"gitHead": "dd71a2d404218ccec2e657df9c0263dc1c15b9e0"
}

26

README.md

@@ -29,13 +29,15 @@ # Button

```Javascript
```js
import Button from '@leafygreen-ui/button';
<Button
variant='primary'
className='create-item-button'
title='Create an item'
onClick={(event) => {/* Something to handle the click event */}}
variant="primary"
className="create-item-button"
title="Create an item"
onClick={event => {
/* Something to handle the click event */
}}
>
Submit
</Button>
</Button>;
```

@@ -45,6 +47,10 @@

```HTML
<button class="css-1rgbgdt create-item-button" title="Create an item" disabled="false">
Submit
</button>
```html
<button
class="css-1rgbgdt create-item-button"
title="Create an item"
disabled="false"
>
Submit
</button>
```

@@ -51,0 +57,0 @@ 

dist/Button.js
dist/Button.js.map
dist/index.js.map

Sorry, the diff of this file is not supported yet

tsconfig.tsbuildinfo

Sorry, the diff of this file is not supported yet

SocketSocket SOC 2 Logo

Product

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

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc