@opensite/ui 3.1.9 → 3.2.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.
Files changed (9) hide show
  1. package/dist/blog-filtered-results.cjs +4 -33
  2. package/dist/blog-filtered-results.d.cts +5 -1
  3. package/dist/blog-filtered-results.d.ts +5 -1
  4. package/dist/blog-filtered-results.js +4 -33
  5. package/dist/blog-horizontal-timeline.cjs +9 -31
  6. package/dist/blog-horizontal-timeline.js +9 -31
  7. package/dist/registry.cjs +12 -10
  8. package/dist/registry.js +12 -10
  9. package/package.json +1 -1
package/dist/blog-filtered-results.cjs CHANGED
@@ -40,36 +40,6 @@ var LabelPrimitive__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive);
40
40
  function cn(...inputs) {
41
41
  return tailwindMerge.twMerge(clsx.clsx(inputs));
42
42
  }
43
- function getNestedCardBg(parentBg, variant = "muted", options) {
44
- const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
45
- if (isDark) {
46
- switch (variant) {
47
- case "muted":
48
- return "bg-background";
49
- case "card":
50
- return "bg-card";
51
- case "accent":
52
- return "bg-accent";
53
- case "subtle":
54
- return "bg-background/50";
55
- }
56
- } else {
57
- switch (variant) {
58
- case "muted":
59
- return "bg-muted";
60
- case "card":
61
- return "bg-card";
62
- case "accent":
63
- return "bg-accent";
64
- case "subtle":
65
- return "bg-muted/50";
66
- }
67
- }
68
- }
69
- function getNestedCardTextColor(parentBg, options) {
70
- const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
71
- return isDark ? "text-foreground" : "";
72
- }
73
43
  function AspectRatio({
74
44
  ...props
75
45
  }) {
@@ -693,8 +663,9 @@ function BlogFilteredResultsComponent({
693
663
  loadMoreClassName,
694
664
  optixFlowConfig,
695
665
  background,
696
- spacing = "pt-6 pb-16 lg:pt-12 lg:pb-32",
666
+ spacing = "hero",
697
667
  pattern,
668
+ containerClassName = "mx-auto w-full px-4 lg:px-8 max-w-full md:max-w-7xl relative z-10 flex justify-center",
698
669
  patternOpacity
699
670
  }) {
700
671
  const effectivePostsPerPage = postsPerPage || POSTS_PER_PAGE;
@@ -828,14 +799,14 @@ function BlogFilteredResultsComponent({
828
799
  className: cn(className),
829
800
  pattern,
830
801
  patternOpacity,
802
+ containerClassName,
831
803
  children: [
832
804
  /* @__PURE__ */ jsxRuntime.jsx(
833
805
  "div",
834
806
  {
835
807
  className: cn(
836
808
  "bg-size-[3.125rem_3.125rem] bg-repeat rounded-2xl shadow-xl",
837
- getNestedCardBg(background),
838
- getNestedCardTextColor(background),
809
+ "bg-muted text-muted-foreground",
839
810
  heroClassName
840
811
  ),
841
812
  children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full flex flex-col items-start justify-start gap-6 md:gap-16 p-6 md:p-20 lg:flex-row lg:items-center lg:justify-between", children: [
package/dist/blog-filtered-results.d.cts CHANGED
@@ -133,6 +133,10 @@ interface BlogFilteredResultsProps {
133
133
  * Vertical spacing for the section
134
134
  */
135
135
  spacing?: SectionSpacing;
136
+ /**
137
+ * Additional CSS classes for the container
138
+ */
139
+ containerClassName?: string;
136
140
  /**
137
141
  * Optional background pattern name or URL
138
142
  */
@@ -144,6 +148,6 @@ interface BlogFilteredResultsProps {
144
148
  /** Optional Section ID */
145
149
  sectionId?: string;
146
150
  }
147
- declare function BlogFilteredResultsComponent({ sectionId, heading, description, allContentHeading, breadcrumb, breadcrumbSlot, primaryPost, primaryPostSlot, posts, postsSlot, categories, categoriesSlot, postsPerPage, loadMoreAction, loadMoreSlot, className, heroClassName, headingClassName, descriptionClassName, primaryPostClassName, allContentClassName, allContentHeadingClassName, categoriesClassName, postsClassName, postCardClassName, loadMoreClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, }: BlogFilteredResultsProps): React.JSX.Element;
151
+ declare function BlogFilteredResultsComponent({ sectionId, heading, description, allContentHeading, breadcrumb, breadcrumbSlot, primaryPost, primaryPostSlot, posts, postsSlot, categories, categoriesSlot, postsPerPage, loadMoreAction, loadMoreSlot, className, heroClassName, headingClassName, descriptionClassName, primaryPostClassName, allContentClassName, allContentHeadingClassName, categoriesClassName, postsClassName, postCardClassName, loadMoreClassName, optixFlowConfig, background, spacing, pattern, containerClassName, patternOpacity, }: BlogFilteredResultsProps): React.JSX.Element;
148
152
 
149
153
  export { BlogFilteredResultsComponent as BlogFilteredResults, type BlogFilteredResultsProps, type BreadcrumbItemType, type CategoryFilter };
package/dist/blog-filtered-results.d.ts CHANGED
@@ -133,6 +133,10 @@ interface BlogFilteredResultsProps {
133
133
  * Vertical spacing for the section
134
134
  */
135
135
  spacing?: SectionSpacing;
136
+ /**
137
+ * Additional CSS classes for the container
138
+ */
139
+ containerClassName?: string;
136
140
  /**
137
141
  * Optional background pattern name or URL
138
142
  */
@@ -144,6 +148,6 @@ interface BlogFilteredResultsProps {
144
148
  /** Optional Section ID */
145
149
  sectionId?: string;
146
150
  }
147
- declare function BlogFilteredResultsComponent({ sectionId, heading, description, allContentHeading, breadcrumb, breadcrumbSlot, primaryPost, primaryPostSlot, posts, postsSlot, categories, categoriesSlot, postsPerPage, loadMoreAction, loadMoreSlot, className, heroClassName, headingClassName, descriptionClassName, primaryPostClassName, allContentClassName, allContentHeadingClassName, categoriesClassName, postsClassName, postCardClassName, loadMoreClassName, optixFlowConfig, background, spacing, pattern, patternOpacity, }: BlogFilteredResultsProps): React.JSX.Element;
151
+ declare function BlogFilteredResultsComponent({ sectionId, heading, description, allContentHeading, breadcrumb, breadcrumbSlot, primaryPost, primaryPostSlot, posts, postsSlot, categories, categoriesSlot, postsPerPage, loadMoreAction, loadMoreSlot, className, heroClassName, headingClassName, descriptionClassName, primaryPostClassName, allContentClassName, allContentHeadingClassName, categoriesClassName, postsClassName, postCardClassName, loadMoreClassName, optixFlowConfig, background, spacing, pattern, containerClassName, patternOpacity, }: BlogFilteredResultsProps): React.JSX.Element;
148
152
 
149
153
  export { BlogFilteredResultsComponent as BlogFilteredResults, type BlogFilteredResultsProps, type BreadcrumbItemType, type CategoryFilter };
package/dist/blog-filtered-results.js CHANGED
@@ -16,36 +16,6 @@ import * as LabelPrimitive from '@radix-ui/react-label';
16
16
  function cn(...inputs) {
17
17
  return twMerge(clsx(inputs));
18
18
  }
19
- function getNestedCardBg(parentBg, variant = "muted", options) {
20
- const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
21
- if (isDark) {
22
- switch (variant) {
23
- case "muted":
24
- return "bg-background";
25
- case "card":
26
- return "bg-card";
27
- case "accent":
28
- return "bg-accent";
29
- case "subtle":
30
- return "bg-background/50";
31
- }
32
- } else {
33
- switch (variant) {
34
- case "muted":
35
- return "bg-muted";
36
- case "card":
37
- return "bg-card";
38
- case "accent":
39
- return "bg-accent";
40
- case "subtle":
41
- return "bg-muted/50";
42
- }
43
- }
44
- }
45
- function getNestedCardTextColor(parentBg, options) {
46
- const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
47
- return isDark ? "text-foreground" : "";
48
- }
49
19
  function AspectRatio({
50
20
  ...props
51
21
  }) {
@@ -669,8 +639,9 @@ function BlogFilteredResultsComponent({
669
639
  loadMoreClassName,
670
640
  optixFlowConfig,
671
641
  background,
672
- spacing = "pt-6 pb-16 lg:pt-12 lg:pb-32",
642
+ spacing = "hero",
673
643
  pattern,
644
+ containerClassName = "mx-auto w-full px-4 lg:px-8 max-w-full md:max-w-7xl relative z-10 flex justify-center",
674
645
  patternOpacity
675
646
  }) {
676
647
  const effectivePostsPerPage = postsPerPage || POSTS_PER_PAGE;
@@ -804,14 +775,14 @@ function BlogFilteredResultsComponent({
804
775
  className: cn(className),
805
776
  pattern,
806
777
  patternOpacity,
778
+ containerClassName,
807
779
  children: [
808
780
  /* @__PURE__ */ jsx(
809
781
  "div",
810
782
  {
811
783
  className: cn(
812
784
  "bg-size-[3.125rem_3.125rem] bg-repeat rounded-2xl shadow-xl",
813
- getNestedCardBg(background),
814
- getNestedCardTextColor(background),
785
+ "bg-muted text-muted-foreground",
815
786
  heroClassName
816
787
  ),
817
788
  children: /* @__PURE__ */ jsxs("div", { className: "w-full flex flex-col items-start justify-start gap-6 md:gap-16 p-6 md:p-20 lg:flex-row lg:items-center lg:justify-between", children: [
package/dist/blog-horizontal-timeline.cjs CHANGED
@@ -6,8 +6,8 @@ var clsx = require('clsx');
6
6
  var tailwindMerge = require('tailwind-merge');
7
7
  var img = require('@page-speed/img');
8
8
  var pressable = require('@page-speed/pressable');
9
- var jsxRuntime = require('react/jsx-runtime');
10
9
  var icon = require('@page-speed/icon');
10
+ var jsxRuntime = require('react/jsx-runtime');
11
11
 
12
12
  function _interopNamespace(e) {
13
13
  if (e && e.__esModule) return e;
@@ -33,29 +33,6 @@ var React__namespace = /*#__PURE__*/_interopNamespace(React);
33
33
  function cn(...inputs) {
34
34
  return tailwindMerge.twMerge(clsx.clsx(inputs));
35
35
  }
36
- function Card({ className, ...props }) {
37
- return /* @__PURE__ */ jsxRuntime.jsx(
38
- "div",
39
- {
40
- "data-slot": "card",
41
- className: cn(
42
- "bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
43
- className
44
- ),
45
- ...props
46
- }
47
- );
48
- }
49
- function CardContent({ className, ...props }) {
50
- return /* @__PURE__ */ jsxRuntime.jsx(
51
- "div",
52
- {
53
- "data-slot": "card-content",
54
- className: cn("px-6", className),
55
- ...props
56
- }
57
- );
58
- }
59
36
  var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
60
37
  var DynamicIcon = React__namespace.memo(function DynamicIcon2({
61
38
  apiKey,
@@ -447,7 +424,7 @@ function BlogHorizontalTimelineComponent({
447
424
  postsSlot,
448
425
  readText,
449
426
  className,
450
- containerClassName,
427
+ containerClassName = "mx-auto w-full px-4 lg:px-8 max-w-full md:max-w-7xl relative z-10 flex justify-center",
451
428
  headingClassName,
452
429
  postsClassName,
453
430
  postItemClassName,
@@ -495,13 +472,13 @@ function BlogHorizontalTimelineComponent({
495
472
  }
496
473
  ),
497
474
  /* @__PURE__ */ jsxRuntime.jsx(
498
- Card,
475
+ "div",
499
476
  {
500
477
  className: cn(
501
478
  "w-full border-none shadow-none pt-0 pb-6 md:pt-6 md:pb-6",
502
479
  postCardClassName
503
480
  ),
504
- children: /* @__PURE__ */ jsxRuntime.jsx(CardContent, { className: "p-0", children: /* @__PURE__ */ jsxRuntime.jsxs(
481
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-0", children: /* @__PURE__ */ jsxRuntime.jsxs(
505
482
  "div",
506
483
  {
507
484
  className: cn(
@@ -511,11 +488,11 @@ function BlogHorizontalTimelineComponent({
511
488
  children: [
512
489
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col items-start gap-2 md:h-full md:justify-between md:pr-8", children: [
513
490
  post.title && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-bold tracking-tight line-clamp-2", children: post.title }),
514
- postDate && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-semibold tracking-widest text-muted-foreground uppercase md:mt-2 md:text-sm", children: postDate })
491
+ postDate && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-semibold tracking-widest uppercase md:mt-2 md:text-sm opacity-75", children: postDate })
515
492
  ] }),
516
493
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col items-start gap-4 md:h-full md:justify-between md:gap-6", children: [
517
494
  postDescription && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base leading-relaxed font-normal tracking-tight text-muted-foreground md:text-xl line-clamp-3", children: postDescription }),
518
- readText && /* @__PURE__ */ jsxRuntime.jsxs(pressable.Pressable, { href: postHref, asButton: true, variant: "ghost", children: [
495
+ readText && /* @__PURE__ */ jsxRuntime.jsxs(pressable.Pressable, { href: postHref, asButton: true, variant: "outline", children: [
519
496
  readText,
520
497
  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/arrow-up-right", size: 20 })
521
498
  ] })
@@ -548,7 +525,8 @@ function BlogHorizontalTimelineComponent({
548
525
  className: cn(className),
549
526
  pattern,
550
527
  patternOpacity,
551
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container", containerClassName), children: [
528
+ containerClassName,
529
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
552
530
  heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
553
531
  "h1",
554
532
  {
@@ -558,7 +536,7 @@ function BlogHorizontalTimelineComponent({
558
536
  ),
559
537
  children: heading
560
538
  }
561
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-12", headingClassName), children: heading })),
539
+ ) : heading),
562
540
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-col gap-0 md:gap-20", postsClassName), children: renderPosts })
563
541
  ] })
564
542
  }
package/dist/blog-horizontal-timeline.js CHANGED
@@ -5,36 +5,13 @@ import { clsx } from 'clsx';
5
5
  import { twMerge } from 'tailwind-merge';
6
6
  import { Img } from '@page-speed/img';
7
7
  import { Pressable } from '@page-speed/pressable';
8
- import { jsx, jsxs } from 'react/jsx-runtime';
9
8
  import { Icon } from '@page-speed/icon';
9
+ import { jsx, jsxs } from 'react/jsx-runtime';
10
10
 
11
11
  // components/blocks/blog/blog-horizontal-timeline.tsx
12
12
  function cn(...inputs) {
13
13
  return twMerge(clsx(inputs));
14
14
  }
15
- function Card({ className, ...props }) {
16
- return /* @__PURE__ */ jsx(
17
- "div",
18
- {
19
- "data-slot": "card",
20
- className: cn(
21
- "bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm",
22
- className
23
- ),
24
- ...props
25
- }
26
- );
27
- }
28
- function CardContent({ className, ...props }) {
29
- return /* @__PURE__ */ jsx(
30
- "div",
31
- {
32
- "data-slot": "card-content",
33
- className: cn("px-6", className),
34
- ...props
35
- }
36
- );
37
- }
38
15
  var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
39
16
  var DynamicIcon = React.memo(function DynamicIcon2({
40
17
  apiKey,
@@ -426,7 +403,7 @@ function BlogHorizontalTimelineComponent({
426
403
  postsSlot,
427
404
  readText,
428
405
  className,
429
- containerClassName,
406
+ containerClassName = "mx-auto w-full px-4 lg:px-8 max-w-full md:max-w-7xl relative z-10 flex justify-center",
430
407
  headingClassName,
431
408
  postsClassName,
432
409
  postItemClassName,
@@ -474,13 +451,13 @@ function BlogHorizontalTimelineComponent({
474
451
  }
475
452
  ),
476
453
  /* @__PURE__ */ jsx(
477
- Card,
454
+ "div",
478
455
  {
479
456
  className: cn(
480
457
  "w-full border-none shadow-none pt-0 pb-6 md:pt-6 md:pb-6",
481
458
  postCardClassName
482
459
  ),
483
- children: /* @__PURE__ */ jsx(CardContent, { className: "p-0", children: /* @__PURE__ */ jsxs(
460
+ children: /* @__PURE__ */ jsx("div", { className: "p-0", children: /* @__PURE__ */ jsxs(
484
461
  "div",
485
462
  {
486
463
  className: cn(
@@ -490,11 +467,11 @@ function BlogHorizontalTimelineComponent({
490
467
  children: [
491
468
  /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col items-start gap-2 md:h-full md:justify-between md:pr-8", children: [
492
469
  post.title && /* @__PURE__ */ jsx("h2", { className: "text-lg font-bold tracking-tight line-clamp-2", children: post.title }),
493
- postDate && /* @__PURE__ */ jsx("p", { className: "text-xs font-semibold tracking-widest text-muted-foreground uppercase md:mt-2 md:text-sm", children: postDate })
470
+ postDate && /* @__PURE__ */ jsx("p", { className: "text-xs font-semibold tracking-widest uppercase md:mt-2 md:text-sm opacity-75", children: postDate })
494
471
  ] }),
495
472
  /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col items-start gap-4 md:h-full md:justify-between md:gap-6", children: [
496
473
  postDescription && /* @__PURE__ */ jsx("p", { className: "text-base leading-relaxed font-normal tracking-tight text-muted-foreground md:text-xl line-clamp-3", children: postDescription }),
497
- readText && /* @__PURE__ */ jsxs(Pressable, { href: postHref, asButton: true, variant: "ghost", children: [
474
+ readText && /* @__PURE__ */ jsxs(Pressable, { href: postHref, asButton: true, variant: "outline", children: [
498
475
  readText,
499
476
  /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/arrow-up-right", size: 20 })
500
477
  ] })
@@ -527,7 +504,8 @@ function BlogHorizontalTimelineComponent({
527
504
  className: cn(className),
528
505
  pattern,
529
506
  patternOpacity,
530
- children: /* @__PURE__ */ jsxs("div", { className: cn("container", containerClassName), children: [
507
+ containerClassName,
508
+ children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
531
509
  heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
532
510
  "h1",
533
511
  {
@@ -537,7 +515,7 @@ function BlogHorizontalTimelineComponent({
537
515
  ),
538
516
  children: heading
539
517
  }
540
- ) : /* @__PURE__ */ jsx("div", { className: cn("mb-12", headingClassName), children: heading })),
518
+ ) : heading),
541
519
  /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-0 md:gap-20", postsClassName), children: renderPosts })
542
520
  ] })
543
521
  }
package/dist/registry.cjs CHANGED
@@ -37067,8 +37067,9 @@ function BlogFilteredResultsComponent({
37067
37067
  loadMoreClassName,
37068
37068
  optixFlowConfig,
37069
37069
  background,
37070
- spacing = "pt-6 pb-16 lg:pt-12 lg:pb-32",
37070
+ spacing = "hero",
37071
37071
  pattern,
37072
+ containerClassName = "mx-auto w-full px-4 lg:px-8 max-w-full md:max-w-7xl relative z-10 flex justify-center",
37072
37073
  patternOpacity
37073
37074
  }) {
37074
37075
  const effectivePostsPerPage = postsPerPage || POSTS_PER_PAGE;
@@ -37202,14 +37203,14 @@ function BlogFilteredResultsComponent({
37202
37203
  className: cn(className),
37203
37204
  pattern,
37204
37205
  patternOpacity,
37206
+ containerClassName,
37205
37207
  children: [
37206
37208
  /* @__PURE__ */ jsxRuntime.jsx(
37207
37209
  "div",
37208
37210
  {
37209
37211
  className: cn(
37210
37212
  "bg-size-[3.125rem_3.125rem] bg-repeat rounded-2xl shadow-xl",
37211
- getNestedCardBg(background),
37212
- getNestedCardTextColor(background),
37213
+ "bg-muted text-muted-foreground",
37213
37214
  heroClassName
37214
37215
  ),
37215
37216
  children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full flex flex-col items-start justify-start gap-6 md:gap-16 p-6 md:p-20 lg:flex-row lg:items-center lg:justify-between", children: [
@@ -37427,7 +37428,7 @@ function BlogHorizontalTimelineComponent({
37427
37428
  postsSlot,
37428
37429
  readText,
37429
37430
  className,
37430
- containerClassName,
37431
+ containerClassName = "mx-auto w-full px-4 lg:px-8 max-w-full md:max-w-7xl relative z-10 flex justify-center",
37431
37432
  headingClassName,
37432
37433
  postsClassName,
37433
37434
  postItemClassName,
@@ -37475,13 +37476,13 @@ function BlogHorizontalTimelineComponent({
37475
37476
  }
37476
37477
  ),
37477
37478
  /* @__PURE__ */ jsxRuntime.jsx(
37478
- Card,
37479
+ "div",
37479
37480
  {
37480
37481
  className: cn(
37481
37482
  "w-full border-none shadow-none pt-0 pb-6 md:pt-6 md:pb-6",
37482
37483
  postCardClassName
37483
37484
  ),
37484
- children: /* @__PURE__ */ jsxRuntime.jsx(CardContent, { className: "p-0", children: /* @__PURE__ */ jsxRuntime.jsxs(
37485
+ children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-0", children: /* @__PURE__ */ jsxRuntime.jsxs(
37485
37486
  "div",
37486
37487
  {
37487
37488
  className: cn(
@@ -37491,11 +37492,11 @@ function BlogHorizontalTimelineComponent({
37491
37492
  children: [
37492
37493
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col items-start gap-2 md:h-full md:justify-between md:pr-8", children: [
37493
37494
  post.title && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-bold tracking-tight line-clamp-2", children: post.title }),
37494
- postDate && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-semibold tracking-widest text-muted-foreground uppercase md:mt-2 md:text-sm", children: postDate })
37495
+ postDate && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-semibold tracking-widest uppercase md:mt-2 md:text-sm opacity-75", children: postDate })
37495
37496
  ] }),
37496
37497
  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col items-start gap-4 md:h-full md:justify-between md:gap-6", children: [
37497
37498
  postDescription && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base leading-relaxed font-normal tracking-tight text-muted-foreground md:text-xl line-clamp-3", children: postDescription }),
37498
- readText && /* @__PURE__ */ jsxRuntime.jsxs(pressable.Pressable, { href: postHref, asButton: true, variant: "ghost", children: [
37499
+ readText && /* @__PURE__ */ jsxRuntime.jsxs(pressable.Pressable, { href: postHref, asButton: true, variant: "outline", children: [
37499
37500
  readText,
37500
37501
  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/arrow-up-right", size: 20 })
37501
37502
  ] })
@@ -37528,7 +37529,8 @@ function BlogHorizontalTimelineComponent({
37528
37529
  className: cn(className),
37529
37530
  pattern,
37530
37531
  patternOpacity,
37531
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container", containerClassName), children: [
37532
+ containerClassName,
37533
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
37532
37534
  heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
37533
37535
  "h1",
37534
37536
  {
@@ -37538,7 +37540,7 @@ function BlogHorizontalTimelineComponent({
37538
37540
  ),
37539
37541
  children: heading
37540
37542
  }
37541
- ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-12", headingClassName), children: heading })),
37543
+ ) : heading),
37542
37544
  /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-col gap-0 md:gap-20", postsClassName), children: renderPosts })
37543
37545
  ] })
37544
37546
  }
package/dist/registry.js CHANGED
@@ -37027,8 +37027,9 @@ function BlogFilteredResultsComponent({
37027
37027
  loadMoreClassName,
37028
37028
  optixFlowConfig,
37029
37029
  background,
37030
- spacing = "pt-6 pb-16 lg:pt-12 lg:pb-32",
37030
+ spacing = "hero",
37031
37031
  pattern,
37032
+ containerClassName = "mx-auto w-full px-4 lg:px-8 max-w-full md:max-w-7xl relative z-10 flex justify-center",
37032
37033
  patternOpacity
37033
37034
  }) {
37034
37035
  const effectivePostsPerPage = postsPerPage || POSTS_PER_PAGE;
@@ -37162,14 +37163,14 @@ function BlogFilteredResultsComponent({
37162
37163
  className: cn(className),
37163
37164
  pattern,
37164
37165
  patternOpacity,
37166
+ containerClassName,
37165
37167
  children: [
37166
37168
  /* @__PURE__ */ jsx(
37167
37169
  "div",
37168
37170
  {
37169
37171
  className: cn(
37170
37172
  "bg-size-[3.125rem_3.125rem] bg-repeat rounded-2xl shadow-xl",
37171
- getNestedCardBg(background),
37172
- getNestedCardTextColor(background),
37173
+ "bg-muted text-muted-foreground",
37173
37174
  heroClassName
37174
37175
  ),
37175
37176
  children: /* @__PURE__ */ jsxs("div", { className: "w-full flex flex-col items-start justify-start gap-6 md:gap-16 p-6 md:p-20 lg:flex-row lg:items-center lg:justify-between", children: [
@@ -37387,7 +37388,7 @@ function BlogHorizontalTimelineComponent({
37387
37388
  postsSlot,
37388
37389
  readText,
37389
37390
  className,
37390
- containerClassName,
37391
+ containerClassName = "mx-auto w-full px-4 lg:px-8 max-w-full md:max-w-7xl relative z-10 flex justify-center",
37391
37392
  headingClassName,
37392
37393
  postsClassName,
37393
37394
  postItemClassName,
@@ -37435,13 +37436,13 @@ function BlogHorizontalTimelineComponent({
37435
37436
  }
37436
37437
  ),
37437
37438
  /* @__PURE__ */ jsx(
37438
- Card,
37439
+ "div",
37439
37440
  {
37440
37441
  className: cn(
37441
37442
  "w-full border-none shadow-none pt-0 pb-6 md:pt-6 md:pb-6",
37442
37443
  postCardClassName
37443
37444
  ),
37444
- children: /* @__PURE__ */ jsx(CardContent, { className: "p-0", children: /* @__PURE__ */ jsxs(
37445
+ children: /* @__PURE__ */ jsx("div", { className: "p-0", children: /* @__PURE__ */ jsxs(
37445
37446
  "div",
37446
37447
  {
37447
37448
  className: cn(
@@ -37451,11 +37452,11 @@ function BlogHorizontalTimelineComponent({
37451
37452
  children: [
37452
37453
  /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col items-start gap-2 md:h-full md:justify-between md:pr-8", children: [
37453
37454
  post.title && /* @__PURE__ */ jsx("h2", { className: "text-lg font-bold tracking-tight line-clamp-2", children: post.title }),
37454
- postDate && /* @__PURE__ */ jsx("p", { className: "text-xs font-semibold tracking-widest text-muted-foreground uppercase md:mt-2 md:text-sm", children: postDate })
37455
+ postDate && /* @__PURE__ */ jsx("p", { className: "text-xs font-semibold tracking-widest uppercase md:mt-2 md:text-sm opacity-75", children: postDate })
37455
37456
  ] }),
37456
37457
  /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-col items-start gap-4 md:h-full md:justify-between md:gap-6", children: [
37457
37458
  postDescription && /* @__PURE__ */ jsx("p", { className: "text-base leading-relaxed font-normal tracking-tight text-muted-foreground md:text-xl line-clamp-3", children: postDescription }),
37458
- readText && /* @__PURE__ */ jsxs(Pressable, { href: postHref, asButton: true, variant: "ghost", children: [
37459
+ readText && /* @__PURE__ */ jsxs(Pressable, { href: postHref, asButton: true, variant: "outline", children: [
37459
37460
  readText,
37460
37461
  /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/arrow-up-right", size: 20 })
37461
37462
  ] })
@@ -37488,7 +37489,8 @@ function BlogHorizontalTimelineComponent({
37488
37489
  className: cn(className),
37489
37490
  pattern,
37490
37491
  patternOpacity,
37491
- children: /* @__PURE__ */ jsxs("div", { className: cn("container", containerClassName), children: [
37492
+ containerClassName,
37493
+ children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
37492
37494
  heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
37493
37495
  "h1",
37494
37496
  {
@@ -37498,7 +37500,7 @@ function BlogHorizontalTimelineComponent({
37498
37500
  ),
37499
37501
  children: heading
37500
37502
  }
37501
- ) : /* @__PURE__ */ jsx("div", { className: cn("mb-12", headingClassName), children: heading })),
37503
+ ) : heading),
37502
37504
  /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-0 md:gap-20", postsClassName), children: renderPosts })
37503
37505
  ] })
37504
37506
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opensite/ui",
3
- "version": "3.1.9",
3
+ "version": "3.2.0",
4
4
  "description": "Foundational UI component library for OpenSite Semantic Site Builder with tree-shakable exports and abstract styling",
5
5
  "keywords": [
6
6
  "react",