@material/mwc-checkbox
Advanced tools
Comparing version 0.23.0-canary.104debd5.0 to 0.23.0-canary.17d51f76.0
@@ -21,7 +21,7 @@ /** | ||
/** @soyPrefixAttribute */ | ||
ariaLabel?: string; | ||
ariaLabel: string; | ||
/** @soyPrefixAttribute */ | ||
ariaLabelledBy?: string; | ||
ariaLabelledBy: string; | ||
/** @soyPrefixAttribute */ | ||
ariaDescribedBy?: string; | ||
ariaDescribedBy: string; | ||
/** | ||
@@ -36,3 +36,2 @@ * Touch target extends beyond visual boundary of a component by default. | ||
protected focused: boolean; | ||
protected useStateLayerCustomProperties: boolean; | ||
ripple: Promise<Ripple | null>; | ||
@@ -48,2 +47,4 @@ protected mdcFoundationClass: undefined; | ||
protected renderRipple(): TemplateResult | string; | ||
/** @soyTemplate */ | ||
protected renderRippleTemplate(): TemplateResult; | ||
/** | ||
@@ -50,0 +51,0 @@ * @soyTemplate |
@@ -34,3 +34,2 @@ /** | ||
this.focused = false; | ||
this.useStateLayerCustomProperties = false; | ||
// MDC Foundation is unused | ||
@@ -78,7 +77,9 @@ this.mdcFoundationClass = undefined; | ||
renderRipple() { | ||
return this.shouldRenderRipple ? html `<mwc-ripple | ||
return this.shouldRenderRipple ? this.renderRippleTemplate() : ''; | ||
} | ||
/** @soyTemplate */ | ||
renderRippleTemplate() { | ||
return html `<mwc-ripple | ||
.disabled="${this.disabled}" | ||
.internalUseStateLayerCustomProperties="${this.useStateLayerCustomProperties}" | ||
unbounded></mwc-ripple>` : | ||
''; | ||
unbounded></mwc-ripple>`; | ||
} | ||
@@ -244,5 +245,2 @@ /** | ||
__decorate([ | ||
state() | ||
], CheckboxBase.prototype, "useStateLayerCustomProperties", void 0); | ||
__decorate([ | ||
queryAsync('mwc-ripple') | ||
@@ -249,0 +247,0 @@ ], CheckboxBase.prototype, "ripple", void 0); |
{ | ||
"name": "@material/mwc-checkbox", | ||
"version": "0.23.0-canary.104debd5.0", | ||
"version": "0.23.0-canary.17d51f76.0", | ||
"description": "Material Design checkbox web component", | ||
@@ -19,4 +19,4 @@ "keywords": [ | ||
"dependencies": { | ||
"@material/mwc-base": "0.23.0-canary.104debd5.0", | ||
"@material/mwc-ripple": "0.23.0-canary.104debd5.0", | ||
"@material/mwc-base": "0.23.0-canary.17d51f76.0", | ||
"@material/mwc-ripple": "0.23.0-canary.17d51f76.0", | ||
"lit-element": "^2.5.1", | ||
@@ -30,5 +30,5 @@ "lit-html": "^1.4.1", | ||
"devDependencies": { | ||
"@material/checkbox": "=12.0.0-canary.38d1846cc.0", | ||
"@material/theme": "=12.0.0-canary.38d1846cc.0", | ||
"@material/touch-target": "=12.0.0-canary.38d1846cc.0" | ||
"@material/checkbox": "=13.0.0-canary.72464476c.0", | ||
"@material/theme": "=13.0.0-canary.72464476c.0", | ||
"@material/touch-target": "=13.0.0-canary.72464476c.0" | ||
}, | ||
@@ -38,3 +38,3 @@ "publishConfig": { | ||
}, | ||
"gitHead": "9dde76584b6e4258f93d65b54a1f9695d2dddb1a" | ||
"gitHead": "eac5c1fc9472a1c28736c4d8e0d423e195fe5723" | ||
} |
@@ -10,3 +10,3 @@ # `<mwc-checkbox>` [![Published on npm](https://img.shields.io/npm/v/@material/mwc-checkbox.svg)](https://www.npmjs.com/package/@material/mwc-checkbox) | ||
[Demo](https://material-components.github.io/material-components-web-components/demos/checkbox/) | ||
[Demo](https://material-components.github.io/material-web/demos/checkbox/) | ||
@@ -31,3 +31,3 @@ ## Installation | ||
<img src="https://raw.githubusercontent.com/material-components/material-components-web-components/9dde76584b6e4258f93d65b54a1f9695d2dddb1a/packages/checkbox/images/checked.png" width="29px" height="29px"> | ||
<img src="https://raw.githubusercontent.com/material-components/material-components-web-components/eac5c1fc9472a1c28736c4d8e0d423e195fe5723/packages/checkbox/images/checked.png" width="29px" height="29px"> | ||
@@ -49,3 +49,3 @@ ```html | ||
<img src="https://raw.githubusercontent.com/material-components/material-components-web-components/9dde76584b6e4258f93d65b54a1f9695d2dddb1a/packages/checkbox/images/standard_disabled.png" height="80px"> | ||
<img src="https://raw.githubusercontent.com/material-components/material-components-web-components/eac5c1fc9472a1c28736c4d8e0d423e195fe5723/packages/checkbox/images/standard_disabled.png" height="80px"> | ||
@@ -68,3 +68,3 @@ ```html | ||
<img src="https://raw.githubusercontent.com/material-components/material-components-web-components/9dde76584b6e4258f93d65b54a1f9695d2dddb1a/packages/checkbox/images/styled_standard_disabled.png" height="80px"> | ||
<img src="https://raw.githubusercontent.com/material-components/material-components-web-components/eac5c1fc9472a1c28736c4d8e0d423e195fe5723/packages/checkbox/images/styled_standard_disabled.png" height="80px"> | ||
@@ -101,6 +101,6 @@ ```html | ||
Most applications should use | ||
[`<mwc-formfield>`](https://github.com/material-components/material-components-web-components/tree/master/packages/formfield) | ||
[`<mwc-formfield>`](https://github.com/material-components/material-web/tree/master/packages/formfield) | ||
to associate an interactive label with the checkbox. | ||
<img src="https://raw.githubusercontent.com/material-components/material-components-web-components/9dde76584b6e4258f93d65b54a1f9695d2dddb1a/packages/checkbox/images/formfield.png" width="132px" height="123px"> | ||
<img src="https://raw.githubusercontent.com/material-components/material-components-web-components/eac5c1fc9472a1c28736c4d8e0d423e195fe5723/packages/checkbox/images/formfield.png" width="132px" height="123px"> | ||
@@ -162,5 +162,5 @@ ```html | ||
-------------------------------- | ------------------------------------------------------------- | ----------- | ||
`--mdc-checkbox-ink-color` | ![](https://raw.githubusercontent.com/material-components/material-components-web-components/9dde76584b6e4258f93d65b54a1f9695d2dddb1a/packages/checkbox/images/color_fff.png) `#fff` | Color of mark inside a `checked` or `indeterminate` checkbox (enabled or disabled). | ||
`--mdc-checkbox-unchecked-color` | ![](https://raw.githubusercontent.com/material-components/material-components-web-components/9dde76584b6e4258f93d65b54a1f9695d2dddb1a/packages/checkbox/images/color_0,0,0,54.png) `rgba(0, 0, 0, 0.54)` | Color of the unchecked box. | ||
`--mdc-checkbox-disabled-color` | ![](https://raw.githubusercontent.com/material-components/material-components-web-components/9dde76584b6e4258f93d65b54a1f9695d2dddb1a/packages/checkbox/images/color_0,0,0,38.png) `rgba(0, 0, 0, 0.38)` | Color of the checkbox box and fill when disabled. | ||
`--mdc-checkbox-ink-color` | ![](https://raw.githubusercontent.com/material-components/material-components-web-components/eac5c1fc9472a1c28736c4d8e0d423e195fe5723/packages/checkbox/images/color_fff.png) `#fff` | Color of mark inside a `checked` or `indeterminate` checkbox (enabled or disabled). | ||
`--mdc-checkbox-unchecked-color` | ![](https://raw.githubusercontent.com/material-components/material-components-web-components/eac5c1fc9472a1c28736c4d8e0d423e195fe5723/packages/checkbox/images/color_0,0,0,54.png) `rgba(0, 0, 0, 0.54)` | Color of the unchecked box. | ||
`--mdc-checkbox-disabled-color` | ![](https://raw.githubusercontent.com/material-components/material-components-web-components/eac5c1fc9472a1c28736c4d8e0d423e195fe5723/packages/checkbox/images/color_0,0,0,38.png) `rgba(0, 0, 0, 0.38)` | Color of the checkbox box and fill when disabled. | ||
@@ -167,0 +167,0 @@ #### Global Custom Properties |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
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
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
83262
413
+ Added@material/mwc-base@0.23.0-canary.17d51f76.0(transitive)
+ Added@material/mwc-ripple@0.23.0-canary.17d51f76.0(transitive)
- Removed@material/mwc-base@0.23.0-canary.104debd5.0(transitive)
- Removed@material/mwc-ripple@0.23.0-canary.104debd5.0(transitive)