@robertlinde/react-tour-kit 0.6.0 → 0.6.1
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/react-native-platform/components/tour-overlay.js +33 -1
- package/dist/react-native-platform/components/tour-overlay.js.map +1 -1
- package/dist/react-native-platform/components/tour-tooltip.js +23 -5
- package/dist/react-native-platform/components/tour-tooltip.js.map +1 -1
- package/dist/react-platform/components/tour-tooltip.js +28 -8
- package/dist/react-platform/components/tour-tooltip.js.map +1 -1
- package/dist/shared/utils/get-truncated-dots.util.d.ts +11 -0
- package/dist/shared/utils/get-truncated-dots.util.js +37 -0
- package/dist/shared/utils/get-truncated-dots.util.js.map +1 -0
- package/dist/shared/utils/index.d.ts +2 -0
- package/dist/shared/utils/index.js +1 -0
- package/dist/shared/utils/index.js.map +1 -1
- package/package.json +2 -2
|
@@ -52,7 +52,28 @@ export function TourOverlay({ highlightRect, onClose, theme }) {
|
|
|
52
52
|
right: 0,
|
|
53
53
|
bottom: 0,
|
|
54
54
|
},
|
|
55
|
-
] }),
|
|
55
|
+
] }), [
|
|
56
|
+
{
|
|
57
|
+
top: cutoutTop,
|
|
58
|
+
left: cutoutLeft,
|
|
59
|
+
childStyle: { bottom: 0, right: 0, borderBottomRightRadius: highlightBorderRadius },
|
|
60
|
+
},
|
|
61
|
+
{
|
|
62
|
+
top: cutoutTop,
|
|
63
|
+
left: cutoutLeft + cutoutWidth - highlightBorderRadius,
|
|
64
|
+
childStyle: { bottom: 0, left: 0, borderBottomLeftRadius: highlightBorderRadius },
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
top: cutoutTop + cutoutHeight - highlightBorderRadius,
|
|
68
|
+
left: cutoutLeft,
|
|
69
|
+
childStyle: { top: 0, right: 0, borderTopRightRadius: highlightBorderRadius },
|
|
70
|
+
},
|
|
71
|
+
{
|
|
72
|
+
top: cutoutTop + cutoutHeight - highlightBorderRadius,
|
|
73
|
+
left: cutoutLeft + cutoutWidth - highlightBorderRadius,
|
|
74
|
+
childStyle: { top: 0, left: 0, borderTopLeftRadius: highlightBorderRadius },
|
|
75
|
+
},
|
|
76
|
+
].map((corner, i) => (_jsx(View, { style: [styles.cornerPatch, { top: corner.top, left: corner.left }], children: _jsx(View, { style: [styles.cornerFill, themedStyles.overlay, corner.childStyle] }) }, i))), _jsx(View, { style: [
|
|
56
77
|
styles.highlightBorder,
|
|
57
78
|
themedStyles.highlightBorder,
|
|
58
79
|
{
|
|
@@ -76,5 +97,16 @@ const styles = StyleSheet.create({
|
|
|
76
97
|
borderWidth: 2,
|
|
77
98
|
backgroundColor: 'transparent',
|
|
78
99
|
},
|
|
100
|
+
cornerPatch: {
|
|
101
|
+
position: 'absolute',
|
|
102
|
+
width: highlightBorderRadius,
|
|
103
|
+
height: highlightBorderRadius,
|
|
104
|
+
overflow: 'hidden',
|
|
105
|
+
},
|
|
106
|
+
cornerFill: {
|
|
107
|
+
position: 'absolute',
|
|
108
|
+
width: highlightBorderRadius * 2,
|
|
109
|
+
height: highlightBorderRadius * 2,
|
|
110
|
+
},
|
|
79
111
|
});
|
|
80
112
|
//# sourceMappingURL=tour-overlay.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tour-overlay.js","sourceRoot":"","sources":["../../../src/react-native-platform/components/tour-overlay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAiB,OAAO,EAAC,MAAM,OAAO,CAAC;AAI9C,MAAM,EAAC,IAAI,EAAE,UAAU,EAAE,wBAAwB,EAAC,GAAG,OAAO,CAAC,cAAc,CAAkC,CAAC;AAE9G,MAAM,gBAAgB,GAAG,CAAC,CAAC;AAC3B,MAAM,qBAAqB,GAAG,CAAC,CAAC;AAMhC,MAAM,UAAU,WAAW,CAAC,EAAC,aAAa,EAAE,OAAO,EAAE,KAAK,EAAmB;IAC3E,MAAM,SAAS,GAAG,aAAa,CAAC,GAAG,GAAG,gBAAgB,CAAC;IACvD,MAAM,UAAU,GAAG,aAAa,CAAC,IAAI,GAAG,gBAAgB,CAAC;IACzD,MAAM,WAAW,GAAG,aAAa,CAAC,KAAK,GAAG,gBAAgB,GAAG,CAAC,CAAC;IAC/D,MAAM,YAAY,GAAG,aAAa,CAAC,MAAM,GAAG,gBAAgB,GAAG,CAAC,CAAC;IAEjE,MAAM,YAAY,GAAG,OAAO,CAC1B,GAAqD,EAAE,CAAC,CAAC;QACvD,OAAO,EAAE;YACP,eAAe,EAAE,KAAK,CAAC,YAAY;SACpC;QACD,eAAe,EAAE;YACf,WAAW,EAAE,KAAK,CAAC,YAAY;SAChC;KACF,CAAC,EACF,CAAC,KAAK,CAAC,CACR,CAAC;IAEF,OAAO,CACL,KAAC,wBAAwB,IAAC,OAAO,EAAE,OAAO,YACxC,MAAC,IAAI,IAAC,KAAK,EAAE,MAAM,CAAC,SAAS,aAE3B,KAAC,IAAI,IACH,KAAK,EAAE;wBACL,MAAM,CAAC,OAAO;wBACd,YAAY,CAAC,OAAO;wBACpB;4BACE,GAAG,EAAE,CAAC;4BACN,IAAI,EAAE,CAAC;4BACP,KAAK,EAAE,CAAC;4BACR,MAAM,EAAE,SAAS;yBAClB;qBACF,GACD,EAGF,KAAC,IAAI,IACH,KAAK,EAAE;wBACL,MAAM,CAAC,OAAO;wBACd,YAAY,CAAC,OAAO;wBACpB;4BACE,GAAG,EAAE,SAAS;4BACd,IAAI,EAAE,CAAC;4BACP,KAAK,EAAE,UAAU;4BACjB,MAAM,EAAE,YAAY;yBACrB;qBACF,GACD,EAGF,KAAC,IAAI,IACH,KAAK,EAAE;wBACL,MAAM,CAAC,OAAO;wBACd,YAAY,CAAC,OAAO;wBACpB;4BACE,GAAG,EAAE,SAAS;4BACd,IAAI,EAAE,UAAU,GAAG,WAAW;4BAC9B,KAAK,EAAE,CAAC;4BACR,MAAM,EAAE,YAAY;yBACrB;qBACF,GACD,EAGF,KAAC,IAAI,IACH,KAAK,EAAE;wBACL,MAAM,CAAC,OAAO;wBACd,YAAY,CAAC,OAAO;wBACpB;4BACE,GAAG,EAAE,SAAS,GAAG,YAAY;4BAC7B,IAAI,EAAE,CAAC;4BACP,KAAK,EAAE,CAAC;4BACR,MAAM,EAAE,CAAC;yBACV;qBACF,GACD,EAGF,KAAC,IAAI,IACH,KAAK,EAAE;wBACL,MAAM,CAAC,eAAe;wBACtB,YAAY,CAAC,eAAe;wBAC5B;4BACE,GAAG,EAAE,SAAS;4BACd,IAAI,EAAE,UAAU;4BAChB,KAAK,EAAE,WAAW;4BAClB,MAAM,EAAE,YAAY;4BACpB,YAAY,EAAE,qBAAqB;yBACpC;qBACF,GACD,IACG,GACkB,CAC5B,CAAC;AACJ,CAAC;AAED,MAAM,MAAM,GAAG,UAAU,CAAC,MAAM,CAAC;IAC/B,SAAS,EAAE;QACT,GAAG,UAAU,CAAC,YAAY;KAC3B;IACD,OAAO,EAAE;QACP,QAAQ,EAAE,UAAU;KACrB;IACD,eAAe,EAAE;QACf,QAAQ,EAAE,UAAU;QACpB,WAAW,EAAE,CAAC;QACd,eAAe,EAAE,aAAa;KAC/B;CACF,CAAC,CAAC"}
|
|
1
|
+
{"version":3,"file":"tour-overlay.js","sourceRoot":"","sources":["../../../src/react-native-platform/components/tour-overlay.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef, useMemo } from 'react';
|
|
3
|
+
import { getTruncatedDots, DOTS_CONTAINER_WIDTH, DOT_SIZE, DOT_GAP } from '../../shared/utils';
|
|
3
4
|
const { View, Text, TouchableOpacity, StyleSheet } = require('react-native');
|
|
4
5
|
const defaultI18n = {
|
|
5
6
|
nextLabel: 'Next',
|
|
@@ -42,7 +43,7 @@ export const TourTooltip = forwardRef(function TourTooltip({ title, content, cur
|
|
|
42
43
|
left: position.left,
|
|
43
44
|
opacity: isPositioned ? 1 : 0,
|
|
44
45
|
},
|
|
45
|
-
], children: [_jsxs(View, { style: styles.header, children: [_jsx(View, { style: [styles.stepBadge, themedStyles.stepBadge], children: _jsx(Text, { style: styles.stepBadgeText, children: stepCounterTemplate.replace('{current}', String(currentStep + 1)).replace('{total}', String(totalSteps)) }) }), _jsx(TouchableOpacity, { style: styles.closeButton, onPress: onClose, children: _jsx(Text, { style: [styles.closeButtonText, themedStyles.closeButtonText], children: "\u00D7" }) })] }), _jsxs(View, { style: styles.body, children: [_jsx(Text, { style: [styles.title, themedStyles.title], children: title }), _jsx(Text, { style: [styles.content, themedStyles.content], children: content })] }), _jsxs(View, { style: styles.footer, children: [_jsx(TouchableOpacity, { disabled: isFirstStep, style: [styles.navButton, styles.prevButton, isFirstStep && styles.buttonDisabled], onPress: onPrev, children: _jsx(Text, { style: [styles.prevButtonText, isFirstStep && styles.buttonTextDisabled], children: prevLabel }) }), _jsx(View, { style: styles.dots, children:
|
|
46
|
+
], children: [_jsxs(View, { style: styles.header, children: [_jsx(View, { style: [styles.stepBadge, themedStyles.stepBadge], children: _jsx(Text, { style: styles.stepBadgeText, children: stepCounterTemplate.replace('{current}', String(currentStep + 1)).replace('{total}', String(totalSteps)) }) }), _jsx(TouchableOpacity, { style: styles.closeButton, onPress: onClose, children: _jsx(Text, { style: [styles.closeButtonText, themedStyles.closeButtonText], children: "\u00D7" }) })] }), _jsxs(View, { style: styles.body, children: [_jsx(Text, { style: [styles.title, themedStyles.title], children: title }), _jsx(Text, { style: [styles.content, themedStyles.content], children: content })] }), _jsxs(View, { style: styles.footer, children: [_jsx(TouchableOpacity, { disabled: isFirstStep, style: [styles.navButton, styles.prevButton, isFirstStep && styles.buttonDisabled], onPress: onPrev, children: _jsx(Text, { style: [styles.prevButtonText, isFirstStep && styles.buttonTextDisabled], children: prevLabel }) }), _jsx(View, { style: styles.dots, children: getTruncatedDots(currentStep, totalSteps).map((item, i) => item.type === 'ellipsis' ? (_jsxs(View, { style: styles.ellipsis, children: [_jsx(View, { style: styles.ellipsisDot }), _jsx(View, { style: styles.ellipsisDot })] }, `ellipsis-${i}`)) : (_jsx(View, { style: [styles.dot, item.index === currentStep && themedStyles.dotActive] }, item.index))) }), _jsx(TouchableOpacity, { style: [styles.navButton, themedStyles.nextButton], onPress: onNext, children: _jsx(Text, { style: styles.nextButtonText, children: isLastStep ? finishLabel : nextLabel }) })] })] }));
|
|
46
47
|
});
|
|
47
48
|
const styles = StyleSheet.create({
|
|
48
49
|
container: {
|
|
@@ -130,12 +131,29 @@ const styles = StyleSheet.create({
|
|
|
130
131
|
},
|
|
131
132
|
dots: {
|
|
132
133
|
flexDirection: 'row',
|
|
133
|
-
gap:
|
|
134
|
+
gap: DOT_GAP,
|
|
135
|
+
width: DOTS_CONTAINER_WIDTH,
|
|
136
|
+
justifyContent: 'center',
|
|
137
|
+
alignItems: 'center',
|
|
134
138
|
},
|
|
135
139
|
dot: {
|
|
136
|
-
width:
|
|
137
|
-
height:
|
|
138
|
-
borderRadius:
|
|
140
|
+
width: DOT_SIZE,
|
|
141
|
+
height: DOT_SIZE,
|
|
142
|
+
borderRadius: DOT_SIZE / 2,
|
|
143
|
+
backgroundColor: '#d1d5db',
|
|
144
|
+
},
|
|
145
|
+
ellipsis: {
|
|
146
|
+
width: DOT_SIZE,
|
|
147
|
+
height: DOT_SIZE,
|
|
148
|
+
flexDirection: 'row',
|
|
149
|
+
alignItems: 'center',
|
|
150
|
+
justifyContent: 'center',
|
|
151
|
+
gap: 2,
|
|
152
|
+
},
|
|
153
|
+
ellipsisDot: {
|
|
154
|
+
width: 3,
|
|
155
|
+
height: 3,
|
|
156
|
+
borderRadius: 1.5,
|
|
139
157
|
backgroundColor: '#d1d5db',
|
|
140
158
|
},
|
|
141
159
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tour-tooltip.js","sourceRoot":"","sources":["../../../src/react-native-platform/components/tour-tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAiB,UAAU,EAAqB,OAAO,EAAC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"tour-tooltip.js","sourceRoot":"","sources":["../../../src/react-native-platform/components/tour-tooltip.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
'use client';
|
|
2
2
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { forwardRef } from 'react';
|
|
4
|
+
import { getTruncatedDots, DOTS_CONTAINER_WIDTH, DOT_SIZE, DOT_GAP } from '../../shared/utils';
|
|
4
5
|
const defaultI18n = {
|
|
5
6
|
nextLabel: 'Next',
|
|
6
7
|
prevLabel: 'Back',
|
|
@@ -98,15 +99,19 @@ function TourTooltipComponent({ title, content, currentStep, totalSteps, positio
|
|
|
98
99
|
},
|
|
99
100
|
dotsContainer: {
|
|
100
101
|
display: 'flex',
|
|
101
|
-
gap:
|
|
102
|
+
gap: `${DOT_GAP}px`,
|
|
103
|
+
width: `${DOTS_CONTAINER_WIDTH}px`,
|
|
104
|
+
justifyContent: 'center',
|
|
105
|
+
alignItems: 'center',
|
|
102
106
|
},
|
|
103
107
|
dot: {
|
|
104
|
-
width:
|
|
105
|
-
height:
|
|
108
|
+
width: `${DOT_SIZE}px`,
|
|
109
|
+
height: `${DOT_SIZE}px`,
|
|
106
110
|
borderRadius: '50%',
|
|
107
111
|
border: 'none',
|
|
108
112
|
cursor: 'pointer',
|
|
109
113
|
padding: 0,
|
|
114
|
+
flexShrink: 0,
|
|
110
115
|
},
|
|
111
116
|
dotActive: {
|
|
112
117
|
backgroundColor: theme.primaryColor,
|
|
@@ -114,6 +119,21 @@ function TourTooltipComponent({ title, content, currentStep, totalSteps, positio
|
|
|
114
119
|
dotInactive: {
|
|
115
120
|
backgroundColor: '#d1d5db',
|
|
116
121
|
},
|
|
122
|
+
ellipsis: {
|
|
123
|
+
width: `${DOT_SIZE}px`,
|
|
124
|
+
height: `${DOT_SIZE}px`,
|
|
125
|
+
display: 'flex',
|
|
126
|
+
alignItems: 'center',
|
|
127
|
+
justifyContent: 'center',
|
|
128
|
+
gap: '2px',
|
|
129
|
+
flexShrink: 0,
|
|
130
|
+
},
|
|
131
|
+
ellipsisDot: {
|
|
132
|
+
width: '3px',
|
|
133
|
+
height: '3px',
|
|
134
|
+
borderRadius: '50%',
|
|
135
|
+
backgroundColor: '#d1d5db',
|
|
136
|
+
},
|
|
117
137
|
};
|
|
118
138
|
return (_jsx("div", { ref: ref, style: {
|
|
119
139
|
...styles.container,
|
|
@@ -124,12 +144,12 @@ function TourTooltipComponent({ title, content, currentStep, totalSteps, positio
|
|
|
124
144
|
}, children: _jsxs("div", { style: styles.card, children: [_jsxs("div", { style: styles.header, children: [_jsx("span", { style: styles.stepTag, children: stepCounterTemplate.replace('{current}', String(currentStep + 1)).replace('{total}', String(totalSteps)) }), _jsx("button", { type: "button", style: styles.closeButton, "aria-label": closeAriaLabel, onClick: onClose, children: "\u2715" })] }), _jsxs("div", { style: styles.body, children: [_jsx("h3", { style: styles.title, children: title }), _jsx("p", { style: styles.content, children: content })] }), _jsxs("div", { style: styles.footer, children: [_jsx("button", { type: "button", style: {
|
|
125
145
|
...styles.navButton,
|
|
126
146
|
...(isFirstStep ? styles.navButtonDisabled : {}),
|
|
127
|
-
}, disabled: isFirstStep, onClick: onPrev, children: prevLabel }), _jsx("div", { style: styles.dotsContainer, children:
|
|
147
|
+
}, disabled: isFirstStep, onClick: onPrev, children: prevLabel }), _jsx("div", { style: styles.dotsContainer, children: getTruncatedDots(currentStep, totalSteps).map((item, i) => item.type === 'ellipsis' ? (_jsxs("span", { style: styles.ellipsis, children: [_jsx("span", { style: styles.ellipsisDot }), _jsx("span", { style: styles.ellipsisDot })] }, `ellipsis-${i}`)) : (_jsx("button", { type: "button", style: {
|
|
128
148
|
...styles.dot,
|
|
129
|
-
...(index === currentStep ? styles.dotActive : styles.dotInactive),
|
|
130
|
-
}, "aria-label": dotAriaLabelTemplate.replace('{step}', String(index + 1)), onClick: () => {
|
|
131
|
-
onGoToStep(index);
|
|
132
|
-
} }, `step-${index}`))) }), _jsx("button", { type: "button", style: styles.nextButton, onClick: onNext, children: isLastStep ? finishLabel : nextLabel })] })] }) }));
|
|
149
|
+
...(item.index === currentStep ? styles.dotActive : styles.dotInactive),
|
|
150
|
+
}, "aria-label": dotAriaLabelTemplate.replace('{step}', String(item.index + 1)), onClick: () => {
|
|
151
|
+
onGoToStep(item.index);
|
|
152
|
+
} }, `step-${item.index}`))) }), _jsx("button", { type: "button", style: styles.nextButton, onClick: onNext, children: isLastStep ? finishLabel : nextLabel })] })] }) }));
|
|
133
153
|
}
|
|
134
154
|
export const TourTooltip = forwardRef(TourTooltipComponent);
|
|
135
155
|
//# sourceMappingURL=tour-tooltip.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tour-tooltip.js","sourceRoot":"","sources":["../../../src/react-platform/components/tour-tooltip.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAA8B,UAAU,EAAC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"tour-tooltip.js","sourceRoot":"","sources":["../../../src/react-platform/components/tour-tooltip.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export declare const MAX_VISIBLE_DOTS = 7;
|
|
2
|
+
export declare const DOT_SIZE = 8;
|
|
3
|
+
export declare const DOT_GAP = 6;
|
|
4
|
+
export declare const DOTS_CONTAINER_WIDTH: number;
|
|
5
|
+
export type DotItem = {
|
|
6
|
+
type: 'dot';
|
|
7
|
+
index: number;
|
|
8
|
+
} | {
|
|
9
|
+
type: 'ellipsis';
|
|
10
|
+
};
|
|
11
|
+
export declare function getTruncatedDots(currentStep: number, totalSteps: number): DotItem[];
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
export const MAX_VISIBLE_DOTS = 7;
|
|
2
|
+
export const DOT_SIZE = 8;
|
|
3
|
+
export const DOT_GAP = 6;
|
|
4
|
+
export const DOTS_CONTAINER_WIDTH = MAX_VISIBLE_DOTS * DOT_SIZE + (MAX_VISIBLE_DOTS - 1) * DOT_GAP;
|
|
5
|
+
export function getTruncatedDots(currentStep, totalSteps) {
|
|
6
|
+
if (totalSteps <= MAX_VISIBLE_DOTS) {
|
|
7
|
+
return Array.from({ length: totalSteps }, (_, i) => ({ type: 'dot', index: i }));
|
|
8
|
+
}
|
|
9
|
+
const dots = [];
|
|
10
|
+
const indices = new Set([0, totalSteps - 1, currentStep]);
|
|
11
|
+
for (let offset = 1; indices.size < MAX_VISIBLE_DOTS - countGaps(indices); offset++) {
|
|
12
|
+
if (currentStep - offset >= 0)
|
|
13
|
+
indices.add(currentStep - offset);
|
|
14
|
+
if (currentStep + offset < totalSteps)
|
|
15
|
+
indices.add(currentStep + offset);
|
|
16
|
+
if (offset > totalSteps)
|
|
17
|
+
break;
|
|
18
|
+
}
|
|
19
|
+
const sorted = [...indices].toSorted((a, b) => a - b);
|
|
20
|
+
for (let i = 0; i < sorted.length; i++) {
|
|
21
|
+
if (i > 0 && sorted[i] - sorted[i - 1] > 1) {
|
|
22
|
+
dots.push({ type: 'ellipsis' });
|
|
23
|
+
}
|
|
24
|
+
dots.push({ type: 'dot', index: sorted[i] });
|
|
25
|
+
}
|
|
26
|
+
return dots;
|
|
27
|
+
}
|
|
28
|
+
function countGaps(indices) {
|
|
29
|
+
const sorted = [...indices].toSorted((a, b) => a - b);
|
|
30
|
+
let gaps = 0;
|
|
31
|
+
for (let i = 1; i < sorted.length; i++) {
|
|
32
|
+
if (sorted[i] - sorted[i - 1] > 1)
|
|
33
|
+
gaps++;
|
|
34
|
+
}
|
|
35
|
+
return gaps;
|
|
36
|
+
}
|
|
37
|
+
//# sourceMappingURL=get-truncated-dots.util.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"get-truncated-dots.util.js","sourceRoot":"","sources":["../../../src/shared/utils/get-truncated-dots.util.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,CAAC;AAClC,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,CAAC;AAC1B,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,CAAC;AACzB,MAAM,CAAC,MAAM,oBAAoB,GAAG,gBAAgB,GAAG,QAAQ,GAAG,CAAC,gBAAgB,GAAG,CAAC,CAAC,GAAG,OAAO,CAAC;AAInG,MAAM,UAAU,gBAAgB,CAAC,WAAmB,EAAE,UAAkB;IACtE,IAAI,UAAU,IAAI,gBAAgB,EAAE,CAAC;QACnC,OAAO,KAAK,CAAC,IAAI,CAAC,EAAC,MAAM,EAAE,UAAU,EAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,EAAC,IAAI,EAAE,KAAc,EAAE,KAAK,EAAE,CAAC,EAAC,CAAC,CAAC,CAAC;IACxF,CAAC;IAED,MAAM,IAAI,GAAc,EAAE,CAAC;IAC3B,MAAM,OAAO,GAAG,IAAI,GAAG,CAAS,CAAC,CAAC,EAAE,UAAU,GAAG,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC;IAIlE,KAAK,IAAI,MAAM,GAAG,CAAC,EAAE,OAAO,CAAC,IAAI,GAAG,gBAAgB,GAAG,SAAS,CAAC,OAAO,CAAC,EAAE,MAAM,EAAE,EAAE,CAAC;QACpF,IAAI,WAAW,GAAG,MAAM,IAAI,CAAC;YAAE,OAAO,CAAC,GAAG,CAAC,WAAW,GAAG,MAAM,CAAC,CAAC;QACjE,IAAI,WAAW,GAAG,MAAM,GAAG,UAAU;YAAE,OAAO,CAAC,GAAG,CAAC,WAAW,GAAG,MAAM,CAAC,CAAC;QACzE,IAAI,MAAM,GAAG,UAAU;YAAE,MAAM;IACjC,CAAC;IAED,MAAM,MAAM,GAAG,CAAC,GAAG,OAAO,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;IAEtD,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACvC,IAAI,CAAC,GAAG,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC;YAC3C,IAAI,CAAC,IAAI,CAAC,EAAC,IAAI,EAAE,UAAU,EAAC,CAAC,CAAC;QAChC,CAAC;QAED,IAAI,CAAC,IAAI,CAAC,EAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC,EAAC,CAAC,CAAC;IAC7C,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC;AAED,SAAS,SAAS,CAAC,OAAoB;IACrC,MAAM,MAAM,GAAG,CAAC,GAAG,OAAO,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;IACtD,IAAI,IAAI,GAAG,CAAC,CAAC;IACb,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC;QACvC,IAAI,MAAM,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC;YAAE,IAAI,EAAE,CAAC;IAC5C,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/shared/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,wBAAwB,EAAC,MAAM,mCAAmC,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/shared/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,wBAAwB,EAAC,MAAM,mCAAmC,CAAC;AAC3E,OAAO,EAAC,gBAAgB,EAAE,gBAAgB,EAAE,QAAQ,EAAE,OAAO,EAAE,oBAAoB,EAAC,MAAM,2BAA2B,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@robertlinde/react-tour-kit",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.1",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Cross-platform guided tour library for React and React Native. Build interactive onboarding experiences with customizable tooltips, smart positioning, cross-page navigation, and async step actions. Fully themeable with TypeScript support.",
|
|
6
6
|
"author": "Robert Linde",
|
|
@@ -69,7 +69,7 @@
|
|
|
69
69
|
"@types/react-native": "0.73.0",
|
|
70
70
|
"husky": "9.1.7",
|
|
71
71
|
"lint-staged": "16.4.0",
|
|
72
|
-
"prettier": "3.8.
|
|
72
|
+
"prettier": "3.8.2",
|
|
73
73
|
"react": "19.2.5",
|
|
74
74
|
"react-dom": "19.2.5",
|
|
75
75
|
"typescript": "6.0.2",
|