@snapcall/design-system 1.21.2 → 1.21.3

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.
Files changed (7) hide show
  1. package/dist/components/MediaCard/index.d.mts +5 -1
  2. package/dist/components/MediaCard/index.d.ts +5 -1
  3. package/dist/components/MediaCard/index.js +20 -14
  4. package/dist/components/MediaCard/index.mjs +20 -14
  5. package/dist/index.d.mts +5 -1
  6. package/dist/index.d.ts +5 -1
  7. package/package.json +1 -1
package/dist/components/MediaCard/index.d.mts CHANGED
@@ -12,9 +12,13 @@ type MediaCardProps = {
12
12
  moderationStatus?: 'processing' | 'flagged' | 'safe' | null;
13
13
  isLoading?: boolean;
14
14
  size: 'small' | 'medium' | 'large';
15
+ author?: {
16
+ name: string;
17
+ image?: JSX.Element;
18
+ };
15
19
  } & HTMLAttributes<HTMLDivElement>;
16
20
  declare const MediaCard: {
17
- ({ title, description, duration, type, image, action, actionBehavior, isLoading, size, className, ...otherProps }: MediaCardProps): react_jsx_runtime.JSX.Element;
21
+ ({ title, description, duration, type, image, action, actionBehavior, isLoading, size, author, className, ...otherProps }: MediaCardProps): react_jsx_runtime.JSX.Element;
18
22
  displayName: string;
19
23
  };
20
24
 
package/dist/components/MediaCard/index.d.ts CHANGED
@@ -12,9 +12,13 @@ type MediaCardProps = {
12
12
  moderationStatus?: 'processing' | 'flagged' | 'safe' | null;
13
13
  isLoading?: boolean;
14
14
  size: 'small' | 'medium' | 'large';
15
+ author?: {
16
+ name: string;
17
+ image?: JSX.Element;
18
+ };
15
19
  } & HTMLAttributes<HTMLDivElement>;
16
20
  declare const MediaCard: {
17
- ({ title, description, duration, type, image, action, actionBehavior, isLoading, size, className, ...otherProps }: MediaCardProps): react_jsx_runtime.JSX.Element;
21
+ ({ title, description, duration, type, image, action, actionBehavior, isLoading, size, author, className, ...otherProps }: MediaCardProps): react_jsx_runtime.JSX.Element;
18
22
  displayName: string;
19
23
  };
20
24
 
package/dist/components/MediaCard/index.js CHANGED
@@ -396,6 +396,7 @@ var MediaCard = (_a) => {
396
396
  actionBehavior = "default",
397
397
  isLoading,
398
398
  size,
399
+ author,
399
400
  className
400
401
  } = _b, otherProps = __objRest(_b, [
401
402
  "title",
@@ -407,18 +408,15 @@ var MediaCard = (_a) => {
407
408
  "actionBehavior",
408
409
  "isLoading",
409
410
  "size",
411
+ "author",
410
412
  "className"
411
413
  ]);
412
414
  const thumbnail = /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
413
415
  "div",
414
- __spreadProps(__spreadValues({}, otherProps), {
415
- className: cn(
416
- "flex-1 min-h-0 bg-gray-50 relative",
417
- {
418
- "aspect-square rounded-md": size === "medium" || size === "small"
419
- },
420
- className
421
- ),
416
+ {
417
+ className: cn("flex-1 min-h-0 bg-gray-50 relative", {
418
+ "aspect-square rounded-md": size === "medium" || size === "small"
419
+ }),
422
420
  children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "flex justify-center items-center w-full h-full rounded-[inherit] overflow-hidden relative", children: [
423
421
  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
424
422
  "div",
@@ -428,8 +426,15 @@ var MediaCard = (_a) => {
428
426
  size === "large" ? "p-2" : "p-1"
429
427
  ),
430
428
  children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { className: "relative w-full h-full flex justify-center items-center", children: [
431
- duration && size === "large" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "absolute bottom-0 left-0", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "px-1 py-0.5 bg-black/50 dark:bg-white/50 rounded text-xs text-white dark:text-black font-medium truncate", children: secondsToDuration(duration) }) }),
432
- size !== "small" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "absolute bottom-0 right-0", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Avatar, { size: size === "large" ? "sm" : "xs", name: "Avatar" }) }),
429
+ duration !== void 0 && size === "large" && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "absolute bottom-0 left-0", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("p", { className: "px-1 py-0.5 bg-black/50 dark:bg-white/50 rounded text-xs text-white dark:text-black font-medium truncate", children: secondsToDuration(duration) }) }),
430
+ size !== "small" && author && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "absolute bottom-0 right-0", children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
431
+ Avatar,
432
+ {
433
+ size: size === "large" ? "sm" : "xs",
434
+ name: author.name,
435
+ image: author.image
436
+ }
437
+ ) }),
433
438
  type === "video" && image && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
