@lukso/transaction-view-core 0.5.0-dev.a98e9bc → 0.5.0-dev.c21633f
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.
- package/.turbo/turbo-build.log +17 -17
- package/dist/index.cjs +85 -54
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +85 -54
- package/dist/index.js.map +1 -1
- package/dist/shared/index.cjs +5 -1
- package/dist/shared/index.cjs.map +1 -1
- package/dist/shared/index.d.cts +4 -4
- package/dist/shared/index.d.ts +4 -4
- package/dist/shared/index.js +5 -1
- package/dist/shared/index.js.map +1 -1
- package/package.json +3 -3
- package/src/components/asset-card.ts +61 -58
- package/src/shared/image-list.ts +0 -1
- package/src/shared/value-view.ts +5 -19
- package/src/utils.test.ts +47 -0
- package/src/utils.ts +82 -0
package/dist/index.d.cts
CHANGED
|
@@ -133,7 +133,6 @@ declare class AssetCard extends CoreLitElement {
|
|
|
133
133
|
standard: string | undefined;
|
|
134
134
|
/** Function icon name */
|
|
135
135
|
functionIcon: string;
|
|
136
|
-
size: 'small' | 'medium' | 'large';
|
|
137
136
|
showInfoButton: boolean;
|
|
138
137
|
showCreator: boolean;
|
|
139
138
|
private displayDetails;
|
|
@@ -155,6 +154,7 @@ declare class AssetCard extends CoreLitElement {
|
|
|
155
154
|
private _renderAssets;
|
|
156
155
|
private _renderStandards;
|
|
157
156
|
private _renderTokenDetails;
|
|
157
|
+
private _formattedAmount;
|
|
158
158
|
private renderFormattedTokenIdBadge;
|
|
159
159
|
render(): lit.TemplateResult<1>;
|
|
160
160
|
}
|
package/dist/index.d.ts
CHANGED
|
@@ -133,7 +133,6 @@ declare class AssetCard extends CoreLitElement {
|
|
|
133
133
|
standard: string | undefined;
|
|
134
134
|
/** Function icon name */
|
|
135
135
|
functionIcon: string;
|
|
136
|
-
size: 'small' | 'medium' | 'large';
|
|
137
136
|
showInfoButton: boolean;
|
|
138
137
|
showCreator: boolean;
|
|
139
138
|
private displayDetails;
|
|
@@ -155,6 +154,7 @@ declare class AssetCard extends CoreLitElement {
|
|
|
155
154
|
private _renderAssets;
|
|
156
155
|
private _renderStandards;
|
|
157
156
|
private _renderTokenDetails;
|
|
157
|
+
private _formattedAmount;
|
|
158
158
|
private renderFormattedTokenIdBadge;
|
|
159
159
|
render(): lit.TemplateResult<1>;
|
|
160
160
|
}
|
package/dist/index.js
CHANGED
|
@@ -1995,6 +1995,8 @@ import { useAddressResolver as useAddressResolver4 } from "@lukso/transaction-vi
|
|
|
1995
1995
|
import { html as html11 } from "lit";
|
|
1996
1996
|
import { property as property11, state as state4 } from "lit/decorators.js";
|
|
1997
1997
|
import { when } from "lit/directives/when.js";
|
|
1998
|
+
|
|
1999
|
+
// src/utils.ts
|
|
1998
2000
|
function formatUnits(value, decimals = 18) {
|
|
1999
2001
|
const divisor = 10n ** BigInt(decimals);
|
|
2000
2002
|
const quotient = value / divisor;
|
|
@@ -2006,6 +2008,30 @@ function formatUnits(value, decimals = 18) {
|
|
|
2006
2008
|
const trimmed = remainderStr.replace(/0+$/, "");
|
|
2007
2009
|
return `${quotient}.${trimmed}`;
|
|
2008
2010
|
}
|
|
2011
|
+
function isBigIntString(str) {
|
|
2012
|
+
const trimmed = str.trim();
|
|
2013
|
+
if (trimmed.endsWith("n"))
|
|
2014
|
+
return /^[0-9]+n$/.test(trimmed) || /^0x[0-9a-fA-F]+n$/.test(trimmed);
|
|
2015
|
+
return /^[0-9]+$/.test(trimmed) || /^0x[0-9a-fA-F]+$/.test(trimmed);
|
|
2016
|
+
}
|
|
2017
|
+
function parseBigInt(value) {
|
|
2018
|
+
if (!value) return void 0;
|
|
2019
|
+
if (typeof value === "bigint") return value;
|
|
2020
|
+
if (typeof value === "number") {
|
|
2021
|
+
if (!Number.isInteger(value)) return void 0;
|
|
2022
|
+
return BigInt(value);
|
|
2023
|
+
}
|
|
2024
|
+
const trimmed = value.trim();
|
|
2025
|
+
const cleaned = trimmed.endsWith("n") ? trimmed.slice(0, -1) : trimmed;
|
|
2026
|
+
if (!isBigIntString(cleaned)) return void 0;
|
|
2027
|
+
try {
|
|
2028
|
+
return BigInt(cleaned);
|
|
2029
|
+
} catch {
|
|
2030
|
+
return void 0;
|
|
2031
|
+
}
|
|
2032
|
+
}
|
|
2033
|
+
|
|
2034
|
+
// src/shared/value-view.ts
|
|
2009
2035
|
var ValueView = class extends CoreLitElement {
|
|
2010
2036
|
constructor() {
|
|
2011
2037
|
super(...arguments);
|
|
@@ -2238,7 +2264,7 @@ var ValueView = class extends CoreLitElement {
|
|
|
2238
2264
|
`;
|
|
2239
2265
|
if (effectiveType === "currency") {
|
|
2240
2266
|
const { numeric, symbol } = this.getCurrencyParts();
|
|
2241
|
-
if (this.label
|
|
2267
|
+
if (this.label) {
|
|
2242
2268
|
headerText = this.label;
|
|
2243
2269
|
contentTemplate = html11`
|
|
2244
2270
|
<span class="inline-block overflow-hidden text-ellipsis whitespace-nowrap min-w-0 ${this.getNumericClass()}">${numeric}</span>
|
|
@@ -2949,22 +2975,10 @@ import { Task as Task6 } from "@lit/task";
|
|
|
2949
2975
|
import {
|
|
2950
2976
|
useAddressResolver as useAddressResolver6
|
|
2951
2977
|
} from "@lukso/transaction-view-headless";
|
|
2952
|
-
function formatUnits2(value, decimals = 18) {
|
|
2953
|
-
const divisor = 10n ** BigInt(decimals);
|
|
2954
|
-
const quotient = value / divisor;
|
|
2955
|
-
const remainder = value % divisor;
|
|
2956
|
-
if (remainder === 0n) {
|
|
2957
|
-
return quotient.toString();
|
|
2958
|
-
}
|
|
2959
|
-
const remainderStr = remainder.toString().padStart(decimals, "0");
|
|
2960
|
-
const trimmed = remainderStr.replace(/0+$/, "");
|
|
2961
|
-
return `${quotient}.${trimmed}`;
|
|
2962
|
-
}
|
|
2963
2978
|
var AssetCard = class extends CoreLitElement {
|
|
2964
2979
|
constructor() {
|
|
2965
2980
|
super(...arguments);
|
|
2966
2981
|
this.functionIcon = "code-outline";
|
|
2967
|
-
this.size = "medium";
|
|
2968
2982
|
this.showInfoButton = true;
|
|
2969
2983
|
this.showCreator = true;
|
|
2970
2984
|
this.displayDetails = false;
|
|
@@ -3091,7 +3105,7 @@ var AssetCard = class extends CoreLitElement {
|
|
|
3091
3105
|
const formattedTokenId = this._resolvedData?.formattedTokenId;
|
|
3092
3106
|
const displayTokenId = formattedTokenId ? `${formattedTokenId}` : "";
|
|
3093
3107
|
if (displayTokenId) return displayTokenId;
|
|
3094
|
-
return this.tokenId
|
|
3108
|
+
return this.tokenId ? `${parseInt(this.tokenId, 16)}` : void 0;
|
|
3095
3109
|
}
|
|
3096
3110
|
_renderTokenId() {
|
|
3097
3111
|
const displayTokenId = this.displayedTokenId;
|
|
@@ -3149,6 +3163,7 @@ var AssetCard = class extends CoreLitElement {
|
|
|
3149
3163
|
_renderImages() {
|
|
3150
3164
|
const images = this._resolvedData?.images || [];
|
|
3151
3165
|
if (images.length === 0) return "";
|
|
3166
|
+
if (!this.address) return "";
|
|
3152
3167
|
return html14`
|
|
3153
3168
|
<image-list
|
|
3154
3169
|
address=${this.address}
|
|
@@ -3161,6 +3176,7 @@ var AssetCard = class extends CoreLitElement {
|
|
|
3161
3176
|
_renderAssets() {
|
|
3162
3177
|
const assets = this._resolvedData?.assets || [];
|
|
3163
3178
|
if (assets.length === 0) return "";
|
|
3179
|
+
if (!this.address) return "";
|
|
3164
3180
|
return html14`
|
|
3165
3181
|
<div class="section">
|
|
3166
3182
|
<div class="section-title">Assets</div>
|
|
@@ -3176,11 +3192,11 @@ var AssetCard = class extends CoreLitElement {
|
|
|
3176
3192
|
return html14`
|
|
3177
3193
|
<div class="flex justify-between items-center my-4">
|
|
3178
3194
|
<function-name-view
|
|
3179
|
-
|
|
3180
|
-
|
|
3181
|
-
|
|
3195
|
+
label=${this.functionName || "Execute"}
|
|
3196
|
+
size="small"
|
|
3197
|
+
icon=${this.functionIcon ? this.functionIcon : "code-outline"}
|
|
3182
3198
|
></function-name-view>
|
|
3183
|
-
<function-name-view label=${this._resolvedData?.standard} size="small"></function-name-view>
|
|
3199
|
+
<function-name-view label=${this._resolvedData?.standard ?? "Unknown"} size="small"></function-name-view>
|
|
3184
3200
|
</div>
|
|
3185
3201
|
`;
|
|
3186
3202
|
}
|
|
@@ -3199,6 +3215,14 @@ var AssetCard = class extends CoreLitElement {
|
|
|
3199
3215
|
</div>
|
|
3200
3216
|
`;
|
|
3201
3217
|
}
|
|
3218
|
+
_formattedAmount() {
|
|
3219
|
+
const data = this._resolutionTask.value;
|
|
3220
|
+
const amt = this.amount;
|
|
3221
|
+
if (amt === void 0 || amt === null || amt === "") return void 0;
|
|
3222
|
+
const bigintAmount = parseBigInt(amt);
|
|
3223
|
+
if (bigintAmount === void 0) return void 0;
|
|
3224
|
+
return formatUnits(bigintAmount, data?.decimals);
|
|
3225
|
+
}
|
|
3202
3226
|
renderFormattedTokenIdBadge() {
|
|
3203
3227
|
if (!this.displayedTokenId) return "";
|
|
3204
3228
|
return html14`
|
|
@@ -3209,51 +3233,61 @@ var AssetCard = class extends CoreLitElement {
|
|
|
3209
3233
|
return html14`
|
|
3210
3234
|
<div >
|
|
3211
3235
|
${this._renderStandards()}
|
|
3212
|
-
|
|
3213
|
-
|
|
3214
|
-
|
|
3215
|
-
|
|
3216
|
-
|
|
3217
|
-
|
|
3218
|
-
|
|
3219
|
-
|
|
3220
|
-
|
|
3221
|
-
|
|
3222
|
-
|
|
3223
|
-
|
|
3224
|
-
|
|
3225
|
-
|
|
3226
|
-
|
|
3236
|
+
<div class="mt-6 flex-col">
|
|
3237
|
+
<div class="flex items-center justify-center gap-4">
|
|
3238
|
+
<div class="flex justify-end w-[48%]">
|
|
3239
|
+
<div class="border relative border-neutral-90 rounded-xl">
|
|
3240
|
+
${this.renderFormattedTokenIdBadge()}
|
|
3241
|
+
<div class="p-2 relative">
|
|
3242
|
+
${when3(
|
|
3243
|
+
this.address,
|
|
3244
|
+
() => html14`
|
|
3245
|
+
<icon-view
|
|
3246
|
+
address=${this.address ?? ""}
|
|
3247
|
+
size="2x-large"
|
|
3248
|
+
.showName=${false}
|
|
3249
|
+
></icon-view>
|
|
3250
|
+
`
|
|
3251
|
+
)}
|
|
3252
|
+
</div>
|
|
3253
|
+
<div style="height: 1px;" class="bg-neutral-90 w-full"></div>
|
|
3254
|
+
<div class="px-2">
|
|
3255
|
+
${this._renderAddressSection()}
|
|
3256
|
+
</div>
|
|
3227
3257
|
</div>
|
|
3228
3258
|
</div>
|
|
3229
|
-
</div>
|
|
3230
3259
|
|
|
3231
|
-
|
|
3232
|
-
|
|
3233
|
-
|
|
3234
|
-
|
|
3235
|
-
|
|
3260
|
+
<div class="flex flex-col gap-1 w-[51%]">
|
|
3261
|
+
<div class="text-[14px] font-bold text-neutral-20">
|
|
3262
|
+
${this._resolvedData?.lsp4TokenName || "UNKNOWN"}
|
|
3263
|
+
</div>
|
|
3264
|
+
<div class="text-[17px] font-semibold text-neutral-20">
|
|
3265
|
+
${when3(
|
|
3266
|
+
this.amount,
|
|
3267
|
+
() => html14`
|
|
3268
|
+
<span class="">${this._formattedAmount() ?? ""}</span>
|
|
3269
|
+
<span class="ml-1 text-neutral-60 max-w-[60px] whitespace-nowrap overflow-hidden text-ellipsis text-[14px] font-semibold">${this._resolvedData?.lsp4TokenSymbol || ""}</span>
|
|
3270
|
+
`,
|
|
3271
|
+
() => html14`${this._resolvedData?.lsp4TokenSymbol || ""}`
|
|
3272
|
+
)}
|
|
3273
|
+
</div>
|
|
3274
|
+
|
|
3236
3275
|
${when3(
|
|
3237
3276
|
this.amount,
|
|
3238
3277
|
() => html14`
|
|
3239
|
-
<span class="">${
|
|
3278
|
+
<span class="">${formatUnits(BigInt(this.amount || 0), this._resolvedData?.decimals)}</span>
|
|
3240
3279
|
<span class="ml-1 text-neutral-60 max-w-[60px] whitespace-nowrap overflow-hidden text-ellipsis text-[14px] font-semibold">${this._resolvedData?.lsp4TokenSymbol || ""}</span>
|
|
3241
3280
|
`,
|
|
3242
3281
|
() => html14`${this._resolvedData?.lsp4TokenSymbol || ""}`
|
|
3243
3282
|
)}
|
|
3244
|
-
|
|
3245
|
-
|
|
3246
|
-
|
|
3247
|
-
this.displayedTokenId,
|
|
3248
|
-
() => html14`<div class="text-[14px] font-medium text-neutral-60"><span class="font-bold">#${this.displayedTokenId}</span></div>`
|
|
3249
|
-
)}
|
|
3250
|
-
<div class="mt-4">
|
|
3251
|
-
${when3(this.showCreator, () => this._renderCreatorSection())}
|
|
3283
|
+
<div class="mt-4">
|
|
3284
|
+
${when3(this.showCreator, () => this._renderCreatorSection())}
|
|
3285
|
+
</div>
|
|
3252
3286
|
</div>
|
|
3253
3287
|
</div>
|
|
3254
|
-
|
|
3255
|
-
|
|
3256
|
-
|
|
3288
|
+
<div class="border-neutral-90 pt-2">
|
|
3289
|
+
${this._renderTokenDetails()}
|
|
3290
|
+
</div>
|
|
3257
3291
|
</div>
|
|
3258
3292
|
</div>
|
|
3259
3293
|
`;
|
|
@@ -3277,9 +3311,6 @@ __decorateClass([
|
|
|
3277
3311
|
__decorateClass([
|
|
3278
3312
|
property14({ type: String, attribute: "function-icon" })
|
|
3279
3313
|
], AssetCard.prototype, "functionIcon", 2);
|
|
3280
|
-
__decorateClass([
|
|
3281
|
-
property14({ type: String })
|
|
3282
|
-
], AssetCard.prototype, "size", 2);
|
|
3283
3314
|
__decorateClass([
|
|
3284
3315
|
property14({ type: Boolean, attribute: "show-info-button" })
|
|
3285
3316
|
], AssetCard.prototype, "showInfoButton", 2);
|