npm - @zeyos/client - Versions diffs - 0.1.0 - Mend

@zeyos/client 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (110) hide show

package/CHANGELOG.md +31 -0
package/LICENSE +21 -0
package/README.md +458 -0
package/agents/README.md +66 -0
package/agents/shared/business-app-benchmarks.md +111 -0
package/agents/shared/zeyos-entity-map.md +142 -0
package/agents/shared/zeyos-entity-reference.md +570 -0
package/agents/shared/zeyos-query-patterns.md +89 -0
package/agents/zeyos-account-intelligence/SKILL.md +34 -0
package/agents/zeyos-account-intelligence/agents/openai.yaml +4 -0
package/agents/zeyos-account-intelligence/references/workflows.md +84 -0
package/agents/zeyos-billing-insights/SKILL.md +41 -0
package/agents/zeyos-billing-insights/agents/openai.yaml +4 -0
package/agents/zeyos-billing-insights/references/workflows.md +106 -0
package/agents/zeyos-campaign-and-outreach/SKILL.md +44 -0
package/agents/zeyos-campaign-and-outreach/agents/openai.yaml +4 -0
package/agents/zeyos-campaign-and-outreach/references/workflows.md +100 -0
package/agents/zeyos-collaboration-and-activity/SKILL.md +37 -0
package/agents/zeyos-collaboration-and-activity/agents/openai.yaml +4 -0
package/agents/zeyos-collaboration-and-activity/references/workflows.md +104 -0
package/agents/zeyos-collections-and-dunning/SKILL.md +46 -0
package/agents/zeyos-collections-and-dunning/agents/openai.yaml +4 -0
package/agents/zeyos-collections-and-dunning/references/workflows.md +132 -0
package/agents/zeyos-commerce-and-inventory/SKILL.md +38 -0
package/agents/zeyos-commerce-and-inventory/agents/openai.yaml +4 -0
package/agents/zeyos-commerce-and-inventory/references/workflows.md +101 -0
package/agents/zeyos-mail-operations/SKILL.md +35 -0
package/agents/zeyos-mail-operations/agents/openai.yaml +4 -0
package/agents/zeyos-mail-operations/references/workflows.md +110 -0
package/agents/zeyos-notes-and-sops/SKILL.md +31 -0
package/agents/zeyos-notes-and-sops/agents/openai.yaml +4 -0
package/agents/zeyos-notes-and-sops/references/workflows.md +85 -0
package/agents/zeyos-platform-and-schema/SKILL.md +37 -0
package/agents/zeyos-platform-and-schema/agents/openai.yaml +4 -0
package/agents/zeyos-platform-and-schema/references/workflows.md +97 -0
package/agents/zeyos-work-management/SKILL.md +45 -0
package/agents/zeyos-work-management/agents/openai.yaml +4 -0
package/agents/zeyos-work-management/references/workflows.md +148 -0
package/docs/01-api-reference/01-data-retrieval.md +601 -0
package/docs/01-api-reference/02-authentication.md +288 -0
package/docs/01-api-reference/03-resources.md +270 -0
package/docs/01-api-reference/04-schema.md +539 -0
package/docs/01-api-reference/_category_.json +9 -0
package/docs/02-javascript-client/01-getting-started.md +146 -0
package/docs/02-javascript-client/02-authentication.md +287 -0
package/docs/02-javascript-client/03-making-requests.md +572 -0
package/docs/02-javascript-client/04-practical-guide.md +348 -0
package/docs/02-javascript-client/_category_.json +9 -0
package/docs/03-cli/01-getting-started.md +219 -0
package/docs/03-cli/02-commands.md +407 -0
package/docs/03-cli/03-configuration.md +220 -0
package/docs/03-cli/_category_.json +9 -0
package/docs/04-agent-workflows/00-coding-agents.md +35 -0
package/docs/04-agent-workflows/01-agent-quickstart.md +147 -0
package/docs/04-agent-workflows/02-agent-recipes.md +109 -0
package/docs/04-agent-workflows/03-cli-coverage-and-escalation.md +65 -0
package/docs/04-agent-workflows/_category_.json +9 -0
package/docs/04-sample-apps/01-kanban.md +89 -0
package/docs/04-sample-apps/02-crm.md +81 -0
package/docs/04-sample-apps/03-dashboard.md +80 -0
package/docs/04-sample-apps/_category_.json +9 -0
package/docs/05-tutorials/00-application-developers.md +43 -0
package/docs/05-tutorials/01-integration-architecture.md +60 -0
package/docs/05-tutorials/02-build-your-own-zeyos-frontend.md +517 -0
package/docs/05-tutorials/03-server-side-integrations.md +185 -0
package/docs/05-tutorials/_category_.json +9 -0
package/docs/intro.md +197 -0
package/openapi/api.json +24308 -0
package/openapi/auth.json +415 -0
package/openapi/dbref.json +56223 -0
package/openapi/oauth2.json +781 -0
package/openapi/sdk.json +949 -0
package/openapi/views.txt +642 -0
package/package.json +49 -0
package/samples/crm/README.md +28 -0
package/samples/crm/index.html +327 -0
package/samples/crm/js/api.js +208 -0
package/samples/crm/js/auth.js +61 -0
package/samples/crm/js/main.js +545 -0
package/samples/crm/js/state.js +90 -0
package/samples/crm/js/ui.js +51 -0
package/samples/dashboard/README.md +28 -0
package/samples/dashboard/index.html +280 -0
package/samples/dashboard/js/api.js +197 -0
package/samples/dashboard/js/auth.js +59 -0
package/samples/dashboard/js/main.js +382 -0
package/samples/dashboard/js/state.js +81 -0
package/samples/dashboard/js/ui.js +48 -0
package/samples/kanban/README.md +28 -0
package/samples/kanban/index.html +263 -0
package/samples/kanban/js/api.js +152 -0
package/samples/kanban/js/auth.js +59 -0
package/samples/kanban/js/constants.js +40 -0
package/samples/kanban/js/kanban.js +246 -0
package/samples/kanban/js/main.js +362 -0
package/samples/kanban/js/modals.js +474 -0
package/samples/kanban/js/settings.js +82 -0
package/samples/kanban/js/state.js +118 -0
package/samples/kanban/js/ui.js +49 -0
package/scripts/generate-client.mjs +344 -0
package/src/generated/operations.js +9772 -0
package/src/generated/schema.js +8982 -0
package/src/index.js +85 -0
package/src/runtime/client.js +1208 -0
package/src/runtime/error.js +29 -0
package/src/runtime/http.js +174 -0
package/src/runtime/request-shape.js +35 -0
package/src/runtime/schema.js +206 -0
package/src/runtime/suggest.js +74 -0
package/src/runtime/token-store.js +105 -0

