@getflip/swirl-components 0.208.2 → 0.208.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components.json +1 -1
- package/dist/cjs/swirl-action-list_3.cjs.entry.js +1 -1
- package/dist/cjs/swirl-app-layout_6.cjs.entry.js +13 -12
- package/dist/cjs/swirl-autocomplete.cjs.entry.js +1 -1
- package/dist/cjs/swirl-banner.cjs.entry.js +1 -1
- package/dist/cjs/swirl-button.cjs.entry.js +1 -1
- package/dist/cjs/swirl-carousel.cjs.entry.js +1 -1
- package/dist/cjs/swirl-chip.cjs.entry.js +1 -1
- package/dist/cjs/swirl-console-layout.cjs.entry.js +1 -1
- package/dist/cjs/swirl-date-input.cjs.entry.js +1 -1
- package/dist/cjs/swirl-date-picker_2.cjs.entry.js +1 -1
- package/dist/cjs/swirl-file-viewer_7.cjs.entry.js +1 -1
- package/dist/cjs/swirl-form-control.cjs.entry.js +1 -1
- package/dist/cjs/swirl-icon-check-small_3.cjs.entry.js +1 -1
- package/dist/cjs/swirl-icon-error_3.cjs.entry.js +1 -1
- package/dist/cjs/swirl-inline-status.cjs.entry.js +1 -1
- package/dist/cjs/swirl-lightbox.cjs.entry.js +1 -1
- package/dist/cjs/swirl-menu-item.cjs.entry.js +1 -1
- package/dist/cjs/swirl-menu.cjs.entry.js +1 -1
- package/dist/cjs/swirl-option-list_2.cjs.entry.js +1 -1
- package/dist/cjs/swirl-pagination.cjs.entry.js +1 -1
- package/dist/cjs/swirl-pdf-reader.cjs.entry.js +1 -1
- package/dist/cjs/swirl-popover_2.cjs.entry.js +1 -1
- package/dist/cjs/swirl-resource-list-file-item.cjs.entry.js +1 -1
- package/dist/cjs/swirl-search.cjs.entry.js +1 -1
- package/dist/cjs/swirl-select.cjs.entry.js +1 -1
- package/dist/cjs/swirl-shell-layout.cjs.entry.js +1 -1
- package/dist/cjs/swirl-table-column.cjs.entry.js +1 -1
- package/dist/cjs/swirl-table-row.cjs.entry.js +1 -1
- package/dist/cjs/swirl-table.cjs.entry.js +1 -1
- package/dist/cjs/swirl-text-input.cjs.entry.js +1 -1
- package/dist/cjs/swirl-time-input.cjs.entry.js +1 -1
- package/dist/cjs/swirl-toast.cjs.entry.js +1 -1
- package/dist/cjs/swirl-toolbar.cjs.entry.js +1 -1
- package/dist/cjs/{utils-fc5855ec.js → utils-c82e5573.js} +4 -0
- package/dist/collection/assets/pdfjs/pdf.worker.min.js +1 -1
- package/dist/collection/components/swirl-app-layout/swirl-app-layout.css +129 -0
- package/dist/collection/components/swirl-app-layout/swirl-app-layout.js +12 -11
- package/dist/collection/components/swirl-shell-layout/swirl-shell-layout.css +21 -0
- package/dist/collection/utils.js +3 -0
- package/dist/components/assets/pdfjs/pdf.worker.min.js +1 -1
- package/dist/components/swirl-app-layout2.js +13 -12
- package/dist/components/swirl-file-viewer-pdf2.js +1 -1
- package/dist/components/swirl-shell-layout.js +1 -1
- package/dist/components/utils.js +4 -1
- package/dist/esm/swirl-action-list_3.entry.js +1 -1
- package/dist/esm/swirl-app-layout_6.entry.js +13 -12
- package/dist/esm/swirl-autocomplete.entry.js +1 -1
- package/dist/esm/swirl-banner.entry.js +1 -1
- package/dist/esm/swirl-button.entry.js +1 -1
- package/dist/esm/swirl-carousel.entry.js +1 -1
- package/dist/esm/swirl-chip.entry.js +1 -1
- package/dist/esm/swirl-console-layout.entry.js +1 -1
- package/dist/esm/swirl-date-input.entry.js +1 -1
- package/dist/esm/swirl-date-picker_2.entry.js +1 -1
- package/dist/esm/swirl-file-viewer_7.entry.js +1 -1
- package/dist/esm/swirl-form-control.entry.js +1 -1
- package/dist/esm/swirl-icon-check-small_3.entry.js +1 -1
- package/dist/esm/swirl-icon-error_3.entry.js +1 -1
- package/dist/esm/swirl-inline-status.entry.js +1 -1
- package/dist/esm/swirl-lightbox.entry.js +1 -1
- package/dist/esm/swirl-menu-item.entry.js +1 -1
- package/dist/esm/swirl-menu.entry.js +1 -1
- package/dist/esm/swirl-option-list_2.entry.js +1 -1
- package/dist/esm/swirl-pagination.entry.js +1 -1
- package/dist/esm/swirl-pdf-reader.entry.js +1 -1
- package/dist/esm/swirl-popover_2.entry.js +1 -1
- package/dist/esm/swirl-resource-list-file-item.entry.js +1 -1
- package/dist/esm/swirl-search.entry.js +1 -1
- package/dist/esm/swirl-select.entry.js +1 -1
- package/dist/esm/swirl-shell-layout.entry.js +1 -1
- package/dist/esm/swirl-table-column.entry.js +1 -1
- package/dist/esm/swirl-table-row.entry.js +1 -1
- package/dist/esm/swirl-table.entry.js +1 -1
- package/dist/esm/swirl-text-input.entry.js +1 -1
- package/dist/esm/swirl-time-input.entry.js +1 -1
- package/dist/esm/swirl-toast.entry.js +1 -1
- package/dist/esm/swirl-toolbar.entry.js +1 -1
- package/dist/esm/{utils-aab10c80.js → utils-9b747dd7.js} +4 -1
- package/dist/swirl-components/{p-67ec1892.entry.js → p-002b7e52.entry.js} +1 -1
- package/dist/swirl-components/{p-ddbd3ba2.entry.js → p-0a75fb2c.entry.js} +1 -1
- package/dist/swirl-components/{p-f6d6e1b3.entry.js → p-12c1cc7d.entry.js} +1 -1
- package/dist/swirl-components/p-1d9f6e7b.entry.js +1 -0
- package/dist/swirl-components/{p-cafb3f89.entry.js → p-2016c6ab.entry.js} +1 -1
- package/dist/swirl-components/{p-923e0cab.entry.js → p-216668f0.entry.js} +1 -1
- package/dist/swirl-components/{p-b4b29c84.entry.js → p-35612ebd.entry.js} +1 -1
- package/dist/swirl-components/{p-957c6bfa.entry.js → p-4bccdf5c.entry.js} +1 -1
- package/dist/swirl-components/{p-8e6caf90.entry.js → p-4cab4855.entry.js} +1 -1
- package/dist/swirl-components/{p-fd807ae6.entry.js → p-4def436f.entry.js} +1 -1
- package/dist/swirl-components/{p-4cd0f4d9.entry.js → p-54defefa.entry.js} +1 -1
- package/dist/swirl-components/{p-02cc1990.entry.js → p-5625da01.entry.js} +1 -1
- package/dist/swirl-components/p-58abf3c6.js +1 -0
- package/dist/swirl-components/{p-38d2873f.entry.js → p-64af1828.entry.js} +1 -1
- package/dist/swirl-components/{p-5ebc8ac3.entry.js → p-6a2dfb36.entry.js} +1 -1
- package/dist/swirl-components/{p-63bb43c6.entry.js → p-6bb86ac6.entry.js} +1 -1
- package/dist/swirl-components/{p-3ca838d1.entry.js → p-6fff46e7.entry.js} +1 -1
- package/dist/swirl-components/{p-e60c1866.entry.js → p-847592fc.entry.js} +1 -1
- package/dist/swirl-components/{p-2cf55b68.entry.js → p-85103dcc.entry.js} +1 -1
- package/dist/swirl-components/{p-0bbd7d63.entry.js → p-882c7025.entry.js} +1 -1
- package/dist/swirl-components/{p-b50cde2f.entry.js → p-895ae6a9.entry.js} +1 -1
- package/dist/swirl-components/{p-f0f9e649.entry.js → p-a0775f91.entry.js} +1 -1
- package/dist/swirl-components/{p-8fd60b0e.entry.js → p-a60f0d9e.entry.js} +1 -1
- package/dist/swirl-components/{p-ac5aa422.entry.js → p-ad8c20b7.entry.js} +1 -1
- package/dist/swirl-components/{p-28087c13.entry.js → p-adf25c45.entry.js} +1 -1
- package/dist/swirl-components/p-b24e6ac7.entry.js +1 -0
- package/dist/swirl-components/{p-8b7fa285.entry.js → p-bcf38f06.entry.js} +1 -1
- package/dist/swirl-components/{p-9991892d.entry.js → p-c497d897.entry.js} +1 -1
- package/dist/swirl-components/{p-bcd510b8.entry.js → p-cadf6a32.entry.js} +1 -1
- package/dist/swirl-components/{p-a5b60e79.entry.js → p-d15c30a4.entry.js} +1 -1
- package/dist/swirl-components/{p-27aef8c4.entry.js → p-de6856c8.entry.js} +1 -1
- package/dist/swirl-components/{p-2e55fdaa.entry.js → p-f6d1648e.entry.js} +1 -1
- package/dist/swirl-components/{p-10019ad5.entry.js → p-f7532ba4.entry.js} +1 -1
- package/dist/swirl-components/{p-de2f3726.entry.js → p-f7e43e2f.entry.js} +1 -1
- package/dist/swirl-components/swirl-components.esm.js +1 -1
- package/dist/types/utils.d.ts +1 -0
- package/package.json +1 -1
- package/dist/swirl-components/p-2d79b467.entry.js +0 -1
- package/dist/swirl-components/p-4b826622.entry.js +0 -1
- package/dist/swirl-components/p-81ca5135.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as i,c as a,h as e,H as t}from"./p-e212b5b7.js";import{c as s}from"./p-a5dce9e6.js";import{d as n}from"./p-
|
|
1
|
+
import{r as i,c as a,h as e,H as t}from"./p-e212b5b7.js";import{c as s}from"./p-a5dce9e6.js";import{d as n}from"./p-58abf3c6.js";const o=class{constructor(e){i(this,e),this.setPage=a(this,"setPage",7),this.setPageSize=a(this,"setPageSize",7),this.onFocusPageInput=i=>{i.target.select()},this.onFirstPageButtonClick=()=>{1!==this.page&&this.setPage.emit(1)},this.onLastPageButtonClick=()=>{this.page!==this.pages&&this.setPage.emit(this.pages)},this.onPrevButtonClick=()=>{const i=Math.max(this.page-1,1);this.page!==i&&this.setPage.emit(i)},this.onNextButtonClick=()=>{const i=Math.min(this.page+1,this.pages);this.page!==i&&this.setPage.emit(i)},this.onPageInput=()=>{let i=+this.pageInput.value;isNaN(i)?(i=this.page,this.pageInput.value=String(i)):i>this.pages?(i=this.pages,this.pageInput.value=String(i)):i<1&&(i=1,this.pageInput.value=String(i)),this.page!==i&&this.onPageUpdate(i)},this.onPageUpdate=n((i=>{this.setPage.emit(i)}),500),this.onPageSizeSelect=i=>{const a=+i.target.value;this.pageSize!==a&&this.setPageSize.emit(a)},this.firstPageButtonLabel="First page",this.lastPageButtonLabel="Last page",this.label=void 0,this.nextButtonLabel="Next page",this.page=void 0,this.pageLabel="out of",this.pages=void 0,this.pageSelectLabel="Select a page",this.pageSize=10,this.pageSizeOptions=[10,25,50],this.pageSizeSelectLabel="Items per page:",this.prevButtonLabel="Previous page",this.showPageSizeSelect=void 0,this.variant="default"}render(){const i="simple"!==this.variant,a="advanced"===this.variant,n=`${this.page.toLocaleString()} ${this.pageLabel} ${this.pages.toLocaleString()}`,o=s("pagination",`pagination--variant-${this.variant}`);return e(t,{key:"19ef10f877c70e8ff494e02e2f4aa5517b08d174"},e("nav",{key:"5444d4c520425cec52c306308080494990f80911","aria-label":this.label,class:o},e("ul",{key:"def276c2ef95853df1ad271de739d5b0d866ce93",class:"pagination__list",part:"pagination__list"},this.showPageSizeSelect&&e("li",{key:"03b027b48bdc30ab1749c1d0cf87695f38c009b7",class:"pagination__list-item"},e("label",{key:"9b651fb7a48972ab433f98a6ab2a939654d21637",class:"pagination__page-size-selection"},e("swirl-text",{key:"2be473479b617d2ed6f1beb918d2b6cb828b8f14"},this.pageSizeSelectLabel),e("swirl-stack",{key:"2eaa59de79fac45847f61c5849fc9fef22e25a95",align:"center",class:"pagination__page-size-select-container",orientation:"horizontal"},e("select",{key:"e4db400bf40baa6cafaaf6c5cdfc561fa9358cb1",class:"pagination__page-size-select",onChange:this.onPageSizeSelect},this.pageSizeOptions.map((i=>e("option",{key:i,selected:i===this.pageSize,value:i},i)))),e("swirl-icon-expand-more",{key:"f427d80ecf63e91eeb9b81ac5a431609858265bc","aria-hidden":"true",class:"pagination__page-size-select-icon",size:16})))),e("li",{key:"0d03e0be976c4aad6cfa859c02f75fff0310d1a7",class:"pagination__list-item"},e("swirl-button",{key:"a6c57c7adb05b54895db39c351a922abc7031a51",class:"pagination__first-page-button",disabled:this.page<=1,hideLabel:!0,icon:"<swirl-icon-double-arrow-left></swirl-icon-double-arrow-left>",intent:"primary",label:this.firstPageButtonLabel,onClick:this.onFirstPageButtonClick})),e("li",{key:"837c9d21d8f25eb3673a4deadf4c3036454335d4",class:"pagination__list-item"},e("swirl-button",{key:"7f974e2774fb40fcaf35a8ea6a0675f2b9904ce8",class:"pagination__prev-button",disabled:this.page<=1,hideLabel:!0,icon:"<swirl-icon-chevron-left></swirl-icon-chevron-left>",intent:"primary",label:this.prevButtonLabel,onClick:this.onPrevButtonClick})),i?e("li",{class:"pagination__list-item pagination__page-label"},e("span",null,a?e("span",{"aria-current":"page",class:"pagination__advanced-label"},e("input",{"aria-label":this.pageSelectLabel,class:"pagination__page-input",onFocus:this.onFocusPageInput,onInput:this.onPageInput,ref:i=>this.pageInput=i,type:"text",value:this.page}),e("span",{"aria-hidden":"true"},this.pageLabel," ",this.pages.toLocaleString())):e("span",{"aria-current":"page"},n))):e("li",{class:"pagination__list-item"},e("swirl-visually-hidden",null,e("span",{"aria-current":"page"},n))),e("li",{key:"eeed63aaaecf4e7f245e253aa395c7857dc320a5",class:"pagination__list-item"},e("swirl-button",{key:"c2ebb6e8d9333833832616d34781dc4c959c1e31",class:"pagination__next-button",disabled:this.page>=this.pages,hideLabel:!0,icon:"<swirl-icon-chevron-right></swirl-icon-chevron-right>",iconPosition:"end",intent:"primary",label:this.nextButtonLabel,onClick:this.onNextButtonClick})),e("li",{key:"627ed42cf6d79604ca88d4441fc5ead9386b2bed",class:"pagination__list-item"},e("swirl-button",{key:"d6c53b82e9445f57a1b3f0629e9a98e8a7a93b6c",class:"pagination__last-page-button",disabled:this.page>=this.pages,hideLabel:!0,icon:"<swirl-icon-double-arrow-right></swirl-icon-double-arrow-right>",intent:"primary",label:this.lastPageButtonLabel,onClick:this.onLastPageButtonClick})))))}};o.style=":host{display:block;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:host *{box-sizing:border-box}.pagination{display:block;width:100%}.pagination--variant-simple .pagination__list{gap:0}.pagination__list{display:flex;margin:0;padding:0;justify-content:flex-start;align-items:center;line-height:var(--s-line-height-base);list-style:none}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.pagination__list{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.pagination__page-size-selection{display:flex;padding-right:var(--s-space-24);flex-shrink:0;align-items:center;color:var(--s-interactive-primary-default);white-space:nowrap;gap:var(--s-space-8)}.pagination__page-size-select-container{position:relative}.pagination__page-size-select{padding-right:calc(1rem + var(--s-space-4));border:none;color:var(--s-interactive-primary-default);background-color:transparent;font:inherit;font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.pagination__page-size-select:focus:not(:focus-visible){outline:none}.pagination__page-size-select:focus-visible{outline-color:var(--s-focus-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.pagination__page-size-select{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.pagination__page-size-select-icon{position:absolute;top:50%;right:0;transform:translateY(-50%);pointer-events:none}.pagination__page-label{padding-right:var(--s-space-8);padding-left:var(--s-space-8)}.pagination__advanced-label{display:flex;align-items:center;white-space:nowrap;gap:var(--s-space-8)}.pagination__page-input{display:inline-flex;width:3.25rem;padding-top:var(--s-space-8);padding-right:var(--s-space-8);padding-bottom:var(--s-space-8);padding-left:var(--s-space-8);border:none;border-radius:var(--s-border-radius-sm);background-color:transparent;font:inherit;line-height:var(--s-line-height-base);text-align:center;box-shadow:inset 0 0 0 var(--s-border-width-default) var(--s-border-strong)}.pagination__page-input:focus:not(:focus-visible){outline:none}.pagination__page-input:focus-visible{outline-color:var(--s-focus-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.pagination__page-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}";export{o as swirl_pagination}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as o,c as e,h as t,H as i,g as s}from"./p-e212b5b7.js";import{o as r,s as n,f as a,c as p,a as h}from"./p-bc0de553.js";import{d,e as c}from"./p-33c168b3.js";import{c as l}from"./p-a5dce9e6.js";import{i as v,q as m,b as f}from"./p-81ca5135.js";const u=class{constructor(t){o(this,t),this.popoverClose=e(this,"popoverClose",7),this.popoverOpen=e(this,"popoverOpen",7),this.toggle=o=>{o.stopPropagation(),this.active?this.close():this.open()},this.onKeydown=o=>{"Escape"===o.code&&this.active&&(o.stopImmediatePropagation(),o.stopPropagation(),this.close())},this.reposition=async()=>{const o=v();if(!Boolean(this.triggerEl)||!Boolean(this.contentContainer))return;if(o)return void(this.position=void 0);const e="number"==typeof this.offset?{mainAxis:this.offset,crossAxis:0}:{mainAxis:this.offset[0],crossAxis:this.offset[1]},t=this.enableFlip?[r(e),n(),a()]:[r(e),n()];this.position=await p(this.triggerEl,this.contentContainer,{middleware:t,placement:this.placement,strategy:"fixed"})},this.onCloseButtonClick=()=>{this.close()},this.animation="scale-in-xy",this.disableScrollLock=void 0,this.enableFlip=!0,this.fullscreenBottomSheet=void 0,this.label=void 0,this.maxHeight="22rem",this.offset=8,this.popoverId=void 0,this.placement="bottom-start",this.returnFocusToTrigger=!0,this.transparent=void 0,this.trigger=void 0,this.triggerContainer=void 0,this.useContainerWidth=void 0,this.active=!1,this.closing=!1,this.position=void 0}componentDidLoad(){this.connectTrigger(),this.updateTriggerAttributes(),Boolean(this.trigger)&&console.warn('[Swirl] The "trigger" prop of swirl-popover is deprecated and will be removed with the next major release. Please use the swirl-popover-trigger component instead. https://swirl-storybook.flip-app.dev/?path=/docs/components-swirlpopovertrigger--docs')}disconnectedCallback(){this.unlockBodyScroll()}onWindowFocusIn(o){if(!this.active)return;const e=/^((?!chrome|android).)*safari/i.test(navigator.userAgent),t="webkit"in window,i=e||t,s=o.target,r=o.relatedTarget,n=f(),a=!this.el.contains(s)&&!this.el.contains(n),p=s!==this.triggerEl&&!this.triggerEl?.contains(s),h=i&&!this.el.contains(r||s)&&r!==this.el;["SWIRL-TAB"].includes(s.tagName)||!a||!p||i&&!h||this.close()}onWindowClick(o){if(!this.active||this.closing)return;const e=o.target,t=this.el.contains(e),i=o.composedPath().some((o=>!!(Boolean(o)&&o instanceof Node)&&this.el.contains(o))),s=e===this.triggerEl||this.triggerEl.contains(e)||o.composedPath().includes(this.triggerEl);t||i||s||this.close()}async close(o){!this.closing&&this.active&&(this.popoverClose.emit(),this.disableAutoUpdate&&this.disableAutoUpdate(),this.closing=!0,setTimeout((()=>{this.active=!1,this.closing=!1,this.updateTriggerAttributes()}),150),this.unlockBodyScroll(),this.returnFocusToTrigger&&!o&&this.getNativeTriggerElement()?.focus())}async open(o,e){if(this.triggerEl=o||this.triggerEl,this.active||!Boolean(this.triggerEl))return;this.adjustWidth(),this.active=!0,this.updateTriggerAttributes();const t=this.getFocusableChildren();requestAnimationFrame((async()=>{await this.reposition(),this.popoverOpen.emit({position:this.position}),t.length>0&&!e?t[0].focus():e||this.contentContainer.focus(),this.disableAutoUpdate&&this.disableAutoUpdate(),this.disableAutoUpdate=h(this.triggerEl,this.contentContainer,(()=>this.reposition())),this.scrollContainer.scrollTop=0,this.lockBodyScroll()}))}connectTrigger(){Boolean(this.trigger)?(this.triggerEl="string"==typeof this.trigger?m(this.triggerContainer||document.body,`#${this.trigger}`)[0]:this.trigger,Boolean(this.triggerEl)&&this.triggerEl.addEventListener("click",(o=>{this.toggle(o)}))):this.triggerEl=void 0}getNativeTriggerElement(){return this.triggerEl?.tagName.startsWith("SWIRL-")&&(this.triggerEl?.children[0]||this.triggerEl?.shadowRoot?.children[0])||this.triggerEl}updateTriggerAttributes(){if(!Boolean(this.triggerEl))return;const o=this.getNativeTriggerElement();o.setAttribute("aria-controls",this.el.id),o.setAttribute("aria-expanded",String(this.active)),o.setAttribute("aria-haspopup","dialog")}getFocusableChildren(){return m(this.el,'[role="menuitem"], [role="listbox"]')}adjustWidth(){let o=this.useContainerWidth;[!0,"true"].includes(this.useContainerWidth)?o=!0:[!1,"false"].includes(this.useContainerWidth)&&(o=!1);const e=!window.matchMedia("(min-width: 768px)").matches;if(Boolean(o)&&!e){const e="string"==typeof o&&this.el.closest(o)||this.el.parentElement;this.contentContainer.style.maxWidth="none",this.contentContainer.style.width=e.getBoundingClientRect().width+"px"}else this.contentContainer.style.maxWidth="",this.contentContainer.style.width=""}lockBodyScroll(){v()&&!this.disableScrollLock&&Boolean(this.scrollContainer)&&d(this.scrollContainer)}unlockBodyScroll(){v()&&!this.disableScrollLock&&Boolean(this.scrollContainer)&&c(this.scrollContainer)}render(){const o=!window.matchMedia("(min-width: 768px)").matches,e=l("popover",`popover--animation-${this.animation}`,`popover--placement-${this.position?.placement}`,{"popover--active":this.active,"popover--closing":this.closing,"popover--fullscreen-bottom-sheet":this.fullscreenBottomSheet,"popover--inactive":!this.active,"popover--transparent":this.transparent});return t(i,{key:"692a870e17c4c5c9ce3d6bfb8459d915efd1fe6f"},t("div",{key:"c031461b075fa806d9976f147de6983206f2c699",class:e,onKeyDown:this.onKeydown},t("div",{key:"3627e2e25adb1dd575303faf991d812e5bf546ed","aria-hidden":this.active?"false":"true","aria-label":this.label,class:"popover__content",id:this.popoverId,part:"popover__content",role:"dialog",ref:o=>this.contentContainer=o,style:{top:Boolean(this.position)?`${this.position?.y}px`:"",left:Boolean(this.position)?`${this.position?.x}px`:""},tabindex:"-1"},t("span",{key:"5322b500a903544e1bf8978d891a1a1a448b3a6c",class:"popover__handle"}),t("div",{key:"bb996f4c4687d89009d4f9a63f1dffdbdca8e2b8",class:"popover__scroll-container",part:"popover__scroll-container",ref:o=>this.scrollContainer=o,style:{maxHeight:!o&&Boolean(this.maxHeight)?this.maxHeight:void 0}},t("slot",{key:"0e822963d0e9d0c34c5374a4f50521cea0fda8a8"}))),this.active&&t("div",{key:"4e0d20a700f104a17eb9b708699dd34901e3882c",class:"popover__backdrop",onClick:this.onCloseButtonClick})))}get el(){return s(this)}};u.style=":host{position:relative;z-index:var(--s-z-40);display:inline-flex}:host *{box-sizing:border-box}.popover--active:not(.popover--closing) .popover__backdrop{animation:0.15s popover-fade-in}@media (prefers-reduced-motion){.popover--active:not(.popover--closing) .popover__backdrop{animation:none}}.popover--active:not(.popover--closing) .popover__content{animation:0.15s popover-slide-in}@media (min-width: 768px){.popover--active:not(.popover--closing) .popover__content{transform-origin:top left;animation:0.15s popover-fade-scale-in-xy}}@media (prefers-reduced-motion){.popover--active:not(.popover--closing) .popover__content{animation:none}}.popover--closing .popover__backdrop{animation:0.15s popover-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.popover--closing .popover__backdrop{animation:none}}.popover--closing .popover__content{animation:0.15s popover-slide-out;animation-fill-mode:forwards}@media (min-width: 768px){.popover--closing .popover__content{animation:0.15s popover-fade-out}}@media (prefers-reduced-motion){.popover--closing .popover__content{animation:none}}.popover--inactive .popover__content{display:none}@media (max-width: 767px){.popover--fullscreen-bottom-sheet.popover--active:not(.popover--closing) .popover__content{animation:0.15s popover-fade-in}@media (prefers-reduced-motion){.popover--fullscreen-bottom-sheet.popover--active:not(.popover--closing) .popover__content{animation:none}}.popover--fullscreen-bottom-sheet.popover--closing .popover__content{animation:0.15s popover-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.popover--fullscreen-bottom-sheet.popover--closing .popover__content{animation:none}}.popover--fullscreen-bottom-sheet .popover__backdrop{display:none}.popover--fullscreen-bottom-sheet .popover__content{top:0;border-top-left-radius:0;border-top-right-radius:0}.popover--fullscreen-bottom-sheet .popover__scroll-container{height:100%;max-height:none;padding-top:0;padding-bottom:0}.popover--fullscreen-bottom-sheet .popover__handle{display:none}}@media (min-width: 768px){.popover--animation-scale-in-y.popover--active:not(.popover--closing) .popover__content{animation:0.15s popover-fade-scale-in-y}}@media (prefers-reduced-motion){.popover--animation-scale-in-y.popover--active:not(.popover--closing) .popover__content{animation:none}}@media (min-width: 768px){.popover--animation-fade-in.popover--active:not(.popover--closing) .popover__content{animation:0.15s popover-fade-in}}@media (prefers-reduced-motion){.popover--animation-fade-in.popover--active:not(.popover--closing) .popover__content{animation:none}}@media (min-width: 768px){.popover--transparent .popover__content{background-color:transparent;box-shadow:none}}@media (min-width: 768px){.popover--transparent .popover__scroll-container{padding:0}}.popover__backdrop{position:fixed;z-index:0;background-color:rgba(0, 0, 0, 0.2);animation:0.15s popover-backdrop-fade-in;inset:0}@media (prefers-reduced-motion){.popover__backdrop{animation:none}}@media (min-width: 768px){.popover__backdrop{display:none}}.popover__content{position:fixed;z-index:2;right:0;bottom:0;left:0;overflow:hidden;border-top-left-radius:var(--s-border-radius-xl);border-top-right-radius:var(--s-border-radius-xl);background-color:var(--s-surface-overlay-default)}@media (min-width: 768px){.popover__content{right:unset;bottom:unset;left:unset;max-width:22.5rem;border-radius:var(--s-border-radius-sm);animation:none;box-shadow:var(--s-shadow-level-2)}}.popover__scroll-container{overflow-x:hidden;overflow-y:auto;width:100%;max-height:90vh;padding-top:var(--s-space-24);padding-bottom:var(--s-space-24);overscroll-behavior:contain}@media (min-width: 768px){.popover__scroll-container{max-height:22rem;padding-top:var(--s-space-8);padding-bottom:var(--s-space-8)}}.popover__handle{position:absolute;top:var(--s-space-8);left:50%;width:2.5rem;height:0.375rem;border-radius:0.1875rem;background-color:var(--s-border-default);transform:translatex(-50%)}@media (min-width: 768px){.popover__handle{display:none}}@keyframes popover-slide-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes popover-slide-out{from{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes popover-fade-in{from{opacity:0}to{opacity:1}}@keyframes popover-fade-out{from{opacity:1}to{opacity:0}}@keyframes popover-fade-scale-in-xy{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes popover-fade-scale-in-y{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}";const g=class{constructor(e){o(this,e),this.triggerIsActive=!1,this.popoverMouseEnter=()=>{this.stopHoverLingerTimer()},this.popoverMouseLeave=()=>{this.triggerIsActive&&this.mouseleaveHandler()},this.onMouseenter=()=>{this.triggerOnHover&&(this.stopHoverLingerTimer(),this.triggerIsActive=!0,this.hoverDelayReference=setTimeout((()=>{this.hoverDelayReference=void 0,this.triggerOnHover&&this.mouseenterHandler()}),this.hoverDelay))},this.mouseenterHandler=()=>{const o=this.getPopoverEl(),e=this.getTriggerEl();o.open(e,!0),o.addEventListener("popoverOpen",(()=>{this.updateTriggerElAriaAttributes(!0)}),{once:!0}),o.addEventListener("popoverClose",(()=>{this.updateTriggerElAriaAttributes(!1)}),{once:!0})},this.onMouseleave=()=>{clearTimeout(this.hoverDelayReference),this.mouseleaveHandler()},this.mouseleaveHandler=()=>{this.triggerOnHover&&this.startHoverLingerTimer()},this.onClick=()=>{if(!this.triggerOnClick)return;const o=this.getPopoverEl(),e=this.getTriggerEl();o.open(e),o.addEventListener("popoverOpen",(()=>{this.updateTriggerElAriaAttributes(!0)}),{once:!0}),o.addEventListener("popoverClose",(()=>{this.updateTriggerElAriaAttributes(!1)}),{once:!0})},this.updateTriggerElAriaAttributes=o=>{if(!this.setAriaAttributes)return;const e=this.getTriggerEl();if(!Boolean(e))return;const t="string"==typeof this.swirlPopover?this.swirlPopover:this.swirlPopover?.id;e.tagName.startsWith("SWIRL-")?(e.setAttribute("swirl-aria-controls",t),e.setAttribute("swirl-aria-expanded",String(o||"false")),e.setAttribute("swirl-aria-haspopup","dialog")):(e.setAttribute("aria-controls",t),e.setAttribute("aria-expanded",String(o||"false")),e.setAttribute("aria-haspopup","dialog"))},this.hidePopoverWhenInvisible=!0,this.parentScrollContainer=void 0,this.setAriaAttributes=!0,this.swirlPopover=void 0,this.triggerOnClick=!0,this.triggerOnHover=!1,this.hoverLingerDuration=void 0,this.hoverDelay=void 0}componentDidLoad(){if(this.updateTriggerElAriaAttributes(),this.setupHoverListeners(),this.hidePopoverWhenInvisible){this.intersectionObserver=new IntersectionObserver(this.onVisibilityChange.bind(this),{root:this.parentScrollContainer,threshold:1});const o=this.el.querySelector("*");if(!Boolean(o))return;this.intersectionObserver.observe(o)}}disconnectedCallback(){this.intersectionObserver?.disconnect();const o=this.getPopoverEl();Boolean(o)&&(o.removeEventListener("mouseenter",this.popoverMouseEnter),o.removeEventListener("mouseleave",this.popoverMouseLeave))}watchPopover(){this.updateTriggerElAriaAttributes()}watchHover(){clearTimeout(this.hoverDelayReference),clearTimeout(this.hoverLingerReference)}getPopoverEl(){return"string"==typeof this.swirlPopover?document.querySelector(`#${this.swirlPopover}`):this.swirlPopover}getTriggerEl(){return 1!==this.el.children.length&&console.warn('[Swirl] The "swirl-popover-trigger" component expects exactly one child element.'),this.el.children[0]}onVisibilityChange(o){!o[0].isIntersecting&&this.isPopoverOpen()&&this.getPopoverEl()?.close()}setupHoverListeners(){const o=this.getPopoverEl();Boolean(o)&&(o.addEventListener("mouseenter",this.popoverMouseEnter),o.addEventListener("mouseleave",this.popoverMouseLeave))}startHoverLingerTimer(){clearTimeout(this.hoverLingerReference),this.hoverLingerReference=setTimeout((()=>{this.triggerIsActive&&this.isPopoverOpen()&&this.getPopoverEl().close(!0),this.triggerIsActive=!1}),this.hoverLingerDuration)}stopHoverLingerTimer(){clearTimeout(this.hoverLingerReference)}isPopoverOpen(){const o=this.getPopoverEl(),e=o?.shadowRoot.firstChild?.classList.contains("popover--active");return e}render(){return t(i,{key:"1d4fc7e58ca45eef5cb04819db1e149285dbe330",onClick:this.onClick,onMouseenter:this.onMouseenter,onMouseleave:this.onMouseleave},t("slot",{key:"013ab97b6925f02581f6892f0dea59030d5cbf5f"}))}get el(){return s(this)}static get watchers(){return{swirlPopover:["watchPopover"],triggerOnHover:["watchHover"]}}};g.style=".sc-swirl-popover-trigger-h{display:contents}";export{u as swirl_popover,g as swirl_popover_trigger}
|
|
1
|
+
import{r as o,c as e,h as t,H as i,g as s}from"./p-e212b5b7.js";import{o as r,s as n,f as a,c as p,a as h}from"./p-bc0de553.js";import{d,e as c}from"./p-33c168b3.js";import{c as l}from"./p-a5dce9e6.js";import{i as v,q as m,b as f}from"./p-58abf3c6.js";const u=class{constructor(t){o(this,t),this.popoverClose=e(this,"popoverClose",7),this.popoverOpen=e(this,"popoverOpen",7),this.toggle=o=>{o.stopPropagation(),this.active?this.close():this.open()},this.onKeydown=o=>{"Escape"===o.code&&this.active&&(o.stopImmediatePropagation(),o.stopPropagation(),this.close())},this.reposition=async()=>{const o=v();if(!Boolean(this.triggerEl)||!Boolean(this.contentContainer))return;if(o)return void(this.position=void 0);const e="number"==typeof this.offset?{mainAxis:this.offset,crossAxis:0}:{mainAxis:this.offset[0],crossAxis:this.offset[1]},t=this.enableFlip?[r(e),n(),a()]:[r(e),n()];this.position=await p(this.triggerEl,this.contentContainer,{middleware:t,placement:this.placement,strategy:"fixed"})},this.onCloseButtonClick=()=>{this.close()},this.animation="scale-in-xy",this.disableScrollLock=void 0,this.enableFlip=!0,this.fullscreenBottomSheet=void 0,this.label=void 0,this.maxHeight="22rem",this.offset=8,this.popoverId=void 0,this.placement="bottom-start",this.returnFocusToTrigger=!0,this.transparent=void 0,this.trigger=void 0,this.triggerContainer=void 0,this.useContainerWidth=void 0,this.active=!1,this.closing=!1,this.position=void 0}componentDidLoad(){this.connectTrigger(),this.updateTriggerAttributes(),Boolean(this.trigger)&&console.warn('[Swirl] The "trigger" prop of swirl-popover is deprecated and will be removed with the next major release. Please use the swirl-popover-trigger component instead. https://swirl-storybook.flip-app.dev/?path=/docs/components-swirlpopovertrigger--docs')}disconnectedCallback(){this.unlockBodyScroll()}onWindowFocusIn(o){if(!this.active)return;const e=/^((?!chrome|android).)*safari/i.test(navigator.userAgent),t="webkit"in window,i=e||t,s=o.target,r=o.relatedTarget,n=f(),a=!this.el.contains(s)&&!this.el.contains(n),p=s!==this.triggerEl&&!this.triggerEl?.contains(s),h=i&&!this.el.contains(r||s)&&r!==this.el;["SWIRL-TAB"].includes(s.tagName)||!a||!p||i&&!h||this.close()}onWindowClick(o){if(!this.active||this.closing)return;const e=o.target,t=this.el.contains(e),i=o.composedPath().some((o=>!!(Boolean(o)&&o instanceof Node)&&this.el.contains(o))),s=e===this.triggerEl||this.triggerEl.contains(e)||o.composedPath().includes(this.triggerEl);t||i||s||this.close()}async close(o){!this.closing&&this.active&&(this.popoverClose.emit(),this.disableAutoUpdate&&this.disableAutoUpdate(),this.closing=!0,setTimeout((()=>{this.active=!1,this.closing=!1,this.updateTriggerAttributes()}),150),this.unlockBodyScroll(),this.returnFocusToTrigger&&!o&&this.getNativeTriggerElement()?.focus())}async open(o,e){if(this.triggerEl=o||this.triggerEl,this.active||!Boolean(this.triggerEl))return;this.adjustWidth(),this.active=!0,this.updateTriggerAttributes();const t=this.getFocusableChildren();requestAnimationFrame((async()=>{await this.reposition(),this.popoverOpen.emit({position:this.position}),t.length>0&&!e?t[0].focus():e||this.contentContainer.focus(),this.disableAutoUpdate&&this.disableAutoUpdate(),this.disableAutoUpdate=h(this.triggerEl,this.contentContainer,(()=>this.reposition())),this.scrollContainer.scrollTop=0,this.lockBodyScroll()}))}connectTrigger(){Boolean(this.trigger)?(this.triggerEl="string"==typeof this.trigger?m(this.triggerContainer||document.body,`#${this.trigger}`)[0]:this.trigger,Boolean(this.triggerEl)&&this.triggerEl.addEventListener("click",(o=>{this.toggle(o)}))):this.triggerEl=void 0}getNativeTriggerElement(){return this.triggerEl?.tagName.startsWith("SWIRL-")&&(this.triggerEl?.children[0]||this.triggerEl?.shadowRoot?.children[0])||this.triggerEl}updateTriggerAttributes(){if(!Boolean(this.triggerEl))return;const o=this.getNativeTriggerElement();o.setAttribute("aria-controls",this.el.id),o.setAttribute("aria-expanded",String(this.active)),o.setAttribute("aria-haspopup","dialog")}getFocusableChildren(){return m(this.el,'[role="menuitem"], [role="listbox"]')}adjustWidth(){let o=this.useContainerWidth;[!0,"true"].includes(this.useContainerWidth)?o=!0:[!1,"false"].includes(this.useContainerWidth)&&(o=!1);const e=!window.matchMedia("(min-width: 768px)").matches;if(Boolean(o)&&!e){const e="string"==typeof o&&this.el.closest(o)||this.el.parentElement;this.contentContainer.style.maxWidth="none",this.contentContainer.style.width=e.getBoundingClientRect().width+"px"}else this.contentContainer.style.maxWidth="",this.contentContainer.style.width=""}lockBodyScroll(){v()&&!this.disableScrollLock&&Boolean(this.scrollContainer)&&d(this.scrollContainer)}unlockBodyScroll(){v()&&!this.disableScrollLock&&Boolean(this.scrollContainer)&&c(this.scrollContainer)}render(){const o=!window.matchMedia("(min-width: 768px)").matches,e=l("popover",`popover--animation-${this.animation}`,`popover--placement-${this.position?.placement}`,{"popover--active":this.active,"popover--closing":this.closing,"popover--fullscreen-bottom-sheet":this.fullscreenBottomSheet,"popover--inactive":!this.active,"popover--transparent":this.transparent});return t(i,{key:"692a870e17c4c5c9ce3d6bfb8459d915efd1fe6f"},t("div",{key:"c031461b075fa806d9976f147de6983206f2c699",class:e,onKeyDown:this.onKeydown},t("div",{key:"3627e2e25adb1dd575303faf991d812e5bf546ed","aria-hidden":this.active?"false":"true","aria-label":this.label,class:"popover__content",id:this.popoverId,part:"popover__content",role:"dialog",ref:o=>this.contentContainer=o,style:{top:Boolean(this.position)?`${this.position?.y}px`:"",left:Boolean(this.position)?`${this.position?.x}px`:""},tabindex:"-1"},t("span",{key:"5322b500a903544e1bf8978d891a1a1a448b3a6c",class:"popover__handle"}),t("div",{key:"bb996f4c4687d89009d4f9a63f1dffdbdca8e2b8",class:"popover__scroll-container",part:"popover__scroll-container",ref:o=>this.scrollContainer=o,style:{maxHeight:!o&&Boolean(this.maxHeight)?this.maxHeight:void 0}},t("slot",{key:"0e822963d0e9d0c34c5374a4f50521cea0fda8a8"}))),this.active&&t("div",{key:"4e0d20a700f104a17eb9b708699dd34901e3882c",class:"popover__backdrop",onClick:this.onCloseButtonClick})))}get el(){return s(this)}};u.style=":host{position:relative;z-index:var(--s-z-40);display:inline-flex}:host *{box-sizing:border-box}.popover--active:not(.popover--closing) .popover__backdrop{animation:0.15s popover-fade-in}@media (prefers-reduced-motion){.popover--active:not(.popover--closing) .popover__backdrop{animation:none}}.popover--active:not(.popover--closing) .popover__content{animation:0.15s popover-slide-in}@media (min-width: 768px){.popover--active:not(.popover--closing) .popover__content{transform-origin:top left;animation:0.15s popover-fade-scale-in-xy}}@media (prefers-reduced-motion){.popover--active:not(.popover--closing) .popover__content{animation:none}}.popover--closing .popover__backdrop{animation:0.15s popover-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.popover--closing .popover__backdrop{animation:none}}.popover--closing .popover__content{animation:0.15s popover-slide-out;animation-fill-mode:forwards}@media (min-width: 768px){.popover--closing .popover__content{animation:0.15s popover-fade-out}}@media (prefers-reduced-motion){.popover--closing .popover__content{animation:none}}.popover--inactive .popover__content{display:none}@media (max-width: 767px){.popover--fullscreen-bottom-sheet.popover--active:not(.popover--closing) .popover__content{animation:0.15s popover-fade-in}@media (prefers-reduced-motion){.popover--fullscreen-bottom-sheet.popover--active:not(.popover--closing) .popover__content{animation:none}}.popover--fullscreen-bottom-sheet.popover--closing .popover__content{animation:0.15s popover-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.popover--fullscreen-bottom-sheet.popover--closing .popover__content{animation:none}}.popover--fullscreen-bottom-sheet .popover__backdrop{display:none}.popover--fullscreen-bottom-sheet .popover__content{top:0;border-top-left-radius:0;border-top-right-radius:0}.popover--fullscreen-bottom-sheet .popover__scroll-container{height:100%;max-height:none;padding-top:0;padding-bottom:0}.popover--fullscreen-bottom-sheet .popover__handle{display:none}}@media (min-width: 768px){.popover--animation-scale-in-y.popover--active:not(.popover--closing) .popover__content{animation:0.15s popover-fade-scale-in-y}}@media (prefers-reduced-motion){.popover--animation-scale-in-y.popover--active:not(.popover--closing) .popover__content{animation:none}}@media (min-width: 768px){.popover--animation-fade-in.popover--active:not(.popover--closing) .popover__content{animation:0.15s popover-fade-in}}@media (prefers-reduced-motion){.popover--animation-fade-in.popover--active:not(.popover--closing) .popover__content{animation:none}}@media (min-width: 768px){.popover--transparent .popover__content{background-color:transparent;box-shadow:none}}@media (min-width: 768px){.popover--transparent .popover__scroll-container{padding:0}}.popover__backdrop{position:fixed;z-index:0;background-color:rgba(0, 0, 0, 0.2);animation:0.15s popover-backdrop-fade-in;inset:0}@media (prefers-reduced-motion){.popover__backdrop{animation:none}}@media (min-width: 768px){.popover__backdrop{display:none}}.popover__content{position:fixed;z-index:2;right:0;bottom:0;left:0;overflow:hidden;border-top-left-radius:var(--s-border-radius-xl);border-top-right-radius:var(--s-border-radius-xl);background-color:var(--s-surface-overlay-default)}@media (min-width: 768px){.popover__content{right:unset;bottom:unset;left:unset;max-width:22.5rem;border-radius:var(--s-border-radius-sm);animation:none;box-shadow:var(--s-shadow-level-2)}}.popover__scroll-container{overflow-x:hidden;overflow-y:auto;width:100%;max-height:90vh;padding-top:var(--s-space-24);padding-bottom:var(--s-space-24);overscroll-behavior:contain}@media (min-width: 768px){.popover__scroll-container{max-height:22rem;padding-top:var(--s-space-8);padding-bottom:var(--s-space-8)}}.popover__handle{position:absolute;top:var(--s-space-8);left:50%;width:2.5rem;height:0.375rem;border-radius:0.1875rem;background-color:var(--s-border-default);transform:translatex(-50%)}@media (min-width: 768px){.popover__handle{display:none}}@keyframes popover-slide-in{from{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes popover-slide-out{from{transform:translateY(0)}to{transform:translateY(100%)}}@keyframes popover-fade-in{from{opacity:0}to{opacity:1}}@keyframes popover-fade-out{from{opacity:1}to{opacity:0}}@keyframes popover-fade-scale-in-xy{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes popover-fade-scale-in-y{from{transform:scaleY(0);opacity:0}to{transform:scaleY(1);opacity:1}}";const g=class{constructor(e){o(this,e),this.triggerIsActive=!1,this.popoverMouseEnter=()=>{this.stopHoverLingerTimer()},this.popoverMouseLeave=()=>{this.triggerIsActive&&this.mouseleaveHandler()},this.onMouseenter=()=>{this.triggerOnHover&&(this.stopHoverLingerTimer(),this.triggerIsActive=!0,this.hoverDelayReference=setTimeout((()=>{this.hoverDelayReference=void 0,this.triggerOnHover&&this.mouseenterHandler()}),this.hoverDelay))},this.mouseenterHandler=()=>{const o=this.getPopoverEl(),e=this.getTriggerEl();o.open(e,!0),o.addEventListener("popoverOpen",(()=>{this.updateTriggerElAriaAttributes(!0)}),{once:!0}),o.addEventListener("popoverClose",(()=>{this.updateTriggerElAriaAttributes(!1)}),{once:!0})},this.onMouseleave=()=>{clearTimeout(this.hoverDelayReference),this.mouseleaveHandler()},this.mouseleaveHandler=()=>{this.triggerOnHover&&this.startHoverLingerTimer()},this.onClick=()=>{if(!this.triggerOnClick)return;const o=this.getPopoverEl(),e=this.getTriggerEl();o.open(e),o.addEventListener("popoverOpen",(()=>{this.updateTriggerElAriaAttributes(!0)}),{once:!0}),o.addEventListener("popoverClose",(()=>{this.updateTriggerElAriaAttributes(!1)}),{once:!0})},this.updateTriggerElAriaAttributes=o=>{if(!this.setAriaAttributes)return;const e=this.getTriggerEl();if(!Boolean(e))return;const t="string"==typeof this.swirlPopover?this.swirlPopover:this.swirlPopover?.id;e.tagName.startsWith("SWIRL-")?(e.setAttribute("swirl-aria-controls",t),e.setAttribute("swirl-aria-expanded",String(o||"false")),e.setAttribute("swirl-aria-haspopup","dialog")):(e.setAttribute("aria-controls",t),e.setAttribute("aria-expanded",String(o||"false")),e.setAttribute("aria-haspopup","dialog"))},this.hidePopoverWhenInvisible=!0,this.parentScrollContainer=void 0,this.setAriaAttributes=!0,this.swirlPopover=void 0,this.triggerOnClick=!0,this.triggerOnHover=!1,this.hoverLingerDuration=void 0,this.hoverDelay=void 0}componentDidLoad(){if(this.updateTriggerElAriaAttributes(),this.setupHoverListeners(),this.hidePopoverWhenInvisible){this.intersectionObserver=new IntersectionObserver(this.onVisibilityChange.bind(this),{root:this.parentScrollContainer,threshold:1});const o=this.el.querySelector("*");if(!Boolean(o))return;this.intersectionObserver.observe(o)}}disconnectedCallback(){this.intersectionObserver?.disconnect();const o=this.getPopoverEl();Boolean(o)&&(o.removeEventListener("mouseenter",this.popoverMouseEnter),o.removeEventListener("mouseleave",this.popoverMouseLeave))}watchPopover(){this.updateTriggerElAriaAttributes()}watchHover(){clearTimeout(this.hoverDelayReference),clearTimeout(this.hoverLingerReference)}getPopoverEl(){return"string"==typeof this.swirlPopover?document.querySelector(`#${this.swirlPopover}`):this.swirlPopover}getTriggerEl(){return 1!==this.el.children.length&&console.warn('[Swirl] The "swirl-popover-trigger" component expects exactly one child element.'),this.el.children[0]}onVisibilityChange(o){!o[0].isIntersecting&&this.isPopoverOpen()&&this.getPopoverEl()?.close()}setupHoverListeners(){const o=this.getPopoverEl();Boolean(o)&&(o.addEventListener("mouseenter",this.popoverMouseEnter),o.addEventListener("mouseleave",this.popoverMouseLeave))}startHoverLingerTimer(){clearTimeout(this.hoverLingerReference),this.hoverLingerReference=setTimeout((()=>{this.triggerIsActive&&this.isPopoverOpen()&&this.getPopoverEl().close(!0),this.triggerIsActive=!1}),this.hoverLingerDuration)}stopHoverLingerTimer(){clearTimeout(this.hoverLingerReference)}isPopoverOpen(){const o=this.getPopoverEl(),e=o?.shadowRoot.firstChild?.classList.contains("popover--active");return e}render(){return t(i,{key:"1d4fc7e58ca45eef5cb04819db1e149285dbe330",onClick:this.onClick,onMouseenter:this.onMouseenter,onMouseleave:this.onMouseleave},t("slot",{key:"013ab97b6925f02581f6892f0dea59030d5cbf5f"}))}get el(){return s(this)}static get watchers(){return{swirlPopover:["watchPopover"],triggerOnHover:["watchHover"]}}};g.style=".sc-swirl-popover-trigger-h{display:contents}";export{u as swirl_popover,g as swirl_popover_trigger}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as t,c as i,h as s,H as e,g as o}from"./p-e212b5b7.js";import{c as a,q as r}from"./p-81ca5135.js";import{S as n}from"./p-1486d7ea.js";import{c as h}from"./p-a5dce9e6.js";const l=class{constructor(s){t(this,s),this.itemDrop=i(this,"itemDrop",7),this.valueChange=i(this,"valueChange",7),this.onClick=t=>{t.preventDefault();const i=t.target,s=i?.closest("swirl-option-list-item"),e=t.composedPath()[0],o=Boolean(a(e,'[role="option"]'));Boolean(s)&&o?this.selectItem(this.items.findIndex((t=>t.value===s.value))):t.preventDefault()},this.onKeyDown=t=>{if("ArrowDown"===t.code)t.preventDefault(),Boolean(this.dragging)?this.moveDraggedItemDown():this.focusNextItem();else if("ArrowUp"===t.code)t.preventDefault(),Boolean(this.dragging)?this.moveDraggedItemUp():this.focusPreviousItem();else if("Space"===t.code||"Enter"===t.code){if(!t.target.classList.contains("option-list-item__drag-handle")&&Boolean(this.dragging))return t.preventDefault(),void this.stopDrag(this.dragging);const i=t.composedPath()[0];if(!Boolean(a(i,'[role="option"]')))return;t.preventDefault(),Boolean(this.dragging)?this.stopDrag(this.dragging):this.selectFocusedItem()}else"Home"===t.code?(t.preventDefault(),this.focusItem(0)):"End"===t.code?(t.preventDefault(),this.focusItem(this.items.length-1)):"KeyA"===t.code&&(t.metaKey||t.ctrlKey)&&this.multiSelect?(t.preventDefault(),this.selectAllItems()):"Tab"===t.code&&Boolean(this.dragging)&&t.preventDefault()},this.toggleDrag=t=>{const i=t.detail;Boolean(this.dragging)?this.stopDrag(i):this.startDrag(i)},this.startDrag=t=>{this.dragging=t,this.draggingStartIndex=this.getItemIndex(this.dragging),t.setAttribute("dragging","true");const i=this.getItemIndex(this.dragging);this.focusItem(i),this.assistiveText=this.assistiveTextItemGrabbed},this.stopDrag=t=>{this.dragging=void 0,t.removeAttribute("dragging");const i=this.getActiveItemIndex();this.assistiveText=`${this.assistiveTextItemMoved} ${i+1}`,this.itemDrop.emit({item:t,oldIndex:this.draggingStartIndex,newIndex:i}),this.draggingStartIndex=void 0,this.focusItem(i)},this.allowDeselect=!0,this.allowDrag=void 0,this.assistiveTextItemGrabbed="Item grabbed. Use arrow keys to move item up or down. Use spacebar to save position.",this.assistiveTextItemMoving="Current position:",this.assistiveTextItemMoved="Item moved. New position:",this.disabled=void 0,this.label=void 0,this.optionListId=void 0,this.multiSelect=void 0,this.value=[],this.assistiveText=void 0}componentDidLoad(){this.updateItems(),this.observeSlotChanges(),this.setItemAllowDragState(),this.setItemDisabledState(),this.setItemContext(),this.syncItemsWithValue(),this.setupDragDrop()}componentDidRender(){this.setupDragDrop()}disconnectedCallback(){this.observer?.disconnect(),this.sortable?.destroy()}watchAllowDrag(){this.setItemAllowDragState(),this.setupDragDrop()}watchDisabled(){this.setItemDisabledState()}watchMultiSelect(){this.setItemContext()}watchValue(){this.syncItemsWithValue()}observeSlotChanges(){this.observer=new MutationObserver((()=>{this.updateItems(),this.setItemAllowDragState(),this.setItemDisabledState(),this.setItemContext(),this.syncItemsWithValue()})),this.observer.observe(this.listboxEl,{childList:!0,subtree:!0})}updateItems(){this.items=r(this.el,"swirl-option-list-item"),this.items.forEach((t=>t.querySelector('[role="option"]')?.removeAttribute("tabIndex")));const t=this.items[0]?.querySelector('[role="option"]');Boolean(t)&&t.setAttribute("tabIndex","0")}setItemDisabledState(){this.disabled&&this.items.forEach((t=>t.disabled=!0))}setItemContext(){this.multiSelect?this.items.forEach((t=>t.context="multi-select")):(this.items.forEach((t=>t.context="single-select")),this.value.length>1&&this.updateValue([this.value[0]]))}setupDragDrop(){Boolean(this.sortable)&&this.sortable.destroy(),this.allowDrag&&(this.sortable=n.create(this.listboxEl,{animation:150,draggable:"swirl-option-list-item",handle:".option-list-item__drag-handle",onEnd:t=>{this.itemDrop.emit({item:t.item,oldIndex:t.oldIndex,newIndex:t.newIndex})}}))}setItemAllowDragState(){if(this.allowDrag&&!this.multiSelect)return void console.error("[SwirlOptionList] Drag can only be allowed for multi select lists.");const t=r(this.el,"swirl-option-list-section");this.allowDrag&&t.length>0?console.error("[SwirlOptionList] Drag can only be allowed for lists without sections."):this.items.forEach(this.allowDrag?t=>{t.setAttribute("allow-drag","true"),t.addEventListener("toggleDrag",this.toggleDrag)}:t=>{t.removeAttribute("allow-drag"),t.removeEventListener("toggleDrag",this.toggleDrag)})}selectItem(t){if(this.disabled)return;const i=this.items[t];if(i.disabled)return;const s=this.value.includes(i.value);s&&!this.allowDeselect||(this.multiSelect||(this.value=[]),this.updateValue(s?this.value.filter((t=>t!==i.value)):[...this.value,i.value]),this.focusItem(t))}updateValue(t){this.value=t,this.valueChange.emit(this.value)}selectFocusedItem(){this.disabled||-1===this.getActiveItemIndex()||this.selectItem(this.getActiveItemIndex())}selectAllItems(){if(this.disabled)return;const t=this.items.every((t=>this.value.includes(t.value)));this.updateValue(t?[]:this.items.map((t=>t.value)))}syncItemsWithValue(){this.items?.forEach((t=>t.selected=this.value.includes(t.value)))}focusItem(t){if(this.disabled)return;this.items.forEach((t=>t.querySelector('[role="option"]').removeAttribute("tabIndex")));const i=this.items[t]?.querySelector('[role="option"]');Boolean(i)&&(i.setAttribute("tabIndex","0"),i.focus(),this.focusedItem=i)}focusNextItem(){if(this.disabled)return;const t=this.getActiveItemIndex(),i=Math.min(t+1,this.items.length-1);this.focusItem(i)}focusPreviousItem(){const t=this.getActiveItemIndex(),i=Math.max(t-1,0);this.focusItem(i)}getActiveItemIndex(){return Boolean(this.focusedItem)?this.items.map((t=>t.querySelector('[role="option"]'))).findIndex((t=>t===this.focusedItem)):0}getItemIndex(t){return this.items.map((t=>t)).findIndex((i=>i===t))}moveDraggedItemDown(){const t=this.dragging.nextElementSibling;Boolean(t)&&(t.after(this.dragging),this.updateItems(),this.listboxEl.focus(),this.assistiveText=`${this.assistiveTextItemMoving} ${this.getActiveItemIndex()+1}`)}moveDraggedItemUp(){const t=this.dragging.previousElementSibling;Boolean(t)&&(t.before(this.dragging),this.updateItems(),this.listboxEl.focus(),this.assistiveText=`${this.assistiveTextItemMoving} ${this.getItemIndex(this.dragging)+1}`)}render(){const t=this.multiSelect?"true":void 0,i=Boolean(this.dragging)?0:void 0;return s(e,{key:"17ff337c693d086ca498a15748552d72d4c7a32f"},s("swirl-visually-hidden",{key:"725fb95afc37b1d03d0bd3aef47fb0d48e329ded",role:"alert"},this.assistiveText),s("div",{key:"588b1f0cb55530bfe4502823ce810614a819bd74","aria-label":this.label,"aria-multiselectable":t,class:"option-list",id:this.optionListId,onClick:this.onClick,onKeyDown:this.onKeyDown,ref:t=>this.listboxEl=t,role:"listbox",tabIndex:i},s("slot",{key:"30fd9d4970136ea0e94a38d50be8caa87cd4155a"})))}get el(){return o(this)}static get watchers(){return{allowDrag:["watchAllowDrag"],disabled:["watchDisabled"],multiSelect:["watchMultiSelect"],value:["watchValue"]}}};l.style=".sc-swirl-option-list-h{display:block}.sc-swirl-option-list-h *.sc-swirl-option-list{box-sizing:border-box}";const c=class{constructor(s){t(this,s),this.remove=i(this,"remove",7),this.onRemove=t=>{this.remove?.emit(t)},this.intent="default",this.label=void 0,this.removable=void 0,this.bordered=void 0,this.size="m",this.removalButtonLabel="Remove"}render(){const t=h("tag",`tag--intent-${this.intent}`,`tag--size-${this.size}`,{"tag--bordered":this.bordered});return s(e,{key:"02429e0453f16d87117282b02b5566210e9990cc"},s("span",{key:"bd3039960b3f6bad92c08001f9927643626d9ffa",class:t,part:"tag"},s("span",{key:"082ae33eebf5fa8fb39e9d481d613419aacc06a9",class:"tag__label"},this.label),this.removable&&s("button",{key:"e3a20c81951a5606f49a7ac946ccabcadde1a856","aria-label":this.removalButtonLabel,class:"tag__removal-button",onClick:this.onRemove,tabIndex:"true"===this.el.ariaHidden?-1:void 0,type:"button"},s("swirl-icon-close",{key:"15f71b707c8d6bbba3c09dd9c66ddaa4399b82ad",size:16}))))}get el(){return o(this)}};c.style=":host{display:inline-flex;max-width:100%}:host *{box-sizing:border-box}.tag{display:inline-flex;max-width:100%;align-items:center;border-radius:var(--s-border-radius-s);color:var(--s-text-default);background-color:var(--swirl-tag-background-default);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);white-space:nowrap;gap:var(--s-space-4)}.tag--size-s{padding:var(--s-space-0) var(--s-space-4)}.tag--size-m{padding:var(--s-space-2) var(--s-space-8)}.tag--bordered{border-style:solid;border-width:var(--s-border-width-default);border-color:var(--s-border-strong)}.tag--intent-info{color:var(--s-text-info);background-color:var(--s-surface-info-subdued)}.tag--intent-info .tag__removal-button{color:var(--icon-info)}.tag--intent-info.tag--bordered{border-color:var(--s-border-info)}.tag--intent-critical{color:var(--s-text-critical);background-color:var(--s-surface-critical-subdued)}.tag--intent-critical .tag__removal-button{color:var(--icon-critical)}.tag--intent-critical.tag--bordered{border-color:var(--s-border-critical)}.tag--intent-warning{color:var(--s-text-warning);background-color:var(--s-surface-warning-subdued)}.tag--intent-warning .tag__removal-button{color:var(--icon-warning)}.tag--intent-warning.tag--bordered{border-color:var(--s-border-warning)}.tag--intent-success{color:var(--s-text-success);background-color:var(--s-surface-success-subdued)}.tag--intent-success .tag__removal-button{color:var(--icon-success)}.tag--intent-success.tag--bordered{border-color:var(--s-border-success)}.tag__label{overflow:hidden;min-width:0;white-space:nowrap;text-overflow:ellipsis}.tag__removal-button{display:inline-flex;margin-right:calc(-1 * var(--s-space-4));padding:0;border:none;color:var(--s-icon-strong);background-color:transparent;cursor:pointer}.tag__removal-button:focus:not(:focus-visible){outline:none}.tag__removal-button:focus-visible{outline-color:var(--s-focus-default)}";export{l as swirl_option_list,c as swirl_tag}
|
|
1
|
+
import{r as t,c as i,h as s,H as e,g as o}from"./p-e212b5b7.js";import{c as a,q as r}from"./p-58abf3c6.js";import{S as n}from"./p-1486d7ea.js";import{c as h}from"./p-a5dce9e6.js";const l=class{constructor(s){t(this,s),this.itemDrop=i(this,"itemDrop",7),this.valueChange=i(this,"valueChange",7),this.onClick=t=>{t.preventDefault();const i=t.target,s=i?.closest("swirl-option-list-item"),e=t.composedPath()[0],o=Boolean(a(e,'[role="option"]'));Boolean(s)&&o?this.selectItem(this.items.findIndex((t=>t.value===s.value))):t.preventDefault()},this.onKeyDown=t=>{if("ArrowDown"===t.code)t.preventDefault(),Boolean(this.dragging)?this.moveDraggedItemDown():this.focusNextItem();else if("ArrowUp"===t.code)t.preventDefault(),Boolean(this.dragging)?this.moveDraggedItemUp():this.focusPreviousItem();else if("Space"===t.code||"Enter"===t.code){if(!t.target.classList.contains("option-list-item__drag-handle")&&Boolean(this.dragging))return t.preventDefault(),void this.stopDrag(this.dragging);const i=t.composedPath()[0];if(!Boolean(a(i,'[role="option"]')))return;t.preventDefault(),Boolean(this.dragging)?this.stopDrag(this.dragging):this.selectFocusedItem()}else"Home"===t.code?(t.preventDefault(),this.focusItem(0)):"End"===t.code?(t.preventDefault(),this.focusItem(this.items.length-1)):"KeyA"===t.code&&(t.metaKey||t.ctrlKey)&&this.multiSelect?(t.preventDefault(),this.selectAllItems()):"Tab"===t.code&&Boolean(this.dragging)&&t.preventDefault()},this.toggleDrag=t=>{const i=t.detail;Boolean(this.dragging)?this.stopDrag(i):this.startDrag(i)},this.startDrag=t=>{this.dragging=t,this.draggingStartIndex=this.getItemIndex(this.dragging),t.setAttribute("dragging","true");const i=this.getItemIndex(this.dragging);this.focusItem(i),this.assistiveText=this.assistiveTextItemGrabbed},this.stopDrag=t=>{this.dragging=void 0,t.removeAttribute("dragging");const i=this.getActiveItemIndex();this.assistiveText=`${this.assistiveTextItemMoved} ${i+1}`,this.itemDrop.emit({item:t,oldIndex:this.draggingStartIndex,newIndex:i}),this.draggingStartIndex=void 0,this.focusItem(i)},this.allowDeselect=!0,this.allowDrag=void 0,this.assistiveTextItemGrabbed="Item grabbed. Use arrow keys to move item up or down. Use spacebar to save position.",this.assistiveTextItemMoving="Current position:",this.assistiveTextItemMoved="Item moved. New position:",this.disabled=void 0,this.label=void 0,this.optionListId=void 0,this.multiSelect=void 0,this.value=[],this.assistiveText=void 0}componentDidLoad(){this.updateItems(),this.observeSlotChanges(),this.setItemAllowDragState(),this.setItemDisabledState(),this.setItemContext(),this.syncItemsWithValue(),this.setupDragDrop()}componentDidRender(){this.setupDragDrop()}disconnectedCallback(){this.observer?.disconnect(),this.sortable?.destroy()}watchAllowDrag(){this.setItemAllowDragState(),this.setupDragDrop()}watchDisabled(){this.setItemDisabledState()}watchMultiSelect(){this.setItemContext()}watchValue(){this.syncItemsWithValue()}observeSlotChanges(){this.observer=new MutationObserver((()=>{this.updateItems(),this.setItemAllowDragState(),this.setItemDisabledState(),this.setItemContext(),this.syncItemsWithValue()})),this.observer.observe(this.listboxEl,{childList:!0,subtree:!0})}updateItems(){this.items=r(this.el,"swirl-option-list-item"),this.items.forEach((t=>t.querySelector('[role="option"]')?.removeAttribute("tabIndex")));const t=this.items[0]?.querySelector('[role="option"]');Boolean(t)&&t.setAttribute("tabIndex","0")}setItemDisabledState(){this.disabled&&this.items.forEach((t=>t.disabled=!0))}setItemContext(){this.multiSelect?this.items.forEach((t=>t.context="multi-select")):(this.items.forEach((t=>t.context="single-select")),this.value.length>1&&this.updateValue([this.value[0]]))}setupDragDrop(){Boolean(this.sortable)&&this.sortable.destroy(),this.allowDrag&&(this.sortable=n.create(this.listboxEl,{animation:150,draggable:"swirl-option-list-item",handle:".option-list-item__drag-handle",onEnd:t=>{this.itemDrop.emit({item:t.item,oldIndex:t.oldIndex,newIndex:t.newIndex})}}))}setItemAllowDragState(){if(this.allowDrag&&!this.multiSelect)return void console.error("[SwirlOptionList] Drag can only be allowed for multi select lists.");const t=r(this.el,"swirl-option-list-section");this.allowDrag&&t.length>0?console.error("[SwirlOptionList] Drag can only be allowed for lists without sections."):this.items.forEach(this.allowDrag?t=>{t.setAttribute("allow-drag","true"),t.addEventListener("toggleDrag",this.toggleDrag)}:t=>{t.removeAttribute("allow-drag"),t.removeEventListener("toggleDrag",this.toggleDrag)})}selectItem(t){if(this.disabled)return;const i=this.items[t];if(i.disabled)return;const s=this.value.includes(i.value);s&&!this.allowDeselect||(this.multiSelect||(this.value=[]),this.updateValue(s?this.value.filter((t=>t!==i.value)):[...this.value,i.value]),this.focusItem(t))}updateValue(t){this.value=t,this.valueChange.emit(this.value)}selectFocusedItem(){this.disabled||-1===this.getActiveItemIndex()||this.selectItem(this.getActiveItemIndex())}selectAllItems(){if(this.disabled)return;const t=this.items.every((t=>this.value.includes(t.value)));this.updateValue(t?[]:this.items.map((t=>t.value)))}syncItemsWithValue(){this.items?.forEach((t=>t.selected=this.value.includes(t.value)))}focusItem(t){if(this.disabled)return;this.items.forEach((t=>t.querySelector('[role="option"]').removeAttribute("tabIndex")));const i=this.items[t]?.querySelector('[role="option"]');Boolean(i)&&(i.setAttribute("tabIndex","0"),i.focus(),this.focusedItem=i)}focusNextItem(){if(this.disabled)return;const t=this.getActiveItemIndex(),i=Math.min(t+1,this.items.length-1);this.focusItem(i)}focusPreviousItem(){const t=this.getActiveItemIndex(),i=Math.max(t-1,0);this.focusItem(i)}getActiveItemIndex(){return Boolean(this.focusedItem)?this.items.map((t=>t.querySelector('[role="option"]'))).findIndex((t=>t===this.focusedItem)):0}getItemIndex(t){return this.items.map((t=>t)).findIndex((i=>i===t))}moveDraggedItemDown(){const t=this.dragging.nextElementSibling;Boolean(t)&&(t.after(this.dragging),this.updateItems(),this.listboxEl.focus(),this.assistiveText=`${this.assistiveTextItemMoving} ${this.getActiveItemIndex()+1}`)}moveDraggedItemUp(){const t=this.dragging.previousElementSibling;Boolean(t)&&(t.before(this.dragging),this.updateItems(),this.listboxEl.focus(),this.assistiveText=`${this.assistiveTextItemMoving} ${this.getItemIndex(this.dragging)+1}`)}render(){const t=this.multiSelect?"true":void 0,i=Boolean(this.dragging)?0:void 0;return s(e,{key:"17ff337c693d086ca498a15748552d72d4c7a32f"},s("swirl-visually-hidden",{key:"725fb95afc37b1d03d0bd3aef47fb0d48e329ded",role:"alert"},this.assistiveText),s("div",{key:"588b1f0cb55530bfe4502823ce810614a819bd74","aria-label":this.label,"aria-multiselectable":t,class:"option-list",id:this.optionListId,onClick:this.onClick,onKeyDown:this.onKeyDown,ref:t=>this.listboxEl=t,role:"listbox",tabIndex:i},s("slot",{key:"30fd9d4970136ea0e94a38d50be8caa87cd4155a"})))}get el(){return o(this)}static get watchers(){return{allowDrag:["watchAllowDrag"],disabled:["watchDisabled"],multiSelect:["watchMultiSelect"],value:["watchValue"]}}};l.style=".sc-swirl-option-list-h{display:block}.sc-swirl-option-list-h *.sc-swirl-option-list{box-sizing:border-box}";const c=class{constructor(s){t(this,s),this.remove=i(this,"remove",7),this.onRemove=t=>{this.remove?.emit(t)},this.intent="default",this.label=void 0,this.removable=void 0,this.bordered=void 0,this.size="m",this.removalButtonLabel="Remove"}render(){const t=h("tag",`tag--intent-${this.intent}`,`tag--size-${this.size}`,{"tag--bordered":this.bordered});return s(e,{key:"02429e0453f16d87117282b02b5566210e9990cc"},s("span",{key:"bd3039960b3f6bad92c08001f9927643626d9ffa",class:t,part:"tag"},s("span",{key:"082ae33eebf5fa8fb39e9d481d613419aacc06a9",class:"tag__label"},this.label),this.removable&&s("button",{key:"e3a20c81951a5606f49a7ac946ccabcadde1a856","aria-label":this.removalButtonLabel,class:"tag__removal-button",onClick:this.onRemove,tabIndex:"true"===this.el.ariaHidden?-1:void 0,type:"button"},s("swirl-icon-close",{key:"15f71b707c8d6bbba3c09dd9c66ddaa4399b82ad",size:16}))))}get el(){return o(this)}};c.style=":host{display:inline-flex;max-width:100%}:host *{box-sizing:border-box}.tag{display:inline-flex;max-width:100%;align-items:center;border-radius:var(--s-border-radius-s);color:var(--s-text-default);background-color:var(--swirl-tag-background-default);font-size:var(--s-font-size-sm);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-sm);white-space:nowrap;gap:var(--s-space-4)}.tag--size-s{padding:var(--s-space-0) var(--s-space-4)}.tag--size-m{padding:var(--s-space-2) var(--s-space-8)}.tag--bordered{border-style:solid;border-width:var(--s-border-width-default);border-color:var(--s-border-strong)}.tag--intent-info{color:var(--s-text-info);background-color:var(--s-surface-info-subdued)}.tag--intent-info .tag__removal-button{color:var(--icon-info)}.tag--intent-info.tag--bordered{border-color:var(--s-border-info)}.tag--intent-critical{color:var(--s-text-critical);background-color:var(--s-surface-critical-subdued)}.tag--intent-critical .tag__removal-button{color:var(--icon-critical)}.tag--intent-critical.tag--bordered{border-color:var(--s-border-critical)}.tag--intent-warning{color:var(--s-text-warning);background-color:var(--s-surface-warning-subdued)}.tag--intent-warning .tag__removal-button{color:var(--icon-warning)}.tag--intent-warning.tag--bordered{border-color:var(--s-border-warning)}.tag--intent-success{color:var(--s-text-success);background-color:var(--s-surface-success-subdued)}.tag--intent-success .tag__removal-button{color:var(--icon-success)}.tag--intent-success.tag--bordered{border-color:var(--s-border-success)}.tag__label{overflow:hidden;min-width:0;white-space:nowrap;text-overflow:ellipsis}.tag__removal-button{display:inline-flex;margin-right:calc(-1 * var(--s-space-4));padding:0;border:none;color:var(--s-icon-strong);background-color:transparent;cursor:pointer}.tag__removal-button:focus:not(:focus-visible){outline:none}.tag__removal-button:focus-visible{outline-color:var(--s-focus-default)}";export{l as swirl_option_list,c as swirl_tag}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as e,c as a,h as i,H as t,g as s}from"./p-e212b5b7.js";import{A as d}from"./p-fe0b5250.js";import{d as r,e as o}from"./p-33c168b3.js";import{c as n}from"./p-a5dce9e6.js";import{q as l,i as c}from"./p-81ca5135.js";const f=class{constructor(i){e(this,i),this.modalClose=a(this,"modalClose",7),this.modalOpen=a(this,"modalOpen",7),this.desktopZoomSteps=[.5,.75,1,1.25,1.5,2,3,4],this.mobileZoomSteps=[.5,.75,1,1.25,1.5],this.toggleViewMode=()=>{this.viewMode="single"===this.viewMode?"side-by-side":"single"},this.toggleThumbnals=()=>{this.showThumbnails=!this.showThumbnails},this.onKeyDown=e=>{"Escape"===e.code&&(e.stopImmediatePropagation(),this.close())},this.onActivate=async e=>{this.pdfViewer=e.detail,this.lockBodyScroll()},this.onVisiblePagesChange=async e=>{this.visiblePages=e.detail},this.onCloseButtonClick=()=>{this.close()},this.onPrintButtonClick=()=>{this.pdfViewer.print(),this.menu.close()},this.onDownloadButtonClick=async()=>{this.downloading=!0,await this.viewer.download(),this.downloading=!1,this.menu.close()},this.onZoomInButtonClick=()=>{const e=this.zoomSteps.indexOf(+this.zoom);this.zoom=-1===e?1:this.zoomSteps[Math.min(this.zoomSteps.length-1,e+1)]},this.onZoomOutButtonClick=()=>{const e=this.zoomSteps.indexOf(+this.zoom);this.zoom=-1===e?1:this.zoomSteps[Math.max(0,e-1)]},this.onZoomAutoButtonClick=()=>{this.zoom="auto"===this.zoom?1:"auto"},this.onZoomChange=e=>{const a=e.target.value;this.zoom="auto"===a?a:+a},this.onThumbnailClick=e=>()=>{const a=l(this.el,`[data-page-number="${e+1}"]`)?.[0];a?.scrollIntoView()},this.autoZoomLabel="Full width",this.closeButtonLabel="Close PDF viewer",this.downloadButtonEnabled=!0,this.downloadButtonLabel="Download PDF",this.file=void 0,this.fileName=void 0,this.fileTypeLabel="PDF Document",this.label=void 0,this.menuLabel="File menu",this.menuTriggerLabel="Open file menu",this.pdfWorkerSrc=void 0,this.printButtonEnabled=!0,this.printButtonLabel="Print PDF",this.sideBySideButtonLabel="Toggle side by side view",this.thumbnailButtonLabel="Scroll to page",this.thumbnailsButtonLabel="Toggle thumbnails",this.thumbnailsLabel="Page thumbnails",this.zoomInButtonLabel="Zoom in",this.zoomOutButtonLabel="Zoom out",this.zoomSelectLabel="Select zoom",this.active=!1,this.closing=!1,this.downloading=!1,this.loadingThumbnails=!1,this.thumbnails=[],this.showThumbnails=void 0,this.viewMode="single",this.visiblePages=[],this.zoom=void 0,this.zoomSteps=void 0}componentWillLoad(){this.updateZoomSteps(),this.zoom=c()?"auto":1}componentDidLoad(){this.modal=new d(this.modalEl)}disconnectedCallback(){this.unlockBodyScroll(),this.modal?.destroy()}onWindowResize(){Boolean(this.pdfViewer)&&(this.updateZoomSteps(),this.zoom=c()?"auto":1)}watchShowThumbnails(){this.showThumbnails&&(this.loadingThumbnails=!0,queueMicrotask((async()=>{await this.generateThumbnails(),this.loadingThumbnails=!1})))}async open(){this.modal.show(),this.active=!0,this.modalOpen.emit()}async close(){this.closing||(this.closing=!0,this.unlockBodyScroll(),setTimeout((()=>{this.modal.hide(),this.closing=!1,this.active=!1,this.modalClose.emit()}),150))}lockBodyScroll(){const e=this.pdfViewer.shadowRoot.querySelector(".file-viewer-pdf__pages");Boolean(e)&&r(e)}unlockBodyScroll(){const e=this.pdfViewer.shadowRoot.querySelector(".file-viewer-pdf__pages");Boolean(e)&&o(e)}async generateThumbnails(){this.thumbnails=await this.pdfViewer.getThumbnails()}updateZoomSteps(){this.zoomSteps=c()?this.mobileZoomSteps:this.desktopZoomSteps}render(){const e=Boolean(this.el.querySelector("[slot='menu-items']"))||this.printButtonEnabled||this.downloadButtonEnabled,a=n("pdf-reader",{"pdf-reader--closing":this.closing,"pdf-reader--hide-menu":!e,"pdf-reader--show-thumbnails":this.showThumbnails});return i(t,{key:"514fef96758b173a5c7f6de5833260edc7767ed4"},i("section",{key:"506a7da85c9463b3aef5f156570dbee67d8bb17e","aria-hidden":"true","aria-label":this.label,class:a,id:"pdf-reader",onKeyDown:this.onKeyDown,ref:e=>this.modalEl=e},i("div",{key:"61f806f1b26a7e04656944e5a07c623171966a0c",class:"pdf-reader__body",role:"document"},i("header",{key:"daa05711a29a16ebb398e63fa6422ffb4d1a2145",class:"pdf-reader__header"},i("span",{key:"22b8c3e0b874f9d891c06960ef808f22f7fdac89",class:"pdf-reader__header-left"},i("swirl-button",{key:"ea420b1e23397581d3daac5372ceea78c463c3b2",class:"pdf-reader__close-button",hideLabel:!0,icon:"<swirl-icon-close></swirl-icon-close>",label:this.closeButtonLabel,onClick:this.onCloseButtonClick}),i("span",{key:"e6a6c4c31a355fbdc8d5be397cc4afdc1cc41b5d",class:"pdf-reader__label"},this.label)),i("span",{key:"582ce306e1bb83b76977e8922791d38a487fb370",class:"pdf-reader__header-center"},i("span",{key:"1b0fc6a28dcb4743f721879fbb94f69875deac3b",class:"pdf-reader__zoom-button-container"},i("swirl-button",{key:"544238bd0874fe9e6c5e509fff4b6d2d7ab6aefd",class:"pdf-reader__zoom-button",disabled:this.zoom===this.zoomSteps[0],hideLabel:!0,icon:"<swirl-icon-remove></swirl-icon-remove>",label:this.zoomOutButtonLabel,onClick:this.onZoomOutButtonClick}),i("swirl-button",{key:"7ecf27b20b17858b8f187a97b79d9bd45e13080c",class:"pdf-reader__zoom-button",disabled:this.zoom===this.zoomSteps[this.zoomSteps.length-1],hideLabel:!0,icon:"<swirl-icon-add></swirl-icon-add>",label:this.zoomInButtonLabel,onClick:this.onZoomInButtonClick})),i("span",{key:"d8392b1bf40c784d42ade3f085f1832066857839",class:"pdf-reader__zoom-select-container"},i("select",{key:"9ae9287f5e2aa686b1079d7195c066d5b538351f","aria-label":this.zoomSelectLabel,class:"pdf-reader__zoom-select",name:"zoom-select",id:"zoom-select",onChange:this.onZoomChange},i("option",{key:"664750b13d0512b308f6bb206d88b9af7f39fe43",selected:"auto"===this.zoom,value:"auto"},this.autoZoomLabel),this.zoomSteps.map((e=>i("option",{key:e,selected:this.zoom===e,value:e},100*e,"%")))),i("swirl-icon-expand-more",{key:"9db66a14c6d0b25da86e68379d9906205d1d9bdc",class:"pdf-reader__zoom-select-icon"}))),i("span",{key:"49c5e433bb250a7bc4937ffb0914a9be1fa120ae",class:"pdf-reader__header-right"},i("swirl-popover-trigger",{key:"cbd04e4744d951408ee8038d70c791e92bc0382b",swirlPopover:this.menu},i("swirl-button",{key:"4e41e10aab7e20708370e13efabff75c6c27ff04",class:"pdf-reader__menu-button",hideLabel:!0,icon:"<swirl-icon-more-vertikal></swirl-icon-more-vertikal>",label:this.menuTriggerLabel}))),i("span",{key:"a6932b44450588fa253516e5c92fc0ebc6f516c6",class:"pdf-reader__floating-tools"},i("button",{key:"c2a06089dfee5e113bd5d9ad9918f5275000ca0f","aria-label":this.sideBySideButtonLabel,class:"pdf-reader__floating-tool-button",onClick:this.toggleViewMode,type:"button"},i("swirl-icon-menu-book",{key:"64bd70b7bc360cad0f6217db8c414821c2200c9a"})),i("button",{key:"951897713c8f75d1addbef4e5af55f4ed72e436b","aria-controls":"thumbnails","aria-expanded":String(Boolean(this.showThumbnails)),"aria-label":this.thumbnailsButtonLabel,class:"pdf-reader__floating-tool-button",onClick:this.toggleThumbnals,type:"button"},i("swirl-icon-file-copy",{key:"71971e955e5520869353075e328f9e6c7ad73e4e"})))),i("div",{key:"8f129691d6802f3f9ff2d530b1191d98b48a23af",class:"pdf-reader__content"},i("nav",{key:"5c7fdd7214766bf24d727f2e98a3262bb09e3f5c","aria-label":this.thumbnailsLabel,class:"pdf-reader__thumbnails",id:"thumbnails"},this.loadingThumbnails&&i("swirl-spinner",{key:"9f3feac0be72bee7fc17793be03327704661b43e"}),!this.loadingThumbnails&&this.thumbnails.map(((e,a)=>{const t=n("pdf-reader__thumbnail",{"pdf-reader__thumbnail--active":this.visiblePages[0]===a+1});return i("button",{"aria-label":`${this.thumbnailButtonLabel} ${a+1}`,class:t,onClick:this.onThumbnailClick(a),type:"button"},i("img",{src:e.toDataURL("image/png"),alt:""}))}))),i("swirl-file-viewer",{key:"39f08272d479985b84212fbe33f2c4c28dbdf1d4",active:this.active,class:"pdf-reader__viewer",file:this.file,fileName:this.fileName,onActivate:this.onActivate,onVisiblePagesChange:this.onVisiblePagesChange,pdfWorkerSrc:this.pdfWorkerSrc,ref:e=>this.viewer=e,type:"application/pdf",viewMode:this.viewMode,zoom:this.zoom}),i("div",{key:"6e250e0eb4cd8555f9a0079627df877236f686ea",class:"pdf-reader__mobile-zoom-controls"},i("button",{key:"29e5bce22826baf2c5d1afa58b7a97bfca12f027","aria-label":this.autoZoomLabel,class:"pdf-reader__mobile-zoom-button",onClick:this.onZoomAutoButtonClick,type:"button"},i("auto"===this.zoom?"swirl-icon-fullscreen-exit":"swirl-icon-fullscreen",null)),i("button",{key:"dba55f7132b4a721914b565b682267f5fdfd82c1","aria-label":this.zoomInButtonLabel,class:"pdf-reader__mobile-zoom-button",disabled:this.zoom===this.zoomSteps[this.zoomSteps.length-1],onClick:this.onZoomInButtonClick,type:"button"},i("swirl-icon-add",{key:"6cb9b1fb22ad4de67bdd9a611afc1257c3e72a47"})),i("button",{key:"49fec30bed12334066f6688b5007bcb9fae8a2a8","aria-label":this.zoomOutButtonLabel,class:"pdf-reader__mobile-zoom-button",disabled:this.zoom===this.zoomSteps[0],onClick:this.onZoomOutButtonClick,type:"button"},i("swirl-icon-remove",{key:"60cbe0f951cbc683d59288a4fb110d68f33457c2"}))))),i("swirl-popover",{key:"117e27615ff56d4c694ff1ada8e3cc013121963d",animation:"scale-in-y",disableScrollLock:!0,id:"menu",label:this.menuLabel,placement:"bottom-end",ref:e=>this.menu=e},i("swirl-stack",{key:"f9404ac16523085bfd88f535b08c6d308b3812a4"},i("div",{key:"04fc585aeb94250cd7c92577769006361a63c286",class:"pdf-reader__meta"},i("div",{key:"4adaabc21720a1917aee05e813146ea1c6253989",class:"pdf-reader__file-icon"},i("svg",{key:"d96d8aa7aff997344eff8d8d40fdea8e90cc6ddb",fill:"none",height:"36",viewBox:"0 0 24 36",width:"24"},i("path",{key:"12295346749d43a06b797fcf992194a52cedd255",d:"M7.01755 21.6V15.192H8.39455C8.64655 15.192 8.86855 15.225 9.06055 15.291C9.25255 15.357 9.42655 15.474 9.58255 15.642C9.73855 15.81 9.84655 16.008 9.90655 16.236C9.96655 16.458 9.99655 16.761 9.99655 17.145C9.99655 17.433 9.97855 17.676 9.94255 17.874C9.91255 18.072 9.84355 18.258 9.73555 18.432C9.60955 18.642 9.44155 18.807 9.23155 18.927C9.02155 19.041 8.74555 19.098 8.40355 19.098H7.93555V21.6H7.01755ZM7.93555 16.056V18.234H8.37655C8.56255 18.234 8.70655 18.207 8.80855 18.153C8.91055 18.099 8.98555 18.024 9.03355 17.928C9.08155 17.838 9.10855 17.727 9.11455 17.595C9.12655 17.463 9.13255 17.316 9.13255 17.154C9.13255 17.004 9.12955 16.863 9.12355 16.731C9.11755 16.593 9.09055 16.473 9.04255 16.371C8.99455 16.269 8.92255 16.191 8.82655 16.137C8.73055 16.083 8.59255 16.056 8.41255 16.056H7.93555Z",fill:"white"}),i("path",{key:"62f24b034fef684d6bcaf7043522c43af6e96f57",d:"M10.6826 21.6V15.192H12.0416C12.5696 15.192 12.9686 15.336 13.2386 15.624C13.5146 15.912 13.6526 16.32 13.6526 16.848V19.845C13.6526 20.445 13.5056 20.889 13.2116 21.177C12.9236 21.459 12.5066 21.6 11.9606 21.6H10.6826ZM11.6006 16.056V20.736H12.0236C12.2816 20.736 12.4646 20.673 12.5726 20.547C12.6806 20.415 12.7346 20.211 12.7346 19.935V16.848C12.7346 16.596 12.6836 16.401 12.5816 16.263C12.4796 16.125 12.2936 16.056 12.0236 16.056H11.6006Z",fill:"white"}),i("path",{key:"1daa4504163b750e8bd7a0f99340bb4275ac8459",d:"M14.5146 21.6V15.192H17.2506V16.056H15.4326V18H17.0166V18.864H15.4326V21.6H14.5146Z",fill:"white"}),i("path",{key:"ecab7ab3453434561df7f2b782d073e8da930ba9",d:"M3.59961 9.00001C3.59961 8.0059 4.4055 7.20001 5.39961 7.20001H14.854C15.3314 7.20001 15.7893 7.38965 16.1268 7.72722L19.8724 11.4728C20.21 11.8104 20.3996 12.2682 20.3996 12.7456V27C20.3996 27.9941 19.5937 28.8 18.5996 28.8H5.39961C4.4055 28.8 3.59961 27.9941 3.59961 27V9.00001Z",fill:"#FF574D"}),i("path",{key:"f701adcf820d5aac6676ae91e2f021dce0ffea0b",d:"M15.5996 7.36166V10.2C15.5996 11.1941 16.4055 12 17.3996 12H20.2379C20.3237 12.1884 20.3768 12.3913 20.3937 12.6H17.3996C16.0785 12.6 15.0067 11.5325 14.9996 10.213L14.9996 7.20587C15.2083 7.2228 15.4112 7.27593 15.5996 7.36166Z",fill:"white"}),i("path",{key:"4f30f927abc92fa2fb8cc1874ca1e15616d5486a",d:"M7.01755 21.6V15.192H8.39455C8.64655 15.192 8.86855 15.225 9.06055 15.291C9.25255 15.357 9.42655 15.474 9.58255 15.642C9.73855 15.81 9.84655 16.008 9.90655 16.236C9.96655 16.458 9.99655 16.761 9.99655 17.145C9.99655 17.433 9.97855 17.676 9.94255 17.874C9.91255 18.072 9.84355 18.258 9.73555 18.432C9.60955 18.642 9.44155 18.807 9.23155 18.927C9.02155 19.041 8.74555 19.098 8.40355 19.098H7.93555V21.6H7.01755ZM7.93555 16.056V18.234H8.37655C8.56255 18.234 8.70655 18.207 8.80855 18.153C8.91055 18.099 8.98555 18.024 9.03355 17.928C9.08155 17.838 9.10855 17.727 9.11455 17.595C9.12655 17.463 9.13255 17.316 9.13255 17.154C9.13255 17.004 9.12955 16.863 9.12355 16.731C9.11755 16.593 9.09055 16.473 9.04255 16.371C8.99455 16.269 8.92255 16.191 8.82655 16.137C8.73055 16.083 8.59255 16.056 8.41255 16.056H7.93555Z",fill:"white"}),i("path",{key:"2b1ca5d1d91fe8490b108437c11dd57f81af8aae",d:"M10.6826 21.6V15.192H12.0416C12.5696 15.192 12.9686 15.336 13.2386 15.624C13.5146 15.912 13.6526 16.32 13.6526 16.848V19.845C13.6526 20.445 13.5056 20.889 13.2116 21.177C12.9236 21.459 12.5066 21.6 11.9606 21.6H10.6826ZM11.6006 16.056V20.736H12.0236C12.2816 20.736 12.4646 20.673 12.5726 20.547C12.6806 20.415 12.7346 20.211 12.7346 19.935V16.848C12.7346 16.596 12.6836 16.401 12.5816 16.263C12.4796 16.125 12.2936 16.056 12.0236 16.056H11.6006Z",fill:"white"}),i("path",{key:"bf0d015a297b434d790c06752bfa4fe422f528dd",d:"M14.5146 21.6V15.192H17.2506V16.056H15.4326V18H17.0166V18.864H15.4326V21.6H14.5146Z",fill:"white"}))),i("div",{key:"b01d8e0908d24ad9b2b33cf125e201a16382aeb3",class:"pdf-reader__file-info"},i("swirl-text",{key:"33439bc9998a1f2d077bd1a59f262e106f7a2cd0",truncate:!0,weight:"semibold"},this.label),i("swirl-text",{key:"95cce7ceb6a1d317234f3c1ab6a1f8a5c3f90a00",color:"subdued",size:"sm",truncate:!0},this.fileTypeLabel))),e&&i("swirl-separator",{key:"430a0264f0ae65fa3e758806bc648d6308a4b2dc"}),i("swirl-action-list",{key:"4f7c45d281299b0003bc8f35d400819095b6e516",class:"pdf-reader__menu"},this.printButtonEnabled&&i("swirl-action-list-item",{key:"028e1a7d66bb8f80625c1569c0f40bb73ecf4dc7",class:"pdf-reader__print-button",icon:"<swirl-icon-print></swirl-icon-print>",label:this.printButtonLabel,onClick:this.onPrintButtonClick}),this.downloadButtonEnabled&&i("swirl-action-list-item",{key:"c69a3e15d5af3870aa7a31a981f69274e5657ffa",class:"pdf-reader__download-button",disabled:this.downloading,icon:this.downloading?'<swirl-spinner size="xs"></swirl-spinner>':"<swirl-icon-download></swirl-icon-download>",label:this.downloadButtonLabel,onClick:this.onDownloadButtonClick}),i("slot",{key:"3d70da99251fbffef992e0f1947e939e69b07be9",name:"menu-items"}))))))}get el(){return s(this)}static get watchers(){return{showThumbnails:["watchShowThumbnails"]}}};f.style=':host{--thumbnails-width:7rem;display:block}:host *{box-sizing:border-box}.pdf-reader{position:fixed;z-index:var(--s-z-40);background-color:var(--s-surface-raised-default);inset:0;touch-action:pan-x pan-y}.pdf-reader[aria-hidden="true"]{display:none}.pdf-reader:not(.pdf-reader--closing) .pdf-reader__body{animation:0.15s pdf-reader-fade-in}@media (prefers-reduced-motion){.pdf-reader:not(.pdf-reader--closing) .pdf-reader__body{animation:none}}.pdf-reader--closing{animation:0.15s pdf-reader-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.pdf-reader--closing{animation:none}}.pdf-reader--show-thumbnails .pdf-reader__thumbnails{max-width:var(--thumbnails-width)}.pdf-reader--show-thumbnails .pdf-reader__floating-tools{left:calc(var(--s-space-16) + var(--thumbnails-width))}.pdf-reader--hide-menu .pdf-reader__menu{display:none}.pdf-reader__body{position:relative;width:100%;height:100%}.pdf-reader__header{display:flex;height:4rem;padding-right:var(--s-space-16);padding-left:var(--s-space-16);align-items:center;border-bottom:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default);gap:var(--s-space-8)}.pdf-reader__header-left,.pdf-reader__header-right{display:flex;flex-grow:1;align-items:center;gap:var(--s-space-8)}@media (min-width: 768px){.pdf-reader__header-left,.pdf-reader__header-right{flex-basis:calc(100 / 3 * 1%);flex-grow:0}}.pdf-reader__header-right{justify-content:flex-end}.pdf-reader__header-center{display:none;flex-grow:1;justify-content:center;align-items:center;gap:var(--s-space-16)}@media (min-width: 768px){.pdf-reader__header-center{display:flex}}.pdf-reader__label{overflow:hidden;flex-grow:1;font-weight:var(--s-font-weight-semibold);white-space:nowrap;text-overflow:ellipsis}.pdf-reader__zoom-button-container{display:flex;align-items:center;gap:var(--s-space-8)}.pdf-reader__zoom-button-container>*:not(:last-child){position:relative}.pdf-reader__zoom-button-container>*:not(:last-child):after{position:absolute;top:50%;right:calc(-1 * var(--s-space-4));width:var(--s-border-width-default);height:1.5rem;background-color:var(--s-border-default);content:"";transform:translate3d(50%, -50%, 0)}.pdf-reader__zoom-select-container{position:relative}.pdf-reader__zoom-select{display:inline-flex;height:2.5rem;padding-right:var(--s-space-12);padding-right:calc(var(--s-space-8) + 1.5rem + var(--s-space-12));padding-left:var(--s-space-12);justify-content:flex-start;align-items:center;border:var(--s-border-width-default) solid var(--s-border-default);border-radius:var(--s-border-radius-sm);color:var(--s-interactive-neutral-default);background-color:transparent;font:inherit;font-weight:var(--s-font-weight-medium);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.pdf-reader__zoom-select:focus:not(:focus-visible){outline:none}.pdf-reader__zoom-select:focus-visible{outline-color:var(--s-focus-default)}.pdf-reader__zoom-select-icon{position:absolute;top:50%;right:var(--s-space-8);display:inline-flex;transform:translateY(-50%);pointer-events:none}.pdf-reader__content{display:flex;width:100%;height:calc(100% - 4rem)}.pdf-reader__thumbnails{display:flex;overflow-x:hidden;overflow-y:auto;max-width:0;height:100%;padding-top:var(--s-space-16);padding-bottom:var(--s-space-16);flex-basis:var(--thumbnails-width);flex-grow:0;flex-shrink:0;align-items:center;background-color:var(--s-background-default);flex-direction:column;transition:max-width 0.2s linear;box-shadow:inset calc(-1 * var(--s-border-width-default)) 0 0 0\n var(--s-border-default);gap:var(--s-space-4)}.pdf-reader__thumbnail{width:5rem;margin:0;padding:0;border:var(--s-border-width-default) solid var(--s-border-default);background-color:transparent;cursor:pointer}.pdf-reader__thumbnail>img{display:inline-flex;width:100%}.pdf-reader__thumbnail--active{border-width:0.125rem;border-color:var(--s-border-highlight)}.pdf-reader__viewer{flex-grow:1}.pdf-reader__mobile-zoom-controls{position:absolute;z-index:1;right:var(--s-space-16);bottom:var(--s-space-32);display:flex;padding-bottom:var(--s-space-4);flex-direction:column;gap:var(--s-space-8)}@media (min-width: 768px){.pdf-reader__mobile-zoom-controls{display:none}}.pdf-reader__mobile-zoom-button{display:inline-flex;width:2.5rem;height:2.5rem;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-on-image);background-color:rgba(0, 0, 0, 0.6);cursor:pointer;transition:opacity 0.15s;pointer-events:auto}.pdf-reader__mobile-zoom-button:disabled{cursor:default}.pdf-reader__floating-tools{position:fixed;z-index:1;bottom:var(--s-space-16);left:var(--s-space-16);display:none;flex-direction:column;transition:left 0.2s linear;gap:var(--s-space-12)}@media (min-width: 768px){.pdf-reader__floating-tools{display:flex}}.pdf-reader__floating-tool-button{display:inline-flex;width:2.5rem;height:2.5rem;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-on-image);background-color:rgba(0, 0, 0, 0.6);cursor:pointer}.pdf-reader__meta{display:flex;padding-top:var(--s-space-4);padding-right:var(--s-space-16);padding-bottom:var(--s-space-4);padding-left:var(--s-space-8);align-items:center;gap:var(--s-space-12)}@media (min-width: 768px){.pdf-reader__meta{max-width:18rem}}.pdf-reader__file-icon{display:inline-flex;padding-left:var(--s-space-4);flex-shrink:0}.pdf-reader__file-info{display:flex;min-width:0;flex-grow:1;flex-direction:column}@keyframes pdf-reader-fade-in{from{opacity:0}to{opacity:1}}@keyframes pdf-reader-fade-out{from{opacity:1}to{opacity:0}}';export{f as swirl_pdf_reader}
|
|
1
|
+
import{r as e,c as a,h as i,H as t,g as s}from"./p-e212b5b7.js";import{A as d}from"./p-fe0b5250.js";import{d as r,e as o}from"./p-33c168b3.js";import{c as n}from"./p-a5dce9e6.js";import{q as l,i as c}from"./p-58abf3c6.js";const f=class{constructor(i){e(this,i),this.modalClose=a(this,"modalClose",7),this.modalOpen=a(this,"modalOpen",7),this.desktopZoomSteps=[.5,.75,1,1.25,1.5,2,3,4],this.mobileZoomSteps=[.5,.75,1,1.25,1.5],this.toggleViewMode=()=>{this.viewMode="single"===this.viewMode?"side-by-side":"single"},this.toggleThumbnals=()=>{this.showThumbnails=!this.showThumbnails},this.onKeyDown=e=>{"Escape"===e.code&&(e.stopImmediatePropagation(),this.close())},this.onActivate=async e=>{this.pdfViewer=e.detail,this.lockBodyScroll()},this.onVisiblePagesChange=async e=>{this.visiblePages=e.detail},this.onCloseButtonClick=()=>{this.close()},this.onPrintButtonClick=()=>{this.pdfViewer.print(),this.menu.close()},this.onDownloadButtonClick=async()=>{this.downloading=!0,await this.viewer.download(),this.downloading=!1,this.menu.close()},this.onZoomInButtonClick=()=>{const e=this.zoomSteps.indexOf(+this.zoom);this.zoom=-1===e?1:this.zoomSteps[Math.min(this.zoomSteps.length-1,e+1)]},this.onZoomOutButtonClick=()=>{const e=this.zoomSteps.indexOf(+this.zoom);this.zoom=-1===e?1:this.zoomSteps[Math.max(0,e-1)]},this.onZoomAutoButtonClick=()=>{this.zoom="auto"===this.zoom?1:"auto"},this.onZoomChange=e=>{const a=e.target.value;this.zoom="auto"===a?a:+a},this.onThumbnailClick=e=>()=>{const a=l(this.el,`[data-page-number="${e+1}"]`)?.[0];a?.scrollIntoView()},this.autoZoomLabel="Full width",this.closeButtonLabel="Close PDF viewer",this.downloadButtonEnabled=!0,this.downloadButtonLabel="Download PDF",this.file=void 0,this.fileName=void 0,this.fileTypeLabel="PDF Document",this.label=void 0,this.menuLabel="File menu",this.menuTriggerLabel="Open file menu",this.pdfWorkerSrc=void 0,this.printButtonEnabled=!0,this.printButtonLabel="Print PDF",this.sideBySideButtonLabel="Toggle side by side view",this.thumbnailButtonLabel="Scroll to page",this.thumbnailsButtonLabel="Toggle thumbnails",this.thumbnailsLabel="Page thumbnails",this.zoomInButtonLabel="Zoom in",this.zoomOutButtonLabel="Zoom out",this.zoomSelectLabel="Select zoom",this.active=!1,this.closing=!1,this.downloading=!1,this.loadingThumbnails=!1,this.thumbnails=[],this.showThumbnails=void 0,this.viewMode="single",this.visiblePages=[],this.zoom=void 0,this.zoomSteps=void 0}componentWillLoad(){this.updateZoomSteps(),this.zoom=c()?"auto":1}componentDidLoad(){this.modal=new d(this.modalEl)}disconnectedCallback(){this.unlockBodyScroll(),this.modal?.destroy()}onWindowResize(){Boolean(this.pdfViewer)&&(this.updateZoomSteps(),this.zoom=c()?"auto":1)}watchShowThumbnails(){this.showThumbnails&&(this.loadingThumbnails=!0,queueMicrotask((async()=>{await this.generateThumbnails(),this.loadingThumbnails=!1})))}async open(){this.modal.show(),this.active=!0,this.modalOpen.emit()}async close(){this.closing||(this.closing=!0,this.unlockBodyScroll(),setTimeout((()=>{this.modal.hide(),this.closing=!1,this.active=!1,this.modalClose.emit()}),150))}lockBodyScroll(){const e=this.pdfViewer.shadowRoot.querySelector(".file-viewer-pdf__pages");Boolean(e)&&r(e)}unlockBodyScroll(){const e=this.pdfViewer.shadowRoot.querySelector(".file-viewer-pdf__pages");Boolean(e)&&o(e)}async generateThumbnails(){this.thumbnails=await this.pdfViewer.getThumbnails()}updateZoomSteps(){this.zoomSteps=c()?this.mobileZoomSteps:this.desktopZoomSteps}render(){const e=Boolean(this.el.querySelector("[slot='menu-items']"))||this.printButtonEnabled||this.downloadButtonEnabled,a=n("pdf-reader",{"pdf-reader--closing":this.closing,"pdf-reader--hide-menu":!e,"pdf-reader--show-thumbnails":this.showThumbnails});return i(t,{key:"514fef96758b173a5c7f6de5833260edc7767ed4"},i("section",{key:"506a7da85c9463b3aef5f156570dbee67d8bb17e","aria-hidden":"true","aria-label":this.label,class:a,id:"pdf-reader",onKeyDown:this.onKeyDown,ref:e=>this.modalEl=e},i("div",{key:"61f806f1b26a7e04656944e5a07c623171966a0c",class:"pdf-reader__body",role:"document"},i("header",{key:"daa05711a29a16ebb398e63fa6422ffb4d1a2145",class:"pdf-reader__header"},i("span",{key:"22b8c3e0b874f9d891c06960ef808f22f7fdac89",class:"pdf-reader__header-left"},i("swirl-button",{key:"ea420b1e23397581d3daac5372ceea78c463c3b2",class:"pdf-reader__close-button",hideLabel:!0,icon:"<swirl-icon-close></swirl-icon-close>",label:this.closeButtonLabel,onClick:this.onCloseButtonClick}),i("span",{key:"e6a6c4c31a355fbdc8d5be397cc4afdc1cc41b5d",class:"pdf-reader__label"},this.label)),i("span",{key:"582ce306e1bb83b76977e8922791d38a487fb370",class:"pdf-reader__header-center"},i("span",{key:"1b0fc6a28dcb4743f721879fbb94f69875deac3b",class:"pdf-reader__zoom-button-container"},i("swirl-button",{key:"544238bd0874fe9e6c5e509fff4b6d2d7ab6aefd",class:"pdf-reader__zoom-button",disabled:this.zoom===this.zoomSteps[0],hideLabel:!0,icon:"<swirl-icon-remove></swirl-icon-remove>",label:this.zoomOutButtonLabel,onClick:this.onZoomOutButtonClick}),i("swirl-button",{key:"7ecf27b20b17858b8f187a97b79d9bd45e13080c",class:"pdf-reader__zoom-button",disabled:this.zoom===this.zoomSteps[this.zoomSteps.length-1],hideLabel:!0,icon:"<swirl-icon-add></swirl-icon-add>",label:this.zoomInButtonLabel,onClick:this.onZoomInButtonClick})),i("span",{key:"d8392b1bf40c784d42ade3f085f1832066857839",class:"pdf-reader__zoom-select-container"},i("select",{key:"9ae9287f5e2aa686b1079d7195c066d5b538351f","aria-label":this.zoomSelectLabel,class:"pdf-reader__zoom-select",name:"zoom-select",id:"zoom-select",onChange:this.onZoomChange},i("option",{key:"664750b13d0512b308f6bb206d88b9af7f39fe43",selected:"auto"===this.zoom,value:"auto"},this.autoZoomLabel),this.zoomSteps.map((e=>i("option",{key:e,selected:this.zoom===e,value:e},100*e,"%")))),i("swirl-icon-expand-more",{key:"9db66a14c6d0b25da86e68379d9906205d1d9bdc",class:"pdf-reader__zoom-select-icon"}))),i("span",{key:"49c5e433bb250a7bc4937ffb0914a9be1fa120ae",class:"pdf-reader__header-right"},i("swirl-popover-trigger",{key:"cbd04e4744d951408ee8038d70c791e92bc0382b",swirlPopover:this.menu},i("swirl-button",{key:"4e41e10aab7e20708370e13efabff75c6c27ff04",class:"pdf-reader__menu-button",hideLabel:!0,icon:"<swirl-icon-more-vertikal></swirl-icon-more-vertikal>",label:this.menuTriggerLabel}))),i("span",{key:"a6932b44450588fa253516e5c92fc0ebc6f516c6",class:"pdf-reader__floating-tools"},i("button",{key:"c2a06089dfee5e113bd5d9ad9918f5275000ca0f","aria-label":this.sideBySideButtonLabel,class:"pdf-reader__floating-tool-button",onClick:this.toggleViewMode,type:"button"},i("swirl-icon-menu-book",{key:"64bd70b7bc360cad0f6217db8c414821c2200c9a"})),i("button",{key:"951897713c8f75d1addbef4e5af55f4ed72e436b","aria-controls":"thumbnails","aria-expanded":String(Boolean(this.showThumbnails)),"aria-label":this.thumbnailsButtonLabel,class:"pdf-reader__floating-tool-button",onClick:this.toggleThumbnals,type:"button"},i("swirl-icon-file-copy",{key:"71971e955e5520869353075e328f9e6c7ad73e4e"})))),i("div",{key:"8f129691d6802f3f9ff2d530b1191d98b48a23af",class:"pdf-reader__content"},i("nav",{key:"5c7fdd7214766bf24d727f2e98a3262bb09e3f5c","aria-label":this.thumbnailsLabel,class:"pdf-reader__thumbnails",id:"thumbnails"},this.loadingThumbnails&&i("swirl-spinner",{key:"9f3feac0be72bee7fc17793be03327704661b43e"}),!this.loadingThumbnails&&this.thumbnails.map(((e,a)=>{const t=n("pdf-reader__thumbnail",{"pdf-reader__thumbnail--active":this.visiblePages[0]===a+1});return i("button",{"aria-label":`${this.thumbnailButtonLabel} ${a+1}`,class:t,onClick:this.onThumbnailClick(a),type:"button"},i("img",{src:e.toDataURL("image/png"),alt:""}))}))),i("swirl-file-viewer",{key:"39f08272d479985b84212fbe33f2c4c28dbdf1d4",active:this.active,class:"pdf-reader__viewer",file:this.file,fileName:this.fileName,onActivate:this.onActivate,onVisiblePagesChange:this.onVisiblePagesChange,pdfWorkerSrc:this.pdfWorkerSrc,ref:e=>this.viewer=e,type:"application/pdf",viewMode:this.viewMode,zoom:this.zoom}),i("div",{key:"6e250e0eb4cd8555f9a0079627df877236f686ea",class:"pdf-reader__mobile-zoom-controls"},i("button",{key:"29e5bce22826baf2c5d1afa58b7a97bfca12f027","aria-label":this.autoZoomLabel,class:"pdf-reader__mobile-zoom-button",onClick:this.onZoomAutoButtonClick,type:"button"},i("auto"===this.zoom?"swirl-icon-fullscreen-exit":"swirl-icon-fullscreen",null)),i("button",{key:"dba55f7132b4a721914b565b682267f5fdfd82c1","aria-label":this.zoomInButtonLabel,class:"pdf-reader__mobile-zoom-button",disabled:this.zoom===this.zoomSteps[this.zoomSteps.length-1],onClick:this.onZoomInButtonClick,type:"button"},i("swirl-icon-add",{key:"6cb9b1fb22ad4de67bdd9a611afc1257c3e72a47"})),i("button",{key:"49fec30bed12334066f6688b5007bcb9fae8a2a8","aria-label":this.zoomOutButtonLabel,class:"pdf-reader__mobile-zoom-button",disabled:this.zoom===this.zoomSteps[0],onClick:this.onZoomOutButtonClick,type:"button"},i("swirl-icon-remove",{key:"60cbe0f951cbc683d59288a4fb110d68f33457c2"}))))),i("swirl-popover",{key:"117e27615ff56d4c694ff1ada8e3cc013121963d",animation:"scale-in-y",disableScrollLock:!0,id:"menu",label:this.menuLabel,placement:"bottom-end",ref:e=>this.menu=e},i("swirl-stack",{key:"f9404ac16523085bfd88f535b08c6d308b3812a4"},i("div",{key:"04fc585aeb94250cd7c92577769006361a63c286",class:"pdf-reader__meta"},i("div",{key:"4adaabc21720a1917aee05e813146ea1c6253989",class:"pdf-reader__file-icon"},i("svg",{key:"d96d8aa7aff997344eff8d8d40fdea8e90cc6ddb",fill:"none",height:"36",viewBox:"0 0 24 36",width:"24"},i("path",{key:"12295346749d43a06b797fcf992194a52cedd255",d:"M7.01755 21.6V15.192H8.39455C8.64655 15.192 8.86855 15.225 9.06055 15.291C9.25255 15.357 9.42655 15.474 9.58255 15.642C9.73855 15.81 9.84655 16.008 9.90655 16.236C9.96655 16.458 9.99655 16.761 9.99655 17.145C9.99655 17.433 9.97855 17.676 9.94255 17.874C9.91255 18.072 9.84355 18.258 9.73555 18.432C9.60955 18.642 9.44155 18.807 9.23155 18.927C9.02155 19.041 8.74555 19.098 8.40355 19.098H7.93555V21.6H7.01755ZM7.93555 16.056V18.234H8.37655C8.56255 18.234 8.70655 18.207 8.80855 18.153C8.91055 18.099 8.98555 18.024 9.03355 17.928C9.08155 17.838 9.10855 17.727 9.11455 17.595C9.12655 17.463 9.13255 17.316 9.13255 17.154C9.13255 17.004 9.12955 16.863 9.12355 16.731C9.11755 16.593 9.09055 16.473 9.04255 16.371C8.99455 16.269 8.92255 16.191 8.82655 16.137C8.73055 16.083 8.59255 16.056 8.41255 16.056H7.93555Z",fill:"white"}),i("path",{key:"62f24b034fef684d6bcaf7043522c43af6e96f57",d:"M10.6826 21.6V15.192H12.0416C12.5696 15.192 12.9686 15.336 13.2386 15.624C13.5146 15.912 13.6526 16.32 13.6526 16.848V19.845C13.6526 20.445 13.5056 20.889 13.2116 21.177C12.9236 21.459 12.5066 21.6 11.9606 21.6H10.6826ZM11.6006 16.056V20.736H12.0236C12.2816 20.736 12.4646 20.673 12.5726 20.547C12.6806 20.415 12.7346 20.211 12.7346 19.935V16.848C12.7346 16.596 12.6836 16.401 12.5816 16.263C12.4796 16.125 12.2936 16.056 12.0236 16.056H11.6006Z",fill:"white"}),i("path",{key:"1daa4504163b750e8bd7a0f99340bb4275ac8459",d:"M14.5146 21.6V15.192H17.2506V16.056H15.4326V18H17.0166V18.864H15.4326V21.6H14.5146Z",fill:"white"}),i("path",{key:"ecab7ab3453434561df7f2b782d073e8da930ba9",d:"M3.59961 9.00001C3.59961 8.0059 4.4055 7.20001 5.39961 7.20001H14.854C15.3314 7.20001 15.7893 7.38965 16.1268 7.72722L19.8724 11.4728C20.21 11.8104 20.3996 12.2682 20.3996 12.7456V27C20.3996 27.9941 19.5937 28.8 18.5996 28.8H5.39961C4.4055 28.8 3.59961 27.9941 3.59961 27V9.00001Z",fill:"#FF574D"}),i("path",{key:"f701adcf820d5aac6676ae91e2f021dce0ffea0b",d:"M15.5996 7.36166V10.2C15.5996 11.1941 16.4055 12 17.3996 12H20.2379C20.3237 12.1884 20.3768 12.3913 20.3937 12.6H17.3996C16.0785 12.6 15.0067 11.5325 14.9996 10.213L14.9996 7.20587C15.2083 7.2228 15.4112 7.27593 15.5996 7.36166Z",fill:"white"}),i("path",{key:"4f30f927abc92fa2fb8cc1874ca1e15616d5486a",d:"M7.01755 21.6V15.192H8.39455C8.64655 15.192 8.86855 15.225 9.06055 15.291C9.25255 15.357 9.42655 15.474 9.58255 15.642C9.73855 15.81 9.84655 16.008 9.90655 16.236C9.96655 16.458 9.99655 16.761 9.99655 17.145C9.99655 17.433 9.97855 17.676 9.94255 17.874C9.91255 18.072 9.84355 18.258 9.73555 18.432C9.60955 18.642 9.44155 18.807 9.23155 18.927C9.02155 19.041 8.74555 19.098 8.40355 19.098H7.93555V21.6H7.01755ZM7.93555 16.056V18.234H8.37655C8.56255 18.234 8.70655 18.207 8.80855 18.153C8.91055 18.099 8.98555 18.024 9.03355 17.928C9.08155 17.838 9.10855 17.727 9.11455 17.595C9.12655 17.463 9.13255 17.316 9.13255 17.154C9.13255 17.004 9.12955 16.863 9.12355 16.731C9.11755 16.593 9.09055 16.473 9.04255 16.371C8.99455 16.269 8.92255 16.191 8.82655 16.137C8.73055 16.083 8.59255 16.056 8.41255 16.056H7.93555Z",fill:"white"}),i("path",{key:"2b1ca5d1d91fe8490b108437c11dd57f81af8aae",d:"M10.6826 21.6V15.192H12.0416C12.5696 15.192 12.9686 15.336 13.2386 15.624C13.5146 15.912 13.6526 16.32 13.6526 16.848V19.845C13.6526 20.445 13.5056 20.889 13.2116 21.177C12.9236 21.459 12.5066 21.6 11.9606 21.6H10.6826ZM11.6006 16.056V20.736H12.0236C12.2816 20.736 12.4646 20.673 12.5726 20.547C12.6806 20.415 12.7346 20.211 12.7346 19.935V16.848C12.7346 16.596 12.6836 16.401 12.5816 16.263C12.4796 16.125 12.2936 16.056 12.0236 16.056H11.6006Z",fill:"white"}),i("path",{key:"bf0d015a297b434d790c06752bfa4fe422f528dd",d:"M14.5146 21.6V15.192H17.2506V16.056H15.4326V18H17.0166V18.864H15.4326V21.6H14.5146Z",fill:"white"}))),i("div",{key:"b01d8e0908d24ad9b2b33cf125e201a16382aeb3",class:"pdf-reader__file-info"},i("swirl-text",{key:"33439bc9998a1f2d077bd1a59f262e106f7a2cd0",truncate:!0,weight:"semibold"},this.label),i("swirl-text",{key:"95cce7ceb6a1d317234f3c1ab6a1f8a5c3f90a00",color:"subdued",size:"sm",truncate:!0},this.fileTypeLabel))),e&&i("swirl-separator",{key:"430a0264f0ae65fa3e758806bc648d6308a4b2dc"}),i("swirl-action-list",{key:"4f7c45d281299b0003bc8f35d400819095b6e516",class:"pdf-reader__menu"},this.printButtonEnabled&&i("swirl-action-list-item",{key:"028e1a7d66bb8f80625c1569c0f40bb73ecf4dc7",class:"pdf-reader__print-button",icon:"<swirl-icon-print></swirl-icon-print>",label:this.printButtonLabel,onClick:this.onPrintButtonClick}),this.downloadButtonEnabled&&i("swirl-action-list-item",{key:"c69a3e15d5af3870aa7a31a981f69274e5657ffa",class:"pdf-reader__download-button",disabled:this.downloading,icon:this.downloading?'<swirl-spinner size="xs"></swirl-spinner>':"<swirl-icon-download></swirl-icon-download>",label:this.downloadButtonLabel,onClick:this.onDownloadButtonClick}),i("slot",{key:"3d70da99251fbffef992e0f1947e939e69b07be9",name:"menu-items"}))))))}get el(){return s(this)}static get watchers(){return{showThumbnails:["watchShowThumbnails"]}}};f.style=':host{--thumbnails-width:7rem;display:block}:host *{box-sizing:border-box}.pdf-reader{position:fixed;z-index:var(--s-z-40);background-color:var(--s-surface-raised-default);inset:0;touch-action:pan-x pan-y}.pdf-reader[aria-hidden="true"]{display:none}.pdf-reader:not(.pdf-reader--closing) .pdf-reader__body{animation:0.15s pdf-reader-fade-in}@media (prefers-reduced-motion){.pdf-reader:not(.pdf-reader--closing) .pdf-reader__body{animation:none}}.pdf-reader--closing{animation:0.15s pdf-reader-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.pdf-reader--closing{animation:none}}.pdf-reader--show-thumbnails .pdf-reader__thumbnails{max-width:var(--thumbnails-width)}.pdf-reader--show-thumbnails .pdf-reader__floating-tools{left:calc(var(--s-space-16) + var(--thumbnails-width))}.pdf-reader--hide-menu .pdf-reader__menu{display:none}.pdf-reader__body{position:relative;width:100%;height:100%}.pdf-reader__header{display:flex;height:4rem;padding-right:var(--s-space-16);padding-left:var(--s-space-16);align-items:center;border-bottom:var(--s-border-width-default) solid var(--s-border-default);background-color:var(--s-background-default);gap:var(--s-space-8)}.pdf-reader__header-left,.pdf-reader__header-right{display:flex;flex-grow:1;align-items:center;gap:var(--s-space-8)}@media (min-width: 768px){.pdf-reader__header-left,.pdf-reader__header-right{flex-basis:calc(100 / 3 * 1%);flex-grow:0}}.pdf-reader__header-right{justify-content:flex-end}.pdf-reader__header-center{display:none;flex-grow:1;justify-content:center;align-items:center;gap:var(--s-space-16)}@media (min-width: 768px){.pdf-reader__header-center{display:flex}}.pdf-reader__label{overflow:hidden;flex-grow:1;font-weight:var(--s-font-weight-semibold);white-space:nowrap;text-overflow:ellipsis}.pdf-reader__zoom-button-container{display:flex;align-items:center;gap:var(--s-space-8)}.pdf-reader__zoom-button-container>*:not(:last-child){position:relative}.pdf-reader__zoom-button-container>*:not(:last-child):after{position:absolute;top:50%;right:calc(-1 * var(--s-space-4));width:var(--s-border-width-default);height:1.5rem;background-color:var(--s-border-default);content:"";transform:translate3d(50%, -50%, 0)}.pdf-reader__zoom-select-container{position:relative}.pdf-reader__zoom-select{display:inline-flex;height:2.5rem;padding-right:var(--s-space-12);padding-right:calc(var(--s-space-8) + 1.5rem + var(--s-space-12));padding-left:var(--s-space-12);justify-content:flex-start;align-items:center;border:var(--s-border-width-default) solid var(--s-border-default);border-radius:var(--s-border-radius-sm);color:var(--s-interactive-neutral-default);background-color:transparent;font:inherit;font-weight:var(--s-font-weight-medium);cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.pdf-reader__zoom-select:focus:not(:focus-visible){outline:none}.pdf-reader__zoom-select:focus-visible{outline-color:var(--s-focus-default)}.pdf-reader__zoom-select-icon{position:absolute;top:50%;right:var(--s-space-8);display:inline-flex;transform:translateY(-50%);pointer-events:none}.pdf-reader__content{display:flex;width:100%;height:calc(100% - 4rem)}.pdf-reader__thumbnails{display:flex;overflow-x:hidden;overflow-y:auto;max-width:0;height:100%;padding-top:var(--s-space-16);padding-bottom:var(--s-space-16);flex-basis:var(--thumbnails-width);flex-grow:0;flex-shrink:0;align-items:center;background-color:var(--s-background-default);flex-direction:column;transition:max-width 0.2s linear;box-shadow:inset calc(-1 * var(--s-border-width-default)) 0 0 0\n var(--s-border-default);gap:var(--s-space-4)}.pdf-reader__thumbnail{width:5rem;margin:0;padding:0;border:var(--s-border-width-default) solid var(--s-border-default);background-color:transparent;cursor:pointer}.pdf-reader__thumbnail>img{display:inline-flex;width:100%}.pdf-reader__thumbnail--active{border-width:0.125rem;border-color:var(--s-border-highlight)}.pdf-reader__viewer{flex-grow:1}.pdf-reader__mobile-zoom-controls{position:absolute;z-index:1;right:var(--s-space-16);bottom:var(--s-space-32);display:flex;padding-bottom:var(--s-space-4);flex-direction:column;gap:var(--s-space-8)}@media (min-width: 768px){.pdf-reader__mobile-zoom-controls{display:none}}.pdf-reader__mobile-zoom-button{display:inline-flex;width:2.5rem;height:2.5rem;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-on-image);background-color:rgba(0, 0, 0, 0.6);cursor:pointer;transition:opacity 0.15s;pointer-events:auto}.pdf-reader__mobile-zoom-button:disabled{cursor:default}.pdf-reader__floating-tools{position:fixed;z-index:1;bottom:var(--s-space-16);left:var(--s-space-16);display:none;flex-direction:column;transition:left 0.2s linear;gap:var(--s-space-12)}@media (min-width: 768px){.pdf-reader__floating-tools{display:flex}}.pdf-reader__floating-tool-button{display:inline-flex;width:2.5rem;height:2.5rem;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-on-image);background-color:rgba(0, 0, 0, 0.6);cursor:pointer}.pdf-reader__meta{display:flex;padding-top:var(--s-space-4);padding-right:var(--s-space-16);padding-bottom:var(--s-space-4);padding-left:var(--s-space-8);align-items:center;gap:var(--s-space-12)}@media (min-width: 768px){.pdf-reader__meta{max-width:18rem}}.pdf-reader__file-icon{display:inline-flex;padding-left:var(--s-space-4);flex-shrink:0}.pdf-reader__file-info{display:flex;min-width:0;flex-grow:1;flex-direction:column}@keyframes pdf-reader-fade-in{from{opacity:0}to{opacity:1}}@keyframes pdf-reader-fade-out{from{opacity:1}to{opacity:0}}';export{f as swirl_pdf_reader}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as i,h as t,H as e,g as s}from"./p-e212b5b7.js";import{A as o}from"./p-fe0b5250.js";import{d as a,e as n}from"./p-33c168b3.js";import{c as l}from"./p-a5dce9e6.js";import{q as h}from"./p-81ca5135.js";const d=class{constructor(t){i(this,t),this.dragging=!1,this.onKeyDown=i=>{this.modal.shown&&("Escape"===i.code?(i.stopImmediatePropagation(),this.close()):"ArrowLeft"===i.code?this.onPreviousSlideClick():"ArrowRight"===i.code&&this.onNextSlideClick())},this.onCloseButtonClick=()=>{this.close()},this.onDownloadButtonClick=()=>{this.slides[this.activeSlideIndex]?.download(),this.menu.close()},this.onNextSlideClick=()=>{this.activateSlide(Math.min(this.slides.length-1,this.activeSlideIndex+1))},this.onPreviousSlideClick=()=>{this.activateSlide(Math.max(0,this.activeSlideIndex-1))},this.registerSlides=()=>{this.slides=Array.from(this.el.children).filter((i=>"SWIRL-FILE-VIEWER"===i.tagName)),this.setSlideAttributes()},this.onPointerDown=i=>{this.dragging=!0,this.dragStartPosition=i instanceof MouseEvent?i.clientX:i.touches[0].clientX,this.slides.forEach((i=>{i.style.transition="none"}))},this.onPointerMove=async i=>{const t=!(i instanceof MouseEvent)&&i.touches.length>1,e=this.slides[this.activeSlideIndex]?.shadowRoot?.querySelector("swirl-file-viewer-image"),s=!!Boolean(e)&&await e.getZoom()>1;if(!t&&!s&&this.dragging){i.preventDefault();const t=i instanceof MouseEvent?i.clientX-this.dragStartPosition:i.touches[0].clientX-this.dragStartPosition;this.slides.forEach((i=>{const e=this.activeSlideIndex*i.getBoundingClientRect().width;this.dragDelta=t,i.style.transform=`translate3d(${(-e+this.dragDelta)/16}rem, 0, 0)`}))}},this.onPointerUp=()=>{this.dragging=!1,this.dragStartPosition=void 0;const i=this.dragDelta/this.slides[this.activeSlideIndex].getBoundingClientRect().width;this.dragDelta=0;const t=i>.2,e=i<-.2;this.slides.forEach((i=>{i.style.transition=""})),t?this.onPreviousSlideClick():e?this.onNextSlideClick():this.resetSlidePositions()},this.onBackdropClick=i=>{i.target===this.slidesContainer&&this.close()},this.onContextMenu=i=>{this.downloadButtonEnabled||i.preventDefault()},this.closeButtonLabel="Close modal",this.downloadButtonEnabled=!0,this.downloadButtonLabel="Download",this.hideMenu=void 0,this.label=void 0,this.menuLabel="Slide options",this.menuTriggerLabel="Open slide menu",this.nextSlideButtonLabel="Next slide",this.previousSlideButtonLabel="Previous slide",this.activeSlideIndex=0,this.closing=!1,this.slides=void 0}componentWillLoad(){this.registerSlides()}componentDidLoad(){this.modal=new o(this.modalEl),this.activateSlide(0)}disconnectedCallback(){this.modal?.destroy(),this.unlockBodyScroll()}async open(){this.modal.show(),this.lockBodyScroll(),this.activateSlide(this.activeSlideIndex||0)}async close(){this.closing||(this.closing=!0,this.unlockBodyScroll(),setTimeout((()=>{this.modal.hide(),this.resetImageZoom(),this.stopAllMediaPlayers(),this.closing=!1}),150))}async activateSlide(i){this.menu?.close?.(),this.dragging=!1,this.activeSlideIndex=i,this.slides.forEach(((i,t)=>{t===this.activeSlideIndex?(i.removeAttribute("aria-hidden"),i.setAttribute("active","true")):t===this.activeSlideIndex-1||t===this.activeSlideIndex+1?(i.setAttribute("aria-hidden","true"),i.setAttribute("active","true")):i.setAttribute("aria-hidden","true"),i.style.transform=`translate3d(-${100*this.activeSlideIndex}%, 0, 0)`})),setTimeout((()=>{this.slides.forEach(((i,t)=>{t!==this.activeSlideIndex&&t!==this.activeSlideIndex-1&&t!==this.activeSlideIndex+1&&i.setAttribute("active","false")}))}),300),this.stopAllMediaPlayers(),this.resetImageZoom()}setSlideAttributes(){this.slides.forEach((i=>{i.setAttribute("active","false"),i.setAttribute("aria-label",i.file),i.setAttribute("aria-roledescription","slide"),i.setAttribute("role","group")}))}resetSlidePositions(){this.slides.forEach((i=>{i.style.transform=`translate3d(-${100*this.activeSlideIndex}%, 0, 0)`}))}getCurrentFileName(){return this.slides[this.activeSlideIndex]?.file?.split("/").pop()}getCurrentFileType(){return this.slides[this.activeSlideIndex]?.type}getCurrentThumbnailUrl(){return this.slides[this.activeSlideIndex]?.thumbnailUrl}lockBodyScroll(){a(this.el)}unlockBodyScroll(){n(this.el)}getMediaPlayers(){return h(this.el,"video")}stopAllMediaPlayers(){this.getMediaPlayers().forEach((i=>i.pause()))}resetImageZoom(){this.slides.forEach((i=>{const t=i?.shadowRoot?.querySelector("swirl-file-viewer-image");Boolean(t)&&t.resetZoom()}))}render(){const i=this.slides.length>1,s=this.getCurrentFileName(),o=this.getCurrentFileType(),a=this.getCurrentThumbnailUrl(),n=Boolean(this.el.querySelector("[slot='menu-items']"))||this.downloadButtonEnabled,h=l("lightbox",{"lightbox--closing":this.closing,"lightbox--hide-menu":!n});return t(e,{key:"d5eca953ea225e4143e7cc4b7c61370fd1f5b2c4",onKeydown:this.onKeyDown},t("section",{key:"378273af054af9edbd3f36464fe96da998c3e9f7","aria-hidden":"true","aria-label":this.label,class:h,id:"lightbox",onMouseDown:this.onPointerDown,onMouseMove:this.onPointerMove,onMouseOut:this.onPointerUp,onMouseUp:this.onPointerUp,onTouchEnd:this.onPointerUp,onTouchMove:this.onPointerMove,onTouchStart:this.onPointerDown,ref:i=>this.modalEl=i},t("div",{key:"20f0db84e12fdaf49433d20ecc934840314a884a",class:"lightbox__body",role:"document"},t("header",{key:"5d3d1aefd8b0c8731d6e74d4164bab887c2f1c9a",class:"lightbox__header"},t("button",{key:"b5422dc322cda8c120fb6bcf4413f2a7dc2d263f","aria-label":this.closeButtonLabel,class:"lightbox__close-button",onClick:this.onCloseButtonClick},t("swirl-icon-close",{key:"ae2ec77652132ab3cb771ec11bd5bd1973bb13fc"})),!this.hideMenu&&t("swirl-popover-trigger",{key:"b6434861f3e35f5b5ccf2b795e1bc1087891d6e7",swirlPopover:this.menu},t("button",{key:"edb03c6dde6d5d583d1f9cf46dfd7f268057b86f","aria-label":this.menuTriggerLabel,class:"lightbox__menu-button"},t("swirl-icon-more-vertikal",{key:"790a285ca19310f48a4626db0f3ced89212207cd"})))),t("div",{key:"4675c21a5fe659a976292f87cd312f6e024e8793","aria-roledescription":"carousel",class:"lightbox__content",role:"group"},t("div",{key:"df97c003a66820949a1003e14bf726f0dd0be399","aria-atomic":"false","aria-live":"polite",class:"lightbox__slides",onClick:this.onBackdropClick,onContextMenu:this.onContextMenu,ref:i=>this.slidesContainer=i},t("slot",{key:"d30916db345a96af572bdd84e855ac65fba76c43",onSlotchange:this.registerSlides}))),t("div",{key:"0e1851260448438d2b90677273ad4b9a74f14044",class:"lightbox__controls"},t("button",{key:"33fa6534821f20f936f40adf657e55c0ec4883f3","aria-label":this.previousSlideButtonLabel,class:"lightbox__previous-slide-button",disabled:0===this.activeSlideIndex,onClick:this.onPreviousSlideClick},t("swirl-icon-arrow-left",{key:"8bc9982ea1fffef534fdf93b3c58dcde4719ba3e"})),t("button",{key:"7636e9f21d81053558bf194c583297cc80229348","aria-label":this.nextSlideButtonLabel,class:"lightbox__next-slide-button",disabled:this.activeSlideIndex===this.slides.length-1,onClick:this.onNextSlideClick},t("swirl-icon-arrow-right",{key:"f49fe25704a1dfc12dbe37da1030021311bc7991"}))),i&&t("span",{key:"73a2b02137b011e7a235f4e7ce234da6f1350ec9",class:"lightbox__pagination"},t("span",{key:"cc10d14172900af7f1adda7dcc3b02d02317b6b0","aria-current":"page"},this.activeSlideIndex+1)," /"," ",this.slides.length)),!this.hideMenu&&t("swirl-popover",{key:"fec7fd7f4b349d031e4aa48b5e48386a5d4e7244",animation:"scale-in-y",disableScrollLock:!0,id:"slide-menu",label:this.menuLabel,placement:"bottom-end",ref:i=>this.menu=i},t("swirl-stack",{key:"6f94956eee6363a2a897ba5fe1bcb4e143662074"},t("div",{key:"aae4d95fe9746a38af70f1e05c605208f1e668b2",class:"lightbox__meta"},a&&t("div",{key:"406c8fd119e8d7643124758304fdec045f173a7b",class:"lightbox__thumbnail"},t("swirl-thumbnail",{key:"14ad38034b308012d1fe9d60f14a986cacc3cc17",alt:"",src:a})),t("div",{key:"d6a31bcae4cabe0dc9b37c5f7bd63c274fc8366a",class:"lightbox__file-info"},t("swirl-text",{key:"3419d1edada1b595985938dda1318188b27e4a40",truncate:!0,weight:"semibold"},s),t("swirl-text",{key:"b831a261ae3ef8b1744de69cd443b3208350bb8c",color:"subdued",size:"sm",truncate:!0},o))),n&&t("swirl-separator",{key:"dda83f441baa06d2e35940b21897f503097a6237"}),t("swirl-action-list",{key:"425fd0247d3f04ebb416f4a9a06a5bdeeb7d55c1"},this.downloadButtonEnabled&&t("swirl-action-list-item",{key:"9f6b57b9a79499fc778532bd89f9a1a2ae577e20",icon:"<swirl-icon-download></swirl-icon-download>",label:this.downloadButtonLabel,onClick:this.onDownloadButtonClick}),t("slot",{key:"17928f056e5b640ed02a09ed4dfd9398e4b2c930",name:"menu-items"}))))))}get el(){return s(this)}};d.style=':host{display:block}:host *{box-sizing:border-box}.lightbox{position:fixed;z-index:var(--s-z-40);background-color:rgba(0, 0, 0, 1);inset:0}.lightbox[aria-hidden="true"]{display:none}@media (min-width: 768px){.lightbox{background-color:rgba(0, 0, 0, 0.8)}}.lightbox:not(.lightbox--closing) .lightbox__body{animation:0.15s lightbox-fade-in}@media (prefers-reduced-motion){.lightbox:not(.lightbox--closing) .lightbox__body{animation:none}}.lightbox--closing{animation:0.15s lightbox-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.lightbox--closing{animation:none}}.lightbox--hide-menu .lightbox__menu{display:none}.lightbox__body{position:relative;width:100%;height:100%}.lightbox__header{position:absolute;z-index:1;top:0;right:0;left:0;display:flex;padding:var(--s-space-12) var(--s-space-16);justify-content:space-between;align-items:flex-start;pointer-events:none}.lightbox__controls{position:absolute;z-index:1;top:50%;right:0;left:0;display:none;padding-right:var(--s-space-16);padding-left:var(--s-space-16);justify-content:space-between;align-items:flex-start;pointer-events:none}@media (min-width: 768px){.lightbox__controls{display:flex}}.lightbox__close-button,.lightbox__menu-button,.lightbox__previous-slide-button,.lightbox__next-slide-button{display:inline-flex;width:2.5rem;height:2.5rem;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-on-image);background-color:rgba(0, 0, 0, 0.6);cursor:pointer;transition:opacity 0.15s;pointer-events:auto}.lightbox__close-button:disabled,.lightbox__menu-button:disabled,.lightbox__previous-slide-button:disabled,.lightbox__next-slide-button:disabled{pointer-events:none;opacity:0}.lightbox__content{overflow:hidden;width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none}.lightbox__slides{display:flex;width:100%;height:100%}.lightbox__slides ::slotted(*){flex-basis:100%;flex-shrink:0;transition:transform 0.3s}@media (min-width: 768px){.lightbox__slides ::slotted(*){padding:4rem 5rem}}@media (prefers-reduced-motion){.lightbox__slides ::slotted(*){transition:none}}.lightbox__pagination{position:absolute;bottom:var(--s-space-32);left:50%;padding:var(--s-space-4) var(--s-space-12);border-radius:var(--s-border-radius-base);color:var(--s-text-on-image);background-color:rgba(0, 0, 0, 0.6);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);transform:translateX(-50%);pointer-events:none}@media (min-width: 768px){.lightbox__pagination{display:none}}.lightbox__meta{display:flex;padding-top:var(--s-space-4);padding-right:var(--s-space-16);padding-bottom:var(--s-space-4);padding-left:var(--s-space-16);align-items:center;gap:var(--s-space-12)}@media (min-width: 768px){.lightbox__meta{max-width:18rem}}.lightbox__thumbnail{display:inline-flex;flex-shrink:0}.lightbox__file-info{display:flex;min-width:0;flex-grow:1;flex-direction:column}@keyframes lightbox-fade-in{from{opacity:0}to{opacity:1}}@keyframes lightbox-fade-out{from{opacity:1}to{opacity:0}}';export{d as swirl_lightbox}
|
|
1
|
+
import{r as i,h as t,H as e,g as s}from"./p-e212b5b7.js";import{A as o}from"./p-fe0b5250.js";import{d as a,e as n}from"./p-33c168b3.js";import{c as l}from"./p-a5dce9e6.js";import{q as h}from"./p-58abf3c6.js";const d=class{constructor(t){i(this,t),this.dragging=!1,this.onKeyDown=i=>{this.modal.shown&&("Escape"===i.code?(i.stopImmediatePropagation(),this.close()):"ArrowLeft"===i.code?this.onPreviousSlideClick():"ArrowRight"===i.code&&this.onNextSlideClick())},this.onCloseButtonClick=()=>{this.close()},this.onDownloadButtonClick=()=>{this.slides[this.activeSlideIndex]?.download(),this.menu.close()},this.onNextSlideClick=()=>{this.activateSlide(Math.min(this.slides.length-1,this.activeSlideIndex+1))},this.onPreviousSlideClick=()=>{this.activateSlide(Math.max(0,this.activeSlideIndex-1))},this.registerSlides=()=>{this.slides=Array.from(this.el.children).filter((i=>"SWIRL-FILE-VIEWER"===i.tagName)),this.setSlideAttributes()},this.onPointerDown=i=>{this.dragging=!0,this.dragStartPosition=i instanceof MouseEvent?i.clientX:i.touches[0].clientX,this.slides.forEach((i=>{i.style.transition="none"}))},this.onPointerMove=async i=>{const t=!(i instanceof MouseEvent)&&i.touches.length>1,e=this.slides[this.activeSlideIndex]?.shadowRoot?.querySelector("swirl-file-viewer-image"),s=!!Boolean(e)&&await e.getZoom()>1;if(!t&&!s&&this.dragging){i.preventDefault();const t=i instanceof MouseEvent?i.clientX-this.dragStartPosition:i.touches[0].clientX-this.dragStartPosition;this.slides.forEach((i=>{const e=this.activeSlideIndex*i.getBoundingClientRect().width;this.dragDelta=t,i.style.transform=`translate3d(${(-e+this.dragDelta)/16}rem, 0, 0)`}))}},this.onPointerUp=()=>{this.dragging=!1,this.dragStartPosition=void 0;const i=this.dragDelta/this.slides[this.activeSlideIndex].getBoundingClientRect().width;this.dragDelta=0;const t=i>.2,e=i<-.2;this.slides.forEach((i=>{i.style.transition=""})),t?this.onPreviousSlideClick():e?this.onNextSlideClick():this.resetSlidePositions()},this.onBackdropClick=i=>{i.target===this.slidesContainer&&this.close()},this.onContextMenu=i=>{this.downloadButtonEnabled||i.preventDefault()},this.closeButtonLabel="Close modal",this.downloadButtonEnabled=!0,this.downloadButtonLabel="Download",this.hideMenu=void 0,this.label=void 0,this.menuLabel="Slide options",this.menuTriggerLabel="Open slide menu",this.nextSlideButtonLabel="Next slide",this.previousSlideButtonLabel="Previous slide",this.activeSlideIndex=0,this.closing=!1,this.slides=void 0}componentWillLoad(){this.registerSlides()}componentDidLoad(){this.modal=new o(this.modalEl),this.activateSlide(0)}disconnectedCallback(){this.modal?.destroy(),this.unlockBodyScroll()}async open(){this.modal.show(),this.lockBodyScroll(),this.activateSlide(this.activeSlideIndex||0)}async close(){this.closing||(this.closing=!0,this.unlockBodyScroll(),setTimeout((()=>{this.modal.hide(),this.resetImageZoom(),this.stopAllMediaPlayers(),this.closing=!1}),150))}async activateSlide(i){this.menu?.close?.(),this.dragging=!1,this.activeSlideIndex=i,this.slides.forEach(((i,t)=>{t===this.activeSlideIndex?(i.removeAttribute("aria-hidden"),i.setAttribute("active","true")):t===this.activeSlideIndex-1||t===this.activeSlideIndex+1?(i.setAttribute("aria-hidden","true"),i.setAttribute("active","true")):i.setAttribute("aria-hidden","true"),i.style.transform=`translate3d(-${100*this.activeSlideIndex}%, 0, 0)`})),setTimeout((()=>{this.slides.forEach(((i,t)=>{t!==this.activeSlideIndex&&t!==this.activeSlideIndex-1&&t!==this.activeSlideIndex+1&&i.setAttribute("active","false")}))}),300),this.stopAllMediaPlayers(),this.resetImageZoom()}setSlideAttributes(){this.slides.forEach((i=>{i.setAttribute("active","false"),i.setAttribute("aria-label",i.file),i.setAttribute("aria-roledescription","slide"),i.setAttribute("role","group")}))}resetSlidePositions(){this.slides.forEach((i=>{i.style.transform=`translate3d(-${100*this.activeSlideIndex}%, 0, 0)`}))}getCurrentFileName(){return this.slides[this.activeSlideIndex]?.file?.split("/").pop()}getCurrentFileType(){return this.slides[this.activeSlideIndex]?.type}getCurrentThumbnailUrl(){return this.slides[this.activeSlideIndex]?.thumbnailUrl}lockBodyScroll(){a(this.el)}unlockBodyScroll(){n(this.el)}getMediaPlayers(){return h(this.el,"video")}stopAllMediaPlayers(){this.getMediaPlayers().forEach((i=>i.pause()))}resetImageZoom(){this.slides.forEach((i=>{const t=i?.shadowRoot?.querySelector("swirl-file-viewer-image");Boolean(t)&&t.resetZoom()}))}render(){const i=this.slides.length>1,s=this.getCurrentFileName(),o=this.getCurrentFileType(),a=this.getCurrentThumbnailUrl(),n=Boolean(this.el.querySelector("[slot='menu-items']"))||this.downloadButtonEnabled,h=l("lightbox",{"lightbox--closing":this.closing,"lightbox--hide-menu":!n});return t(e,{key:"d5eca953ea225e4143e7cc4b7c61370fd1f5b2c4",onKeydown:this.onKeyDown},t("section",{key:"378273af054af9edbd3f36464fe96da998c3e9f7","aria-hidden":"true","aria-label":this.label,class:h,id:"lightbox",onMouseDown:this.onPointerDown,onMouseMove:this.onPointerMove,onMouseOut:this.onPointerUp,onMouseUp:this.onPointerUp,onTouchEnd:this.onPointerUp,onTouchMove:this.onPointerMove,onTouchStart:this.onPointerDown,ref:i=>this.modalEl=i},t("div",{key:"20f0db84e12fdaf49433d20ecc934840314a884a",class:"lightbox__body",role:"document"},t("header",{key:"5d3d1aefd8b0c8731d6e74d4164bab887c2f1c9a",class:"lightbox__header"},t("button",{key:"b5422dc322cda8c120fb6bcf4413f2a7dc2d263f","aria-label":this.closeButtonLabel,class:"lightbox__close-button",onClick:this.onCloseButtonClick},t("swirl-icon-close",{key:"ae2ec77652132ab3cb771ec11bd5bd1973bb13fc"})),!this.hideMenu&&t("swirl-popover-trigger",{key:"b6434861f3e35f5b5ccf2b795e1bc1087891d6e7",swirlPopover:this.menu},t("button",{key:"edb03c6dde6d5d583d1f9cf46dfd7f268057b86f","aria-label":this.menuTriggerLabel,class:"lightbox__menu-button"},t("swirl-icon-more-vertikal",{key:"790a285ca19310f48a4626db0f3ced89212207cd"})))),t("div",{key:"4675c21a5fe659a976292f87cd312f6e024e8793","aria-roledescription":"carousel",class:"lightbox__content",role:"group"},t("div",{key:"df97c003a66820949a1003e14bf726f0dd0be399","aria-atomic":"false","aria-live":"polite",class:"lightbox__slides",onClick:this.onBackdropClick,onContextMenu:this.onContextMenu,ref:i=>this.slidesContainer=i},t("slot",{key:"d30916db345a96af572bdd84e855ac65fba76c43",onSlotchange:this.registerSlides}))),t("div",{key:"0e1851260448438d2b90677273ad4b9a74f14044",class:"lightbox__controls"},t("button",{key:"33fa6534821f20f936f40adf657e55c0ec4883f3","aria-label":this.previousSlideButtonLabel,class:"lightbox__previous-slide-button",disabled:0===this.activeSlideIndex,onClick:this.onPreviousSlideClick},t("swirl-icon-arrow-left",{key:"8bc9982ea1fffef534fdf93b3c58dcde4719ba3e"})),t("button",{key:"7636e9f21d81053558bf194c583297cc80229348","aria-label":this.nextSlideButtonLabel,class:"lightbox__next-slide-button",disabled:this.activeSlideIndex===this.slides.length-1,onClick:this.onNextSlideClick},t("swirl-icon-arrow-right",{key:"f49fe25704a1dfc12dbe37da1030021311bc7991"}))),i&&t("span",{key:"73a2b02137b011e7a235f4e7ce234da6f1350ec9",class:"lightbox__pagination"},t("span",{key:"cc10d14172900af7f1adda7dcc3b02d02317b6b0","aria-current":"page"},this.activeSlideIndex+1)," /"," ",this.slides.length)),!this.hideMenu&&t("swirl-popover",{key:"fec7fd7f4b349d031e4aa48b5e48386a5d4e7244",animation:"scale-in-y",disableScrollLock:!0,id:"slide-menu",label:this.menuLabel,placement:"bottom-end",ref:i=>this.menu=i},t("swirl-stack",{key:"6f94956eee6363a2a897ba5fe1bcb4e143662074"},t("div",{key:"aae4d95fe9746a38af70f1e05c605208f1e668b2",class:"lightbox__meta"},a&&t("div",{key:"406c8fd119e8d7643124758304fdec045f173a7b",class:"lightbox__thumbnail"},t("swirl-thumbnail",{key:"14ad38034b308012d1fe9d60f14a986cacc3cc17",alt:"",src:a})),t("div",{key:"d6a31bcae4cabe0dc9b37c5f7bd63c274fc8366a",class:"lightbox__file-info"},t("swirl-text",{key:"3419d1edada1b595985938dda1318188b27e4a40",truncate:!0,weight:"semibold"},s),t("swirl-text",{key:"b831a261ae3ef8b1744de69cd443b3208350bb8c",color:"subdued",size:"sm",truncate:!0},o))),n&&t("swirl-separator",{key:"dda83f441baa06d2e35940b21897f503097a6237"}),t("swirl-action-list",{key:"425fd0247d3f04ebb416f4a9a06a5bdeeb7d55c1"},this.downloadButtonEnabled&&t("swirl-action-list-item",{key:"9f6b57b9a79499fc778532bd89f9a1a2ae577e20",icon:"<swirl-icon-download></swirl-icon-download>",label:this.downloadButtonLabel,onClick:this.onDownloadButtonClick}),t("slot",{key:"17928f056e5b640ed02a09ed4dfd9398e4b2c930",name:"menu-items"}))))))}get el(){return s(this)}};d.style=':host{display:block}:host *{box-sizing:border-box}.lightbox{position:fixed;z-index:var(--s-z-40);background-color:rgba(0, 0, 0, 1);inset:0}.lightbox[aria-hidden="true"]{display:none}@media (min-width: 768px){.lightbox{background-color:rgba(0, 0, 0, 0.8)}}.lightbox:not(.lightbox--closing) .lightbox__body{animation:0.15s lightbox-fade-in}@media (prefers-reduced-motion){.lightbox:not(.lightbox--closing) .lightbox__body{animation:none}}.lightbox--closing{animation:0.15s lightbox-fade-out;animation-fill-mode:forwards}@media (prefers-reduced-motion){.lightbox--closing{animation:none}}.lightbox--hide-menu .lightbox__menu{display:none}.lightbox__body{position:relative;width:100%;height:100%}.lightbox__header{position:absolute;z-index:1;top:0;right:0;left:0;display:flex;padding:var(--s-space-12) var(--s-space-16);justify-content:space-between;align-items:flex-start;pointer-events:none}.lightbox__controls{position:absolute;z-index:1;top:50%;right:0;left:0;display:none;padding-right:var(--s-space-16);padding-left:var(--s-space-16);justify-content:space-between;align-items:flex-start;pointer-events:none}@media (min-width: 768px){.lightbox__controls{display:flex}}.lightbox__close-button,.lightbox__menu-button,.lightbox__previous-slide-button,.lightbox__next-slide-button{display:inline-flex;width:2.5rem;height:2.5rem;justify-content:center;align-items:center;border:none;border-radius:50%;color:var(--s-icon-on-image);background-color:rgba(0, 0, 0, 0.6);cursor:pointer;transition:opacity 0.15s;pointer-events:auto}.lightbox__close-button:disabled,.lightbox__menu-button:disabled,.lightbox__previous-slide-button:disabled,.lightbox__next-slide-button:disabled{pointer-events:none;opacity:0}.lightbox__content{overflow:hidden;width:100%;height:100%;-webkit-user-select:none;-moz-user-select:none;user-select:none}.lightbox__slides{display:flex;width:100%;height:100%}.lightbox__slides ::slotted(*){flex-basis:100%;flex-shrink:0;transition:transform 0.3s}@media (min-width: 768px){.lightbox__slides ::slotted(*){padding:4rem 5rem}}@media (prefers-reduced-motion){.lightbox__slides ::slotted(*){transition:none}}.lightbox__pagination{position:absolute;bottom:var(--s-space-32);left:50%;padding:var(--s-space-4) var(--s-space-12);border-radius:var(--s-border-radius-base);color:var(--s-text-on-image);background-color:rgba(0, 0, 0, 0.6);font-weight:var(--s-font-weight-medium);line-height:var(--s-line-height-base);transform:translateX(-50%);pointer-events:none}@media (min-width: 768px){.lightbox__pagination{display:none}}.lightbox__meta{display:flex;padding-top:var(--s-space-4);padding-right:var(--s-space-16);padding-bottom:var(--s-space-4);padding-left:var(--s-space-16);align-items:center;gap:var(--s-space-12)}@media (min-width: 768px){.lightbox__meta{max-width:18rem}}.lightbox__thumbnail{display:inline-flex;flex-shrink:0}.lightbox__file-info{display:flex;min-width:0;flex-grow:1;flex-direction:column}@keyframes lightbox-fade-in{from{opacity:0}to{opacity:1}}@keyframes lightbox-fade-out{from{opacity:1}to{opacity:0}}';export{d as swirl_lightbox}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as t,c as i,h as s,H as e}from"./p-e212b5b7.js";import{c as n}from"./p-a5dce9e6.js";import{g as r}from"./p-81ca5135.js";const a=class{constructor(s){t(this,s),this.inputBlur=i(this,"inputBlur",7),this.inputFocus=i(this,"inputFocus",7),this.valueChange=i(this,"valueChange",7),this.desktopMediaQuery=r(),this.desktopMediaQueryHandler=t=>{this.updateIconSize(t.matches)},this.clear=()=>{this.inputEl.value="",this.value="",this.valueChange.emit(""),this.inputEl.focus()},this.onChange=t=>{this.value=t.target.value},this.onBlur=t=>{this.inputBlur.emit(t)},this.onFocus=t=>{this.inputFocus.emit(t),this.handleAutoSelect(t)},this.onInput=t=>{this.onChange(t)},this.onKeyPress=t=>{"number"===this.type&&["+","-","e"].includes(t.key)&&t.preventDefault()},this.decreaseValue=()=>{if("number"!==this.type)return;const t=this.step||1;let i=this.inputEl.valueAsNumber;isNaN(this.inputEl.valueAsNumber)&&(i=void 0!==this.min?this.min+1:1),this.value=String(Math.max(this.min||-1/0,i-t)),this.valueChange.emit(this.value)},this.increaseValue=()=>{if("number"!==this.type)return;const t=this.step||1;let i=this.inputEl.valueAsNumber;isNaN(this.inputEl.valueAsNumber)&&(i=void 0!==this.min?this.min-1:-1),this.value=String(Math.min(this.max||1/0,i+t)),this.valueChange.emit(this.value)},this.togglePassword=()=>{"password"===this.type&&(this.showPassword=!this.showPassword)},this.autoComplete="on",this.autoFocus=void 0,this.autoGrow=void 0,this.autoSelect=void 0,this.clearable=void 0,this.clearButtonLabel="Clear input",this.disabled=void 0,this.disableDynamicWidth=void 0,this.swirlAriaAutocomplete=void 0,this.swirlAriaControls=void 0,this.swirlAriaDescribedby=void 0,this.swirlAriaExpanded=void 0,this.swirlRole=void 0,this.inline=void 0,this.invalid=void 0,this.maxLength=void 0,this.max=void 0,this.min=void 0,this.mode=void 0,this.placeholder=void 0,this.prefixLabel=void 0,this.required=void 0,this.rows=1,this.showCharacterCounter=void 0,this.spellCheck=void 0,this.suffixLabel=void 0,this.step=void 0,this.passwordToggleLabel="Toggle password display",this.type="text",this.value=void 0,this.iconSize=24,this.showPassword=!1}componentDidLoad(){this.updateIconSize(this.desktopMediaQuery.matches),this.desktopMediaQuery.onchange=this.desktopMediaQueryHandler,this.autoFocus&&setTimeout((()=>{this.inputEl.focus()}))}componentDidRender(){this.adjustInputSize()}disconnectedCallback(){this.desktopMediaQuery.removeEventListener?.("change",this.desktopMediaQueryHandler)}async blurInput(){this.inputEl.blur()}async focusInput(){this.inputEl.focus()}watchValue(t,i){t!==i&&this.valueChange.emit(t)}updateIconSize(t){this.iconSize=t?20:24}adjustInputSize(){(this.rows>1||this.autoGrow)&&(this.inputEl.style.width="",this.inputEl.style.height="",this.inputEl.style.height=Boolean(this.inputEl.scrollHeight)?this.inputEl.scrollHeight/16+"rem":""),1!==this.rows||this.autoGrow||(this.inputEl.style.height="",this.inputEl.style.width="",!this.suffixLabel||"password"===this.type||this.disableDynamicWidth||Boolean(this.placeholder)||(this.inputEl.style.width=this.inputEl.scrollWidth/16+"rem"))}handleAutoSelect(t){this.autoSelect&&t.target.select()}render(){const t=1!==this.rows||this.autoGrow?"textarea":"input",i=!0===this.invalid||!1===this.invalid?String(this.invalid):void 0,r="number"===this.type&&!this.disabled,a="password"===this.type&&!this.disabled,p=this.clearable&&!this.disabled&&Boolean(this.value)&&!a&&!r&&!this.showCharacterCounter,o="password"===this.type&&this.showPassword?"text":this.type,u=n("text-input",`text-input--type-${this.type}`,{"text-input--auto-grow":this.autoGrow,"text-input--clearable":this.clearable,"text-input--disabled":this.disabled,"text-input--disable-dynamic-width":this.disableDynamicWidth||Boolean(this.placeholder),"text-input--has-suffix":Boolean(this.suffixLabel),"text-input--inline":this.inline,"text-input--show-password":"password"===this.type&&this.showPassword});return s(e,{key:"c28a27d2de16b8bab0bcbdedeb4577cc3c5926f1"},s("div",{key:"de1f6b38914d6dc549145a3a37730689429c9647",class:u},this.prefixLabel&&s("span",{key:"188008d2d73f51127abe4de37306c82110344b29",class:"text-input__prefix"},this.prefixLabel),s(t,{key:"2264633163429eb618346241bbc99384a62fd4bb","aria-autocomplete":this.swirlAriaAutocomplete,"aria-controls":this.swirlAriaControls,"aria-describedby":this.swirlAriaDescribedby,"aria-disabled":this.disabled?"true":void 0,"aria-expanded":this.swirlAriaExpanded,"aria-invalid":i,autoComplete:this.autoComplete,autoFocus:this.autoFocus,class:"text-input__input",disabled:this.disabled,inputMode:this.mode,maxLength:this.maxLength,max:"number"===this.type?this.max:void 0,min:"number"===this.type?this.min:void 0,onBlur:this.onBlur,onFocus:this.onFocus,onInput:this.onInput,onKeyPress:this.onKeyPress,placeholder:Boolean(this.suffixLabel)?void 0:this.placeholder,ref:t=>this.inputEl=t,required:this.required,role:this.swirlRole,rows:this.rows>1?this.rows:this.autoGrow?1:void 0,spellcheck:this.spellCheck,step:"number"===this.type?this.step:void 0,type:o,value:this.value},this.rows>1&&this.value),this.suffixLabel&&s("span",{key:"5c226c6d35fe35b226c08182bce3ee479584d3bc",class:"text-input__suffix"},this.suffixLabel),p&&s("button",{key:"0825d6c0aa246d8ec97d0f47ca7a33e7437c69fb","aria-label":this.clearButtonLabel,class:"text-input__clear-button",onClick:this.clear,part:"text-input__clear-button",type:"button"},s("swirl-icon-cancel",{key:"cb6d259a99c490949d946014aaccb9b92dd18a45",size:this.iconSize})),a&&s("button",{key:"5638f04a71fac455dc1a2dc9aff4a19ad55bf9b3","aria-label":this.passwordToggleLabel,class:"text-input__password-toggle",onClick:this.togglePassword,type:"button"},s(this.showPassword?"swirl-icon-visibility-off":"swirl-icon-visibility",{size:this.iconSize})),r&&s("span",{key:"6f8f117c6690ea375472c86befa0bc82d5c1b04d",class:"text-input__stepper"},s("button",{key:"38ddc8bcc00c22f54a4f60195420179bfce8916d","aria-hidden":"true",class:"text-input__step-button",onClick:this.increaseValue,tabIndex:-1,type:"button"},s("swirl-icon-expand-less",{key:"d7445a23fa97ec57672d65f1334be7ac74368347",size:this.iconSize})),s("button",{key:"0295b7bd2bdcb0b3afb431e35c714c01d305eaa5","aria-hidden":"true",class:"text-input__step-button",onClick:this.decreaseValue,tabIndex:-1,type:"button"},s("swirl-icon-expand-more",{key:"ad77b5281090dcf3dbbdc2adaf2147f937be7273",size:this.iconSize}))),this.showCharacterCounter&&s("span",{key:"c3cdea8f4d70aba88baba76c6c74c39ca83ca367",class:"text-input__character-counter"},this.value?.length||0," ",Boolean(this.maxLength)?`/ ${this.maxLength}`:"")))}static get watchers(){return{value:["watchValue"]}}};a.style='.sc-swirl-text-input-h{display:block;width:100%}.sc-swirl-text-input-h *.sc-swirl-text-input{box-sizing:border-box}.text-input.sc-swirl-text-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);font:inherit;line-height:var(--s-line-height-sm);cursor:text}.text-input--auto-grow.sc-swirl-text-input .text-input__input.sc-swirl-text-input{max-height:none}.text-input--clearable.sc-swirl-text-input,.text-input--type-number.sc-swirl-text-input,.text-input--type-password.sc-swirl-text-input{padding-right:calc(1.5rem + var(--s-space-8))}.text-input--show-password.sc-swirl-text-input .text-input__input.sc-swirl-text-input{width:100%}.text-input--disabled.sc-swirl-text-input .text-input__character-counter.sc-swirl-text-input{color:var(--s-text-disabled)}.text-input--has-suffix.sc-swirl-text-input input.text-input__input.sc-swirl-text-input:not([type="password"]){width:0.25rem;min-width:0.25rem}.text-input--inline.sc-swirl-text-input .text-input__stepper.sc-swirl-text-input{top:calc(-1 * var(--s-space-8));right:calc(-1 * var(--s-space-12))}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input--inline.sc-swirl-text-input .text-input__stepper.sc-swirl-text-input{top:calc(-1 * var(--s-space-8));right:calc(-1 * var(--s-space-12))}}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input{width:2rem;height:1.125rem;justify-content:center;background-color:var(--s-surface-raised-default)}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input:first-of-type{border-top-right-radius:var(--s-border-radius-sm)}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input:last-of-type{border-bottom-right-radius:var(--s-border-radius-sm)}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input:hover{background-color:var(--s-surface-raised-hovered)}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input swirl-icon-expand-less.sc-swirl-text-input,.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input swirl-icon-expand-more.sc-swirl-text-input{width:1rem}.text-input--inline.sc-swirl-text-input .text-input__clear-button.sc-swirl-text-input,.text-input--inline.sc-swirl-text-input .text-input__password-toggle.sc-swirl-text-input{top:-0.0625rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input--inline.sc-swirl-text-input .text-input__clear-button.sc-swirl-text-input,.text-input--inline.sc-swirl-text-input .text-input__password-toggle.sc-swirl-text-input{top:0}}.text-input--inline.sc-swirl-text-input .text-input__character-counter.sc-swirl-text-input{top:calc(100% + var(--s-space-12) + var(--s-border-width-default));right:calc(-1 * var(--s-space-12));max-width:6rem}.text-input__input.sc-swirl-text-input{display:inline-flex;width:100%;max-height:13.75rem;margin:0;padding:0;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);resize:none;caret-color:var(--s-border-highlight)}.text-input__input.sc-swirl-text-input:focus{outline:none}.text-input__input.sc-swirl-text-input:disabled{color:var(--s-text-disabled);background-color:transparent}.text-input__input.sc-swirl-text-input::-webkit-outer-spin-button,.text-input__input.sc-swirl-text-input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.text-input__input[type="number"].sc-swirl-text-input{-moz-appearance:textfield}.text-input__input.sc-swirl-text-input::-moz-placeholder{font-size:var(--swirl-text-input-placeholder-size)}.text-input__input.sc-swirl-text-input::placeholder{font-size:var(--swirl-text-input-placeholder-size)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__input.sc-swirl-text-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.text-input--disable-dynamic-width.sc-swirl-text-input input.text-input__input.sc-swirl-text-input:not([type="password"]){width:100%;min-width:0}.text-input__clear-button.sc-swirl-text-input,.text-input__password-toggle.sc-swirl-text-input{position:absolute;top:calc(-1 * var(--s-space-12));right:0;display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.text-input__clear-button.sc-swirl-text-input:focus:not(:focus-visible),.text-input__password-toggle.sc-swirl-text-input:focus:not(:focus-visible){outline:none}.text-input__clear-button.sc-swirl-text-input:focus-visible,.text-input__password-toggle.sc-swirl-text-input:focus-visible{outline-color:var(--s-focus-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__clear-button.sc-swirl-text-input,.text-input__password-toggle.sc-swirl-text-input{top:-0.625rem}}.text-input__stepper.sc-swirl-text-input{position:absolute;top:-1.4375rem;right:0;display:flex;flex-direction:column}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__stepper.sc-swirl-text-input{top:-1.25rem}}.text-input__step-button.sc-swirl-text-input{display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.text-input__step-button.sc-swirl-text-input:focus:not(:focus-visible){outline:none}.text-input__step-button.sc-swirl-text-input:focus-visible{outline-color:var(--s-focus-default)}.text-input__character-counter.sc-swirl-text-input{position:absolute;top:-1.375rem;right:0;display:flex;color:var(--s-text-subdued);line-height:var(--s-line-height-sm);flex-direction:column}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__character-counter.sc-swirl-text-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.text-input__prefix.sc-swirl-text-input{padding-right:var(--s-space-4);color:var(--s-text-subdued);font-size:var(--s-font-size-base)}.text-input__suffix.sc-swirl-text-input{padding-left:var(--s-space-4);color:var(--s-text-subdued);font-size:var(--s-font-size-base)}';export{a as swirl_text_input}
|
|
1
|
+
import{r as t,c as i,h as s,H as e}from"./p-e212b5b7.js";import{c as n}from"./p-a5dce9e6.js";import{g as r}from"./p-58abf3c6.js";const a=class{constructor(s){t(this,s),this.inputBlur=i(this,"inputBlur",7),this.inputFocus=i(this,"inputFocus",7),this.valueChange=i(this,"valueChange",7),this.desktopMediaQuery=r(),this.desktopMediaQueryHandler=t=>{this.updateIconSize(t.matches)},this.clear=()=>{this.inputEl.value="",this.value="",this.valueChange.emit(""),this.inputEl.focus()},this.onChange=t=>{this.value=t.target.value},this.onBlur=t=>{this.inputBlur.emit(t)},this.onFocus=t=>{this.inputFocus.emit(t),this.handleAutoSelect(t)},this.onInput=t=>{this.onChange(t)},this.onKeyPress=t=>{"number"===this.type&&["+","-","e"].includes(t.key)&&t.preventDefault()},this.decreaseValue=()=>{if("number"!==this.type)return;const t=this.step||1;let i=this.inputEl.valueAsNumber;isNaN(this.inputEl.valueAsNumber)&&(i=void 0!==this.min?this.min+1:1),this.value=String(Math.max(this.min||-1/0,i-t)),this.valueChange.emit(this.value)},this.increaseValue=()=>{if("number"!==this.type)return;const t=this.step||1;let i=this.inputEl.valueAsNumber;isNaN(this.inputEl.valueAsNumber)&&(i=void 0!==this.min?this.min-1:-1),this.value=String(Math.min(this.max||1/0,i+t)),this.valueChange.emit(this.value)},this.togglePassword=()=>{"password"===this.type&&(this.showPassword=!this.showPassword)},this.autoComplete="on",this.autoFocus=void 0,this.autoGrow=void 0,this.autoSelect=void 0,this.clearable=void 0,this.clearButtonLabel="Clear input",this.disabled=void 0,this.disableDynamicWidth=void 0,this.swirlAriaAutocomplete=void 0,this.swirlAriaControls=void 0,this.swirlAriaDescribedby=void 0,this.swirlAriaExpanded=void 0,this.swirlRole=void 0,this.inline=void 0,this.invalid=void 0,this.maxLength=void 0,this.max=void 0,this.min=void 0,this.mode=void 0,this.placeholder=void 0,this.prefixLabel=void 0,this.required=void 0,this.rows=1,this.showCharacterCounter=void 0,this.spellCheck=void 0,this.suffixLabel=void 0,this.step=void 0,this.passwordToggleLabel="Toggle password display",this.type="text",this.value=void 0,this.iconSize=24,this.showPassword=!1}componentDidLoad(){this.updateIconSize(this.desktopMediaQuery.matches),this.desktopMediaQuery.onchange=this.desktopMediaQueryHandler,this.autoFocus&&setTimeout((()=>{this.inputEl.focus()}))}componentDidRender(){this.adjustInputSize()}disconnectedCallback(){this.desktopMediaQuery.removeEventListener?.("change",this.desktopMediaQueryHandler)}async blurInput(){this.inputEl.blur()}async focusInput(){this.inputEl.focus()}watchValue(t,i){t!==i&&this.valueChange.emit(t)}updateIconSize(t){this.iconSize=t?20:24}adjustInputSize(){(this.rows>1||this.autoGrow)&&(this.inputEl.style.width="",this.inputEl.style.height="",this.inputEl.style.height=Boolean(this.inputEl.scrollHeight)?this.inputEl.scrollHeight/16+"rem":""),1!==this.rows||this.autoGrow||(this.inputEl.style.height="",this.inputEl.style.width="",!this.suffixLabel||"password"===this.type||this.disableDynamicWidth||Boolean(this.placeholder)||(this.inputEl.style.width=this.inputEl.scrollWidth/16+"rem"))}handleAutoSelect(t){this.autoSelect&&t.target.select()}render(){const t=1!==this.rows||this.autoGrow?"textarea":"input",i=!0===this.invalid||!1===this.invalid?String(this.invalid):void 0,r="number"===this.type&&!this.disabled,a="password"===this.type&&!this.disabled,p=this.clearable&&!this.disabled&&Boolean(this.value)&&!a&&!r&&!this.showCharacterCounter,o="password"===this.type&&this.showPassword?"text":this.type,u=n("text-input",`text-input--type-${this.type}`,{"text-input--auto-grow":this.autoGrow,"text-input--clearable":this.clearable,"text-input--disabled":this.disabled,"text-input--disable-dynamic-width":this.disableDynamicWidth||Boolean(this.placeholder),"text-input--has-suffix":Boolean(this.suffixLabel),"text-input--inline":this.inline,"text-input--show-password":"password"===this.type&&this.showPassword});return s(e,{key:"c28a27d2de16b8bab0bcbdedeb4577cc3c5926f1"},s("div",{key:"de1f6b38914d6dc549145a3a37730689429c9647",class:u},this.prefixLabel&&s("span",{key:"188008d2d73f51127abe4de37306c82110344b29",class:"text-input__prefix"},this.prefixLabel),s(t,{key:"2264633163429eb618346241bbc99384a62fd4bb","aria-autocomplete":this.swirlAriaAutocomplete,"aria-controls":this.swirlAriaControls,"aria-describedby":this.swirlAriaDescribedby,"aria-disabled":this.disabled?"true":void 0,"aria-expanded":this.swirlAriaExpanded,"aria-invalid":i,autoComplete:this.autoComplete,autoFocus:this.autoFocus,class:"text-input__input",disabled:this.disabled,inputMode:this.mode,maxLength:this.maxLength,max:"number"===this.type?this.max:void 0,min:"number"===this.type?this.min:void 0,onBlur:this.onBlur,onFocus:this.onFocus,onInput:this.onInput,onKeyPress:this.onKeyPress,placeholder:Boolean(this.suffixLabel)?void 0:this.placeholder,ref:t=>this.inputEl=t,required:this.required,role:this.swirlRole,rows:this.rows>1?this.rows:this.autoGrow?1:void 0,spellcheck:this.spellCheck,step:"number"===this.type?this.step:void 0,type:o,value:this.value},this.rows>1&&this.value),this.suffixLabel&&s("span",{key:"5c226c6d35fe35b226c08182bce3ee479584d3bc",class:"text-input__suffix"},this.suffixLabel),p&&s("button",{key:"0825d6c0aa246d8ec97d0f47ca7a33e7437c69fb","aria-label":this.clearButtonLabel,class:"text-input__clear-button",onClick:this.clear,part:"text-input__clear-button",type:"button"},s("swirl-icon-cancel",{key:"cb6d259a99c490949d946014aaccb9b92dd18a45",size:this.iconSize})),a&&s("button",{key:"5638f04a71fac455dc1a2dc9aff4a19ad55bf9b3","aria-label":this.passwordToggleLabel,class:"text-input__password-toggle",onClick:this.togglePassword,type:"button"},s(this.showPassword?"swirl-icon-visibility-off":"swirl-icon-visibility",{size:this.iconSize})),r&&s("span",{key:"6f8f117c6690ea375472c86befa0bc82d5c1b04d",class:"text-input__stepper"},s("button",{key:"38ddc8bcc00c22f54a4f60195420179bfce8916d","aria-hidden":"true",class:"text-input__step-button",onClick:this.increaseValue,tabIndex:-1,type:"button"},s("swirl-icon-expand-less",{key:"d7445a23fa97ec57672d65f1334be7ac74368347",size:this.iconSize})),s("button",{key:"0295b7bd2bdcb0b3afb431e35c714c01d305eaa5","aria-hidden":"true",class:"text-input__step-button",onClick:this.decreaseValue,tabIndex:-1,type:"button"},s("swirl-icon-expand-more",{key:"ad77b5281090dcf3dbbdc2adaf2147f937be7273",size:this.iconSize}))),this.showCharacterCounter&&s("span",{key:"c3cdea8f4d70aba88baba76c6c74c39ca83ca367",class:"text-input__character-counter"},this.value?.length||0," ",Boolean(this.maxLength)?`/ ${this.maxLength}`:"")))}static get watchers(){return{value:["watchValue"]}}};a.style='.sc-swirl-text-input-h{display:block;width:100%}.sc-swirl-text-input-h *.sc-swirl-text-input{box-sizing:border-box}.text-input.sc-swirl-text-input{position:relative;display:flex;width:100%;align-items:center;color:var(--s-text-default);font:inherit;line-height:var(--s-line-height-sm);cursor:text}.text-input--auto-grow.sc-swirl-text-input .text-input__input.sc-swirl-text-input{max-height:none}.text-input--clearable.sc-swirl-text-input,.text-input--type-number.sc-swirl-text-input,.text-input--type-password.sc-swirl-text-input{padding-right:calc(1.5rem + var(--s-space-8))}.text-input--show-password.sc-swirl-text-input .text-input__input.sc-swirl-text-input{width:100%}.text-input--disabled.sc-swirl-text-input .text-input__character-counter.sc-swirl-text-input{color:var(--s-text-disabled)}.text-input--has-suffix.sc-swirl-text-input input.text-input__input.sc-swirl-text-input:not([type="password"]){width:0.25rem;min-width:0.25rem}.text-input--inline.sc-swirl-text-input .text-input__stepper.sc-swirl-text-input{top:calc(-1 * var(--s-space-8));right:calc(-1 * var(--s-space-12))}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input--inline.sc-swirl-text-input .text-input__stepper.sc-swirl-text-input{top:calc(-1 * var(--s-space-8));right:calc(-1 * var(--s-space-12))}}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input{width:2rem;height:1.125rem;justify-content:center;background-color:var(--s-surface-raised-default)}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input:first-of-type{border-top-right-radius:var(--s-border-radius-sm)}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input:last-of-type{border-bottom-right-radius:var(--s-border-radius-sm)}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input:hover{background-color:var(--s-surface-raised-hovered)}.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input swirl-icon-expand-less.sc-swirl-text-input,.text-input--inline.sc-swirl-text-input .text-input__step-button.sc-swirl-text-input swirl-icon-expand-more.sc-swirl-text-input{width:1rem}.text-input--inline.sc-swirl-text-input .text-input__clear-button.sc-swirl-text-input,.text-input--inline.sc-swirl-text-input .text-input__password-toggle.sc-swirl-text-input{top:-0.0625rem}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input--inline.sc-swirl-text-input .text-input__clear-button.sc-swirl-text-input,.text-input--inline.sc-swirl-text-input .text-input__password-toggle.sc-swirl-text-input{top:0}}.text-input--inline.sc-swirl-text-input .text-input__character-counter.sc-swirl-text-input{top:calc(100% + var(--s-space-12) + var(--s-border-width-default));right:calc(-1 * var(--s-space-12));max-width:6rem}.text-input__input.sc-swirl-text-input{display:inline-flex;width:100%;max-height:13.75rem;margin:0;padding:0;border:none;color:var(--s-text-default);background-color:transparent;font:inherit;font-size:var(--s-font-size-base);line-height:var(--s-line-height-base);resize:none;caret-color:var(--s-border-highlight)}.text-input__input.sc-swirl-text-input:focus{outline:none}.text-input__input.sc-swirl-text-input:disabled{color:var(--s-text-disabled);background-color:transparent}.text-input__input.sc-swirl-text-input::-webkit-outer-spin-button,.text-input__input.sc-swirl-text-input::-webkit-inner-spin-button{margin:0;-webkit-appearance:none}.text-input__input[type="number"].sc-swirl-text-input{-moz-appearance:textfield}.text-input__input.sc-swirl-text-input::-moz-placeholder{font-size:var(--swirl-text-input-placeholder-size)}.text-input__input.sc-swirl-text-input::placeholder{font-size:var(--swirl-text-input-placeholder-size)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__input.sc-swirl-text-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.text-input--disable-dynamic-width.sc-swirl-text-input input.text-input__input.sc-swirl-text-input:not([type="password"]){width:100%;min-width:0}.text-input__clear-button.sc-swirl-text-input,.text-input__password-toggle.sc-swirl-text-input{position:absolute;top:calc(-1 * var(--s-space-12));right:0;display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.text-input__clear-button.sc-swirl-text-input:focus:not(:focus-visible),.text-input__password-toggle.sc-swirl-text-input:focus:not(:focus-visible){outline:none}.text-input__clear-button.sc-swirl-text-input:focus-visible,.text-input__password-toggle.sc-swirl-text-input:focus-visible{outline-color:var(--s-focus-default)}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__clear-button.sc-swirl-text-input,.text-input__password-toggle.sc-swirl-text-input{top:-0.625rem}}.text-input__stepper.sc-swirl-text-input{position:absolute;top:-1.4375rem;right:0;display:flex;flex-direction:column}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__stepper.sc-swirl-text-input{top:-1.25rem}}.text-input__step-button.sc-swirl-text-input{display:inline-flex;margin:0;padding:0;border:none;color:var(--s-icon-default);background-color:transparent;cursor:pointer}.text-input__step-button.sc-swirl-text-input:focus:not(:focus-visible){outline:none}.text-input__step-button.sc-swirl-text-input:focus-visible{outline-color:var(--s-focus-default)}.text-input__character-counter.sc-swirl-text-input{position:absolute;top:-1.375rem;right:0;display:flex;color:var(--s-text-subdued);line-height:var(--s-line-height-sm);flex-direction:column}@media (min-width: 992px) and (max-width: 1439px) and (hover: hover),(min-width: 1440px){.text-input__character-counter.sc-swirl-text-input{font-size:var(--s-font-size-sm);line-height:var(--s-line-height-sm)}}.text-input__prefix.sc-swirl-text-input{padding-right:var(--s-space-4);color:var(--s-text-subdued);font-size:var(--s-font-size-base)}.text-input__suffix.sc-swirl-text-input{padding-left:var(--s-space-4);color:var(--s-text-subdued);font-size:var(--s-font-size-base)}';export{a as swirl_text_input}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as t,h as o,H as s,g as i}from"./p-e212b5b7.js";import{b as e}from"./p-
|
|
1
|
+
import{r as t,h as o,H as s,g as i}from"./p-e212b5b7.js";import{b as e}from"./p-58abf3c6.js";const r=class{constructor(o){t(this,o),this.onKeyDown=t=>{"ArrowDown"===t.code||"ArrowRight"===t.code?(t.preventDefault(),this.focusNextItem()):"ArrowUp"!==t.code&&"ArrowLeft"!==t.code||(t.preventDefault(),this.focusPreviousItem())},this.label=void 0,this.orientation="horizontal"}componentDidLoad(){const t=this.getItems();this.deactivateTabIndexes(t);const o=t[0]?.querySelector("button");Boolean(o)&&(o.tabIndex=0)}getItems(){return Array.from(this.el.querySelectorAll("swirl-button, swirl-chip"))}focusNextItem(){const t=this.getItems(),o=this.getActiveItemIndex(t);this.focusItem(t[(o+1)%t.length])}focusPreviousItem(){const t=this.getItems(),o=this.getActiveItemIndex(t);this.focusItem(t[0===o?t.length-1:o-1])}getActiveItemIndex(t){const o=e();return t.findIndex((t=>t===o?.closest("swirl-button, swirl-chip")))}focusItem(t){const o=this.getItems();if(this.deactivateTabIndexes(o),!Boolean(t))return;const s=t.querySelector("button");Boolean(s)&&(s.tabIndex=0,s.focus())}deactivateTabIndexes(t){t.forEach((t=>{const o=t.querySelector("button");Boolean(o)&&(o.tabIndex=-1)}))}render(){return o(s,{key:"5df7c943ac7df8f09fc8b1d45f4d56857cbfb2f6"},o("swirl-stack",{key:"c21b170cae85b76061ed0c1206f49f54bf69a4a2",align:"center","aria-label":this.label,"aria-orientation":this.orientation,role:"toolbar",onKeyDown:this.onKeyDown,orientation:this.orientation,spacing:"8"},o("slot",{key:"fd1acd8fbe00fdd09ca9c403fe1276405f81caae"})))}get el(){return i(this)}};r.style=":host{display:block}:host *{box-sizing:border-box}";export{r as swirl_toolbar}
|