@warp-ds/elements 2.10.0-next.15 → 2.10.0-next.17

package/dist/packages/pagination/pagination.js

@@ -7,303 +7,308 @@ ICU features such as interpolation and plurals will not work properly for that m
 
 Please compile your catalog first. 
 `)),g(l)&&H.test(l)?J(l):g(l)?l:we(l,this._locale,this._locales)(r,o?.formats)}date(e,r){return D(this._locales||this._locale,e,r)}number(e,r){return M(this._locales||this._locale,e,r)}};function Pe(t={}){return new F(t)}var c=Pe();import{css as Re,html as f,LitElement as Xe,nothing as T}from"lit";import{property as P}from"lit/decorators.js";import{html as Ee,LitElement as $e}from"lit";import{property as j,state as Le}from"lit/decorators.js";import{classMap as Me}from"lit/directives/class-map.js";import{css as Se}from"lit";var K=Se`
-:host {
-  display: inline-block;
-}
-.w-icon {
-  --_w-icon-size: var(--w-icon-size, 24px);
-  height: var(--_w-icon-size);
-  width: var(--_w-icon-size);
-  display: flex;
-}
-.w-icon svg {
-  pointer-events: none;
-  height: var(--_w-icon-size);
-  width: var(--_w-icon-size);
-}
-.w-icon--s {
-  --w-icon-size: 16px;
-}
-.w-icon--m {
-  --w-icon-size: 24px;
-}
-.w-icon--l {
-  --w-icon-size: 32px;
-}
-
-`;var Y=new Map,Ne='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function Fe(t,e={}){let r=e.responseParser??(o=>o.text());return Y.has(t)||Y.set(t,fetch(t).then(r)),Y.get(t)}var p=class extends $e{constructor(){super(...arguments);this.locale=document.documentElement.lang||"en";this.svg=null}async fetchIcon(r){let o=`https://assets.finn.no/pkg/eikons/~1/${this.locale}/${r}.svg`;try{let a=await Fe(o);return new DOMParser().parseFromString(a,"text/html").body.querySelector("svg")}catch{return null}}firstUpdated(){this.loadIcon()}updated(r){(r.has("name")||r.has("locale"))&&this.loadIcon()}async loadIcon(){if(!this.name){this.svg=null;return}let r=await this.fetchIcon(this.name);r||(r=new DOMParser().parseFromString(Ne,"text/html").body.firstElementChild),this.svg=r}render(){let r=this.size||"medium",o=this.name||"",a={"w-icon":!0,"w-icon--s":r==="small","w-icon--m":r==="medium","w-icon--l":r==="large"},s=typeof r=="string"&&r.endsWith("px")?`--w-icon-size: ${r};`:"";return Ee`<div class="${Me(a)}" style="${s}" part="w-${o.toLowerCase()}">${this.svg}</div>`}};p.styles=[K],d([j({type:String,reflect:!0})],p.prototype,"name",2),d([j({type:String,reflect:!0})],p.prototype,"size",2),d([j({type:String,reflect:!0,useDefault:!0})],p.prototype,"locale",2),d([Le()],p.prototype,"svg",2);customElements.get("w-icon")||customElements.define("w-icon",p);var Ce=["en","nb","fi","da","sv"],O="en",z=t=>Ce.find(e=>t===e||t.toLowerCase().includes(e))||O;function v(){if(typeof window>"u"){let t=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return z(t)}try{let t=W(document);if(t)return z(t);let e=Oe();if(e)return z(e);let r=W(oe());return r?z(r):O}catch(t){return console.warn("could not detect locale, falling back to source locale",t),O}}var ee=(t,e,r,o,a)=>{c.load("en",t),c.load("nb",e),c.load("fi",r),c.load("da",o),c.load("sv",a);let s=v();c.activate(s),re(),je()},De="warp-i18n-change";function re(){typeof window>"u"||window.dispatchEvent(new Event(De))}var Q=!1;function je(){if(Q||typeof window>"u"||!document?.documentElement)return;Q=!0;let t=()=>{let a=v();c.locale!==a&&(c.activate(a),re())},e=new MutationObserver(a=>{for(let s of a)if(s.type==="attributes"&&s.attributeName==="lang"){t();break}});e.observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});let r=oe();r&&r.documentElement&&r!==document&&e.observe(r.documentElement,{attributes:!0,attributeFilter:["lang"]});let o=Ye();o&&e.observe(o,{attributes:!0,attributeFilter:["lang"]})}function oe(){try{return window.parent?.document??null}catch{return null}}function W(t){try{return t?.documentElement?.lang??""}catch{return""}}function Ye(){try{return window.frameElement??null}catch{return null}}function Oe(){try{return window.frameElement?.getAttribute?.("lang")??""}catch{return""}}import{css as Te}from"lit";import{unsafeCSS as Ae}from"lit";var te=Te`
-  *,
-  :before,
-  :after {
-    box-sizing: border-box;
-    border-style: solid;
-    border-width: 0;
-    border-color: var(--w-s-color-border);
-  }
-  html {
-    font-size: 62.5%;
-  }
-  body {
-    background-color: var(--w-s-color-background);
-    min-height: 100%;
-    margin: 0;
-    overflow-y: scroll;
-  }
-  body,
-  :host {
-    -webkit-text-size-adjust: 100%;
-    tab-size: 4;
-    -webkit-tap-highlight-color: transparent;
-    font-family: var(--w-font-family);
-    font-size: var(--w-font-size-m);
-    line-height: var(--w-line-height-m);
-    color: var(--w-s-color-text);
-  }
-  hr {
-    color: inherit;
-    border-top-width: 1px;
-    height: 0;
-  }
-  abbr:where([title]) {
-    -webkit-text-decoration: underline dotted;
-    text-decoration: underline dotted;
-  }
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    font-size: inherit;
-    font-weight: 700;
-  }
-  a {
-    cursor: pointer;
-    color: var(--w-s-color-text-link);
-    text-decoration: none;
-  }
-  a:hover,
-  a:focus,
-  a:active {
-    text-decoration: underline;
-  }
-  a:focus-visible {
-    outline: 2px solid var(--w-s-color-border-focus);
-    outline-offset: 1px;
-  }
-  b,
-  strong {
-    font-weight: 700;
-  }
-  code,
-  kbd,
-  samp,
-  pre {
-    font-family:
-      ui-monospace,
-      SFMono-Regular,
-      Menlo,
-      Monaco,
-      Consolas,
-      Liberation Mono,
-      Courier New,
-      monospace;
-    font-size: 1em;
-  }
-  sub,
-  sup {
-    vertical-align: baseline;
-    font-size: 75%;
-    line-height: 0;
-    position: relative;
-  }
-  sub {
-    bottom: -0.25em;
-  }
-  sup {
-    top: -0.5em;
-  }
-  table {
-    text-indent: 0;
-    border-color: inherit;
-    border-collapse: collapse;
-  }
-  button,
-  input,
-  optgroup,
-  select,
-  textarea {
-    font-family: inherit;
-    font-size: 100%;
-    font-weight: inherit;
-    line-height: inherit;
-    color: inherit;
-    margin: 0;
-    padding: 0;
-  }
-  button,
-  select {
-    text-transform: none;
-  }
-  button,
-  [type='button'],
-  [type='reset'],
-  [type='submit'] {
-    -webkit-appearance: button;
-  }
-  :-moz-focusring {
-    outline: auto;
-  }
-  :-moz-ui-invalid {
-    box-shadow: none;
-  }
-  progress {
-    vertical-align: baseline;
-  }
-  ::-webkit-inner-spin-button {
-    height: auto;
-  }
-  ::-webkit-outer-spin-button {
-    height: auto;
-  }
-  [type='search'] {
-    -webkit-appearance: textfield;
-    outline-offset: -2px;
-  }
-  ::-webkit-search-decoration {
-    -webkit-appearance: none;
-  }
-  ::-webkit-file-upload-button {
-    -webkit-appearance: button;
-    font: inherit;
-  }
-  summary {
-    display: list-item;
-  }
-  blockquote,
-  dl,
-  dd,
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6,
-  hr,
-  figure,
-  p,
-  pre {
-    margin: 0;
-  }
-  fieldset {
-    margin: 0;
-    padding: 0;
-  }
-  legend {
-    padding: 0;
-  }
-  ol,
-  ul,
-  menu {
-    margin: 0;
-    padding: 0;
-    list-style: none;
-  }
-  textarea {
-    resize: vertical;
-  }
-  input::placeholder,
-  textarea::placeholder {
-    opacity: 1;
-    color: var(--w-s-color-text-placeholder);
-  }
-  button,
-  [role='button'] {
-    cursor: pointer;
-  }
-  :disabled {
-    cursor: default;
-  }
-  img,
-  svg,
-  video,
-  canvas,
-  audio,
-  iframe,
-  embed,
-  object {
-    vertical-align: middle;
-    display: block;
-  }
-  img,
-  video {
-    max-width: 100%;
-    height: auto;
-  }
-  h1 {
-    font-size: var(--w-font-size-xxl);
-    line-height: var(--w-line-height-xxl);
-  }
-  h2 {
-    font-size: var(--w-font-size-xl);
-    line-height: var(--w-line-height-xl);
-  }
-  h3 {
-    font-size: var(--w-font-size-l);
-    line-height: var(--w-line-height-l);
-  }
-  h4 {
-    font-size: var(--w-font-size-m);
-    line-height: var(--w-line-height-m);
-  }
-  h5 {
-    font-size: var(--w-font-size-s);
-    line-height: var(--w-line-height-s);
-  }
-  dt,
-  dd {
-    margin: 0 16px;
-  }
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  ul,
-  ol,
-  dl,
-  p,
-  blockquote {
-    margin: 0 0 8px;
-  }
-  [hidden] {
-    display: none !important;
-  }
-  [tabindex='-1']:focus:not(:focus-visible) {
-    outline: none;
-  }
-  legend {
-    float: left;
-    width: 100%;
-    margin: 0;
-    padding: 0;
-    display: table;
-  }
-  legend + * {
-    clear: both;
-  }
-  fieldset {
-    border: 0;
-    min-width: 0;
-    margin: 0;
-    padding: 0.01em 0 0;
-  }
-  body:not(:-moz-handler-blocked) fieldset {
-    display: table-cell;
-  }
-  svg {
-    pointer-events: none;
-  }
+	:host {
+		display: inline-block;
+	}
+	.w-icon {
+		--_w-icon-size: var(--w-icon-size, 24px);
+		height: var(--_w-icon-size);
+		width: var(--_w-icon-size);
+		display: flex;
+	}
+	.w-icon svg {
+		pointer-events: none;
+		height: var(--_w-icon-size);
+		width: var(--_w-icon-size);
+	}
+	.w-icon--s {
+		--w-icon-size: 16px;
+	}
+	.w-icon--m {
+		--w-icon-size: 24px;
+	}
+	.w-icon--l {
+		--w-icon-size: 32px;
+	}
+`;var Y=new Map,Ne='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function Fe(t,e={}){let r=e.responseParser??(o=>o.text());return Y.has(t)||Y.set(t,fetch(t).then(r)),Y.get(t)}var p=class extends $e{constructor(){super(...arguments);this.locale=document.documentElement.lang||"en";this.svg=null}async fetchIcon(r){let o=`https://assets.finn.no/pkg/eikons/~1/${this.locale}/${r}.svg`;try{let a=await Fe(o);return new DOMParser().parseFromString(a,"text/html").body.querySelector("svg")}catch{return null}}firstUpdated(){this.loadIcon()}updated(r){(r.has("name")||r.has("locale"))&&this.loadIcon()}async loadIcon(){if(!this.name){this.svg=null;return}let r=await this.fetchIcon(this.name);r||(r=new DOMParser().parseFromString(Ne,"text/html").body.firstElementChild),this.svg=r}render(){let r=this.size||"medium",o=this.name||"",a={"w-icon":!0,"w-icon--s":r==="small","w-icon--m":r==="medium","w-icon--l":r==="large"},s=typeof r=="string"&&r.endsWith("px")?`--w-icon-size: ${r};`:"";return Ee`<div
+			class="${Me(a)}"
+			style="${s}"
+			part="w-${o.toLowerCase()}"
+		>
+			${this.svg}
+		</div>`}};p.styles=[K],d([j({type:String,reflect:!0})],p.prototype,"name",2),d([j({type:String,reflect:!0})],p.prototype,"size",2),d([j({type:String,reflect:!0,useDefault:!0})],p.prototype,"locale",2),d([Le()],p.prototype,"svg",2);customElements.get("w-icon")||customElements.define("w-icon",p);var Ce=["en","nb","fi","da","sv"],O="en",z=t=>Ce.find(e=>t===e||t.toLowerCase().includes(e))||O;function v(){if(typeof window>"u"){let t=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return z(t)}try{let t=W(document);if(t)return z(t);let e=Oe();if(e)return z(e);let r=W(oe());return r?z(r):O}catch(t){return console.warn("could not detect locale, falling back to source locale",t),O}}var ee=(t,e,r,o,a)=>{c.load("en",t),c.load("nb",e),c.load("fi",r),c.load("da",o),c.load("sv",a);let s=v();c.activate(s),re(),je()},De="warp-i18n-change";function re(){typeof window>"u"||window.dispatchEvent(new Event(De))}var Q=!1;function je(){if(Q||typeof window>"u"||!document?.documentElement)return;Q=!0;let t=()=>{let a=v();c.locale!==a&&(c.activate(a),re())},e=new MutationObserver(a=>{for(let s of a)if(s.type==="attributes"&&s.attributeName==="lang"){t();break}});e.observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});let r=oe();r&&r.documentElement&&r!==document&&e.observe(r.documentElement,{attributes:!0,attributeFilter:["lang"]});let o=Ye();o&&e.observe(o,{attributes:!0,attributeFilter:["lang"]})}function oe(){try{return window.parent?.document??null}catch{return null}}function W(t){try{return t?.documentElement?.lang??""}catch{return""}}function Ye(){try{return window.frameElement??null}catch{return null}}function Oe(){try{return window.frameElement?.getAttribute?.("lang")??""}catch{return""}}import{css as Te}from"lit";import{unsafeCSS as Ae}from"lit";var te=Te`
+	*,
+	:before,
+	:after {
+		box-sizing: border-box;
+		border-style: solid;
+		border-width: 0;
+		border-color: var(--w-s-color-border);
+	}
+	html {
+		font-size: 62.5%;
+	}
+	body {
+		background-color: var(--w-s-color-background);
+		min-height: 100%;
+		margin: 0;
+		overflow-y: scroll;
+	}
+	body,
+	:host {
+		-webkit-text-size-adjust: 100%;
+		tab-size: 4;
+		-webkit-tap-highlight-color: transparent;
+		font-family: var(--w-font-family);
+		font-size: var(--w-font-size-m);
+		line-height: var(--w-line-height-m);
+		color: var(--w-s-color-text);
+	}
+	hr {
+		color: inherit;
+		border-top-width: 1px;
+		height: 0;
+	}
+	abbr:where([title]) {
+		-webkit-text-decoration: underline dotted;
+		text-decoration: underline dotted;
+	}
+	h1,
+	h2,
+	h3,
+	h4,
+	h5,
+	h6 {
+		font-size: inherit;
+		font-weight: 700;
+	}
+	a {
+		cursor: pointer;
+		color: var(--w-s-color-text-link);
+		text-decoration: none;
+	}
+	a:hover,
+	a:focus,
+	a:active {
+		text-decoration: underline;
+	}
+	a:focus-visible {
+		outline: 2px solid var(--w-s-color-border-focus);
+		outline-offset: 1px;
+	}
+	b,
+	strong {
+		font-weight: 700;
+	}
+	code,
+	kbd,
+	samp,
+	pre {
+		font-family:
+			ui-monospace,
+			SFMono-Regular,
+			Menlo,
+			Monaco,
+			Consolas,
+			Liberation Mono,
+			Courier New,
+			monospace;
+		font-size: 1em;
+	}
+	sub,
+	sup {
+		vertical-align: baseline;
+		font-size: 75%;
+		line-height: 0;
+		position: relative;
+	}
+	sub {
+		bottom: -0.25em;
+	}
+	sup {
+		top: -0.5em;
+	}
+	table {
+		text-indent: 0;
+		border-color: inherit;
+		border-collapse: collapse;
+	}
+	button,
+	input,
+	optgroup,
+	select,
+	textarea {
+		font-family: inherit;
+		font-size: 100%;
+		font-weight: inherit;
+		line-height: inherit;
+		color: inherit;
+		margin: 0;
+		padding: 0;
+	}
+	button,
+	select {
+		text-transform: none;
+	}
+	button,
+	[type="button"],
+	[type="reset"],
+	[type="submit"] {
+		-webkit-appearance: button;
+	}
+	:-moz-focusring {
+		outline: auto;
+	}
+	:-moz-ui-invalid {
+		box-shadow: none;
+	}
+	progress {
+		vertical-align: baseline;
+	}
+	::-webkit-inner-spin-button {
+		height: auto;
+	}
+	::-webkit-outer-spin-button {
+		height: auto;
+	}
+	[type="search"] {
+		-webkit-appearance: textfield;
+		outline-offset: -2px;
+	}
+	::-webkit-search-decoration {
+		-webkit-appearance: none;
+	}
+	::-webkit-file-upload-button {
+		-webkit-appearance: button;
+		font: inherit;
+	}
+	summary {
+		display: list-item;
+	}
+	blockquote,
+	dl,
+	dd,
+	h1,
+	h2,
+	h3,
+	h4,
+	h5,
+	h6,
+	hr,
+	figure,
+	p,
+	pre {
+		margin: 0;
+	}
+	fieldset {
+		margin: 0;
+		padding: 0;
+	}
+	legend {
+		padding: 0;
+	}
+	ol,
+	ul,
+	menu {
+		margin: 0;
+		padding: 0;
+		list-style: none;
+	}
+	textarea {
+		resize: vertical;
+	}
+	input::placeholder,
+	textarea::placeholder {
+		opacity: 1;
+		color: var(--w-s-color-text-placeholder);
+	}
+	button,
+	[role="button"] {
+		cursor: pointer;
+	}
+	:disabled {
+		cursor: default;
+	}
+	img,
+	svg,
+	video,
+	canvas,
+	audio,
+	iframe,
+	embed,
+	object {
+		vertical-align: middle;
+		display: block;
+	}
+	img,
+	video {
+		max-width: 100%;
+		height: auto;
+	}
+	h1 {
+		font-size: var(--w-font-size-xxl);
+		line-height: var(--w-line-height-xxl);
+	}
+	h2 {
+		font-size: var(--w-font-size-xl);
+		line-height: var(--w-line-height-xl);
+	}
+	h3 {
+		font-size: var(--w-font-size-l);
+		line-height: var(--w-line-height-l);
+	}
+	h4 {
+		font-size: var(--w-font-size-m);
+		line-height: var(--w-line-height-m);
+	}
+	h5 {
+		font-size: var(--w-font-size-s);
+		line-height: var(--w-line-height-s);
+	}
+	dt,
+	dd {
+		margin: 0 16px;
+	}
+	h1,
+	h2,
+	h3,
+	h4,
+	h5,
+	ul,
+	ol,
+	dl,
+	p,
+	blockquote {
+		margin: 0 0 8px;
+	}
+	[hidden] {
+		display: none !important;
+	}
+	[tabindex="-1"]:focus:not(:focus-visible) {
+		outline: none;
+	}
+	legend {
+		float: left;
+		width: 100%;
+		margin: 0;
+		padding: 0;
+		display: table;
+	}
+	legend + * {
+		clear: both;
+	}
+	fieldset {
+		border: 0;
+		min-width: 0;
+		margin: 0;
+		padding: 0.01em 0 0;
+	}
+	body:not(:-moz-handler-blocked) fieldset {
+		display: table-cell;
+	}
+	svg {
+		pointer-events: none;
+	}
 `,ir=Ae(`*, :before, :after {
             --w-rotate: 0;
             --w-rotate-x: 0;
@@ -2470,56 +2475,82 @@ Please compile your catalog first.
                     display: none
                 }
             }
