@aurigma/ui-framework
Version:
A platform which allows building print product personalization editors based on Aurigma's Customer's Canvas.
1 lines • 5.33 kB
JavaScript
(window.multistep_editor_jsonpFunction=window.multistep_editor_jsonpFunction||[]).push([[10],{423:function(e,t,i){i.d(t,"a",function(){return n});class n{constructor(e,t=!1){this._title=null,this.optionValue=e,this.disabled=t}equals(e){return this.id===e.id&&this.title===e.title&&this.price===e.price}get value(){return this.optionValue}get id(){return this.optionValue.id}get title(){return null==this._title&&(this._title=this._getParsedTitle()),this._title}get price(){return this.optionValue.price}get color(){return this.optionValue.color}get imageUrl(){return this.optionValue.imageUrl}get props(){return this.optionValue.props}get shownPrice(){return this.optionValue.shownPrice}get preselected(){return this.optionValue.preselected}_getParsedTitle(){try{return(new DOMParser).parseFromString(this.optionValue.title,"text/html").body.innerText}catch(e){}return this.optionValue.title}}},431:function(e,t,i){i.d(t,"a",function(){return o});var t=i(0),n=i(2),r=i(1),a=i(448),l=i(423);class o extends a.a{init(i){super.init(i);var e=this._copySelection();this.items=i.values.map((e,t)=>(!r.a.isNullOrUndefined(e.id)&&-1!==e.id||(e.id=t),"image"!==i.type&&e.imageUrl&&(e.imageUrl=null),new l.a(e,e.disabled))),r.a.isNotNullOrUndefined(e)&&this._restoreSelection(e),this.enableFilter=r.a.isNotNullOrUndefined(i.props)&&i.props.enableFilter||!1,i.onAvailableOptionValueChange&&i.onAvailableOptionValueChange.subscribe((e,t)=>this.updateItemsAvailability(t)),i.onOptionValueChange&&i.onOptionValueChange.subscribe((e,t)=>this.updateSelectedValue(t))}_copySelection(){return r.a.isNotNullOrUndefined(this.value)?Object.assign({},this.value):void 0}_restoreSelection(t){this.value=this.items.find(e=>e.equals(t))}_isArrayEqual(e,i){return e.length===i.length&&e.every((e,t)=>e===i[t])}_getItemPriceTitle(e){var t=e=>e&&0!==e?" (+"+this.driver.cart.formatPrice(e)+")":"";let i=t(e.price);return null!=e.shownPrice&&(i=t(e.shownPrice*(this.driver.orders.current._priceMultiplier||1))),e.title+i}_isOptionDisabled(e){return this.disabled||e}updateItemsAvailability(e){for(let t=0;t<this.items.length;t++){var i=e.every(e=>e.id!==this.items[t].id);this.set(`items.${t}.disabled`,i)}}_disabledClass(e){return e?"item-disabled":""}}Object(t.a)([Object(n.c)(),Object(t.b)("design:type",Array)],o.prototype,"items",void 0),Object(t.a)([Object(n.c)({notify:!0}),Object(t.b)("design:type",Boolean)],o.prototype,"enableFilter",void 0)},461:function(e,t,i){i.d(t,"a",function(){return a});var t=i(0),n=i(431),r=i(423),i=i(2);class a extends n.a{init(e){if(super.init(e),0!==this.items.length){let e=this.items.find(e=>e.optionValue.preselected);e=(e=e||this.items.find(e=>0===e.price))||this.items[0],this.value=e}}_selectedChange(t){0<this.items.length&&(this.value=this.items.find(e=>e.id===t))}_valueChange(e){e&&0<this.items.length&&this._selectedId!==e.id&&(this._selectedId=e.id),this._onOptionChange()}updateSelectedValue(t){if(1<t.length)throw new Error("Multiple option value is not available");var e=t.length?this.items.find(e=>e.id===t[0].id):null;(this.value&&!e||!this.value&&e||this.value&&e&&this.value.id!==e.id)&&(this.value=e)}}Object(t.a)([Object(i.c)({notify:!0}),Object(t.b)("design:type",Number)],a.prototype,"_selectedId",void 0),Object(t.a)([Object(i.b)("_selectedId"),Object(t.b)("design:type",Function),Object(t.b)("design:paramtypes",[Number]),Object(t.b)("design:returntype",void 0)],a.prototype,"_selectedChange",null),Object(t.a)([Object(i.b)("value"),Object(t.b)("design:type",Function),Object(t.b)("design:paramtypes",[r.a]),Object(t.b)("design:returntype",void 0)],a.prototype,"_valueChange",null)},877:function(e,t){e.exports='<style>\n :host {\n display: inline-flex;\n width: 100%;\n /* overflow: hidden; */\n flex-direction: column;\n }\n\n paper-radio-group {\n display: inline-flex;\n flex-direction: column;\n\n /* margin-left: -12px;\n margin-right: -12px; */\n --paper-radio-group-item-padding: 0 0 12px;\n --paper-radio-button-unchecked-background-color: #9999999;\n --primary-text-color: #999999;\n --paper-radio-button-label-color: #000000;\n\n --paper-radio-button-radio-container: {\n vertical-align: top;\n margin-top: 2px;\n }\n\n --paper-radio-button-label: {\n width: calc(100% - var(--paper-radio-button-label-spacing, 10px) - var(--calculated-paper-radio-button-size, 10px));\n }\n }\n\n .text {\n @apply --au-body2-font;\n }\n</style>\n\n<paper-radio-group noink id="[[id]]" class="option-radio-container" attr-for-selected="name" selected="{{_selectedId}}"\n selected-attribute="checked">\n <dom-repeat items="[[items]]">\n <template>\n <paper-radio-button noink type="value" disabled$="[[_isOptionDisabled(item.disabled)]]" name="[[item.id]]">\n <div noink class="text">\n {{_getItemPriceTitle(item)}}\n </div>\n </paper-radio-button>\n </template>\n </dom-repeat>\n</paper-radio-group>'},917:function(e,t,i){i.r(t),i.d(t,"AuOptionRadioGroup",function(){return o}),i.d(t,"option",function(){return o});let n=i(0),r=i(877),a=i(461),l=i(2),o=class extends a.a{};o=Object(n.a)([Object(l.a)("au-option-radio-group",r)],o)}}]);