favesalon-embed 1.0.1 → 1.0.2

package/dist/esm/_commonjsHelpers-098d5b27.js

@@ -1,32 +0,0 @@
-var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
-
-function createCommonjsModule(fn, basedir, module) {
-	return module = {
-		path: basedir,
-		exports: {},
-		require: function (path, base) {
-			return commonjsRequire();
-		}
-	}, fn(module, module.exports), module.exports;
-}
-
-function getAugmentedNamespace(n) {
-	if (n.__esModule) return n;
-	var a = Object.defineProperty({}, '__esModule', {value: true});
-	Object.keys(n).forEach(function (k) {
-		var d = Object.getOwnPropertyDescriptor(n, k);
-		Object.defineProperty(a, k, d.get ? d : {
-			enumerable: true,
-			get: function () {
-				return n[k];
-			}
-		});
-	});
-	return a;
-}
-
-function commonjsRequire () {
-	throw new Error('Dynamic requires are not currently supported by @rollup/plugin-commonjs');
-}
-
-export { createCommonjsModule as a, commonjsGlobal as c, getAugmentedNamespace as g };

package/dist/esm/chat-button.entry.js

@@ -1,114 +0,0 @@
-import { r as registerInstance, h } from './index-3fae868e.js';
-import { d as dayjs_min, H as HttpService } from './services-40a3e622.js';
-import { r as relativeTime } from './relativeTime-cd452e6d.js';
-import './_commonjsHelpers-098d5b27.js';
-import './colors-ea36347a.js';
-
-const indexCss = "chat-button{display:inline-block;position:relative}.chat-button--indicator{cursor:pointer;position:absolute;inset:0}.chat-button--counter{background-color:rgb(240, 90, 97);border:1px solid rgb(255, 255, 255);position:absolute;right:-6px;bottom:12px;height:8px;width:8px;-moz-border-radius:8px;-webkit-border-radius:8px;border-radius:8px}.chat-box{background-color:#fff;display:flex;flex-direction:column;position:fixed;inset:0px;z-index:20000}.chat-box--header{display:flex;justify-content:space-between;padding:16px;position:relative}.chat-box--header-title{color:#fff;font-size:20px;font-weight:600;line-height:1;display:flex;align-items:center;justify-content:space-between;margin:0}.chat-message{overflow:hidden;clear:both;min-width:240px}.chat-message--meta{display:flex}.chat-message--message{background-color:#F1F1F1;padding:8px 12px;position:relative;float:left;margin-top:6px;-moz-border-radius:0 10px 10px 10px;-webkit-border-radius:0 10px 10px 10px;border-radius:0 10px 10px 10px}.chat-conversation--time{clear:both;color:#999;font-size:75%;padding-top:2px}.chat-message.is-owner .chat-message--content{margin-left:12px}.chat-message.is-guest .chat-message--meta{flex-direction:row-reverse}.chat-message.is-guest .chat-message--message{background-color:#EFF7FF;float:right;margin-right:12px;text-align:right;-moz-border-radius:10px 0 10px 10px;-webkit-border-radius:10px 0 10px 10px;border-radius:10px 0 10px 10px}@media (min-width: 768px){.chat-box{border:1px solid #fff;left:unset;top:unset;right:1px;bottom:0px;height:420px;max-height:90vh;width:600px;-moz-border-radius:8px 8px 0px 0px;-webkit-border-radius:8px 8px 0px 0px;border-radius:8px 8px 0px 0px;-moz-box-shadow:rgba(0, 0, 0, 0.1) 0px 0px 24px;-webkit-box-shadow:rgba(0, 0, 0, 0.1) 0px 0px 24px;box-shadow:rgba(0, 0, 0, 0.1) 0px 0px 24px}.chat-box--header{-moz-border-radius:8px 8px 0px 0px;-webkit-border-radius:8px 8px 0px 0px;border-radius:8px 8px 0px 0px}}";
-
-dayjs_min.extend(relativeTime);
-const ChatButton = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.onSubmitMessage = async () => {
-      try {
-        const elNewMessage = document.getElementById('chat-form--input');
-        await HttpService().sendChatMessage({
-          message: elNewMessage.value,
-          senderId: this.senderInfo.id,
-          chatRoomId: this.chatRoom.uid,
-        });
-        elNewMessage.value = '';
-      }
-      catch (error) { }
-    };
-    this.markMessagesAsRead = async () => {
-      try {
-        const unreadMessages = (this.chatMessages || []).filter(message => {
-          return Boolean(message.unRead) && message.senderId !== this.senderInfo.id;
-        });
-        if (unreadMessages.length > 0) {
-          await HttpService().markMessagesAsRead(this.chatRoom.uid, unreadMessages);
-        }
-      }
-      catch (e) { }
-    };
-    this.scrollToLastMessage = () => {
-      const targetElement = document.getElementById('chat--last-message');
-      targetElement && targetElement.scrollIntoView();
-    };
-    this.renderMessage = (chatMessage) => {
-      const { message, senderId, timestamp } = chatMessage;
-      const isOwner = this.senderInfo.id === senderId;
-      return (h("div", { class: `chat-message ${isOwner ? 'is-owner' : 'is-guest'}` }, h("div", { class: "chat-message--meta" }, h("user-avatar", { size: 40, shortName: String(((isOwner ? this.senderInfo : this.receiverInfo) || {}).fullName || '').charAt(0), avatar: ((isOwner ? this.senderInfo : this.receiverInfo) || {}).avatar }), h("div", { class: "chat-message--content" }, h("div", { class: "chat-message--message" }, message), timestamp && (h("div", { class: "chat-conversation--time" }, dayjs_min(timestamp).format('HH:mm')))))));
-    };
-    this.renderMessages = () => {
-      const isEmpty = (this.chatMessages || []).length === 0;
-      return (h("div", { class: "chat-messages" }, !isEmpty && this.chatMessages.map(this.renderMessage), isEmpty && (h("div", { style: { paddingTop: '48px', textAlign: 'center' } }, h("i", { class: "ri-bubble-chart-line", style: { fontSize: '48px' } }), h("div", { style: { color: 'rgba(0, 0, 0, 0.45)', marginTop: '8px' } }, "Enter a message on below to get starting"))), h("div", { id: "chat--last-message" })));
-    };
-    this.primaryColor = undefined;
-    this.accessToken = undefined;
-    this.senderId = undefined;
-    this.receiverId = undefined;
-    this.senderInfo = {};
-    this.receiverInfo = {};
-    this.chatRoom = undefined;
-    this.chatMessages = undefined;
-    this.isChatExpanded = undefined;
-  }
-  componentWillLoad() {
-    this.fetchData();
-  }
-  componentDidLoad() {
-    this.scrollToLastMessage();
-    this.markMessagesAsRead();
-  }
-  componentWillUpdate() {
-    this.scrollToLastMessage();
-  }
-  async fetchData() {
-    try {
-      this.chatRoom = await HttpService().createChatRoom(this.receiverId, this.accessToken);
-      if (this.chatRoom) {
-        HttpService().fetchChatMessages(this.chatRoom.uid, (messages) => this.chatMessages = messages);
-        this.senderInfo = this.chatRoom.members.find(user => user.id === Number(this.senderId));
-        this.receiverInfo = this.chatRoom.members.find(user => user.id === Number(this.receiverId));
-      }
-    }
-    catch (e) { }
-  }
-  renderForm() {
-    return (h("div", { style: { display: 'flex', height: '100%' } }, h("input", { id: "chat-form--input", type: "text", class: "form-control", placeholder: "Enter a message...", style: { border: 'none' }, onKeyPress: (evt) => {
-        if (evt.key === 'Enter') {
-          evt.preventDefault();
-          this.onSubmitMessage();
-        }
-      } }), h("button", { type: "button", class: "btn btn-link", style: {
-        textDecoration: 'none',
-        display: 'flex',
-        height: '100%',
-        alignItems: 'center',
-      }, onClick: () => this.onSubmitMessage() }, h("i", { class: "ri-send-plane-2-line", style: { color: '#111', fontSize: '24px', lineHeight: '1' } }))));
-  }
-  render() {
-    const unreadMessages = (this.chatMessages || []).filter(message => {
-      return Boolean(message.unRead) && message.senderId !== this.senderInfo.id;
-    });
-    return (h("div", null, h("div", { class: "chat-button--indicator", onClick: () => this.isChatExpanded = true }, unreadMessages.length > 0 && h("span", { class: "chat-button--counter" })), h("div", { class: "chat-box", style: this.isChatExpanded ? {} : { display: 'none' } }, h("div", { class: "chat-box--header", style: {
-        backgroundColor: this.primaryColor || '#f05a61',
-      } }, h("h3", { class: "chat-box--header-title" }, "Chat"), h("div", { class: "salon-modal--close", onClick: () => this.isChatExpanded = false, style: { position: 'static' } })), h("div", { style: {
-        flexShrink: '1',
-        flexGrow: '1',
-        overflowY: 'auto',
-        padding: '16px',
-      } }, this.renderMessages()), h("div", { style: {
-        height: '50px',
-        minHeight: '50px',
-        paddingTop: '1',
-        borderTop: '1px solid rgb(245, 245, 245)',
-      } }, this.renderForm()))));
-  }
-};
-ChatButton.style = indexCss;
-
-export { ChatButton as chat_button };