package/samples/crm/index.html ADDED Viewed

@@ -0,0 +1,327 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>ZeyOS CRM Contacts</title>
+  <script src="https://cdn.tailwindcss.com"></script>
+  <style>
+    /* Native dialog reset */
+    dialog { padding: 0; border: none; border-radius: 1rem; max-width: 90vw; }
+    dialog::backdrop { background: rgba(0,0,0,0.5); }
+    /* Sortable column header indicators */
+    .sort-asc::after  { content: ' \25B2'; font-size: 0.65em; opacity: 0.7; }
+    .sort-desc::after { content: ' \25BC'; font-size: 0.65em; opacity: 0.7; }
+    /* Clickable table rows */
+    #accounts-tbody tr { cursor: pointer; }
+    #accounts-tbody tr:hover { background: #f1f5f9; }
+  </style>
+</head>
+<!--
+  +-----------------------------------------------------------------------+
+  |  CONFIGURATION                                                        |
+  |                                                                       |
+  |  Set data-zeyos-url to your ZeyOS instance URL.                       |
+  |  Optionally provide tokens obtained via the CLI (zeyos login).        |
+  |                                                                       |
+  |  Alternatively, use the browser console:                              |
+  |    ZeyOS.setUrl('https://cloud.zeyos.com/demo/')                      |
+  |    ZeyOS.setToken('your-access-token')                                |
+  |    ZeyOS.reconnect()                                                  |
+  |                                                                       |
+  |  Session mode only works from the same origin or with credentialed    |
+  |  CORS enabled on the ZeyOS instance. Use token mode for localhost.    |
+  +-----------------------------------------------------------------------+
+-->
+<body class="bg-slate-100 min-h-screen font-sans antialiased"
+      data-zeyos-url=""
+      data-zeyos-accesstoken=""
+      data-zeyos-refreshtoken="">
+  <!-- == Connection Screen ================================================ -->
+  <div id="connection-screen" class="hidden min-h-screen flex items-center justify-center p-4">
+    <div class="bg-white rounded-2xl shadow-xl p-8 w-full max-w-md">
+      <!-- Logo / title -->
+      <div class="text-center mb-6">
+        <div class="w-14 h-14 rounded-2xl bg-blue-600 flex items-center justify-center mx-auto mb-4">
+          <svg class="w-8 h-8 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+              d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0z" />
+          </svg>
+        </div>
+        <h1 class="text-2xl font-bold text-slate-900">ZeyOS CRM Accounts</h1>
+        <p id="connection-message" class="text-slate-500 text-sm mt-1">Not connected</p>
+      </div>
+      <!-- Setup instructions -->
+      <div class="space-y-4 text-sm text-slate-600">
+        <div class="p-4 bg-blue-50 border border-blue-200 rounded-xl">
+          <h3 class="font-semibold text-blue-800 mb-2">Option 1 &mdash; Body Attributes</h3>
+          <p class="mb-2 leading-relaxed">Set connection details directly in <code class="text-xs bg-blue-100 px-1 py-0.5 rounded">index.html</code>:</p>
+          <pre class="text-xs bg-white p-3 rounded-lg border border-blue-100 overflow-x-auto leading-relaxed"><code>&lt;body
+  data-zeyos-url="https://cloud.zeyos.com/demo/"
+  data-zeyos-accesstoken="your-token"&gt;</code></pre>
+        </div>
+        <div class="p-4 bg-emerald-50 border border-emerald-200 rounded-xl">
+          <h3 class="font-semibold text-emerald-800 mb-2">Option 2 &mdash; Console API</h3>
+          <p class="mb-2 leading-relaxed">Open DevTools (<kbd class="text-xs bg-emerald-100 px-1.5 py-0.5 rounded font-mono">F12</kbd>) and run:</p>
+          <pre class="text-xs bg-white p-3 rounded-lg border border-emerald-100 overflow-x-auto leading-relaxed"><code>ZeyOS.setUrl('https://cloud.zeyos.com/demo/')
+ZeyOS.setToken('your-access-token')
+ZeyOS.reconnect()</code></pre>
+        </div>
+        <div class="p-4 bg-amber-50 border border-amber-200 rounded-xl">
+          <h3 class="font-semibold text-amber-800 mb-2">Option 3 &mdash; Session Mode</h3>
+          <p class="leading-relaxed">
+            Session mode only works from the same origin or when the ZeyOS instance
+            allows credentialed CORS. For localhost demos, use token mode.
+          </p>
+        </div>
+        <div class="p-3 bg-slate-50 border border-slate-200 rounded-xl text-xs text-slate-500 space-y-1.5">
+          <p>
+            <strong>Tip:</strong> Use the CLI to obtain a token with
+            <code class="bg-slate-100 px-1 py-0.5 rounded font-mono">zeyos login</code>, then explicitly print one with
+            <code class="bg-slate-100 px-1 py-0.5 rounded font-mono">zeyos whoami --show-token --json</code>
+          </p>
+          <p>
+            <strong>Debug:</strong> Run <code class="bg-slate-100 px-1 py-0.5 rounded font-mono">ZeyOS.status()</code>
+            in the console to see the current config.
+          </p>
+        </div>
+      </div>
+    </div>
+  </div>
+  <!-- == App Shell ======================================================== -->
+  <div id="app-shell" class="hidden flex flex-col" style="height:100dvh">
+    <!-- Navbar -->
+    <header class="bg-white border-b border-slate-200 px-4 py-2.5 flex items-center gap-3 flex-shrink-0 shadow-sm">
+      <!-- Logo -->
+      <div class="flex items-center gap-2 mr-2">
+        <div class="w-7 h-7 rounded-lg bg-blue-600 flex items-center justify-center">
+          <svg class="w-4 h-4 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+              d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0z" />
+          </svg>
+        </div>
+        <span class="font-semibold text-slate-800 hidden sm:inline">ZeyOS CRM</span>
+      </div>
+      <!-- Search bar -->
+      <div class="flex-1 max-w-md relative">
+        <svg class="w-4 h-4 text-slate-400 absolute left-3 top-1/2 -translate-y-1/2 pointer-events-none" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+            d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
+        </svg>
+        <input id="search-input" type="text" placeholder="Search accounts..."
+          class="w-full pl-9 pr-3 py-1.5 rounded-lg bg-slate-100 border border-slate-200 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent placeholder-slate-400">
+      </div>
+      <div class="flex-1"></div>
+      <!-- Reload button -->
+      <button id="btn-reload" title="Reload accounts"
+        class="p-2 rounded-lg hover:bg-slate-100 text-slate-500 hover:text-slate-700 transition-colors">
+        <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+            d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
+        </svg>
+      </button>
+      <!-- New account -->
+      <button id="btn-new-account"
+        class="flex items-center gap-1.5 px-3 py-1.5 bg-blue-600 text-white rounded-lg text-sm font-medium hover:bg-blue-700 active:bg-blue-800 transition-colors">
+        <span class="text-base leading-none">+</span>
+        <span class="hidden sm:inline">New Account</span>
+      </button>
+      <!-- Logout -->
+      <button id="btn-logout" title="Log out"
+        class="p-2 rounded-lg hover:bg-slate-100 text-slate-500 hover:text-red-500 transition-colors">
+        <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
+            d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1" />
+        </svg>
+      </button>
+    </header>
+    <!-- Main content area -->
+    <main class="flex-1 overflow-auto p-4">
+      <div class="bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden">
+        <!-- Table -->
+        <div class="overflow-x-auto">
+          <table class="w-full text-sm text-left">
+            <thead>
+              <tr class="bg-slate-50 border-b border-slate-200">
+                <th class="sortable-col px-4 py-3 font-semibold text-slate-600 cursor-pointer hover:text-blue-600 whitespace-nowrap select-none" data-sort="AccountNum">Account #</th>
+                <th class="sortable-col px-4 py-3 font-semibold text-slate-600 cursor-pointer hover:text-blue-600 whitespace-nowrap select-none" data-sort="Name">Name</th>
+                <th class="sortable-col px-4 py-3 font-semibold text-slate-600 cursor-pointer hover:text-blue-600 whitespace-nowrap select-none" data-sort="Email">Email</th>
+                <th class="sortable-col px-4 py-3 font-semibold text-slate-600 cursor-pointer hover:text-blue-600 whitespace-nowrap select-none" data-sort="Phone">Phone</th>
+                <th class="sortable-col px-4 py-3 font-semibold text-slate-600 cursor-pointer hover:text-blue-600 whitespace-nowrap select-none" data-sort="City">City</th>
+                <th class="sortable-col px-4 py-3 font-semibold text-slate-600 cursor-pointer hover:text-blue-600 whitespace-nowrap select-none" data-sort="AssignedUser">Assigned User</th>
+                <th class="sortable-col px-4 py-3 font-semibold text-slate-600 cursor-pointer hover:text-blue-600 whitespace-nowrap select-none" data-sort="Type">Type</th>
+                <th class="sortable-col px-4 py-3 font-semibold text-slate-600 cursor-pointer hover:text-blue-600 whitespace-nowrap select-none" data-sort="LastModified">Last Modified</th>
+              </tr>
+            </thead>
+            <tbody id="accounts-tbody" class="divide-y divide-slate-100">
+              <!-- Rows injected by main.js -->
+            </tbody>
+          </table>
+        </div>
+        <!-- Empty state -->
+        <div id="empty-state" class="hidden py-16 text-center">
+          <svg class="w-12 h-12 text-slate-300 mx-auto mb-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"
+              d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0z" />
+          </svg>
+          <p class="text-slate-500 font-medium">No accounts found</p>
+          <p class="text-slate-400 text-sm mt-1">Try adjusting your search or create a new account.</p>
+        </div>
+        <!-- Pagination -->
+        <div id="pagination-bar" class="flex items-center justify-between px-4 py-3 border-t border-slate-200 bg-slate-50">
+          <div class="text-xs text-slate-500">
+            <span id="pagination-info">Showing 0 accounts</span>
+          </div>
+          <div class="flex items-center gap-2">
+            <button id="btn-prev-page"
+              class="px-3 py-1.5 text-xs font-medium rounded-lg border border-slate-300 bg-white text-slate-600 hover:bg-slate-50 disabled:opacity-40 disabled:cursor-not-allowed transition-colors"
+              disabled>
+              &larr; Previous
+            </button>
+            <span id="page-indicator" class="text-xs text-slate-500 font-medium min-w-[60px] text-center">Page 1</span>
+            <button id="btn-next-page"
+              class="px-3 py-1.5 text-xs font-medium rounded-lg border border-slate-300 bg-white text-slate-600 hover:bg-slate-50 disabled:opacity-40 disabled:cursor-not-allowed transition-colors"
+              disabled>
+              Next &rarr;
+            </button>
+          </div>
+        </div>
+      </div>
+    </main>
+  </div>
+  <!-- == Account Edit / Create Dialog ===================================== -->
+  <dialog id="account-modal" style="width:min(560px,92vw)">
+    <div class="p-6">
+      <!-- Header -->
+      <div class="flex items-center justify-between mb-5">
+        <h2 id="modal-title" class="text-lg font-semibold text-slate-900">Edit Account</h2>
+        <button id="modal-close"
+          class="p-1.5 rounded-lg hover:bg-slate-100 text-slate-500 leading-none text-lg">&times;</button>
+      </div>
+      <!-- Form -->
+      <form id="account-form" class="space-y-4">
+        <input type="hidden" id="form-id" value="">
+        <!-- Name row -->
+        <div class="grid grid-cols-2 gap-4">
+          <div>
+            <label for="form-firstname" class="block text-xs font-medium text-slate-600 mb-1">First Name</label>
+            <input id="form-firstname" type="text"
+              class="w-full px-3 py-2 rounded-lg border border-slate-300 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
+          </div>
+          <div>
+            <label for="form-lastname" class="block text-xs font-medium text-slate-600 mb-1">Last Name / Company</label>
+            <input id="form-lastname" type="text" required
+              class="w-full px-3 py-2 rounded-lg border border-slate-300 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent">
+          </div>
+        </div>
+        <!-- Type -->
+        <div>
+          <label for="form-type" class="block text-xs font-medium text-slate-600 mb-1">Account Type</label>
+          <select id="form-type"
+            class="w-full px-3 py-2 rounded-lg border border-slate-300 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent bg-white">
+            <option value="0">Prospect</option>
+            <option value="1">Customer</option>
+            <option value="2">Supplier</option>
+            <option value="3">Customer &amp; Supplier</option>
+            <option value="4">Competitor</option>
+            <option value="5">Employee</option>
+          </select>
+        </div>
+        <!-- Description -->
+        <div>
+          <label for="form-description" class="block text-xs font-medium text-slate-600 mb-1">Description</label>
+          <textarea id="form-description" rows="3"
+            class="w-full px-3 py-2 rounded-lg border border-slate-300 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent resize-none"></textarea>
+        </div>
+        <!-- Contact info (read-only when editing, hidden on create) -->
+        <div id="contact-section" class="hidden">
+          <div class="border-t border-slate-200 pt-4 mt-4">
+            <h3 class="text-xs font-semibold uppercase tracking-widest text-slate-400 mb-3">Contact Info (read-only)</h3>
+            <p class="text-xs text-slate-400 mb-3">Contact details are managed on the linked contact record.</p>
+            <div class="grid grid-cols-2 gap-4">
+              <div>
+                <label class="block text-xs font-medium text-slate-500 mb-1">Email</label>
+                <div id="contact-email" class="px-3 py-2 rounded-lg bg-slate-50 border border-slate-200 text-sm text-slate-600 min-h-[38px]">&mdash;</div>
+              </div>
+              <div>
+                <label class="block text-xs font-medium text-slate-500 mb-1">Phone</label>
+                <div id="contact-phone" class="px-3 py-2 rounded-lg bg-slate-50 border border-slate-200 text-sm text-slate-600 min-h-[38px]">&mdash;</div>
+              </div>
+              <div class="col-span-2">
+                <label class="block text-xs font-medium text-slate-500 mb-1">City</label>
+                <div id="contact-city" class="px-3 py-2 rounded-lg bg-slate-50 border border-slate-200 text-sm text-slate-600 min-h-[38px]">&mdash;</div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <!-- Actions -->
+        <div class="flex items-center justify-between pt-2">
+          <button type="button" id="btn-delete-account"
+            class="hidden text-sm text-red-500 hover:text-red-700 font-medium transition-colors">
+            Delete Account
+          </button>
+          <div class="flex items-center gap-3 ml-auto">
+            <button type="button" id="btn-cancel"
+              class="px-4 py-2 text-sm font-medium text-slate-600 hover:text-slate-800 transition-colors">
+              Cancel
+            </button>
+            <button type="submit" id="btn-save"
+              class="px-5 py-2 bg-blue-600 text-white rounded-lg text-sm font-medium hover:bg-blue-700 active:bg-blue-800 transition-colors">
+              Save
+            </button>
+          </div>
+        </div>
+      </form>
+    </div>
+  </dialog>
+  <!-- == Toast Container ================================================== -->
+  <div id="toast-container"
+    class="fixed bottom-5 right-5 z-50 flex flex-col gap-2 pointer-events-none">
+  </div>
+  <!-- == Loading Overlay ================================================== -->
+  <div id="loading-overlay"
+    class="hidden fixed inset-0 bg-white/60 backdrop-blur-sm z-50 flex items-center justify-center">
+    <div class="flex flex-col items-center gap-3">
+      <div class="w-8 h-8 border-4 border-blue-600 border-t-transparent rounded-full animate-spin"></div>
+      <span class="text-sm text-slate-600 font-medium">Loading&hellip;</span>
+    </div>
+  </div>
+  <script type="module" src="./js/main.js"></script>
+</body>
+</html>

