;
{
  try {
    let e = "undefined" != typeof window ? window : "undefined" != typeof global ? global : "undefined" != typeof globalThis ? globalThis : "undefined" != typeof self ? self : {}, n = new e.Error().stack;
    n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "4a76e7ae-9b8a-4d73-b285-9bd999feff5d", e._sentryDebugIdIdentifier = "sentry-dbid-4a76e7ae-9b8a-4d73-b285-9bd999feff5d");
  } catch (e) {
  }
}
;
import { jsxs, jsx } from "preact/jsx-runtime";
import cx from "classnames";
import { toChildArray } from "preact";
const list = "adyen-kyc-list";
const listHeader = "adyen-kyc-list-header";
const listFooter = "adyen-kyc-list-footer";
const listItems = "adyen-kyc-list-items";
const listItemsPlain = "adyen-kyc-list-items-plain";
const listItemsGroupedPrimary = "adyen-kyc-list-items-grouped-primary";
const listItemsGroupedSecondary = "adyen-kyc-list-items-grouped-secondary";
const listItemsPaddingNone = "adyen-kyc-list-items-padding-none";
const listItemsPaddingSmall = "adyen-kyc-list-items-padding-small";
const listItemsPaddingMedium = "adyen-kyc-list-items-padding-medium";
const listItemsPaddingLarge = "adyen-kyc-list-items-padding-large";
const listItemRowSeparator = "adyen-kyc-list-item-row-separator";
const styles = {
  list,
  listHeader,
  listFooter,
  listItems,
  listItemsPlain,
  listItemsGroupedPrimary,
  listItemsGroupedSecondary,
  listItemsPaddingNone,
  listItemsPaddingSmall,
  listItemsPaddingMedium,
  listItemsPaddingLarge,
  listItemRowSeparator
};
const List = ({
  children,
  dividers = true,
  footer,
  header,
  padding = "medium",
  variant = "plain"
}) => {
  const childrenArray = toChildArray(children);
  const listVariantStyles = {
    plain: styles.listItemsPlain,
    "grouped-primary": styles.listItemsGroupedPrimary,
    "grouped-secondary": styles.listItemsGroupedSecondary
  };
  const listClassName = cx(
    styles.listItems,
    listVariantStyles[variant],
    variant !== "plain" && {
      [styles.listItemsPaddingSmall]: padding === "small",
      [styles.listItemsPaddingMedium]: padding === "medium",
      [styles.listItemsPaddingLarge]: padding === "large"
    },
    {
      [styles.listItemsPaddingNone]: padding === "none"
    }
  );
  return /* @__PURE__ */ jsxs("div", { className: styles.list, children: [
    header && /* @__PURE__ */ jsx("div", { className: styles.listHeader, children: header }),
    /* @__PURE__ */ jsx("ul", { className: listClassName, children: childrenArray.map((item) => {
      const itemClassname = cx(styles.listItem, {
        [styles.listItemRowSeparator]: dividers
      });
      return (
        // Content of <li /> will be unknown. Not including a key is preferred over
        // using something else, such as index, which may cause problems.
        // eslint-disable-next-line react/jsx-key
        /* @__PURE__ */ jsx("li", { className: itemClassname, children: item })
      );
    }) }),
    footer && /* @__PURE__ */ jsx("div", { className: styles.listFooter, children: footer })
  ] });
};
export {
  List as L
};
