(window.webpackJsonp=window.webpackJsonp||[]).push([[6,8],{21:function(t,e,n){"use strict";n.r(e);var o=n(12),s=n(5),i=n(0),r=n(7),a=n(14);let c,l,u=t=>t;class b extends(Object(s.a)(Object(o.a)(HTMLElement))){static get properties(){return{accessKey:{observe:!0,DOM:!0,reflect:!0,fromAttributeConverter:i.d.fromAttribute,toAttributeConverter:i.d.toAttribute},autofocus:{observe:!0,DOM:!0,reflect:!0,fromAttributeConverter:i.a.fromAttribute,toAttributeConverter:i.a.toAttribute},disabled:{observe:!0,DOM:!0,reflect:!0,fromAttributeConverter:i.a.fromAttribute,toAttributeConverter:i.a.toAttribute},tabIndex:{observe:!0,DOM:!0,reflect:!0,fromAttributeConverter:i.b.fromAttribute,toAttributeConverter:i.b.toAttribute},type:{observe:!0,DOM:!0,reflect:!0,fromAttributeConverter:i.d.fromAttribute,toAttributeConverter:i.d.toAttribute},value:{observe:!0,DOM:!0,reflect:!0,fromAttributeConverter:i.d.fromAttribute,toAttributeConverter:i.d.toAttribute}}}constructor(){super();const t=document.createElement("button");this.accessKey=t.accessKey,this.autofocus=t.autofocus,this.disabled=t.disabled,this.tabIndex=t.tabIndex,this.type=t.type,this.value=t.value,this.attachShadow({mode:"open",delegatesFocus:this.__delegatesFocus}),this.render(),this.__delegatesFocus||this.addEventListener("focus",()=>this.$element.focus())}propertiesChangedCallback(t,e,n){super.propertiesChangedCallback&&super.propertiesChangedCallback(t,e,n),this.render()}get styles(){return Object(r.a)(c||(c=u`
      <style>
        :host { outline: none }
      </style>
    `))}get template(){return Object(r.a)(l||(l=u`
      ${0}
      <button
        .accessKey="${0}"
        ?autofocus="${0}"
        ?disabled="${0}"
        .tabIndex="${0}"
        .type="${0}"
        .value="${0}"
      ><slot></slot></button>
    `),this.styles,this.accessKey,this.autofocus,this.disabled,this.tabIndex,this.type,this.value)}render(){window.requestAnimationFrame(()=>{Object(r.b)(this.template,this.shadowRoot,{eventContext:this,scopeName:this.localName})})}get accessKey(){return this._accessKey}set accessKey(t){this._accessKey=t}get tabIndex(){return!0===this.disabled?-1:this._tabIndex}set tabIndex(t){this._tabIndex=parseInt(t)}get type(){return this._type||"submit"}set type(t){const e=t.toLowerCase();if(-1===["button","submit","reset"].indexOf(e))return this._type="submit";this._type=e}get validationMessage(){return this.$element.validationMessage()}get validity(){return this.$element.validity()}get willValidate(){return this.$element.willValidate()}checkValidity(){return this.$element.checkValidity()}reportValidity(){return this.$element.reportValidity()}setCustomValidity(t){this.$element.setCustomValidity(t)}get $element(){return this.shadowRoot.querySelector("button")}get __delegatesFocus(){const t=document.createElement("div");return t.attachShadow({mode:"open",delegatesFocus:!0}),t.shadowRoot.delegatesFocus||!1}}var h=n(17);let d,f=t=>t;window.customElements.define("slicesui-button",class extends b{get styles(){return Object(a.c)(d||(d=f`<style>${0}</style>`),'\n:host,\n:host *,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\na {\n  color: inherit;\n}\n:host(:not(.focus-visible)),\n:host(.focus-visible),\n:host(:not(.focus-visible)) input,\n:host(:not(.focus-visible)) button,\n:host(:not(.focus-visible)) select {\n  outline: none;\n}\n[hidden] {\n  display: none !important;\n}\n:host {\n  height: calc(var(--erem) * 2);\n  height: max(calc(var(--erem) * 2), 44px);\n  font-size: 0;\n}\n:host input,\n:host select,\n:host button {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  text-rendering: optimizeLegibility;\n  margin: 0;\n  font-family: var(--slices-text-b1--font-family, var(--slices-text-b--font-family, var(--slices-text--font-family)));\n  font-size: var(--slices-text-b1--font-size);\n  font-weight: var(--slices-text-b1--font-weight, var(--slices-text-b--font-weight, 400));\n  line-height: var(--slices-text-b1--line-height, var(--slices-text-b--line-height, 1.4));\n  font-family: var(--slices-text-h--font-family);\n  padding: var(--slicesui-input-padding, 0 var(--erem));\n}\n:host input[type="checkbox"],\n:host select[type="checkbox"],\n:host button[type="checkbox"],\n:host input[type="radio"],\n:host select[type="radio"],\n:host button[type="radio"] {\n  width: calc(var(--erem) * 2);\n  width: max(calc(var(--erem) * 2), 44px);\n}\n:host([small]) {\n  height: calc(var(--erem) * 1.25);\n  height: max(calc(var(--erem) * 1.25), 32px);\n}\n:host([small]) input,\n:host([small]) select,\n:host([small]) button {\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n  text-rendering: optimizeLegibility;\n  margin: 0;\n  font-family: var(--slices-text-s1--font-family, var(--slices-text-s--font-family, var(--slices-text--font-family)));\n  font-size: var(--slices-text-s1--font-size);\n  font-weight: var(--slices-text-s1--font-weight, var(--slices-text-s--font-weight, 400));\n  line-height: var(--slices-text-s1--line-height, var(--slices-text-s--line-height, 1.2));\n  padding: var(--slicesui-input-padding, 0 calc(var(--erem) / 2));\n}\n:host([small]) input[type="checkbox"],\n:host([small]) select[type="checkbox"],\n:host([small]) button[type="checkbox"],\n:host([small]) input[type="radio"],\n:host([small]) select[type="radio"],\n:host([small]) button[type="radio"] {\n  width: calc(var(--erem) * 1.25);\n  width: max(calc(var(--erem) * 1.25), 32px);\n}\n:host {\n  user-select: none;\n  -webkit-user-select: none;\n  display: inline-flex;\n  align-items: stretch;\n}\n:host button {\n  line-height: 1.2;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: var(--slicesui-button-justify-content, center);\n  border-width: var(--slicesui-button-border-width, 2px);\n  border-style: solid;\n  border-color: var(--slicesui-button-border-color, transparent);\n  background: var(--slicesui-button-background, #515ce7);\n  color: var(--slicesui-button-color, #fff);\n  border-radius: var(--slicesui-button-border-radius, 32px);\n  white-space: nowrap;\n}\n:host button:hover:not([disabled]) {\n  background: var(--slicesui-button-background--hover, var(--slicesui-button-background, #626ce9));\n  color: var(--slicesui-button-color--hover, var(--slicesui-button-color, #fff));\n  border-color: var(--slicesui-button-border-color--hover, var(--slicesui-button-border-color, transparent));\n}\n:host button:active:not([disabled]) {\n  background: var(--slicesui-button-background, #515ce7);\n  color: var(--slicesui-button-color, #fff);\n}\n:host button:not([disabled]) {\n  cursor: pointer;\n}\n:host button:disabled {\n  cursor: default;\n  opacity: 0.5;\n}\n:host ::slotted(*) {\n  pointer-events: none;\n}\n:host ::slotted(span) {\n  padding-right: calc(var(--erem) * 0.25);\n}\n:host([icon]) {\n  width: max(calc(var(--erem) * 2), 44px);\n}\n:host([icon]) button {\n  padding: 0;\n}\n:host([text]) {\n  height: auto;\n}\n:host([text]) button {\n  background: transparent;\n  color: var(--slicesui-button-color, #000);\n  padding: 0;\n  border-top: 0;\n  border-left: 0;\n  border-right: 0;\n  border-bottom-color: var(--slicesui-button-border-color, #000);\n  border-radius: 0;\n}\n:host([text]) button:hover:not([disabled]),\n:host([text]) button:active:not([disabled]) {\n  background: transparent;\n  color: var(--slicesui-button-color, #000);\n}\n:host([disabled]) {\n  pointer-events: none;\n  opacity: 0.6;\n}\n:host([small][text]) button {\n  border-bottom-width: 1px;\n}\n:host([icon][small]) {\n  width: max(calc(var(--erem) * 1.25), 32px);\n}\n:host([notify]) button {\n  position: relative;\n}\n:host([notify]) button:after {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  left: 0;\n  content: \'\';\n  animation: notify 2000ms infinite;\n  border-radius: inherit;\n}\n@-moz-keyframes notify {\n  0% {\n    opacity: 1;\n    background: #fff;\n    transform: scale(0);\n  }\n  50% {\n    opacity: 0;\n    background: #fff;\n    transform: scale(1.1);\n  }\n  100% {\n    opacity: 0;\n    background: #fff;\n    transform: scale(1.1);\n  }\n}\n@-webkit-keyframes notify {\n  0% {\n    opacity: 1;\n    background: #fff;\n    transform: scale(0);\n  }\n  50% {\n    opacity: 0;\n    background: #fff;\n    transform: scale(1.1);\n  }\n  100% {\n    opacity: 0;\n    background: #fff;\n    transform: scale(1.1);\n  }\n}\n@-o-keyframes notify {\n  0% {\n    opacity: 1;\n    background: #fff;\n    transform: scale(0);\n  }\n  50% {\n    opacity: 0;\n    background: #fff;\n    transform: scale(1.1);\n  }\n  100% {\n    opacity: 0;\n    background: #fff;\n    transform: scale(1.1);\n  }\n}\n@keyframes notify {\n  0% {\n    opacity: 1;\n    background: #fff;\n    transform: scale(0);\n  }\n  50% {\n    opacity: 0;\n    background: #fff;\n    transform: scale(1.1);\n  }\n  100% {\n    opacity: 0;\n    background: #fff;\n    transform: scale(1.1);\n  }\n}\n')}constructor(){super(),Object(h.a)(this)}})},32:function(t,e,n){"use strict";n.r(e);var o=n(6),s=n(0);n(21);var i=n(17);let r,a,c,l,u,b,h,d=t=>t;class f extends o.a{static get properties(){return{buttons:{observe:!0,DOM:!0,fromAttributeConverter:s.c.fromAttribute,changedHandler:"_buttonsChanged"},disabled:{observe:!0,DOM:!0,reflect:!0,fromAttributeConverter:s.a.fromAttribute,toAttributeConverter:s.a.toAttribute}}}constructor(){super(),this.buttons=["fb","tw","wa","email"],this.disabled=!1}get template(){return Object(o.b)(r||(r=d`
      <style>${0}</style>
      ${0} 
    `),"\n:host,\n:host *,\n*::before,\n*::after {\n  box-sizing: border-box;\n}\na {\n  color: inherit;\n}\n:host(:not(.focus-visible)),\n:host(.focus-visible),\n:host(:not(.focus-visible)) input,\n:host(:not(.focus-visible)) button,\n:host(:not(.focus-visible)) select {\n  outline: none;\n}\n[hidden] {\n  display: none !important;\n}\n:host {\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n}\n:host([disabled]) {\n  pointer-events: none;\n  opacity: 0.5;\n}\n:host slicesui-button {\n  display: flex;\n  margin: 0 4px;\n  --slicesui-input-padding: 16px;\n}\n:host slicesui-button:first-child {\n  margin-left: 0;\n}\n:host slicesui-button:last-child {\n  margin-right: 0;\n}\n:host svg {\n  fill: var(--slicesui-community-buttons-fill, #fff);\n  height: calc(var(--erem) * 1);\n}\n",(this.buttons||[]).map(t=>this._renderButton(t)))}_renderButton(t){return Object(o.b)(a||(a=d`
      <slicesui-button
        icon
        ?disabled="${0}"
        aria-label="Share via ${0}"
        data-icon="${0}"
        @click="${0}"
      >
        ${0}
      </slicesui-button>
    `),this.disabled,t,t,this._handleTap,this._renderIcon(t))}_renderIcon(t){switch(t){case"fb":return Object(o.b)(c||(c=d`
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 310 310">
            <path d="M81.703 165.106h33.981V305a5 5 0 005 5H178.3a5 5 0 005-5V165.765h39.064a5 5 0 004.967-4.429l5.933-51.502a5 5 0 00-4.966-5.572h-44.996V71.978c0-9.732 5.24-14.667 15.576-14.667h29.42a5 5 0 005-5V5.037a5 5 0 00-5-5h-40.545A39.746 39.746 0 00185.896 0c-7.035 0-31.488 1.381-50.804 19.151-21.402 19.692-18.427 43.27-17.716 47.358v37.752H81.703a5 5 0 00-5 5v50.844a5 5 0 005 5.001z"/>
          </svg>`));case"tw":return Object(o.b)(l||(l=d`
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 20">
            <path d="M12.179 6.183C8.403 5.94 4.749 4.6 1.705.945c-1.34 2.193-.609 5.117 1.583 6.7-.73 0-1.583-.244-2.314-.609.122 2.558 1.462 4.142 4.02 4.994-.731.122-1.462.244-2.193.122.61 1.949 2.07 3.289 4.628 3.41C5.48 17.269 3.045 18 0 17.756c9.012 5.604 21.922.488 22.044-12.79a10.751 10.751 0 0 0 2.557-2.68c-.852.366-1.827.731-2.801.853 1.096-.73 1.705-1.705 2.07-2.802-.974.61-1.948.975-3.166 1.219-4.263-3.898-9.621.243-8.525 4.628z"/>
          </svg>
        `));case"email":return Object(o.b)(u||(u=d`
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 16">
            <path d="M18 0H2C.9 0 .01.9.01 2L0 14c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V2c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V2l8 5 8-5v2z"/>
          </svg>
        `));case"wa":return Object(o.b)(b||(b=d`
          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 23">
            <path d="M24 11.69c0 6.458-5.274 11.692-11.782 11.692-2.066 0-4.007-.528-5.695-1.455L0 24l2.127-6.273a11.568 11.568 0 0 1-1.691-6.036C.436 5.234 5.711 0 12.218 0 18.726 0 24 5.234 24 11.69zM12.218 1.863c-5.462 0-9.905 4.41-9.905 9.829 0 2.15.7 4.142 1.886 5.763l-1.237 3.65 3.807-1.21a9.9 9.9 0 0 0 5.45 1.626c5.461 0 9.905-4.409 9.905-9.829 0-5.42-4.444-9.83-9.906-9.83zm5.95 12.521c-.073-.119-.265-.19-.554-.334-.289-.143-1.71-.837-1.973-.932-.265-.095-.458-.143-.65.143-.193.287-.746.932-.915 1.123-.169.192-.337.216-.626.073-.288-.143-1.219-.446-2.322-1.422-.858-.76-1.438-1.697-1.607-1.985-.168-.286-.017-.441.127-.584.13-.128.29-.335.433-.502.145-.167.193-.286.289-.478.097-.191.048-.358-.024-.502-.072-.143-.65-1.553-.89-2.127-.241-.574-.482-.478-.65-.478-.169 0-.361-.024-.554-.024-.193 0-.506.072-.77.358-.265.287-1.01.98-1.01 2.39 0 1.41 1.034 2.773 1.178 2.964.145.19 1.998 3.179 4.934 4.326 2.936 1.147 2.936.764 3.466.716.529-.047 1.708-.693 1.95-1.362.24-.67.24-1.243.168-1.363z"/>
          </svg>
        `))}return Object(o.b)(h||(h=d``))}_handleTap(t){const e={value:t.target.dataset.icon};this._fireTapEvent(e)}_fireTapEvent(t){this.dispatchEvent(new CustomEvent("button-tap",{detail:t})),this.dispatchEvent(new CustomEvent("slices-social-button-tap",{detail:t,bubbles:!0,composed:!0}))}_computeTabindex(t){return t?-1:0}_buttonsChanged(){this.shadowRoot.querySelectorAll("div").forEach(t=>Object(i.a)(t)),this.render()}}window.customElements.define("slicesui-community-buttons",f)}}]);
//# sourceMappingURL=648a13649d9c9fc8162d.js.map