@zayne-labs/ui-react 0.6.3 → 0.7.1

package/dist/esm/{chunk-ENDWJXPF.js → chunk-L2SROZYQ.js}

@@ -43,5 +43,5 @@ function SlotClone(props) {
 }
 
 export { Slot, Slottable };
-//# sourceMappingURL=chunk-ENDWJXPF.js.map
-//# sourceMappingURL=chunk-ENDWJXPF.js.map
+//# sourceMappingURL=chunk-L2SROZYQ.js.map
+//# sourceMappingURL=chunk-L2SROZYQ.js.map

package/dist/esm/{chunk-ENDWJXPF.js.map → chunk-L2SROZYQ.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/common/slot/slot.tsx"],"names":[],"mappings":";;;;;;AAYO,SAAS,SAAA,CAAU,EAAE,QAAA,EAAyC,EAAA;AACpE,EAAO,OAAA,QAAA;AACR;AAEA,IAAM,WAAA,GAAc,CAAC,KAAwD,KAAA;AAC5E,EAAA,OAAO,cAAe,CAAA,KAAK,CAAK,IAAA,KAAA,CAAM,IAAS,KAAA,SAAA;AAChD,CAAA;AAMO,SAAS,KAAK,KAAkB,EAAA;AACtC,EAAA,MAAM,EAAE,QAAA,EAAU,GAAG,eAAA,EAAoB,GAAA,KAAA;AAEzC,EAAA,MAAM,gBAAgB,OAAyB,CAAA,QAAQ,CAAI,GAAA,QAAA,GAAW,CAAC,QAAQ,CAAA;AAC/E,EAAA,MAAM,YAAY,aAAc,CAAA,IAAA,CAAK,CAAC,OAAY,KAAA,WAAA,CAAY,OAAO,CAAC,CAAA;AAEtE,EAAA,IAAI,SAAW,EAAA;AAEd,IAAM,MAAA,UAAA,GAAc,UAAU,KAAoB,CAAA,QAAA;AAElD,IAAA,IAAI,QAAS,CAAA,KAAA,CAAM,UAAU,CAAA,GAAI,CAAG,EAAA;AACnC,MAAO,OAAA,QAAA,CAAS,KAAK,IAAI,CAAA;AAAA;AAG1B,IAAA,MAAM,kBAAqB,GAAA,aAAA,CAAc,GAAI,CAAA,CAAC,KAAU,KAAA;AACvD,MAAA,IAAI,UAAU,SAAW,EAAA;AAExB,QAAA,OAAO,cAA0B,CAAA,UAAU,CAAK,IAAA,UAAA,CAAW,KAAM,CAAA,QAAA;AAAA;AAGlE,MAAO,OAAA,KAAA;AAAA,KACP,CAAA;AAED,IACC,uBAAA,KAAA,CAAA,aAAA,CAAC,SAAW,EAAA,EAAA,GAAG,eACb,EAAA,EAAA,cAAA,CAAe,UAAU,CAAA,IAAK,YAAa,CAAA,UAAA,EAAY,MAAW,EAAA,kBAAkB,CACtF,CAAA;AAAA;AAIF,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA,EAAW,GAAG,eAAA,EAAA,EAAkB,QAAS,CAAA;AAClD;AASA,SAAS,UAAU,KAAuB,EAAA;AACzC,EAAA,MAAM,EAAE,QAAU,EAAA,GAAA,EAAK,YAAc,EAAA,GAAG,iBAAoB,GAAA,KAAA;AAE5D,EAAI,IAAA,CAAC,cAA6B,CAAA,QAAQ,CAAG,EAAA;AAC5C,IAAO,OAAA,QAAA,CAAS,MAAM,QAAQ,CAAA,GAAI,IAAI,QAAS,CAAA,IAAA,CAAK,IAAI,CAAI,GAAA,IAAA;AAAA;AAG7D,EAAA,MAAM,QAAW,GAAA,QAAA,CAAS,KAAM,CAAA,GAAA,IAAQ,QAAqC,CAAA,GAAA;AAE7E,EAAA,MAAM,WAAc,GAAA;AAAA,IACnB,GAAG,UAAA,CAAW,eAAiB,EAAA,QAAA,CAAS,KAAK,CAAA;AAAA,IAC7C,KAAK,YAAe,GAAA,WAAA,CAAY,CAAC,YAAc,EAAA,QAA8B,CAAC,CAAI,GAAA;AAAA,GACnF;AAEA,EAAO,OAAA,YAAA,CAAa,UAAU,WAAW,CAAA;AAC1C","file":"chunk-ENDWJXPF.js","sourcesContent":["import * as React from \"react\";\n\nimport { type InferProps, composeRefs, mergeProps } from \"@zayne-labs/toolkit-react/utils\";\nimport { isArray } from \"@zayne-labs/toolkit-type-helpers\";\nimport { Children, cloneElement, isValidElement } from \"react\";\n\ntype SlotProps = InferProps<HTMLElement>;\n\n/* -------------------------------------------------------------------------------------------------\n * Slottable\n * ----------------------------------------------------------------------------------------------- */\n\nexport function Slottable({ children }: Pick<SlotProps, \"children\">) {\n\treturn children;\n}\n\nconst isSlottable = (child: React.ReactNode): child is React.ReactElement => {\n\treturn isValidElement(child) && child.type === Slottable;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Slot\n * ----------------------------------------------------------------------------------------------- */\n\nexport function Slot(props: SlotProps) {\n\tconst { children, ...restOfSlotProps } = props;\n\n\tconst childrenArray = isArray<React.ReactNode>(children) ? children : [children];\n\tconst slottable = childrenArray.find((element) => isSlottable(element));\n\n\tif (slottable) {\n\t\t// == The new element to render is the one passed as a child of `Slottable`\n\t\tconst newElement = (slottable.props as SlotProps).children;\n\n\t\tif (Children.count(newElement) > 1) {\n\t\t\treturn Children.only(null);\n\t\t}\n\n\t\tconst newElementChildren = childrenArray.map((child) => {\n\t\t\tif (child === slottable) {\n\t\t\t\t// == Because the new element will be the one rendered, we are only interested in grabbing its children (`newElement.props.children`)\n\t\t\t\treturn isValidElement<SlotProps>(newElement) && newElement.props.children;\n\t\t\t}\n\n\t\t\treturn child;\n\t\t});\n\n\t\treturn (\n\t\t\t<SlotClone {...restOfSlotProps}>\n\t\t\t\t{isValidElement(newElement) && cloneElement(newElement, undefined, newElementChildren)}\n\t\t\t</SlotClone>\n\t\t);\n\t}\n\n\treturn <SlotClone {...restOfSlotProps}>{children}</SlotClone>;\n}\n\ntype SlotCloneProps = {\n\tchildren: React.ReactNode;\n\tref?: React.RefObject<HTMLElement>;\n};\n\ntype UnknownProps = Record<string, unknown>;\n\nfunction SlotClone(props: SlotCloneProps) {\n\tconst { children, ref: forwardedRef, ...restOfSlotProps } = props;\n\n\tif (!isValidElement<UnknownProps>(children)) {\n\t\treturn Children.count(children) > 1 ? Children.only(null) : null;\n\t}\n\n\tconst childRef = children.props.ref ?? (children as unknown as UnknownProps).ref;\n\n\tconst clonedProps = {\n\t\t...mergeProps(restOfSlotProps, children.props),\n\t\tref: forwardedRef ? composeRefs([forwardedRef, childRef as React.Ref<unknown>]) : childRef,\n\t};\n\n\treturn cloneElement(children, clonedProps);\n}\n"]}
+{"version":3,"sources":["../../src/components/common/slot/slot.tsx"],"names":[],"mappings":";;;;;;AAYO,SAAS,SAAA,CAAU,EAAE,QAAA,EAAyC,EAAA;AACpE,EAAO,OAAA,QAAA;AACR;AAEA,IAAM,WAAA,GAAc,CAAC,KAAwD,KAAA;AAC5E,EAAA,OAAO,cAAe,CAAA,KAAK,CAAK,IAAA,KAAA,CAAM,IAAS,KAAA,SAAA;AAChD,CAAA;AAMO,SAAS,KAAK,KAAkB,EAAA;AACtC,EAAA,MAAM,EAAE,QAAA,EAAU,GAAG,eAAA,EAAoB,GAAA,KAAA;AAEzC,EAAA,MAAM,gBAAgB,OAAyB,CAAA,QAAQ,CAAI,GAAA,QAAA,GAAW,CAAC,QAAQ,CAAA;AAC/E,EAAA,MAAM,YAAY,aAAc,CAAA,IAAA,CAAK,CAAC,OAAY,KAAA,WAAA,CAAY,OAAO,CAAC,CAAA;AAEtE,EAAA,IAAI,SAAW,EAAA;AAEd,IAAM,MAAA,UAAA,GAAc,UAAU,KAAoB,CAAA,QAAA;AAElD,IAAA,IAAI,QAAS,CAAA,KAAA,CAAM,UAAU,CAAA,GAAI,CAAG,EAAA;AACnC,MAAO,OAAA,QAAA,CAAS,KAAK,IAAI,CAAA;AAAA;AAG1B,IAAA,MAAM,kBAAqB,GAAA,aAAA,CAAc,GAAI,CAAA,CAAC,KAAU,KAAA;AACvD,MAAA,IAAI,UAAU,SAAW,EAAA;AAExB,QAAA,OAAO,cAA0B,CAAA,UAAU,CAAK,IAAA,UAAA,CAAW,KAAM,CAAA,QAAA;AAAA;AAGlE,MAAO,OAAA,KAAA;AAAA,KACP,CAAA;AAED,IACC,uBAAA,KAAA,CAAA,aAAA,CAAC,SAAW,EAAA,EAAA,GAAG,eACb,EAAA,EAAA,cAAA,CAAe,UAAU,CAAA,IAAK,YAAa,CAAA,UAAA,EAAY,MAAW,EAAA,kBAAkB,CACtF,CAAA;AAAA;AAIF,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA,EAAW,GAAG,eAAA,EAAA,EAAkB,QAAS,CAAA;AAClD;AASA,SAAS,UAAU,KAAuB,EAAA;AACzC,EAAA,MAAM,EAAE,QAAU,EAAA,GAAA,EAAK,YAAc,EAAA,GAAG,iBAAoB,GAAA,KAAA;AAE5D,EAAI,IAAA,CAAC,cAA6B,CAAA,QAAQ,CAAG,EAAA;AAC5C,IAAO,OAAA,QAAA,CAAS,MAAM,QAAQ,CAAA,GAAI,IAAI,QAAS,CAAA,IAAA,CAAK,IAAI,CAAI,GAAA,IAAA;AAAA;AAG7D,EAAA,MAAM,QAAY,GAAA,QAAA,CAAS,KAAM,CAAA,GAAA,IAC5B,QAAqC,CAAA,GAAA;AAE1C,EAAA,MAAM,WAAc,GAAA;AAAA,IACnB,GAAG,UAAA,CAAW,eAAiB,EAAA,QAAA,CAAS,KAAK,CAAA;AAAA,IAC7C,KAAK,YAAe,GAAA,WAAA,CAAY,CAAC,YAAc,EAAA,QAAQ,CAAC,CAAI,GAAA;AAAA,GAC7D;AAEA,EAAO,OAAA,YAAA,CAAa,UAAU,WAAW,CAAA;AAC1C","file":"chunk-L2SROZYQ.js","sourcesContent":["import * as React from \"react\";\n\nimport { type InferProps, composeRefs, mergeProps } from \"@zayne-labs/toolkit-react/utils\";\nimport { isArray } from \"@zayne-labs/toolkit-type-helpers\";\nimport { Children, cloneElement, isValidElement } from \"react\";\n\ntype SlotProps = InferProps<HTMLElement>;\n\n/* -------------------------------------------------------------------------------------------------\n * Slottable\n * ----------------------------------------------------------------------------------------------- */\n\nexport function Slottable({ children }: Pick<SlotProps, \"children\">) {\n\treturn children;\n}\n\nconst isSlottable = (child: React.ReactNode): child is React.ReactElement => {\n\treturn isValidElement(child) && child.type === Slottable;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Slot\n * ----------------------------------------------------------------------------------------------- */\n\nexport function Slot(props: SlotProps) {\n\tconst { children, ...restOfSlotProps } = props;\n\n\tconst childrenArray = isArray<React.ReactNode>(children) ? children : [children];\n\tconst slottable = childrenArray.find((element) => isSlottable(element));\n\n\tif (slottable) {\n\t\t// == The new element to render is the one passed as a child of `Slottable`\n\t\tconst newElement = (slottable.props as SlotProps).children;\n\n\t\tif (Children.count(newElement) > 1) {\n\t\t\treturn Children.only(null);\n\t\t}\n\n\t\tconst newElementChildren = childrenArray.map((child) => {\n\t\t\tif (child === slottable) {\n\t\t\t\t// == Because the new element will be the one rendered, we are only interested in grabbing its children (`newElement.props.children`)\n\t\t\t\treturn isValidElement<SlotProps>(newElement) && newElement.props.children;\n\t\t\t}\n\n\t\t\treturn child;\n\t\t});\n\n\t\treturn (\n\t\t\t<SlotClone {...restOfSlotProps}>\n\t\t\t\t{isValidElement(newElement) && cloneElement(newElement, undefined, newElementChildren)}\n\t\t\t</SlotClone>\n\t\t);\n\t}\n\n\treturn <SlotClone {...restOfSlotProps}>{children}</SlotClone>;\n}\n\ntype SlotCloneProps = {\n\tchildren: React.ReactNode;\n\tref?: React.RefObject<HTMLElement>;\n};\n\ntype UnknownProps = Record<string, unknown>;\n\nfunction SlotClone(props: SlotCloneProps) {\n\tconst { children, ref: forwardedRef, ...restOfSlotProps } = props;\n\n\tif (!isValidElement<UnknownProps>(children)) {\n\t\treturn Children.count(children) > 1 ? Children.only(null) : null;\n\t}\n\n\tconst childRef = (children.props.ref\n\t\t?? (children as unknown as UnknownProps).ref) as React.Ref<HTMLElement>;\n\n\tconst clonedProps = {\n\t\t...mergeProps(restOfSlotProps, children.props),\n\t\tref: forwardedRef ? composeRefs([forwardedRef, childRef]) : childRef,\n\t};\n\n\treturn cloneElement(children, clonedProps);\n}\n"]}

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

