@loopr-ai/craft 0.2.0 → 0.3.0
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/ButtonBase-750a4103.js +832 -0
- package/dist/{TransitionGroupContext-ee5b34c9.js → TransitionGroupContext-e16207d6.js} +47 -52
- package/dist/chainPropTypes-004bf492.js +8 -0
- package/dist/components/cell/AvatarGroup/index.d.ts +31 -0
- package/dist/components/cell/AvatarGroup/index.js +390 -0
- package/dist/components/cell/Button/index.js +207 -1033
- package/dist/components/cell/Chip/index.d.ts +27 -0
- package/dist/components/cell/Chip/index.js +483 -0
- package/dist/components/cell/ProgressBar/index.js +4 -3
- package/dist/components/cell/Search/index.js +5743 -5924
- package/dist/components/cell/Typography/index.js +2 -2
- package/dist/createSvgIcon-5dcb7caa.js +184 -0
- package/dist/{createTheme-eb26b87a.js → createTheme-95c30431.js} +2 -2
- package/dist/{exactProp-0925aa6f.js → exactProp-a28c53c1.js} +1 -1
- package/dist/global/theme.js +1 -1
- package/dist/main.d.ts +3 -1
- package/dist/main.js +14 -10
- package/dist/providers/CraftThemeProvider.d.ts +3 -3
- package/dist/providers/CraftThemeProvider.js +60 -53
- package/dist/{styled-b8bfdd6b.js → styled-05df7dc6.js} +1 -1
- package/dist/unsupportedProp-3dbf01f6.js +9 -0
- package/dist/{useTheme-a9e2b32c.js → useTheme-462e5dc6.js} +1 -1
- package/package.json +1 -1
|
@@ -1,52 +1,48 @@
|
|
|
1
|
-
import { P as i } from "./createTheme-
|
|
2
|
-
import
|
|
3
|
-
import
|
|
4
|
-
|
|
5
|
-
return process.env.NODE_ENV === "production" ? () => null : function(...r) {
|
|
6
|
-
return e(...r) || t(...r);
|
|
7
|
-
};
|
|
8
|
-
}
|
|
1
|
+
import { P as i } from "./createTheme-95c30431.js";
|
|
2
|
+
import { c as m } from "./chainPropTypes-004bf492.js";
|
|
3
|
+
import * as o from "react";
|
|
4
|
+
import h from "react";
|
|
9
5
|
function b(e) {
|
|
10
6
|
const {
|
|
11
7
|
prototype: t = {}
|
|
12
8
|
} = e;
|
|
13
9
|
return !!t.isReactComponent;
|
|
14
10
|
}
|
|
15
|
-
function
|
|
16
|
-
const
|
|
17
|
-
if (
|
|
11
|
+
function w(e, t, n, u, r) {
|
|
12
|
+
const c = e[t], y = r || t;
|
|
13
|
+
if (c == null || // When server-side rendering React doesn't warn either.
|
|
18
14
|
// This is not an accurate check for SSR.
|
|
19
15
|
// This is only in place for emotion compat.
|
|
20
16
|
// TODO: Revisit once https://github.com/facebook/react/issues/20047 is resolved.
|
|
21
17
|
typeof window > "u")
|
|
22
18
|
return null;
|
|
23
19
|
let a;
|
|
24
|
-
return typeof
|
|
20
|
+
return typeof c == "function" && !b(c) && (a = "Did you accidentally provide a plain function component instead?"), a !== void 0 ? new Error(`Invalid ${u} \`${y}\` supplied to \`${n}\`. Expected an element type that can hold a ref. ${a} For more information see https://mui.com/r/caveat-with-refs-guide`) : null;
|
|
25
21
|
}
|
|
26
|
-
const
|
|
22
|
+
const C = m(i.elementType, w), E = i.oneOfType([i.func, i.object]), K = E;
|
|
27
23
|
function T(e, t) {
|
|
28
24
|
typeof e == "function" ? e(t) : e && (e.current = t);
|
|
29
25
|
}
|
|
30
|
-
const
|
|
31
|
-
function
|
|
32
|
-
const t =
|
|
33
|
-
return
|
|
26
|
+
const R = typeof window < "u" ? o.useLayoutEffect : o.useEffect, v = R;
|
|
27
|
+
function x(e) {
|
|
28
|
+
const t = o.useRef(e);
|
|
29
|
+
return v(() => {
|
|
34
30
|
t.current = e;
|
|
35
|
-
}),
|
|
31
|
+
}), o.useCallback((...n) => (
|
|
36
32
|
// @ts-expect-error hide `this`
|
|
37
33
|
// tslint:disable-next-line:ban-comma-operator
|
|
38
34
|
(0, t.current)(...n)
|
|
39
35
|
), []);
|
|
40
36
|
}
|
|
41
|
-
function
|
|
42
|
-
return
|
|
37
|
+
function j(...e) {
|
|
38
|
+
return o.useMemo(() => e.every((t) => t == null) ? null : (t) => {
|
|
43
39
|
e.forEach((n) => {
|
|
44
40
|
T(n, t);
|
|
45
41
|
});
|
|
46
42
|
}, e);
|
|
47
43
|
}
|
|
48
|
-
let
|
|
49
|
-
const
|
|
44
|
+
let s = !0, l = !1, d;
|
|
45
|
+
const g = {
|
|
50
46
|
text: !0,
|
|
51
47
|
search: !0,
|
|
52
48
|
url: !0,
|
|
@@ -61,26 +57,26 @@ const O = {
|
|
|
61
57
|
datetime: !0,
|
|
62
58
|
"datetime-local": !0
|
|
63
59
|
};
|
|
64
|
-
function
|
|
60
|
+
function O(e) {
|
|
65
61
|
const {
|
|
66
62
|
type: t,
|
|
67
63
|
tagName: n
|
|
68
64
|
} = e;
|
|
69
|
-
return !!(n === "INPUT" &&
|
|
65
|
+
return !!(n === "INPUT" && g[t] && !e.readOnly || n === "TEXTAREA" && !e.readOnly || e.isContentEditable);
|
|
70
66
|
}
|
|
71
67
|
function P(e) {
|
|
72
|
-
e.metaKey || e.altKey || e.ctrlKey || (
|
|
68
|
+
e.metaKey || e.altKey || e.ctrlKey || (s = !0);
|
|
73
69
|
}
|
|
74
70
|
function f() {
|
|
75
|
-
|
|
71
|
+
s = !1;
|
|
76
72
|
}
|
|
77
|
-
function
|
|
78
|
-
this.visibilityState === "hidden" && l && (
|
|
79
|
-
}
|
|
80
|
-
function g(e) {
|
|
81
|
-
e.addEventListener("keydown", P, !0), e.addEventListener("mousedown", f, !0), e.addEventListener("pointerdown", f, !0), e.addEventListener("touchstart", f, !0), e.addEventListener("visibilitychange", V, !0);
|
|
73
|
+
function _() {
|
|
74
|
+
this.visibilityState === "hidden" && l && (s = !0);
|
|
82
75
|
}
|
|
83
76
|
function F(e) {
|
|
77
|
+
e.addEventListener("keydown", P, !0), e.addEventListener("mousedown", f, !0), e.addEventListener("pointerdown", f, !0), e.addEventListener("touchstart", f, !0), e.addEventListener("visibilitychange", _, !0);
|
|
78
|
+
}
|
|
79
|
+
function V(e) {
|
|
84
80
|
const {
|
|
85
81
|
target: t
|
|
86
82
|
} = e;
|
|
@@ -88,45 +84,44 @@ function F(e) {
|
|
|
88
84
|
return t.matches(":focus-visible");
|
|
89
85
|
} catch {
|
|
90
86
|
}
|
|
91
|
-
return
|
|
87
|
+
return s || O(t);
|
|
92
88
|
}
|
|
93
|
-
function
|
|
94
|
-
const e =
|
|
95
|
-
|
|
96
|
-
}, []), t =
|
|
89
|
+
function A() {
|
|
90
|
+
const e = o.useCallback((r) => {
|
|
91
|
+
r != null && F(r.ownerDocument);
|
|
92
|
+
}, []), t = o.useRef(!1);
|
|
97
93
|
function n() {
|
|
98
94
|
return t.current ? (l = !0, window.clearTimeout(d), d = window.setTimeout(() => {
|
|
99
95
|
l = !1;
|
|
100
96
|
}, 100), t.current = !1, !0) : !1;
|
|
101
97
|
}
|
|
102
|
-
function r
|
|
103
|
-
return
|
|
98
|
+
function u(r) {
|
|
99
|
+
return V(r) ? (t.current = !0, !0) : !1;
|
|
104
100
|
}
|
|
105
101
|
return {
|
|
106
102
|
isFocusVisibleRef: t,
|
|
107
|
-
onFocus:
|
|
103
|
+
onFocus: u,
|
|
108
104
|
onBlur: n,
|
|
109
105
|
ref: e
|
|
110
106
|
};
|
|
111
107
|
}
|
|
112
108
|
function p(e, t) {
|
|
113
|
-
return p = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(
|
|
114
|
-
return
|
|
109
|
+
return p = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function(u, r) {
|
|
110
|
+
return u.__proto__ = r, u;
|
|
115
111
|
}, p(e, t);
|
|
116
112
|
}
|
|
117
|
-
function
|
|
113
|
+
function D(e, t) {
|
|
118
114
|
e.prototype = Object.create(t.prototype), e.prototype.constructor = e, p(e, t);
|
|
119
115
|
}
|
|
120
|
-
const
|
|
116
|
+
const B = h.createContext(null);
|
|
121
117
|
export {
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
C as r,
|
|
118
|
+
B as T,
|
|
119
|
+
D as _,
|
|
120
|
+
A as a,
|
|
121
|
+
x as b,
|
|
122
|
+
v as c,
|
|
123
|
+
C as e,
|
|
124
|
+
K as r,
|
|
130
125
|
T as s,
|
|
131
|
-
|
|
126
|
+
j as u
|
|
132
127
|
};
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
/** @jsxImportSource react */
|
|
2
|
+
import { SxProps } from "@mui/material";
|
|
3
|
+
import { AvatarGroupProps as MUIAvatarGroupProps } from "@mui/material/AvatarGroup";
|
|
4
|
+
import { AvatarProps as MUIAvatarProps } from "@mui/material/Avatar";
|
|
5
|
+
import { CraftFC } from "../../../global/interfaces";
|
|
6
|
+
/**
|
|
7
|
+
* This AvatarGroupProps Interface extend MUIAvatarGroupProps Interface
|
|
8
|
+
* @param {number} max - number
|
|
9
|
+
* @param {number} spacing - number
|
|
10
|
+
* @param {string[]} imagesArray - string[]
|
|
11
|
+
* @param {SxProps} sx - SxProps
|
|
12
|
+
* @param {MUIAvatarProps} avatarProps - MUIAvatarProps
|
|
13
|
+
*/
|
|
14
|
+
export interface AvatarGroupProps extends MUIAvatarGroupProps {
|
|
15
|
+
max?: number;
|
|
16
|
+
spacing?: number;
|
|
17
|
+
imagesArray?: string[];
|
|
18
|
+
sx?: SxProps;
|
|
19
|
+
avatarProps?: MUIAvatarProps;
|
|
20
|
+
}
|
|
21
|
+
/**
|
|
22
|
+
* This AvatarGroup Component is a wrapper of MUIAvatarGroup Component with some custom styles for the look props
|
|
23
|
+
* @param {number} max - number
|
|
24
|
+
* @param {number} spacing - number
|
|
25
|
+
* @param {string[]} imagesArray - string[]
|
|
26
|
+
* @param {SxProps} sx - SxProps
|
|
27
|
+
* @param {MUIAvatarProps} avatarProps - MUIAvatarProps
|
|
28
|
+
* @returns {JSX.Element}
|
|
29
|
+
*/
|
|
30
|
+
declare const AvatarGroup: CraftFC<AvatarGroupProps>;
|
|
31
|
+
export default AvatarGroup;
|
|
@@ -0,0 +1,390 @@
|
|
|
1
|
+
import { jsx as h, jsxs as G } from "react/jsx-runtime";
|
|
2
|
+
import { g as I, _ as l, a as k, P as a } from "../../../createTheme-95c30431.js";
|
|
3
|
+
import * as g from "react";
|
|
4
|
+
import { g as D, s as M, a as E, c as R, b as U, f as F } from "../../../styled-05df7dc6.js";
|
|
5
|
+
import { c as q } from "../../../createSvgIcon-5dcb7caa.js";
|
|
6
|
+
import { c as V } from "../../../chainPropTypes-004bf492.js";
|
|
7
|
+
const B = q(/* @__PURE__ */ h("path", {
|
|
8
|
+
d: "M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
|
|
9
|
+
}), "Person");
|
|
10
|
+
function H(r) {
|
|
11
|
+
return I("MuiAvatar", r);
|
|
12
|
+
}
|
|
13
|
+
const W = D("MuiAvatar", ["root", "colorDefault", "circular", "rounded", "square", "img", "fallback"]), J = W, K = ["alt", "children", "className", "component", "imgProps", "sizes", "src", "srcSet", "variant"], Q = (r) => {
|
|
14
|
+
const {
|
|
15
|
+
classes: t,
|
|
16
|
+
variant: e,
|
|
17
|
+
colorDefault: o
|
|
18
|
+
} = r;
|
|
19
|
+
return U({
|
|
20
|
+
root: ["root", e, o && "colorDefault"],
|
|
21
|
+
img: ["img"],
|
|
22
|
+
fallback: ["fallback"]
|
|
23
|
+
}, H, t);
|
|
24
|
+
}, X = M("div", {
|
|
25
|
+
name: "MuiAvatar",
|
|
26
|
+
slot: "Root",
|
|
27
|
+
overridesResolver: (r, t) => {
|
|
28
|
+
const {
|
|
29
|
+
ownerState: e
|
|
30
|
+
} = r;
|
|
31
|
+
return [t.root, t[e.variant], e.colorDefault && t.colorDefault];
|
|
32
|
+
}
|
|
33
|
+
})(({
|
|
34
|
+
theme: r,
|
|
35
|
+
ownerState: t
|
|
36
|
+
}) => l({
|
|
37
|
+
position: "relative",
|
|
38
|
+
display: "flex",
|
|
39
|
+
alignItems: "center",
|
|
40
|
+
justifyContent: "center",
|
|
41
|
+
flexShrink: 0,
|
|
42
|
+
width: 40,
|
|
43
|
+
height: 40,
|
|
44
|
+
fontFamily: r.typography.fontFamily,
|
|
45
|
+
fontSize: r.typography.pxToRem(20),
|
|
46
|
+
lineHeight: 1,
|
|
47
|
+
borderRadius: "50%",
|
|
48
|
+
overflow: "hidden",
|
|
49
|
+
userSelect: "none"
|
|
50
|
+
}, t.variant === "rounded" && {
|
|
51
|
+
borderRadius: (r.vars || r).shape.borderRadius
|
|
52
|
+
}, t.variant === "square" && {
|
|
53
|
+
borderRadius: 0
|
|
54
|
+
}, t.colorDefault && l({
|
|
55
|
+
color: (r.vars || r).palette.background.default
|
|
56
|
+
}, r.vars ? {
|
|
57
|
+
backgroundColor: r.vars.palette.Avatar.defaultBg
|
|
58
|
+
} : {
|
|
59
|
+
backgroundColor: r.palette.mode === "light" ? r.palette.grey[400] : r.palette.grey[600]
|
|
60
|
+
}))), Y = M("img", {
|
|
61
|
+
name: "MuiAvatar",
|
|
62
|
+
slot: "Img",
|
|
63
|
+
overridesResolver: (r, t) => t.img
|
|
64
|
+
})({
|
|
65
|
+
width: "100%",
|
|
66
|
+
height: "100%",
|
|
67
|
+
textAlign: "center",
|
|
68
|
+
// Handle non-square image. The property isn't supported by IE11.
|
|
69
|
+
objectFit: "cover",
|
|
70
|
+
// Hide alt text.
|
|
71
|
+
color: "transparent",
|
|
72
|
+
// Hide the image broken icon, only works on Chrome.
|
|
73
|
+
textIndent: 1e4
|
|
74
|
+
}), Z = M(B, {
|
|
75
|
+
name: "MuiAvatar",
|
|
76
|
+
slot: "Fallback",
|
|
77
|
+
overridesResolver: (r, t) => t.fallback
|
|
78
|
+
})({
|
|
79
|
+
width: "75%",
|
|
80
|
+
height: "75%"
|
|
81
|
+
});
|
|
82
|
+
function aa({
|
|
83
|
+
crossOrigin: r,
|
|
84
|
+
referrerPolicy: t,
|
|
85
|
+
src: e,
|
|
86
|
+
srcSet: o
|
|
87
|
+
}) {
|
|
88
|
+
const [n, i] = g.useState(!1);
|
|
89
|
+
return g.useEffect(() => {
|
|
90
|
+
if (!e && !o)
|
|
91
|
+
return;
|
|
92
|
+
i(!1);
|
|
93
|
+
let c = !0;
|
|
94
|
+
const s = new Image();
|
|
95
|
+
return s.onload = () => {
|
|
96
|
+
c && i("loaded");
|
|
97
|
+
}, s.onerror = () => {
|
|
98
|
+
c && i("error");
|
|
99
|
+
}, s.crossOrigin = r, s.referrerPolicy = t, s.src = e, o && (s.srcset = o), () => {
|
|
100
|
+
c = !1;
|
|
101
|
+
};
|
|
102
|
+
}, [r, t, e, o]), n;
|
|
103
|
+
}
|
|
104
|
+
const $ = /* @__PURE__ */ g.forwardRef(function(t, e) {
|
|
105
|
+
const o = E({
|
|
106
|
+
props: t,
|
|
107
|
+
name: "MuiAvatar"
|
|
108
|
+
}), {
|
|
109
|
+
alt: n,
|
|
110
|
+
children: i,
|
|
111
|
+
className: c,
|
|
112
|
+
component: s = "div",
|
|
113
|
+
imgProps: C,
|
|
114
|
+
sizes: y,
|
|
115
|
+
src: x,
|
|
116
|
+
srcSet: p,
|
|
117
|
+
variant: S = "circular"
|
|
118
|
+
} = o, N = k(o, K);
|
|
119
|
+
let m = null;
|
|
120
|
+
const u = aa(l({}, C, {
|
|
121
|
+
src: x,
|
|
122
|
+
srcSet: p
|
|
123
|
+
})), b = x || p, A = b && u !== "error", d = l({}, o, {
|
|
124
|
+
colorDefault: !A,
|
|
125
|
+
component: s,
|
|
126
|
+
variant: S
|
|
127
|
+
}), v = Q(d);
|
|
128
|
+
return A ? m = /* @__PURE__ */ h(Y, l({
|
|
129
|
+
alt: n,
|
|
130
|
+
src: x,
|
|
131
|
+
srcSet: p,
|
|
132
|
+
sizes: y,
|
|
133
|
+
ownerState: d,
|
|
134
|
+
className: v.img
|
|
135
|
+
}, C)) : i != null ? m = i : b && n ? m = n[0] : m = /* @__PURE__ */ h(Z, {
|
|
136
|
+
ownerState: d,
|
|
137
|
+
className: v.fallback
|
|
138
|
+
}), /* @__PURE__ */ h(X, l({
|
|
139
|
+
as: s,
|
|
140
|
+
ownerState: d,
|
|
141
|
+
className: R(v.root, c),
|
|
142
|
+
ref: e
|
|
143
|
+
}, N, {
|
|
144
|
+
children: m
|
|
145
|
+
}));
|
|
146
|
+
});
|
|
147
|
+
process.env.NODE_ENV !== "production" && ($.propTypes = {
|
|
148
|
+
// ----------------------------- Warning --------------------------------
|
|
149
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
|
150
|
+
// | To update them edit the d.ts file and run "yarn proptypes" |
|
|
151
|
+
// ----------------------------------------------------------------------
|
|
152
|
+
/**
|
|
153
|
+
* Used in combination with `src` or `srcSet` to
|
|
154
|
+
* provide an alt attribute for the rendered `img` element.
|
|
155
|
+
*/
|
|
156
|
+
alt: a.string,
|
|
157
|
+
/**
|
|
158
|
+
* Used to render icon or text elements inside the Avatar if `src` is not set.
|
|
159
|
+
* This can be an element, or just a string.
|
|
160
|
+
*/
|
|
161
|
+
children: a.node,
|
|
162
|
+
/**
|
|
163
|
+
* Override or extend the styles applied to the component.
|
|
164
|
+
*/
|
|
165
|
+
classes: a.object,
|
|
166
|
+
/**
|
|
167
|
+
* @ignore
|
|
168
|
+
*/
|
|
169
|
+
className: a.string,
|
|
170
|
+
/**
|
|
171
|
+
* The component used for the root node.
|
|
172
|
+
* Either a string to use a HTML element or a component.
|
|
173
|
+
*/
|
|
174
|
+
component: a.elementType,
|
|
175
|
+
/**
|
|
176
|
+
* [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attributes) applied to the `img` element if the component is used to display an image.
|
|
177
|
+
* It can be used to listen for the loading error event.
|
|
178
|
+
*/
|
|
179
|
+
imgProps: a.object,
|
|
180
|
+
/**
|
|
181
|
+
* The `sizes` attribute for the `img` element.
|
|
182
|
+
*/
|
|
183
|
+
sizes: a.string,
|
|
184
|
+
/**
|
|
185
|
+
* The `src` attribute for the `img` element.
|
|
186
|
+
*/
|
|
187
|
+
src: a.string,
|
|
188
|
+
/**
|
|
189
|
+
* The `srcSet` attribute for the `img` element.
|
|
190
|
+
* Use this attribute for responsive image display.
|
|
191
|
+
*/
|
|
192
|
+
srcSet: a.string,
|
|
193
|
+
/**
|
|
194
|
+
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
195
|
+
*/
|
|
196
|
+
sx: a.oneOfType([a.arrayOf(a.oneOfType([a.func, a.object, a.bool])), a.func, a.object]),
|
|
197
|
+
/**
|
|
198
|
+
* The shape of the avatar.
|
|
199
|
+
* @default 'circular'
|
|
200
|
+
*/
|
|
201
|
+
variant: a.oneOfType([a.oneOf(["circular", "rounded", "square"]), a.string])
|
|
202
|
+
});
|
|
203
|
+
const z = $;
|
|
204
|
+
function ra(r) {
|
|
205
|
+
return I("MuiAvatarGroup", r);
|
|
206
|
+
}
|
|
207
|
+
const ta = D("MuiAvatarGroup", ["root", "avatar"]), ea = ta, oa = ["children", "className", "component", "componentsProps", "max", "slotProps", "spacing", "total", "variant"], O = {
|
|
208
|
+
small: -16,
|
|
209
|
+
medium: null
|
|
210
|
+
}, sa = (r) => {
|
|
211
|
+
const {
|
|
212
|
+
classes: t
|
|
213
|
+
} = r;
|
|
214
|
+
return U({
|
|
215
|
+
root: ["root"],
|
|
216
|
+
avatar: ["avatar"]
|
|
217
|
+
}, ra, t);
|
|
218
|
+
}, na = M("div", {
|
|
219
|
+
name: "MuiAvatarGroup",
|
|
220
|
+
slot: "Root",
|
|
221
|
+
overridesResolver: (r, t) => l({
|
|
222
|
+
[`& .${ea.avatar}`]: t.avatar
|
|
223
|
+
}, t.root)
|
|
224
|
+
})(({
|
|
225
|
+
theme: r
|
|
226
|
+
}) => ({
|
|
227
|
+
[`& .${J.root}`]: {
|
|
228
|
+
border: `2px solid ${(r.vars || r).palette.background.default}`,
|
|
229
|
+
boxSizing: "content-box",
|
|
230
|
+
marginLeft: -8,
|
|
231
|
+
"&:last-child": {
|
|
232
|
+
marginLeft: 0
|
|
233
|
+
}
|
|
234
|
+
},
|
|
235
|
+
display: "flex",
|
|
236
|
+
flexDirection: "row-reverse"
|
|
237
|
+
})), la = M(z, {
|
|
238
|
+
name: "MuiAvatarGroup",
|
|
239
|
+
slot: "Avatar",
|
|
240
|
+
overridesResolver: (r, t) => t.avatar
|
|
241
|
+
})(({
|
|
242
|
+
theme: r
|
|
243
|
+
}) => ({
|
|
244
|
+
border: `2px solid ${(r.vars || r).palette.background.default}`,
|
|
245
|
+
boxSizing: "content-box",
|
|
246
|
+
marginLeft: -8,
|
|
247
|
+
"&:last-child": {
|
|
248
|
+
marginLeft: 0
|
|
249
|
+
}
|
|
250
|
+
})), L = /* @__PURE__ */ g.forwardRef(function(t, e) {
|
|
251
|
+
var o;
|
|
252
|
+
const n = E({
|
|
253
|
+
props: t,
|
|
254
|
+
name: "MuiAvatarGroup"
|
|
255
|
+
}), {
|
|
256
|
+
children: i,
|
|
257
|
+
className: c,
|
|
258
|
+
component: s = "div",
|
|
259
|
+
componentsProps: C = {},
|
|
260
|
+
max: y = 5,
|
|
261
|
+
slotProps: x = {},
|
|
262
|
+
spacing: p = "medium",
|
|
263
|
+
total: S,
|
|
264
|
+
variant: N = "circular"
|
|
265
|
+
} = n, m = k(n, oa);
|
|
266
|
+
let u = y < 2 ? 2 : y;
|
|
267
|
+
const b = l({}, n, {
|
|
268
|
+
max: y,
|
|
269
|
+
spacing: p,
|
|
270
|
+
component: s,
|
|
271
|
+
variant: N
|
|
272
|
+
}), A = sa(b), d = g.Children.toArray(i).filter((f) => (process.env.NODE_ENV !== "production" && F.isFragment(f) && console.error(["MUI: The AvatarGroup component doesn't accept a Fragment as a child.", "Consider providing an array instead."].join(`
|
|
273
|
+
`)), /* @__PURE__ */ g.isValidElement(f))), v = S || d.length;
|
|
274
|
+
v === u && (u += 1), u = Math.min(v + 1, u);
|
|
275
|
+
const T = Math.min(d.length, u - 1), j = Math.max(v - u, v - T, 0), w = p && O[p] !== void 0 ? O[p] : -p, P = (o = x.additionalAvatar) != null ? o : C.additionalAvatar;
|
|
276
|
+
return /* @__PURE__ */ G(na, l({
|
|
277
|
+
as: s,
|
|
278
|
+
ownerState: b,
|
|
279
|
+
className: R(A.root, c),
|
|
280
|
+
ref: e
|
|
281
|
+
}, m, {
|
|
282
|
+
children: [j ? /* @__PURE__ */ G(la, l({
|
|
283
|
+
ownerState: b,
|
|
284
|
+
variant: N
|
|
285
|
+
}, P, {
|
|
286
|
+
className: R(A.avatar, P == null ? void 0 : P.className),
|
|
287
|
+
style: l({
|
|
288
|
+
marginLeft: w
|
|
289
|
+
}, P == null ? void 0 : P.style),
|
|
290
|
+
children: ["+", j]
|
|
291
|
+
})) : null, d.slice(0, T).reverse().map((f, _) => /* @__PURE__ */ g.cloneElement(f, {
|
|
292
|
+
className: R(f.props.className, A.avatar),
|
|
293
|
+
style: l({
|
|
294
|
+
// Consistent with "&:last-child" styling for the default spacing,
|
|
295
|
+
// we do not apply custom marginLeft spacing on the last child
|
|
296
|
+
marginLeft: _ === T - 1 ? void 0 : w
|
|
297
|
+
}, f.props.style),
|
|
298
|
+
variant: f.props.variant || N
|
|
299
|
+
}))]
|
|
300
|
+
}));
|
|
301
|
+
});
|
|
302
|
+
process.env.NODE_ENV !== "production" && (L.propTypes = {
|
|
303
|
+
// ----------------------------- Warning --------------------------------
|
|
304
|
+
// | These PropTypes are generated from the TypeScript type definitions |
|
|
305
|
+
// | To update them edit the d.ts file and run "yarn proptypes" |
|
|
306
|
+
// ----------------------------------------------------------------------
|
|
307
|
+
/**
|
|
308
|
+
* The avatars to stack.
|
|
309
|
+
*/
|
|
310
|
+
children: a.node,
|
|
311
|
+
/**
|
|
312
|
+
* Override or extend the styles applied to the component.
|
|
313
|
+
*/
|
|
314
|
+
classes: a.object,
|
|
315
|
+
/**
|
|
316
|
+
* @ignore
|
|
317
|
+
*/
|
|
318
|
+
className: a.string,
|
|
319
|
+
/**
|
|
320
|
+
* The component used for the root node.
|
|
321
|
+
* Either a string to use a HTML element or a component.
|
|
322
|
+
*/
|
|
323
|
+
component: a.elementType,
|
|
324
|
+
/**
|
|
325
|
+
* The extra props for the slot components.
|
|
326
|
+
* You can override the existing props or add new ones.
|
|
327
|
+
*
|
|
328
|
+
* This prop is an alias for the `slotProps` prop.
|
|
329
|
+
* It's recommended to use the `slotProps` prop instead, as `componentsProps` will be deprecated in the future.
|
|
330
|
+
*
|
|
331
|
+
* @default {}
|
|
332
|
+
*/
|
|
333
|
+
componentsProps: a.shape({
|
|
334
|
+
additionalAvatar: a.object
|
|
335
|
+
}),
|
|
336
|
+
/**
|
|
337
|
+
* Max avatars to show before +x.
|
|
338
|
+
* @default 5
|
|
339
|
+
*/
|
|
340
|
+
max: V(a.number, (r) => r.max < 2 ? new Error(["MUI: The prop `max` should be equal to 2 or above.", "A value below is clamped to 2."].join(`
|
|
341
|
+
`)) : null),
|
|
342
|
+
/**
|
|
343
|
+
* The extra props for the slot components.
|
|
344
|
+
* You can override the existing props or add new ones.
|
|
345
|
+
*
|
|
346
|
+
* This prop is an alias for the `componentsProps` prop, which will be deprecated in the future.
|
|
347
|
+
*
|
|
348
|
+
* @default {}
|
|
349
|
+
*/
|
|
350
|
+
slotProps: a.shape({
|
|
351
|
+
additionalAvatar: a.object
|
|
352
|
+
}),
|
|
353
|
+
/**
|
|
354
|
+
* Spacing between avatars.
|
|
355
|
+
* @default 'medium'
|
|
356
|
+
*/
|
|
357
|
+
spacing: a.oneOfType([a.oneOf(["medium", "small"]), a.number]),
|
|
358
|
+
/**
|
|
359
|
+
* The system prop that allows defining system overrides as well as additional CSS styles.
|
|
360
|
+
*/
|
|
361
|
+
sx: a.oneOfType([a.arrayOf(a.oneOfType([a.func, a.object, a.bool])), a.func, a.object]),
|
|
362
|
+
/**
|
|
363
|
+
* The total number of avatars. Used for calculating the number of extra avatars.
|
|
364
|
+
* @default children.length
|
|
365
|
+
*/
|
|
366
|
+
total: a.number,
|
|
367
|
+
/**
|
|
368
|
+
* The variant to use.
|
|
369
|
+
* @default 'circular'
|
|
370
|
+
*/
|
|
371
|
+
variant: a.oneOfType([a.oneOf(["circular", "rounded", "square"]), a.string])
|
|
372
|
+
});
|
|
373
|
+
const ia = L, ma = ({
|
|
374
|
+
max: r = 4,
|
|
375
|
+
spacing: t = 14,
|
|
376
|
+
imagesArray: e = [],
|
|
377
|
+
sx: o,
|
|
378
|
+
avatarProps: n,
|
|
379
|
+
...i
|
|
380
|
+
}) => /* @__PURE__ */ h(ia, { max: r, sx: o, spacing: t, ...i, children: e.map((c, s) => /* @__PURE__ */ h(
|
|
381
|
+
z,
|
|
382
|
+
{
|
|
383
|
+
src: c,
|
|
384
|
+
...n
|
|
385
|
+
},
|
|
386
|
+
s
|
|
387
|
+
)) });
|
|
388
|
+
export {
|
|
389
|
+
ma as default
|
|
390
|
+
};
|