434
439
  PlayIcon,
435
440
  {
@@ -445,11 +450,11 @@ var MediaCard = (_a) => {
445
450
  size: size === "large" ? 24 : size === "medium" ? 18 : 16
446
451
  })
447
452
  ] })
448
- })
453
+ }
449
454
  );
450
455
  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
451
456
  "div",
452
- {
457
+ __spreadProps(__spreadValues({}, otherProps), {
453
458
  className: cn(
454
459
  "flex flex-col bg-white border border-gray-200 divide-y divide-gray-200 rounded-lg shadow-sm group/mediacard",
455
460
  "hover:bg-gray-25 active:bg-gray-50 overflow-hidden",
@@ -458,7 +463,8 @@ var MediaCard = (_a) => {
458
463
  "w-[232px] h-[184px]": size === "large",
459
464
  "w-[240px] h-[72px]": size === "medium",
460
465
  "w-[240px] h-[52px]": size === "small"
461
- }
466
+ },
467
+ className
462
468
  ),
463
469
  children: [
464
470
  size === "large" && thumbnail,
@@ -490,7 +496,7 @@ var MediaCard = (_a) => {
490
496
  }
491
497
  )
492
498
  ]
493
- }
499
+ })
494
500
  );
495
501
  };
496
502
  MediaCard.displayName = "MediaCard";
