import { jsx as a } from "react/jsx-runtime";
import { useMemo as c } from "react";
import { a as d } from "./index.CfQlFjZU.js";
import { l as C } from "./index.C1ZfizMq.js";
import { C as l } from "./card.CVCKhKP6.js";
import { C as m } from "./CardContent.DpE_X3Tr.js";
const p = "creator_container_tgwzG", h = { container: p }, u = ({
  options: t,
  selectedOption: e,
  onSelect: r
}) => {
  const n = c(
    () => t.map((i, s) => ({
      ...i,
      onClick: () => {
        i.onClick?.(), r?.(s);
      },
      selectable: !!r,
      selected: e === s
    })),
    [t, e, r]
  ), o = c(() => r ? f : v, [r]);
  return {
    options: n,
    optionCard: o,
    containerClassName: h.container
  };
}, v = ({
  title: t,
  description: e,
  icon: r,
  onClick: n
}) => /* @__PURE__ */ a(l, { onClick: n, elevation: "high", interaction: "interactive", children: /* @__PURE__ */ a(
  m,
  {
    header: t,
    body: e,
    headerSize: "small",
    variant: "vertical",
    icon: r
  }
) }), f = ({
  title: t,
  description: e,
  icon: r,
  onClick: n,
  selected: o
}) => /* @__PURE__ */ a(
  l,
  {
    onClick: n,
    elevation: "high",
    interaction: "selectable",
    selected: o,
    children: /* @__PURE__ */ a(
      m,
      {
        header: t,
        body: e,
        headerSize: "small",
        variant: "vertical",
        icon: r
      }
    )
  }
), b = ({
  options: t,
  containerClassName: e,
  optionCard: r
}) => /* @__PURE__ */ a("div", { className: e, children: /* @__PURE__ */ a(C, { values: t, layout: r }) }), _ = d(b, u);
export {
  _ as O
};
