@vite-mf-monorepo/ui 0.0.3 → 0.1.0

package/dist/index.js

@@ -1,9 +1,9 @@
-import { Button_default } from './chunk-IXEILQNO.js';
-export { Button_default as Button } from './chunk-IXEILQNO.js';
-import { Card_default } from './chunk-YKNVY2QQ.js';
-export { Card_default as Card } from './chunk-YKNVY2QQ.js';
-import { Icon_default } from './chunk-Z3E2P4JR.js';
-export { Icon_default as Icon } from './chunk-Z3E2P4JR.js';
+import { Button_default } from './chunk-GNBS5RLB.js';
+export { Button_default as Button } from './chunk-GNBS5RLB.js';
+import { Card_default } from './chunk-JI3OVXCK.js';
+export { Card_default as Card } from './chunk-JI3OVXCK.js';
+import { Icon_default } from './chunk-JHRISQQJ.js';
+export { Icon_default as Icon } from './chunk-JHRISQQJ.js';
 import clsx15 from 'clsx';
 import { createContext, useState, useRef, useEffect, useCallback, createElement, useLayoutEffect, useContext } from 'react';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
@@ -19,7 +19,7 @@ var sizeMap = {
   "2xl": { container: "ui:h-24 ui:w-24", icon: 48, text: "ui:text-2xl" },
   "3xl": { container: "ui:h-32 ui:w-32", icon: 64, text: "ui:text-3xl" }
 };
-var Avatar = ({
+function Avatar({
   className,
   src,
   alt,
@@ -27,7 +27,7 @@ var Avatar = ({
   initials,
   testId,
   ...rest
-}) => {
+}) {
   const [hasError, setHasError] = useState(false);
   const { container, icon, text } = sizeMap[size];
   const showImage = src && !hasError;
@@ -62,21 +62,21 @@ var Avatar = ({
       ]
     }
   );
-};
+}
 var Avatar_default = Avatar;
 var sizeMap2 = {
   sm: { padding: "ui:px-2 ui:py-0.5", text: "ui:text-xs", iconSize: 16 },
   md: { padding: "ui:px-2.5 ui:py-0.5", text: "ui:text-sm", iconSize: 16 },
   lg: { padding: "ui:px-3 ui:py-1", text: "ui:text-sm", iconSize: 16 }
 };
-var Badge = ({
+function Badge({
   children,
   variant = "default",
   size = "md",
   icon,
   textClassName,
   className
-}) => {
+}) {
   const { padding, text, iconSize } = sizeMap2[size];
   return /* @__PURE__ */ jsxs(
     "span",
@@ -103,21 +103,21 @@ var Badge = ({
       ]
     }
   );
-};
+}
 var Badge_default = Badge;
 var sizeMap3 = {
   sm: { button: "ui:h-8 ui:w-8", icon: 16 },
   md: { button: "ui:h-10 ui:w-10", icon: 20 },
   lg: { button: "ui:h-12 ui:w-12", icon: 24 }
 };
-var IconButton = ({
+function IconButton({
   className,
   icon,
   variant = "ghost",
   size = "md",
   disabled,
   ...rest
-}) => {
+}) {
   const { button: buttonSize, icon: iconSize } = sizeMap3[size];
   return /* @__PURE__ */ jsx(
     "button",
@@ -140,9 +140,9 @@ var IconButton = ({
       children: /* @__PURE__ */ jsx(Icon_default, { name: icon, size: iconSize })
     }
   );
-};
+}
 var IconButton_default = IconButton;
-var Image = ({
+function Image({
   src,
   alt,
   blurDataUrl,
@@ -156,7 +156,7 @@ var Image = ({
   onError,
   loading = "eager",
   ...rest
-}) => {
+}) {
   const imgRef = useRef(null);
   const containerRef = useRef(null);
   const [state, setState] = useState("loading");
@@ -256,9 +256,9 @@ var Image = ({
       ] })
     }
   );
-};
+}
 var Image_default = Image;
-var Skeleton = ({
+function Skeleton({
   variant = "rectangle",
   width,
   height,
@@ -266,7 +266,7 @@ var Skeleton = ({
   rounded = true,
   className,
   ...rest
-}) => {
+}) {
   return /* @__PURE__ */ jsx(
     "div",
     {
@@ -286,9 +286,9 @@ var Skeleton = ({
       ...rest
     }
   );
-};
+}
 var Skeleton_default = Skeleton;
-var HeroImage = ({ backdropPath, title }) => {
+function HeroImage({ backdropPath, title }) {
   const [loading, setLoading] = useState(true);
   const backdropPathMobile = backdropPath ? getOptimizedImageUrl(backdropPath, "w300", 60) : void 0;
   const backdropPathTablet = backdropPath ? getOptimizedImageUrl(backdropPath, "w300", 60) : void 0;
@@ -325,16 +325,16 @@ var HeroImage = ({ backdropPath, title }) => {
     ] }),
     /* @__PURE__ */ jsx("div", { className: "ui:absolute ui:inset-0 ui:bg-gradient-to-t ui:from-black/80 ui:via-black/40 ui:to-transparent ui:z-1 ui:top-0 ui:left-0 ui:right-0 ui:bottom-0" })
   ] });
-};
+}
 var HeroImage_default = HeroImage;
