Skip to content

Latest commit

 

History

History
68 lines (51 loc) · 2.69 KB

File metadata and controls

68 lines (51 loc) · 2.69 KB

Quick Filter — React Native Quick Filter Library

Project agent file (shared file for Codex / OpenCode / Antigravity). Describes what the project is, what phase it's in, and what is and isn't being done right now. Read before diving into code.

What is this project?

A reusable "global quick filter flow" library that the user (solo dev) will use in common across all their React Native apps.

Source of inspiration: the highly-praised quick filter structures of Turkish e-commerce apps (Trendyol, Hepsiburada, Çiçeksepeti, n11, Trendyol GO, Getir, Amazon TR, etc.) — horizontal chip/pill rows, bottom-opening (bottom-sheet) filter panels, "sort" menus, quick-filter badges, active filter summaries.

Goal: gather these UX patterns into a single library and plug them into the user's apps as a drop-in.

⚠️ Current phase — REFERENCE FIRST, THEN CODE

Library code will NOT be written YET. The repo is currently in the reference collection phase.

  • The user will first share the filter structures they like (screenshot, video, app name, description).
  • These references go into the references/ folder.
  • Do not write any component/library code until enough references have accumulated and the UX + technical contract are clear.
  • If the design, public API surface, package name, or the filter types to be covered are unclear → stop and ask the user, don't proceed on assumptions.

Target UX (to be clarified from references)

Expected filter primitives (finalized once the user approves):

  • Horizontally scrollable quick-filter chip/pill row
  • A bottom-opening filter bottom-sheet (multi-select, category, price range, size/color, brand, etc.)
  • Sort selector
  • Active filter counter + "clear filters"
  • Summary badges of selected filters

Technical direction (provisional — finalized in the code phase)

  • React Native library, TypeScript (strict).
  • Reusable across multiple apps; a headless core + styleable default UI separation is the goal.
  • Package name: react-native-quick-filter (temporary — pending user approval).
  • Localization-first: all user-facing strings must be i18n-ready.
  • Theme/design system is not decided silently; references and user approval are authoritative.

Folder layout

  • references/ — filter examples the user liked and shared (image/video/note)
  • docs/ — UX contract, API design, decisions
  • (library source code will be added later)

Don't

  • Don't write library code before references arrive.
  • Don't decide the design system/theme by assumption — the user's examples are authoritative.
  • Don't finalize the package name/package.json without user approval.