js/shoelace
1
0
Fork 0
mirror of https://github.com/shoelace-style/shoelace.git synced 2026-01-12 11:09:13 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix docs

Browse Source
This commit is contained in:
Cory LaViska
2021-09-30 17:16:27 -04:00
parent 3f12624b78
commit ef22dd7dc4
2 changed files with 5 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
docs/components/resize-observer.md
View File

@@ -2,9 +2,9 @@
[component-header:sl-resize-observer]
Resize observers offer a thin, declarative interface to the [`ResizeObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver).
The Resize Observer component offers a thin, declarative interface to the [`ResizeObserver API`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver).
The resize observer will report changes to the dimensions of the elements it wraps through the `sl-resize` event. When emitted, a collection of [`ResizeObserverEntry`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserverEntry) objects will be attached to `event.detail`, containing the target element and information about its dimensions.
The resize observer will report changes to the dimensions of the elements it wraps through the `sl-resize` event. When emitted, a collection of [`ResizeObserverEntry`](https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserverEntry) objects will be attached to `event.detail` that contains the target element and information about its dimensions.
```html preview
<div class="resize-observer-overview">
@@ -20,7 +20,7 @@ The resize observer will report changes to the dimensions of the elements it wra
const resizeObserver = container.querySelector('sl-resize-observer');
resizeObserver.addEventListener('sl-resize', event => {
console.log(event);
console.log(event.detail);
});
</script>

2
src/components/resize-observer/resize-observer.ts
View File

@@ -7,6 +7,8 @@ import styles from './resize-observer.styles';
* @since 2.0
* @status stable
*
* @slot - One or more elements to watch for resizing.
*
* @event {{ entries: ResizeObserverEntry[] }} sl-resize - Emitted when the element is resized.
*/
@customElement('sl-resize-observer')