crew-recommendation-ui 0.0.3 → 0.0.4
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/dls/components/Card.d.ts +6 -0
- package/dist/dls/components/Card.d.ts.map +1 -0
- package/dist/dls/components/index.d.ts +2 -0
- package/dist/dls/components/index.d.ts.map +1 -0
- package/dist/dls/index.d.ts +2 -2
- package/dist/dls/index.d.ts.map +1 -1
- package/dist/index.d.ts +2 -12
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +263 -18
- package/package.json +6 -24
- package/dist/Card-B-7LezA9.js +0 -163
- package/dist/Card-B-7LezA9.js.map +0 -1
- package/dist/dls/index.js +0 -25
- package/dist/dls/index.js.map +0 -1
- package/dist/index.js.map +0 -1
- package/dist/recommendation/components/Card.d.ts +0 -13
- package/dist/recommendation/components/Card.d.ts.map +0 -1
- package/dist/recommendation/components/index.d.ts +0 -6
- package/dist/recommendation/components/index.d.ts.map +0 -1
- package/dist/recommendation/index.d.ts +0 -9
- package/dist/recommendation/index.d.ts.map +0 -1
- package/dist/recommendation/index.js +0 -6
- package/dist/recommendation/index.js.map +0 -1
- package/dist/recommendation/types.d.ts +0 -71
- package/dist/recommendation/types.d.ts.map +0 -1
- package/dist/typography-zz5GzgjI.js +0 -245
- package/dist/typography-zz5GzgjI.js.map +0 -1
- package/src/dls/index.ts +0 -15
- package/src/dls/tokens/colors.ts +0 -94
- package/src/dls/tokens/index.ts +0 -30
- package/src/dls/tokens/spacing.ts +0 -62
- package/src/dls/tokens/typography.ts +0 -119
- package/src/index.ts +0 -25
- package/src/recommendation/components/Card.tsx +0 -212
- package/src/recommendation/components/index.ts +0 -14
- package/src/recommendation/index.ts +0 -15
- package/src/recommendation/types.ts +0 -87
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/dls/components/Card.tsx"],"names":[],"mappings":"AAGA,UAAU,SAAS;IACjB,KAAK,EAAE,MAAM,CAAA;CACd;AAED,eAAO,MAAM,IAAI,cAAe,SAAS,4CAMxC,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/dls/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA"}
|
package/dist/dls/index.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Design Language System (DLS)
|
|
3
3
|
*
|
|
4
|
-
*
|
|
5
|
-
* for building consistent UI across platforms.
|
|
4
|
+
* Exports design tokens and components.
|
|
6
5
|
*/
|
|
7
6
|
export * from './tokens';
|
|
7
|
+
export * from './components';
|
|
8
8
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/dls/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/dls/index.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/dls/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAGH,cAAc,UAAU,CAAA;AAGxB,cAAc,cAAc,CAAA"}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,17 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
|
-
*
|
|
2
|
+
* crew-recommendation-ui
|
|
3
3
|
*
|
|
4
|
-
* A
|
|
5
|
-
* that can be used across:
|
|
6
|
-
* - Web (crew-website)
|
|
7
|
-
* - Mobile App (crew-app via WebView or React Native)
|
|
8
|
-
* - Dashboard
|
|
9
|
-
*
|
|
10
|
-
* This library provides:
|
|
11
|
-
* 1. DLS (Design Language System) - tokens and primitives
|
|
12
|
-
* 2. Recommendation cards - Hotel, Flight, Cab, etc.
|
|
4
|
+
* A simple DLS library with tokens and components.
|
|
13
5
|
*/
|
|
14
6
|
export * from './dls';
|
|
15
|
-
export * from './recommendation';
|
|
16
|
-
export declare const VERSION = "0.0.1";
|
|
17
7
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,cAAc,OAAO,CAAA"}
|
package/dist/index.js
CHANGED
|
@@ -1,20 +1,265 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
1
|
+
import { jsx as l } from "react/jsx-runtime";
|
|
2
|
+
import { StyleSheet as g, View as s, Text as c } from "react-native";
|
|
3
|
+
const o = {
|
|
4
|
+
// Primary brand colors
|
|
5
|
+
primary: {
|
|
6
|
+
50: "#f0f9ff",
|
|
7
|
+
100: "#e0f2fe",
|
|
8
|
+
200: "#bae6fd",
|
|
9
|
+
300: "#7dd3fc",
|
|
10
|
+
400: "#38bdf8",
|
|
11
|
+
500: "#0ea5e9",
|
|
12
|
+
600: "#0284c7",
|
|
13
|
+
700: "#0369a1",
|
|
14
|
+
800: "#075985",
|
|
15
|
+
900: "#0c4a6e"
|
|
16
|
+
},
|
|
17
|
+
// Neutral/Gray scale
|
|
18
|
+
neutral: {
|
|
19
|
+
0: "#ffffff",
|
|
20
|
+
50: "#fafafa",
|
|
21
|
+
100: "#f4f4f5",
|
|
22
|
+
200: "#e4e4e7",
|
|
23
|
+
300: "#d4d4d8",
|
|
24
|
+
400: "#a1a1aa",
|
|
25
|
+
500: "#71717a",
|
|
26
|
+
600: "#52525b",
|
|
27
|
+
700: "#3f3f46",
|
|
28
|
+
800: "#27272a",
|
|
29
|
+
900: "#18181b",
|
|
30
|
+
950: "#09090b"
|
|
31
|
+
},
|
|
32
|
+
// Success colors
|
|
33
|
+
success: {
|
|
34
|
+
50: "#f0fdf4",
|
|
35
|
+
100: "#dcfce7",
|
|
36
|
+
500: "#22c55e",
|
|
37
|
+
600: "#16a34a",
|
|
38
|
+
700: "#15803d"
|
|
39
|
+
},
|
|
40
|
+
// Warning colors
|
|
41
|
+
warning: {
|
|
42
|
+
50: "#fffbeb",
|
|
43
|
+
100: "#fef3c7",
|
|
44
|
+
500: "#f59e0b",
|
|
45
|
+
600: "#d97706",
|
|
46
|
+
700: "#b45309"
|
|
47
|
+
},
|
|
48
|
+
// Error colors
|
|
49
|
+
error: {
|
|
50
|
+
50: "#fef2f2",
|
|
51
|
+
100: "#fee2e2",
|
|
52
|
+
500: "#ef4444",
|
|
53
|
+
600: "#dc2626",
|
|
54
|
+
700: "#b91c1c"
|
|
55
|
+
},
|
|
56
|
+
// Special colors for recommendation cards
|
|
57
|
+
card: {
|
|
58
|
+
background: {
|
|
59
|
+
light: "#ffffff",
|
|
60
|
+
dark: "#1a1a1a"
|
|
61
|
+
},
|
|
62
|
+
border: {
|
|
63
|
+
light: "#e4e4e7",
|
|
64
|
+
dark: "#3f3f46"
|
|
65
|
+
},
|
|
66
|
+
selected: {
|
|
67
|
+
light: "#e0f2fe",
|
|
68
|
+
dark: "#0c4a6e"
|
|
69
|
+
}
|
|
70
|
+
},
|
|
71
|
+
// Category-specific hue colors (for gradient backgrounds)
|
|
72
|
+
categoryHue: {
|
|
73
|
+
hotel: 220,
|
|
74
|
+
flight: 200,
|
|
75
|
+
cab: 35,
|
|
76
|
+
restaurant: 15,
|
|
77
|
+
gifting: 280,
|
|
78
|
+
default: 220
|
|
79
|
+
}
|
|
80
|
+
}, e = {
|
|
81
|
+
// Base spacing values (in pixels)
|
|
82
|
+
0: 0,
|
|
83
|
+
0.5: 2,
|
|
84
|
+
1: 4,
|
|
85
|
+
1.5: 6,
|
|
86
|
+
2: 8,
|
|
87
|
+
2.5: 10,
|
|
88
|
+
3: 12,
|
|
89
|
+
3.5: 14,
|
|
90
|
+
4: 16,
|
|
91
|
+
5: 20,
|
|
92
|
+
6: 24,
|
|
93
|
+
7: 28,
|
|
94
|
+
8: 32,
|
|
95
|
+
9: 36,
|
|
96
|
+
10: 40,
|
|
97
|
+
11: 44,
|
|
98
|
+
12: 48,
|
|
99
|
+
14: 56,
|
|
100
|
+
16: 64,
|
|
101
|
+
20: 80,
|
|
102
|
+
24: 96,
|
|
103
|
+
28: 112,
|
|
104
|
+
32: 128
|
|
105
|
+
}, d = {
|
|
106
|
+
// Component internal spacing
|
|
107
|
+
cardPadding: e[4],
|
|
108
|
+
// 16px
|
|
109
|
+
cardGap: e[3],
|
|
110
|
+
// 12px
|
|
111
|
+
sectionGap: e[6],
|
|
112
|
+
// 24px
|
|
113
|
+
// List spacing
|
|
114
|
+
listItemGap: e[3],
|
|
115
|
+
// 12px
|
|
116
|
+
listPadding: e[4],
|
|
117
|
+
// 16px
|
|
118
|
+
// Button spacing
|
|
119
|
+
buttonPaddingX: e[4],
|
|
120
|
+
// 16px
|
|
121
|
+
buttonPaddingY: e[2],
|
|
122
|
+
// 8px
|
|
123
|
+
buttonGap: e[2],
|
|
124
|
+
// 8px
|
|
125
|
+
// Input spacing
|
|
126
|
+
inputPaddingX: e[3],
|
|
127
|
+
// 12px
|
|
128
|
+
inputPaddingY: e[2],
|
|
129
|
+
// 8px
|
|
130
|
+
// Screen margins
|
|
131
|
+
screenMarginX: e[4],
|
|
132
|
+
// 16px
|
|
133
|
+
screenMarginY: e[4]
|
|
134
|
+
// 16px
|
|
135
|
+
}, h = {
|
|
136
|
+
sans: 'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
|
|
137
|
+
mono: 'ui-monospace, SFMono-Regular, "SF Mono", Consolas, monospace'
|
|
138
|
+
}, t = {
|
|
139
|
+
xs: 12,
|
|
140
|
+
sm: 14,
|
|
141
|
+
base: 16,
|
|
142
|
+
lg: 18,
|
|
143
|
+
xl: 20,
|
|
144
|
+
"2xl": 24,
|
|
145
|
+
"3xl": 30,
|
|
146
|
+
"4xl": 36,
|
|
147
|
+
"5xl": 48
|
|
148
|
+
}, n = {
|
|
149
|
+
normal: "400",
|
|
150
|
+
medium: "500",
|
|
151
|
+
semibold: "600",
|
|
152
|
+
bold: "700"
|
|
153
|
+
}, i = {
|
|
154
|
+
tight: 1.25,
|
|
155
|
+
snug: 1.375,
|
|
156
|
+
normal: 1.5,
|
|
157
|
+
relaxed: 1.625,
|
|
158
|
+
loose: 2
|
|
159
|
+
}, a = {
|
|
160
|
+
tighter: -0.5,
|
|
161
|
+
tight: -0.25,
|
|
162
|
+
normal: 0,
|
|
163
|
+
wide: 0.25,
|
|
164
|
+
wider: 0.5
|
|
165
|
+
}, m = {
|
|
166
|
+
// Headings
|
|
167
|
+
h1: {
|
|
168
|
+
fontSize: t["3xl"],
|
|
169
|
+
fontWeight: n.bold,
|
|
170
|
+
lineHeight: i.tight,
|
|
171
|
+
letterSpacing: a.tight
|
|
172
|
+
},
|
|
173
|
+
h2: {
|
|
174
|
+
fontSize: t["2xl"],
|
|
175
|
+
fontWeight: n.semibold,
|
|
176
|
+
lineHeight: i.tight,
|
|
177
|
+
letterSpacing: a.tight
|
|
178
|
+
},
|
|
179
|
+
h3: {
|
|
180
|
+
fontSize: t.xl,
|
|
181
|
+
fontWeight: n.semibold,
|
|
182
|
+
lineHeight: i.snug
|
|
183
|
+
},
|
|
184
|
+
h4: {
|
|
185
|
+
fontSize: t.lg,
|
|
186
|
+
fontWeight: n.medium,
|
|
187
|
+
lineHeight: i.snug
|
|
188
|
+
},
|
|
189
|
+
// Body text
|
|
190
|
+
body: {
|
|
191
|
+
fontSize: t.base,
|
|
192
|
+
fontWeight: n.normal,
|
|
193
|
+
lineHeight: i.normal
|
|
194
|
+
},
|
|
195
|
+
bodySmall: {
|
|
196
|
+
fontSize: t.sm,
|
|
197
|
+
fontWeight: n.normal,
|
|
198
|
+
lineHeight: i.normal
|
|
199
|
+
},
|
|
200
|
+
// Card specific
|
|
201
|
+
cardTitle: {
|
|
202
|
+
fontSize: t.lg,
|
|
203
|
+
fontWeight: n.semibold,
|
|
204
|
+
lineHeight: i.snug
|
|
205
|
+
},
|
|
206
|
+
cardSubtitle: {
|
|
207
|
+
fontSize: t.sm,
|
|
208
|
+
fontWeight: n.normal,
|
|
209
|
+
lineHeight: i.normal
|
|
210
|
+
},
|
|
211
|
+
cardPrice: {
|
|
212
|
+
fontSize: t.xl,
|
|
213
|
+
fontWeight: n.bold,
|
|
214
|
+
lineHeight: i.tight
|
|
215
|
+
},
|
|
216
|
+
// Labels and captions
|
|
217
|
+
label: {
|
|
218
|
+
fontSize: t.sm,
|
|
219
|
+
fontWeight: n.medium,
|
|
220
|
+
lineHeight: i.normal
|
|
221
|
+
},
|
|
222
|
+
caption: {
|
|
223
|
+
fontSize: t.xs,
|
|
224
|
+
fontWeight: n.normal,
|
|
225
|
+
lineHeight: i.normal
|
|
226
|
+
}
|
|
227
|
+
}, S = {
|
|
228
|
+
colors: o,
|
|
229
|
+
spacing: e,
|
|
230
|
+
semanticSpacing: d,
|
|
231
|
+
fontFamily: h,
|
|
232
|
+
fontSize: t,
|
|
233
|
+
fontWeight: n,
|
|
234
|
+
lineHeight: i,
|
|
235
|
+
letterSpacing: a,
|
|
236
|
+
textStyles: m
|
|
237
|
+
}, p = ({ title: r }) => /* @__PURE__ */ l(s, { style: f.container, children: /* @__PURE__ */ l(c, { style: f.title, children: r }) }), f = g.create({
|
|
238
|
+
container: {
|
|
239
|
+
backgroundColor: o.neutral[800],
|
|
240
|
+
borderRadius: 12,
|
|
241
|
+
padding: e[4],
|
|
242
|
+
alignItems: "center",
|
|
243
|
+
justifyContent: "center",
|
|
244
|
+
minHeight: 100
|
|
245
|
+
},
|
|
246
|
+
title: {
|
|
247
|
+
fontSize: 18,
|
|
248
|
+
fontWeight: "600",
|
|
249
|
+
color: o.neutral[0],
|
|
250
|
+
textAlign: "center"
|
|
251
|
+
}
|
|
252
|
+
});
|
|
5
253
|
export {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
t as textStyles,
|
|
18
|
-
tokens
|
|
254
|
+
p as Card,
|
|
255
|
+
o as colors,
|
|
256
|
+
h as fontFamily,
|
|
257
|
+
t as fontSize,
|
|
258
|
+
n as fontWeight,
|
|
259
|
+
a as letterSpacing,
|
|
260
|
+
i as lineHeight,
|
|
261
|
+
d as semanticSpacing,
|
|
262
|
+
e as spacing,
|
|
263
|
+
m as textStyles,
|
|
264
|
+
S as tokens
|
|
19
265
|
};
|
|
20
|
-
//# sourceMappingURL=index.js.map
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "crew-recommendation-ui",
|
|
3
|
-
"version": "0.0.
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "0.0.4",
|
|
4
|
+
"description": "Simple DLS library with tokens and Card component",
|
|
5
5
|
"private": false,
|
|
6
6
|
"publishConfig": {
|
|
7
7
|
"access": "public",
|
|
@@ -13,34 +13,17 @@
|
|
|
13
13
|
"types": "./dist/index.d.ts",
|
|
14
14
|
"exports": {
|
|
15
15
|
".": {
|
|
16
|
-
"development": "./src/index.ts",
|
|
17
16
|
"types": "./dist/index.d.ts",
|
|
18
17
|
"import": "./dist/index.js",
|
|
19
18
|
"default": "./dist/index.js"
|
|
20
|
-
},
|
|
21
|
-
"./dls": {
|
|
22
|
-
"development": "./src/dls/index.ts",
|
|
23
|
-
"types": "./dist/dls/index.d.ts",
|
|
24
|
-
"import": "./dist/dls/index.js",
|
|
25
|
-
"default": "./dist/dls/index.js"
|
|
26
|
-
},
|
|
27
|
-
"./recommendation": {
|
|
28
|
-
"development": "./src/recommendation/index.ts",
|
|
29
|
-
"types": "./dist/recommendation/index.d.ts",
|
|
30
|
-
"import": "./dist/recommendation/index.js",
|
|
31
|
-
"default": "./dist/recommendation/index.js"
|
|
32
19
|
}
|
|
33
20
|
},
|
|
34
21
|
"files": [
|
|
35
|
-
"dist"
|
|
36
|
-
"src"
|
|
22
|
+
"dist"
|
|
37
23
|
],
|
|
38
24
|
"scripts": {
|
|
39
|
-
"
|
|
40
|
-
"
|
|
41
|
-
"clean": "rm -rf dist",
|
|
42
|
-
"type-check": "tsc --noEmit",
|
|
43
|
-
"lint": "eslint . --ext .ts,.tsx"
|
|
25
|
+
"build": "vite build",
|
|
26
|
+
"clean": "rm -rf dist"
|
|
44
27
|
},
|
|
45
28
|
"peerDependencies": {
|
|
46
29
|
"react": ">=17.0.0",
|
|
@@ -54,6 +37,5 @@
|
|
|
54
37
|
"typescript": "~5.7.2",
|
|
55
38
|
"vite": "^6.3.1",
|
|
56
39
|
"vite-plugin-dts": "^4.5.0"
|
|
57
|
-
}
|
|
58
|
-
"dependencies": {}
|
|
40
|
+
}
|
|
59
41
|
}
|
package/dist/Card-B-7LezA9.js
DELETED
|
@@ -1,163 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx } from "react/jsx-runtime";
|
|
2
|
-
import { StyleSheet, TouchableOpacity, View, Image, Text } from "react-native";
|
|
3
|
-
import { c as colors, s as spacing } from "./typography-zz5GzgjI.js";
|
|
4
|
-
const Card = ({
|
|
5
|
-
item,
|
|
6
|
-
onSelect,
|
|
7
|
-
onExpand,
|
|
8
|
-
isSelected = false
|
|
9
|
-
}) => {
|
|
10
|
-
var _a, _b, _c;
|
|
11
|
-
const handlePress = () => {
|
|
12
|
-
if (onExpand) {
|
|
13
|
-
onExpand(item);
|
|
14
|
-
}
|
|
15
|
-
};
|
|
16
|
-
const handleSelect = () => {
|
|
17
|
-
if (onSelect) {
|
|
18
|
-
onSelect(item);
|
|
19
|
-
}
|
|
20
|
-
};
|
|
21
|
-
const imageUrl = ((_a = item.image_signed_urls) == null ? void 0 : _a[0]) || ((_c = (_b = item.image) == null ? void 0 : _b[0]) == null ? void 0 : _c.data);
|
|
22
|
-
return /* @__PURE__ */ jsxs(
|
|
23
|
-
TouchableOpacity,
|
|
24
|
-
{
|
|
25
|
-
onPress: handlePress,
|
|
26
|
-
activeOpacity: 0.8,
|
|
27
|
-
style: [
|
|
28
|
-
styles.container,
|
|
29
|
-
isSelected && styles.containerSelected
|
|
30
|
-
],
|
|
31
|
-
children: [
|
|
32
|
-
imageUrl && /* @__PURE__ */ jsx(View, { style: styles.imageContainer, children: /* @__PURE__ */ jsx(
|
|
33
|
-
Image,
|
|
34
|
-
{
|
|
35
|
-
source: { uri: imageUrl },
|
|
36
|
-
style: styles.image,
|
|
37
|
-
resizeMode: "cover"
|
|
38
|
-
}
|
|
39
|
-
) }),
|
|
40
|
-
/* @__PURE__ */ jsxs(View, { style: styles.content, children: [
|
|
41
|
-
item.recommended && /* @__PURE__ */ jsx(View, { style: styles.recommendedBadge, children: /* @__PURE__ */ jsx(Text, { style: styles.recommendedText, children: "★ Recommended" }) }),
|
|
42
|
-
/* @__PURE__ */ jsx(Text, { style: styles.title, numberOfLines: 2, children: item.title }),
|
|
43
|
-
item.subtitle && /* @__PURE__ */ jsx(Text, { style: styles.subtitle, numberOfLines: 1, children: item.subtitle }),
|
|
44
|
-
item.tags && item.tags.length > 0 && /* @__PURE__ */ jsx(View, { style: styles.tagsContainer, children: item.tags.slice(0, 3).map((tag, index) => /* @__PURE__ */ jsx(View, { style: styles.tag, children: /* @__PURE__ */ jsx(Text, { style: styles.tagText, children: tag }) }, index)) }),
|
|
45
|
-
/* @__PURE__ */ jsxs(View, { style: styles.priceContainer, children: [
|
|
46
|
-
/* @__PURE__ */ jsx(Text, { style: styles.price, children: item.price }),
|
|
47
|
-
item.originalPrice && /* @__PURE__ */ jsx(Text, { style: styles.originalPrice, children: item.originalPrice })
|
|
48
|
-
] }),
|
|
49
|
-
/* @__PURE__ */ jsx(
|
|
50
|
-
TouchableOpacity,
|
|
51
|
-
{
|
|
52
|
-
onPress: handleSelect,
|
|
53
|
-
style: [
|
|
54
|
-
styles.selectButton,
|
|
55
|
-
isSelected && styles.selectButtonSelected
|
|
56
|
-
],
|
|
57
|
-
children: /* @__PURE__ */ jsx(Text, { style: styles.selectButtonText, children: isSelected ? "✓ Selected" : "Select" })
|
|
58
|
-
}
|
|
59
|
-
)
|
|
60
|
-
] })
|
|
61
|
-
]
|
|
62
|
-
}
|
|
63
|
-
);
|
|
64
|
-
};
|
|
65
|
-
const styles = StyleSheet.create({
|
|
66
|
-
container: {
|
|
67
|
-
backgroundColor: colors.card.background.dark,
|
|
68
|
-
borderRadius: 16,
|
|
69
|
-
overflow: "hidden",
|
|
70
|
-
borderWidth: 1,
|
|
71
|
-
borderColor: colors.card.border.dark
|
|
72
|
-
},
|
|
73
|
-
containerSelected: {
|
|
74
|
-
backgroundColor: colors.card.selected.dark,
|
|
75
|
-
borderColor: colors.primary[500]
|
|
76
|
-
},
|
|
77
|
-
imageContainer: {
|
|
78
|
-
width: "100%",
|
|
79
|
-
height: 180,
|
|
80
|
-
overflow: "hidden"
|
|
81
|
-
},
|
|
82
|
-
image: {
|
|
83
|
-
width: "100%",
|
|
84
|
-
height: "100%"
|
|
85
|
-
},
|
|
86
|
-
content: {
|
|
87
|
-
padding: spacing[4],
|
|
88
|
-
gap: spacing[2]
|
|
89
|
-
},
|
|
90
|
-
recommendedBadge: {
|
|
91
|
-
backgroundColor: colors.warning[500],
|
|
92
|
-
paddingHorizontal: spacing[2],
|
|
93
|
-
paddingVertical: spacing[1],
|
|
94
|
-
borderRadius: 4,
|
|
95
|
-
alignSelf: "flex-start"
|
|
96
|
-
},
|
|
97
|
-
recommendedText: {
|
|
98
|
-
fontSize: 12,
|
|
99
|
-
fontWeight: "600",
|
|
100
|
-
color: colors.neutral[900]
|
|
101
|
-
},
|
|
102
|
-
title: {
|
|
103
|
-
fontSize: 18,
|
|
104
|
-
fontWeight: "600",
|
|
105
|
-
color: colors.neutral[0]
|
|
106
|
-
},
|
|
107
|
-
subtitle: {
|
|
108
|
-
fontSize: 14,
|
|
109
|
-
color: colors.neutral[400]
|
|
110
|
-
},
|
|
111
|
-
tagsContainer: {
|
|
112
|
-
flexDirection: "row",
|
|
113
|
-
flexWrap: "wrap",
|
|
114
|
-
gap: spacing[1]
|
|
115
|
-
},
|
|
116
|
-
tag: {
|
|
117
|
-
backgroundColor: colors.primary[900],
|
|
118
|
-
paddingHorizontal: spacing[2],
|
|
119
|
-
paddingVertical: spacing[0.5],
|
|
120
|
-
borderRadius: 4
|
|
121
|
-
},
|
|
122
|
-
tagText: {
|
|
123
|
-
fontSize: 12,
|
|
124
|
-
color: colors.primary[300]
|
|
125
|
-
},
|
|
126
|
-
priceContainer: {
|
|
127
|
-
flexDirection: "row",
|
|
128
|
-
alignItems: "baseline",
|
|
129
|
-
gap: spacing[2],
|
|
130
|
-
marginTop: spacing[2]
|
|
131
|
-
},
|
|
132
|
-
price: {
|
|
133
|
-
fontSize: 20,
|
|
134
|
-
fontWeight: "700",
|
|
135
|
-
color: colors.neutral[0]
|
|
136
|
-
},
|
|
137
|
-
originalPrice: {
|
|
138
|
-
fontSize: 14,
|
|
139
|
-
color: colors.neutral[500],
|
|
140
|
-
textDecorationLine: "line-through"
|
|
141
|
-
},
|
|
142
|
-
selectButton: {
|
|
143
|
-
marginTop: spacing[2],
|
|
144
|
-
paddingVertical: spacing[2],
|
|
145
|
-
paddingHorizontal: spacing[4],
|
|
146
|
-
backgroundColor: colors.primary[600],
|
|
147
|
-
borderRadius: 8,
|
|
148
|
-
alignItems: "center"
|
|
149
|
-
},
|
|
150
|
-
selectButtonSelected: {
|
|
151
|
-
backgroundColor: colors.success[600]
|
|
152
|
-
},
|
|
153
|
-
selectButtonText: {
|
|
154
|
-
fontSize: 14,
|
|
155
|
-
fontWeight: "600",
|
|
156
|
-
color: colors.neutral[0]
|
|
157
|
-
}
|
|
158
|
-
});
|
|
159
|
-
Card.displayName = "RecommendationCard";
|
|
160
|
-
export {
|
|
161
|
-
Card as C
|
|
162
|
-
};
|
|
163
|
-
//# sourceMappingURL=Card-B-7LezA9.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Card-B-7LezA9.js","sources":["../src/recommendation/components/Card.tsx"],"sourcesContent":["import {\n View,\n Text,\n Image,\n TouchableOpacity,\n StyleSheet,\n} from 'react-native'\nimport { colors, spacing } from '../../dls/tokens'\nimport type { BaseRecommendationItem, RecommendationCardProps } from '../types'\n\n/**\n * Base Recommendation Card Component (React Native Web compatible)\n *\n * This is a generic card that can display any recommendation item.\n * Works on both React Native and Web via react-native-web.\n */\nexport const Card = <T extends BaseRecommendationItem>({\n item,\n onSelect,\n onExpand,\n isSelected = false,\n}: RecommendationCardProps<T>) => {\n const handlePress = () => {\n if (onExpand) {\n onExpand(item)\n }\n }\n\n const handleSelect = () => {\n if (onSelect) {\n onSelect(item)\n }\n }\n\n // Get the first image URL\n const imageUrl = item.image_signed_urls?.[0] || item.image?.[0]?.data\n\n return (\n <TouchableOpacity\n onPress={handlePress}\n activeOpacity={0.8}\n style={[\n styles.container,\n isSelected && styles.containerSelected,\n ]}\n >\n {/* Image Section */}\n {imageUrl && (\n <View style={styles.imageContainer}>\n <Image\n source={{ uri: imageUrl }}\n style={styles.image}\n resizeMode=\"cover\"\n />\n </View>\n )}\n\n {/* Content Section */}\n <View style={styles.content}>\n {/* Recommended Badge */}\n {item.recommended && (\n <View style={styles.recommendedBadge}>\n <Text style={styles.recommendedText}>★ Recommended</Text>\n </View>\n )}\n\n {/* Title */}\n <Text style={styles.title} numberOfLines={2}>\n {item.title}\n </Text>\n\n {/* Subtitle */}\n {item.subtitle && (\n <Text style={styles.subtitle} numberOfLines={1}>\n {item.subtitle}\n </Text>\n )}\n\n {/* Tags */}\n {item.tags && item.tags.length > 0 && (\n <View style={styles.tagsContainer}>\n {item.tags.slice(0, 3).map((tag, index) => (\n <View key={index} style={styles.tag}>\n <Text style={styles.tagText}>{tag}</Text>\n </View>\n ))}\n </View>\n )}\n\n {/* Price Section */}\n <View style={styles.priceContainer}>\n <Text style={styles.price}>{item.price}</Text>\n {item.originalPrice && (\n <Text style={styles.originalPrice}>{item.originalPrice}</Text>\n )}\n </View>\n\n {/* Select Button */}\n <TouchableOpacity\n onPress={handleSelect}\n style={[\n styles.selectButton,\n isSelected && styles.selectButtonSelected,\n ]}\n >\n <Text style={styles.selectButtonText}>\n {isSelected ? '✓ Selected' : 'Select'}\n </Text>\n </TouchableOpacity>\n </View>\n </TouchableOpacity>\n )\n}\n\nconst styles = StyleSheet.create({\n container: {\n backgroundColor: colors.card.background.dark,\n borderRadius: 16,\n overflow: 'hidden',\n borderWidth: 1,\n borderColor: colors.card.border.dark,\n },\n containerSelected: {\n backgroundColor: colors.card.selected.dark,\n borderColor: colors.primary[500],\n },\n imageContainer: {\n width: '100%',\n height: 180,\n overflow: 'hidden',\n },\n image: {\n width: '100%',\n height: '100%',\n },\n content: {\n padding: spacing[4],\n gap: spacing[2],\n },\n recommendedBadge: {\n backgroundColor: colors.warning[500],\n paddingHorizontal: spacing[2],\n paddingVertical: spacing[1],\n borderRadius: 4,\n alignSelf: 'flex-start',\n },\n recommendedText: {\n fontSize: 12,\n fontWeight: '600',\n color: colors.neutral[900],\n },\n title: {\n fontSize: 18,\n fontWeight: '600',\n color: colors.neutral[0],\n },\n subtitle: {\n fontSize: 14,\n color: colors.neutral[400],\n },\n tagsContainer: {\n flexDirection: 'row',\n flexWrap: 'wrap',\n gap: spacing[1],\n },\n tag: {\n backgroundColor: colors.primary[900],\n paddingHorizontal: spacing[2],\n paddingVertical: spacing[0.5],\n borderRadius: 4,\n },\n tagText: {\n fontSize: 12,\n color: colors.primary[300],\n },\n priceContainer: {\n flexDirection: 'row',\n alignItems: 'baseline',\n gap: spacing[2],\n marginTop: spacing[2],\n },\n price: {\n fontSize: 20,\n fontWeight: '700',\n color: colors.neutral[0],\n },\n originalPrice: {\n fontSize: 14,\n color: colors.neutral[500],\n textDecorationLine: 'line-through',\n },\n selectButton: {\n marginTop: spacing[2],\n paddingVertical: spacing[2],\n paddingHorizontal: spacing[4],\n backgroundColor: colors.primary[600],\n borderRadius: 8,\n alignItems: 'center',\n },\n selectButtonSelected: {\n backgroundColor: colors.success[600],\n },\n selectButtonText: {\n fontSize: 14,\n fontWeight: '600',\n color: colors.neutral[0],\n },\n})\n\nCard.displayName = 'RecommendationCard'\n\nexport default Card\n"],"names":[],"mappings":"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"}
|
package/dist/dls/index.js
DELETED
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import { t as textStyles, e as letterSpacing, l as lineHeight, d as fontWeight, b as fontSize, f as fontFamily, a as semanticSpacing, s as spacing, c as colors } from "../typography-zz5GzgjI.js";
|
|
2
|
-
const tokens = {
|
|
3
|
-
colors,
|
|
4
|
-
spacing,
|
|
5
|
-
semanticSpacing,
|
|
6
|
-
fontFamily,
|
|
7
|
-
fontSize,
|
|
8
|
-
fontWeight,
|
|
9
|
-
lineHeight,
|
|
10
|
-
letterSpacing,
|
|
11
|
-
textStyles
|
|
12
|
-
};
|
|
13
|
-
export {
|
|
14
|
-
colors,
|
|
15
|
-
fontFamily,
|
|
16
|
-
fontSize,
|
|
17
|
-
fontWeight,
|
|
18
|
-
letterSpacing,
|
|
19
|
-
lineHeight,
|
|
20
|
-
semanticSpacing,
|
|
21
|
-
spacing,
|
|
22
|
-
textStyles,
|
|
23
|
-
tokens
|
|
24
|
-
};
|
|
25
|
-
//# sourceMappingURL=index.js.map
|
package/dist/dls/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/dls/tokens/index.ts"],"sourcesContent":["/**\n * Design Language System - Tokens\n * Export all design tokens from a single entry point\n */\n\nexport * from './colors';\nexport * from './spacing';\nexport * from './typography';\n\n// Combined tokens object for convenience\nimport { colors } from './colors';\nimport { spacing, semanticSpacing } from './spacing';\nimport { fontFamily, fontSize, fontWeight, lineHeight, letterSpacing, textStyles } from './typography';\n\nexport const tokens = {\n colors,\n spacing,\n semanticSpacing,\n fontFamily,\n fontSize,\n fontWeight,\n lineHeight,\n letterSpacing,\n textStyles,\n} as const;\n\nexport type Tokens = typeof tokens;\n\n\n\n"],"names":[],"mappings":";AAcO,MAAM,SAAS;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;"}
|
package/dist/index.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["/**\n * @crew-copilot/recommendation-ui\n * \n * A shared UI library for recommendation listing components\n * that can be used across:\n * - Web (crew-website)\n * - Mobile App (crew-app via WebView or React Native)\n * - Dashboard\n * \n * This library provides:\n * 1. DLS (Design Language System) - tokens and primitives\n * 2. Recommendation cards - Hotel, Flight, Cab, etc.\n */\n\n// Export DLS (Design Language System)\nexport * from './dls';\n\n// Export Recommendation components\nexport * from './recommendation';\n\n// Version info\nexport const VERSION = '0.0.1';\n\n\n\n"],"names":[],"mappings":";;;AAqBO,MAAM,UAAU;"}
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { BaseRecommendationItem, RecommendationCardProps } from '../types';
|
|
2
|
-
/**
|
|
3
|
-
* Base Recommendation Card Component (React Native Web compatible)
|
|
4
|
-
*
|
|
5
|
-
* This is a generic card that can display any recommendation item.
|
|
6
|
-
* Works on both React Native and Web via react-native-web.
|
|
7
|
-
*/
|
|
8
|
-
export declare const Card: {
|
|
9
|
-
<T extends BaseRecommendationItem>({ item, onSelect, onExpand, isSelected, }: RecommendationCardProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
10
|
-
displayName: string;
|
|
11
|
-
};
|
|
12
|
-
export default Card;
|
|
13
|
-
//# sourceMappingURL=Card.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../../src/recommendation/components/Card.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,sBAAsB,EAAE,uBAAuB,EAAE,MAAM,UAAU,CAAA;AAE/E;;;;;GAKG;AACH,eAAO,MAAM,IAAI;KAAI,CAAC,SAAS,sBAAsB,6CAKlD,uBAAuB,CAAC,CAAC,CAAC;;CA2F5B,CAAA;AAmGD,eAAe,IAAI,CAAA"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/recommendation/components/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,IAAI,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,QAAQ,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/recommendation/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,cAAc,SAAS,CAAC;AAGxB,cAAc,cAAc,CAAC"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
|