@tesouro/embedded-components-react 0.3.6 → 0.3.9

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 (6) hide show
  1. package/dist/index.css +3 -0
  2. package/dist/libs/tesouro-embedded-components-react/card-details-widget/ui/dist/lib/CardDetailsPanel/CardDetailsPanel.js +22 -20
  3. package/dist/libs/tesouro-embedded-components-react/card-details-widget/ui/dist/lib/CardDetailsPanel/CardFace.js +27 -20
  4. package/dist/libs/tesouro-embedded-components-react/card-details-widget/ui/dist/lib/CardDetailsPanel/cardFaceSurface.js +2 -2
  5. package/dist/libs/tesouro-embedded-components-react/shared/feature/dist/lib/analytics/build-info.js +1 -1
  6. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -3342,6 +3342,9 @@
3342
3342
  .ttw\:text-\[\#175CD3\] {
3343
3343
  color: #175CD3;
3344
3344
  }
3345
+ .ttw\:text-\[\#101317\] {
3346
+ color: #101317;
3347
+ }
3345
3348
  .ttw\:text-\[\#344054\] {
3346
3349
  color: #344054;
3347
3350
  }
package/dist/libs/tesouro-embedded-components-react/card-details-widget/ui/dist/lib/CardDetailsPanel/CardDetailsPanel.js CHANGED
@@ -19,13 +19,14 @@ import { useMemo as h } from "react";
19
19
  import { jsx as g, jsxs as _ } from "react/jsx-runtime";
20
20
  import { CreditCardIcon as v, EyeIcon as y, EyeOffIcon as b, PowerIcon as x } from "lucide-react";
21
21
  //#region ../../libs/tesouro-embedded-components-react/card-details-widget/ui/dist/lib/CardDetailsPanel/CardDetailsPanel.js
