scb-wc 0.1.78 → 0.1.80

package/mvc/components/scb-pagination/scb-pagination.js

@@ -1,4 +1,4 @@
-import{_ as x,b as w,g as _,h as p,y as o}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import"../../vendor/md-focus-ring.js";import"../../vendor/icon.js";import{t as l}from"../../vendor/decorate.js";import"../scb-button/scb-button.js";import"../scb-icon-button/scb-icon-button.js";import"../scb-link/scb-link.js";(function(){try{var h=typeof globalThis<"u"?globalThis:window;if(!h.__scb_ce_guard_installed__){h.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(n,a,s){try{customElements.get(n)||t(n,a,s)}catch(g){var e=String(g||"");if(e.indexOf("already been used")===-1&&e.indexOf("NotSupportedError")===-1)throw g}}}}catch{}})();var b,r=(b=class extends x{constructor(...t){super(...t),this.variant="icon-text",this.alignment="start",this.page=1,this.totalPages=0,this.pagingHref="",this.baseUri="",this.paginationAriaLabel="Paginering",this.currentAriaLabel="Nuvarande sida, ",this.pagingNumberAriaLabel="Gå till sida ",this.isNarrow=window.innerWidth<=768,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0,this._onResize=()=>{this.isNarrow=window.innerWidth<=768}}_emitPageChange(t){const n={page:t};this.dispatchEvent(new CustomEvent("page-change",{detail:n,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("pagechange",{detail:n,bubbles:!0,composed:!0}))}_getPagingHref(t){if(!this.pagingHref)return;const n=(this.baseUri||"").trim(),a=n||window.location.href,s=new URL(a,window.location.href),e=this.pagingHref.trim().replace(/^[?&]/,"").split("=")[0];if(e)return s.searchParams.delete(e),s.searchParams.set(e,String(t)),/^https?:\/\//i.test(n)?s.toString():`${s.pathname}${s.search}${s.hash}`}_handlePageSelection(t,n){!this.pagingHref&&n&&n.preventDefault(),this.page=t,this._emitPageChange(t)}_prevPage(t){if(this.page<=1){!this.pagingHref&&t&&t.preventDefault();return}this._handlePageSelection(this.page-1,t)}_nextPage(t){if(this.page>=this.totalPages){!this.pagingHref&&t&&t.preventDefault();return}this._handlePageSelection(this.page+1,t)}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this._onResize),this._onResize()}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("resize",this._onResize)}mapSpacingToken(t){if(t==null)return;const n=String(t).trim();if(n)return/^\d+$/.test(n)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(n,10)))})`:n}__applySpacing(){const t=this.mapSpacingToken(this.spacing),n=this.mapSpacingToken(this.spacingTop)??t,a=this.mapSpacingToken(this.spacingBottom)??t,s=this.mapSpacingToken(this.spacingLeft),e=this.mapSpacingToken(this.spacingRight);n?this.style.setProperty("--scb-pagination-spacing-block-start",n):this.style.removeProperty("--scb-pagination-spacing-block-start"),a?this.style.setProperty("--scb-pagination-spacing-block-end",a):this.style.removeProperty("--scb-pagination-spacing-block-end"),s?this.style.setProperty("--scb-pagination-spacing-inline-start",s):this.style.removeProperty("--scb-pagination-spacing-inline-start"),e?this.style.setProperty("--scb-pagination-spacing-inline-end",e):this.style.removeProperty("--scb-pagination-spacing-inline-end")}firstUpdated(){this.__applySpacing()}updated(t){super.updated(t),(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&this.__applySpacing()}render(){if(this.totalPages===0)return null;const t=this.variant?`${this.variant.toLowerCase()}`:"",n=this.alignment==="center"||this.alignment==="end"?`align-${this.alignment}`:"align-start",a=[],{page:s,totalPages:e}=this,g=window.innerWidth<=768,d=g?1:2,u=this._getPagingHref(Math.max(1,this.page-1)),f=this._getPagingHref(Math.min(this.totalPages,this.page+1)),m=this.pagingHref?this.variant==="icon"?o`<a
+import{h as x,m as w,p,v as o,y as _}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import"../../vendor/icon.js";import{t as l}from"../../vendor/decorate.js";import"../scb-button/scb-button.js";import"../scb-icon-button/scb-icon-button.js";import"../scb-link/scb-link.js";(function(){try{var h=typeof globalThis<"u"?globalThis:window;if(!h.__scb_ce_guard_installed__){h.__scb_ce_guard_installed__=!0;var i=customElements.define.bind(customElements);customElements.define=function(n,a,s){try{customElements.get(n)||i(n,a,s)}catch(g){var e=String(g||"");if(e.indexOf("already been used")===-1&&e.indexOf("NotSupportedError")===-1)throw g}}}}catch{}})();var b,r=(b=class extends x{constructor(...i){super(...i),this.variant="icon-text",this.alignment="start",this.page=1,this.totalPages=0,this.pagingHref="",this.baseUri="",this.paginationAriaLabel="Paginering",this.currentAriaLabel="Nuvarande sida, ",this.pagingNumberAriaLabel="Gå till sida ",this.isNarrow=window.innerWidth<=768,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0,this._onResize=()=>{this.isNarrow=window.innerWidth<=768}}_emitPageChange(i){const n={page:i};this.dispatchEvent(new CustomEvent("page-change",{detail:n,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("pagechange",{detail:n,bubbles:!0,composed:!0}))}_getPagingHref(i){if(!this.pagingHref)return;const n=(this.baseUri||"").trim(),a=n||window.location.href,s=new URL(a,window.location.href),e=this.pagingHref.trim().replace(/^[?&]/,"").split("=")[0];if(e)return s.searchParams.delete(e),s.searchParams.set(e,String(i)),/^https?:\/\//i.test(n)?s.toString():`${s.pathname}${s.search}${s.hash}`}_handlePageSelection(i,n){!this.pagingHref&&n&&n.preventDefault(),this.page=i,this._emitPageChange(i)}_prevPage(i){if(this.page<=1){!this.pagingHref&&i&&i.preventDefault();return}this._handlePageSelection(this.page-1,i)}_nextPage(i){if(this.page>=this.totalPages){!this.pagingHref&&i&&i.preventDefault();return}this._handlePageSelection(this.page+1,i)}connectedCallback(){super.connectedCallback(),window.addEventListener("resize",this._onResize),this._onResize()}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("resize",this._onResize)}mapSpacingToken(i){if(i==null)return;const n=String(i).trim();if(n)return/^\d+$/.test(n)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(n,10)))})`:n}__applySpacing(){const i=this.mapSpacingToken(this.spacing),n=this.mapSpacingToken(this.spacingTop)??i,a=this.mapSpacingToken(this.spacingBottom)??i,s=this.mapSpacingToken(this.spacingLeft),e=this.mapSpacingToken(this.spacingRight);n?this.style.setProperty("--scb-pagination-spacing-block-start",n):this.style.removeProperty("--scb-pagination-spacing-block-start"),a?this.style.setProperty("--scb-pagination-spacing-block-end",a):this.style.removeProperty("--scb-pagination-spacing-block-end"),s?this.style.setProperty("--scb-pagination-spacing-inline-start",s):this.style.removeProperty("--scb-pagination-spacing-inline-start"),e?this.style.setProperty("--scb-pagination-spacing-inline-end",e):this.style.removeProperty("--scb-pagination-spacing-inline-end")}firstUpdated(){this.__applySpacing()}updated(i){super.updated(i),(i.has("spacing")||i.has("spacingTop")||i.has("spacingBottom")||i.has("spacingLeft")||i.has("spacingRight"))&&this.__applySpacing()}render(){if(this.totalPages===0)return null;const i=this.variant?`${this.variant.toLowerCase()}`:"",n=this.alignment==="center"||this.alignment==="end"?`align-${this.alignment}`:"align-start",a=[],{page:s,totalPages:e}=this,g=window.innerWidth<=768,d=g?1:2,u=this._getPagingHref(Math.max(1,this.page-1)),m=this._getPagingHref(Math.min(this.totalPages,this.page+1)),f=this.pagingHref?this.variant==="icon"?o`<a
               class="paging-action-link"
               href=${u}
               @click=${this._prevPage}
@@ -38,7 +38,7 @@ import{_ as x,b as w,g as _,h as p,y as o}from"../../vendor/vendor.js";import"..
               aria-label="Föregående sida"
             ></scb-button>`,v=this.pagingHref?this.variant==="icon"?o`<a
               class="paging-action-link"
-              href=${f}
+              href=${m}
               @click=${this._nextPage}
               aria-label="Nästa sida"
               aria-disabled=${this.page===this.totalPages?"true":"false"}
@@ -50,7 +50,7 @@ import{_ as x,b as w,g as _,h as p,y as o}from"../../vendor/vendor.js";import"..
               ></scb-icon-button>
             </a>`:o`<a
               class="paging-action-link"
-              href=${f}
+              href=${m}
               @click=${this._nextPage}
               aria-label="Nästa sida"
               aria-disabled=${this.page===this.totalPages?"true":"false"}
@@ -78,32 +78,32 @@ import{_ as x,b as w,g as _,h as p,y as o}from"../../vendor/vendor.js";import"..
               ?disabled=${this.page===this.totalPages}
               aria-label="Nästa sida"
               trailing-icon
-            ></scb-button>`,c=i=>i===s?o`
+            ></scb-button>`,c=t=>t===s?o`
             <li>
               <span
                 class="page-number active"
                 aria-current="page"
-                aria-label="${this.currentAriaLabel} ${i}"
-                >${i}</span
+                aria-label="${this.currentAriaLabel} ${t}"
+                >${t}</span
               >
             </li>
           `:o`
             <li>
               <scb-link
-                class="page-number${i===s?" active":""}"
-                @click=${y=>this._handlePageSelection(i,y)}
-                aria-current=${i===s?"page":void 0}
-                aria-label="${this.pagingNumberAriaLabel} ${i}"
-                href=${this._getPagingHref(i)}
-                ?disabled=${i===s}
-                >${i}</scb-link
+                class="page-number${t===s?" active":""}"
+                @click=${y=>this._handlePageSelection(t,y)}
+                aria-current=${t===s?"page":void 0}
+                aria-label="${this.pagingNumberAriaLabel} ${t}"
+                href=${this._getPagingHref(t)}
+                ?disabled=${t===s}
+                >${t}</scb-link
               >
             </li>
-          `;if(e<=8)for(let i=1;i<=e;i++)a.push(c(i));else if(a.push(c(1)),s<=4&&!g){for(let i=2;i<=5;i++)a.push(c(i));e>6?(a.push(o`<li><span class="ellipsis" aria-hidden="true">…</span></li>`),a.push(c(e))):e===6&&a.push(c(e))}else if(s<=3&&g){for(let i=2;i<=3;i++)a.push(c(i));e>4?(a.push(o`<li><span class="ellipsis" aria-hidden="true">…</span></li>`),a.push(c(e))):e===4&&a.push(c(e))}else if(s>=e-(d+1)){a.push(o`<li><span class="ellipsis" aria-hidden="true">…</span></li>`);for(let i=e-d*2;i<=e;i++)i>1&&a.push(c(i))}else{a.push(o`<li><span class="ellipsis" aria-hidden="true">…</span></li>`);for(let i=s-d;i<=s+d;i++)i>1&&i<e&&a.push(c(i));a.push(o`<li><span class="ellipsis" aria-hidden="true">…</span></li>`),a.push(c(e))}return g?o`
-        <nav aria-label="${this.paginationAriaLabel}" class="pagination ${t} ${n}">
+          `;if(e<=8)for(let t=1;t<=e;t++)a.push(c(t));else if(a.push(c(1)),s<=4&&!g){for(let t=2;t<=5;t++)a.push(c(t));e>6?(a.push(o`<li><span class="ellipsis" aria-hidden="true">…</span></li>`),a.push(c(e))):e===6&&a.push(c(e))}else if(s<=3&&g){for(let t=2;t<=3;t++)a.push(c(t));e>4?(a.push(o`<li><span class="ellipsis" aria-hidden="true">…</span></li>`),a.push(c(e))):e===4&&a.push(c(e))}else if(s>=e-(d+1)){a.push(o`<li><span class="ellipsis" aria-hidden="true">…</span></li>`);for(let t=e-d*2;t<=e;t++)t>1&&a.push(c(t))}else{a.push(o`<li><span class="ellipsis" aria-hidden="true">…</span></li>`);for(let t=s-d;t<=s+d;t++)t>1&&t<e&&a.push(c(t));a.push(o`<li><span class="ellipsis" aria-hidden="true">…</span></li>`),a.push(c(e))}return g?o`
+        <nav aria-label="${this.paginationAriaLabel}" class="pagination ${i} ${n}">
           <div class="pagination-row">
             <div class="prev">
-              ${m}
+              ${f}
             </div>
             <ol>
               ${a}
@@ -114,10 +114,10 @@ import{_ as x,b as w,g as _,h as p,y as o}from"../../vendor/vendor.js";import"..
           </div>
         </nav>
       `:o`
-      <nav aria-label="${this.paginationAriaLabel}" class="pagination ${t} ${n}">
+      <nav aria-label="${this.paginationAriaLabel}" class="pagination ${i} ${n}">
         <div class="pagination-row">
           <div class="prev">
-            ${m}
+            ${f}
           </div>
           <ol>
             ${a}
@@ -127,206 +127,4 @@ import{_ as x,b as w,g as _,h as p,y as o}from"../../vendor/vendor.js";import"..
           </div>
         </div>
       </nav>
-    `}},b.styles=[w`
-      :host {
-        display: block;
-        width: 100%;
-
-        margin-block-start: var(--scb-pagination-spacing-block-start, 0);
-        margin-block-end: var(--scb-pagination-spacing-block-end, 0);
-        margin-inline-start: var(--scb-pagination-spacing-inline-start, 0);
-        margin-inline-end: var(--scb-pagination-spacing-inline-end, 0);
-      }
-
-      :host .pagination {
-        --md-text-button-label-text-color: var(--md-sys-color-on-surface, #0F0865);
-        --md-text-button-pressed-state-layer-color: var(--md-sys-color-on-surface, #0F0865);
-        --md-text-button-focus-label-text-color: var(--md-sys-color-on-surface, #0F0865);
-        --md-text-button-hover-label-text-color: var(--md-sys-color-on-surface, #0F0865);
-        --md-text-button-pressed-label-text-color: var(--md-sys-color-on-surface, #0F0865);
-        --md-text-button-hover-state-layer-color: var(--md-sys-color-on-surface, #0F0865);
-        --md-text-button-label-text-weight: var(--weight-regular, 400);
-        --md-text-button-label-text-line-height: var(--md-sys-typescale-body-medium-line-height, 24px);
-        --md-text-button-label-text-size: var(--md-sys-typescale-body-medium-size, 16px);
-        --md-text-button-icon-color: var(--md-sys-color-on-surface, #0F0865);
-        --md-text-button-focus-icon-color: var(--md-sys-color-on-surface, #0F0865);
-        --md-text-button-hover-icon-color: var(--md-sys-color-on-surface, #0F0865);
-        --md-text-button-pressed-icon-color: var(--md-sys-color-on-surface, #0F0865);
-        --scb-link-decoration: none;
-        --scb-link-color: var(--md-sys-color-on-surface, #0F0865);
-
-        scb-link.page-number a {
-          cursor: pointer;
-          text-decoration: none;
-          display: inline-flex;
-        }
-      }
-
-      .pagination {
-        width: 100%;
-        display: flex;
-        flex-direction: column;
-        gap: 0;
-      }
-      .pagination-row {
-        width: 100%;
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-        gap: 4px;
-      }
-      .pagination-row .prev {
-        display: flex;
-        justify-content: flex-start;
-        width: auto;
-      }
-      .pagination-row ol {
-        width: auto;
-        display: flex;
-        flex-direction: row;
-        justify-content: flex-start;
-        gap: 4px;
-        margin: 0;
-        padding: 0;
-        list-style: none;
-      }
-      .pagination-row ol li {
-        min-width: 40px;
-        min-height: 40px;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-      }
-      .pagination-row .next {
-        display: flex;
-        justify-content: flex-start;
-        align-items: center;
-        width: auto;
-        margin-top: 0;
-      }
-      .pagination.align-center .pagination-row,
-      .pagination.align-center .pagination-row ol,
-      .pagination.align-center .pagination-row .prev,
-      .pagination.align-center .pagination-row .next,
-      .pagination.align-center > .next {
-        justify-content: center;
-      }
-      .pagination.align-center > .next {
-        display: flex;
-      }
-      .pagination.align-end .pagination-row,
-      .pagination.align-end .pagination-row ol,
-      .pagination.align-end .pagination-row .prev,
-      .pagination.align-end .pagination-row .next,
-      .pagination.align-end > .next {
-        justify-content: flex-end;
-      }
-      .pagination.align-end > .next {
-        display: flex;
-      }
-      scb-link.page-number a {
-        cursor: pointer;
-        text-decoration: none;
-        display: inline-flex;
-      }
-      .pagination-row ol li scb-link.page-number {
-        --scb-link-focus-ring-gap: 0;
-        --scb-link-decoration: none;
-        --scb-link-hover-thickness: 1px;
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        width: 40px;
-        height: 40px;
-        border-radius: 999px;
-      }
-      .pagination-row ol li scb-link.page-number::part(anchor) {
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        width: 40px;
-        height: 40px;
-        border-radius: 999px;
-        color: var(--md-sys-color-on-surface, #0F0865);
-        cursor: pointer;
-        text-decoration: none;
-        transition: background-color 120ms linear;
-      }
-      .pagination-row ol li scb-link.page-number::part(anchor):hover {
-        background: color-mix(
-          in srgb,
-          var(--md-text-button-hover-state-layer-color, var(--md-sys-color-on-surface, #0F0865)) 8%,
-          transparent
-        );
-      }
-      .pagination-row ol li scb-link.page-number::part(anchor):focus-visible {
-        background: color-mix(
-          in srgb,
-          var(--md-sys-color-on-surface, #0F0865) 10%,
-          transparent
-        );
-      }
-      .page-number.active {
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        border-radius: 50%;
-        background: var(--md-sys-color-primary, #1F44FF);
-        color: var(--md-sys-color-on-primary, #FFF);
-        text-align: center;
-        width: 40px;
-        height: 40px;
-      }
-      .page-number.active {
-        font-family: var(--brand-font, 'Inter', sans-serif);
-      }
-      .ellipsis {
-        margin: 0 4px;
-        color: #888;
-        user-select: none;
-        pointer-events: none;
-      }
-      scb-button[disabled] {
-        opacity: 0.5;
-        pointer-events: none;
-      }
-      .paging-action-link {
-        display: inline-flex;
-        text-decoration: none;
-      }
-      .paging-action-link[aria-disabled='true'] {
-        opacity: 0.5;
-        pointer-events: none;
-      }
-
-      @media (max-width: 768px) {
-        .pagination .prev {
-          display: flex;
-          justify-content: flex-start;
-        }
-        .pagination .next {
-          width: 100%;
-          margin-top: 8px;
-        }
-      }
-
-      @media (max-width: 390px) {
-        .pagination-row {
-          flex-direction: column;
-          gap: 0;
-        }
-        .pagination-row .prev {
-          width: 100%;
-          margin-bottom: 8px;
-          align-items: center;
-        }
-        .pagination-row ol {
-          width: 100%;
-          align-items: center;
-        }
-        .pagination-row .next {
-          width: 100%;
-          margin-top: 8px;
-        }
-      }
-    `],b);l([p({type:String})],r.prototype,"variant",void 0);l([p({type:String})],r.prototype,"alignment",void 0);l([p({type:Number})],r.prototype,"page",void 0);l([p({type:Number,attribute:"total-pages"})],r.prototype,"totalPages",void 0);l([p({type:String,attribute:"paging-href"})],r.prototype,"pagingHref",void 0);l([p({type:String,attribute:"base-uri"})],r.prototype,"baseUri",void 0);l([p({type:String,attribute:"pagination-aria-label"})],r.prototype,"paginationAriaLabel",void 0);l([p({type:String,attribute:"current-aria-label"})],r.prototype,"currentAriaLabel",void 0);l([p({type:String,attribute:"paging-number-aria-label"})],r.prototype,"pagingNumberAriaLabel",void 0);l([p({type:Boolean})],r.prototype,"isNarrow",void 0);l([p({type:String})],r.prototype,"spacing",void 0);l([p({type:String,attribute:"spacing-top"})],r.prototype,"spacingTop",void 0);l([p({type:String,attribute:"spacing-bottom"})],r.prototype,"spacingBottom",void 0);l([p({type:String,attribute:"spacing-left"})],r.prototype,"spacingLeft",void 0);l([p({type:String,attribute:"spacing-right"})],r.prototype,"spacingRight",void 0);r=l([_("scb-pagination")],r);
+    `}},b.styles=[_`:host{display:block;width:100%;margin-block-start:var(--scb-pagination-spacing-block-start, 0);margin-block-end:var(--scb-pagination-spacing-block-end, 0);margin-inline-start:var(--scb-pagination-spacing-inline-start, 0);margin-inline-end:var(--scb-pagination-spacing-inline-end, 0)}:host .pagination{--md-text-button-label-text-color:var(--md-sys-color-on-surface, #0F0865);--md-text-button-pressed-state-layer-color:var(--md-sys-color-on-surface, #0F0865);--md-text-button-focus-label-text-color:var(--md-sys-color-on-surface, #0F0865);--md-text-button-hover-label-text-color:var(--md-sys-color-on-surface, #0F0865);--md-text-button-pressed-label-text-color:var(--md-sys-color-on-surface, #0F0865);--md-text-button-hover-state-layer-color:var(--md-sys-color-on-surface, #0F0865);--md-text-button-label-text-weight:var(--weight-regular, 400);--md-text-button-label-text-line-height:var(--md-sys-typescale-body-medium-line-height, 24px);--md-text-button-label-text-size:var(--md-sys-typescale-body-medium-size, 16px);--md-text-button-icon-color:var(--md-sys-color-on-surface, #0F0865);--md-text-button-focus-icon-color:var(--md-sys-color-on-surface, #0F0865);--md-text-button-hover-icon-color:var(--md-sys-color-on-surface, #0F0865);--md-text-button-pressed-icon-color:var(--md-sys-color-on-surface, #0F0865);--scb-link-decoration:none;--scb-link-color:var(--md-sys-color-on-surface, #0F0865)}.pagination,.pagination-row{width:100%;display:flex;flex-direction:column;gap:0}.pagination-row{flex-direction:row;align-items:center;gap:4px}.pagination-row .next,.pagination-row .prev,.pagination-row ol{display:flex;justify-content:flex-start;width:auto}.pagination-row ol{flex-direction:row;gap:4px;margin:0;padding:0;list-style:none}.pagination-row ol li{min-width:40px;min-height:40px;display:flex;align-items:center}.pagination-row .next{align-items:center;margin-top:0}.pagination-row ol li,.pagination.align-center .pagination-row,.pagination.align-center .pagination-row .next,.pagination.align-center .pagination-row .prev,.pagination.align-center .pagination-row ol,.pagination.align-center>.next{justify-content:center}.pagination.align-center>.next{display:flex}.pagination.align-end .pagination-row,.pagination.align-end .pagination-row .next,.pagination.align-end .pagination-row .prev,.pagination.align-end .pagination-row ol,.pagination.align-end>.next{justify-content:flex-end}.pagination.align-end>.next{display:flex}scb-link.page-number a{cursor:pointer;text-decoration:none;display:inline-flex}.pagination-row ol li scb-link.page-number{--scb-link-focus-ring-gap:0;--scb-link-decoration:none;--scb-link-hover-thickness:1px;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:999px}.pagination-row ol li scb-link.page-number::part(anchor){display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:999px;color:var(--md-sys-color-on-surface, #0F0865);cursor:pointer;text-decoration:none;transition:background-color 120ms linear}.pagination-row ol li scb-link.page-number::part(anchor):hover{background:color-mix(in srgb,var(--md-text-button-hover-state-layer-color, var(--md-sys-color-on-surface, #0F0865)) 8%,transparent)}.pagination-row ol li scb-link.page-number::part(anchor):focus-visible{background:color-mix(in srgb,var(--md-sys-color-on-surface, #0F0865) 10%,transparent)}.page-number.active{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:var(--md-sys-color-primary, #1F44FF);color:var(--md-sys-color-on-primary, #FFF);text-align:center;width:40px;height:40px;font-family:var(--brand-font, 'Inter', sans-serif)}.ellipsis{margin:0 4px;color:#888;user-select:none;pointer-events:none}.paging-action-link[aria-disabled=true],scb-button[disabled]{opacity:.5;pointer-events:none}.paging-action-link{display:inline-flex;text-decoration:none}@media (max-width:768px){.pagination .prev{display:flex;justify-content:flex-start}.pagination .next{width:100%;margin-top:8px}}@media (max-width:390px){.pagination-row{flex-direction:column;gap:0}.pagination-row .prev{margin-bottom:8px}.pagination-row .prev,.pagination-row ol{width:100%;align-items:center}.pagination-row .next{width:100%;margin-top:8px}}`],b);l([p({type:String})],r.prototype,"variant",void 0);l([p({type:String})],r.prototype,"alignment",void 0);l([p({type:Number})],r.prototype,"page",void 0);l([p({type:Number,attribute:"total-pages"})],r.prototype,"totalPages",void 0);l([p({type:String,attribute:"paging-href"})],r.prototype,"pagingHref",void 0);l([p({type:String,attribute:"base-uri"})],r.prototype,"baseUri",void 0);l([p({type:String,attribute:"pagination-aria-label"})],r.prototype,"paginationAriaLabel",void 0);l([p({type:String,attribute:"current-aria-label"})],r.prototype,"currentAriaLabel",void 0);l([p({type:String,attribute:"paging-number-aria-label"})],r.prototype,"pagingNumberAriaLabel",void 0);l([p({type:Boolean})],r.prototype,"isNarrow",void 0);l([p({type:String})],r.prototype,"spacing",void 0);l([p({type:String,attribute:"spacing-top"})],r.prototype,"spacingTop",void 0);l([p({type:String,attribute:"spacing-bottom"})],r.prototype,"spacingBottom",void 0);l([p({type:String,attribute:"spacing-left"})],r.prototype,"spacingLeft",void 0);l([p({type:String,attribute:"spacing-right"})],r.prototype,"spacingRight",void 0);r=l([w("scb-pagination")],r);

package/mvc/components/scb-progress-indicator/scb-progress-indicator.js

@@ -1,4 +1,4 @@
-import{_ as h,b as u,g,h as a,y as n}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as s}from"../../vendor/decorate.js";(function(){try{var l=typeof globalThis<"u"?globalThis:window;if(!l.__scb_ce_guard_installed__){l.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(i,r,p){try{customElements.get(i)||t(i,r,p)}catch(d){var o=String(d||"");if(o.indexOf("already been used")===-1&&o.indexOf("NotSupportedError")===-1)throw d}}}}catch{}})();var c,f={fromAttribute(l){return l===null?!1:l.toLowerCase()!=="false"}},e=(c=class extends h{constructor(...t){super(...t),this.id="",this.type="circular",this.progress=25,this.isStatic=!0,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0,this._isSyncingAria=!1,this._defaultAriaLabelApplied=!1,this._defaultAriaValueTextApplied=!1}static get observedAttributes(){return[...super.observedAttributes,"role","aria-label","aria-labelledby","aria-valuemin","aria-valuemax","aria-valuetext"]}attributeChangedCallback(t,i,r){super.attributeChangedCallback(t,i,r),i!==r&&(t==="role"||t.startsWith("aria-"))&&this.syncAria()}connectedCallback(){super.connectedCallback(),this.syncAria()}clampProgress(t){return Number.isNaN(t)?0:Math.max(0,Math.min(100,t))}applyDefaultAriaLabel(t){const i=this.getAttribute("aria-labelledby"),r=this.getAttribute("aria-label");if(i){this._defaultAriaLabelApplied&&(this.removeAttribute("aria-label"),this._defaultAriaLabelApplied=!1);return}if(r!==null){this._defaultAriaLabelApplied&&r!==t&&(this._defaultAriaLabelApplied=!1);return}this.setAttribute("aria-label",t),this._defaultAriaLabelApplied=!0}syncAria(){if(!this._isSyncingAria){this._isSyncingAria=!0;try{if(this.hasAttribute("role")||this.setAttribute("role","progressbar"),this.hasAttribute("aria-valuemin")||this.setAttribute("aria-valuemin","0"),this.hasAttribute("aria-valuemax")||this.setAttribute("aria-valuemax","100"),this.type==="linear"&&!this.isStatic){this.removeAttribute("aria-valuenow");const i=this.getAttribute("aria-valuetext");i===null?(this.setAttribute("aria-valuetext","Laddar"),this._defaultAriaValueTextApplied=!0):this._defaultAriaValueTextApplied&&i!=="Laddar"&&(this._defaultAriaValueTextApplied=!1),this.applyDefaultAriaLabel("Laddar");return}const t=this.clampProgress(this.progress);this.setAttribute("aria-valuenow",String(t)),this._defaultAriaValueTextApplied&&(this.getAttribute("aria-valuetext")==="Laddar"&&this.removeAttribute("aria-valuetext"),this._defaultAriaValueTextApplied=!1),this.applyDefaultAriaLabel("Förlopp")}finally{this._isSyncingAria=!1}}}mapSpacingToken(t){if(!t)return;const i=String(t).trim();if(i)return/^\d+$/.test(i)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(i,10)))})`:i}applySpacing(){const t=this.mapSpacingToken(this.spacing),i=this.mapSpacingToken(this.spacingTop)??t,r=this.mapSpacingToken(this.spacingBottom)??t,p=this.mapSpacingToken(this.spacingLeft),o=this.mapSpacingToken(this.spacingRight);i?this.style.setProperty("--scb-progress-indicator-spacing-block-start",i):this.style.removeProperty("--scb-progress-indicator-spacing-block-start"),r?this.style.setProperty("--scb-progress-indicator-spacing-block-end",r):this.style.removeProperty("--scb-progress-indicator-spacing-block-end"),p?this.style.setProperty("--scb-progress-indicator-spacing-inline-start",p):this.style.removeProperty("--scb-progress-indicator-spacing-inline-start"),o?this.style.setProperty("--scb-progress-indicator-spacing-inline-end",o):this.style.removeProperty("--scb-progress-indicator-spacing-inline-end")}applyTypeLayout(){this.type==="linear"?(this.style.display="block",this.style.width="100%"):(this.style.removeProperty("display"),this.style.removeProperty("width"))}firstUpdated(t){this.applyTypeLayout(),this.applySpacing(),this.syncAria()}updated(t){super.updated(t),t.has("type")&&this.applyTypeLayout(),(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&this.applySpacing(),(t.has("type")||t.has("progress")||t.has("isStatic"))&&this.syncAria()}render(){return n`
+import{h,m as u,p as a,v as n,y as g}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import{t as s}from"../../vendor/decorate.js";(function(){try{var l=typeof globalThis<"u"?globalThis:window;if(!l.__scb_ce_guard_installed__){l.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(i,r,p){try{customElements.get(i)||t(i,r,p)}catch(d){var o=String(d||"");if(o.indexOf("already been used")===-1&&o.indexOf("NotSupportedError")===-1)throw d}}}}catch{}})();var c,f={fromAttribute(l){return l===null?!1:l.toLowerCase()!=="false"}},e=(c=class extends h{constructor(...t){super(...t),this.id="",this.type="circular",this.progress=25,this.isStatic=!0,this.spacing=void 0,this.spacingTop=void 0,this.spacingBottom=void 0,this.spacingLeft=void 0,this.spacingRight=void 0,this._isSyncingAria=!1,this._defaultAriaLabelApplied=!1,this._defaultAriaValueTextApplied=!1}static get observedAttributes(){return[...super.observedAttributes,"role","aria-label","aria-labelledby","aria-valuemin","aria-valuemax","aria-valuetext"]}attributeChangedCallback(t,i,r){super.attributeChangedCallback(t,i,r),i!==r&&(t==="role"||t.startsWith("aria-"))&&this.syncAria()}connectedCallback(){super.connectedCallback(),this.syncAria()}clampProgress(t){return Number.isNaN(t)?0:Math.max(0,Math.min(100,t))}applyDefaultAriaLabel(t){const i=this.getAttribute("aria-labelledby"),r=this.getAttribute("aria-label");if(i){this._defaultAriaLabelApplied&&(this.removeAttribute("aria-label"),this._defaultAriaLabelApplied=!1);return}if(r!==null){this._defaultAriaLabelApplied&&r!==t&&(this._defaultAriaLabelApplied=!1);return}this.setAttribute("aria-label",t),this._defaultAriaLabelApplied=!0}syncAria(){if(!this._isSyncingAria){this._isSyncingAria=!0;try{if(this.hasAttribute("role")||this.setAttribute("role","progressbar"),this.hasAttribute("aria-valuemin")||this.setAttribute("aria-valuemin","0"),this.hasAttribute("aria-valuemax")||this.setAttribute("aria-valuemax","100"),this.type==="linear"&&!this.isStatic){this.removeAttribute("aria-valuenow");const i=this.getAttribute("aria-valuetext");i===null?(this.setAttribute("aria-valuetext","Laddar"),this._defaultAriaValueTextApplied=!0):this._defaultAriaValueTextApplied&&i!=="Laddar"&&(this._defaultAriaValueTextApplied=!1),this.applyDefaultAriaLabel("Laddar");return}const t=this.clampProgress(this.progress);this.setAttribute("aria-valuenow",String(t)),this._defaultAriaValueTextApplied&&(this.getAttribute("aria-valuetext")==="Laddar"&&this.removeAttribute("aria-valuetext"),this._defaultAriaValueTextApplied=!1),this.applyDefaultAriaLabel("Förlopp")}finally{this._isSyncingAria=!1}}}mapSpacingToken(t){if(!t)return;const i=String(t).trim();if(i)return/^\d+$/.test(i)?`var(--spacing-${Math.max(0,Math.min(14,parseInt(i,10)))})`:i}applySpacing(){const t=this.mapSpacingToken(this.spacing),i=this.mapSpacingToken(this.spacingTop)??t,r=this.mapSpacingToken(this.spacingBottom)??t,p=this.mapSpacingToken(this.spacingLeft),o=this.mapSpacingToken(this.spacingRight);i?this.style.setProperty("--scb-progress-indicator-spacing-block-start",i):this.style.removeProperty("--scb-progress-indicator-spacing-block-start"),r?this.style.setProperty("--scb-progress-indicator-spacing-block-end",r):this.style.removeProperty("--scb-progress-indicator-spacing-block-end"),p?this.style.setProperty("--scb-progress-indicator-spacing-inline-start",p):this.style.removeProperty("--scb-progress-indicator-spacing-inline-start"),o?this.style.setProperty("--scb-progress-indicator-spacing-inline-end",o):this.style.removeProperty("--scb-progress-indicator-spacing-inline-end")}applyTypeLayout(){this.type==="linear"?(this.style.display="block",this.style.width="100%"):(this.style.removeProperty("display"),this.style.removeProperty("width"))}firstUpdated(t){this.applyTypeLayout(),this.applySpacing(),this.syncAria()}updated(t){super.updated(t),t.has("type")&&this.applyTypeLayout(),(t.has("spacing")||t.has("spacingTop")||t.has("spacingBottom")||t.has("spacingLeft")||t.has("spacingRight"))&&this.applySpacing(),(t.has("type")||t.has("progress")||t.has("isStatic"))&&this.syncAria()}render(){return n`
       <div class="scb-progress-indicator">
         ${this.type==="circular"?n`
           <div class="circular">
@@ -19,69 +19,4 @@ import{_ as h,b as u,g,h as a,y as n}from"../../vendor/vendor.js";import"../../v
           </div>
         `}
       </div>
-    `}},c.styles=[u`
-
-      .circular {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        width: 46px;
-        height: 46px;
-        position: relative;
-      }
-      .circular-spin {
-        animation: spin 1s linear infinite;
-        width: 46px;
-        height: 46px ;
-        position: relative;
-        z-index: 1;
-      }
-      @keyframes spin {
-        0% { transform: rotate(0deg); }
-        100% { transform: rotate(360deg); }
-      }
-      .circular-bg {
-        stroke:  var(--md-sys-color-secondary-container);
-      }
-      .circular-fg {
-        transition: stroke-dashoffset 0.3s ease;
-      }
-      .linear {
-        width: 100%;
-        height: 6px;
-        background: var(--md-sys-color-secondary-container);
-        border-radius: 3px;
-        overflow: hidden;
-        position: relative;
-      }
-      :host {
-        display: inline-block;
-        margin-block-start: var(--scb-progress-indicator-spacing-block-start, 0);
-        margin-block-end: var(--scb-progress-indicator-spacing-block-end, 0);
-        margin-inline-start: var(--scb-progress-indicator-spacing-inline-start, 0);
-        margin-inline-end: var(--scb-progress-indicator-spacing-inline-end, 0);
-        --progress-fill: var(--md-sys-color-primary);
-      }
-      :host([type='linear']) {
-        display: block;
-        width: 100%;
-      }
-      .linear-loader {
-        height: 100%;
-        width: 40%;
-        background: var(--progress-fill);
-        border-radius: 3px;
-        animation: linear-progress 1.2s cubic-bezier(.4,0,.2,1) infinite;
-      }
-      .linear-static {
-        height: 100%;
-        border-radius: 3px;
-        transition: width 0.3s ease;
-        background: var(--progress-fill);
-      }
-      @keyframes linear-progress {
-        0% { margin-left: -40%; width: 40%; }
-        50% { margin-left: 30%; width: 60%; }
-        100% { margin-left: 100%; width: 40%; }
-      }
-    `],c);s([a({type:String})],e.prototype,"id",void 0);s([a({type:String,reflect:!0})],e.prototype,"type",void 0);s([a({type:Number,reflect:!0})],e.prototype,"progress",void 0);s([a({type:Boolean,attribute:"is-static",converter:f})],e.prototype,"isStatic",void 0);s([a({type:String,reflect:!0})],e.prototype,"spacing",void 0);s([a({type:String,attribute:"spacing-top",reflect:!0})],e.prototype,"spacingTop",void 0);s([a({type:String,attribute:"spacing-bottom",reflect:!0})],e.prototype,"spacingBottom",void 0);s([a({type:String,attribute:"spacing-left",reflect:!0})],e.prototype,"spacingLeft",void 0);s([a({type:String,attribute:"spacing-right",reflect:!0})],e.prototype,"spacingRight",void 0);e=s([g("scb-progress-indicator")],e);
+    `}},c.styles=[g`@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes linear-progress{0%{margin-left:-40%;width:40%}50%{margin-left:30%;width:60%}to{margin-left:100%;width:40%}}.circular,.circular-spin{width:46px;height:46px;position:relative}.circular{display:flex;align-items:center;justify-content:center}.circular-spin{animation:spin 1s linear infinite;z-index:1}.circular-bg{stroke:var(--md-sys-color-secondary-container)}.circular-fg{transition:stroke-dashoffset .3s ease}.linear{width:100%;height:6px;background:var(--md-sys-color-secondary-container);border-radius:3px;overflow:hidden;position:relative}:host{display:inline-block;margin-block-start:var(--scb-progress-indicator-spacing-block-start, 0);margin-block-end:var(--scb-progress-indicator-spacing-block-end, 0);margin-inline-start:var(--scb-progress-indicator-spacing-inline-start, 0);margin-inline-end:var(--scb-progress-indicator-spacing-inline-end, 0);--progress-fill:var(--md-sys-color-primary)}:host([type='linear']){display:block;width:100%}.linear-loader,.linear-static{height:100%;border-radius:3px;background:var(--progress-fill)}.linear-loader{width:40%;animation:linear-progress 1.2s cubic-bezier(.4,0,.2,1) infinite}.linear-static{transition:width .3s ease}`],c);s([a({type:String})],e.prototype,"id",void 0);s([a({type:String,reflect:!0})],e.prototype,"type",void 0);s([a({type:Number,reflect:!0})],e.prototype,"progress",void 0);s([a({type:Boolean,attribute:"is-static",converter:f})],e.prototype,"isStatic",void 0);s([a({type:String,reflect:!0})],e.prototype,"spacing",void 0);s([a({type:String,attribute:"spacing-top",reflect:!0})],e.prototype,"spacingTop",void 0);s([a({type:String,attribute:"spacing-bottom",reflect:!0})],e.prototype,"spacingBottom",void 0);s([a({type:String,attribute:"spacing-left",reflect:!0})],e.prototype,"spacingLeft",void 0);s([a({type:String,attribute:"spacing-right",reflect:!0})],e.prototype,"spacingRight",void 0);e=s([u("scb-progress-indicator")],e);

package/mvc/components/scb-progress-stepper/scb-progress-step.js

@@ -1,10 +1,11 @@
-import{_ as h,b,g as f,h as a,m as u,y as r}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import"../../vendor/md-focus-ring.js";import"../../vendor/ripple.js";import{t as s}from"../../vendor/decorate.js";(function(){try{var l=typeof globalThis<"u"?globalThis:window;if(!l.__scb_ce_guard_installed__){l.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(o,i,c){try{customElements.get(o)||t(o,i,c)}catch(d){var p=String(d||"");if(p.indexOf("already been used")===-1&&p.indexOf("NotSupportedError")===-1)throw d}}}}catch{}})();var n,e=(n=class extends h{constructor(...t){super(...t),this.width="100%",this.active=!1,this.disabled=!1,this.href="",this.label="",this.position="top",this._stepId=`scb-step-${Math.random().toString(36).slice(2)}`}updated(t){super.updated?.(t),this.style.setProperty("--progress-step-width",this.width)}_onClick(){const t={width:this.width,label:this.label,active:this.active,disabled:this.disabled,href:this.href||void 0};this.dispatchEvent(new CustomEvent("step-click",{detail:t,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("stepclick",{detail:t,bubbles:!0,composed:!0}))}firstUpdated(t){super.firstUpdated?.(t),this._setupTooltipPositioning()}_setupTooltipPositioning(){new MutationObserver(()=>this._adjustTooltipPosition()).observe(this,{attributes:!0,childList:!0,subtree:!0}),window.addEventListener("resize",()=>this._adjustTooltipPosition())}_adjustTooltipPosition(){const t=this.renderRoot.querySelector(".tooltip");if(!t)return;t.style.left="50%",t.style.right="",t.style.transform="translateX(-50%)",t.classList.remove("tooltip-left","tooltip-right");const o=t.getBoundingClientRect(),i=8;o.right>window.innerWidth-i&&(t.style.left="auto",t.style.right=`${i}px`,t.style.transform="none",t.classList.add("tooltip-right")),o.left<i&&(t.style.left=`${i}px`,t.style.right="auto",t.style.transform="none",t.classList.add("tooltip-left"))}render(){return r`
+import{f as b,h as f,m as u,p as l,v as r,y as m}from"../../vendor/vendor.js";import"../../vendor/vendor-lit.js";import"../../vendor/ripple.js";import{n as c}from"../../vendor/lazy-focus-ring.js";import{t as o}from"../../vendor/decorate.js";(function(){try{var a=typeof globalThis<"u"?globalThis:window;if(!a.__scb_ce_guard_installed__){a.__scb_ce_guard_installed__=!0;var t=customElements.define.bind(customElements);customElements.define=function(s,i,h){try{customElements.get(s)||t(s,i,h)}catch(d){var p=String(d||"");if(p.indexOf("already been used")===-1&&p.indexOf("NotSupportedError")===-1)throw d}}}}catch{}})();var n,e=(n=class extends f{constructor(...t){super(...t),this.width="100%",this.active=!1,this.disabled=!1,this.href="",this.label="",this.position="top",this._stepId=`scb-step-${Math.random().toString(36).slice(2)}`}updated(t){super.updated?.(t),this.style.setProperty("--progress-step-width",this.width)}_onClick(){const t={width:this.width,label:this.label,active:this.active,disabled:this.disabled,href:this.href||void 0};this.dispatchEvent(new CustomEvent("step-click",{detail:t,bubbles:!0,composed:!0})),this.dispatchEvent(new CustomEvent("stepclick",{detail:t,bubbles:!0,composed:!0}))}firstUpdated(t){super.firstUpdated?.(t),this._setupTooltipPositioning()}_setupTooltipPositioning(){new MutationObserver(()=>this._adjustTooltipPosition()).observe(this,{attributes:!0,childList:!0,subtree:!0}),window.addEventListener("resize",()=>this._adjustTooltipPosition())}_adjustTooltipPosition(){const t=this.renderRoot.querySelector(".tooltip");if(!t)return;t.style.left="50%",t.style.right="",t.style.transform="translateX(-50%)",t.classList.remove("tooltip-left","tooltip-right");const s=t.getBoundingClientRect(),i=8;s.right>window.innerWidth-i&&(t.style.left="auto",t.style.right=`${i}px`,t.style.transform="none",t.classList.add("tooltip-right")),s.left<i&&(t.style.left=`${i}px`,t.style.right="auto",t.style.transform="none",t.classList.add("tooltip-left"))}render(){return r`
       ${this.href&&!this.disabled?r`
             <a
               id=${this._stepId}
               class="progress-step"
               href=${this.href}
               @click=${this._onClick}
+              @focusin=${c}
               tabindex="0"
               role="link"
               aria-disabled="false"
@@ -16,6 +17,7 @@ import{_ as h,b,g as f,h as a,m as u,y as r}from"../../vendor/vendor.js";import"
               id=${this._stepId}
               class="progress-step"
               @click=${this._onClick}
+              @focusin=${c}
               tabindex=${this.disabled?-1:0}
               role="button"
               aria-disabled=${this.disabled?"true":"false"}
@@ -25,123 +27,4 @@ import{_ as h,b,g as f,h as a,m as u,y as r}from"../../vendor/vendor.js";import"
           `}
       ${this.disabled?"":r`<md-focus-ring for="${this._stepId}"></md-focus-ring>`}
       ${this.label&&!this.disabled?r`<div class="tooltip ${this.position==="bottom"?"bottom":"top"}">${this.label}</div>`:""}
-    `}},n.styles=b`
-    :host {
-      display: block;
-      width: var(--progress-step-width, 100%);
-      height: 100%;
-      cursor: pointer;
-      background: transparent;
-      position: relative;
-    }
-    .progress-step {
-      width: 100%;
-      height: 100%;
-      background: transparent;
-      position: relative;
-      overflow: hidden;
-      border-right: 2px solid var(--md-sys-color-surface);
-      outline: none;
-      box-shadow: none;
-      display: block;
-    }
-    :host(.last-step) .progress-step {
-      border-right: none !important;
-    }
-    .progress-step:focus {
-      outline: none;
-      box-shadow: none;
-    }
-    :host([active]) .progress-step {
-      border-right: 2px solid var(--md-sys-color-surface);
-    }
-    :host([disabled]) {
-      cursor: not-allowed;
-    }
-    :host([disabled]) .progress-step {
-      background: #e6e6e699;
-      border-right: 2px solid #e6e6e699;
-    }
-
-    md-focus-ring {
-      pointer-events: none;
-      position: absolute;
-      inset: 0;
-      opacity: 0;
-      border-radius: 0;
-      transition: opacity 0.15s;
-      z-index: 4;
-    }
-    .progress-step:focus + md-focus-ring,
-    .progress-step:focus-visible + md-focus-ring {
-      opacity: 1;
-    }
-
-    .tooltip {
-      visibility: hidden;
-      opacity: 0;
-      position: absolute;
-      left: 50%;
-      transform: translateX(-50%);
-      z-index: 10;
-      max-width: 220px;
-      width: max-content;
-      background: var(--md-sys-color-inverse-surface);
-      border-radius: var(--md-sys-shape-corner-extra-small);
-      padding: var(--spacing-2) var(--spacing-3);
-      color: var(--md-sys-color-inverse-on-surface);
-      font-family: var(--brand-font);
-      font-size: var(--md-sys-typescale-body-small-size);
-      font-style: normal;
-      line-height: var(--md-sys-typescale-body-small-line-height);
-      letter-spacing: var(--md-sys-typescale-body-small-tracking);
-      white-space: normal;
-      pointer-events: none;
-      transition: opacity 0.2s, visibility 0.2s;
-      text-align: center;
-    }
-    .tooltip.top {
-      top: calc(100% + 10px);
-    }
-    .tooltip.bottom {
-      bottom: calc(100% + 10px);
-    }
-    .progress-step:hover ~ .tooltip,
-    .progress-step:focus ~ .tooltip {
-      visibility: visible;
-      opacity: 1;
-    }
-    .tooltip::after {
-      content: '';
-      position: absolute;
-      left: 50%;
-      transform: translateX(-50%);
-      width: 0;
-      height: 0;
-      pointer-events: none;
-      display: block;
-    }
-    .tooltip.top::after {
-      top: -6px;
-      border-left: 8px solid transparent;
-      border-right: 8px solid transparent;
-      border-bottom: 8px solid var(--md-sys-color-inverse-surface);
-      border-top: none;
-    }
-    .tooltip.bottom::after {
-      bottom: -6px;
-      border-left: 8px solid transparent;
-      border-right: 8px solid transparent;
-      border-top: 8px solid var(--md-sys-color-inverse-surface);
-      border-bottom: none;
-    }
-    .tooltip.tooltip-left::after {
-      left: 2px;
-      transform: none;
-    }
-    .tooltip.tooltip-right::after {
-      right: 2px;
-      left: auto;
-      transform: none;
-    }
-  `,n);s([a({type:String})],e.prototype,"width",void 0);s([a({type:Boolean,reflect:!0})],e.prototype,"active",void 0);s([a({type:Boolean,reflect:!0})],e.prototype,"disabled",void 0);s([a({type:String,reflect:!0})],e.prototype,"href",void 0);s([a({type:String})],e.prototype,"label",void 0);s([a({type:String})],e.prototype,"position",void 0);s([u()],e.prototype,"_stepId",void 0);e=s([f("scb-progress-step")],e);export{e as ScbProgressStep};
+    `}},n.styles=m`:host{display:block;width:var(--progress-step-width, 100%);height:100%;cursor:pointer;background:0 0;position:relative}.progress-step{width:100%;height:100%;background:0 0;position:relative;overflow:hidden;border-right:2px solid var(--md-sys-color-surface);outline:0;box-shadow:none;display:block}:host(.last-step) .progress-step{border-right:none!important}.progress-step:focus{outline:0;box-shadow:none}:host([active]) .progress-step{border-right:2px solid var(--md-sys-color-surface)}:host([disabled]){cursor:not-allowed}:host([disabled]) .progress-step{background:#e6e6e699;border-right:2px solid #e6e6e699}md-focus-ring{pointer-events:none;position:absolute;inset:0;opacity:0;border-radius:0;transition:opacity .15s;z-index:4}.progress-step:focus+md-focus-ring,.progress-step:focus-visible+md-focus-ring{opacity:1}.tooltip{visibility:hidden;opacity:0;position:absolute;left:50%;transform:translateX(-50%);z-index:10;max-width:220px;width:max-content;background:var(--md-sys-color-inverse-surface);border-radius:var(--md-sys-shape-corner-extra-small);padding:var(--spacing-2) var(--spacing-3);color:var(--md-sys-color-inverse-on-surface);font-family:var(--brand-font);font-size:var(--md-sys-typescale-body-small-size);font-style:normal;line-height:var(--md-sys-typescale-body-small-line-height);letter-spacing:var(--md-sys-typescale-body-small-tracking);white-space:normal;pointer-events:none;transition:opacity .2s,visibility .2s;text-align:center}.tooltip.top{top:calc(100% + 10px)}.tooltip.bottom{bottom:calc(100% + 10px)}.progress-step:focus~.tooltip,.progress-step:hover~.tooltip{visibility:visible;opacity:1}.tooltip::after{content:"";position:absolute;left:50%;transform:translateX(-50%);width:0;height:0;pointer-events:none;display:block}.tooltip.bottom::after,.tooltip.top::after{border-left:8px solid transparent;border-right:8px solid transparent}.tooltip.top::after{top:-6px;border-bottom:8px solid var(--md-sys-color-inverse-surface);border-top:none}.tooltip.bottom::after{bottom:-6px;border-top:8px solid var(--md-sys-color-inverse-surface);border-bottom:none}.tooltip.tooltip-left::after{left:2px;transform:none}.tooltip.tooltip-right::after{right:2px;left:auto;transform:none}`,n);o([l({type:String})],e.prototype,"width",void 0);o([l({type:Boolean,reflect:!0})],e.prototype,"active",void 0);o([l({type:Boolean,reflect:!0})],e.prototype,"disabled",void 0);o([l({type:String,reflect:!0})],e.prototype,"href",void 0);o([l({type:String})],e.prototype,"label",void 0);o([l({type:String})],e.prototype,"position",void 0);o([b()],e.prototype,"_stepId",void 0);e=o([u("scb-progress-step")],e);export{e as ScbProgressStep};