@opensite/ui 1.2.2 → 1.2.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.
Files changed (51) hide show
  1. package/dist/auto-scroll-carousel.cjs +2 -2
  2. package/dist/auto-scroll-carousel.js +2 -2
  3. package/dist/blur-vignette-grid.cjs +13 -17
  4. package/dist/blur-vignette-grid.d.cts +2 -2
  5. package/dist/blur-vignette-grid.d.ts +2 -2
  6. package/dist/blur-vignette-grid.js +13 -17
  7. package/dist/carousel-gradient-text.cjs +8 -10
  8. package/dist/carousel-gradient-text.js +8 -10
  9. package/dist/carousel-icon-sidebar.cjs +48 -29
  10. package/dist/carousel-icon-sidebar.js +48 -29
  11. package/dist/carousel-scale-focus.cjs +27 -1
  12. package/dist/carousel-scale-focus.js +27 -1
  13. package/dist/carousel-tabs-content.cjs +46 -36
  14. package/dist/carousel-tabs-content.js +46 -36
  15. package/dist/expandable-case-study-cards.cjs +1 -0
  16. package/dist/expandable-case-study-cards.js +1 -0
  17. package/dist/feature-capabilities-grid.cjs +525 -54
  18. package/dist/feature-capabilities-grid.d.cts +4 -0
  19. package/dist/feature-capabilities-grid.d.ts +4 -0
  20. package/dist/feature-capabilities-grid.js +525 -54
  21. package/dist/feature-card-grid-linked.cjs +40 -35
  22. package/dist/feature-card-grid-linked.d.cts +9 -1
  23. package/dist/feature-card-grid-linked.d.ts +9 -1
  24. package/dist/feature-card-grid-linked.js +40 -35
  25. package/dist/feature-carousel-progress.cjs +129 -56
  26. package/dist/feature-carousel-progress.d.cts +13 -1
  27. package/dist/feature-carousel-progress.d.ts +13 -1
  28. package/dist/feature-carousel-progress.js +129 -56
  29. package/dist/feature-checklist-image.cjs +61 -105
  30. package/dist/feature-checklist-image.d.cts +1 -1
  31. package/dist/feature-checklist-image.d.ts +1 -1
  32. package/dist/feature-checklist-image.js +61 -105
  33. package/dist/feature-icon-grid-bordered.cjs +457 -35
  34. package/dist/feature-icon-grid-bordered.d.cts +4 -0
  35. package/dist/feature-icon-grid-bordered.d.ts +4 -0
  36. package/dist/feature-icon-grid-bordered.js +457 -35
  37. package/dist/feature-numbered-cards.cjs +519 -35
  38. package/dist/feature-numbered-cards.d.cts +18 -2
  39. package/dist/feature-numbered-cards.d.ts +18 -2
  40. package/dist/feature-numbered-cards.js +520 -36
  41. package/dist/feature-split-image.cjs +1 -1
  42. package/dist/feature-split-image.js +1 -1
  43. package/dist/masonry-motion-grid.cjs +2 -2
  44. package/dist/masonry-motion-grid.js +2 -2
  45. package/dist/registry.cjs +10264 -9952
  46. package/dist/registry.js +10262 -9950
  47. package/dist/testimonial-carousel-cards.cjs +28 -8
  48. package/dist/testimonial-carousel-cards.d.cts +8 -0
  49. package/dist/testimonial-carousel-cards.d.ts +8 -0
  50. package/dist/testimonial-carousel-cards.js +28 -8
  51. package/package.json +1 -1
@@ -1202,37 +1202,46 @@ function CarouselTabsContent({
1202
1202
  }, []);
