Skip to content

Commit

Permalink
chore: Release 4.11.1
Browse files Browse the repository at this point in the history
  • Loading branch information
@daybrush
daybrush committed Feb 7, 2024
1 parent 13597dd commit add5361
Show file tree
Hide file tree
Showing 71 changed files with 13,140 additions and 13 deletions.
29 changes: 29 additions & 0 deletions CHANGELOG.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,35 @@
All notable changes to this project will be documented in this file.
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.

## [4.11.1](https://github.com/naver/egjs-infinitegrid/compare/4.10.1...4.11.1) (2024-02-07)
### :sparkles: Packages
* `@egjs/infinitegrid` 4.11.1
* `@egjs/react-infinitegrid` 4.11.1
* `@egjs/svelte-infinitegrid` 4.11.1
* `@egjs/vue-infinitegrid` 4.11.1
* `@egjs/vue3-infinitegrid` 4.11.1
* `@egjs/ngx-infinitegrid` 4.11.1


### :rocket: New Features

* `@egjs/infinitegrid`
* add contentAlign prop (#558) ([559a288](https://github.com/naver/egjs-infinitegrid/commit/559a28805f9b8d83e6b0c9fb0cfb6218172f32b7))


### :bug: Bug Fix

* All
* fix observe order (#563) ([e5bfcc4](https://github.com/naver/egjs-infinitegrid/commit/e5bfcc4c61ed03009ff35b6fca8a1f70969995ae))


### :mega: Other

* All
* update packages versions ([13597dd](https://github.com/naver/egjs-infinitegrid/commit/13597dd1e4ddcc28fdca0e9fa62f0a9c2df3b312))



## [4.10.1](https://github.com/naver/egjs-infinitegrid/compare/4.10.0...4.10.1) (2023-08-04)
### :sparkles: Packages
* `@egjs/infinitegrid` 4.10.1
Expand Down
179 changes: 178 additions & 1 deletion packages/docs/docs/api/FrameInfiniteGrid.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ class FrameInfiniteGrid

<div className="container">
<div className="row mb-2"><div className="col col--6"><strong>Methods</strong></div><div className="col col--6"><strong>Events</strong></div></div>
<div className="row"><div className="col col--6"><a href="#renderItems">renderItems</a><br/><a href="#getWrapperElement">getWrapperElement</a><br/><a href="#getScrollContainerElement">getScrollContainerElement</a><br/><a href="#getContainerElement">getContainerElement</a><br/><a href="#syncItems">syncItems</a><br/><a href="#setCursors">setCursors</a><br/><a href="#getStartCursor">getStartCursor</a><br/><a href="#getEndCursor">getEndCursor</a><br/><a href="#append">append</a><br/><a href="#prepend">prepend</a><br/><a href="#insert">insert</a><br/><a href="#insertByGroupIndex">insertByGroupIndex</a><br/><a href="#getStatus">getStatus</a><br/><a href="#setPlaceholder">setPlaceholder</a><br/><a href="#setLoading">setLoading</a><br/><a href="#appendPlaceholders">appendPlaceholders</a><br/><a href="#prependPlaceholders">prependPlaceholders</a><br/><a href="#removePlaceholders">removePlaceholders</a><br/><a href="#setStatus">setStatus</a><br/><a href="#removeGroupByIndex">removeGroupByIndex</a><br/><a href="#removeGroupByKey">removeGroupByKey</a><br/><a href="#removeByIndex">removeByIndex</a><br/><a href="#removeByKey">removeByKey</a><br/><a href="#updateItems">updateItems</a><br/><a href="#getItems">getItems</a><br/><a href="#getVisibleItems">getVisibleItems</a><br/><a href="#getRenderingItems">getRenderingItems</a><br/><a href="#getGroups">getGroups</a><br/><a href="#getVisibleGroups">getVisibleGroups</a><br/><a href="#wait">wait</a><br/><a href="#ready">ready</a><br/><a href="#isWait">isWait</a><br/><a href="#destroy">destroy</a></div><div className="col col--6"><a href="#event-changeScroll">changeScroll</a><br/><a href="#event-requestAppend">requestAppend</a><br/><a href="#event-requestPrepend">requestPrepend</a><br/><a href="#event-contentError">contentError</a><br/><a href="#event-renderComplete">renderComplete</a></div></div>
<div className="row"><div className="col col--6"><a href="#renderItems">renderItems</a><br/><a href="#getWrapperElement">getWrapperElement</a><br/><a href="#getScrollContainerElement">getScrollContainerElement</a><br/><a href="#getContainerElement">getContainerElement</a><br/><a href="#syncItems">syncItems</a><br/><a href="#setCursors">setCursors</a><br/><a href="#getStartCursor">getStartCursor</a><br/><a href="#getEndCursor">getEndCursor</a><br/><a href="#append">append</a><br/><a href="#prepend">prepend</a><br/><a href="#insert">insert</a><br/><a href="#insertByGroupIndex">insertByGroupIndex</a><br/><a href="#getStatus">getStatus</a><br/><a href="#setPlaceholder">setPlaceholder</a><br/><a href="#setLoading">setLoading</a><br/><a href="#appendPlaceholders">appendPlaceholders</a><br/><a href="#prependPlaceholders">prependPlaceholders</a><br/><a href="#removePlaceholders">removePlaceholders</a><br/><a href="#setStatus">setStatus</a><br/><a href="#removeGroupByIndex">removeGroupByIndex</a><br/><a href="#removeGroupByKey">removeGroupByKey</a><br/><a href="#removeByIndex">removeByIndex</a><br/><a href="#removeByKey">removeByKey</a><br/><a href="#updateItems">updateItems</a><br/><a href="#getItems">getItems</a><br/><a href="#getVisibleItems">getVisibleItems</a><br/><a href="#getRenderingItems">getRenderingItems</a><br/><a href="#getGroups">getGroups</a><br/><a href="#getVisibleGroups">getVisibleGroups</a><br/><a href="#wait">wait</a><br/><a href="#ready">ready</a><br/><a href="#isWait">isWait</a><br/><a href="#destroy">destroy</a><br/><a href="#trigger">trigger</a><br/><a href="#once">once</a><br/><a href="#hasOn">hasOn</a><br/><a href="#on">on</a><br/><a href="#off">off</a></div><div className="col col--6"><a href="#event-changeScroll">changeScroll</a><br/><a href="#event-requestAppend">requestAppend</a><br/><a href="#event-requestPrepend">requestPrepend</a><br/><a href="#event-contentError">contentError</a><br/><a href="#event-renderComplete">renderComplete</a></div></div>
</div>

## constructor
Expand Down Expand Up @@ -492,6 +492,183 @@ ig.insertByGroupIndex(4, [HTMLElement1, HTMLElement2]);

**Returns**: void

### trigger {#trigger}

<div>
<span className="badge badge--danger">inherited</span>
</div>

<p>Trigger a custom event.</p>

**Returns**: this
- <p>An instance of the component itself</p>

|PARAMETER|TYPE|OPTIONAL|DEFAULT|DESCRIPTION|
|:---:|:---:|:---:|:---:|:---:|
|event|string \| ComponentEvent|||<p>The name of the custom event to be triggered or an instance of the ComponentEvent</p>|
|params|Array&lt;any&gt; \| $ts:...|||<p>Event data to be sent when triggering a custom event </p>|

```ts
import Component, { ComponentEvent } from "@egjs/component";
class Some extends Component<{
beforeHi: ComponentEvent<{ foo: number; bar: string }>;
hi: { foo: { a: number; b: boolean } };
someEvent: (foo: number, bar: string) => void;
someOtherEvent: void; // When there's no event argument
}> {
some(){
if(this.trigger("beforeHi")){ // When event call to stop return false.
this.trigger("hi");// fire hi event.
}
}
}
const some = new Some();
some.on("beforeHi", e => {
if(condition){
e.stop(); // When event call to stop, `hi` event not call.
}
// `currentTarget` is component instance.
console.log(some === e.currentTarget); // true
typeof e.foo; // number
typeof e.bar; // string
});
some.on("hi", e => {
typeof e.foo.b; // boolean
});
// If you want to more know event design. You can see article.
// https://github.com/naver/egjs-component/wiki/How-to-make-Component-event-design%3F
```

### once {#once}

<div>
<span className="badge badge--danger">inherited</span>
</div>

<p>Executed event just one time.</p>

**Returns**: this
- <p>An instance of the component itself</p>

|PARAMETER|TYPE|OPTIONAL|DEFAULT|DESCRIPTION|
|:---:|:---:|:---:|:---:|:---:|
|eventName|string \| $ts:...|||<p>The name of the event to be attached or an event name - event handler mapped object.</p>|
|handlerToAttach|function \| $ts:...|✔️||<p>The handler function of the event to be attached </p>|

```ts
import Component, { ComponentEvent } from "@egjs/component";
class Some extends Component<{
hi: ComponentEvent;
}> {
hi() {
alert("hi");
}
thing() {
this.once("hi", this.hi);
}
}
var some = new Some();
some.thing();
some.trigger(new ComponentEvent("hi"));
// fire alert("hi");
some.trigger(new ComponentEvent("hi"));
// Nothing happens
```

### hasOn {#hasOn}

<div>
<span className="badge badge--danger">inherited</span>
</div>

<p>Checks whether an event has been attached to a component.</p>

**Returns**: boolean
- <p>Indicates whether the event is attached. </p>

|PARAMETER|TYPE|OPTIONAL|DEFAULT|DESCRIPTION|
|:---:|:---:|:---:|:---:|:---:|
|eventName|string|||<p>The name of the event to be attached </p>|

```ts
import Component from "@egjs/component";
class Some extends Component<{
hi: void;
}> {
some() {
this.hasOn("hi");// check hi event.
}
}
```

### on {#on}

<div>
<span className="badge badge--danger">inherited</span>
</div>

<p>Attaches an event to a component.</p>

**Returns**: this
- <p>An instance of a component itself</p>

|PARAMETER|TYPE|OPTIONAL|DEFAULT|DESCRIPTION|
|:---:|:---:|:---:|:---:|:---:|
|eventName|string \| $ts:...|||<p>The name of the event to be attached or an event name - event handler mapped object.</p>|
|handlerToAttach|function \| $ts:...|✔️||<p>The handler function of the event to be attached </p>|

```ts
import Component, { ComponentEvent } from "@egjs/component";
class Some extends Component<{
hi: void;
}> {
hi() {
console.log("hi");
}
some() {
this.on("hi",this.hi); //attach event
}
}
```

### off {#off}

<div>
<span className="badge badge--danger">inherited</span>
</div>

<p>Detaches an event from the component.<br/>If the <code>eventName</code> is not given this will detach all event handlers attached.<br/>If the <code>handlerToDetach</code> is not given, this will detach all event handlers for <code>eventName</code>.</p>

**Returns**: this
- <p>An instance of a component itself </p>

|PARAMETER|TYPE|OPTIONAL|DEFAULT|DESCRIPTION|
|:---:|:---:|:---:|:---:|:---:|
|eventName|string \| $ts:...|✔️||<p>The name of the event to be detached </p>|
|handlerToDetach|function \| $ts:...|✔️||<p>The handler function of the event to be detached </p>|

```ts
import Component, { ComponentEvent } from "@egjs/component";
class Some extends Component<{
hi: void;
}> {
hi() {
console.log("hi");
}
some() {
this.off("hi",this.hi); //detach event
}
}
```

## Events
### changeScroll {#event-changeScroll}

Expand Down

0 comments on commit add5361

Please sign in to comment.