@opexa/portal-components 0.0.744 → 0.0.745
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/dist/components/Jackpots/JackpotsCarouselNext/JackpotsCarouselStageItem.js +7 -5
- package/dist/components/Jackpots/JackpotsListNext/JackpotMultiStageDesktop.js +5 -3
- package/dist/components/Jackpots/JackpotsListNext/JackpotMultiStageMobile.js +4 -3
- package/dist/utils/mask.d.ts +1 -0
- package/dist/utils/mask.js +1 -1
- package/package.json +1 -1
|
@@ -22,7 +22,7 @@ import { User01Icon } from '../../../icons/User01Icon.js';
|
|
|
22
22
|
import firstPlace from '../../../images/first-place.png';
|
|
23
23
|
import leaderboard from '../../../images/leaderboard.png';
|
|
24
24
|
import { formatNumber } from '../../../utils/formatNumber.js';
|
|
25
|
-
import {
|
|
25
|
+
import { maskFirstLast } from '../../../utils/mask.js';
|
|
26
26
|
import { parseDecimal } from '../../../utils/parseDecimal.js';
|
|
27
27
|
import styles from '../Jackpots.module.css';
|
|
28
28
|
import { useJackpotsCarouselItemContext } from './JackpotsCarouselContext.js';
|
|
@@ -123,8 +123,9 @@ export function JackpotsCarouselStageItem({ style, className, viewAllUrl, animat
|
|
|
123
123
|
currency: localeInfo.currency.code,
|
|
124
124
|
minDecimalPlaces: 2,
|
|
125
125
|
maxDecimalPlaces: 2,
|
|
126
|
-
})] })] })] }), _jsx("div", { className: "hidden min-w-25 lg:block" }), chestImages.image && (_jsx("div", { className: twMerge('right-0 bottom-[-60] z-1 min-w-30 lg:absolute', chestImages?.style?.wrapper), children: _jsx(Image, { width: 150, height: 150, src: chestImages.image, alt: "chest", className: twMerge('size-full h-25 w-25 p-2 lg:h-37.5 lg:w-37.5', chestImages?.style?.image) }) }))] }), _jsx("div", { className: twMerge('relative mt-4 hidden w-full gap-4 rounded-lg bg-bg-primary p-4 lg:flex', className?.latestPayoutRoot), children: latestJackpotPayout?.amount ? (_jsxs(_Fragment, { children: [_jsx(ProfileIcon, {}), _jsxs("div", { className: "flex flex-col gap-1 text-left", children: [_jsx(PayoutBadge, {}), _jsx("div", { className: "font-semibold", children:
|
|
127
|
-
|
|
126
|
+
})] })] })] }), _jsx("div", { className: "hidden min-w-25 lg:block" }), chestImages.image && (_jsx("div", { className: twMerge('right-0 bottom-[-60] z-1 min-w-30 lg:absolute', chestImages?.style?.wrapper), children: _jsx(Image, { width: 150, height: 150, src: chestImages.image, alt: "chest", className: twMerge('size-full h-25 w-25 p-2 lg:h-37.5 lg:w-37.5', chestImages?.style?.image) }) }))] }), _jsx("div", { className: twMerge('relative mt-4 hidden w-full gap-4 rounded-lg bg-bg-primary p-4 lg:flex', className?.latestPayoutRoot), children: latestJackpotPayout?.amount ? (_jsxs(_Fragment, { children: [_jsx(ProfileIcon, {}), _jsxs("div", { className: "flex flex-col gap-1 text-left", children: [_jsx(PayoutBadge, {}), _jsx("div", { className: "font-semibold", children: maskFirstLast(latestJackpotPayout.member.name, {
|
|
127
|
+
firstCharsCount: 3,
|
|
128
|
+
midLength: 3,
|
|
128
129
|
}) }), _jsx("div", { className: twMerge('text-2xl text-brand-400', className?.latestPayoutAmount), children: formatNumber(latestJackpotPayout.amount, {
|
|
129
130
|
currency: localeInfo.currency.code,
|
|
130
131
|
minDecimalPlaces: 2,
|
|
@@ -137,8 +138,9 @@ export function JackpotsCarouselStageItem({ style, className, viewAllUrl, animat
|
|
|
137
138
|
'Timestamp',
|
|
138
139
|
].map((header) => (_jsx("th", { className: "px-4", children: header }, header))) }) }), _jsx("tbody", { children: jackpot.stages
|
|
139
140
|
? jackpot.stages.map((j, i) => (_jsxs("tr", { className: twMerge('whitespace-nowrap bg-bg-primary text-left text-sm text-text-secondary-700', className?.recentPayoutsTableBodyRow), children: [_jsx("td", { className: twMerge('h-12 border-border-secondary border-t-2 px-4', className?.recentPayoutsTableBodyData), children: i + 1 }), _jsx("td", { className: twMerge('h-12 border-border-secondary border-t-2 px-4', className?.recentPayoutsTableBodyData), children: j.member?.name
|
|
140
|
-
?
|
|
141
|
-
|
|
141
|
+
? maskFirstLast(j.member.name, {
|
|
142
|
+
firstCharsCount: 3,
|
|
143
|
+
midLength: 3,
|
|
142
144
|
})
|
|
143
145
|
: '-' }), _jsx("td", { className: twMerge('h-12 border-border-secondary border-t-2 px-4', className?.recentPayoutsTableBodyData), children: formatNumber(j.targetTurnover, {
|
|
144
146
|
currency: localeInfo.currency.code,
|
|
@@ -13,7 +13,7 @@ import { User01Icon } from '../../../icons/User01Icon.js';
|
|
|
13
13
|
import firstPlace from '../../../images/first-place.png';
|
|
14
14
|
import leaderboard from '../../../images/leaderboard.png';
|
|
15
15
|
import { formatNumber } from '../../../utils/formatNumber.js';
|
|
16
|
-
import {
|
|
16
|
+
import { maskFirstLast } from '../../../utils/mask.js';
|
|
17
17
|
import { parseDecimal } from '../../../utils/parseDecimal.js';
|
|
18
18
|
import styles from '../Jackpots.module.css';
|
|
19
19
|
import { useJackpotsListItemContext } from './JackpotsListContext.js';
|
|
@@ -66,6 +66,7 @@ export function JackpotMultiStageDesktop({ animate = true, customJackpotChestIma
|
|
|
66
66
|
? jackpot.stages.map((j, i) => (_jsxs("tr", { className: twMerge('whitespace-nowrap bg-bg-primary text-left text-sm text-text-secondary-700', className?.recentPayoutsTableBodyRow), children: [_jsx("td", { className: twMerge('h-12 border-border-secondary border-t-2 px-4', className?.recentPayoutsTableBodyData), children: i + 1 }), _jsx("td", { className: twMerge('h-12 border-border-secondary border-t-2 px-4', className?.recentPayoutsTableBodyData), children: j.member?.name
|
|
67
67
|
? maskFirstLast(j.member.name, {
|
|
68
68
|
firstCharsCount: 3,
|
|
69
|
+
midLength: 3,
|
|
69
70
|
})
|
|
70
71
|
: '-' }), _jsx("td", { className: twMerge('h-12 border-border-secondary border-t-2 px-4', className?.recentPayoutsTableBodyData), children: formatNumber(j.targetTurnover, {
|
|
71
72
|
currency: localeInfo.currency.code,
|
|
@@ -91,8 +92,9 @@ export function JackpotMultiStageDesktop({ animate = true, customJackpotChestIma
|
|
|
91
92
|
currency: localeInfo.currency.code,
|
|
92
93
|
minDecimalPlaces: 2,
|
|
93
94
|
maxDecimalPlaces: 2,
|
|
94
|
-
})] })] })] }), _jsx("div", { className: "min-w-30" }), chestImages.image && (_jsx("div", { className: twMerge('right-0 bottom-[-60] z-1 min-w-30 lg:absolute', chestImages?.style?.wrapper), children: _jsx(Image, { width: 150, height: 150, src: chestImages.image, alt: "chest", className: twMerge('size-full h-25 w-25 p-2 lg:h-37.5 lg:w-37.5', chestImages?.style?.image) }) }))] }), _jsx("div", { className: twMerge('relative mt-4 hidden w-full gap-4 rounded-lg bg-bg-primary p-4 lg:flex', className?.latestPayoutRoot), children: topJackpotPayout?.amount ? (_jsxs(_Fragment, { children: [_jsx(ProfileIcon, {}), _jsxs("div", { className: "flex flex-col gap-1 text-left", children: [_jsx(PayoutBadge, {}), _jsx("div", { className: "font-semibold", children:
|
|
95
|
-
|
|
95
|
+
})] })] })] }), _jsx("div", { className: "min-w-30" }), chestImages.image && (_jsx("div", { className: twMerge('right-0 bottom-[-60] z-1 min-w-30 lg:absolute', chestImages?.style?.wrapper), children: _jsx(Image, { width: 150, height: 150, src: chestImages.image, alt: "chest", className: twMerge('size-full h-25 w-25 p-2 lg:h-37.5 lg:w-37.5', chestImages?.style?.image) }) }))] }), _jsx("div", { className: twMerge('relative mt-4 hidden w-full gap-4 rounded-lg bg-bg-primary p-4 lg:flex', className?.latestPayoutRoot), children: topJackpotPayout?.amount ? (_jsxs(_Fragment, { children: [_jsx(ProfileIcon, {}), _jsxs("div", { className: "flex flex-col gap-1 text-left", children: [_jsx(PayoutBadge, {}), _jsx("div", { className: "font-semibold", children: maskFirstLast(topJackpotPayout.member.name, {
|
|
96
|
+
firstCharsCount: 3,
|
|
97
|
+
midLength: 3,
|
|
96
98
|
}) }), _jsx("div", { className: twMerge('text-2xl text-brand-400', className?.latestPayoutAmount), children: formatNumber(topJackpotPayout.amount, {
|
|
97
99
|
currency: localeInfo.currency.code,
|
|
98
100
|
minDecimalPlaces: 2,
|
|
@@ -17,7 +17,7 @@ import firstPlace from '../../../images/first-place.png';
|
|
|
17
17
|
import leaderboard from '../../../images/leaderboard.png';
|
|
18
18
|
import { Button } from '../../../ui/Button/index.js';
|
|
19
19
|
import { formatNumber } from '../../../utils/formatNumber.js';
|
|
20
|
-
import {
|
|
20
|
+
import { maskFirstLast } from '../../../utils/mask.js';
|
|
21
21
|
import { parseDecimal } from '../../../utils/parseDecimal.js';
|
|
22
22
|
import styles from '../Jackpots.module.css';
|
|
23
23
|
import { useJackpotsListItemContext } from './JackpotsListContext.js';
|
|
@@ -88,8 +88,9 @@ export function JackpotMultiStageMobile({ animate = true, customJackpotChestImag
|
|
|
88
88
|
};
|
|
89
89
|
const RecentPayoutsTable = () => (_jsx("div", { className: "overflow-x-auto border-gray-200", children: _jsxs("table", { className: "w-full min-w-[37.5rem]", children: [_jsx("thead", { children: _jsx("tr", { className: twMerge('h-8 whitespace-nowrap bg-bg-secondary text-left font-medium text-text-tertiary-600 text-xs', className?.recentPayoutsTableHeadRow), children: ['Stage', 'Player', 'Target Turnover', 'Prize', 'Timestamp'].map((header) => (_jsx("th", { className: "px-4", children: header }, header))) }) }), _jsx("tbody", { children: jackpot.stages
|
|
90
90
|
? jackpot.stages.map((j, i) => (_jsxs("tr", { className: twMerge('whitespace-nowrap bg-bg-primary text-left text-sm text-text-secondary-700', className?.recentPayoutsTableBodyRow), children: [_jsx("td", { className: twMerge('h-12 border-border-secondary border-t-2 px-4', className?.recentPayoutsTableBodyData), children: i + 1 }), _jsx("td", { className: twMerge('h-12 border-border-secondary border-t-2 px-4', className?.recentPayoutsTableBodyData), children: j.member?.name
|
|
91
|
-
?
|
|
92
|
-
|
|
91
|
+
? maskFirstLast(j.member.name, {
|
|
92
|
+
firstCharsCount: 3,
|
|
93
|
+
midLength: 3,
|
|
93
94
|
})
|
|
94
95
|
: '-' }), _jsx("td", { className: twMerge('h-12 border-border-secondary border-t-2 px-4', className?.recentPayoutsTableBodyData), children: formatNumber(j.targetTurnover, {
|
|
95
96
|
currency: localeInfo.currency.code,
|
package/dist/utils/mask.d.ts
CHANGED
package/dist/utils/mask.js
CHANGED
|
@@ -39,6 +39,6 @@ export const maskFirstLast = cache((value, opts) => {
|
|
|
39
39
|
const firstChars = value.slice(0, firstCharsCount);
|
|
40
40
|
const lastChar = value.slice(-1);
|
|
41
41
|
const middleLength = value.length - firstCharsCount - 1;
|
|
42
|
-
const maskedChars = maskChar.repeat(middleLength);
|
|
42
|
+
const maskedChars = maskChar.repeat(opts?.midLength ?? middleLength);
|
|
43
43
|
return firstChars + maskedChars + lastChar;
|
|
44
44
|
});
|