@@ -1,6 +1,40 @@
-export { Await } from '../../chunk-EOI2VNGP.js';
-import '../../chunk-OM4ZFFQS.js';
-import '../../chunk-ENDWJXPF.js';
+import { Slot } from '../../chunk-L2SROZYQ.js';
+import { ErrorBoundary } from '../../chunk-OM4ZFFQS.js';
 import '../../chunk-PZ5AY32C.js';
+import * as React from 'react';
+import { Fragment, Suspense, use } from 'react';
+
+function Await(props) {
+  const { errorFallback, fallback, wrapperVariant = "suspense-and-boundary", ...restOfProps } = props;
+  const WithErrorBoundary = wrapperVariant === "only-boundary" || wrapperVariant === "suspense-and-boundary" ? ErrorBoundary : Fragment;
+  const WithSuspense = wrapperVariant === "only-suspense" || wrapperVariant === "suspense-and-boundary" ? Suspense : Fragment;
+  const errorBoundaryProps = Boolean(errorFallback) && { fallback: errorFallback };
+  const suspenseProps = Boolean(fallback) && { fallback };
+  return /* @__PURE__ */ React.createElement(WithErrorBoundary, { ...errorBoundaryProps }, /* @__PURE__ */ React.createElement(WithSuspense, { ...suspenseProps }, /* @__PURE__ */ React.createElement(AwaitInner, { ...restOfProps })));
+}
+function AwaitInner(props) {
+  const { asChild, children, promise, render } = props;
+  const result = use(promise);
+  const Component = asChild ? Slot : Fragment;
+  const componentProps = asChild && { promise };
+  let resolvedChildren;
+  switch (true) {
+    case typeof children === "function": {
+      resolvedChildren = children(result);
+      break;
+    }
+    case typeof render === "function": {
+      resolvedChildren = render(result);
+      break;
+    }
+    default: {
+      resolvedChildren = children ?? render;
+      break;
+    }
+  }
+  return /* @__PURE__ */ React.createElement(Component, { ...componentProps }, resolvedChildren);
+}
+
+export { Await };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}
+{"version":3,"sources":["../../../../src/components/common/await/await.tsx"],"names":["ReactFragment"],"mappings":";;;;;;AAkBO,SAAS,MAAc,KAA2B,EAAA;AACxD,EAAA,MAAM,EAAE,aAAe,EAAA,QAAA,EAAU,iBAAiB,uBAAyB,EAAA,GAAG,aAAgB,GAAA,KAAA;AAE9F,EAAA,MAAM,iBACL,GAAA,cAAA,KAAmB,eAAmB,IAAA,cAAA,KAAmB,0BACtD,aACA,GAAAA,QAAA;AAEJ,EAAA,MAAM,YACL,GAAA,cAAA,KAAmB,eAAmB,IAAA,cAAA,KAAmB,0BACtD,QACA,GAAAA,QAAA;AAEJ,EAAA,MAAM,qBAAqB,OAAQ,CAAA,aAAa,CAAK,IAAA,EAAE,UAAU,aAAc,EAAA;AAE/E,EAAA,MAAM,aAAgB,GAAA,OAAA,CAAQ,QAAQ,CAAA,IAAK,EAAE,QAAS,EAAA;AAEtD,EAAA,uBACE,KAAA,CAAA,aAAA,CAAA,iBAAA,EAAA,EAAmB,GAAG,kBAAA,EAAA,kBACrB,KAAA,CAAA,aAAA,CAAA,YAAA,EAAA,EAAc,GAAG,aAAA,EAAA,kBAChB,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAY,GAAG,WAAA,EAAa,CAC9B,CACD,CAAA;AAEF;AAOA,SAAS,WAAmB,KAAgC,EAAA;AAC3D,EAAA,MAAM,EAAE,OAAA,EAAS,QAAU,EAAA,OAAA,EAAS,QAAW,GAAA,KAAA;AAE/C,EAAM,MAAA,MAAA,GAAS,IAAI,OAAO,CAAA;AAE1B,EAAM,MAAA,SAAA,GAAY,UAAU,IAAO,GAAAA,QAAA;AAEnC,EAAM,MAAA,cAAA,GAAiB,OAAW,IAAA,EAAE,OAAQ,EAAA;AAE5C,EAAI,IAAA,gBAAA;AAEJ,EAAA,QAAQ,IAAM;AAAA,IACb,KAAK,OAAO,QAAA,KAAa,UAAY,EAAA;AACpC,MAAA,gBAAA,GAAmB,SAAS,MAAM,CAAA;AAClC,MAAA;AAAA;AACD,IACA,KAAK,OAAO,MAAA,KAAW,UAAY,EAAA;AAClC,MAAA,gBAAA,GAAmB,OAAO,MAAM,CAAA;AAChC,MAAA;AAAA;AACD,IACA,SAAS;AACR,MAAA,gBAAA,GAAmB,QAAY,IAAA,MAAA;AAC/B,MAAA;AAAA;AACD;AAGD,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA,EAAW,GAAG,cAAA,EAAA,EAAiB,gBAAiB,CAAA;AACzD","file":"index.js","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\nimport type { DiscriminatedRenderProps } from \"@zayne-labs/toolkit-react/utils\";\nimport { Fragment as ReactFragment, Suspense, use } from \"react\";\nimport { ErrorBoundary } from \"../error-boundary\";\nimport { Slot } from \"../slot\";\nimport type { SuspenseWithBoundaryProps } from \"../suspense-with-boundary\";\n\ntype RenderPropFn<TValue> = (result: TValue) => React.ReactNode;\n\ntype AwaitProps<TValue> = AwaitInnerProps<TValue>\n\t& Pick<SuspenseWithBoundaryProps, \"errorFallback\" | \"fallback\"> & {\n\t\tasChild?: boolean;\n\t\twrapperVariant?: \"none\" | \"only-boundary\" | \"only-suspense\" | \"suspense-and-boundary\";\n\t};\n\nexport function Await<TValue>(props: AwaitProps<TValue>) {\n\tconst { errorFallback, fallback, wrapperVariant = \"suspense-and-boundary\", ...restOfProps } = props;\n\n\tconst WithErrorBoundary =\n\t\twrapperVariant === \"only-boundary\" || wrapperVariant === \"suspense-and-boundary\"\n\t\t\t? ErrorBoundary\n\t\t\t: ReactFragment;\n\n\tconst WithSuspense =\n\t\twrapperVariant === \"only-suspense\" || wrapperVariant === \"suspense-and-boundary\"\n\t\t\t? Suspense\n\t\t\t: ReactFragment;\n\n\tconst errorBoundaryProps = Boolean(errorFallback) && { fallback: errorFallback };\n\n\tconst suspenseProps = Boolean(fallback) && { fallback };\n\n\treturn (\n\t\t<WithErrorBoundary {...errorBoundaryProps}>\n\t\t\t<WithSuspense {...suspenseProps}>\n\t\t\t\t<AwaitInner {...restOfProps} />\n\t\t\t</WithSuspense>\n\t\t</WithErrorBoundary>\n\t);\n}\n\nexport type AwaitInnerProps<TValue> = DiscriminatedRenderProps<React.ReactNode | RenderPropFn<TValue>> & {\n\tasChild?: boolean;\n\tpromise: Promise<TValue>;\n};\n\nfunction AwaitInner<TValue>(props: AwaitInnerProps<TValue>) {\n\tconst { asChild, children, promise, render } = props;\n\n\tconst result = use(promise);\n\n\tconst Component = asChild ? Slot : ReactFragment;\n\n\tconst componentProps = asChild && { promise };\n\n\tlet resolvedChildren: React.ReactNode;\n\n\tswitch (true) {\n\t\tcase typeof children === \"function\": {\n\t\t\tresolvedChildren = children(result);\n\t\t\tbreak;\n\t\t}\n\t\tcase typeof render === \"function\": {\n\t\t\tresolvedChildren = render(result);\n\t\t\tbreak;\n\t\t}\n\t\tdefault: {\n\t\t\tresolvedChildren = children ?? render;\n\t\t\tbreak;\n\t\t}\n\t}\n\n\treturn <Component {...componentProps}>{resolvedChildren}</Component>;\n}\n"]}

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

