@nymbalhq/react 0.0.0-stage → 0.2.0

package/dist/index.d.ts

@@ -0,0 +1,157 @@
+import React, { ReactNode } from 'react';
+import { NymbalClient, CartState, ProductState, DenormalisedVariant, ProductListState, ProductListParams, ProductSortKey, SearchState, CheckoutState, ShippingMethod, CheckoutResult, AuthState, RegisterParams } from '@nymbalhq/sdk';
+import { Address, Customer } from '@nymbalhq/types';
+
+interface NymbalProviderProps {
+    client: NymbalClient;
+    children: ReactNode;
+}
+declare function NymbalProvider({ client, children }: NymbalProviderProps): ReactNode;
+declare function useNymbalClient(): NymbalClient;
+
+interface UseCartReturn extends CartState {
+    addItem: (variantId: string, qty?: number) => Promise<void>;
+    removeItem: (variantId: string) => Promise<void>;
+    updateQuantity: (variantId: string, qty: number) => Promise<void>;
+    clear: () => Promise<void>;
+    load: () => Promise<void>;
+}
+declare function useCart(): UseCartReturn;
+
+interface UseProductReturn extends ProductState {
+    loadBySlug: (slug: string) => Promise<void>;
+    selectVariant: (variant: DenormalisedVariant | null) => void;
+}
+declare function useProduct(slug?: string): UseProductReturn;
+
+interface UseProductListReturn extends ProductListState {
+    load: (params?: ProductListParams) => Promise<void>;
+    loadMore: () => Promise<void>;
+    applyFilter: (name: string, value: string | string[]) => Promise<void>;
+    removeFilter: (name: string) => Promise<void>;
+    setSort: (sort: ProductSortKey) => Promise<void>;
+}
+declare function useProductList(): UseProductListReturn;
+
+interface UseSearchReturn extends SearchState {
+    search: (query: string) => Promise<void>;
+    clearSearch: () => void;
+}
+declare function useSearch(): UseSearchReturn;
+
+interface UseCheckoutReturn extends CheckoutState {
+    setEmail: (email: string) => void;
+    setShippingAddress: (address: Address) => void;
+    setBillingAddress: (address: Address) => void;
+    setShippingMethod: (method: ShippingMethod) => void;
+    submitPayment: () => Promise<CheckoutResult | null>;
+    markConfirmed: () => void;
+    reset: () => void;
+}
+declare function useCheckout(): UseCheckoutReturn;
+
+interface UseAuthReturn extends AuthState {
+    login: (email: string, password: string) => Promise<void>;
+    register: (params: RegisterParams) => Promise<void>;
+    logout: () => Promise<void>;
+    refreshToken: () => Promise<void>;
+    updateProfile: (updates: Partial<Pick<Customer, 'firstName' | 'lastName' | 'phone'>>) => Promise<void>;
+    loadProfile: () => Promise<void>;
+}
+declare function useAuth(): UseAuthReturn;
+
+declare module 'react' {
+    namespace JSX {
+        interface IntrinsicElements {
+            'nymbal-add-to-cart': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+            'nymbal-cart-drawer': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+            'nymbal-mini-cart': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+            'nymbal-variant-selector': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+            'nymbal-quantity-selector': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+            'nymbal-search-bar': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+            'nymbal-product-filter': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+            'nymbal-toast': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
+        }
+    }
+}
+interface AddToCartProps {
+    variantId?: string;
+    disabled?: boolean;
+    onItemAdded?: (event: CustomEvent<{
+        variantId: string;
+    }>) => void;
+    children?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+    'data-testid'?: string;
+}
+declare const AddToCart: React.ForwardRefExoticComponent<AddToCartProps & React.RefAttributes<HTMLElement>>;
+interface CartDrawerProps {
+    open?: boolean;
+    onCheckoutClick?: (event: CustomEvent<void>) => void;
+    className?: string;
+    style?: React.CSSProperties;
+    'data-testid'?: string;
+}
+declare const CartDrawer: React.ForwardRefExoticComponent<CartDrawerProps & React.RefAttributes<HTMLElement>>;
+interface MiniCartProps {
+    onClick?: (event: CustomEvent<void>) => void;
+    className?: string;
+    style?: React.CSSProperties;
+    'data-testid'?: string;
+}
+declare const MiniCart: React.ForwardRefExoticComponent<MiniCartProps & React.RefAttributes<HTMLElement>>;
+interface VariantSelectorProps {
+    options?: unknown;
+    onVariantSelected?: (event: CustomEvent<{
+        variant: unknown;
+    }>) => void;
+    className?: string;
+    style?: React.CSSProperties;
+    'data-testid'?: string;
+}
+declare const VariantSelector: React.ForwardRefExoticComponent<VariantSelectorProps & React.RefAttributes<HTMLElement>>;
+interface QuantitySelectorProps {
+    value?: number;
+    min?: number;
+    max?: number;
+    onQuantityChange?: (event: CustomEvent<{
+        value: number;
+    }>) => void;
+    className?: string;
+    style?: React.CSSProperties;
+    'data-testid'?: string;
+}
+declare const QuantitySelector: React.ForwardRefExoticComponent<QuantitySelectorProps & React.RefAttributes<HTMLElement>>;
+interface SearchBarProps {
+    placeholder?: string;
+    debounceMs?: number;
+    onSearchSelect?: (event: CustomEvent<{
+        product: unknown;
+    }>) => void;
+    className?: string;
+    style?: React.CSSProperties;
+    'data-testid'?: string;
+}
+declare const SearchBar: React.ForwardRefExoticComponent<SearchBarProps & React.RefAttributes<HTMLElement>>;
+interface ProductFilterProps {
+    facets?: unknown;
+    onFilterChange?: (event: CustomEvent<{
+        name: string;
+        value: string;
+    }>) => void;
+    className?: string;
+    style?: React.CSSProperties;
+    'data-testid'?: string;
+}
+declare const ProductFilter: React.ForwardRefExoticComponent<ProductFilterProps & React.RefAttributes<HTMLElement>>;
+interface ToastProps {
+    position?: string;
+    durationMs?: number;
+    className?: string;
+    style?: React.CSSProperties;
+    'data-testid'?: string;
+}
+declare const Toast: React.ForwardRefExoticComponent<ToastProps & React.RefAttributes<HTMLElement>>;
+
+export { AddToCart, type AddToCartProps, CartDrawer, type CartDrawerProps, MiniCart, type MiniCartProps, NymbalProvider, type NymbalProviderProps, ProductFilter, type ProductFilterProps, QuantitySelector, type QuantitySelectorProps, SearchBar, type SearchBarProps, Toast, type ToastProps, type UseAuthReturn, type UseCartReturn, type UseCheckoutReturn, type UseProductListReturn, type UseProductReturn, type UseSearchReturn, VariantSelector, type VariantSelectorProps, useAuth, useCart, useCheckout, useNymbalClient, useProduct, useProductList, useSearch };