-        `);var ae=JSON.parse('{"pagination.aria.first-page":["F\xF8rste side"],"pagination.aria.icon-suffix":["ikon"],"pagination.aria.next-page":["N\xE6ste side"],"pagination.aria.page":["Side ",["currentPage"]],"pagination.aria.pagination":["Sider"],"pagination.aria.prev-page":["Forrige side"],"pagination.label.current-page":["Side ",["currentPage"]]}');var ie=JSON.parse('{"pagination.aria.first-page":["First page"],"pagination.aria.icon-suffix":["icon"],"pagination.aria.next-page":["Next page"],"pagination.aria.page":["Page ",["currentPage"]],"pagination.aria.pagination":["Pages"],"pagination.aria.prev-page":["Previous page"],"pagination.label.current-page":["Page ",["currentPage"]]}');var ne=JSON.parse('{"pagination.aria.first-page":["Ensimm\xE4inen sivu"],"pagination.aria.icon-suffix":["kuvake"],"pagination.aria.next-page":["Seuraava sivu"],"pagination.aria.page":["Sivu ",["currentPage"]],"pagination.aria.pagination":["Sivut"],"pagination.aria.prev-page":["Edellinen sivu"],"pagination.label.current-page":["Sivu ",["currentPage"]]}');var se=JSON.parse('{"pagination.aria.first-page":["F\xF8rste side"],"pagination.aria.icon-suffix":["ikon"],"pagination.aria.next-page":["Neste side"],"pagination.aria.page":["Side ",["currentPage"]],"pagination.aria.pagination":["Sider"],"pagination.aria.prev-page":["Forrige side"],"pagination.label.current-page":["Side ",["currentPage"]]}');var le=JSON.parse('{"pagination.aria.first-page":["F\xF6rsta sidan"],"pagination.aria.icon-suffix":["ikon"],"pagination.aria.next-page":["N\xE4sta sida"],"pagination.aria.page":["Sida ",["currentPage"]],"pagination.aria.pagination":["Sidor"],"pagination.aria.prev-page":["F\xF6reg\xE5ende sida"],"pagination.label.current-page":["Sida ",["currentPage"]]}');import{unsafeCSS as Ie}from"lit";var ce=Ie("*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.hover\\:bg-clip-padding:hover{-webkit-background-clip:padding-box;background-clip:padding-box}.hover\\:bg-\\[--w-color-button-pill-background-hover\\]:hover{background-color:var(--w-color-button-pill-background-hover)}.active\\:bg-\\[--w-color-button-pill-background-active\\]:active{background-color:var(--w-color-button-pill-background-active)}.border-0{border-width:0}.rounded-full{border-radius:9999px}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.hover\\:no-underline:hover,.focus\\:no-underline:focus{text-decoration:none}.focusable:focus{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:focus-visible{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:not(:focus-visible){outline:none}.items-center{align-items:center}.justify-center{justify-content:center}.static{position:static}.s-bg-primary{background-color:var(--w-s-color-background-primary)}.s-text-inverted{color:var(--w-s-color-text-inverted)}.s-text-link{color:var(--w-s-color-text-link)}.s-icon{color:var(--w-s-color-icon)}.min-h-\\[44px\\]{min-height:44px}.min-w-\\[44px\\]{min-width:44px}.p-4{padding:.4rem}.p-8{padding:.8rem}.visible{visibility:visible}.font-bold{font-weight:700}.pointer-events-none{pointer-events:none}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}@media (min-width:768px){.md\\:block{display:block}.md\\:hidden{display:none}}");var A=()=>c._({id:"pagination.aria.icon-suffix",message:"icon",comment:"Suffix added at the end of icon titles when img semantics are lost on an html element"}),S="hover:no-underline focus:no-underline focusable inline-flex justify-center items-center transition-colors ease-in-out min-h-[44px] min-w-[44px] p-4 rounded-full border-0 hover:bg-clip-padding",E,de,b=class extends Xe{constructor(){super();Z(this,E);this.pages=0;this.currentPageNumber=1;this.visiblePages=7;ee(ie,se,ne,ae,le)}get shouldShowShowFirstPageButton(){return this.currentPageNumber-2>0}get shouldShowPreviousPageButton(){return this.currentPageNumber-1>0}get shouldShowNextPageButton(){return this.currentPageNumber<this.pages}get currentPageIndex(){return this.currentPageNumber-1}get visiblePageNumbers(){if(this.pages<=this.visiblePages)return Array.from({length:this.pages},(s,i)=>i+1);let r=Math.floor(this.visiblePages/2),o=Math.max(1,this.currentPageNumber-r),a=Math.min(this.pages,o+this.visiblePages-1);return a-o+1<this.visiblePages&&(o=Math.max(1,a-this.visiblePages+1)),Array.from({length:a-o+1},(s,i)=>o+i)}render(){let r=this.visiblePageNumbers;return f`<nav class="flex items-center justify-center p-8" @click="${U(this,E,de)}">
-      <h1 class="sr-only">
-        ${c._({id:"pagination.aria.pagination",message:"Pages",comment:"Default screenreader message for pagination container in the pagination component"})}
-      </h1>
-      <div class="flex items-center s-text-link">
-        ${this.shouldShowShowFirstPageButton?f`<a
-              data-page-number="1"
-              href="${this.baseUrl}1"
-              class="${S+" s-icon hover:bg-[--w-color-button-pill-background-hover] active:bg-[--w-color-button-pill-background-active]"}">
-              <span class="sr-only"
-                >${c._({id:"pagination.aria.first-page",message:"First page",comment:"Default screenreader message for first page link in the pagination component"})},</span
-              >
-              <w-icon name="ChevronDoubleLeft" size="small" locale="${v()}" class="pointer-events-none flex items-center" class="flex"></w-icon>
-              <span class="sr-only">${A()}</span>
-            </a>`:T}
-        ${this.shouldShowPreviousPageButton?f`<a
-              data-page-number="${this.currentPageNumber-1}"
-              href="${this.baseUrl}${this.currentPageNumber-1}"
-              class="${S+" s-icon hover:bg-[--w-color-button-pill-background-hover] active:bg-[--w-color-button-pill-background-active]"}">
-              <span class="sr-only"
-                >${c._({id:"pagination.aria.prev-page",message:"Previous page",comment:"Default screenreader message for previous page link in the pagination component"})},</span
-              >
-              <w-icon name="ChevronLeft" size="small" locale="${v()}" class="pointer-events-none flex items-center" class="flex"></w-icon>
-              <span class="sr-only">${A()}</span>
-            </a>`:T}
-        <div class="hidden md:block">
-          ${r.map(o=>{let a=o===this.currentPageNumber,s=`${this.baseUrl}${o}`,i=S;a?i+=" s-bg-primary s-text-inverted":i+=" hover:bg-[--w-color-button-pill-background-hover] active:bg-[--w-color-button-pill-background-active]";let n=c._({id:"pagination.aria.page",message:"Page {currentPage}",values:{currentPage:o},comment:"Default screenreader message for page link in the pagination component"});return f`<a
-              data-page-number="${o}"
-              aria-label="${n}"
-              href="${s}"
-              class="${i}"
-              aria-current="${a?"page":""}"
-              >${o}</a
-            >`})}
-        </div>
-        <span class="block md:hidden p-8 font-bold">${c._({id:"pagination.label.current-page",message:"Page {currentPage}",values:{currentPage:this.currentPageNumber},comment:"Default message for current page label in the pagination component"})}</span>
-        ${this.shouldShowNextPageButton?f`<a
-              data-page-number="${this.currentPageNumber+1}"
-              href="${this.baseUrl}${this.currentPageNumber+1}"
-              class="${S+" s-icon hover:bg-[--w-color-button-pill-background-hover] active:bg-[--w-color-button-pill-background-active]"}">
-              <span class="sr-only">
-                ${c._({id:"pagination.aria.next-page",message:"Next page",comment:"Default screenreader message for next page link in the pagination component"})},</span
-              >
-              <w-icon name="ChevronRight" size="small" locale="${v()}" class="pointer-events-none flex items-center" class="flex"></w-icon>
-              <span class="sr-only">${A()}</span>
-            </a>`:T}
-      </div>
-    </nav>`}};E=new WeakSet,de=function(r){let o=r.target.getAttribute("data-page-number");this.dispatchEvent(new CustomEvent("page-click",{detail:{clickedPage:o},bubbles:!0,composed:!0}))},b.styles=[te,ce,Re`
-      w-icon {
-        height: 16px;
-      }
-    `],d([P({type:String,reflect:!0,attribute:"base-url"})],b.prototype,"baseUrl",2),d([P({type:Number,reflect:!0,useDefault:!0})],b.prototype,"pages",2),d([P({type:Number,reflect:!0,attribute:"current-page",useDefault:!0})],b.prototype,"currentPageNumber",2),d([P({type:Number,reflect:!0,attribute:"visible-pages",useDefault:!0})],b.prototype,"visiblePages",2);customElements.get("w-pagination")||customElements.define("w-pagination",b);export{b as WarpPagination};
+        `);var ae=JSON.parse('{"pagination.aria.first-page":["F\xF8rste side"],"pagination.aria.icon-suffix":["ikon"],"pagination.aria.next-page":["N\xE6ste side"],"pagination.aria.page":["Side ",["currentPage"]],"pagination.aria.pagination":["Sider"],"pagination.aria.prev-page":["Forrige side"],"pagination.label.current-page":["Side ",["currentPage"]]}');var ie=JSON.parse('{"pagination.aria.first-page":["First page"],"pagination.aria.icon-suffix":["icon"],"pagination.aria.next-page":["Next page"],"pagination.aria.page":["Page ",["currentPage"]],"pagination.aria.pagination":["Pages"],"pagination.aria.prev-page":["Previous page"],"pagination.label.current-page":["Page ",["currentPage"]]}');var ne=JSON.parse('{"pagination.aria.first-page":["Ensimm\xE4inen sivu"],"pagination.aria.icon-suffix":["kuvake"],"pagination.aria.next-page":["Seuraava sivu"],"pagination.aria.page":["Sivu ",["currentPage"]],"pagination.aria.pagination":["Sivut"],"pagination.aria.prev-page":["Edellinen sivu"],"pagination.label.current-page":["Sivu ",["currentPage"]]}');var se=JSON.parse('{"pagination.aria.first-page":["F\xF8rste side"],"pagination.aria.icon-suffix":["ikon"],"pagination.aria.next-page":["Neste side"],"pagination.aria.page":["Side ",["currentPage"]],"pagination.aria.pagination":["Sider"],"pagination.aria.prev-page":["Forrige side"],"pagination.label.current-page":["Side ",["currentPage"]]}');var le=JSON.parse('{"pagination.aria.first-page":["F\xF6rsta sidan"],"pagination.aria.icon-suffix":["ikon"],"pagination.aria.next-page":["N\xE4sta sida"],"pagination.aria.page":["Sida ",["currentPage"]],"pagination.aria.pagination":["Sidor"],"pagination.aria.prev-page":["F\xF6reg\xE5ende sida"],"pagination.label.current-page":["Sida ",["currentPage"]]}');import{unsafeCSS as Ie}from"lit";var ce=Ie("*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.hover\\:bg-clip-padding:hover{-webkit-background-clip:padding-box;background-clip:padding-box}.hover\\:bg-\\[--w-color-button-pill-background-hover\\]:hover{background-color:var(--w-color-button-pill-background-hover)}.active\\:bg-\\[--w-color-button-pill-background-active\\]:active{background-color:var(--w-color-button-pill-background-active)}.border-0{border-width:0}.rounded-full{border-radius:9999px}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.hidden{display:none}.hover\\:no-underline:hover,.focus\\:no-underline:focus{text-decoration:none}.focusable:focus{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:focus-visible{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:not(:focus-visible){outline:none}.items-center{align-items:center}.justify-center{justify-content:center}.static{position:static}.s-bg-primary{background-color:var(--w-s-color-background-primary)}.s-text-inverted{color:var(--w-s-color-text-inverted)}.s-text-link{color:var(--w-s-color-text-link)}.s-icon{color:var(--w-s-color-icon)}.min-h-\\[44px\\]{min-height:44px}.min-w-\\[44px\\]{min-width:44px}.p-4{padding:.4rem}.p-8{padding:.8rem}.visible{visibility:visible}.font-bold{font-weight:700}.pointer-events-none{pointer-events:none}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}@media (min-width:768px){.md\\:block{display:block}.md\\:hidden{display:none}}");var A=()=>c._({id:"pagination.aria.icon-suffix",message:"icon",comment:"Suffix added at the end of icon titles when img semantics are lost on an html element"}),S="hover:no-underline focus:no-underline focusable inline-flex justify-center items-center transition-colors ease-in-out min-h-[44px] min-w-[44px] p-4 rounded-full border-0 hover:bg-clip-padding",E,de,b=class extends Xe{constructor(){super();Z(this,E);this.pages=0;this.currentPageNumber=1;this.visiblePages=7;ee(ie,se,ne,ae,le)}get shouldShowShowFirstPageButton(){return this.currentPageNumber-2>0}get shouldShowPreviousPageButton(){return this.currentPageNumber-1>0}get shouldShowNextPageButton(){return this.currentPageNumber<this.pages}get currentPageIndex(){return this.currentPageNumber-1}get visiblePageNumbers(){if(this.pages<=this.visiblePages)return Array.from({length:this.pages},(s,i)=>i+1);let r=Math.floor(this.visiblePages/2),o=Math.max(1,this.currentPageNumber-r),a=Math.min(this.pages,o+this.visiblePages-1);return a-o+1<this.visiblePages&&(o=Math.max(1,a-this.visiblePages+1)),Array.from({length:a-o+1},(s,i)=>o+i)}render(){let r=this.visiblePageNumbers;return f`<nav
+			class="flex items-center justify-center p-8"
+			@click="${U(this,E,de)}"
+		>
+			<h1 class="sr-only">
+				${c._({id:"pagination.aria.pagination",message:"Pages",comment:"Default screenreader message for pagination container in the pagination component"})}
+			</h1>
+			<div class="flex items-center s-text-link">
+				${this.shouldShowShowFirstPageButton?f`<a
+							data-page-number="1"
+							href="${this.baseUrl}1"
+							class="${S+" s-icon hover:bg-[--w-color-button-pill-background-hover] active:bg-[--w-color-button-pill-background-active]"}"
+						>
+							<span class="sr-only"
+								>${c._({id:"pagination.aria.first-page",message:"First page",comment:"Default screenreader message for first page link in the pagination component"})},</span
+							>
+							<w-icon
+								name="ChevronDoubleLeft"
+								size="small"
+								locale="${v()}"
+								class="pointer-events-none flex items-center"
+								class="flex"
+							></w-icon>
+							<span class="sr-only">${A()}</span>
+						</a>`:T}
+				${this.shouldShowPreviousPageButton?f`<a
+							data-page-number="${this.currentPageNumber-1}"
+							href="${this.baseUrl}${this.currentPageNumber-1}"
+							class="${S+" s-icon hover:bg-[--w-color-button-pill-background-hover] active:bg-[--w-color-button-pill-background-active]"}"
+						>
+							<span class="sr-only"
+								>${c._({id:"pagination.aria.prev-page",message:"Previous page",comment:"Default screenreader message for previous page link in the pagination component"})},</span
+							>
+							<w-icon
+								name="ChevronLeft"
+								size="small"
+								locale="${v()}"
+								class="pointer-events-none flex items-center"
+								class="flex"
+							></w-icon>
+							<span class="sr-only">${A()}</span>
+						</a>`:T}
+				<div class="hidden md:block">
+					${r.map(o=>{let a=o===this.currentPageNumber,s=`${this.baseUrl}${o}`,i=S;a?i+=" s-bg-primary s-text-inverted":i+=" hover:bg-[--w-color-button-pill-background-hover] active:bg-[--w-color-button-pill-background-active]";let n=c._({id:"pagination.aria.page",message:"Page {currentPage}",values:{currentPage:o},comment:"Default screenreader message for page link in the pagination component"});return f`<a
+							data-page-number="${o}"
+							aria-label="${n}"
+							href="${s}"
+							class="${i}"
+							aria-current="${a?"page":""}"
+							>${o}</a
+						>`})}
+				</div>
+				<span class="block md:hidden p-8 font-bold"
+					>${c._({id:"pagination.label.current-page",message:"Page {currentPage}",values:{currentPage:this.currentPageNumber},comment:"Default message for current page label in the pagination component"})}</span
+				>
+				${this.shouldShowNextPageButton?f`<a
+							data-page-number="${this.currentPageNumber+1}"
+							href="${this.baseUrl}${this.currentPageNumber+1}"
+							class="${S+" s-icon hover:bg-[--w-color-button-pill-background-hover] active:bg-[--w-color-button-pill-background-active]"}"
+						>
+							<span class="sr-only">
+								${c._({id:"pagination.aria.next-page",message:"Next page",comment:"Default screenreader message for next page link in the pagination component"})},</span
+							>
+							<w-icon
+								name="ChevronRight"
+								size="small"
+								locale="${v()}"
+								class="pointer-events-none flex items-center"
+								class="flex"
+							></w-icon>
+							<span class="sr-only">${A()}</span>
+						</a>`:T}
+			</div>
+		</nav>`}};E=new WeakSet,de=function(r){let o=r.target.getAttribute("data-page-number");this.dispatchEvent(new CustomEvent("page-click",{detail:{clickedPage:o},bubbles:!0,composed:!0}))},b.styles=[te,ce,Re`
+			w-icon {
+				height: 16px;
+			}
+		`],d([P({type:String,reflect:!0,attribute:"base-url"})],b.prototype,"baseUrl",2),d([P({type:Number,reflect:!0,useDefault:!0})],b.prototype,"pages",2),d([P({type:Number,reflect:!0,attribute:"current-page",useDefault:!0})],b.prototype,"currentPageNumber",2),d([P({type:Number,reflect:!0,attribute:"visible-pages",useDefault:!0})],b.prototype,"visiblePages",2);customElements.get("w-pagination")||customElements.define("w-pagination",b);export{b as WarpPagination};
 //# sourceMappingURL=pagination.js.map