package/dist/esm/favesalon-embed.js

@@ -1,19 +0,0 @@
-import { p as promiseResolve, b as bootstrapLazy } from './index-3fae868e.js';
-export { s as setNonce } from './index-3fae868e.js';
-import './global-e1089ffd.js';
-
-/*
- Stencil Client Patch Browser v2.22.3 | MIT Licensed | https://stenciljs.com
- */
-const patchBrowser = () => {
-    const importMeta = import.meta.url;
-    const opts = {};
-    if (importMeta !== '') {
-        opts.resourcesUrl = new URL('.', importMeta).href;
-    }
-    return promiseResolve(opts);
-};
-
-patchBrowser().then(options => {
-  return bootstrapLazy([["chat-button",[[0,"chat-button",{"primaryColor":[1,"primary-color"],"accessToken":[1,"access-token"],"senderId":[1,"sender-id"],"receiverId":[1,"receiver-id"],"senderInfo":[32],"receiverInfo":[32],"chatRoom":[32],"chatMessages":[32],"isChatExpanded":[32],"fetchData":[64]}]]],["salon-latest-reviews",[[0,"salon-latest-reviews",{"salonId":[2,"salon-id"],"primaryColor":[1,"primary-color"],"salonReviews":[32],"isLoading":[32],"fetchData":[64]}]]],["salon-lookbook",[[0,"salon-lookbook",{"salonId":[2,"salon-id"],"isLoading":[32],"isLoadingMore":[32],"hideLoadMore":[32],"currentPage":[32],"totalLookbooks":[32],"salonCategories":[32],"salonLookbooks":[32],"sortBy":[32],"filterBy":[32],"isLayoutSetup":[32],"fetchData":[64],"fetchLookbooks":[64],"onChangeFiltering":[64],"onChangeSorting":[64],"onLoadMore":[64],"fetchCategories":[64]}]]],["salon-reviews",[[0,"salon-reviews",{"salonId":[2,"salon-id"],"primaryColor":[1,"primary-color"],"salonInfo":[32],"stats":[32],"totalReviews":[32],"allReviews":[32],"isLoading":[32],"isSorting":[32],"isFiltering":[32],"isLoadingMore":[32],"canLoadMore":[32],"page":[32],"filterBy":[32],"sortBy":[32]}]]],["style-detail",[[0,"style-detail",{"salonId":[2,"salon-id"],"salonLookbook":[1,"salon-lookbook"],"lookbookInfo":[32],"isModalOpen":[32],"currentMediaIdx":[32],"currentMedia":[32],"albumMedias":[32],"similarStyles":[32],"totalComments":[32],"lookbookComments":[32],"isLayoutSetup":[32],"fetchData":[64]}]]],["salon-booking",[[0,"salon-booking",{"salonId":[2,"salon-id"],"buttonClass":[1,"button-class"],"buttonText":[1,"button-text"],"primaryColor":[1,"primary-color"]}]]],["salon-booking-modal",[[0,"salon-booking-modal",{"salonId":[2,"salon-id"],"primaryColor":[1,"primary-color"],"redirectUrl":[1,"redirect-url"],"isModalOpen":[32]}]]],["salon-gift-card",[[0,"salon-gift-card",{"salonId":[2,"salon-id"],"buttonClass":[1,"button-class"],"buttonText":[1,"button-text"],"primaryColor":[1,"primary-color"]}]]],["salon-gift-card-modal",[[0,"salon-gift-card-modal",{"salonId":[2,"salon-id"],"primaryColor":[1,"primary-color"],"isModalOpen":[32]}]]],["salon-ranking",[[0,"salon-ranking",{"ranking":[2],"height":[2],"width":[2]}]]],["salon-services",[[0,"salon-services",{"salonId":[2,"salon-id"],"buttonClass":[1,"button-class"],"salonServices":[32],"isLoading":[32],"fetchData":[64]}]]],["salon-stylists",[[0,"salon-stylists",{"salonId":[2,"salon-id"],"salonStylists":[32],"totalStylists":[32],"page":[32],"isLoading":[32],"isLoadingMore":[32],"canLoadMore":[32],"fetchData":[64],"onLoadMore":[64]}]]],["google-map_5",[[0,"salon-info",{"salonId":[2,"salon-id"],"salonInfo":[32],"fetchData":[64]}],[0,"salon-locations",{"salonId":[2,"salon-id"],"salonInfo":[1,"salon-info"],"isLoading":[4,"is-loading"],"withBorder":[4,"with-border"],"salonInfoState":[32]}],[0,"salon-latest-styles",{"salonId":[2,"salon-id"],"isLoading":[4,"is-loading"],"withBorder":[4,"with-border"],"isLoadingState":[32],"latestStyles":[32],"fetchData":[64]}],[0,"salon-schedules",{"salonId":[2,"salon-id"],"salonInfo":[1,"salon-info"],"isLoading":[4,"is-loading"],"withBorder":[4,"with-border"],"salonInfoState":[32]}],[0,"google-map",{"locationName":[1,"location-name"],"locationAddress":[1,"location-address"]}]]],["user-avatar",[[0,"user-avatar",{"size":[2],"name":[1],"nameStyle":[16],"shortName":[1,"short-name"],"avatar":[1]}]]]], options);
-});

