website-common-page/README.md

Common website pages components, such as terms of service, privacy policy, and contact us.

# Website Common Page

This package provides common website page components such as Terms of Service, Privacy Policy, Cookie Policy, and Contact Us pages. These components can be easily integrated into any React application.

## Installation

```bash
npm install website-common-page
# or
yarn add website-common-page
```

## Usage

### Terms of Service

```jsx
import { TermsOfService } from "website-common-page";

function App() {
  return (
    <TermsOfService
      companyName="Your Company Name"
      websiteUrl="https://yourwebsite.com"
      lastUpdated="2025-03-12" // Optional, defaults to current date
    />
  );
}
```

### Privacy Policy

```jsx
import { PrivacyPolicy } from "website-common-page";

function App() {
  return (
    <PrivacyPolicy
      companyName="Your Company Name"
      websiteUrl="https://yourwebsite.com"
      contactEmail="contact@yourwebsite.com" // Optional
      lastUpdated="2025-03-12" // Optional, defaults to current date
    />
  );
}
```

### Cookie Policy

```jsx
import { CookiePolicy } from "website-common-page";

function App() {
  return (
    <CookiePolicy
      companyName="Your Company Name"
      websiteUrl="https://yourwebsite.com"
      lastUpdated="2025-03-12" // Optional, defaults to current date
    />
  );
}
```

### Contact Us

```jsx
import { ContactUs } from "website-common-page";

function App() {
  return (
    <ContactUs
      companyName="Your Company Name"
      address="Your Company Address" // Optional
      contactEmail="contact@yourwebsite.com" // Optional
      contactPhone="+1234567890" // Optional
    />
  );
}
```

## Custom Content

All components support fully custom content via the `customContent` prop:

```jsx
import { TermsOfService } from "website-common-page";

function App() {
  return (
    <TermsOfService
      companyName="Your Company Name"
      websiteUrl="https://yourwebsite.com"
      customContent={
        <div>
          <h2>Fully Custom Terms of Service Content</h2>
          <p>Here is your custom content...</p>
        </div>
      }
    />
  );
}
```

## Styling

All components accept a `className` prop that allows you to apply custom styles:

```jsx
import { PrivacyPolicy } from "website-common-page";
import "./custom-styles.css";

function App() {
  return (
    <PrivacyPolicy
      companyName="Your Company Name"
      websiteUrl="https://yourwebsite.com"
      className="my-custom-style"
    />
  );
}
```

## Props

All components share the following common props:

| Prop          | Type      | Required | Description                                 |
| ------------- | --------- | -------- | ------------------------------------------- |
| companyName   | string    | Yes      | Company name                                |
| websiteUrl    | string    | Yes      | Company website URL                         |
| address       | string    | No       | Company address                             |
| contactEmail  | string    | No       | Contact email                               |
| contactPhone  | string    | No       | Contact phone number                        |
| lastUpdated   | string    | No       | Last updated date, defaults to current date |
| className     | string    | No       | Custom CSS class name                       |
| customContent | ReactNode | No       | Fully custom content                        |

## License

MIT