feat: add CrossFlicking Preset #901
Conversation
| */ | ||
| import React, { ReactNode } from "react"; | ||
|
|
||
| const CrossGroup = React.forwardRef((props: { children?: ReactNode }, ref: React.Ref<HTMLDivElement>) => <div ref={ref}>{props.children}</div>); |
There was a problem hiding this comment.
It seems that CrossGroup should also have Element properties (className).
There was a problem hiding this comment.
Fixed to use properties of elements in CrossGroup.
| } | ||
|
|
||
| public render() { | ||
| const props = this.props; |
There was a problem hiding this comment.
It seems like you'll need to filter only the parts you need from Cross's props.
There was a problem hiding this comment.
Added logic to filter props before passing them to the CrossFlicking instance.
|
|
||
| Object.keys(SIDE_EVENTS).forEach((eventKey: keyof typeof EVENTS) => { | ||
| const eventName = SIDE_EVENTS[eventKey]; | ||
| this._bindEvent(eventName); |
There was a problem hiding this comment.
Extended from react-flicking, react-crossflicking calls destroy on unmount to remove all event handlers.
| onSideChanged: (e: CrossFlickingEvent<ChangedEvent>) => {}, | ||
| }; | ||
|
|
||
| class CrossFlicking extends Flicking { |
There was a problem hiding this comment.
CrossFlicking extends Flicking in react, and Flicking includes a @withFlickingMethods decorator that allows to use existing methods.
malangfox
force-pushed
the
feat/crossflicking
branch
from
77736df to
f7b3fe2
Compare
malangfox
force-pushed
the
feat/crossflicking
branch
from
1f39720 to
32bc785
Compare
malangfox
force-pushed
the
feat/crossflicking
branch
from
32bc785 to
5f632ca
Compare
Details
CrossFlicking supports flicking that can move in both horizontal and vertical directions.
You can easily create UIs with panels with multiple categories with this preset.
Documentation
https://malangfox.github.io/egjs-flicking/Presets
Examples
Rules