@spectrum-web-components/button
Advanced tools
@spectrum-web-components/button - npm Package Compare versions
Comparing version 0.37.0 to 0.38.0
| { | ||
| "name": "@spectrum-web-components/button", | ||
| "version": "0.37.0", | ||
| "version": "0.38.0", | ||
| "publishConfig": { | ||
@@ -85,8 +85,8 @@ "access": "public" | ||
| "dependencies": { | ||
| "@spectrum-web-components/base": "^0.37.0", | ||
| "@spectrum-web-components/clear-button": "^0.37.0", | ||
| "@spectrum-web-components/close-button": "^0.37.0", | ||
| "@spectrum-web-components/icon": "^0.37.0", | ||
| "@spectrum-web-components/icons-ui": "^0.37.0", | ||
| "@spectrum-web-components/shared": "^0.37.0" | ||
| "@spectrum-web-components/base": "^0.38.0", | ||
| "@spectrum-web-components/clear-button": "^0.38.0", | ||
| "@spectrum-web-components/close-button": "^0.38.0", | ||
| "@spectrum-web-components/icon": "^0.38.0", | ||
| "@spectrum-web-components/icons-ui": "^0.38.0", | ||
| "@spectrum-web-components/shared": "^0.38.0" | ||
| }, | ||
@@ -102,3 +102,3 @@ "devDependencies": { | ||
| ], | ||
| "gitHead": "d771f62f0d8063070af43283bb0fd5e3400bad06" | ||
| "gitHead": "9a099b7543672f2fd4030833ab813b16c2cad62e" | ||
| } |
@@ -30,3 +30,3 @@ "use strict"; | ||
| --spectrum-button-bottom-to-text-small | ||
| )}:host([size=m]){--spectrum-button-min-width:calc(var(--spectrum-component-height-100)*var(--spectrum-button-minimum-width-multiplier));--spectrum-button-border-radius:var( | ||
| )}:host{--spectrum-button-min-width:calc(var(--spectrum-component-height-100)*var(--spectrum-button-minimum-width-multiplier));--spectrum-button-border-radius:var( | ||
| --spectrum-component-pill-edge-to-text-100 | ||
@@ -33,0 +33,0 @@ );--spectrum-button-height:var(--spectrum-component-height-100);--spectrum-button-font-size:var(--spectrum-font-size-100);--spectrum-button-edge-to-visual:calc(var(--spectrum-component-pill-edge-to-visual-100) - var(--spectrum-button-border-width));--spectrum-button-edge-to-visual-only:var( |
@@ -28,3 +28,3 @@ "use strict";import{css as t}from"@spectrum-web-components/base";const o=t` | ||
| --spectrum-button-bottom-to-text-small | ||
| )}:host([size=m]){--spectrum-button-min-width:calc(var(--spectrum-component-height-100)*var(--spectrum-button-minimum-width-multiplier));--spectrum-button-border-radius:var( | ||
| )}:host{--spectrum-button-min-width:calc(var(--spectrum-component-height-100)*var(--spectrum-button-minimum-width-multiplier));--spectrum-button-border-radius:var( | ||
| --spectrum-component-pill-edge-to-text-100 | ||
@@ -31,0 +31,0 @@ );--spectrum-button-height:var(--spectrum-component-height-100);--spectrum-button-font-size:var(--spectrum-font-size-100);--spectrum-button-edge-to-visual:calc(var(--spectrum-component-pill-edge-to-visual-100) - var(--spectrum-button-border-width));--spectrum-button-edge-to-visual-only:var( |
@@ -28,3 +28,3 @@ "use strict"; | ||
| export const VALID_STATICS = ["white", "black"]; | ||
| export class Button extends SizedMixin(ButtonBase) { | ||
| export class Button extends SizedMixin(ButtonBase, { noDefaultSize: true }) { | ||
| constructor() { | ||
@@ -31,0 +31,0 @@ super(...arguments); |
@@ -1,2 +0,2 @@ | ||
| "use strict";var u=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var i=(s,a,t,r)=>{for(var e=r>1?void 0:r?l(a,t):a,o=s.length-1,c;o>=0;o--)(c=s[o])&&(e=(r?c(a,t,e):c(e))||e);return r&&e&&u(a,t,e),e};import{SizedMixin as p}from"@spectrum-web-components/base";import{property as n}from"@spectrum-web-components/base/src/decorators.js";import{ButtonBase as h}from"./ButtonBase.js";import d from"./button.css.js";export const VALID_VARIANTS=["accent","primary","secondary","negative","white","black"],VALID_STATICS=["white","black"];export class Button extends p(h){constructor(){super(...arguments);this._variant="accent";this.treatment="fill"}static get styles(){return[...super.styles,d]}get variant(){return this._variant}set variant(t){if(t!==this.variant){switch(this.requestUpdate("variant",this.variant),t){case"cta":this._variant="accent";break;case"overBackground":this.removeAttribute("variant"),this.static="white",this.treatment="outline";return;case"white":case"black":this.static=t,this.removeAttribute("variant");return;case null:return;default:VALID_VARIANTS.includes(t)?this._variant=t:this._variant="accent";break}this.setAttribute("variant",this.variant)}}set quiet(t){this.treatment=t?"outline":"fill"}firstUpdated(t){super.firstUpdated(t),this.hasAttribute("variant")||this.setAttribute("variant",this.variant)}}i([n()],Button.prototype,"variant",1),i([n({type:String,reflect:!0})],Button.prototype,"static",2),i([n({reflect:!0})],Button.prototype,"treatment",2),i([n({type:Boolean})],Button.prototype,"quiet",1); | ||
| "use strict";var u=Object.defineProperty;var l=Object.getOwnPropertyDescriptor;var i=(s,a,t,r)=>{for(var e=r>1?void 0:r?l(a,t):a,o=s.length-1,c;o>=0;o--)(c=s[o])&&(e=(r?c(a,t,e):c(e))||e);return r&&e&&u(a,t,e),e};import{SizedMixin as p}from"@spectrum-web-components/base";import{property as n}from"@spectrum-web-components/base/src/decorators.js";import{ButtonBase as h}from"./ButtonBase.js";import d from"./button.css.js";export const VALID_VARIANTS=["accent","primary","secondary","negative","white","black"],VALID_STATICS=["white","black"];export class Button extends p(h,{noDefaultSize:!0}){constructor(){super(...arguments);this._variant="accent";this.treatment="fill"}static get styles(){return[...super.styles,d]}get variant(){return this._variant}set variant(t){if(t!==this.variant){switch(this.requestUpdate("variant",this.variant),t){case"cta":this._variant="accent";break;case"overBackground":this.removeAttribute("variant"),this.static="white",this.treatment="outline";return;case"white":case"black":this.static=t,this.removeAttribute("variant");return;case null:return;default:VALID_VARIANTS.includes(t)?this._variant=t:this._variant="accent";break}this.setAttribute("variant",this.variant)}}set quiet(t){this.treatment=t?"outline":"fill"}firstUpdated(t){super.firstUpdated(t),this.hasAttribute("variant")||this.setAttribute("variant",this.variant)}}i([n()],Button.prototype,"variant",1),i([n({type:String,reflect:!0})],Button.prototype,"static",2),i([n({reflect:!0})],Button.prototype,"treatment",2),i([n({type:Boolean})],Button.prototype,"quiet",1); | ||
| //# sourceMappingURL=Button.js.map |
@@ -51,3 +51,5 @@ "use strict"; | ||
| }; | ||
| export class ClearButton extends SizedMixin(StyledButton) { | ||
| export class ClearButton extends SizedMixin(StyledButton, { | ||
| noDefaultSize: true | ||
| }) { | ||
| constructor() { | ||
@@ -54,0 +56,0 @@ super(...arguments); |
@@ -1,2 +0,2 @@ | ||
| "use strict";var l=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var p=(e,o,c,t)=>{for(var s=t>1?void 0:t?m(o,c):o,i=e.length-1,n;i>=0;i--)(n=e[i])&&(s=(t?n(o,c,s):n(s))||s);return t&&s&&l(o,c,s),s};import{html as r,SizedMixin as u}from"@spectrum-web-components/base";import{property as a}from"@spectrum-web-components/base/src/decorators.js";import{StyledButton as d}from"./StyledButton.js";import I from"@spectrum-web-components/clear-button/src/clear-button.css.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross75.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross100.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross200.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross300.js";import y from"@spectrum-web-components/icon/src/spectrum-icon-cross.css.js";const S={s:()=>r` | ||
| "use strict";var p=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var l=(e,o,c,t)=>{for(var s=t>1?void 0:t?m(o,c):o,i=e.length-1,n;i>=0;i--)(n=e[i])&&(s=(t?n(o,c,s):n(s))||s);return t&&s&&p(o,c,s),s};import{html as r,SizedMixin as u}from"@spectrum-web-components/base";import{property as a}from"@spectrum-web-components/base/src/decorators.js";import{StyledButton as d}from"./StyledButton.js";import I from"@spectrum-web-components/clear-button/src/clear-button.css.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross75.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross100.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross200.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross300.js";import S from"@spectrum-web-components/icon/src/spectrum-icon-cross.css.js";const f={s:()=>r` | ||
| <sp-icon-cross75 | ||
@@ -21,5 +21,5 @@ slot="icon" | ||
| ></sp-icon-cross300> | ||
| `};export class ClearButton extends u(d){constructor(){super(...arguments);this.variant=""}static get styles(){return[...super.styles,I,y]}get buttonContent(){return[S[this.size]()]}render(){return r` | ||
| `};export class ClearButton extends u(d,{noDefaultSize:!0}){constructor(){super(...arguments);this.variant=""}static get styles(){return[...super.styles,I,S]}get buttonContent(){return[f[this.size]()]}render(){return r` | ||
| <div class="fill">${super.render()}</div> | ||
| `}}p([a({reflect:!0})],ClearButton.prototype,"variant",2); | ||
| `}}l([a({reflect:!0})],ClearButton.prototype,"variant",2); | ||
| //# sourceMappingURL=ClearButton.js.map |
@@ -51,3 +51,5 @@ "use strict"; | ||
| }; | ||
| export class CloseButton extends SizedMixin(StyledButton) { | ||
| export class CloseButton extends SizedMixin(StyledButton, { | ||
| noDefaultSize: true | ||
| }) { | ||
| constructor() { | ||
@@ -54,0 +56,0 @@ super(...arguments); |
@@ -1,2 +0,2 @@ | ||
| "use strict";var m=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var p=(c,t,e,o)=>{for(var s=o>1?void 0:o?u(t,e):t,i=c.length-1,n;i>=0;i--)(n=c[i])&&(s=(o?n(t,e,s):n(s))||s);return o&&s&&m(t,e,s),s};import{html as r,SizedMixin as a}from"@spectrum-web-components/base";import{property as l}from"@spectrum-web-components/base/src/decorators.js";import{StyledButton as S}from"./StyledButton.js";import d from"@spectrum-web-components/close-button/src/close-button.css.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross75.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross100.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross200.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross300.js";import y from"@spectrum-web-components/icon/src/spectrum-icon-cross.css.js";const f={s:()=>r` | ||
| "use strict";var m=Object.defineProperty;var u=Object.getOwnPropertyDescriptor;var p=(c,t,e,o)=>{for(var s=o>1?void 0:o?u(t,e):t,i=c.length-1,n;i>=0;i--)(n=c[i])&&(s=(o?n(t,e,s):n(s))||s);return o&&s&&m(t,e,s),s};import{html as r,SizedMixin as a}from"@spectrum-web-components/base";import{property as l}from"@spectrum-web-components/base/src/decorators.js";import{StyledButton as S}from"./StyledButton.js";import d from"@spectrum-web-components/close-button/src/close-button.css.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross75.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross100.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross200.js";import"@spectrum-web-components/icons-ui/icons/sp-icon-cross300.js";import f from"@spectrum-web-components/icon/src/spectrum-icon-cross.css.js";const y={s:()=>r` | ||
| <sp-icon-cross75 | ||
@@ -21,3 +21,3 @@ slot="icon" | ||
| ></sp-icon-cross300> | ||
| `};export class CloseButton extends a(S){constructor(){super(...arguments);this.variant=""}static get styles(){return[...super.styles,d,y]}get buttonContent(){return[f[this.size]()]}}p([l({reflect:!0})],CloseButton.prototype,"variant",2),p([l({type:String,reflect:!0})],CloseButton.prototype,"static",2); | ||
| `};export class CloseButton extends a(S,{noDefaultSize:!0}){constructor(){super(...arguments);this.variant=""}static get styles(){return[...super.styles,d,f]}get buttonContent(){return[y[this.size]()]}}p([l({reflect:!0})],CloseButton.prototype,"variant",2),p([l({type:String,reflect:!0})],CloseButton.prototype,"static",2); | ||
| //# sourceMappingURL=CloseButton.js.map |
@@ -30,3 +30,3 @@ "use strict"; | ||
| --spectrum-button-bottom-to-text-small | ||
| )}:host([size=m]){--spectrum-button-min-width:calc(var(--spectrum-component-height-100)*var(--spectrum-button-minimum-width-multiplier));--spectrum-button-border-radius:var( | ||
| )}:host{--spectrum-button-min-width:calc(var(--spectrum-component-height-100)*var(--spectrum-button-minimum-width-multiplier));--spectrum-button-border-radius:var( | ||
| --spectrum-component-pill-edge-to-text-100 | ||
@@ -33,0 +33,0 @@ );--spectrum-button-height:var(--spectrum-component-height-100);--spectrum-button-font-size:var(--spectrum-font-size-100);--spectrum-button-edge-to-visual:calc(var(--spectrum-component-pill-edge-to-visual-100) - var(--spectrum-button-border-width));--spectrum-button-edge-to-visual-only:var( |
@@ -28,3 +28,3 @@ "use strict";import{css as t}from"@spectrum-web-components/base";const o=t` | ||
| --spectrum-button-bottom-to-text-small | ||
| )}:host([size=m]){--spectrum-button-min-width:calc(var(--spectrum-component-height-100)*var(--spectrum-button-minimum-width-multiplier));--spectrum-button-border-radius:var( | ||
| )}:host{--spectrum-button-min-width:calc(var(--spectrum-component-height-100)*var(--spectrum-button-minimum-width-multiplier));--spectrum-button-border-radius:var( | ||
| --spectrum-component-pill-edge-to-text-100 | ||
@@ -31,0 +31,0 @@ );--spectrum-button-height:var(--spectrum-component-height-100);--spectrum-button-font-size:var(--spectrum-font-size-100);--spectrum-button-edge-to-visual:calc(var(--spectrum-component-pill-edge-to-visual-100) - var(--spectrum-button-border-width));--spectrum-button-edge-to-visual-only:var( |
@@ -47,6 +47,7 @@ // @ts-check | ||
| converter.pseudoToAttribute('active', 'active'), | ||
| // Default to `size='m'` without needing the attribute | ||
| converter.classToHost('spectrum-Button--sizeM'), | ||
| ...converter.enumerateAttributes( | ||
| [ | ||
| ['spectrum-Button--sizeS', 's'], | ||
| ['spectrum-Button--sizeM', 'm'], | ||
| ['spectrum-Button--sizeL', 'l'], | ||
@@ -53,0 +54,0 @@ ['spectrum-Button--sizeXL', 'xl'], |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
New author
Supply chain riskA new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.06%
786229
- Lines of code
- increased by0.06%
7867
Worsened metrics
- Number of medium supply chain risk alerts
- increased byInfinity%
1
Dependency changes
+ Added@spectrum-web-components/base@0.38.0(transitive)
+ Added@spectrum-web-components/clear-button@0.38.0(transitive)
+ Added@spectrum-web-components/close-button@0.38.0(transitive)
+ Added@spectrum-web-components/icon@0.38.0(transitive)
+ Added@spectrum-web-components/icons-ui@0.38.0(transitive)
+ Added@spectrum-web-components/iconset@0.38.0(transitive)
+ Added@spectrum-web-components/shared@0.38.0(transitive)
- Removed@spectrum-web-components/base@0.37.0(transitive)
- Removed@spectrum-web-components/clear-button@0.37.0(transitive)
- Removed@spectrum-web-components/close-button@0.37.0(transitive)
- Removed@spectrum-web-components/icon@0.37.0(transitive)
- Removed@spectrum-web-components/icons-ui@0.37.0(transitive)
- Removed@spectrum-web-components/iconset@0.37.0(transitive)
- Removed@spectrum-web-components/shared@0.37.0(transitive)