react-awesome-popover - A smart popover component with animation support for ReactJS

  •        14

A smart popover component with animation support for ReactJS

http://jsfiddle.net/6qogfdkr/141/
https://github.com/vaheqelyan/react-awesome-popover

Dependencies:

random-id : ^0.0.2
react : ^16.2.0
react-popper : ^0.7.4

Tags
Implementation
License
Platform

   




Related Projects

react-popper - 🍿⚛Official React library to use Popper, the positioning library

  •    Javascript

React wrapper around Popper. important note: Popper is not a tooltip library, it's a positioning engine to be used to build features such as (but not restricted to) tooltips.

react-popper - React wrapper around Popper.js (official)

  •    Javascript

React wrapper around Popper.js. important note: popper.js is not a tooltip library, it's a positioning engine to be used to build features such as (but not restricted to) tooltips.

react-native-popover - A <Popover /> component for react-native

  •    Javascript

A <Popover> component for react-native. This is still very much a work in progress and only handles the simplest of cases, ideas and contributions are very welcome. However, as an alternative, I recommend you use @brentvatne's react-native-overlay library to wrap <Popover /> and bring it to the front no matter where it sits in the render tree.

react-popover - A smart popover component for ReactJS

  •    Javascript

react-popover >= 0.5.0 supports React 16 while react-popover < 0.5.0 works with React 15.x.x and likely lower. There is no plan to support older versions of this library with back-ported patches and PRs for that purpose are not welcome since it increases maintenance for the authors. Look at the stories in our storybook.

react-overlays - Utilities for creating robust overlay components

  •    Javascript

All of these utilities have been abstracted out of react-bootstrap in order to provide better access to the generic implementations of these commonly needed components. The included components are building blocks for creating more polished components. Everything is bring-your-own-styles, css or otherwise. If you are looking for more complete overlays, modals, or tooltips--something you can use right out of the box--check out react-bootstrap, which is (or soon will be) built on using these components.


react-native-root-modal - A pure JavaScript solution for react native`s modal component

  •    Javascript

Import library any where inside your code before AppRegistry.registerComponent is called. Invoked by React element way.

react-native-modal-picker - A cross-platform (iOS / Android), selector/picker component for React Native that is highly customizable and supports sections

  •    Javascript

A cross-platform (iOS / Android), selector/picker component for React Native that is highly customizable and supports sections. You can either use this component as an wrapper around your existing component or use it in its default mode. In default mode a customizable button is rendered.

teaset - A UI library for react native, provides 20+ pure JS(ES6) components, focusing on content display and action control

  •    Javascript

A UI library for react native, provides 20+ pure JS(ES6) components, focusing on content display and action control. Tips: In the Android system, the animations is not smooth, switch to the release mode can be resolved.

react-spring - ✌️ A spring physics based React animation library

  •    TypeScript

react-spring is a spring-physics based animation library that should cover most of your UI related animation needs. It gives you tools flexible enough to confidently cast your ideas into moving interfaces. This library represents a modern approach to animation. It is very much inspired by Christopher Chedeau's animated and Cheng Lou's react-motion. It inherits animated's powerful interpolations and performance, as well as react-motion's ease of use. But while animated is mostly imperative and react-motion mostly declarative, react-spring bridges both. You will be surprised how easy static data is cast into motion with small, explicit utility functions that don't necessarily affect how you form your views.

react-motion-ui-pack - Wrapper component around React Motion for easier UI transitions

  •    Javascript

Please use react-spring for all of your animation needs. React Motion is an amazing animation library for React. React Motion UI Pack tries to help ease entry level / common use cases with React Motion by providing a higher level way to work with it and create common UI transitions easier. If you need more complex animations I suggest using React Motion directly.

Reactstrap - React component library for Bootstrap

  •    Javascript

Reactstrap is a React component library for Bootstrap. It contains React Bootstrap components that favor composition and control. The library does not depend on jQuery or Bootstrap javascript. However, Poppers.js via react-popper is relied upon for advanced positioning of content like Tooltips, Popovers, and auto-flipping Dropdowns.

awesome-react-talks - :sunglasses: A curated list of talks about React or topics related to React

  •    Javascript

A curated list of talks about React or topics related to React that I enjoyed. I'll be updating this list whenever I've watched another talk that is worth adding. Suggestions are always appreciated through a pull request. Please take a look at the Contribution Guidelines first. You should also checkout the awesome-react and awesome-react-components repos.

popper-core - 🍿Positioning tooltips and popovers is difficult. Popper is here to help!

  •    Javascript

Given an element, such as a button, and a tooltip element describing it, Popper will automatically put the tooltip in the right place near the button. It will position any UI element that "pops out" from the flow of your document and floats near a target element. The most common example is a tooltip, but it also includes popovers, drop-downs, and more. All of these can be generically described as a "popper" element.

react-native-animation-book - A book talking about react-native animations, and walking you through from beginner to expert

  •    HTML

If you don't care about anything just jump to the Basic Animation Examples which will eventually guide you from basic to advanced animations and allow you to experience the capabilities of React Native animations. React Native has had a fantastic reception. There have already been a ton of great applications built using React Native. However one hugely important part of mobile applications is animations. React on the web has generally been pretty poor at dealing with animations, but there are some great people out there attempting to solve this problem. One such solution is react-motion https://github.com/chenglou/react-motion/.

react-move - React Move 🌀 Beautiful, data-driven animations for React

  •    Javascript

Beautiful, data-driven animations for React. React-move allows you to define your animations using durations, delays and ease functions. In react-motion you use spring configurations to define your animations.

react-spring - 🙌 Helping react-motion and animated to become best friends

  •    Javascript

A set of simple, spring-physics based primitives (as in building blocks) that should cover most of your UI related animation needs once plain CSS can't cope any longer. Forget easings, durations, timeouts and so on as you fluidly move data from one state to another. This isn't meant to solve each and every problem but rather to give you tools flexible enough to confidently cast ideas into moving interfaces. react-spring is a cooked down fork of Christopher Chedeau's animated (which is used in react-native by default). It is trying to bridge it with Cheng Lou's react-motion. Although both are similarily spring-physics based they are still polar opposites.

ant-motion - :bicyclist: Animate specification and components of Ant Design

  •    Javascript

Animation specification and components of Ant Design. Ant Motion is a motion design specification from Ant Design, and also provide a complete solution with lots of out-of-box animations for your React applications.

data-driven-motion - Easily animate your data in react

  •    Javascript

This is a small wrapper around react-motion with the intention of simplifying the api for my most common use case.






We have large collection of open source products. Follow the tags from Tag Cloud >>


Open source products are scattered around the web. Please provide information about the open source projects you own / you use. Add Projects.