package/samples/crm/js/api.js ADDED Viewed

@@ -0,0 +1,208 @@
+/**
+ * ZeyOS API client singleton + high-level helper functions for the CRM sample.
+ * Supports two initialization modes:
+ *  - Token mode:   uses pre-obtained browser tokens via MemoryTokenStore
+ *  - Session mode: uses browser session cookies
+ *
+ * Demonstrates:
+ *  - Dot-notation joins (contact.email, contact.phone, contact.city, assigneduser.name)
+ *  - Field aliasing via object-form fields
+ *  - Full-text search via the `query` parameter
+ *  - Pagination via limit/offset
+ *  - Sorting via the sort parameter
+ *
+ * IMPORTANT implementation notes (from project memory):
+ *  - Use `filters` (plural) NOT `filter` for list queries
+ *  - Always include `visibility: 0` in filters
+ *  - Normalise list responses via normalizeListResult()
+ */
+import { createZeyosClient, MemoryTokenStore, normalizeListResult } from '../../../src/index.js';
+import { loadTokens, saveTokens } from './state.js';
+/**
+ * @typedef {null|boolean|number|string|JsonValue[]|Record<string, JsonValue>} JsonValue
+ * @typedef {Record<string, JsonValue>} ZeyosRecord
+ * @typedef {'AccountNum'|'Name'|'Email'|'Phone'|'City'|'AssignedUser'|'Type'|'LastModified'} AccountSortField
+ * @typedef {'asc'|'desc'} SortDirection
+ * @typedef {{ search?: string, sortField?: AccountSortField, sortDir?: SortDirection, limit?: number, offset?: number }} AccountListOptions
+ * @typedef {{ Id?: number|string, AccountNum?: string|number, Name?: string, FirstName?: string|null, Email?: string|null, Phone?: string|null, City?: string|null, AssignedUser?: string|null, Type?: number|string, LastModified?: number|string|null }} AccountListRow
+ * @typedef {{ firstname?: string|null, lastname?: string, type?: number, description?: string|null }} AccountWriteFields
+ */
+export let client = null;
+export let tokenStore = null;
+// ── Client Initialization ──────────────────────────────────────────────────
+/**
+ * Initialize client in token/OAuth mode.
+ * Uses pre-obtained tokens from localStorage / body attributes.
+ */
+export function initTokenClient(url) {
+  const stored = loadTokens();
+  tokenStore = new MemoryTokenStore(stored ?? undefined);
+  client = createZeyosClient({
+    platform: url,
+    auth: {
+      mode: 'oauth',
+      oauth: {
+        tokenStore,
+      },
+    },
+  });
+  return client;
+}
+/**
+ * Initialize client in session mode.
+ * Uses browser cookies via credentials:'include'.
+ * Works when the user is already logged into ZeyOS in the same browser.
+ */
+export function initSessionClient(url) {
+  tokenStore = null;
+  client = createZeyosClient({
+    platform: url,
+    auth: {
+      mode: 'session',
+      session: {
+        enabled: true,
+        credentials: 'include',
+      },
+    },
+  });
+  return client;
+}
+/**
+ * Persist the current token set back to localStorage (no-op in session mode).
+ * Called after API requests to keep stored token state aligned.
+ */
+export async function syncTokens() {
+  if (!tokenStore) return; // session mode -- no tokens to sync
+  try {
+    const ts = await client.auth.getTokenSet();
+    if (ts?.accessToken) {
+      saveTokens({
+        accessToken:           ts.accessToken,
+        refreshToken:          ts.refreshToken,
+        expiresAt:             ts.expiresAt,
+        refreshTokenExpiresAt: ts.refreshTokenExpiresAt,
+      });
+    }
+  } catch {
+    // non-critical
+  }
+}
+// ── Field-to-sort mapping ──────────────────────────────────────────────────
+// Maps the aliased field names used in the UI to the raw API field paths
+// needed by the `sort` parameter.
+const SORT_MAP = {
+  AccountNum:   'customernum',
+  Name:         'lastname',
+  Email:        'contact.email',
+  Phone:        'contact.phone',
+  City:         'contact.city',
+  AssignedUser: 'assigneduser.name',
+  Type:         'type',
+  LastModified: 'lastmodified',
+};
+// ── Accounts ───────────────────────────────────────────────────────────────
+/**
+ * Fetch a page of accounts with dot-notation joins and optional search.
+ *
+ * @param {AccountListOptions} [opts]
+ * @param {string}  [opts.search]  - Full-text search query
+ * @param {AccountSortField} [opts.sortField]  - Aliased field name (e.g. 'Name', 'Email')
+ * @param {SortDirection} [opts.sortDir]    - Sort direction
+ * @param {number}  [opts.limit=25]   - Records per page
+ * @param {number}  [opts.offset=0]   - Offset for pagination
+ * @returns {Promise<AccountListRow[]>} Account records with joined fields
+ */
+export async function fetchAccounts({ search, sortField, sortDir, limit = 25, offset = 0 } = {}) {
+  // Build the sort parameter.
+  // Prefix with + (asc) or - (desc) followed by the raw API field path.
+  const rawSort = SORT_MAP[sortField] ?? 'lastmodified';
+  const prefix  = sortDir === 'asc' ? '+' : '-';
+  const sort    = [`${prefix}${rawSort}`];
+  // Build request parameters with aliased field names (object form).
+  // This demonstrates the field aliasing feature: the keys become the
+  // property names in the response, the values are the actual DB paths.
+  const params = {
+    fields: {
+      Id:           'ID',
+      AccountNum:   'customernum',
+      Name:         'lastname',
+      FirstName:    'firstname',
+      Email:        'contact.email',
+      Phone:        'contact.phone',
+      City:         'contact.city',
+      AssignedUser: 'assigneduser.name',
+      Type:         'type',
+      LastModified: 'lastmodified',
+    },
+    filters: { visibility: 0 },
+    sort,
+    limit,
+    offset,
+  };
+  // Full-text search via the `query` parameter (server-side search)
+  if (search && search.trim()) {
+    params.query = search.trim();
+  }
+  const result = await client.api.listAccounts(params);
+  await syncTokens();
+  return normalizeListResult(result).data;
+}
+/**
+ * Fetch a single account by ID with extended data.
+ * @param {number|string} id - Account ID
+ * @returns {Promise<ZeyosRecord>}
+ */
+export async function getAccount(id) {
+  const result = await client.api.getAccount({ ID: id, extdata: 1 });
+  await syncTokens();
+  return result;
+}
+/**
+ * Create a new account.
+ * @param {AccountWriteFields} data - Account fields (lastname, firstname, type, description, etc.)
+ * @returns {Promise<ZeyosRecord>}
+ */
+export async function createAccount(data) {
+  const result = await client.api.createAccount(data);
+  await syncTokens();
+  return result;
+}
+/**
+ * Update an existing account.
+ * @param {number|string} id   - Account ID
+ * @param {AccountWriteFields} data - Fields to update
+ * @returns {Promise<ZeyosRecord>}
+ */
+export async function updateAccount(id, data) {
+  const result = await client.api.updateAccount({ ID: id, body: data });
+  await syncTokens();
+  return result;
+}
+/**
+ * Delete an account by ID.
+ * @param {number|string} id - Account ID
+ */
+export async function deleteAccount(id) {
+  await client.api.deleteAccount({ ID: id });
+  await syncTokens();
+}

