kaleido-ui 0.1.95 → 0.1.97

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.
Files changed (5) hide show
  1. package/dist/web/index.cjs +47 -47
  2. package/dist/web/index.d.cts +6 -1
  3. package/dist/web/index.d.ts +6 -1
  4. package/dist/web/index.js +47 -47
  5. package/package.json +1 -1
package/dist/web/index.cjs CHANGED
@@ -1879,6 +1879,7 @@ function TransactionCard({
1879
1879
  status,
1880
1880
  displayAmount,
1881
1881
  unit = "sats",
1882
+ subAmount,
1882
1883
  timestamp,
1883
1884
  onClick,
1884
1885
  className
@@ -1954,7 +1955,8 @@ function TransactionCard({
1954
1955
  ]
1955
1956
  }
1956
1957
  ),
1957
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-tiny text-muted-foreground font-medium tracking-wide uppercase mt-0.5", children: unit })
1958
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-tiny text-muted-foreground font-medium tracking-wide uppercase mt-0.5", children: unit }),
1959
+ subAmount && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-tiny text-muted-foreground/70 font-medium tracking-wide tabular-nums mt-0.5", children: subAmount })
1958
1960
  ] })
1959
1961
  ]
1960
1962
  }
@@ -4555,6 +4557,7 @@ function ActivityList({
4555
4557
  status: item.status,
4556
4558
  displayAmount: item.displayAmount,
4557
4559
  unit: item.unit,
4560
+ subAmount: item.subAmount,
4558
4561
  timestamp: item.timestamp,
4559
4562
  onClick: () => onExpandedChange?.(isExpanded ? null : item.id)
4560
4563
  }
@@ -6482,52 +6485,49 @@ var MobileHeroAnimation = ({
6482
6485
  /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "opacity", values: "0.4;0;0.4", dur: "2.5s", repeatCount: "indefinite" })
6483
6486
  ] }) }),
6484
6487
  /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("circle", { cx: C, cy: C, r: 80, fill: "none", stroke: "rgba(255,255,255,0.1)", strokeWidth: "1", strokeDasharray: "4 4" }),
6485
- /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("g", { children: [
6486
- anim && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
6487
- "animateTransform",
6488
- {
6489
- attributeName: "transform",
6490
- type: "rotate",
6491
- from: `0 ${C} ${C}`,
6492
- to: `360 ${C} ${C}`,
6493
- dur: "20s",
6494
- repeatCount: "indefinite"
6495
- }
6496
- ),
6497
- PROTOCOLS.map((protocol, i) => {
6498
- const angle = i / N * 2 * Math.PI;
6499
- const dx = Math.cos(angle);
6500
- const dy = Math.sin(angle);
6501
- const x1 = C + dx * 28;
6502
- const y1 = C + dy * 28;
6503
- const x2 = C + dx * (ORBIT_R - BADGE_HALF);
6504
- const y2 = C + dy * (ORBIT_R - BADGE_HALF);
6505
- const color = PROTOCOL_COLORS[protocol.network] ?? "#ffffff";
6506
- const dur = `${2 + i * 0.3}s`;
6507
- return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("g", { children: [
6508
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
6509
- "line",
6510
- {
6511
- x1,
6512
- y1,
6513
- x2,
6514
- y2,
6515
- stroke: color,
6516
- strokeWidth: "0.8",
6517
- strokeDasharray: "2 4",
6518
- opacity: "0.25",
6519
- children: anim && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "stroke-dashoffset", from: "0", to: "-12", dur: `${1.5 + i * 0.2}s`, repeatCount: "indefinite" })
6520
- }
6521
- ),
6522
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("circle", { r: "2", fill: color, opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(import_jsx_runtime73.Fragment, { children: [
6523
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "cx", values: `${x1};${x2}`, dur, repeatCount: "indefinite" }),
6524
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "cy", values: `${y1};${y2}`, dur, repeatCount: "indefinite" }),
6525
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "opacity", values: "0;0.85;0", dur, repeatCount: "indefinite" }),
6526
- /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "r", values: "1.5;2.5;1.5", dur, repeatCount: "indefinite" })
6527
- ] }) })
6528
- ] }, `line-${i}`);
6529
- })
6530
- ] }),
6488
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
6489
+ "g",
6490
+ {
6491
+ style: {
6492
+ animation: anim ? "mha-orbit-spin 20s linear infinite" : void 0,
6493
+ transformOrigin: "50% 50%",
6494
+ transformBox: "view-box"
6495
+ },
6496
+ children: PROTOCOLS.map((protocol, i) => {
6497
+ const angle = i / N * 2 * Math.PI;
6498
+ const dx = Math.cos(angle);
6499
+ const dy = Math.sin(angle);
6500
+ const x1 = C + dx * 28;
6501
+ const y1 = C + dy * 28;
6502
+ const x2 = C + dx * (ORBIT_R - BADGE_HALF);
6503
+ const y2 = C + dy * (ORBIT_R - BADGE_HALF);
6504
+ const color = PROTOCOL_COLORS[protocol.network] ?? "#ffffff";
6505
+ const dur = `${2 + i * 0.3}s`;
6506
+ return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("g", { children: [
6507
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
6508
+ "line",
6509
+ {
6510
+ x1,
6511
+ y1,
6512
+ x2,
6513
+ y2,
6514
+ stroke: color,
6515
+ strokeWidth: "0.8",
6516
+ strokeDasharray: "2 4",
6517
+ opacity: "0.25",
6518
+ children: anim && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "stroke-dashoffset", from: "0", to: "-12", dur: `${1.5 + i * 0.2}s`, repeatCount: "indefinite" })
6519
+ }
6520
+ ),
6521
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("circle", { r: "2", fill: color, opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(import_jsx_runtime73.Fragment, { children: [
6522
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "cx", values: `${x1};${x2}`, dur, repeatCount: "indefinite" }),
6523
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "cy", values: `${y1};${y2}`, dur, repeatCount: "indefinite" }),
6524
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "opacity", values: "0;0.85;0", dur, repeatCount: "indefinite" }),
6525
+ /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "r", values: "1.5;2.5;1.5", dur, repeatCount: "indefinite" })
6526
+ ] }) })
6527
+ ] }, `line-${i}`);
6528
+ })
6529
+ }
6530
+ ),
6531
6531
  /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("circle", { cx: C, cy: C, r: "42", fill: "url(#mh-center-glow)", children: anim && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "r", values: "38;46;38", dur: "4s", repeatCount: "indefinite" }) }),
