@transferwise/components 43.11.31 → 43.11.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/build/main.css +1 -1
  2. package/build/styles/circularButton/CircularButton.css +1 -1
  3. package/build/styles/header/Header.css +1 -1
  4. package/build/styles/main.css +1 -1
  5. package/package.json +2 -2
package/build/styles/circularButton/CircularButton.css CHANGED
@@ -1 +1 @@
1
- .np-circular-btn{align-items:center;cursor:pointer;display:inline-flex;flex-direction:column;position:relative;text-align:center}.np-circular-btn input[type=button]{border-radius:50%;height:40px;height:var(--size-40);margin-bottom:8px;margin-bottom:var(--size-8);min-height:40px;min-height:var(--size-40);padding:0;width:40px;width:var(--size-40)}.np-theme-personal .np-circular-btn input[type=button]{height:56px;height:var(--size-56);min-height:56px;min-height:var(--size-56);width:56px;width:var(--size-56)}.np-circular-btn .tw-icon{color:#fff;left:0;pointer-events:none;position:absolute;top:8px;transition:color .15s ease-in-out;width:100%}[dir=rtl] .np-circular-btn .tw-icon{left:auto;right:0}.np-theme-personal .np-circular-btn .tw-icon{top:16px;top:var(--size-16)}.np-circular-btn .tw-icon>svg{margin:0 auto}.np-theme-personal .np-circular-btn .tw-icon,.np-theme-personal .np-circular-btn .tw-icon:active,.np-theme-personal .np-circular-btn .tw-icon:hover{color:var(--color-interactive-control)}.np-theme-personal .np-circular-btn.negative .tw-icon,.np-theme-personal .np-circular-btn.negative.secondary:not(.disabled,:disabled):active .tw-icon,.np-theme-personal .np-circular-btn.negative.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-contrast)!important}.np-theme-personal .np-circular-btn.negative.secondary:not(.disabled,:disabled) .tw-icon{color:var(--color-sentiment-negative)!important}.np-circular-btn__label{font-size:.875rem;font-size:var(--font-size-14);font-weight:600;font-weight:var(--font-weight-semi-bold);transition:color .15s ease-in-out}.np-circular-btn.accent .np-circular-btn__label{color:#00a2dd;color:var(--color-interactive-accent)}.np-circular-btn.accent input[type=button]:focus~.np-circular-btn__label,.np-circular-btn.accent:not(.disabled,:disabled):hover .np-circular-btn__label{color:#008fc9;color:var(--color-interactive-accent-hover)}.np-circular-btn.accent input[type=button]:active~.np-circular-btn__label,.np-circular-btn.accent:active .np-circular-btn__label{color:#0081ba;color:var(--color-interactive-accent-active)}.np-circular-btn.accent.secondary .tw-icon{color:#00a2dd;color:var(--color-interactive-accent)}.np-circular-btn.accent.secondary input[type=button]:focus+.tw-icon,.np-circular-btn.accent.secondary:not(.disabled,:disabled):hover .tw-icon{color:#fff}.np-theme-personal .np-circular-btn.accent.secondary input[type=button]:focus+.tw-icon,.np-theme-personal .np-circular-btn.accent.secondary:active input[type=button]+.tw-icon,.np-theme-personal .np-circular-btn.accent.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-interactive-control)}.np-circular-btn.positive .np-circular-btn__label{color:#2ead4b;color:var(--color-interactive-positive)}.np-circular-btn.positive input[type=button]:focus~.np-circular-btn__label,.np-circular-btn.positive:not(.disabled,:disabled):hover .np-circular-btn__label{color:#069939;color:var(--color-interactive-positive-hover)}.np-circular-btn.positive input[type=button]:active~.np-circular-btn__label,.np-circular-btn.positive:active .np-circular-btn__label{color:#008b2b;color:var(--color-interactive-positive-active)}.np-circular-btn.positive.secondary .tw-icon{color:#2ead4b;color:var(--color-interactive-positive)}.np-circular-btn.positive.secondary input[type=button]:focus+.tw-icon,.np-circular-btn.positive.secondary:not(.disabled,:disabled):hover .tw-icon{color:#fff}.np-theme-personal .np-circular-btn.positive.secondary input[type=button]:focus+.tw-icon,.np-theme-personal .np-circular-btn.positive.secondary:active input[type=button]+.tw-icon,.np-theme-personal .np-circular-btn.positive.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-interactive-control)}.np-circular-btn.negative .np-circular-btn__label{color:#e74848;color:var(--color-interactive-negative)}.np-circular-btn.negative input[type=button]:focus~.np-circular-btn__label,.np-circular-btn.negative:not(.disabled,:disabled):hover .np-circular-btn__label{color:#d03238;color:var(--color-interactive-negative-hover)}.np-circular-btn.negative input[type=button]:active~.np-circular-btn__label,.np-circular-btn.negative:active .np-circular-btn__label{color:#bf1e2c;color:var(--color-interactive-negative-active)}.np-circular-btn.negative.secondary .tw-icon{color:#e74848;color:var(--color-interactive-negative)}.np-circular-btn.negative.secondary input[type=button]:focus+.tw-icon,.np-circular-btn.negative.secondary:not(.disabled,:disabled):hover .tw-icon{color:#fff}.np-theme-personal .np-circular-btn.negative.secondary input[type=button]:focus+.tw-icon,.np-theme-personal .np-circular-btn.negative.secondary:active input[type=button]+.tw-icon,.np-theme-personal .np-circular-btn.negative.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-interactive-control)}.np-theme-personal .np-circular-btn.accent .np-circular-btn__label{color:var(--color-interactive-primary)}.np-theme-personal .np-circular-btn.accent input[type=button]:focus~.np-circular-btn__label,.np-theme-personal .np-circular-btn.accent:not(.disabled,:disabled):hover .np-circular-btn__label{color:var(--color-interactive-primary-hover)}.np-theme-personal .np-circular-btn.accent input[type=button]:active~.np-circular-btn__label,.np-theme-personal .np-circular-btn.accent:active .np-circular-btn__label{color:var(--color-interactive-primary-active)}.np-theme-personal .np-circular-btn.accent.secondary .tw-icon{color:var(--color-interactive-primary)}.np-theme-personal .np-circular-btn.accent.secondary input[type=button]:focus+.tw-icon,.np-theme-personal .np-circular-btn.accent.secondary:not(.disabled,:disabled):hover .tw-icon{color:#fff}.np-theme-personal .np-theme-personal .np-circular-btn.accent.secondary input[type=button]:focus+.tw-icon,.np-theme-personal .np-theme-personal .np-circular-btn.accent.secondary:active input[type=button]+.tw-icon,.np-theme-personal .np-theme-personal .np-circular-btn.accent.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-interactive-control)}.np-theme-personal .np-circular-btn.positive .np-circular-btn__label{color:var(--color-interactive-primary)}.np-theme-personal .np-circular-btn.positive input[type=button]:focus~.np-circular-btn__label,.np-theme-personal .np-circular-btn.positive:not(.disabled,:disabled):hover .np-circular-btn__label{color:var(--color-interactive-primary-hover)}.np-theme-personal .np-circular-btn.positive input[type=button]:active~.np-circular-btn__label,.np-theme-personal .np-circular-btn.positive:active .np-circular-btn__label{color:var(--color-interactive-primary-active)}.np-theme-personal .np-circular-btn.positive.secondary .tw-icon{color:var(--color-interactive-primary)}.np-theme-personal .np-circular-btn.positive.secondary input[type=button]:focus+.tw-icon,.np-theme-personal .np-circular-btn.positive.secondary:not(.disabled,:disabled):hover .tw-icon{color:#fff}.np-theme-personal .np-theme-personal .np-circular-btn.positive.secondary input[type=button]:focus+.tw-icon,.np-theme-personal .np-theme-personal .np-circular-btn.positive.secondary:active input[type=button]+.tw-icon,.np-theme-personal .np-theme-personal .np-circular-btn.positive.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-interactive-control)}.np-theme-personal .np-circular-btn.negative .np-circular-btn__label{color:var(--color-sentiment-negative)}.np-theme-personal .np-circular-btn.negative input[type=button]:focus~.np-circular-btn__label,.np-theme-personal .np-circular-btn.negative:not(.disabled,:disabled):hover .np-circular-btn__label{color:var(--color-sentiment-negative-hover)}.np-theme-personal .np-circular-btn.negative input[type=button]:active~.np-circular-btn__label,.np-theme-personal .np-circular-btn.negative:active .np-circular-btn__label{color:var(--color-sentiment-negative-active)}.np-theme-personal .np-circular-btn.negative.secondary .tw-icon{color:var(--color-sentiment-negative)}.np-theme-personal .np-circular-btn.negative.secondary input[type=button]:focus+.tw-icon,.np-theme-personal .np-circular-btn.negative.secondary:not(.disabled,:disabled):hover .tw-icon{color:#fff}.np-theme-personal .np-theme-personal .np-circular-btn.negative.secondary input[type=button]:focus+.tw-icon,.np-theme-personal .np-theme-personal .np-circular-btn.negative.secondary:active input[type=button]+.tw-icon,.np-theme-personal .np-theme-personal .np-circular-btn.negative.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-interactive-control)}
1
+ .np-circular-btn{align-items:center;cursor:pointer;display:inline-flex;flex-direction:column;position:relative;text-align:center}.np-circular-btn input[type=button]{border-radius:50%;height:40px;height:var(--size-40);margin-bottom:8px;margin-bottom:var(--size-8);min-height:40px;min-height:var(--size-40);padding:0;width:40px;width:var(--size-40)}.np-theme-personal .np-circular-btn input[type=button]{height:56px;height:var(--size-56);min-height:56px;min-height:var(--size-56);width:56px;width:var(--size-56)}.np-circular-btn .tw-icon{color:#fff;left:0;pointer-events:none;position:absolute;top:8px;transition:color .15s ease-in-out;width:100%}[dir=rtl] .np-circular-btn .tw-icon{left:auto;right:0}.np-theme-personal .np-circular-btn .tw-icon{top:16px;top:var(--size-16)}.np-circular-btn .tw-icon>svg{margin:0 auto}.np-theme-personal .np-circular-btn .tw-icon,.np-theme-personal .np-circular-btn .tw-icon:active,.np-theme-personal .np-circular-btn .tw-icon:hover{color:var(--color-interactive-control)}.np-theme-personal .np-circular-btn.negative .tw-icon,.np-theme-personal .np-circular-btn.negative.secondary:not(.disabled,:disabled):active .tw-icon,.np-theme-personal .np-circular-btn.negative.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-contrast)!important}.np-theme-personal .np-circular-btn.negative.secondary:not(.disabled,:disabled) .tw-icon{color:var(--color-sentiment-negative)!important}.np-circular-btn__label{font-size:.875rem;font-size:var(--font-size-14);font-weight:600;font-weight:var(--font-weight-semi-bold);transition:color .15s ease-in-out}.np-circular-btn.accent .np-circular-btn__label{color:#00a2dd;color:var(--color-interactive-accent)}.np-circular-btn.accent:not(.disabled,:disabled):hover .np-circular-btn__label{color:#008fc9;color:var(--color-interactive-accent-hover)}.np-circular-btn.accent input[type=button]:active~.np-circular-btn__label,.np-circular-btn.accent:active .np-circular-btn__label{color:#0081ba;color:var(--color-interactive-accent-active)}.np-circular-btn.accent.secondary .tw-icon{color:#00a2dd;color:var(--color-interactive-accent)}.np-circular-btn.accent.secondary input[type=button]:active+.tw-icon,.np-circular-btn.accent.secondary:not(.disabled,:disabled):hover .tw-icon{color:#fff}.np-theme-personal .np-circular-btn.accent.secondary input[type=button]:active+.tw-icon,.np-theme-personal .np-circular-btn.accent.secondary:active input[type=button]+.tw-icon,.np-theme-personal .np-circular-btn.accent.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-interactive-control)}.np-circular-btn.positive .np-circular-btn__label{color:#2ead4b;color:var(--color-interactive-positive)}.np-circular-btn.positive:not(.disabled,:disabled):hover .np-circular-btn__label{color:#069939;color:var(--color-interactive-positive-hover)}.np-circular-btn.positive input[type=button]:active~.np-circular-btn__label,.np-circular-btn.positive:active .np-circular-btn__label{color:#008b2b;color:var(--color-interactive-positive-active)}.np-circular-btn.positive.secondary .tw-icon{color:#2ead4b;color:var(--color-interactive-positive)}.np-circular-btn.positive.secondary input[type=button]:active+.tw-icon,.np-circular-btn.positive.secondary:not(.disabled,:disabled):hover .tw-icon{color:#fff}.np-theme-personal .np-circular-btn.positive.secondary input[type=button]:active+.tw-icon,.np-theme-personal .np-circular-btn.positive.secondary:active input[type=button]+.tw-icon,.np-theme-personal .np-circular-btn.positive.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-interactive-control)}.np-circular-btn.negative .np-circular-btn__label{color:#e74848;color:var(--color-interactive-negative)}.np-circular-btn.negative:not(.disabled,:disabled):hover .np-circular-btn__label{color:#d03238;color:var(--color-interactive-negative-hover)}.np-circular-btn.negative input[type=button]:active~.np-circular-btn__label,.np-circular-btn.negative:active .np-circular-btn__label{color:#bf1e2c;color:var(--color-interactive-negative-active)}.np-circular-btn.negative.secondary .tw-icon{color:#e74848;color:var(--color-interactive-negative)}.np-circular-btn.negative.secondary input[type=button]:active+.tw-icon,.np-circular-btn.negative.secondary:not(.disabled,:disabled):hover .tw-icon{color:#fff}.np-theme-personal .np-circular-btn.negative.secondary input[type=button]:active+.tw-icon,.np-theme-personal .np-circular-btn.negative.secondary:active input[type=button]+.tw-icon,.np-theme-personal .np-circular-btn.negative.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-interactive-control)}.np-theme-personal .np-circular-btn.accent .np-circular-btn__label{color:var(--color-interactive-primary)}.np-theme-personal .np-circular-btn.accent:not(.disabled,:disabled):hover .np-circular-btn__label{color:var(--color-interactive-primary-hover)}.np-theme-personal .np-circular-btn.accent input[type=button]:active~.np-circular-btn__label,.np-theme-personal .np-circular-btn.accent:active .np-circular-btn__label{color:var(--color-interactive-primary-active)}.np-theme-personal .np-circular-btn.accent.secondary .tw-icon{color:var(--color-interactive-primary)}.np-theme-personal .np-circular-btn.accent.secondary input[type=button]:active+.tw-icon,.np-theme-personal .np-circular-btn.accent.secondary:not(.disabled,:disabled):hover .tw-icon{color:#fff}.np-theme-personal .np-theme-personal .np-circular-btn.accent.secondary input[type=button]:active+.tw-icon,.np-theme-personal .np-theme-personal .np-circular-btn.accent.secondary:active input[type=button]+.tw-icon,.np-theme-personal .np-theme-personal .np-circular-btn.accent.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-interactive-control)}.np-theme-personal .np-circular-btn.positive .np-circular-btn__label{color:var(--color-interactive-primary)}.np-theme-personal .np-circular-btn.positive:not(.disabled,:disabled):hover .np-circular-btn__label{color:var(--color-interactive-primary-hover)}.np-theme-personal .np-circular-btn.positive input[type=button]:active~.np-circular-btn__label,.np-theme-personal .np-circular-btn.positive:active .np-circular-btn__label{color:var(--color-interactive-primary-active)}.np-theme-personal .np-circular-btn.positive.secondary .tw-icon{color:var(--color-interactive-primary)}.np-theme-personal .np-circular-btn.positive.secondary input[type=button]:active+.tw-icon,.np-theme-personal .np-circular-btn.positive.secondary:not(.disabled,:disabled):hover .tw-icon{color:#fff}.np-theme-personal .np-theme-personal .np-circular-btn.positive.secondary input[type=button]:active+.tw-icon,.np-theme-personal .np-theme-personal .np-circular-btn.positive.secondary:active input[type=button]+.tw-icon,.np-theme-personal .np-theme-personal .np-circular-btn.positive.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-interactive-control)}.np-theme-personal .np-circular-btn.negative .np-circular-btn__label{color:var(--color-sentiment-negative)}.np-theme-personal .np-circular-btn.negative:not(.disabled,:disabled):hover .np-circular-btn__label{color:var(--color-sentiment-negative-hover)}.np-theme-personal .np-circular-btn.negative input[type=button]:active~.np-circular-btn__label,.np-theme-personal .np-circular-btn.negative:active .np-circular-btn__label{color:var(--color-sentiment-negative-active)}.np-theme-personal .np-circular-btn.negative.secondary .tw-icon{color:var(--color-sentiment-negative)}.np-theme-personal .np-circular-btn.negative.secondary input[type=button]:active+.tw-icon,.np-theme-personal .np-circular-btn.negative.secondary:not(.disabled,:disabled):hover .tw-icon{color:#fff}.np-theme-personal .np-theme-personal .np-circular-btn.negative.secondary input[type=button]:active+.tw-icon,.np-theme-personal .np-theme-personal .np-circular-btn.negative.secondary:active input[type=button]+.tw-icon,.np-theme-personal .np-theme-personal .np-circular-btn.negative.secondary:not(.disabled,:disabled):hover .tw-icon{color:var(--color-interactive-control)}
package/build/styles/header/Header.css CHANGED
@@ -1 +1 @@
1
- .np-header{align-items:flex-end;border-bottom:1px solid #0000001a;border-bottom:1px solid var(--color-border-neutral);display:flex;justify-content:space-between;margin-bottom:8px;margin-bottom:var(--size-8);max-width:100%;padding:8px 0;padding:var(--size-8) 0}.np-header__title{color:#5d7079;color:var(--color-content-secondary)}.np-theme-personal .np-header__button{margin-bottom:-4px;margin-bottom:calc(var(--size-4)*-1);padding-inline:0}
1
+ .np-header{align-items:flex-end;border-bottom:1px solid #0000001a;border-bottom:1px solid var(--color-border-neutral);display:flex;justify-content:space-between;margin-bottom:8px;margin-bottom:var(--size-8);max-width:100%;padding:8px 0;padding:var(--size-8) 0}.np-header__title{color:#5d7079;color:var(--color-content-secondary)}.np-theme-personal .np-header{column-gap:24px;column-gap:var(--size-24)}.np-theme-personal .np-header__button{margin-inline:-16px;margin-inline:calc(var(--size-16)*-1);margin-bottom:-4px;margin-bottom:calc(var(--size-4)*-1)}