/* Dulius Web UI Kit — shared primitives */

function WIcon({ name, size = 20, stroke = 2, className = "", style = {} }) {
  const ref = React.useRef(null);
  React.useEffect(() => {
    const el = ref.current;
    if (!el || !window.lucide) return;
    el.innerHTML = "";
    const i = document.createElement("i");
    i.setAttribute("data-lucide", name);
    el.appendChild(i);
    try { window.lucide.createIcons({ attrs: { width: size, height: size, "stroke-width": stroke } }); } catch (e) {}
  }, [name, size, stroke]);
  return <span ref={ref} className={"wico " + className} style={{ display: "inline-flex", width: size, height: size, ...style }} />;
}

function WButton({ variant = "primary", size = "md", icon, iconRight, children, onClick, style = {} }) {
  return (
    <button className={`wbtn wbtn-${variant} wbtn-${size}`} onClick={onClick} style={style}>
      {icon && <WIcon name={icon} size={size === "lg" ? 20 : 18} />}
      {children && <span>{children}</span>}
      {iconRight && <WIcon name={iconRight} size={size === "lg" ? 20 : 18} />}
    </button>
  );
}

Object.assign(window, { WIcon, WButton });