/* empty css                                    */
import { d as createAstro, c as createComponent$1, r as renderComponent, a as renderTemplate } from '../chunks/astro/server_5mFihzcn.mjs';
import { $ as $$Layout } from '../chunks/Layout_v67TeP9G.mjs';
import { ssr, ssrHydrationKey, ssrAttribute, escape, createComponent } from 'solid-js/web';
import { createSignal, createEffect } from 'solid-js';
export { renderers } from '../renderers.mjs';

var _tmpl$$1 = ["<svg", ' viewBox="0 0 20 20" fill="currentColor" aria-hidden="true"><path fill-rule="evenodd" d="M5.23 7.21a.75.75 0 011.06.02L10 11.168l3.71-3.938a.75.75 0 111.08 1.04l-4.25 4.5a.75.75 0 01-1.08 0l-4.25-4.5a.75.75 0 01.02-1.06z" clip-rule="evenodd"></path></svg>'];
const CaretDown = ({
  className
}) => {
  return ssr(_tmpl$$1, ssrHydrationKey() + ssrAttribute("class", escape(className, true), false));
};

var _tmpl$ = ["<div", ' class="', '"><div class="min-h-[12rem] relative flex"><div class="flex overflow-hidden justify-center items-center w-full">', '</div><div class="absolute inset-y-0 left-0 w-14 flex items-center justify-center z-10"><button type="button" style="', '" class="', '">', '</button></div><div class="absolute inset-y-0 right-0 w-14 flex items-center justify-center z-10"><button type="button" style="', '" class="', '">', '</button></div></div><div class="', '"> <div class="flex gap-2">', "</div></div></div>"], _tmpl$2 = ["<div", ' class="', '"><!--$-->', "<!--/--><!--$-->", "<!--/--></div>"], _tmpl$3 = ["<span", ' class="absolute top-0 right-3 px-2 py-1 font-thin opacity-70" style="', '"><!--$-->', "<!--/-->/<!--$-->", "<!--/--></span>"], _tmpl$4 = ["<img", ' class="', '">'], _tmpl$5 = ["<button", ' type="button" style="', '" class="', '">', "</button>"], _tmpl$6 = ["<small", ' class="text-[.5rem] text-invert self-center" style="', '"><!--$-->', "<!--/--> </small>"];
const Carousel = ({
  indicator = {
    style: "circle",
    color: "gray"
  },
  items,
  active = 0,
  fraction,
  className,
  autoplay,
  timing
}) => {
  const [current, setCurrent] = createSignal(active ?? 0);
  const count = items.length;
  const change = (n) => setCurrent(n);
  const next = () => change(current() < count - 1 ? current() + 1 : 0);
  createEffect(() => {
    const time = timing ?? 1e4;
    if (!autoplay) return;
    setTimeout(next, time);
    return;
  }, [current()]);
  return ssr(_tmpl$, ssrHydrationKey(), `flex flex-col relative ${escape(className, true)} gap-6`, escape(items.map((item, n) => {
    return ssr(_tmpl$2, ssrHydrationKey() + ssrAttribute("data-item", escape(n, true), false), `transition-all duration-700  flex justify-center ${current() === n ? "z-2 self-center grow" : "-z-50 opacity-0 shrink w-0"}`, fraction && ssr(_tmpl$3, ssrHydrationKey(), "color:" + (escape(indicator.color, true) ?? "black"), escape(n) + 1, escape(count)), item.image && ssr(_tmpl$4, ssrHydrationKey() + ssrAttribute("src", escape(item.image, true), false) + ssrAttribute("alt", escape(item.heading, true), false), `max-h-[75vh] h-full w-auto transition-all duration-700  ${current() === n ? "object-contain" : ""}`));
  })), "color:" + (escape(indicator.color, true) ?? "black"), `transition-all duration-700 backdrop-blur-sm rounded-full`, escape(createComponent(CaretDown, {
    className: "w-8 h-8 rotate-90"
  })), "color:" + (escape(indicator.color, true) ?? "black"), `transition-all duration-700 backdrop-blur-sm rounded-full`, escape(createComponent(CaretDown, {
    className: "w-8 h-8 -rotate-90"
  })), `flex self-center justify-center backdrop-blur-sm w-full absolute bottom-0 p-3`, escape(items.map((item, n) => {
    return ssr(_tmpl$5, ssrHydrationKey(), "background:" + (escape(indicator.color, true) ?? "black"), `transition-all duration-700 relative flex items-center justify-center ${current() === n ? "scale-150" : "opacity-75"} ${indicator.style === "circle" ? " rounded-full h-3 w-3" : indicator.style === "rect" ? " h-1 w-4" : " h-2 px-[.35rem] py-[.3rem] rounded-xl"}`, indicator.style === "number" && ssr(_tmpl$6, ssrHydrationKey(), "color:" + (escape(indicator.color, true) ?? "black") + (";font-weight:" + (current() === n ? "700" : "normal")), escape(n) + 1));
  })));
};

const $$Astro = createAstro("https://new.sambekiel.com");
const $$Gallery = createComponent$1(async ($$result, $$props, $$slots) => {
  const Astro2 = $$result.createAstro($$Astro, $$props, $$slots);
  Astro2.self = $$Gallery;
  const galleryImages = await Astro2.glob(/* #__PURE__ */ Object.assign({"../../public/img/gallery/customs-agents.jpg": () => import('../chunks/customs-agents_VI-YJxo0.mjs'),"../../public/img/gallery/photo1.jpg": () => import('../chunks/photo1_DtfFoYEy.mjs'),"../../public/img/gallery/photo2.jpg": () => import('../chunks/photo2_qF8uZn5Z.mjs'),"../../public/img/gallery/photo3.jpg": () => import('../chunks/photo3_1qwsMdB-.mjs'),"../../public/img/gallery/photo4.jpg": () => import('../chunks/photo4_1tCyk8tM.mjs'),"../../public/img/gallery/photo5.jpg": () => import('../chunks/photo5_DsDMo23U.mjs'),"../../public/img/gallery/photo6.jpg": () => import('../chunks/photo6_CfKwagAn.mjs'),"../../public/img/gallery/photo7.jpg": () => import('../chunks/photo7_C3kJgf2m.mjs')}), () => "../../public/img/gallery/*.{png,jpg}");
  const gallery = galleryImages.map((i) => {
    const base = "/img";
    return { image: base + i.default.src.split(base)[1] };
  }).filter((i) => !i.image.includes("logo"));
  return renderTemplate`${renderComponent($$result, "Layout", $$Layout, { "title": "Gallery", "showTitle": true }, { "default": async ($$result2) => renderTemplate`  ${renderComponent($$result2, "Carousel", Carousel, { "className": "bg-slate-100 rounded-3xl overflow-hidden", "items": gallery, "indicator": { style: "circle", color: "#001" }, "fraction": true, "autoplay": true, "client:load": true, "client:component-hydration": "load", "client:component-path": "@components/Carousel", "client:component-export": "Carousel" })} ` })}`;
}, "C:/projects/sambekiel_front/src/pages/gallery.astro", void 0);

const $$file = "C:/projects/sambekiel_front/src/pages/gallery.astro";
const $$url = "/gallery";

const _page = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
  __proto__: null,
  default: $$Gallery,
  file: $$file,
  url: $$url
}, Symbol.toStringTag, { value: 'Module' }));

const page = () => _page;

export { page };
