@zonos/amino 5.0.8 → 5.0.10

package/components/button/Button.js

@@ -1 +1 @@
-"use strict";var n=require("../../_tslib-ccfac372.js"),e=require("react/jsx-runtime"),r=require("react"),o=require("styled-components"),t=require("./RippleGroup.js"),a=require("./useRipple.js"),i=require("../spinner/Spinner.js"),c=require("../../styles/constants/theme.js");function l(n){return n&&n.__esModule?n:{default:n}}require("framer-motion"),require("uuid"),require("./_Ripple.js");var d,s,u,g,h,b,p,m,f,k,v=l(o),y=function(n){return"inherit"===n?"inherit":n?c.theme[n]:void 0},x=v.default.span(d||(d=n.__makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: ",";\n  gap: ",";\n"],["\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: ",";\n  gap: ",";\n"])),c.theme.radius4,c.theme.space8),_=v.default.button(s||(s=n.__makeTemplateObject(["\n  position: relative;\n  outline: none;\n  height: ",";\n  line-height: ",";\n  font-size: 14px;\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  padding: 0 ",";\n  border-radius: ",";\n  transition: ",";\n  font-weight: 500;\n  user-select: none;\n  font-family: ",";\n  letter-spacing: normal;\n  cursor: pointer;\n  white-space: nowrap;\n  padding: ",";\n\n  svg path:not([data-is-secondary-color]) {\n    fill: currentColor;\n  }\n\n  &.only-icon {\n    width: ",";\n    padding: 0;\n  }\n\n  &:active,\n  &:focus {\n    outline: none;\n    svg path:not([data-is-secondary-color]) {\n      fill: currentColor;\n    }\n  }\n\n  &:active {\n    transform: scale(0.99);\n  }\n\n  &:not(.only-icon).has-icon {\n    &.icon-right {\n      svg {\n        margin-left: ",";\n        margin-right: 0;\n      }\n    }\n    svg {\n      margin-right: ",";\n      margin-left: 0;\n    }\n  }\n\n  &[disabled] {\n    box-shadow: none;\n    &:not(.loading) {\n      opacity: 0.5;\n    }\n  }\n"],["\n  position: relative;\n  outline: none;\n  height: ",";\n  line-height: ",";\n  font-size: 14px;\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  padding: 0 ",";\n  border-radius: ",";\n  transition: ",";\n  font-weight: 500;\n  user-select: none;\n  font-family: ",";\n  letter-spacing: normal;\n  cursor: pointer;\n  white-space: nowrap;\n  padding: ",";\n\n  svg path:not([data-is-secondary-color]) {\n    fill: currentColor;\n  }\n\n  &.only-icon {\n    width: ",";\n    padding: 0;\n  }\n\n  &:active,\n  &:focus {\n    outline: none;\n    svg path:not([data-is-secondary-color]) {\n      fill: currentColor;\n    }\n  }\n\n  &:active {\n    transform: scale(0.99);\n  }\n\n  &:not(.only-icon).has-icon {\n    &.icon-right {\n      svg {\n        margin-left: ",";\n        margin-right: 0;\n      }\n    }\n    svg {\n      margin-right: ",";\n      margin-left: 0;\n    }\n  }\n\n  &[disabled] {\n    box-shadow: none;\n    &:not(.loading) {\n      opacity: 0.5;\n    }\n  }\n"])),(function(n){return"var(--amino-size-".concat(n.size,")")}),(function(n){return"var(--amino-size-".concat(n.size,")")}),c.theme.space16,c.theme.radius6,c.theme.transition,c.theme.fontSans,(function(n){return function(n){switch(n){case"sm":return"".concat(c.theme.space4," ").concat(c.theme.space8);case"lg":case"xl":return"".concat(c.theme.space12," ").concat(c.theme.space24);default:return"".concat(c.theme.space8," ").concat(c.theme.space16)}}(n.size)}),(function(n){return"var(--amino-size-".concat(n.size,")")}),c.theme.space8,c.theme.space8),j=v.default(_)(u||(u=n.__makeTemplateObject(["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active,\n    &:focus {\n      background: ",";\n      color: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"],["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active,\n    &:focus {\n      background: ",";\n      color: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"])),(function(n){return y(n.background)||c.theme.primary}),(function(n){return y(n.color)||c.theme.gray0}),(function(n){return y(n.hoverBackground)||c.theme.blue400}),c.theme.blue700,c.theme.gray0,x,c.theme.primary),w=v.default(_)(g||(g=n.__makeTemplateObject(["\n  color: ",";\n  background: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n      svg path {\n        fill: currentColor;\n      }\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n\n  /** Night mode */\n  &.night {\n    color: ",";\n    background: ",";\n\n    &:not([disabled]) {\n      &:hover {\n        background: ",";\n      }\n      &:active,\n      &:focus {\n        background: ",";\n        color: ",";\n        svg path {\n          fill: currentColor;\n        }\n      }\n    }\n\n    "," {\n      background: ",";\n    }\n  }\n"],["\n  color: ",";\n  background: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n      svg path {\n        fill: currentColor;\n      }\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n\n  /** Night mode */\n  &.night {\n    color: ",";\n    background: ",";\n\n    &:not([disabled]) {\n      &:hover {\n        background: ",";\n      }\n      &:active,\n      &:focus {\n        background: ",";\n        color: ",";\n        svg path {\n          fill: currentColor;\n        }\n      }\n    }\n\n    "," {\n      background: ",";\n    }\n  }\n"])),(function(n){return y(n.color)||c.theme.textColor}),(function(n){return y(n.background)||c.theme.gray100}),(function(n){return y(n.hoverBackground)||c.theme.gray200}),c.theme.blue100,c.theme.blue600,x,c.theme.gray100,c.theme.gray0,c.theme.gray1000,(function(n){return y(n.hoverBackground)||c.theme.gray900}),c.theme.blue1000,c.theme.blue300,x,c.theme.gray1000),R=v.default(_)(h||(h=n.__makeTemplateObject(["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"],["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"])),(function(n){return y(n.background)||c.theme.red600}),(function(n){return y(n.color)||c.theme.gray0}),(function(n){return y(n.hoverBackground)||c.theme.red400}),c.theme.red700,x,c.theme.red600),z=v.default(_)(b||(b=n.__makeTemplateObject(["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"],["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"])),(function(n){return y(n.background)||c.theme.orange600}),(function(n){return y(n.color)||c.theme.gray0}),(function(n){return y(n.hoverBackground)||c.theme.orange400}),c.theme.orange700,x,c.theme.orange600),C=v.default(_)(p||(p=n.__makeTemplateObject(["\n  color: ",";\n  border: 1px solid ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: linear-gradient(\n        180deg,\n        "," 12.5%,\n        "," 87.5%\n      );\n      background: ",";\n      border: 1px solid ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n      border: 1px solid ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"],["\n  color: ",";\n  border: 1px solid ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: linear-gradient(\n        180deg,\n        "," 12.5%,\n        "," 87.5%\n      );\n      background: ",";\n      border: 1px solid ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n      border: 1px solid ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"])),(function(n){return y(n.color)||c.theme.textColor}),(function(n){return y(n.borderColor)||c.theme.gray200}),c.theme.gray0,c.theme.gray100,(function(n){return n.hoverBackground&&y(n.hoverBackground)}),c.theme.gray200,c.theme.blue100,c.theme.blue600,c.theme.blue300,x,c.theme.gray0),O=v.default(_)(m||(m=n.__makeTemplateObject(["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n    }\n  }\n\n  &.loading {\n    color: transparent;\n  }\n"],["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n    }\n  }\n\n  &.loading {\n    color: transparent;\n  }\n"])),(function(n){return y(n.background)||"none"}),(function(n){return y(n.color)||c.theme.gray800}),(function(n){return y(n.hoverBackground)||c.theme.gray100}),c.theme.blue100,c.theme.blue600),T=v.default(_)(f||(f=n.__makeTemplateObject(["\n  color: ",";\n  height: 20px;\n  line-height: 20px;\n\n  &[disabled] {\n    color: ",";\n    &:not(.loading) {\n      opacity: inherit;\n    }\n  }\n\n  &:not([disabled]) {\n    &:hover {\n      color: ",";\n    }\n    &:active {\n      color: ",";\n    }\n  }\n\n  &.loading {\n    color: transparent;\n  }\n"],["\n  color: ",";\n  height: 20px;\n  line-height: 20px;\n\n  &[disabled] {\n    color: ",";\n    &:not(.loading) {\n      opacity: inherit;\n    }\n  }\n\n  &:not([disabled]) {\n    &:hover {\n      color: ",";\n    }\n    &:active {\n      color: ",";\n    }\n  }\n\n  &.loading {\n    color: transparent;\n  }\n"])),(function(n){return y(n.color)||c.theme.gray800}),c.theme.gray400,c.theme.gray700,c.theme.gray1200),q=_,B=v.default(_)(k||(k=n.__makeTemplateObject(["\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"],["\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"])),(function(n){return y(n.color)||c.theme.blue600}),(function(n){return y(n.hoverBackground)||c.theme.gray100}),c.theme.blue100,c.theme.blue800,x,c.theme.gray0);exports.Button=function(o){var c=o.children,l=o.className,d=o.disabled,s=void 0!==d&&d,u=o.icon,g=o.iconRight,h=o.intent,b=void 0===h?"secondary":h,p=o.loading,m=void 0!==p&&p,f=o.loadingText,k=o.noRipple,v=void 0!==k&&k,y=o.size,_=void 0===y?"sm":y,G=o.spinnerColor,N=o.tag,S=o.themeOverride,E=o.type,F=void 0===E?"button":E,H=n.__rest(o,["children","className","disabled","icon","iconRight","intent","loading","loadingText","noRipple","size","spinnerColor","tag","themeOverride","type"]),M=N||"button",A=function(n){return e.jsxs(e.Fragment,{children:[!g&&u,c,g&&u,"plain"!==b&&m&&e.jsxs(x,{children:[e.jsx(i.Spinner,{color:n,size:16}),f]})]})},D=[l||"",u&&!c?"only-icon":"",g?"icon-right":"",u?"has-icon":"",m?"loading":"",S].filter(Boolean).join(" "),I=r.useRef(null),J=a.useRipple({disabled:s||m,rippleEnabled:!v&&!["plain","text"].includes(b),rippleRef:I}),K=J.getRippleHandlers,L=J.rippleEnabled,P={className:D,disabled:s||m,size:_},Q=n.__assign(n.__assign(n.__assign({type:F},P),H),K(H));switch(b){case"primary":return e.jsxs(j,n.__assign({as:M},Q,{children:[A(G||"white"),L&&e.jsx(t.RippleGroup,{ref:I})]}));case"subtle":return e.jsxs(O,n.__assign({as:M},Q,{children:[A(G),L&&e.jsx(t.RippleGroup,{ref:I})]}));case"outline":return e.jsxs(C,n.__assign({as:M},Q,{children:[A(G),L&&e.jsx(t.RippleGroup,{ref:I})]}));case"warning":return e.jsxs(z,n.__assign({as:M},Q,{children:[A(G||"white"),L&&e.jsx(t.RippleGroup,{ref:I})]}));case"danger":return e.jsxs(R,n.__assign({as:M},Q,{children:[A(G||"white"),L&&e.jsx(t.RippleGroup,{ref:I})]}));case"text":return e.jsx(T,n.__assign({as:M},Q,{children:A(G)}));case"link":return e.jsxs(B,n.__assign({as:M},Q,{children:[A(G),L&&e.jsx(t.RippleGroup,{ref:I})]}));case"plain":return e.jsx(q,n.__assign({as:M},Q,{children:A(G)}));default:return e.jsxs(w,n.__assign({as:M},Q,{children:[A(G),L&&e.jsx(t.RippleGroup,{ref:I})]}))}};
+"use strict";var n=require("../../_tslib-ccfac372.js"),e=require("react/jsx-runtime"),r=require("react"),o=require("styled-components"),t=require("./RippleGroup.js"),a=require("./useRipple.js"),i=require("../spinner/Spinner.js"),c=require("../../styles/constants/theme.js");function l(n){return n&&n.__esModule?n:{default:n}}require("framer-motion"),require("uuid"),require("./_Ripple.js");var s,d,u,g,h,b,p,m,f,k,v=l(o),y=function(n){return"inherit"===n?"inherit":n?c.theme[n]:void 0},x=function(n){switch(n){case"sm":return 16;case"lg":case"xl":return 24;default:return 20}},_=v.default.span(s||(s=n.__makeTemplateObject(["\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: ",";\n  gap: ",";\n"],["\n  position: absolute;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: ",";\n  gap: ",";\n"])),c.theme.radius4,c.theme.space8),j=v.default.button(d||(d=n.__makeTemplateObject(["\n  position: relative;\n  outline: none;\n  height: ",";\n  line-height: ",";\n  font-size: 14px;\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  padding: 0 ",";\n  border-radius: ",";\n  transition: ",";\n  font-weight: 500;\n  user-select: none;\n  font-family: ",";\n  letter-spacing: normal;\n  cursor: pointer;\n  white-space: nowrap;\n  padding: ",";\n\n  svg path:not([data-is-secondary-color]) {\n    fill: currentColor;\n  }\n\n  &.only-icon {\n    width: ",";\n    padding: 0;\n  }\n\n  &:active,\n  &:focus {\n    outline: none;\n    svg path:not([data-is-secondary-color]) {\n      fill: currentColor;\n    }\n  }\n\n  &:active {\n    transform: scale(0.99);\n  }\n\n  &:not(.only-icon).has-icon {\n    &.icon-right {\n      svg:not(.amino-spinner) {\n        margin-left: ",";\n        margin-right: 0;\n      }\n    }\n    svg:not(.amino-spinner) {\n      margin-right: ",";\n      margin-left: 0;\n    }\n  }\n\n  &[disabled] {\n    box-shadow: none;\n    &:not(.loading) {\n      opacity: 0.5;\n    }\n  }\n"],["\n  position: relative;\n  outline: none;\n  height: ",";\n  line-height: ",";\n  font-size: 14px;\n  box-sizing: border-box;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: center;\n  padding: 0 ",";\n  border-radius: ",";\n  transition: ",";\n  font-weight: 500;\n  user-select: none;\n  font-family: ",";\n  letter-spacing: normal;\n  cursor: pointer;\n  white-space: nowrap;\n  padding: ",";\n\n  svg path:not([data-is-secondary-color]) {\n    fill: currentColor;\n  }\n\n  &.only-icon {\n    width: ",";\n    padding: 0;\n  }\n\n  &:active,\n  &:focus {\n    outline: none;\n    svg path:not([data-is-secondary-color]) {\n      fill: currentColor;\n    }\n  }\n\n  &:active {\n    transform: scale(0.99);\n  }\n\n  &:not(.only-icon).has-icon {\n    &.icon-right {\n      svg:not(.amino-spinner) {\n        margin-left: ",";\n        margin-right: 0;\n      }\n    }\n    svg:not(.amino-spinner) {\n      margin-right: ",";\n      margin-left: 0;\n    }\n  }\n\n  &[disabled] {\n    box-shadow: none;\n    &:not(.loading) {\n      opacity: 0.5;\n    }\n  }\n"])),(function(n){return"var(--amino-size-".concat(n.size,")")}),(function(n){return"var(--amino-size-".concat(n.size,")")}),c.theme.space16,c.theme.radius6,c.theme.transition,c.theme.fontSans,(function(n){return function(n){switch(n){case"sm":return"".concat(c.theme.space4," ").concat(c.theme.space8);case"lg":case"xl":return"".concat(c.theme.space12," ").concat(c.theme.space24);default:return"".concat(c.theme.space8," ").concat(c.theme.space16)}}(n.size)}),(function(n){return"var(--amino-size-".concat(n.size,")")}),c.theme.space8,c.theme.space8),w=v.default(j)(u||(u=n.__makeTemplateObject(["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active,\n    &:focus {\n      background: ",";\n      color: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"],["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active,\n    &:focus {\n      background: ",";\n      color: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"])),(function(n){return y(n.background)||c.theme.primary}),(function(n){return y(n.color)||c.theme.gray0}),(function(n){return y(n.hoverBackground)||c.theme.blue400}),c.theme.blue700,c.theme.gray0,_,c.theme.primary),R=v.default(j)(g||(g=n.__makeTemplateObject(["\n  color: ",";\n  background: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n      svg path {\n        fill: currentColor;\n      }\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n\n  /** Night mode */\n  &.night {\n    color: ",";\n    background: ",";\n\n    &:not([disabled]) {\n      &:hover {\n        background: ",";\n      }\n      &:active,\n      &:focus {\n        background: ",";\n        color: ",";\n        svg path {\n          fill: currentColor;\n        }\n      }\n    }\n\n    "," {\n      background: ",";\n    }\n  }\n"],["\n  color: ",";\n  background: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n      svg path {\n        fill: currentColor;\n      }\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n\n  /** Night mode */\n  &.night {\n    color: ",";\n    background: ",";\n\n    &:not([disabled]) {\n      &:hover {\n        background: ",";\n      }\n      &:active,\n      &:focus {\n        background: ",";\n        color: ",";\n        svg path {\n          fill: currentColor;\n        }\n      }\n    }\n\n    "," {\n      background: ",";\n    }\n  }\n"])),(function(n){return y(n.color)||c.theme.textColor}),(function(n){return y(n.background)||c.theme.gray100}),(function(n){return y(n.hoverBackground)||c.theme.gray200}),c.theme.blue100,c.theme.blue600,_,c.theme.gray100,c.theme.gray0,c.theme.gray1000,(function(n){return y(n.hoverBackground)||c.theme.gray900}),c.theme.blue1000,c.theme.blue300,_,c.theme.gray1000),z=v.default(j)(h||(h=n.__makeTemplateObject(["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"],["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"])),(function(n){return y(n.background)||c.theme.red600}),(function(n){return y(n.color)||c.theme.gray0}),(function(n){return y(n.hoverBackground)||c.theme.red400}),c.theme.red700,_,c.theme.red600),C=v.default(j)(b||(b=n.__makeTemplateObject(["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"],["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"])),(function(n){return y(n.background)||c.theme.orange600}),(function(n){return y(n.color)||c.theme.gray0}),(function(n){return y(n.hoverBackground)||c.theme.orange400}),c.theme.orange700,_,c.theme.orange600),O=v.default(j)(p||(p=n.__makeTemplateObject(["\n  color: ",";\n  border: 1px solid ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: linear-gradient(\n        180deg,\n        "," 12.5%,\n        "," 87.5%\n      );\n      background: ",";\n      border: 1px solid ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n      border: 1px solid ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"],["\n  color: ",";\n  border: 1px solid ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: linear-gradient(\n        180deg,\n        "," 12.5%,\n        "," 87.5%\n      );\n      background: ",";\n      border: 1px solid ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n      border: 1px solid ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"])),(function(n){return y(n.color)||c.theme.textColor}),(function(n){return y(n.borderColor)||c.theme.gray200}),c.theme.gray0,c.theme.gray100,(function(n){return n.hoverBackground&&y(n.hoverBackground)}),c.theme.gray200,c.theme.blue100,c.theme.blue600,c.theme.blue300,_,c.theme.gray0),T=v.default(j)(m||(m=n.__makeTemplateObject(["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n    }\n  }\n\n  &.loading {\n    color: transparent;\n  }\n"],["\n  background: ",";\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n    }\n  }\n\n  &.loading {\n    color: transparent;\n  }\n"])),(function(n){return y(n.background)||"none"}),(function(n){return y(n.color)||c.theme.gray800}),(function(n){return y(n.hoverBackground)||c.theme.gray100}),c.theme.blue100,c.theme.blue600),q=v.default(j)(f||(f=n.__makeTemplateObject(["\n  color: ",";\n  height: 20px;\n  line-height: 20px;\n\n  &[disabled] {\n    color: ",";\n    &:not(.loading) {\n      opacity: inherit;\n    }\n  }\n\n  &:not([disabled]) {\n    &:hover {\n      color: ",";\n    }\n    &:active {\n      color: ",";\n    }\n  }\n\n  &.loading {\n    color: transparent;\n  }\n"],["\n  color: ",";\n  height: 20px;\n  line-height: 20px;\n\n  &[disabled] {\n    color: ",";\n    &:not(.loading) {\n      opacity: inherit;\n    }\n  }\n\n  &:not([disabled]) {\n    &:hover {\n      color: ",";\n    }\n    &:active {\n      color: ",";\n    }\n  }\n\n  &.loading {\n    color: transparent;\n  }\n"])),(function(n){return y(n.color)||c.theme.gray800}),c.theme.gray400,c.theme.gray700,c.theme.gray1200),B=j,G=v.default(j)(k||(k=n.__makeTemplateObject(["\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"],["\n  color: ",";\n\n  &:not([disabled]) {\n    &:hover {\n      background: ",";\n    }\n    &:active {\n      background: ",";\n      color: ",";\n    }\n  }\n\n  "," {\n    background: ",";\n  }\n"])),(function(n){return y(n.color)||c.theme.blue600}),(function(n){return y(n.hoverBackground)||c.theme.gray100}),c.theme.blue100,c.theme.blue800,_,c.theme.gray0);exports.Button=function(o){var c=o.children,l=o.className,s=o.disabled,d=void 0!==s&&s,u=o.icon,g=o.iconRight,h=o.intent,b=void 0===h?"secondary":h,p=o.loading,m=void 0!==p&&p,f=o.loadingText,k=o.noRipple,v=void 0!==k&&k,y=o.size,j=void 0===y?"sm":y,N=o.spinnerColor,S=o.tag,E=o.themeOverride,F=o.type,H=void 0===F?"button":F,M=n.__rest(o,["children","className","disabled","icon","iconRight","intent","loading","loadingText","noRipple","size","spinnerColor","tag","themeOverride","type"]),A=S||"button",D=function(n){return e.jsxs(e.Fragment,{children:[!g&&u,c,g&&u,"plain"!==b&&m&&e.jsxs(_,{children:[e.jsx(i.Spinner,{color:n,size:x(j)}),f]})]})},I=[l||"",u&&!c?"only-icon":"",g?"icon-right":"",u?"has-icon":"",m?"loading":"",E].filter(Boolean).join(" "),J=r.useRef(null),K=a.useRipple({disabled:d||m,rippleEnabled:!v&&!["plain","text"].includes(b),rippleRef:J}),L=K.getRippleHandlers,P=K.rippleEnabled,Q={className:I,disabled:d||m,size:j},U=n.__assign(n.__assign(n.__assign({type:H},Q),M),L(M));switch(b){case"primary":return e.jsxs(w,n.__assign({as:A},U,{children:[D(N||"white"),P&&e.jsx(t.RippleGroup,{ref:J})]}));case"subtle":return e.jsxs(T,n.__assign({as:A},U,{children:[D(N),P&&e.jsx(t.RippleGroup,{ref:J})]}));case"outline":return e.jsxs(O,n.__assign({as:A},U,{children:[D(N),P&&e.jsx(t.RippleGroup,{ref:J})]}));case"warning":return e.jsxs(C,n.__assign({as:A},U,{children:[D(N||"white"),P&&e.jsx(t.RippleGroup,{ref:J})]}));case"danger":return e.jsxs(z,n.__assign({as:A},U,{children:[D(N||"white"),P&&e.jsx(t.RippleGroup,{ref:J})]}));case"text":return e.jsx(q,n.__assign({as:A},U,{children:D(N)}));case"link":return e.jsxs(G,n.__assign({as:A},U,{children:[D(N),P&&e.jsx(t.RippleGroup,{ref:J})]}));case"plain":return e.jsx(B,n.__assign({as:A},U,{children:D(N)}));default:return e.jsxs(R,n.__assign({as:A},U,{children:[D(N),P&&e.jsx(t.RippleGroup,{ref:J})]}))}};

