@lukso/transaction-view-headless 0.4.3 → 0.4.4-dev.c5d67d4

package/.turbo/turbo-build.log

@@ -1,6 +1,6 @@
  WARN  Issue while reading "/home/runner/work/service-auth-simple/service-auth-simple/.npmrc". Failed to replace env in config: ${LUKSO_NPM_TOKEN}
 
-> @lukso/transaction-view-headless@0.4.3 build /home/runner/work/service-auth-simple/service-auth-simple/packages/transaction-view-headless
+> @lukso/transaction-view-headless@0.4.4 build /home/runner/work/service-auth-simple/service-auth-simple/packages/transaction-view-headless
 > tsup
 
 CLI Building entry: {"index":"src/index.ts","types/index":"src/types/index.ts","composables/index":"src/composables/index.ts","registry/index":"src/registry/index.ts","utils/index":"src/utils/index.ts"}
@@ -11,42 +11,44 @@
 CLI Cleaning output folder
 ESM Build start
 CJS Build start
-ESM dist/index.js                 42.79 KB
-ESM dist/types/index.js           33.00 B
-ESM dist/composables/index.js     37.86 KB
+ESM dist/index.js                 44.39 KB
+ESM dist/types/index.js           1.72 KB
+ESM dist/composables/index.js     37.78 KB
 ESM dist/registry/index.js        13.51 KB
 ESM dist/utils/index.js           5.68 KB
-ESM dist/index.js.map             98.99 KB
-ESM dist/types/index.js.map       71.00 B
-ESM dist/composables/index.js.map 91.87 KB
+ESM dist/index.js.map             108.22 KB
+ESM dist/types/index.js.map       9.19 KB
+ESM dist/composables/index.js.map 91.99 KB
 ESM dist/registry/index.js.map    29.88 KB
 ESM dist/utils/index.js.map       13.75 KB
-ESM ⚡️ Build success in 240ms
-CJS dist/index.cjs                 46.37 KB
-CJS dist/types/index.cjs           798.00 B
-CJS dist/composables/index.cjs     40.33 KB
+ESM ⚡️ Build success in 194ms
+CJS dist/index.cjs                 48.25 KB
+CJS dist/types/index.cjs           2.98 KB
+CJS dist/composables/index.cjs     40.25 KB
 CJS dist/registry/index.cjs        14.91 KB
 CJS dist/utils/index.cjs           6.80 KB
-CJS dist/index.cjs.map             99.24 KB
-CJS dist/types/index.cjs.map       450.00 B
-CJS dist/composables/index.cjs.map 92.00 KB
+CJS dist/index.cjs.map             108.50 KB
+CJS dist/types/index.cjs.map       9.95 KB
+CJS dist/composables/index.cjs.map 92.12 KB
 CJS dist/registry/index.cjs.map    30.27 KB
 CJS dist/utils/index.cjs.map       13.93 KB
-CJS ⚡️ Build success in 241ms
+CJS ⚡️ Build success in 201ms
 📦 Build complete (build mode)
 DTS Build start