@@ -20,7 +20,7 @@ declare namespace ShowFallback {
 }
 
 declare namespace showParts {
-  export { ShowContent as Content, ShowFallback as Fallback, ShowFallback as OtherWise, ShowRoot as Root };
+  export { ShowContent as Content, ShowFallback as Fallback, ShowFallback as Otherwise, ShowRoot as Root };
 }
 
 export { showParts as Show, ShowContent, ShowFallback, ShowRoot };

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

@@ -1,4 +1,50 @@
-export { show_parts_exports as Show, ShowContent, ShowFallback, ShowRoot } from '../../chunk-FPCKBOJN.js';
-import '../../chunk-PZ5AY32C.js';
+import { __export } from '../../chunk-PZ5AY32C.js';
+import 'react';
+import { getSingleSlot, getRegularChildren } from '@zayne-labs/toolkit-react/utils';
+import { isFunction, AssertionError } from '@zayne-labs/toolkit-type-helpers';
+
+function ShowRoot({ children, fallback, when }) {
+  if ((when == null || when === false) && !isFunction(children)) {
+    const fallBackSlot = getSingleSlot(children, ShowFallback, {
+      errorMessage: "Only one <Show.Fallback> or <Show.OtherWise> component is allowed",
+      throwOnMultipleSlotMatch: true
+    });
+    if (fallBackSlot && fallback) {
+      throw new AssertionError(`
+			The fallback prop and <Show.Fallback>/<Show.OtherWise> cannot be used at the same time.
+		`);
+    }
+    return fallBackSlot ?? fallback;
+  }
+  if (when == null || when === false) {
+    return fallback;
+  }
+  const resolvedChildren = isFunction(children) ? children(when) : children;
+  const contentSlot = getSingleSlot(resolvedChildren, ShowContent, {
+    errorMessage: "Only one <Show.Content> component is allowed",
+    throwOnMultipleSlotMatch: true
+  });
+  const regularChildren = getRegularChildren(resolvedChildren, [ShowFallback, ShowContent]);
+  return contentSlot ?? regularChildren;
+}
+function ShowContent({ children }) {
+  return children;
+}
+ShowContent.slotSymbol = Symbol("content");
+function ShowFallback({ children }) {
+  return children;
+}
+ShowFallback.slotSymbol = Symbol("show-fallback");
+
+// src/components/common/show/show-parts.ts
+var show_parts_exports = {};
+__export(show_parts_exports, {
+  Content: () => ShowContent,
+  Fallback: () => ShowFallback,
+  Otherwise: () => ShowFallback,
+  Root: () => ShowRoot
+});
+
+export { show_parts_exports as Show, ShowContent, ShowFallback, ShowRoot };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}
+{"version":3,"sources":["../../../../src/components/common/show/show.tsx","../../../../src/components/common/show/show-parts.ts"],"names":[],"mappings":";;;;;AAaO,SAAS,QAAgB,CAAA,EAAE,QAAU,EAAA,QAAA,EAAU,MAA0B,EAAA;AAC/E,EAAA,IAAA,CAAK,QAAQ,IAAQ,IAAA,IAAA,KAAS,UAAU,CAAC,UAAA,CAAW,QAAQ,CAAG,EAAA;AAC9D,IAAM,MAAA,YAAA,GAAe,aAAc,CAAA,QAAA,EAAU,YAAc,EAAA;AAAA,MAC1D,YAAc,EAAA,mEAAA;AAAA,MACd,wBAA0B,EAAA;AAAA,KAC1B,CAAA;AAED,IAAA,IAAI,gBAAgB,QAAU,EAAA;AAC7B,MAAA,MAAM,IAAI,cAAe,CAAA;AAAA;AAAA,EAEzB,CAAA,CAAA;AAAA;AAGD,IAAA,OAAO,YAAgB,IAAA,QAAA;AAAA;AAGxB,EAAI,IAAA,IAAA,IAAQ,IAAQ,IAAA,IAAA,KAAS,KAAO,EAAA;AACnC,IAAO,OAAA,QAAA;AAAA;AAGR,EAAA,MAAM,mBAAmB,UAAW,CAAA,QAAQ,CAAI,GAAA,QAAA,CAAS,IAAI,CAAI,GAAA,QAAA;AAEjE,EAAM,MAAA,WAAA,GAAc,aAAc,CAAA,gBAAA,EAAkB,WAAa,EAAA;AAAA,IAChE,YAAc,EAAA,8CAAA;AAAA,IACd,wBAA0B,EAAA;AAAA,GAC1B,CAAA;AAED,EAAA,MAAM,kBAAkB,kBAAmB,CAAA,gBAAA,EAAkB,CAAC,YAAA,EAAc,WAAW,CAAC,CAAA;AAExF,EAAA,OAAO,WAAe,IAAA,eAAA;AACvB;AAEO,SAAS,WAAA,CAAY,EAAE,QAAA,EAA2C,EAAA;AACxE,EAAO,OAAA,QAAA;AACR;AACA,WAAY,CAAA,UAAA,GAAa,OAAO,SAAS,CAAA;AAElC,SAAS,YAAA,CAAa,EAAE,QAAA,EAA2C,EAAA;AACzE,EAAO,OAAA,QAAA;AACR;AACA,YAAa,CAAA,UAAA,GAAa,OAAO,eAAe,CAAA;;;ACrDhD,IAAA,kBAAA,GAAA;AAAA,QAAA,CAAA,kBAAA,EAAA;AAAA,EAAA,OAAA,EAAA,MAAA,WAAA;AAAA,EAAA,QAAA,EAAA,MAAA,YAAA;AAAA,EAAA,SAAA,EAAA,MAAA,YAAA;AAAA,EAAA,IAAA,EAAA,MAAA;AAAA,CAAA,CAAA","file":"index.js","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\nimport { getRegularChildren, getSingleSlot } from \"@zayne-labs/toolkit-react/utils\";\nimport { AssertionError, isFunction } from \"@zayne-labs/toolkit-type-helpers\";\n\ntype ShowProps<TWhen> = {\n\tchildren: React.ReactNode | ((whenValue: TWhen) => React.ReactNode);\n\tfallback?: React.ReactNode;\n\twhen: false | TWhen | null | undefined;\n};\n\nexport function ShowRoot<TWhen>({ children, fallback, when }: ShowProps<TWhen>) {\n\tif ((when == null || when === false) && !isFunction(children)) {\n\t\tconst fallBackSlot = getSingleSlot(children, ShowFallback, {\n\t\t\terrorMessage: \"Only one <Show.Fallback> or <Show.OtherWise> component is allowed\",\n\t\t\tthrowOnMultipleSlotMatch: true,\n\t\t});\n\n\t\tif (fallBackSlot && fallback) {\n\t\t\tthrow new AssertionError(`\n\t\t\tThe fallback prop and <Show.Fallback>/<Show.OtherWise> cannot be used at the same time.\n\t\t`);\n\t\t}\n\n\t\treturn fallBackSlot ?? fallback;\n\t}\n\n\tif (when == null || when === false) {\n\t\treturn fallback;\n\t}\n\n\tconst resolvedChildren = isFunction(children) ? children(when) : children;\n\n\tconst contentSlot = getSingleSlot(resolvedChildren, ShowContent, {\n\t\terrorMessage: \"Only one <Show.Content> component is allowed\",\n\t\tthrowOnMultipleSlotMatch: true,\n\t});\n\n\tconst regularChildren = getRegularChildren(resolvedChildren, [ShowFallback, ShowContent]);\n\n\treturn contentSlot ?? regularChildren;\n}\n\nexport function ShowContent({ children }: { children: React.ReactNode }) {\n\treturn children;\n}\nShowContent.slotSymbol = Symbol(\"content\");\n\nexport function ShowFallback({ children }: { children: React.ReactNode }) {\n\treturn children;\n}\nShowFallback.slotSymbol = Symbol(\"show-fallback\");\n","export {\n\tShowContent as Content,\n\tShowFallback as Fallback,\n\tShowFallback as Otherwise,\n\tShowRoot as Root,\n} from \"./show\";\n"]}

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

