import{_ as l}from"./highlight.vue_vue_type_style_index_0_lang-CZKerFrO.js";import{c as u}from"./codePreview-DjOizdob.js";import{u as p}from"./use-meta-_u_PFTGV.js";import{d as g,a as x,h as t,e as n,b as s,w as d,k as h,x as r,o as i}from"./main-FivMmpKK.js";const y=t("ul",{class:"flex space-x-2 rtl:space-x-reverse"},[t("li",null,[t("a",{href:"javascript:;",class:"text-primary hover:underline"},"Elements")]),t("li",{class:"before:content-['/'] ltr:before:mr-2 rtl:before:ml-2"},[t("span",null,"Pagination")])],-1),k={class:"pt-5 grid grid-cols-1 xl:grid-cols-2 gap-6"},c={class:"panel"},w={class:"flex items-center justify-between mb-5"},m=t("h5",{class:"font-semibold text-lg dark:text-white-light"},"Default",-1),f=r('<span class="flex items-center"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 ltr:mr-2 rtl:ml-2"><path d="M17 7.82959L18.6965 9.35641C20.239 10.7447 21.0103 11.4389 21.0103 12.3296C21.0103 13.2203 20.239 13.9145 18.6965 15.3028L17 16.8296" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><path opacity="0.5" d="M13.9868 5L10.0132 19.8297" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><path d="M7.00005 7.82959L5.30358 9.35641C3.76102 10.7447 2.98975 11.4389 2.98975 12.3296C2.98975 13.2203 3.76102 13.9145 5.30358 15.3028L7.00005 16.8296" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg> Code </span>',1),v=[f],j=r('<div class="mb-5"><div class="flex justify-center flex-col w-full"><ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto mb-4"><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-dark hover:text-primary border-2 border-[#e0e6ed] dark:border-[#191e3a] hover:border-primary dark:hover:border-primary dark:text-white-light"> First </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-dark hover:text-primary border-2 border-[#e0e6ed] dark:border-[#191e3a] hover:border-primary dark:hover:border-primary dark:text-white-light"> Prev </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-dark hover:text-primary border-2 border-[#e0e6ed] dark:border-[#191e3a] hover:border-primary dark:hover:border-primary dark:text-white-light"> 1 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-primary border-2 border-primary dark:border-primary dark:text-white-light"> 2 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-dark hover:text-primary border-2 border-[#e0e6ed] dark:border-[#191e3a] hover:border-primary dark:hover:border-primary dark:text-white-light"> 3 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-dark hover:text-primary border-2 border-[#e0e6ed] dark:border-[#191e3a] hover:border-primary dark:hover:border-primary dark:text-white-light"> Next </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-dark hover:text-primary border-2 border-[#e0e6ed] dark:border-[#191e3a] hover:border-primary dark:hover:border-primary dark:text-white-light"> Last </button></li></ul><ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto"><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-dark hover:text-primary border-2 border-[#e0e6ed] dark:border-[#191e3a] hover:border-primary dark:hover:border-primary dark:text-white-light"> Prev </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-dark hover:text-primary border-2 border-[#e0e6ed] dark:border-[#191e3a] hover:border-primary dark:hover:border-primary dark:text-white-light"> 1 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-primary border-2 border-primary dark:border-primary dark:text-white-light"> 2 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-dark hover:text-primary border-2 border-[#e0e6ed] dark:border-[#191e3a] hover:border-primary dark:hover:border-primary dark:text-white-light"> 3 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-dark hover:text-primary border-2 border-[#e0e6ed] dark:border-[#191e3a] hover:border-primary dark:hover:border-primary dark:text-white-light"> Next </button></li></ul></div></div>',1),_=t("pre",null,`<!-- default -->
<ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto mb-4">
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        text-dark
        hover:text-primary
        border-2 border-[#e0e6ed]
        dark:border-[#191e3a]
        hover:border-primary
        dark:hover:border-primary dark:text-white-light
      "
    >
      First
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        text-dark
        hover:text-primary
        border-2 border-[#e0e6ed]
        dark:border-[#191e3a]
        hover:border-primary
        dark:hover:border-primary dark:text-white-light
      "
    >
      Prev
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        text-dark
        hover:text-primary
        border-2 border-[#e0e6ed]
        dark:border-[#191e3a]
        hover:border-primary
        dark:hover:border-primary dark:text-white-light
      "
    >
      1
    </button>
  </li>
  <li>
    <button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-primary border-2 border-primary dark:border-primary dark:text-white-light">2</button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        text-dark
        hover:text-primary
        border-2 border-[#e0e6ed]
        dark:border-[#191e3a]
        hover:border-primary
        dark:hover:border-primary dark:text-white-light
      "
    >
      3
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        text-dark
        hover:text-primary
        border-2 border-[#e0e6ed]
        dark:border-[#191e3a]
        hover:border-primary
        dark:hover:border-primary dark:text-white-light
      "
    >
      Next
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        text-dark
        hover:text-primary
        border-2 border-[#e0e6ed]
        dark:border-[#191e3a]
        hover:border-primary
        dark:hover:border-primary dark:text-white-light
      "
    >
      Last
    </button>
  </li>
</ul>

<!-- default -->
<ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto">
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        text-dark
        hover:text-primary
        border-2 border-[#e0e6ed]
        dark:border-[#191e3a]
        hover:border-primary
        dark:hover:border-primary dark:text-white-light
      "
    >
      Prev
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        text-dark
        hover:text-primary
        border-2 border-[#e0e6ed]
        dark:border-[#191e3a]
        hover:border-primary
        dark:hover:border-primary dark:text-white-light
      "
    >
      1
    </button>
  </li>
  <li>
    <button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition text-primary border-2 border-primary dark:border-primary dark:text-white-light">2</button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        text-dark
        hover:text-primary
        border-2 border-[#e0e6ed]
        dark:border-[#191e3a]
        hover:border-primary
        dark:hover:border-primary dark:text-white-light
      "
    >
      3
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        text-dark
        hover:text-primary
        border-2 border-[#e0e6ed]
        dark:border-[#191e3a]
        hover:border-primary
        dark:hover:border-primary dark:text-white-light
      "
    >
      Next
    </button>
  </li>
</ul>
`,-1),L={class:"panel"},C={class:"flex items-center justify-between mb-5"},M=t("h5",{class:"font-semibold text-lg dark:text-white-light"},"Solid",-1),B=r('<span class="flex items-center"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 ltr:mr-2 rtl:ml-2"><path d="M17 7.82959L18.6965 9.35641C20.239 10.7447 21.0103 11.4389 21.0103 12.3296C21.0103 13.2203 20.239 13.9145 18.6965 15.3028L17 16.8296" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><path opacity="0.5" d="M13.9868 5L10.0132 19.8297" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><path d="M7.00005 7.82959L5.30358 9.35641C3.76102 10.7447 2.98975 11.4389 2.98975 12.3296C2.98975 13.2203 3.76102 13.9145 5.30358 15.3028L7.00005 16.8296" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg> Code </span>',1),N=[B],P=r('<div class="mb-5"><div class="flex justify-center flex-col w-full"><ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto mb-4"><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> First </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> Prev </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 1 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-primary text-white dark:text-white-light dark:bg-primary"> 2 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 3 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> Next </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> Last </button></li></ul><ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto"><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> Prev </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 1 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-primary text-white dark:text-white-light dark:bg-primary"> 2 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 3 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> Next </button></li></ul></div></div>',1),$=t("pre",null,`<!-- solid -->
<ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto mb-4">
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      First
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      Prev
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      1
    </button>
  </li>
  <li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-primary text-white dark:text-white-light dark:bg-primary">2</button></li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      3
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      Next
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      Last
    </button>
  </li>
</ul>

<!-- solid -->
<ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto">
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      Prev
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      1
    </button>
  </li>
  <li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-primary text-white dark:text-white-light dark:bg-primary">2</button></li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      3
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      Next
    </button>
  </li>
</ul>
`,-1),F={class:"panel"},S={class:"flex items-center justify-between mb-5"},V=t("h5",{class:"font-semibold text-lg dark:text-white-light"},"With Icons",-1),E=r('<span class="flex items-center"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 ltr:mr-2 rtl:ml-2"><path d="M17 7.82959L18.6965 9.35641C20.239 10.7447 21.0103 11.4389 21.0103 12.3296C21.0103 13.2203 20.239 13.9145 18.6965 15.3028L17 16.8296" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><path opacity="0.5" d="M13.9868 5L10.0132 19.8297" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><path d="M7.00005 7.82959L5.30358 9.35641C3.76102 10.7447 2.98975 11.4389 2.98975 12.3296C2.98975 13.2203 3.76102 13.9145 5.30358 15.3028L7.00005 16.8296" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg> Code </span>',1),I=[E],W=r('<div class="mb-5"><div class="flex justify-center flex-col w-full"><ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto mb-4"><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M13 19L7 12L13 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path opacity="0.5" d="M16.9998 19L10.9998 12L16.9998 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M15 5L9 12L15 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 1 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-primary text-white dark:text-white-light dark:bg-primary"> 2 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 3 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M9 5L15 12L9 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M11 19L17 12L11 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path opacity="0.5" d="M6.99976 19L12.9998 12L6.99976 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li></ul><ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto"><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M15 5L9 12L15 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 1 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-primary text-white dark:text-white-light dark:bg-primary"> 2 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 3 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M9 5L15 12L9 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li></ul></div></div>',1),A=t("pre",null,`<!-- with icons -->
<ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto mb-4">
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      1
    </button>
  </li>
  <li>
    <button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-primary text-white dark:text-white-light dark:bg-primary">2</button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      3
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
</ul>

<!-- with icons -->
<ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto">
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      1
    </button>
  </li>
  <li>
    <button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded transition bg-primary text-white dark:text-white-light dark:bg-primary">2</button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      3
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
</ul>
`,-1),D={class:"panel"},R={class:"flex items-center justify-between mb-5"},q=t("h5",{class:"font-semibold text-lg dark:text-white-light"},"With Icons and Rounded",-1),z=r('<span class="flex items-center"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 ltr:mr-2 rtl:ml-2"><path d="M17 7.82959L18.6965 9.35641C20.239 10.7447 21.0103 11.4389 21.0103 12.3296C21.0103 13.2203 20.239 13.9145 18.6965 15.3028L17 16.8296" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><path opacity="0.5" d="M13.9868 5L10.0132 19.8297" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><path d="M7.00005 7.82959L5.30358 9.35641C3.76102 10.7447 2.98975 11.4389 2.98975 12.3296C2.98975 13.2203 3.76102 13.9145 5.30358 15.3028L7.00005 16.8296" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg> Code </span>',1),G=[z],H=r('<div class="mb-5"><div class="flex justify-center flex-col w-full"><ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto mb-4"><li><button type="button" class="flex justify-center font-semibold p-2 rounded-full transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M13 19L7 12L13 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path opacity="0.5" d="M16.9998 19L10.9998 12L16.9998 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li><li><button type="button" class="flex justify-center font-semibold p-2 rounded-full transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M15 5L9 12L15 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded-full transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 1 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded-full transition bg-primary text-white dark:text-white-light dark:bg-primary"> 2 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded-full transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 3 </button></li><li><button type="button" class="flex justify-center font-semibold p-2 rounded-full transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M9 5L15 12L9 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li><li><button type="button" class="flex justify-center font-semibold p-2 rounded-full transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M11 19L17 12L11 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path opacity="0.5" d="M6.99976 19L12.9998 12L6.99976 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li></ul><ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto"><li><button type="button" class="flex justify-center font-semibold p-2 rounded-full transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M15 5L9 12L15 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded-full transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 1 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded-full transition bg-primary text-white dark:text-white-light dark:bg-primary"> 2 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded-full transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 3 </button></li><li><button type="button" class="flex justify-center font-semibold p-2 rounded-full transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M9 5L15 12L9 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li></ul></div></div>',1),J=t("pre",null,`<!-- with icons rounded -->
<ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto mb-4">
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        p-2
        rounded-full
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        p-2
        rounded-full
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded-full
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      1
    </button>
  </li>
  <li>
    <button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded-full transition bg-primary text-white dark:text-white-light dark:bg-primary">2</button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded-full
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      3
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        p-2
        rounded-full
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        p-2
        rounded-full
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
</ul>

<!-- with icons rounded -->
<ul class="inline-flex items-center space-x-1 rtl:space-x-reverse m-auto">
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        p-2
        rounded-full
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded-full
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      1
    </button>
  </li>
  <li>
    <button type="button" class="flex justify-center font-semibold px-3.5 py-2 rounded-full transition bg-primary text-white dark:text-white-light dark:bg-primary">2</button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        rounded-full
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      3
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        p-2
        rounded-full
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
</ul>
`,-1),K={class:"panel"},O={class:"flex items-center justify-between mb-5"},Q=t("h5",{class:"font-semibold text-lg dark:text-white-light"},"No Spacing",-1),T=r('<span class="flex items-center"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 ltr:mr-2 rtl:ml-2"><path d="M17 7.82959L18.6965 9.35641C20.239 10.7447 21.0103 11.4389 21.0103 12.3296C21.0103 13.2203 20.239 13.9145 18.6965 15.3028L17 16.8296" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><path opacity="0.5" d="M13.9868 5L10.0132 19.8297" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path><path d="M7.00005 7.82959L5.30358 9.35641C3.76102 10.7447 2.98975 11.4389 2.98975 12.3296C2.98975 13.2203 3.76102 13.9145 5.30358 15.3028L7.00005 16.8296" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"></path></svg> Code </span>',1),U=[T],X=r('<div class="mb-5"><div class="flex justify-center flex-col w-full"><ul class="inline-flex items-center m-auto mb-4"><li><button type="button" class="flex justify-center font-semibold ltr:rounded-l-full rtl:rounded-r-full px-3.5 py-2 transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M13 19L7 12L13 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path opacity="0.5" d="M16.9998 19L10.9998 12L16.9998 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M15 5L9 12L15 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 1 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 transition bg-primary text-white dark:text-white-light dark:bg-primary"> 2 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 3 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M9 5L15 12L9 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li><li><button type="button" class="flex justify-center font-semibold ltr:rounded-r-full rtl:rounded-l-full px-3.5 py-2 transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M11 19L17 12L11 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path><path opacity="0.5" d="M6.99976 19L12.9998 12L6.99976 5" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li></ul><ul class="inline-flex items-center m-auto"><li><button type="button" class="flex justify-center font-semibold ltr:rounded-l-full rtl:rounded-r-full px-3.5 py-2 transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M15 5L9 12L15 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 1 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 transition bg-primary text-white dark:text-white-light dark:bg-primary"> 2 </button></li><li><button type="button" class="flex justify-center font-semibold px-3.5 py-2 transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"> 3 </button></li><li><button type="button" class="flex justify-center font-semibold ltr:rounded-r-full rtl:rounded-l-full px-3.5 py-2 transition bg-white-light text-dark hover:text-white hover:bg-primary dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary"><svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" class="w-5 h-5 rtl:rotate-180"><path d="M9 5L15 12L9 19" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path></svg></button></li></ul></div></div>',1),Y=t("pre",null,`<!-- no spacing -->
<ul class="inline-flex items-center m-auto mb-4">
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        ltr:rounded-l-full
        rtl:rounded-r-full
        px-3.5
        py-2
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      1
    </button>
  </li>
  <li>
    <button type="button" class="flex justify-center font-semibold px-3.5 py-2 transition bg-primary text-white dark:text-white-light dark:bg-primary">2</button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      3
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        ltr:rounded-r-full
        rtl:rounded-l-full
        px-3.5
        py-2
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
</ul>

<!-- no spacing -->
<ul class="inline-flex items-center m-auto">
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        ltr:rounded-l-full
        rtl:rounded-r-full
        px-3.5
        py-2
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      1
    </button>
  </li>
  <li>
    <button type="button" class="flex justify-center font-semibold px-3.5 py-2 transition bg-primary text-white dark:text-white-light dark:bg-primary">2</button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        px-3.5
        py-2
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      3
    </button>
  </li>
  <li>
    <button
      type="button"
      class="
        flex
        justify-center
        font-semibold
        ltr:rounded-r-full
        rtl:rounded-l-full
        px-3.5
        py-2
        transition
        bg-white-light
        text-dark
        hover:text-white hover:bg-primary
        dark:text-white-light dark:bg-[#191e3a] dark:hover:bg-primary
      "
    >
      <svg> ... </svg>
    </button>
  </li>
</ul>
`,-1),ot=g({__name:"pagination",setup(Z){p({title:"Pagination"});const{codeArr:o,toggleCode:a}=u();return(tt,e)=>(i(),x("div",null,[y,t("div",k,[t("div",c,[t("div",w,[m,t("a",{class:"font-semibold hover:text-gray-400 dark:text-gray-400 dark:hover:text-gray-600",href:"javascript:;",onClick:e[0]||(e[0]=b=>n(a)("code1"))},v)]),j,n(o).includes("code1")?(i(),s(l,{key:0},{default:d(()=>[_]),_:1})):h("",!0)]),t("div",L,[t("div",C,[M,t("a",{class:"font-semibold hover:text-gray-400 dark:text-gray-400 dark:hover:text-gray-600",href:"javascript:;",onClick:e[1]||(e[1]=b=>n(a)("code2"))},N)]),P,n(o).includes("code2")?(i(),s(l,{key:0},{default:d(()=>[$]),_:1})):h("",!0)]),t("div",F,[t("div",S,[V,t("a",{class:"font-semibold hover:text-gray-400 dark:text-gray-400 dark:hover:text-gray-600",href:"javascript:;",onClick:e[2]||(e[2]=b=>n(a)("code3"))},I)]),W,n(o).includes("code3")?(i(),s(l,{key:0},{default:d(()=>[A]),_:1})):h("",!0)]),t("div",D,[t("div",R,[q,t("a",{class:"font-semibold hover:text-gray-400 dark:text-gray-400 dark:hover:text-gray-600",href:"javascript:;",onClick:e[3]||(e[3]=b=>n(a)("code4"))},G)]),H,n(o).includes("code4")?(i(),s(l,{key:0},{default:d(()=>[J]),_:1})):h("",!0)]),t("div",K,[t("div",O,[Q,t("a",{class:"font-semibold hover:text-gray-400 dark:text-gray-400 dark:hover:text-gray-600",href:"javascript:;",onClick:e[4]||(e[4]=b=>n(a)("code5"))},U)]),X,n(o).includes("code5")?(i(),s(l,{key:0},{default:d(()=>[Y]),_:1})):h("",!0)])])]))}});export{ot as default};
