@opensite/ui 2.8.0 → 2.8.2

package/dist/blog-horizontal-cards.cjs

@@ -498,9 +498,13 @@ function Card({ className, ...props }) {
   );
 }
 var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
-function DynamicIcon({ apiKey, ...props }) {
+var DynamicIcon = React__namespace.memo(function DynamicIcon2({
+  apiKey,
+  ...props
+}) {
   return /* @__PURE__ */ jsxRuntime.jsx(icon.Icon, { ...props, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
-}
+});
+DynamicIcon.displayName = "DynamicIcon";
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",

package/dist/blog-horizontal-cards.js

@@ -477,9 +477,13 @@ function Card({ className, ...props }) {
   );
 }
 var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
-function DynamicIcon({ apiKey, ...props }) {
+var DynamicIcon = React.memo(function DynamicIcon2({
+  apiKey,
+  ...props
+}) {
   return /* @__PURE__ */ jsx(Icon, { ...props, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
-}
+});
+DynamicIcon.displayName = "DynamicIcon";
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",

package/dist/blog-horizontal-timeline.cjs

@@ -475,9 +475,13 @@ function CardContent({ className, ...props }) {
   );
 }
 var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
-function DynamicIcon({ apiKey, ...props }) {
+var DynamicIcon = React__namespace.memo(function DynamicIcon2({
+  apiKey,
+  ...props
+}) {
   return /* @__PURE__ */ jsxRuntime.jsx(icon.Icon, { ...props, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
-}
+});
+DynamicIcon.displayName = "DynamicIcon";
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",

package/dist/blog-horizontal-timeline.js

@@ -454,9 +454,13 @@ function CardContent({ className, ...props }) {
   );
 }
 var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
-function DynamicIcon({ apiKey, ...props }) {
+var DynamicIcon = React.memo(function DynamicIcon2({
+  apiKey,
+  ...props
+}) {
   return /* @__PURE__ */ jsx(Icon, { ...props, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
-}
+});
+DynamicIcon.displayName = "DynamicIcon";
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",

package/dist/carousel-animated-sections.cjs

@@ -1,7 +1,7 @@
 "use client";
 'use strict';
 
-var React5 = require('react');
+var React6 = require('react');
 var framerMotion = require('framer-motion');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
@@ -28,7 +28,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React5__namespace = /*#__PURE__*/_interopNamespace(React5);
+var React6__namespace = /*#__PURE__*/_interopNamespace(React6);
 
 // components/blocks/carousel/carousel-animated-sections.tsx
 function cn(...inputs) {
@@ -119,7 +119,7 @@ function useNavigation({
   href,
   onClick
 } = {}) {
-  const linkType = React5__namespace.useMemo(() => {
+  const linkType = React6__namespace.useMemo(() => {
     if (!href || href.trim() === "") {
       return onClick ? "none" : "none";
     }
@@ -140,7 +140,7 @@ function useNavigation({
       return "internal";
     }
   }, [href, onClick]);
-  const normalizedHref = React5__namespace.useMemo(() => {
+  const normalizedHref = React6__namespace.useMemo(() => {
     if (!href || href.trim() === "") {
       return void 0;
     }
@@ -158,7 +158,7 @@ function useNavigation({
         return trimmed;
     }
   }, [href, linkType]);
-  const target = React5__namespace.useMemo(() => {
+  const target = React6__namespace.useMemo(() => {
     switch (linkType) {
       case "external":
         return "_blank";
@@ -171,7 +171,7 @@ function useNavigation({
         return void 0;
     }
   }, [linkType]);
-  const rel = React5__namespace.useMemo(() => {
+  const rel = React6__namespace.useMemo(() => {
     if (linkType === "external") {
       return "noopener noreferrer";
     }
@@ -180,7 +180,7 @@ function useNavigation({
   const isExternal = linkType === "external";
   const isInternal = linkType === "internal";
   const shouldUseRouter = isInternal && typeof normalizedHref === "string" && normalizedHref.startsWith("/");
-  const handleClick = React5__namespace.useCallback(
+  const handleClick = React6__namespace.useCallback(
     (event) => {
       if (onClick) {
         try {
@@ -364,7 +364,7 @@ var buttonVariants = classVarianceAuthority.cva(baseStyles, {
     size: "default"
   }
 });
-var Pressable = React5__namespace.forwardRef(
+var Pressable = React6__namespace.forwardRef(
   ({
     children,
     className,
@@ -463,9 +463,13 @@ var Pressable = React5__namespace.forwardRef(
 );
 Pressable.displayName = "Pressable";
 var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
-function DynamicIcon({ apiKey, ...props }) {
+var DynamicIcon = React6__namespace.memo(function DynamicIcon2({
+  apiKey,
+  ...props
+}) {
   return /* @__PURE__ */ jsxRuntime.jsx(icon.Icon, { ...props, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
-}
+});
+DynamicIcon.displayName = "DynamicIcon";
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",
@@ -475,7 +479,7 @@ var maxWidthStyles = {
   "4xl": "max-w-[1536px]",
   full: "max-w-full"
 };
-var Container = React5__namespace.default.forwardRef(
+var Container = React6__namespace.default.forwardRef(
   ({ children, maxWidth = "xl", className, as = "div", ...props }, ref) => {
     const Component = as;
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -781,7 +785,7 @@ var spacingStyles = {
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl", "hero"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);
-var Section = React5__namespace.default.forwardRef(
+var Section = React6__namespace.default.forwardRef(
   ({
     id,
     title,
@@ -865,16 +869,16 @@ function CarouselAnimatedSections({
   pattern = "diagonalCrossBasic",
   patternOpacity = 0.033
 }) {
-  const [currentIndex, setCurrentIndex] = React5__namespace.useState(0);
-  const [direction, setDirection] = React5__namespace.useState(0);
-  const [isAnimating, setIsAnimating] = React5__namespace.useState(false);
-  const goToNext = React5__namespace.useCallback(() => {
+  const [currentIndex, setCurrentIndex] = React6__namespace.useState(0);
+  const [direction, setDirection] = React6__namespace.useState(0);
+  const [isAnimating, setIsAnimating] = React6__namespace.useState(false);
+  const goToNext = React6__namespace.useCallback(() => {
     if (isAnimating || currentIndex >= (sections?.length ?? 0) - 1) return;
     setIsAnimating(true);
     setDirection(1);
     setCurrentIndex((prev) => prev + 1);
   }, [currentIndex, isAnimating, sections?.length]);
-  const goToPrev = React5__namespace.useCallback(() => {
+  const goToPrev = React6__namespace.useCallback(() => {
     if (isAnimating || currentIndex <= 0) return;
     setIsAnimating(true);
     setDirection(-1);
@@ -886,7 +890,7 @@ function CarouselAnimatedSections({
     setDirection(index > currentIndex ? 1 : -1);
     setCurrentIndex(index);
   };
-  React5__namespace.useEffect(() => {
+  React6__namespace.useEffect(() => {
     const handleKeyDown = (e) => {
       if (e.key === "ArrowDown" || e.key === "ArrowRight") {
         goToNext();
@@ -912,7 +916,7 @@ function CarouselAnimatedSections({
     })
   };
   const currentSection = sections?.[currentIndex];
-  const actionElements = React5__namespace.useMemo(() => {
+  const actionElements = React6__namespace.useMemo(() => {
     if (actionsSlot) return actionsSlot;
     if (actions && actions.length > 0) {
       return actions.map((action, index) => /* @__PURE__ */ jsxRuntime.jsxs(

package/dist/carousel-animated-sections.js

@@ -1,6 +1,6 @@
 "use client";
-import * as React5 from 'react';
-import React5__default from 'react';
+import * as React6 from 'react';
+import React6__default from 'react';
 import { AnimatePresence, motion } from 'framer-motion';
 import { clsx } from 'clsx';
 import { twMerge } from 'tailwind-merge';
@@ -98,7 +98,7 @@ function useNavigation({
   href,
   onClick
 } = {}) {
-  const linkType = React5.useMemo(() => {
+  const linkType = React6.useMemo(() => {
     if (!href || href.trim() === "") {
       return onClick ? "none" : "none";
     }
@@ -119,7 +119,7 @@ function useNavigation({
       return "internal";
     }
   }, [href, onClick]);
-  const normalizedHref = React5.useMemo(() => {
+  const normalizedHref = React6.useMemo(() => {
     if (!href || href.trim() === "") {
       return void 0;
     }
@@ -137,7 +137,7 @@ function useNavigation({
         return trimmed;
     }
   }, [href, linkType]);
-  const target = React5.useMemo(() => {
+  const target = React6.useMemo(() => {
     switch (linkType) {
       case "external":
         return "_blank";
@@ -150,7 +150,7 @@ function useNavigation({
         return void 0;
     }
   }, [linkType]);
-  const rel = React5.useMemo(() => {
+  const rel = React6.useMemo(() => {
     if (linkType === "external") {
       return "noopener noreferrer";
     }
@@ -159,7 +159,7 @@ function useNavigation({
   const isExternal = linkType === "external";
   const isInternal = linkType === "internal";
   const shouldUseRouter = isInternal && typeof normalizedHref === "string" && normalizedHref.startsWith("/");
-  const handleClick = React5.useCallback(
+  const handleClick = React6.useCallback(
     (event) => {
       if (onClick) {
         try {
@@ -343,7 +343,7 @@ var buttonVariants = cva(baseStyles, {
     size: "default"
   }
 });
-var Pressable = React5.forwardRef(
+var Pressable = React6.forwardRef(
   ({
     children,
     className,
@@ -442,9 +442,13 @@ var Pressable = React5.forwardRef(
 );
 Pressable.displayName = "Pressable";
 var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
-function DynamicIcon({ apiKey, ...props }) {
+var DynamicIcon = React6.memo(function DynamicIcon2({
+  apiKey,
+  ...props
+}) {
   return /* @__PURE__ */ jsx(Icon, { ...props, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
-}
+});
+DynamicIcon.displayName = "DynamicIcon";
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",
@@ -454,7 +458,7 @@ var maxWidthStyles = {
   "4xl": "max-w-[1536px]",
   full: "max-w-full"
 };
-var Container = React5__default.forwardRef(
+var Container = React6__default.forwardRef(
   ({ children, maxWidth = "xl", className, as = "div", ...props }, ref) => {
     const Component = as;
     return /* @__PURE__ */ jsx(
@@ -760,7 +764,7 @@ var spacingStyles = {
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl", "hero"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);
-var Section = React5__default.forwardRef(
+var Section = React6__default.forwardRef(
   ({
     id,
     title,
@@ -844,16 +848,16 @@ function CarouselAnimatedSections({
   pattern = "diagonalCrossBasic",
   patternOpacity = 0.033
 }) {
-  const [currentIndex, setCurrentIndex] = React5.useState(0);
-  const [direction, setDirection] = React5.useState(0);
-  const [isAnimating, setIsAnimating] = React5.useState(false);
-  const goToNext = React5.useCallback(() => {
+  const [currentIndex, setCurrentIndex] = React6.useState(0);
+  const [direction, setDirection] = React6.useState(0);
+  const [isAnimating, setIsAnimating] = React6.useState(false);
+  const goToNext = React6.useCallback(() => {
     if (isAnimating || currentIndex >= (sections?.length ?? 0) - 1) return;
     setIsAnimating(true);
     setDirection(1);
     setCurrentIndex((prev) => prev + 1);
   }, [currentIndex, isAnimating, sections?.length]);
-  const goToPrev = React5.useCallback(() => {
+  const goToPrev = React6.useCallback(() => {
     if (isAnimating || currentIndex <= 0) return;
     setIsAnimating(true);
     setDirection(-1);
@@ -865,7 +869,7 @@ function CarouselAnimatedSections({
     setDirection(index > currentIndex ? 1 : -1);
     setCurrentIndex(index);
   };
-  React5.useEffect(() => {
+  React6.useEffect(() => {
     const handleKeyDown = (e) => {
       if (e.key === "ArrowDown" || e.key === "ArrowRight") {
         goToNext();
@@ -891,7 +895,7 @@ function CarouselAnimatedSections({
     })
   };
   const currentSection = sections?.[currentIndex];
-  const actionElements = React5.useMemo(() => {
+  const actionElements = React6.useMemo(() => {
     if (actionsSlot) return actionsSlot;
     if (actions && actions.length > 0) {
       return actions.map((action, index) => /* @__PURE__ */ jsxs(

package/dist/carousel-auto-progress-slides.cjs

@@ -483,9 +483,13 @@ var Pressable = React__namespace.forwardRef(
 );
 Pressable.displayName = "Pressable";
 var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
-function DynamicIcon({ apiKey, ...props }) {
+var DynamicIcon = React__namespace.memo(function DynamicIcon2({
+  apiKey,
+  ...props
+}) {
   return /* @__PURE__ */ jsxRuntime.jsx(icon.Icon, { ...props, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
-}
+});
+DynamicIcon.displayName = "DynamicIcon";
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",

package/dist/carousel-auto-progress-slides.js

@@ -462,9 +462,13 @@ var Pressable = React.forwardRef(
 );
 Pressable.displayName = "Pressable";
 var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
-function DynamicIcon({ apiKey, ...props }) {
+var DynamicIcon = React.memo(function DynamicIcon2({
+  apiKey,
+  ...props
+}) {
   return /* @__PURE__ */ jsx(Icon, { ...props, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
-}
+});
+DynamicIcon.displayName = "DynamicIcon";
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",

package/dist/carousel-autoplay-progress.cjs

@@ -1,7 +1,7 @@
 "use client";
 'use strict';
 
-var React5 = require('react');
+var React6 = require('react');
 var useEmblaCarousel = require('embla-carousel-react');
 var Autoplay = require('embla-carousel-autoplay');
 var clsx = require('clsx');
@@ -31,7 +31,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React5__namespace = /*#__PURE__*/_interopNamespace(React5);
+var React6__namespace = /*#__PURE__*/_interopNamespace(React6);
 var useEmblaCarousel__default = /*#__PURE__*/_interopDefault(useEmblaCarousel);
 var Autoplay__default = /*#__PURE__*/_interopDefault(Autoplay);
 
@@ -140,7 +140,7 @@ function useNavigation({
   href,
   onClick
 } = {}) {
-  const linkType = React5__namespace.useMemo(() => {
+  const linkType = React6__namespace.useMemo(() => {
     if (!href || href.trim() === "") {
       return onClick ? "none" : "none";
     }
@@ -161,7 +161,7 @@ function useNavigation({
       return "internal";
     }
   }, [href, onClick]);
-  const normalizedHref = React5__namespace.useMemo(() => {
+  const normalizedHref = React6__namespace.useMemo(() => {
     if (!href || href.trim() === "") {
       return void 0;
     }
@@ -179,7 +179,7 @@ function useNavigation({
         return trimmed;
     }
   }, [href, linkType]);
-  const target = React5__namespace.useMemo(() => {
+  const target = React6__namespace.useMemo(() => {
     switch (linkType) {
       case "external":
         return "_blank";
@@ -192,7 +192,7 @@ function useNavigation({
         return void 0;
     }
   }, [linkType]);
-  const rel = React5__namespace.useMemo(() => {
+  const rel = React6__namespace.useMemo(() => {
     if (linkType === "external") {
       return "noopener noreferrer";
     }
@@ -201,7 +201,7 @@ function useNavigation({
   const isExternal = linkType === "external";
   const isInternal = linkType === "internal";
   const shouldUseRouter = isInternal && typeof normalizedHref === "string" && normalizedHref.startsWith("/");
-  const handleClick = React5__namespace.useCallback(
+  const handleClick = React6__namespace.useCallback(
     (event) => {
       if (onClick) {
         try {
@@ -385,7 +385,7 @@ var buttonVariants = classVarianceAuthority.cva(baseStyles, {
     size: "default"
   }
 });
-var Pressable = React5__namespace.forwardRef(
+var Pressable = React6__namespace.forwardRef(
   ({
     children,
     className,
@@ -484,9 +484,13 @@ var Pressable = React5__namespace.forwardRef(
 );
 Pressable.displayName = "Pressable";
 var DEFAULT_ICON_API_KEY = "au382bi7fsh96w9h9xlrnat2jglx";
-function DynamicIcon({ apiKey, ...props }) {
+var DynamicIcon = React6__namespace.memo(function DynamicIcon2({
+  apiKey,
+  ...props
+}) {
   return /* @__PURE__ */ jsxRuntime.jsx(icon.Icon, { ...props, apiKey: apiKey ?? DEFAULT_ICON_API_KEY });
-}
+});
+DynamicIcon.displayName = "DynamicIcon";
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",
@@ -496,7 +500,7 @@ var maxWidthStyles = {
   "4xl": "max-w-[1536px]",
   full: "max-w-full"
 };
-var Container = React5__namespace.default.forwardRef(
+var Container = React6__namespace.default.forwardRef(
   ({ children, maxWidth = "xl", className, as = "div", ...props }, ref) => {
     const Component = as;
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -802,7 +806,7 @@ var spacingStyles = {
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl", "hero"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);
-var Section = React5__namespace.default.forwardRef(
+var Section = React6__namespace.default.forwardRef(
   ({
     id,
     title,
@@ -864,22 +868,22 @@ var Section = React5__namespace.default.forwardRef(
 );
 Section.displayName = "Section";
 function useDotButton(emblaApi) {
-  const [selectedIndex, setSelectedIndex] = React5__namespace.useState(0);
-  const [scrollSnaps, setScrollSnaps] = React5__namespace.useState([]);
-  const onDotButtonClick = React5__namespace.useCallback(
+  const [selectedIndex, setSelectedIndex] = React6__namespace.useState(0);
+  const [scrollSnaps, setScrollSnaps] = React6__namespace.useState([]);
+  const onDotButtonClick = React6__namespace.useCallback(
     (index) => {
       if (!emblaApi) return;
       emblaApi.scrollTo(index);
     },
     [emblaApi]
   );
-  const onInit = React5__namespace.useCallback((api) => {
+  const onInit = React6__namespace.useCallback((api) => {
     setScrollSnaps(api.scrollSnapList());
   }, []);
-  const onSelect = React5__namespace.useCallback((api) => {
+  const onSelect = React6__namespace.useCallback((api) => {
     setSelectedIndex(api.selectedScrollSnap());
   }, []);
-  React5__namespace.useEffect(() => {
+  React6__namespace.useEffect(() => {
     if (!emblaApi) return;
     onInit(emblaApi);
     onSelect(emblaApi);
@@ -888,8 +892,8 @@ function useDotButton(emblaApi) {
   return { selectedIndex, scrollSnaps, onDotButtonClick };
 }
 function useAutoplay(emblaApi) {
-  const [autoplayIsPlaying, setAutoplayIsPlaying] = React5__namespace.useState(false);
-  const onAutoplayButtonClick = React5__namespace.useCallback(
+  const [autoplayIsPlaying, setAutoplayIsPlaying] = React6__namespace.useState(false);
+  const onAutoplayButtonClick = React6__namespace.useCallback(
     (callback) => {
       const autoplay = emblaApi?.plugins()?.autoplay;
       if (!autoplay) return;
@@ -899,13 +903,13 @@ function useAutoplay(emblaApi) {
     },
     [emblaApi]
   );
-  const toggleAutoplay = React5__namespace.useCallback(() => {
+  const toggleAutoplay = React6__namespace.useCallback(() => {
     const autoplay = emblaApi?.plugins()?.autoplay;
     if (!autoplay) return;
     const playOrStop = autoplay.isPlaying() ? autoplay.stop : autoplay.play;
     playOrStop();
   }, [emblaApi]);
-  React5__namespace.useEffect(() => {
+  React6__namespace.useEffect(() => {
     const autoplay = emblaApi?.plugins()?.autoplay;
     if (!autoplay) return;
     setAutoplayIsPlaying(autoplay.isPlaying());
@@ -914,11 +918,11 @@ function useAutoplay(emblaApi) {
   return { autoplayIsPlaying, toggleAutoplay, onAutoplayButtonClick };
 }
 function useAutoplayProgress(emblaApi, progressNode) {
-  const [showAutoplayProgress, setShowAutoplayProgress] = React5__namespace.useState(false);
-  const animationName = React5__namespace.useRef("");
-  const timeoutId = React5__namespace.useRef(0);
-  const rafId = React5__namespace.useRef(0);
-  const startProgress = React5__namespace.useCallback(
+  const [showAutoplayProgress, setShowAutoplayProgress] = React6__namespace.useState(false);
+  const animationName = React6__namespace.useRef("");
+  const timeoutId = React6__namespace.useRef(0);
+  const rafId = React6__namespace.useRef(0);
+  const startProgress = React6__namespace.useCallback(
     (timeUntilNext) => {
       const node = progressNode.current;
       if (!node || timeUntilNext === null) return;
@@ -938,12 +942,12 @@ function useAutoplayProgress(emblaApi, progressNode) {
     },
     [progressNode]
   );
-  React5__namespace.useEffect(() => {
+  React6__namespace.useEffect(() => {
     const autoplay = emblaApi?.plugins()?.autoplay;
     if (!autoplay) return;
     emblaApi.on("autoplay:timerset", () => startProgress(autoplay.timeUntilNext())).on("autoplay:timerstopped", () => setShowAutoplayProgress(false));
   }, [emblaApi, startProgress]);
-  React5__namespace.useEffect(() => {
+  React6__namespace.useEffect(() => {
     return () => {
       cancelAnimationFrame(rafId.current);
       clearTimeout(timeoutId.current);
@@ -970,7 +974,7 @@ function CarouselAutoplayProgress({
   pattern,
   patternOpacity
 }) {
-  const progressNode = React5__namespace.useRef(null);
+  const progressNode = React6__namespace.useRef(null);
   const [emblaRef, emblaApi] = useEmblaCarousel__default.default(options, [
     Autoplay__default.default({ playOnInit: true, delay: autoplayDelay })
   ]);