6532
6532
  /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("circle", { cx: C, cy: C, r: "29", fill: "none", stroke: "url(#mh-bp)", strokeWidth: "1", opacity: "0", children: anim && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(import_jsx_runtime73.Fragment, { children: [
6533
6533
  /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("animate", { attributeName: "r", values: "27;38", dur: "3s", repeatCount: "indefinite" }),
package/dist/web/index.d.cts CHANGED
@@ -266,12 +266,15 @@ interface TransactionCardProps {
266
266
  displayAmount: string;
267
267
  /** Unit label (e.g. "sats", "BTC") */
268
268
  unit?: string;
269
+ /** Secondary amount under the unit — e.g. the sats leg an asset transfer
270
+ * rode on ("588 sats" for an RGB-LN payment or an Arkade asset VTXO). */
271
+ subAmount?: string;
269
272
  /** Unix timestamp in seconds */
270
273
  timestamp: number;
271
274
  onClick?: () => void;
272
275
  className?: string;
273
276
  }
274
- declare function TransactionCard({ direction, status, displayAmount, unit, timestamp, onClick, className, }: TransactionCardProps): react_jsx_runtime.JSX.Element;
277
+ declare function TransactionCard({ direction, status, displayAmount, unit, subAmount, timestamp, onClick, className, }: TransactionCardProps): react_jsx_runtime.JSX.Element;
275
278
 
276
279
  declare const APP_ICON_NAMES: {
277
280
  readonly activity: "history";
@@ -802,6 +805,8 @@ interface ActivityListItem<TData = unknown> {
802
805
  status: StatusType;
803
806
  displayAmount: string;
804
807
  unit?: string;
808
+ /** Secondary amount under the unit (e.g. the sats leg of an asset transfer). */
809
+ subAmount?: string;
805
810
  timestamp: number;
806
811
  network?: NetworkType;
807
812
  label?: string;
package/dist/web/index.d.ts CHANGED
@@ -266,12 +266,15 @@ interface TransactionCardProps {
266
266
  displayAmount: string;
267
267
  /** Unit label (e.g. "sats", "BTC") */
268
268
  unit?: string;
269
+ /** Secondary amount under the unit — e.g. the sats leg an asset transfer
270
+ * rode on ("588 sats" for an RGB-LN payment or an Arkade asset VTXO). */
271
+ subAmount?: string;
269
272
  /** Unix timestamp in seconds */
270
273
  timestamp: number;
271
274
  onClick?: () => void;
272
275
  className?: string;
273
276
  }
274
- declare function TransactionCard({ direction, status, displayAmount, unit, timestamp, onClick, className, }: TransactionCardProps): react_jsx_runtime.JSX.Element;
277
+ declare function TransactionCard({ direction, status, displayAmount, unit, subAmount, timestamp, onClick, className, }: TransactionCardProps): react_jsx_runtime.JSX.Element;
275
278
 
276
279
  declare const APP_ICON_NAMES: {
277
280
  readonly activity: "history";
@@ -802,6 +805,8 @@ interface ActivityListItem<TData = unknown> {
802
805
  status: StatusType;
803
806
  displayAmount: string;
804
807
  unit?: string;
808
+ /** Secondary amount under the unit (e.g. the sats leg of an asset transfer). */
809
+ subAmount?: string;
805
810
  timestamp: number;
806
811
  network?: NetworkType;
807
812
  label?: string;
package/dist/web/index.js CHANGED
@@ -1691,6 +1691,7 @@ function TransactionCard({
1691
1691
  status,
1692
1692
  displayAmount,
1693
1693
  unit = "sats",
1694
+ subAmount,
1694
1695
  timestamp,
1695
1696
  onClick,
1696
1697
  className
@@ -1766,7 +1767,8 @@ function TransactionCard({
1766
1767
  ]
1767
1768
  }
1768
1769
  ),
1769
- /* @__PURE__ */ jsx21("p", { className: "text-tiny text-muted-foreground font-medium tracking-wide uppercase mt-0.5", children: unit })
1770
+ /* @__PURE__ */ jsx21("p", { className: "text-tiny text-muted-foreground font-medium tracking-wide uppercase mt-0.5", children: unit }),
1771
+ subAmount && /* @__PURE__ */ jsx21("p", { className: "text-tiny text-muted-foreground/70 font-medium tracking-wide tabular-nums mt-0.5", children: subAmount })
1770
1772
  ] })
1771
1773
  ]
1772
1774
  }
@@ -4373,6 +4375,7 @@ function ActivityList({
4373
4375
  status: item.status,
4374
4376
  displayAmount: item.displayAmount,
4375
4377
  unit: item.unit,
4378
+ subAmount: item.subAmount,
4376
4379
  timestamp: item.timestamp,
4377
4380
  onClick: () => onExpandedChange?.(isExpanded ? null : item.id)
4378
4381
  }
@@ -6300,52 +6303,49 @@ var MobileHeroAnimation = ({
6300
6303
  /* @__PURE__ */ jsx73("animate", { attributeName: "opacity", values: "0.4;0;0.4", dur: "2.5s", repeatCount: "indefinite" })
6301
6304
  ] }) }),
6302
6305
  /* @__PURE__ */ jsx73("circle", { cx: C, cy: C, r: 80, fill: "none", stroke: "rgba(255,255,255,0.1)", strokeWidth: "1", strokeDasharray: "4 4" }),
6303
- /* @__PURE__ */ jsxs59("g", { children: [
6304
- anim && /* @__PURE__ */ jsx73(
6305
- "animateTransform",
6306
- {
6307
- attributeName: "transform",
6308
- type: "rotate",
6309
- from: `0 ${C} ${C}`,
6310
- to: `360 ${C} ${C}`,
6311
- dur: "20s",
6312
- repeatCount: "indefinite"
6313
- }
6314
- ),
6315
- PROTOCOLS.map((protocol, i) => {
6316
- const angle = i / N * 2 * Math.PI;
6317
- const dx = Math.cos(angle);
6318
- const dy = Math.sin(angle);
6319
- const x1 = C + dx * 28;
6320
- const y1 = C + dy * 28;
6321
- const x2 = C + dx * (ORBIT_R - BADGE_HALF);
6322
- const y2 = C + dy * (ORBIT_R - BADGE_HALF);
6323
- const color = PROTOCOL_COLORS[protocol.network] ?? "#ffffff";
6324
- const dur = `${2 + i * 0.3}s`;
6325
- return /* @__PURE__ */ jsxs59("g", { children: [
6326
- /* @__PURE__ */ jsx73(
6327
- "line",
6328
- {
6329
- x1,
6330
- y1,
6331
- x2,
6332
- y2,
6333
- stroke: color,
6334
- strokeWidth: "0.8",
6335
- strokeDasharray: "2 4",
6336
- opacity: "0.25",
6337
- children: anim && /* @__PURE__ */ jsx73("animate", { attributeName: "stroke-dashoffset", from: "0", to: "-12", dur: `${1.5 + i * 0.2}s`, repeatCount: "indefinite" })
6338
- }
6339
- ),
6340
- /* @__PURE__ */ jsx73("circle", { r: "2", fill: color, opacity: "0", children: anim && /* @__PURE__ */ jsxs59(Fragment13, { children: [
6341
- /* @__PURE__ */ jsx73("animate", { attributeName: "cx", values: `${x1};${x2}`, dur, repeatCount: "indefinite" }),
6342
- /* @__PURE__ */ jsx73("animate", { attributeName: "cy", values: `${y1};${y2}`, dur, repeatCount: "indefinite" }),
6343
- /* @__PURE__ */ jsx73("animate", { attributeName: "opacity", values: "0;0.85;0", dur, repeatCount: "indefinite" }),
6344
- /* @__PURE__ */ jsx73("animate", { attributeName: "r", values: "1.5;2.5;1.5", dur, repeatCount: "indefinite" })
6345
- ] }) })
6346
- ] }, `line-${i}`);
6347
- })
6348
- ] }),
6306
+ /* @__PURE__ */ jsx73(
6307
+ "g",
6308
+ {
6309
+ style: {
6310
+ animation: anim ? "mha-orbit-spin 20s linear infinite" : void 0,
6311
+ transformOrigin: "50% 50%",
6312
+ transformBox: "view-box"
6313
+ },
6314
+ children: PROTOCOLS.map((protocol, i) => {
6315
+ const angle = i / N * 2 * Math.PI;
6316
+ const dx = Math.cos(angle);
6317
+ const dy = Math.sin(angle);
6318
+ const x1 = C + dx * 28;
6319
+ const y1 = C + dy * 28;
6320
+ const x2 = C + dx * (ORBIT_R - BADGE_HALF);
6321
+ const y2 = C + dy * (ORBIT_R - BADGE_HALF);
6322
+ const color = PROTOCOL_COLORS[protocol.network] ?? "#ffffff";
6323
+ const dur = `${2 + i * 0.3}s`;
6324
+ return /* @__PURE__ */ jsxs59("g", { children: [
6325
+ /* @__PURE__ */ jsx73(
6326
+ "line",
6327
+ {
6328
+ x1,
6329
+ y1,
6330
+ x2,
6331
+ y2,
6332
+ stroke: color,
6333
+ strokeWidth: "0.8",
6334
+ strokeDasharray: "2 4",
6335
+ opacity: "0.25",
6336
+ children: anim && /* @__PURE__ */ jsx73("animate", { attributeName: "stroke-dashoffset", from: "0", to: "-12", dur: `${1.5 + i * 0.2}s`, repeatCount: "indefinite" })
6337
+ }
6338
+ ),
6339
+ /* @__PURE__ */ jsx73("circle", { r: "2", fill: color, opacity: "0", children: anim && /* @__PURE__ */ jsxs59(Fragment13, { children: [
6340
+ /* @__PURE__ */ jsx73("animate", { attributeName: "cx", values: `${x1};${x2}`, dur, repeatCount: "indefinite" }),
6341
+ /* @__PURE__ */ jsx73("animate", { attributeName: "cy", values: `${y1};${y2}`, dur, repeatCount: "indefinite" }),
6342
+ /* @__PURE__ */ jsx73("animate", { attributeName: "opacity", values: "0;0.85;0", dur, repeatCount: "indefinite" }),
6343
+ /* @__PURE__ */ jsx73("animate", { attributeName: "r", values: "1.5;2.5;1.5", dur, repeatCount: "indefinite" })
6344
+ ] }) })
6345
+ ] }, `line-${i}`);
6346
+ })
6347
+ }
6348
+ ),
6349
6349
  /* @__PURE__ */ jsx73("circle", { cx: C, cy: C, r: "42", fill: "url(#mh-center-glow)", children: anim && /* @__PURE__ */ jsx73("animate", { attributeName: "r", values: "38;46;38", dur: "4s", repeatCount: "indefinite" }) }),
6350
6350
  /* @__PURE__ */ jsx73("circle", { cx: C, cy: C, r: "29", fill: "none", stroke: "url(#mh-bp)", strokeWidth: "1", opacity: "0", children: anim && /* @__PURE__ */ jsxs59(Fragment13, { children: [
6351
6351
  /* @__PURE__ */ jsx73("animate", { attributeName: "r", values: "27;38", dur: "3s", repeatCount: "indefinite" }),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "kaleido-ui",
3
- "version": "0.1.95",
3
+ "version": "0.1.97",
4
4
  "description": "KaleidoSwap shared UI library — design tokens, web components (Tailwind + Radix), and React Native components extending WDK UI Kit",
5
5
  "license": "MIT",
6
6
  "type": "module",