@stellar-expert/ui-framework 1.21.0 → 1.21.2

package/date/utc-timestamp.js

@@ -1,29 +1,29 @@
-import React from 'react'
-import PropTypes from 'prop-types'
-import cn from 'classnames'
-import {normalizeDate, formatDateUTC} from '@stellar-expert/formatter'
-import {BlockSelect} from '../interaction/block-select'
-
-export const UtcTimestamp = React.memo(function UtcTimestamp({date, dateOnly, className}) {
-    let formatted
-    try {
-        date = normalizeDate(date)
-        formatted = formatDateUTC(date)
-        if (dateOnly) {
-            formatted = formatted.split(' ')[0]
-        } else {
-            formatted += ' UTC'
-        }
-    } catch (e) {
-        console.error(e)
-        return null
-    }
-    const localTime = date.toString().replace(/ \(.+\)/, '').replace(/\w+ /, '')
-    return <BlockSelect className={cn('condensed nowrap', className)} title={localTime}>{formatted}</BlockSelect>
-})
-
-UtcTimestamp.propTypes = {
-    date: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.instanceOf(Date)]).isRequired,
-    dateOnly: PropTypes.bool,
-    className: PropTypes.string
+import React from 'react'
+import PropTypes from 'prop-types'
+import cn from 'classnames'
+import {normalizeDate, formatDateUTC} from '@stellar-expert/formatter'
+import {BlockSelect} from '../interaction/block-select'
+
+export const UtcTimestamp = React.memo(function UtcTimestamp({date, dateOnly, className}) {
+    let formatted
+    try {
+        date = normalizeDate(date)
+        formatted = formatDateUTC(date)
+        if (dateOnly) {
+            formatted = formatted.split(' ')[0]
+        } else {
+            formatted += ' UTC'
+        }
+    } catch (e) {
+        console.error(e)
+        return null
+    }
+    const localTime = date.toString().replace(/ \(.+\)/, '').replace(/\w+ /, '')
+    return <BlockSelect className={cn('condensed nowrap', className)} title={localTime}>{formatted}</BlockSelect>
+})
+
+UtcTimestamp.propTypes = {
+    date: PropTypes.oneOfType([PropTypes.string, PropTypes.number, PropTypes.instanceOf(Date)]).isRequired,
+    dateOnly: PropTypes.bool,
+    className: PropTypes.string
 }

package/effect/op-effects-view.js

