@fencyai/react 0.1.2

package/README.md

@@ -0,0 +1,206 @@
+# @fencyai/react
+
+React components for Fency integration. Provides React hooks and components for easy Fency integration in React applications.
+
+## Installation
+
+```bash
+npm install @fencyai/react
+```
+
+## Usage
+
+### Basic Usage
+
+```jsx
+import { ChatCompletionProvider, useChatCompletion } from '@fencyai/react';
+
+function App() {
+  return (
+    <ChatCompletionProvider publishableKey="pk_test_your_publishable_key_here">
+      <ChatComponent />
+    </ChatCompletionProvider>
+  );
+}
+
+function ChatComponent() {
+  const { fency, loading, error, sendMessage } = useChatCompletion();
+  
+  if (loading) return <div>Loading Fency...</div>;
+  if (error) return <div>Error: {error.message}</div>;
+  
+  const handleSendMessage = async () => {
+    try {
+      await sendMessage("Hello, how are you?");
+    } catch (err) {
+      console.error('Failed to send message:', err);
+    }
+  };
+  
+  return (
+    <div>
+      <p>Fency loaded: {fency.publishableKey}</p>
+      <p>Version: {fency.version}</p>
+      <button onClick={handleSendMessage}>Send Message</button>
+    </div>
+  );
+}
+```
+
+### With Configuration Options
+
+```jsx
+import { ChatCompletionProvider, useChatCompletion } from '@fencyai/react';
+
+function App() {
+  return (
+    <ChatCompletionProvider 
+      publishableKey="pk_test_your_key"
+      options={{
+        config: {
+          apiVersion: '2024-01-01',
+          endpoint: 'https://api.fency.ai'
+        }
+      }}
+    >
+      <ChatComponent />
+    </ChatCompletionProvider>
+  );
+}
+```
+
+### Error Handling
+
+```jsx
+import { ChatCompletionProvider, useChatCompletion } from '@fencyai/react';
+
+function ChatComponent() {
+  const { fency, loading, error, sendMessage } = useChatCompletion();
+  
+  if (loading) return <div>Loading...</div>;
+  if (error) {
+    return (
+      <div>
+        <h3>Failed to load Fency</h3>
+        <p>{error.message}</p>
+      </div>
+    );
+  }
+  
+  return <div>Fency is ready!</div>;
+}
+```
+
+## API Reference
+
+### `ChatCompletionProvider`
+
+React context provider that loads and provides Fency instance for chat completion functionality.
+
+**Props:**
+- `publishableKey` (string): Your Fency publishable key (must start with `pk_`)
+- `options` (object, optional): Configuration options
+  - `config.apiVersion` (string, optional): API version to use (default: `'2024-01-01'`)
+  - `config.endpoint` (string, optional): Custom endpoint URL (default: `'https://api.fency.ai'`)
+
+### `useChatCompletion()`
+
+React hook that provides access to chat completion functionality and Fency instance.
+
+**Returns:** `{ fency, loading, error, sendMessage }`
+- `fency` (FencyInstance | null): The loaded Fency instance
+- `loading` (boolean): Whether Fency is currently loading
+- `error` (Error | null): Any error that occurred during loading
+- `sendMessage` (function): Function to send messages for chat completion
+
+## Development
+
+### Prerequisites
+
+- Node.js 16.0.0 or higher
+- npm
+
+### Versioning
+
+This project follows [Semantic Versioning](https://semver.org/). See [VERSIONING.md](./VERSIONING.md) for detailed guidelines.
+
+**Quick version commands:**
+```bash
+npm run version:patch    # Bug fixes (0.1.0 → 0.1.1)
+npm run version:minor    # New features (0.1.0 → 0.2.0)  
+npm run version:major    # Breaking changes (0.1.0 → 1.0.0)
+```
+
+### Setup
+
+1. Clone the repository:
+```bash
+git clone https://github.com/fencyai/fency-react.git
+cd fency-react
+```
+
+2. Install dependencies:
+```bash
+npm install
+```
+
+3. Start development mode:
+```bash
+npm run dev
+```
+
+### Build
+
+Build the project for production:
+```bash
+npm run build
+```
+
+This will:
+- Compile TypeScript to JavaScript
+- Generate type definitions
+- Bundle and minify the code for browser use
+
+### Publishing
+
+Before publishing, make sure to:
+
+1. Update the version: `npm run version:patch|minor|major`
+2. Update the CHANGELOG.md with your changes
+3. Build the project: `npm run build`
+4. Publish to npm: `npm publish`
+
+**Quick publish commands:**
+```bash
+npm run publish:patch    # Bump patch + publish
+npm run publish:minor    # Bump minor + publish
+npm run publish:major    # Bump major + publish
+```
+
+## Project Structure
+
+```
+fency-react/
+├── src/
+│   └── index.ts          # Main entry point with React components and hooks
+├── dist/                 # Built files (generated)
+├── package.json          # Package configuration
+├── tsconfig.json         # TypeScript configuration
+└── README.md            # This file
+```
+
+## Features
+
+- ✅ React hooks and components for easy integration
+- ✅ TypeScript support with full type definitions
+- ✅ ESM module format for modern browsers
+- ✅ Tree-shakable exports
+- ✅ Minified production builds
+- ✅ Context-based state management
+- ✅ Publishable key validation
+- ✅ Loading and error states
+- ✅ npm package ready
+
+## License
+
+MIT 

package/dist/index.d.ts

@@ -0,0 +1,51 @@
+import { FencyInstance, FencyOptions } from '@fencyai/js';
+import { ReactNode } from 'react';
+/**
+ * Context for Fency instance
+ */
+interface FencyContext {
+    fency: FencyInstance | null;
+    loading: boolean;
+    error: Error | null;
+}
+declare const FencyContext: import("react").Context<FencyContext | undefined>;
+/**
+ * Props for FencyProvider
+ */
+interface FencyProviderProps {
+    publishableKey: string;
+    options?: Omit<FencyOptions, 'publishableKey'>;
+    children: ReactNode;
+}
+/**
+ * Provider component that loads and provides Fency instance to child components
+ */
+export declare function FencyProvider({ publishableKey, options, children }: FencyProviderProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Hook to access Fency instance and loading state
+ */
+export declare function useFency(): FencyContext;
+/**
+ * Props for ChatCompletionProvider
+ */
+interface ChatCompletionProviderProps {
+    publishableKey: string;
+    options?: Omit<FencyOptions, 'publishableKey'>;
+    children: ReactNode;
+}
+/**
+ * Provider component specifically for chat completion functionality
+ * This wraps FencyProvider and provides chat-specific context
+ */
+export declare function ChatCompletionProvider({ publishableKey, options, children }: ChatCompletionProviderProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Hook to access chat completion functionality
+ */
+export declare function useChatCompletion(): {
+    fency: FencyInstance | null;
+    loading: boolean;
+    error: Error | null;
+    sendMessage: (message: string) => Promise<void>;
+};
+export type { FencyInstance, FencyOptions } from '@fencyai/js';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,YAAY,EAAa,MAAM,aAAa,CAAC;AACrE,OAAO,EAAiB,SAAS,EAAmC,MAAM,OAAO,CAAC;AAElF;;GAEG;AACH,UAAU,YAAY;IACpB,KAAK,EAAE,aAAa,GAAG,IAAI,CAAC;IAC5B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,KAAK,GAAG,IAAI,CAAC;CACrB;AAED,QAAA,MAAM,YAAY,mDAAqD,CAAC;AAExE;;GAEG;AACH,UAAU,kBAAkB;IAC1B,cAAc,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,gBAAgB,CAAC,CAAC;IAC/C,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;GAEG;AACH,wBAAgB,aAAa,CAAC,EAAE,cAAc,EAAE,OAAY,EAAE,QAAQ,EAAE,EAAE,kBAAkB,2CA8B3F;AAED;;GAEG;AACH,wBAAgB,QAAQ,iBAMvB;AAED;;GAEG;AACH,UAAU,2BAA2B;IACnC,cAAc,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,gBAAgB,CAAC,CAAC;IAC/C,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;GAGG;AACH,wBAAgB,sBAAsB,CAAC,EAAE,cAAc,EAAE,OAAY,EAAE,QAAQ,EAAE,EAAE,2BAA2B,2CAM7G;AAED;;GAEG;AACH,wBAAgB,iBAAiB;;;;2BAQA,MAAM;EAQtC;AAGD,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC"}

package/dist/index.js

@@ -0,0 +1,25 @@
+var Y=Object.create;var R=Object.defineProperty;var G=Object.getOwnPropertyDescriptor;var Q=Object.getOwnPropertyNames;var X=Object.getPrototypeOf,Z=Object.prototype.hasOwnProperty;var h=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports);var ee=(e,t,r,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of Q(t))!Z.call(e,o)&&o!==r&&R(e,o,{get:()=>t[o],enumerable:!(n=G(t,o))||n.enumerable});return e};var S=(e,t,r)=>(r=e!=null?Y(X(e)):{},ee(t||!e||!e.__esModule?R(r,"default",{value:e,enumerable:!0}):r,e));var M=h(u=>{"use strict";var d=Symbol.for("react.element"),te=Symbol.for("react.portal"),re=Symbol.for("react.fragment"),ne=Symbol.for("react.strict_mode"),oe=Symbol.for("react.profiler"),ue=Symbol.for("react.provider"),ie=Symbol.for("react.context"),se=Symbol.for("react.forward_ref"),ce=Symbol.for("react.suspense"),le=Symbol.for("react.memo"),fe=Symbol.for("react.lazy"),j=Symbol.iterator;function ae(e){return e===null||typeof e!="object"?null:(e=j&&e[j]||e["@@iterator"],typeof e=="function"?e:null)}var T={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}},A=Object.assign,q={};function y(e,t,r){this.props=e,this.context=t,this.refs=q,this.updater=r||T}y.prototype.isReactComponent={};y.prototype.setState=function(e,t){if(typeof e!="object"&&typeof e!="function"&&e!=null)throw Error("setState(...): takes an object of state variables to update or a function which returns an object of state variables.");this.updater.enqueueSetState(this,e,t,"setState")};y.prototype.forceUpdate=function(e){this.updater.enqueueForceUpdate(this,e,"forceUpdate")};function V(){}V.prototype=y.prototype;function F(e,t,r){this.props=e,this.context=t,this.refs=q,this.updater=r||T}var P=F.prototype=new V;P.constructor=F;A(P,y.prototype);P.isPureReactComponent=!0;var I=Array.isArray,D=Object.prototype.hasOwnProperty,g={current:null},L={key:!0,ref:!0,__self:!0,__source:!0};function U(e,t,r){var n,o={},i=null,s=null;if(t!=null)for(n in t.ref!==void 0&&(s=t.ref),t.key!==void 0&&(i=""+t.key),t)D.call(t,n)&&!L.hasOwnProperty(n)&&(o[n]=t[n]);var l=arguments.length-2;if(l===1)o.children=r;else if(1<l){for(var c=Array(l),a=0;a<l;a++)c[a]=arguments[a+2];o.children=c}if(e&&e.defaultProps)for(n in l=e.defaultProps,l)o[n]===void 0&&(o[n]=l[n]);return{$$typeof:d,type:e,key:i,ref:s,props:o,_owner:g.current}}function pe(e,t){return{$$typeof:d,type:e.type,key:t,ref:e.ref,props:e.props,_owner:e._owner}}function C(e){return typeof e=="object"&&e!==null&&e.$$typeof===d}function ye(e){var t={"=":"=0",":":"=2"};return"$"+e.replace(/[=:]/g,function(r){return t[r]})}var N=/\/+/g;function E(e,t){return typeof e=="object"&&e!==null&&e.key!=null?ye(""+e.key):t.toString(36)}function v(e,t,r,n,o){var i=typeof e;(i==="undefined"||i==="boolean")&&(e=null);var s=!1;if(e===null)s=!0;else switch(i){case"string":case"number":s=!0;break;case"object":switch(e.$$typeof){case d:case te:s=!0}}if(s)return s=e,o=o(s),e=n===""?"."+E(s,0):n,I(o)?(r="",e!=null&&(r=e.replace(N,"$&/")+"/"),v(o,t,r,"",function(a){return a})):o!=null&&(C(o)&&(o=pe(o,r+(!o.key||s&&s.key===o.key?"":(""+o.key).replace(N,"$&/")+"/")+e)),t.push(o)),1;if(s=0,n=n===""?".":n+":",I(e))for(var l=0;l<e.length;l++){i=e[l];var c=n+E(i,l);s+=v(i,t,r,c,o)}else if(c=ae(e),typeof c=="function")for(e=c.call(e),l=0;!(i=e.next()).done;)i=i.value,c=n+E(i,l++),s+=v(i,t,r,c,o);else if(i==="object")throw t=String(e),Error("Objects are not valid as a React child (found: "+(t==="[object Object]"?"object with keys {"+Object.keys(e).join(", ")+"}":t)+"). If you meant to render a collection of children, use an array instead.");return s}function m(e,t,r){if(e==null)return e;var n=[],o=0;return v(e,n,"","",function(i){return t.call(r,i,o++)}),n}function de(e){if(e._status===-1){var t=e._result;t=t(),t.then(function(r){(e._status===0||e._status===-1)&&(e._status=1,e._result=r)},function(r){(e._status===0||e._status===-1)&&(e._status=2,e._result=r)}),e._status===-1&&(e._status=0,e._result=t)}if(e._status===1)return e._result.default;throw e._result}var f={current:null},_={transition:null},he={ReactCurrentDispatcher:f,ReactCurrentBatchConfig:_,ReactCurrentOwner:g};function K(){throw Error("act(...) is not supported in production builds of React.")}u.Children={map:m,forEach:function(e,t,r){m(e,function(){t.apply(this,arguments)},r)},count:function(e){var t=0;return m(e,function(){t++}),t},toArray:function(e){return m(e,function(t){return t})||[]},only:function(e){if(!C(e))throw Error("React.Children.only expected to receive a single React element child.");return e}};u.Component=y;u.Fragment=re;u.Profiler=oe;u.PureComponent=F;u.StrictMode=ne;u.Suspense=ce;u.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED=he;u.act=K;u.cloneElement=function(e,t,r){if(e==null)throw Error("React.cloneElement(...): The argument must be a React element, but you passed "+e+".");var n=A({},e.props),o=e.key,i=e.ref,s=e._owner;if(t!=null){if(t.ref!==void 0&&(i=t.ref,s=g.current),t.key!==void 0&&(o=""+t.key),e.type&&e.type.defaultProps)var l=e.type.defaultProps;for(c in t)D.call(t,c)&&!L.hasOwnProperty(c)&&(n[c]=t[c]===void 0&&l!==void 0?l[c]:t[c])}var c=arguments.length-2;if(c===1)n.children=r;else if(1<c){l=Array(c);for(var a=0;a<c;a++)l[a]=arguments[a+2];n.children=l}return{$$typeof:d,type:e.type,key:o,ref:i,props:n,_owner:s}};u.createContext=function(e){return e={$$typeof:ie,_currentValue:e,_currentValue2:e,_threadCount:0,Provider:null,Consumer:null,_defaultValue:null,_globalName:null},e.Provider={$$typeof:ue,_context:e},e.Consumer=e};u.createElement=U;u.createFactory=function(e){var t=U.bind(null,e);return t.type=e,t};u.createRef=function(){return{current:null}};u.forwardRef=function(e){return{$$typeof:se,render:e}};u.isValidElement=C;u.lazy=function(e){return{$$typeof:fe,_payload:{_status:-1,_result:e},_init:de}};u.memo=function(e,t){return{$$typeof:le,type:e,compare:t===void 0?null:t}};u.startTransition=function(e){var t=_.transition;_.transition={};try{e()}finally{_.transition=t}};u.unstable_act=K;u.useCallback=function(e,t){return f.current.useCallback(e,t)};u.useContext=function(e){return f.current.useContext(e)};u.useDebugValue=function(){};u.useDeferredValue=function(e){return f.current.useDeferredValue(e)};u.useEffect=function(e,t){return f.current.useEffect(e,t)};u.useId=function(){return f.current.useId()};u.useImperativeHandle=function(e,t,r){return f.current.useImperativeHandle(e,t,r)};u.useInsertionEffect=function(e,t){return f.current.useInsertionEffect(e,t)};u.useLayoutEffect=function(e,t){return f.current.useLayoutEffect(e,t)};u.useMemo=function(e,t){return f.current.useMemo(e,t)};u.useReducer=function(e,t,r){return f.current.useReducer(e,t,r)};u.useRef=function(e){return f.current.useRef(e)};u.useState=function(e){return f.current.useState(e)};u.useSyncExternalStore=function(e,t,r){return f.current.useSyncExternalStore(e,t,r)};u.useTransition=function(){return f.current.useTransition()};u.version="18.3.1"});var k=h((Oe,B)=>{"use strict";B.exports=M()});var J=h(w=>{"use strict";var me=k(),ve=Symbol.for("react.element"),_e=Symbol.for("react.fragment"),we=Object.prototype.hasOwnProperty,be=me.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,Se={key:!0,ref:!0,__self:!0,__source:!0};function H(e,t,r){var n,o={},i=null,s=null;r!==void 0&&(i=""+r),t.key!==void 0&&(i=""+t.key),t.ref!==void 0&&(s=t.ref);for(n in t)we.call(t,n)&&!Se.hasOwnProperty(n)&&(o[n]=t[n]);if(e&&e.defaultProps)for(n in t=e.defaultProps,t)o[n]===void 0&&(o[n]=t[n]);return{$$typeof:ve,type:e,key:i,ref:s,props:o,_owner:be.current}}w.Fragment=_e;w.jsx=H;w.jsxs=H});var O=h((Re,W)=>{"use strict";W.exports=J()});function $(e,t={}){return new Promise((r,n)=>{if(!e||typeof e!="string"){n(new Error("Fency: A valid publishable key is required."));return}if(!e.startsWith("pk_")){n(new Error('Fency: Invalid publishable key format. Keys should start with "pk_".'));return}let o={publishableKey:e,config:{apiVersion:t.config?.apiVersion||"2024-01-01",endpoint:t.config?.endpoint||"https://api.fency.ai"},version:"0.1.1"};setTimeout(()=>{r(o)},0)})}var p=S(k(),1),x=S(O(),1),z=(0,p.createContext)(void 0);function Ee({publishableKey:e,options:t={},children:r}){let[n,o]=(0,p.useState)(null),[i,s]=(0,p.useState)(!0),[l,c]=(0,p.useState)(null);(0,p.useEffect)(()=>{$(e,t).then(b=>{o(b),s(!1)}).catch(b=>{c(b),s(!1)})},[e,JSON.stringify(t)]);let a={fency:n,loading:i,error:l};return(0,x.jsx)(z.Provider,{value:a,children:r})}function Fe(){let e=(0,p.useContext)(z);if(e===void 0)throw new Error("useFency must be used within a FencyProvider");return e}function Te({publishableKey:e,options:t={},children:r}){return(0,x.jsx)(Ee,{publishableKey:e,options:t,children:r})}function Ae(){let{fency:e,loading:t,error:r}=Fe();return{fency:e,loading:t,error:r,sendMessage:async n=>{if(!e)throw new Error("Fency not loaded");console.log("Sending message:",n)}}}export{Te as ChatCompletionProvider,Ee as FencyProvider,Ae as useChatCompletion,Fe as useFency};
+/*! Bundled license information:
+
+react/cjs/react.production.min.js:
+  (**
+   * @license React
+   * react.production.min.js
+   *
+   * Copyright (c) Facebook, Inc. and its affiliates.
+   *
+   * This source code is licensed under the MIT license found in the
+   * LICENSE file in the root directory of this source tree.
+   *)
+
+react/cjs/react-jsx-runtime.production.min.js:
+  (**
+   * @license React
+   * react-jsx-runtime.production.min.js
+   *
+   * Copyright (c) Facebook, Inc. and its affiliates.
+   *
+   * This source code is licensed under the MIT license found in the
+   * LICENSE file in the root directory of this source tree.
+   *)
+*/

