@schematichq/schematic-react 1.0.0-rc.0 → 1.0.0

package/README.md

@@ -0,0 +1,86 @@
+# schematic-react
+
+`schematic-react` is a client-side React library for [Schematic](https://schematichq.com) which provides hooks to track events, check flags, and more. `schematic-react` provides the same capabilities as [schematic-js](https://github.com/schematichq/schematic-js/tree/main/js), for React apps.
+
+## Install
+
+```bash
+npm install @schematichq/schematic-react
+# or
+yarn add @schematichq/schematic-react
+# or
+pnpm add @schematichq/schematic-react
+```
+
+## Usage
+
+You can use the `SchematicProvider` to wrap your application and provide the Schematic instance to all components:
+
+```tsx
+import { SchematicProvider } from "@schematichq/schematic-react";
+
+ReactDOM.render(
+    <SchematicProvider publishableKey="your-publishable-key">
+        <App />
+    </SchematicProvider>,
+    document.getElementById("root"),
+);
+```
+
+To set the user context for events and flag checks, you can use the `identify` function provided by the `useSchematicEvents` hook:
+
+```tsx
+import { useSchematicEvents } from "@schematichq/schematic-react";
+
+const MyComponent = () => {
+    const { identify } = useSchematicEvents();
+
+    useEffect(() => {
+        identify({
+            keys: { id: "my-user-id" },
+            company: {
+                keys: { id: "my-company-id" },
+                traits: { location: "Atlanta, GA" },
+            },
+        });
+    }, []);
+
+    return <div>My Component</div>;
+};
+```
+
+Once you've set the context with `identify`, you can track events:
+
+```tsx
+import { useSchematicEvents } from "@schematichq/schematic-react";
+
+const MyComponent = () => {
+    const { track } = useSchematicEvents();
+
+    useEffect(() => {
+        track({ event: "query" });
+    }, []);
+
+    return <div>My Component</div>;
+};
+```
+
+To check a flag, you can use the `useSchematicFlags` hook:
+
+```tsx
+import { useSchematicFlag } from "@schematichq/schematic-react";
+
+const MyComponent = () => {
+    const isFeatureEnabled = useSchematicFlag("my-flag-key");
+
+    return isFeatureEnabled ? <Feature /> : <Fallback />;
+};
+```
+
+## License
+
+MIT
+
+## Support
+
+Need help? Please open a GitHub issue or reach out to [support@schematichq.com](mailto:support@schematichq.com) and we'll be happy to assist.

package/dist/schematic-react.cjs.js

@@ -230,8 +230,8 @@ var require_browser_polyfill = __commonJS({
         function readArrayBufferAsText(buf) {
           var view = new Uint8Array(buf);
           var chars = new Array(view.length);
-          for (var i = 0; i < view.length; i++) {
-            chars[i] = String.fromCharCode(view[i]);
+          for (var i2 = 0; i2 < view.length; i2++) {
+            chars[i2] = String.fromCharCode(view[i2]);
           }
           return chars.join("");
         }
@@ -566,6 +566,14 @@ var require_browser_polyfill = __commonJS({
     })(typeof self !== "undefined" ? self : exports);
   }
 });
+var byteToHex = [];
+for (i = 0; i < 256; ++i) {
+  byteToHex.push((i + 256).toString(16).slice(1));
+}
+var i;
+function unsafeStringify(arr, offset = 0) {
+  return (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + "-" + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + "-" + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + "-" + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + "-" + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase();
+}
 var getRandomValues;
 var rnds8 = new Uint8Array(16);
 function rng() {
@@ -577,13 +585,6 @@ function rng() {
   }
   return getRandomValues(rnds8);
 }
-var byteToHex = [];
-for (let i = 0; i < 256; ++i) {
-  byteToHex.push((i + 256).toString(16).slice(1));
-}
-function unsafeStringify(arr, offset = 0) {
-  return byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + "-" + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + "-" + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + "-" + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + "-" + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]];
-}
 var randomUUID = typeof crypto !== "undefined" && crypto.randomUUID && crypto.randomUUID.bind(crypto);
 var native_default = {
   randomUUID
@@ -593,13 +594,13 @@ function v4(options, buf, offset) {
     return native_default.randomUUID();
   }
   options = options || {};
-  const rnds = options.random || (options.rng || rng)();
+  var rnds = options.random || (options.rng || rng)();
   rnds[6] = rnds[6] & 15 | 64;
   rnds[8] = rnds[8] & 63 | 128;
   if (buf) {
     offset = offset || 0;
-    for (let i = 0; i < 16; ++i) {
-      buf[offset + i] = rnds[i];
+    for (var i2 = 0; i2 < 16; ++i2) {
+      buf[offset + i2] = rnds[i2];
     }
     return buf;
   }

package/dist/schematic-react.esm.js

@@ -188,8 +188,8 @@ var require_browser_polyfill = __commonJS({
         function readArrayBufferAsText(buf) {
           var view = new Uint8Array(buf);
           var chars = new Array(view.length);
-          for (var i = 0; i < view.length; i++) {
-            chars[i] = String.fromCharCode(view[i]);
+          for (var i2 = 0; i2 < view.length; i2++) {
+            chars[i2] = String.fromCharCode(view[i2]);
           }
           return chars.join("");
         }
@@ -524,6 +524,14 @@ var require_browser_polyfill = __commonJS({
     })(typeof self !== "undefined" ? self : exports);
   }
 });
+var byteToHex = [];
+for (i = 0; i < 256; ++i) {
+  byteToHex.push((i + 256).toString(16).slice(1));
+}
+var i;
+function unsafeStringify(arr, offset = 0) {
+  return (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + "-" + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + "-" + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + "-" + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + "-" + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase();
+}
 var getRandomValues;
 var rnds8 = new Uint8Array(16);
 function rng() {
@@ -535,13 +543,6 @@ function rng() {
   }
   return getRandomValues(rnds8);
 }
-var byteToHex = [];
-for (let i = 0; i < 256; ++i) {
-  byteToHex.push((i + 256).toString(16).slice(1));
-}
-function unsafeStringify(arr, offset = 0) {
-  return byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + "-" + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + "-" + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + "-" + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + "-" + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]];
-}
 var randomUUID = typeof crypto !== "undefined" && crypto.randomUUID && crypto.randomUUID.bind(crypto);
 var native_default = {
   randomUUID
@@ -551,13 +552,13 @@ function v4(options, buf, offset) {
     return native_default.randomUUID();
   }
   options = options || {};
-  const rnds = options.random || (options.rng || rng)();
+  var rnds = options.random || (options.rng || rng)();
   rnds[6] = rnds[6] & 15 | 64;
   rnds[8] = rnds[8] & 63 | 128;
   if (buf) {
     offset = offset || 0;
-    for (let i = 0; i < 16; ++i) {
-      buf[offset + i] = rnds[i];
+    for (var i2 = 0; i2 < 16; ++i2) {
+      buf[offset + i2] = rnds[i2];
     }
     return buf;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@schematichq/schematic-react",
-  "version": "1.0.0-rc.0",
+  "version": "1.0.0",
   "main": "dist/schematic-react.cjs.js",
   "module": "dist/schematic-react.esm.js",
   "types": "dist/schematic-react.d.ts",
@@ -29,7 +29,7 @@
     "tsc": "npx tsc"
   },
   "dependencies": {
-    "@schematichq/schematic-js": "^0.1.14"
+    "@schematichq/schematic-js": "^1.0.0"
   },
   "devDependencies": {
     "@microsoft/api-extractor": "^7.47.9",