@material/icon-button - npm Package Compare versions

Comparing version 15.0.0-canary.c0a11ef0d.0 to 15.0.0-canary.c0d21ecc9.0

adapter.d.ts

		@@ -38,3 +38,3 @@ /**
		setAttr(attrName: string, attrValue: string): void;
		notifyChange(evtData: MDCIconButtonToggleEventDetail): void;
		notifyChange(eventData: MDCIconButtonToggleEventDetail): void;
		}

CHANGELOG.md

		@@ -6,3 +6,3 @@ # Change Log

		# [15.0.0-canary.c0a11ef0d.0](https://github.com/material-components/material-components-web/compare/v14.0.0...v15.0.0-canary.c0a11ef0d.0) (2022-05-18)
		# [15.0.0-canary.c0d21ecc9.0](https://github.com/material-components/material-components-web/compare/v14.0.0...v15.0.0-canary.c0d21ecc9.0) (2023-10-09)

		@@ -12,2 +12,13 @@

		* Use state-layer-size to correctly position the icon inside of an icon button ([0270229](https://github.com/material-components/material-components-web/commit/02702296e31ef8f9e3068017c73b4740eb56b9cf))
		* button: Attribute `hidden` now correctly hides the button. ([88db019](https://github.com/material-components/material-components-web/commit/88db019902ca09811794b202d66ce1f9f2e54aec))
		* button: Refactored HCM focus ring into a base style with display: none so mixins can be applied to both a visible non-HCM ring and the HCM ring without extra specificity to override ripple-theme.focus selectors ([6a61d62](https://github.com/material-components/material-components-web/commit/6a61d62f6b2b1f6b4bcf7477bdad46ba4139e5c8))
		* iconbutton: Apply icon-size theme-styles properly for font icons. ([77cf00e](https://github.com/material-components/material-components-web/commit/77cf00e3767e7ae73fd704e55830ceda8b71fdc9))
		* iconbutton: Extract focus ring display properties into static styles to prevent customization via density mixins from overriding focus ring display conditions ([3c7b844](https://github.com/material-components/material-components-web/commit/3c7b844c2a27c678d9be5e93f9845dd8efda5835))
		* iconbutton: support custom properties as values for an icon button ([68aaed9](https://github.com/material-components/material-components-web/commit/68aaed940081f45cc1730e684c70e132793b6633))


		### Features

		* button: Ripple styles do not update on hover for disabled buttons. ([bf86521](https://github.com/material-components/material-components-web/commit/bf86521f45b74c35f2f443dfb41a0c8361b5cf2c))
		* Update icon button theme `size` function to be able to accept values with rem units. ([0e3dc8e](https://github.com/material-components/material-components-web/commit/0e3dc8e3892e2cda93062eb64ff498dbc18203f3))

component.d.ts

		@@ -26,2 +26,3 @@ /**
		import { MDCIconButtonToggleFoundation } from './foundation';
		/** MDC Icon Button Toggle */
		export declare class MDCIconButtonToggle extends MDCComponent<MDCIconButtonToggleFoundation> {
		@@ -28,0 +29,0 @@ static attachTo(root: HTMLElement): MDCIconButtonToggle;

component.js

		@@ -28,2 +28,3 @@ /**
		var strings = MDCIconButtonToggleFoundation.strings;
		/** MDC Icon Button Toggle */
		var MDCIconButtonToggle = /** @class */ (function (_super) {
		@@ -53,14 +54,19 @@ __extends(MDCIconButtonToggle, _super);
		var _this = this;
		// DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
		// To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
		// DO NOT INLINE this variable. For backward compatibility, foundations take
		// a Partial<MDCFooAdapter>. To ensure we don't accidentally omit any
		// methods, we need a separate, strongly typed adapter variable.
		var adapter = {
		addClass: function (className) { return _this.root.classList.add(className); },
		addClass: function (className) {
		_this.root.classList.add(className);
		},
		hasClass: function (className) { return _this.root.classList.contains(className); },
		notifyChange: function (evtData) {
		_this.emit(strings.CHANGE_EVENT, evtData);
		notifyChange: function (eventData) {
		_this.emit(strings.CHANGE_EVENT, eventData);
		},
		removeClass: function (className) { return _this.root.classList.remove(className); },
		removeClass: function (className) {
		_this.root.classList.remove(className);
		},
		getAttr: function (attrName) { return _this.root.getAttribute(attrName); },
		setAttr: function (attrName, attrValue) {
		return _this.root.setAttribute(attrName, attrValue);
		_this.safeSetAttribute(_this.root, attrName, attrValue);
		},
		@@ -67,0 +73,0 @@ };

foundation.d.ts

		@@ -25,2 +25,3 @@ /**
		import { MDCIconButtonToggleAdapter } from './adapter';
		/** MDC Icon Button Toggle Foundation */
		export declare class MDCIconButtonToggleFoundation extends MDCFoundation<MDCIconButtonToggleAdapter> {
		@@ -27,0 +28,0 @@ /**

foundation.js

		@@ -26,2 +26,3 @@ /**
		import { cssClasses, strings } from './constants';
		/** MDC Icon Button Toggle Foundation */
		var MDCIconButtonToggleFoundation = /** @class */ (function (_super) {
		@@ -28,0 +29,0 @@ __extends(MDCIconButtonToggleFoundation, _super);

package.json

		{
		"name": "@material/icon-button",
		"description": "The Material Components for the web icon button component",
		"version": "15.0.0-canary.c0a11ef0d.0",
		"version": "15.0.0-canary.c0d21ecc9.0",
		"license": "MIT",
		@@ -22,12 +22,12 @@ "main": "dist/mdc.iconButton.js",
		"dependencies": {
		"@material/base": "15.0.0-canary.c0a11ef0d.0",
		"@material/density": "15.0.0-canary.c0a11ef0d.0",
		"@material/dom": "15.0.0-canary.c0a11ef0d.0",
		"@material/elevation": "15.0.0-canary.c0a11ef0d.0",
		"@material/feature-targeting": "15.0.0-canary.c0a11ef0d.0",
		"@material/focus-ring": "15.0.0-canary.c0a11ef0d.0",
		"@material/ripple": "15.0.0-canary.c0a11ef0d.0",
		"@material/rtl": "15.0.0-canary.c0a11ef0d.0",
		"@material/theme": "15.0.0-canary.c0a11ef0d.0",
		"@material/touch-target": "15.0.0-canary.c0a11ef0d.0",
		"@material/base": "15.0.0-canary.c0d21ecc9.0",
		"@material/density": "15.0.0-canary.c0d21ecc9.0",
		"@material/dom": "15.0.0-canary.c0d21ecc9.0",
		"@material/elevation": "15.0.0-canary.c0d21ecc9.0",
		"@material/feature-targeting": "15.0.0-canary.c0d21ecc9.0",
		"@material/focus-ring": "15.0.0-canary.c0d21ecc9.0",
		"@material/ripple": "15.0.0-canary.c0d21ecc9.0",
		"@material/rtl": "15.0.0-canary.c0d21ecc9.0",
		"@material/theme": "15.0.0-canary.c0d21ecc9.0",
		"@material/touch-target": "15.0.0-canary.c0d21ecc9.0",
		"tslib": "^2.1.0"
		@@ -38,3 +38,3 @@ },
		},
		"gitHead": "a97df68c1dadba0530f5fcda79fb8bc3082d963a"
		"gitHead": "0a932ea790a12d359ce4ec7c5c4c7aec7edf565d"
		}

README.md

		@@ -59,6 +59,6 @@ <!--docs:
		```html
		<button class="mdc-icon-button material-icons">
		<button class="mdc-icon-button">
		<div class="mdc-icon-button__ripple"></div>
		<span class="mdc-icon-button__focus-ring"></span>
		favorite
		<i class="material-icons">favorite</i>
		</button>
		@@ -78,6 +78,6 @@ ```
		<div class="mdc-touch-target-wrapper">
		<button class="mdc-icon-button material-icons">
		<button class="mdc-icon-button">
		<div class="mdc-icon-button__ripple"></div>
		<span class="mdc-icon-button__focus-ring"></span>
		favorite
		<i class="material-icons">favorite</i>
		<div class="mdc-icon-button__touch"></div>
		@@ -219,3 +219,3 @@ </button>
		`setAttr(name: string, value: string) => void` \| Sets the attribute `name` to `value` on the root element.
		`notifyChange(evtData: {isOn: boolean}) => void` \| Broadcasts a change notification, passing along the `evtData` to the environment's event handling system. In our vanilla implementation, Custom Events are used for this.
		`notifyChange(eventData: {isOn: boolean}) => void` \| Broadcasts a change notification, passing along the `eventData` to the environment's event handling system. In our vanilla implementation, Custom Events are used for this.

		@@ -222,0 +222,0 @@ ### `MDCIconButtonToggleFoundation`

_icon-button-theme.scss