1203
1203
  const tabsContent = React4.useMemo(() => {
1204
1204
  if (tabsSlot) return tabsSlot;
1205
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("relative flex min-w-0 flex-1 overflow-x-auto scrollbar-hide", tabsClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex h-auto flex-nowrap gap-2 md:gap-4", children: [
1206
- items?.map((item, idx) => /* @__PURE__ */ jsxRuntime.jsx(
1207
- "button",
1208
- {
1209
- ref: (el) => {
1210
- tabRefs.current[idx] = el;
1211
- },
1212
- onClick: () => setCurrent(item.category),
1213
- className: cn(
1214
- "text-base transition-all duration-700 ease-out px-3 py-1.5 rounded-sm whitespace-nowrap flex-shrink-0",
1215
- current === item.category ? "text-foreground" : "text-muted-foreground hover:text-foreground",
1216
- tabClassName
1217
- ),
1218
- children: item.category
1219
- },
1220
- idx
1221
- )),
1222
- /* @__PURE__ */ jsxRuntime.jsx(
1223
- "div",
1224
- {
1225
- className: cn(
1226
- "absolute bottom-0 h-0.5 bg-primary transition-all duration-700 ease-out",
1227
- indicatorClassName
1228
- ),
1229
- style: {
1230
- width: `${indicatorStyle.width}px`,
1231
- left: `${indicatorStyle.left}px`
1232
- }
1233
- }
1234
- )
1235
- ] }) });
1205
+ return /* @__PURE__ */ jsxRuntime.jsx(
1206
+ "div",
1207
+ {
1208
+ className: cn(
1209
+ "relative flex min-w-0 flex-1 overflow-x-auto scrollbar-hide",
1210
+ tabsClassName
1211
+ ),
1212
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex h-auto flex-nowrap gap-2 md:gap-4", children: [
1213
+ items?.map((item, idx) => /* @__PURE__ */ jsxRuntime.jsx(
1214
+ "button",
1215
+ {
1216
+ ref: (el) => {
1217
+ tabRefs.current[idx] = el;
1218
+ },
1219
+ onClick: () => setCurrent(item.category),
1220
+ className: cn(
1221
+ "text-base transition-all duration-700 ease-out px-3 py-1.5 rounded-sm whitespace-nowrap flex-shrink-0",
1222
+ current === item.category ? "text-foreground" : "text-muted-foreground hover:text-foreground",
1223
+ tabClassName
1224
+ ),
1225
+ children: item.category
1226
+ },
1227
+ idx
1228
+ )),
1229
+ /* @__PURE__ */ jsxRuntime.jsx(
1230
+ "div",
1231
+ {
1232
+ className: cn(
1233
+ "absolute bottom-0 h-0.5 bg-primary transition-all duration-700 ease-out",
1234
+ indicatorClassName
1235
+ ),
1236
+ style: {
1237
+ width: `${indicatorStyle.width}px`,
1238
+ left: `${indicatorStyle.left}px`
1239
+ }
1240
+ }
1241
+ )
1242
+ ] })
1243
+ }
1244
+ );
1236
1245
  }, [
1237
1246
  tabsSlot,
1238
1247
  tabsClassName,
@@ -1253,16 +1262,16 @@ function CarouselTabsContent({
1253
1262
  "div",
1254
1263
  {
1255
1264
  className: cn(
1256
- "grid h-full max-w-4xl gap-10 bg-background rounded-xl border border-border p-6 shadow-sm select-none sm:p-10 md:max-h-[450px] md:grid-cols-2 lg:gap-20",
1265
+ "grid h-full max-w-4xl gap-6 bg-background rounded-xl border border-border p-4 md:p-6 shadow-sm select-none sm:p-10 md:max-h-[450px] md:grid-cols-2 md:gap-20",
1257
1266
  cardClassName
1258
1267
  ),
1259
1268
  children: [
1260
1269
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col justify-between gap-4", children: [
1261
1270
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
1262
- /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-2xl font-medium sm:text-4xl", children: item.title }),
1263
- /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 text-sm text-muted-foreground sm:mt-6", children: item.description })
1271
+ /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl font-medium md:text-4xl", children: item.title }),
1272
+ item.description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 text-sm text-muted-foreground md:mt-6", children: item.description })
1264
1273
  ] }),
1265
- typeof item.note === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-xs text-muted-foreground sm:mt-6", children: item.note }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 text-xs text-muted-foreground sm:mt-6", children: item.note })
1274
+ !item.note ? null : typeof item.note === "string" && item.note?.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-0 text-xs text-muted-foreground md:mt-6", children: item.note }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-0 text-xs text-muted-foreground md:mt-6", children: item.note })
1266
1275
  ] }),
