You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository was archived by the owner on Jan 13, 2025. It is now read-only.
`selected` | Boolean | Proxies to the foundation's `isSelected`/`setSelected` methods
284
-
`shouldRemoveOnTrailingIconClick` | Boolean | Proxies to the foundation's `getShouldRemoveOnTrailingIconClick`/`setShouldRemoveOnTrailingIconClick` methods\*\*
282
+
`id` | `string` | Unique identifier on the chip\*
283
+
`selected` | `boolean` | Proxies to the foundation's `isSelected`/`setSelected` methods
284
+
`shouldRemoveOnTrailingIconClick` | `boolean` | Proxies to the foundation's `getShouldRemoveOnTrailingIconClick`/`setShouldRemoveOnTrailingIconClick` methods\*\*
285
285
`ripple` | `MDCRipple` | The `MDCRipple` instance for the root element that `MDCChip` initializes
286
286
287
287
> \*_NOTE_: This will be the same as the `id` attribute on the root element. If an `id` is not provided, a unique one will be generated.
`chips` | Array<`MDCChip`> | An array of the `MDCChip` objects that represent chips in the set
311
-
`selectedChipIds` | `!Array<string>` (read-only) | An array of the IDs of all selected chips
310
+
`chips` | `MDCChip[]` | An array of the `MDCChip` objects that represent chips in the set
311
+
`selectedChipIds` | `string[]` (read-only) | An array of the IDs of all selected chips
312
312
313
313
## Usage within Web Frameworks
314
314
315
315
If you are using a JavaScript framework, such as React or Angular, you can create Chips for your framework. Depending on your needs, you can use the _Simple Approach: Wrapping MDC Web Vanilla Components_, or the _Advanced Approach: Using Foundations and Adapters_. Please follow the instructions [here](../../docs/integrating-into-frameworks.md).
316
316
317
317
### Adapters: `MDCChipAdapter` and `MDCChipSetAdapter`
318
318
319
-
See [`chip/index.js`](chip/index.js) and [`chip-set/index.js`](chip-set/index.js) for vanilla DOM implementations of these adapter APIs for reference.
319
+
See [`chip/index.ts`](chip/index.ts) and [`chip-set/index.ts`](chip-set/index.ts) for vanilla DOM implementations of these adapter APIs for reference.
`setStyleProperty(propertyName: string, value: string) => void` | Sets the property value of the given style property on the root element
337
337
`hasLeadingIcon() => boolean` | Returns whether the chip has a leading icon
338
338
`getRootBoundingClientRect() => ClientRect` | Returns the bounding client rect of the root element
339
-
`getCheckmarkBoundingClientRect() => ?ClientRect` | Returns the bounding client rect of the checkmark element or null if it doesn't exist
339
+
`getCheckmarkBoundingClientRect() => ClientRect \| null` | Returns the bounding client rect of the checkmark element or null if it doesn't exist
340
340
341
341
> \*_NOTE_: `notifyInteraction` and `notifyTrailingIconInteraction` must pass along the target chip's ID, and must be observable by the parent `mdc-chip-set` element (e.g. via DOM event bubbling).
342
342
@@ -382,7 +382,7 @@ Events | Element Selector | Foundation Handler
382
382
383
383
Method Signature | Description
384
384
--- | ---
385
-
`getSelectedChipIds() => !Array<string>` | Returns an array of the IDs of all selected chips
385
+
`getSelectedChipIds() => string[]` | Returns an array of the IDs of all selected chips
386
386
`select(chipId: string) => void` | Selects the chip with the given id
387
387
`handleChipInteraction(chipId: string) => void` | Handles a custom `MDCChip:interaction` event on the root element
388
388
`handleChipSelection(chipId: string, selected: boolean) => void` | Handles a custom `MDCChip:selection` event on the root element
0 commit comments