saha-ui 1.22.9 → 1.22.11
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/Rating/Rating.colors.d.ts +32 -0
- package/dist/components/Rating/Rating.colors.d.ts.map +1 -0
- package/dist/components/Rating/Rating.colors.js +149 -0
- package/dist/components/Rating/Rating.d.ts +33 -0
- package/dist/components/Rating/Rating.d.ts.map +1 -0
- package/dist/components/Rating/Rating.icons.d.ts +32 -0
- package/dist/components/Rating/Rating.icons.d.ts.map +1 -0
- package/dist/components/Rating/Rating.icons.js +209 -0
- package/dist/components/Rating/Rating.js +245 -0
- package/dist/components/Rating/Rating.styles.d.ts +9 -3
- package/dist/components/Rating/Rating.styles.d.ts.map +1 -1
- package/dist/components/Rating/Rating.styles.js +98 -65
- package/dist/components/Rating/Rating.types.d.ts +51 -13
- package/dist/components/Rating/Rating.types.d.ts.map +1 -1
- package/dist/components/Rating/index.d.ts +4 -16
- package/dist/components/Rating/index.d.ts.map +1 -1
- package/dist/components/Rating/index.js +11 -215
- package/dist/components/Select/index.d.ts +0 -4
- package/dist/components/Select/index.d.ts.map +1 -1
- package/dist/components/Select/index.js +397 -338
- package/dist/index.d.ts +2 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +937 -929
- package/package.json +3 -3
|
@@ -0,0 +1,245 @@
|
|
|
1
|
+
import { jsxs as d, jsx as h } from "react/jsx-runtime";
|
|
2
|
+
import g, { useState as X, useRef as me, useMemo as pe } from "react";
|
|
3
|
+
import { cn as i } from "../../lib/utils.js";
|
|
4
|
+
import { getIconComponent as he } from "./Rating.icons.js";
|
|
5
|
+
import { getAllIconNames as Ae, iconCategories as Ee } from "./Rating.icons.js";
|
|
6
|
+
import { getColorScheme as ge } from "./Rating.colors.js";
|
|
7
|
+
import { colorSchemeCategories as _e, getAllColorSchemes as $e } from "./Rating.colors.js";
|
|
8
|
+
import { ratingVariants as ye, iconVariants as G } from "./Rating.styles.js";
|
|
9
|
+
const we = (l) => g.isValidElement(l), ke = (l) => typeof l == "function" || typeof l == "object" && l !== null && !("$$typeof" in l) && !g.isValidElement(l), Ce = (l, o) => {
|
|
10
|
+
if (we(l)) {
|
|
11
|
+
const s = l.props;
|
|
12
|
+
return g.cloneElement(l, {
|
|
13
|
+
className: i(s?.className, o.className),
|
|
14
|
+
style: { ...s?.style, ...o.style }
|
|
15
|
+
});
|
|
16
|
+
}
|
|
17
|
+
return ke(l) ? /* @__PURE__ */ h(l, { ...o }) : null;
|
|
18
|
+
}, Ne = g.forwardRef(
|
|
19
|
+
({
|
|
20
|
+
value: l = 0,
|
|
21
|
+
max: o = 5,
|
|
22
|
+
variant: s = "default",
|
|
23
|
+
size: y = "md",
|
|
24
|
+
icon: H = "star",
|
|
25
|
+
precision: a = "full",
|
|
26
|
+
colorScheme: D = "yellow",
|
|
27
|
+
readOnly: S = !1,
|
|
28
|
+
disabled: m = !1,
|
|
29
|
+
showValue: U = !1,
|
|
30
|
+
valueFormat: x,
|
|
31
|
+
count: A,
|
|
32
|
+
countLabel: q = "reviews",
|
|
33
|
+
color: E,
|
|
34
|
+
emptyColor: F,
|
|
35
|
+
hoverable: w = !S,
|
|
36
|
+
showTooltip: J = !1,
|
|
37
|
+
tooltipLabels: _,
|
|
38
|
+
onChange: k,
|
|
39
|
+
onHover: $,
|
|
40
|
+
allowClear: j = !0,
|
|
41
|
+
customIcon: C,
|
|
42
|
+
customEmptyIcon: B,
|
|
43
|
+
className: Q,
|
|
44
|
+
iconClassName: Y,
|
|
45
|
+
animated: P = !0,
|
|
46
|
+
highlightOnHover: Z = !1,
|
|
47
|
+
direction: v = "horizontal",
|
|
48
|
+
gap: z = "sm",
|
|
49
|
+
...O
|
|
50
|
+
}, ee) => {
|
|
51
|
+
const [p, N] = X(null), [te, L] = X(null), le = me(null), T = he(H), I = p !== null ? p : l, r = !S && !m, f = pe(() => {
|
|
52
|
+
const e = ge(D);
|
|
53
|
+
return {
|
|
54
|
+
filled: E || e.filled,
|
|
55
|
+
empty: F || e.empty,
|
|
56
|
+
glow: e.glow
|
|
57
|
+
};
|
|
58
|
+
}, [D, E, F]), ne = (e) => {
|
|
59
|
+
const t = e + 1;
|
|
60
|
+
return a === "half" ? I >= t ? "filled" : I >= t - 0.5 ? "half" : "empty" : I >= t ? "filled" : "empty";
|
|
61
|
+
}, V = (e, t) => {
|
|
62
|
+
if (a === "full")
|
|
63
|
+
return e + 1;
|
|
64
|
+
const c = t.currentTarget.getBoundingClientRect(), b = t.clientX - c.left, M = c.width / 2;
|
|
65
|
+
return b < M ? e + 0.5 : e + 1;
|
|
66
|
+
}, oe = (e, t) => {
|
|
67
|
+
if (!r) return;
|
|
68
|
+
const n = V(e, t);
|
|
69
|
+
k?.(j && n === l ? 0 : n);
|
|
70
|
+
}, re = (e, t) => {
|
|
71
|
+
if (!r || !w) return;
|
|
72
|
+
const n = V(e, t);
|
|
73
|
+
N(n), $?.(n);
|
|
74
|
+
}, se = (e, t) => {
|
|
75
|
+
if (!r || !w || a === "full") return;
|
|
76
|
+
const n = V(e, t);
|
|
77
|
+
n !== p && (N(n), $?.(n));
|
|
78
|
+
}, ae = () => {
|
|
79
|
+
r && N(null);
|
|
80
|
+
}, ce = (e) => {
|
|
81
|
+
if (!r) return;
|
|
82
|
+
let t = l;
|
|
83
|
+
switch (e.key) {
|
|
84
|
+
case "ArrowRight":
|
|
85
|
+
case "ArrowUp":
|
|
86
|
+
e.preventDefault(), t = Math.min(o, l + (a === "half" ? 0.5 : 1));
|
|
87
|
+
break;
|
|
88
|
+
case "ArrowLeft":
|
|
89
|
+
case "ArrowDown":
|
|
90
|
+
e.preventDefault(), t = Math.max(0, l - (a === "half" ? 0.5 : 1));
|
|
91
|
+
break;
|
|
92
|
+
case "Home":
|
|
93
|
+
e.preventDefault(), t = a === "half" ? 0.5 : 1;
|
|
94
|
+
break;
|
|
95
|
+
case "End":
|
|
96
|
+
e.preventDefault(), t = o;
|
|
97
|
+
break;
|
|
98
|
+
case "0":
|
|
99
|
+
case "Backspace":
|
|
100
|
+
case "Delete":
|
|
101
|
+
j && (e.preventDefault(), t = 0);
|
|
102
|
+
break;
|
|
103
|
+
default: {
|
|
104
|
+
const n = parseInt(e.key);
|
|
105
|
+
!isNaN(n) && n >= 0 && n <= o && (e.preventDefault(), t = n);
|
|
106
|
+
break;
|
|
107
|
+
}
|
|
108
|
+
}
|
|
109
|
+
t !== l && k?.(t);
|
|
110
|
+
}, ie = (e) => {
|
|
111
|
+
const t = e === "filled" || e === "half";
|
|
112
|
+
return i(
|
|
113
|
+
G({
|
|
114
|
+
variant: s,
|
|
115
|
+
size: y,
|
|
116
|
+
state: e,
|
|
117
|
+
interactive: r && w
|
|
118
|
+
}),
|
|
119
|
+
t && "fill-current",
|
|
120
|
+
m && "opacity-50 cursor-not-allowed",
|
|
121
|
+
P && "transition-all duration-200",
|
|
122
|
+
Z && p !== null && "filter brightness-110",
|
|
123
|
+
s === "neon" && t && "drop-shadow-[0_0_10px_currentColor]",
|
|
124
|
+
Y
|
|
125
|
+
);
|
|
126
|
+
}, fe = (e) => {
|
|
127
|
+
const t = e === "filled" || e === "half", n = f.filled.includes("gradient");
|
|
128
|
+
return {
|
|
129
|
+
color: t ? n ? void 0 : f.filled : f.empty,
|
|
130
|
+
...n && t && {
|
|
131
|
+
background: f.filled,
|
|
132
|
+
WebkitBackgroundClip: "text",
|
|
133
|
+
WebkitTextFillColor: "transparent",
|
|
134
|
+
backgroundClip: "text"
|
|
135
|
+
},
|
|
136
|
+
...e === "half" && {
|
|
137
|
+
clipPath: "polygon(0 0, 50% 0, 50% 100%, 0 100%)"
|
|
138
|
+
}
|
|
139
|
+
};
|
|
140
|
+
}, ue = (e) => {
|
|
141
|
+
const t = ne(e), n = t === "filled" || t === "half", c = e + 1, b = ie(t), M = fe(t), W = {
|
|
142
|
+
className: b,
|
|
143
|
+
style: M
|
|
144
|
+
};
|
|
145
|
+
let R;
|
|
146
|
+
const K = n ? C || B : B || C;
|
|
147
|
+
return K ? R = Ce(K, W) : R = /* @__PURE__ */ h(T, { ...W }), /* @__PURE__ */ d(
|
|
148
|
+
"span",
|
|
149
|
+
{
|
|
150
|
+
role: "radio",
|
|
151
|
+
"aria-checked": l >= c,
|
|
152
|
+
"aria-label": _?.[e] || `${c} ${c === 1 ? "star" : "stars"}`,
|
|
153
|
+
tabIndex: r ? te === e ? 0 : -1 : void 0,
|
|
154
|
+
className: i(
|
|
155
|
+
"relative inline-flex items-center justify-center",
|
|
156
|
+
r && "cursor-pointer",
|
|
157
|
+
m && "cursor-not-allowed"
|
|
158
|
+
),
|
|
159
|
+
onClick: (u) => oe(e, u),
|
|
160
|
+
onMouseEnter: (u) => re(e, u),
|
|
161
|
+
onMouseMove: (u) => se(e, u),
|
|
162
|
+
onFocus: () => L(e),
|
|
163
|
+
onBlur: () => L(null),
|
|
164
|
+
title: J ? _?.[e] : void 0,
|
|
165
|
+
children: [
|
|
166
|
+
R,
|
|
167
|
+
t === "half" && !C && /* @__PURE__ */ h(
|
|
168
|
+
T,
|
|
169
|
+
{
|
|
170
|
+
className: i(
|
|
171
|
+
G({
|
|
172
|
+
variant: s,
|
|
173
|
+
size: y,
|
|
174
|
+
state: "filled",
|
|
175
|
+
interactive: !1
|
|
176
|
+
}),
|
|
177
|
+
"fill-current absolute top-0 left-0 pointer-events-none",
|
|
178
|
+
P && "transition-all duration-200"
|
|
179
|
+
),
|
|
180
|
+
style: {
|
|
181
|
+
color: f.filled,
|
|
182
|
+
clipPath: "polygon(0 0, 50% 0, 50% 100%, 0 100%)"
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
)
|
|
186
|
+
]
|
|
187
|
+
},
|
|
188
|
+
e
|
|
189
|
+
);
|
|
190
|
+
}, de = x ? x(l, o) : `${l.toFixed(a === "half" ? 1 : 0)}`;
|
|
191
|
+
return /* @__PURE__ */ d(
|
|
192
|
+
"div",
|
|
193
|
+
{
|
|
194
|
+
ref: ee,
|
|
195
|
+
className: i(
|
|
196
|
+
"inline-flex items-center gap-2",
|
|
197
|
+
v === "vertical" && "flex-col",
|
|
198
|
+
m && "opacity-50 cursor-not-allowed",
|
|
199
|
+
Q
|
|
200
|
+
),
|
|
201
|
+
...O,
|
|
202
|
+
children: [
|
|
203
|
+
/* @__PURE__ */ h(
|
|
204
|
+
"div",
|
|
205
|
+
{
|
|
206
|
+
ref: le,
|
|
207
|
+
role: "radiogroup",
|
|
208
|
+
"aria-label": "Rating",
|
|
209
|
+
"aria-valuenow": l,
|
|
210
|
+
"aria-valuemin": 0,
|
|
211
|
+
"aria-valuemax": o,
|
|
212
|
+
className: i(ye({ variant: s, size: y, direction: v, gap: z })),
|
|
213
|
+
onMouseLeave: ae,
|
|
214
|
+
onKeyDown: ce,
|
|
215
|
+
tabIndex: r ? 0 : void 0,
|
|
216
|
+
children: Array.from({ length: o }, (e, t) => ue(t))
|
|
217
|
+
}
|
|
218
|
+
),
|
|
219
|
+
U && /* @__PURE__ */ d("span", { className: "text-sm font-medium text-foreground", children: [
|
|
220
|
+
de,
|
|
221
|
+
o !== 5 && /* @__PURE__ */ d("span", { className: "text-muted-foreground", children: [
|
|
222
|
+
"/",
|
|
223
|
+
o
|
|
224
|
+
] })
|
|
225
|
+
] }),
|
|
226
|
+
A !== void 0 && /* @__PURE__ */ d("span", { className: "text-sm text-muted-foreground", children: [
|
|
227
|
+
"(",
|
|
228
|
+
A.toLocaleString(),
|
|
229
|
+
" ",
|
|
230
|
+
q,
|
|
231
|
+
")"
|
|
232
|
+
] })
|
|
233
|
+
]
|
|
234
|
+
}
|
|
235
|
+
);
|
|
236
|
+
}
|
|
237
|
+
);
|
|
238
|
+
Ne.displayName = "Rating";
|
|
239
|
+
export {
|
|
240
|
+
_e as colorSchemeCategories,
|
|
241
|
+
Ne as default,
|
|
242
|
+
$e as getAllColorSchemes,
|
|
243
|
+
Ae as getAllIconNames,
|
|
244
|
+
Ee as iconCategories
|
|
245
|
+
};
|
|
@@ -1,18 +1,24 @@
|
|
|
1
1
|
/**
|
|
2
|
-
* Rating variants
|
|
2
|
+
* Rating container variants
|
|
3
3
|
*/
|
|
4
4
|
declare const ratingVariants: (props?: ({
|
|
5
|
-
variant?: "primary" | "secondary" | "default" | "glass" | "gradient" | "outline" | null | undefined;
|
|
5
|
+
variant?: "primary" | "secondary" | "default" | "glass" | "gradient" | "outline" | "soft" | "neon" | null | undefined;
|
|
6
6
|
size?: "sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "3xl" | "4xl" | null | undefined;
|
|
7
|
+
direction?: "horizontal" | "vertical" | null | undefined;
|
|
8
|
+
gap?: "none" | "sm" | "md" | "lg" | "xs" | "xl" | null | undefined;
|
|
7
9
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
8
10
|
/**
|
|
9
11
|
* Icon variants for different rating states
|
|
10
12
|
*/
|
|
11
13
|
declare const iconVariants: (props?: ({
|
|
12
|
-
variant?: "primary" | "secondary" | "default" | "glass" | "gradient" | "outline" | null | undefined;
|
|
14
|
+
variant?: "primary" | "secondary" | "default" | "glass" | "gradient" | "outline" | "soft" | "neon" | null | undefined;
|
|
13
15
|
size?: "sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "3xl" | "4xl" | null | undefined;
|
|
14
16
|
state?: "filled" | "half" | "empty" | null | undefined;
|
|
15
17
|
interactive?: boolean | null | undefined;
|
|
16
18
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
19
|
+
/**
|
|
20
|
+
* Size to pixel mapping for custom icons
|
|
21
|
+
*/
|
|
22
|
+
export declare const sizeMap: Record<string, number>;
|
|
17
23
|
export { ratingVariants, iconVariants };
|
|
18
24
|
//# sourceMappingURL=Rating.styles.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Rating.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/Rating.styles.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Rating.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/Rating.styles.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,QAAA,MAAM,cAAc;;;;;8EAyClB,CAAC;AAEH;;GAEG;AACH,QAAA,MAAM,YAAY;;;;;8EAkDhB,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAS1C,CAAC;AAEF,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,CAAC"}
|
|
@@ -1,74 +1,107 @@
|
|
|
1
1
|
import { cva as t } from "class-variance-authority";
|
|
2
|
-
const e = t(
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
outline: ""
|
|
14
|
-
},
|
|
15
|
-
size: {
|
|
16
|
-
xs: "text-xs gap-0.5",
|
|
17
|
-
sm: "text-sm gap-0.5",
|
|
18
|
-
md: "text-base gap-1",
|
|
19
|
-
lg: "text-xl gap-1.5",
|
|
20
|
-
xl: "text-2xl gap-2",
|
|
21
|
-
"2xl": "text-3xl gap-2.5",
|
|
22
|
-
"3xl": "text-4xl gap-3",
|
|
23
|
-
"4xl": "text-5xl gap-4"
|
|
24
|
-
}
|
|
2
|
+
const e = t("inline-flex items-center", {
|
|
3
|
+
variants: {
|
|
4
|
+
variant: {
|
|
5
|
+
default: "",
|
|
6
|
+
primary: "",
|
|
7
|
+
secondary: "",
|
|
8
|
+
gradient: "",
|
|
9
|
+
glass: "bg-white/10 backdrop-blur-sm rounded-lg p-2",
|
|
10
|
+
outline: "",
|
|
11
|
+
neon: "",
|
|
12
|
+
soft: "bg-muted/50 rounded-lg p-2"
|
|
25
13
|
},
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
14
|
+
size: {
|
|
15
|
+
xs: "text-xs",
|
|
16
|
+
sm: "text-sm",
|
|
17
|
+
md: "text-base",
|
|
18
|
+
lg: "text-xl",
|
|
19
|
+
xl: "text-2xl",
|
|
20
|
+
"2xl": "text-3xl",
|
|
21
|
+
"3xl": "text-4xl",
|
|
22
|
+
"4xl": "text-5xl"
|
|
23
|
+
},
|
|
24
|
+
direction: {
|
|
25
|
+
horizontal: "flex-row",
|
|
26
|
+
vertical: "flex-col"
|
|
27
|
+
},
|
|
28
|
+
gap: {
|
|
29
|
+
none: "gap-0",
|
|
30
|
+
xs: "gap-0.5",
|
|
31
|
+
sm: "gap-1",
|
|
32
|
+
md: "gap-1.5",
|
|
33
|
+
lg: "gap-2",
|
|
34
|
+
xl: "gap-3"
|
|
29
35
|
}
|
|
36
|
+
},
|
|
37
|
+
defaultVariants: {
|
|
38
|
+
variant: "default",
|
|
39
|
+
size: "md",
|
|
40
|
+
direction: "horizontal",
|
|
41
|
+
gap: "sm"
|
|
30
42
|
}
|
|
31
|
-
),
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
},
|
|
58
|
-
interactive: {
|
|
59
|
-
true: "hover:scale-125 hover:rotate-[10deg] active:scale-95 active:rotate-0",
|
|
60
|
-
false: ""
|
|
61
|
-
}
|
|
43
|
+
}), s = t("transition-all duration-300 select-none relative", {
|
|
44
|
+
variants: {
|
|
45
|
+
variant: {
|
|
46
|
+
default: "drop-shadow-sm",
|
|
47
|
+
primary: "drop-shadow-sm",
|
|
48
|
+
secondary: "drop-shadow-sm",
|
|
49
|
+
gradient: "drop-shadow-md",
|
|
50
|
+
glass: "drop-shadow-lg",
|
|
51
|
+
outline: "",
|
|
52
|
+
neon: "",
|
|
53
|
+
soft: ""
|
|
54
|
+
},
|
|
55
|
+
size: {
|
|
56
|
+
xs: "w-3 h-3",
|
|
57
|
+
sm: "w-4 h-4",
|
|
58
|
+
md: "w-5 h-5",
|
|
59
|
+
lg: "w-6 h-6",
|
|
60
|
+
xl: "w-8 h-8",
|
|
61
|
+
"2xl": "w-10 h-10",
|
|
62
|
+
"3xl": "w-12 h-12",
|
|
63
|
+
"4xl": "w-16 h-16"
|
|
64
|
+
},
|
|
65
|
+
state: {
|
|
66
|
+
empty: "",
|
|
67
|
+
filled: "",
|
|
68
|
+
half: ""
|
|
62
69
|
},
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
state: "empty",
|
|
67
|
-
interactive: !1
|
|
70
|
+
interactive: {
|
|
71
|
+
true: "cursor-pointer hover:scale-110 active:scale-95",
|
|
72
|
+
false: ""
|
|
68
73
|
}
|
|
74
|
+
},
|
|
75
|
+
compoundVariants: [
|
|
76
|
+
{
|
|
77
|
+
variant: "neon",
|
|
78
|
+
state: "filled",
|
|
79
|
+
className: "filter brightness-110"
|
|
80
|
+
},
|
|
81
|
+
{
|
|
82
|
+
variant: "gradient",
|
|
83
|
+
state: "filled",
|
|
84
|
+
className: "filter brightness-110"
|
|
85
|
+
}
|
|
86
|
+
],
|
|
87
|
+
defaultVariants: {
|
|
88
|
+
variant: "default",
|
|
89
|
+
size: "md",
|
|
90
|
+
state: "empty",
|
|
91
|
+
interactive: !1
|
|
69
92
|
}
|
|
70
|
-
)
|
|
93
|
+
}), l = {
|
|
94
|
+
xs: 12,
|
|
95
|
+
sm: 16,
|
|
96
|
+
md: 20,
|
|
97
|
+
lg: 24,
|
|
98
|
+
xl: 32,
|
|
99
|
+
"2xl": 40,
|
|
100
|
+
"3xl": 48,
|
|
101
|
+
"4xl": 64
|
|
102
|
+
};
|
|
71
103
|
export {
|
|
72
|
-
|
|
73
|
-
e as ratingVariants
|
|
104
|
+
s as iconVariants,
|
|
105
|
+
e as ratingVariants,
|
|
106
|
+
l as sizeMap
|
|
74
107
|
};
|
|
@@ -1,23 +1,39 @@
|
|
|
1
|
+
import { LucideIcon } from 'lucide-react';
|
|
1
2
|
/**
|
|
2
3
|
* Rating variant types
|
|
3
|
-
* Determines the visual style of the rating component
|
|
4
4
|
*/
|
|
5
|
-
export type RatingVariant = "default" | "primary" | "secondary" | "gradient" | "glass" | "outline";
|
|
5
|
+
export type RatingVariant = "default" | "primary" | "secondary" | "gradient" | "glass" | "outline" | "neon" | "soft";
|
|
6
6
|
/**
|
|
7
7
|
* Rating size types
|
|
8
|
-
* Controls the dimensions of the stars
|
|
9
8
|
*/
|
|
10
9
|
export type RatingSize = "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl";
|
|
11
10
|
/**
|
|
12
|
-
*
|
|
13
|
-
* Defines which icon to use for rating display
|
|
11
|
+
* Built-in icon types - 80+ icons
|
|
14
12
|
*/
|
|
15
|
-
export type RatingIcon = "star" | "heart" | "circle" | "diamond";
|
|
13
|
+
export type RatingIcon = "star" | "heart" | "circle" | "square" | "diamond" | "triangle" | "hexagon" | "octagon" | "pentagon" | "smile" | "frown" | "meh" | "laugh" | "angry" | "thumbsUp" | "thumbsDown" | "sun" | "moon" | "cloud" | "snowflake" | "droplet" | "flame" | "leaf" | "flower" | "tree" | "award" | "trophy" | "medal" | "crown" | "gem" | "badge" | "ribbon" | "zap" | "bolt" | "sparkle" | "sparkles" | "rocket" | "target" | "coffee" | "pizza" | "cake" | "cookie" | "apple" | "cherry" | "iceCream" | "beer" | "wine" | "cat" | "dog" | "bird" | "fish" | "bug" | "rabbit" | "pawPrint" | "music" | "headphones" | "gamepad" | "dice" | "puzzle" | "palette" | "messageCircle" | "bell" | "mail" | "send" | "gift" | "bookmark" | "flag" | "key" | "lock" | "lightbulb" | "umbrella" | "glasses" | "watch" | "compass" | "check" | "checkCircle" | "x" | "xCircle" | "alertCircle" | "info" | "help" | "ghost" | "skull" | "anchor" | "plane" | "car" | "home" | "building" | "mountain" | "waves" | "infinity" | "percent" | "dollarSign" | "euro" | "bitcoin";
|
|
14
|
+
/**
|
|
15
|
+
* Predefined color schemes - 25+ options
|
|
16
|
+
*/
|
|
17
|
+
export type RatingColorScheme = "yellow" | "amber" | "orange" | "red" | "rose" | "pink" | "fuchsia" | "purple" | "violet" | "indigo" | "blue" | "sky" | "cyan" | "teal" | "green" | "emerald" | "lime" | "slate" | "gray" | "zinc" | "neutral" | "stone" | "gold" | "bronze" | "silver" | "rainbow";
|
|
16
18
|
/**
|
|
17
19
|
* Rating precision types
|
|
18
|
-
* Controls how ratings can be selected
|
|
19
20
|
*/
|
|
20
21
|
export type RatingPrecision = "full" | "half";
|
|
22
|
+
/**
|
|
23
|
+
* Icon props interface
|
|
24
|
+
*/
|
|
25
|
+
export interface IconProps {
|
|
26
|
+
className?: string;
|
|
27
|
+
style?: React.CSSProperties;
|
|
28
|
+
size?: number | string;
|
|
29
|
+
}
|
|
30
|
+
/**
|
|
31
|
+
* Custom icon type - supports various icon libraries
|
|
32
|
+
* Can be:
|
|
33
|
+
* - A React component (Lucide, custom SVG component)
|
|
34
|
+
* - A rendered React element (Iconify, emoji span, etc.)
|
|
35
|
+
*/
|
|
36
|
+
export type CustomIconComponent = LucideIcon | React.ComponentType<IconProps> | React.ReactElement<IconProps>;
|
|
21
37
|
/**
|
|
22
38
|
* Rating component props
|
|
23
39
|
*/
|
|
@@ -43,7 +59,7 @@ export interface RatingProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
|
|
|
43
59
|
*/
|
|
44
60
|
size?: RatingSize;
|
|
45
61
|
/**
|
|
46
|
-
*
|
|
62
|
+
* Built-in icon type to display (80+ options)
|
|
47
63
|
* @default "star"
|
|
48
64
|
*/
|
|
49
65
|
icon?: RatingIcon;
|
|
@@ -52,6 +68,11 @@ export interface RatingProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
|
|
|
52
68
|
* @default "full"
|
|
53
69
|
*/
|
|
54
70
|
precision?: RatingPrecision;
|
|
71
|
+
/**
|
|
72
|
+
* Predefined color scheme (25+ options)
|
|
73
|
+
* @default "yellow"
|
|
74
|
+
*/
|
|
75
|
+
colorScheme?: RatingColorScheme;
|
|
55
76
|
/**
|
|
56
77
|
* Whether the rating is read-only
|
|
57
78
|
* @default false
|
|
@@ -81,11 +102,13 @@ export interface RatingProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
|
|
|
81
102
|
*/
|
|
82
103
|
countLabel?: string;
|
|
83
104
|
/**
|
|
84
|
-
*
|
|
105
|
+
* Custom filled color (overrides colorScheme)
|
|
106
|
+
* Accepts any valid CSS color: hex, rgb, hsl, named colors
|
|
85
107
|
*/
|
|
86
108
|
color?: string;
|
|
87
109
|
/**
|
|
88
|
-
*
|
|
110
|
+
* Custom empty color (overrides colorScheme)
|
|
111
|
+
* Accepts any valid CSS color: hex, rgb, hsl, named colors
|
|
89
112
|
*/
|
|
90
113
|
emptyColor?: string;
|
|
91
114
|
/**
|
|
@@ -115,13 +138,13 @@ export interface RatingProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
|
|
|
115
138
|
*/
|
|
116
139
|
allowClear?: boolean;
|
|
117
140
|
/**
|
|
118
|
-
* Custom icon component
|
|
141
|
+
* Custom icon component (Lucide, Iconify, or any React component)
|
|
119
142
|
*/
|
|
120
|
-
customIcon?:
|
|
143
|
+
customIcon?: CustomIconComponent;
|
|
121
144
|
/**
|
|
122
145
|
* Custom empty icon component
|
|
123
146
|
*/
|
|
124
|
-
customEmptyIcon?:
|
|
147
|
+
customEmptyIcon?: CustomIconComponent;
|
|
125
148
|
/**
|
|
126
149
|
* Additional class names for the container
|
|
127
150
|
*/
|
|
@@ -135,5 +158,20 @@ export interface RatingProps extends Omit<React.HTMLAttributes<HTMLDivElement>,
|
|
|
135
158
|
* @default true
|
|
136
159
|
*/
|
|
137
160
|
animated?: boolean;
|
|
161
|
+
/**
|
|
162
|
+
* Highlight effect on hover
|
|
163
|
+
* @default false
|
|
164
|
+
*/
|
|
165
|
+
highlightOnHover?: boolean;
|
|
166
|
+
/**
|
|
167
|
+
* Direction of the rating
|
|
168
|
+
* @default "horizontal"
|
|
169
|
+
*/
|
|
170
|
+
direction?: "horizontal" | "vertical";
|
|
171
|
+
/**
|
|
172
|
+
* Gap between icons
|
|
173
|
+
* @default "sm"
|
|
174
|
+
*/
|
|
175
|
+
gap?: "none" | "xs" | "sm" | "md" | "lg" | "xl";
|
|
138
176
|
}
|
|
139
177
|
//# sourceMappingURL=Rating.types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Rating.types.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/Rating.types.ts"],"names":[],"mappings":"AAAA
|
|
1
|
+
{"version":3,"file":"Rating.types.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/Rating.types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,17 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
*
|
|
6
|
-
* A flexible rating component with support for different icons, variants, and interactions.
|
|
7
|
-
*
|
|
8
|
-
* @example
|
|
9
|
-
* ```tsx
|
|
10
|
-
* <Rating value={4} max={5} />
|
|
11
|
-
* <Rating value={3.5} precision="half" showValue />
|
|
12
|
-
* <Rating value={4} variant="gradient" size="lg" icon="heart" />
|
|
13
|
-
* ```
|
|
14
|
-
*/
|
|
15
|
-
declare const Rating: React.ForwardRefExoticComponent<RatingProps & React.RefAttributes<HTMLDivElement>>;
|
|
16
|
-
export default Rating;
|
|
1
|
+
export { default as Rating } from './Rating';
|
|
2
|
+
export type { RatingProps, RatingVariant, RatingSize, RatingIcon, RatingColorScheme, RatingPrecision, CustomIconComponent, } from './Rating.types';
|
|
3
|
+
export { getAllIconNames, iconCategories, iconMap } from './Rating.icons';
|
|
4
|
+
export { getAllColorSchemes, colorSchemeCategories, colorSchemes, getColorScheme, } from './Rating.colors';
|
|
17
5
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/index.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,YAAY,EACV,WAAW,EACX,aAAa,EACb,UAAU,EACV,UAAU,EACV,iBAAiB,EACjB,eAAe,EACf,mBAAmB,GACpB,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,eAAe,EAAE,cAAc,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AAC1E,OAAO,EACL,kBAAkB,EAClB,qBAAqB,EACrB,YAAY,EACZ,cAAc,GACf,MAAM,iBAAiB,CAAC"}
|