package/dist/index.js

@@ -0,0 +1,367 @@
+// src/context.tsx
+import { createContext, useContext } from "react";
+import { jsx } from "react/jsx-runtime";
+var NymbalContext = createContext(null);
+function NymbalProvider({ client, children }) {
+  return /* @__PURE__ */ jsx(NymbalContext.Provider, { value: client, children });
+}
+function useNymbalClient() {
+  const client = useContext(NymbalContext);
+  if (!client) {
+    throw new Error("useNymbalClient must be used within <NymbalProvider>");
+  }
+  return client;
+}
+
+// src/hooks/use-cart.ts
+import { useSyncExternalStore } from "react";
+function useCart() {
+  const client = useNymbalClient();
+  const state = useSyncExternalStore(
+    client.cart.subscribe,
+    client.cart.getState,
+    client.cart.getState
+  );
+  return {
+    ...state,
+    addItem: client.cart.addItem,
+    removeItem: client.cart.removeItem,
+    updateQuantity: client.cart.updateQuantity,
+    clear: client.cart.clear,
+    load: client.cart.load
+  };
+}
+
+// src/hooks/use-product.ts
+import { useSyncExternalStore as useSyncExternalStore2, useEffect } from "react";
+function useProduct(slug) {
+  const client = useNymbalClient();
+  const state = useSyncExternalStore2(
+    client.product.subscribe,
+    client.product.getState,
+    client.product.getState
+  );
+  useEffect(() => {
+    if (slug) {
+      client.product.loadBySlug(slug);
+    }
+  }, [slug, client.product]);
+  return {
+    ...state,
+    loadBySlug: client.product.loadBySlug,
+    selectVariant: client.product.selectVariant
+  };
+}
+
+// src/hooks/use-product-list.ts
+import { useSyncExternalStore as useSyncExternalStore3 } from "react";
+function useProductList() {
+  const client = useNymbalClient();
+  const state = useSyncExternalStore3(
+    client.productList.subscribe,
+    client.productList.getState,
+    client.productList.getState
+  );
+  return {
+    ...state,
+    load: client.productList.load,
+    loadMore: client.productList.loadMore,
+    applyFilter: client.productList.applyFilter,
+    removeFilter: client.productList.removeFilter,
+    setSort: client.productList.setSort
+  };
+}
+
+// src/hooks/use-search.ts
+import { useSyncExternalStore as useSyncExternalStore4 } from "react";
+function useSearch() {
+  const client = useNymbalClient();
+  const state = useSyncExternalStore4(
+    client.search.subscribe,
+    client.search.getState,
+    client.search.getState
+  );
+  return {
+    ...state,
+    search: client.search.search,
+    clearSearch: client.search.clearSearch
+  };
+}
+
+// src/hooks/use-checkout.ts
+import { useSyncExternalStore as useSyncExternalStore5 } from "react";
+function useCheckout() {
+  const client = useNymbalClient();
+  const state = useSyncExternalStore5(
+    client.checkout.subscribe,
+    client.checkout.getState,
+    client.checkout.getState
+  );
+  return {
+    ...state,
+    setEmail: client.checkout.setEmail,
+    setShippingAddress: client.checkout.setShippingAddress,
+    setBillingAddress: client.checkout.setBillingAddress,
+    setShippingMethod: client.checkout.setShippingMethod,
+    submitPayment: client.checkout.submitPayment,
+    markConfirmed: client.checkout.markConfirmed,
+    reset: client.checkout.reset
+  };
+}
+
+// src/hooks/use-auth.ts
+import { useSyncExternalStore as useSyncExternalStore6 } from "react";
+function useAuth() {
+  const client = useNymbalClient();
+  const state = useSyncExternalStore6(
+    client.auth.subscribe,
+    client.auth.getState,
+    client.auth.getState
+  );
+  return {
+    ...state,
+    login: client.auth.login,
+    register: client.auth.register,
+    logout: client.auth.logout,
+    refreshToken: client.auth.refreshToken,
+    updateProfile: client.auth.updateProfile,
+    loadProfile: client.auth.loadProfile
+  };
+}
+
+// src/generated/wrappers.tsx
+import { forwardRef, useRef, useEffect as useEffect2 } from "react";
+import "@nymbalhq/web-components";
+import { jsx as jsx2 } from "react/jsx-runtime";
+var AddToCart = forwardRef(
+  function AddToCart2(props, forwardedRef) {
+    const innerRef = useRef(null);
+    const ref = forwardedRef ?? innerRef;
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el) return;
+      if (props.variantId !== void 0) {
+        el.setAttribute("variant-id", String(props.variantId));
+      } else {
+        el.removeAttribute("variant-id");
+      }
+    }, [props.variantId]);
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el) return;
+      if (props.disabled) {
+        el.setAttribute("disabled", "");
+      } else {
+        el.removeAttribute("disabled");
+      }
+    }, [props.disabled]);
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el || !props.onItemAdded) return;
+      const handler = props.onItemAdded;
+      el.addEventListener("nymbal:cart:item-added", handler);
+      return () => el.removeEventListener("nymbal:cart:item-added", handler);
+    }, [props.onItemAdded]);
+    return /* @__PURE__ */ jsx2("nymbal-add-to-cart", { ref, className: props.className, style: props.style, "data-testid": props["data-testid"], children: props.children });
+  }
+);
+var CartDrawer = forwardRef(
+  function CartDrawer2(props, forwardedRef) {
+    const innerRef = useRef(null);
+    const ref = forwardedRef ?? innerRef;
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el) return;
+      if (props.open) {
+        el.setAttribute("open", "");
+      } else {
+        el.removeAttribute("open");
+      }
+    }, [props.open]);
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el || !props.onCheckoutClick) return;
+      const handler = props.onCheckoutClick;
+      el.addEventListener("nymbal:cart:checkout-clicked", handler);
+      return () => el.removeEventListener("nymbal:cart:checkout-clicked", handler);
+    }, [props.onCheckoutClick]);
+    return /* @__PURE__ */ jsx2("nymbal-cart-drawer", { ref, className: props.className, style: props.style, "data-testid": props["data-testid"] });
+  }
+);
+var MiniCart = forwardRef(
+  function MiniCart2(props, forwardedRef) {
+    const innerRef = useRef(null);
+    const ref = forwardedRef ?? innerRef;
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el || !props.onClick) return;
+      const handler = props.onClick;
+      el.addEventListener("nymbal:mini-cart:clicked", handler);
+      return () => el.removeEventListener("nymbal:mini-cart:clicked", handler);
+    }, [props.onClick]);
+    return /* @__PURE__ */ jsx2("nymbal-mini-cart", { ref, className: props.className, style: props.style, "data-testid": props["data-testid"] });
+  }
+);
+var VariantSelector = forwardRef(
+  function VariantSelector2(props, forwardedRef) {
+    const innerRef = useRef(null);
+    const ref = forwardedRef ?? innerRef;
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el) return;
+      if (props.options !== void 0) {
+        el.setAttribute("options", JSON.stringify(props.options));
+      } else {
+        el.removeAttribute("options");
+      }
+    }, [props.options]);
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el || !props.onVariantSelected) return;
+      const handler = props.onVariantSelected;
+      el.addEventListener("nymbal:variant:selected", handler);
+      return () => el.removeEventListener("nymbal:variant:selected", handler);
+    }, [props.onVariantSelected]);
+    return /* @__PURE__ */ jsx2("nymbal-variant-selector", { ref, className: props.className, style: props.style, "data-testid": props["data-testid"] });
+  }
+);
+var QuantitySelector = forwardRef(
+  function QuantitySelector2(props, forwardedRef) {
+    const innerRef = useRef(null);
+    const ref = forwardedRef ?? innerRef;
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el) return;
+      if (props.value !== void 0) {
+        el.setAttribute("value", String(props.value));
+      } else {
+        el.removeAttribute("value");
+      }
+    }, [props.value]);
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el) return;
+      if (props.min !== void 0) {
+        el.setAttribute("min", String(props.min));
+      } else {
+        el.removeAttribute("min");
+      }
+    }, [props.min]);
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el) return;
+      if (props.max !== void 0) {
+        el.setAttribute("max", String(props.max));
+      } else {
+        el.removeAttribute("max");
+      }
+    }, [props.max]);
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el || !props.onQuantityChange) return;
+      const handler = props.onQuantityChange;
+      el.addEventListener("nymbal:quantity:changed", handler);
+      return () => el.removeEventListener("nymbal:quantity:changed", handler);
+    }, [props.onQuantityChange]);
+    return /* @__PURE__ */ jsx2("nymbal-quantity-selector", { ref, className: props.className, style: props.style, "data-testid": props["data-testid"] });
+  }
+);
+var SearchBar = forwardRef(
+  function SearchBar2(props, forwardedRef) {
+    const innerRef = useRef(null);
+    const ref = forwardedRef ?? innerRef;
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el) return;
+      if (props.placeholder !== void 0) {
+        el.setAttribute("placeholder", String(props.placeholder));
+      } else {
+        el.removeAttribute("placeholder");
+      }
+    }, [props.placeholder]);
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el) return;
+      if (props.debounceMs !== void 0) {
+        el.setAttribute("debounce-ms", String(props.debounceMs));
+      } else {
+        el.removeAttribute("debounce-ms");
+      }
+    }, [props.debounceMs]);
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el || !props.onSearchSelect) return;
+      const handler = props.onSearchSelect;
+      el.addEventListener("nymbal:search:selected", handler);
+      return () => el.removeEventListener("nymbal:search:selected", handler);
+    }, [props.onSearchSelect]);
+    return /* @__PURE__ */ jsx2("nymbal-search-bar", { ref, className: props.className, style: props.style, "data-testid": props["data-testid"] });
+  }
+);
+var ProductFilter = forwardRef(
+  function ProductFilter2(props, forwardedRef) {
+    const innerRef = useRef(null);
+    const ref = forwardedRef ?? innerRef;
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el) return;
+      if (props.facets !== void 0) {
+        el.setAttribute("facets", JSON.stringify(props.facets));
+      } else {
+        el.removeAttribute("facets");
+      }
+    }, [props.facets]);
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el || !props.onFilterChange) return;
+      const handler = props.onFilterChange;
+      el.addEventListener("nymbal:filter:changed", handler);
+      return () => el.removeEventListener("nymbal:filter:changed", handler);
+    }, [props.onFilterChange]);
+    return /* @__PURE__ */ jsx2("nymbal-product-filter", { ref, className: props.className, style: props.style, "data-testid": props["data-testid"] });
+  }
+);
+var Toast = forwardRef(
+  function Toast2(props, forwardedRef) {
+    const innerRef = useRef(null);
+    const ref = forwardedRef ?? innerRef;
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el) return;
+      if (props.position !== void 0) {
+        el.setAttribute("position", String(props.position));
+      } else {
+        el.removeAttribute("position");
+      }
+    }, [props.position]);
+    useEffect2(() => {
+      const el = ref.current;
+      if (!el) return;
+      if (props.durationMs !== void 0) {
+        el.setAttribute("duration-ms", String(props.durationMs));
+      } else {
+        el.removeAttribute("duration-ms");
+      }
+    }, [props.durationMs]);
+    return /* @__PURE__ */ jsx2("nymbal-toast", { ref, className: props.className, style: props.style, "data-testid": props["data-testid"] });
+  }
+);
+export {
+  AddToCart,
+  CartDrawer,
+  MiniCart,
+  NymbalProvider,
+  ProductFilter,
+  QuantitySelector,
+  SearchBar,
+  Toast,
+  VariantSelector,
+  useAuth,
+  useCart,
+  useCheckout,
+  useNymbalClient,
+  useProduct,
+  useProductList,
+  useSearch
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/context.tsx","../src/hooks/use-cart.ts","../src/hooks/use-product.ts","../src/hooks/use-product-list.ts","../src/hooks/use-search.ts","../src/hooks/use-checkout.ts","../src/hooks/use-auth.ts","../src/generated/wrappers.tsx"],"sourcesContent":["import { createContext, useContext, type ReactNode } from 'react'\nimport type { NymbalClient } from '@nymbalhq/sdk'\n\nconst NymbalContext = createContext<NymbalClient | null>(null)\n\nexport interface NymbalProviderProps {\n  client: NymbalClient\n  children: ReactNode\n}\n\nexport function NymbalProvider({ client, children }: NymbalProviderProps): ReactNode {\n  return <NymbalContext.Provider value={client}>{children}</NymbalContext.Provider>\n}\n\nexport function useNymbalClient(): NymbalClient {\n  const client = useContext(NymbalContext)\n  if (!client) {\n    throw new Error('useNymbalClient must be used within <NymbalProvider>')\n  }\n  return client\n}\n","import { useSyncExternalStore } from 'react'\nimport type { CartState } from '@nymbalhq/sdk'\nimport { useNymbalClient } from '../context.js'\n\nexport interface UseCartReturn extends CartState {\n  addItem: (variantId: string, qty?: number) => Promise<void>\n  removeItem: (variantId: string) => Promise<void>\n  updateQuantity: (variantId: string, qty: number) => Promise<void>\n  clear: () => Promise<void>\n  load: () => Promise<void>\n}\n\nexport function useCart(): UseCartReturn {\n  const client = useNymbalClient()\n  const state = useSyncExternalStore(\n    client.cart.subscribe,\n    client.cart.getState,\n    client.cart.getState,\n  )\n  return {\n    ...state,\n    addItem: client.cart.addItem,\n    removeItem: client.cart.removeItem,\n    updateQuantity: client.cart.updateQuantity,\n    clear: client.cart.clear,\n    load: client.cart.load,\n  }\n}\n","import { useSyncExternalStore, useEffect } from 'react'\nimport type { ProductState, DenormalisedVariant } from '@nymbalhq/sdk'\nimport { useNymbalClient } from '../context.js'\n\nexport interface UseProductReturn extends ProductState {\n  loadBySlug: (slug: string) => Promise<void>\n  selectVariant: (variant: DenormalisedVariant | null) => void\n}\n\nexport function useProduct(slug?: string): UseProductReturn {\n  const client = useNymbalClient()\n  const state = useSyncExternalStore(\n    client.product.subscribe,\n    client.product.getState,\n    client.product.getState,\n  )\n\n  useEffect(() => {\n    if (slug) {\n      client.product.loadBySlug(slug)\n    }\n  }, [slug, client.product])\n\n  return {\n    ...state,\n    loadBySlug: client.product.loadBySlug,\n    selectVariant: client.product.selectVariant,\n  }\n}\n","import { useSyncExternalStore } from 'react'\nimport type { ProductListState, ProductListParams, ProductSortKey } from '@nymbalhq/sdk'\nimport { useNymbalClient } from '../context.js'\n\nexport interface UseProductListReturn extends ProductListState {\n  load: (params?: ProductListParams) => Promise<void>\n  loadMore: () => Promise<void>\n  applyFilter: (name: string, value: string | string[]) => Promise<void>\n  removeFilter: (name: string) => Promise<void>\n  setSort: (sort: ProductSortKey) => Promise<void>\n}\n\nexport function useProductList(): UseProductListReturn {\n  const client = useNymbalClient()\n  const state = useSyncExternalStore(\n    client.productList.subscribe,\n    client.productList.getState,\n    client.productList.getState,\n  )\n  return {\n    ...state,\n    load: client.productList.load,\n    loadMore: client.productList.loadMore,\n    applyFilter: client.productList.applyFilter,\n    removeFilter: client.productList.removeFilter,\n    setSort: client.productList.setSort,\n  }\n}\n","import { useSyncExternalStore } from 'react'\nimport type { SearchState } from '@nymbalhq/sdk'\nimport { useNymbalClient } from '../context.js'\n\nexport interface UseSearchReturn extends SearchState {\n  search: (query: string) => Promise<void>\n  clearSearch: () => void\n}\n\nexport function useSearch(): UseSearchReturn {\n  const client = useNymbalClient()\n  const state = useSyncExternalStore(\n    client.search.subscribe,\n    client.search.getState,\n    client.search.getState,\n  )\n  return {\n    ...state,\n    search: client.search.search,\n    clearSearch: client.search.clearSearch,\n  }\n}\n","import { useSyncExternalStore } from 'react'\nimport type { Address } from '@nymbalhq/types'\nimport type { CheckoutResult, CheckoutState, ShippingMethod } from '@nymbalhq/sdk'\nimport { useNymbalClient } from '../context.js'\n\nexport interface UseCheckoutReturn extends CheckoutState {\n  setEmail: (email: string) => void\n  setShippingAddress: (address: Address) => void\n  setBillingAddress: (address: Address) => void\n  setShippingMethod: (method: ShippingMethod) => void\n  submitPayment: () => Promise<CheckoutResult | null>\n  markConfirmed: () => void\n  reset: () => void\n}\n\nexport function useCheckout(): UseCheckoutReturn {\n  const client = useNymbalClient()\n  const state = useSyncExternalStore(\n    client.checkout.subscribe,\n    client.checkout.getState,\n    client.checkout.getState,\n  )\n  return {\n    ...state,\n    setEmail: client.checkout.setEmail,\n    setShippingAddress: client.checkout.setShippingAddress,\n    setBillingAddress: client.checkout.setBillingAddress,\n    setShippingMethod: client.checkout.setShippingMethod,\n    submitPayment: client.checkout.submitPayment,\n    markConfirmed: client.checkout.markConfirmed,\n    reset: client.checkout.reset,\n  }\n}\n","import { useSyncExternalStore } from 'react'\nimport type { Customer } from '@nymbalhq/types'\nimport type { AuthState, RegisterParams } from '@nymbalhq/sdk'\nimport { useNymbalClient } from '../context.js'\n\nexport interface UseAuthReturn extends AuthState {\n  login: (email: string, password: string) => Promise<void>\n  register: (params: RegisterParams) => Promise<void>\n  logout: () => Promise<void>\n  refreshToken: () => Promise<void>\n  updateProfile: (updates: Partial<Pick<Customer, 'firstName' | 'lastName' | 'phone'>>) => Promise<void>\n  loadProfile: () => Promise<void>\n}\n\nexport function useAuth(): UseAuthReturn {\n  const client = useNymbalClient()\n  const state = useSyncExternalStore(\n    client.auth.subscribe,\n    client.auth.getState,\n    client.auth.getState,\n  )\n  return {\n    ...state,\n    login: client.auth.login,\n    register: client.auth.register,\n    logout: client.auth.logout,\n    refreshToken: client.auth.refreshToken,\n    updateProfile: client.auth.updateProfile,\n    loadProfile: client.auth.loadProfile,\n  }\n}\n","// AUTO-GENERATED by scripts/generate-wrappers.ts — DO NOT EDIT\nimport React, { forwardRef, useRef, useEffect } from 'react'\n\nimport '@nymbalhq/web-components'\n\ndeclare module 'react' {\n  namespace JSX {\n    interface IntrinsicElements {\n      'nymbal-add-to-cart': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>\n      'nymbal-cart-drawer': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>\n      'nymbal-mini-cart': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>\n      'nymbal-variant-selector': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>\n      'nymbal-quantity-selector': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>\n      'nymbal-search-bar': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>\n      'nymbal-product-filter': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>\n      'nymbal-toast': React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>\n    }\n  }\n}\n\nexport interface AddToCartProps {\n  variantId?: string\n  disabled?: boolean\n  onItemAdded?: (event: CustomEvent<{ variantId: string }>) => void\n  children?: React.ReactNode\n  className?: string\n  style?: React.CSSProperties\n  'data-testid'?: string\n}\n\nexport const AddToCart = forwardRef<HTMLElement, AddToCartProps>(\n  function AddToCart(props, forwardedRef) {\n    const innerRef = useRef<HTMLElement>(null)\n    const ref = (forwardedRef ?? innerRef) as React.RefObject<HTMLElement | null>\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (props.variantId !== undefined) {\n      el.setAttribute('variant-id', String(props.variantId))\n    } else {\n      el.removeAttribute('variant-id')\n    }\n  }, [props.variantId])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (props.disabled) {\n      el.setAttribute('disabled', '')\n    } else {\n      el.removeAttribute('disabled')\n    }\n  }, [props.disabled])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el || !props.onItemAdded) return\n    const handler = props.onItemAdded as EventListener\n    el.addEventListener('nymbal:cart:item-added', handler)\n    return () => el.removeEventListener('nymbal:cart:item-added', handler)\n  }, [props.onItemAdded])\n\n    return (\n      <nymbal-add-to-cart ref={ref as React.Ref<HTMLElement>} className={props.className} style={props.style} data-testid={props['data-testid']}>\n        {props.children}\n      </nymbal-add-to-cart>\n    )\n  },\n)\n\nexport interface CartDrawerProps {\n  open?: boolean\n  onCheckoutClick?: (event: CustomEvent<void>) => void\n  className?: string\n  style?: React.CSSProperties\n  'data-testid'?: string\n}\n\nexport const CartDrawer = forwardRef<HTMLElement, CartDrawerProps>(\n  function CartDrawer(props, forwardedRef) {\n    const innerRef = useRef<HTMLElement>(null)\n    const ref = (forwardedRef ?? innerRef) as React.RefObject<HTMLElement | null>\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (props.open) {\n      el.setAttribute('open', '')\n    } else {\n      el.removeAttribute('open')\n    }\n  }, [props.open])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el || !props.onCheckoutClick) return\n    const handler = props.onCheckoutClick as EventListener\n    el.addEventListener('nymbal:cart:checkout-clicked', handler)\n    return () => el.removeEventListener('nymbal:cart:checkout-clicked', handler)\n  }, [props.onCheckoutClick])\n\n    return (\n      <nymbal-cart-drawer ref={ref as React.Ref<HTMLElement>} className={props.className} style={props.style} data-testid={props['data-testid']}>\n        \n      </nymbal-cart-drawer>\n    )\n  },\n)\n\nexport interface MiniCartProps {\n  onClick?: (event: CustomEvent<void>) => void\n  className?: string\n  style?: React.CSSProperties\n  'data-testid'?: string\n}\n\nexport const MiniCart = forwardRef<HTMLElement, MiniCartProps>(\n  function MiniCart(props, forwardedRef) {\n    const innerRef = useRef<HTMLElement>(null)\n    const ref = (forwardedRef ?? innerRef) as React.RefObject<HTMLElement | null>\n\n\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el || !props.onClick) return\n    const handler = props.onClick as EventListener\n    el.addEventListener('nymbal:mini-cart:clicked', handler)\n    return () => el.removeEventListener('nymbal:mini-cart:clicked', handler)\n  }, [props.onClick])\n\n    return (\n      <nymbal-mini-cart ref={ref as React.Ref<HTMLElement>} className={props.className} style={props.style} data-testid={props['data-testid']}>\n        \n      </nymbal-mini-cart>\n    )\n  },\n)\n\nexport interface VariantSelectorProps {\n  options?: unknown\n  onVariantSelected?: (event: CustomEvent<{ variant: unknown }>) => void\n  className?: string\n  style?: React.CSSProperties\n  'data-testid'?: string\n}\n\nexport const VariantSelector = forwardRef<HTMLElement, VariantSelectorProps>(\n  function VariantSelector(props, forwardedRef) {\n    const innerRef = useRef<HTMLElement>(null)\n    const ref = (forwardedRef ?? innerRef) as React.RefObject<HTMLElement | null>\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (props.options !== undefined) {\n      el.setAttribute('options', JSON.stringify(props.options))\n    } else {\n      el.removeAttribute('options')\n    }\n  }, [props.options])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el || !props.onVariantSelected) return\n    const handler = props.onVariantSelected as EventListener\n    el.addEventListener('nymbal:variant:selected', handler)\n    return () => el.removeEventListener('nymbal:variant:selected', handler)\n  }, [props.onVariantSelected])\n\n    return (\n      <nymbal-variant-selector ref={ref as React.Ref<HTMLElement>} className={props.className} style={props.style} data-testid={props['data-testid']}>\n        \n      </nymbal-variant-selector>\n    )\n  },\n)\n\nexport interface QuantitySelectorProps {\n  value?: number\n  min?: number\n  max?: number\n  onQuantityChange?: (event: CustomEvent<{ value: number }>) => void\n  className?: string\n  style?: React.CSSProperties\n  'data-testid'?: string\n}\n\nexport const QuantitySelector = forwardRef<HTMLElement, QuantitySelectorProps>(\n  function QuantitySelector(props, forwardedRef) {\n    const innerRef = useRef<HTMLElement>(null)\n    const ref = (forwardedRef ?? innerRef) as React.RefObject<HTMLElement | null>\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (props.value !== undefined) {\n      el.setAttribute('value', String(props.value))\n    } else {\n      el.removeAttribute('value')\n    }\n  }, [props.value])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (props.min !== undefined) {\n      el.setAttribute('min', String(props.min))\n    } else {\n      el.removeAttribute('min')\n    }\n  }, [props.min])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (props.max !== undefined) {\n      el.setAttribute('max', String(props.max))\n    } else {\n      el.removeAttribute('max')\n    }\n  }, [props.max])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el || !props.onQuantityChange) return\n    const handler = props.onQuantityChange as EventListener\n    el.addEventListener('nymbal:quantity:changed', handler)\n    return () => el.removeEventListener('nymbal:quantity:changed', handler)\n  }, [props.onQuantityChange])\n\n    return (\n      <nymbal-quantity-selector ref={ref as React.Ref<HTMLElement>} className={props.className} style={props.style} data-testid={props['data-testid']}>\n        \n      </nymbal-quantity-selector>\n    )\n  },\n)\n\nexport interface SearchBarProps {\n  placeholder?: string\n  debounceMs?: number\n  onSearchSelect?: (event: CustomEvent<{ product: unknown }>) => void\n  className?: string\n  style?: React.CSSProperties\n  'data-testid'?: string\n}\n\nexport const SearchBar = forwardRef<HTMLElement, SearchBarProps>(\n  function SearchBar(props, forwardedRef) {\n    const innerRef = useRef<HTMLElement>(null)\n    const ref = (forwardedRef ?? innerRef) as React.RefObject<HTMLElement | null>\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (props.placeholder !== undefined) {\n      el.setAttribute('placeholder', String(props.placeholder))\n    } else {\n      el.removeAttribute('placeholder')\n    }\n  }, [props.placeholder])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (props.debounceMs !== undefined) {\n      el.setAttribute('debounce-ms', String(props.debounceMs))\n    } else {\n      el.removeAttribute('debounce-ms')\n    }\n  }, [props.debounceMs])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el || !props.onSearchSelect) return\n    const handler = props.onSearchSelect as EventListener\n    el.addEventListener('nymbal:search:selected', handler)\n    return () => el.removeEventListener('nymbal:search:selected', handler)\n  }, [props.onSearchSelect])\n\n    return (\n      <nymbal-search-bar ref={ref as React.Ref<HTMLElement>} className={props.className} style={props.style} data-testid={props['data-testid']}>\n        \n      </nymbal-search-bar>\n    )\n  },\n)\n\nexport interface ProductFilterProps {\n  facets?: unknown\n  onFilterChange?: (event: CustomEvent<{ name: string; value: string }>) => void\n  className?: string\n  style?: React.CSSProperties\n  'data-testid'?: string\n}\n\nexport const ProductFilter = forwardRef<HTMLElement, ProductFilterProps>(\n  function ProductFilter(props, forwardedRef) {\n    const innerRef = useRef<HTMLElement>(null)\n    const ref = (forwardedRef ?? innerRef) as React.RefObject<HTMLElement | null>\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (props.facets !== undefined) {\n      el.setAttribute('facets', JSON.stringify(props.facets))\n    } else {\n      el.removeAttribute('facets')\n    }\n  }, [props.facets])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el || !props.onFilterChange) return\n    const handler = props.onFilterChange as EventListener\n    el.addEventListener('nymbal:filter:changed', handler)\n    return () => el.removeEventListener('nymbal:filter:changed', handler)\n  }, [props.onFilterChange])\n\n    return (\n      <nymbal-product-filter ref={ref as React.Ref<HTMLElement>} className={props.className} style={props.style} data-testid={props['data-testid']}>\n        \n      </nymbal-product-filter>\n    )\n  },\n)\n\nexport interface ToastProps {\n  position?: string\n  durationMs?: number\n  className?: string\n  style?: React.CSSProperties\n  'data-testid'?: string\n}\n\nexport const Toast = forwardRef<HTMLElement, ToastProps>(\n  function Toast(props, forwardedRef) {\n    const innerRef = useRef<HTMLElement>(null)\n    const ref = (forwardedRef ?? innerRef) as React.RefObject<HTMLElement | null>\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (props.position !== undefined) {\n      el.setAttribute('position', String(props.position))\n    } else {\n      el.removeAttribute('position')\n    }\n  }, [props.position])\n\n  useEffect(() => {\n    const el = ref.current\n    if (!el) return\n    if (props.durationMs !== undefined) {\n      el.setAttribute('duration-ms', String(props.durationMs))\n    } else {\n      el.removeAttribute('duration-ms')\n    }\n  }, [props.durationMs])\n\n\n\n    return (\n      <nymbal-toast ref={ref as React.Ref<HTMLElement>} className={props.className} style={props.style} data-testid={props['data-testid']}>\n        \n      </nymbal-toast>\n    )\n  },\n)\n"],"mappings":"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","names":["useSyncExternalStore","useSyncExternalStore","useSyncExternalStore","useSyncExternalStore","useSyncExternalStore","useSyncExternalStore","useSyncExternalStore","useSyncExternalStore","useSyncExternalStore","useSyncExternalStore","useEffect","jsx","AddToCart","CartDrawer","MiniCart","VariantSelector","QuantitySelector","SearchBar","ProductFilter","Toast"]}

package/package.json

@@ -1,6 +1,57 @@
 {
   "name": "@nymbalhq/react",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
+  "version": "0.2.0",
+  "description": "React bindings for the Nymbal commerce SDK",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/nymbalhq/nymbal.git",
+    "directory": "packages/react"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "type": "module",
+  "engines": {
+    "node": ">=22"
+  },
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "@nymbalhq/sdk": "0.2.0",
+    "@nymbalhq/web-components": "0.2.0",
+    "@nymbalhq/types": "0.2.0"
+  },
+  "peerDependencies": {
+    "react": ">=19.0.0",
+    "react-dom": ">=19.0.0"
+  },
+  "devDependencies": {
+    "@testing-library/jest-dom": "^6.4.0",
+    "@testing-library/react": "^16.0.0",
+    "@types/react": "^19.3.0",
+    "@types/react-dom": "^19.3.0",
+    "react": "^19.3.1",
+    "react-dom": "^19.3.1",
+    "tsup": "^8.3.5",
+    "tsx": "^4.19.2",
+    "typescript": "^5.6.3",
+    "vitest": "^3.0.0"
+  },
+  "scripts": {
+    "build": "tsx scripts/generate-wrappers.ts && tsup",
+    "dev": "tsup --watch",
+    "typecheck": "tsc -p tsconfig.json --noEmit",
+    "generate": "tsx scripts/generate-wrappers.ts",
+    "check:generated": "tsx scripts/generate-wrappers.ts --check"
+  }
 }

package/README.md

@@ -1,3 +0,0 @@
-# Temporary Holding Version
-
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.