-DTS ⚡️ Build success in 22798ms
-DTS dist/index.d.ts                 4.15 KB
-DTS dist/types/index.d.ts           7.07 KB
-DTS dist/registry/index.d.ts        1.62 KB
-DTS dist/utils/index.d.ts           1.94 KB
-DTS dist/composables/index.d.ts     1.06 KB
-DTS dist/view-loader-ii8AxiQR.d.ts  3.73 KB
-DTS dist/index-CMLU1hKL.d.ts        13.83 KB
-DTS dist/index.d.cts                4.16 KB
-DTS dist/types/index.d.cts          7.07 KB
-DTS dist/registry/index.d.cts       1.62 KB
-DTS dist/utils/index.d.cts          1.94 KB
-DTS dist/composables/index.d.cts    1.06 KB
-DTS dist/view-loader-dD86QAlQ.d.cts 3.73 KB
-DTS dist/index-CSDjhiKV.d.cts       13.83 KB
+DTS ⚡️ Build success in 25158ms
+DTS dist/index.d.ts                   4.51 KB
+DTS dist/types/index.d.ts             8.36 KB
+DTS dist/registry/index.d.ts          1.65 KB
+DTS dist/utils/index.d.ts             1.97 KB
+DTS dist/composables/index.d.ts       1.09 KB
+DTS dist/view-loader--mEEI8YY.d.ts    3.76 KB
+DTS dist/view-matching-C9G3z8lQ.d.ts  7.13 KB
+DTS dist/index-CNUHqRdk.d.ts          13.86 KB
+DTS dist/index.d.cts                  4.52 KB
+DTS dist/types/index.d.cts            8.36 KB
+DTS dist/registry/index.d.cts         1.65 KB
+DTS dist/utils/index.d.cts            1.97 KB
+DTS dist/composables/index.d.cts      1.09 KB
+DTS dist/view-loader-D7ApWfdN.d.cts   3.76 KB
+DTS dist/view-matching-C9G3z8lQ.d.cts 7.13 KB
+DTS dist/index-BqL7xdDl.d.cts         13.86 KB

package/.turbo/turbo-typecheck.log

@@ -1,5 +1,5 @@
  WARN  Issue while reading "/home/runner/work/service-auth-simple/service-auth-simple/.npmrc". Failed to replace env in config: ${LUKSO_NPM_TOKEN}
 
-> @lukso/transaction-view-headless@0.4.3 typecheck /home/runner/work/service-auth-simple/service-auth-simple/packages/transaction-view-headless
+> @lukso/transaction-view-headless@0.4.4 typecheck /home/runner/work/service-auth-simple/service-auth-simple/packages/transaction-view-headless
 > tsc --noEmit
 

package/ARG_ACCESS_PATTERN.md

