@marvalt/shcoder 0.1.1 → 0.1.3

package/dist/components/MemberCardsGrid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MemberCardsGrid.d.ts","sourceRoot":"","sources":["../../src/components/MemberCardsGrid.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAE3D,MAAM,WAAW,oBAAqB,SAAQ,mBAAmB;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAyF1D,CAAC"}
+{"version":3,"file":"MemberCardsGrid.d.ts","sourceRoot":"","sources":["../../src/components/MemberCardsGrid.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAG3D,MAAM,WAAW,oBAAqB,SAAQ,mBAAmB;IAC/D,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA8F1D,CAAC"}

package/dist/hooks/useMembers.d.ts

@@ -7,6 +7,18 @@
 import type { Member } from '../types/member';
 import type { ShortcodeAttributes } from '../types/shortcode';
 export declare function setWordPressApiUrl(url: string): void;
+type StaticDataProvider = () => {
+    members: any[];
+    getMemberById: (id: string | number) => any | null;
+    filterMembers: (filters: {
+        category?: string;
+        role?: string;
+        limit?: number;
+        orderby?: string;
+        order?: string;
+    }) => any[];
+};
+export declare function setStaticDataProvider(provider: StaticDataProvider): void;
 /**
  * Hook to fetch members based on shortcode attributes
  */
@@ -23,4 +35,5 @@ export declare function useMember(id: string | number): {
     loading: boolean;
     error: Error | null;
 };
+export {};
 //# sourceMappingURL=useMembers.d.ts.map

package/dist/hooks/useMembers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMembers.d.ts","sourceRoot":"","sources":["../../src/hooks/useMembers.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAS9D,wBAAgB,kBAAkB,CAAC,GAAG,EAAE,MAAM,QAE7C;AAyBD;;GAEG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,mBAAmB;;;;EAsGpD;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM;;;;EAwE5C"}
+{"version":3,"file":"useMembers.d.ts","sourceRoot":"","sources":["../../src/hooks/useMembers.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC;AAS9D,wBAAgB,kBAAkB,CAAC,GAAG,EAAE,MAAM,QAE7C;AA0BD,KAAK,kBAAkB,GAAG,MAAM;IAC9B,OAAO,EAAE,GAAG,EAAE,CAAC;IACf,aAAa,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,KAAK,GAAG,GAAG,IAAI,CAAC;IACnD,aAAa,EAAE,CAAC,OAAO,EAAE;QACvB,QAAQ,CAAC,EAAE,MAAM,CAAC;QAClB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,KAAK,GAAG,EAAE,CAAC;CACb,CAAC;AAIF,wBAAgB,qBAAqB,CAAC,QAAQ,EAAE,kBAAkB,QAEjE;AAqCD;;GAEG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,mBAAmB;;;;EAwGpD;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM;;;;EA0E5C"}

package/dist/index.cjs

@@ -37,6 +37,42 @@ function getApiUrl$1() {
 }
 // Initialize API URL
 apiUrl$1 = getApiUrl$1();
+let staticDataProvider = null;
+function setStaticDataProvider(provider) {
+    staticDataProvider = provider;
+}
+// Helper function to extract featured image from member data
+function extractFeaturedImage(member) {
+    if (member.featured_image_urls) {
+        return member.featured_image_urls;
+    }
+    if (member._embedded?.['wp:featuredmedia']?.[0]) {
+        const featuredMedia = member._embedded['wp:featuredmedia'][0];
+        return {
+            thumbnail: featuredMedia.media_details?.sizes?.thumbnail ? {
+                url: featuredMedia.media_details.sizes.thumbnail.source_url,
+                width: featuredMedia.media_details.sizes.thumbnail.width,
+                height: featuredMedia.media_details.sizes.thumbnail.height,
+            } : undefined,
+            medium: featuredMedia.media_details?.sizes?.medium ? {
+                url: featuredMedia.media_details.sizes.medium.source_url,
+                width: featuredMedia.media_details.sizes.medium.width,
+                height: featuredMedia.media_details.sizes.medium.height,
+            } : undefined,
+            large: featuredMedia.media_details?.sizes?.large ? {
+                url: featuredMedia.media_details.sizes.large.source_url,
+                width: featuredMedia.media_details.sizes.large.width,
+                height: featuredMedia.media_details.sizes.large.height,
+            } : undefined,
+            full: {
+                url: featuredMedia.source_url || featuredMedia.media_details?.sizes?.full?.source_url || '',
+                width: featuredMedia.media_details?.width || 0,
+                height: featuredMedia.media_details?.height || 0,
+            },
+        };
+    }
+    return undefined;
+}
 /**
  * Hook to fetch members based on shortcode attributes
  */
@@ -45,15 +81,39 @@ function useMembers(attrs) {
     const [loading, setLoading] = require$$0.useState(true);
     const [error, setError] = require$$0.useState(null);
     require$$0.useEffect(() => {
-        if (!apiUrl$1) {
-            setError(new Error('WordPress API URL not configured'));
-            setLoading(false);
-            return;
-        }
         async function fetchMembers() {
             try {
                 setLoading(true);
                 setError(null);
+                // Use static data if available (preferred method)
+                if (staticDataProvider) {
+                    const provider = staticDataProvider();
+                    const filtered = provider.filterMembers({
+                        category: attrs.tax || attrs.category,
+                        role: attrs.role,
+                        limit: attrs.limit ? parseInt(attrs.limit, 10) : undefined,
+                        orderby: attrs.orderby || 'date',
+                        order: attrs.order || 'desc',
+                    });
+                    // Process members to match Member interface
+                    const processedMembers = filtered.map((member) => {
+                        const processed = {
+                            ...member,
+                            member_meta: member.member_meta || {},
+                            featured_image_urls: extractFeaturedImage(member),
+                        };
+                        return processed;
+                    });
+                    setMembers(processedMembers);
+                    setLoading(false);
+                    return;
+                }
+                // Fallback to API (should not happen in production with static data)
+                if (!apiUrl$1) {
+                    setError(new Error('WordPress API URL not configured and no static data provider available'));
+                    setLoading(false);
+                    return;
+                }
                 // Build query params from shortcode attributes
                 const params = {
                     per_page: (attrs.limit ? parseInt(attrs.limit, 10) : 100).toString(),
@@ -86,33 +146,8 @@ function useMembers(attrs) {
                     const processed = {
                         ...member,
                         member_meta: member.member_meta || {},
+                        featured_image_urls: extractFeaturedImage(member),
                     };
-                    // Extract featured image from _embedded
-                    if (member._embedded && member._embedded['wp:featuredmedia'] && member._embedded['wp:featuredmedia'][0]) {
-                        const featuredMedia = member._embedded['wp:featuredmedia'][0];
-                        processed.featured_image_urls = {
-                            thumbnail: featuredMedia.media_details?.sizes?.thumbnail ? {
-                                url: featuredMedia.media_details.sizes.thumbnail.source_url,
-                                width: featuredMedia.media_details.sizes.thumbnail.width,
-                                height: featuredMedia.media_details.sizes.thumbnail.height,
-                            } : undefined,
-                            medium: featuredMedia.media_details?.sizes?.medium ? {
-                                url: featuredMedia.media_details.sizes.medium.source_url,
-                                width: featuredMedia.media_details.sizes.medium.width,
-                                height: featuredMedia.media_details.sizes.medium.height,
-                            } : undefined,
-                            large: featuredMedia.media_details?.sizes?.large ? {
-                                url: featuredMedia.media_details.sizes.large.source_url,
-                                width: featuredMedia.media_details.sizes.large.width,
-                                height: featuredMedia.media_details.sizes.large.height,
-                            } : undefined,
-                            full: {
-                                url: featuredMedia.source_url || featuredMedia.media_details?.sizes?.full?.source_url || '',
-                                width: featuredMedia.media_details?.width || 0,
-                                height: featuredMedia.media_details?.height || 0,
-                            },
-                        };
-                    }
                     return processed;
                 });
                 setMembers(processedMembers);
@@ -137,7 +172,7 @@ function useMember(id) {
     const [loading, setLoading] = require$$0.useState(true);
     const [error, setError] = require$$0.useState(null);
     require$$0.useEffect(() => {
-        if (!apiUrl$1 || !id) {
+        if (!id) {
             setLoading(false);
             return;
         }
@@ -145,6 +180,31 @@ function useMember(id) {
             try {
                 setLoading(true);
                 setError(null);
+                // Use static data if available (preferred method)
+                if (staticDataProvider) {
+                    const provider = staticDataProvider();
+                    const found = provider.getMemberById(id);
+                    if (found) {
+                        // Process member to match Member interface
+                        const processed = {
+                            ...found,
+                            member_meta: found.member_meta || {},
+                            featured_image_urls: extractFeaturedImage(found),
+                        };
+                        setMember(processed);
+                    }
+                    else {
+                        setMember(null);
+                    }
+                    setLoading(false);
+                    return;
+                }
+                // Fallback to API (should not happen in production with static data)
+                if (!apiUrl$1) {
+                    setError(new Error('WordPress API URL not configured and no static data provider available'));
+                    setLoading(false);
+                    return;
+                }
                 const response = await fetch(`${apiUrl$1}/wp/v2/member/${id}?_embed=true`);
                 if (!response.ok) {
                     throw new Error(`Failed to fetch member: ${response.statusText}`);
@@ -154,33 +214,8 @@ function useMember(id) {
                 const processed = {
                     ...data,
                     member_meta: data.member_meta || {},
+                    featured_image_urls: extractFeaturedImage(data),
                 };
-                // Extract featured image from _embedded
-                if (data._embedded && data._embedded['wp:featuredmedia'] && data._embedded['wp:featuredmedia'][0]) {
-                    const featuredMedia = data._embedded['wp:featuredmedia'][0];
-                    processed.featured_image_urls = {
-                        thumbnail: featuredMedia.media_details?.sizes?.thumbnail ? {
-                            url: featuredMedia.media_details.sizes.thumbnail.source_url,
-                            width: featuredMedia.media_details.sizes.thumbnail.width,
-                            height: featuredMedia.media_details.sizes.thumbnail.height,
-                        } : undefined,
-                        medium: featuredMedia.media_details?.sizes?.medium ? {
-                            url: featuredMedia.media_details.sizes.medium.source_url,
-                            width: featuredMedia.media_details.sizes.medium.width,
-                            height: featuredMedia.media_details.sizes.medium.height,
-                        } : undefined,
-                        large: featuredMedia.media_details?.sizes?.large ? {
-                            url: featuredMedia.media_details.sizes.large.source_url,
-                            width: featuredMedia.media_details.sizes.large.width,
-                            height: featuredMedia.media_details.sizes.large.height,
-                        } : undefined,
-                        full: {
-                            url: featuredMedia.source_url || featuredMedia.media_details?.sizes?.full?.source_url || '',
-                            width: featuredMedia.media_details?.width || 0,
-                            height: featuredMedia.media_details?.height || 0,
-                        },
-                    };
-                }
                 setMember(processed);
             }
             catch (err) {
@@ -1707,6 +1742,37 @@ const MemberCard = ({ id, className = '' }) => {
     return (jsxRuntimeExports.jsxs("div", { className: `member-card ${className}`, children: [imageUrl && (jsxRuntimeExports.jsx("div", { className: "member-card-image", children: jsxRuntimeExports.jsx("img", { src: imageUrl, alt: fullName, className: "w-full h-auto rounded-lg" }) })), jsxRuntimeExports.jsxs("div", { className: "member-card-content", children: [jsxRuntimeExports.jsx("h3", { className: "member-card-name", children: fullName }), meta.member_role && jsxRuntimeExports.jsx("p", { className: "member-card-role", children: meta.member_role }), meta.business_name && jsxRuntimeExports.jsx("p", { className: "member-card-company", children: meta.business_name }), meta.tagline && jsxRuntimeExports.jsx("p", { className: "member-card-tagline", children: meta.tagline }), meta.member_bio && (jsxRuntimeExports.jsx("div", { className: "member-card-bio", dangerouslySetInnerHTML: { __html: meta.member_bio } })), meta.website && (jsxRuntimeExports.jsx("a", { href: meta.website, target: "_blank", rel: "noopener noreferrer", className: "member-card-website", children: "Visit Website" }))] })] }));
 };
 
+/**
+ * Cloudflare Images variant URL helper for member card images.
+ * Only Cloudflare URLs (imagedelivery.net) are supported; WordPress URLs are not used.
+ */
+function isCloudflareImageUrl(url) {
+    if (!url)
+        return false;
+    try {
+        const u = new URL(url);
+        return u.hostname.toLowerCase().includes('imagedelivery.net');
+    }
+    catch {
+        return false;
+    }
+}
+/**
+ * Append Cloudflare Images variant (e.g. w=720,h=1280 for 9:16) to the base URL.
+ * Returns the original url if it is not a Cloudflare URL.
+ */
+function getCloudflareVariantUrl(url, options) {
+    if (!isCloudflareImageUrl(url))
+        return url;
+    if (/\/w=\d+/.test(url) || /\/(public|thumbnail|banner|avatar)/.test(url)) {
+        return url;
+    }
+    const { width, height } = options;
+    const base = url.endsWith('/') ? url.slice(0, -1) : url;
+    const variant = `w=${Math.max(1, Math.floor(width))}` + (`,h=${Math.max(1, Math.floor(height))}` );
+    return `${base}/${variant}`;
+}
+
 /**
  * MemberCardsGrid component - displays multiple members in a grid
  * Usage: [member_cards tax="leadership" cols="3" image="true"]
@@ -1739,12 +1805,16 @@ const MemberCardsGrid = ({ tax, category, role, cols = '3', image = 'true', limi
     }[colsNum] || 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3';
     return (jsxRuntimeExports.jsx("div", { className: `member-cards-grid grid ${gridCols} gap-6 ${className}`, children: members.map((member) => {
             const meta = member.member_meta || {};
-            const imageUrl = showImage
+            const rawImageUrl = showImage
                 ? (member.featured_image_urls?.medium?.url || member.featured_image_urls?.full?.url)
                 : null;
+            // Only use Cloudflare URLs; request 9:16 at 720x1280 for sharp display
+            const imageUrl = rawImageUrl && isCloudflareImageUrl(rawImageUrl)
+                ? getCloudflareVariantUrl(rawImageUrl, { width: 720, height: 1280 })
+                : null;
             const fullName = [meta.members_firstname, meta.members_last_name].filter(Boolean).join(' ')
                 || member.title.rendered;
-            return (jsxRuntimeExports.jsxs("div", { className: "member-card bg-white rounded-lg shadow-md overflow-hidden", children: [imageUrl && (jsxRuntimeExports.jsx("div", { className: "member-card-image", children: jsxRuntimeExports.jsx("img", { src: imageUrl, alt: fullName, className: "w-full h-48 object-cover" }) })), jsxRuntimeExports.jsxs("div", { className: "member-card-content p-6", children: [jsxRuntimeExports.jsx("h3", { className: "member-card-name text-xl font-bold mb-2", children: fullName }), meta.member_role && (jsxRuntimeExports.jsx("p", { className: "member-card-role text-gray-600 mb-2", children: meta.member_role })), meta.business_name && (jsxRuntimeExports.jsx("p", { className: "member-card-company text-sm text-gray-500 mb-2", children: meta.business_name })), meta.tagline && (jsxRuntimeExports.jsx("p", { className: "member-card-tagline text-sm italic mb-3", children: meta.tagline })), meta.member_pitch && (jsxRuntimeExports.jsx("p", { className: "member-card-pitch text-sm mb-3 line-clamp-3", children: meta.member_pitch })), meta.website && (jsxRuntimeExports.jsx("a", { href: meta.website, target: "_blank", rel: "noopener noreferrer", className: "member-card-website text-blue-600 hover:underline text-sm", children: "Visit Website \u2192" }))] })] }, member.id));
+            return (jsxRuntimeExports.jsxs("div", { className: "member-card bg-white rounded-lg shadow-md overflow-hidden", children: [imageUrl && (jsxRuntimeExports.jsx("div", { className: "member-card-image aspect-[9/16] w-full overflow-hidden bg-slate-100", children: jsxRuntimeExports.jsx("img", { src: imageUrl, alt: fullName, className: "h-full w-full object-cover" }) })), jsxRuntimeExports.jsxs("div", { className: "member-card-content p-6", children: [jsxRuntimeExports.jsx("h3", { className: "member-card-name text-xl font-bold mb-2", children: fullName }), meta.member_role && (jsxRuntimeExports.jsx("p", { className: "member-card-role text-gray-600 mb-2", children: meta.member_role })), meta.business_name && (jsxRuntimeExports.jsx("p", { className: "member-card-company text-sm text-gray-500 mb-2", children: meta.business_name })), meta.tagline && (jsxRuntimeExports.jsx("p", { className: "member-card-tagline text-sm italic mb-3", children: meta.tagline })), meta.member_pitch && (jsxRuntimeExports.jsx("p", { className: "member-card-pitch text-sm mb-3 line-clamp-3", children: meta.member_pitch })), meta.website && (jsxRuntimeExports.jsx("a", { href: meta.website, target: "_blank", rel: "noopener noreferrer", className: "member-card-website text-blue-600 hover:underline text-sm", children: "Visit Website \u2192" }))] })] }, member.id));
         }) }));
 };
 
@@ -1886,6 +1956,7 @@ exports.MemberSlideshow = MemberSlideshow;
 exports.TestimonialCard = TestimonialCard;
 exports.TestimonialCardsGrid = TestimonialCardsGrid;
 exports.TestimonialSlideshow = TestimonialSlideshow;
+exports.setStaticDataProvider = setStaticDataProvider;
 exports.setWordPressApiUrl = setWordPressApiUrl;
 exports.useMember = useMember;
 exports.useMembers = useMembers;