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

@leafygreen-ui/icon-button

Package Overview
Dependencies
Maintainers
5
Versions
101
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@leafygreen-ui/icon-button - npm Package Compare versions

Comparing version 15.0.1 to 15.0.2

10

CHANGELOG.md
# @leafygreen-ui/icon-button
## 15.0.2
### Patch Changes
- b7f7a4c95: Updates package dependencies & devDependencies, and ensures each package is appropriately listed. Ensures `tsconfig` has no circular dependencies
- Updated dependencies [b7f7a4c95]
- @leafygreen-ui/icon@11.12.2
- @leafygreen-ui/palette@3.4.5
- @leafygreen-ui/tokens@1.4.1
## 15.0.1

@@ -4,0 +14,0 @@

2

dist/esm/index.js

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

import n from"react";import{css as r,cx as e}from"@leafygreen-ui/emotion";import o from"prop-types";import t from"@leafygreen-ui/box";import{Theme as a,isComponentType as i}from"@leafygreen-ui/lib";import{useDarkMode as l,useUsingKeyboardContext as c}from"@leafygreen-ui/leafygreen-provider";import{isComponentGlyph as f}from"@leafygreen-ui/icon";import{validateAriaLabelProps as s}from"@leafygreen-ui/a11y";import{palette as b}from"@leafygreen-ui/palette";import{transitionDuration as g,focusRing as u}from"@leafygreen-ui/tokens";function d(n,r){var e=Object.keys(n);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(n);r&&(o=o.filter((function(r){return Object.getOwnPropertyDescriptor(n,r).enumerable}))),e.push.apply(e,o)}return e}function p(n){for(var r=1;r<arguments.length;r++){var e=null!=arguments[r]?arguments[r]:{};r%2?d(Object(e),!0).forEach((function(r){y(n,r,e[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(e)):d(Object(e)).forEach((function(r){Object.defineProperty(n,r,Object.getOwnPropertyDescriptor(e,r))}))}return n}function y(n,r,e){return r in n?Object.defineProperty(n,r,{value:e,enumerable:!0,configurable:!0,writable:!0}):n[r]=e,n}function h(){return h=Object.assign||function(n){for(var r=1;r<arguments.length;r++){var e=arguments[r];for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o])}return n},h.apply(this,arguments)}function m(n,r){if(null==n)return{};var e,o,t=function(n,r){if(null==n)return{};var e,o,t={},a=Object.keys(n);for(o=0;o<a.length;o++)e=a[o],r.indexOf(e)>=0||(t[e]=n[e]);return t}(n,r);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(n);for(o=0;o<a.length;o++)e=a[o],r.indexOf(e)>=0||Object.prototype.propertyIsEnumerable.call(n,e)&&(t[e]=n[e])}return t}function k(n,r){return r||(r=n.slice(0)),Object.freeze(Object.defineProperties(n,{raw:{value:Object.freeze(r)}}))}var v,O,w,j,x,P,D,L,S,z,E,N,I,C,M,B,X,K,R,T={Default:"default",Large:"large",XLarge:"xlarge"},q=r(v||(v=k(["\n border: none;\n -webkit-appearance: unset;\n padding: unset;\n"]))),A=r(O||(O=k(["\n display: inline-block;\n border-radius: 100px;\n position: relative;\n cursor: pointer;\n flex-shrink: 0;\n transition: ","ms ease-in-out;\n transition-property: color, box-shadow;\n\n // Set background to fully-transparent white for cross-browser compatability with Safari\n //\n // Safari treats \"transparent\" values in CSS as transparent black instead of white\n // which can make things render differently across browsers if not defined explicitly.\n background-color: rgba(255, 255, 255, 0);\n\n &:before {\n content: '';\n transition: ","ms all ease-in-out;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n border-radius: 100%;\n opacity: 0;\n transform: scale(0.8);\n }\n\n &:active:before,\n &:hover:before,\n &:focus:before {\n opacity: 1;\n transform: scale(1);\n }\n\n &:focus {\n outline: none;\n }\n"])),g.default,g.default),F=(y(P={},T.Default,r(w||(w=k(["\n height: 28px;\n width: 28px;\n "])))),y(P,T.Large,r(j||(j=k(["\n height: 36px;\n width: 36px;\n "])))),y(P,T.XLarge,r(x||(x=k(["\n height: 42px;\n width: 42px;\n "])))),P),G=(y(S={},a.Light,r(D||(D=k(["\n color: ",";\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),b.gray.base,b.black,b.gray.light2)),y(S,a.Dark,r(L||(L=k(["\n color: ",";\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),b.gray.light1,b.gray.light3,b.gray.dark1)),S),H=(y(N={},a.Light,r(z||(z=k(["\n &:focus {\n color: ",";\n box-shadow: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),b.black,u[a.Light].default,b.gray.light2)),y(N,a.Dark,r(E||(E=k(["\n &:focus {\n color: ",";\n box-shadow: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),b.gray.light3,u[a.Dark].default,b.gray.dark1)),N),J=(y(M={},a.Light,r(I||(I=k(["\n cursor: not-allowed;\n color: ",";\n background-color: rgba(255, 255, 255, 0);\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n\n &:focus {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n "])),b.gray.light1,b.gray.light1,b.gray.light1)),y(M,a.Dark,r(C||(C=k(["\n cursor: not-allowed;\n color: ",";\n background-color: rgba(255, 255, 255, 0);\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n\n &:focus {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n "])),b.gray.dark1,b.gray.dark1,b.gray.dark1)),M),Q=(y(K={},a.Light,r(B||(B=k(["\n color: ",";\n\n &:before {\n background-color: ",";\n opacity: 1;\n transform: scale(1);\n }\n "])),b.black,b.gray.light2)),y(K,a.Dark,r(X||(X=k(["\n color: ",";\n\n &:before {\n background-color: ",";\n opacity: 1;\n transform: scale(1);\n }\n "])),b.gray.light3,b.gray.dark1)),K),U=r(R||(R=k(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n"]))),V=["size","darkMode","disabled","active","className","children"],W=n.forwardRef((function(r,o){var a,b,g=r.size,u=void 0===g?T.Default:g,d=r.darkMode,k=r.disabled,v=void 0!==k&&k,O=r.active,w=void 0!==O&&O,j=r.className,x=r.children,P=m(r,V),D=l(d).theme,L=c().usingKeyboard,S="string"==typeof P.href;s(P,"IconButton");var z=n.Children.map(x,(function(r){if(!r)return null;if(i(r,"Icon")||f(r)){var e=r.props,o=e.size,t=e.title,a={size:o||u};return"string"==typeof t&&0!==t.length||(a.title=!1),n.cloneElement(r,a)}return r})),E=p(p({},P),{},(y(b={ref:o,tabIndex:0},"aria-disabled",v),y(b,"href",v?void 0:P.href),y(b,"onClick",v?void 0:P.onClick),y(b,"className",e(q,A,F[u],G[D],(y(a={},H[D],L),y(a,Q[D],w&&!v),y(a,J[D],v),a),j)),b));return n.createElement(t,h({as:S?"a":"button"},E),n.createElement("div",{className:U},z))}));W.displayName="IconButton",W.propTypes={darkMode:o.bool,size:o.oneOf(Object.values(T)),className:o.string,children:o.node,disabled:o.bool,href:o.string,active:o.bool};export{T as Size,W as default};
import n from"react";import r from"prop-types";import{validateAriaLabelProps as e}from"@leafygreen-ui/a11y";import o from"@leafygreen-ui/box";import{css as t,cx as a}from"@leafygreen-ui/emotion";import{isComponentGlyph as i}from"@leafygreen-ui/icon";import{useDarkMode as l,useUsingKeyboardContext as c}from"@leafygreen-ui/leafygreen-provider";import{Theme as f,isComponentType as s}from"@leafygreen-ui/lib";import{palette as b}from"@leafygreen-ui/palette";import{transitionDuration as g,focusRing as u}from"@leafygreen-ui/tokens";function d(n,r){var e=Object.keys(n);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(n);r&&(o=o.filter((function(r){return Object.getOwnPropertyDescriptor(n,r).enumerable}))),e.push.apply(e,o)}return e}function p(n){for(var r=1;r<arguments.length;r++){var e=null!=arguments[r]?arguments[r]:{};r%2?d(Object(e),!0).forEach((function(r){y(n,r,e[r])})):Object.getOwnPropertyDescriptors?Object.defineProperties(n,Object.getOwnPropertyDescriptors(e)):d(Object(e)).forEach((function(r){Object.defineProperty(n,r,Object.getOwnPropertyDescriptor(e,r))}))}return n}function y(n,r,e){return r in n?Object.defineProperty(n,r,{value:e,enumerable:!0,configurable:!0,writable:!0}):n[r]=e,n}function h(){return h=Object.assign||function(n){for(var r=1;r<arguments.length;r++){var e=arguments[r];for(var o in e)Object.prototype.hasOwnProperty.call(e,o)&&(n[o]=e[o])}return n},h.apply(this,arguments)}function m(n,r){if(null==n)return{};var e,o,t=function(n,r){if(null==n)return{};var e,o,t={},a=Object.keys(n);for(o=0;o<a.length;o++)e=a[o],r.indexOf(e)>=0||(t[e]=n[e]);return t}(n,r);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(n);for(o=0;o<a.length;o++)e=a[o],r.indexOf(e)>=0||Object.prototype.propertyIsEnumerable.call(n,e)&&(t[e]=n[e])}return t}function k(n,r){return r||(r=n.slice(0)),Object.freeze(Object.defineProperties(n,{raw:{value:Object.freeze(r)}}))}var v,O,w,j,x,P,D,L,S,z,E,N,I,C,M,B,X,K,R,T={Default:"default",Large:"large",XLarge:"xlarge"},q=t(v||(v=k(["\n border: none;\n -webkit-appearance: unset;\n padding: unset;\n"]))),A=t(O||(O=k(["\n display: inline-block;\n border-radius: 100px;\n position: relative;\n cursor: pointer;\n flex-shrink: 0;\n transition: ","ms ease-in-out;\n transition-property: color, box-shadow;\n\n // Set background to fully-transparent white for cross-browser compatability with Safari\n //\n // Safari treats \"transparent\" values in CSS as transparent black instead of white\n // which can make things render differently across browsers if not defined explicitly.\n background-color: rgba(255, 255, 255, 0);\n\n &:before {\n content: '';\n transition: ","ms all ease-in-out;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n border-radius: 100%;\n opacity: 0;\n transform: scale(0.8);\n }\n\n &:active:before,\n &:hover:before,\n &:focus:before {\n opacity: 1;\n transform: scale(1);\n }\n\n &:focus {\n outline: none;\n }\n"])),g.default,g.default),F=(y(P={},T.Default,t(w||(w=k(["\n height: 28px;\n width: 28px;\n "])))),y(P,T.Large,t(j||(j=k(["\n height: 36px;\n width: 36px;\n "])))),y(P,T.XLarge,t(x||(x=k(["\n height: 42px;\n width: 42px;\n "])))),P),G=(y(S={},f.Light,t(D||(D=k(["\n color: ",";\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),b.gray.base,b.black,b.gray.light2)),y(S,f.Dark,t(L||(L=k(["\n color: ",";\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),b.gray.light1,b.gray.light3,b.gray.dark1)),S),H=(y(N={},f.Light,t(z||(z=k(["\n &:focus {\n color: ",";\n box-shadow: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),b.black,u[f.Light].default,b.gray.light2)),y(N,f.Dark,t(E||(E=k(["\n &:focus {\n color: ",";\n box-shadow: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),b.gray.light3,u[f.Dark].default,b.gray.dark1)),N),J=(y(M={},f.Light,t(I||(I=k(["\n cursor: not-allowed;\n color: ",";\n background-color: rgba(255, 255, 255, 0);\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n\n &:focus {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n "])),b.gray.light1,b.gray.light1,b.gray.light1)),y(M,f.Dark,t(C||(C=k(["\n cursor: not-allowed;\n color: ",";\n background-color: rgba(255, 255, 255, 0);\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n\n &:focus {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n "])),b.gray.dark1,b.gray.dark1,b.gray.dark1)),M),Q=(y(K={},f.Light,t(B||(B=k(["\n color: ",";\n\n &:before {\n background-color: ",";\n opacity: 1;\n transform: scale(1);\n }\n "])),b.black,b.gray.light2)),y(K,f.Dark,t(X||(X=k(["\n color: ",";\n\n &:before {\n background-color: ",";\n opacity: 1;\n transform: scale(1);\n }\n "])),b.gray.light3,b.gray.dark1)),K),U=t(R||(R=k(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n"]))),V=["size","darkMode","disabled","active","className","children"],W=n.forwardRef((function(r,t){var f,b,g=r.size,u=void 0===g?T.Default:g,d=r.darkMode,k=r.disabled,v=void 0!==k&&k,O=r.active,w=void 0!==O&&O,j=r.className,x=r.children,P=m(r,V),D=l(d).theme,L=c().usingKeyboard,S="string"==typeof P.href;e(P,"IconButton");var z=n.Children.map(x,(function(r){if(!r)return null;if(s(r,"Icon")||i(r)){var e=r.props,o=e.size,t=e.title,a={size:o||u};return"string"==typeof t&&0!==t.length||(a.title=!1),n.cloneElement(r,a)}return r})),E=p(p({},P),{},(y(b={ref:t,tabIndex:0},"aria-disabled",v),y(b,"href",v?void 0:P.href),y(b,"onClick",v?void 0:P.onClick),y(b,"className",a(q,A,F[u],G[D],(y(f={},H[D],L),y(f,Q[D],w&&!v),y(f,J[D],v),f),j)),b));return n.createElement(o,h({as:S?"a":"button"},E),n.createElement("div",{className:U},z))}));W.displayName="IconButton",W.propTypes={darkMode:r.bool,size:r.oneOf(Object.values(T)),className:r.string,children:r.node,disabled:r.bool,href:r.string,active:r.bool};export{T as Size,W as default};
//# sourceMappingURL=index.js.map

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

!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("@leafygreen-ui/emotion"),require("prop-types"),require("@leafygreen-ui/box"),require("@leafygreen-ui/lib"),require("@leafygreen-ui/leafygreen-provider"),require("@leafygreen-ui/icon"),require("@leafygreen-ui/a11y"),require("@leafygreen-ui/palette"),require("@leafygreen-ui/tokens")):"function"==typeof define&&define.amd?define(["exports","react","@leafygreen-ui/emotion","prop-types","@leafygreen-ui/box","@leafygreen-ui/lib","@leafygreen-ui/leafygreen-provider","@leafygreen-ui/icon","@leafygreen-ui/a11y","@leafygreen-ui/palette","@leafygreen-ui/tokens"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self)["@leafygreen-ui/icon-button"]={},e.React,e["@leafygreen-ui/emotion"],e.PropTypes,e["@leafygreen-ui/box"],e["@leafygreen-ui/lib"],e["@leafygreen-ui/leafygreen-provider"],e["@leafygreen-ui/icon"],e["@leafygreen-ui/a11y"],e["@leafygreen-ui/palette"],e["@leafygreen-ui/tokens"])}(this,(function(e,n,r,t,o,a,i,l,c,s,u){"use strict";function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var g=f(n),d=f(t),p=f(o);function b(e,n){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);n&&(t=t.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),r.push.apply(r,t)}return r}function y(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{};n%2?b(Object(r),!0).forEach((function(n){h(e,n,r[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):b(Object(r)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(r,n))}))}return e}function h(e,n,r){return n in e?Object.defineProperty(e,n,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[n]=r,e}function m(){return m=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e},m.apply(this,arguments)}function k(e,n){if(null==e)return{};var r,t,o=function(e,n){if(null==e)return{};var r,t,o={},a=Object.keys(e);for(t=0;t<a.length;t++)r=a[t],n.indexOf(r)>=0||(o[r]=e[r]);return o}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(t=0;t<a.length;t++)r=a[t],n.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}function v(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}var O,w,j,x,P,D,T,q,L,S,z,C,E,N,I,M,R,B,K,X={Default:"default",Large:"large",XLarge:"xlarge"},_=r.css(O||(O=v(["\n border: none;\n -webkit-appearance: unset;\n padding: unset;\n"]))),A=r.css(w||(w=v(["\n display: inline-block;\n border-radius: 100px;\n position: relative;\n cursor: pointer;\n flex-shrink: 0;\n transition: ","ms ease-in-out;\n transition-property: color, box-shadow;\n\n // Set background to fully-transparent white for cross-browser compatability with Safari\n //\n // Safari treats \"transparent\" values in CSS as transparent black instead of white\n // which can make things render differently across browsers if not defined explicitly.\n background-color: rgba(255, 255, 255, 0);\n\n &:before {\n content: '';\n transition: ","ms all ease-in-out;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n border-radius: 100%;\n opacity: 0;\n transform: scale(0.8);\n }\n\n &:active:before,\n &:hover:before,\n &:focus:before {\n opacity: 1;\n transform: scale(1);\n }\n\n &:focus {\n outline: none;\n }\n"])),u.transitionDuration.default,u.transitionDuration.default),G=(h(D={},X.Default,r.css(j||(j=v(["\n height: 28px;\n width: 28px;\n "])))),h(D,X.Large,r.css(x||(x=v(["\n height: 36px;\n width: 36px;\n "])))),h(D,X.XLarge,r.css(P||(P=v(["\n height: 42px;\n width: 42px;\n "])))),D),U=(h(L={},a.Theme.Light,r.css(T||(T=v(["\n color: ",";\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),s.palette.gray.base,s.palette.black,s.palette.gray.light2)),h(L,a.Theme.Dark,r.css(q||(q=v(["\n color: ",";\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),s.palette.gray.light1,s.palette.gray.light3,s.palette.gray.dark1)),L),F=(h(C={},a.Theme.Light,r.css(S||(S=v(["\n &:focus {\n color: ",";\n box-shadow: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),s.palette.black,u.focusRing[a.Theme.Light].default,s.palette.gray.light2)),h(C,a.Theme.Dark,r.css(z||(z=v(["\n &:focus {\n color: ",";\n box-shadow: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),s.palette.gray.light3,u.focusRing[a.Theme.Dark].default,s.palette.gray.dark1)),C),H=(h(I={},a.Theme.Light,r.css(E||(E=v(["\n cursor: not-allowed;\n color: ",";\n background-color: rgba(255, 255, 255, 0);\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n\n &:focus {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n "])),s.palette.gray.light1,s.palette.gray.light1,s.palette.gray.light1)),h(I,a.Theme.Dark,r.css(N||(N=v(["\n cursor: not-allowed;\n color: ",";\n background-color: rgba(255, 255, 255, 0);\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n\n &:focus {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n "])),s.palette.gray.dark1,s.palette.gray.dark1,s.palette.gray.dark1)),I),J=(h(B={},a.Theme.Light,r.css(M||(M=v(["\n color: ",";\n\n &:before {\n background-color: ",";\n opacity: 1;\n transform: scale(1);\n }\n "])),s.palette.black,s.palette.gray.light2)),h(B,a.Theme.Dark,r.css(R||(R=v(["\n color: ",";\n\n &:before {\n background-color: ",";\n opacity: 1;\n transform: scale(1);\n }\n "])),s.palette.gray.light3,s.palette.gray.dark1)),B),Q=r.css(K||(K=v(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n"]))),V=["size","darkMode","disabled","active","className","children"],W=g.default.forwardRef((function(e,n){var t,o,s=e.size,u=void 0===s?X.Default:s,f=e.darkMode,d=e.disabled,b=void 0!==d&&d,v=e.active,O=void 0!==v&&v,w=e.className,j=e.children,x=k(e,V),P=i.useDarkMode(f).theme,D=i.useUsingKeyboardContext().usingKeyboard,T="string"==typeof x.href;c.validateAriaLabelProps(x,"IconButton");var q=g.default.Children.map(j,(function(e){if(!e)return null;if(a.isComponentType(e,"Icon")||l.isComponentGlyph(e)){var n=e.props,r=n.size,t=n.title,o={size:r||u};return"string"==typeof t&&0!==t.length||(o.title=!1),g.default.cloneElement(e,o)}return e})),L=y(y({},x),{},(h(o={ref:n,tabIndex:0},"aria-disabled",b),h(o,"href",b?void 0:x.href),h(o,"onClick",b?void 0:x.onClick),h(o,"className",r.cx(_,A,G[u],U[P],(h(t={},F[P],D),h(t,J[P],O&&!b),h(t,H[P],b),t),w)),o));return g.default.createElement(p.default,m({as:T?"a":"button"},L),g.default.createElement("div",{className:Q},q))}));W.displayName="IconButton",W.propTypes={darkMode:d.default.bool,size:d.default.oneOf(Object.values(X)),className:d.default.string,children:d.default.node,disabled:d.default.bool,href:d.default.string,active:d.default.bool},e.Size=X,e.default=W,Object.defineProperty(e,"__esModule",{value:!0})}));
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("prop-types"),require("@leafygreen-ui/a11y"),require("@leafygreen-ui/box"),require("@leafygreen-ui/emotion"),require("@leafygreen-ui/icon"),require("@leafygreen-ui/leafygreen-provider"),require("@leafygreen-ui/lib"),require("@leafygreen-ui/palette"),require("@leafygreen-ui/tokens")):"function"==typeof define&&define.amd?define(["exports","react","prop-types","@leafygreen-ui/a11y","@leafygreen-ui/box","@leafygreen-ui/emotion","@leafygreen-ui/icon","@leafygreen-ui/leafygreen-provider","@leafygreen-ui/lib","@leafygreen-ui/palette","@leafygreen-ui/tokens"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self)["@leafygreen-ui/icon-button"]={},e.React,e.PropTypes,e["@leafygreen-ui/a11y"],e["@leafygreen-ui/box"],e["@leafygreen-ui/emotion"],e["@leafygreen-ui/icon"],e["@leafygreen-ui/leafygreen-provider"],e["@leafygreen-ui/lib"],e["@leafygreen-ui/palette"],e["@leafygreen-ui/tokens"])}(this,(function(e,n,r,t,o,a,i,l,c,s,u){"use strict";function f(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var g=f(n),d=f(r),p=f(o);function b(e,n){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var t=Object.getOwnPropertySymbols(e);n&&(t=t.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),r.push.apply(r,t)}return r}function y(e){for(var n=1;n<arguments.length;n++){var r=null!=arguments[n]?arguments[n]:{};n%2?b(Object(r),!0).forEach((function(n){h(e,n,r[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):b(Object(r)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(r,n))}))}return e}function h(e,n,r){return n in e?Object.defineProperty(e,n,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[n]=r,e}function m(){return m=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e},m.apply(this,arguments)}function k(e,n){if(null==e)return{};var r,t,o=function(e,n){if(null==e)return{};var r,t,o={},a=Object.keys(e);for(t=0;t<a.length;t++)r=a[t],n.indexOf(r)>=0||(o[r]=e[r]);return o}(e,n);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);for(t=0;t<a.length;t++)r=a[t],n.indexOf(r)>=0||Object.prototype.propertyIsEnumerable.call(e,r)&&(o[r]=e[r])}return o}function v(e,n){return n||(n=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(n)}}))}var O,w,j,x,P,D,T,q,L,S,z,C,E,N,I,M,R,B,K,X={Default:"default",Large:"large",XLarge:"xlarge"},_=a.css(O||(O=v(["\n border: none;\n -webkit-appearance: unset;\n padding: unset;\n"]))),A=a.css(w||(w=v(["\n display: inline-block;\n border-radius: 100px;\n position: relative;\n cursor: pointer;\n flex-shrink: 0;\n transition: ","ms ease-in-out;\n transition-property: color, box-shadow;\n\n // Set background to fully-transparent white for cross-browser compatability with Safari\n //\n // Safari treats \"transparent\" values in CSS as transparent black instead of white\n // which can make things render differently across browsers if not defined explicitly.\n background-color: rgba(255, 255, 255, 0);\n\n &:before {\n content: '';\n transition: ","ms all ease-in-out;\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n border-radius: 100%;\n opacity: 0;\n transform: scale(0.8);\n }\n\n &:active:before,\n &:hover:before,\n &:focus:before {\n opacity: 1;\n transform: scale(1);\n }\n\n &:focus {\n outline: none;\n }\n"])),u.transitionDuration.default,u.transitionDuration.default),G=(h(D={},X.Default,a.css(j||(j=v(["\n height: 28px;\n width: 28px;\n "])))),h(D,X.Large,a.css(x||(x=v(["\n height: 36px;\n width: 36px;\n "])))),h(D,X.XLarge,a.css(P||(P=v(["\n height: 42px;\n width: 42px;\n "])))),D),U=(h(L={},c.Theme.Light,a.css(T||(T=v(["\n color: ",";\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),s.palette.gray.base,s.palette.black,s.palette.gray.light2)),h(L,c.Theme.Dark,a.css(q||(q=v(["\n color: ",";\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),s.palette.gray.light1,s.palette.gray.light3,s.palette.gray.dark1)),L),F=(h(C={},c.Theme.Light,a.css(S||(S=v(["\n &:focus {\n color: ",";\n box-shadow: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),s.palette.black,u.focusRing[c.Theme.Light].default,s.palette.gray.light2)),h(C,c.Theme.Dark,a.css(z||(z=v(["\n &:focus {\n color: ",";\n box-shadow: ",";\n\n &:before {\n background-color: ",";\n }\n }\n "])),s.palette.gray.light3,u.focusRing[c.Theme.Dark].default,s.palette.gray.dark1)),C),H=(h(I={},c.Theme.Light,a.css(E||(E=v(["\n cursor: not-allowed;\n color: ",";\n background-color: rgba(255, 255, 255, 0);\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n\n &:focus {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n "])),s.palette.gray.light1,s.palette.gray.light1,s.palette.gray.light1)),h(I,c.Theme.Dark,a.css(N||(N=v(["\n cursor: not-allowed;\n color: ",";\n background-color: rgba(255, 255, 255, 0);\n\n &:active,\n &:hover {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n\n &:focus {\n color: ",";\n\n &:before {\n background-color: rgba(255, 255, 255, 0);\n }\n }\n "])),s.palette.gray.dark1,s.palette.gray.dark1,s.palette.gray.dark1)),I),J=(h(B={},c.Theme.Light,a.css(M||(M=v(["\n color: ",";\n\n &:before {\n background-color: ",";\n opacity: 1;\n transform: scale(1);\n }\n "])),s.palette.black,s.palette.gray.light2)),h(B,c.Theme.Dark,a.css(R||(R=v(["\n color: ",";\n\n &:before {\n background-color: ",";\n opacity: 1;\n transform: scale(1);\n }\n "])),s.palette.gray.light3,s.palette.gray.dark1)),B),Q=a.css(K||(K=v(["\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n"]))),V=["size","darkMode","disabled","active","className","children"],W=g.default.forwardRef((function(e,n){var r,o,s=e.size,u=void 0===s?X.Default:s,f=e.darkMode,d=e.disabled,b=void 0!==d&&d,v=e.active,O=void 0!==v&&v,w=e.className,j=e.children,x=k(e,V),P=l.useDarkMode(f).theme,D=l.useUsingKeyboardContext().usingKeyboard,T="string"==typeof x.href;t.validateAriaLabelProps(x,"IconButton");var q=g.default.Children.map(j,(function(e){if(!e)return null;if(c.isComponentType(e,"Icon")||i.isComponentGlyph(e)){var n=e.props,r=n.size,t=n.title,o={size:r||u};return"string"==typeof t&&0!==t.length||(o.title=!1),g.default.cloneElement(e,o)}return e})),L=y(y({},x),{},(h(o={ref:n,tabIndex:0},"aria-disabled",b),h(o,"href",b?void 0:x.href),h(o,"onClick",b?void 0:x.onClick),h(o,"className",a.cx(_,A,G[u],U[P],(h(r={},F[P],D),h(r,J[P],O&&!b),h(r,H[P],b),r),w)),o));return g.default.createElement(p.default,m({as:T?"a":"button"},L),g.default.createElement("div",{className:Q},q))}));W.displayName="IconButton",W.propTypes={darkMode:d.default.bool,size:d.default.oneOf(Object.values(X)),className:d.default.string,children:d.default.node,disabled:d.default.bool,href:d.default.string,active:d.default.bool},e.Size=X,e.default=W,Object.defineProperty(e,"__esModule",{value:!0})}));
//# sourceMappingURL=index.js.map
{
"name": "@leafygreen-ui/icon-button",
"version": "15.0.1",
"version": "15.0.2",
"description": "LeafyGreen UI Kit Icon Buttons",

@@ -22,12 +22,10 @@ "main": "./dist/index.js",

},
"devDependencies": {
"@leafygreen-ui/icon": "^11.12.1"
},
"dependencies": {
"@leafygreen-ui/a11y": "^1.3.4",
"@leafygreen-ui/box": "^3.1.1",
"@leafygreen-ui/emotion": "^4.0.3",
"@leafygreen-ui/icon": "^11.12.2",
"@leafygreen-ui/lib": "^10.0.0",
"@leafygreen-ui/emotion": "^4.0.3",
"@leafygreen-ui/tokens": "^1.4.0",
"@leafygreen-ui/palette": "^3.4.4",
"@leafygreen-ui/box": "^3.1.1"
"@leafygreen-ui/palette": "^3.4.5",
"@leafygreen-ui/tokens": "^1.4.1"
},

@@ -45,2 +43,2 @@ "peerDependencies": {

}
}
}

@@ -18,3 +18,3 @@ {

{
"path": "../lib"
"path": "../box"
},

@@ -25,12 +25,12 @@ {

{
"path": "../tokens"
"path": "../icon"
},
{
"path": "../palette"
"path": "../lib"
},
{
"path": "../box"
"path": "../palette"
},
{
"path": "../icon"
"path": "../tokens"
},

@@ -37,0 +37,0 @@ {

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

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

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