gn-lib

gn-lib Library Documentation

The gn-lib package is an internal component and utility library developed by GoNation. It includes various reusable UI components, React hooks, and helper/utility functions. This documentation provides an overview of the package's structure and functionality to help developers understand and utilize its features effectively.

Table of Contents

• Installation
• Components
  • YouTubeEmbed
• Hooks
  • useScroll
• Utils
  • generateGoogleMapsLink

Installation

To install the gn-lib package, follow these steps:

1. Ensure that you have Node.js and npm (Node Package Manager) installed on your machine.
2. Open a terminal or command prompt.
3. Navigate to your project directory.
4. Run the following command to install the package:

npm install gn-lib

Components

YouTubeEmbed

The YouTubeEmbed component is a reusable UI component that allows you to embed YouTube videos in your application. It provides options for autoplay and preventing mouse effects.

Path: /components/YoutubeEmbed.tsx

Usage:

import React from 'react'
import YouTubeEmbed from 'gn-lib/components/YouTubeEmbed'

const MyComponent = () => {
  return (
    <div>
      {/* Example usage of the YouTubeEmbed component */}
      <YouTubeEmbed videoId="VIDEO_ID_HERE" autoplay preventMouseEffects />
    </div>
  )
}

The YouTubeEmbed component accepts the following props:

• videoId (required): The YouTube video ID of the video to be embedded.
• autoplay (optional): If set to true, the video will autoplay. Default value is false.
• preventMouseEffects (optional): If set to true, mouse effects on the video will be prevented. Default value is false.

Hooks

useScroll

The useScroll hook is a React hook that provides the current scroll position of the page.

Path: /hooks/useScroll.tsx

Usage:

import React from 'react'
import useScroll from 'gn-lib/hooks/useScroll'

const MyComponent = () => {
  const [scrollPosition] = useScroll()

  // Access the scroll position value
  console.log('Scroll position:', scrollPosition)

  return <div>{/* Your component JSX */}</div>
}

The useScroll hook returns an array with a single value:

• scrollPosition: The current scroll position of the page.

Utils

generateGoogleMapsLink

The generateGoogleMapsLink utility function generates a Google Maps link with the provided location details.

Path: /utils/generateGoogleMapsLink.ts

Usage:

import generateGoogleMapsLink from 'gn-lib/utils/generateGoogleMapsLink'

const location = {
  city: 'New York',
  state: 'NY',
  street: '123 Main Street',
  zip: '12345',
  name: 'My Location'
}

const googleMapsLink = generateGoogleMapsLink(location)
console.log('Google Maps link:', googleMapsLink)

The generateGoogleMapsLink function accepts an object with the following properties:

• city (required): The city of the location.
• state (required): The state of the location.
• street (required): The street address of the location.
• zip (required): The ZIP code of the location.
• name (required): The name of the location.

It returns a formatted Google Maps link that can be used to open the location in Google Maps.

---

This concludes the documentation for the gn-lib package. If you have any further questions or need assistance, please refer to the code examples provided or reach out to the library maintainers.