frame.select

Overview

frame.select is a React component designed for selecting items from a list with a search bar. It provides a user-friendly interface for filtering and selecting data, making it ideal for forms, tables, or any UI requiring item selection.

Key Features

• Searchable List: Quickly find items using the built-in search bar.
• Customizable: Easily style the component using Emotion or Material-UI.
• Lightweight: Built with modern libraries like React and Vite for optimal performance.

Installation

Install the package via npm:

npm install frame.select


## Usage

```javascript
import React from 'react';
import { ItemList } from 'frame.select';

const items = [
  { id: 1, name: 'Apple', category: 'Fruit' },
  { id: 2, name: 'Carrot', category: 'Vegetable' },
  { id: 3, name: 'Banana', category: 'Fruit' },
  { id: 4, name: 'Broccoli', category: 'Vegetable' },
];

const filterFunction = (item, query) => {
  return item.name.toLowerCase().includes(query.toLowerCase());
};

const App = () => {
  return (
    <div>
      <h1>Item List</h1>
      <ItemList items={items} filter={filterFunction} />
    </div>
  );
};

export default App;