@@ -0,0 +1,265 @@
+# Accessing Transaction Arguments - Correct Pattern
+
+## Current Structure (As of Latest Version)
+
+Transaction arguments are stored in an `args` array with this structure:
+
+```typescript
+interface DecoderResult {
+  // ...
+  args: Array<{
+    name: string           // Argument name (e.g., "from", "to", "amount")
+    type: string           // Solidity type (e.g., "address", "uint256")
+    value: any             // The actual value
+    internalType?: string  // Internal type if different (rarely used)
+  }>
+}
+```
+
+## ❌ Old Pattern (Don't Use)
+
+```typescript
+// OLD - namedArgs is deprecated
+const from = transaction.namedArgs?.from
+const to = transaction.namedArgs?.to
+const amount = transaction.namedArgs?.amount
+```
+
+## ✅ Correct Pattern
+
+### Use the Built-in Helper
+
+The `@lukso/transaction-decoder` package exports a `getArgByName` helper:
+
+```typescript
+import { getArgByName } from '@lukso/transaction-decoder'
+
+// Get individual args
+const from = getArgByName(transaction.args, 'from') as string | undefined
+const to = getArgByName(transaction.args, 'to') as string | undefined
+const amount = getArgByName(transaction.args, 'amount') as bigint | undefined
+const force = (getArgByName(transaction.args, 'force') as boolean) ?? false
+const data = (getArgByName(transaction.args, 'data') as string) ?? '0x'
+```
+
+### Implementation (for reference)
+
+```typescript
+/**
+ * Get argument value by name from transaction args array
+ * Already exported from @lukso/transaction-decoder
+ */
+export function getArgByName(
+  args: ArrayArgs | undefined,
+  name: string
+): unknown {
+  if (!args) return undefined
+  const arg = args.find((arg) => arg.name === name)
+  return arg?.value
+}
+```
+
+### In View Components
+
+```typescript
+import { getArgByName } from '@lukso/transaction-decoder'
+import { dispatchHeaderInfo, dispatchTransactionModification } from '@lukso/transaction-view-headless'
+
+@customElement('lsp7-transfer-view')
+export class LSP7TransferView extends CoreLitElement {
+  @property({ type: Object }) transaction!: DecoderResult
+
+  connectedCallback() {
+    super.connectedCallback()
+
+    // Emit header info
+    dispatchHeaderInfo(this, {
+      from: getArgByName(this.transaction.args, 'from') as string,
+      to: getArgByName(this.transaction.args, 'to') as string,
+      title: 'LSP7 Transfer'
+    })
+  }
+
+  private handleForceChange(checked: boolean) {
+    // Re-encode with updated argument
+    const newData = encodeFunctionData({
+      abi: LSP7_ABI,
+      functionName: 'transfer',
+      args: [
+        getArgByName(this.transaction.args, 'from'),
+        getArgByName(this.transaction.args, 'to'),
+        getArgByName(this.transaction.args, 'amount'),
+        checked,  // <-- modified
+        getArgByName(this.transaction.args, 'data') ?? '0x'
+      ]
+    })
+
+    dispatchTransactionModification(this, {
+      data: newData,
+      transactionIndex: this.index,
+      reason: 'User enabled force transfer',
+      userInitiated: true
+    })
+  }
+}
+```
+
+### In Recomposition Logic
+
+```typescript
+import { getArgByName } from '@lukso/transaction-decoder'
+
+private async recomposeWrapper(wrapper: DecoderResult): Promise<string> {
+  switch (wrapper.functionName) {
+    case 'execute':
+      return encodeFunctionData({
+        abi: UP_ABI,
+        functionName: 'execute',
+        args: [
+          getArgByName(wrapper.args, 'operationType') as number,
+          getArgByName(wrapper.args, 'target') as string,
+          getArgByName(wrapper.args, 'value') as bigint,
+          wrapper.children[0].data  // <-- updated child data
+        ]
+      })
+
+    case 'executeBatch':
+      return encodeFunctionData({
+        abi: UP_ABI,
+        functionName: 'executeBatch',
+        args: [
+          getArgByName(wrapper.args, 'operationTypes') as number[],
+          getArgByName(wrapper.args, 'targets') as string[],
+          getArgByName(wrapper.args, 'values') as bigint[],
+          wrapper.children.map(child => child.data)  // <-- updated children
+        ]
+      })
+
+    case 'executeRelayCall':
+      return encodeFunctionData({
+        abi: KEY_MANAGER_ABI,
+        functionName: 'executeRelayCall',
+        args: [
+          getArgByName(wrapper.args, 'signature') as string,
+          getArgByName(wrapper.args, 'nonce') as bigint,
+          getArgByName(wrapper.args, 'validityTimestamps') as bigint,
+          wrapper.children[0].data  // <-- updated execute/executeBatch
+        ]
+      })
+  }
+}
+```
+
+## Migration Guide
+
+### Before (namedArgs - deprecated)
+
+```typescript
+// Header info
+dispatchHeaderInfo(this, {
+  from: this.transaction.namedArgs?.from,
+  to: this.transaction.namedArgs?.to
+})
+
+// Recompose wrapper
+encodeFunctionData({
+  abi: UP_ABI,
+  functionName: 'execute',
+  args: [
+    wrapper.namedArgs.operationType,
+    wrapper.namedArgs.target,
+    wrapper.namedArgs.value,
+    wrapper.children[0].data
+  ]
+})
+```
+
+### After (args array with getArgByName)
+
+```typescript
+import { getArgByName } from '@lukso/transaction-decoder'
+
+// Header info
+dispatchHeaderInfo(this, {
+  from: getArgByName(this.transaction.args, 'from') as string,
+  to: getArgByName(this.transaction.args, 'to') as string
+})
+
+// Recompose wrapper
+encodeFunctionData({
+  abi: UP_ABI,
+  functionName: 'execute',
+  args: [
+    getArgByName(wrapper.args, 'operationType') as number,
+    getArgByName(wrapper.args, 'target') as string,
+    getArgByName(wrapper.args, 'value') as bigint,
+    wrapper.children[0].data
+  ]
+})
+```
+
+## Type Safety
+
+For better type safety, you can create typed getters:
+
+```typescript
+class TransactionArgHelper {
+  constructor(private tx: DecoderResult) {}
+
+  getString(name: string): string | undefined {
+    return this.tx.args?.find(arg => arg.name === name)?.value as string
+  }
+
+  getBigInt(name: string): bigint | undefined {
+    return this.tx.args?.find(arg => arg.name === name)?.value as bigint
+  }
+
+  getBoolean(name: string): boolean | undefined {
+    return this.tx.args?.find(arg => arg.name === name)?.value as boolean
+  }
+
+  getAddress(name: string): string | undefined {
+    return this.getString(name)  // Addresses are strings
+  }
+
+  getArray<T>(name: string): T[] | undefined {
+    return this.tx.args?.find(arg => arg.name === name)?.value as T[]
+  }
+}
+
+// Usage
+const helper = new TransactionArgHelper(transaction)
+const from = helper.getAddress('from')
+const amount = helper.getBigInt('amount')
+const force = helper.getBoolean('force') ?? false
+```
+
+## Summary
+
+**Key Change**: `transaction.namedArgs.foo` → `getArgByName(transaction.args, 'foo')`
+
+**Always use `getArgByName` from `@lukso/transaction-decoder` to access arguments by name from the `args` array.**
+
+### Quick Reference
+
+```typescript
+import { getArgByName } from '@lukso/transaction-decoder'
+
+// Extract args
+const from = getArgByName(transaction.args, 'from') as string
+const to = getArgByName(transaction.args, 'to') as string
+const amount = getArgByName(transaction.args, 'amount') as bigint
+const force = (getArgByName(transaction.args, 'force') as boolean) ?? false
+
+// In recomposition
+encodeFunctionData({
+  abi: UP_ABI,
+  functionName: 'execute',
+  args: [
+    getArgByName(wrapper.args, 'operationType') as number,
+    getArgByName(wrapper.args, 'target') as string,
+    getArgByName(wrapper.args, 'value') as bigint,
+    wrapper.children[0].data
+  ]
+})
+```

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # Changelog
 
