@ozura/elements 1.2.4-next.55 → 1.2.4-next.57

package/dist/react/vue/index.d.ts

@@ -26,7 +26,9 @@
 import { type Ref, type PropType, type ComputedRef } from 'vue';
 import type { TokenizeOptions, TokenResponse, BankTokenizeOptions, BankTokenResponse, FontSource, Appearance } from '../types';
 export interface OzElementsProps {
-    pubKey: string;
+    /** Omit when using a test vault key from a Test project at ozuravault.com.
+     *  Required for production vault keys. */
+    pubKey?: string;
     sessionUrl?: string;
     getSessionKey?: (sessionId: string) => Promise<string>;
     frameBaseUrl?: string;
@@ -54,7 +56,7 @@ export interface OzElementsProps {
 export declare const OzElements: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     pubKey: {
         type: StringConstructor;
-        required: true;
+        default: undefined;
     };
     sessionUrl: {
         type: StringConstructor;
@@ -105,7 +107,7 @@ export declare const OzElements: import("vue").DefineComponent<import("vue").Ext
 }>[] | undefined, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "ready"[], "ready", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     pubKey: {
         type: StringConstructor;
-        required: true;
+        default: undefined;
     };
     sessionUrl: {
         type: StringConstructor;
@@ -156,6 +158,7 @@ export declare const OzElements: import("vue").DefineComponent<import("vue").Ext
 }>, {
     debug: boolean;
     fonts: FontSource[];
+    pubKey: string;
     loadTimeoutMs: number;
     frameBaseUrl: string;
     maxTokenizeCalls: number;

package/dist/server/sdk/OzVault.d.ts

@@ -9,7 +9,7 @@ import { ElementType, BankElementType, ElementOptions, VaultOptions, TokenizeOpt
  * @example
  * // Recommended — pass sessionUrl and let the SDK call your backend automatically
  * const vault = await OzVault.create({
- *   pubKey: 'pk_prod_...',  // or 'pk_test_...' for test mode
+ *   pubKey: 'pk_prod_...',  // omit for test vault keys; required for production
  *   sessionUrl: '/api/oz-session',  // backend endpoint that calls ozura.createSession()
  * });
  * const cardNum = vault.createElement('cardNumber');

package/dist/server/types/index.d.ts

@@ -152,9 +152,13 @@ export interface Appearance {
     variables?: AppearanceVariables;
 }
 export interface VaultOptions {
-    /** System pub key required for tokenization. Obtain from Ozura admin.
-     *  Sent as the `X-Pub-Key` header on tokenize requests. */
-    pubKey: string;
+    /** System pub key required for tokenization with production vault keys.
+     *  Sent as the `X-Pub-Key` header on tokenize requests.
+     *
+     *  **Omit when using a test vault key** (from a Test project at ozuravault.com).
+     *  Test keys do not require a pub key — the vault recognizes them and tokenizes
+     *  without the header. For production keys this is required. */
+    pubKey?: string;
     /**
      * URL of your backend session endpoint. The simplest way to connect the SDK
      * to your server — just pass the path and the SDK handles everything else.

package/dist/server/vue/index.d.ts

@@ -26,7 +26,9 @@
 import { type Ref, type PropType, type ComputedRef } from 'vue';
 import type { TokenizeOptions, TokenResponse, BankTokenizeOptions, BankTokenResponse, FontSource, Appearance } from '../types';
 export interface OzElementsProps {
-    pubKey: string;
+    /** Omit when using a test vault key from a Test project at ozuravault.com.
+     *  Required for production vault keys. */
+    pubKey?: string;
     sessionUrl?: string;
     getSessionKey?: (sessionId: string) => Promise<string>;
     frameBaseUrl?: string;
@@ -54,7 +56,7 @@ export interface OzElementsProps {
 export declare const OzElements: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     pubKey: {
         type: StringConstructor;
-        required: true;
+        default: undefined;
     };
     sessionUrl: {
         type: StringConstructor;
@@ -105,7 +107,7 @@ export declare const OzElements: import("vue").DefineComponent<import("vue").Ext
 }>[] | undefined, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "ready"[], "ready", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     pubKey: {
         type: StringConstructor;
-        required: true;
+        default: undefined;
     };
     sessionUrl: {
         type: StringConstructor;
@@ -156,6 +158,7 @@ export declare const OzElements: import("vue").DefineComponent<import("vue").Ext
 }>, {
     debug: boolean;
     fonts: FontSource[];
+    pubKey: string;
     loadTimeoutMs: number;
     frameBaseUrl: string;
     maxTokenizeCalls: number;

package/dist/types/sdk/OzVault.d.ts

@@ -9,7 +9,7 @@ import { ElementType, BankElementType, ElementOptions, VaultOptions, TokenizeOpt
  * @example
  * // Recommended — pass sessionUrl and let the SDK call your backend automatically
  * const vault = await OzVault.create({
- *   pubKey: 'pk_prod_...',  // or 'pk_test_...' for test mode
+ *   pubKey: 'pk_prod_...',  // omit for test vault keys; required for production
  *   sessionUrl: '/api/oz-session',  // backend endpoint that calls ozura.createSession()
  * });
  * const cardNum = vault.createElement('cardNumber');

package/dist/types/types/index.d.ts

@@ -152,9 +152,13 @@ export interface Appearance {
     variables?: AppearanceVariables;
 }
 export interface VaultOptions {
-    /** System pub key required for tokenization. Obtain from Ozura admin.
-     *  Sent as the `X-Pub-Key` header on tokenize requests. */
-    pubKey: string;
+    /** System pub key required for tokenization with production vault keys.
+     *  Sent as the `X-Pub-Key` header on tokenize requests.
+     *
+     *  **Omit when using a test vault key** (from a Test project at ozuravault.com).
+     *  Test keys do not require a pub key — the vault recognizes them and tokenizes
+     *  without the header. For production keys this is required. */
+    pubKey?: string;
     /**
      * URL of your backend session endpoint. The simplest way to connect the SDK
      * to your server — just pass the path and the SDK handles everything else.

package/dist/types/vue/index.d.ts

@@ -26,7 +26,9 @@
 import { type Ref, type PropType, type ComputedRef } from 'vue';
 import type { TokenizeOptions, TokenResponse, BankTokenizeOptions, BankTokenResponse, FontSource, Appearance } from '../types';
 export interface OzElementsProps {
-    pubKey: string;
+    /** Omit when using a test vault key from a Test project at ozuravault.com.
+     *  Required for production vault keys. */
+    pubKey?: string;
     sessionUrl?: string;
     getSessionKey?: (sessionId: string) => Promise<string>;
     frameBaseUrl?: string;
@@ -54,7 +56,7 @@ export interface OzElementsProps {
 export declare const OzElements: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     pubKey: {
         type: StringConstructor;
-        required: true;
+        default: undefined;
     };
     sessionUrl: {
         type: StringConstructor;
@@ -105,7 +107,7 @@ export declare const OzElements: import("vue").DefineComponent<import("vue").Ext
 }>[] | undefined, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "ready"[], "ready", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     pubKey: {
         type: StringConstructor;
-        required: true;
+        default: undefined;
     };
     sessionUrl: {
         type: StringConstructor;
@@ -156,6 +158,7 @@ export declare const OzElements: import("vue").DefineComponent<import("vue").Ext
 }>, {
     debug: boolean;
     fonts: FontSource[];
+    pubKey: string;
     loadTimeoutMs: number;
     frameBaseUrl: string;
     maxTokenizeCalls: number;

package/dist/vue/index.cjs.js

@@ -431,17 +431,26 @@ class OzElement {
             accountNumber: 'account number',
             routingNumber: 'routing number',
         }[this.elementType]) !== null && _a !== void 0 ? _a : this.elementType} input`;
-        // sandbox="allow-scripts" gives correct iframe isolation:
-        // - Scripts run (allow-scripts), so the field JS executes normally.
-        // - NO allow-same-origin: the frame cannot access window.parent's DOM,
-        //   localStorage, or cookies — prevents sandbox escape even if served
-        //   from the same origin.
-        // - NO allow-top-navigation: a rogue/compromised element frame cannot
-        //   navigate window.top (clickjacking prevention).
-        // - NO allow-forms / allow-popups: reduces attack surface.
-        // Field values are delivered via postMessage, so no parent access is
-        // needed — allow-scripts alone is sufficient.
-        iframe.setAttribute('sandbox', 'allow-scripts');
+        // sandbox="allow-scripts allow-same-origin" gives correct iframe isolation:
+        // - allow-scripts: JS runs, so the field JS executes normally.
+        // - allow-same-origin: the frame keeps its actual origin (elements.ozura.com
+        //   in production) so that:
+        //   (a) window.parent.postMessage() carries a real origin that OzVault can
+        //       validate (without this the frame gets a null/opaque origin and every
+        //       OZ_FRAME_READY message is silently dropped by the origin check), and
+        //   (b) OzVault can deliver OZ_INIT back to the frame (postMessage to a
+        //       null-origin target is never delivered).
+        // - In PRODUCTION the frames are served from elements.ozura.com and embedded
+        //   on a different merchant domain — Same-Origin Policy already prevents the
+        //   frame from accessing window.parent.document or merchant cookies, making
+        //   allow-same-origin a no-op from a security perspective.
+        // - In LOCAL DEV (localhost) both parent and frames share the same origin;
+        //   allow-same-origin alongside allow-scripts does technically weaken sandbox
+        //   isolation, but this is a local dev server only — not a production risk.
+        // NOT included: allow-top-navigation, allow-popups, allow-forms — prevents
+        // a compromised element frame from navigating the merchant page or opening
+        // popups even if the CDN bundle were somehow replaced.
+        iframe.setAttribute('sandbox', 'allow-scripts allow-same-origin');
         // Use hash instead of query string — survives clean-URL redirects from static servers.
         // parentOrigin lets the frame target postMessage to the merchant origin instead of '*'.
         const parentOrigin = typeof window !== 'undefined' ? window.location.origin : '';
@@ -1027,7 +1036,7 @@ const DEFAULT_FRAME_BASE_URL = "https://lively-hill-097170c0f.4.azurestaticapps.
  * @example
  * // Recommended — pass sessionUrl and let the SDK call your backend automatically
  * const vault = await OzVault.create({
- *   pubKey: 'pk_prod_...',  // or 'pk_test_...' for test mode
+ *   pubKey: 'pk_prod_...',  // omit for test vault keys; required for production
  *   sessionUrl: '/api/oz-session',  // backend endpoint that calls ozura.createSession()
  * });
  * const cardNum = vault.createElement('cardNumber');
@@ -1135,8 +1144,15 @@ class OzVault {
      * @throws {OzError} if the session fetch fails, times out, or returns an empty string.
      */
     static async create(options, signal) {
-        if (!options.pubKey || !options.pubKey.trim()) {
-            throw new OzError('pubKey is required in options. Obtain your public key from the Ozura admin.');
+        // pubKey is optional — test vault keys (from a Test project on the vault)
+        // do not require a pub key. Production keys do. If provided, it must be
+        // non-empty after trimming; if omitted entirely, warn but continue.
+        if (options.pubKey !== undefined && !options.pubKey.trim()) {
+            throw new OzError('pubKey must be a non-empty string. Omit the option entirely to use a test vault key.');
+        }
+        if (options.pubKey === undefined) {
+            console.warn('[OzVault] pubKey not provided — this only works with a test vault key from a Test project on the vault. ' +
+                'For production, set pubKey to your pk_live_... or pk_prod_... value.');
         }
         // Normalize the session callback. Priority: sessionUrl > getSessionKey > fetchWaxKey (deprecated).
         // This allows merchants to use the clean new API without touching legacy code.
@@ -1345,6 +1361,7 @@ class OzVault {
         const requestId = `req-${uuid()}`;
         this.log('createBankToken() called');
         return new Promise((resolve, reject) => {
+            var _a;
             const resetCountAtStart = this._resetCount;
             const cleanup = () => {
                 if (this._resetCount === resetCountAtStart)
@@ -1365,7 +1382,7 @@ class OzVault {
                     type: 'OZ_BANK_TOKENIZE',
                     requestId,
                     tokenizationSessionId: this.tokenizationSessionId,
-                    pubKey: this.pubKey,
+                    pubKey: (_a = this.pubKey) !== null && _a !== void 0 ? _a : '',
                     firstName: options.firstName.trim(),
                     lastName: options.lastName.trim(),
                     fieldCount: readyBankElements.length,
@@ -1464,6 +1481,7 @@ class OzVault {
             billingPresent: Boolean(options.billing),
         });
         return new Promise((resolve, reject) => {
+            var _a;
             // Capture the reset generation so cleanup() only zeros _tokenizing when it
             // still belongs to this invocation — not a newer one that started after a reset.
             const resetCountAtStart = this._resetCount;
@@ -1488,7 +1506,7 @@ class OzVault {
                     type: 'OZ_TOKENIZE',
                     requestId,
                     tokenizationSessionId: this.tokenizationSessionId,
-                    pubKey: this.pubKey,
+                    pubKey: (_a = this.pubKey) !== null && _a !== void 0 ? _a : '',
                     firstName,
                     lastName,
                     fieldCount: readyElements.length,
@@ -1936,6 +1954,7 @@ class OzVault {
                     if (willRefresh) {
                         const resetCountAtRetry = this._resetCount;
                         this.refreshWaxKey().then(() => {
+                            var _a;
                             if (this._destroyed) {
                                 pending.reject(new OzError('Vault destroyed during wax key refresh.'));
                                 return;
@@ -1968,7 +1987,7 @@ class OzVault {
                                     type: 'OZ_TOKENIZE',
                                     requestId: newRequestId,
                                     tokenizationSessionId: this.tokenizationSessionId,
-                                    pubKey: this.pubKey,
+                                    pubKey: (_a = this.pubKey) !== null && _a !== void 0 ? _a : '',
                                     firstName: pending.firstName,
                                     lastName: pending.lastName,
                                     fieldCount: pending.fieldCount,
@@ -2012,6 +2031,7 @@ class OzVault {
                         if (this.isRefreshableAuthError(errorCode, raw) && !bankPending.retried && this._storedFetchWaxKey) {
                             const resetCountAtRetry = this._resetCount;
                             this.refreshWaxKey().then(() => {
+                                var _a;
                                 if (this._destroyed) {
                                     bankPending.reject(new OzError('Vault destroyed during wax key refresh.'));
                                     return;
@@ -2034,7 +2054,7 @@ class OzVault {
                                         type: 'OZ_BANK_TOKENIZE',
                                         requestId: newRequestId,
                                         tokenizationSessionId: this.tokenizationSessionId,
-                                        pubKey: this.pubKey,
+                                        pubKey: (_a = this.pubKey) !== null && _a !== void 0 ? _a : '',
                                         firstName: bankPending.firstName,
                                         lastName: bankPending.lastName,
                                         fieldCount: bankPending.fieldCount,
@@ -2235,7 +2255,7 @@ const OZ_KEY = Symbol('oz-elements');
 const OzElements = vue.defineComponent({
     name: 'OzElements',
     props: {
-        pubKey: { type: String, required: true },
+        pubKey: { type: String, default: undefined },
         sessionUrl: { type: String, default: undefined },
         getSessionKey: { type: Function, default: undefined },
         frameBaseUrl: { type: String, default: undefined },