package/dist/components/MediaCard/index.mjs CHANGED
@@ -221,6 +221,7 @@ var MediaCard = (_a) => {
221
221
  actionBehavior = "default",
222
222
  isLoading,
223
223
  size,
224
+ author,
224
225
  className
225
226
  } = _b, otherProps = __objRest(_b, [
226
227
  "title",
@@ -232,18 +233,15 @@ var MediaCard = (_a) => {
232
233
  "actionBehavior",
233
234
  "isLoading",
234
235
  "size",
236
+ "author",
235
237
  "className"
236
238
  ]);
237
239
  const thumbnail = /* @__PURE__ */ jsx5(
238
240
  "div",
239
- __spreadProps(__spreadValues({}, otherProps), {
240
- className: cn(
241
- "flex-1 min-h-0 bg-gray-50 relative",
242
- {
243
- "aspect-square rounded-md": size === "medium" || size === "small"
244
- },
245
- className
246
- ),
241
+ {
242
+ className: cn("flex-1 min-h-0 bg-gray-50 relative", {
243
+ "aspect-square rounded-md": size === "medium" || size === "small"
244
+ }),
247
245
  children: /* @__PURE__ */ jsxs4("div", { className: "flex justify-center items-center w-full h-full rounded-[inherit] overflow-hidden relative", children: [
248
246
  /* @__PURE__ */ jsx5(
249
247
  "div",
@@ -253,8 +251,15 @@ var MediaCard = (_a) => {
253
251
  size === "large" ? "p-2" : "p-1"
254
252
  ),
255
253
  children: /* @__PURE__ */ jsxs4("div", { className: "relative w-full h-full flex justify-center items-center", children: [
256
- duration && size === "large" && /* @__PURE__ */ jsx5("div", { className: "absolute bottom-0 left-0", children: /* @__PURE__ */ jsx5("p", { className: "px-1 py-0.5 bg-black/50 dark:bg-white/50 rounded text-xs text-white dark:text-black font-medium truncate", children: secondsToDuration(duration) }) }),
257
- size !== "small" && /* @__PURE__ */ jsx5("div", { className: "absolute bottom-0 right-0", children: /* @__PURE__ */ jsx5(Avatar, { size: size === "large" ? "sm" : "xs", name: "Avatar" }) }),
254
+ duration !== void 0 && size === "large" && /* @__PURE__ */ jsx5("div", { className: "absolute bottom-0 left-0", children: /* @__PURE__ */ jsx5("p", { className: "px-1 py-0.5 bg-black/50 dark:bg-white/50 rounded text-xs text-white dark:text-black font-medium truncate", children: secondsToDuration(duration) }) }),
255
+ size !== "small" && author && /* @__PURE__ */ jsx5("div", { className: "absolute bottom-0 right-0", children: /* @__PURE__ */ jsx5(
256
+ Avatar,
257
+ {
258
+ size: size === "large" ? "sm" : "xs",
259
+ name: author.name,
260
+ image: author.image
261
+ }
262
+ ) }),
258
263
  type === "video" && image && /* @__PURE__ */ jsx5(
259
264
  PlayIcon,
260
265
  {
@@ -270,11 +275,11 @@ var MediaCard = (_a) => {
270
275
  size: size === "large" ? 24 : size === "medium" ? 18 : 16
271
276
  })
272
277
  ] })
273
- })
278
+ }
274
279
  );
275
280
  return /* @__PURE__ */ jsxs4(
276
281
  "div",
277
- {
282
+ __spreadProps(__spreadValues({}, otherProps), {
278
283
  className: cn(
279
284
  "flex flex-col bg-white border border-gray-200 divide-y divide-gray-200 rounded-lg shadow-sm group/mediacard",
280
285
  "hover:bg-gray-25 active:bg-gray-50 overflow-hidden",
@@ -283,7 +288,8 @@ var MediaCard = (_a) => {
283
288
  "w-[232px] h-[184px]": size === "large",
284
289
  "w-[240px] h-[72px]": size === "medium",
285
290
  "w-[240px] h-[52px]": size === "small"
286
- }
291
+ },
292
+ className
287
293
  ),
288
294
  children: [
289
295
  size === "large" && thumbnail,
@@ -315,7 +321,7 @@ var MediaCard = (_a) => {
315
321
  }
316
322
  )
317
323
  ]
318
- }
324
+ })
319
325
  );
320
326
  };
321
327
  MediaCard.displayName = "MediaCard";
package/dist/index.d.mts CHANGED
@@ -612,9 +612,13 @@ type MediaCardProps = {
612
612
  moderationStatus?: 'processing' | 'flagged' | 'safe' | null;
613
613
  isLoading?: boolean;
614
614
  size: 'small' | 'medium' | 'large';
615
+ author?: {
616
+ name: string;
617
+ image?: JSX.Element;
618
+ };
615
619
  } & HTMLAttributes<HTMLDivElement>;
616
620
  declare const MediaCard: {
617
- ({ title, description, duration, type, image, action, actionBehavior, isLoading, size, className, ...otherProps }: MediaCardProps): react_jsx_runtime.JSX.Element;
621
+ ({ title, description, duration, type, image, action, actionBehavior, isLoading, size, author, className, ...otherProps }: MediaCardProps): react_jsx_runtime.JSX.Element;
618
622
  displayName: string;
619
623
  };
620
624
 
package/dist/index.d.ts CHANGED
@@ -612,9 +612,13 @@ type MediaCardProps = {
612
612
  moderationStatus?: 'processing' | 'flagged' | 'safe' | null;
613
613
  isLoading?: boolean;
614
614
  size: 'small' | 'medium' | 'large';
615
+ author?: {
616
+ name: string;
617
+ image?: JSX.Element;
618
+ };
615
619
  } & HTMLAttributes<HTMLDivElement>;
616
620
  declare const MediaCard: {
617
- ({ title, description, duration, type, image, action, actionBehavior, isLoading, size, className, ...otherProps }: MediaCardProps): react_jsx_runtime.JSX.Element;
621
+ ({ title, description, duration, type, image, action, actionBehavior, isLoading, size, author, className, ...otherProps }: MediaCardProps): react_jsx_runtime.JSX.Element;
618
622
  displayName: string;
619
623
  };
620
624
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@snapcall/design-system",
3
- "version": "1.21.2",
3
+ "version": "1.21.3",
4
4
  "main": "./dist/index.js",
5
5
  "module": "./dist/index.mjs",
6
6
  "types": "./dist/index.d.ts",