+## [0.4.4](https://github.com/lukso-network/service-auth-simple/compare/transaction-view-headless-v0.4.3...transaction-view-headless-v0.4.4) (2025-12-23)
+
+
+### Bug Fixes
+
+* Repair tailwinds in playback screen ([#81](https://github.com/lukso-network/service-auth-simple/issues/81)) ([a07a66f](https://github.com/lukso-network/service-auth-simple/commit/a07a66fd5f1bc6e8d4df638d32dc2ec6479ea0e9))
+
+
+### Dependencies
+
+* The following workspace dependencies were updated
+  * dependencies
+    * @lukso/transaction-decoder bumped to 1.3.4
+
 ## [0.4.3](https://github.com/lukso-network/service-auth-simple/compare/transaction-view-headless-v0.4.2...transaction-view-headless-v0.4.3) (2025-12-17)
 
 

package/CONTEXT_VARIANT_GUIDE.md

@@ -227,14 +227,14 @@ customMatcher: (tx) => BigInt(tx.value || '0') > BigInt('1000000000000000000') /
 
 // Check specific parameter
 customMatcher: (tx) => {
-  const amount = tx.namedArgs?.find(arg => arg.name === 'amount')
-  return amount && BigInt(amount.value) > BigInt('1000000')
+  const amount = getArgByName(tx.args, 'amount') as bigint | undefined
+  return amount && BigInt(amount) > BigInt('1000000')
 }
 
 // Check array length
 customMatcher: (tx) => {
-  const recipients = tx.namedArgs?.find(arg => arg.name === 'recipients')
-  return recipients && Array.isArray(recipients.value) && recipients.value.length > 5
+  const recipients = getArgByName(tx.args, 'recipients') as any[] | undefined
+  return recipients && Array.isArray(recipients) && recipients.length > 5
 }
 
 // Complex logic