@@ -1,4 +1,4 @@
-export { Slot, Slottable } from '../../chunk-ENDWJXPF.js';
+export { Slot, Slottable } from '../../chunk-L2SROZYQ.js';
 import '../../chunk-PZ5AY32C.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

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

@@ -1,5 +1,14 @@
-export { SuspenseWithBoundary } from '../../chunk-NPIJ4XZP.js';
-import '../../chunk-OM4ZFFQS.js';
+import { ErrorBoundary } from '../../chunk-OM4ZFFQS.js';
 import '../../chunk-PZ5AY32C.js';
+import { Suspense } from 'react';
+
+function SuspenseWithBoundary(props) {
+  const { children, errorFallback, fallback } = props;
+  const errorBoundaryProps = Boolean(errorFallback) && { fallback: errorFallback };
+  const suspenseProps = Boolean(fallback) && { fallback };
+  return /* @__PURE__ */ React.createElement(ErrorBoundary, { ...errorBoundaryProps }, /* @__PURE__ */ React.createElement(Suspense, { ...suspenseProps }, children));
+}
+
+export { SuspenseWithBoundary };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}
+{"version":3,"sources":["../../../../src/components/common/suspense-with-boundary/suspense-with-boundary.tsx"],"names":[],"mappings":";;;;AASO,SAAS,qBAAqB,KAAkC,EAAA;AACtE,EAAA,MAAM,EAAE,QAAA,EAAU,aAAe,EAAA,QAAA,EAAa,GAAA,KAAA;AAE9C,EAAA,MAAM,qBAAqB,OAAQ,CAAA,aAAa,CAAK,IAAA,EAAE,UAAU,aAAc,EAAA;AAC/E,EAAA,MAAM,aAAgB,GAAA,OAAA,CAAQ,QAAQ,CAAA,IAAK,EAAE,QAAS,EAAA;AAEtD,EACC,uBAAA,KAAA,CAAA,aAAA,CAAC,iBAAe,GAAG,kBAAA,EAAA,sCACjB,QAAU,EAAA,EAAA,GAAG,aAAgB,EAAA,EAAA,QAAS,CACxC,CAAA;AAEF","file":"index.js","sourcesContent":["import { Suspense } from \"react\";\nimport { ErrorBoundary, type ErrorBoundaryProps } from \"../error-boundary\";\n\nexport type SuspenseWithBoundaryProps = {\n\tchildren: React.ReactNode;\n\terrorFallback?: ErrorBoundaryProps[\"fallback\"];\n\tfallback?: React.ReactNode;\n};\n\nexport function SuspenseWithBoundary(props: SuspenseWithBoundaryProps) {\n\tconst { children, errorFallback, fallback } = props;\n\n\tconst errorBoundaryProps = Boolean(errorFallback) && { fallback: errorFallback };\n\tconst suspenseProps = Boolean(fallback) && { fallback };\n\n\treturn (\n\t\t<ErrorBoundary {...errorBoundaryProps}>\n\t\t\t<Suspense {...suspenseProps}>{children}</Suspense>\n\t\t</ErrorBoundary>\n\t);\n}\n"]}

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