22
- function S({ labels: S, state: C, nickname: w, statusLabel: T, statusTone: E, formFactorLabel: D, cardMenu: O, onClose: k, bankLogoSrc: A, bankLogoAlt: j, cardholderName: M, maskedCardNumber: N, programLabel: P, billingAddress: F, allowedCategories: I, onCopy: L, onActivate: R, onViewCard: z, onHideCard: B, isViewCardDisabled: V, revealState: H = "hidden", revealedCardNumber: U, revealedExpirationDate: W, revealedSecurityCode: G, onRetry: K, className: q }) {
23
- let J = h(() => f(S), [S]), Y = !!I?.length, X = H === "revealed", Z = X ? B : z, Q = /* @__PURE__ */ g(u, {
22
+ function S({ labels: S, state: C, nickname: w, statusLabel: T, statusTone: E, formFactorLabel: D, cardMenu: O, onClose: k, bankLogoSrc: A, bankLogoAlt: j, cardholderName: M, maskedCardNumber: N, programLabel: P, cardFaceStatusLabel: F, billingAddress: I, allowedCategories: L, onCopy: R, onActivate: z, onViewCard: B, onHideCard: V, revealState: H = "hidden", revealedCardNumber: U, revealedExpirationDate: W, revealedSecurityCode: G, onRetry: K, className: q }) {
23
+ let J = h(() => f(S), [S]), Y = !!L?.length, X = H === "revealed", Z = X ? V : B, Q = /* @__PURE__ */ g(u, {
24
24
  bankLogoSrc: A,
25
25
  bankLogoAlt: j ?? J.cardFace.bankLogoAlt,
26
26
  cardholderName: M ?? "",
27
27
  maskedCardNumber: N ?? "",
28
- programLabel: P ?? ""
28
+ programLabel: P ?? "",
29
+ statusLabel: F
29
30
  });
30
31
  return /* @__PURE__ */ _("div", {
31
32
  "data-testid": s.panel,
@@ -62,7 +63,7 @@ function S({ labels: S, state: C, nickname: w, statusLabel: T, statusTone: E, fo
62
63
  className: "ttw:flex ttw:items-center ttw:justify-center ttw:bg-muted ttw:px-4 ttw:py-5",
63
64
  children: /* @__PURE__ */ _("div", {
64
65
  className: r("ttw:flex ttw:flex-col ttw:gap-4", l),
65
- children: [z ? /* @__PURE__ */ g(m, {
66
+ children: [B ? /* @__PURE__ */ g(m, {
66
67
  isFlipped: X,
67
68
  front: Q,
68
69
  back: /* @__PURE__ */ g(p, {
@@ -70,26 +71,27 @@ function S({ labels: S, state: C, nickname: w, statusLabel: T, statusTone: E, fo
70
71
  cardNumber: U,
71
72
  expirationDate: W,
72
73
  securityCode: G,
73
- onCopy: L
74
+ onCopy: R
74
75
  })
75
- }) : Q, R || z ? /* @__PURE__ */ _("div", {
76
+ }) : Q, z || B ? /* @__PURE__ */ _("div", {
76
77
  className: "ttw:flex ttw:flex-col ttw:gap-2",
77
78
  children: [
78
- R ? /* @__PURE__ */ _(t, {
79
+ z ? /* @__PURE__ */ _(t, {
79
80
  type: "button",
80
- onClick: R,
81
+ className: "ttw:self-center",
82
+ onClick: z,
81
83
  children: [/* @__PURE__ */ g(x, {
82
84
  className: "ttw:size-4",
83
85
  "aria-hidden": "true"
84
86
  }), J.actions.activateCard]
85
87
  }) : null,
86
- z ? /* @__PURE__ */ g("div", {
88
+ B ? /* @__PURE__ */ g("div", {
87
89
  className: "ttw:flex ttw:gap-2",
88
90
  children: /* @__PURE__ */ _(t, {
89
91
  type: "button",
90
92
  variant: "outline",
91
93
  className: "ttw:flex-1",
92
- disabled: V || !Z,
94
+ disabled: !Z,
93
95
  loading: H === "revealing",
94
96
  onClick: Z,
95
97
  children: [g(X ? b : y, {
@@ -107,30 +109,30 @@ function S({ labels: S, state: C, nickname: w, statusLabel: T, statusTone: E, fo
107
109
  children: [
108
110
  /* @__PURE__ */ g(d, {
109
111
  label: J.fields.cardholder,
110
- copyAriaLabel: M && L ? J.fields.copyCardholderAriaLabel : void 0,
111
- onCopy: M && L ? () => L(M) : void 0,
112
+ copyAriaLabel: M && R ? J.fields.copyCardholderAriaLabel : void 0,
113
+ onCopy: M && R ? () => R(M) : void 0,
112
114
  children: M ?? J.fields.emptyValue
113
115
  }),
114
116
  /* @__PURE__ */ g(d, {
115
117
  label: J.fields.nickname,
116
- copyAriaLabel: w && L ? J.fields.copyNicknameAriaLabel : void 0,
117
- onCopy: w && L ? () => L(w) : void 0,
118
- isLast: !F && !Y,
118
+ copyAriaLabel: w && R ? J.fields.copyNicknameAriaLabel : void 0,
119
+ onCopy: w && R ? () => R(w) : void 0,
120
+ isLast: !I && !Y,
119
121
  children: w ?? J.fields.emptyValue
120
122
  }),
121
- F ? /* @__PURE__ */ g(d, {
123
+ I ? /* @__PURE__ */ g(d, {
122
124
  label: J.fields.billingAddress,
123
- copyAriaLabel: L ? J.fields.copyBillingAddressAriaLabel : void 0,
124
- onCopy: L ? () => L(F) : void 0,
125
+ copyAriaLabel: R ? J.fields.copyBillingAddressAriaLabel : void 0,
126
+ onCopy: R ? () => R(I) : void 0,
125
127
  isLast: !Y,
126
- children: F
128
+ children: I
127
129
  }) : null,
128
130
  Y ? /* @__PURE__ */ g(d, {
129
131
  label: J.fields.allowedCategories,
130
132
  isLast: !0,
131
133
  children: /* @__PURE__ */ g("div", {
132
134
  className: "ttw:flex ttw:flex-wrap ttw:gap-2",
133
- children: I?.map((t) => /* @__PURE__ */ g(e, {
135
+ children: L?.map((t) => /* @__PURE__ */ g(e, {
134
136
  variant: "secondary",
135
137
  children: t
136
138
  }, t))
package/dist/libs/tesouro-embedded-components-react/card-details-widget/ui/dist/lib/CardDetailsPanel/CardFace.js CHANGED
@@ -1,38 +1,45 @@
1
1
  import { cn as e } from "../../../../../../../packages/shared-ui-shadcn/dist/index.js";
2
2
  import { cardDetailsWidgetUiTestIds as t } from "./testIds.js";
3
- import { CARD_FACE_SURFACE_CLASS_NAME as n } from "./cardFaceSurface.js";
4
- import { CardFaceGlow as r } from "./CardFaceGlow.js";
5
- import { jsx as i, jsxs as a } from "react/jsx-runtime";
3
+ import { CARD_FACE_STATUS_PILL_CLASS_NAME as n, CARD_FACE_SURFACE_CLASS_NAME as r } from "./cardFaceSurface.js";
4
+ import { CardFaceGlow as i } from "./CardFaceGlow.js";
5
+ import { jsx as a, jsxs as o } from "react/jsx-runtime";
6
6
  //#region ../../libs/tesouro-embedded-components-react/card-details-widget/ui/dist/lib/CardDetailsPanel/CardFace.js
7
- function o({ bankLogoSrc: o, bankLogoAlt: s, cardholderName: c, maskedCardNumber: l, programLabel: u, className: d }) {
8
- return /* @__PURE__ */ a("div", {
7
+ function s({ bankLogoSrc: s, bankLogoAlt: c, cardholderName: l, maskedCardNumber: u, programLabel: d, statusLabel: f, className: p }) {
8
+ return /* @__PURE__ */ o("div", {
9
9
  "data-testid": t.cardFace,
10
- className: e(n, "ttw:justify-between", d),
10
+ className: e(r, "ttw:justify-between", p),
11
11
  children: [
12
- /* @__PURE__ */ i(r, {}),
13
- o ? /* @__PURE__ */ i("img", {
14
- src: o,
15
- alt: s,
12
+ /* @__PURE__ */ a(i, {}),
13
+ s ? /* @__PURE__ */ a("img", {
14
+ src: s,
15
+ alt: c,
16
16
  className: "ttw:relative ttw:h-8 ttw:w-auto ttw:max-w-[60%] ttw:object-contain ttw:object-left"
17
- }) : /* @__PURE__ */ i("span", { className: "ttw:relative ttw:h-8" }),
18
- /* @__PURE__ */ a("div", {
17
+ }) : /* @__PURE__ */ a("span", { className: "ttw:relative ttw:h-8" }),
18
+ f ? /* @__PURE__ */ a("div", {
19
+ className: "ttw:pointer-events-none ttw:absolute ttw:inset-0 ttw:flex ttw:items-center ttw:justify-center",
20
+ children: /* @__PURE__ */ a("span", {
21
+ className: n,
22
+ children: f
23
+ })
24
+ }) : null,
25
+ /* @__PURE__ */ o("div", {
19
26
  className: "ttw:relative ttw:flex ttw:items-end ttw:justify-between ttw:gap-3",
20
- children: [/* @__PURE__ */ a("div", {
27
+ children: [/* @__PURE__ */ o("div", {
21
28
  className: "ttw:min-w-0",
22
- children: [/* @__PURE__ */ i("p", {
29
+ children: [/* @__PURE__ */ a("p", {
23
30
  className: "ttw:truncate ttw:text-base ttw:font-medium ttw:text-white",
24
- children: c
25
- }), /* @__PURE__ */ i("p", {
26
- className: "ttw:mt-1 ttw:truncate ttw:text-lg ttw:tracking-wide ttw:text-white/90",
27
31
  children: l
32
+ }), /* @__PURE__ */ a("p", {
33
+ className: "ttw:mt-1 ttw:truncate ttw:text-lg ttw:tracking-wide ttw:text-white/90",
34
+ children: u
28
35
  })]
29
- }), /* @__PURE__ */ i("p", {
36
+ }), /* @__PURE__ */ a("p", {
30
37
  className: "ttw:shrink-0 ttw:text-[10px] ttw:font-medium ttw:text-white/90",
31
- children: u
38
+ children: d
32
39
  })]
33
40
  })
34
41
  ]
35
42
  });
36
43
  }
37
44
  //#endregion
38
- export { o as CardFace };
45
+ export { s as CardFace };
package/dist/libs/tesouro-embedded-components-react/card-details-widget/ui/dist/lib/CardDetailsPanel/cardFaceSurface.js CHANGED
@@ -1,4 +1,4 @@
1
1
  //#region ../../libs/tesouro-embedded-components-react/card-details-widget/ui/dist/lib/CardDetailsPanel/cardFaceSurface.js
2
- var e = "ttw:w-[300px]", t = "ttw:h-[190px]", n = `ttw:relative ttw:flex ${t} ${e} ttw:flex-col ttw:overflow-hidden ttw:rounded-xl ttw:bg-[#101317] ttw:p-4`;
2
+ var e = "ttw:w-[300px]", t = "ttw:h-[190px]", n = `ttw:relative ttw:flex ${t} ${e} ttw:flex-col ttw:overflow-hidden ttw:rounded-xl ttw:bg-[#101317] ttw:p-4`, r = "ttw:rounded-full ttw:bg-white/90 ttw:px-4 ttw:py-2 ttw:text-sm ttw:font-medium ttw:text-[#101317]";
3
3
  //#endregion
4
- export { t as CARD_FACE_HEIGHT_CLASS_NAME, n as CARD_FACE_SURFACE_CLASS_NAME, e as CARD_FACE_WIDTH_CLASS_NAME };
4
+ export { t as CARD_FACE_HEIGHT_CLASS_NAME, r as CARD_FACE_STATUS_PILL_CLASS_NAME, n as CARD_FACE_SURFACE_CLASS_NAME, e as CARD_FACE_WIDTH_CLASS_NAME };
package/dist/libs/tesouro-embedded-components-react/shared/feature/dist/lib/analytics/build-info.js CHANGED
@@ -1,5 +1,5 @@
1
1
  //#region ../../libs/tesouro-embedded-components-react/shared/feature/dist/lib/analytics/build-info.js
2
- var e = "@tesouro/embedded-components-react", t = "0.3.6", n = "3fb070c74a338797a64e30ebef107b8f10d0d49b", r = Object.freeze({
2
+ var e = "@tesouro/embedded-components-react", t = "0.3.9", n = "ac355552a0e1fc75bf6f82e8ba0067fbbf500666", r = Object.freeze({
3
3
  library_name: e,
4
4
  library_version: t,
5
5
  library_sha: n
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tesouro/embedded-components-react",
3
- "version": "0.3.6",
3
+ "version": "0.3.9",
4
4
  "license": "Apache-2.0",
5
5
  "type": "module",
6
6
  "packageDepSync": {