@cavilha/button - npm Package Compare versions

Comparing version 0.0.3 to 0.0.4

CHANGELOG.md

 # @cavilha/button
 
+## 0.0.4
+
+### Patch Changes
+
+- b66c10d: Modify tokens of color to alwaysWhite.
+
 ## 0.0.3
@@ -4,0 +10,0 @@

dist/index.cjs.js

@@ -1,1 +0,1 @@
-"use strict";var o=require("react"),r=require("@cavilha/icon"),e=require("@fortawesome/pro-solid-svg-icons"),a=require("@cavilha/theme");function t(o){return o&&"object"==typeof o&&"default"in o?o:{default:o}}var n=t(o),s=t(r),l=function(){return l=Object.assign||function(o){for(var r,e=1,a=arguments.length;e<a;e++)for(var t in r=arguments[e])Object.prototype.hasOwnProperty.call(r,t)&&(o[t]=r[t]);return o},l.apply(this,arguments)};var i={loading:{pointerEvents:"none",i:{animation:a.keyframes({from:{transform:"rotate(0deg)"},to:{transform:"rotate(360deg)"}})+" 1s linear infinite"}},active:{true:{}}},c=a.styled("button",l(l({},{borderRadius:"4px",border:"none",cursor:"pointer",fontFamily:"$untitled",fontSize:"$bodyMedium",fontWeight:"$bold",lineHeight:"$small3",padding:"$small2 $medium1 $small2 $medium1",boxShadow:"inset 0 0 0 1px transparent",textAlign:"center",display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center",flex:"0 0 0",alignSelf:"flex-start","& > span":{whiteSpace:"nowrap"},"&:focus":{outline:"none"},"&:disabled":{pointerEvents:"none",backgroundColor:"$neutral3",boxShadow:"0 0 0 1px $colors$neutral3",color:"$neutral4","& > svg path":{fill:"$neutral4"}}}),{variants:{outlined:{true:{backgroundColor:"transparent","&:hover":{color:"$mono1","& > svg path":{fill:"$mono1"}},"&:focus":{color:"$mono1"},"&:disabled":{backgroundColor:"$neutral2 !important",boxShadow:"0 0 0 1px $colors$neutral3",color:"$neutral4","& > svg path":{fill:"$neutral4"}}}},text:{true:{backgroundColor:"transparent",boxShadow:"0 0 0 1px transparent"}},variant:{primary:{backgroundColor:"$primary2",boxShadow:"inset 0 0 0 1px $colors$primary",color:"$mono1","&:hover":{backgroundColor:"$primary3"},"&:focus":{backgroundColor:"$primary2",boxShadow:"inset $focusPressed"},"&:active":{backgroundColor:"$primary2",boxShadow:"inset $focusPressed"}},secondary:{boxShadow:"inset 0 0 0 1px $colors$secondary4",color:"$secondary4",backgroundColor:"transparent","& > svg path":{fill:"$secondary4"},"&:hover":{backgroundColor:"$secondary0Hover"},"&:focus":{boxShadow:"inset $focusPressed"},"&:active":{boxShadow:"inset $focusPressed"},"&:disabled":{border:"1px solid $neutral3",backgroundColor:"transparent",color:"$neutral4","& > svg path":{fill:"$neutral4"}}},terciary:{backgroundColor:"transparent",color:"$secondary4","& > svg path":{fill:"$secondary4"},"&:hover":{backgroundColor:"$secondary2Opacity","& > svg path":{fill:"$mono1"}},"&:focus":{boxShadow:"inset $focusPressed"},"&:active":{boxShadow:"inset $focusPressed","& > svg path":{fill:"$mono1"}},"&:disabled":{color:"$neutral4",backgroundColor:"transparent",boxShadow:"inset 0 0 0 1px transparent",pointerEvents:"none","& > svg path":{fill:"$neutral4"}},"&:hover, &:active":{"& > svg path":{fill:"$mono1"}}},ghost:{padding:"$small2",$$secondaryHover0:"rgba(75, 157, 228, 0.1)",backgroundColor:"transparent",color:"$neutral4","& i":{display:"flex",justifyContent:"center",alignItems:"center"},"& > svg path":{fill:"$neutral4"},"&:hover":{backgroundColor:"$$secondaryHover0",color:"$secondary4","& > svg path":{fill:"$secondary4"}},"&:focus":{boxShadow:"inset $focusPressed"},"&:active":{backgroundColor:"$mono1",color:"$secondary4","& > svg path":{fill:"$secondary4"}},"&:disabled":{color:"$neutral4 !important",backgroundColor:"$neutral3",pointerEvents:"none","& > svg path":{fill:"$neutral4 !important"}},"&:hover, &:active":{"& > svg path":{fill:"$secondary4"}}},danger:{$$mydanger:"$colors$danger2",backgroundColor:"$$mydanger",color:"$mono1","& > svg path":{fill:"$mono1"},"&:hover":{backgroundColor:"$danger3",boxShadow:"inset 0 0 0 1px $colors$danger3"},"&:focus":{boxShadow:"inset $focusPressed",backgroundColor:"$danger2"},"&:active":{backgroundColor:"$danger4"},"&:disabled":{backgroundColor:"$neutral3",color:"$neutral4",pointerEvents:"none","& > svg path":{fill:"$neutral4"}}}},state:i,responsive:{true:{"@sm":{width:"100%"},"@md":{width:"100%"}}}},defaultVariants:{variant:"primary"},compoundVariants:[{variant:"primary",outlined:"true",css:{color:"$primary2"}},{variant:"primary",state:"loading",css:{color:"$mono1 !important",backgroundColor:"$primary2 !important",opacity:"0.8"}},{variant:"primary",state:"active",css:{backgroundColor:"$primary2",boxShadow:"inset $focusPressed"}},{variant:"secondary",state:"loading",css:{color:"$secondary4 !important",opacity:"0.8",border:"1px solid $secondary4 !important"}},{variant:"secondary",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"terciary",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"terciary",state:"loading",css:{color:"$secondary4 !important",opacity:"0.8"}},{variant:"danger",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"danger",state:"loading",css:{backgroundColor:"$colors$danger2 !important",color:"$$mono1 !important",opacity:"0.8"}},{variant:"ghost",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"ghost",state:"loading",css:{backgroundColor:"$white !important",color:"$secondary4 !important",opacity:"0.8"}}]})),d=n.default.forwardRef((function(o,r){var a=o.alignIcon,t=void 0===a?"left":a,i=o.type,d=void 0===i?"button":i,u=o.loadingText,p=o.icon,$=o.label,g=o.iconSize,f=void 0===g?16:g,m=function(o,r){var e={};for(var a in o)Object.prototype.hasOwnProperty.call(o,a)&&r.indexOf(a)<0&&(e[a]=o[a]);if(null!=o&&"function"==typeof Object.getOwnPropertySymbols){var t=0;for(a=Object.getOwnPropertySymbols(o);t<a.length;t++)r.indexOf(a[t])<0&&Object.prototype.propertyIsEnumerable.call(o,a[t])&&(e[a[t]]=o[a[t]])}return e}(o,["alignIcon","type","loadingText","icon","label","iconSize"]),v="loading"===o.state,b=$&&"$small2",y={padding:$&&"0 $small2"};return n.default.createElement(c,l({ref:r,type:d,disabled:o.disabled||v,css:"ghost"===o.variant?y:void 0},m),v?n.default.createElement(n.default.Fragment,null,n.default.createElement(s.default,{icon:e.faSpinner,iconSize:f,css:{marginRight:b}}),n.default.createElement("span",null,u)):n.default.createElement(n.default.Fragment,null,p&&"left"===t&&n.default.createElement(s.default,{icon:p,iconSize:f,css:{marginRight:b}}),$&&n.default.createElement("span",null,$),p&&"right"===t&&n.default.createElement(s.default,{icon:p,iconSize:f,css:{marginLeft:b}})))}));module.exports=d;
+"use strict";var o=require("react"),r=require("@cavilha/icon"),e=require("@fortawesome/pro-solid-svg-icons"),a=require("@cavilha/theme");function t(o){return o&&"object"==typeof o&&"default"in o?o:{default:o}}var n=t(o),s=t(r),l=function(){return l=Object.assign||function(o){for(var r,e=1,a=arguments.length;e<a;e++)for(var t in r=arguments[e])Object.prototype.hasOwnProperty.call(r,t)&&(o[t]=r[t]);return o},l.apply(this,arguments)};var i={loading:{pointerEvents:"none",i:{animation:a.keyframes({from:{transform:"rotate(0deg)"},to:{transform:"rotate(360deg)"}})+" 1s linear infinite"}},active:{true:{}}},c=a.styled("button",l(l({},{borderRadius:"4px",border:"none",cursor:"pointer",fontFamily:"$untitled",fontSize:"$bodyMedium",fontWeight:"$bold",lineHeight:"$small3",padding:"$small2 $medium1 $small2 $medium1",boxShadow:"inset 0 0 0 1px transparent",textAlign:"center",display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center",flex:"0 0 0",alignSelf:"flex-start","& > span":{whiteSpace:"nowrap"},"&:focus":{outline:"none"},"&:disabled":{pointerEvents:"none",backgroundColor:"$neutral3",boxShadow:"0 0 0 1px $colors$neutral3",color:"$neutral4","& > svg path":{fill:"$neutral4"}}}),{variants:{outlined:{true:{backgroundColor:"transparent","&:hover":{color:"$mono1","& > svg path":{fill:"$mono1"}},"&:focus":{color:"$mono1"},"&:disabled":{backgroundColor:"$neutral2 !important",boxShadow:"0 0 0 1px $colors$neutral3",color:"$neutral4","& > svg path":{fill:"$neutral4"}}}},text:{true:{backgroundColor:"transparent",boxShadow:"0 0 0 1px transparent"}},variant:{primary:{backgroundColor:"$primary2",boxShadow:"inset 0 0 0 1px $colors$primary",color:"$alwaysWhite","&:hover":{backgroundColor:"$primary3"},"&:focus":{backgroundColor:"$primary2",boxShadow:"inset $focusPressed"},"&:active":{backgroundColor:"$primary2",boxShadow:"inset $focusPressed"}},secondary:{boxShadow:"inset 0 0 0 1px $colors$secondary4",color:"$secondary4",backgroundColor:"transparent","& > svg path":{fill:"$secondary4"},"&:hover":{backgroundColor:"$secondary0Hover"},"&:focus":{boxShadow:"inset $focusPressed"},"&:active":{boxShadow:"inset $focusPressed"},"&:disabled":{border:"1px solid $neutral3",backgroundColor:"transparent",color:"$neutral4","& > svg path":{fill:"$neutral4"}}},terciary:{backgroundColor:"transparent",color:"$secondary4","& > svg path":{fill:"$secondary4"},"&:hover":{backgroundColor:"$secondary2Opacity","& > svg path":{fill:"$mono1"}},"&:focus":{boxShadow:"inset $focusPressed"},"&:active":{boxShadow:"inset $focusPressed","& > svg path":{fill:"$mono1"}},"&:disabled":{color:"$neutral4",backgroundColor:"transparent",boxShadow:"inset 0 0 0 1px transparent",pointerEvents:"none","& > svg path":{fill:"$neutral4"}},"&:hover, &:active":{"& > svg path":{fill:"$mono1"}}},ghost:{padding:"$small2",$$secondaryHover0:"rgba(75, 157, 228, 0.1)",backgroundColor:"transparent",color:"$neutral4","& i":{display:"flex",justifyContent:"center",alignItems:"center"},"& > svg path":{fill:"$neutral4"},"&:hover":{backgroundColor:"$$secondaryHover0",color:"$secondary4","& > svg path":{fill:"$secondary4"}},"&:focus":{boxShadow:"inset $focusPressed"},"&:active":{backgroundColor:"$mono1",color:"$secondary4","& > svg path":{fill:"$secondary4"}},"&:disabled":{color:"$neutral4 !important",backgroundColor:"$neutral3",pointerEvents:"none","& > svg path":{fill:"$neutral4 !important"}},"&:hover, &:active":{"& > svg path":{fill:"$secondary4"}}},danger:{$$mydanger:"$colors$danger2",backgroundColor:"$$mydanger",color:"$alwaysWhite","& > svg path":{fill:"$mono1"},"&:hover":{backgroundColor:"$danger3",boxShadow:"inset 0 0 0 1px $colors$danger3"},"&:focus":{boxShadow:"inset $focusPressed",backgroundColor:"$danger2"},"&:active":{backgroundColor:"$danger4"},"&:disabled":{backgroundColor:"$neutral3",color:"$neutral4",pointerEvents:"none","& > svg path":{fill:"$neutral4"}}}},state:i,responsive:{true:{"@sm":{width:"100%"},"@md":{width:"100%"}}}},defaultVariants:{variant:"primary"},compoundVariants:[{variant:"primary",outlined:"true",css:{color:"$primary2"}},{variant:"primary",state:"loading",css:{color:"$mono1 !important",backgroundColor:"$primary2 !important",opacity:"0.8"}},{variant:"primary",state:"active",css:{backgroundColor:"$primary2",boxShadow:"inset $focusPressed"}},{variant:"secondary",state:"loading",css:{color:"$secondary4 !important",opacity:"0.8",border:"1px solid $secondary4 !important"}},{variant:"secondary",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"terciary",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"terciary",state:"loading",css:{color:"$secondary4 !important",opacity:"0.8"}},{variant:"danger",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"danger",state:"loading",css:{backgroundColor:"$colors$danger2 !important",color:"$$mono1 !important",opacity:"0.8"}},{variant:"ghost",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"ghost",state:"loading",css:{backgroundColor:"$white !important",color:"$secondary4 !important",opacity:"0.8"}}]})),d=n.default.forwardRef((function(o,r){var a=o.alignIcon,t=void 0===a?"left":a,i=o.type,d=void 0===i?"button":i,u=o.loadingText,p=o.icon,$=o.label,g=o.iconSize,f=void 0===g?16:g,m=function(o,r){var e={};for(var a in o)Object.prototype.hasOwnProperty.call(o,a)&&r.indexOf(a)<0&&(e[a]=o[a]);if(null!=o&&"function"==typeof Object.getOwnPropertySymbols){var t=0;for(a=Object.getOwnPropertySymbols(o);t<a.length;t++)r.indexOf(a[t])<0&&Object.prototype.propertyIsEnumerable.call(o,a[t])&&(e[a[t]]=o[a[t]])}return e}(o,["alignIcon","type","loadingText","icon","label","iconSize"]),v="loading"===o.state,b=$&&"$small2",y={padding:$&&"0 $small2"};return n.default.createElement(c,l({ref:r,type:d,disabled:o.disabled||v,css:"ghost"===o.variant?y:void 0},m),v?n.default.createElement(n.default.Fragment,null,n.default.createElement(s.default,{icon:e.faSpinner,iconSize:f,css:{marginRight:b}}),n.default.createElement("span",null,u)):n.default.createElement(n.default.Fragment,null,p&&"left"===t&&n.default.createElement(s.default,{icon:p,iconSize:f,css:{marginRight:b}}),$&&n.default.createElement("span",null,$),p&&"right"===t&&n.default.createElement(s.default,{icon:p,iconSize:f,css:{marginLeft:b}})))}));module.exports=d;

dist/index.es.js

@@ -1,1 +0,1 @@
-import o from"react";import r from"@cavilha/icon";import{faSpinner as a}from"@fortawesome/pro-solid-svg-icons";import{keyframes as e,styled as t}from"@cavilha/theme";var n=function(){return n=Object.assign||function(o){for(var r,a=1,e=arguments.length;a<e;a++)for(var t in r=arguments[a])Object.prototype.hasOwnProperty.call(r,t)&&(o[t]=r[t]);return o},n.apply(this,arguments)};var s={loading:{pointerEvents:"none",i:{animation:e({from:{transform:"rotate(0deg)"},to:{transform:"rotate(360deg)"}})+" 1s linear infinite"}},active:{true:{}}},i=t("button",n(n({},{borderRadius:"4px",border:"none",cursor:"pointer",fontFamily:"$untitled",fontSize:"$bodyMedium",fontWeight:"$bold",lineHeight:"$small3",padding:"$small2 $medium1 $small2 $medium1",boxShadow:"inset 0 0 0 1px transparent",textAlign:"center",display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center",flex:"0 0 0",alignSelf:"flex-start","& > span":{whiteSpace:"nowrap"},"&:focus":{outline:"none"},"&:disabled":{pointerEvents:"none",backgroundColor:"$neutral3",boxShadow:"0 0 0 1px $colors$neutral3",color:"$neutral4","& > svg path":{fill:"$neutral4"}}}),{variants:{outlined:{true:{backgroundColor:"transparent","&:hover":{color:"$mono1","& > svg path":{fill:"$mono1"}},"&:focus":{color:"$mono1"},"&:disabled":{backgroundColor:"$neutral2 !important",boxShadow:"0 0 0 1px $colors$neutral3",color:"$neutral4","& > svg path":{fill:"$neutral4"}}}},text:{true:{backgroundColor:"transparent",boxShadow:"0 0 0 1px transparent"}},variant:{primary:{backgroundColor:"$primary2",boxShadow:"inset 0 0 0 1px $colors$primary",color:"$mono1","&:hover":{backgroundColor:"$primary3"},"&:focus":{backgroundColor:"$primary2",boxShadow:"inset $focusPressed"},"&:active":{backgroundColor:"$primary2",boxShadow:"inset $focusPressed"}},secondary:{boxShadow:"inset 0 0 0 1px $colors$secondary4",color:"$secondary4",backgroundColor:"transparent","& > svg path":{fill:"$secondary4"},"&:hover":{backgroundColor:"$secondary0Hover"},"&:focus":{boxShadow:"inset $focusPressed"},"&:active":{boxShadow:"inset $focusPressed"},"&:disabled":{border:"1px solid $neutral3",backgroundColor:"transparent",color:"$neutral4","& > svg path":{fill:"$neutral4"}}},terciary:{backgroundColor:"transparent",color:"$secondary4","& > svg path":{fill:"$secondary4"},"&:hover":{backgroundColor:"$secondary2Opacity","& > svg path":{fill:"$mono1"}},"&:focus":{boxShadow:"inset $focusPressed"},"&:active":{boxShadow:"inset $focusPressed","& > svg path":{fill:"$mono1"}},"&:disabled":{color:"$neutral4",backgroundColor:"transparent",boxShadow:"inset 0 0 0 1px transparent",pointerEvents:"none","& > svg path":{fill:"$neutral4"}},"&:hover, &:active":{"& > svg path":{fill:"$mono1"}}},ghost:{padding:"$small2",$$secondaryHover0:"rgba(75, 157, 228, 0.1)",backgroundColor:"transparent",color:"$neutral4","& i":{display:"flex",justifyContent:"center",alignItems:"center"},"& > svg path":{fill:"$neutral4"},"&:hover":{backgroundColor:"$$secondaryHover0",color:"$secondary4","& > svg path":{fill:"$secondary4"}},"&:focus":{boxShadow:"inset $focusPressed"},"&:active":{backgroundColor:"$mono1",color:"$secondary4","& > svg path":{fill:"$secondary4"}},"&:disabled":{color:"$neutral4 !important",backgroundColor:"$neutral3",pointerEvents:"none","& > svg path":{fill:"$neutral4 !important"}},"&:hover, &:active":{"& > svg path":{fill:"$secondary4"}}},danger:{$$mydanger:"$colors$danger2",backgroundColor:"$$mydanger",color:"$mono1","& > svg path":{fill:"$mono1"},"&:hover":{backgroundColor:"$danger3",boxShadow:"inset 0 0 0 1px $colors$danger3"},"&:focus":{boxShadow:"inset $focusPressed",backgroundColor:"$danger2"},"&:active":{backgroundColor:"$danger4"},"&:disabled":{backgroundColor:"$neutral3",color:"$neutral4",pointerEvents:"none","& > svg path":{fill:"$neutral4"}}}},state:s,responsive:{true:{"@sm":{width:"100%"},"@md":{width:"100%"}}}},defaultVariants:{variant:"primary"},compoundVariants:[{variant:"primary",outlined:"true",css:{color:"$primary2"}},{variant:"primary",state:"loading",css:{color:"$mono1 !important",backgroundColor:"$primary2 !important",opacity:"0.8"}},{variant:"primary",state:"active",css:{backgroundColor:"$primary2",boxShadow:"inset $focusPressed"}},{variant:"secondary",state:"loading",css:{color:"$secondary4 !important",opacity:"0.8",border:"1px solid $secondary4 !important"}},{variant:"secondary",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"terciary",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"terciary",state:"loading",css:{color:"$secondary4 !important",opacity:"0.8"}},{variant:"danger",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"danger",state:"loading",css:{backgroundColor:"$colors$danger2 !important",color:"$$mono1 !important",opacity:"0.8"}},{variant:"ghost",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"ghost",state:"loading",css:{backgroundColor:"$white !important",color:"$secondary4 !important",opacity:"0.8"}}]})),l=o.forwardRef((function(e,t){var s=e.alignIcon,l=void 0===s?"left":s,c=e.type,d=void 0===c?"button":c,p=e.loadingText,u=e.icon,$=e.label,g=e.iconSize,m=void 0===g?16:g,f=function(o,r){var a={};for(var e in o)Object.prototype.hasOwnProperty.call(o,e)&&r.indexOf(e)<0&&(a[e]=o[e]);if(null!=o&&"function"==typeof Object.getOwnPropertySymbols){var t=0;for(e=Object.getOwnPropertySymbols(o);t<e.length;t++)r.indexOf(e[t])<0&&Object.prototype.propertyIsEnumerable.call(o,e[t])&&(a[e[t]]=o[e[t]])}return a}(e,["alignIcon","type","loadingText","icon","label","iconSize"]),v="loading"===e.state,b=$&&"$small2",h={padding:$&&"0 $small2"};return o.createElement(i,n({ref:t,type:d,disabled:e.disabled||v,css:"ghost"===e.variant?h:void 0},f),v?o.createElement(o.Fragment,null,o.createElement(r,{icon:a,iconSize:m,css:{marginRight:b}}),o.createElement("span",null,p)):o.createElement(o.Fragment,null,u&&"left"===l&&o.createElement(r,{icon:u,iconSize:m,css:{marginRight:b}}),$&&o.createElement("span",null,$),u&&"right"===l&&o.createElement(r,{icon:u,iconSize:m,css:{marginLeft:b}})))}));export{l as default};
+import o from"react";import r from"@cavilha/icon";import{faSpinner as a}from"@fortawesome/pro-solid-svg-icons";import{keyframes as e,styled as t}from"@cavilha/theme";var n=function(){return n=Object.assign||function(o){for(var r,a=1,e=arguments.length;a<e;a++)for(var t in r=arguments[a])Object.prototype.hasOwnProperty.call(r,t)&&(o[t]=r[t]);return o},n.apply(this,arguments)};var s={loading:{pointerEvents:"none",i:{animation:e({from:{transform:"rotate(0deg)"},to:{transform:"rotate(360deg)"}})+" 1s linear infinite"}},active:{true:{}}},i=t("button",n(n({},{borderRadius:"4px",border:"none",cursor:"pointer",fontFamily:"$untitled",fontSize:"$bodyMedium",fontWeight:"$bold",lineHeight:"$small3",padding:"$small2 $medium1 $small2 $medium1",boxShadow:"inset 0 0 0 1px transparent",textAlign:"center",display:"flex",flexDirection:"row",justifyContent:"center",alignItems:"center",flex:"0 0 0",alignSelf:"flex-start","& > span":{whiteSpace:"nowrap"},"&:focus":{outline:"none"},"&:disabled":{pointerEvents:"none",backgroundColor:"$neutral3",boxShadow:"0 0 0 1px $colors$neutral3",color:"$neutral4","& > svg path":{fill:"$neutral4"}}}),{variants:{outlined:{true:{backgroundColor:"transparent","&:hover":{color:"$mono1","& > svg path":{fill:"$mono1"}},"&:focus":{color:"$mono1"},"&:disabled":{backgroundColor:"$neutral2 !important",boxShadow:"0 0 0 1px $colors$neutral3",color:"$neutral4","& > svg path":{fill:"$neutral4"}}}},text:{true:{backgroundColor:"transparent",boxShadow:"0 0 0 1px transparent"}},variant:{primary:{backgroundColor:"$primary2",boxShadow:"inset 0 0 0 1px $colors$primary",color:"$alwaysWhite","&:hover":{backgroundColor:"$primary3"},"&:focus":{backgroundColor:"$primary2",boxShadow:"inset $focusPressed"},"&:active":{backgroundColor:"$primary2",boxShadow:"inset $focusPressed"}},secondary:{boxShadow:"inset 0 0 0 1px $colors$secondary4",color:"$secondary4",backgroundColor:"transparent","& > svg path":{fill:"$secondary4"},"&:hover":{backgroundColor:"$secondary0Hover"},"&:focus":{boxShadow:"inset $focusPressed"},"&:active":{boxShadow:"inset $focusPressed"},"&:disabled":{border:"1px solid $neutral3",backgroundColor:"transparent",color:"$neutral4","& > svg path":{fill:"$neutral4"}}},terciary:{backgroundColor:"transparent",color:"$secondary4","& > svg path":{fill:"$secondary4"},"&:hover":{backgroundColor:"$secondary2Opacity","& > svg path":{fill:"$mono1"}},"&:focus":{boxShadow:"inset $focusPressed"},"&:active":{boxShadow:"inset $focusPressed","& > svg path":{fill:"$mono1"}},"&:disabled":{color:"$neutral4",backgroundColor:"transparent",boxShadow:"inset 0 0 0 1px transparent",pointerEvents:"none","& > svg path":{fill:"$neutral4"}},"&:hover, &:active":{"& > svg path":{fill:"$mono1"}}},ghost:{padding:"$small2",$$secondaryHover0:"rgba(75, 157, 228, 0.1)",backgroundColor:"transparent",color:"$neutral4","& i":{display:"flex",justifyContent:"center",alignItems:"center"},"& > svg path":{fill:"$neutral4"},"&:hover":{backgroundColor:"$$secondaryHover0",color:"$secondary4","& > svg path":{fill:"$secondary4"}},"&:focus":{boxShadow:"inset $focusPressed"},"&:active":{backgroundColor:"$mono1",color:"$secondary4","& > svg path":{fill:"$secondary4"}},"&:disabled":{color:"$neutral4 !important",backgroundColor:"$neutral3",pointerEvents:"none","& > svg path":{fill:"$neutral4 !important"}},"&:hover, &:active":{"& > svg path":{fill:"$secondary4"}}},danger:{$$mydanger:"$colors$danger2",backgroundColor:"$$mydanger",color:"$alwaysWhite","& > svg path":{fill:"$mono1"},"&:hover":{backgroundColor:"$danger3",boxShadow:"inset 0 0 0 1px $colors$danger3"},"&:focus":{boxShadow:"inset $focusPressed",backgroundColor:"$danger2"},"&:active":{backgroundColor:"$danger4"},"&:disabled":{backgroundColor:"$neutral3",color:"$neutral4",pointerEvents:"none","& > svg path":{fill:"$neutral4"}}}},state:s,responsive:{true:{"@sm":{width:"100%"},"@md":{width:"100%"}}}},defaultVariants:{variant:"primary"},compoundVariants:[{variant:"primary",outlined:"true",css:{color:"$primary2"}},{variant:"primary",state:"loading",css:{color:"$mono1 !important",backgroundColor:"$primary2 !important",opacity:"0.8"}},{variant:"primary",state:"active",css:{backgroundColor:"$primary2",boxShadow:"inset $focusPressed"}},{variant:"secondary",state:"loading",css:{color:"$secondary4 !important",opacity:"0.8",border:"1px solid $secondary4 !important"}},{variant:"secondary",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"terciary",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"terciary",state:"loading",css:{color:"$secondary4 !important",opacity:"0.8"}},{variant:"danger",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"danger",state:"loading",css:{backgroundColor:"$colors$danger2 !important",color:"$$mono1 !important",opacity:"0.8"}},{variant:"ghost",state:"active",css:{boxShadow:"inset $focusPressed"}},{variant:"ghost",state:"loading",css:{backgroundColor:"$white !important",color:"$secondary4 !important",opacity:"0.8"}}]})),l=o.forwardRef((function(e,t){var s=e.alignIcon,l=void 0===s?"left":s,c=e.type,d=void 0===c?"button":c,p=e.loadingText,u=e.icon,$=e.label,g=e.iconSize,m=void 0===g?16:g,f=function(o,r){var a={};for(var e in o)Object.prototype.hasOwnProperty.call(o,e)&&r.indexOf(e)<0&&(a[e]=o[e]);if(null!=o&&"function"==typeof Object.getOwnPropertySymbols){var t=0;for(e=Object.getOwnPropertySymbols(o);t<e.length;t++)r.indexOf(e[t])<0&&Object.prototype.propertyIsEnumerable.call(o,e[t])&&(a[e[t]]=o[e[t]])}return a}(e,["alignIcon","type","loadingText","icon","label","iconSize"]),v="loading"===e.state,b=$&&"$small2",h={padding:$&&"0 $small2"};return o.createElement(i,n({ref:t,type:d,disabled:e.disabled||v,css:"ghost"===e.variant?h:void 0},f),v?o.createElement(o.Fragment,null,o.createElement(r,{icon:a,iconSize:m,css:{marginRight:b}}),o.createElement("span",null,p)):o.createElement(o.Fragment,null,u&&"left"===l&&o.createElement(r,{icon:u,iconSize:m,css:{marginRight:b}}),$&&o.createElement("span",null,$),u&&"right"===l&&o.createElement(r,{icon:u,iconSize:m,css:{marginLeft:b}})))}));export{l as default};

package.json

 {
   "name": "@cavilha/button",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "author": "MadeiraMadeira webstore squads",
@@ -5,0 +5,0 @@ "description": "A button component that allow users to perform actions and make choices with a single tap.",

No alert changes

Improved metrics

Total package byte prevSize

24673

increased by0.42%

Lines of code

399

increased by0.25%

No dependency changes