@@ -1,4 +1,40 @@
-export { switch_parts_exports as Switch, SwitchDefault, SwitchMatch, SwitchRoot } from '../../chunk-SVQ4WBSO.js';
-import '../../chunk-PZ5AY32C.js';
+import { __export } from '../../chunk-PZ5AY32C.js';
+import 'react';
+import { getSingleSlot, getRegularChildren } from '@zayne-labs/toolkit-react/utils';
+import { isFunction } from '@zayne-labs/toolkit-type-helpers';
+
+var defaultConditionSymbol = Symbol("condition-default");
+function SwitchRoot(props) {
+  const { children, condition = defaultConditionSymbol } = props;
+  const defaultCase = getSingleSlot(children, SwitchDefault, {
+    errorMessage: "Only one <Switch.Default> component is allowed",
+    throwOnMultipleSlotMatch: true
+  });
+  const childrenCasesArray = getRegularChildren(children, SwitchDefault);
+  const matchedCase = childrenCasesArray.find(
+    (child) => condition === defaultConditionSymbol ? child.props.when : child.props.when === condition
+  );
+  return matchedCase ?? defaultCase;
+}
+function SwitchMatch({ children, when }) {
+  if (when == null || when === false) {
+    return null;
+  }
+  return isFunction(children) ? children(when) : children;
+}
+function SwitchDefault({ children }) {
+  return children;
+}
+SwitchDefault.slotSymbol = Symbol("switch-default");
+
+// src/components/common/switch/switch-parts.ts
+var switch_parts_exports = {};
+__export(switch_parts_exports, {
+  Default: () => SwitchDefault,
+  Match: () => SwitchMatch,
+  Root: () => SwitchRoot
+});
+
+export { switch_parts_exports as Switch, SwitchDefault, SwitchMatch, SwitchRoot };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/esm/common/switch/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}
+{"version":3,"sources":["../../../../src/components/common/switch/switch.tsx","../../../../src/components/common/switch/switch-parts.ts"],"names":[],"mappings":";;;;;AAmBA,IAAM,sBAAA,GAAyB,OAAO,mBAAmB,CAAA;AAElD,SAAS,WAA8B,KAAgC,EAAA;AAC7E,EAAA,MAAM,EAAE,QAAA,EAAU,SAAY,GAAA,sBAAA,EAA2B,GAAA,KAAA;AAEzD,EAAM,MAAA,WAAA,GAAc,aAAc,CAAA,QAAA,EAAU,aAAe,EAAA;AAAA,IAC1D,YAAc,EAAA,gDAAA;AAAA,IACd,wBAA0B,EAAA;AAAA,GAC1B,CAAA;AAED,EAAM,MAAA,kBAAA,GAAqB,kBAAmB,CAAA,QAAA,EAAU,aAAa,CAAA;AAErE,EAAA,MAAM,cAAc,kBAAmB,CAAA,IAAA;AAAA,IAAK,CAAC,UAC5C,SAAc,KAAA,sBAAA,GAAyB,MAAM,KAAM,CAAA,IAAA,GAAO,KAAM,CAAA,KAAA,CAAM,IAAS,KAAA;AAAA,GAChF;AAEA,EAAA,OAAO,WAAe,IAAA,WAAA;AACvB;AAEO,SAAS,WAAmB,CAAA,EAAE,QAAU,EAAA,IAAA,EAAiC,EAAA;AAC/E,EAAI,IAAA,IAAA,IAAQ,IAAQ,IAAA,IAAA,KAAS,KAAO,EAAA;AACnC,IAAO,OAAA,IAAA;AAAA;AAGR,EAAA,OAAO,UAAW,CAAA,QAAQ,CAAI,GAAA,QAAA,CAAS,IAAI,CAAI,GAAA,QAAA;AAChD;AAEO,SAAS,aAAA,CAAc,EAAE,QAAA,EAA2C,EAAA;AAC1E,EAAO,OAAA,QAAA;AACR;AACA,aAAc,CAAA,UAAA,GAAa,OAAO,gBAAgB,CAAA;;;ACjDlD,IAAA,oBAAA,GAAA;AAAA,QAAA,CAAA,oBAAA,EAAA;AAAA,EAAA,OAAA,EAAA,MAAA,aAAA;AAAA,EAAA,KAAA,EAAA,MAAA,WAAA;AAAA,EAAA,IAAA,EAAA,MAAA;AAAA,CAAA,CAAA","file":"index.js","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\nimport { getRegularChildren, getSingleSlot } from \"@zayne-labs/toolkit-react/utils\";\nimport { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\n\ntype ValidSwitchComponentType = React.ReactElement<SwitchMatchProps>;\n\ntype SwitchProps<TCondition> = {\n\tchildren: ValidSwitchComponentType | ValidSwitchComponentType[];\n\tcondition?: TCondition;\n};\n\ntype SwitchMatchProps<TWhen = unknown> = {\n\tchildren: React.ReactNode | ((whenValue: TWhen) => React.ReactNode);\n\twhen: false | TWhen | null | undefined;\n};\n\nconst defaultConditionSymbol = Symbol(\"condition-default\");\n\nexport function SwitchRoot<TCondition = true>(props: SwitchProps<TCondition>) {\n\tconst { children, condition = defaultConditionSymbol } = props;\n\n\tconst defaultCase = getSingleSlot(children, SwitchDefault, {\n\t\terrorMessage: \"Only one <Switch.Default> component is allowed\",\n\t\tthrowOnMultipleSlotMatch: true,\n\t});\n\n\tconst childrenCasesArray = getRegularChildren(children, SwitchDefault);\n\n\tconst matchedCase = childrenCasesArray.find((child) =>\n\t\tcondition === defaultConditionSymbol ? child.props.when : child.props.when === condition\n\t);\n\n\treturn matchedCase ?? defaultCase;\n}\n\nexport function SwitchMatch<TWhen>({ children, when }: SwitchMatchProps<TWhen>) {\n\tif (when == null || when === false) {\n\t\treturn null;\n\t}\n\n\treturn isFunction(children) ? children(when) : children;\n}\n\nexport function SwitchDefault({ children }: { children: React.ReactNode }) {\n\treturn children;\n}\nSwitchDefault.slotSymbol = Symbol(\"switch-default\");\n","export { SwitchDefault as Default, SwitchMatch as Match, SwitchRoot as Root } from \"./switch\";\n"]}

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

