1:"$Sreact.fragment"
2:I[14627,["8173","static/chunks/8173-c3ed3bc2d0ae7ca8.js","7525","static/chunks/7525-7a1a5e1511dea190.js","7177","static/chunks/app/layout-11e1d5e45067277c.js"],"ThemeProvider"]
3:I[82025,["8173","static/chunks/8173-c3ed3bc2d0ae7ca8.js","7525","static/chunks/7525-7a1a5e1511dea190.js","7177","static/chunks/app/layout-11e1d5e45067277c.js"],"default"]
4:I[46525,["8173","static/chunks/8173-c3ed3bc2d0ae7ca8.js","7525","static/chunks/7525-7a1a5e1511dea190.js","7177","static/chunks/app/layout-11e1d5e45067277c.js"],"default"]
5:I[15244,[],""]
6:I[43866,[],""]
7:I[30191,["8173","static/chunks/8173-c3ed3bc2d0ae7ca8.js","406","static/chunks/406-889913e11df0a888.js","8953","static/chunks/app/utilities/pictures/page-afb568ac5135112c.js"],"default",1]
8:I[48173,["8173","static/chunks/8173-c3ed3bc2d0ae7ca8.js","406","static/chunks/406-889913e11df0a888.js","8953","static/chunks/app/utilities/pictures/page-afb568ac5135112c.js"],""]
9:I[86213,[],"OutletBoundary"]
b:I[86213,[],"MetadataBoundary"]
d:I[86213,[],"ViewportBoundary"]
f:I[34835,[],""]
:HL["/_next/static/media/a34f9d1faa5f3315-s.p.woff2","font",{"crossOrigin":"","type":"font/woff2"}]
:HL["/_next/static/css/7372fd73fc9f904e.css","style"]
0:{"P":null,"b":"ds2nZAjgJ_uSRgCt4uMw0","p":"","c":["","utilities","pictures"],"i":false,"f":[[["",{"children":["utilities",{"children":["pictures",{"children":["__PAGE__",{}]}]}]},"$undefined","$undefined",true],["",["$","$1","c",{"children":[[["$","link","0",{"rel":"stylesheet","href":"/_next/static/css/7372fd73fc9f904e.css","precedence":"next","crossOrigin":"$undefined","nonce":"$undefined"}]],["$","html",null,{"lang":"en","suppressHydrationWarning":true,"children":["$","body",null,{"className":"__className_d65c78","children":["$","$L2",null,{"attribute":"class","defaultTheme":"light","enableSystem":true,"disableTransitionOnChange":true,"children":["$","div",null,{"className":"flex flex-col min-h-screen","children":[["$","$L3",null,{}],["$","div",null,{"className":"flex flex-1 flex-col md:flex-row mt-16 md:mt-16","children":[["$","$L4",null,{}],["$","main",null,{"className":"flex-1 p-4 md:p-8 pb-16","children":["$","div",null,{"className":"container mx-auto max-w-4xl","children":["$","$L5",null,{"parallelRouterKey":"children","segmentPath":["children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L6",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":[[],[["$","title",null,{"children":"404: This page could not be found."}],["$","div",null,{"style":{"fontFamily":"system-ui,\"Segoe UI\",Roboto,Helvetica,Arial,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\"","height":"100vh","textAlign":"center","display":"flex","flexDirection":"column","alignItems":"center","justifyContent":"center"},"children":["$","div",null,{"children":[["$","style",null,{"dangerouslySetInnerHTML":{"__html":"body{color:#000;background:#fff;margin:0}.next-error-h1{border-right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border-right:1px solid rgba(255,255,255,.3)}}"}}],["$","h1",null,{"className":"next-error-h1","style":{"display":"inline-block","margin":"0 20px 0 0","padding":"0 23px 0 0","fontSize":24,"fontWeight":500,"verticalAlign":"top","lineHeight":"49px"},"children":404}],["$","div",null,{"style":{"display":"inline-block"},"children":["$","h2",null,{"style":{"fontSize":14,"fontWeight":400,"lineHeight":"49px","margin":0},"children":"This page could not be found."}]}]]}]}]]],"forbidden":"$undefined","unauthorized":"$undefined"}]}]}]]}],["$","footer",null,{"className":"border-t border-border py-6 bg-muted/40","children":["$","div",null,{"className":"container mx-auto px-4 md:px-6","children":["$","div",null,{"className":"flex flex-col md:flex-row justify-between items-center","children":[["$","div",null,{"className":"mb-4 md:mb-0","children":["$","p",null,{"className":"text-sm text-muted-foreground","children":["© ",2025," Combo WordPress Plugin. All rights reserved."]}]}],["$","div",null,{"className":"flex space-x-6","children":[["$","a",null,{"href":"#","className":"text-sm text-muted-foreground hover:text-foreground transition-colors","children":"Privacy Policy"}],["$","a",null,{"href":"#","className":"text-sm text-muted-foreground hover:text-foreground transition-colors","children":"Terms of Service"}],["$","a",null,{"href":"#","className":"text-sm text-muted-foreground hover:text-foreground transition-colors","children":"Contact"}]]}]]}]}]}]]}]}]}]}]]}],{"children":["utilities",["$","$1","c",{"children":[null,["$","$L5",null,{"parallelRouterKey":"children","segmentPath":["children","utilities","children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L6",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","forbidden":"$undefined","unauthorized":"$undefined"}]]}],{"children":["pictures",["$","$1","c",{"children":[null,["$","$L5",null,{"parallelRouterKey":"children","segmentPath":["children","utilities","children","pictures","children"],"error":"$undefined","errorStyles":"$undefined","errorScripts":"$undefined","template":["$","$L6",null,{}],"templateStyles":"$undefined","templateScripts":"$undefined","notFound":"$undefined","forbidden":"$undefined","unauthorized":"$undefined"}]]}],{"children":["__PAGE__",["$","$1","c",{"children":[["$","div",null,{"className":"space-y-8","children":[["$","div",null,{"children":[["$","h1",null,{"className":"text-3xl font-bold tracking-tight mb-4","children":"Pictures"}],["$","p",null,{"className":"text-muted-foreground","children":"The pictures utility functions provide tools for generating responsive images with support for lazy loading and ACF integration."}]]}],["$","div",null,{"className":"space-y-4","children":[["$","h2",null,{"className":"text-xl font-semibold","children":"Available Functions"}],["$","div",null,{"className":"space-y-6","children":[["$","div",null,{"children":[["$","h3",null,{"className":"text-lg font-medium","children":"cbo_acf_img($picture, $size, $urlset, $options)"}],["$","p",null,{"className":"text-muted-foreground mb-2","children":"Generates an HTML img tag from an ACF image array with support for responsive images."}],["$","h4",null,{"className":"text-base font-medium mt-4","children":"Parameters:"}],["$","ul",null,{"className":"list-disc pl-6 space-y-2 text-muted-foreground","children":[["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$picture"}],": ACF image array obtained via get_field()."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$size"}],": Image size to use (default: 'medium')."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$urlset"}],": Array of sizes and screen widths for srcset (default: null)."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$options"}],": Configuration options for the image tag."]}]]}],["$","h4",null,{"className":"text-base font-medium mt-4","children":"Options:"}],["$","ul",null,{"className":"list-disc pl-6 space-y-2 text-muted-foreground","children":[["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"echo"}],": Display directly (true) or return HTML (false) (default: true)."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"placeholder"}],": Use a placeholder if the image doesn't exist (default: true)."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"lazy"}],": Enable lazy loading (default: true)."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"lazyClass"}],": CSS class for lazy loading (default: 'lazy')."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"class"}],": Additional CSS classes (default: '')."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"alt"}],": Alternative text (default: null, uses image's alt text)."]}]]}],["$","$L7",null,{"code":"// Basic usage\n$image = get_field('image');\ncbo_acf_img($image, 'medium');\n\n// With custom options\ncbo_acf_img($image, 'medium', null, [\n  'class' => 'featured-image',\n  'alt' => 'Custom description',\n  'lazy' => true\n]);\n\n// With responsive srcset\ncbo_acf_img($image, 'medium', [\n  ['thumbnail', 576],\n  ['medium', 768],\n  ['large', 1200],\n  ['sizes', '(min-width: 1200px) 1200px, 100vw']\n], [\n  'class' => 'responsive-image'\n]);","language":"php"}]]}],["$","div",null,{"children":[["$","h3",null,{"className":"text-lg font-medium","children":"cbo_acf_picture($picture, $size, $urlset, $options)"}],["$","p",null,{"className":"text-muted-foreground mb-2","children":"Generates an HTML picture tag from an ACF image array, offering more precise control over responsive images."}],["$","h4",null,{"className":"text-base font-medium mt-4","children":"Parameters:"}],["$","ul",null,{"className":"list-disc pl-6 space-y-2 text-muted-foreground","children":[["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$picture"}],": ACF image array obtained via get_field()."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$size"}],": Image size to use (default: 'medium')."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$urlset"}],": Array of sizes and screen widths for sources (default: null)."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$options"}],": Configuration options for the picture tag."]}]]}],["$","h4",null,{"className":"text-base font-medium mt-4","children":"Options:"}],["$","p",null,{"className":"text-muted-foreground","children":"Same as cbo_acf_img()."}],["$","$L7",null,{"code":"// Using picture tag for art direction\n$image = get_field('image');\ncbo_acf_picture($image, 'medium', [\n  ['portrait', 576],  // Portrait format for mobile\n  ['landscape', 768], // Landscape format for tablet\n  ['large', 1200],    // Large image for desktop\n], [  768], // Landscape format for tablet\n  ['large', 1200],    // Large image for desktop\n], [\n  'class' => 'hero-image'\n]);","language":"php"}]]}],["$","div",null,{"children":[["$","h3",null,{"className":"text-lg font-medium","children":"cbo_img($picture, $options, $urlset, $sizes)"}],["$","p",null,{"className":"text-muted-foreground mb-2","children":"Versatile function that generates an HTML img tag from different types of data (ID, URL, array)."}],["$","h4",null,{"className":"text-base font-medium mt-4","children":"Parameters:"}],["$","ul",null,{"className":"list-disc pl-6 space-y-2 text-muted-foreground","children":[["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$picture"}],": WordPress image ID, URL, or array (default: null, uses featured image)."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$options"}],": Configuration options for the image tag."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$urlset"}],": String srcset for responsive images (default: null)."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$sizes"}],": Attribute sizes for responsive images (default: null)."]}]]}],["$","h4",null,{"className":"text-base font-medium mt-4","children":"Options:"}],["$","ul",null,{"className":"list-disc pl-6 space-y-2 text-muted-foreground","children":[["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"echo"}],": Display directly (true) or return HTML (false) (default: true)."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"lazy"}],": Enable lazy loading (default: true)."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"lazyClass"}],": CSS class for lazy loading (default: 'lazy')."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"class"}],": Additional CSS classes (default: '')."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"alt"}],": Alternative text (default: '')."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"attr"}],": Additional HTML attributes (default: '')."]}]]}],["$","$L7",null,{"code":"// Using image ID\ncbo_img(123, [\n  'class' => 'logo',\n  'alt' => 'Company logo',\n  'lazy' => false\n]);\n\n// Using image URL\ncbo_img('https://example.com/image.jpg', [\n  'class' => 'banner',\n  'alt' => 'Banner image'\n]);\n\n// Using featured image\ncbo_img(null, [\n  'class' => 'featured-image',\n  'alt' => 'Featured image'\n]);\n\n// Using custom srcset\n$srcset = '123-300x200.jpg 300w, 123-600x400.jpg 600w, 123-900x600.jpg 900w';\n$sizes = '(max-width: 600px) 300px, (max-width: 1200px) 600px, 900px';\ncbo_img(123, ['class' => 'responsive-image'], $srcset, $sizes);","language":"php"}]]}],["$","div",null,{"children":[["$","h3",null,{"className":"text-lg font-medium","children":"cbo_img_placeholder($echo, $style)"}],["$","p",null,{"className":"text-muted-foreground mb-2","children":"Generates an image placeholder when no image is available."}],["$","h4",null,{"className":"text-base font-medium mt-4","children":"Parameters:"}],["$","ul",null,{"className":"list-disc pl-6 space-y-2 text-muted-foreground","children":[["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$echo"}],": Display directly (true) or return HTML (false) (default: true)."]}],["$","li",null,{"children":[["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$style"}],": Inline CSS styles to apply to the placeholder (default: '')."]}]]}],["$","$L7",null,{"code":"// Display placeholder with default style\ncbo_img_placeholder();\n\n// Display placeholder with custom style\ncbo_img_placeholder(true, 'width: 300px; height: 200px; background-color: #f5f5f5;');\n\n// Return placeholder for later use\n$placeholder = cbo_img_placeholder(false);\necho '<div class=\"gallery\">' . $placeholder . '</div>';","language":"php"}]]}]]}]]}],["$","div",null,{"className":"space-y-4","children":[["$","h2",null,{"className":"text-xl font-semibold","children":"Lazy Loading"}],["$","p",null,{"children":"The system supports two methods of lazy loading:"}],["$","div",null,{"className":"space-y-4","children":[["$","div",null,{"children":[["$","h3",null,{"className":"text-lg font-medium","children":"Native"}],["$","p",null,{"className":"text-muted-foreground","children":["Uses the ",["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"loading=\"lazy\""}]," attribute native to modern browsers."]}]]}],["$","div",null,{"children":[["$","h3",null,{"className":"text-lg font-medium","children":"Vanilla"}],["$","p",null,{"className":"text-muted-foreground","children":["Uses the ",["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"data-src"}]," and"," ",["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"data-srcset"}]," attributes that require JavaScript to function."]}]]}],["$","p",null,{"children":["The method is configured via"," ",["$","code",null,{"className":"px-1 py-0.5 bg-muted rounded text-sm","children":"$$cbo['assets']['lazyload']"}],":"]}],["$","$L7",null,{"code":"// Configuration for native lazy loading\n$cbo['assets']['lazyload'] = 'native';\n\n// Configuration for vanilla lazy loading\n$cbo['assets']['lazyload'] = 'vanilla';","language":"php"}]]}]]}],["$","div",null,{"className":"space-y-4","children":[["$","h2",null,{"className":"text-xl font-semibold","children":"Usage Examples"}],["$","div",null,{"className":"space-y-6","children":[["$","div",null,{"children":[["$","h3",null,{"className":"text-lg font-medium","children":"Responsive Hero Image"}],["$","$L7",null,{"code":"// Display a responsive hero image\nfunction display_hero_image() {\n  $hero_image = get_field('hero_image');\n  \n  if (!$hero_image) {\n    return;\n  }\n  \n  echo '<div class=\"hero-section\">';\n  \n  // Use different image sizes for different screen widths\n  cbo_acf_picture($hero_image, 'large', [\n    ['medium', 768],    // Medium size for tablets\n    ['large', 1200],    // Large size for small desktops\n    ['full', 1920],     // Full size for large desktops\n  ], [\n    'class' => 'hero-image',\n    'alt' => get_field('hero_title')\n  ]);\n  \n  echo '<div class=\"hero-content\">';\n  echo '<h1>' . get_field('hero_title') . '</h1>';\n  echo '<p>' . get_field('hero_subtitle') . '</p>';\n  echo '</div>';\n  echo '</div>';\n}\n\n// Usage\ndisplay_hero_image();","language":"php"}]]}],["$","div",null,{"children":[["$","h3",null,{"className":"text-lg font-medium","children":"Image Gallery"}],["$","$L7",null,{"code":"// Display an image gallery\nfunction display_image_gallery() {\n  $gallery = get_field('gallery');\n  \n  if (!$gallery) {\n    return;\n  }\n  \n  echo '<div class=\"gallery-grid\">';\n  \n  foreach ($gallery as $image) {\n    echo '<div class=\"gallery-item\">';\n    \n    // Display thumbnail that links to full size image\n    echo '<a href=\"' . $image['url'] . '\" class=\"gallery-link\">';\n    cbo_acf_img($image, 'medium', null, [\n      'class' => 'gallery-thumbnail',\n      'alt' => $image['alt']\n    ]);\n    echo '</a>';\n    \n    if ($image['caption']) {\n      echo '<div class=\"caption\">' . $image['caption'] . '</div>';\n    }\n    \n    echo '</div>';\n  }\n  \n  echo '</div>';\n}\n\n// Usage\ndisplay_image_gallery();","language":"php"}]]}]]}]]}],["$","div",null,{"className":"space-y-4","children":[["$","h2",null,{"className":"text-xl font-semibold","children":"Best Practices"}],["$","ul",null,{"className":"list-disc pl-6 space-y-2 text-muted-foreground","children":[["$","li",null,{"children":[["$","strong",null,{"children":"Always provide alternative text"}]," for accessibility and SEO."]}],["$","li",null,{"children":[["$","strong",null,{"children":"Use responsive images"}]," to optimize performance on all devices."]}],["$","li",null,{"children":[["$","strong",null,{"children":"Enable lazy loading"}]," to improve page loading performance."]}],["$","li",null,{"children":[["$","strong",null,{"children":"Specify image dimensions"}]," to prevent layout shifts during loading."]}],["$","li",null,{"children":[["$","strong",null,{"children":"Use cbo_acf_picture"}]," for art direction (different image crops for different screen sizes)."]}]]}]]}],["$","div",null,{"className":"mt-8 border-t border-border pt-6","children":["$","div",null,{"className":"flex justify-between","children":[["$","$L8",null,{"href":"/utilities/admin","className":"text-primary hover:underline","children":"← Admin"}],["$","$L8",null,{"href":"/utilities/blocks","className":"text-primary hover:underline","children":"Blocks →"}]]}]}]]}],null,["$","$L9",null,{"children":"$La"}]]}],{},null,false]},null,false]},null,false]},null,false],["$","$1","h",{"children":[null,["$","$1","_swN5mF_fFEO-sdWlr26F",{"children":[["$","$Lb",null,{"children":"$Lc"}],["$","$Ld",null,{"children":"$Le"}],["$","meta",null,{"name":"next-size-adjust","content":""}]]}]]}],false]],"m":"$undefined","G":["$f","$undefined"],"s":false,"S":true}
e:[["$","meta","0",{"name":"viewport","content":"width=device-width, initial-scale=1"}]]
c:[["$","meta","0",{"charSet":"utf-8"}],["$","title","1",{"children":"Combo WordPress Plugin Documentation"}],["$","meta","2",{"name":"description","content":"Documentation for the Combo WordPress plugin - A powerful configuration system and optimization toolkit"}],["$","meta","3",{"name":"generator","content":"v0.dev"}]]
a:null