@tsproxy/react 0.0.1 → 0.0.2

package/README.md

@@ -0,0 +1,68 @@
+# @tsproxy/react
+
+Headless React components for [tsproxy](https://github.com/akshitkrnagpal/tsproxy) with a BaseUI-style overrides pattern.
+
+> **This project is under heavy development.**
+
+## Install
+
+```bash
+npm install @tsproxy/react @tsproxy/js react-instantsearch
+```
+
+## Usage
+
+```tsx
+import { SearchProvider, SearchBox, Hits, RefinementList, Pagination, Stats } from "@tsproxy/react";
+import { Configure } from "react-instantsearch";
+
+export default function SearchPage() {
+  return (
+    <SearchProvider serverUrl="http://localhost:3000" indexName="products">
+      <Configure hitsPerPage={12} />
+      <SearchBox placeholder="Search..." />
+      <Stats />
+      <RefinementList attribute="category" />
+      <Hits hitComponent={({ hit }) => <div>{hit.name}</div>} />
+      <Pagination />
+    </SearchProvider>
+  );
+}
+```
+
+## Overrides
+
+Every component accepts an `overrides` prop to customize any sub-element:
+
+```tsx
+<SearchBox
+  overrides={{
+    Input: { props: { className: "rounded-full border px-4 py-2" } },
+    SubmitButton: { props: { hidden: true } },
+    ResetButton: { component: MyResetButton },
+  }}
+/>
+```
+
+## Components
+
+| Component | Sub-elements |
+|-----------|-------------|
+| `SearchBox` | Root, Form, Input, SubmitButton, ResetButton |
+| `Hits` | Root, List, Item |
+| `RefinementList` | Root, List, Item, Label, Checkbox, LabelText, Count |
+| `Pagination` | Root, List, Item, Link |
+| `Stats` | Root, Text |
+| `SortBy` | Root, Select, Option |
+| `NoResults` | Root, Title, Message |
+| `HitsSkeleton` | Root, List, Item |
+| `LocaleSelector` | Root, Select, Option |
+| `SearchProvider` | — (wraps InstantSearch) |
+
+## Documentation
+
+[tsproxy.akshit.io](https://tsproxy.akshit.io)
+
+## License
+
+MIT

package/dist/index.d.ts

@@ -40,7 +40,7 @@ interface LocaleContextValue {
     locale: string | undefined;
     setLocale: (locale: string) => void;
 }
-declare const LocaleContext: react.Context<LocaleContextValue | null>;
+declare const LocaleContext: react.Context<LocaleContextValue>;
 declare function useLocale(): LocaleContextValue;
 interface LocaleProviderProps {
     initialLocale?: string;
@@ -108,7 +108,7 @@ interface PaginationProps {
     padding?: number;
     overrides?: Overrides<PaginationElements>;
 }
-declare function Pagination({ padding, overrides }: PaginationProps): react_jsx_runtime.JSX.Element | null;
+declare function Pagination({ padding, overrides }: PaginationProps): react_jsx_runtime.JSX.Element;
 
 type StatsElements = {
     Root: "div";
@@ -161,7 +161,7 @@ interface NoResultsProps {
     children?: ReactNode;
     overrides?: Overrides<NoResultsElements>;
 }
-declare function NoResults({ title, message, children, overrides, }: NoResultsProps): react_jsx_runtime.JSX.Element | null;
+declare function NoResults({ title, message, children, overrides, }: NoResultsProps): react_jsx_runtime.JSX.Element;
 
 type HitsSkeletonElements = {
     Root: "div";

package/dist/index.js

@@ -40,12 +40,12 @@ import { useMemo as useMemo2 } from "react";
 import { InstantSearch } from "react-instantsearch";
 import { createSearchClient } from "@tsproxy/js";
 import { jsx as jsx2 } from "react/jsx-runtime";
-function SearchProviderInner({
+function SearchProvider({
   serverUrl,
   indexName,
+  locale,
   children
 }) {
-  const { locale } = useLocale();
   const searchClient = useMemo2(
     () => createSearchClient({
       url: serverUrl,
@@ -54,22 +54,7 @@ function SearchProviderInner({
     }),
     [serverUrl, locale]
   );
-  return /* @__PURE__ */ jsx2(
-    InstantSearch,
-    {
-      searchClient,
-      indexName,
-      children
-    }
-  );
-}
-function SearchProvider({
-  serverUrl,
-  indexName,
-  locale,
-  children
-}) {
-  return /* @__PURE__ */ jsx2(LocaleProvider, { initialLocale: locale, children: /* @__PURE__ */ jsx2(SearchProviderInner, { serverUrl, indexName, children }) });
+  return /* @__PURE__ */ jsx2(InstantSearch, { searchClient, indexName, children });
 }
 
 // src/components/SearchBox.tsx

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tsproxy/react",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "Headless React components for tsproxy with BaseUI-style overrides",
   "type": "module",
   "main": "./dist/index.js",
@@ -12,7 +12,8 @@
     }
   },
   "files": [
-    "dist"
+    "dist",
+    "README.md"
   ],
   "publishConfig": {
     "access": "public"
@@ -30,8 +31,12 @@
     "headless",
     "search"
   ],
+  "scripts": {
+    "build": "tsup",
+    "typecheck": "tsc --noEmit"
+  },
   "dependencies": {
-    "@tsproxy/js": "0.0.1"
+    "@tsproxy/js": "^0.0.2"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
@@ -39,16 +44,9 @@
     "react-instantsearch": "^7.0.0"
   },
   "devDependencies": {
-    "@types/react": "^18.3.0",
-    "@types/react-dom": "^18.3.0",
-    "react": "^18.3.0",
-    "react-dom": "^18.3.0",
-    "react-instantsearch": "^7.29.0",
+    "@types/react": "^19",
+    "@types/react-dom": "^19",
     "tsup": "^8.4.0",
     "typescript": "^5.5.3"
-  },
-  "scripts": {
-    "build": "tsup src/index.ts --format esm --dts --external react --external react-dom --external react-instantsearch --external @tsproxy/js --tsconfig tsconfig.build.json",
-    "typecheck": "tsc --noEmit"
   }
-}
+}