@@ -1,4 +1,31 @@
-export { Teleport } from '../../chunk-CB2EZJYW.js';
 import '../../chunk-PZ5AY32C.js';
+import { useState } from 'react';
+import { useEffectOnce, useMountEffect } from '@zayne-labs/toolkit-react';
+import { isString } from '@zayne-labs/toolkit-type-helpers';
+import { createPortal } from 'react-dom';
+
+function Teleport(props) {
+  const { children, insertPosition, to } = props;
+  const [reactPortal, setReactPortal] = useState(null);
+  useEffectOnce(() => {
+    if (!to || !insertPosition) return;
+    const destination = isString(to) ? document.querySelector(to) : to;
+    const tempWrapper = document.createElement("div");
+    tempWrapper.style.display = "contents";
+    destination?.insertAdjacentElement(insertPosition, tempWrapper);
+    setReactPortal(createPortal(children, tempWrapper));
+    return () => {
+      tempWrapper.remove();
+    };
+  });
+  useMountEffect(() => {
+    if (!to || insertPosition) return;
+    const destination = isString(to) ? document.querySelector(to) : to;
+    destination && setReactPortal(createPortal(children, destination));
+  });
+  return reactPortal;
+}
+
+export { Teleport };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/esm/common/teleport/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}
+{"version":3,"sources":["../../../../src/components/common/teleport/teleport.tsx"],"names":[],"mappings":";;;;;;AAeA,SAAS,SAAS,KAAoB,EAAA;AACrC,EAAA,MAAM,EAAE,QAAA,EAAU,cAAgB,EAAA,EAAA,EAAO,GAAA,KAAA;AAEzC,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAmC,IAAI,CAAA;AAE7E,EAAA,aAAA,CAAc,MAAM;AACnB,IAAI,IAAA,CAAC,EAAM,IAAA,CAAC,cAAgB,EAAA;AAE5B,IAAA,MAAM,cAAc,QAAS,CAAA,EAAE,IAAI,QAAS,CAAA,aAAA,CAA2B,EAAE,CAAI,GAAA,EAAA;AAE7E,IAAM,MAAA,WAAA,GAAc,QAAS,CAAA,aAAA,CAAc,KAAK,CAAA;AAChD,IAAA,WAAA,CAAY,MAAM,OAAU,GAAA,UAAA;AAE5B,IAAa,WAAA,EAAA,qBAAA,CAAsB,gBAAgB,WAAW,CAAA;AAE9D,IAAe,cAAA,CAAA,YAAA,CAAa,QAAU,EAAA,WAAW,CAAC,CAAA;AAElD,IAAA,OAAO,MAAM;AACZ,MAAA,WAAA,CAAY,MAAO,EAAA;AAAA,KACpB;AAAA,GACA,CAAA;AAED,EAAA,cAAA,CAAe,MAAM;AACpB,IAAI,IAAA,CAAC,MAAM,cAAgB,EAAA;AAE3B,IAAA,MAAM,cAAc,QAAS,CAAA,EAAE,IAAI,QAAS,CAAA,aAAA,CAA2B,EAAE,CAAI,GAAA,EAAA;AAE7E,IAAA,WAAA,IAAe,cAAe,CAAA,YAAA,CAAa,QAAU,EAAA,WAAW,CAAC,CAAA;AAAA,GACjE,CAAA;AAED,EAAO,OAAA,WAAA;AACR","file":"index.js","sourcesContent":["import * as React from \"react\";\n\nimport { useEffectOnce, useMountEffect } from \"@zayne-labs/toolkit-react\";\nimport { type AnyString, isString } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useState } from \"react\";\nimport { createPortal } from \"react-dom\";\n\ntype ValidHtmlTags = keyof HTMLElementTagNameMap;\n\ntype PortalProps = {\n\tchildren: React.ReactNode;\n\tinsertPosition?: InsertPosition;\n\tto?: AnyString | HTMLElement | ValidHtmlTags | null;\n};\n\nfunction Teleport(props: PortalProps) {\n\tconst { children, insertPosition, to } = props;\n\n\tconst [reactPortal, setReactPortal] = useState<React.ReactPortal | null>(null);\n\n\tuseEffectOnce(() => {\n\t\tif (!to || !insertPosition) return;\n\n\t\tconst destination = isString(to) ? document.querySelector<HTMLElement>(to) : to;\n\n\t\tconst tempWrapper = document.createElement(\"div\");\n\t\ttempWrapper.style.display = \"contents\";\n\n\t\tdestination?.insertAdjacentElement(insertPosition, tempWrapper);\n\n\t\tsetReactPortal(createPortal(children, tempWrapper));\n\n\t\treturn () => {\n\t\t\ttempWrapper.remove();\n\t\t};\n\t});\n\n\tuseMountEffect(() => {\n\t\tif (!to || insertPosition) return;\n\n\t\tconst destination = isString(to) ? document.querySelector<HTMLElement>(to) : to;\n\n\t\tdestination && setReactPortal(createPortal(children, destination));\n\t});\n\n\treturn reactPortal;\n}\n\nexport { Teleport };\n"]}

package/dist/esm/ui/card/index.js

