@aurigma/ui-framework/dist/imports/es5/dynamic.au-widget-group.khmyapxzyk.js

A platform which allows building print product personalization editors based on Aurigma's Customer's Canvas.

(window.multistep_editor_jsonpFunction=window.multistep_editor_jsonpFunction||[]).push([[30],{838:function(n,t){n.exports='<style>\n    :host {\n        display: flex;\n        flex-direction: row;\n        flex: 0 0 auto;\n        --iron-icon-width: 24px;\n        --iron-icon-height: 24px;\n        background: var(--au-collapse-background-color, #f5f5f5);\n        @apply --au-collapse;\n    }\n\n    #trigger {\n        @apply --layout-horizontal;\n        @apply --layout-center;\n        padding-left: 16px;\n        padding-right: 16px;\n        background: var(--au-collapse-trigger-color, #e8e8e8);\n        flex: 0 0 auto;\n        flex-direction: row-reverse;\n        cursor: pointer;\n    }\n\n    #trigger ::slotted([slot="collapse-trigger"]) {\n        display: inline-flex;\n        width: 100%;\n        height: var(--au-collapse-height, 38px);\n        justify-content: left;\n        align-items: center;\n    }\n\n    iron-collapse ::slotted([slot="collapse-content"]) {\n        width: 100%;\n        height: 100%;\n        display: flex;\n        flex-direction: column;\n        justify-content: flex-start;\n    }\n\n    iron-collapse {\n        padding-left: 16px;\n        padding-right: 16px;\n        overflow-y: auto;\n        overflow-x: hidden;\n        max-height: 650px;\n        position: relative;\n        z-index: 1;\n        flex: 1 1 auto;\n    }\n\n    :host([opened]) {\n        flex: 1 1 auto;\n        height: 100px;\n    }\n\n    .collapse-container {\n        display: flex;\n        flex-direction: column;\n        width: 100%;\n    }\n\n    .open {\n        transform: rotate(180deg);\n        transition: transform 0.25s ease;\n    }\n\n    .close {\n        transform: rotate(360deg);\n        transition: transform 0.25s ease;\n    }\n\n    #trigger iron-icon {\n        z-index: 9;\n        color: var(--theme-text-color-1);\n    }\n</style>\n<div class="collapse-container">\n    <div id="trigger" on-tap="toggle">\n        <iron-icon icon="au-icons:expand_more" class$="[[_toggle(opened)]]" hidden$="[[noIcons]]"></iron-icon>\n        <au-icon-fixer></au-icon-fixer>\n        <slot name="collapse-trigger"></slot>\n    </div>\n    <iron-collapse id="collapse" horizontal="[[horizontal]]" no-animation="[[noAnimation]]" opened="[[opened]]">\n        <template is="dom-if" if="{{scrollable}}">\n            <au-custom-scroll></au-custom-scroll>\n        </template>\n        <slot name="collapse-content"></slot>\n    </iron-collapse>\n</div>\n'},839:function(n,t){n.exports='<style>\n    .collapse-title {\n        @apply --au-widget-title-font;\n    }\n\n    .tab-icon {\n        margin: 8px;\n    }\n\n    .group-container {\n        width: 100%;\n        height: 100%;\n        display: flex;\n        flex-direction: column;\n        box-sizing: border-box;\n    }\n\n    .toggle-title {\n        cursor: pointer;\n    }\n</style>\n<div class="group-container" id="container" style="overflow: var(--aurigma-group-overflow, hidden);">\n    <dom-repeat items="{{tabs}}" as="tab">\n        <template>\n            <au-collapse name="[[tab.title]]" scrollable="[[scrollable]]" style="overflow: var(--aurigma-group-overflow, hidden);" opened="[[tab.opened]]" on-opened-changed="_onOpenedChange"\n                data-tab$="[[index]]">\n                <span slot="collapse-trigger" class="collapse-title">\n                    <dom-if if="{{tab.icon}}">\n                        <template>\n                            <iron-icon icon="{{tab.icon}}" class="tab-icon"></iron-icon>\n                            <au-icon-fixer></au-icon-fixer>\n                        </template>\n                    </dom-if>\n                    <dom-if if="{{tab.title}}">\n                        <template>\n                            <span class="toggle-title">{{tab.title}}</span>\n                        </template>\n                    </dom-if>\n                </span>\n                <span slot="collapse-content">\n                    <dom-repeat items="{{tab.widgets}}" as="widget" id="repeater">\n                        <template>\n                            <au-widget style$="[[_getStylesByType(widget.type)]]" name="{{widget.name}}" group="{{self}}" language="{{language}}"\n                                driver="{{driver}}" definition="{{widget}}"></au-widget>\n                        </template>\n                    </dom-repeat>\n                </span>\n            </au-collapse>\n        </template>\n    </dom-repeat>\n</div>\n'},840:function(n,t){n.exports='<style>\n    :host {\n        --group-padding-title-horizontal: calc(1.25 * var(--au-hem));\n        --group-padding-title-vertical: calc(1 * var(--au-hem));\n\n        --group-padding-content-top: calc(0.25 * var(--au-hem));\n        --group-padding-content-left: calc(1.25 * var(--au-hem));\n        --group-padding-content-right: calc(1.25 * var(--au-hem));\n        --group-padding-content-bottom: calc(1.875 * var(--au-hem));\n    }\n\n    .title {\n        @apply --au-widget-title-font;\n    }\n\n    .tab-icon {\n        margin: calc(0.5 * var(--au-hem));\n    }\n\n    .noncollapse-container {\n        height: 100%;\n        display: flex;\n        flex-direction: var(--au-flex-direction, column);\n        justify-content: var(--au-justify-content, unset);\n        width: var(--group-content-width, "100%");\n\n        background-color: var(--theme-background-color);\n        border: var(--au-collapse_-_border);\n        box-sizing: border-box;\n    }\n\n    .toggle-title {\n        cursor: pointer;\n    }\n\n    .noncollapse-title {\n        padding: var(--group-padding-title-vertical, 16px) var(--group-padding-title-horizontal, 20px) 0;\n        z-index: 1;\n        background-color: var(--theme-background-color);\n    }\n\n    .noncollapse-content {\n        padding: var(--group-padding-content-top, 4px) var(--group-padding-content-right, 20px) var(--group-padding-content-bottom, 30px) var(--group-padding-content-left, 20px);\n        margin-top: var(--group-padding-title-vertical, 16px);\n        margin-bottom: var(--group-padding-title-vertical, 16px);\n        flex-direction: var(--au-flex-direction, column);\n        height: calc(100% - var(--group-padding-content-top, 4px) - var(--group-padding-content-bottom, 30px) - var(--group-padding-title-vertical, 16px) - var(--group-padding-title-vertical, 16px));\n        overflow: unset !important;\n        display: inherit;\n    }\n\n    .noncollapse-content au-widget {\n        margin-bottom: var(--group-padding-content-bottom, 30px);\n        height: var(--au-widget-height, auto);\n        width: var(--au-width, 100%);\n    }\n\n    .last-line {\n        height: var(--group-padding-content-bottom, 30px);\n        width: 100%;\n    }\n\n    .scroll-content {\n        display: flex;\n        flex-direction: inherit;\n        justify-content: inherit;\n    }\n</style>\n<div class="noncollapse-container" id="container" style="overflow: var(--aurigma-group-overflow, hidden);">\n    <template is="dom-if" if="{{scrollable}}">\n        <au-custom-scroll></au-custom-scroll>\n    </template>\n    <dom-repeat items="{{tabs}}" as="tab">\n        <template>\n            <dom-if if="{{tab.title}}">\n                <template>\n                    <div class="noncollapse-title" data-tab$="[[index]]">\n                        <dom-if if="{{tab.icon}}">\n                            <template>\n                                <iron-icon icon="{{tab.icon}}" class="tab-icon"></iron-icon>\n                                <au-icon-fixer></au-icon-fixer>\n                            </template>\n                        </dom-if>\n                        <dom-if if="{{tab.title}}">\n                            <template>\n                                <span class="title">{{tab.title}}</span>\n                            </template>\n                        </dom-if>\n                    </div>\n                </template>\n            </dom-if>\n            <div class="noncollapse-content" data-tab$="[[index]]">\n                <dom-repeat items="{{tab.widgets}}" as="widget" id="repeater">\n                    <template>\n                        <au-widget style$="[[_getStylesByType(widget.type)]]" name="{{widget.name}}" group="{{self}}" language="{{language}}" driver="{{driver}}"\n                            definition="{{widget}}"></au-widget>\n                    </template>\n                </dom-repeat>\n                <div class="last-line"></div>\n            </div>\n        </template>\n    </dom-repeat>\n</div>\n'},841:function(n,t){n.exports='<style>\n    iron-selector {\n        background: var(--au-collapse-background-color, #ffffff);\n        height: 90%;\n    }\n\n    :host iron-selector {\n        background: var(--au-collapse-background-color, #ffffff);\n        height: 90%;\n    }\n\n    .group-container {\n        margin-left: 0px !important;\n        margin-right: 0px !important;\n        padding-left: 0px !important;\n        padding-right: 0px !important;\n    }\n\n    .group-container.horizontal,\n    .group-container.vertical {\n        display: -webkit-box;\n        display: -ms-flexbox;\n        display: flex;\n        -webkit-box-direction: normal;\n        border: 1px solid var(--theme-border-color);\n        box-sizing: border-box;\n    }\n\n    .group-container.vertical {\n        -webkit-box-orient: horizontal;\n        -ms-flex-direction: row;\n        flex-direction: row;\n        height: 100%;\n    }\n\n    .group-container.horizontal {\n        -webkit-box-orient: vertical;\n        -ms-flex-direction: column;\n        flex-direction: column;\n        -webkit-box-flex: 1;\n        -ms-flex: 1 1 100%;\n        flex: 1 1 100%;\n        height: 100%;\n        width: 100%;\n    }\n\n    .group-container.vertical paper-listbox,\n    .group-container.horizontal paper-listbox {\n        display: -webkit-box;\n        display: -ms-flexbox;\n        display: flex;\n        -webkit-box-pack: start;\n        -ms-flex-pack: start;\n        justify-content: flex-start;\n        padding: 0;\n    }\n\n    .group-container.vertical paper-listbox {\n        -webkit-box-orient: vertical;\n        -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n        flex-direction: column;\n        height: 100%;\n        width: 80px;\n        background-color: var(--au-tabbed-group-container-tab-background);\n    }\n\n    .group-container.horizontal paper-listbox {\n        -webkit-box-orient: horizontal;\n        -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n        flex-direction: row;\n        height: 50px;\n        background-color: var(--au-tabbed-group-container-tab-background);\n    }\n\n    .group-container.vertical paper-listbox>.tab-container,\n    .group-container.horizontal paper-listbox>.tab-container {\n        display: -webkit-inline-box;\n        display: -ms-inline-flexbox;\n        display: inline-flex;\n        -webkit-box-align: center;\n        -ms-flex-align: center;\n        align-items: center;\n        -webkit-box-pack: center;\n        -ms-flex-pack: center;\n        justify-content: center;\n        -ms-user-select: none;\n        -webkit-user-select: none;\n        -moz-user-select: none;\n        user-select: none;\n        background-color: var(--au-tabbed-group-tab-background);\n        color: var(--au-tabbed-group-tab-color);\n        outline: none;\n    }\n\n    .group-container.vertical paper-listbox>.tab-container:hover,\n    .group-container.horizontal paper-listbox>.tab-container:hover {\n        background-color: var(--au-tabbed-group-tab-hover-background);\n    }\n\n    .group-container.vertical paper-listbox>.tab-container.iron-selected,\n    .group-container.horizontal paper-listbox>.tab-container.iron-selected {\n        background-color: var(--theme-interface-color);\n        color: var(--theme-primary-color);\n        -webkit-box-shadow: none;\n        box-shadow: none;\n    }\n\n    .group-container.vertical paper-listbox>.tab-container {\n        -webkit-box-orient: vertical;\n        -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n        flex-direction: column;\n        min-height: 58px;\n        width: 80px;\n        padding-top: 18px;\n        padding-bottom: 14px;\n        margin: 0 auto;\n    }\n\n    .group-container.vertical paper-listbox>.tab-container .toggle-title {\n        word-break: keep-all;\n        width: 100%;\n        @apply --au-caption-font;\n        margin-top: 8px;\n    }\n\n    .group-container.horizontal paper-listbox>.tab-container {\n        -webkit-box-orient: horizontal;\n        -webkit-box-direction: normal;\n        -ms-flex-direction: row;\n        flex-direction: row;\n        -webkit-box-flex: 1;\n        -ms-flex: 1 1 auto;\n        flex: 1 1 auto;\n    }\n\n    .tab-container {\n        padding-top: 13px;\n        padding-bottom: 13px;\n        -webkit-box-pack: center;\n        -ms-flex-pack: center;\n        justify-content: center;\n        -webkit-box-align: center;\n        -ms-flex-align: center;\n        align-items: center;\n    }\n\n    .toggle-title {\n        @apply --au-button-font;\n        @apply --break-words;\n        text-align: center;\n    }\n\n    iron-selector>paper-item:not(.iron-selected) {\n        display: none;\n    }\n\n    iron-selector>paper-item {\n        display: -webkit-box;\n        display: -ms-flexbox;\n        display: flex;\n        -webkit-box-orient: vertical;\n        -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n        flex-direction: column;\n        -webkit-box-pack: start;\n        -ms-flex-pack: start;\n        justify-content: flex-start;\n        padding: 0px 16px 30px;\n        margin-top: 20px;\n        margin-bottom: 30px;\n        flex: 1 1 100%;\n        max-height: 630px;\n    }\n\n    paper-item:focus:before {\n        background-color: transparent;\n    }\n\n    iron-selector {\n        display: -webkit-box;\n        display: -ms-flexbox;\n        display: flex;\n        -webkit-box-orient: vertical;\n        -webkit-box-direction: normal;\n        -ms-flex-direction: column;\n        flex-direction: column;\n        -webkit-box-pack: center;\n        -ms-flex-pack: center;\n        justify-content: center;\n        width: 100%;\n    }\n\n    @media screen and (max-width: 769px) {\n        .group-container.horizontal,\n        .group-container.vertical {\n            border: none\n        }\n    }\n</style>\n<div class$="group-container [[containerLayout]]" id="container"\n    style="height: 100% !important; min-height: 100% !important;">\n    <paper-listbox id="selector" selected="{{selectedIndex}}">\n        <template is="dom-repeat" items="{{tabs}}" as="tab">\n            <div class="tab-container" name="{{tab.title}}" data-tab$="[[index]]">\n                <dom-if if="{{tab.icon}}">\n                    <template>\n                        <iron-icon icon="{{tab.icon}}"></iron-icon>\n                        <au-icon-fixer></au-icon-fixer>\n                    </template>\n                </dom-if>\n                <dom-if if="{{tab.title}}">\n                    <template>\n                        <span class="toggle-title">{{tab.title}}</span>\n                    </template>\n                </dom-if>\n            </div>\n        </template>\n    </paper-listbox>\n    <div style="flex: 1 1 100%; display: flex; height: 100%; max-height: 100%!important; min-height: 93%!important;">\n        <iron-selector style="height: 100%!important; max-height: 96% !important;" attr-for-selected="id"\n            selected="[[selectedIndex]]">\n\n            <template is="dom-repeat" items="[[tabs]]" as="tab">\n                <paper-item style="height: 100%" id="[[index]]" data-tab$="[[index]]" style="overflow: var(--aurigma-group-overflow, hidden);">\n                    <template is="dom-if" if="{{scrollable}}">\n                        <au-custom-scroll></au-custom-scroll>\n                    </template>\n                    <dom-repeat items="[[tab.widgets]]" as="widget" id="repeater">\n                        <template>\n                            <au-widget style$="[[_getStylesByType(widget.type)]]" name="[[widget.name]]" group="{{self}}" language="{{language}}"\n                                driver="[[driver]]" definition="[[widget]]">\n                            </au-widget>\n                        </template>\n                    </dom-repeat>\n                </paper-item>\n            </template>\n        </iron-selector>\n    </div>\n</div>\n'},842:function(n,t){n.exports="<style>\n    :host {\n        --paper-item-selected-weight: 400;\n        --paper-listbox-background-color: transparent;\n        width: 100%;\n        height: 100%;\n        display: flex;\n        flex-direction: column;\n    }\n\n    [hidden] {\n        display: none !important;\n    }\n\n    au-widget {\n        display: inline-table;\n        margin-bottom: 24px;\n    }\n\n    @media not all and (min-resolution: .001dpcm) {\n        @supports (-webkit-appearance:none) and (not (stroke-color:transparent)) {\n            au-widget {\n                display: flex !important;\n                padding-right: 8px;\n            }\n        }\n    }\n\n    @media not all and (min-resolution: .001dpcm) {\n        @supports (-webkit-appearance:none) and (stroke-color:transparent) {\n            au-widget {\n                display: flex !important;\n                padding-right: 8px;\n            }\n        }\n    }\n\n    @media screen and (min-color-index: 0) and(-webkit-min-device-pixel-ratio: 0) {\n        @media {\n            au-widget {\n                display: flex !important;\n                margin-bottom: 24px;\n                padding-right: 8px;\n            }\n        }\n    }\n\n    @media screen and (-webkit-min-device-pixel-ratio: 0) {\n        au-widget {\n            display: flex !important;\n            margin-bottom: 24px;\n            margin-right: 4px;\n        }\n    }\n</style>\n"},930:function(n,t,e){e.r(t),e.d(t,"AuWidgetGroup",function(){return h}),e.d(t,"widget",function(){return h});var o,i,r=e(0),t=e(838),a=e(2),l=e(20);o=l.a,Object(r.d)(c,o),c.prototype.show=function(){this.open()},c.prototype.hide=function(){this.close()},c.prototype.open=function(){this.opened=!0},c.prototype.close=function(){this.opened=!1},c.prototype.toggle=function(){this.$.collapse.addEventListener("transitionend",this.collapseListener),this.opened=!this.opened},c.prototype._toggle=function(n){return n?"open":"close"},c.prototype.dispatchCollapse=function(){this.dispatchEvent(new CustomEvent("collapse",{detail:this.opened})),window.document.dispatchEvent(new CustomEvent("collapse",{detail:this.opened}))},c.prototype.collapseListener=function(){this.dispatchCollapse(),this.$.collapse&&this.$.collapse.removeEventListener("transitionend",this.collapseListener)},Object(r.c)([Object(a.c)({notify:!0}),Object(r.g)("design:type",Boolean)],c.prototype,"horizontal",void 0),Object(r.c)([Object(a.c)({notify:!0}),Object(r.g)("design:type",Boolean)],c.prototype,"noAnimation",void 0),Object(r.c)([Object(a.c)({notify:!0,reflectToAttribute:!0}),Object(r.g)("design:type",Boolean)],c.prototype,"opened",void 0),Object(r.c)([Object(a.c)({notify:!0,reflectToAttribute:!0}),Object(r.g)("design:type",Boolean)],c.prototype,"scrollable",void 0),Object(r.c)([Object(a.c)({notify:!0}),Object(r.g)("design:type",Boolean)],c.prototype,"noIcons",void 0),Object(r.c)([Object(a.a)("au-collapse",t),Object(r.g)("design:paramtypes",[])],c);function c(){var n=o.call(this)||this;return n.horizontal=!1,n.noAnimation=!1,n.opened=!0,n.scrollable=!1,n.noIcons=!1,n.collapseListener=n.collapseListener.bind(n),n}(l=i=i||{})[l.htab=0]="htab",l[l.vtab=1]="vtab",l[l.collapsible=2]="collapsible",l[l.noncollapsible=3]="noncollapsible";var p,s=e(14),d=e(17),b=e(395),u=e(37),g=e(1),t=e(160),l=e(839),m=e(840),f=e(841),e=e(842),e="\n            ".concat(e,'\n            <dom-if if="[[templateSwitch]]">\n                <template>\n                    <dom-if if="[[isNonCollapsible(type)]]">\n                        <template>\n                            ').concat(m,'\n                        </template>\n                    </dom-if>\n                    <dom-if if="[[isCollapsible(type)]]">\n                        <template>\n                            ').concat(l,'\n                        </template>\n                    </dom-if>\n                </template>\n            </dom-if>\n            <dom-if if="[[!templateSwitch]]">\n                <template>\n                    ').concat(f,"\n                </template>\n            </dom-if>\n"),h=(p=t.b,Object(r.d)(x,p),Object.defineProperty(x,"template",{get:function(){},enumerable:!1,configurable:!0}),x.prototype.clearSelection=function(){this.selectedIndex=-1},Object.defineProperty(x.prototype,"_",{get:function(){return u.Maybe.maybe(this._currentWidget).bind(function(n){return n._})},enumerable:!1,configurable:!0}),x.prototype.connectedCallback=function(){var e=this;this.self=this,p.prototype.connectedCallback.call(this),this.selectedIndex=0,this.tabs.forEach(function(t){t.widgets.forEach(function(n){n.format="group",t.title&&(n.formatTitle="subtitle")})});var o=[].concat.apply([],Object(r.j)([],Object(r.h)(this.tabs.map(function(n){return n.widgets})),!1)).map(function(n){return n.name});this.observable.pipe(Object(b.a)(function(n){return n.header===d.a.WIDGET_CHANGE&&0<=o.indexOf(n.name)&&!!n.sender._})).subscribe(function(t){var n=e.jsonParamsFetcher.scope;e._currentWidget=t.sender,e.unifySelection&&o.filter(function(n){return n!==t.name}).forEach(function(t){u.Maybe.maybe(n.$).map(function(n){return n[t]}).map(function(n){return(n.clearSelection||function(){}).bind(n)}).chain(function(n){return n()})})}),setTimeout(function(){var n;e.auWizard._isVerticalMobileLayout&&(n=e.querySelectorShadow(".noncollapse-content"))&&(n.style.paddingBottom="0px",n.style.marginBottom="0px"),"safari"===g.a.getBrowser()&&[e.querySelectorShadow(".noncollapse-container"),null==(n=e.querySelectorShadow("au-collapse"))?void 0:n.querySelectorShadow("#collapse")].forEach(function(n){n&&n.addEventListener("scroll",function(){e.publishData(null,d.a.CUSTOM_SCROLL)})})},200)},x.prototype._paramsRawObserver=function(t){return Object(r.b)(this,void 0,void 0,function(){return Object(r.e)(this,function(n){switch(n.label){case 0:return[4,p.prototype._paramsRawObserver.call(this,t)];case 1:return n.sent(),this.updateParams(t),[2]}})})},x.prototype._onOpenedChange=function(e){var o=this;e.detail.value&&this.accordion&&this.tabs.forEach(function(n,t){n=e.target.name===n.title;o.set("tabs.".concat(t,".opened"),n)})},x.prototype.updateParams=function(n){var o=this,t="safari"===g.a.getBrowser(),t=(this.scrollable=!t&&!1!==n.scrollable,t&&(!1!==n.scrollable?this.updateStyles({"--aurigma-group-overflow":"auto"}):this.updateStyles({"--aurigma-group-overflow":"hidden"})),this.type=i[this._computeValue(n.type.toString())]||i.htab,this.unifySelection=!!n.unifySelection,this.accordion=!!g.a.typeofCheck(n.accordion,"undefined")||n.accordion,this.type===i.vtab||this.type===i.htab?(this.containerLayout=this.type===i.htab?"horizontal":"vertical",this.templateSwitch=!1):this.templateSwitch=!0,this.tabs.map(function(n){return!!n.opened})),e=n.tabs||[];e.forEach(function(n){var t,e;n.title&&n.title.startsWith("{{")&&n.title.endsWith("}}")&&((t=o.jsonParamsFetcher.scope).self=o,(e={})[s.a.SCOPE_HEAD_KEY]=o.jsonParamsFetcher.head,e.title=n.title,"undefined"!==(e=o._jsonProcessor.process(e,t).title))&&(n.title=e)}),t.forEach(function(n,t){n&&(o.selectedIndex=t),e[t]&&(e[t].opened=n)}),this.tabs=e,this.accordion&&!this.tabs.find(function(n){return n.opened})&&0<this.tabs.length&&(this.tabs[0].opened=!0)},x.prototype.recompileParams=function(n,t,e){var o=this,e=(void 0===e&&(e=!1),JSON.parse(JSON.stringify(this.originWidget.definition.params)));e[s.a.SCOPE_HEAD_KEY]=this.jsonParamsFetcher.head,this._jsonProcessor.process(e,n).tabs.map(function(t,e){Object.keys(t).forEach(function(n){"id"!==n&&"widgets"!==n&&(o.tabs[e][n]=t[n])})}),this.updateVisibleParams(),this.oldParams=this.params,this.params=t},x.prototype.updateVisibleParams=function(){var t,n,o=this;if(this.notifyPath("tabs"),this.tabs.forEach(function(n,t){var e=n.visible;null!=e&&Array.from(o.querySelectorAllShadow("[data-tab='".concat(t,"']"))).forEach(function(n){return n.hidden=!e}),o.notifyPath("tabs."+t+".title")}),!1===this.tabs[this.selectedIndex].visible)try{for(var e=Object(r.k)(this.tabs),i=e.next();!i.done;i=e.next()){var a=i.value;if(!1!==a.visible){this.selectedIndex=this.tabs.indexOf(a);break}}}catch(n){t={error:n}}finally{try{i&&!i.done&&(n=e.return)&&n.call(e)}finally{if(t)throw t.error}}},x.prototype.isCollapsible=function(n){return this.type===i.collapsible},x.prototype.isNonCollapsible=function(n){return this.type===i.noncollapsible},x.prototype._getStylesByType=function(n){return"pim-design-selector"===n?"--au-widget-height: 100%;":""},Object(r.c)([Object(a.c)(),Object(r.g)("design:type",Object)],x.prototype,"params",void 0),Object(r.c)([Object(a.c)(),Object(r.g)("design:type",Array)],x.prototype,"tabs",void 0),Object(r.c)([Object(a.c)(),Object(r.g)("design:type",Object)],x.prototype,"type",void 0),Object(r.c)([Object(a.c)(),Object(r.g)("design:type",Boolean)],x.prototype,"scrollable",void 0),Object(r.c)([Object(a.c)(),Object(r.g)("design:type",Number)],x.prototype,"selectedIndex",void 0),Object(r.c)([Object(a.c)(),Object(r.g)("design:type",String)],x.prototype,"containerLayout",void 0),Object(r.c)([Object(a.c)(),Object(r.g)("design:type",Boolean)],x.prototype,"templateSwitch",void 0),Object(r.c)([Object(a.c)(),Object(r.g)("design:type",Boolean)],x.prototype,"accordion",void 0),Object(r.c)([Object(a.c)(),Object(r.g)("design:type",String)],x.prototype,"selectedTitle",void 0),Object(r.c)([Object(a.c)(),Object(r.g)("design:type",Boolean)],x.prototype,"showCustomScroll",void 0),Object(r.c)([Object(a.c)(),Object(r.g)("design:type",Object),Object(r.g)("design:paramtypes",[])],x.prototype,"_",null),Object(r.c)([Object(a.a)("au-widget-group",e)],x));function x(){var n=null!==p&&p.apply(this,arguments)||this;return n.format="full-height",n.tabs=[],n.selectedIndex=0,n.containerLayout="",n.templateSwitch=!0,n.accordion=!0,n.selectedTitle="",n.showCustomScroll=!0,n.unifySelection=!1,n}}}]);