@opensite/ui 3.2.9 → 3.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.
@@ -4,11 +4,11 @@
4
4
  var React = require('react');
5
5
  var clsx = require('clsx');
6
6
  var tailwindMerge = require('tailwind-merge');
7
- var pressable = require('@page-speed/pressable');
8
7
  var icon = require('@page-speed/icon');
9
8
  var jsxRuntime = require('react/jsx-runtime');
10
9
  var reactSlot = require('@radix-ui/react-slot');
11
10
  var classVarianceAuthority = require('class-variance-authority');
11
+ var pressable = require('@page-speed/pressable');
12
12
 
13
13
  function _interopNamespace(e) {
14
14
  if (e && e.__esModule) return e;
@@ -545,22 +545,6 @@ function AboutExpandableValues({
545
545
  const toggleExpand = React.useCallback((id) => {
546
546
  setExpandedValue((prev) => prev === id ? null : id);
547
547
  }, []);
548
- React.useMemo(() => {
549
- if (actionsSlot) return actionsSlot;
550
- if (!actions || actions.length === 0) return null;
551
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: actionsClassName, children: actions.map((action, idx) => /* @__PURE__ */ jsxRuntime.jsx(
552
- pressable.Pressable,
553
- {
554
- href: action.href,
555
- onClick: action.onClick,
556
- variant: action.variant || "default",
557
- size: action.size,
558
- asButton: true,
559
- children: action.label
560
- },
561
- idx
562
- )) });
563
- }, [actionsSlot, actions, actionsClassName]);
564
548
  const valuesContent = React.useMemo(() => {
565
549
  if (valuesSlot) return valuesSlot;
566
550
  if (!values || values.length === 0) return null;
@@ -674,7 +658,7 @@ function AboutExpandableValues({
674
658
  "relative mt-8 rounded-lg p-8 bg-muted text-muted-foreground",
675
659
  ctaClassName
676
660
  ),
677
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-3xl space-y-6 text-center flex flex-col items-center gap-6", children: [
661
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-3xl text-center flex flex-col items-center gap-4", children: [
678
662
  ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
679
663
  ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(ctaDescriptionClassName), children: ctaDescription }) : ctaDescription),
680
664
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -3,11 +3,11 @@ import * as React from 'react';
3
3
  import React__default, { useCallback, useMemo } from 'react';
4
4
  import { clsx } from 'clsx';
5
5
  import { twMerge } from 'tailwind-merge';
6
- import { Pressable } from '@page-speed/pressable';
7
6
  import { Icon } from '@page-speed/icon';
8
7
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
9
8
  import { Slot } from '@radix-ui/react-slot';
10
9
  import { cva } from 'class-variance-authority';
10
+ import { Pressable } from '@page-speed/pressable';
11
11
 
12
12
  // components/blocks/about/about-expandable-values.tsx
13
13
  function cn(...inputs) {
@@ -524,22 +524,6 @@ function AboutExpandableValues({
524
524
  const toggleExpand = useCallback((id) => {
525
525
  setExpandedValue((prev) => prev === id ? null : id);
526
526
  }, []);
527
- useMemo(() => {
528
- if (actionsSlot) return actionsSlot;
529
- if (!actions || actions.length === 0) return null;
530
- return /* @__PURE__ */ jsx("div", { className: actionsClassName, children: actions.map((action, idx) => /* @__PURE__ */ jsx(
531
- Pressable,
532
- {
533
- href: action.href,
534
- onClick: action.onClick,
535
- variant: action.variant || "default",
536
- size: action.size,
537
- asButton: true,
538
- children: action.label
539
- },
540
- idx
541
- )) });
542
- }, [actionsSlot, actions, actionsClassName]);
543
527
  const valuesContent = useMemo(() => {
544
528
  if (valuesSlot) return valuesSlot;
545
529
  if (!values || values.length === 0) return null;
@@ -653,7 +637,7 @@ function AboutExpandableValues({
653
637
  "relative mt-8 rounded-lg p-8 bg-muted text-muted-foreground",
654
638
  ctaClassName
655
639
  ),
656
- children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-3xl space-y-6 text-center flex flex-col items-center gap-6", children: [
640
+ children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-3xl text-center flex flex-col items-center gap-4", children: [
657
641
  ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsx("h3", { className: cn("text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
658
642
  ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsx("p", { className: cn(ctaDescriptionClassName), children: ctaDescription }) : ctaDescription),
659
643
  /* @__PURE__ */ jsx(
@@ -423,15 +423,7 @@ function AboutMinimalStory({
423
423
  className: "h-16 w-16 rounded-full object-cover",
424
424
  optixFlowConfig
425
425
  }
426
- ) : /* @__PURE__ */ jsxRuntime.jsx(
427
- "div",
428
- {
429
- className: cn(
430
- "flex h-16 w-16 items-center justify-center rounded-full text-2xl font-bold"
431
- ),
432
- children: author.name.charAt(0)
433
- }
434
- ),
426
+ ) : null,
435
427
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
436
428
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-semibold", children: author.name }),
437
429
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm", children: author.role })
@@ -417,15 +417,7 @@ function AboutMinimalStory({
417
417
  className: "h-16 w-16 rounded-full object-cover",
418
418
  optixFlowConfig
419
419
  }
420
- ) : /* @__PURE__ */ jsx(
421
- "div",
422
- {
423
- className: cn(
424
- "flex h-16 w-16 items-center justify-center rounded-full text-2xl font-bold"
425
- ),
426
- children: author.name.charAt(0)
427
- }
428
- ),
420
+ ) : null,
429
421
  /* @__PURE__ */ jsxs("div", { children: [
430
422
  /* @__PURE__ */ jsx("p", { className: "font-semibold", children: author.name }),
431
423
  /* @__PURE__ */ jsx("p", { className: "text-sm", children: author.role })
@@ -554,13 +554,13 @@ function AboutStartupTeam({
554
554
  if (sidebarSlot) return null;
555
555
  if (!effectiveTabs || effectiveTabs.length === 0) return null;
556
556
  if (!teamMembers || teamMembers.length === 0) return null;
557
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full min-w-0 max-w-[calc(100vw-1rem)] overflow-hidden sm:max-w-[calc(100vw-2rem)] lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "-mx-2 flex gap-2 overflow-x-auto px-2 pb-2", children: effectiveTabs.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(
557
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full min-w-0 max-w-full overflow-hidden lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "flex w-full min-w-0 gap-2 overflow-x-auto pb-2", children: effectiveTabs.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(
558
558
  pressable.Pressable,
559
559
  {
560
560
  componentType: "button",
561
561
  onClick: () => handleTabChange(link.value),
562
562
  className: cn(
563
- "shrink-0 rounded-lg px-4 py-2 text-sm font-medium transition-colors",
563
+ "shrink-0 whitespace-nowrap rounded-lg px-4 py-2 text-sm font-medium transition-colors",
564
564
  activeTab === link.value ? "bg-primary text-primary-foreground" : "bg-card text-card-foreground hover:bg-primary hover:text-primary-foreground"
565
565
  ),
566
566
  children: link.label
@@ -589,7 +589,7 @@ function AboutStartupTeam({
589
589
  children: renderTabsNav
590
590
  }
591
591
  ),
592
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "lg:col-span-3", children: [
592
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 lg:col-span-3", children: [
593
593
  title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
594
594
  "h1",
595
595
  {
@@ -533,13 +533,13 @@ function AboutStartupTeam({
533
533
  if (sidebarSlot) return null;
534
534
  if (!effectiveTabs || effectiveTabs.length === 0) return null;
535
535
  if (!teamMembers || teamMembers.length === 0) return null;
536
- return /* @__PURE__ */ jsx("div", { className: "w-full min-w-0 max-w-[calc(100vw-1rem)] overflow-hidden sm:max-w-[calc(100vw-2rem)] lg:hidden", children: /* @__PURE__ */ jsx("nav", { className: "-mx-2 flex gap-2 overflow-x-auto px-2 pb-2", children: effectiveTabs.map((link, idx) => /* @__PURE__ */ jsx(
536
+ return /* @__PURE__ */ jsx("div", { className: "w-full min-w-0 max-w-full overflow-hidden lg:hidden", children: /* @__PURE__ */ jsx("nav", { className: "flex w-full min-w-0 gap-2 overflow-x-auto pb-2", children: effectiveTabs.map((link, idx) => /* @__PURE__ */ jsx(
537
537
  Pressable,
538
538
  {
539
539
  componentType: "button",
540
540
  onClick: () => handleTabChange(link.value),
541
541
  className: cn(
542
- "shrink-0 rounded-lg px-4 py-2 text-sm font-medium transition-colors",
542
+ "shrink-0 whitespace-nowrap rounded-lg px-4 py-2 text-sm font-medium transition-colors",
543
543
  activeTab === link.value ? "bg-primary text-primary-foreground" : "bg-card text-card-foreground hover:bg-primary hover:text-primary-foreground"
544
544
  ),
545
545
  children: link.label
@@ -568,7 +568,7 @@ function AboutStartupTeam({
568
568
  children: renderTabsNav
569
569
  }
570
570
  ),
571
- /* @__PURE__ */ jsxs("div", { className: "lg:col-span-3", children: [
571
+ /* @__PURE__ */ jsxs("div", { className: "min-w-0 lg:col-span-3", children: [
572
572
  title && (typeof title === "string" ? /* @__PURE__ */ jsx(
573
573
  "h1",
574
574
  {
@@ -469,7 +469,7 @@ function AboutStoryHero({
469
469
  {
470
470
  className: cn(
471
471
  "rounded-2xl bg-muted text-muted-foreground",
472
- "flex flex-col items-start gap-2",
472
+ "flex flex-col items-start gap-2 p-6",
473
473
  teamInfoClassName
474
474
  ),
475
475
  children: [
@@ -448,7 +448,7 @@ function AboutStoryHero({
448
448
  {
449
449
  className: cn(
450
450
  "rounded-2xl bg-muted text-muted-foreground",
451
- "flex flex-col items-start gap-2",
451
+ "flex flex-col items-start gap-2 p-6",
452
452
  teamInfoClassName
453
453
  ),
454
454
  children: [
@@ -2008,22 +2008,6 @@ function AboutExpandableValues({
2008
2008
  const toggleExpand = React4.useCallback((id) => {
2009
2009
  setExpandedValue((prev) => prev === id ? null : id);
2010
2010
  }, []);
2011
- React4.useMemo(() => {
2012
- if (actionsSlot) return actionsSlot;
2013
- if (!actions || actions.length === 0) return null;
2014
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: actionsClassName, children: actions.map((action, idx) => /* @__PURE__ */ jsxRuntime.jsx(
2015
- pressable.Pressable,
2016
- {
2017
- href: action.href,
2018
- onClick: action.onClick,
2019
- variant: action.variant || "default",
2020
- size: action.size,
2021
- asButton: true,
2022
- children: action.label
2023
- },
2024
- idx
2025
- )) });
2026
- }, [actionsSlot, actions, actionsClassName]);
2027
2011
  const valuesContent = React4.useMemo(() => {
2028
2012
  if (valuesSlot) return valuesSlot;
2029
2013
  if (!values || values.length === 0) return null;
@@ -2137,7 +2121,7 @@ function AboutExpandableValues({
2137
2121
  "relative mt-8 rounded-lg p-8 bg-muted text-muted-foreground",
2138
2122
  ctaClassName
2139
2123
  ),
2140
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-3xl space-y-6 text-center flex flex-col items-center gap-6", children: [
2124
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-3xl text-center flex flex-col items-center gap-4", children: [
2141
2125
  ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
2142
2126
  ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(ctaDescriptionClassName), children: ctaDescription }) : ctaDescription),
2143
2127
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -1985,22 +1985,6 @@ function AboutExpandableValues({
1985
1985
  const toggleExpand = useCallback((id) => {
1986
1986
  setExpandedValue((prev) => prev === id ? null : id);
1987
1987
  }, []);
1988
- useMemo(() => {
1989
- if (actionsSlot) return actionsSlot;
1990
- if (!actions || actions.length === 0) return null;
1991
- return /* @__PURE__ */ jsx("div", { className: actionsClassName, children: actions.map((action, idx) => /* @__PURE__ */ jsx(
1992
- Pressable,
1993
- {
1994
- href: action.href,
1995
- onClick: action.onClick,
1996
- variant: action.variant || "default",
1997
- size: action.size,
1998
- asButton: true,
1999
- children: action.label
2000
- },
2001
- idx
2002
- )) });
2003
- }, [actionsSlot, actions, actionsClassName]);
2004
1988
  const valuesContent = useMemo(() => {
2005
1989
  if (valuesSlot) return valuesSlot;
2006
1990
  if (!values || values.length === 0) return null;
@@ -2114,7 +2098,7 @@ function AboutExpandableValues({
2114
2098
  "relative mt-8 rounded-lg p-8 bg-muted text-muted-foreground",
2115
2099
  ctaClassName
2116
2100
  ),
2117
- children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-3xl space-y-6 text-center flex flex-col items-center gap-6", children: [
2101
+ children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-3xl text-center flex flex-col items-center gap-4", children: [
2118
2102
  ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsx("h3", { className: cn("text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
2119
2103
  ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsx("p", { className: cn(ctaDescriptionClassName), children: ctaDescription }) : ctaDescription),
2120
2104
  /* @__PURE__ */ jsx(
package/dist/index.cjs CHANGED
@@ -2069,22 +2069,6 @@ function AboutExpandableValues({
2069
2069
  const toggleExpand = React4.useCallback((id) => {
2070
2070
  setExpandedValue((prev) => prev === id ? null : id);
2071
2071
  }, []);
2072
- React4.useMemo(() => {
2073
- if (actionsSlot) return actionsSlot;
2074
- if (!actions || actions.length === 0) return null;
2075
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: actionsClassName, children: actions.map((action, idx) => /* @__PURE__ */ jsxRuntime.jsx(
2076
- pressable.Pressable,
2077
- {
2078
- href: action.href,
2079
- onClick: action.onClick,
2080
- variant: action.variant || "default",
2081
- size: action.size,
2082
- asButton: true,
2083
- children: action.label
2084
- },
2085
- idx
2086
- )) });
2087
- }, [actionsSlot, actions, actionsClassName]);
2088
2072
  const valuesContent = React4.useMemo(() => {
2089
2073
  if (valuesSlot) return valuesSlot;
2090
2074
  if (!values || values.length === 0) return null;
@@ -2198,7 +2182,7 @@ function AboutExpandableValues({
2198
2182
  "relative mt-8 rounded-lg p-8 bg-muted text-muted-foreground",
2199
2183
  ctaClassName
2200
2184
  ),
2201
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-3xl space-y-6 text-center flex flex-col items-center gap-6", children: [
2185
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-3xl text-center flex flex-col items-center gap-4", children: [
2202
2186
  ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
2203
2187
  ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(ctaDescriptionClassName), children: ctaDescription }) : ctaDescription),
2204
2188
  /* @__PURE__ */ jsxRuntime.jsx(
package/dist/index.js CHANGED
@@ -2047,22 +2047,6 @@ function AboutExpandableValues({
2047
2047
  const toggleExpand = useCallback((id) => {
2048
2048
  setExpandedValue((prev) => prev === id ? null : id);
2049
2049
  }, []);
2050
- useMemo(() => {
2051
- if (actionsSlot) return actionsSlot;
2052
- if (!actions || actions.length === 0) return null;
2053
- return /* @__PURE__ */ jsx("div", { className: actionsClassName, children: actions.map((action, idx) => /* @__PURE__ */ jsx(
2054
- Pressable,
2055
- {
2056
- href: action.href,
2057
- onClick: action.onClick,
2058
- variant: action.variant || "default",
2059
- size: action.size,
2060
- asButton: true,
2061
- children: action.label
2062
- },
2063
- idx
2064
- )) });
2065
- }, [actionsSlot, actions, actionsClassName]);
2066
2050
  const valuesContent = useMemo(() => {
2067
2051
  if (valuesSlot) return valuesSlot;
2068
2052
  if (!values || values.length === 0) return null;
@@ -2176,7 +2160,7 @@ function AboutExpandableValues({
2176
2160
  "relative mt-8 rounded-lg p-8 bg-muted text-muted-foreground",
2177
2161
  ctaClassName
2178
2162
  ),
2179
- children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-3xl space-y-6 text-center flex flex-col items-center gap-6", children: [
2163
+ children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-3xl text-center flex flex-col items-center gap-4", children: [
2180
2164
  ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsx("h3", { className: cn("text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
2181
2165
  ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsx("p", { className: cn(ctaDescriptionClassName), children: ctaDescription }) : ctaDescription),
2182
2166
  /* @__PURE__ */ jsx(
package/dist/registry.cjs CHANGED
@@ -1803,22 +1803,6 @@ function AboutExpandableValues({
1803
1803
  const toggleExpand = React30.useCallback((id) => {
1804
1804
  setExpandedValue((prev) => prev === id ? null : id);
1805
1805
  }, []);
1806
- React30.useMemo(() => {
1807
- if (actionsSlot) return actionsSlot;
1808
- if (!actions || actions.length === 0) return null;
1809
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: actionsClassName, children: actions.map((action, idx) => /* @__PURE__ */ jsxRuntime.jsx(
1810
- pressable.Pressable,
1811
- {
1812
- href: action.href,
1813
- onClick: action.onClick,
1814
- variant: action.variant || "default",
1815
- size: action.size,
1816
- asButton: true,
1817
- children: action.label
1818
- },
1819
- idx
1820
- )) });
1821
- }, [actionsSlot, actions, actionsClassName]);
1822
1806
  const valuesContent = React30.useMemo(() => {
1823
1807
  if (valuesSlot) return valuesSlot;
1824
1808
  if (!values || values.length === 0) return null;
@@ -1932,7 +1916,7 @@ function AboutExpandableValues({
1932
1916
  "relative mt-8 rounded-lg p-8 bg-muted text-muted-foreground",
1933
1917
  ctaClassName
1934
1918
  ),
1935
- children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-3xl space-y-6 text-center flex flex-col items-center gap-6", children: [
1919
+ children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto max-w-3xl text-center flex flex-col items-center gap-4", children: [
1936
1920
  ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: cn("text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
1937
1921
  ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn(ctaDescriptionClassName), children: ctaDescription }) : ctaDescription),
1938
1922
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -8199,13 +8183,13 @@ function AboutStartupTeam({
8199
8183
  if (sidebarSlot) return null;
8200
8184
  if (!effectiveTabs || effectiveTabs.length === 0) return null;
8201
8185
  if (!teamMembers || teamMembers.length === 0) return null;
8202
- return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full min-w-0 max-w-[calc(100vw-1rem)] overflow-hidden sm:max-w-[calc(100vw-2rem)] lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "-mx-2 flex gap-2 overflow-x-auto px-2 pb-2", children: effectiveTabs.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(
8186
+ return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full min-w-0 max-w-full overflow-hidden lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "flex w-full min-w-0 gap-2 overflow-x-auto pb-2", children: effectiveTabs.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(
8203
8187
  pressable.Pressable,
8204
8188
  {
8205
8189
  componentType: "button",
8206
8190
  onClick: () => handleTabChange(link.value),
8207
8191
  className: cn(
8208
- "shrink-0 rounded-lg px-4 py-2 text-sm font-medium transition-colors",
8192
+ "shrink-0 whitespace-nowrap rounded-lg px-4 py-2 text-sm font-medium transition-colors",
8209
8193
  activeTab === link.value ? "bg-primary text-primary-foreground" : "bg-card text-card-foreground hover:bg-primary hover:text-primary-foreground"
8210
8194
  ),
8211
8195
  children: link.label
@@ -8234,7 +8218,7 @@ function AboutStartupTeam({
8234
8218
  children: renderTabsNav
8235
8219
  }
8236
8220
  ),
8237
- /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "lg:col-span-3", children: [
8221
+ /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 lg:col-span-3", children: [
8238
8222
  title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
8239
8223
  "h1",
8240
8224
  {
@@ -8316,15 +8300,7 @@ function AboutMinimalStory({
8316
8300
  className: "h-16 w-16 rounded-full object-cover",
8317
8301
  optixFlowConfig
8318
8302
  }
8319
- ) : /* @__PURE__ */ jsxRuntime.jsx(
8320
- "div",
8321
- {
8322
- className: cn(
8323
- "flex h-16 w-16 items-center justify-center rounded-full text-2xl font-bold"
8324
- ),
8325
- children: author.name.charAt(0)
8326
- }
8327
- ),
8303
+ ) : null,
8328
8304
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
8329
8305
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-semibold", children: author.name }),
8330
8306
  /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm", children: author.role })
@@ -8410,7 +8386,7 @@ function AboutStoryHero({
8410
8386
  {
8411
8387
  className: cn(
8412
8388
  "rounded-2xl bg-muted text-muted-foreground",
8413
- "flex flex-col items-start gap-2",
8389
+ "flex flex-col items-start gap-2 p-6",
8414
8390
  teamInfoClassName
8415
8391
  ),
8416
8392
  children: [
package/dist/registry.js CHANGED
@@ -1763,22 +1763,6 @@ function AboutExpandableValues({
1763
1763
  const toggleExpand = useCallback((id) => {
1764
1764
  setExpandedValue((prev) => prev === id ? null : id);
1765
1765
  }, []);
1766
- useMemo(() => {
1767
- if (actionsSlot) return actionsSlot;
1768
- if (!actions || actions.length === 0) return null;
1769
- return /* @__PURE__ */ jsx("div", { className: actionsClassName, children: actions.map((action, idx) => /* @__PURE__ */ jsx(
1770
- Pressable,
1771
- {
1772
- href: action.href,
1773
- onClick: action.onClick,
1774
- variant: action.variant || "default",
1775
- size: action.size,
1776
- asButton: true,
1777
- children: action.label
1778
- },
1779
- idx
1780
- )) });
1781
- }, [actionsSlot, actions, actionsClassName]);
1782
1766
  const valuesContent = useMemo(() => {
1783
1767
  if (valuesSlot) return valuesSlot;
1784
1768
  if (!values || values.length === 0) return null;
@@ -1892,7 +1876,7 @@ function AboutExpandableValues({
1892
1876
  "relative mt-8 rounded-lg p-8 bg-muted text-muted-foreground",
1893
1877
  ctaClassName
1894
1878
  ),
1895
- children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-3xl space-y-6 text-center flex flex-col items-center gap-6", children: [
1879
+ children: /* @__PURE__ */ jsxs("div", { className: "mx-auto max-w-3xl text-center flex flex-col items-center gap-4", children: [
1896
1880
  ctaHeading && (typeof ctaHeading === "string" ? /* @__PURE__ */ jsx("h3", { className: cn("text-2xl font-bold", ctaHeadingClassName), children: ctaHeading }) : ctaHeading),
1897
1881
  ctaDescription && (typeof ctaDescription === "string" ? /* @__PURE__ */ jsx("p", { className: cn(ctaDescriptionClassName), children: ctaDescription }) : ctaDescription),
1898
1882
  /* @__PURE__ */ jsx(
@@ -8159,13 +8143,13 @@ function AboutStartupTeam({
8159
8143
  if (sidebarSlot) return null;
8160
8144
  if (!effectiveTabs || effectiveTabs.length === 0) return null;
8161
8145
  if (!teamMembers || teamMembers.length === 0) return null;
8162
- return /* @__PURE__ */ jsx("div", { className: "w-full min-w-0 max-w-[calc(100vw-1rem)] overflow-hidden sm:max-w-[calc(100vw-2rem)] lg:hidden", children: /* @__PURE__ */ jsx("nav", { className: "-mx-2 flex gap-2 overflow-x-auto px-2 pb-2", children: effectiveTabs.map((link, idx) => /* @__PURE__ */ jsx(
8146
+ return /* @__PURE__ */ jsx("div", { className: "w-full min-w-0 max-w-full overflow-hidden lg:hidden", children: /* @__PURE__ */ jsx("nav", { className: "flex w-full min-w-0 gap-2 overflow-x-auto pb-2", children: effectiveTabs.map((link, idx) => /* @__PURE__ */ jsx(
8163
8147
  Pressable,
8164
8148
  {
8165
8149
  componentType: "button",
8166
8150
  onClick: () => handleTabChange(link.value),
8167
8151
  className: cn(
8168
- "shrink-0 rounded-lg px-4 py-2 text-sm font-medium transition-colors",
8152
+ "shrink-0 whitespace-nowrap rounded-lg px-4 py-2 text-sm font-medium transition-colors",
8169
8153
  activeTab === link.value ? "bg-primary text-primary-foreground" : "bg-card text-card-foreground hover:bg-primary hover:text-primary-foreground"
8170
8154
  ),
8171
8155
  children: link.label
@@ -8194,7 +8178,7 @@ function AboutStartupTeam({
8194
8178
  children: renderTabsNav
8195
8179
  }
8196
8180
  ),
8197
- /* @__PURE__ */ jsxs("div", { className: "lg:col-span-3", children: [
8181
+ /* @__PURE__ */ jsxs("div", { className: "min-w-0 lg:col-span-3", children: [
8198
8182
  title && (typeof title === "string" ? /* @__PURE__ */ jsx(
8199
8183
  "h1",
8200
8184
  {
@@ -8276,15 +8260,7 @@ function AboutMinimalStory({
8276
8260
  className: "h-16 w-16 rounded-full object-cover",
8277
8261
  optixFlowConfig
8278
8262
  }
8279
- ) : /* @__PURE__ */ jsx(
8280
- "div",
8281
- {
8282
- className: cn(
8283
- "flex h-16 w-16 items-center justify-center rounded-full text-2xl font-bold"
8284
- ),
8285
- children: author.name.charAt(0)
8286
- }
8287
- ),
8263
+ ) : null,
8288
8264
  /* @__PURE__ */ jsxs("div", { children: [
8289
8265
  /* @__PURE__ */ jsx("p", { className: "font-semibold", children: author.name }),
8290
8266
  /* @__PURE__ */ jsx("p", { className: "text-sm", children: author.role })
@@ -8370,7 +8346,7 @@ function AboutStoryHero({
8370
8346
  {
8371
8347
  className: cn(
8372
8348
  "rounded-2xl bg-muted text-muted-foreground",
8373
- "flex flex-col items-start gap-2",
8349
+ "flex flex-col items-start gap-2 p-6",
8374
8350
  teamInfoClassName
8375
8351
  ),
8376
8352
  children: [
@@ -77,6 +77,6 @@ interface SocialLinkIconProps extends Omit<PressableProps, "children">, SocialLi
77
77
  * />
78
78
  * ```
79
79
  */
80
- declare const SocialLinkIcon: React.ForwardRefExoticComponent<SocialLinkIconProps & React.RefAttributes<HTMLButtonElement | HTMLAnchorElement | HTMLSpanElement>>;
80
+ declare const SocialLinkIcon: React.ForwardRefExoticComponent<SocialLinkIconProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLSpanElement>>;
81
81
 
82
82
  export { SocialLinkIcon, type SocialLinkIconDynamicIconProps, type SocialLinkIconProps };
@@ -77,6 +77,6 @@ interface SocialLinkIconProps extends Omit<PressableProps, "children">, SocialLi
77
77
  * />
78
78
  * ```
79
79
  */
80
- declare const SocialLinkIcon: React.ForwardRefExoticComponent<SocialLinkIconProps & React.RefAttributes<HTMLButtonElement | HTMLAnchorElement | HTMLSpanElement>>;
80
+ declare const SocialLinkIcon: React.ForwardRefExoticComponent<SocialLinkIconProps & React.RefAttributes<HTMLAnchorElement | HTMLButtonElement | HTMLSpanElement>>;
81
81
 
82
82
  export { SocialLinkIcon, type SocialLinkIconDynamicIconProps, type SocialLinkIconProps };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opensite/ui",
3
- "version": "3.2.9",
3
+ "version": "3.3.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",