@@ -1,6 +1,45 @@
-export { card_parts_exports as Card, CardContent, CardDescription, CardFooter, CardHeader, CardRoot, CardTitle } from '../../chunk-PXYYL2LL.js';
-import '../../chunk-OHG7GB7O.js';
-import '../../chunk-ENDWJXPF.js';
-import '../../chunk-PZ5AY32C.js';
+import { cnMerge } from '../../chunk-OHG7GB7O.js';
+import { Slot } from '../../chunk-L2SROZYQ.js';
+import { __export } from '../../chunk-PZ5AY32C.js';
+import * as React from 'react';
+
+function CardRoot(props) {
+  const { as: Element = "article", ...restOfProps } = props;
+  return /* @__PURE__ */ React.createElement(Element, { ...restOfProps });
+}
+function CardHeader(props) {
+  const { as: Element = "header", ...restOfProps } = props;
+  return /* @__PURE__ */ React.createElement(Element, { ...restOfProps });
+}
+function CardTitle(props) {
+  const { as: Element = "h3", className, ...restOfProps } = props;
+  return /* @__PURE__ */ React.createElement(Element, { className: cnMerge("font-semibold", className), ...restOfProps });
+}
+function CardDescription(props) {
+  const { as: Element = "p", className, ...restOfProps } = props;
+  return /* @__PURE__ */ React.createElement(Element, { className: cnMerge("text-sm text-shadcn-muted-foreground", className), ...restOfProps });
+}
+function CardContent(props) {
+  const { as: Element = "div", ...restOfProps } = props;
+  return /* @__PURE__ */ React.createElement(Element, { ...restOfProps });
+}
+function CardFooter(props) {
+  const { as: Element = "footer", asChild, ...restOfProps } = props;
+  const Component = asChild ? Slot : Element;
+  return /* @__PURE__ */ React.createElement(Component, { ...restOfProps });
+}
+
+// src/components/ui/card/card-parts.ts
+var card_parts_exports = {};
+__export(card_parts_exports, {
+  Content: () => CardContent,
+  Description: () => CardDescription,
+  Footer: () => CardFooter,
+  Header: () => CardHeader,
+  Root: () => CardRoot,
+  Title: () => CardTitle
+});
+
+export { card_parts_exports as Card, CardContent, CardDescription, CardFooter, CardHeader, CardRoot, CardTitle };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/esm/ui/card/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}
+{"version":3,"sources":["../../../../src/components/ui/card/card.tsx","../../../../src/components/ui/card/card-parts.ts"],"names":[],"mappings":";;;;;AAMO,SAAS,SACf,KACC,EAAA;AACD,EAAA,MAAM,EAAE,EAAI,EAAA,OAAA,GAAU,SAAW,EAAA,GAAG,aAAgB,GAAA,KAAA;AAEpD,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAS,EAAA,EAAA,GAAG,WAAa,EAAA,CAAA;AAClC;AAEO,SAAS,WACf,KACC,EAAA;AACD,EAAA,MAAM,EAAE,EAAI,EAAA,OAAA,GAAU,QAAU,EAAA,GAAG,aAAgB,GAAA,KAAA;AAEnD,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAS,EAAA,EAAA,GAAG,WAAa,EAAA,CAAA;AAClC;AAEO,SAAS,UAAqD,KAAmC,EAAA;AACvG,EAAA,MAAM,EAAE,EAAI,EAAA,OAAA,GAAU,MAAM,SAAW,EAAA,GAAG,aAAgB,GAAA,KAAA;AAE1D,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,WAAQ,SAAW,EAAA,OAAA,CAAQ,iBAAiB,SAAS,CAAA,EAAI,GAAG,WAAa,EAAA,CAAA;AAClF;AAEO,SAAS,gBACf,KACC,EAAA;AACD,EAAA,MAAM,EAAE,EAAI,EAAA,OAAA,GAAU,KAAK,SAAW,EAAA,GAAG,aAAgB,GAAA,KAAA;AAEzD,EACC,uBAAA,KAAA,CAAA,aAAA,CAAC,WAAQ,SAAW,EAAA,OAAA,CAAQ,wCAAwC,SAAS,CAAA,EAAI,GAAG,WAAa,EAAA,CAAA;AAEnG;AAEO,SAAS,YACf,KACC,EAAA;AACD,EAAA,MAAM,EAAE,EAAI,EAAA,OAAA,GAAU,KAAO,EAAA,GAAG,aAAgB,GAAA,KAAA;AAEhD,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAS,EAAA,EAAA,GAAG,WAAa,EAAA,CAAA;AAClC;AAEO,SAAS,WACf,KACC,EAAA;AACD,EAAA,MAAM,EAAE,EAAI,EAAA,OAAA,GAAU,UAAU,OAAS,EAAA,GAAG,aAAgB,GAAA,KAAA;AAE5D,EAAM,MAAA,SAAA,GAAY,UAAU,IAAO,GAAA,OAAA;AAEnC,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,SAAW,EAAA,EAAA,GAAG,WAAa,EAAA,CAAA;AACpC;;;ACtDA,IAAA,kBAAA,GAAA;AAAA,QAAA,CAAA,kBAAA,EAAA;AAAA,EAAA,OAAA,EAAA,MAAA,WAAA;AAAA,EAAA,WAAA,EAAA,MAAA,eAAA;AAAA,EAAA,MAAA,EAAA,MAAA,UAAA;AAAA,EAAA,MAAA,EAAA,MAAA,UAAA;AAAA,EAAA,IAAA,EAAA,MAAA,QAAA;AAAA,EAAA,KAAA,EAAA,MAAA;AAAA,CAAA,CAAA","file":"index.js","sourcesContent":["import * as React from \"react\";\n\nimport { Slot } from \"@/components/common/slot\";\nimport { cnMerge } from \"@/lib/utils/cn\";\nimport type { PolymorphicProps } from \"@zayne-labs/toolkit-react/utils\";\n\nexport function CardRoot<TElement extends React.ElementType = \"article\">(\n\tprops: PolymorphicProps<TElement>\n) {\n\tconst { as: Element = \"article\", ...restOfProps } = props;\n\n\treturn <Element {...restOfProps} />;\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 <Element {...restOfProps} />;\n}\n\nexport function CardTitle<TElement extends React.ElementType = \"h3\">(props: PolymorphicProps<TElement>) {\n\tconst { as: Element = \"h3\", className, ...restOfProps } = props;\n\n\treturn <Element className={cnMerge(\"font-semibold\", className)} {...restOfProps} />;\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 className={cnMerge(\"text-sm text-shadcn-muted-foreground\", className)} {...restOfProps} />\n\t);\n}\n\nexport function CardContent<TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicProps<TElement>\n) {\n\tconst { as: Element = \"div\", ...restOfProps } = props;\n\n\treturn <Element {...restOfProps} />;\n}\n\nexport function CardFooter<TElement extends React.ElementType = \"footer\">(\n\tprops: PolymorphicProps<TElement, { asChild?: boolean }>\n) {\n\tconst { as: Element = \"footer\", asChild, ...restOfProps } = props;\n\n\tconst Component = asChild ? Slot : Element;\n\n\treturn <Component {...restOfProps} />;\n}\n","export {\n\tCardContent as Content,\n\tCardDescription as Description,\n\tCardFooter as Footer,\n\tCardHeader as Header,\n\tCardRoot as Root,\n\tCardTitle as Title,\n} from \"./card\";\n"]}

package/dist/esm/ui/carousel/index.js

