@anton.bobrov/react-components

A collection of reusable React components designed to streamline development and enhance user interfaces.

Links

• Storybook Examples: View live examples and documentation of each component.
• Changelog: Track updates, changes, and bug fixes.

Installation

To install the package, use npm:

npm i "@anton.bobrov/react-components"

Available Components

• BaseImage (Demo): A component for displaying images with optional features.
• BaseModal (Demo): A customizable modal dialog component.
• BasePopup (Demo): A component for creating popups that display additional information.
• BaseVideo: (Demo): A component for rendering HTML5 videos.
• BaseVideoModal: (Demo): A modal component designed specifically for video playback.
• ButtonAnchor: (Demo): Button or Anchor element depending on props.
• ExpandContent: (Demo): A collapsible content section for managing large blocks.
• FadeContent: (Demo): A component for displaying content with fade-in and fade-out transitions.
• LazyImage: (Demo): An image component that loads images lazily as they enter the viewport.
• LazyVideo: (Demo): A video component that lazy-loads videos when they are in view.
• LinkClickInterceptor: (Demo): A component for intercepting link clicks to perform custom actions.
• Marquee: (Demo): A component for displaying scrolling text or content.
• ModalAnchor: (Demo): A modal trigger component that opens modals when clicked.
• MoreContent: (Demo): A component for revealing additional content on demand.
• PageCursor: (Demo): A component for custom cursors.
• PageScroll: (Demo): A component for managing global page scrolling with support for custom smooth scrolling and scrollbars.
• ScrollView: (Demo): A component for monitoring elements entering and leaving the viewport.
• SplitText: (Demo): A component for splitting text into letters, words, or lines.
• TagName: (Demo): A React component that creates a DOM element with a dynamic tag name.
• VideoPlayer: (Demo): A component for rendering HTML5 videos or YouTube or Vimeo embedded players.

Importing Styles

All Styles

@import '[email protected]/react-components/lib/styles';

Specific Component Styles

For example, to import styles for the LazyImage:

@import '[email protected]/react-components/lib/styles/components/LazyImage';

License

This project is licensed under the terms of the MIT license.