---
import Li from "@components/Li.astro";
import type { ComponentPropsBase } from "@interfaces/components.ts";

import type { lineItem } from "@interfaces/ul-li.ts";

interface Props extends ComponentPropsBase {
  lineItems?: lineItem[];
  depth?: number;
}

const { class: className, lineItems, depth = 0 } = Astro.props;
---

<ol
  class:list={["list-inside list-disc", className, depth > 0 ? "ps-3" : false]}
>
  {
    lineItems ? (
      lineItems.map((line) => (
        <Li>
          {line.item}
          {line.subItems ? (
            <Astro.self
              class={className}
              lineItems={line.subItems}
              depth={depth + 1}
            />
          ) : undefined}
        </Li>
      ))
    ) : (
      <slot />
    )
  }
</ol>