drupal-decoupled 0.1.0

package/README.md

@@ -0,0 +1,62 @@
+# Drupal-Decoupled
+
+A list of utilities for a Decoupled integrations
+
+### Route Syncronization and comunication between FE and BE via the Iframe
+
+Import the `syncDrupalPreviewRoutes` helper at `app/root.tsx`
+
+```typescript
+import { syncDrupalPreviewRoutes } from "drupal-remix";
+```
+
+Make sure your loader returns the current `environment` value
+
+```typescript
+export const loader = async ({ context }: LoaderFunctionArgs ) => {
+  // Provide a variable to define the environment
+  const environment = context.cloudflare.env.ENVIRONMENT
+  return json(
+    {
+      environment,
+    },
+    { status: 200 }
+  );
+};
+```
+
+> NOTE: This example is using Cloudflare and taking advantage of Environemt Settings to define "environment" key/value, that is why we are using the `context.cloudflare.env.ENVIRONMENT` object to obtain the value and pass it from Server to Client.
+
+Upate your `App` function
+
+```typescript
+export default function App() {
+  // read environment from loader
+  const { environment } = useLoaderData<typeof loader>();
+  // use the useNavigation hook from @remix-run/react
+  const navigation = useNavigation();
+
+  // check if environment is preview and navigation.state is loading
+  // to call syncDrupalPreviewRoutes
+  if (environment === "preview" && navigation.state === "loading") {
+    syncDrupalPreviewRoutes(navigation.location.pathname);
+  }
+
+  return (
+    <>
+      <Outlet />
+    </>
+  );
+}
+```
+
+For a fully functional example visit any of those repositories:
+- GraphQL:
+  - [Remix](https://github.com/octahedroid/drupal-remix/tree/main/examples/graphql)
+  - [Drupal]()
+
+- JSON:API (TBD)
+
+## Supporting organizations
+
+Development sponsored by [Octahedroid](https://octahedroid.com/)

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+import { syncDrupalPreviewRoutes } from "./syncPreview";
+export { syncDrupalPreviewRoutes };

package/dist/index.js

@@ -0,0 +1 @@
+var o=e=>{window&&window.top!==window.self&&window.parent.postMessage({type:"DECOUPLED_PREVIEW_IFRAME_ROUTE_SYNC",path:e},"*")};export{o as syncDrupalPreviewRoutes};

package/dist/syncPreview.d.ts

@@ -0,0 +1 @@
+export declare const syncDrupalPreviewRoutes: (path: string) => void;

package/dist/syncPreview.js

@@ -0,0 +1 @@
+var o=e=>{window&&window.top!==window.self&&window.parent.postMessage({type:"DECOUPLED_PREVIEW_IFRAME_ROUTE_SYNC",path:e},"*")};export{o as syncDrupalPreviewRoutes};

package/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "drupal-decoupled",
+  "version": "0.1.0",
+  "description": "Drupal utils for Decoupled integrations",
+  "type": "module",
+  "keywords": [
+    "graphql",
+    "drupal",
+    "decoupled",
+    "remix",
+    "next.js"
+  ],
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "bundlesize": [
+    {
+      "path": "./dist/index.js"
+    }
+  ],
+  "scripts": {
+    "prepublish": "yarn build",
+    "ts-types": " tsc --emitDeclarationOnly --outDir dist",
+    "build": "rimraf dist && node ./esbuild.js && yarn ts-types"
+  },
+  "author": "Octahedroid <opensource@octahedroid.com>",
+  "repository": {
+    "url": "https://github.com/octahedroid/drupal-decoupled/tree/main/packages/drupal-decoupled"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "@types/node": "^18.11.3",
+    "esbuild": "^0.17.18",
+    "rimraf": "^5.0.0",
+    "typescript": "^4.8.4"
+  },
+  "dependencies": {}
+}