-var Modal = ({
+function Modal({
   isOpen,
   onClose,
   children,
   "aria-label": ariaLabel,
   className,
   onOverlayClick
-}) => {
+}) {
   const ref = useRef(null);
   useEffect(() => {
     const dialog = ref.current;
@@ -373,7 +373,7 @@ var Modal = ({
       children
     }
   );
-};
+}
 var Modal_default = Modal;
 var circleSizeMap = {
   sm: { size: 32, stroke: 3, fontSize: "ui:text-xs" },
@@ -385,14 +385,14 @@ var getColorClass = (percent) => {
   if (percent >= 40) return "ui:text-amber-600";
   return "ui:text-red-500";
 };
-var CircleRating = ({
+function CircleRating({
   percent,
   size,
   showValue,
   value,
   max,
   trackClassName
-}) => {
+}) {
   const { size: svgSize, stroke, fontSize } = circleSizeMap[size];
   const radius = (svgSize - stroke) / 2;
   const circumference = 2 * Math.PI * radius;
@@ -442,20 +442,20 @@ var CircleRating = ({
       }
     )
   ] });
-};
+}
 var CircleRating_default = CircleRating;
 var starsSizeMap = {
   sm: 16,
   md: 20,
   lg: 24
 };
-var StarsRating = ({
+function StarsRating({
   percent,
   size,
   showValue,
   value,
   max
-}) => {
+}) {
   const iconSize = starsSizeMap[size];
   return /* @__PURE__ */ jsxs("div", { className: "ui:inline-flex ui:items-center ui:gap-1", children: [
     /* @__PURE__ */ jsxs("div", { className: "ui:relative", children: [
@@ -482,9 +482,9 @@ var StarsRating = ({
       }
     )
   ] });
-};
+}
 var StarsRating_default = StarsRating;
-var Rating = ({
+function Rating({
   value,
   max = 10,
   variant = "circle",
@@ -492,7 +492,7 @@ var Rating = ({
   showValue = true,
   trackClassName,
   className
-}) => {
+}) {
   const clampedValue = Math.max(0, Math.min(value, max));
   const percent = clampedValue / max * 100;
   return /* @__PURE__ */ jsx("div", { className: clsx15("ui:inline-flex", className), children: variant === "circle" ? /* @__PURE__ */ jsx(
@@ -515,7 +515,7 @@ var Rating = ({
       max
     }
   ) });
-};
+}
 var Rating_default = Rating;
 var variantStyles = {
   h1: "ui:font-roboto ui:text-xl ui:sm:text-2xl ui:md:text-3xl ui:lg:text-4xl ui:font-bold ui:leading-tight ui:text-foreground",
@@ -551,22 +551,22 @@ var variantToTag = {
   muted: "p",
   blockquote: "blockquote"
 };
-var Typography = ({
+function Typography({
   variant,
   as,
   className,
   children,
   ...rest
-}) => {
+}) {
   const Component = as ?? variantToTag[variant];
   return createElement(
     Component,
     { className: clsx15(variantStyles[variant], className), ...rest },
     children
   );
-};
+}
 var Typography_default = Typography;
-var MovieCard = ({
+function MovieCard({
   id,
   title,
   posterUrl,
@@ -576,7 +576,7 @@ var MovieCard = ({
   imageLoading = "lazy",
   as = "card",
   ...rest
-}) => {
+}) {
   const to = "to" in rest ? rest.to : void 0;
   const onClick = "onClick" in rest ? rest.onClick : void 0;
   const isInteractive = as === "link" || as === "button";
@@ -645,14 +645,14 @@ var MovieCard = ({
     return /* @__PURE__ */ jsx(Link, { to, className: "ui:block ui:no-underline ui:text-inherit", children: cardContent });
   }
   return cardContent;
-};
+}
 var MovieCard_default = MovieCard;
-var TrailerCard = ({
+function TrailerCard({
   videoKey,
   title,
   type = "Trailer",
   className
-}) => {
+}) {
   const [isPlaying, setIsPlaying] = useState(false);
   const thumbnailUrl = `https://img.youtube.com/vi/${videoKey}/hqdefault.jpg`;
   return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -722,13 +722,13 @@ var TrailerCard = ({
       }
     )
   ] });
-};
+}
 var TrailerCard_default = TrailerCard;
-var CarouselCounter = ({
+function CarouselCounter({
   current,
   total,
   className
-}) => {
+}) {
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -744,11 +744,11 @@ var CarouselCounter = ({
       ]
     }
   );
-};
+}
 var CarouselCounter_default = CarouselCounter;
-var CarouselError = ({
+function CarouselError({
   message = "Failed to load data"
-}) => {
+}) {
   return /* @__PURE__ */ jsxs("div", { className: "ui:flex ui:flex-col ui:items-center ui:justify-center ui:gap-3 ui:rounded-lg ui:border ui:border-red-200 ui:bg-red-50 ui:p-8 ui:text-center", children: [
     /* @__PURE__ */ jsx(Icon_default, { name: "ExclamationTriangle", size: 48, className: "ui:text-red-500" }),
     /* @__PURE__ */ jsxs("div", { className: "ui:flex ui:flex-col ui:gap-1", children: [
@@ -756,9 +756,9 @@ var CarouselError = ({
       /* @__PURE__ */ jsx("p", { className: "ui:text-sm ui:text-red-700", children: message })
     ] })
   ] });
-};
+}
 var CarouselError_default = CarouselError;
-var CarouselNavigation = ({
+function CarouselNavigation({
   onPrev,
   onNext,
   canPrev,
@@ -767,7 +767,7 @@ var CarouselNavigation = ({
   position = "inline",
   iconVariant = "secondary",
   className
-}) => {
+}) {
   if (position === "sides") {
     return /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx("div", { className: "ui:absolute ui:left-0 ui:top-1/2 ui:-translate-x-1/2 ui:-translate-y-1/2", children: /* @__PURE__ */ jsx(
@@ -846,14 +846,14 @@ var CarouselNavigation = ({
       }
     )
   ] });
-};
+}
 var CarouselNavigation_default = CarouselNavigation;
-var CarouselPagination = ({
+function CarouselPagination({
   total,
   current,
   light = false,
   className
-}) => {
+}) {
   if (total === 0) return null;
   return /* @__PURE__ */ jsx("div", { className: clsx15("ui:flex ui:items-center ui:gap-2", className), children: Array.from({ length: total }).map((_, index) => /* @__PURE__ */ jsx(
     "div",
@@ -869,9 +869,9 @@ var CarouselPagination = ({
     },
     index
   )) });
-};
+}
 var CarouselPagination_default = CarouselPagination;
-var Carousel = ({
+function Carousel({
   children,
   variant = "standard",
   showPagination = true,
@@ -887,7 +887,7 @@ var Carousel = ({
   onNext,
   disableAnimation = false,
   disableScroll = false
-}) => {
+}) {
   const scrollRef = useRef(null);
   const [totalPositions, setTotalPositions] = useState(1);
   const [scrollIndex, setScrollIndex] = useState(initialIndex ?? 0);
@@ -1120,15 +1120,15 @@ var Carousel = ({
       }
     )
   ] });
-};
+}
 var Carousel_default = Carousel;
-var CarouselItem = ({
+function CarouselItem({
   children,
   isHero = false,
   isLightbox = false,
   className,
   ...rest
-}) => {
+}) {
   return /* @__PURE__ */ jsx(
     "div",
     {
@@ -1142,16 +1142,16 @@ var CarouselItem = ({
       children
     }
   );
-};
+}
 var CarouselItem_default = CarouselItem;
-var CarouselLoading = ({
+function CarouselLoading({
   count = 6,
   cardWidth = 150,
   cardHeight = 225,
   showTitle = true,
   showSubtitle = true,
   rounded = true
-}) => {
+}) {
   return /* @__PURE__ */ jsx("div", { className: "ui:overflow-x-auto ui:flex ui:gap-4", children: Array.from({ length: count }).map((_, i) => /* @__PURE__ */ jsxs(
     "div",
     {
@@ -1199,7 +1199,7 @@ var CarouselLoading = ({
     },
     i
   )) });
-};
+}
 var CarouselLoading_default = CarouselLoading;
 var TabsContext = createContext(
   void 0
@@ -1221,7 +1221,7 @@ var useTabsListContext = () => {
   }
   return context;
 };
-var TabsList = ({ className, children, ...rest }) => {
+function TabsList({ className, children, ...rest }) {
   const { variant } = useTabsContext();
   const triggersRef = useRef([]);
   const disabledRef = useRef(/* @__PURE__ */ new Set());
@@ -1261,9 +1261,9 @@ var TabsList = ({ className, children, ...rest }) => {
       )
     }
   );
-};
+}
 var TabsList_default = TabsList;
-var TabsPanel = ({ value, children, ...rest }) => {
+function TabsPanel({ value, children, ...rest }) {
   const { value: activeValue, prefix } = useTabsContext();
   const isActive = value === activeValue;
   const getTabId = (val) => prefix ? `tab-${prefix}-${val}` : `tab-${val}`;
@@ -1280,16 +1280,16 @@ var TabsPanel = ({ value, children, ...rest }) => {
       children
     }
   );
-};
+}
 var TabsPanel_default = TabsPanel;
-var TabsTrigger = ({
+function TabsTrigger({
   value,
   icon,
   disabled,
   className,
   children,
   ...rest
-}) => {
+}) {
   const {
     value: activeValue,
     onValueChange,
@@ -1395,9 +1395,9 @@ var TabsTrigger = ({
       ]
     }
   );
-};
+}
 var TabsTrigger_default = TabsTrigger;
-var Tabs = ({
+function Tabs({
   defaultValue = "",
   value,
   onValueChange,
@@ -1406,7 +1406,7 @@ var Tabs = ({
   className,
   children,
   ...rest
-}) => {
+}) {
   const [internalValue, setInternalValue] = useState(defaultValue);
   const activeValue = value ?? internalValue;
   const isControlled = value !== void 0;
@@ -1428,12 +1428,12 @@ var Tabs = ({
       children: /* @__PURE__ */ jsx("div", { className: clsx15("ui:w-full", className), ...rest, children })
     }
   );
-};
+}
 Tabs.List = TabsList_default;
 Tabs.Trigger = TabsTrigger_default;
 Tabs.Panel = TabsPanel_default;
 var Tabs_default = Tabs;
-var Talent = ({
+function Talent({
   name,
   role,
   imageSrc,
@@ -1441,7 +1441,7 @@ var Talent = ({
   size = "lg",
   className,
   ...rest
-}) => {
+}) {
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -1492,9 +1492,9 @@ var Talent = ({
       ]
     }
   );
-};
+}
 var Talent_default = Talent;
-var Spinner = ({ className }) => {
+function Spinner({ className }) {
   return /* @__PURE__ */ jsx(
     "div",
     {
@@ -1506,7 +1506,7 @@ var Spinner = ({ className }) => {
       )
     }
   );
-};
+}
 var Spinner_default = Spinner;
 
 export { Avatar_default as Avatar, Badge_default as Badge, Carousel_default as Carousel, CarouselCounter_default as CarouselCounter, CarouselItem_default as CarouselItem, CarouselLoading_default as CarouselLoading, CarouselNavigation_default as CarouselNavigation, CarouselPagination_default as CarouselPagination, HeroImage_default as HeroImage, IconButton_default as IconButton, Image_default as Image, Modal_default as Modal, MovieCard_default as MovieCard, Rating_default as Rating, Skeleton_default as Skeleton, Spinner_default as Spinner, Tabs_default as Tabs, Talent_default as Talent, TrailerCard_default as TrailerCard, Typography_default as Typography };