package/package.json

@@ -0,0 +1,69 @@
+{
+  "name": "@fencyai/react",
+  "version": "0.1.2",
+  "description": "React components for Fency integration",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "types": "./dist/index.d.ts"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsc && esbuild src/index.tsx --bundle --format=esm --outfile=dist/index.js --minify",
+    "dev": "tsc --watch",
+    "clean": "rm -rf dist",
+    "prepublishOnly": "npm run clean && npm run build",
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "version:patch": "npm version patch",
+    "version:minor": "npm version minor",
+    "version:major": "npm version major",
+    "version:prepatch": "npm version prepatch",
+    "version:preminor": "npm version preminor",
+    "version:premajor": "npm version premajor",
+    "version:prerelease": "npm version prerelease",
+    "publish:patch": "npm run version:patch && npm publish --access public",
+    "publish:minor": "npm run version:minor && npm publish --access public",
+    "publish:major": "npm run version:major && npm publish --access public"
+  },
+  "keywords": [
+    "fency",
+    "fencyai",
+    "react",
+    "react-hooks",
+    "typescript",
+    "esm",
+    "publishable-key"
+  ],
+  "author": "",
+  "license": "MIT",
+  "peerDependencies": {
+    "react": "^18.0.0",
+    "@fencyai/js": "^0.1.2"
+  },
+  "devDependencies": {
+    "@types/node": "^20.10.0",
+    "@types/react": "^18.0.0",
+    "esbuild": "^0.19.0",
+    "typescript": "^5.3.0",
+    "react": "^18.0.0",
+    "@fencyai/js": "^0.1.3"
+  },
+  "engines": {
+    "node": ">=16.0.0"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/fencyai/fency-react.git"
+  },
+  "bugs": {
+    "url": "https://github.com/fencyai/fency-react/issues"
+  },
+  "homepage": "https://github.com/fencyai/fency-react#readme"
+}