Pagination item 

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

      
  •           <div class="i-pagination__wrapper ">

			<a href="#" 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 href="#" class="i-pagination  --active">
			<span>2</span>
		</a>
	</div>

Pagination select item

  • 50 51 52 53 54 55 56 
  •         {% 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 options">

			<label class="i-pagination" for="idecko">...</label>
		<div class="form-control i-pagination__select" id="idecko">
							<a href="#">50</a>
							<a href="#">51</a>
							<a href="#">52</a>
							<a href="#">53</a>
							<a href="#">54</a>
							<a href="#">55</a>
							<a href="#">56</a>
					</div>
	</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"
      }
    }
  }
}