Pagination item 

  •         {% include "@Components/items/pagination-item/pagination-item.twig" with {
    props: {
      page:"1"
    }
  }
%}

      
  •           <div class="i-pagination__wrapper">

  <a class="i-pagination">

          <span>
        1
      </span>
    
  </a>

  </div>

Pagination active item 

  •         {% include "@Components/items/pagination-item/pagination-item.twig" with {
    props: {
      page: "2",
      state: "active"
    }
  }
%}

      
  •           <div class="i-pagination__wrapper">

  <a class="i-pagination  --active">

          <span>
        2
      </span>
    
  </a>

  </div>

Pagination select item 

  •         {% include "@Components/items/pagination-item/pagination-item.twig" with {
    props: {
      label: "...",
      id: "idecko",
      tag: "select",
      options:[
      {
        page: "50",
        value:"#"
      },
      {
        page: "51",
        value:"#"
      },
      {
        page: "52",
        value:"#"
      },
      {
        page: "53",
        value:"#"
      },
      {
        page: "54",
        value:"#"
      },
      {
        page: "55",
        value:"#"
      },
      {
        page: "56",
        value:"#"
      }]
    }
  }
%}

      
  •               <div class="i-pagination__wrapper">

  <select class="form-control i-pagination__select" id="idecko" name="choices-single-no-sorting">

                  <option value="#">50</option>
              <option value="#">51</option>
              <option value="#">52</option>
              <option value="#">53</option>
              <option value="#">54</option>
              <option value="#">55</option>
              <option value="#">56</option>
      
    
  </select>

      <label class="i-pagination" for="idecko">...</label>
  </div>

Schema 

    {
  "props": {
    "page": {
      "type": "number",
      "description": "Number of page"
    },
    "href": {
      "type": "string",
      "description": "Url adress(default # if tag is a)"
    },
    "state": {
      "type": "string",
      "description": "active | undefined"
    },
    "label": {
      "type": "string",
      "description": "Label of select"
    },
    "id": {
      "type": "string",
      "description": "id of item"
    },
    "tag": {
      "type": "string",
      "description": "select | a(default)"
    },
    "options": {
      "type": "array of objects",
      "page": {
        "type": "number",
        "description": "Number of page"
      },
      "value":{
        "type": "number",
        "description": "Url adress"
      }
    }
  }
}