@beweco/aurora-ui 0.1.28 → 0.1.29

package/dist/index.cjs.js

@@ -3084,10 +3084,23 @@ var defaultTranslations$3 = {
  * ```
  */
 var SocialMediaPreview = function (_a) {
-    var platform = _a.platform, imageUrl = _a.imageUrl, caption = _a.caption, _b = _a.variant, variant = _b === void 0 ? "full" : _b, _c = _a.showHeader, showHeader = _c === void 0 ? true : _c, _d = _a.maxCaptionLength, maxCaptionLength = _d === void 0 ? 125 : _d, onToggleCaption = _a.onToggleCaption, showFullCaption = _a.showFullCaption, username = _a.username, avatarUrl = _a.avatarUrl, _e = _a.translations, translations = _e === void 0 ? {} : _e, _f = _a.className, className = _f === void 0 ? "" : _f, _g = _a.imageProps, imageProps = _g === void 0 ? {} : _g;
+    var platform = _a.platform, imageUrl = _a.imageUrl, caption = _a.caption, _b = _a.variant, variant = _b === void 0 ? "full" : _b, _c = _a.postAspectRatio, postAspectRatio = _c === void 0 ? "square" : _c, _d = _a.showHeader, showHeader = _d === void 0 ? true : _d, _e = _a.maxCaptionLength, maxCaptionLength = _e === void 0 ? 125 : _e, onToggleCaption = _a.onToggleCaption, showFullCaption = _a.showFullCaption, username = _a.username, avatarUrl = _a.avatarUrl, _f = _a.translations, translations = _f === void 0 ? {} : _f, _g = _a.className, className = _g === void 0 ? "" : _g, _h = _a.imageProps, imageProps = _h === void 0 ? {} : _h;
     var t = __assign(__assign({}, defaultTranslations$3), translations);
     var displayUsername = username || t.username;
     var shouldTruncate = variant === "compact" && caption.length > maxCaptionLength;
+    // Get aspect ratio based on postAspectRatio prop
+    var getAspectRatio = function () {
+        switch (postAspectRatio) {
+            case "square":
+                return "1/1"; // 1080 x 1080px
+            case "portrait":
+                return "4/5"; // 1080 x 1350px
+            case "landscape":
+                return "1.91/1"; // 1080 x 566px
+            default:
+                return "1/1";
+        }
+    };
     var getTruncatedCaption = function () {
         if (variant !== "compact") {
             return caption;
@@ -3110,7 +3123,7 @@ var SocialMediaPreview = function (_a) {
         return renderInstagramPost();
     };
     var renderInstagramStory = function () { return (jsxRuntime.jsxs("div", { className: "relative w-full bg-gradient-to-b from-gray-900 to-gray-800 rounded-2xl shadow-2xl overflow-hidden ".concat(className), style: { aspectRatio: "9/16", maxHeight: "640px" }, children: [imageUrl && (jsxRuntime.jsxs("div", { className: "absolute inset-0", children: [jsxRuntime.jsx(react.Image, __assign({ src: imageUrl, alt: t.imageAlt, className: "w-full h-full object-cover" }, imageProps)), jsxRuntime.jsx("div", { className: "absolute inset-0 bg-black bg-opacity-20" })] })), showHeader && (jsxRuntime.jsxs("div", { className: "absolute top-0 left-0 right-0 z-10 p-4", children: [jsxRuntime.jsx("div", { className: "w-full h-0.5 bg-white bg-opacity-30 rounded-full mb-3", children: jsxRuntime.jsx("div", { className: "h-full w-1/3 bg-white rounded-full" }) }), jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [jsxRuntime.jsx("div", { className: "w-8 h-8 rounded-full bg-gradient-to-br from-purple-500 via-pink-500 to-orange-500 flex items-center justify-center border-2 border-white", children: avatarUrl ? (jsxRuntime.jsx("img", { src: avatarUrl, alt: displayUsername, className: "w-full h-full rounded-full object-cover" })) : (jsxRuntime.jsx("span", { className: "text-white text-xs font-bold", children: displayUsername.substring(0, 2).toUpperCase() })) }), jsxRuntime.jsx("span", { className: "text-sm font-semibold text-white drop-shadow-lg", children: displayUsername }), jsxRuntime.jsx("span", { className: "text-xs text-white text-opacity-90", children: "hace 5min" })] }), jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [jsxRuntime.jsx(IconComponent, { icon: "solar:play-circle-bold", className: "text-lg text-white drop-shadow-lg" }), jsxRuntime.jsx(IconComponent, { icon: "solar:volume-loud-bold", className: "text-lg text-white drop-shadow-lg" }), jsxRuntime.jsx(IconComponent, { icon: "solar:menu-dots-bold", className: "text-lg text-white drop-shadow-lg" })] })] })] })), jsxRuntime.jsxs("div", { className: "absolute bottom-6 left-0 right-0 z-20 px-4 flex items-center gap-3", children: [jsxRuntime.jsx("input", { type: "text", placeholder: t.sendMessage, className: "flex-1 bg-transparent border-2 border-white border-opacity-70 rounded-full px-4 py-2 text-white placeholder-white placeholder-opacity-70 text-sm", readOnly: true }), jsxRuntime.jsx(IconComponent, { icon: "solar:heart-outline", className: "text-2xl text-white drop-shadow-lg" }), jsxRuntime.jsx(IconComponent, { icon: "solar:plain-outline", className: "text-2xl text-white drop-shadow-lg" })] })] })); };
-    var renderInstagramPost = function () { return (jsxRuntime.jsxs("div", { className: "flex flex-col bg-white dark:bg-gray-900 ".concat(variant === "full" ? "rounded-lg shadow-xl overflow-hidden" : "rounded-b-xl overflow-hidden", " h-full ").concat(className), children: [showHeader && (jsxRuntime.jsxs("div", { className: "flex items-center justify-between p-3 border-b border-gray-200 dark:border-gray-800", children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [jsxRuntime.jsx("div", { className: "w-8 h-8 rounded-full bg-gradient-to-br from-purple-500 via-pink-500 to-orange-500 flex items-center justify-center", children: avatarUrl ? (jsxRuntime.jsx("img", { src: avatarUrl, alt: displayUsername, className: "w-full h-full rounded-full object-cover" })) : (jsxRuntime.jsx("span", { className: "text-white text-xs font-bold", children: displayUsername.substring(0, 2).toUpperCase() })) }), jsxRuntime.jsx("span", { className: "text-sm font-semibold text-gray-900 dark:text-white", children: displayUsername })] }), jsxRuntime.jsx(IconComponent, { icon: "solar:menu-dots-bold", className: "text-lg text-gray-900 dark:text-white" })] })), imageUrl && (jsxRuntime.jsx("div", { className: "relative w-full bg-gray-50 dark:bg-gray-800 overflow-hidden rounded-none ".concat(variant === "full" ? "h-80" : ""), style: variant === "compact" ? { aspectRatio: "1/1" } : {}, children: jsxRuntime.jsx(react.Image, __assign({ src: imageUrl, alt: t.imageAlt, className: "w-full h-full object-cover rounded-none", radius: "none" }, imageProps)) })), jsxRuntime.jsxs("div", { className: "flex-1 p-3 overflow-y-auto", children: [jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-2", children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [jsxRuntime.jsx(IconComponent, { icon: "solar:heart-bold", className: "text-xl text-gray-900 dark:text-white" }), jsxRuntime.jsx(IconComponent, { icon: "solar:chat-round-bold", className: "text-xl text-gray-900 dark:text-white" }), jsxRuntime.jsx(IconComponent, { icon: "solar:plain-bold", className: "text-xl text-gray-900 dark:text-white" })] }), jsxRuntime.jsx(IconComponent, { icon: "solar:bookmark-bold", className: "text-xl text-gray-900 dark:text-white" })] }), jsxRuntime.jsxs("div", { className: "text-sm text-left", children: [jsxRuntime.jsxs("div", { className: showFullCaption ? "overflow-y-auto" : "", style: { maxHeight: showFullCaption ? "150px" : "none" }, children: [jsxRuntime.jsx("span", { className: "font-semibold mr-2 text-gray-900 dark:text-white", children: displayUsername }), jsxRuntime.jsx("span", { className: "text-gray-800 dark:text-gray-200 whitespace-pre-wrap break-words", children: displayCaption })] }), shouldTruncate && onToggleCaption && variant !== "compact" && (jsxRuntime.jsx("button", { type: "button", onClick: function (e) {
+    var renderInstagramPost = function () { return (jsxRuntime.jsxs("div", { className: "flex flex-col bg-white dark:bg-gray-900 ".concat(variant === "full" ? "rounded-lg shadow-xl overflow-hidden" : "rounded-b-xl overflow-hidden", " h-full ").concat(className), children: [showHeader && (jsxRuntime.jsxs("div", { className: "flex items-center justify-between p-3 border-b border-gray-200 dark:border-gray-800", children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [jsxRuntime.jsx("div", { className: "w-8 h-8 rounded-full bg-gradient-to-br from-purple-500 via-pink-500 to-orange-500 flex items-center justify-center", children: avatarUrl ? (jsxRuntime.jsx("img", { src: avatarUrl, alt: displayUsername, className: "w-full h-full rounded-full object-cover" })) : (jsxRuntime.jsx("span", { className: "text-white text-xs font-bold", children: displayUsername.substring(0, 2).toUpperCase() })) }), jsxRuntime.jsx("span", { className: "text-sm font-semibold text-gray-900 dark:text-white", children: displayUsername })] }), jsxRuntime.jsx(IconComponent, { icon: "solar:menu-dots-bold", className: "text-lg text-gray-900 dark:text-white" })] })), imageUrl && (jsxRuntime.jsx("div", { className: "relative w-full bg-black overflow-hidden rounded-none flex items-center justify-center", style: { aspectRatio: getAspectRatio() }, children: jsxRuntime.jsx(react.Image, __assign({ src: imageUrl, alt: t.imageAlt, className: "w-full h-full object-contain rounded-none", radius: "none" }, imageProps)) })), jsxRuntime.jsxs("div", { className: "flex-1 p-3 overflow-y-auto", children: [jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-2", children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [jsxRuntime.jsx(IconComponent, { icon: "solar:heart-bold", className: "text-xl text-gray-900 dark:text-white" }), jsxRuntime.jsx(IconComponent, { icon: "solar:chat-round-bold", className: "text-xl text-gray-900 dark:text-white" }), jsxRuntime.jsx(IconComponent, { icon: "solar:plain-bold", className: "text-xl text-gray-900 dark:text-white" })] }), jsxRuntime.jsx(IconComponent, { icon: "solar:bookmark-bold", className: "text-xl text-gray-900 dark:text-white" })] }), jsxRuntime.jsxs("div", { className: "text-sm text-left", children: [jsxRuntime.jsxs("div", { className: showFullCaption ? "overflow-y-auto" : "", style: { maxHeight: showFullCaption ? "150px" : "none" }, children: [jsxRuntime.jsx("span", { className: "font-semibold mr-2 text-gray-900 dark:text-white", children: displayUsername }), jsxRuntime.jsx("span", { className: "text-gray-800 dark:text-gray-200 whitespace-pre-wrap break-words", children: displayCaption })] }), shouldTruncate && onToggleCaption && variant !== "compact" && (jsxRuntime.jsx("button", { type: "button", onClick: function (e) {
                                     e.stopPropagation();
                                     onToggleCaption();
                                 }, className: "text-gray-600 dark:text-gray-400 hover:text-gray-800 dark:hover:text-gray-300 font-normal mt-1 underline text-xs block", children: showFullCaption ? t.viewLess : t.viewMore }))] }), variant !== "compact" && (jsxRuntime.jsx("div", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1 text-left", children: t.timeAgo }))] })] })); };

package/dist/index.esm.js

@@ -3085,10 +3085,23 @@ var defaultTranslations$3 = {
  * ```
  */
 var SocialMediaPreview = function (_a) {
-    var platform = _a.platform, imageUrl = _a.imageUrl, caption = _a.caption, _b = _a.variant, variant = _b === void 0 ? "full" : _b, _c = _a.showHeader, showHeader = _c === void 0 ? true : _c, _d = _a.maxCaptionLength, maxCaptionLength = _d === void 0 ? 125 : _d, onToggleCaption = _a.onToggleCaption, showFullCaption = _a.showFullCaption, username = _a.username, avatarUrl = _a.avatarUrl, _e = _a.translations, translations = _e === void 0 ? {} : _e, _f = _a.className, className = _f === void 0 ? "" : _f, _g = _a.imageProps, imageProps = _g === void 0 ? {} : _g;
+    var platform = _a.platform, imageUrl = _a.imageUrl, caption = _a.caption, _b = _a.variant, variant = _b === void 0 ? "full" : _b, _c = _a.postAspectRatio, postAspectRatio = _c === void 0 ? "square" : _c, _d = _a.showHeader, showHeader = _d === void 0 ? true : _d, _e = _a.maxCaptionLength, maxCaptionLength = _e === void 0 ? 125 : _e, onToggleCaption = _a.onToggleCaption, showFullCaption = _a.showFullCaption, username = _a.username, avatarUrl = _a.avatarUrl, _f = _a.translations, translations = _f === void 0 ? {} : _f, _g = _a.className, className = _g === void 0 ? "" : _g, _h = _a.imageProps, imageProps = _h === void 0 ? {} : _h;
     var t = __assign(__assign({}, defaultTranslations$3), translations);
     var displayUsername = username || t.username;
     var shouldTruncate = variant === "compact" && caption.length > maxCaptionLength;
+    // Get aspect ratio based on postAspectRatio prop
+    var getAspectRatio = function () {
+        switch (postAspectRatio) {
+            case "square":
+                return "1/1"; // 1080 x 1080px
+            case "portrait":
+                return "4/5"; // 1080 x 1350px
+            case "landscape":
+                return "1.91/1"; // 1080 x 566px
+            default:
+                return "1/1";
+        }
+    };
     var getTruncatedCaption = function () {
         if (variant !== "compact") {
             return caption;
@@ -3111,7 +3124,7 @@ var SocialMediaPreview = function (_a) {
         return renderInstagramPost();
     };
     var renderInstagramStory = function () { return (jsxs("div", { className: "relative w-full bg-gradient-to-b from-gray-900 to-gray-800 rounded-2xl shadow-2xl overflow-hidden ".concat(className), style: { aspectRatio: "9/16", maxHeight: "640px" }, children: [imageUrl && (jsxs("div", { className: "absolute inset-0", children: [jsx(Image$1, __assign({ src: imageUrl, alt: t.imageAlt, className: "w-full h-full object-cover" }, imageProps)), jsx("div", { className: "absolute inset-0 bg-black bg-opacity-20" })] })), showHeader && (jsxs("div", { className: "absolute top-0 left-0 right-0 z-10 p-4", children: [jsx("div", { className: "w-full h-0.5 bg-white bg-opacity-30 rounded-full mb-3", children: jsx("div", { className: "h-full w-1/3 bg-white rounded-full" }) }), jsxs("div", { className: "flex items-center justify-between", children: [jsxs("div", { className: "flex items-center gap-2", children: [jsx("div", { className: "w-8 h-8 rounded-full bg-gradient-to-br from-purple-500 via-pink-500 to-orange-500 flex items-center justify-center border-2 border-white", children: avatarUrl ? (jsx("img", { src: avatarUrl, alt: displayUsername, className: "w-full h-full rounded-full object-cover" })) : (jsx("span", { className: "text-white text-xs font-bold", children: displayUsername.substring(0, 2).toUpperCase() })) }), jsx("span", { className: "text-sm font-semibold text-white drop-shadow-lg", children: displayUsername }), jsx("span", { className: "text-xs text-white text-opacity-90", children: "hace 5min" })] }), jsxs("div", { className: "flex items-center gap-3", children: [jsx(IconComponent, { icon: "solar:play-circle-bold", className: "text-lg text-white drop-shadow-lg" }), jsx(IconComponent, { icon: "solar:volume-loud-bold", className: "text-lg text-white drop-shadow-lg" }), jsx(IconComponent, { icon: "solar:menu-dots-bold", className: "text-lg text-white drop-shadow-lg" })] })] })] })), jsxs("div", { className: "absolute bottom-6 left-0 right-0 z-20 px-4 flex items-center gap-3", children: [jsx("input", { type: "text", placeholder: t.sendMessage, className: "flex-1 bg-transparent border-2 border-white border-opacity-70 rounded-full px-4 py-2 text-white placeholder-white placeholder-opacity-70 text-sm", readOnly: true }), jsx(IconComponent, { icon: "solar:heart-outline", className: "text-2xl text-white drop-shadow-lg" }), jsx(IconComponent, { icon: "solar:plain-outline", className: "text-2xl text-white drop-shadow-lg" })] })] })); };
-    var renderInstagramPost = function () { return (jsxs("div", { className: "flex flex-col bg-white dark:bg-gray-900 ".concat(variant === "full" ? "rounded-lg shadow-xl overflow-hidden" : "rounded-b-xl overflow-hidden", " h-full ").concat(className), children: [showHeader && (jsxs("div", { className: "flex items-center justify-between p-3 border-b border-gray-200 dark:border-gray-800", children: [jsxs("div", { className: "flex items-center gap-2", children: [jsx("div", { className: "w-8 h-8 rounded-full bg-gradient-to-br from-purple-500 via-pink-500 to-orange-500 flex items-center justify-center", children: avatarUrl ? (jsx("img", { src: avatarUrl, alt: displayUsername, className: "w-full h-full rounded-full object-cover" })) : (jsx("span", { className: "text-white text-xs font-bold", children: displayUsername.substring(0, 2).toUpperCase() })) }), jsx("span", { className: "text-sm font-semibold text-gray-900 dark:text-white", children: displayUsername })] }), jsx(IconComponent, { icon: "solar:menu-dots-bold", className: "text-lg text-gray-900 dark:text-white" })] })), imageUrl && (jsx("div", { className: "relative w-full bg-gray-50 dark:bg-gray-800 overflow-hidden rounded-none ".concat(variant === "full" ? "h-80" : ""), style: variant === "compact" ? { aspectRatio: "1/1" } : {}, children: jsx(Image$1, __assign({ src: imageUrl, alt: t.imageAlt, className: "w-full h-full object-cover rounded-none", radius: "none" }, imageProps)) })), jsxs("div", { className: "flex-1 p-3 overflow-y-auto", children: [jsxs("div", { className: "flex items-center justify-between mb-2", children: [jsxs("div", { className: "flex items-center gap-4", children: [jsx(IconComponent, { icon: "solar:heart-bold", className: "text-xl text-gray-900 dark:text-white" }), jsx(IconComponent, { icon: "solar:chat-round-bold", className: "text-xl text-gray-900 dark:text-white" }), jsx(IconComponent, { icon: "solar:plain-bold", className: "text-xl text-gray-900 dark:text-white" })] }), jsx(IconComponent, { icon: "solar:bookmark-bold", className: "text-xl text-gray-900 dark:text-white" })] }), jsxs("div", { className: "text-sm text-left", children: [jsxs("div", { className: showFullCaption ? "overflow-y-auto" : "", style: { maxHeight: showFullCaption ? "150px" : "none" }, children: [jsx("span", { className: "font-semibold mr-2 text-gray-900 dark:text-white", children: displayUsername }), jsx("span", { className: "text-gray-800 dark:text-gray-200 whitespace-pre-wrap break-words", children: displayCaption })] }), shouldTruncate && onToggleCaption && variant !== "compact" && (jsx("button", { type: "button", onClick: function (e) {
+    var renderInstagramPost = function () { return (jsxs("div", { className: "flex flex-col bg-white dark:bg-gray-900 ".concat(variant === "full" ? "rounded-lg shadow-xl overflow-hidden" : "rounded-b-xl overflow-hidden", " h-full ").concat(className), children: [showHeader && (jsxs("div", { className: "flex items-center justify-between p-3 border-b border-gray-200 dark:border-gray-800", children: [jsxs("div", { className: "flex items-center gap-2", children: [jsx("div", { className: "w-8 h-8 rounded-full bg-gradient-to-br from-purple-500 via-pink-500 to-orange-500 flex items-center justify-center", children: avatarUrl ? (jsx("img", { src: avatarUrl, alt: displayUsername, className: "w-full h-full rounded-full object-cover" })) : (jsx("span", { className: "text-white text-xs font-bold", children: displayUsername.substring(0, 2).toUpperCase() })) }), jsx("span", { className: "text-sm font-semibold text-gray-900 dark:text-white", children: displayUsername })] }), jsx(IconComponent, { icon: "solar:menu-dots-bold", className: "text-lg text-gray-900 dark:text-white" })] })), imageUrl && (jsx("div", { className: "relative w-full bg-black overflow-hidden rounded-none flex items-center justify-center", style: { aspectRatio: getAspectRatio() }, children: jsx(Image$1, __assign({ src: imageUrl, alt: t.imageAlt, className: "w-full h-full object-contain rounded-none", radius: "none" }, imageProps)) })), jsxs("div", { className: "flex-1 p-3 overflow-y-auto", children: [jsxs("div", { className: "flex items-center justify-between mb-2", children: [jsxs("div", { className: "flex items-center gap-4", children: [jsx(IconComponent, { icon: "solar:heart-bold", className: "text-xl text-gray-900 dark:text-white" }), jsx(IconComponent, { icon: "solar:chat-round-bold", className: "text-xl text-gray-900 dark:text-white" }), jsx(IconComponent, { icon: "solar:plain-bold", className: "text-xl text-gray-900 dark:text-white" })] }), jsx(IconComponent, { icon: "solar:bookmark-bold", className: "text-xl text-gray-900 dark:text-white" })] }), jsxs("div", { className: "text-sm text-left", children: [jsxs("div", { className: showFullCaption ? "overflow-y-auto" : "", style: { maxHeight: showFullCaption ? "150px" : "none" }, children: [jsx("span", { className: "font-semibold mr-2 text-gray-900 dark:text-white", children: displayUsername }), jsx("span", { className: "text-gray-800 dark:text-gray-200 whitespace-pre-wrap break-words", children: displayCaption })] }), shouldTruncate && onToggleCaption && variant !== "compact" && (jsx("button", { type: "button", onClick: function (e) {
                                     e.stopPropagation();
                                     onToggleCaption();
                                 }, className: "text-gray-600 dark:text-gray-400 hover:text-gray-800 dark:hover:text-gray-300 font-normal mt-1 underline text-xs block", children: showFullCaption ? t.viewLess : t.viewMore }))] }), variant !== "compact" && (jsx("div", { className: "text-xs text-gray-500 dark:text-gray-400 mt-1 text-left", children: t.timeAgo }))] })] })); };

package/dist/types/components/social-media-preview/SocialMediaPreview.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SocialMediaPreview.d.ts","sourceRoot":"","sources":["../../../../src/components/social-media-preview/SocialMediaPreview.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EACX,uBAAuB,EAEvB,MAAM,4BAA4B,CAAC;AAWpC;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA+chE,CAAC"}
+{"version":3,"file":"SocialMediaPreview.d.ts","sourceRoot":"","sources":["../../../../src/components/social-media-preview/SocialMediaPreview.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EACX,uBAAuB,EAEvB,MAAM,4BAA4B,CAAC;AAWpC;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA8dhE,CAAC"}

package/dist/types/components/social-media-preview/SocialMediaPreview.types.d.ts

@@ -1,6 +1,7 @@
 import type { ImageProps } from "@heroui/react";
 export type SocialPlatform = "instagram" | "facebook" | "tiktok" | "twitter";
 export type PreviewVariant = "compact" | "full" | "story";
+export type PostAspectRatio = "square" | "portrait" | "landscape";
 export interface SocialMediaPreviewTranslations {
     /** Username placeholder */
     username?: string;
@@ -24,6 +25,8 @@ export interface SocialMediaPreviewProps {
     caption: string;
     /** Preview variant */
     variant?: PreviewVariant;
+    /** Aspect ratio for posts (Instagram only). Defaults to 'square' */
+    postAspectRatio?: PostAspectRatio;
     /** Show header with user info */
     showHeader?: boolean;
     /** Maximum caption length before truncation */

package/dist/types/components/social-media-preview/SocialMediaPreview.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SocialMediaPreview.types.d.ts","sourceRoot":"","sources":["../../../../src/components/social-media-preview/SocialMediaPreview.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAEhD,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE7E,MAAM,MAAM,cAAc,GACvB,SAAS,GACT,MAAM,GACN,OAAO,CAAC;AAEX,MAAM,WAAW,8BAA8B;IAC9C,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sCAAsC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,uBAAuB;IACvC,uCAAuC;IACvC,QAAQ,EAAE,cAAc,CAAC;IACzB,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2BAA2B;IAC3B,OAAO,EAAE,MAAM,CAAC;IAChB,sBAAsB;IACtB,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,iCAAiC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,2CAA2C;IAC3C,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,iCAAiC;IACjC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,sDAAsD;IACtD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oCAAoC;IACpC,YAAY,CAAC,EAAE,8BAA8B,CAAC;IAC9C,8CAA8C;IAC9C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0CAA0C;IAC1C,UAAU,CAAC,EAAE,IAAI,CAAC,UAAU,EAAE,KAAK,GAAG,KAAK,CAAC,CAAC;CAC7C"}
+{"version":3,"file":"SocialMediaPreview.types.d.ts","sourceRoot":"","sources":["../../../../src/components/social-media-preview/SocialMediaPreview.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAEhD,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;AAE7E,MAAM,MAAM,cAAc,GACvB,SAAS,GACT,MAAM,GACN,OAAO,CAAC;AAEX,MAAM,MAAM,eAAe,GACxB,QAAQ,GACR,UAAU,GACV,WAAW,CAAC;AAEf,MAAM,WAAW,8BAA8B;IAC9C,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,sCAAsC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,oBAAoB;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,0BAA0B;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,uBAAuB;IACvC,uCAAuC;IACvC,QAAQ,EAAE,cAAc,CAAC;IACzB,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2BAA2B;IAC3B,OAAO,EAAE,MAAM,CAAC;IAChB,sBAAsB;IACtB,OAAO,CAAC,EAAE,cAAc,CAAC;IACzB,oEAAoE;IACpE,eAAe,CAAC,EAAE,eAAe,CAAC;IAClC,iCAAiC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,2CAA2C;IAC3C,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;IAC7B,iCAAiC;IACjC,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,sDAAsD;IACtD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,wBAAwB;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oCAAoC;IACpC,YAAY,CAAC,EAAE,8BAA8B,CAAC;IAC9C,8CAA8C;IAC9C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0CAA0C;IAC1C,UAAU,CAAC,EAAE,IAAI,CAAC,UAAU,EAAE,KAAK,GAAG,KAAK,CAAC,CAAC;CAC7C"}

package/dist/types/components/social-media-preview/index.d.ts

@@ -1,3 +1,3 @@
 export { SocialMediaPreview } from "./SocialMediaPreview.js";
-export type { SocialMediaPreviewProps, SocialMediaPreviewTranslations, SocialPlatform, PreviewVariant, } from "./SocialMediaPreview.types.js";
+export type { SocialMediaPreviewProps, SocialMediaPreviewTranslations, SocialPlatform, PreviewVariant, PostAspectRatio, } from "./SocialMediaPreview.types.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/types/components/social-media-preview/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/social-media-preview/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,YAAY,EACX,uBAAuB,EACvB,8BAA8B,EAC9B,cAAc,EACd,cAAc,GACd,MAAM,+BAA+B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/social-media-preview/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,YAAY,EACX,uBAAuB,EACvB,8BAA8B,EAC9B,cAAc,EACd,cAAc,EACd,eAAe,GACf,MAAM,+BAA+B,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@beweco/aurora-ui",
-	"version": "0.1.28",
+	"version": "0.1.29",
 	"description": "Bewe Aurora UI Component Library",
 	"main": "./dist/index.cjs.js",
 	"module": "./dist/index.esm.js",