1267
1276
  /* @__PURE__ */ jsxRuntime.jsx(
1268
1277
  "div",
@@ -1316,8 +1325,9 @@ function CarouselTabsContent({
1316
1325
  patternOpacity,
1317
1326
  patternClassName,
1318
1327
  className: cn("overflow-hidden", className),
1328
+ containerClassName: "px-4",
1319
1329
  children: [
1320
- title || description ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 mb-6 md:mb-16", children: [
1330
+ title || description ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 mb-10 md:mb-16", children: [
1321
1331
  title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
1322
1332
  "h2",
1323
1333
  {
@@ -1178,37 +1178,46 @@ function CarouselTabsContent({
1178
1178
  }, []);
1179
1179
  const tabsContent = useMemo(() => {
1180
1180
  if (tabsSlot) return tabsSlot;
1181
- return /* @__PURE__ */ jsx("div", { className: cn("relative flex min-w-0 flex-1 overflow-x-auto scrollbar-hide", tabsClassName), children: /* @__PURE__ */ jsxs("div", { className: "relative flex h-auto flex-nowrap gap-2 md:gap-4", children: [
1182
- items?.map((item, idx) => /* @__PURE__ */ jsx(
1183
- "button",
1184
- {
1185
- ref: (el) => {
1186
- tabRefs.current[idx] = el;
1187
- },
1188
- onClick: () => setCurrent(item.category),
1189
- className: cn(
1190
- "text-base transition-all duration-700 ease-out px-3 py-1.5 rounded-sm whitespace-nowrap flex-shrink-0",
1191
- current === item.category ? "text-foreground" : "text-muted-foreground hover:text-foreground",
1192
- tabClassName
1193
- ),
1194
- children: item.category
1195
- },
1196
- idx
1197
- )),
1198
- /* @__PURE__ */ jsx(
1199
- "div",
1200
- {
1201
- className: cn(
1202
- "absolute bottom-0 h-0.5 bg-primary transition-all duration-700 ease-out",
1203
- indicatorClassName
1204
- ),
1205
- style: {
1206
- width: `${indicatorStyle.width}px`,
1207
- left: `${indicatorStyle.left}px`
1208
- }
1209
- }
1210
- )
1211
- ] }) });
1181
+ return /* @__PURE__ */ jsx(
1182
+ "div",
1183
+ {
1184
+ className: cn(
1185
+ "relative flex min-w-0 flex-1 overflow-x-auto scrollbar-hide",
1186
+ tabsClassName
1187
+ ),
1188
+ children: /* @__PURE__ */ jsxs("div", { className: "relative flex h-auto flex-nowrap gap-2 md:gap-4", children: [
1189
+ items?.map((item, idx) => /* @__PURE__ */ jsx(
1190
+ "button",
1191
+ {
1192
+ ref: (el) => {
1193
+ tabRefs.current[idx] = el;
1194
+ },
1195
+ onClick: () => setCurrent(item.category),
1196
+ className: cn(
1197
+ "text-base transition-all duration-700 ease-out px-3 py-1.5 rounded-sm whitespace-nowrap flex-shrink-0",
1198
+ current === item.category ? "text-foreground" : "text-muted-foreground hover:text-foreground",
1199
+ tabClassName
1200
+ ),
1201
+ children: item.category
1202
+ },
1203
+ idx
1204
+ )),
1205
+ /* @__PURE__ */ jsx(
1206
+ "div",
1207
+ {
1208
+ className: cn(
1209
+ "absolute bottom-0 h-0.5 bg-primary transition-all duration-700 ease-out",
1210
+ indicatorClassName
1211
+ ),
1212
+ style: {
1213
+ width: `${indicatorStyle.width}px`,
1214
+ left: `${indicatorStyle.left}px`
1215
+ }
1216
+ }
1217
+ )
1218
+ ] })
1219
+ }
1220
+ );
1212
1221
  }, [
1213
1222
  tabsSlot,
1214
1223
  tabsClassName,
@@ -1229,16 +1238,16 @@ function CarouselTabsContent({
1229
1238
  "div",
1230
1239
  {
1231
1240
  className: cn(
1232
- "grid h-full max-w-4xl gap-10 bg-background rounded-xl border border-border p-6 shadow-sm select-none sm:p-10 md:max-h-[450px] md:grid-cols-2 lg:gap-20",
1241
+ "grid h-full max-w-4xl gap-6 bg-background rounded-xl border border-border p-4 md:p-6 shadow-sm select-none sm:p-10 md:max-h-[450px] md:grid-cols-2 md:gap-20",
1233
1242
  cardClassName
1234
1243
  ),
1235
1244
  children: [
1236
1245
  /* @__PURE__ */ jsxs("div", { className: "flex flex-col justify-between gap-4", children: [
1237
1246
  /* @__PURE__ */ jsxs("div", { children: [
1238
- /* @__PURE__ */ jsx("h2", { className: "text-2xl font-medium sm:text-4xl", children: item.title }),
1239
- /* @__PURE__ */ jsx("div", { className: "mt-4 text-sm text-muted-foreground sm:mt-6", children: item.description })
1247
+ /* @__PURE__ */ jsx("h3", { className: "text-xl font-medium md:text-4xl", children: item.title }),
1248
+ item.description && /* @__PURE__ */ jsx("div", { className: "mt-2 text-sm text-muted-foreground md:mt-6", children: item.description })
1240
1249
  ] }),
1241
- typeof item.note === "string" ? /* @__PURE__ */ jsx("p", { className: "mt-4 text-xs text-muted-foreground sm:mt-6", children: item.note }) : /* @__PURE__ */ jsx("div", { className: "mt-4 text-xs text-muted-foreground sm:mt-6", children: item.note })
1250
+ !item.note ? null : typeof item.note === "string" && item.note?.length > 0 ? /* @__PURE__ */ jsx("p", { className: "mt-0 text-xs text-muted-foreground md:mt-6", children: item.note }) : /* @__PURE__ */ jsx("div", { className: "mt-0 text-xs text-muted-foreground md:mt-6", children: item.note })
1242
1251
  ] }),
1243
1252
  /* @__PURE__ */ jsx(
1244
1253
  "div",
@@ -1292,8 +1301,9 @@ function CarouselTabsContent({
1292
1301
  patternOpacity,
1293
1302
  patternClassName,
1294
1303
  className: cn("overflow-hidden", className),
1304
+ containerClassName: "px-4",
1295
1305
  children: [
1296
- title || description ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 mb-6 md:mb-16", children: [
1306
+ title || description ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 mb-10 md:mb-16", children: [
1297
1307
  title && (typeof title === "string" ? /* @__PURE__ */ jsx(
1298
1308
  "h2",
1299
1309
  {
@@ -669,6 +669,7 @@ function ExpandableCaseStudyCards({
669
669
  patternOpacity,
670
670
  patternClassName,
671
671
  className,
672
+ containerClassName: "px-6 sm:px-6 md:px-6 lg:px-8",
672
673
  children: /* @__PURE__ */ jsxRuntime.jsx(
673
674
  "div",
674
675
  {
@@ -648,6 +648,7 @@ function ExpandableCaseStudyCards({
648
648
  patternOpacity,
649
649
  patternClassName,
650
650
  className,
651
+ containerClassName: "px-6 sm:px-6 md:px-6 lg:px-8",
651
652
  children: /* @__PURE__ */ jsx(
652
653
  "div",
653
654
  {