'use strict';
import { jsxs, jsx } from 'react/jsx-runtime';
import { cn } from '../../../fd-toolbox/lib/utils.js';
import { getCardConfig } from './config/card-config.js';
import { DataCard } from './data-card/DataCard.js';
import { ResourceAddButton } from '../resource-list/resource-add-button.js';
import { hasCardsToDisplay } from './CardList.funcs.js';
import { isCardLayoutVertical, isCardLayoutHorizontal } from './card-layout.js';

var __defProp = Object.defineProperty;
var __name = (target, value) => __defProp(target, "name", {
  value,
  configurable: true
});
function CardList({
  onRefreshItems,
  config,
  uiResourceMeta,
  resources,
  onItemDelete
}) {
  const cardConfig = config ?? getCardConfig();
  const layoutClasses = cn("w-full gap-2 p-2", {
    "grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3": isCardLayoutHorizontal(cardConfig),
    "flex flex-wrap": isCardLayoutVertical(cardConfig)
  });
  return /* @__PURE__ */jsxs("div", {
    className: "flex w-full flex-col",
    children: [/* @__PURE__ */jsx("div", {
      className: "pl-2",
      children: /* @__PURE__ */jsx(ResourceAddButton, {
        resourceName: uiResourceMeta.resourceMeta.resourceName,
        onRefreshItems
      })
    }), /* @__PURE__ */jsx("div", {
      className: layoutClasses,
      children: hasCardsToDisplay(resources) && resources.map(resource => /* @__PURE__ */jsx(DataCard, {
        resource,
        uiResourceMeta,
        cardConfig,
        onItemDelete,
        onRefreshItems
      }, resource.id))
    })]
  });
}
__name(CardList, "CardList");

export { CardList };