@@ -1,6 +1,274 @@
-export { carousel_parts_exports as Carousel, CarouselButton, CarouselCaption, CarouselContent, CarouselControls, CarouselIndicator, CarouselIndicatorGroup, CarouselItem, CarouselItemGroup } from '../../chunk-GVL6BLX5.js';
-import '../../chunk-OHG7GB7O.js';
-import '../../chunk-DW3FXTFL.js';
-import '../../chunk-PZ5AY32C.js';
+import { cnMerge } from '../../chunk-OHG7GB7O.js';
+import { getElementList } from '../../chunk-DW3FXTFL.js';
+import { __export } from '../../chunk-PZ5AY32C.js';
+import * as React3 from 'react';
+import { useEffect, useState } from 'react';
+import { useConstant, useAnimationInterval, useCallbackRef } from '@zayne-labs/toolkit-react';
+import { createZustandContext } from '@zayne-labs/toolkit-react/zustand';
+import { create } from 'zustand';
+
+var ChevronLeftIcon = (props) => /* @__PURE__ */ React3.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React3.createElement("g", { fill: "none", stroke: "currentColor", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2" }, /* @__PURE__ */ React3.createElement("circle", { cx: "12", cy: "12", r: "10" }), /* @__PURE__ */ React3.createElement("path", { d: "m14 16l-4-4l4-4" })));
+var [Provider, useCarouselStoreContext] = createZustandContext({
+  hookName: "useCarouselStore",
+  name: "CarouselStoreContext",
+  providerName: "CarouselContextProvider"
+});
+var createCarouselStore = (storeValues) => {
+  const { images, onSlideBtnClick } = storeValues;
+  const useInitCarouselStore = create()((set, get) => ({
+    currentSlide: 0,
+    images,
+    maxSlide: images.length - 1,
+    /* eslint-disable perfectionist/sort-objects -- actions should be last */
+    actions: {
+      /* eslint-enable perfectionist/sort-objects -- actions should be last */
+      goToNextSlide: () => {
+        const { currentSlide, maxSlide } = get();
+        const { goToSlide } = get().actions;
+        if (currentSlide === maxSlide) {
+          goToSlide(0);
+          return;
+        }
+        goToSlide(currentSlide + 1);
+      },
+      goToPreviousSlide: () => {
+        const { currentSlide, maxSlide } = get();
+        const { goToSlide } = get().actions;
+        if (currentSlide === 0) {
+          goToSlide(maxSlide);
+          return;
+        }
+        goToSlide(currentSlide - 1);
+      },
+      goToSlide: (newValue) => {
+        onSlideBtnClick?.();
+        set({ currentSlide: newValue });
+      }
+    }
+  }));
+  return useInitCarouselStore;
+};
+var useCarousel = (props) => {
+  const { images, onSlideBtnClick } = props;
+  const useInitCarouselStore = useConstant(() => createCarouselStore({ images, onSlideBtnClick }));
+  useEffect(() => {
+    useInitCarouselStore.setState({ images });
+  }, [images]);
+  return useInitCarouselStore;
+};
+function CarouselContextProvider(props) {
+  const { children, images, onSlideBtnClick } = props;
+  const useInitCarouselStore = useCarousel({ images, onSlideBtnClick });
+  return /* @__PURE__ */ React3.createElement(Provider, { value: useInitCarouselStore }, children);
+}
+var useCarouselOptions = (options = {}) => {
+  const { autoSlideInterval = 5e3, hasAutoSlide = false, shouldPauseOnHover = false } = options;
+  const { goToNextSlide } = useCarouselStoreContext((state) => state.actions);
+  const [isPaused, setIsPaused] = useState(false);
+  const shouldAutoSlide = hasAutoSlide && !isPaused;
+  useAnimationInterval({
+    intervalDuration: shouldAutoSlide ? autoSlideInterval : null,
+    onAnimation: goToNextSlide
+  });
+  const pauseAutoSlide = useCallbackRef(() => shouldPauseOnHover && setIsPaused(true));
+  const resumeAutoSlide = useCallbackRef(() => shouldPauseOnHover && setIsPaused(false));
+  return { pauseAutoSlide, resumeAutoSlide };
+};
+
+// src/components/ui/carousel/carousel.tsx
+function CarouselContent(props) {
+  const {
+    as: HtmlElement = "article",
+    autoSlideInterval,
+    children,
+    classNames,
+    hasAutoSlide,
+    shouldPauseOnHover
+  } = props;
+  const { pauseAutoSlide, resumeAutoSlide } = useCarouselOptions({
+    autoSlideInterval,
+    hasAutoSlide,
+    shouldPauseOnHover
+  });
+  return /* @__PURE__ */ React3.createElement(
+    HtmlElement,
+    {
+      "data-id": "Carousel",
+      className: cnMerge("relative select-none", classNames?.base),
+      onMouseEnter: pauseAutoSlide,
+      onMouseLeave: resumeAutoSlide
+    },
+    /* @__PURE__ */ React3.createElement(
+      "div",
+      {
+        "data-id": "Scroll Container",
+        className: cnMerge(
+          "flex size-full overflow-x-scroll [scrollbar-width:none] [&::-webkit-scrollbar]:hidden",
+          classNames?.scrollContainer
+        )
+      },
+      children
+    )
+  );
+}
+function CarouselButton(props) {
+  const { classNames, icon, variant } = props;
+  const { goToNextSlide, goToPreviousSlide } = useCarouselStoreContext((state) => state.actions);
+  return /* @__PURE__ */ React3.createElement(
+    "button",
+    {
+      type: "button",
+      className: cnMerge(
+        "z-30 flex h-full w-[15%] items-center",
+        variant === "prev" ? "justify-start" : "justify-end",
+        classNames?.base
+      ),
+      onClick: variant === "prev" ? goToPreviousSlide : goToNextSlide
+    },
+    /* @__PURE__ */ React3.createElement("span", { className: cnMerge("transition-transform active:scale-[1.06]", classNames?.iconContainer) }, icon ?? /* @__PURE__ */ React3.createElement(
+      ChevronLeftIcon,
+      {
+        className: cnMerge(variant === "next" && "rotate-180", classNames?.defaultIcon)
+      }
+    ))
+  );
+}
+function CarouselControls(props) {
+  const { classNames, icon } = props;
+  return /* @__PURE__ */ React3.createElement("div", { className: cnMerge("absolute inset-0 flex justify-between", classNames?.base) }, icon?.iconType ? /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(
+    CarouselButton,
+    {
+      variant: "prev",
+      classNames: {
+        defaultIcon: classNames?.defaultIcon,
+        iconContainer: cnMerge(
+          icon.iconType === "nextIcon" && "rotate-180",
+          classNames?.iconContainer
+        )
+      },
+      icon: icon.icon
+    }
+  ), /* @__PURE__ */ React3.createElement(
+    CarouselButton,
+    {
+      variant: "next",
+      classNames: {
+        defaultIcon: classNames?.defaultIcon,
+        iconContainer: cnMerge(
+          icon.iconType === "prevIcon" && "rotate-180",
+          classNames?.iconContainer
+        )
+      },
+      icon: icon.icon
+    }
+  )) : /* @__PURE__ */ React3.createElement(React3.Fragment, null, /* @__PURE__ */ React3.createElement(
+    CarouselButton,
+    {
+      variant: "prev",
+      classNames: {
+        defaultIcon: classNames?.defaultIcon,
+        iconContainer: classNames?.iconContainer
+      },
+      icon: icon?.prev
+    }
+  ), /* @__PURE__ */ React3.createElement(
+    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 currentSlide = useCarouselStoreContext((state) => state.currentSlide);
+  const images = useCarouselStoreContext((state) => each ?? state.images);
+  return /* @__PURE__ */ React3.createElement(
+    "ul",
+    {
+      "data-id": "Carousel Image Wrapper",
+      className: cnMerge(
+        `flex w-full shrink-0 [transform:translate3d(var(--translate-distance),0,0)] snap-center
+				[transition:transform_800ms_ease]`,
+        className
+      ),
+      style: {
+        "--translate-distance": `-${currentSlide * 100}%`
+      }
+    },
+    typeof render === "function" ? /* @__PURE__ */ React3.createElement(ItemList, { each: images, render }) : /* @__PURE__ */ React3.createElement(ItemList, { each: images }, children)
+  );
+}
+function CarouselItem({ children, className, ...restOfProps }) {
+  return /* @__PURE__ */ React3.createElement(
+    "li",
+    {
+      className: cnMerge("flex w-full shrink-0 snap-center justify-center", className),
+      ...restOfProps
+    },
+    children
+  );
+}
+function CarouselCaption(props) {
+  const { as: HtmlElement = "div", children, className } = props;
+  return /* @__PURE__ */ React3.createElement(HtmlElement, { "data-id": "Carousel Caption", className: cnMerge("absolute z-10", className) }, children);
+}
+function CarouselIndicatorGroup(props) {
+  const { children, className, each, render } = props;
+  const images = useCarouselStoreContext((state) => each ?? state.images);
+  const [IndicatorList] = getElementList("base");
+  return /* @__PURE__ */ React3.createElement(
+    "ul",
+    {
+      "data-id": "Carousel Indicators",
+      className: cnMerge(
+        "absolute bottom-10 z-[2] flex w-full items-center justify-center gap-6",
+        className
+      )
+    },
+    typeof render === "function" ? /* @__PURE__ */ React3.createElement(IndicatorList, { each: images, render }) : /* @__PURE__ */ React3.createElement(IndicatorList, { each: images }, children)
+  );
+}
+function CarouselIndicator(props) {
+  const { classNames, currentIndex } = props;
+  const {
+    actions: { goToSlide },
+    currentSlide
+  } = useCarouselStoreContext((state) => state);
+  return /* @__PURE__ */ React3.createElement("li", { className: cnMerge("inline-flex", classNames?.base) }, /* @__PURE__ */ React3.createElement(
+    "button",
+    {
+      "data-active": currentIndex === currentSlide,
+      type: "button",
+      onClick: () => goToSlide(currentIndex),
+      className: cnMerge(
+        "size-[6px] rounded-[50%]",
+        classNames?.button,
+        currentIndex === currentSlide && ["w-14 rounded-lg", classNames?.activeBtn]
+      )
+    }
+  ));
+}
+
+// src/components/ui/carousel/carousel-parts.ts
+var carousel_parts_exports = {};
+__export(carousel_parts_exports, {
+  Button: () => CarouselButton,
+  Caption: () => CarouselCaption,
+  Content: () => CarouselContent,
+  Controls: () => CarouselControls,
+  Indicator: () => CarouselIndicator,
+  IndicatorWrapper: () => CarouselIndicatorGroup,
+  Item: () => CarouselItem,
+  ItemWrapper: () => CarouselItemGroup,
+  Root: () => CarouselContextProvider
+});
+
+export { carousel_parts_exports as Carousel, CarouselButton, CarouselCaption, CarouselContent, CarouselControls, CarouselIndicator, CarouselIndicatorGroup, CarouselItem, CarouselItemGroup };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map