Package Exports

gcam-port-finder
gcam-port-finder/dist/index.esm.js
gcam-port-finder/dist/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (gcam-port-finder) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

GCam Port Finder

A React component library to help users find relevant Google Camera (GCam) ports for their smartphones.

This package is created by GCam Ports - The ultimate destination for finding the best Google Camera ports for your smartphone.

Features

🔍 Search for GCam ports by device model
📱 Browse popular brands with pre-configured ports
🚀 Easy installation guide included
🌗 Light and dark theme support
📦 Fully customizable components

Installation

npm install gcam-port-finder
# or
yarn add gcam-port-finder

Usage

Basic Usage

import React from "react";
import GCamPortFinder from "gcam-port-finder";

function App() {
  return (
    <div className="app">
      <h1>Find a GCam Port for Your Device</h1>
      <GCamPortFinder
        theme="light"
        onResultClick={(port) => console.log("Selected port:", port)}
      />
    </div>
  );
}

export default App;

Advanced Usage

import React from "react";
import { GCamPortFinder, SearchBox, BrandList } from "gcam-port-finder";
import { fetchGCamPorts } from "gcam-port-finder";

function CustomGCamFinder() {
  const customBrands = ["Samsung", "Xiaomi", "OnePlus", "Google"];

  const handlePortSelection = (port) => {
    console.log("Selected port:", port);
    // Implement your custom logic here
  };

  return (
    <div className="custom-finder">
      <GCamPortFinder
        apiBaseUrl="https://your-custom-api.com/api"
        defaultBrands={customBrands}
        theme="dark"
        onResultClick={handlePortSelection}
        showInstallGuide={true}
      />
    </div>
  );
}

export default CustomGCamFinder;

Components

The package exports the following components:

`<GCamPortFinder />`

The main component that wraps all functionality.

Props

Prop	Type	Default	Description
`apiBaseUrl`	`string`	`'https://gcamapk.io/wp-json/wp/v2'`	Base URL for the API
`defaultBrands`	`string[]`	`[]`	List of brands to display (uses built-in list if empty)
`theme`	`'light' \| 'dark'`	`'light'`	UI theme
`onResultClick`	`function`	`undefined`	Callback when a result is clicked
`showInstallGuide`	`boolean`	`true`	Whether to show the install guide button

`<SearchBox />`

A standalone search input with button.

Props

Prop	Type	Description
`value`	`string`	Current search query
`onChange`	`function`	Callback for input changes
`onSearch`	`function`	Callback when search is submitted

`<BrandList />`

A list of smartphone brands displayed as buttons.

Props

Prop	Type	Description
`brands`	`string[]`	List of brands to display
`onBrandSelect`	`function`	Callback when a brand is selected
`selectedBrand`	`string`	Currently selected brand

`<InstallGuide />`

A modal dialog showing installation instructions.

Props

Prop	Type	Description
`onClose`	`function`	Callback when the guide is closed

`<ResultList />`

A list of GCam port results.

Props

Prop	Type	Description
`results`	`object[]`	Array of GCam port objects
`onItemClick`	`function`	Callback when a result item is clicked

API

`fetchGCamPorts(baseUrl, query)`

Utility function to fetch GCam ports from the API.

Parameters

baseUrl (string): The base URL for the API
query (string): The search query (device model or brand)

Returns

A Promise that resolves to an array of GCam port objects.

Customization

Styling

The package includes default styles but you can override them with your own CSS. The component uses BEM-like class names prefixed with gcam- for easy targeting.

Theming

The package supports light and dark themes out of the box. You can pass the theme prop to switch between them.

Browser Support

Chrome (latest)
Firefox (latest)
Safari (latest)
Edge (latest)

License

MIT

About

This package is developed and maintained by GCam Ports, your trusted resource for Google Camera ports for all Android devices.

Contributing

Contributions are welcome! Please feel free to submit a PR.

Fork the repository
Create your feature branch (git checkout -b feature/amazing-feature)
Commit your changes (git commit -m 'Add some amazing feature')
Push to the branch (git push origin feature/amazing-feature)
Open a Pull Request