@rocketspark/domain-checker
Version:
Embeddable Domain Checker for Rocketspark
13 lines • 4.89 kB
JavaScript
/*!
*
* @rocketspark/domain-checker v0.0.34
* https://github.com/rocketspark/domain-checker.git
*
* Copyright (c) Lee Reichardt and project contributors.
*
* This source code is licensed under the no license license found in the
* LICENSE file in the root directory of this source tree.
*
*/
"use strict";(self.webpackChunkDomainChecker=self.webpackChunkDomainChecker||[]).push([[871],{8871:function(e,t,o){o.r(t),o.d(t,{rs_select:function(){return s},rs_template_card:function(){return i}});var r=o(7915);const s=class{constructor(e){(0,r.r)(this,e),this.selectChange=(0,r.c)(this,"selectChange",7),this.handleChange=e=>{const t=e.target.value;this.selectChange.emit(""===t?null:t)},this.items=[],this.itemsToDisplay=void 0}watchItems(){this.buildItems()}render(){return(0,r.h)("div",null,(0,r.h)("select",{onChange:this.handleChange},(0,r.h)("option",{value:"",selected:!0},"Show all"),this.itemsToDisplay.map((({value:e,label:t})=>(0,r.h)("option",{value:e},t)))))}componentWillLoad(){this.buildItems()}buildItems(){if("string"==typeof this.items)try{this.itemsToDisplay=JSON.parse(this.items)}catch(e){this.itemsToDisplay=[]}else this.itemsToDisplay=this.items}static get watchers(){return{items:["watchItems"]}}};s.style='div{position:relative}div::after{content:" ";position:absolute;top:50%;right:10px;width:0;height:0;border:5px solid transparent;border-top-color:var(--rs-color-secondary);transform:translateY(-25%)}select{width:100%;padding:11px;appearance:none;border-radius:2.5px;border:1px solid var(--rs-color-select-border);background:var(--rs-color-select-background);font-family:Soleil, sans-serif;color:var(--rs-color-secondary)}select:active,select:focus,select:focus-visible{border:1px solid var(--rs-color-grey-300);outline:none}';const i=class{constructor(e){(0,r.r)(this,e),this.useTemplate=(0,r.c)(this,"useTemplate",7),this.previewTemplate=(0,r.c)(this,"previewTemplate",7),this.doTouchEvent=!1,this.useTemplateHandler=()=>{this.useTemplate.emit(this.templateId)},this.previewTemplateHandler=()=>{this.previewTemplate.emit(this.templateId)},this.touchStartHandler=()=>{this.doTouchEvent=!0},this.touchMoveHandler=()=>{this.doTouchEvent=!1},this.templateId=void 0,this.name=void 0,this.thumbnail=void 0,this.empty=!1}render(){return this.empty?this.renderEmptyTemplate():this.renderStandardTemplate()}renderStandardTemplate(){return(0,r.h)(r.H,{onTouchStart:this.touchStartHandler,onTouchMove:this.touchMoveHandler,onTouchEnd:this.touchEndHandler(this.previewTemplateHandler)},(0,r.h)("img",{class:"thumbnail",src:this.thumbnail,alt:this.name}),(0,r.h)("div",{class:"overlay"},(0,r.h)("button",{class:"button--use",onClick:this.useTemplateHandler},"Start with this design"),(0,r.h)("button",{class:"button--hollow button--preview",onClick:this.previewTemplateHandler},"Preview design")))}renderEmptyTemplate(){return(0,r.h)(r.H,{onTouchStart:this.touchStartHandler,onTouchMove:this.touchMoveHandler,onTouchEnd:this.touchEndHandler(this.useTemplateHandler)},(0,r.h)("rs-icon",{name:"brush",size:40,color:"primary-700",style:{transform:"rotate(1deg)"}}),(0,r.h)("rs-subtitle",{subtitle:"1",color:"grey"},"Start from scratch"),(0,r.h)("div",{class:"overlay"},(0,r.h)("button",{class:"button--use",onClick:this.useTemplateHandler},"Start from scratch")))}touchEndHandler(e){return()=>{this.doTouchEvent&&e()}}};i.style=":host{overflow:hidden;border:1px solid var(--rs-color-select-border);border-radius:8px;position:relative;background:var(--rs-color-white);display:flex;justify-content:center;align-items:center;flex-direction:column;row-gap:30px;aspect-ratio:428.59 / 596}.thumbnail{display:block;width:100%;height:auto}rs-subtitle{text-align:center;font-size:20px;font-weight:600;line-height:130%}.overlay{position:absolute;top:0;left:0;width:100%;height:100%;box-sizing:border-box;display:flex;justify-content:center;align-items:center;flex-direction:column;row-gap:24px;background:rgb(250 247 242 / 0.97);opacity:0;visibility:hidden;transition:opacity 0.3s ease-out, visibility 0.3s ease-out}:host(:hover) .overlay{visibility:visible;opacity:1}button{width:80%;border-radius:4px;padding:12px 25px;font-family:Soleil, sans-serif;font-size:16px;font-weight:600;cursor:pointer;text-decoration:none;user-select:none;outline:none;white-space:nowrap;background:var(--rs-color-primary-700);border:none;color:var(--rs-color-white);transition:background 0.25s ease-out 0s}button:hover{background:var(--rs-color-primary);border:none}.button--hollow{background:none;box-shadow:inset 0 0 0 1px var(--rs-color-primary-700);color:var(--rs-color-primary-700);transition:border 0.25s ease-out 0s}.button--hollow:hover{box-shadow:inset 0 0 0 1px var(--rs-color-primary);background:none}@media only screen and (max-width: 667px){.overlay{display:none}button{width:90%}rs-icon{font-size:16px}rs-subtitle{font-size:16px}}"}}]);
//# sourceMappingURL=871.index.js.map