q2-tecton-elements 1.10.8 → 1.11.0
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/dist/cjs/{icons-4595ee47.js → icons-9bd0febe.js} +10 -0
- package/dist/cjs/{index-a55d3c34.js → index-f5807a6a.js} +12 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/q2-avatar.cjs.entry.js +1 -1
- package/dist/cjs/q2-btn_2.cjs.entry.js +1 -1
- package/dist/cjs/q2-calendar.cjs.entry.js +5 -3
- package/dist/cjs/q2-card.cjs.entry.js +89 -0
- package/dist/cjs/q2-carousel-pane.cjs.entry.js +1 -1
- package/dist/cjs/q2-carousel.cjs.entry.js +1 -1
- package/dist/cjs/q2-checkbox-group.cjs.entry.js +4 -1
- package/dist/cjs/q2-checkbox.cjs.entry.js +26 -7
- package/dist/cjs/q2-dropdown-item.cjs.entry.js +1 -1
- package/dist/cjs/q2-dropdown.cjs.entry.js +1 -1
- package/dist/cjs/q2-editable-field.cjs.entry.js +23 -18
- package/dist/cjs/q2-icon.cjs.entry.js +2 -2
- package/dist/cjs/q2-input.cjs.entry.js +12 -7
- package/dist/cjs/q2-loc.cjs.entry.js +1 -1
- package/dist/cjs/q2-message.cjs.entry.js +1 -1
- package/dist/cjs/q2-optgroup.cjs.entry.js +1 -1
- package/dist/cjs/q2-pagination.cjs.entry.js +118 -0
- package/dist/cjs/q2-radio-group.cjs.entry.js +48 -3
- package/dist/cjs/q2-radio.cjs.entry.js +8 -3
- package/dist/cjs/q2-section.cjs.entry.js +1 -1
- package/dist/cjs/q2-select.cjs.entry.js +18 -8
- package/dist/cjs/q2-stepper-pane.cjs.entry.js +1 -1
- package/dist/cjs/q2-stepper.cjs.entry.js +4 -2
- package/dist/cjs/q2-tab-container.cjs.entry.js +4 -2
- package/dist/cjs/q2-tecton-elements.cjs.js +1 -1
- package/dist/cjs/q2-textarea.cjs.entry.js +2 -2
- package/dist/collection/collection-manifest.json +2 -0
- package/dist/collection/components/q2-calendar/index.js +21 -2
- package/dist/collection/components/q2-card/index.js +290 -0
- package/dist/collection/components/q2-card/styles.css +161 -0
- package/dist/collection/components/q2-checkbox/index.js +43 -7
- package/dist/collection/components/q2-checkbox/styles.css +6 -2
- package/dist/collection/components/q2-checkbox-group/index.js +21 -0
- package/dist/collection/components/q2-editable-field/index.js +27 -20
- package/dist/collection/components/q2-icon/icons.js +10 -0
- package/dist/collection/components/q2-input/index.js +61 -5
- package/dist/collection/components/q2-input/styles.css +86 -125
- package/dist/collection/components/q2-pagination/index.js +277 -0
- package/dist/collection/components/q2-pagination/styles.css +120 -0
- package/dist/collection/components/q2-radio/index.js +25 -1
- package/dist/collection/components/q2-radio/styles.css +16 -16
- package/dist/collection/components/q2-radio-group/index.js +77 -9
- package/dist/collection/components/q2-radio-group/styles.css +4 -9
- package/dist/collection/components/q2-select/index.js +35 -7
- package/dist/collection/components/q2-stepper/index.js +2 -0
- package/dist/collection/components/q2-stepper/styles.css +4 -4
- package/dist/collection/components/q2-tab-container/index.js +3 -1
- package/dist/collection/components/q2-textarea/styles.css +72 -109
- package/dist/collection/components/tecton-tab-pane/index.js +1 -1
- package/dist/collection/utils/index.js +11 -1
- package/dist/esm/{icons-3ee662ea.js → icons-6a143c2f.js} +10 -0
- package/dist/esm/{index-ec6660af.js → index-0e13a57f.js} +12 -2
- package/dist/esm/loader.js +1 -1
- package/dist/esm/q2-avatar.entry.js +1 -1
- package/dist/esm/q2-btn_2.entry.js +1 -1
- package/dist/esm/q2-calendar.entry.js +5 -3
- package/dist/esm/q2-card.entry.js +85 -0
- package/dist/esm/q2-carousel-pane.entry.js +1 -1
- package/dist/esm/q2-carousel.entry.js +1 -1
- package/dist/esm/q2-checkbox-group.entry.js +4 -1
- package/dist/esm/q2-checkbox.entry.js +26 -7
- package/dist/esm/q2-dropdown-item.entry.js +1 -1
- package/dist/esm/q2-dropdown.entry.js +1 -1
- package/dist/esm/q2-editable-field.entry.js +23 -18
- package/dist/esm/q2-icon.entry.js +2 -2
- package/dist/esm/q2-input.entry.js +12 -7
- package/dist/esm/q2-loc.entry.js +1 -1
- package/dist/esm/q2-message.entry.js +1 -1
- package/dist/esm/q2-optgroup.entry.js +1 -1
- package/dist/esm/q2-pagination.entry.js +114 -0
- package/dist/esm/q2-radio-group.entry.js +49 -4
- package/dist/esm/q2-radio.entry.js +8 -3
- package/dist/esm/q2-section.entry.js +1 -1
- package/dist/esm/q2-select.entry.js +18 -8
- package/dist/esm/q2-stepper-pane.entry.js +1 -1
- package/dist/esm/q2-stepper.entry.js +4 -2
- package/dist/esm/q2-tab-container.entry.js +4 -2
- package/dist/esm/q2-tecton-elements.js +1 -1
- package/dist/esm/q2-textarea.entry.js +2 -2
- package/dist/q2-tecton-elements/{p-a6f8d09a.entry.js → p-2372f988.entry.js} +1 -1
- package/dist/q2-tecton-elements/p-27ec0a16.entry.js +1 -0
- package/dist/q2-tecton-elements/{p-fbf7c5e6.entry.js → p-2be33492.entry.js} +1 -1
- package/dist/q2-tecton-elements/p-346b65d5.entry.js +1 -0
- package/dist/q2-tecton-elements/p-3c6f73cb.js +1 -0
- package/dist/q2-tecton-elements/p-3cb34e2e.entry.js +1 -0
- package/dist/q2-tecton-elements/{p-843b1ee9.entry.js → p-492dfb55.entry.js} +1 -1
- package/dist/q2-tecton-elements/p-564154f3.entry.js +1 -0
- package/dist/q2-tecton-elements/{p-7e6fc65d.entry.js → p-6a83a97c.entry.js} +1 -1
- package/dist/q2-tecton-elements/{p-9b50c3c3.entry.js → p-701b381a.entry.js} +1 -1
- package/dist/q2-tecton-elements/p-7dec37d6.entry.js +1 -0
- package/dist/q2-tecton-elements/p-841ec108.entry.js +1 -0
- package/dist/q2-tecton-elements/{p-bb2e110a.entry.js → p-88bc2f49.entry.js} +1 -1
- package/dist/q2-tecton-elements/p-9ccbc3d8.entry.js +1 -0
- package/dist/q2-tecton-elements/{p-8509b171.entry.js → p-a72e7a12.entry.js} +1 -1
- package/dist/q2-tecton-elements/{p-df182f61.entry.js → p-af202624.entry.js} +1 -1
- package/dist/q2-tecton-elements/p-b5b12e46.entry.js +1 -0
- package/dist/q2-tecton-elements/{p-c5e55b9f.entry.js → p-bfd77f9b.entry.js} +1 -1
- package/dist/q2-tecton-elements/p-c83dba0a.entry.js +1 -0
- package/dist/q2-tecton-elements/p-ca847db7.entry.js +1 -0
- package/dist/q2-tecton-elements/p-d199fca8.entry.js +1 -0
- package/dist/q2-tecton-elements/p-dffbcec3.entry.js +1 -0
- package/dist/q2-tecton-elements/{p-5559f126.entry.js → p-f73df612.entry.js} +1 -1
- package/dist/q2-tecton-elements/{p-bbacb804.entry.js → p-f85bf7fb.entry.js} +1 -1
- package/dist/q2-tecton-elements/p-f85da2a8.js +1 -0
- package/dist/q2-tecton-elements/p-fc318ae2.entry.js +1 -0
- package/dist/q2-tecton-elements/{p-07a5d703.entry.js → p-fe61c1aa.entry.js} +1 -1
- package/dist/q2-tecton-elements/q2-tecton-elements.esm.js +1 -1
- package/dist/test/helpers.js +10 -3
- package/dist/types/components/q2-calendar/index.d.ts +1 -0
- package/dist/types/components/q2-card/index.d.ts +31 -0
- package/dist/types/components/q2-checkbox/index.d.ts +4 -0
- package/dist/types/components/q2-checkbox-group/index.d.ts +1 -0
- package/dist/types/components/q2-editable-field/index.d.ts +2 -0
- package/dist/types/components/q2-input/index.d.ts +3 -0
- package/dist/types/components/q2-pagination/index.d.ts +30 -0
- package/dist/types/components/q2-radio/index.d.ts +2 -1
- package/dist/types/components/q2-radio-group/index.d.ts +4 -0
- package/dist/types/components/q2-select/index.d.ts +2 -0
- package/dist/types/components.d.ts +80 -0
- package/dist/types/util.d.ts +1 -1
- package/dist/types/utils/index.d.ts +1 -0
- package/dist/types/workspace/workspace/{tecton-production_release_1.10.x → Tecton_tecton-production_master}/packages/q2-tecton-elements/.stencil/test/helpers.d.ts +4 -1
- package/package.json +2 -2
- package/dist/q2-tecton-elements/p-37aba2a4.js +0 -1
- package/dist/q2-tecton-elements/p-4ae9d1f3.entry.js +0 -1
- package/dist/q2-tecton-elements/p-4cd00f1a.js +0 -1
- package/dist/q2-tecton-elements/p-52f53e07.entry.js +0 -1
- package/dist/q2-tecton-elements/p-78642b7b.entry.js +0 -1
- package/dist/q2-tecton-elements/p-7eb39c90.entry.js +0 -1
- package/dist/q2-tecton-elements/p-81df91a1.entry.js +0 -1
- package/dist/q2-tecton-elements/p-95a73559.entry.js +0 -1
- package/dist/q2-tecton-elements/p-96c9eb75.entry.js +0 -1
- package/dist/q2-tecton-elements/p-ab977515.entry.js +0 -1
- package/dist/q2-tecton-elements/p-c555f1de.entry.js +0 -1
- package/dist/q2-tecton-elements/p-fa6eea5c.entry.js +0 -1
- package/dist/q2-tecton-elements/p-fc804ebd.entry.js +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as t,h as e,g as o}from"./p-080839ed.js";import{h as r,l as i}from"./p-
|
|
1
|
+
import{r as t,h as e,g as o}from"./p-080839ed.js";import{h as r,l as i}from"./p-f85da2a8.js";const n=class{constructor(e){t(this,e),this.onItemClick=t=>{t.stopImmediatePropagation(),this.hostElement.dispatchEvent(new CustomEvent("click",{detail:{type:"select",value:this.value||""},bubbles:!0}))},this.onItemKeydown=t=>{["ArrowRight","Right"].includes(t.key)&&this.focusRemoveBtn()},this.onItemFocus=t=>{t.stopPropagation()},this.onRemoveBtnClick=t=>{t.stopImmediatePropagation(),this.hostElement.dispatchEvent(new CustomEvent("click",{detail:{type:"remove",value:this.value||""},bubbles:!0}))},this.onRemoveBtnKeydown=t=>{["ArrowLeft","Left"].includes(t.key)&&this.focusItem()},this.onRemoveBtnFocus=t=>{t.stopPropagation()}}componentWillLoad(){r(this)}ariaLabelObserver(){r(this)}get removeLabel(){return i("tecton.element.dropdownItem.remove",[this.label||""])}get dropdownItemBtn(){return this.hostElement.shadowRoot.querySelector(".dropdown-item")}get innerLabel(){return this.label||this.hostElement.textContent}get removeBtn(){return this.hostElement.shadowRoot.querySelector(".remove-dropdown-item")}onHostElementFocus(){event.target===this.hostElement&&this.focusItem()}focusItem(){this.dropdownItemBtn.dispatchEvent(new FocusEvent("focus",{bubbles:!1}))}focusRemoveBtn(){this.removeBtn&&this.removeBtn.dispatchEvent(new FocusEvent("focus",{bubbles:!1}))}render(){return this.separator?this.separatorDOM():this.itemDOM()}separatorDOM(){return e("div",{class:"dropdown-separator",role:"separator","test-id":"dropdownItemSeparator"})}itemDOM(){return e("div",{class:"dropdown-item-wrapper"},e("q2-btn",{class:"dropdown-item",label:this.innerLabel,"hide-label":!0,disabled:!!this.disabled,role:"menuitem",onClick:this.onItemClick,onKeyDown:this.onItemKeydown,onFocus:this.onItemFocus,"test-id":"dropdownItem"},e("div",{class:"dropdown-item-content"},e("slot",null))),this.removable?e("q2-btn",{class:"remove-dropdown-item",label:this.removeLabel,"hide-label":!0,disabled:!!this.disabled,role:"menuitem",onClick:this.onRemoveBtnClick,onKeyDown:this.onRemoveBtnKeydown,onFocus:this.onRemoveBtnFocus,"test-id":"removeDropdownItem"},e("q2-icon",{type:"close"})):"")}get hostElement(){return o(this)}static get watchers(){return{ariaLabel:["ariaLabelObserver"]}}};n.style="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-global-focus)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}.dropdown-separator{margin:0 var(--tct-scale-1, var(--app-scale-1, 5px));border-bottom:1px solid var(--tct-dropdown-item-separator-color, var(--tct-gray-11, var(--t-gray-11, var(--tct-gray-l1, var(--app-gray-l1, #cccccc)))))}.dropdown-item-wrapper{display:flex}.dropdown-item{min-height:44px;flex:1 1 100%;padding:var(--tct-dropdown-item-padding, 2px)}.dropdown-item-content{padding:12px var(--tct-scale-3, var(--app-scale-3, 15px));text-align:left;background-color:var(--tct-dropdown-item-bg, var(--tct-white, var(--t-base, var(--app-white, #ffffff))));color:var(--tct-dropdown-item-font-color, inherit);transition:background-color var(--tct-tween-1, var(--app-tween-1, 0.2s ease));overflow:hidden;text-overflow:ellipsis;flex:1}:host(:not([disabled])) .dropdown-item-content:hover,:host(:not([disabled])) .dropdown-item:focus-within .dropdown-item-content{background-color:var(--tct-dropdown-item-selected-bg, var(--tct-gray-14, var(--t-gray-14, var(--tct-gray-l3, var(--app-gray-l3, var(--t-base, #f2f2f2))))));color:var(--tct-dropdown-item-selected-font-color, inherit)}.remove-dropdown-item{flex:0 0 44px;margin:2px}";export{n as q2_dropdown_item}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,c as a,h as r,F as i,g as e}from"./p-080839ed.js";import{a as o,o as s,i as n}from"./p-f85da2a8.js";const c=class{constructor(r){t(this,r),this.click=a(this,"click",7),this.isTouch=o(),this.isAutoTouch=!1,this.isAutoSmall=!1,this.handleClick=t=>{if(this.url)return!0;t.preventDefault(),t.stopPropagation(),this.click.emit()}}componentDidLoad(){const{hostElement:t,clickableElement:a}=this;t.click=()=>a.click(),s(this.hostElement),this.resizeObserver=new ResizeObserver((()=>this.determineAutoSmall())),this.resizeObserver.observe(this.hostElement)}willDestroyElement(){this.resizeObserver=null}onHostElementFocus(t){n(t,this.hostElement)&&this.clickableElement.focus()}determineAutoTouch(){this.hostElement.hasAttribute("is-touch")||(this.isAutoTouch=o())}determineAutoSmall(){var t,a;if(this.hostElement.hasAttribute("is-small"))return;const{containerElement:r,avatarElement:i}=this,e=null!==(t=null==i?void 0:i.offsetWidth)&&void 0!==t?t:0,o=null!==(a=null==r?void 0:r.offsetWidth)&&void 0!==a?a:0;this.isAutoSmall=e+o<350}generateAvatar(){const{avatarName:t,avatarInitials:a,avatarSrc:i,avatarIcon:e}=this;return e?r("q2-icon",{type:e,ref:t=>this.avatarElement=t,"test-id":"avatar"}):t||a||i?r("q2-avatar",{name:t,initials:a,src:i,ref:t=>this.avatarElement=t,"test-id":"avatar"}):void 0}generateContent(){return r(i,null,this.generateAvatar(),r("div",{class:"container","test-id":"contentContainer",ref:t=>this.containerElement=t},this.title&&r("h3",{"test-id":"title"},this.title),this.description&&r("p",{"test-id":"description"},this.description)),this.isTouch&&r("q2-icon",{"test-id":"touchIndicator",type:"chevron-right",class:"touch-indicator"}))}generateContainerClasses(){const{isSmall:t,isAutoSmall:a,avatarName:r,avatarInitials:i,avatarSrc:e,avatarIcon:o,isTouch:s,isAutoTouch:n}=this;let c=[];const d=s||n,h=r||i||e||o;return(t||a)&&c.push("is-small"),d&&c.push("is-touch"),h&&c.push("has-avatar"),c.join(" ")}render(){const{url:t}=this;return t?r("a",{ref:t=>this.clickableElement=t,href:this.url,class:this.generateContainerClasses(),target:this.target,rel:"noopener noreferrer","test-id":"clickableElement",onClick:this.handleClick},this.generateContent()):r("button",{ref:t=>this.clickableElement=t,class:this.generateContainerClasses(),"test-id":"clickableElement",type:"button",onClick:this.handleClick},this.generateContent())}get hostElement(){return e(this)}};c.style="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-global-focus)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:block}button,a{width:100%;text-align:start;cursor:pointer;height:100%;display:grid;gap:var(--tct-card-gap, var(--t-card-gap, var(--app-scale-3x, 15px)));margin:0;border:none;background:var(--tct-card-background, var(--t-card-background, var(--t-base, #ffffff)));padding:var(--tct-card-padding, var(--t-card-padding, var(--app-scale-4x, 20px)));color:var(--tct-card-color, var(--t-card-color, var(--t-text, #4d4d4d)));text-decoration:none;border-radius:var(--tct-card-border-radius, var(--t-card-border-radius, var(--app-border-radius-1, 3px)));transition:box-shadow var(--tct-tween-1, var(--app-tween-1, 0.2s ease));box-shadow:var(--tct-card-box-shadow, var(--t-card-box-shadow, var(--app-shadow-2, 0 3px 6px rgba(0, 0, 0, 0.3))));--comp-avatar-size:var(--tct-card-avatar-size, var(--t-card-avatar-size, 44px));--comp-chevron-size:0}@media (hover: hover){button:hover,button:active,button:focus,a:hover,a:active,a:focus{color:var(--tct-card-color, var(--t-card-color, var(--t-text, #4d4d4d)))}button:hover,a:hover{box-shadow:var(--tct-card-hover-box-shadow, var(--t-card-hover-box-shadow, var(--app-shadow-3, 0 4px 12px rgba(0, 0, 0, 0.3))))}button:active,a:active{box-shadow:var(--tct-card-active-box-shadow, var(--t-card-active-box-shadow, var(--app-shadow-1, 0 2px 4px rgba(0, 0, 0, 0.3))))}}button.is-small,a.is-small{--comp-avatar-size:var(--tct-card-avatar-size, var(--t-card-avatar-size, 26px))}button.is-touch,a.is-touch{--comp-chevron-size:var(--tct-card-chevron-size, var(--t-card-chevron-size, 26px));grid-template-columns:1fr var(--comp-chevron-size)}button.has-avatar,a.has-avatar{grid-template-columns:var(--comp-avatar-size) 1fr;--tct-avatar-width:var(--comp-avatar-size);--tct-avatar-height:var(--comp-avatar-size);--tct-icon-size:var(--comp-avatar-size)}button.has-avatar.is-touch,a.has-avatar.is-touch{grid-template-columns:var(--comp-avatar-size) 1fr var(--comp-chevron-size)}.container{overflow:hidden;display:grid;gap:var(--tct-card-container-gap, var(--t-card-container-gap, var(--app-scale-1x, 5px)));align-content:start}h3,p{margin:0;padding:0;line-height:var(--tct-card-font-height, var(--t-card-font-height, 20px))}h3{font-weight:var(--tct-card-font-weight, var(--t-card-font-weight, 600));font-size:var(--tct-card-font-size, var(--t-card-font-size, 17px));text-overflow:ellipsis;overflow:hidden;white-space:nowrap}p{text-overflow:ellipsis;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.touch-indicator{align-self:center;--tct-icon-size:var(--comp-chevron-size)}";export{c as q2_card}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as o,h as i}from"./p-080839ed.js";import{l as n}from"./p-
|
|
1
|
+
import{r as o,h as i}from"./p-080839ed.js";import{l as n}from"./p-f85da2a8.js";const t=class{constructor(i){o(this,i)}render(){return i("span",null,n(this.value,this.substitutions))}};t.style="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-global-focus)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{display:inline}";export{t as q2_loc}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,c as e,h as i,g as n}from"./p-080839ed.js";import{o as a,i as o,l as s,n as l}from"./p-f85da2a8.js";const r=class{constructor(i){t(this,i),this.change=e(this,"change",7),this.handlePageChange=t=>{const{totalPages:e,inputField:i}=this;t<1?t=1:t>e&&(t=e),i.value!==`${t}`&&(i.value=`${t}`),this.hostElement.onchange||(this.page=t),this.change.emit({value:t})}}componentDidLoad(){this.recordsOnly||this.pagesOnly||(this.containerWidth=this.containerElement.clientWidth,this.resizeObserver=new ResizeObserver((()=>this.checkSize())),this.resizeObserver.observe(this.hostElement),a(this.hostElement))}disconnectedCallback(){var t;null===(t=this.resizeObserver)||void 0===t||t.disconnect()}onHostElementFocus(t){var e;if(!o(t,this.hostElement))return;const{isFullViewHidden:i,containerElement:n,inputField:a}=this;i?null===(e=n.querySelector("q2-btn:not([disabled])"))||void 0===e||e.focus():a.focus()}get isFullViewHidden(){return this.isSmall||this.recordsOnly||this.pagesOnly}get pageWithDefault(){return this.page||1}get perPageWithDefault(){return this.perPage||10}get totalWithDefault(){return this.total||0}get recordTypeWithDefault(){return this.recordType||s("tecton.element.pagination.defaultRecordType")}get currentRange(){const{perPageWithDefault:t,totalWithDefault:e,pageWithDefault:i}=this;return`${(i-1)*t+1} - ${Math.min(i*t,e)}`}get totalPages(){const{pagesOnly:t,totalWithDefault:e,perPageWithDefault:i,pages:n}=this;return t&&n&&!isNaN(parseInt(`${n}`))?n:Math.ceil(e/i)}checkSize(){const{hostElement:t,containerElement:e}=this,i=this.containerWidth>t.clientWidth;this.isSmall=i,i||l((()=>{this.containerWidth===e.clientWidth||(this.containerWidth=e.clientWidth,this.checkSize())}))}render(){const{pagesOnly:t,isFullViewHidden:e,recordTypeWithDefault:n,totalPages:a,totalWithDefault:o,pageWithDefault:l,currentRange:r}=this,p=1===l,h=l===a;return i("nav",{class:"container",ref:t=>this.containerElement=t,"aria-label":s("tecton.element.pagination.title")},i("div",{class:"description","test-id":"description"},t?s("tecton.element.pagination.pages",{current:l,total:a}):s("tecton.element.pagination.description",{range:r,recordType:n.toLowerCase(),total:o.toLocaleString()})),i("div",{class:"btn-group"},i("q2-btn",{label:"tecton.element.pagination.goToFirstPage",disabled:p,hidden:e,onClick:()=>this.handlePageChange(1),"test-id":"firstPageBtn","hide-label":!0},i("q2-icon",{type:"chevron-double-left"})),i("q2-btn",{label:s("tecton.element.pagination.goToPage",[l-1]),disabled:p,onClick:()=>this.handlePageChange(l-1),"test-id":"prevPageBtn","hide-label":!0},i("q2-icon",{type:"chevron-left"}))),i("div",{class:"controls",hidden:e,"test-id":"controls"},i("span",{"aria-hidden":"true"},s("tecton.element.pagination.page")),i("div",{class:"input-wrapper",onClick:()=>this.inputField.dispatchEvent(new FocusEvent("focus"))},i("q2-input",{type:"number",value:`${l}`,min:1,max:this.totalPages,hideLabel:!0,optional:!0,label:`${s("tecton.element.pagination.page")} (${s("tecton.element.pagination.ofPages",[a.toLocaleString()])})`,onChange:t=>this.handlePageChange(t.detail.value),"test-id":"pageInput",current:"page",ref:t=>this.inputField=t})),i("span",{"aria-hidden":"true"},s("tecton.element.pagination.ofPages",[a.toLocaleString()]))),i("div",{class:"btn-group"},i("q2-btn",{label:s("tecton.element.pagination.goToPage",[l+1]),disabled:h,onClick:()=>this.handlePageChange(l+1),"test-id":"nextPageBtn","hide-label":!0},i("q2-icon",{type:"chevron-right"})),i("q2-btn",{label:"tecton.element.pagination.goToLastPage",disabled:h,hidden:e,onClick:()=>this.handlePageChange(a),"test-id":"lastPageBtn","hide-label":!0},i("q2-icon",{type:"chevron-double-right"}))))}get hostElement(){return n(this)}};r.style="*{box-sizing:border-box}*:active{outline:none}*:focus{outline:none;box-shadow:var(--const-global-focus)}:host{box-shadow:none !important}::-moz-focus-inner{border:none}input,textarea,button{font-family:inherit;font-size:inherit}:host(.sr),:host(.sr) button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sr,.sr button{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.hidden{display:none}:host([hidden]){display:none}.invisible{visibility:hidden}:host{text-align:right;display:block}:host([hidden]){display:none}.container{display:inline-flex;column-gap:var(--tct-pagination-column-gap, var(--t-pagination-column-gap, var(--app-scale-2x, 10px)));align-items:center;height:var(--tct-pagination-height, var(--t-pagination-height, 44px))}.btn-group{display:flex;gap:var(--tct-pagination-btn-gap, var(--t-pagination-btn-gap, 0))}.description,.controls{white-space:nowrap}.controls{display:grid;grid-template-columns:auto 50px auto;align-items:center;gap:var(--tct-pagination-controls-gap, var(--t-pagination-controls-gap, var(--app-scale-1x, 5px)))}.controls[hidden]{display:none}.input-wrapper{height:var(--tct-pagination-height, var(--t-pagination-height, 44px));display:flex;align-items:center}q2-icon{--tct-icon-size:var(--tct-pagination-icon-size, var(--t-pagination-icon-size, 12px));color:var(--tct-pagination-icon-color, var(--t-pagination-icon-color, var(--t-text, #4d4d4d)))}q2-input{--tct-input-margin-top:0;--tct-input-margin-bottom:0;--tct-input-height:var(--tct-pagination-input-height, var(--t-pagination-input-height, 30px));--tct-input-min-height:var(--tct-input-height);--tct-input-align:center}";export{r as q2_pagination}
|