import { r as l, h as i, H as r } from "./index.e6beb8d9.js";
import "react";
import "react-dom";
const s = () => ':host{display:block}:host *{box-sizing:border-box}.swirl-list{line-height:var(--s-line-height-base)}.swirl-list ul,.swirl-list ol{margin:0;padding:0;list-style-position:outside;list-style-type:none}.swirl-list ul li{padding-left:1.5rem}.swirl-list ul li:before{display:inline-block;width:1.5rem;margin-left:-1.5rem;text-align:center;content:"\u2022"}.swirl-list ol{counter-reset:item}.swirl-list ol ol{counter-reset:letter}.swirl-list ol ol li:before{content:counter(letter, lower-alpha) ".";counter-increment:letter}.swirl-list ol li{padding-left:1.5rem}.swirl-list ol li:before{display:inline-block;min-width:1.5rem;margin-left:-1.5rem;padding-right:var(--s-space-8);text-align:right;content:counter(item) ".";counter-increment:item;font-variant-numeric:tabular-nums}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.swirl-list{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}', n = class {
  constructor(e) {
    l(this, e);
  }
  componentDidRender() {
    Array.from(this.containerEl.children).some((t) => !["UL", "OL"].includes(t.tagName)) && console.warn("[SwirlList] Only ul and ol elements are allowed as direct children of <swirl-list />.");
  }
  render() {
    return i(r, { key: "33a17d13bf9b18a75f85e865d131f8f0f0f196e2" }, i("div", { key: "409b90ae07dcb6fcb76d4a24875f78b8cb535d3d", class: "swirl-list", ref: (e) => this.containerEl = e }, i("slot", { key: "e89fa0d1a1c61d62e2ed5286471e2b63fbe28717" })));
  }
};
n.style = s();
export {
  n as swirl_list
};
