@zayne-labs/ui-react 0.9.21 → 0.10.3

package/dist/esm/{await-Fe4LFRKd.js → await-fjas2Q-C.js}

@@ -1,9 +1,9 @@
 import { __export } from "./chunk-Cl8Af3a2.js";
-import { getSlotMap, withSlotNameAndSymbol } from "./utils-D4YNWj2X.js";
-import { ErrorBoundary, useErrorBoundaryContext } from "./error-boundary-B3ycUZ1t.js";
-import { SlotRoot } from "./slot-RXTKo4L7.js";
-import { Fragment, Suspense, use, useMemo } from "react";
+import { getSlotMap, withSlotNameAndSymbol } from "./utils-ChjmDoRe.js";
+import { ErrorBoundary, useErrorBoundaryContext } from "./error-boundary-xM9An3gz.js";
+import { SlotRoot } from "./slot-D1062oA5.js";
 import { isFunction } from "@zayne-labs/toolkit-type-helpers";
+import { Fragment, Suspense, use, useMemo } from "react";
 import { createCustomContext } from "@zayne-labs/toolkit-react";
 import { jsx } from "react/jsx-runtime";
 
@@ -18,9 +18,7 @@ const useAwaitContext = () => useAwaitContextImpl();
 //#endregion
 //#region src/components/common/await/await.tsx
 function AwaitRoot(props) {
-	const { children, errorFallback, fallback, wrapperVariant = "all",...restOfProps } = props;
-	const withErrorBoundary = wrapperVariant === "all" || wrapperVariant === "only-errorBoundary";
-	const withSuspense = wrapperVariant === "all" || wrapperVariant === "only-suspense";
+	const { children, errorFallback, fallback, withErrorBoundary = true, withSuspense = true,...restOfProps } = props;
 	const WithErrorBoundary = withErrorBoundary ? ErrorBoundary : Fragment;
 	const WithSuspense = withSuspense ? Suspense : Fragment;
 	const slots = !isFunction(children) ? getSlotMap(children) : { default: children };
@@ -86,4 +84,4 @@ __export(await_parts_exports, {
 
 //#endregion
 export { AwaitError, AwaitPending, AwaitRoot, AwaitSuccess, await_parts_exports, useAwaitContext };
-//# sourceMappingURL=await-Fe4LFRKd.js.map
+//# sourceMappingURL=await-fjas2Q-C.js.map

package/dist/esm/await-fjas2Q-C.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"await-fjas2Q-C.js","names":["ReactFragment","Component"],"sources":["../../src/components/common/await/await-context.ts","../../src/components/common/await/await.tsx","../../src/components/common/await/await-parts.ts"],"sourcesContent":["import { createCustomContext } from \"@zayne-labs/toolkit-react\";\n\nexport type AwaitContextType<TValue = unknown> = {\n\tpromise: Promise<TValue>;\n\tresult: TValue;\n};\n\nexport const [AwaitContextProvider, useAwaitContextImpl] = createCustomContext<AwaitContextType>({\n\thookName: \"useAwaitContext\",\n\tname: \"AwaitContext\",\n\tproviderName: \"AwaitInner\",\n});\n\nexport const useAwaitContext = <TValue>() => useAwaitContextImpl() as AwaitContextType<TValue>;\n","\"use client\";\n\nimport { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\nimport * as React from \"react\";\nimport { Fragment as ReactFragment, Suspense, use, useMemo } from \"react\";\nimport { type GetSlotComponentProps, getSlotMap, withSlotNameAndSymbol } from \"@/lib/utils\";\nimport { ErrorBoundary, type ErrorBoundaryProps, useErrorBoundaryContext } from \"../error-boundary\";\nimport { Slot } from \"../slot\";\nimport type { SuspenseWithBoundaryProps } from \"../suspense-with-boundary\";\nimport { AwaitContextProvider, useAwaitContext } from \"./await-context\";\n\ntype RenderPropFn<TValue> = (result: TValue) => React.ReactNode;\n\ntype ChildrenType<TValue> = React.ReactNode | RenderPropFn<TValue>;\n\ntype AwaitRootProps<TValue> = Pick<SuspenseWithBoundaryProps, \"errorFallback\" | \"fallback\"> & {\n\tasChild?: boolean;\n\tchildren: ChildrenType<TValue>;\n\tpromise: Promise<TValue>;\n\twithErrorBoundary?: boolean;\n\twithSuspense?: boolean;\n};\n\nexport function AwaitRoot<TValue>(props: AwaitRootProps<TValue>) {\n\tconst {\n\t\tchildren,\n\t\terrorFallback,\n\t\tfallback,\n\t\twithErrorBoundary = true,\n\t\twithSuspense = true,\n\t\t...restOfProps\n\t} = props;\n\n\tconst WithErrorBoundary = withErrorBoundary ? ErrorBoundary : ReactFragment;\n\tconst WithSuspense = withSuspense ? Suspense : ReactFragment;\n\n\tconst slots =\n\t\t!isFunction(children) ?\n\t\t\tgetSlotMap<SlotComponentProps>(children)\n\t\t:\t({ default: children } as unknown as ReturnType<typeof getSlotMap<SlotComponentProps>>);\n\n\tconst selectedPendingFallback = slots.pending ?? fallback;\n\tconst selectedErrorFallback = slots.error ?? errorFallback;\n\n\treturn (\n\t\t<WithErrorBoundary {...(Boolean(selectedErrorFallback) && { fallback: selectedErrorFallback })}>\n\t\t\t<WithSuspense {...(Boolean(selectedPendingFallback) && { fallback: selectedPendingFallback })}>\n\t\t\t\t<AwaitRootInner {...restOfProps}>{slots.default}</AwaitRootInner>\n\t\t\t</WithSuspense>\n\t\t</WithErrorBoundary>\n\t);\n}\n\ntype AwaitRootInnerProps<TValue> = Pick<AwaitRootProps<TValue>, \"asChild\" | \"children\" | \"promise\">;\n\nfunction AwaitRootInner<TValue>(props: AwaitRootInnerProps<TValue>) {\n\tconst { asChild, children, promise } = props;\n\n\tconst result = use(promise);\n\n\tconst resolvedChildren = isFunction(children) ? children(result) : children;\n\n\tconst Component = asChild ? Slot.Root : ReactFragment;\n\n\tconst contextValue = useMemo(() => ({ promise, result }), [promise, result]);\n\n\treturn (\n\t\t<AwaitContextProvider value={contextValue}>\n\t\t\t<Component {...(asChild && contextValue)}>{resolvedChildren}</Component>\n\t\t</AwaitContextProvider>\n\t);\n}\n\ntype SlotComponentProps = AwaitErrorProps | AwaitPendingProps | AwaitSuccessProps;\n\ntype AwaitSuccessProps<TValue = unknown> = GetSlotComponentProps<\"default\", ChildrenType<TValue>>;\n\nexport function AwaitSuccess<TPromiseOrValue, TValue = Awaited<TPromiseOrValue>>(\n\tprops: Pick<AwaitSuccessProps<TValue>, \"children\">\n) {\n\tif (isFunction(props.children)) {\n\t\t// eslint-disable-next-line react-hooks/rules-of-hooks -- This hook only uses `use` under the hood so this is safe\n\t\tconst { result } = useAwaitContext<TValue>();\n\n\t\treturn props.children(result);\n\t}\n\n\treturn props.children;\n}\n\nObject.assign(AwaitSuccess, withSlotNameAndSymbol<AwaitSuccessProps>(\"default\"));\n\ntype AwaitPendingProps = GetSlotComponentProps<\"pending\", React.SuspenseProps[\"fallback\"]>;\n\nexport const AwaitPending = withSlotNameAndSymbol<AwaitPendingProps>(\"pending\");\n\ntype AwaitErrorProps = GetSlotComponentProps<\"error\", ErrorBoundaryProps[\"fallback\"]>;\n\nexport const AwaitError = withSlotNameAndSymbol<AwaitErrorProps, { asChild?: boolean }>(\n\t\"error\",\n\t(props) => {\n\t\tconst { asChild, children } = props;\n\n\t\tconst errorBoundaryContext = useErrorBoundaryContext();\n\n\t\tconst Component = asChild ? Slot.Root : ReactFragment;\n\n\t\tconst resolvedChildren = isFunction(children) ? children(errorBoundaryContext) : children;\n\n\t\treturn <Component {...(asChild && errorBoundaryContext)}>{resolvedChildren}</Component>;\n\t}\n);\n","export {\n\tAwaitRoot as Root,\n\tAwaitError as Error,\n\tAwaitPending as Pending,\n\tAwaitSuccess as Success,\n} from \"./await\";\n"],"mappings":";;;;;;;;;;AAOA,MAAa,CAAC,sBAAsB,oBAAoB,GAAG,oBAAsC;CAChG,UAAU;CACV,MAAM;CACN,cAAc;CACd;AAED,MAAa,wBAAgC;;;;ACU7C,SAAgB,UAAkB,OAA+B;CAChE,MAAM,EACL,UACA,eACA,UACA,oBAAoB,MACpB,eAAe,KACf,GAAG,aACH,GAAG;CAEJ,MAAM,oBAAoB,oBAAoB,gBAAgBA;CAC9D,MAAM,eAAe,eAAe,WAAWA;CAE/C,MAAM,QACL,CAAC,WAAW,YACX,WAA+B,YAC7B,EAAE,SAAS,UAAU;CAEzB,MAAM,0BAA0B,MAAM,WAAW;CACjD,MAAM,wBAAwB,MAAM,SAAS;AAE7C,QACC,oBAAC;EAAkB,GAAK,QAAQ,0BAA0B,EAAE,UAAU,uBAAuB;YAC5F,oBAAC;GAAa,GAAK,QAAQ,4BAA4B,EAAE,UAAU,yBAAyB;aAC3F,oBAAC;IAAe,GAAI;cAAc,MAAM;;;;AAI3C;AAID,SAAS,eAAuB,OAAoC;CACnE,MAAM,EAAE,SAAS,UAAU,SAAS,GAAG;CAEvC,MAAM,SAAS,IAAI;CAEnB,MAAM,mBAAmB,WAAW,YAAY,SAAS,UAAU;CAEnE,MAAMC,cAAY,qBAAsBD;CAExC,MAAM,eAAe,eAAe;EAAE;EAAS;EAAQ,GAAG,CAAC,SAAS,OAAO;AAE3E,QACC,oBAAC;EAAqB,OAAO;YAC5B,oBAACC;GAAU,GAAK,WAAW;aAAgB;;;AAG7C;AAMD,SAAgB,aACf,OACC;AACD,KAAI,WAAW,MAAM,WAAW;EAE/B,MAAM,EAAE,QAAQ,GAAG;AAEnB,SAAO,MAAM,SAAS;CACtB;AAED,QAAO,MAAM;AACb;AAED,OAAO,OAAO,cAAc,sBAAyC;AAIrE,MAAa,eAAe,sBAAyC;AAIrE,MAAa,aAAa,sBACzB,UACC,UAAU;CACV,MAAM,EAAE,SAAS,UAAU,GAAG;CAE9B,MAAM,uBAAuB;CAE7B,MAAMA,cAAY,qBAAsBD;CAExC,MAAM,mBAAmB,WAAW,YAAY,SAAS,wBAAwB;AAEjF,QAAO,oBAACC;EAAU,GAAK,WAAW;YAAwB;;AAC1D"}

package/dist/esm/{card-jkLXbuiw.js → card-TD60Xux0.js}

@@ -1,5 +1,5 @@
 import { __export } from "./chunk-Cl8Af3a2.js";
-import { SlotRoot } from "./slot-RXTKo4L7.js";
+import { SlotRoot } from "./slot-D1062oA5.js";
 import { cnMerge } from "./cn-_FbtIrlZ.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
@@ -92,4 +92,4 @@ __export(card_parts_exports, {
 
 //#endregion
 export { CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardRoot, CardTitle, card_parts_exports };
-//# sourceMappingURL=card-jkLXbuiw.js.map
+//# sourceMappingURL=card-TD60Xux0.js.map

package/dist/esm/card-TD60Xux0.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"card-TD60Xux0.js","names":["Component"],"sources":["../../src/components/ui/card/card.tsx","../../src/components/ui/card/card-parts.ts"],"sourcesContent":["import type { PolymorphicProps } from \"@zayne-labs/toolkit-react/utils\";\nimport * as React from \"react\";\nimport { Slot } from \"@/components/common/slot\";\nimport { cnMerge } from \"@/lib/utils/cn\";\n\nexport function CardRoot<TElement extends React.ElementType = \"article\">(\n\tprops: PolymorphicProps<TElement>\n) {\n\tconst { as: Element = \"article\", ...restOfProps } = props;\n\n\treturn (\n\t\t<Element\n\t\t\tdata-scope=\"card\"\n\t\t\tdata-part=\"root\"\n\t\t\tdata-slot=\"card-root\"\n\t\t\tclassName=\"flex flex-col gap-6 rounded-xl border py-6 shadow-sm\"\n\t\t\t{...restOfProps}\n\t\t/>\n\t);\n}\n\nexport function CardHeader<TElement extends React.ElementType = \"header\">(\n\tprops: PolymorphicProps<TElement>\n) {\n\tconst { as: Element = \"header\", ...restOfProps } = props;\n\n\treturn (\n\t\t<Element\n\t\t\tdata-scope=\"card\"\n\t\t\tdata-part=\"header\"\n\t\t\tdata-slot=\"card-header\"\n\t\t\tclassName=\"@container/card-header has-data-[slot=card-action]:grid-cols-[1fr_auto] grid\n\t\t\t\tauto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6\"\n\t\t\t{...restOfProps}\n\t\t/>\n\t);\n}\n\nexport function CardTitle<TElement extends React.ElementType = \"h3\">(props: PolymorphicProps<TElement>) {\n\tconst { as: Element = \"h3\", className, ...restOfProps } = props;\n\n\treturn (\n\t\t<Element\n\t\t\tdata-scope=\"card\"\n\t\t\tdata-part=\"title\"\n\t\t\tdata-slot=\"card-title\"\n\t\t\tclassName={cnMerge(\"font-semibold leading-none\", className)}\n\t\t\t{...restOfProps}\n\t\t/>\n\t);\n}\n\nexport function CardDescription<TElement extends React.ElementType = \"p\">(\n\tprops: PolymorphicProps<TElement>\n) {\n\tconst { as: Element = \"p\", className, ...restOfProps } = props;\n\n\treturn (\n\t\t<Element\n\t\t\tdata-scope=\"card\"\n\t\t\tdata-part=\"description\"\n\t\t\tdata-slot=\"card-description\"\n\t\t\tclassName={cnMerge(\"text-shadcn-muted-foreground text-sm\", className)}\n\t\t\t{...restOfProps}\n\t\t/>\n\t);\n}\n\nexport function CardContent<TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicProps<TElement>\n) {\n\tconst { as: Element = \"div\", className, ...restOfProps } = props;\n\n\treturn (\n\t\t<Element\n\t\t\tdata-scope=\"card\"\n\t\t\tdata-part=\"content\"\n\t\t\tdata-slot=\"card-content\"\n\t\t\tclassName={cnMerge(\"px-6\", className)}\n\t\t\t{...restOfProps}\n\t\t/>\n\t);\n}\n\nexport function CardAction<TElement extends React.ElementType = \"div\">(props: PolymorphicProps<TElement>) {\n\tconst { as: Element = \"div\", className, ...restOfProps } = props;\n\n\treturn (\n\t\t<Element\n\t\t\tdata-scope=\"card\"\n\t\t\tdata-part=\"action\"\n\t\t\tdata-slot=\"card-action\"\n\t\t\tclassName={cnMerge(\"col-start-2 row-span-2 row-start-1 self-start justify-self-end\", className)}\n\t\t\t{...restOfProps}\n\t\t/>\n\t);\n}\n\nexport function CardFooter<TElement extends React.ElementType = \"footer\">(\n\tprops: PolymorphicProps<TElement, { asChild?: boolean }>\n) {\n\tconst { as: Element = \"footer\", asChild, className, ...restOfProps } = props;\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\treturn (\n\t\t<Component\n\t\t\tdata-scope=\"card\"\n\t\t\tdata-part=\"footer\"\n\t\t\tdata-slot=\"card-footer\"\n\t\t\tclassName={cnMerge(\"px-6\", className)}\n\t\t\t{...restOfProps}\n\t\t/>\n\t);\n}\n","export {\n\tCardContent as Content,\n\tCardDescription as Description,\n\tCardFooter as Footer,\n\tCardHeader as Header,\n\tCardAction as Action,\n\tCardRoot as Root,\n\tCardTitle as Title,\n} from \"./card\";\n"],"mappings":";;;;;;;AAKA,SAAgB,SACf,OACC;CACD,MAAM,EAAE,IAAI,UAAU,UAAW,GAAG,aAAa,GAAG;AAEpD,QACC,oBAAC;EACA,cAAW;EACX,aAAU;EACV,aAAU;EACV,WAAU;EACV,GAAI;;AAGN;AAED,SAAgB,WACf,OACC;CACD,MAAM,EAAE,IAAI,UAAU,SAAU,GAAG,aAAa,GAAG;AAEnD,QACC,oBAAC;EACA,cAAW;EACX,aAAU;EACV,aAAU;EACV,WAAU;EAEV,GAAI;;AAGN;AAED,SAAgB,UAAqD,OAAmC;CACvG,MAAM,EAAE,IAAI,UAAU,MAAM,UAAW,GAAG,aAAa,GAAG;AAE1D,QACC,oBAAC;EACA,cAAW;EACX,aAAU;EACV,aAAU;EACV,WAAW,QAAQ,8BAA8B;EACjD,GAAI;;AAGN;AAED,SAAgB,gBACf,OACC;CACD,MAAM,EAAE,IAAI,UAAU,KAAK,UAAW,GAAG,aAAa,GAAG;AAEzD,QACC,oBAAC;EACA,cAAW;EACX,aAAU;EACV,aAAU;EACV,WAAW,QAAQ,wCAAwC;EAC3D,GAAI;;AAGN;AAED,SAAgB,YACf,OACC;CACD,MAAM,EAAE,IAAI,UAAU,OAAO,UAAW,GAAG,aAAa,GAAG;AAE3D,QACC,oBAAC;EACA,cAAW;EACX,aAAU;EACV,aAAU;EACV,WAAW,QAAQ,QAAQ;EAC3B,GAAI;;AAGN;AAED,SAAgB,WAAuD,OAAmC;CACzG,MAAM,EAAE,IAAI,UAAU,OAAO,UAAW,GAAG,aAAa,GAAG;AAE3D,QACC,oBAAC;EACA,cAAW;EACX,aAAU;EACV,aAAU;EACV,WAAW,QAAQ,kEAAkE;EACrF,GAAI;;AAGN;AAED,SAAgB,WACf,OACC;CACD,MAAM,EAAE,IAAI,UAAU,UAAU,SAAS,UAAW,GAAG,aAAa,GAAG;CAEvE,MAAMA,cAAY,qBAAsB;AAExC,QACC,oBAACA;EACA,cAAW;EACX,aAAU;EACV,aAAU;EACV,WAAW,QAAQ,QAAQ;EAC3B,GAAI;;AAGN"}

package/dist/esm/{carousel-Dvp-qURP.js → carousel-YXXtZ85s.js}

@@ -1,22 +1,23 @@
 import { __export } from "./chunk-Cl8Af3a2.js";
-import { getElementList } from "./for-aTw1TgJo.js";
-import { ShowFallback, ShowRoot } from "./show-DNPzdLi-.js";
+import { For } from "./for-DGs2XZ21.js";
+import { ShowContent, ShowFallback, ShowRoot } from "./show-BabiXbf7.js";
 import { cnMerge } from "./cn-_FbtIrlZ.js";
-import { useEffect, useState } from "react";
-import { useAnimationInterval, useCallbackRef, useConstant } from "@zayne-labs/toolkit-react";
+import { isFunction } from "@zayne-labs/toolkit-type-helpers";
+import { useMemo, useState } from "react";
+import { createStore } from "@zayne-labs/toolkit-core";
+import { useAnimationInterval, useCallbackRef, useStore } from "@zayne-labs/toolkit-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { createZustandContext } from "@zayne-labs/toolkit-react/zustand";
-import { create } from "zustand";
 
-//#region src/components/ui/carousel/carousel-store-context.tsx
-const [Provider, useCarouselStoreContext] = createZustandContext({
+//#region src/components/ui/carousel/carousel-store-context.ts
+const [CarouselStoreContextProvider, useCarouselStoreContext] = createZustandContext({
 	hookName: "useCarouselStore",
 	name: "CarouselStoreContext",
-	providerName: "CarouselContextProvider"
+	providerName: "CarouselRoot"
 });
 const createCarouselStore = (storeValues) => {
 	const { images, onSlideBtnClick } = storeValues;
-	const useInitCarouselStore = create()((set, get) => ({
+	const carouselStore = createStore((set, get) => ({
 		currentSlide: 0,
 		images,
 		maxSlide: images.length - 1,
@@ -45,30 +46,24 @@ const createCarouselStore = (storeValues) => {
 			}
 		}
 	}));
-	return useInitCarouselStore;
+	return carouselStore;
 };
 const useCarousel = (props) => {
 	const { images, onSlideBtnClick } = props;
-	const useInitCarouselStore = useConstant(() => createCarouselStore({
+	const savedOnSlideBtnClick = useCallbackRef(onSlideBtnClick);
+	const carouselStore = useMemo(() => createCarouselStore({
 		images,
-		onSlideBtnClick
-	}));
-	useEffect(() => {
-		useInitCarouselStore.setState({ images });
-	}, [images]);
-	return useInitCarouselStore;
+		onSlideBtnClick: savedOnSlideBtnClick
+	}), [images, savedOnSlideBtnClick]);
+	const useCarouselStore = (selector) => {
+		return useStore(carouselStore, selector);
+	};
+	const savedUseCarouselStore = useCallbackRef(useCarouselStore);
+	return useMemo(() => ({
+		carouselStore,
+		useCarouselStore: savedUseCarouselStore
+	}), [carouselStore, savedUseCarouselStore]);
 };
-function CarouselContextProvider(props) {
-	const { children, images, onSlideBtnClick } = props;
-	const useInitCarouselStore = useCarousel({
-		images,
-		onSlideBtnClick
-	});
-	return /* @__PURE__ */ jsx(Provider, {
-		value: useInitCarouselStore,
-		children
-	});
-}
 
 //#endregion
 //#region src/components/ui/carousel/icons.tsx
@@ -94,14 +89,13 @@ const ChevronLeftIcon = (props) => /* @__PURE__ */ jsx("svg", {
 
 //#endregion
 //#region src/components/ui/carousel/useCarouselOptions.ts
-const useCarouselOptions = (options = {}) => {
-	const { autoSlideInterval = 5e3, hasAutoSlide = false, shouldPauseOnHover = false } = options;
-	const { goToNextSlide } = useCarouselStoreContext((state) => state.actions);
+const useCarouselOptions = (options) => {
+	const { actions, autoSlideInterval = 5e3, hasAutoSlide = false, shouldPauseOnHover = false } = options;
 	const [isPaused, setIsPaused] = useState(false);
 	const shouldAutoSlide = hasAutoSlide && !isPaused;
 	useAnimationInterval({
 		intervalDuration: shouldAutoSlide ? autoSlideInterval : null,
-		onAnimation: goToNextSlide
+		onAnimation: actions.goToNextSlide
 	});
 	const pauseAutoSlide = useCallbackRef(() => shouldPauseOnHover && setIsPaused(true));
 	const resumeAutoSlide = useCallbackRef(() => shouldPauseOnHover && setIsPaused(false));
@@ -113,22 +107,32 @@ const useCarouselOptions = (options = {}) => {
 
 //#endregion
 //#region src/components/ui/carousel/carousel.tsx
-function CarouselContent(props) {
-	const { as: HtmlElement = "article", autoSlideInterval, children, classNames, hasAutoSlide, shouldPauseOnHover } = props;
+function CarouselRoot(props) {
+	const { as: Element = "div", autoSlideInterval, children, classNames, hasAutoSlide, images, onSlideBtnClick, shouldPauseOnHover } = props;
+	const { carouselStore } = useCarousel({
+		images,
+		onSlideBtnClick
+	});
+	const actions = carouselStore.getState().actions;
 	const { pauseAutoSlide, resumeAutoSlide } = useCarouselOptions({
+		actions,
 		autoSlideInterval,
 		hasAutoSlide,
 		shouldPauseOnHover
 	});
-	return /* @__PURE__ */ jsx(HtmlElement, {
-		"data-id": "Carousel",
-		className: cnMerge("relative select-none", classNames?.base),
-		onMouseEnter: pauseAutoSlide,
-		onMouseLeave: resumeAutoSlide,
-		children: /* @__PURE__ */ jsx("div", {
-			"data-id": "Scroll Container",
-			className: cnMerge("flex size-full overflow-x-scroll [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", classNames?.scrollContainer),
-			children
+	return /* @__PURE__ */ jsx(CarouselStoreContextProvider, {
+		store: carouselStore,
+		children: /* @__PURE__ */ jsx(Element, {
+			"data-scope": "carousel",
+			"data-part": "content",
+			"data-slot": "carousel-content",
+			className: cnMerge("relative select-none", classNames?.base),
+			onMouseEnter: pauseAutoSlide,
+			onMouseLeave: resumeAutoSlide,
+			children: /* @__PURE__ */ jsx("div", {
+				className: cnMerge("flex size-full overflow-x-scroll [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", classNames?.scrollContainer),
+				children
+			})
 		})
 	});
 }
@@ -136,6 +140,9 @@ function CarouselButton(props) {
 	const { classNames, icon, variant } = props;
 	const { goToNextSlide, goToPreviousSlide } = useCarouselStoreContext((state) => state.actions);
 	return /* @__PURE__ */ jsx("button", {
+		"data-scope": "carousel",
+		"data-part": "button",
+		"data-slot": "carousel-button",
 		type: "button",
 		className: cnMerge("z-30 flex h-full w-fit items-center", variant === "prev" ? "justify-start" : "justify-end", classNames?.base),
 		onClick: variant === "prev" ? goToPreviousSlide : goToNextSlide,
@@ -148,66 +155,71 @@ function CarouselButton(props) {
 function CarouselControls(props) {
 	const { classNames, icon } = props;
 	return /* @__PURE__ */ jsx("div", {
+		"data-scope": "carousel",
+		"data-part": "controls",
+		"data-slot": "carousel-controls",
 		className: cnMerge("absolute inset-0 flex justify-between", classNames?.base),
 		children: /* @__PURE__ */ jsxs(ShowRoot, {
 			when: icon?.iconType,
-			children: [
-				/* @__PURE__ */ jsx(CarouselButton, {
-					variant: "prev",
-					classNames: {
-						defaultIcon: classNames?.defaultIcon,
-						iconContainer: cnMerge(icon?.iconType === "nextIcon" && "rotate-180", classNames?.iconContainer)
-					},
-					icon: icon?.icon
-				}),
-				/* @__PURE__ */ jsx(CarouselButton, {
-					variant: "next",
-					classNames: {
-						defaultIcon: classNames?.defaultIcon,
-						iconContainer: cnMerge(icon?.iconType === "prevIcon" && "rotate-180", classNames?.iconContainer)
-					},
-					icon: icon?.icon
-				}),
-				/* @__PURE__ */ jsxs(ShowFallback, { children: [/* @__PURE__ */ jsx(CarouselButton, {
-					variant: "prev",
-					classNames: {
-						defaultIcon: classNames?.defaultIcon,
-						iconContainer: classNames?.iconContainer
-					},
-					icon: icon?.prev
-				}), /* @__PURE__ */ jsx(CarouselButton, {
-					variant: "next",
-					classNames: {
-						defaultIcon: classNames?.defaultIcon,
-						iconContainer: classNames?.iconContainer
-					},
-					icon: icon?.next
-				})] })
-			]
+			children: [/* @__PURE__ */ jsxs(ShowContent, { children: [/* @__PURE__ */ jsx(CarouselButton, {
+				variant: "prev",
+				classNames: {
+					defaultIcon: classNames?.defaultIcon,
+					iconContainer: cnMerge(icon?.iconType === "nextIcon" && "rotate-180", classNames?.iconContainer)
+				},
+				icon: icon?.icon
+			}), /* @__PURE__ */ jsx(CarouselButton, {
+				variant: "next",
+				classNames: {
+					defaultIcon: classNames?.defaultIcon,
+					iconContainer: cnMerge(icon?.iconType === "prevIcon" && "rotate-180", classNames?.iconContainer)
+				},
+				icon: icon?.icon
+			})] }), /* @__PURE__ */ jsxs(ShowFallback, { children: [/* @__PURE__ */ jsx(CarouselButton, {
+				variant: "prev",
+				classNames: {
+					defaultIcon: classNames?.defaultIcon,
+					iconContainer: classNames?.iconContainer
+				},
+				icon: icon?.prev
+			}), /* @__PURE__ */ jsx(CarouselButton, {
+				variant: "next",
+				classNames: {
+					defaultIcon: classNames?.defaultIcon,
+					iconContainer: classNames?.iconContainer
+				},
+				icon: icon?.next
+			})] })]
 		})
 	});
 }
 function CarouselItemGroup(props) {
-	const { children, className, each, render } = props;
-	const [ItemList] = getElementList("base");
+	const { children, className, each } = props;
 	const currentSlide = useCarouselStoreContext((state) => state.currentSlide);
 	const images = useCarouselStoreContext((state) => each ?? state.images);
 	return /* @__PURE__ */ jsx("ul", {
-		"data-id": "Carousel Image Wrapper",
-		className: cnMerge(`flex w-full shrink-0 snap-center [transform:translate3d(var(--translate-distance),0,0)]
-				[transition:transform_800ms_ease]`, className),
+		"data-scope": "carousel",
+		"data-part": "item-group",
+		"data-slot": "carousel-item-group",
+		className: cnMerge(`duration-800 transform-[translate3d(var(--translate-distance),0,0)] flex w-full shrink-0
+				snap-center transition-transform`, className),
 		style: { "--translate-distance": `-${currentSlide * 100}%` },
-		children: typeof render === "function" ? /* @__PURE__ */ jsx(ItemList, {
+		children: isFunction(children) ? /* @__PURE__ */ jsx(For, {
 			each: images,
-			render
-		}) : /* @__PURE__ */ jsx(ItemList, {
-			each: images,
-			children
-		})
+			renderItem: (image, index, array) => children({
+				array,
+				image,
+				index
+			})
+		}) : children
 	});
 }
-function CarouselItem({ children, className,...restOfProps }) {
+function CarouselItem(props) {
+	const { children, className,...restOfProps } = props;
 	return /* @__PURE__ */ jsx("li", {
+		"data-scope": "carousel",
+		"data-part": "item",
+		"data-slot": "carousel-item",
 		className: cnMerge("flex w-full shrink-0 snap-center justify-center", className),
 		...restOfProps,
 		children
@@ -216,31 +228,38 @@ function CarouselItem({ children, className,...restOfProps }) {
 function CarouselCaption(props) {
 	const { as: HtmlElement = "div", children, className } = props;
 	return /* @__PURE__ */ jsx(HtmlElement, {
-		"data-id": "Carousel Caption",
+		"data-scope": "carousel",
+		"data-part": "caption",
+		"data-slot": "carousel-caption",
 		className: cnMerge("absolute z-10", className),
 		children
 	});
 }
 function CarouselIndicatorGroup(props) {
-	const { children, className, each, render } = props;
+	const { children, className, each } = props;
 	const images = useCarouselStoreContext((state) => each ?? state.images);
-	const [IndicatorList] = getElementList("base");
 	return /* @__PURE__ */ jsx("ul", {
-		"data-id": "Carousel Indicators",
+		"data-scope": "carousel",
+		"data-part": "indicator-group",
+		"data-slot": "carousel-indicator-group",
 		className: cnMerge("absolute bottom-[25px] z-[2] flex w-full items-center justify-center gap-[15px]", className),
-		children: typeof render === "function" ? /* @__PURE__ */ jsx(IndicatorList, {
+		children: isFunction(children) ? /* @__PURE__ */ jsx(For, {
 			each: images,
-			render
-		}) : /* @__PURE__ */ jsx(IndicatorList, {
-			each: images,
-			children
-		})
+			renderItem: (image, index, array) => children({
+				array,
+				image,
+				index
+			})
+		}) : children
 	});
 }
 function CarouselIndicator(props) {
 	const { classNames, currentIndex } = props;
 	const { actions: { goToSlide }, currentSlide } = useCarouselStoreContext((state) => state);
 	return /* @__PURE__ */ jsx("li", {
+		"data-scope": "carousel",
+		"data-part": "indicator",
+		"data-slot": "carousel-indicator",
 		className: cnMerge("inline-flex", classNames?.base),
 		children: /* @__PURE__ */ jsx("button", {
 			type: "button",
@@ -256,15 +275,14 @@ var carousel_parts_exports = {};
 __export(carousel_parts_exports, {
 	Button: () => CarouselButton,
 	Caption: () => CarouselCaption,
-	Content: () => CarouselContent,
 	Controls: () => CarouselControls,
 	Indicator: () => CarouselIndicator,
 	IndicatorGroup: () => CarouselIndicatorGroup,
 	Item: () => CarouselItem,
 	ItemGroup: () => CarouselItemGroup,
-	Root: () => CarouselContextProvider
+	Root: () => CarouselRoot
 });
 
 //#endregion
-export { CarouselButton, CarouselCaption, CarouselContent, CarouselControls, CarouselIndicator, CarouselIndicatorGroup, CarouselItem, CarouselItemGroup, carousel_parts_exports };
-//# sourceMappingURL=carousel-Dvp-qURP.js.map
+export { CarouselButton, CarouselCaption, CarouselControls, CarouselIndicator, CarouselIndicatorGroup, CarouselItem, CarouselItemGroup, CarouselRoot, carousel_parts_exports };
+//# sourceMappingURL=carousel-YXXtZ85s.js.map

package/dist/esm/carousel-YXXtZ85s.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"carousel-YXXtZ85s.js","names":["useCarouselStore: typeof useCarouselStoreContext"],"sources":["../../src/components/ui/carousel/carousel-store-context.ts","../../src/components/ui/carousel/icons.tsx","../../src/components/ui/carousel/useCarouselOptions.ts","../../src/components/ui/carousel/carousel.tsx","../../src/components/ui/carousel/carousel-parts.ts"],"sourcesContent":["import { createStore } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef, useStore } from \"@zayne-labs/toolkit-react\";\nimport { createZustandContext } from \"@zayne-labs/toolkit-react/zustand\";\nimport type { PrettyOmit } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport type { CarouselRootProps, CarouselStore, ImagesType } from \"./types\";\n\nconst [CarouselStoreContextProvider, useCarouselStoreContext] = createZustandContext<CarouselStore>({\n\thookName: \"useCarouselStore\",\n\tname: \"CarouselStoreContext\",\n\tproviderName: \"CarouselRoot\",\n});\n\n// CarouselStore Creation\nconst createCarouselStore = <TImages extends ImagesType>(\n\tstoreValues: PrettyOmit<CarouselRootProps<TImages>, \"children\">\n) => {\n\tconst { images, onSlideBtnClick } = storeValues;\n\n\tconst carouselStore = createStore<CarouselStore<TImages>>((set, get) => ({\n\t\tcurrentSlide: 0,\n\t\timages,\n\t\tmaxSlide: images.length - 1,\n\n\t\t/* eslint-disable perfectionist/sort-objects -- actions should be last */\n\t\tactions: {\n\t\t\t/* eslint-enable perfectionist/sort-objects -- actions should be last */\n\n\t\t\tgoToNextSlide: () => {\n\t\t\t\tconst { currentSlide, maxSlide } = get();\n\t\t\t\tconst { goToSlide } = get().actions;\n\n\t\t\t\tif (currentSlide === maxSlide) {\n\t\t\t\t\tgoToSlide(0);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tgoToSlide(currentSlide + 1);\n\t\t\t},\n\n\t\t\tgoToPreviousSlide: () => {\n\t\t\t\tconst { currentSlide, maxSlide } = get();\n\t\t\t\tconst { goToSlide } = get().actions;\n\n\t\t\t\tif (currentSlide === 0) {\n\t\t\t\t\tgoToSlide(maxSlide);\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tgoToSlide(currentSlide - 1);\n\t\t\t},\n\n\t\t\tgoToSlide: (newValue) => {\n\t\t\t\tonSlideBtnClick?.();\n\n\t\t\t\tset({ currentSlide: newValue });\n\t\t\t},\n\t\t},\n\t}));\n\n\treturn carouselStore;\n};\n\nconst useCarousel = <TImages extends ImagesType>(props: Omit<CarouselRootProps<TImages>, \"children\">) => {\n\tconst { images, onSlideBtnClick } = props;\n\n\tconst savedOnSlideBtnClick = useCallbackRef(onSlideBtnClick);\n\n\tconst carouselStore = useMemo(\n\t\t() => createCarouselStore({ images, onSlideBtnClick: savedOnSlideBtnClick }),\n\t\t[images, savedOnSlideBtnClick]\n\t);\n\n\tconst useCarouselStore: typeof useCarouselStoreContext = (selector) => {\n\t\treturn useStore(carouselStore, selector);\n\t};\n\n\tconst savedUseCarouselStore = useCallbackRef(useCarouselStore);\n\n\treturn useMemo(\n\t\t() => ({ carouselStore, useCarouselStore: savedUseCarouselStore }),\n\t\t[carouselStore, savedUseCarouselStore]\n\t);\n};\n\nexport { CarouselStoreContextProvider, useCarousel, useCarouselStoreContext };\n","import * as React from \"react\";\n\nexport const ChevronLeftIcon = (props: React.SVGProps<SVGSVGElement>) => (\n\t<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"1em\" height=\"1em\" viewBox=\"0 0 24 24\" {...props}>\n\t\t<g fill=\"none\" stroke=\"currentColor\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n\t\t\t<circle cx=\"12\" cy=\"12\" r=\"10\" />\n\t\t\t<path d=\"m14 16l-4-4l4-4\" />\n\t\t</g>\n\t</svg>\n);\n","import { useAnimationInterval, useCallbackRef } from \"@zayne-labs/toolkit-react\";\nimport { useState } from \"react\";\nimport type { CarouselStore } from \"./types\";\n\ntype CarouselOptions = {\n\tactions: CarouselStore[\"actions\"];\n\tautoSlideInterval?: number;\n\thasAutoSlide?: boolean;\n\tshouldPauseOnHover?: boolean;\n};\n\nconst useCarouselOptions = (options: CarouselOptions) => {\n\tconst { actions, autoSlideInterval = 5000, hasAutoSlide = false, shouldPauseOnHover = false } = options;\n\n\tconst [isPaused, setIsPaused] = useState(false);\n\n\tconst shouldAutoSlide = hasAutoSlide && !isPaused;\n\n\tuseAnimationInterval({\n\t\tintervalDuration: shouldAutoSlide ? autoSlideInterval : null,\n\t\tonAnimation: actions.goToNextSlide,\n\t});\n\n\tconst pauseAutoSlide = useCallbackRef(() => shouldPauseOnHover && setIsPaused(true));\n\n\tconst resumeAutoSlide = useCallbackRef(() => shouldPauseOnHover && setIsPaused(false));\n\n\treturn { pauseAutoSlide, resumeAutoSlide };\n};\n\nexport { useCarouselOptions };\n","\"use client\";\n\nimport type { CssWithCustomProperties, PolymorphicProps } from \"@zayne-labs/toolkit-react/utils\";\nimport { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\nimport * as React from \"react\";\nimport { Show } from \"@/components/common\";\nimport { For } from \"@/components/common/for\";\nimport { cnMerge } from \"@/lib/utils/cn\";\nimport {\n\tCarouselStoreContextProvider,\n\tuseCarousel,\n\tuseCarouselStoreContext,\n} from \"./carousel-store-context\";\nimport { ChevronLeftIcon } from \"./icons\";\nimport type {\n\tCarouselButtonsProps,\n\tCarouselControlProps,\n\tCarouselIndicatorProps,\n\tCarouselRootProps,\n\tCarouselWrapperProps,\n\tImagesType,\n\tOtherCarouselProps,\n} from \"./types\";\nimport { useCarouselOptions } from \"./useCarouselOptions\";\n\n// TODO -  Add dragging and swiping support\nexport function CarouselRoot<TImages extends ImagesType, TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicProps<TElement, CarouselRootProps<TImages>>\n) {\n\tconst {\n\t\tas: Element = \"div\",\n\t\tautoSlideInterval,\n\t\tchildren,\n\t\tclassNames,\n\t\thasAutoSlide,\n\t\timages,\n\t\tonSlideBtnClick,\n\t\tshouldPauseOnHover,\n\t} = props;\n\n\tconst { carouselStore } = useCarousel({ images, onSlideBtnClick });\n\n\tconst actions = carouselStore.getState().actions;\n\n\tconst { pauseAutoSlide, resumeAutoSlide } = useCarouselOptions({\n\t\tactions,\n\t\tautoSlideInterval,\n\t\thasAutoSlide,\n\t\tshouldPauseOnHover,\n\t});\n\n\treturn (\n\t\t<CarouselStoreContextProvider store={carouselStore}>\n\t\t\t<Element\n\t\t\t\tdata-scope=\"carousel\"\n\t\t\t\tdata-part=\"content\"\n\t\t\t\tdata-slot=\"carousel-content\"\n\t\t\t\tclassName={cnMerge(\"relative select-none\", classNames?.base)}\n\t\t\t\tonMouseEnter={pauseAutoSlide}\n\t\t\t\tonMouseLeave={resumeAutoSlide}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\t\"flex size-full overflow-x-scroll [scrollbar-width:none] [&::-webkit-scrollbar]:hidden\",\n\t\t\t\t\t\tclassNames?.scrollContainer\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</Element>\n\t\t</CarouselStoreContextProvider>\n\t);\n}\n\nexport function CarouselButton(props: CarouselButtonsProps) {\n\tconst { classNames, icon, variant } = props;\n\n\tconst { goToNextSlide, goToPreviousSlide } = useCarouselStoreContext((state) => state.actions);\n\n\treturn (\n\t\t<button\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"button\"\n\t\t\tdata-slot=\"carousel-button\"\n\t\t\ttype=\"button\"\n\t\t\tclassName={cnMerge(\n\t\t\t\t\"z-30 flex h-full w-fit items-center\",\n\t\t\t\tvariant === \"prev\" ? \"justify-start\" : \"justify-end\",\n\t\t\t\tclassNames?.base\n\t\t\t)}\n\t\t\tonClick={variant === \"prev\" ? goToPreviousSlide : goToNextSlide}\n\t\t>\n\t\t\t<span className={cnMerge(\"transition-transform active:scale-[1.06]\", classNames?.iconContainer)}>\n\t\t\t\t{icon ?? (\n\t\t\t\t\t<ChevronLeftIcon\n\t\t\t\t\t\tclassName={cnMerge(variant === \"next\" && \"rotate-180\", classNames?.defaultIcon)}\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</span>\n\t\t</button>\n\t);\n}\n\nexport function CarouselControls(props: CarouselControlProps) {\n\tconst { classNames, icon } = props;\n\n\treturn (\n\t\t<div\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"controls\"\n\t\t\tdata-slot=\"carousel-controls\"\n\t\t\tclassName={cnMerge(\"absolute inset-0 flex justify-between\", classNames?.base)}\n\t\t>\n\t\t\t<Show.Root when={icon?.iconType}>\n\t\t\t\t<Show.Content>\n\t\t\t\t\t<CarouselButton\n\t\t\t\t\t\tvariant=\"prev\"\n\t\t\t\t\t\tclassNames={{\n\t\t\t\t\t\t\tdefaultIcon: classNames?.defaultIcon,\n\t\t\t\t\t\t\ticonContainer: cnMerge(\n\t\t\t\t\t\t\t\ticon?.iconType === \"nextIcon\" && \"rotate-180\",\n\t\t\t\t\t\t\t\tclassNames?.iconContainer\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t}}\n\t\t\t\t\t\ticon={icon?.icon}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<CarouselButton\n\t\t\t\t\t\tvariant=\"next\"\n\t\t\t\t\t\tclassNames={{\n\t\t\t\t\t\t\tdefaultIcon: classNames?.defaultIcon,\n\t\t\t\t\t\t\ticonContainer: cnMerge(\n\t\t\t\t\t\t\t\ticon?.iconType === \"prevIcon\" && \"rotate-180\",\n\t\t\t\t\t\t\t\tclassNames?.iconContainer\n\t\t\t\t\t\t\t),\n\t\t\t\t\t\t}}\n\t\t\t\t\t\ticon={icon?.icon}\n\t\t\t\t\t/>\n\t\t\t\t</Show.Content>\n\n\t\t\t\t<Show.Otherwise>\n\t\t\t\t\t<CarouselButton\n\t\t\t\t\t\tvariant=\"prev\"\n\t\t\t\t\t\tclassNames={{\n\t\t\t\t\t\t\tdefaultIcon: classNames?.defaultIcon,\n\t\t\t\t\t\t\ticonContainer: classNames?.iconContainer,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\ticon={icon?.prev}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<CarouselButton\n\t\t\t\t\t\tvariant=\"next\"\n\t\t\t\t\t\tclassNames={{\n\t\t\t\t\t\t\tdefaultIcon: classNames?.defaultIcon,\n\t\t\t\t\t\t\ticonContainer: classNames?.iconContainer,\n\t\t\t\t\t\t}}\n\t\t\t\t\t\ticon={icon?.next}\n\t\t\t\t\t/>\n\t\t\t\t</Show.Otherwise>\n\t\t\t</Show.Root>\n\t\t</div>\n\t);\n}\n\nexport function CarouselItemGroup<TArrayItem>(props: CarouselWrapperProps<TArrayItem>) {\n\tconst { children, className, each } = props;\n\n\tconst currentSlide = useCarouselStoreContext((state) => state.currentSlide);\n\tconst images = useCarouselStoreContext((state) => each ?? (state.images as TArrayItem[]));\n\n\treturn (\n\t\t<ul\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"item-group\"\n\t\t\tdata-slot=\"carousel-item-group\"\n\t\t\tclassName={cnMerge(\n\t\t\t\t`duration-800 transform-[translate3d(var(--translate-distance),0,0)] flex w-full shrink-0\n\t\t\t\tsnap-center transition-transform`,\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\tstyle={\n\t\t\t\t{\n\t\t\t\t\t\"--translate-distance\": `-${currentSlide * 100}%`,\n\t\t\t\t} satisfies CssWithCustomProperties as CssWithCustomProperties\n\t\t\t}\n\t\t>\n\t\t\t{isFunction(children) ?\n\t\t\t\t<For each={images} renderItem={(image, index, array) => children({ array, image, index })} />\n\t\t\t:\tchildren}\n\t\t</ul>\n\t);\n}\n\nexport function CarouselItem(props: OtherCarouselProps) {\n\tconst { children, className, ...restOfProps } = props;\n\n\treturn (\n\t\t<li\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"item\"\n\t\t\tdata-slot=\"carousel-item\"\n\t\t\tclassName={cnMerge(\"flex w-full shrink-0 snap-center justify-center\", className)}\n\t\t\t{...restOfProps}\n\t\t>\n\t\t\t{children}\n\t\t</li>\n\t);\n}\n\nexport function CarouselCaption<TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicProps<TElement, OtherCarouselProps>\n) {\n\tconst { as: HtmlElement = \"div\", children, className } = props;\n\n\treturn (\n\t\t<HtmlElement\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"caption\"\n\t\t\tdata-slot=\"carousel-caption\"\n\t\t\tclassName={cnMerge(\"absolute z-10\", className)}\n\t\t>\n\t\t\t{children}\n\t\t</HtmlElement>\n\t);\n}\n\nexport function CarouselIndicatorGroup<TArrayItem>(props: CarouselWrapperProps<TArrayItem>) {\n\tconst { children, className, each } = props;\n\n\tconst images = useCarouselStoreContext((state) => each ?? (state.images as TArrayItem[]));\n\n\treturn (\n\t\t<ul\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"indicator-group\"\n\t\t\tdata-slot=\"carousel-indicator-group\"\n\t\t\tclassName={cnMerge(\n\t\t\t\t\"absolute bottom-[25px] z-[2] flex w-full items-center justify-center gap-[15px]\",\n\t\t\t\tclassName\n\t\t\t)}\n\t\t>\n\t\t\t{isFunction(children) ?\n\t\t\t\t<For each={images} renderItem={(image, index, array) => children({ array, image, index })} />\n\t\t\t:\tchildren}\n\t\t</ul>\n\t);\n}\n\nexport function CarouselIndicator(props: CarouselIndicatorProps) {\n\tconst { classNames, currentIndex } = props;\n\n\tconst {\n\t\tactions: { goToSlide },\n\t\tcurrentSlide,\n\t} = useCarouselStoreContext((state) => state);\n\n\treturn (\n\t\t<li\n\t\t\tdata-scope=\"carousel\"\n\t\t\tdata-part=\"indicator\"\n\t\t\tdata-slot=\"carousel-indicator\"\n\t\t\tclassName={cnMerge(\"inline-flex\", classNames?.base)}\n\t\t>\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tonClick={() => goToSlide(currentIndex)}\n\t\t\t\tclassName={cnMerge(\n\t\t\t\t\t\"size-[6px] rounded-[50%]\",\n\t\t\t\t\tclassNames?.base,\n\t\t\t\t\tcurrentIndex === currentSlide && [\"w-[35px] rounded-[5px]\", classNames?.isActive]\n\t\t\t\t)}\n\t\t\t/>\n\t\t</li>\n\t);\n}\n","export {\n\tCarouselButton as Button,\n\tCarouselCaption as Caption,\n\tCarouselControls as Controls,\n\tCarouselIndicator as Indicator,\n\tCarouselIndicatorGroup as IndicatorGroup,\n\tCarouselItem as Item,\n\tCarouselItemGroup as ItemGroup,\n\tCarouselRoot as Root,\n} from \"./carousel\";\n"],"mappings":"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"}

package/dist/esm/cn-_FbtIrlZ.js.map

@@ -1 +1 @@
-{"version":3,"file":"cn-_FbtIrlZ.js","names":[],"sources":["../../src/lib/utils/cn.ts"],"sourcesContent":["import { type ClassNameValue, twMerge } from \"tailwind-merge\";\n\nexport const cnMerge = (...classNames: ClassNameValue[]) => twMerge(classNames);\n"],"mappings":";;;AAEA,MAAa,UAAU,CAAC,GAAG,eAAiC,QAAQ,WAAW"}
+{"version":3,"file":"cn-_FbtIrlZ.js","names":[],"sources":["../../src/lib/utils/cn.ts"],"sourcesContent":["import { type ClassNameValue, twMerge } from \"tailwind-merge\";\n\nexport const cnMerge = (...classNames: ClassNameValue[]) => twMerge(classNames);\n"],"mappings":";;;AAEA,MAAa,WAAW,GAAG,eAAiC,QAAQ"}

package/dist/esm/components/common/await/index.d.ts

@@ -1,6 +1,5 @@
-import "../../../getSlotMap-DZlQN8--.js";
-import "../../../index-DRiwJkJC.js";
-import "../../../index-BsjcsNQh.js";
-import "../../../index-CFNg1R-m.js";
-import { AwaitError, AwaitPending, AwaitRoot, AwaitSuccess, await_parts_d_exports, useAwaitContext } from "../../../index-YFi-sIuR.js";
+import "../../../index-BNrCAe9Y.js";
+import "../../../index-lKxE9WPi.js";
+import "../../../index-eCX5RJ41.js";
+import { AwaitError, AwaitPending, AwaitRoot, AwaitSuccess, await_parts_d_exports, useAwaitContext } from "../../../index-BaONHZq0.js";
 export { await_parts_d_exports as Await, AwaitError, AwaitPending, AwaitRoot, AwaitSuccess, useAwaitContext };

package/dist/esm/components/common/await/index.js

@@ -1,10 +1,10 @@
 "use client";
 
 
-import "../../../utils-D4YNWj2X.js";
-import "../../../getSlot-D1_uG-Ym.js";
-import "../../../error-boundary-B3ycUZ1t.js";
-import "../../../slot-RXTKo4L7.js";
-import { AwaitError, AwaitPending, AwaitRoot, AwaitSuccess, await_parts_exports, useAwaitContext } from "../../../await-Fe4LFRKd.js";
+import "../../../utils-ChjmDoRe.js";
+import "../../../getSlot-Cf5ON6lE.js";
+import "../../../error-boundary-xM9An3gz.js";
+import "../../../slot-D1062oA5.js";
+import { AwaitError, AwaitPending, AwaitRoot, AwaitSuccess, await_parts_exports, useAwaitContext } from "../../../await-fjas2Q-C.js";
 
 export { await_parts_exports as Await, AwaitError, AwaitPending, AwaitRoot, AwaitSuccess, useAwaitContext };

package/dist/esm/components/common/error-boundary/index.d.ts

@@ -1,2 +1,2 @@
-import { ErrorBoundary, ErrorBoundaryContextType, ErrorBoundaryProps, FallbackProps, useErrorBoundary, useErrorBoundaryContext } from "../../../index-BsjcsNQh.js";
+import { ErrorBoundary, ErrorBoundaryContextType, ErrorBoundaryProps, FallbackProps, useErrorBoundary, useErrorBoundaryContext } from "../../../index-lKxE9WPi.js";
 export { ErrorBoundary, ErrorBoundaryContextType, ErrorBoundaryProps, FallbackProps, useErrorBoundary, useErrorBoundaryContext };

package/dist/esm/components/common/error-boundary/index.js

@@ -1,6 +1,6 @@
 "use client";
 
 
-import { ErrorBoundary, useErrorBoundary, useErrorBoundaryContext } from "../../../error-boundary-B3ycUZ1t.js";
+import { ErrorBoundary, useErrorBoundary, useErrorBoundaryContext } from "../../../error-boundary-xM9An3gz.js";
 
 export { ErrorBoundary, useErrorBoundary, useErrorBoundaryContext };

package/dist/esm/components/common/for/index.d.ts

@@ -1,2 +1,2 @@
-import { For, ForRenderProps, ForWithWrapper, getElementList } from "../../../index-CNE9Cime.js";
+import { For, ForRenderProps, ForWithWrapper, getElementList } from "../../../index-CnvH74ea.js";
 export { For, ForRenderProps, ForWithWrapper, getElementList };

package/dist/esm/components/common/for/index.js

@@ -1,3 +1,3 @@
-import { For, ForWithWrapper, getElementList } from "../../../for-aTw1TgJo.js";
+import { For, ForWithWrapper, getElementList } from "../../../for-DGs2XZ21.js";
 
 export { For, ForWithWrapper, getElementList };

package/dist/esm/components/common/index.d.ts

@@ -1,11 +1,10 @@
-import "../../getSlotMap-DZlQN8--.js";
-import "../../index-DRiwJkJC.js";
-import { ErrorBoundary } from "../../index-BsjcsNQh.js";
-import { SuspenseWithBoundary } from "../../index-CFNg1R-m.js";
-import { await_parts_d_exports } from "../../index-YFi-sIuR.js";
-import { For, ForWithWrapper } from "../../index-CNE9Cime.js";
-import { show_parts_d_exports } from "../../index-CGI7EVlK.js";
-import { slot_parts_d_exports } from "../../index-BwnMUHzm.js";
-import { switch_parts_d_exports } from "../../index-UX3DaMVe.js";
-import { Teleport } from "../../index-B3N6YbN8.js";
+import "../../index-BNrCAe9Y.js";
+import { ErrorBoundary } from "../../index-lKxE9WPi.js";
+import { SuspenseWithBoundary } from "../../index-eCX5RJ41.js";
+import { await_parts_d_exports } from "../../index-BaONHZq0.js";
+import { For, ForWithWrapper } from "../../index-CnvH74ea.js";
+import { show_parts_d_exports } from "../../index-DVr1tbxh.js";
+import { slot_parts_d_exports } from "../../index-BBJzo-WC.js";
+import { switch_parts_d_exports } from "../../index-DJjxpXUk.js";
+import { Teleport } from "../../index-CWKQ5V4B.js";
 export { await_parts_d_exports as Await, ErrorBoundary, For, ForWithWrapper, show_parts_d_exports as Show, slot_parts_d_exports as Slot, SuspenseWithBoundary, switch_parts_d_exports as Switch, Teleport };

package/dist/esm/components/common/index.js

@@ -1,13 +1,13 @@
-import "../../utils-D4YNWj2X.js";
-import "../../getSlot-D1_uG-Ym.js";
-import { ErrorBoundary } from "../../error-boundary-B3ycUZ1t.js";
-import { slot_parts_exports } from "../../slot-RXTKo4L7.js";
-import { await_parts_exports } from "../../await-Fe4LFRKd.js";
-import { For, ForWithWrapper } from "../../for-aTw1TgJo.js";
-import { show_parts_exports } from "../../show-DNPzdLi-.js";
-import { SuspenseWithBoundary } from "../../suspense-with-boundary-TrQxYRG6.js";
-import { switch_parts_exports } from "../../switch-B2gKl94R.js";
-import { Teleport } from "../../teleport-dlSjWj_t.js";
+import "../../utils-ChjmDoRe.js";
+import "../../getSlot-Cf5ON6lE.js";
+import { ErrorBoundary } from "../../error-boundary-xM9An3gz.js";
+import { slot_parts_exports } from "../../slot-D1062oA5.js";
+import { await_parts_exports } from "../../await-fjas2Q-C.js";
+import { For, ForWithWrapper } from "../../for-DGs2XZ21.js";
+import { show_parts_exports } from "../../show-BabiXbf7.js";
+import { SuspenseWithBoundary } from "../../suspense-with-boundary-CEVORL8K.js";
+import { switch_parts_exports } from "../../switch-CCMD01Rs.js";
+import { Teleport } from "../../teleport-DfuYOzsj.js";
 import "../../common-BYWy8Q78.js";
 
 export { await_parts_exports as Await, ErrorBoundary, For, ForWithWrapper, show_parts_exports as Show, slot_parts_exports as Slot, SuspenseWithBoundary, switch_parts_exports as Switch, Teleport };

package/dist/esm/components/common/show/index.d.ts

@@ -1,2 +1,2 @@
-import { ShowContent, ShowFallback, ShowRoot, show_parts_d_exports } from "../../../index-CGI7EVlK.js";
+import { ShowContent, ShowFallback, ShowRoot, show_parts_d_exports } from "../../../index-DVr1tbxh.js";
 export { show_parts_d_exports as Show, ShowContent, ShowFallback, ShowRoot };

package/dist/esm/components/common/show/index.js

@@ -1,7 +1,7 @@
 "use client";
 
 
-import "../../../getSlot-D1_uG-Ym.js";
-import { ShowContent, ShowFallback, ShowRoot, show_parts_exports } from "../../../show-DNPzdLi-.js";
+import "../../../getSlot-Cf5ON6lE.js";
+import { ShowContent, ShowFallback, ShowRoot, show_parts_exports } from "../../../show-BabiXbf7.js";
 
 export { show_parts_exports as Show, ShowContent, ShowFallback, ShowRoot };

package/dist/esm/components/common/slot/index.d.ts

@@ -1,2 +1,2 @@
-import { SlotRoot, SlotSlottable, slot_parts_d_exports } from "../../../index-BwnMUHzm.js";
+import { SlotRoot, SlotSlottable, slot_parts_d_exports } from "../../../index-BBJzo-WC.js";
 export { slot_parts_d_exports as Slot, SlotRoot, SlotSlottable };

package/dist/esm/components/common/slot/index.js

@@ -1,3 +1,3 @@
-import { SlotRoot, SlotSlottable, slot_parts_exports } from "../../../slot-RXTKo4L7.js";
+import { SlotRoot, SlotSlottable, slot_parts_exports } from "../../../slot-D1062oA5.js";
 
 export { slot_parts_exports as Slot, SlotRoot, SlotSlottable };

package/dist/esm/components/common/suspense-with-boundary/index.d.ts

@@ -1,3 +1,3 @@
-import "../../../index-BsjcsNQh.js";
-import { SuspenseWithBoundary, SuspenseWithBoundaryProps } from "../../../index-CFNg1R-m.js";
+import "../../../index-lKxE9WPi.js";
+import { SuspenseWithBoundary, SuspenseWithBoundaryProps } from "../../../index-eCX5RJ41.js";
 export { SuspenseWithBoundary, SuspenseWithBoundaryProps };

package/dist/esm/components/common/suspense-with-boundary/index.js

@@ -1,4 +1,4 @@
-import "../../../error-boundary-B3ycUZ1t.js";
-import { SuspenseWithBoundary } from "../../../suspense-with-boundary-TrQxYRG6.js";
+import "../../../error-boundary-xM9An3gz.js";
+import { SuspenseWithBoundary } from "../../../suspense-with-boundary-CEVORL8K.js";
 
 export { SuspenseWithBoundary };

package/dist/esm/components/common/switch/index.d.ts

@@ -1,2 +1,2 @@
-import { SwitchDefault, SwitchMatch, SwitchRoot, switch_parts_d_exports } from "../../../index-UX3DaMVe.js";
+import { SwitchDefault, SwitchMatch, SwitchRoot, switch_parts_d_exports } from "../../../index-DJjxpXUk.js";
 export { switch_parts_d_exports as Switch, SwitchDefault, SwitchMatch, SwitchRoot };