package/components/input/input-type/_FloatLabelInput.d.ts

@@ -23,7 +23,7 @@ type FloatLabelInputType = {
     /** Determines if the input is required for form validation */
     required?: boolean;
     size?: Size;
-    /** A short string displayed at the end of the input */
+    /** A short string displayed at the end of the input. Set to `null` to disable */
     suffix?: ReactNode;
     tabIndex?: number;
     /** Determines input type (email, password, etc.) */
@@ -54,7 +54,7 @@ export declare const FloatLabelInput: import("react").ForwardRefExoticComponent<
     /** Determines if the input is required for form validation */
     required?: boolean | undefined;
     size?: Size | undefined;
-    /** A short string displayed at the end of the input */
+    /** A short string displayed at the end of the input. Set to `null` to disable */
     suffix?: ReactNode;
     tabIndex?: number | undefined;
     /** Determines input type (email, password, etc.) */

package/components/input/input-type/_NumberInput.js

@@ -1 +1 @@
-"use strict";var e=require("../../../_tslib-ccfac372.js"),n=require("react/jsx-runtime"),t=require("react"),r=require("styled-components"),i=require("./_FloatLabelInput.js"),a=require("../../../icons/ChevronDownIcon.js"),o=require("../../../icons/ChevronUpIcon.js"),u=require("../../../styles/constants/theme.js");function s(e){return e&&e.__esModule?e:{default:e}}require("../../../utils/getTestId.js"),require("../../../icons/icon-base/_IconBase.js");var l,d,c,p,b=s(r),f=b.default.div(l||(l=e.__makeTemplateObject(["\n  position: relative;\n  width: 100%;\n"],["\n  position: relative;\n  width: 100%;\n"]))),v=b.default.div(d||(d=e.__makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n"],["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n"]))),h=b.default.button(c||(c=e.__makeTemplateObject(["\n  padding: ",";\n  border-radius: ",";\n  transition: ",";\n\n  &:hover {\n    background: rgba(0, 0, 0, 0.04);\n  }\n  &:active {\n    background: rgba(0, 0, 0, 0.1);\n  }\n  &:focus {\n    outline: none;\n  }\n"],["\n  padding: ",";\n  border-radius: ",";\n  transition: ",";\n\n  &:hover {\n    background: rgba(0, 0, 0, 0.04);\n  }\n  &:active {\n    background: rgba(0, 0, 0, 0.1);\n  }\n  &:focus {\n    outline: none;\n  }\n"])),u.theme.radius4,u.theme.radius4,u.theme.transition),x=b.default(i.FloatLabelInput)(p||(p=e.__makeTemplateObject(["\n  && input {\n    padding-right: ",";\n    appearance: textfield;\n\n    &::-webkit-inner-spin-button,\n    &::-webkit-outer-spin-button {\n      -webkit-appearance: none;\n    }\n  }\n"],["\n  && input {\n    padding-right: ",";\n    appearance: textfield;\n\n    &::-webkit-inner-spin-button,\n    &::-webkit-outer-spin-button {\n      -webkit-appearance: none;\n    }\n  }\n"])),u.theme.space40);exports.NumberInput=function(r){var i=r.autoFocus,u=r.className,s=r.disabled,l=r.error,d=r.inputMode,c=r.label,p=r.onChange,b=r.onKeyDown,m=r.pattern,j=r.placeholder,g=r.prefix,_=r.readOnly,k=r.required,w=r.suffix,y=r.tabIndex,q=r.value,I=e.__rest(r,["autoFocus","className","disabled","error","inputMode","label","onChange","onKeyDown","pattern","placeholder","prefix","readOnly","required","suffix","tabIndex","value"]),C=t.useRef(null);return n.jsx(f,{className:u,children:n.jsx(x,e.__assign({ref:C,"aria-label":c,autoFocus:i,disabled:s,error:l,inputMode:d,label:c,onChange:p,onKeyDown:b,pattern:m,placeholder:j,prefix:g,readOnly:_,required:k,suffix:w||n.jsxs(v,{children:[n.jsx(h,{onClick:function(){var e,n;null===(e=C.current)||void 0===e||e.stepUp(),null===(n=C.current)||void 0===n||n.dispatchEvent(new Event("input",{bubbles:!0}))},type:"button",children:n.jsx(o.ChevronUpIcon,{size:16})}),n.jsx(h,{onClick:function(){var e,n;null===(e=C.current)||void 0===e||e.stepDown(),null===(n=C.current)||void 0===n||n.dispatchEvent(new Event("input",{bubbles:!0}))},type:"button",children:n.jsx(a.ChevronDownIcon,{size:16})})]}),tabIndex:y,type:"number",value:q},I))})};
+"use strict";var n=require("../../../_tslib-ccfac372.js"),e=require("react/jsx-runtime"),t=require("react"),r=require("styled-components"),i=require("./_FloatLabelInput.js"),a=require("../../../icons/ChevronDownIcon.js"),o=require("../../../icons/ChevronUpIcon.js"),u=require("../../../styles/constants/theme.js");function s(n){return n&&n.__esModule?n:{default:n}}require("../../../utils/getTestId.js"),require("../../../icons/icon-base/_IconBase.js");var l,d,c,p,b=s(r),f=b.default.div(l||(l=n.__makeTemplateObject(["\n  position: relative;\n  width: 100%;\n"],["\n  position: relative;\n  width: 100%;\n"]))),v=b.default.div(d||(d=n.__makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n"],["\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n"]))),h=b.default.button(c||(c=n.__makeTemplateObject(["\n  padding: ",";\n  border-radius: ",";\n  transition: ",";\n\n  &:hover {\n    background: rgba(0, 0, 0, 0.04);\n  }\n  &:active {\n    background: rgba(0, 0, 0, 0.1);\n  }\n  &:focus {\n    outline: none;\n  }\n"],["\n  padding: ",";\n  border-radius: ",";\n  transition: ",";\n\n  &:hover {\n    background: rgba(0, 0, 0, 0.04);\n  }\n  &:active {\n    background: rgba(0, 0, 0, 0.1);\n  }\n  &:focus {\n    outline: none;\n  }\n"])),u.theme.radius4,u.theme.radius4,u.theme.transition),x=b.default(i.FloatLabelInput)(p||(p=n.__makeTemplateObject(["\n  && input {\n    padding-right: ",";\n    appearance: textfield;\n\n    &::-webkit-inner-spin-button,\n    &::-webkit-outer-spin-button {\n      -webkit-appearance: none;\n    }\n  }\n"],["\n  && input {\n    padding-right: ",";\n    appearance: textfield;\n\n    &::-webkit-inner-spin-button,\n    &::-webkit-outer-spin-button {\n      -webkit-appearance: none;\n    }\n  }\n"])),u.theme.space40);exports.NumberInput=function(r){var i=r.autoFocus,u=r.className,s=r.disabled,l=r.error,d=r.inputMode,c=r.label,p=r.onChange,b=r.onKeyDown,m=r.pattern,j=r.placeholder,g=r.prefix,_=r.readOnly,k=r.required,w=r.suffix,y=r.tabIndex,q=r.value,I=n.__rest(r,["autoFocus","className","disabled","error","inputMode","label","onChange","onKeyDown","pattern","placeholder","prefix","readOnly","required","suffix","tabIndex","value"]),C=t.useRef(null);return e.jsx(f,{className:u,children:e.jsx(x,n.__assign({ref:C,"aria-label":c,autoFocus:i,disabled:s,error:l,inputMode:d,label:c,onChange:p,onKeyDown:b,pattern:m,placeholder:j,prefix:g,readOnly:_,required:k,suffix:null===w?null:w||e.jsxs(v,{children:[e.jsx(h,{onClick:function(){var n,e;null===(n=C.current)||void 0===n||n.stepUp(),null===(e=C.current)||void 0===e||e.dispatchEvent(new Event("input",{bubbles:!0}))},type:"button",children:e.jsx(o.ChevronUpIcon,{size:16})}),e.jsx(h,{onClick:function(){var n,e;null===(n=C.current)||void 0===n||n.stepDown(),null===(e=C.current)||void 0===e||e.dispatchEvent(new Event("input",{bubbles:!0}))},type:"button",children:e.jsx(a.ChevronDownIcon,{size:16})})]}),tabIndex:y,type:"number",value:q},I))})};

package/components/select/Select.d.ts

@@ -18,6 +18,10 @@ export interface SelectProps<Option extends IOption = IOption, IsMulti extends f
      * value={options.filter(x => x.value === exampleValue)}
      */
     value: Option[] | Option | null;
+    /**
+     * An easier way to override the option rendering without having to use the typical component props and recreating all the styles.
+     */
+    customOption?: (value: Option['value']) => ReactNode;
     /**
      * @example
      * onChange={changed => setExampleValue(changed?.value || null)}

package/components/select/_StyledReactSelect.d.ts

@@ -3,18 +3,19 @@ import type { GroupBase, OptionProps, Props, SelectComponentsConfig, StylesConfi
 import { type HelpTextProps } from "../help-text/HelpText";
 import type { IOption } from "../../types/IOption";
 import type { Size } from "../../types/Size";
-type AdditionalProps = {
+type AdditionalProps<Value> = {
     hasGroups?: boolean;
     icon?: ReactNode;
     label?: string;
     size?: Size;
+    customOption?: (value: Value) => ReactNode;
 };
 export declare const CheckboxOptionComponent: <Option extends IOption<string | number>, IsMulti extends boolean, Group extends GroupBase<Option>>(props: OptionProps<Option, IsMulti, Group>) => import("react/jsx-runtime").JSX.Element;
-export interface StyledReactSelectProps<Option extends IOption, IsMulti extends boolean, Group extends GroupBase<Option>> extends Props<Option, IsMulti, Group>, HelpTextProps, AdditionalProps {
+export interface StyledReactSelectProps<Option extends IOption, IsMulti extends boolean, Group extends GroupBase<Option>> extends Props<Option, IsMulti, Group>, HelpTextProps, AdditionalProps<Option['value']> {
     closeOnOutsideScroll?: boolean;
     components?: SelectComponentsConfig<Option, IsMulti, Group>;
     size?: Size;
     styles?: StylesConfig<Option, IsMulti, Group>;
 }
-export declare const StyledReactSelect: <Option extends IOption<string | number>, IsMulti extends boolean, Group extends GroupBase<Option>>({ closeOnOutsideScroll, components, error, hasGroups, helpText, icon, label, menuPosition, placeholder, size, styles, ...props }: StyledReactSelectProps<Option, IsMulti, Group>) => import("react/jsx-runtime").JSX.Element;
+export declare const StyledReactSelect: <Option extends IOption<string | number>, IsMulti extends boolean, Group extends GroupBase<Option>>({ closeOnOutsideScroll, components, customOption, error, hasGroups, helpText, icon, label, menuPosition, placeholder, size, styles, ...props }: StyledReactSelectProps<Option, IsMulti, Group>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/components/select/_StyledReactSelect.js

@@ -1 +1 @@
-"use strict";var n=require("../../_tslib-ccfac372.js"),e=require("react/jsx-runtime"),o=require("react"),t=require("react-select"),i=require("styled-components"),s=require("../checkbox/Checkbox.js"),r=require("../help-text/HelpText.js"),a=require("../../icons/CheckCircleIcon.js"),l=require("../../icons/DoubleChevronIcon.js"),c=require("../../icons/RemoveCircleIcon.js"),d=require("../../icons/RemoveIcon.js"),u=require("../../styles/constants/theme.js"),p=require("../../utils/getTestId.js");function h(n){return n&&n.__esModule?n:{default:n}}require("framer-motion"),require("../text/Text.js"),require("../../icons/CheckmarkIcon.js"),require("../../icons/icon-base/_IconBase.js");var m,g,f,_,x,b,v,j,y,k,T,z=h(t),C=h(i),w=function(o){return e.jsx(t.components.ClearIndicator,n.__assign({},o,{children:e.jsx(c.RemoveCircleIcon,{size:19})}))},I=function(o){return e.jsx(t.components.DropdownIndicator,n.__assign({},o,{children:e.jsx(l.DoubleChevronIcon,{size:20})}))},O=C.default.div(m||(m=n.__makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  color: ",";\n  padding: 10px;\n"],["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  color: ",";\n  padding: 10px;\n"])),u.theme.gray700),S=C.default.label(b||(b=n.__makeTemplateObject(["\n  position: absolute;\n  transition: ",";\n  font-size: ",";\n  line-height: ",";\n  transform-origin: left top;\n  left: calc("," - 2px);\n  .has-icon & {\n    left: calc("," + 2px);\n  }\n  top: calc(50% - "," / 2);\n  .has-label & {\n    & + div {\n      align-self: flex-end;\n    }\n  }\n  .has-value &,\n  .is-focused & {\n    top: calc("," + 3px);\n    transform: scale(0.8);\n  }\n\n  /* Size modify */\n  ","\n\n  ","\n\n  ","\n\n  ","\n"],["\n  position: absolute;\n  transition: ",";\n  font-size: ",";\n  line-height: ",";\n  transform-origin: left top;\n  left: calc("," - 2px);\n  .has-icon & {\n    left: calc("," + 2px);\n  }\n  top: calc(50% - "," / 2);\n  .has-label & {\n    & + div {\n      align-self: flex-end;\n    }\n  }\n  .has-value &,\n  .is-focused & {\n    top: calc("," + 3px);\n    transform: scale(0.8);\n  }\n\n  /* Size modify */\n  ","\n\n  ","\n\n  ","\n\n  ","\n"])),u.theme.transition,u.theme.fontSizeBase,u.theme.fontSizeBase,u.theme.space16,u.theme.space40,u.theme.fontSizeBase,u.theme.space8,(function(e){var o=e.$size;return"sm"===o&&i.css(g||(g=n.__makeTemplateObject(["\n      .",".has-label & {\n        & + div {\n          margin-bottom: -6px;\n        }\n      }\n      .",".has-value &,\n      .",".is-focused & {\n        top: 2px;\n      }\n    "],["\n      .",".has-label & {\n        & + div {\n          margin-bottom: -6px;\n        }\n      }\n      .",".has-value &,\n      .",".is-focused & {\n        top: 2px;\n      }\n    "])),o,o,o)}),(function(e){var o=e.$size;return"md"===o&&i.css(f||(f=n.__makeTemplateObject(["\n      .",".has-label & {\n        & + div {\n          margin-bottom: -2px;\n        }\n      }\n      .",".has-value &,\n      .",".is-focused & {\n        top: 6px;\n      }\n    "],["\n      .",".has-label & {\n        & + div {\n          margin-bottom: -2px;\n        }\n      }\n      .",".has-value &,\n      .",".is-focused & {\n        top: 6px;\n      }\n    "])),o,o,o)}),(function(e){var o=e.$size;return"lg"===o&&i.css(_||(_=n.__makeTemplateObject(["\n      .",".has-value &,\n      .",".is-focused & {\n        top: 10px;\n      }\n    "],["\n      .",".has-value &,\n      .",".is-focused & {\n        top: 10px;\n      }\n    "])),o,o)}),(function(e){var o=e.$size;return"xl"===o&&i.css(x||(x=n.__makeTemplateObject(["\n      .",".has-label & {\n        & + div {\n          margin-bottom: 3px;\n        }\n      }\n      .",".has-value &,\n      .",".is-focused & {\n        top: 11px;\n      }\n    "],["\n      .",".has-label & {\n        & + div {\n          margin-bottom: 3px;\n        }\n      }\n      .",".has-value &,\n      .",".is-focused & {\n        top: 11px;\n      }\n    "])),o,o,o)})),q=C.default.div(v||(v=n.__makeTemplateObject(["\n  .react-select-control + div {\n    z-index: 20;\n  }\n\n  &.has-error .react-select-control {\n    box-shadow: ",";\n  }\n"],["\n  .react-select-control + div {\n    z-index: 20;\n  }\n\n  &.has-error .react-select-control {\n    box-shadow: ",";\n  }\n"])),u.theme.glowError),R=C.default.strong(j||(j=n.__makeTemplateObject(["\n  font-weight: 600;\n"],["\n  font-weight: 600;\n"]))),L=function(o){var t=o.children,i=o.className,s=o.cx,r=o.getStyles,a=o.hasValue,l=o.innerProps,c=o.innerRef,d=o.isDisabled,u=o.isFocused,p=o.menuIsOpen,h=o.selectProps,m=h.icon,g=h.label,f=h.size,_=h.value;return e.jsxs("div",n.__assign({ref:c,className:s({control:!0,"control--is-disabled":d,"control--is-focused":u,"control--menu-is-open":p},[i,a?"has-value":"",m?"has-icon":"",u?"is-focused":"",g||Array.isArray(_)&&_.length>1?"has-label":"",f,"react-select-control"].join(" ")),style:r("control",o)},l,{children:[m&&e.jsx(O,{children:m}),e.jsxs(S,{$size:f,children:[g," ",Array.isArray(_)&&_.length>1&&e.jsxs(R,{children:["(",_.length," selected)"]})]}),t]}))},M=C.default.div(y||(y=n.__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  color: ",";\n  svg {\n    margin-right: 4px;\n    color: ",";\n  }\n"],["\n  display: flex;\n  align-items: center;\n  color: ",";\n  svg {\n    margin-right: 4px;\n    color: ",";\n  }\n"])),(function(n){return n.$color||"inherit"}),u.theme.gray1200),P=C.default.div(k||(k=n.__makeTemplateObject(["\n  &:not(.is-disabled) {\n    &.is-focused,\n    &:hover {\n      /* The styles are inlined on this component from emotion, so we must override */\n      background-color: "," !important;\n    }\n  }\n"],["\n  &:not(.is-disabled) {\n    &.is-focused,\n    &:hover {\n      /* The styles are inlined on this component from emotion, so we must override */\n      background-color: "," !important;\n    }\n  }\n"])),u.theme.gray100),B=C.default.div(T||(T=n.__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"],["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"]))),D=function(n){var o=n.children,t=n.color,i=n.icon;return e.jsxs(M,{$color:t,children:[i,o]})},N=function(o){var i=o.children,s=n.__rest(o,["children"]);return e.jsx(t.components.MultiValueLabel,n.__assign({},s,{children:e.jsx(D,{icon:s.data.icon,children:i})}))},V=function(o){var t=o.innerProps;return e.jsx("div",n.__assign({},t,{role:"button",children:e.jsx(d.RemoveIcon,{size:14})}))},$=function(o){var t=o.children,i=o.className,r=o.data,l=o.getStyles,c=o.innerProps,d=o.innerRef,u=o.isDisabled,p=o.isFocused,h=o.isSelected,m=o.selectProps,g=m.hasGroups,f=l("option",o),_=f.color,x=n.__rest(f,["color"]);return g&&(x.paddingLeft=48),e.jsx("div",n.__assign({ref:d},c,{children:e.jsx(P,{className:[i,p?"is-focused":"",u?"is-disabled":""].join(" "),style:x,children:m.isMulti?e.jsx(s.Checkbox,{checked:h,disabled:u,icon:r.icon,label:r.label,labelDescription:r.labelDescription,onChange:function(){}}):e.jsxs(B,{children:[e.jsx(D,{color:_,icon:r.icon,children:t}),h&&e.jsx(a.CheckCircleIcon,{color:"blue600",size:16})]})})}))},W={clearIndicator:function(e){return n.__assign(n.__assign({},e),{color:"".concat(u.theme.gray700),paddingLeft:14,paddingRight:4})},control:function(e,o){var t=o.selectProps.size;return n.__assign(n.__assign({},e),{background:u.theme.inputBackground,borderColor:"".concat(u.theme.gray200),borderRadius:6,boxShadow:o.isFocused?"".concat(u.theme.glowBlue):"",color:u.theme.gray800,cursor:"pointer",flexWrap:"inherit",height:"var(--amino-size-".concat(t,")"),minHeight:"var(--amino-size-".concat(t,")")})},dropdownIndicator:function(e){return n.__assign(n.__assign({},e),{color:"".concat(u.theme.gray900),paddingLeft:4,paddingRight:10})},group:function(e){return n.__assign(n.__assign({},e),{paddingBottom:0,paddingTop:0})},indicatorSeparator:function(e){return n.__assign(n.__assign({},e),{width:0})},menu:function(e){return n.__assign(n.__assign({},e),{background:u.theme.surfaceColor,borderRadius:12,boxShadow:u.theme.v3ShadowLarge,marginTop:4})},menuList:function(e){return n.__assign(n.__assign({},e),{paddingLeft:8,paddingRight:8,paddingTop:8})},multiValue:function(e){return n.__assign(n.__assign({},e),{background:u.theme.gray200,fontWeight:500,minWidth:"inherit"})},multiValueLabel:function(e){return n.__assign(n.__assign({},e),{color:u.theme.textColor})},option:function(e,o){return n.__assign(n.__assign({},e),{backgroundColor:"inherit",borderRadius:"8px",color:o.isSelected?u.theme.blue600:u.theme.textColor,cursor:"pointer",fontWeight:o.isSelected?500:400,paddingBottom:7,paddingLeft:8,paddingRight:12,paddingTop:7})},placeholder:function(e){return n.__assign(n.__assign({},e),{".has-label.is-focused &":{opacity:1},opacity:0})},singleValue:function(e){return n.__assign(n.__assign({},e),{color:u.theme.textColor,fontWeight:500})},valueContainer:function(e){return n.__assign(n.__assign({},e),{".has-icon &":{paddingLeft:0},flexWrap:"nowrap",padding:"unset",paddingLeft:12})}};exports.CheckboxOptionComponent=$,exports.StyledReactSelect=function(t){var i=t.closeOnOutsideScroll,s=void 0!==i&&i,a=t.components,l=t.error,c=t.hasGroups,d=t.helpText,u=t.icon,h=t.label,m=t.menuPosition,g=void 0===m?"fixed":m,f=t.placeholder,_=t.size,x=void 0===_?"xl":_,b=t.styles,v=n.__rest(t,["closeOnOutsideScroll","components","error","hasGroups","helpText","icon","label","menuPosition","placeholder","size","styles"]),j={hasGroups:c,icon:u,label:h,size:x},y=o.useMemo((function(){return p.getTestId({componentName:"select",name:h})}),[h]),k=o.useRef(null),T=o.useMemo((function(){return!!s&&function(n){var e,o,t;return!(n.target instanceof HTMLElement)||(null===(t=!(null===(o=null===(e=k.current)||void 0===e?void 0:e.menuListRef)||void 0===o?void 0:o.isEqualNode(n.target)))||void 0===t||t)}}),[s]);return e.jsxs(q,{className:[l?"has-error":""].join(" "),"data-testid":y,children:[e.jsx(z.default,n.__assign({ref:k,closeMenuOnScroll:T,components:n.__assign({ClearIndicator:w,Control:L,DropdownIndicator:I,MultiValueLabel:N,MultiValueRemove:V,Option:$},a),menuPosition:g,placeholder:f||"",styles:n.__assign(n.__assign({},b),W)},v,j)),e.jsx(r.HelpText,{error:l,helpText:d})]})};
+"use strict";var n=require("../../_tslib-ccfac372.js"),e=require("react/jsx-runtime"),o=require("react"),t=require("react-select"),i=require("styled-components"),s=require("../checkbox/Checkbox.js"),r=require("../help-text/HelpText.js"),a=require("../../icons/CheckCircleIcon.js"),l=require("../../icons/DoubleChevronIcon.js"),c=require("../../icons/RemoveCircleIcon.js"),u=require("../../icons/RemoveIcon.js"),d=require("../../styles/constants/theme.js"),p=require("../../utils/getTestId.js");function h(n){return n&&n.__esModule?n:{default:n}}require("framer-motion"),require("../text/Text.js"),require("../../icons/CheckmarkIcon.js"),require("../../icons/icon-base/_IconBase.js");var m,g,f,_,x,b,v,j,y,k,T,z=h(t),C=h(i),O=function(o){return e.jsx(t.components.ClearIndicator,n.__assign({},o,{children:e.jsx(c.RemoveCircleIcon,{size:19})}))},w=function(o){return e.jsx(t.components.DropdownIndicator,n.__assign({},o,{children:e.jsx(l.DoubleChevronIcon,{size:20})}))},I=C.default.div(m||(m=n.__makeTemplateObject(["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  color: ",";\n  padding: 10px;\n"],["\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  color: ",";\n  padding: 10px;\n"])),d.theme.gray700),S=C.default.label(b||(b=n.__makeTemplateObject(["\n  position: absolute;\n  transition: ",";\n  font-size: ",";\n  line-height: ",";\n  transform-origin: left top;\n  left: calc("," - 2px);\n  .has-icon & {\n    left: calc("," + 2px);\n  }\n  top: calc(50% - "," / 2);\n  .has-label & {\n    & + div {\n      align-self: flex-end;\n    }\n  }\n  .has-value &,\n  .is-focused & {\n    top: calc("," + 3px);\n    transform: scale(0.8);\n  }\n\n  /* Size modify */\n  ","\n\n  ","\n\n  ","\n\n  ","\n"],["\n  position: absolute;\n  transition: ",";\n  font-size: ",";\n  line-height: ",";\n  transform-origin: left top;\n  left: calc("," - 2px);\n  .has-icon & {\n    left: calc("," + 2px);\n  }\n  top: calc(50% - "," / 2);\n  .has-label & {\n    & + div {\n      align-self: flex-end;\n    }\n  }\n  .has-value &,\n  .is-focused & {\n    top: calc("," + 3px);\n    transform: scale(0.8);\n  }\n\n  /* Size modify */\n  ","\n\n  ","\n\n  ","\n\n  ","\n"])),d.theme.transition,d.theme.fontSizeBase,d.theme.fontSizeBase,d.theme.space16,d.theme.space40,d.theme.fontSizeBase,d.theme.space8,(function(e){var o=e.$size;return"sm"===o&&i.css(g||(g=n.__makeTemplateObject(["\n      .",".has-label & {\n        & + div {\n          margin-bottom: -6px;\n        }\n      }\n      .",".has-value &,\n      .",".is-focused & {\n        top: 2px;\n      }\n    "],["\n      .",".has-label & {\n        & + div {\n          margin-bottom: -6px;\n        }\n      }\n      .",".has-value &,\n      .",".is-focused & {\n        top: 2px;\n      }\n    "])),o,o,o)}),(function(e){var o=e.$size;return"md"===o&&i.css(f||(f=n.__makeTemplateObject(["\n      .",".has-label & {\n        & + div {\n          margin-bottom: -2px;\n        }\n      }\n      .",".has-value &,\n      .",".is-focused & {\n        top: 6px;\n      }\n    "],["\n      .",".has-label & {\n        & + div {\n          margin-bottom: -2px;\n        }\n      }\n      .",".has-value &,\n      .",".is-focused & {\n        top: 6px;\n      }\n    "])),o,o,o)}),(function(e){var o=e.$size;return"lg"===o&&i.css(_||(_=n.__makeTemplateObject(["\n      .",".has-value &,\n      .",".is-focused & {\n        top: 10px;\n      }\n    "],["\n      .",".has-value &,\n      .",".is-focused & {\n        top: 10px;\n      }\n    "])),o,o)}),(function(e){var o=e.$size;return"xl"===o&&i.css(x||(x=n.__makeTemplateObject(["\n      .",".has-label & {\n        & + div {\n          margin-bottom: 3px;\n        }\n      }\n      .",".has-value &,\n      .",".is-focused & {\n        top: 11px;\n      }\n    "],["\n      .",".has-label & {\n        & + div {\n          margin-bottom: 3px;\n        }\n      }\n      .",".has-value &,\n      .",".is-focused & {\n        top: 11px;\n      }\n    "])),o,o,o)})),q=C.default.div(v||(v=n.__makeTemplateObject(["\n  .react-select-control + div {\n    z-index: 20;\n  }\n\n  &.has-error .react-select-control {\n    box-shadow: ",";\n  }\n"],["\n  .react-select-control + div {\n    z-index: 20;\n  }\n\n  &.has-error .react-select-control {\n    box-shadow: ",";\n  }\n"])),d.theme.glowError),R=C.default.strong(j||(j=n.__makeTemplateObject(["\n  font-weight: 600;\n"],["\n  font-weight: 600;\n"]))),L=function(o){var t=o.children,i=o.className,s=o.cx,r=o.getStyles,a=o.hasValue,l=o.innerProps,c=o.innerRef,u=o.isDisabled,d=o.isFocused,p=o.menuIsOpen,h=o.selectProps,m=h.icon,g=h.label,f=h.size,_=h.value;return e.jsxs("div",n.__assign({ref:c,className:s({control:!0,"control--is-disabled":u,"control--is-focused":d,"control--menu-is-open":p},[i,a?"has-value":"",m?"has-icon":"",d?"is-focused":"",g||Array.isArray(_)&&_.length>1?"has-label":"",f,"react-select-control"].join(" ")),style:r("control",o)},l,{children:[m&&e.jsx(I,{children:m}),e.jsxs(S,{$size:f,children:[g," ",Array.isArray(_)&&_.length>1&&e.jsxs(R,{children:["(",_.length," selected)"]})]}),t]}))},M=C.default.div(y||(y=n.__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  color: ",";\n  svg {\n    margin-right: 4px;\n    color: ",";\n  }\n"],["\n  display: flex;\n  align-items: center;\n  color: ",";\n  svg {\n    margin-right: 4px;\n    color: ",";\n  }\n"])),(function(n){return n.$color||"inherit"}),d.theme.gray1200),P=C.default.div(k||(k=n.__makeTemplateObject(["\n  &:not(.is-disabled) {\n    &.is-focused,\n    &:hover {\n      /* The styles are inlined on this component from emotion, so we must override */\n      background-color: "," !important;\n    }\n  }\n"],["\n  &:not(.is-disabled) {\n    &.is-focused,\n    &:hover {\n      /* The styles are inlined on this component from emotion, so we must override */\n      background-color: "," !important;\n    }\n  }\n"])),d.theme.gray100),B=C.default.div(T||(T=n.__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"],["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"]))),D=function(n){var o=n.children,t=n.color,i=n.icon;return e.jsxs(M,{$color:t,children:[i,o]})},N=function(o){var i=o.children,s=n.__rest(o,["children"]);return e.jsx(t.components.MultiValueLabel,n.__assign({},s,{children:e.jsx(D,{icon:s.data.icon,children:i})}))},V=function(o){var t=o.innerProps;return e.jsx("div",n.__assign({},t,{role:"button",children:e.jsx(u.RemoveIcon,{size:14})}))},$=function(o){var t=o.children,i=o.className,r=o.data,l=o.getStyles,c=o.innerProps,u=o.innerRef,d=o.isDisabled,p=o.isFocused,h=o.isSelected,m=o.selectProps,g=m,f=g.customOption,_=g.hasGroups,x=l("option",o),b=x.color,v=n.__rest(x,["color"]);_&&(v.paddingLeft=48);return e.jsx("div",n.__assign({ref:u},c,{children:e.jsx(P,{className:[i,p?"is-focused":"",d?"is-disabled":""].join(" "),style:v,children:m.isMulti?e.jsx(s.Checkbox,{checked:h,disabled:d,icon:r.icon,label:r.label,labelDescription:r.labelDescription,onChange:function(){}}):f?f(r.value):e.jsxs(B,{children:[e.jsx(D,{color:b,icon:r.icon,children:t}),h&&e.jsx(a.CheckCircleIcon,{color:"blue600",size:16})]})})}))},W={clearIndicator:function(e){return n.__assign(n.__assign({},e),{color:d.theme.gray700,paddingLeft:14,paddingRight:4})},control:function(e,o){var t=o.selectProps.size;return n.__assign(n.__assign({},e),{background:d.theme.inputBackground,borderColor:"".concat(d.theme.gray200),borderRadius:6,boxShadow:o.isFocused?"".concat(d.theme.glowBlue):"",color:d.theme.gray800,cursor:"pointer",flexWrap:"inherit",height:"var(--amino-size-".concat(t,")"),minHeight:"var(--amino-size-".concat(t,")")})},dropdownIndicator:function(e){return n.__assign(n.__assign({},e),{color:d.theme.gray900,paddingLeft:4,paddingRight:10})},group:function(e){return n.__assign(n.__assign({},e),{paddingBottom:0,paddingTop:0})},indicatorSeparator:function(e){return n.__assign(n.__assign({},e),{width:0})},input:function(e){return n.__assign(n.__assign({},e),{color:d.theme.textColor,opacity:.8})},menu:function(e){return n.__assign(n.__assign({},e),{background:d.theme.surfaceColor,borderRadius:12,boxShadow:d.theme.v3ShadowLarge,marginTop:4})},menuList:function(e){return n.__assign(n.__assign({},e),{paddingLeft:8,paddingRight:8,paddingTop:8})},multiValue:function(e){return n.__assign(n.__assign({},e),{background:d.theme.gray200,fontWeight:500,minWidth:"inherit"})},multiValueLabel:function(e){return n.__assign(n.__assign({},e),{color:d.theme.textColor})},option:function(e,o){return n.__assign(n.__assign({},e),{backgroundColor:"inherit",borderRadius:"8px",color:o.isSelected?d.theme.blue600:d.theme.textColor,cursor:"pointer",fontWeight:o.isSelected?500:400,paddingBottom:7,paddingLeft:8,paddingRight:12,paddingTop:7})},placeholder:function(e){return n.__assign(n.__assign({},e),{".has-label.is-focused &":{opacity:1},opacity:0})},singleValue:function(e){return n.__assign(n.__assign({},e),{color:d.theme.textColor,fontWeight:500})},valueContainer:function(e){return n.__assign(n.__assign({},e),{".has-icon &":{paddingLeft:0},flexWrap:"nowrap",padding:"unset",paddingLeft:12})}};exports.CheckboxOptionComponent=$,exports.StyledReactSelect=function(t){var i=t.closeOnOutsideScroll,s=void 0!==i&&i,a=t.components,l=t.customOption,c=t.error,u=t.hasGroups,d=t.helpText,h=t.icon,m=t.label,g=t.menuPosition,f=void 0===g?"fixed":g,_=t.placeholder,x=t.size,b=void 0===x?"xl":x,v=t.styles,j=n.__rest(t,["closeOnOutsideScroll","components","customOption","error","hasGroups","helpText","icon","label","menuPosition","placeholder","size","styles"]),y={customOption:l,hasGroups:u,icon:h,label:m,size:b},k=o.useMemo((function(){return p.getTestId({componentName:"select",name:m})}),[m]),T=o.useRef(null),C=o.useMemo((function(){return!!s&&function(n){var e,o,t;return!(n.target instanceof HTMLElement)||(null===(t=!(null===(o=null===(e=T.current)||void 0===e?void 0:e.menuListRef)||void 0===o?void 0:o.isEqualNode(n.target)))||void 0===t||t)}}),[s]);return e.jsxs(q,{className:[c?"has-error":""].join(" "),"data-testid":k,children:[e.jsx(z.default,n.__assign({ref:T,closeMenuOnScroll:C,components:n.__assign({ClearIndicator:O,Control:L,DropdownIndicator:w,MultiValueLabel:N,MultiValueRemove:V,Option:$},a),menuPosition:f,placeholder:_||"",styles:n.__assign(n.__assign({},v),W)},j,y)),e.jsx(r.HelpText,{error:c,helpText:d})]})};

package/components/spinner/Spinner.d.ts

@@ -1,8 +1,13 @@
-import type { Intent } from "../../types";
-export type SpinnerColor = 'black' | 'white' | Exclude<Intent, 'default' | 'error'>;
+export type SpinnerColor = 'primary' | 'info' | 'success' | 'danger' | 'warning' | 'black' | 'white';
 export type SpinnerProps = {
     className?: string;
+    /**
+     * @default 'primary'
+     */
     color?: SpinnerColor;
+    /**
+     * @default 32
+     */
     size?: number;
 };
-export declare const Spinner: ({ className, color, size }: SpinnerProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Spinner: ({ className, color, size, }: SpinnerProps) => import("react/jsx-runtime").JSX.Element;

package/components/spinner/Spinner.js

@@ -1 +1 @@
-"use strict";var n=require("../../_tslib-ccfac372.js"),r=require("react/jsx-runtime"),e=require("styled-components"),o=require("../../styles/constants/theme.js");function t(n){return n&&n.__esModule?n:{default:n}}var i,a,s,d,c,l=t(e),b=e.keyframes(i||(i=n.__makeTemplateObject(["\n  0% {\n    transform: rotate(0deg);\n  }\n  35%{\n    transform: rotate(360deg);\n  }\n  70% {\n    transform: rotate(697.5deg);\n  }\n  100% {\n    transform: rotate(720deg);\n  }\n"],["\n  0% {\n    transform: rotate(0deg);\n  }\n  35%{\n    transform: rotate(360deg);\n  }\n  70% {\n    transform: rotate(697.5deg);\n  }\n  100% {\n    transform: rotate(720deg);\n  }\n"]))),p=e.keyframes(a||(a=n.__makeTemplateObject(["\n  65%, 75% {\n    transform: rotate(-45deg);\n  }\n  100% {\n    transform: rotate(0deg);\n  }\n"],["\n  65%, 75% {\n    transform: rotate(-45deg);\n  }\n  100% {\n    transform: rotate(0deg);\n  }\n"]))),f="1.5s",m=l.default.span(c||(c=n.__makeTemplateObject(["\n  display: inline-block;\n  border: ","px solid ",";\n  border-top-color: ",";\n  animation: "," "," linear infinite;\n  border-radius: 50%;\n  transform: rotate(45deg);\n  width: ","px;\n  height: ","px;\n  position: relative;\n  &::before {\n    content: '';\n    position: absolute;\n    top: -","px;\n    left: -","px;\n    width: ","px;\n    height: ","px;\n    border-radius: 50%;\n    border: ","px solid transparent;\n    border-right-color: ",";\n    z-index: 1;\n    animation: "," "," linear infinite;\n  }\n\n  &.black {\n    border: ","px solid rgba(0, 0, 0, 0.3);\n    border-top-color: #0c0c0c;\n    &::before {\n      border-right-color: rgba(0, 0, 0, 0.5);\n    }\n  }\n\n  &.white {\n    border: ","px solid rgba(255, 255, 255, 0.3);\n    border-top-color: ",";\n    &::before {\n      border-right-color: rgba(255, 255, 255, 0.3);\n    }\n  }\n\n  &.info {\n    border-top-color: ",";\n  }\n  &.success {\n    border-top-color: ",";\n  }\n  &.danger {\n    border-top-color: ",";\n  }\n  &.warning {\n    border-top-color: ",";\n  }\n"],["\n  display: inline-block;\n  border: ","px solid ",";\n  border-top-color: ",";\n  animation: "," "," linear infinite;\n  border-radius: 50%;\n  transform: rotate(45deg);\n  width: ","px;\n  height: ","px;\n  position: relative;\n  &::before {\n    content: '';\n    position: absolute;\n    top: -","px;\n    left: -","px;\n    width: ","px;\n    height: ","px;\n    border-radius: 50%;\n    border: ","px solid transparent;\n    border-right-color: ",";\n    z-index: 1;\n    animation: "," "," linear infinite;\n  }\n\n  &.black {\n    border: ","px solid rgba(0, 0, 0, 0.3);\n    border-top-color: #0c0c0c;\n    &::before {\n      border-right-color: rgba(0, 0, 0, 0.5);\n    }\n  }\n\n  &.white {\n    border: ","px solid rgba(255, 255, 255, 0.3);\n    border-top-color: ",";\n    &::before {\n      border-right-color: rgba(255, 255, 255, 0.3);\n    }\n  }\n\n  &.info {\n    border-top-color: ",";\n  }\n  &.success {\n    border-top-color: ",";\n  }\n  &.danger {\n    border-top-color: ",";\n  }\n  &.warning {\n    border-top-color: ",";\n  }\n"])),(function(n){return n.size/8}),o.theme.gray100,o.theme.blue600,e.css(s||(s=n.__makeTemplateObject(["\n      ",""],["\n      ",""])),b),f,(function(n){return n.size}),(function(n){return n.size}),(function(n){return n.size/8}),(function(n){return n.size/8}),(function(n){return n.size}),(function(n){return n.size}),(function(n){return n.size/8}),o.theme.gray100,e.css(d||(d=n.__makeTemplateObject(["\n        ",""],["\n        ",""])),p),f,(function(n){return n.size/8}),(function(n){return n.size/8}),o.theme.gray0,o.theme.blue600,o.theme.green600,o.theme.red600,o.theme.orange600);exports.Spinner=function(n){var e=n.className,o=n.color,t=n.size;return r.jsx(m,{className:[e,o||""].join(" "),color:o,size:t||32})};
+"use strict";var n=require("../../_tslib-ccfac372.js"),e=require("react/jsx-runtime"),r=require("styled-components"),t=require("../../styles/constants/theme.js");function s(n){return n&&n.__esModule?n:{default:n}}var i,a,o=s(r),c=o.default.div(i||(i=n.__makeTemplateObject(["\n  position: relative;\n  overflow: hidden;\n  width: ","px;\n  height: ","px;\n"],["\n  position: relative;\n  overflow: hidden;\n  width: ","px;\n  height: ","px;\n"])),(function(n){return n.size}),(function(n){return n.size})),k=o.default.svg(a||(a=n.__makeTemplateObject(["\n  position: absolute;\n  width: ","px;\n  height: ","px;\n\n  stroke: ",";\n\n  circle.track {\n    stroke: ",";\n  }\n\n  &.black {\n    stroke: ",";\n\n    circle.track {\n      stroke: rgba(0, 0, 0, 0.3);\n    }\n  }\n  &.white {\n    stroke: ",";\n\n    circle.track {\n      stroke: rgba(255, 255, 255, 0.3);\n    }\n  }\n  &.info {\n    stroke: ",";\n  }\n  &.success {\n    stroke: ",";\n  }\n  &.danger {\n    stroke: ",";\n  }\n  &.warning {\n    stroke: ",";\n  }\n\n  @keyframes rotate {\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n\n  @keyframes dash {\n    0% {\n      stroke-dasharray: 1, 150;\n      stroke-dashoffset: 0;\n    }\n    50% {\n      stroke-dasharray: 90, 150;\n      stroke-dashoffset: -35;\n    }\n    100% {\n      stroke-dasharray: 90, 150;\n      stroke-dashoffset: -124;\n    }\n  }\n\n  animation: rotate 2s linear infinite;\n\n  circle:not(.track) {\n    stroke-linecap: round;\n    animation: dash 1.5s ease-in-out infinite;\n  }\n"],["\n  position: absolute;\n  width: ","px;\n  height: ","px;\n\n  stroke: ",";\n\n  circle.track {\n    stroke: ",";\n  }\n\n  &.black {\n    stroke: ",";\n\n    circle.track {\n      stroke: rgba(0, 0, 0, 0.3);\n    }\n  }\n  &.white {\n    stroke: ",";\n\n    circle.track {\n      stroke: rgba(255, 255, 255, 0.3);\n    }\n  }\n  &.info {\n    stroke: ",";\n  }\n  &.success {\n    stroke: ",";\n  }\n  &.danger {\n    stroke: ",";\n  }\n  &.warning {\n    stroke: ",";\n  }\n\n  @keyframes rotate {\n    100% {\n      transform: rotate(360deg);\n    }\n  }\n\n  @keyframes dash {\n    0% {\n      stroke-dasharray: 1, 150;\n      stroke-dashoffset: 0;\n    }\n    50% {\n      stroke-dasharray: 90, 150;\n      stroke-dashoffset: -35;\n    }\n    100% {\n      stroke-dasharray: 90, 150;\n      stroke-dashoffset: -124;\n    }\n  }\n\n  animation: rotate 2s linear infinite;\n\n  circle:not(.track) {\n    stroke-linecap: round;\n    animation: dash 1.5s ease-in-out infinite;\n  }\n"])),(function(n){return n.size}),(function(n){return n.size}),t.theme.blue600,t.theme.gray200,t.theme.gray1200,t.theme.gray0,t.theme.blue600,t.theme.green600,t.theme.red600,t.theme.orange600);exports.Spinner=function(n){var r=n.className,t=n.color,s=void 0===t?"primary":t,i=n.size,a=void 0===i?32:i;return e.jsx(c,{size:a,children:e.jsxs(k,{className:[r,s,"amino-spinner"].join(" "),size:a,viewBox:"0 0 50 50",children:[e.jsx("circle",{className:"track",cx:"25",cy:"25",fill:"none",id:"loading-spinner-circle",r:"20",strokeWidth:"5"}),e.jsx("circle",{cx:"25",cy:"25",fill:"none",id:"loading-spinner-circle",r:"20",strokeWidth:"5"})]})})};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zonos/amino",
-  "version": "5.0.8",
+  "version": "5.0.10",
   "description": "Core UI components for Amino",
   "repository": "git@github.com:Zonos/amino.git",
   "license": "MIT",