@parto-system-design/ui 1.0.3 → 1.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/index.cjs +19 -59
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +0 -3
- package/dist/index.js +19 -59
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.css
CHANGED
package/dist/index.js
CHANGED
|
@@ -4275,7 +4275,6 @@ function InputOTPSeparator({ ...props }) {
|
|
|
4275
4275
|
// src/components/ui/instagram-post.tsx
|
|
4276
4276
|
import * as React17 from "react";
|
|
4277
4277
|
import { cva as cva8 } from "class-variance-authority";
|
|
4278
|
-
import ReactPlayer from "react-player";
|
|
4279
4278
|
|
|
4280
4279
|
// src/components/ui/tooltip.tsx
|
|
4281
4280
|
import * as React16 from "react";
|
|
@@ -4367,40 +4366,34 @@ function InstagramPostMedia({
|
|
|
4367
4366
|
const item = media[0];
|
|
4368
4367
|
if (variant === "horizontal") {
|
|
4369
4368
|
return /* @__PURE__ */ jsxs21("div", { className: "w-[20%] shrink-0 relative overflow-hidden group cursor-pointer h-full -my-[1px] -ms-[1px]", children: [
|
|
4370
|
-
/* @__PURE__ */ jsx39("div", { className: "absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-colors duration-300 z-10
|
|
4371
|
-
/* @__PURE__ */ jsx39(
|
|
4372
|
-
|
|
4369
|
+
/* @__PURE__ */ jsx39("div", { className: "absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-colors duration-300 z-10" }),
|
|
4370
|
+
/* @__PURE__ */ jsx39(
|
|
4371
|
+
"img",
|
|
4373
4372
|
{
|
|
4374
|
-
|
|
4375
|
-
|
|
4376
|
-
|
|
4377
|
-
controls: true,
|
|
4378
|
-
playing: false,
|
|
4379
|
-
light: true
|
|
4373
|
+
src: item.url,
|
|
4374
|
+
alt: "Post media",
|
|
4375
|
+
className: "w-full h-full object-cover group-hover:scale-110 transition-transform duration-300"
|
|
4380
4376
|
}
|
|
4381
|
-
)
|
|
4377
|
+
)
|
|
4382
4378
|
] });
|
|
4383
4379
|
}
|
|
4384
4380
|
const ratio = getAspectRatio(item.aspectRatio || "16:9");
|
|
4385
4381
|
return /* @__PURE__ */ jsxs21("div", { className: "w-full relative overflow-hidden group cursor-pointer", style: { aspectRatio: ratio }, children: [
|
|
4386
|
-
/* @__PURE__ */ jsx39("div", { className: "absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-colors duration-300 z-10
|
|
4387
|
-
/* @__PURE__ */ jsx39(
|
|
4388
|
-
|
|
4382
|
+
/* @__PURE__ */ jsx39("div", { className: "absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-colors duration-300 z-10" }),
|
|
4383
|
+
/* @__PURE__ */ jsx39(
|
|
4384
|
+
"img",
|
|
4389
4385
|
{
|
|
4390
|
-
|
|
4391
|
-
|
|
4392
|
-
|
|
4393
|
-
controls: true,
|
|
4394
|
-
playing: false,
|
|
4395
|
-
light: true
|
|
4386
|
+
src: item.url,
|
|
4387
|
+
alt: "Post media",
|
|
4388
|
+
className: "w-full h-full object-cover group-hover:scale-110 transition-transform duration-300"
|
|
4396
4389
|
}
|
|
4397
|
-
)
|
|
4390
|
+
)
|
|
4398
4391
|
] });
|
|
4399
4392
|
}
|
|
4400
4393
|
if (mediaType === "carousel" || media.length > 1) {
|
|
4401
4394
|
if (variant === "horizontal") {
|
|
4402
4395
|
return /* @__PURE__ */ jsx39("div", { className: "w-[20%] shrink-0 relative overflow-hidden group cursor-pointer h-full -my-[1px] -ms-[1px]", children: /* @__PURE__ */ jsxs21(Carousel, { className: "w-full h-full", children: [
|
|
4403
|
-
/* @__PURE__ */ jsx39(CarouselContent, { className: "h-full", children: media.map((item, index) => /* @__PURE__ */
|
|
4396
|
+
/* @__PURE__ */ jsx39(CarouselContent, { className: "h-full", children: media.map((item, index) => /* @__PURE__ */ jsxs21(CarouselItem, { className: "h-full", children: [
|
|
4404
4397
|
/* @__PURE__ */ jsx39("div", { className: "absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-colors duration-300 z-10" }),
|
|
4405
4398
|
/* @__PURE__ */ jsx39(
|
|
4406
4399
|
"img",
|
|
@@ -4410,30 +4403,17 @@ function InstagramPostMedia({
|
|
|
4410
4403
|
className: "w-full h-full object-cover group-hover:scale-110 transition-transform duration-300"
|
|
4411
4404
|
}
|
|
4412
4405
|
)
|
|
4413
|
-
] })
|
|
4414
|
-
/* @__PURE__ */ jsx39("div", { className: "absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-colors duration-300 z-10 pointer-events-none" }),
|
|
4415
|
-
/* @__PURE__ */ jsx39("div", { className: "w-full h-full group-hover:scale-110 transition-transform duration-300", children: /* @__PURE__ */ jsx39(
|
|
4416
|
-
ReactPlayer,
|
|
4417
|
-
{
|
|
4418
|
-
url: item.url,
|
|
4419
|
-
width: "100%",
|
|
4420
|
-
height: "100%",
|
|
4421
|
-
controls: true,
|
|
4422
|
-
playing: false,
|
|
4423
|
-
light: true
|
|
4424
|
-
}
|
|
4425
|
-
) })
|
|
4426
|
-
] }) }, index)) }),
|
|
4406
|
+
] }, index)) }),
|
|
4427
4407
|
/* @__PURE__ */ jsx39(CarouselPrevious, { className: "ms-2" }),
|
|
4428
4408
|
/* @__PURE__ */ jsx39(CarouselNext, { className: "me-2" })
|
|
4429
4409
|
] }) });
|
|
4430
4410
|
}
|
|
4431
4411
|
return /* @__PURE__ */ jsxs21(Carousel, { className: "w-full", children: [
|
|
4432
|
-
/* @__PURE__ */ jsx39(CarouselContent, { children: media.map((item, index) => /* @__PURE__ */ jsx39(CarouselItem, { children:
|
|
4412
|
+
/* @__PURE__ */ jsx39(CarouselContent, { children: media.map((item, index) => /* @__PURE__ */ jsx39(CarouselItem, { children: /* @__PURE__ */ jsxs21(
|
|
4433
4413
|
"div",
|
|
4434
4414
|
{
|
|
4435
4415
|
className: "w-full relative overflow-hidden group cursor-pointer",
|
|
4436
|
-
style: { aspectRatio: getAspectRatio(item.aspectRatio || "1:1") },
|
|
4416
|
+
style: { aspectRatio: getAspectRatio(item.aspectRatio || (item.type === "video" ? "16:9" : "1:1")) },
|
|
4437
4417
|
children: [
|
|
4438
4418
|
/* @__PURE__ */ jsx39("div", { className: "absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-colors duration-300 z-10" }),
|
|
4439
4419
|
/* @__PURE__ */ jsx39(
|
|
@@ -4446,26 +4426,6 @@ function InstagramPostMedia({
|
|
|
4446
4426
|
)
|
|
4447
4427
|
]
|
|
4448
4428
|
}
|
|
4449
|
-
) : /* @__PURE__ */ jsxs21(
|
|
4450
|
-
"div",
|
|
4451
|
-
{
|
|
4452
|
-
className: "w-full relative overflow-hidden group cursor-pointer",
|
|
4453
|
-
style: { aspectRatio: getAspectRatio(item.aspectRatio || "16:9") },
|
|
4454
|
-
children: [
|
|
4455
|
-
/* @__PURE__ */ jsx39("div", { className: "absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-colors duration-300 z-10 pointer-events-none" }),
|
|
4456
|
-
/* @__PURE__ */ jsx39("div", { className: "w-full h-full group-hover:scale-110 transition-transform duration-300", children: /* @__PURE__ */ jsx39(
|
|
4457
|
-
ReactPlayer,
|
|
4458
|
-
{
|
|
4459
|
-
url: item.url,
|
|
4460
|
-
width: "100%",
|
|
4461
|
-
height: "100%",
|
|
4462
|
-
controls: true,
|
|
4463
|
-
playing: false,
|
|
4464
|
-
light: true
|
|
4465
|
-
}
|
|
4466
|
-
) })
|
|
4467
|
-
]
|
|
4468
|
-
}
|
|
4469
4429
|
) }, index)) }),
|
|
4470
4430
|
/* @__PURE__ */ jsx39(CarouselPrevious, { className: "ms-2" }),
|
|
4471
4431
|
/* @__PURE__ */ jsx39(CarouselNext, { className: "me-2" })
|
|
@@ -6607,7 +6567,7 @@ var EngagementRate = React22.forwardRef(
|
|
|
6607
6567
|
width: "20",
|
|
6608
6568
|
height: "14",
|
|
6609
6569
|
viewBox: "0 0 20 14",
|
|
6610
|
-
className: "fill-
|
|
6570
|
+
className: "fill-white dark:fill-white drop-shadow-md transition-transform duration-300",
|
|
6611
6571
|
children: /* @__PURE__ */ jsx50("path", { d: "M10 14L0 0H20L10 14Z" })
|
|
6612
6572
|
}
|
|
6613
6573
|
)
|