@transferwise/components 0.0.0-experimental-335b83d → 0.0.0-experimental-6cef414
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.
- package/build/main.css +1 -1
- package/build/styles/common/closeButton/CloseButton.css +1 -1
- package/build/styles/inputs/Input.css +1 -1
- package/build/styles/inputs/InputGroup.css +1 -1
- package/build/styles/main.css +1 -1
- package/build/styles/promoCard/PromoCard.css +1 -1
- package/package.json +2 -2
- package/src/common/closeButton/CloseButton.css +1 -1
- package/src/inputs/Input.css +1 -1
- package/src/inputs/Input.less +1 -1
- package/src/inputs/InputGroup.css +1 -1
- package/src/inputs/InputGroup.less +1 -1
- package/src/main.css +1 -1
- package/src/promoCard/PromoCard.css +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
.np-Card{--Card-image-scale:1;--Card-image-translate:0;--Card-indicator-text-background-color:var(--color-background-neutral);--Card-indicator-icon-background-color:var(--color-interactive-accent);--Card-indicator-icon-color:var(--color-interactive-control);--Card-check-background-color:var(--color-interactive-primary);--Card-check-color:var(--color-interactive-control)}.np-Card--promoCard{--Card-max-width:358px}.np-Card--promoCard.is-disabled{filter:grayscale(1);opacity:.45}.np-Card-image{height:auto;left:-24px;left:calc(var(--size-24)*-1);margin:0 auto;position:relative;transform:scale(var(--Card-image-scale)) translateY(var(--Card-image-translate));transition:transform .5s ease-in-out;width:100%;width:calc(100% + 48px);width:calc(100% + var(--size-48))}[dir=rtl] .np-Card-image{left:auto;right:-24px;right:calc(var(--size-24)*-1)}.np-Card-indicator{bottom:8px;bottom:var(--size-8);display:flex;gap:4px;gap:var(--size-4);position:absolute;right:8px;right:var(--size-8)}[dir=rtl] .np-Card-indicator{left:8px;left:var(--size-8);right:auto}.np-Card-indicatorText{background:var(--Card-indicator-text-background-color);border-radius:100px;display:inline-block;padding:16px;padding:var(--size-16);text-align:left;vertical-align:middle}.np-Card-indicatorIcon{align-items:center;background:var(--Card-indicator-icon-background-color);border-radius:
|
|
1
|
+
.np-Card{--Card-image-scale:1;--Card-image-translate:0;--Card-indicator-text-background-color:var(--color-background-neutral);--Card-indicator-icon-background-color:var(--color-interactive-accent);--Card-indicator-icon-color:var(--color-interactive-control);--Card-check-background-color:var(--color-interactive-primary);--Card-check-color:var(--color-interactive-control)}.np-Card--promoCard{--Card-max-width:358px}.np-Card--promoCard.is-disabled{filter:grayscale(1);opacity:.45}.np-Card-image{height:auto;left:-24px;left:calc(var(--size-24)*-1);margin:0 auto;position:relative;transform:scale(var(--Card-image-scale)) translateY(var(--Card-image-translate));transition:transform .5s ease-in-out;width:100%;width:calc(100% + 48px);width:calc(100% + var(--size-48))}[dir=rtl] .np-Card-image{left:auto;right:-24px;right:calc(var(--size-24)*-1)}.np-Card-indicator{bottom:8px;bottom:var(--size-8);display:flex;gap:4px;gap:var(--size-4);position:absolute;right:8px;right:var(--size-8)}[dir=rtl] .np-Card-indicator{left:8px;left:var(--size-8);right:auto}.np-Card-indicatorText{background:var(--Card-indicator-text-background-color);border-radius:100px;display:inline-block;padding:16px;padding:var(--size-16);text-align:left;vertical-align:middle}.np-Card-indicatorIcon{align-items:center;background:var(--Card-indicator-icon-background-color);border-radius:9999px;border-radius:var(--radius-full);color:var(--Card-indicator-icon-color);display:inline-block;display:flex;height:56px;height:var(--size-56);justify-content:center;width:56px;width:var(--size-56)}[dir=rtl] .np-Card-indicatorIcon{transform:scaleX(-1)}.np-Card--checked,.np-Card--link{box-shadow:none;color:currentColor;cursor:pointer;transform:scale(1);transition:box-shadow .2s ease-in-out,transform .5s ease-in-out}.np-theme-personal:not(.np-theme-personal--dark,.np-theme-personal--bright-green,.np-theme-personal--forest-green) .np-Card--checked,.np-theme-personal:not(.np-theme-personal--dark,.np-theme-personal--bright-green,.np-theme-personal--forest-green) .np-Card--link{--Card-box-shadow:0px 20px var(--size-40) 0px var(--color-background-neutral);--Card-check-color:var(--color-interactive-accent)}.np-Card--checked.is-disabled,.np-Card--link.is-disabled{cursor:not-allowed}@media (prefers-reduced-motion:reduce){.np-Card--checked,.np-Card--link{transition:none}}.np-Card--checked:hover:not(.is-disabled,:disabled,.is-checked,:focus-within),.np-Card--link:hover:not(.is-disabled,:disabled,.is-checked,:focus-within){--Card-image-scale:1.1;box-shadow:var(--Card-box-shadow)}.np-Card--checked:active:not(.is-disabled,:disabled,.is-checked),.np-Card--link:active:not(.is-disabled,:disabled,.is-checked){--Card-background-color:var(--color-background-neutral-active);--Card-image-scale:1.1;--Card-image-translate:var(--size-8);box-shadow:var(--Card-box-shadow);transform:scale(98%)}.np-theme-personal--bright-green .np-Card--checked:active:not(.is-disabled,:disabled,.is-checked),.np-theme-personal--bright-green .np-Card--link:active:not(.is-disabled,:disabled,.is-checked){--Card-background-color:var(--color-background-neutral)}.np-Card--checked:focus-visible:not(.is-disabled,:disabled),.np-Card--checked:has(:focus-visible):not(.np-Card--checked),.np-Card--link:focus-visible:not(.is-disabled,:disabled),.np-Card--link:has(:focus-visible):not(.np-Card--checked){--Card-image-scale:1.1;box-shadow:var(--Card-box-shadow);outline:var(--ring-outline-color) solid 4px;outline:var(--ring-outline-color) solid var(--size-4);outline-offset:4px;outline-offset:var(--size-4)}.np-Card--link .np-Card-titleLink{color:#37517e;color:var(--color-content-primary);text-decoration:none}.np-Card--link .np-Card-titleLink:focus-visible{outline:none}.np-Card--link .np-Card-titleLink:after{content:"";display:block;height:100%;left:0;position:absolute;top:0;width:100%;z-index:10}.np-Card--checked.is-checked{box-shadow:0 0 0 4px var(--color-interactive-primary);box-shadow:0 0 0 var(--size-4) var(--color-interactive-primary)}.np-Card--checked.is-checked .np-Card-check{align-items:center;background:var(--Card-check-background-color);border-radius:9999px;border-radius:var(--radius-full);color:var(--Card-check-color);display:flex;height:40px;height:var(--size-40);justify-content:center;position:absolute;right:8px;right:var(--size-8);top:8px;top:var(--size-8);width:40px;width:var(--size-40)}[dir=rtl] .np-Card--checked.is-checked .np-Card-check{left:8px;left:var(--size-8);right:auto}.np-Card--checked.is-checked:focus-visible:not(.is-disabled,:disabled){box-shadow:none}.np-CardGroup{display:flex;flex-direction:column;gap:24px;gap:var(--size-24);width:100%}@media (min-width:768px){.np-CardGroup{flex-direction:row}}.np-CardGroup .np-Card.np-Card--promoCard{max-width:100%}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@transferwise/components",
|
|
3
|
-
"version": "0.0.0-experimental-
|
|
3
|
+
"version": "0.0.0-experimental-6cef414",
|
|
4
4
|
"description": "Neptune React components",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"repository": {
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
"@testing-library/react-hooks": "^8.0.0",
|
|
54
54
|
"@testing-library/user-event": "^13.2.1",
|
|
55
55
|
"@transferwise/icons": "^3.7.0",
|
|
56
|
-
"@transferwise/neptune-tokens": "^8.5.
|
|
56
|
+
"@transferwise/neptune-tokens": "^8.5.1",
|
|
57
57
|
"@tsconfig/recommended": "^1.0.2",
|
|
58
58
|
"@types/babel__core": "^7.20.1",
|
|
59
59
|
"@types/jest": "^26.0.20",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.np-close-button{--ring-outline-offset:0;background:none;border:none;color:#00a2dd;color:var(--color-interactive-accent);height:16px;height:var(--size-16);padding:0;transition:color .15s ease-in-out}.np-close-button--large,.np-close-button--x-large{height:24px;height:var(--size-24)}.np-close-button:hover{color:#008fc9;color:var(--color-interactive-accent-hover)}.np-theme-personal .np-close-button{align-items:center;border-radius:
|
|
1
|
+
.np-close-button{--ring-outline-offset:0;background:none;border:none;color:#00a2dd;color:var(--color-interactive-accent);height:16px;height:var(--size-16);padding:0;transition:color .15s ease-in-out}.np-close-button--large,.np-close-button--x-large{height:24px;height:var(--size-24)}.np-close-button:hover{color:#008fc9;color:var(--color-interactive-accent-hover)}.np-theme-personal .np-close-button{align-items:center;border-radius:9999px;border-radius:var(--radius-full);color:var(--color-interactive-primary);display:inline-flex;height:32px;height:var(--size-32);justify-content:center;transition:background-color .1s ease;width:32px;width:var(--size-32)}.np-theme-personal .np-close-button--large{flex-shrink:0;height:40px;height:var(--size-40);width:40px;width:var(--size-40)}.np-theme-personal .np-close-button--x-large{flex-shrink:0;height:48px;height:var(--size-48);width:48px;width:var(--size-48)}.np-theme-personal .np-close-button:not(.disabled,:disabled):hover{background-color:var(--color-background-neutral-hover);color:var(--color-interactive-primary-hover)}.np-theme-personal .np-close-button:not(.disabled,:disabled):active{background-color:var(--color-background-neutral-active);color:var(--color-interactive-primary-active)}
|
package/src/inputs/Input.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.np-form-control{--ring-width:1px;--ring-color:var(--color-interactive-secondary);background-color:transparent;border:none;box-shadow:inset 0 0 0 var(--ring-width) var(--ring-color);color:#37517e;color:var(--color-content-primary);min-height:0;padding-left:16px;padding-left:var(--size-16);padding-right:16px;padding-right:var(--size-16);transition-duration:.3s;transition-property:color,opacity,box-shadow;transition-timing-function:ease-in-out}.np-form-control:focus-visible{outline:none}.np-form-control[aria-invalid=true]{--ring-width:2px;--ring-color:var(--color-sentiment-negative)!important}.np-form-control:hover:enabled{--ring-width:2px;--ring-color:var(--color-interactive-secondary-hover)}.np-form-control:focus:enabled{--ring-width:3px;--ring-color:var(--color-interactive-primary)}.np-form-control--size-auto{padding-bottom:12px;padding-bottom:var(--size-12);padding-top:12px;padding-top:var(--size-12)}.np-form-control--size-lg,.np-form-control--size-md,.np-form-control--size-sm{padding-bottom:0!important;padding-top:0!important}.np-form-control--size-sm{height:32px!important;height:var(--size-32)!important}.np-form-control--size-md{height:48px!important;height:var(--size-48)!important}.np-form-control--size-lg{height:72px!important;height:var(--size-72)!important}.np-input::-moz-placeholder{color:#768e9c;color:var(--color-content-tertiary)}.np-input::placeholder{color:#768e9c;color:var(--color-content-tertiary)}.np-input--shape-rectangle{border-radius:10px!important;border-radius:var(--radius-small)!important}.np-input--shape-pill{border-radius:9999px!important}
|
|
1
|
+
.np-form-control{--ring-width:1px;--ring-color:var(--color-interactive-secondary);background-color:transparent;border:none;box-shadow:inset 0 0 0 var(--ring-width) var(--ring-color);color:#37517e;color:var(--color-content-primary);min-height:0;padding-left:16px;padding-left:var(--size-16);padding-right:16px;padding-right:var(--size-16);transition-duration:.3s;transition-property:color,opacity,box-shadow;transition-timing-function:ease-in-out}.np-form-control:focus-visible{outline:none}.np-form-control[aria-invalid=true]{--ring-width:2px;--ring-color:var(--color-sentiment-negative)!important}.np-form-control:hover:enabled{--ring-width:2px;--ring-color:var(--color-interactive-secondary-hover)}.np-form-control:focus:enabled{--ring-width:3px;--ring-color:var(--color-interactive-primary)}.np-form-control--size-auto{padding-bottom:12px;padding-bottom:var(--size-12);padding-top:12px;padding-top:var(--size-12)}.np-form-control--size-lg,.np-form-control--size-md,.np-form-control--size-sm{padding-bottom:0!important;padding-top:0!important}.np-form-control--size-sm{height:32px!important;height:var(--size-32)!important}.np-form-control--size-md{height:48px!important;height:var(--size-48)!important}.np-form-control--size-lg{height:72px!important;height:var(--size-72)!important}.np-input::-moz-placeholder{color:#768e9c;color:var(--color-content-tertiary)}.np-input::placeholder{color:#768e9c;color:var(--color-content-tertiary)}.np-input--shape-rectangle{border-radius:10px!important;border-radius:var(--radius-small)!important}.np-input--shape-pill{border-radius:9999px!important;border-radius:var(--radius-full)!important}
|
package/src/inputs/Input.less
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.np-input-group{border-radius:9999px;display:inline-grid;grid-auto-columns:minmax(0,1fr)}.np-input-group>*{grid-column-start:1;grid-row-start:1}.np-input-addon{align-items:center;color:#c9cbce;color:var(--color-interactive-secondary);display:inline-flex;pointer-events:none;transition-duration:.15s;transition-property:color,opacity;transition-timing-function:ease-out;z-index:10}.np-input-group:disabled .np-input-addon:not(.np-input-addon--interactive){mix-blend-mode:luminosity;opacity:.45}.np-input-group:has(>:is(input,button,select):focus-visible) .np-input-addon{color:var(--color-interactive-primary)}.np-input-group:has(>:is(input,button,select):hover) .np-input-addon{color:#b5b7ba;color:var(--color-interactive-secondary-hover)}.np-input-addon--placement-start{justify-self:start}.np-input-addon--placement-end{justify-self:end}.np-input-addon--interactive>*{pointer-events:auto}.np-input-addon--padding-sm{padding-left:8px;padding-left:var(--size-8);padding-right:8px;padding-right:var(--size-8)}.np-input-addon--padding-md{padding-left:16px;padding-left:var(--size-16);padding-right:16px;padding-right:var(--size-16)}.np-input-addon--padding-md.np-input-addon--placement-start{padding-inline-end:8px;padding-inline-end:var(--size-8)}.np-input-addon--padding-md.np-input-addon--placement-end{padding-inline-start:8px;padding-inline-start:var(--size-8)}
|
|
1
|
+
.np-input-group{border-radius:9999px;border-radius:var(--radius-full);display:inline-grid;grid-auto-columns:minmax(0,1fr)}.np-input-group>*{grid-column-start:1;grid-row-start:1}.np-input-addon{align-items:center;color:#c9cbce;color:var(--color-interactive-secondary);display:inline-flex;pointer-events:none;transition-duration:.15s;transition-property:color,opacity;transition-timing-function:ease-out;z-index:10}.np-input-group:disabled .np-input-addon:not(.np-input-addon--interactive){mix-blend-mode:luminosity;opacity:.45}.np-input-group:has(>:is(input,button,select):focus-visible) .np-input-addon{color:var(--color-interactive-primary)}.np-input-group:has(>:is(input,button,select):hover) .np-input-addon{color:#b5b7ba;color:var(--color-interactive-secondary-hover)}.np-input-addon--placement-start{justify-self:start}.np-input-addon--placement-end{justify-self:end}.np-input-addon--interactive>*{pointer-events:auto}.np-input-addon--padding-sm{padding-left:8px;padding-left:var(--size-8);padding-right:8px;padding-right:var(--size-8)}.np-input-addon--padding-md{padding-left:16px;padding-left:var(--size-16);padding-right:16px;padding-right:var(--size-16)}.np-input-addon--padding-md.np-input-addon--placement-start{padding-inline-end:8px;padding-inline-end:var(--size-8)}.np-input-addon--padding-md.np-input-addon--placement-end{padding-inline-start:8px;padding-inline-start:var(--size-8)}
|