package/samples/crm/js/auth.js ADDED Viewed

@@ -0,0 +1,61 @@
+/**
+ * Authentication helpers.
+ * Supports two modes:
+ *  - Token mode:   pre-obtained browser tokens provided via body attributes or console API
+ *  - Session mode: browser cookies sent to ZeyOS (user already logged in)
+ *
+ * Session detection probes /oauth2/v1/userinfo with credentials:'include'.
+ */
+import { client } from './api.js';
+import { loadTokens, clearTokens } from './state.js';
+// ── Public API ─────────────────────────────────────────────────────────────
+/**
+ * Probe the ZeyOS instance for an active browser session.
+ * Calls GET {url}/oauth2/v1/userinfo with credentials:'include' to
+ * check whether the user is already logged in via a session cookie.
+ * Returns the user info object on success, null otherwise.
+ */
+export async function trySessionAuth(url) {
+  try {
+    const endpoint = `${url.replace(/\/+$/, '')}/oauth2/v1/userinfo`;
+    const res = await fetch(endpoint, {
+      method: 'GET',
+      credentials: 'include',
+      headers: { 'Accept': 'application/json' },
+    });
+    if (!res.ok) return null;
+    const data = await res.json();
+    // A valid userinfo response must have a subject (user identifier)
+    return (data && (data.sub || data.ID)) ? data : null;
+  } catch {
+    return null;
+  }
+}
+/**
+ * Returns true if a valid (non-expired) access token exists in localStorage.
+ */
+export function isAuthenticated() {
+  const tokens = loadTokens();
+  if (!tokens?.accessToken) return false;
+  if (!tokens.expiresAt) return true;
+  // Token still valid with 2-minute buffer (expiresAt is Unix seconds)
+  return Date.now() / 1000 < tokens.expiresAt - 120;
+}
+/**
+ * Clear tokens and revoke the access token if possible.
+ */
+export async function logout() {
+  const tokens = loadTokens();
+  if (tokens?.accessToken && client) {
+    try {
+      await client.oauth2.revokeToken({ token: tokens.accessToken });
+    } catch {
+      // best-effort revocation
+    }
+  }
+  clearTokens();
+}