@@ -1,58 +1,58 @@
-import React from 'react'
-import cn from 'classnames'
-import {EffectDescription} from './effect-description'
-import SorobanTxMetricsView from './soroban-tx-metrics-view'
-import './op-effects.scss'
-
-export function OpEffectsView({operation}) {
-    const effects = getEffects(operation)
-    if (!effects.length)
-        return <div className="op-effects">
-            <div className="dimmed">(no effects)</div>
-        </div>
-    return <div className="op-effects">
-        {effects.map((e, i) => {
-            if (e.type === 'contractMetrics')
-                return null
-            return <div key={i}>
-                <i className={cn('effect-icon', e.type === 'contractError' ? 'icon-warning' : 'icon-puzzle')}/>&thinsp;
-                <EffectDescription effect={e} operation={operation}/>
-            </div>
-        })}
-        <SorobanTxMetricsView metrics={effects.find(e => e.type === 'contractMetrics')}/>
-    </div>
-}
-
-function getEffects(op) {
-    let {effects} = op.operation
-    if (op.operation.type === 'invokeHostFunction')
-        return sortContractEffects([...effects])
-    return effects
-}
-
-function sortContractEffects(effects) {
-    effects.sort((a, b) => {
-        const aInvocation = a.type === 'contractInvoked'
-        const bInvocation = b.type === 'contractInvoked'
-        if (aInvocation && bInvocation)
-            return 0
-        if (!aInvocation && !bInvocation) {
-            const aData = a.type === 'setTtl' || a.type.startsWith('contractData')
-            const bData = b.type === 'setTtl' || b.type.startsWith('contractData')
-            if (aData === bData) {
-                if (a.type === 'setTtl')
-                    return 1
-                if (b.type === 'setTtl')
-                    return -1
-                if (a.durability === 'instance' && a.durability !== b.durability)
-                    return -1
-                if (b.durability === 'instance' && a.durability !== b.durability)
-                    return 1
-                return 0
-            }
-            return aData ? 1 : -1
-        }
-        return aInvocation ? -1 : 1
-    })
-    return effects
+import React from 'react'
+import cn from 'classnames'
+import {EffectDescription} from './effect-description'
+import SorobanTxMetricsView from './soroban-tx-metrics-view'
+import './op-effects.scss'
+
+export function OpEffectsView({operation}) {
+    const effects = getEffects(operation)
+    if (!effects.length)
+        return <div className="op-effects">
+            <div className="dimmed">(no effects)</div>
+        </div>
+    return <div className="op-effects">
+        {effects.map((e, i) => {
+            if (e.type === 'contractMetrics')
+                return null
+            return <div key={i}>
+                <i className={cn('effect-icon', e.type === 'contractError' ? 'icon-warning' : 'icon-puzzle')}/>&thinsp;
+                <EffectDescription effect={e} operation={operation}/>
+            </div>
+        })}
+        <SorobanTxMetricsView metrics={effects.find(e => e.type === 'contractMetrics')}/>
+    </div>
+}
+
+function getEffects(op) {
+    let {effects} = op.operation
+    if (op.operation.type === 'invokeHostFunction')
+        return sortContractEffects([...effects])
+    return effects
+}
+
+function sortContractEffects(effects) {
+    effects.sort((a, b) => {
+        const aInvocation = a.type === 'contractInvoked'
+        const bInvocation = b.type === 'contractInvoked'
+        if (aInvocation && bInvocation)
+            return 0
+        if (!aInvocation && !bInvocation) {
+            const aData = a.type === 'setTtl' || a.type.startsWith('contractData')
+            const bData = b.type === 'setTtl' || b.type.startsWith('contractData')
+            if (aData === bData) {
+                if (a.type === 'setTtl')
+                    return 1
+                if (b.type === 'setTtl')
+                    return -1
+                if (a.durability === 'instance' && a.durability !== b.durability)
+                    return -1
+                if (b.durability === 'instance' && a.durability !== b.durability)
+                    return 1
+                return 0
+            }
+            return aData ? 1 : -1
+        }
+        return aInvocation ? -1 : 1
+    })
+    return effects
 }

package/horizon/horizon-orderbook-helpers.js

@@ -1,14 +1,14 @@
-import {AssetDescriptor} from '@stellar-expert/asset-descriptor'
-import {applyListQueryParameters, initHorizon} from './horizon-client-helpers'
-
-/**
- * Load orderbook for assets.
- * @param {object} selling - Selling asset.
- * @param {object} buying - Buying asset.
- * @param {ListQueryParams} [queryParams] - Query parameters (optional).
- * @return {Promise<Array<object>>}
- */
-export function loadOrderbook(selling, buying, queryParams = null) {
-    const query = applyListQueryParameters(initHorizon().orderbook(AssetDescriptor.parse(selling).toAsset(), AssetDescriptor.parse(buying).toAsset()), queryParams)
-    return query.call()
-}
+import {AssetDescriptor} from '@stellar-expert/asset-descriptor'
+import {applyListQueryParameters, initHorizon} from './horizon-client-helpers'
+
+/**
+ * Load orderbook for assets.
+ * @param {object} selling - Selling asset.
+ * @param {object} buying - Buying asset.
+ * @param {ListQueryParams} [queryParams] - Query parameters (optional).
+ * @return {Promise<Array<object>>}
+ */
+export function loadOrderbook(selling, buying, queryParams = null) {
+    const query = applyListQueryParameters(initHorizon().orderbook(AssetDescriptor.parse(selling).toAsset(), AssetDescriptor.parse(buying).toAsset()), queryParams)
+    return query.call()
+}

package/package.json

@@ -1,10 +1,9 @@
 {
   "name": "@stellar-expert/ui-framework",
-  "version": "1.21.0",
+  "version": "1.21.2",
   "description": "StellarExpert shared UI components library",
   "author": "orbitlens <orbit@stellar.expert>",
   "license": "MIT",
-  "type": "module",
   "main": "index.js",
   "module": "./index.js",
   "types": "index.d.ts",
@@ -21,7 +20,7 @@
     "@stellar-expert/asset-descriptor": "^2.0.0",
     "@stellar-expert/claimable-balance-utils": "^2.0.0",
     "@stellar-expert/client-cache": "^1.1.0",
-    "@stellar-expert/contract-wasm-interface-parser": "^5.0.0",
+    "@stellar-expert/contract-wasm-interface-parser": "^5.0.1",
     "@stellar-expert/formatter": "^3.1.0",
     "@stellar-expert/navigation": "^1.1.0",
     "@stellar-expert/tx-meta-effects-parser": "^9.3.0",

package/tx/op-accounting-changes.js

@@ -1,27 +1,27 @@
-import React from 'react'
-import {Amount} from '../asset/amount'
-import {retrieveOpBalanceChanges} from './parser/op-balance-changes'
-
-/**
- * Compact accounting effects (credited/debited amounts)
- * @param {OperationDescriptor} op
- * @constructor
- */
-export function OpAccountingChanges({op}) {
-    const changes = retrieveOpBalanceChanges(op)
-    return <div className="accounting-effects condensed">
-        {changes.map((ch, i) => <div key={op.txHash + op.order + i}
-                                     className={ch.type === 'accountDebited' ? 'dimmed' : 'color-success'}>
-            {ch.type === 'accountDebited' ? '-' : '+'}
-            <Amount amount={ch.amount} asset={ch.asset} issuer={false} icon={false} adjust/>
-        </div>)}
-    </div>
-}
-
-export function TxFeeAccountingChanges({amount}) {
-    return <div className="accounting-effects condensed">
-        <div className="dimmed">
-            -<Amount amount={amount} asset="XLM" issuer={false} icon={false} adjust/>
-        </div>
-    </div>
+import React from 'react'
+import {Amount} from '../asset/amount'
+import {retrieveOpBalanceChanges} from './parser/op-balance-changes'
+
+/**
+ * Compact accounting effects (credited/debited amounts)
+ * @param {OperationDescriptor} op
+ * @constructor
+ */
+export function OpAccountingChanges({op}) {
+    const changes = retrieveOpBalanceChanges(op)
+    return <div className="accounting-effects condensed">
+        {changes.map((ch, i) => <div key={op.txHash + op.order + i}
+                                     className={ch.type === 'accountDebited' ? 'dimmed' : 'color-success'}>
+            {ch.type === 'accountDebited' ? '-' : '+'}
+            <Amount amount={ch.amount} asset={ch.asset} issuer={false} icon={false} adjust/>
+        </div>)}
+    </div>
+}
+
+export function TxFeeAccountingChanges({amount}) {
+    return <div className="accounting-effects condensed">
+        <div className="dimmed">
+            -<Amount amount={amount} asset="XLM" issuer={false} icon={false} adjust/>
+        </div>
+    </div>
 }

package/tx/tx-fee-effect.js

@@ -1,14 +1,14 @@
-import React from 'react'
-import {Amount} from '../asset/amount'
-import {fromStroops} from '@stellar-expert/formatter'
-
-export default function TxFeeEffect({feeEffect, compact}) {
-    const {charged, bid, bump} = feeEffect
-    if (charged)
-        return <div>
-            <Amount amount={fromStroops(charged)} asset="XLM" issuer={!compact}/> transaction {!!bump && 'bump'} fee charged
-        </div>
-    return <div>
-        Charge transaction {!!bump && 'bump'} fee <Amount amount={fromStroops(bid)} asset="XLM" issuer={!compact}/>
-    </div>
+import React from 'react'
+import {Amount} from '../asset/amount'
+import {fromStroops} from '@stellar-expert/formatter'
+
+export default function TxFeeEffect({feeEffect, compact}) {
+    const {charged, bid, bump} = feeEffect
+    if (charged)
+        return <div>
+            <Amount amount={fromStroops(charged)} asset="XLM" issuer={!compact}/> transaction {!!bump && 'bump'} fee charged
+        </div>
+    return <div>
+        Charge transaction {!!bump && 'bump'} fee <Amount amount={fromStroops(bid)} asset="XLM" issuer={!compact}/>
+    </div>
 }