@twilio-paste/button
Advanced tools
Comparing version 1.1.23 to 1.1.24
@@ -6,2 +6,13 @@ # Change Log | ||
## [1.1.24](https://github.com/twilio-labs/paste/compare/@twilio-paste/button@1.1.23...@twilio-paste/button@1.1.24) (2020-03-04) | ||
### Bug Fixes | ||
* **button:** change borders to box-shadow ([689061d](https://github.com/twilio-labs/paste/commit/689061d4c4c9a5f033d74c4af7e0ca1f211b12d1)) | ||
## [1.1.23](https://github.com/twilio-labs/paste/compare/@twilio-paste/button@1.1.22...@twilio-paste/button@1.1.23) (2020-03-02) | ||
@@ -8,0 +19,0 @@ |
@@ -1,2 +0,2 @@ | ||
import{Children as o,isValidElement as n,createElement as r}from"react";import{Spinner as e}from"@twilio-paste/spinner";import t from"@emotion/styled";import{css as c}from"@emotion/core";import{buttonStyle as a}from"styled-system";import{themeGet as l}from"@styled-system/theme-get";import{Absolute as i}from"@twilio-paste/absolute"; | ||
import{Children as n,isValidElement as o,createElement as r}from"react";import{Spinner as e}from"@twilio-paste/spinner";import t from"@emotion/styled";import{css as a}from"@emotion/core";import{buttonStyle as c}from"styled-system";import{themeGet as s}from"@styled-system/theme-get";import{Absolute as i}from"@twilio-paste/absolute"; | ||
/*! ***************************************************************************** | ||
@@ -15,2 +15,2 @@ Copyright (c) Microsoft Corporation. All rights reserved. | ||
and limitations under the License. | ||
***************************************************************************** */function s(o,n){return Object.defineProperty?Object.defineProperty(o,"raw",{value:n}):o.raw=n,o}var d,u,b,g,f,k,h,v,y,p,m,x,C,w,B,D,P,L,T,z,E,W,S,F,I,M,R,j,H,N,U,O,_,A=c(d||(d=s(["\n font-size: 100%;\n padding: 0;\n"],["\n font-size: 100%;\n padding: 0;\n"]))),Y=function(o){return c(f||(f=s(["\n /* Hide default browser styles */\n appearance: none;\n border: none;\n display: inline-block;\n outline: none;\n background: none;\n transition: background-color 100ms ease-in, border-color 100ms ease-in;\n font-family: ",";\n font-weight: ",";\n\n /* Remove extra black dotted border FF adds */\n &::-moz-focus-inner {\n border: none;\n }\n"],["\n /* Hide default browser styles */\n appearance: none;\n border: none;\n display: inline-block;\n outline: none;\n background: none;\n transition: background-color 100ms ease-in, border-color 100ms ease-in;\n font-family: ",";\n font-weight: ",";\n\n /* Remove extra black dotted border FF adds */\n &::-moz-focus-inner {\n border: none;\n }\n"])),l("fonts.fontFamilyText")(o),l("fontWeights.fontWeightSemibold")(o))},q=function(o){return c([Y(o),c(k||(k=s(["\n text-decoration: none;\n cursor: pointer;\n\n &:focus,\n &:active {\n box-shadow: ",';\n }\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n text-decoration: none;\n }\n '],["\n text-decoration: none;\n cursor: pointer;\n\n &:focus,\n &:active {\n box-shadow: ",';\n }\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n text-decoration: none;\n }\n '])),l("shadows.shadowFocus")(o))])},G=function(o){return c([Y(o),c(h||(h=s(["\n cursor: wait;\n "],["\n cursor: wait;\n "])))])},J=function(o){return c([Y(o),c(v||(v=s(["\n cursor: not-allowed;\n "],["\n cursor: not-allowed;\n "])))])},K=function(o){return c(y||(y=s(["\n border-width: ",";\n border-style: solid;\n color: ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"],["\n border-width: ",";\n border-style: solid;\n color: ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"])),l("borderWidths.borderWidth20")(o),l("textColors.colorTextInverse")(o),l("textColors.colorTextInverse")(o))},Q=function(o){return c([q(o),K(o),c(p||(p=s(["\n border-color: ",";\n background-color: ",";\n\n &:hover {\n border-color: ",";\n background-color: ",";\n }\n &:focus {\n border-color: ",";\n background-color: ",";\n }\n &:active {\n border-color: ",";\n background-color: ",";\n }\n "],["\n border-color: ",";\n background-color: ",";\n\n &:hover {\n border-color: ",";\n background-color: ",";\n }\n &:focus {\n border-color: ",";\n background-color: ",";\n }\n &:active {\n border-color: ",";\n background-color: ",";\n }\n "])),l("borderColors.colorBorderPrimary")(o),l("backgroundColors.colorBackgroundPrimary")(o),l("borderColors.colorBorderPrimaryDarker")(o),l("backgroundColors.colorBackgroundPrimaryDarker")(o),l("borderColors.colorBorderPrimaryDarker")(o),l("backgroundColors.colorBackgroundPrimary")(o),l("borderColors.colorBorderPrimaryDarker")(o),l("backgroundColors.colorBackgroundPrimaryDark")(o))])},V=function(o){return c([G(o),K(o),c(m||(m=s(["\n &,\n &:hover,\n &:active,\n &:focus {\n border-color: ",";\n background-color: ",";\n }\n "],["\n &,\n &:hover,\n &:active,\n &:focus {\n border-color: ",";\n background-color: ",";\n }\n "])),l("borderColors.colorBorderPrimaryDarker")(o),l("backgroundColors.colorBackgroundPrimaryDarker")(o))])},X=function(o){return c([J(o),K(o),c(x||(x=s(["\n border-color: ",";\n background-color: ",";\n\n &:hover,\n &:active {\n background-color: ",";\n }\n "],["\n border-color: ",";\n background-color: ",";\n\n &:hover,\n &:active {\n background-color: ",";\n }\n "])),l("borderColors.colorBorderPrimaryLight")(o),l("backgroundColors.colorBackgroundPrimaryLight")(o),l("backgroundColors.colorBackgroundPrimaryLight")(o))])},Z=function(o){return c(C||(C=s(["\n border-width: ",";\n border-style: solid;\n background-color: ",";\n"],["\n border-width: ",";\n border-style: solid;\n background-color: ",";\n"])),l("borderWidths.borderWidth20")(o),l("backgroundColors.colorBackgroundBody")(o))},$=function(o){return c([q(o),Z(o),c(w||(w=s(["\n color: ",";\n border-color: ",";\n background-color: ",";\n\n &:hover {\n color: ",";\n border-color: ",";\n background-color: ",";\n }\n\n &:focus {\n color: ",";\n border-color: ",";\n background-color: ",";\n }\n\n &:active {\n color: ",";\n border-color: ",";\n background-color: ",";\n }\n "],["\n color: ",";\n border-color: ",";\n background-color: ",";\n\n &:hover {\n color: ",";\n border-color: ",";\n background-color: ",";\n }\n\n &:focus {\n color: ",";\n border-color: ",";\n background-color: ",";\n }\n\n &:active {\n color: ",";\n border-color: ",";\n background-color: ",";\n }\n "])),l("textColors.colorTextLink")(o),l("borderColors.colorBorderPrimary")(o),l("backgroundColors.colorBackgroundBody")(o),l("textColors.colorTextLinkDarker")(o),l("borderColors.colorBorderPrimaryDarker")(o),l("backgroundColors.colorBackgroundPrimaryLightest")(o),l("textColors.colorTextLinkDarker")(o),l("borderColors.colorBorderPrimaryDarker")(o),l("backgroundColors.colorBackgroundPrimaryLightest")(o),l("textColors.colorTextLinkDarker")(o),l("borderColors.colorBorderPrimaryDarker")(o),l("backgroundColors.colorBackgroundPrimaryLighter")(o))])},oo=function(o){return c([G(o),Z(o),c(B||(B=s(["\n color: ",";\n border-color: ",";\n background-color: ",";\n "],["\n color: ",";\n border-color: ",";\n background-color: ",";\n "])),l("textColors.colorTextLinkDarker")(o),l("borderColors.colorBorderPrimaryLighter")(o),l("backgroundColors.colorBackgroundPrimaryLighter")(o))])},no=function(o){return c([J(o),Z(o),c(D||(D=s(["\n color: ",";\n border-color: ",";\n "],["\n color: ",";\n border-color: ",";\n "])),l("textColors.colorTextLinkLight")(o),l("borderColors.colorBorderPrimaryLight")(o))])},ro=function(o){return c(P||(P=s(["\n border-width: ",";\n border-style: solid;\n background-color: ",";\n color: ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"],["\n border-width: ",";\n border-style: solid;\n background-color: ",";\n color: ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"])),l("borderWidths.borderWidth20")(o),l("backgroundColors.colorBackgroundDestructive")(o),l("textColors.colorTextInverse")(o),l("textColors.colorTextInverse")(o))},eo=function(o){return c([q(o),ro(o),c(L||(L=s(["\n border-color: ",";\n\n &:hover {\n border-color: ",";\n background-color: ",";\n }\n\n &:focus {\n border-color: ",";\n background-color: ",";\n }\n\n &:active {\n border-color: ",";\n background-color: ",";\n }\n "],["\n border-color: ",";\n\n &:hover {\n border-color: ",";\n background-color: ",";\n }\n\n &:focus {\n border-color: ",";\n background-color: ",";\n }\n\n &:active {\n border-color: ",";\n background-color: ",";\n }\n "])),l("borderColors.colorBorderDestructive")(o),l("borderColors.colorBorderDestructiveDarker")(o),l("backgroundColors.colorBackgroundDestructiveDarker")(o),l("borderColors.colorBorderDestructiveDarker")(o),l("backgroundColors.colorBackgroundDestructive")(o),l("borderColors.colorBorderDestructiveDarker")(o),l("backgroundColors.colorBackgroundDestructiveDark")(o))])},to=function(o){return c([G(o),ro(o),c(T||(T=s(["\n border-color: ",";\n background-color: ",";\n "],["\n border-color: ",";\n background-color: ",";\n "])),l("borderColors.colorBorderDestructiveDarker")(o),l("backgroundColors.colorBackgroundDestructiveDarker")(o))])},co=function(o){return c([J(o),ro(o),c(z||(z=s(["\n border-color: ",";\n background-color: ",";\n "],["\n border-color: ",";\n background-color: ",";\n "])),l("borderColors.colorBorderDestructiveLight")(o),l("backgroundColors.colorBackgroundDestructiveLight")(o))])},ao=c(E||(E=s(["\n background: none;\n"],["\n background: none;\n"]))),lo=function(o){return c([q(o),ao,c(W||(W=s(["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "],["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "])),l("textColors.colorTextLinkDestructive")(o),l("textColors.colorTextLinkDestructiveDark")(o),l("textColors.colorTextLinkDestructiveDarker")(o))])},io=function(o){return c([G(o),ao,c(S||(S=s(["\n color: ",";\n "],["\n color: ",";\n "])),l("textColors.colorTextLinkDestructiveDarker")(o))])},so=function(o){return c([J(o),ao,c(F||(F=s(["\n color: ",";\n "],["\n color: ",";\n "])),l("textColors.colorTextLinkDestructiveLight")(o))])},uo=c(I||(I=s(["\n background: none;\n"],["\n background: none;\n"]))),bo=function(o){return c([q(o),uo,c(M||(M=s(["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "],["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "])),l("textColors.colorTextLink")(o),l("textColors.colorTextLinkDark")(o),l("textColors.colorTextLinkDarker")(o))])},go=function(o){return c([G(o),uo,c(R||(R=s(["\n color: ",";\n "],["\n color: ",";\n "])),l("textColors.colorTextLinkDarker")(o))])},fo=function(o){return c([J(o),uo,c(j||(j=s(["\n color: ",";\n "],["\n color: ",";\n "])),l("textColors.colorTextLinkLight")(o))])},ko=q,ho=G,vo=J,yo=t.button(N||(N=s(["\n /* To position the loading spinner correctly.\n * Pulled out of styles.ts so it works for the reset styles too.\n */\n position: relative;\n ","\n ","\n ","\n ","\n"],["\n /* To position the loading spinner correctly.\n * Pulled out of styles.ts so it works for the reset styles too.\n */\n position: relative;\n ","\n ","\n ","\n ","\n"])),a,(function(o){switch(o.size){case"reset":return A;case"icon":return function(o){return c(u||(u=s(["\n padding: ",";\n border-radius: ",";\n font-size: 100%;\n /* To fix abnormal button padding-bottom */\n line-height: unset;\n"],["\n padding: ",";\n border-radius: ",";\n font-size: 100%;\n /* To fix abnormal button padding-bottom */\n line-height: unset;\n"])),l("space.space30")(o),l("radii.borderRadius20")(o))}(o);case"small":return function(o){return c(b||(b=s(["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n line-height: ",";\n"],["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n line-height: ",";\n"])),l("space.space10")(o),l("space.space30")(o),l("radii.borderRadius10")(o),l("fontSizes.fontSize30")(o),l("lineHeights.lineHeight20")(o))}(o);case"default":default:return function(o){return c(g||(g=s(["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n\n line-height: ",";\n"],["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n\n line-height: ",";\n"])),l("space.space30")(o),l("space.space50")(o),l("radii.borderRadius20")(o),l("fontSizes.fontSize30")(o),l("lineHeights.lineHeight20")(o))}(o)}}),(function(o){var n=o.variant,r=o.buttonState,e="disabled"===r,t="loading"===r;switch(n){case"reset":return e?vo:t?ho:ko;case"secondary":return e?no:t?oo:$;case"link":return e?fo:t?go:bo;case"destructive":return e?co:t?to:eo;case"destructive_link":return e?so:t?io:lo;case"primary":default:return e?X:t?V:Q}}),(function(o){var n=o.fullWidth;return c(H||(H=s(["\n width: ",";\n"],["\n width: ",";\n"])),n?"100%":"auto")})),po=t.span(O||(O=s(["\n display: grid;\n grid-auto-flow: column;\n /*\n * Neat way to make sure children are spaced apart correctly\n * https://caniuse.com/#feat=multicolumn\n */\n column-gap: ",";\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n text-decoration: inherit;\n ","\n"],["\n display: grid;\n grid-auto-flow: column;\n /*\n * Neat way to make sure children are spaced apart correctly\n * https://caniuse.com/#feat=multicolumn\n */\n column-gap: ",";\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n text-decoration: inherit;\n ","\n"])),l("space.space20"),(function(o){var n=o.buttonState;return c(U||(U=s(["\n opacity: ",";\n"],["\n opacity: ",";\n"])),"loading"===n?"0":"100%")})),mo=t(i)(_||(_=s(["\n display: flex;\n justify-content: center;\n align-items: center;\n line-height: 14px;\n"],["\n display: flex;\n justify-content: center;\n align-items: center;\n line-height: 14px;\n"]))),xo=function(t){var c,a,l=(a=(c=t).loading,c.disabled?"disabled":a?"loading":"default"),i="loading"===l,s="default"!==l,d=t.size;return null==d&&(d="default","link"===t.variant||"destructive_link"===t.variant?d="reset":1===o.count(t.children)&&o.forEach(t.children,(function(o){n(o)&&"string"==typeof o.type.displayName&&o.type.displayName.includes("Icon")&&(d="icon")}))),function(o){var n=o.as,r=o.href,e=o.variant,t=o.size,c=o.tabIndex,a=o.fullWidth,l=o.children,i=null!=r&&""!==r,s=null!=c;if("a"!==n&&i)throw new Error("[Paste: Button] You cannot pass href into a button without the 'a' tag. Use 'as=\"a\"'.");if("a"===n&&!i)throw new Error("[Paste: Button] Missing href prop for link button.");if("a"===n&&"link"===e)throw new Error("[Paste: Button] This should be a link. Use the [Paste: Anchor] component.");if("reset"===e&&"reset"!==t)throw new Error('[Paste: Button] The "RESET" variant can only be used with the "RESET" size.');if("icon"===t&&a)throw new Error("[Paste: Button] Icon buttons should not be fullWidth.");if(null==l)throw new Error("[Paste: Button] Must have non-null children.");if(s&&0!==c&&-1!==c)throw new Error("[Paste: Button] tabIndex must be 0 or -1.")}(t),r(yo,{as:t.as,variant:t.variant,size:d,buttonState:l,disabled:s,autoFocus:t.autoFocus,fullWidth:t.fullWidth,href:t.href,tabIndex:t.tabIndex,type:t.type,onClick:t.onClick,onMouseDown:t.onMouseDown,onMouseUp:t.onMouseUp,onMouseEnter:t.onMouseEnter,onMouseLeave:t.onMouseLeave,onFocus:t.onFocus,onBlur:t.onBlur,"aria-expanded":t["aria-expanded"],"aria-haspopup":t["aria-haspopup"],"aria-controls":t["aria-controls"],"aria-busy":"loading"===l?"true":"false","data-test":t["data-test"]},r(po,{buttonState:l},t.children),i?r(mo,{as:"span"},r(e,{decorative:!1,title:"Loading, please wait.",delay:0})):null)};xo.defaultProps={as:"button",type:"button",variant:"primary",disabled:!1,loading:!1,fullWidth:!1},xo.displayName="Button";export{xo as Button}; | ||
***************************************************************************** */function l(n,o){return Object.defineProperty?Object.defineProperty(n,"raw",{value:o}):n.raw=o,n}var u,d,g,b,h,k,f,p,v,x,w,y,m,C,B,D,P,L,T,z,F,E,S,I,M,W,R,j,H,N,U,O,_,A=a(u||(u=l(["\n font-size: 100%;\n padding: 0;\n"],["\n font-size: 100%;\n padding: 0;\n"]))),Y=function(n){return a(h||(h=l(["\n /* Hide default browser styles */\n appearance: none;\n border: none;\n display: inline-block;\n outline: none;\n background: none;\n transition: background-color 100ms ease-in, box-shadow 100ms ease-in;\n font-family: ",";\n font-weight: ",";\n\n /* Remove extra black dotted border FF adds */\n &::-moz-focus-inner {\n border: none;\n }\n"],["\n /* Hide default browser styles */\n appearance: none;\n border: none;\n display: inline-block;\n outline: none;\n background: none;\n transition: background-color 100ms ease-in, box-shadow 100ms ease-in;\n font-family: ",";\n font-weight: ",";\n\n /* Remove extra black dotted border FF adds */\n &::-moz-focus-inner {\n border: none;\n }\n"])),s("fonts.fontFamilyText")(n),s("fontWeights.fontWeightSemibold")(n))},q=function(n){return a([Y(n),a(k||(k=l(["\n text-decoration: none;\n cursor: pointer;\n\n &:focus,\n &:active {\n box-shadow: ",';\n }\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n text-decoration: none;\n }\n '],["\n text-decoration: none;\n cursor: pointer;\n\n &:focus,\n &:active {\n box-shadow: ",';\n }\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n text-decoration: none;\n }\n '])),s("shadows.shadowFocus")(n))])},G=function(n){return a([Y(n),a(f||(f=l(["\n cursor: wait;\n "],["\n cursor: wait;\n "])))])},J=function(n){return a([Y(n),a(p||(p=l(["\n cursor: not-allowed;\n "],["\n cursor: not-allowed;\n "])))])},K=function(n){return a(v||(v=l(["\n color: ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"],["\n color: ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"])),s("textColors.colorTextInverse")(n),s("textColors.colorTextInverse")(n))},Q=function(n){return a([q(n),K(n),a(x||(x=l(["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n\n &:hover {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n &:focus {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n &:active {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n "],["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n\n &:hover {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n &:focus {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n &:active {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n "])),s("backgroundColors.colorBackgroundPrimary")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundPrimary")(n),s("backgroundColors.colorBackgroundPrimaryDarker")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundPrimaryDarker")(n),s("backgroundColors.colorBackgroundPrimary")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundPrimaryDarker")(n),s("shadows.shadowFocus")(n),s("backgroundColors.colorBackgroundPrimaryDark")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundPrimaryDarker")(n),s("shadows.shadowFocus")(n))])},V=function(n){return a([G(n),K(n),a(w||(w=l(["\n &,\n &:hover,\n &:active,\n &:focus {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n "],["\n &,\n &:hover,\n &:active,\n &:focus {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n "])),s("backgroundColors.colorBackgroundPrimaryDarker")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundPrimaryDarker")(n))])},X=function(n){return a([J(n),K(n),a(y||(y=l(["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n\n &:hover,\n &:active {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n "],["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n\n &:hover,\n &:active {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n "])),s("backgroundColors.colorBackgroundPrimaryLight")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundPrimaryLight")(n),s("backgroundColors.colorBackgroundPrimaryLight")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundPrimaryLight")(n))])},Z=function(n){return a(m||(m=l(["\n background-color: ",";\n"],["\n background-color: ",";\n"])),s("backgroundColors.colorBackgroundBody")(n))},$=function(n){return a([q(n),Z(n),a(C||(C=l(["\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 "," ",";\n\n &:hover {\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n\n &:focus {\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n\n &:active {\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n "],["\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 "," ",";\n\n &:hover {\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n\n &:focus {\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n\n &:active {\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n "])),s("textColors.colorTextLink")(n),s("backgroundColors.colorBackgroundBody")(n),s("space.space10")(n),s("borderColors.colorBorderPrimary")(n),s("textColors.colorTextLinkDarker")(n),s("backgroundColors.colorBackgroundPrimaryLightest")(n),s("space.space10")(n),s("borderColors.colorBorderPrimaryDarker")(n),s("textColors.colorTextLinkDarker")(n),s("backgroundColors.colorBackgroundPrimaryLightest")(n),s("space.space10")(n),s("borderColors.colorBorderPrimaryDarker")(n),s("shadows.shadowFocus")(n),s("textColors.colorTextLinkDarker")(n),s("backgroundColors.colorBackgroundPrimaryLighter")(n),s("space.space10")(n),s("borderColors.colorBorderPrimaryDarker")(n),s("shadows.shadowFocus")(n))])},nn=function(n){return a([G(n),Z(n),a(B||(B=l(["\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "],["\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "])),s("textColors.colorTextLinkDarker")(n),s("backgroundColors.colorBackgroundPrimaryLighter")(n),s("space.space10")(n),s("borderColors.colorBorderPrimaryLighter")(n))])},on=function(n){return a([J(n),Z(n),a(D||(D=l(["\n color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "],["\n color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "])),s("textColors.colorTextLinkLight")(n),s("space.space10")(n),s("borderColors.colorBorderPrimaryLight")(n))])},rn=function(n){return a(P||(P=l(["\n background-color: ",";\n color: ",";\n box-shadow: inset 0 0 0 ","\n ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"],["\n background-color: ",";\n color: ",";\n box-shadow: inset 0 0 0 ","\n ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"])),s("backgroundColors.colorBackgroundDestructive")(n),s("textColors.colorTextInverse")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundDestructive")(n),s("textColors.colorTextInverse")(n))},en=function(n){return a([q(n),rn(n),a(L||(L=l(["\n &:hover {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n\n &:focus {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n\n &:active {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n "],["\n &:hover {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n\n &:focus {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n\n &:active {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n "])),s("backgroundColors.colorBackgroundDestructiveDarker")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundDestructiveDarker")(n),s("backgroundColors.colorBackgroundDestructive")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundDestructiveDarker")(n),s("shadows.shadowFocus")(n),s("backgroundColors.colorBackgroundDestructiveDark")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundDestructiveDarker")(n),s("shadows.shadowFocus")(n))])},tn=function(n){return a([G(n),rn(n),a(T||(T=l(["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "],["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "])),s("backgroundColors.colorBackgroundDestructiveDarker")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundDestructiveDarker")(n))])},an=function(n){return a([J(n),rn(n),a(z||(z=l(["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "],["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "])),s("backgroundColors.colorBackgroundDestructiveLight")(n),s("space.space10")(n),s("backgroundColors.colorBackgroundDestructiveLight")(n))])},cn=a(F||(F=l(["\n background: none;\n"],["\n background: none;\n"]))),sn=function(n){return a([q(n),cn,a(E||(E=l(["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "],["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "])),s("textColors.colorTextLinkDestructive")(n),s("textColors.colorTextLinkDestructiveDark")(n),s("textColors.colorTextLinkDestructiveDarker")(n))])},ln=function(n){return a([G(n),cn,a(S||(S=l(["\n color: ",";\n "],["\n color: ",";\n "])),s("textColors.colorTextLinkDestructiveDarker")(n))])},un=function(n){return a([J(n),cn,a(I||(I=l(["\n color: ",";\n "],["\n color: ",";\n "])),s("textColors.colorTextLinkDestructiveLight")(n))])},dn=a(M||(M=l(["\n background: none;\n"],["\n background: none;\n"]))),gn=function(n){return a([q(n),dn,a(W||(W=l(["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "],["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "])),s("textColors.colorTextLink")(n),s("textColors.colorTextLinkDark")(n),s("textColors.colorTextLinkDarker")(n))])},bn=function(n){return a([G(n),dn,a(R||(R=l(["\n color: ",";\n "],["\n color: ",";\n "])),s("textColors.colorTextLinkDarker")(n))])},hn=function(n){return a([J(n),dn,a(j||(j=l(["\n color: ",";\n "],["\n color: ",";\n "])),s("textColors.colorTextLinkLight")(n))])},kn=q,fn=G,pn=J,vn=t.button(N||(N=l(["\n /* To position the loading spinner correctly.\n * Pulled out of styles.ts so it works for the reset styles too.\n */\n position: relative;\n ","\n ","\n ","\n ","\n"],["\n /* To position the loading spinner correctly.\n * Pulled out of styles.ts so it works for the reset styles too.\n */\n position: relative;\n ","\n ","\n ","\n ","\n"])),c,(function(n){switch(n.size){case"reset":return A;case"icon":return function(n){return a(d||(d=l(["\n padding: ",";\n border-radius: ",";\n font-size: 100%;\n /* To fix abnormal button padding-bottom */\n line-height: unset;\n"],["\n padding: ",";\n border-radius: ",";\n font-size: 100%;\n /* To fix abnormal button padding-bottom */\n line-height: unset;\n"])),s("space.space30")(n),s("radii.borderRadius20")(n))}(n);case"small":return function(n){return a(g||(g=l(["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n line-height: ",";\n"],["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n line-height: ",";\n"])),s("space.space10")(n),s("space.space30")(n),s("radii.borderRadius10")(n),s("fontSizes.fontSize30")(n),s("lineHeights.lineHeight30")(n))}(n);case"default":default:return function(n){return a(b||(b=l(["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n\n line-height: ",";\n"],["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n\n line-height: ",";\n"])),s("space.space30")(n),s("space.space50")(n),s("radii.borderRadius20")(n),s("fontSizes.fontSize30")(n),s("lineHeights.lineHeight30")(n))}(n)}}),(function(n){var o=n.variant,r=n.buttonState,e="disabled"===r,t="loading"===r;switch(o){case"reset":return e?pn:t?fn:kn;case"secondary":return e?on:t?nn:$;case"link":return e?hn:t?bn:gn;case"destructive":return e?an:t?tn:en;case"destructive_link":return e?un:t?ln:sn;case"primary":default:return e?X:t?V:Q}}),(function(n){var o=n.fullWidth;return a(H||(H=l(["\n width: ",";\n"],["\n width: ",";\n"])),o?"100%":"auto")})),xn=t.span(O||(O=l(["\n display: grid;\n grid-auto-flow: column;\n /*\n * Neat way to make sure children are spaced apart correctly\n * https://caniuse.com/#feat=multicolumn\n */\n column-gap: ",";\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n text-decoration: inherit;\n ","\n"],["\n display: grid;\n grid-auto-flow: column;\n /*\n * Neat way to make sure children are spaced apart correctly\n * https://caniuse.com/#feat=multicolumn\n */\n column-gap: ",";\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n text-decoration: inherit;\n ","\n"])),s("space.space20"),(function(n){var o=n.buttonState;return a(U||(U=l(["\n opacity: ",";\n"],["\n opacity: ",";\n"])),"loading"===o?"0":"100%")})),wn=t(i)(_||(_=l(["\n display: flex;\n justify-content: center;\n align-items: center;\n line-height: 14px;\n"],["\n display: flex;\n justify-content: center;\n align-items: center;\n line-height: 14px;\n"]))),yn=function(t){var a,c,s=(c=(a=t).loading,a.disabled?"disabled":c?"loading":"default"),i="loading"===s,l="default"!==s,u=t.size;return null==u&&(u="default","link"===t.variant||"destructive_link"===t.variant?u="reset":1===n.count(t.children)&&n.forEach(t.children,(function(n){o(n)&&"string"==typeof n.type.displayName&&n.type.displayName.includes("Icon")&&(u="icon")}))),function(n){var o=n.as,r=n.href,e=n.variant,t=n.size,a=n.tabIndex,c=n.fullWidth,s=n.children,i=null!=r&&""!==r,l=null!=a;if("a"!==o&&i)throw new Error("[Paste: Button] You cannot pass href into a button without the 'a' tag. Use 'as=\"a\"'.");if("a"===o&&!i)throw new Error("[Paste: Button] Missing href prop for link button.");if("a"===o&&"link"===e)throw new Error("[Paste: Button] This should be a link. Use the [Paste: Anchor] component.");if("reset"===e&&"reset"!==t)throw new Error('[Paste: Button] The "RESET" variant can only be used with the "RESET" size.');if("icon"===t&&c)throw new Error("[Paste: Button] Icon buttons should not be fullWidth.");if(null==s)throw new Error("[Paste: Button] Must have non-null children.");if(l&&0!==a&&-1!==a)throw new Error("[Paste: Button] tabIndex must be 0 or -1.")}(t),r(vn,{as:t.as,variant:t.variant,size:u,buttonState:s,disabled:l,autoFocus:t.autoFocus,fullWidth:t.fullWidth,href:t.href,tabIndex:t.tabIndex,type:t.type,onClick:t.onClick,onMouseDown:t.onMouseDown,onMouseUp:t.onMouseUp,onMouseEnter:t.onMouseEnter,onMouseLeave:t.onMouseLeave,onFocus:t.onFocus,onBlur:t.onBlur,"aria-expanded":t["aria-expanded"],"aria-haspopup":t["aria-haspopup"],"aria-controls":t["aria-controls"],"aria-busy":"loading"===s?"true":"false","data-test":t["data-test"]},r(xn,{buttonState:s},t.children),i?r(wn,{as:"span"},r(e,{decorative:!1,title:"Loading, please wait.",delay:0})):null)};yn.defaultProps={as:"button",type:"button",variant:"primary",disabled:!1,loading:!1,fullWidth:!1},yn.displayName="Button";export{yn as Button}; |
@@ -1,2 +0,2 @@ | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var o,n=require("react"),e=require("@twilio-paste/spinner"),r=(o=require("@emotion/styled"))&&"object"==typeof o&&"default"in o?o.default:o,t=require("@emotion/core"),c=require("styled-system"),s=require("@styled-system/theme-get"),a=require("@twilio-paste/absolute"); | ||
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n,e=require("react"),o=require("@twilio-paste/spinner"),t=(n=require("@emotion/styled"))&&"object"==typeof n&&"default"in n?n.default:n,r=require("@emotion/core"),s=require("styled-system"),a=require("@styled-system/theme-get"),c=require("@twilio-paste/absolute"); | ||
/*! ***************************************************************************** | ||
@@ -16,2 +16,2 @@ Copyright (c) Microsoft Corporation. All rights reserved. | ||
***************************************************************************** */ | ||
function l(o,n){return Object.defineProperty?Object.defineProperty(o,"raw",{value:n}):o.raw=n,o}var i,d,u,h,b,g,m,k,f,v,y,p,G,x,C,w,B,D,P,L,T,z,E,W,S,M,F,I,j,q,R,H,N,U=t.css(i||(i=l(["\n font-size: 100%;\n padding: 0;\n"],["\n font-size: 100%;\n padding: 0;\n"]))),_=function(o){return t.css(b||(b=l(["\n /* Hide default browser styles */\n appearance: none;\n border: none;\n display: inline-block;\n outline: none;\n background: none;\n transition: background-color 100ms ease-in, border-color 100ms ease-in;\n font-family: ",";\n font-weight: ",";\n\n /* Remove extra black dotted border FF adds */\n &::-moz-focus-inner {\n border: none;\n }\n"],["\n /* Hide default browser styles */\n appearance: none;\n border: none;\n display: inline-block;\n outline: none;\n background: none;\n transition: background-color 100ms ease-in, border-color 100ms ease-in;\n font-family: ",";\n font-weight: ",";\n\n /* Remove extra black dotted border FF adds */\n &::-moz-focus-inner {\n border: none;\n }\n"])),s.themeGet("fonts.fontFamilyText")(o),s.themeGet("fontWeights.fontWeightSemibold")(o))},O=function(o){return t.css([_(o),t.css(g||(g=l(["\n text-decoration: none;\n cursor: pointer;\n\n &:focus,\n &:active {\n box-shadow: ",';\n }\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n text-decoration: none;\n }\n '],["\n text-decoration: none;\n cursor: pointer;\n\n &:focus,\n &:active {\n box-shadow: ",';\n }\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n text-decoration: none;\n }\n '])),s.themeGet("shadows.shadowFocus")(o))])},A=function(o){return t.css([_(o),t.css(m||(m=l(["\n cursor: wait;\n "],["\n cursor: wait;\n "])))])},V=function(o){return t.css([_(o),t.css(k||(k=l(["\n cursor: not-allowed;\n "],["\n cursor: not-allowed;\n "])))])},Y=function(o){return t.css(f||(f=l(["\n border-width: ",";\n border-style: solid;\n color: ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"],["\n border-width: ",";\n border-style: solid;\n color: ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"])),s.themeGet("borderWidths.borderWidth20")(o),s.themeGet("textColors.colorTextInverse")(o),s.themeGet("textColors.colorTextInverse")(o))},J=function(o){return t.css([O(o),Y(o),t.css(v||(v=l(["\n border-color: ",";\n background-color: ",";\n\n &:hover {\n border-color: ",";\n background-color: ",";\n }\n &:focus {\n border-color: ",";\n background-color: ",";\n }\n &:active {\n border-color: ",";\n background-color: ",";\n }\n "],["\n border-color: ",";\n background-color: ",";\n\n &:hover {\n border-color: ",";\n background-color: ",";\n }\n &:focus {\n border-color: ",";\n background-color: ",";\n }\n &:active {\n border-color: ",";\n background-color: ",";\n }\n "])),s.themeGet("borderColors.colorBorderPrimary")(o),s.themeGet("backgroundColors.colorBackgroundPrimary")(o),s.themeGet("borderColors.colorBorderPrimaryDarker")(o),s.themeGet("backgroundColors.colorBackgroundPrimaryDarker")(o),s.themeGet("borderColors.colorBorderPrimaryDarker")(o),s.themeGet("backgroundColors.colorBackgroundPrimary")(o),s.themeGet("borderColors.colorBorderPrimaryDarker")(o),s.themeGet("backgroundColors.colorBackgroundPrimaryDark")(o))])},K=function(o){return t.css([A(o),Y(o),t.css(y||(y=l(["\n &,\n &:hover,\n &:active,\n &:focus {\n border-color: ",";\n background-color: ",";\n }\n "],["\n &,\n &:hover,\n &:active,\n &:focus {\n border-color: ",";\n background-color: ",";\n }\n "])),s.themeGet("borderColors.colorBorderPrimaryDarker")(o),s.themeGet("backgroundColors.colorBackgroundPrimaryDarker")(o))])},Q=function(o){return t.css([V(o),Y(o),t.css(p||(p=l(["\n border-color: ",";\n background-color: ",";\n\n &:hover,\n &:active {\n background-color: ",";\n }\n "],["\n border-color: ",";\n background-color: ",";\n\n &:hover,\n &:active {\n background-color: ",";\n }\n "])),s.themeGet("borderColors.colorBorderPrimaryLight")(o),s.themeGet("backgroundColors.colorBackgroundPrimaryLight")(o),s.themeGet("backgroundColors.colorBackgroundPrimaryLight")(o))])},X=function(o){return t.css(G||(G=l(["\n border-width: ",";\n border-style: solid;\n background-color: ",";\n"],["\n border-width: ",";\n border-style: solid;\n background-color: ",";\n"])),s.themeGet("borderWidths.borderWidth20")(o),s.themeGet("backgroundColors.colorBackgroundBody")(o))},Z=function(o){return t.css([O(o),X(o),t.css(x||(x=l(["\n color: ",";\n border-color: ",";\n background-color: ",";\n\n &:hover {\n color: ",";\n border-color: ",";\n background-color: ",";\n }\n\n &:focus {\n color: ",";\n border-color: ",";\n background-color: ",";\n }\n\n &:active {\n color: ",";\n border-color: ",";\n background-color: ",";\n }\n "],["\n color: ",";\n border-color: ",";\n background-color: ",";\n\n &:hover {\n color: ",";\n border-color: ",";\n background-color: ",";\n }\n\n &:focus {\n color: ",";\n border-color: ",";\n background-color: ",";\n }\n\n &:active {\n color: ",";\n border-color: ",";\n background-color: ",";\n }\n "])),s.themeGet("textColors.colorTextLink")(o),s.themeGet("borderColors.colorBorderPrimary")(o),s.themeGet("backgroundColors.colorBackgroundBody")(o),s.themeGet("textColors.colorTextLinkDarker")(o),s.themeGet("borderColors.colorBorderPrimaryDarker")(o),s.themeGet("backgroundColors.colorBackgroundPrimaryLightest")(o),s.themeGet("textColors.colorTextLinkDarker")(o),s.themeGet("borderColors.colorBorderPrimaryDarker")(o),s.themeGet("backgroundColors.colorBackgroundPrimaryLightest")(o),s.themeGet("textColors.colorTextLinkDarker")(o),s.themeGet("borderColors.colorBorderPrimaryDarker")(o),s.themeGet("backgroundColors.colorBackgroundPrimaryLighter")(o))])},$=function(o){return t.css([A(o),X(o),t.css(C||(C=l(["\n color: ",";\n border-color: ",";\n background-color: ",";\n "],["\n color: ",";\n border-color: ",";\n background-color: ",";\n "])),s.themeGet("textColors.colorTextLinkDarker")(o),s.themeGet("borderColors.colorBorderPrimaryLighter")(o),s.themeGet("backgroundColors.colorBackgroundPrimaryLighter")(o))])},oo=function(o){return t.css([V(o),X(o),t.css(w||(w=l(["\n color: ",";\n border-color: ",";\n "],["\n color: ",";\n border-color: ",";\n "])),s.themeGet("textColors.colorTextLinkLight")(o),s.themeGet("borderColors.colorBorderPrimaryLight")(o))])},no=function(o){return t.css(B||(B=l(["\n border-width: ",";\n border-style: solid;\n background-color: ",";\n color: ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"],["\n border-width: ",";\n border-style: solid;\n background-color: ",";\n color: ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"])),s.themeGet("borderWidths.borderWidth20")(o),s.themeGet("backgroundColors.colorBackgroundDestructive")(o),s.themeGet("textColors.colorTextInverse")(o),s.themeGet("textColors.colorTextInverse")(o))},eo=function(o){return t.css([O(o),no(o),t.css(D||(D=l(["\n border-color: ",";\n\n &:hover {\n border-color: ",";\n background-color: ",";\n }\n\n &:focus {\n border-color: ",";\n background-color: ",";\n }\n\n &:active {\n border-color: ",";\n background-color: ",";\n }\n "],["\n border-color: ",";\n\n &:hover {\n border-color: ",";\n background-color: ",";\n }\n\n &:focus {\n border-color: ",";\n background-color: ",";\n }\n\n &:active {\n border-color: ",";\n background-color: ",";\n }\n "])),s.themeGet("borderColors.colorBorderDestructive")(o),s.themeGet("borderColors.colorBorderDestructiveDarker")(o),s.themeGet("backgroundColors.colorBackgroundDestructiveDarker")(o),s.themeGet("borderColors.colorBorderDestructiveDarker")(o),s.themeGet("backgroundColors.colorBackgroundDestructive")(o),s.themeGet("borderColors.colorBorderDestructiveDarker")(o),s.themeGet("backgroundColors.colorBackgroundDestructiveDark")(o))])},ro=function(o){return t.css([A(o),no(o),t.css(P||(P=l(["\n border-color: ",";\n background-color: ",";\n "],["\n border-color: ",";\n background-color: ",";\n "])),s.themeGet("borderColors.colorBorderDestructiveDarker")(o),s.themeGet("backgroundColors.colorBackgroundDestructiveDarker")(o))])},to=function(o){return t.css([V(o),no(o),t.css(L||(L=l(["\n border-color: ",";\n background-color: ",";\n "],["\n border-color: ",";\n background-color: ",";\n "])),s.themeGet("borderColors.colorBorderDestructiveLight")(o),s.themeGet("backgroundColors.colorBackgroundDestructiveLight")(o))])},co=t.css(T||(T=l(["\n background: none;\n"],["\n background: none;\n"]))),so=function(o){return t.css([O(o),co,t.css(z||(z=l(["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "],["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "])),s.themeGet("textColors.colorTextLinkDestructive")(o),s.themeGet("textColors.colorTextLinkDestructiveDark")(o),s.themeGet("textColors.colorTextLinkDestructiveDarker")(o))])},ao=function(o){return t.css([A(o),co,t.css(E||(E=l(["\n color: ",";\n "],["\n color: ",";\n "])),s.themeGet("textColors.colorTextLinkDestructiveDarker")(o))])},lo=function(o){return t.css([V(o),co,t.css(W||(W=l(["\n color: ",";\n "],["\n color: ",";\n "])),s.themeGet("textColors.colorTextLinkDestructiveLight")(o))])},io=t.css(S||(S=l(["\n background: none;\n"],["\n background: none;\n"]))),uo=function(o){return t.css([O(o),io,t.css(M||(M=l(["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "],["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "])),s.themeGet("textColors.colorTextLink")(o),s.themeGet("textColors.colorTextLinkDark")(o),s.themeGet("textColors.colorTextLinkDarker")(o))])},ho=function(o){return t.css([A(o),io,t.css(F||(F=l(["\n color: ",";\n "],["\n color: ",";\n "])),s.themeGet("textColors.colorTextLinkDarker")(o))])},bo=function(o){return t.css([V(o),io,t.css(I||(I=l(["\n color: ",";\n "],["\n color: ",";\n "])),s.themeGet("textColors.colorTextLinkLight")(o))])},go=O,mo=A,ko=V,fo=r.button(q||(q=l(["\n /* To position the loading spinner correctly.\n * Pulled out of styles.ts so it works for the reset styles too.\n */\n position: relative;\n ","\n ","\n ","\n ","\n"],["\n /* To position the loading spinner correctly.\n * Pulled out of styles.ts so it works for the reset styles too.\n */\n position: relative;\n ","\n ","\n ","\n ","\n"])),c.buttonStyle,(function(o){switch(o.size){case"reset":return U;case"icon":return function(o){return t.css(d||(d=l(["\n padding: ",";\n border-radius: ",";\n font-size: 100%;\n /* To fix abnormal button padding-bottom */\n line-height: unset;\n"],["\n padding: ",";\n border-radius: ",";\n font-size: 100%;\n /* To fix abnormal button padding-bottom */\n line-height: unset;\n"])),s.themeGet("space.space30")(o),s.themeGet("radii.borderRadius20")(o))}(o);case"small":return function(o){return t.css(u||(u=l(["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n line-height: ",";\n"],["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n line-height: ",";\n"])),s.themeGet("space.space10")(o),s.themeGet("space.space30")(o),s.themeGet("radii.borderRadius10")(o),s.themeGet("fontSizes.fontSize30")(o),s.themeGet("lineHeights.lineHeight20")(o))}(o);case"default":default:return function(o){return t.css(h||(h=l(["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n\n line-height: ",";\n"],["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n\n line-height: ",";\n"])),s.themeGet("space.space30")(o),s.themeGet("space.space50")(o),s.themeGet("radii.borderRadius20")(o),s.themeGet("fontSizes.fontSize30")(o),s.themeGet("lineHeights.lineHeight20")(o))}(o)}}),(function(o){var n=o.variant,e=o.buttonState,r="disabled"===e,t="loading"===e;switch(n){case"reset":return r?ko:t?mo:go;case"secondary":return r?oo:t?$:Z;case"link":return r?bo:t?ho:uo;case"destructive":return r?to:t?ro:eo;case"destructive_link":return r?lo:t?ao:so;case"primary":default:return r?Q:t?K:J}}),(function(o){var n=o.fullWidth;return t.css(j||(j=l(["\n width: ",";\n"],["\n width: ",";\n"])),n?"100%":"auto")})),vo=r.span(H||(H=l(["\n display: grid;\n grid-auto-flow: column;\n /*\n * Neat way to make sure children are spaced apart correctly\n * https://caniuse.com/#feat=multicolumn\n */\n column-gap: ",";\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n text-decoration: inherit;\n ","\n"],["\n display: grid;\n grid-auto-flow: column;\n /*\n * Neat way to make sure children are spaced apart correctly\n * https://caniuse.com/#feat=multicolumn\n */\n column-gap: ",";\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n text-decoration: inherit;\n ","\n"])),s.themeGet("space.space20"),(function(o){var n=o.buttonState;return t.css(R||(R=l(["\n opacity: ",";\n"],["\n opacity: ",";\n"])),"loading"===n?"0":"100%")})),yo=r(a.Absolute)(N||(N=l(["\n display: flex;\n justify-content: center;\n align-items: center;\n line-height: 14px;\n"],["\n display: flex;\n justify-content: center;\n align-items: center;\n line-height: 14px;\n"]))),po=function(o){var r,t,c=(t=(r=o).loading,r.disabled?"disabled":t?"loading":"default"),s="loading"===c,a="default"!==c,l=o.size;return null==l&&(l="default","link"===o.variant||"destructive_link"===o.variant?l="reset":1===n.Children.count(o.children)&&n.Children.forEach(o.children,(function(o){n.isValidElement(o)&&"string"==typeof o.type.displayName&&o.type.displayName.includes("Icon")&&(l="icon")}))),function(o){var n=o.as,e=o.href,r=o.variant,t=o.size,c=o.tabIndex,s=o.fullWidth,a=o.children,l=null!=e&&""!==e,i=null!=c;if("a"!==n&&l)throw new Error("[Paste: Button] You cannot pass href into a button without the 'a' tag. Use 'as=\"a\"'.");if("a"===n&&!l)throw new Error("[Paste: Button] Missing href prop for link button.");if("a"===n&&"link"===r)throw new Error("[Paste: Button] This should be a link. Use the [Paste: Anchor] component.");if("reset"===r&&"reset"!==t)throw new Error('[Paste: Button] The "RESET" variant can only be used with the "RESET" size.');if("icon"===t&&s)throw new Error("[Paste: Button] Icon buttons should not be fullWidth.");if(null==a)throw new Error("[Paste: Button] Must have non-null children.");if(i&&0!==c&&-1!==c)throw new Error("[Paste: Button] tabIndex must be 0 or -1.")}(o),n.createElement(fo,{as:o.as,variant:o.variant,size:l,buttonState:c,disabled:a,autoFocus:o.autoFocus,fullWidth:o.fullWidth,href:o.href,tabIndex:o.tabIndex,type:o.type,onClick:o.onClick,onMouseDown:o.onMouseDown,onMouseUp:o.onMouseUp,onMouseEnter:o.onMouseEnter,onMouseLeave:o.onMouseLeave,onFocus:o.onFocus,onBlur:o.onBlur,"aria-expanded":o["aria-expanded"],"aria-haspopup":o["aria-haspopup"],"aria-controls":o["aria-controls"],"aria-busy":"loading"===c?"true":"false","data-test":o["data-test"]},n.createElement(vo,{buttonState:c},o.children),s?n.createElement(yo,{as:"span"},n.createElement(e.Spinner,{decorative:!1,title:"Loading, please wait.",delay:0})):null)};po.defaultProps={as:"button",type:"button",variant:"primary",disabled:!1,loading:!1,fullWidth:!1},po.displayName="Button",exports.Button=po; | ||
function i(n,e){return Object.defineProperty?Object.defineProperty(n,"raw",{value:e}):n.raw=e,n}var l,u,d,h,b,g,m,k,f,p,v,x,w,G,y,C,B,D,P,L,T,z,E,F,S,M,I,j,W,q,R,H,N,U=r.css(l||(l=i(["\n font-size: 100%;\n padding: 0;\n"],["\n font-size: 100%;\n padding: 0;\n"]))),_=function(n){return r.css(b||(b=i(["\n /* Hide default browser styles */\n appearance: none;\n border: none;\n display: inline-block;\n outline: none;\n background: none;\n transition: background-color 100ms ease-in, box-shadow 100ms ease-in;\n font-family: ",";\n font-weight: ",";\n\n /* Remove extra black dotted border FF adds */\n &::-moz-focus-inner {\n border: none;\n }\n"],["\n /* Hide default browser styles */\n appearance: none;\n border: none;\n display: inline-block;\n outline: none;\n background: none;\n transition: background-color 100ms ease-in, box-shadow 100ms ease-in;\n font-family: ",";\n font-weight: ",";\n\n /* Remove extra black dotted border FF adds */\n &::-moz-focus-inner {\n border: none;\n }\n"])),a.themeGet("fonts.fontFamilyText")(n),a.themeGet("fontWeights.fontWeightSemibold")(n))},O=function(n){return r.css([_(n),r.css(g||(g=i(["\n text-decoration: none;\n cursor: pointer;\n\n &:focus,\n &:active {\n box-shadow: ",';\n }\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n text-decoration: none;\n }\n '],["\n text-decoration: none;\n cursor: pointer;\n\n &:focus,\n &:active {\n box-shadow: ",';\n }\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n text-decoration: none;\n }\n '])),a.themeGet("shadows.shadowFocus")(n))])},A=function(n){return r.css([_(n),r.css(m||(m=i(["\n cursor: wait;\n "],["\n cursor: wait;\n "])))])},V=function(n){return r.css([_(n),r.css(k||(k=i(["\n cursor: not-allowed;\n "],["\n cursor: not-allowed;\n "])))])},Y=function(n){return r.css(f||(f=i(["\n color: ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"],["\n color: ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"])),a.themeGet("textColors.colorTextInverse")(n),a.themeGet("textColors.colorTextInverse")(n))},J=function(n){return r.css([O(n),Y(n),r.css(p||(p=i(["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n\n &:hover {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n &:focus {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n &:active {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n "],["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n\n &:hover {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n &:focus {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n &:active {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n "])),a.themeGet("backgroundColors.colorBackgroundPrimary")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundPrimary")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryDarker")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryDarker")(n),a.themeGet("backgroundColors.colorBackgroundPrimary")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryDarker")(n),a.themeGet("shadows.shadowFocus")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryDark")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryDarker")(n),a.themeGet("shadows.shadowFocus")(n))])},K=function(n){return r.css([A(n),Y(n),r.css(v||(v=i(["\n &,\n &:hover,\n &:active,\n &:focus {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n "],["\n &,\n &:hover,\n &:active,\n &:focus {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n "])),a.themeGet("backgroundColors.colorBackgroundPrimaryDarker")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryDarker")(n))])},Q=function(n){return r.css([V(n),Y(n),r.css(x||(x=i(["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n\n &:hover,\n &:active {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n "],["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n\n &:hover,\n &:active {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n "])),a.themeGet("backgroundColors.colorBackgroundPrimaryLight")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryLight")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryLight")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryLight")(n))])},X=function(n){return r.css(w||(w=i(["\n background-color: ",";\n"],["\n background-color: ",";\n"])),a.themeGet("backgroundColors.colorBackgroundBody")(n))},Z=function(n){return r.css([O(n),X(n),r.css(G||(G=i(["\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 "," ",";\n\n &:hover {\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n\n &:focus {\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n\n &:active {\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n "],["\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 "," ",";\n\n &:hover {\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n\n &:focus {\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n\n &:active {\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n "])),a.themeGet("textColors.colorTextLink")(n),a.themeGet("backgroundColors.colorBackgroundBody")(n),a.themeGet("space.space10")(n),a.themeGet("borderColors.colorBorderPrimary")(n),a.themeGet("textColors.colorTextLinkDarker")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryLightest")(n),a.themeGet("space.space10")(n),a.themeGet("borderColors.colorBorderPrimaryDarker")(n),a.themeGet("textColors.colorTextLinkDarker")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryLightest")(n),a.themeGet("space.space10")(n),a.themeGet("borderColors.colorBorderPrimaryDarker")(n),a.themeGet("shadows.shadowFocus")(n),a.themeGet("textColors.colorTextLinkDarker")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryLighter")(n),a.themeGet("space.space10")(n),a.themeGet("borderColors.colorBorderPrimaryDarker")(n),a.themeGet("shadows.shadowFocus")(n))])},$=function(n){return r.css([A(n),X(n),r.css(y||(y=i(["\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "],["\n color: ",";\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "])),a.themeGet("textColors.colorTextLinkDarker")(n),a.themeGet("backgroundColors.colorBackgroundPrimaryLighter")(n),a.themeGet("space.space10")(n),a.themeGet("borderColors.colorBorderPrimaryLighter")(n))])},nn=function(n){return r.css([V(n),X(n),r.css(C||(C=i(["\n color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "],["\n color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "])),a.themeGet("textColors.colorTextLinkLight")(n),a.themeGet("space.space10")(n),a.themeGet("borderColors.colorBorderPrimaryLight")(n))])},en=function(n){return r.css(B||(B=i(["\n background-color: ",";\n color: ",";\n box-shadow: inset 0 0 0 ","\n ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"],["\n background-color: ",";\n color: ",";\n box-shadow: inset 0 0 0 ","\n ",';\n\n /*\n defensively resetting from over zealous legacy global\n styles "a {...}" when button is set as an anchor\n */\n &:hover,\n &:focus,\n &:active {\n color: ',";\n }\n"])),a.themeGet("backgroundColors.colorBackgroundDestructive")(n),a.themeGet("textColors.colorTextInverse")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundDestructive")(n),a.themeGet("textColors.colorTextInverse")(n))},on=function(n){return r.css([O(n),en(n),r.css(D||(D=i(["\n &:hover {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n\n &:focus {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n\n &:active {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n "],["\n &:hover {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n }\n\n &:focus {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n\n &:active {\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",",\n ",";\n }\n "])),a.themeGet("backgroundColors.colorBackgroundDestructiveDarker")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundDestructiveDarker")(n),a.themeGet("backgroundColors.colorBackgroundDestructive")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundDestructiveDarker")(n),a.themeGet("shadows.shadowFocus")(n),a.themeGet("backgroundColors.colorBackgroundDestructiveDark")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundDestructiveDarker")(n),a.themeGet("shadows.shadowFocus")(n))])},tn=function(n){return r.css([A(n),en(n),r.css(P||(P=i(["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "],["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "])),a.themeGet("backgroundColors.colorBackgroundDestructiveDarker")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundDestructiveDarker")(n))])},rn=function(n){return r.css([V(n),en(n),r.css(L||(L=i(["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "],["\n background-color: ",";\n box-shadow: inset 0 0 0 ","\n ",";\n "])),a.themeGet("backgroundColors.colorBackgroundDestructiveLight")(n),a.themeGet("space.space10")(n),a.themeGet("backgroundColors.colorBackgroundDestructiveLight")(n))])},sn=r.css(T||(T=i(["\n background: none;\n"],["\n background: none;\n"]))),an=function(n){return r.css([O(n),sn,r.css(z||(z=i(["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "],["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "])),a.themeGet("textColors.colorTextLinkDestructive")(n),a.themeGet("textColors.colorTextLinkDestructiveDark")(n),a.themeGet("textColors.colorTextLinkDestructiveDarker")(n))])},cn=function(n){return r.css([A(n),sn,r.css(E||(E=i(["\n color: ",";\n "],["\n color: ",";\n "])),a.themeGet("textColors.colorTextLinkDestructiveDarker")(n))])},ln=function(n){return r.css([V(n),sn,r.css(F||(F=i(["\n color: ",";\n "],["\n color: ",";\n "])),a.themeGet("textColors.colorTextLinkDestructiveLight")(n))])},un=r.css(S||(S=i(["\n background: none;\n"],["\n background: none;\n"]))),dn=function(n){return r.css([O(n),un,r.css(M||(M=i(["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "],["\n color: ",";\n\n &:hover,\n &:focus,\n &:active {\n text-decoration: underline;\n }\n\n &:hover {\n color: ",";\n }\n\n &:active {\n color: ",";\n }\n "])),a.themeGet("textColors.colorTextLink")(n),a.themeGet("textColors.colorTextLinkDark")(n),a.themeGet("textColors.colorTextLinkDarker")(n))])},hn=function(n){return r.css([A(n),un,r.css(I||(I=i(["\n color: ",";\n "],["\n color: ",";\n "])),a.themeGet("textColors.colorTextLinkDarker")(n))])},bn=function(n){return r.css([V(n),un,r.css(j||(j=i(["\n color: ",";\n "],["\n color: ",";\n "])),a.themeGet("textColors.colorTextLinkLight")(n))])},gn=O,mn=A,kn=V,fn=t.button(q||(q=i(["\n /* To position the loading spinner correctly.\n * Pulled out of styles.ts so it works for the reset styles too.\n */\n position: relative;\n ","\n ","\n ","\n ","\n"],["\n /* To position the loading spinner correctly.\n * Pulled out of styles.ts so it works for the reset styles too.\n */\n position: relative;\n ","\n ","\n ","\n ","\n"])),s.buttonStyle,(function(n){switch(n.size){case"reset":return U;case"icon":return function(n){return r.css(u||(u=i(["\n padding: ",";\n border-radius: ",";\n font-size: 100%;\n /* To fix abnormal button padding-bottom */\n line-height: unset;\n"],["\n padding: ",";\n border-radius: ",";\n font-size: 100%;\n /* To fix abnormal button padding-bottom */\n line-height: unset;\n"])),a.themeGet("space.space30")(n),a.themeGet("radii.borderRadius20")(n))}(n);case"small":return function(n){return r.css(d||(d=i(["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n line-height: ",";\n"],["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n line-height: ",";\n"])),a.themeGet("space.space10")(n),a.themeGet("space.space30")(n),a.themeGet("radii.borderRadius10")(n),a.themeGet("fontSizes.fontSize30")(n),a.themeGet("lineHeights.lineHeight30")(n))}(n);case"default":default:return function(n){return r.css(h||(h=i(["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n\n line-height: ",";\n"],["\n padding: "," ",";\n border-radius: ",";\n font-size: ",";\n\n line-height: ",";\n"])),a.themeGet("space.space30")(n),a.themeGet("space.space50")(n),a.themeGet("radii.borderRadius20")(n),a.themeGet("fontSizes.fontSize30")(n),a.themeGet("lineHeights.lineHeight30")(n))}(n)}}),(function(n){var e=n.variant,o=n.buttonState,t="disabled"===o,r="loading"===o;switch(e){case"reset":return t?kn:r?mn:gn;case"secondary":return t?nn:r?$:Z;case"link":return t?bn:r?hn:dn;case"destructive":return t?rn:r?tn:on;case"destructive_link":return t?ln:r?cn:an;case"primary":default:return t?Q:r?K:J}}),(function(n){var e=n.fullWidth;return r.css(W||(W=i(["\n width: ",";\n"],["\n width: ",";\n"])),e?"100%":"auto")})),pn=t.span(H||(H=i(["\n display: grid;\n grid-auto-flow: column;\n /*\n * Neat way to make sure children are spaced apart correctly\n * https://caniuse.com/#feat=multicolumn\n */\n column-gap: ",";\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n text-decoration: inherit;\n ","\n"],["\n display: grid;\n grid-auto-flow: column;\n /*\n * Neat way to make sure children are spaced apart correctly\n * https://caniuse.com/#feat=multicolumn\n */\n column-gap: ",";\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n text-decoration: inherit;\n ","\n"])),a.themeGet("space.space20"),(function(n){var e=n.buttonState;return r.css(R||(R=i(["\n opacity: ",";\n"],["\n opacity: ",";\n"])),"loading"===e?"0":"100%")})),vn=t(c.Absolute)(N||(N=i(["\n display: flex;\n justify-content: center;\n align-items: center;\n line-height: 14px;\n"],["\n display: flex;\n justify-content: center;\n align-items: center;\n line-height: 14px;\n"]))),xn=function(n){var t,r,s=(r=(t=n).loading,t.disabled?"disabled":r?"loading":"default"),a="loading"===s,c="default"!==s,i=n.size;return null==i&&(i="default","link"===n.variant||"destructive_link"===n.variant?i="reset":1===e.Children.count(n.children)&&e.Children.forEach(n.children,(function(n){e.isValidElement(n)&&"string"==typeof n.type.displayName&&n.type.displayName.includes("Icon")&&(i="icon")}))),function(n){var e=n.as,o=n.href,t=n.variant,r=n.size,s=n.tabIndex,a=n.fullWidth,c=n.children,i=null!=o&&""!==o,l=null!=s;if("a"!==e&&i)throw new Error("[Paste: Button] You cannot pass href into a button without the 'a' tag. Use 'as=\"a\"'.");if("a"===e&&!i)throw new Error("[Paste: Button] Missing href prop for link button.");if("a"===e&&"link"===t)throw new Error("[Paste: Button] This should be a link. Use the [Paste: Anchor] component.");if("reset"===t&&"reset"!==r)throw new Error('[Paste: Button] The "RESET" variant can only be used with the "RESET" size.');if("icon"===r&&a)throw new Error("[Paste: Button] Icon buttons should not be fullWidth.");if(null==c)throw new Error("[Paste: Button] Must have non-null children.");if(l&&0!==s&&-1!==s)throw new Error("[Paste: Button] tabIndex must be 0 or -1.")}(n),e.createElement(fn,{as:n.as,variant:n.variant,size:i,buttonState:s,disabled:c,autoFocus:n.autoFocus,fullWidth:n.fullWidth,href:n.href,tabIndex:n.tabIndex,type:n.type,onClick:n.onClick,onMouseDown:n.onMouseDown,onMouseUp:n.onMouseUp,onMouseEnter:n.onMouseEnter,onMouseLeave:n.onMouseLeave,onFocus:n.onFocus,onBlur:n.onBlur,"aria-expanded":n["aria-expanded"],"aria-haspopup":n["aria-haspopup"],"aria-controls":n["aria-controls"],"aria-busy":"loading"===s?"true":"false","data-test":n["data-test"]},e.createElement(pn,{buttonState:s},n.children),a?e.createElement(vn,{as:"span"},e.createElement(o.Spinner,{decorative:!1,title:"Loading, please wait.",delay:0})):null)};xn.defaultProps={as:"button",type:"button",variant:"primary",disabled:!1,loading:!1,fullWidth:!1},xn.displayName="Button",exports.Button=xn; |
{ | ||
"name": "@twilio-paste/button", | ||
"version": "1.1.23", | ||
"version": "1.1.24", | ||
"category": "interaction", | ||
@@ -34,9 +34,9 @@ "status": "production", | ||
"@styled-system/theme-get": "^5.1.2", | ||
"@twilio-paste/absolute": "^2.0.16", | ||
"@twilio-paste/box": "^2.1.11", | ||
"@twilio-paste/design-tokens": "^4.1.4", | ||
"@twilio-paste/icons": "^2.0.0", | ||
"@twilio-paste/spinner": "^1.1.19", | ||
"@twilio-paste/style-props": "^0.1.9", | ||
"@twilio-paste/theme-tokens": "^3.0.5", | ||
"@twilio-paste/absolute": "^2.0.17", | ||
"@twilio-paste/box": "^2.1.12", | ||
"@twilio-paste/design-tokens": "^4.2.0", | ||
"@twilio-paste/icons": "^2.0.1", | ||
"@twilio-paste/spinner": "^1.1.20", | ||
"@twilio-paste/style-props": "^0.1.10", | ||
"@twilio-paste/theme-tokens": "^3.1.0", | ||
"prop-types": "^15.7.2", | ||
@@ -73,3 +73,3 @@ "react": "^16.8.6", | ||
}, | ||
"gitHead": "cce1833acb0b33863a4a2012813429c5b0ee19ed" | ||
"gitHead": "0f114063e91503fb857c38b1f34c508a2cc468f6" | ||
} |
Sorry, the diff of this file is too big to display
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
166001
4757