package/dist/esm/google-map_5.entry.js

@@ -1,302 +0,0 @@
-import { r as registerInstance, g as getAssetPath, h } from './index-3fae868e.js';
-import { C as Colors } from './colors-ea36347a.js';
-import { H as HttpService, i as isVideoMedia, B as BusinessHourStatus } from './services-40a3e622.js';
-import { f as formatWebsiteUrl, a as formatFullAddress } from './utils-e97485e0.js';
-import './_commonjsHelpers-098d5b27.js';
-
-const indexCss$4 = "google-map{display:block;width:100%;height:100%}";
-
-const GoogleMap = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.locationName = undefined;
-    this.locationAddress = undefined;
-  }
-  render() {
-    const mapPlaceholder = getAssetPath('./assets/map--placeholder.jpeg');
-    return (h("div", { style: {
-        backgroundImage: `url("${mapPlaceholder}")`,
-        backgroundColor: Colors.Gray01,
-        backgroundPosition: 'center center',
-        backgroundRepeat: 'no-repeat',
-        backgroundSize: 'cover',
-        borderRadius: '8px',
-        position: 'relative',
-        height: '296px',
-      } }, h("div", { style: {
-        position: 'absolute',
-        left: '50%',
-        top: '50%',
-        transform: 'translate(-50%, -50%)',
-      } }, h("a", { target: "_blank", rel: "noopener noreferrer", href: `https://www.google.com/maps/search/?api=1&query=${this.locationAddress}`, style: {
-        backgroundColor: Colors.Red01,
-        border: `1px solid ${Colors.Red02}`,
-        borderRadius: '4px',
-        color: Colors.TextColor,
-        padding: '12px',
-        display: 'flex',
-        flexWrap: 'wrap',
-        height: 'auto',
-        width: 'auto',
-        whiteSpace: 'normal',
-        textAlign: 'left',
-        maxWidth: '320px',
-        textDecoration: 'none',
-      } }, this.locationName && h("span", { style: { fontSize: '16px', marginBottom: '4px' } }, this.locationName), this.locationAddress && h("span", { style: { fontSize: '12px' } }, this.locationAddress)), h("div", { style: { marginTop: '8px', textAlign: 'center' } }, h("i", { class: "ri-map-pin-fill", style: { fontSize: '24px' } })))));
-  }
-  static get assetsDirs() { return ["assets"]; }
-};
-GoogleMap.style = indexCss$4;
-
-const indexCss$3 = "";
-
-const SalonInfo = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.salonId = undefined;
-    this.salonInfo = undefined;
-  }
-  componentWillLoad() {
-    this.fetchData();
-  }
-  async fetchData() {
-    try {
-      this.salonInfo = await HttpService().fetchSalonInfo(this.salonId);
-    }
-    catch (e) { }
-  }
-  render() {
-    return (h("div", { class: "salon-info" }, h("div", { class: "container" }, h("div", { class: "salon-info--schedules", style: { marginBottom: '24px' } }, h("salon-schedules", { "with-border": true, "is-loading": !this.salonInfo, "salon-id": 49989, "salon-info": JSON.stringify(this.salonInfo) })), h("div", { class: "row" }, h("div", { class: "col-md-5", style: { marginBottom: '24px' } }, h("salon-locations", { "with-border": true, "is-loading": !this.salonInfo, "salon-id": 49989, "salon-info": JSON.stringify(this.salonInfo) })), h("div", { class: "col-md-7", style: { marginBottom: '24px' } }, h("salon-latest-styles", { "with-border": true, "is-loading": !this.salonInfo, "salon-id": 49989, "salon-info": JSON.stringify(this.salonInfo) }))))));
-  }
-};
-SalonInfo.style = indexCss$3;
-
-const indexCss$2 = "salon-latest-styles .view--salon-styles--item{width:120px;height:120px}@media (min-width: 1024px){salon-latest-styles .view--salon-styles--item{width:200px;height:200px}}";
-
-const SalonLatestStyles = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.salonId = undefined;
-    this.isLoading = undefined;
-    this.withBorder = undefined;
-    this.isLoadingState = undefined;
-    this.latestStyles = undefined;
-  }
-  componentDidLoad() {
-    this.fetchData();
-  }
-  async fetchData() {
-    this.isLoadingState = true;
-    try {
-      const promises = [
-        HttpService().fetchSalonLatestStyles(this.salonId, { limit: 6 })
-          .then(salonStyles => this.latestStyles = salonStyles),
-      ];
-      return Promise.all(promises)
-        .then(() => this.isLoadingState = false)
-        .catch(() => this.isLoadingState = false);
-    }
-    catch (e) { }
-  }
-  onClickLookbook(style) {
-    const elLookbookModal = document.createElement('div');
-    elLookbookModal.innerHTML = `
-      <style-detail
-        salon-id=${this.salonId}
-        salon-lookbook='${JSON.stringify(style)}'
-      ></style-detail>
-    `;
-    document.body.appendChild(elLookbookModal);
-  }
-  render() {
-    if (this.isLoading || this.isLoadingState) {
-      return (h("div", { class: "view view--salon-styles" }, h("div", { class: "view-content", style: this.withBorder ? { border: `1px solid ${Colors.Gray02}`, borderRadius: '4px' } : { padding: '0px' } }, h("div", { style: {
-          backgroundColor: Colors.Gray02,
-          height: '20px',
-          width: '120px',
-        } }), h("div", { style: { marginTop: '24px' } }, h("div", { style: {
-          overflow: 'hidden',
-          marginLeft: '-16px',
-          marginBottom: '-16px',
-        } }, [1, 2, 3, 4, 5, 6, 7, 8, 9, 10].map((fakeId, idx) => (h("div", { key: `style-listing--item-${fakeId}-${idx}`, style: {
-          float: 'left',
-          paddingLeft: '16px',
-          marginBottom: '16px',
-        } }, h("div", { style: {
-          backgroundColor: Colors.Gray01,
-          borderRadius: '8px',
-          width: '120px',
-          height: '120px',
-          overflow: 'hidden',
-          position: 'relative',
-          cursor: 'pointer',
-        } })))))))));
-    }
-    return (h("div", { class: "view view--salon-styles" }, h("div", { class: "view-content", style: this.withBorder ? { border: `1px solid ${Colors.Gray02}`, borderRadius: '4px' } : { padding: '0px' } }, h("div", { style: { fontSize: '18px', fontWeight: 'bold' } }, "Photos"), h("div", { style: {
-        overflow: 'hidden',
-        marginLeft: '-16px',
-        marginBottom: '-16px',
-        marginTop: '16px',
-      } }, (this.latestStyles || []).map((faveStyle, idx) => {
-      const { imageThumb, albumMedias } = faveStyle;
-      const firstMedia = albumMedias.length > 0 ? albumMedias[0] : null;
-      const isVideo = firstMedia ? isVideoMedia(firstMedia) : false;
-      return (h("div", { key: `style-listing--item-${faveStyle.id}-${idx}`, style: {
-          float: 'left',
-          paddingLeft: '16px',
-          marginBottom: '16px',
-        } }, h("div", { class: "view--salon-styles--item", style: Object.assign({ backgroundColor: Colors.Gray01, borderRadius: '8px', overflow: 'hidden', position: 'relative', cursor: 'pointer' }, !isVideo && firstMedia ? {
-          backgroundImage: `url("${firstMedia.imageThumb || firstMedia.imageThumbMedium}")`,
-          backgroundRepeat: 'no-repeat',
-          backgroundPosition: 'center center',
-          backgroundSize: 'cover',
-        } : {}), onClick: () => this.onClickLookbook(faveStyle) }, isVideo && firstMedia && (h("div", null, h("video", { muted: true, width: "100%", height: "100%", poster: imageThumb }, h("source", { src: firstMedia.mediaUrl, type: "video/mp4" })), h("i", { class: "ri-play-circle-fill", style: {
-          fontSize: '48px',
-          color: Colors.TextColor,
-          position: 'absolute',
-          left: '50%',
-          top: '50%',
-          transform: 'translate(-50%, -50%)',
-        } }))))));
-    })))));
-  }
-};
-SalonLatestStyles.style = indexCss$2;
-
-const indexCss$1 = "@media (min-width: 768px){salon-locations .salon-contact--links{overflow:hidden;margin-left:-32px}salon-locations .salon-contact--links-item{float:left;display:flex;flex-direction:row;align-items:center;font-size:16px;min-width:300px;padding-left:32px}salon-locations .salon-contact--links-item:nth-child(2n+1){clear:left}salon-locations .salon-contact--links-item+.salon-contact--links-item{margin-top:8px}}";
-
-const SalonLocations = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.salonId = undefined;
-    this.salonInfo = undefined;
-    this.isLoading = undefined;
-    this.withBorder = undefined;
-    this.salonInfoState = undefined;
-  }
-  componentWillLoad() {
-    if (this.salonInfo) {
-      this.salonInfoState = JSON.parse(this.salonInfo);
-    }
-    else {
-      this.fetchData();
-    }
-  }
-  fetchData() {
-    try {
-      HttpService().fetchSalonInfo(this.salonId)
-        .then(salonInfo => this.salonInfoState = salonInfo);
-    }
-    catch (e) { }
-  }
-  render() {
-    if (this.isLoading) {
-      return (h("div", { class: "view view--salon-locations" }, h("div", { class: "view-content", style: this.withBorder ? { border: `1px solid ${Colors.Gray02}`, borderRadius: '4px' } : { padding: '0px' } }, h("div", { style: {
-          backgroundColor: Colors.Gray02,
-          height: '20px',
-          width: '120px',
-        } }), h("div", { style: { marginTop: '24px' } }, h("div", { style: {
-          backgroundColor: Colors.Gray01,
-          height: '16px',
-          width: '50%',
-        } }), h("div", { style: {
-          backgroundColor: Colors.Gray01,
-          height: '16px',
-          width: '50%',
-          marginTop: '8px',
-        } }), h("div", { style: {
-          backgroundColor: Colors.Gray01,
-          height: '192px',
-          width: '100%',
-          marginTop: '24px',
-        } })))));
-    }
-    const { businessPhone, businessName, website, email, } = this.salonInfoState || {};
-    const websiteUrl = formatWebsiteUrl(website);
-    const fullAddress = formatFullAddress(this.salonInfoState);
-    return (h("div", { class: "view view--salon-locations" }, h("div", { class: "view-content", style: this.withBorder ? { border: `1px solid ${Colors.Gray02}`, borderRadius: '4px' } : { padding: '0px' } }, h("div", { style: { fontSize: '18px', fontWeight: 'bold' } }, "Contact"), h("div", { class: "salon-contact--links", style: { marginTop: '16px' } }, businessPhone && (h("div", { class: "salon-contact--links-item" }, h("i", { class: "ri-phone-line", style: { color: Colors.Gray04, fontSize: '18px', marginRight: '6px' } }), " ", h("a", { href: `tel:${businessPhone}`, style: { color: Colors.TextColor, textDecoration: 'none' } }, businessPhone))), websiteUrl && (h("div", { class: "salon-contact--links-item" }, h("i", { class: "ri-links-line", style: { color: Colors.Gray04, fontSize: '18px', marginRight: '6px' } }), " ", h("a", { target: websiteUrl && websiteUrl.indexOf(window.location.hostname) === -1 ? '_blank' : undefined, href: websiteUrl, style: { color: Colors.TextColor, textDecoration: 'none' } }, websiteUrl))), email && (h("div", { class: "salon-contact--links-item" }, h("i", { class: "ri-mail-line", style: { color: Colors.Gray04, fontSize: '18px', marginRight: '6px' } }), " ", h("a", { href: `mailto:${email}`, style: { color: Colors.TextColor, textDecoration: 'none' } }, email)))), h("div", { class: "view--salon-info--map", style: { marginTop: '24px' } }, h("google-map", { "location-name": businessName, "location-address": fullAddress })))));
-  }
-};
-SalonLocations.style = indexCss$1;
-
-const indexCss = "salon-schedules .salon-schedules--day{display:flex;flex-direction:row;min-width:240px}@media (min-width: 768px){salon-schedules .salon-schedules--dates{overflow:hidden;margin-left:-32px}salon-schedules .salon-schedules--day{float:left;padding-left:32px}}";
-
-const SalonSchedules = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.salonId = undefined;
-    this.salonInfo = undefined;
-    this.isLoading = undefined;
-    this.withBorder = undefined;
-    this.salonInfoState = undefined;
-  }
-  componentWillLoad() {
-    if (this.salonInfo) {
-      this.salonInfoState = JSON.parse(this.salonInfo);
-    }
-    else {
-      this.fetchData();
-    }
-  }
-  fetchData() {
-    try {
-      HttpService().fetchSalonInfo(this.salonId)
-        .then(salonInfo => this.salonInfoState = salonInfo);
-    }
-    catch (e) { }
-  }
-  renderBusinessHour(businessHour) {
-    if (businessHour.status === BusinessHourStatus.ByAppointment) {
-      return 'By Appointment';
-    }
-    if (businessHour.status === BusinessHourStatus.Close) {
-      return 'Close';
-    }
-    return `${businessHour.openTime} - ${businessHour.closeTime}`;
-  }
-  render() {
-    if (this.isLoading) {
-      return (h("div", { class: "view view--salon-contact" }, h("div", { class: "view-content", style: this.withBorder ? { border: `1px solid ${Colors.Gray02}`, borderRadius: '4px' } : { padding: '0px' } }, h("div", { style: {
-          backgroundColor: Colors.Gray02,
-          height: '20px',
-          width: '120px',
-        } }), h("div", { style: { marginTop: '24px' } }, h("div", { style: {
-          backgroundColor: Colors.Gray01,
-          height: '16px',
-          width: '30%',
-        } }), h("div", { style: {
-          backgroundColor: Colors.Gray01,
-          height: '16px',
-          width: '40%',
-          marginTop: '8px',
-        } }), h("div", { style: {
-          backgroundColor: Colors.Gray01,
-          height: '16px',
-          width: '75%',
-          marginTop: '12px',
-        } }), h("div", { style: {
-          backgroundColor: Colors.Gray01,
-          height: '16px',
-          width: '75%',
-          marginTop: '8px',
-        } })), h("div", { style: { marginTop: '24px' } }, h("div", { style: {
-          overflow: 'hidden',
-          marginLeft: '-16px',
-          marginBottom: '-16px',
-        } }, [1, 2, 3, 4, 5, 6, 7].map((fakeId, idx) => (h("div", { key: `style-listing--item-${fakeId}-${idx}`, style: {
-          float: 'left',
-          paddingLeft: '16px',
-          marginBottom: '16px',
-        } }, h("div", { style: {
-          backgroundColor: Colors.Gray01,
-          width: '120px',
-          height: '20px',
-        } })))))))));
-    }
-    const { about, businessHours, } = (this.salonInfoState || {});
-    return (h("div", { class: "view view--salon-contact" }, h("div", { class: "view-content", style: this.withBorder ? { border: `1px solid ${Colors.Gray02}`, borderRadius: '4px' } : { padding: '0px' } }, h("div", { style: { fontSize: '18px', fontWeight: 'bold' } }, "About"), about && (h("div", { class: "salon-contact--info--desc", style: { fontSize: '16px', marginTop: '16px' }, innerHTML: about })), businessHours && businessHours.length > 0 && (h("div", { class: "salon-schedules", style: { marginTop: '24px' } }, h("div", { class: "salon-schedules--title", style: { fontSize: '16px', fontWeight: 'bold' } }, "Working hours"), h("div", { class: "salon-schedules--dates" }, h("div", { class: "salon-schedules--day", style: { marginTop: '8px' } }, h("div", { class: "salon-schedules--day-name", style: { fontWeight: 'bold', minWidth: '40px' } }, "Mon"), h("div", { class: "salon-schedules--day-time" }, this.renderBusinessHour(businessHours[0]))), h("div", { class: "salon-schedules--day", style: { marginTop: '8px' } }, h("div", { class: "salon-schedules--day-name", style: { fontWeight: 'bold', minWidth: '40px' } }, "Tue"), h("div", { class: "salon-schedules--day-time" }, this.renderBusinessHour(businessHours[1]))), h("div", { class: "salon-schedules--day", style: { marginTop: '8px' } }, h("div", { class: "salon-schedules--day-name", style: { fontWeight: 'bold', minWidth: '40px' } }, "Wed"), h("div", { class: "salon-schedules--day-time" }, this.renderBusinessHour(businessHours[2]))), h("div", { class: "salon-schedules--day", style: { marginTop: '8px' } }, h("div", { class: "salon-schedules--day-name", style: { fontWeight: 'bold', minWidth: '40px' } }, "Thur"), h("div", { class: "salon-schedules--day-time" }, this.renderBusinessHour(businessHours[3]))), h("div", { class: "salon-schedules--day", style: { marginTop: '8px' } }, h("div", { class: "salon-schedules--day-name", style: { fontWeight: 'bold', minWidth: '40px' } }, "Fri"), h("div", { class: "salon-schedules--day-time" }, this.renderBusinessHour(businessHours[4]))), h("div", { class: "salon-schedules--day", style: { marginTop: '8px' } }, h("div", { class: "salon-schedules--day-name", style: { fontWeight: 'bold', minWidth: '40px' } }, "Sat"), h("div", { class: "salon-schedules--day-time" }, this.renderBusinessHour(businessHours[5]))), h("div", { class: "salon-schedules--day", style: { marginTop: '8px' } }, h("div", { class: "salon-schedules--day-name", style: { fontWeight: 'bold', minWidth: '40px' } }, "Sun"), h("div", { class: "salon-schedules--day-time" }, this.renderBusinessHour(businessHours[6])))))))));
-  }
-};
-SalonSchedules.style = indexCss;
-
-export { GoogleMap as google_map, SalonInfo as salon_info, SalonLatestStyles as salon_latest_styles, SalonLocations as salon_locations, SalonSchedules as salon_schedules };