@spicenet-io/spiceflow-ui 4.14.2 → 4.14.3

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/README.md ADDED
@@ -0,0 +1,499 @@
1
+ # SpiceFlow UI SDK
2
+
3
+ A React component library for building DeFi swap interfaces with multi-chain support.
4
+
5
+ ## Version and migration
6
+
7
+ Release `4.11.0` includes quote prewarming, scoped fee-hint reuse, concurrent fee
8
+ checks, configurable fee-estimate tolerance, and faster execution-status polling.
9
+ It uses `@spicenet-io/spiceflow-core@0.7.3`. Source spend caps, destination minimums
10
+ and required destination receipts remain enforced. See the fee-estimate tolerance
11
+ section below for the default and configuration.
12
+
13
+ Check the actual registry tag and client pin before adopting it. See
14
+ [CONSISTENCY-MIGRATION.md](CONSISTENCY-MIGRATION.md) for the earlier inventory/action
15
+ migration. Publishing the SDK does not upgrade consuming apps automatically.
16
+
17
+ ## Installation and provider setup
18
+
19
+ Select an approved exact version, preserving the app's dependency-age and security policies:
20
+
21
+ ```bash
22
+ bun add --exact @spicenet-io/spiceflow-ui@4.11.0
23
+ ```
24
+
25
+ Reuse compatible host-owned Privy, wagmi and QueryClient providers. Read the exact
26
+ package's peer dependencies; do not replace the wallet stack as part of a version bump.
27
+
28
+ The SDK adds its stylesheet (spinner keyframes, focus ring, reduced-motion rule) to the
29
+ page when it loads, so no CSS import is needed. `@spicenet-io/spiceflow-ui/styles.css`
30
+ is still exported for a host whose Content Security Policy forbids inline styles;
31
+ importing it as well is harmless.
32
+
33
+ ```tsx
34
+ import { SpiceFlowProvider } from "@spicenet-io/spiceflow-ui";
35
+
36
+ // Inside the host's existing WagmiProvider → QueryClientProvider → PrivyProvider stack.
37
+ <SpiceFlowProvider
38
+ provider="privy"
39
+ network="mainnet"
40
+ nativeChainId={8453}
41
+ rpcOverrides={clientRpcUrls}
42
+ >
43
+ {children}
44
+ </SpiceFlowProvider>;
45
+ ```
46
+
47
+ Configure Privy credentials/policy on the host's `PrivyProvider`. Supply client RPCs
48
+ through `rpcOverrides` for the chains you exercise, and keep the SDK/wallet chain sets
49
+ aligned. An entry in `rpcOverrides` always wins; a chain without one uses the chain's
50
+ built-in endpoint, so an integration that passes none keeps working. Wallet-library
51
+ transports alone do not configure SDK reads. Rollup price lookups read only a
52
+ host-configured RPC. Keep private credentials out of browser bundles.
53
+
54
+ ## Integration ownership
55
+
56
+ - Use stock components when they fit the approved UI; use `useSpiceSupply` for custom
57
+ action forms. `useSpiceLock` and legacy `useSpiceAction` delegate to that controller.
58
+ - In this source (not yet published), `useSpiceSupply` defaults `enabled` to `true`.
59
+ Omit it for a mounted action form, or pass `enabled: isOpen` when a hidden form stays
60
+ mounted. Use `canExecute` for submit-button readiness; fee calculation does not
61
+ require toggling `enabled`. Published 4.10.0 still requires an explicit value.
62
+ - Declare the destination token by chain and address:
63
+ `destinationToken={{ chainId: 8453, address: USDC }}`. The SDK takes the symbol and
64
+ decimals from the chain's token registry, then from the token contract, and holds the
65
+ action until they are known. Decimals that cannot be read block the action; a symbol
66
+ that cannot be read falls back to the shortened address. Any field you pass wins, so a
67
+ full `{ address, symbol, decimals, chainId }` object behaves exactly as before.
68
+ - Supply destination metadata, protocol `buildActionCalls` or destination-only
69
+ `lockBatches`, beneficiary semantics, and awaited application updates. The SDK owns
70
+ inventory, routing, Max, fees, accepted plans, funding, execution and recovery.
71
+ - For the account, use `useSpiceAccount()` instead of reading `SpiceFlowProviderContext`:
72
+ `mode` (`"embedded"` or `"external"`), `setMode`, `ownerAddress` for the current mode,
73
+ both wallet addresses and the whitelist state. A provider with a fixed `mode` prop
74
+ ignores `setMode`.
75
+ - For custom holdings, use `useSpiceInventory` and `assetPositionId`. Keep raw balance,
76
+ default visibility and spend eligibility separate. Preserve rows during refresh;
77
+ stale/failed balances cannot authorize spending, and confirmed zero wins.
78
+ - In this unreleased source, eligible External-mode actions with a matching wallet token
79
+ and destination chain execute directly from the external signer, without embedded funding.
80
+ Other assets/chains still use embedded funding and the shared routed executor.
81
+ `onPayExecute` and `onLockExecute` remain blocked; the deprecated external-caller hint
82
+ supports only the direct case. Verify contract caller/beneficiary and NFT receiver behavior.
83
+ Published `.16` does not contain this restoration.
84
+ - Supply `input` adds fees to principal; `input-inclusive` uses a total budget; Pay
85
+ `output` fixes the destination amount. Use controller readiness/Max/status instead of
86
+ constructing an executor context or duplicating fee arithmetic in the host.
87
+ - Use controller recovery for uncertain funding and `retryFinalization()` for failed
88
+ application updates after settlement. Preserve original host terms across reload.
89
+ - Deposit and rollup Withdraw retain distinct execution semantics while sharing
90
+ inventory/policy. Account wallet withdrawal uses the fee-only Supply path.
91
+
92
+ Inventory isolation does not establish support for simultaneous differently configured
93
+ providers: underlying quote/execution transports still have global state.
94
+
95
+ ## Liquidity venues
96
+
97
+ When a flow has to swap on the destination chain, the SDK quotes every liquidity
98
+ venue that covers that chain and takes the best fill: the most output on a
99
+ supply, the least input on a pay. Routing is decided here, on your RPC. The
100
+ solver only executes the calls the winning quote produced.
101
+
102
+ Leave `liquidityVenues` off and you get the built-in venues. Declare it once on
103
+ the provider to add your own, and every component picks them up.
104
+
105
+ ```tsx
106
+ <SpiceFlowProvider
107
+ network="mainnet"
108
+ nativeChainId={4663}
109
+ rpcOverrides={{ 4663: ROBINHOOD_RPC }}
110
+ liquidityVenues={{
111
+ venues: [
112
+ {
113
+ protocol: "uniswap-v3",
114
+ chainId: 4663,
115
+ swapRouter: "0x1e406484F1F204b23cE84B9901C0171a738fd406",
116
+ quoterV2: "0x3E290e5E01818002A0b672148BdC7514D861C7B3",
117
+ hubCurrencies: ["0x0bd7d308f8e1639fab988df18a8011f41eacad73"],
118
+ },
119
+ ],
120
+ }}
121
+ >
122
+ ```
123
+
124
+ Your venues race the built-ins on price; they do not override them. Set
125
+ `includeDefaults: false` to drop the built-ins and route only through what you
126
+ declared. On a chain with no venue at all, quoting fails with that chain named
127
+ rather than falling back to something you did not configure.
128
+
129
+ Every entry names one chain and one protocol family, and serves both swap
130
+ directions. Supply the **deployment's** addresses, not a pool address: a
131
+ v3-style pool calls back into `msg.sender`, so swaps go through the router and
132
+ quotes through the quoter. The SDK finds the pools from the fee tiers (or tick
133
+ spacings) and hub currencies.
134
+
135
+ | `protocol` | Required | Optional |
136
+ | ---------------------- | ------------------------------------------------- | -------------------------------------------------------- |
137
+ | `uniswap-v3` | `chainId`, `swapRouter`, `quoterV2` | `name`, `feeTiers`, `hubCurrencies`, `routerHasDeadline` |
138
+ | `uniswap-v4` | `chainId`, `quoter`, `universalRouter`, `permit2` | `name`, `hubCurrencies` |
139
+ | `aerodrome-slipstream` | `chainId`, `swapRouter`, `quoterV2` | `name`, `tickSpacings`, `hubCurrencies` |
140
+
141
+ `name` is the label shown to the user as "via <name>" once a swap is quoted, so
142
+ give it the name people know the venue by. It defaults to the protocol, which
143
+ means a swap always names something real rather than a family it does not belong
144
+ to.
145
+
146
+ `hubCurrencies` are the intermediate tokens tried for two-hop routes, usually
147
+ wrapped native and the chain's main stablecoin. Set `routerHasDeadline` when the
148
+ deployment forked the original Uniswap `SwapRouter`, whose exact-output structs
149
+ carry a deadline; SwapRouter02 forks do not.
150
+
151
+ Most DEXs are forks of one of these families, so adding one is addresses only.
152
+ A venue from a different family (a Uniswap v2 pair, Curve, Balancer) needs an
153
+ adapter in the SDK — send us the chain, router, quoter and one funded pool and
154
+ it becomes a `protocol` everyone can name.
155
+
156
+ ## Components
157
+
158
+ - **SwapWidget** - Main swap interface component
159
+ - **AssetSelector** - Token selection component
160
+ - **SpiceDeposit** - Deposit modal component
161
+ - **StatusDisplay** - Transaction status display
162
+ - **ProviderLogin** - Wallet connection component
163
+ - **DebugWidget** - Development debugging component
164
+ - **Button**, **Input**, **Modal** - UI primitives
165
+
166
+ ## Development
167
+
168
+ ### Rollup balance pricing
169
+
170
+ Rollup USD values use the host-configured RPC provider's pricing capability when the balance API has no valid value. The built-in account panel and withdrawal modal enable this while open; custom `useSpiceAssets` consumers can opt in with `priceEnabled`. Quantities arrive independently. Lookups follow receipt mappings, prefer `nativeChainId`, and fall back to other supported chains with a configured Alchemy endpoint. Explicit account `tokenPrices` overrides still take precedence over provider quotes.
171
+
172
+ Wallet discovery and rollup balances share a one-minute quote cache. Pricing polls only while the view is open and the page is visible. A failed refresh can retain a marked stale quote for up to five minutes; an unavailable quote displays `—`. No extra key, internal RPC, or symbol-based ERC-20 price fallback is used.
173
+
174
+ ### Host tokens
175
+
176
+ A token the SDK does not know (a protocol's own token, a receipt token) is declared
177
+ once on the provider. Every surface that lists balances then reads it: Supply, Pay,
178
+ Lock, the account panel and Withdraw.
179
+
180
+ ```tsx
181
+ <SpiceFlowProvider
182
+ additionalSourceTokens={[{ address: TOKEN, chainId: 8453, symbol: "TOKEN", decimals: 18 }]}
183
+ >
184
+ ```
185
+
186
+ A component's or hook's own `additionalSourceTokens` still works and is added to the
187
+ provider's list.
188
+
189
+ ### Host token prices
190
+
191
+ A host token usually has no price the SDK can find, so the account panel lists it
192
+ without a USD value. `AccountDisplay.tokenPrices` takes the host's own price for it,
193
+ keyed by `chainId:address`. The value counts toward the account total and the row
194
+ sorts with the rest.
195
+
196
+ ```tsx
197
+ <AccountDisplay tokenPrices={{ [`8453:${TOKEN}`]: tokenUsdPrice }} />
198
+ ```
199
+
200
+ The SDK's own price wins whenever it has one. A symbol key prices rollup balances
201
+ only: any wallet token can carry any symbol, so a wallet balance is matched by address
202
+ alone. The price is for display and never changes which balance an action spends.
203
+
204
+ ### Host-supplied token logos
205
+
206
+ `AccountDisplay.tokenLogos` maps a token symbol to a logo URL, the same key
207
+ shape `tokenPrices` uses. A discovered embedded-wallet balance falls back to
208
+ it when the RPC provider returns no logo, which is what happens for a token
209
+ that is not in the chain's configured token list. Provider metadata still
210
+ wins when it has a logo.
211
+
212
+ ```tsx
213
+ <AccountDisplay tokenLogos={{ TOKEN: tokenLogoUrl }} />
214
+ ```
215
+
216
+ For a host-rendered asset row, this source also exports the SDK's existing logo
217
+ resolver from the package root:
218
+
219
+ ```tsx
220
+ const logo = useTokenLogo(asset.logoURI, asset.chainId, asset.address);
221
+ ```
222
+
223
+ Import `useTokenLogo` from `@spicenet-io/spiceflow-ui`. It returns the supplied logo
224
+ immediately, otherwise resolves the shared chain/address token list asynchronously.
225
+ Until a logo is available, it returns `undefined`; keep the balance and selection
226
+ usable and render the host's usual fallback. This source export requires an SDK
227
+ release before a consuming app can adopt it.
228
+
229
+ ### Account with Deposit and Withdraw
230
+
231
+ `SpiceAccount` renders `AccountDisplay` together with `SpiceDeposit` and
232
+ `SpiceWithdraw`, and owns their open state. Withdraw on an idle rollup balance opens
233
+ the modal with that balance selected. It takes every `AccountDisplay` prop except the
234
+ two click handlers; `depositProps` and `withdrawProps` pass through to the modals.
235
+ `styles` and `onDepositSuccess` are shared with the modals unless those props set
236
+ their own.
237
+
238
+ ```tsx
239
+ <SpiceAccount appName="MyApp" onDepositSuccess={refresh} />
240
+ ```
241
+
242
+ Use `AccountDisplay` directly to hide one of the buttons or to open your own flow
243
+ from them.
244
+
245
+ ### Withdraw from an account balance
246
+
247
+ `AccountDisplay.onWithdrawClick` receives the rollup receipt-token ID when a
248
+ user clicks Withdraw on an idle rollup balance. The main Withdraw button calls
249
+ it without an ID. Pass the ID to `SpiceWithdraw.initialSourceAssetId` to open
250
+ the existing modal with that asset selected; the user chooses the destination
251
+ network inside the modal. Existing callbacks that take no arguments continue
252
+ to work.
253
+
254
+ ```tsx
255
+ const [withdrawOpen, setWithdrawOpen] = useState(false);
256
+ const [withdrawAssetId, setWithdrawAssetId] = useState<string>();
257
+
258
+ <AccountDisplay
259
+ onWithdrawClick={(receiptTokenId) => {
260
+ setWithdrawAssetId(receiptTokenId);
261
+ setWithdrawOpen(true);
262
+ }}
263
+ />
264
+ <SpiceWithdraw
265
+ isOpen={withdrawOpen}
266
+ onClose={() => setWithdrawOpen(false)}
267
+ initialSourceAssetId={withdrawAssetId}
268
+ />
269
+ ```
270
+
271
+ `buildSpicenetBatch` defaults to the SDK's `buildSpicenetWithdrawalBatch`. An
272
+ integration that already passes a builder keeps it as an override, and its
273
+ callbacks are unchanged.
274
+ `initialSourceAssetId` selects a current balance by ID; it does not supply a
275
+ cached balance or change the receipt's supported withdrawal routes.
276
+
277
+ ### Funding sources
278
+
279
+ Supply, Pay and Lock list every balance that can fund the action: the embedded wallet
280
+ and rollup balances, and the connected external wallet, in either wallet mode. To keep a
281
+ mode to its own wallet, pass `includeExternalWalletAssets={false}` (Embedded mode) or
282
+ `includeCrossChainEmbeddedAssets={false}` (External mode). A user who holds the same
283
+ token in both wallets sees one row per wallet; a host that preselects a source should
284
+ match on `assetPositionId`, not on symbol or address alone.
285
+
286
+ ### Action Fee Readiness
287
+
288
+ - Routed Supply, Pay and Lock actions must surface fee estimation before enabling submission.
289
+ - Eligible direct external actions still require an accepted plan but charge no Spicenet fee. Network gas remains payable in the external wallet; native Max reserves gas.
290
+ - Deposit gas and rollup withdrawal semantics remain distinct from action intent fees. Preserve their existing quote/readiness requirements.
291
+ - Account wallet withdrawal is a fee-only Supply action. Do not bypass its fee/readiness gates based on the label "withdraw".
292
+ - Custom actions use the shared controller's `canExecute`; an available balance or old quote alone is insufficient.
293
+ - `onSubmit` on `SpiceSupply`, `SpiceLock`, `SpiceDeposit` and the shared controller fires once when the user submits and the SDK accepts it, before any wallet prompt. Use it for "transaction in progress" feedback instead of listening for clicks on SDK buttons.
294
+ - `max()` on the shared controller (`useSpiceSupply`, `useSpiceLock`) resolves the fee-aware Max for the selected source, or `null` when there is none or the action fixes its output. The host sets the result as the amount.
295
+
296
+ ### Fee funding for funded actions
297
+
298
+ Set `feeFunding: ["input", "proceeds", "balance"]` on `useSpiceSupply`,
299
+ `SpiceSupply`, `useSpiceAction`, `useSpiceLock` or `SpiceLock` to use the shared
300
+ hierarchy for wallet-funded actions on the destination chain. This applies to
301
+ arbitrary protocol calls: swaps, deposits, staking, lending and repayments.
302
+ Direct payment precedes conversion **within each tier**. Existing defaults remain
303
+ unchanged; `feeFunding: []` retains the existing selected-source path.
304
+
305
+ - `amountDirection: "input-inclusive"` offers the selected budget as input.
306
+ Fees reduce that input and the SDK requotes the conversion before building
307
+ protocol calls. The builder must honour the amount passed to it.
308
+ - `"input"` preserves the selected principal; `"output"` preserves the exact
309
+ payment or repayment. Neither offers required principal to the input tier.
310
+ - `actionProceeds: { token, resolve }` declares an amount remaining in the
311
+ executor **after all protocol calls**. Conversion output that is deposited,
312
+ staked, used for repayment or sent away is not available for fees. The SDK
313
+ resolves proceeds only if it reaches that tier and rechecks them before signing.
314
+ The object declaration alone does not opt a funded action in: it requires a
315
+ nonempty `feeFunding` order, preserving existing callers' selected-source planning.
316
+ - Balance fallback reserves the selected principal. Only the remaining amount
317
+ of that exact position can pay fees. `fees.sourceSpendCap` includes fee spending
318
+ from the same position, and `fees.fundingSource` reports the chosen source.
319
+
320
+ For an input-inclusive swap whose output stays in the executor,
321
+ `actionProceeds: "output"` enables the same hierarchy and declares the output as
322
+ available proceeds. If proceeds pay fees, `fees.destinationAmount` and
323
+ `quote.estimatedOutput` show the net minimum and expected output respectively.
324
+ Do not use this shortcut for calls that consume or send away the conversion output.
325
+
326
+ Local external-wallet funding still transfers the principal to the executor
327
+ first. Direct external execution keeps its native-gas path. External native Max
328
+ reserves transfer gas, and fixed-principal Max reserves execution fees.
329
+ Cross-chain and rollup **principal** routes retain their existing funding planner;
330
+ this extension does not let destination proceeds pay earlier source or bridge
331
+ costs, or add balance fallback to those routes. Custom fee orders on those routes fail
332
+ explicitly instead of silently charging a different tier. Rollup balances can still fund
333
+ fees for a local action through the existing fee-funding withdrawal leg. Standalone
334
+ `SpiceDeposit` and rollup `SpiceWithdraw` retain their distinct transfer semantics;
335
+ protocol deposits/withdrawals through the action controller use the contract above.
336
+
337
+ All paths retain fee readiness and accepted-plan validation. This capability
338
+ requires an SDK release and explicit integration opt-in; it does not upgrade
339
+ published packages or deployed apps.
340
+
341
+ ### Supply fee-estimate tolerance
342
+
343
+ In `4.11.0`, `SpiceFlowProvider` defaults `feeToleranceBps` to
344
+ `4000` (40%). Clients can override it, for example:
345
+
346
+ ```tsx
347
+ <SpiceFlowProvider {...config} feeToleranceBps={100}>
348
+ {children}
349
+ </SpiceFlowProvider>
350
+ ```
351
+
352
+ `100` is 1%; `0` disables the drift allowance. Existing conservative fixed-fee
353
+ retention still applies when estimates fall. Values must be integers from `0` to
354
+ `10000`. The allowance is relative to each accepted fee component: a fee of 100
355
+ allows a fresh estimate up to 140 at the default. A zero fee cannot become positive.
356
+
357
+ This setting covers fee convergence and pre-sign validation for user-transfer
358
+ Supply plans, including stock/controlled Supply and input-mode Lock consumers.
359
+ Within tolerance, the SDK keeps the quoted fee amounts and transaction calls;
360
+ it does not add a 40% fee buffer, increase the source spend cap, or relax swap
361
+ slippage/minimum outputs. Changing the setting invalidates prepared plans.
362
+ Backend acceptance and funding checks still apply. Exact-output Pay, fee-only
363
+ funding, deposits and backend-transfer convergence retain their separate rules.
364
+
365
+ The open Supply controller retains fee construction hints for at most 30 seconds
366
+ across amount edits in the same wallet, route and configuration scope. These hints
367
+ do not enable submission: the SDK rebuilds the current calls, then checks source
368
+ gas and destination fees concurrently. User-transfer source gas uses the same
369
+ configured fee tolerance; accepted amounts and source caps stay unchanged. A hint
370
+ that no longer fits falls back to full preparation. Closing the form clears hints.
371
+ Servers advertising fee validation price the already constructed destination fee
372
+ calls; older servers retain the estimate path. Cold preparation still sizes fees
373
+ from scratch. Input route quotes debounce for 100 ms; routed fee preparation adds
374
+ no second debounce. These optimizations do not establish a latency SLA.
375
+
376
+ Fee-inclusive, user-transfer Supply also prewarms when an eligible source is
377
+ selected with an empty/zero amount. It constructs a provisional quote for at most
378
+ one token, capped by the available balance, and retains only fee hints. The amount,
379
+ fee preview and executable plan remain empty. Typing can await in-flight prewarming
380
+ before validating the real amount; closing or changing wallet/configuration
381
+ cancels it. Failed provisional preparation leaves normal quoting available.
382
+ This does not apply to direct external actions, exact-output Pay, fee-only actions
383
+ or actions with explicit funding inputs/proceeds. No signature or submission occurs
384
+ during prewarming. The time available before typing determines how much work it hides.
385
+
386
+ ### Fee funding for fee-only actions
387
+
388
+ - A fee-only action (`feeOnlyAction`) runs on what the executing wallet already holds; the SDK funds only the Spicenet fees, in the chain's fee token (`destinationToken`).
389
+ - With no `selectedAsset`, the SDK picks the fee source and the user is never asked. The action's input (`actionInput`) comes first, then its proceeds (`actionProceeds`), so the fee stays inside the action the user submitted; then other balances: same-chain embedded wallet before rollup, and within each, balances already in the fee token before balances that swap into it. The first source that simulates and covers the fee wins and is reported as `fees.fundingSource`; a source whose swap has no route, or that cannot cover the fee within slippage, is skipped for the next.
390
+ - Declare `actionInput` for every token the action consumes and honour the amount passed to `buildActionCalls`: when fees come from an input, the action is built for the remainder. Declare `actionProceeds` for a token the action leaves in the wallet. Both are optional; with neither, only balances can pay. Omit `actionProceeds` when the output is delivered to another owner.
391
+ - `feeFunding` overrides the level order per transaction, for example `["proceeds", "input", "balance"]`; the order inside the balance level is fixed. An empty list leaves the choice to the host's `selectedAsset`.
392
+ - A `selectedAsset` on a fee-only action is an explicit host choice and funds the fee from that balance as before.
393
+ - Account wallet withdrawals use this hierarchy automatically and display the chosen fee asset without a selector. The exact withdrawal amount is reserved before ranking balances; only its remainder can pay fees. Custom `useSpiceSupply` actions that must preserve an exact principal can declare `feeFundingReserve: { asset, amount }` instead of offering that principal as `actionInput`.
394
+ - `feeOnlyAction` alone declares the action: `amountDirection` defaults to `"output"` and `paymentAmount` to `"0"`. Explicit values still win.
395
+ - `submit()` on the controller runs the executor that matches `amountDirection`. `submitSupply()` and `submitPay()` remain for existing callers.
396
+
397
+ ### Updating and releasing
398
+
399
+ Change the shared inventory/policy/controller owner and audit affected stock and custom
400
+ consumers. Use the central team's `workflow`, `ui-quality` and `shared/sdk.md` guidance;
401
+ keep skills in the skills repo rather than copying them here.
402
+
403
+ Read the central `shared/client-design-decisions.md` register before an upgrade. Map
404
+ applicable decision IDs to affected consumers and regression scenarios, and report each
405
+ result with exact candidate evidence. Preserve agreed behavior and ownership even when
406
+ types compile; a deliberate change needs an explicit product decision and migration plan.
407
+
408
+ Run focused regressions, `bun test`, `bun run typecheck` and `bun run build`, then validate
409
+ affected consumer builds and rendered/financial behavior on the exact candidate. Record
410
+ package identity, configuration, acceptance coverage and untested cases. Earlier candidate
411
+ results do not automatically apply to newer main or a new client.
412
+
413
+ If core/API changes are needed, resolve those dependencies before their UI/app consumers.
414
+ An inventory/controller-only change does not inherently require a core release. After
415
+ explicit release authorization, publish a prerelease with a non-`latest` tag, verify its
416
+ registry artifact, and pin/test that exact version in each adopting app. Stable promotion,
417
+ client deployment and docs targeting are separate release decisions. This refactor adds
418
+ no automatic npm publishing.
419
+
420
+ ### Building the Library
421
+
422
+ ```bash
423
+ bun run build
424
+ ```
425
+
426
+ ### Type Checking
427
+
428
+ ```bash
429
+ bun run typecheck
430
+ ```
431
+
432
+ CI runs this on every pull request, so a type error fails the build.
433
+
434
+ ### Formatting
435
+
436
+ ```bash
437
+ bun run format
438
+ ```
439
+
440
+ Prettier runs over staged files on commit via lint-staged. There is no ESLint
441
+ setup in this repository.
442
+
443
+ ## Component Playground
444
+
445
+ This repository includes a lightweight React playground app for viewing and testing all components without the complexity of Storybook.
446
+
447
+ ### Running the Playground
448
+
449
+ 1. Install dependencies (if not already done):
450
+
451
+ ```bash
452
+ bun install --frozen-lockfile
453
+ ```
454
+
455
+ 2. Navigate to the playground directory:
456
+
457
+ ```bash
458
+ cd playground
459
+ ```
460
+
461
+ 3. Install playground dependencies:
462
+
463
+ ```bash
464
+ bun install --frozen-lockfile
465
+ ```
466
+
467
+ 4. Start the development server:
468
+
469
+ ```bash
470
+ bun run dev
471
+ ```
472
+
473
+ The playground will open automatically at `http://localhost:3000`
474
+
475
+ ### Using the Playground
476
+
477
+ - **Left Sidebar**: Browse available components
478
+ - **Main Area**: View the selected component with different example variants
479
+ - **Example Tabs**: Switch between different states/examples for each component
480
+
481
+ ### Adding a New Component Example
482
+
483
+ To add a new example variant for a component:
484
+
485
+ 1. Open `playground/src/ComponentRegistry.tsx`
486
+ 2. Find the component's entry in the `examples` object
487
+ 3. Add a new entry to the array:
488
+ ```tsx
489
+ {
490
+ label: 'Your Example Name',
491
+ render: () => <YourComponent {...props} />,
492
+ }
493
+ ```
494
+
495
+ The playground will automatically pick up the new example and display it as a tab.
496
+
497
+ ## License
498
+
499
+ MIT
@@ -1,3 +1,3 @@
1
1
  "use client";
2
2
  (function(){if(typeof document==="undefined"||document.getElementById("spiceflow-styles"))return;var s=document.createElement("style");s.id="spiceflow-styles";s.textContent="@keyframes spiceflow-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}}.spiceflow-focus-ring:focus-visible,[data-spiceflow-focus]:focus-visible{border-radius:4px;outline:2px solid currentColor;outline-offset:2px}@media (forced-colors:active){.spiceflow-focus-ring:focus-visible,[data-spiceflow-focus]:focus-visible{outline:2px solid Highlight}}.ibm-plex-mono-thin{font-weight:100}.ibm-plex-mono-extralight,.ibm-plex-mono-thin{font-family:IBM Plex Mono,monospace!important;font-style:normal}.ibm-plex-mono-extralight{font-weight:200}.ibm-plex-mono-light{font-weight:300}.ibm-plex-mono-light,.ibm-plex-mono-regular{font-family:IBM Plex Mono,monospace!important;font-style:normal}.ibm-plex-mono-regular{font-weight:400}.ibm-plex-mono-medium{font-weight:500}.ibm-plex-mono-medium,.ibm-plex-mono-semibold{font-family:IBM Plex Mono,monospace!important;font-style:normal}.ibm-plex-mono-semibold{font-weight:600}.ibm-plex-mono-bold{font-family:IBM Plex Mono,monospace!important;font-style:normal;font-weight:700}#privy-modal-content button{border-radius:6px;font-family:IBM Plex Mono,monospace!important;font-size:small;letter-spacing:-.5px;text-transform:uppercase}#privy-modal-content input{background:#fff;border-radius:6px;padding-top:5px!important}#privy-dialog-title{display:none!important;font-size:18px;padding-bottom:10px;padding-top:10px}.AppLogoContainer-sc-a206bd44-0{display:none}#privy-modal-content{background:var(--Neutral-0,#fafafa);border:6px solid var(--Neutral-1,#e9e9e9);box-shadow:inset 0 0 0 1px rgba(0,0,0,.15),0 330px 92px transparent,0 211px 84px rgba(0,0,0,.01),0 119px 71px rgba(0,0,0,.05),0 53px 53px rgba(0,0,0,.09),0 13px 29px rgba(0,0,0,.1);height:auto!important;padding-bottom:10px}.Subtitle-sc-ddbf22b4-4{font-size:12px;margin-top:-14px;opacity:.5}.StyledLink-sc-1c6127e5-0{background:none!important}.StyledLink-sc-c8577138-0,.login-method-button{font-family:IBM Plex Mono,monospace!important}.StyledLink-sc-c8577138-0{font-style:uppercase}#protected-by-privy{color:#000!important}";document.head.appendChild(s)})();
3
- import{P as g}from"./privy-B7TjILWd.js";import"react/jsx-runtime";import"react";import"@spicenet-io/spiceflow-core";import"@tanstack/react-query";import"viem";import"@privy-io/react-auth";import"wagmi";import"viem/actions";export{g as PrivyLogin};
3
+ import{P as g}from"./privy-BHcRHRsA.js";import"react/jsx-runtime";import"react";import"@spicenet-io/spiceflow-core";import"@tanstack/react-query";import"viem";import"@privy-io/react-auth";import"wagmi";import"viem/actions";export{g as PrivyLogin};