@mirai/core 0.4.36 → 0.4.38

package/public/App.Container.jsx

@@ -1,147 +0,0 @@
-/* eslint-disable react/prop-types */
-import { useStore } from '@mirai/data-sources';
-import { Action, Input, Text, View } from '@mirai/ui';
-import React from 'react';
-import { useLocation } from 'wouter';
-
-import * as style from './App.module.css';
-
-export const Container = ({ children }) => {
-  const [location, setLocation] = useLocation();
-
-  const {
-    value: { session },
-  } = useStore();
-
-  const richTemplate = !location.includes('/step');
-
-  return (
-    <>
-      {richTemplate && (
-        <View tag="header" className={style.header}>
-          <View row className={[style.wrapper, style.environment]}>
-            <Text small className={[style.contact, style.hideMobile]}>
-              Contact us directly at +34 (0) 129 039 193
-            </Text>
-            <View data-mirai-component="environment" data-locale="true" data-currencies="true" data-state="true" />
-          </View>
-
-          <View row className={[style.wrapper, style.main]}>
-            <View row>
-              <Action onPress={() => setLocation('/')}>
-                <Text>Home</Text>
-              </Action>
-
-              <Action className={style.hideMobile} onPress={() => setLocation('/about-us')}>
-                <Text>About Us</Text>
-              </Action>
-
-              <Action className={style.hideMobile} onPress={() => setLocation('/rooms')}>
-                <Text>Our Rooms</Text>
-              </Action>
-            </View>
-
-            <View>
-              <Action inline onPress={() => setLocation('/')}>
-                <Text bold brand headline level={1}>
-                  Monalisa
-                </Text>
-              </Action>
-              <Text small>HOTEL & RESORT</Text>
-            </View>
-
-            <View row>
-              <View data-mirai-component="session" />
-
-              {!session && (
-                <Action className={style.hideMobile} onPress={() => setLocation('/signup')}>
-                  <Text medium>Signup</Text>
-                </Action>
-              )}
-            </View>
-          </View>
-        </View>
-      )}
-
-      <View tag="main" className={style.children}>
-        {children}
-      </View>
-
-      {/* <View data-mirai-component="chat" /> */}
-
-      {richTemplate && (
-        <View tag="footer" className={style.footer}>
-          <View row className={[style.wrapper, style.links]}>
-            <View>
-              <Text bold>Site map</Text>
-              <Action inline small onPress={() => setLocation('/')}>
-                Home
-              </Action>
-              <Action inline small onPress={() => setLocation('/signup')}>
-                Signup
-              </Action>
-              <Action inline small onPress={() => setLocation('/profile')}>
-                Profile
-              </Action>
-              <Action inline small onPress={() => setLocation('/deals')}>
-                Deals
-              </Action>
-              <Action inline small onPress={() => setLocation('/finder')}>
-                Finder
-              </Action>
-            </View>
-
-            <View>
-              <Text bold>Reservation</Text>
-              <Action inline small onPress={() => setLocation('/step1-rates')}>
-                1. rates
-              </Action>
-              <Action inline small onPress={() => setLocation('/step2-checkout')}>
-                2. checkout
-              </Action>
-              <Action inline small onPress={() => setLocation('/step3-booking')}>
-                3. booking
-              </Action>
-            </View>
-
-            <View>
-              <Text bold>More</Text>
-              <View
-                data-mirai-component="bookingQuery"
-                data-test-id={window.IS_PLAYWRIGHT ? 'bookingQuery' : undefined}
-              >
-                <Action inline small data-ghost>
-                  My Booking
-                </Action>
-              </View>
-              <Action inline small onPress={() => setLocation('/legal-advice')}>
-                Legal Advice
-              </Action>
-              <Action inline small onPress={() => setLocation('/cookie-policy')}>
-                Cookie Policy
-              </Action>
-              <Action inline small onPress={() => setLocation('/privacy-policy')}>
-                Privacy Policy
-              </Action>
-              <Action inline small onPress={() => setLocation('/complaints-channel')}>
-                Complaints Channel
-              </Action>
-            </View>
-
-            <View className={[style.newsletter, style.hideMobile]}>
-              <Text bold>Sign up for get our newsletter</Text>
-              <Input name="newsletter" placeholder="Your email..." />
-            </View>
-          </View>
-
-          <Text small className={[style.wrapper, style.copyright]}>
-            <Text bold brand headline level={2}>
-              Monalisa
-            </Text>{' '}
-            © 1980-2024 Monalisa Hotel Group Santa Engracia 120. 28003 Madrid, Spain
-          </Text>
-        </View>
-      )}
-    </>
-  );
-};

package/public/App.jsx

@@ -1,34 +0,0 @@
-import React, { useEffect } from 'react';
-import ReactDOM from 'react-dom';
-import { useLocation, Route, Switch } from 'wouter';
-
-import { Container } from './App.Container';
-import { Deals, Finder, Home, NotFound, Profile, Signup, Step1, Step2, Step3 } from './routes';
-
-const App = () => {
-  const [location] = useLocation();
-
-  useEffect(() => {
-    window.Mirai?.core?.();
-    window.scrollTo({ behavior: 'smooth', top: 0 });
-  }, [location]);
-
-  return (
-    <Container>
-      <Switch>
-        <Route path={'/'} component={Home} />
-        <Route path={'/signup'} component={Signup} />
-        <Route path={'/profile'} component={Profile} />
-        <Route path={'/deals'} component={Deals} />
-        <Route path={'/finder'} component={Finder} />
-        <Route path={'/step0-accommodations'} component={undefined} />
-        <Route path={'/step1-rates'} component={Step1} />
-        <Route path={'/step2-checkout'} component={Step2} />
-        <Route path={'/step3-booking'} component={Step3} />
-        <Route path="/:location*">{(params) => <NotFound {...params} />}</Route>
-      </Switch>
-    </Container>
-  );
-};
-
-ReactDOM.render(<App />, document.getElementById('app'));

package/public/App.module.css

@@ -1,153 +0,0 @@
-:root {
-  --header-height: calc(var(--mirai-ui-space-XL) * 2);
-}
-
-/* -- defaults -------------------------------------------------------------- */
-body {
-  color: var(--mirai-ui-content);
-  margin: 0;
-  padding: 0;
-}
-
-/* -- App.container.jsx ----------------------------------------------------- */
-.wrapper {
-  align-self: center;
-  max-width: var(--mirai-ui-breakpoint-content);
-  width: 100%;
-}
-
-.wrapper.centered {
-  justify-content: center;
-  justify-content: space-between;
-}
-
-.header,
-.footer {
-  width: 100vw;
-  z-index: 0;
-}
-
-.header {
-  background-color: var(--mirai-ui-base);
-  padding: var(--mirai-ui-space-S);
-}
-
-.header [data-role='action'] {
-  text-decoration: none;
-}
-
-.header .environment {
-  align-items: right;
-  border-bottom: solid 1px var(--mirai-ui-content-border);
-  margin-bottom: var(--mirai-ui-space-XS);
-  padding-bottom: var(--mirai-ui-space-XS);
-}
-
-.header .environment .contact {
-  flex: 1;
-  color: var(--mirai-ui-content-light);
-}
-
-.header > .main > * {
-  flex: 1;
-  align-items: center;
-}
-
-.header > .main > *:first-child {
-  justify-content: flex-start;
-}
-
-.header > .main > *:last-child {
-  justify-content: flex-end;
-}
-
-.header > .main > *:first-child,
-.header > .main > *:last-child {
-  gap: var(--mirai-ui-space-L);
-}
-
-.footer {
-  background-color: var(--mirai-ui-content);
-}
-
-.footer [data-role='text'] {
-  color: var(--mirai-ui-base);
-}
-
-.footer ui-modal [data-role='text'] {
-  color: var(--mirai-ui-content);
-}
-
-.footer .links {
-  align-items: flex-start;
-  justify-content: space-between;
-}
-
-.footer .links [data-role='action'] {
-  color: var(--mirai-ui-content-light);
-}
-
-.footer .links [data-role='action']:hover {
-  color: var(--mirai-ui-base);
-}
-
-.footer .links > * {
-  gap: var(--mirai-ui-space-XS);
-}
-
-.footer .links .newsletter {
-  width: 33%;
-}
-
-.footer .links .newsletter [data-role='input'] {
-  background-color: transparent;
-  border-bottom: solid 1px var(--mirai-ui-content-light);
-  padding-bottom: var(--mirai-ui-space-XS);
-}
-
-.footer .copyright {
-  border-top: solid 1px var(--mirai-ui-content-light);
-}
-
-/* S */
-@media only screen and (max-width: 480px) {
-  .hideMobile {
-    display: none;
-  }
-
-  .header .environment {
-    justify-content: flex-end;
-  }
-
-  .children {
-    min-height: 61vh;
-  }
-
-  .footer {
-    padding: var(--mirai-ui-space-L) var(--mirai-ui-space-M);
-  }
-
-  .footer .copyright {
-    border-top: solid 1px var(--mirai-ui-content-light);
-    margin-top: var(--mirai-ui-space-L);
-    padding-top: var(--mirai-ui-space-M);
-  }
-}
-
-/* M & L */
-@media only screen and (min-width: 431px) {
-  .footer {
-    padding: var(--mirai-ui-space-XL) var(--mirai-ui-space-M);
-  }
-
-  .footer .copyright {
-    margin-top: var(--mirai-ui-space-XL);
-    padding-top: var(--mirai-ui-space-L);
-  }
-}
-
-@media print {
-  .footer {
-    display: none;
-  }
-}

package/public/index.html

@@ -1,32 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>Monalisa - Hotel & Resort</title>
-    <link rel="preconnect" href="https://dictionary.mirai.com" />
-    <link rel="preconnect" href="https://fonts.googleapis.com" />
-    <link rel="preconnect" href="https://fonts.gstatic.com" />
-    <link rel="preconnect" href="https://reservation.mirai.com" />
-    <link rel="preconnect" href="https://i.pravatar.cc" />
-    <!-- /site -->
-    <link rel="preload" as="style" href="./themes/monalisa.theme.css" onload="this.onload=null;this.rel='stylesheet'" />
-    <script src="./scripts/script.js"></script>
-  </head>
-  <body>
-    <div data-mirai-engine="mirai_tr" data-init="false"></div>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <!-- hotel example -->
-    <div id="mirai" data-mirai-id="100379008"></div>
-    <!-- chain example -->
-    <!-- <div data-mirai-id="501404" data-hotel="88737419" data-type="chain" data-locale="en-GB" _hidden></div> -->
-
-    <!-- /site -->
-    <div id="app"></div>
-    <script async type="module" defer src="./App.jsx"></script>
-    <!-- <script type="text/javascript" src="https://js-pre.mirai.com/mirai-tracking/mirai.tracking.js"></script> -->
-
-    <!-- @mirai/core -->
-    <script async type="module" defer src="../src/index.js"></script>
-  </body>
-</html>

package/public/index.template.html

@@ -1,19 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>Monalisa - Hotel & Resort</title>
-    <link rel="stylesheet" href="{url}/index.css" />
-    <link rel="stylesheet" defer href="./themes/monalisa.theme.css" />
-  </head>
-
-  <body>
-    <div data-mirai-id="100379008" data-locale="en-GB" data-currency="GBP"></div>
-
-    <div id="app"></div>
-
-    <script type="module" defer src="{url}/index.js"></script>
-    <script type="module" src="./App.jsx"></script>
-  </body>
-</html>

package/public/performance/index.html

@@ -1,159 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <style>
-      * {
-        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif,
-          'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
-        font-size: 16px;
-        line-height: 20px;
-      }
-
-      header *,
-      main strong,
-      main small {
-        color: #484848;
-      }
-
-      header > * {
-        align-items: center;
-        border-bottom: solid 1px #dedede;
-        display: flex;
-        flex-direction: row;
-        justify-content: space-between;
-      }
-
-      header small {
-        font-size: 12px;
-        line-height: 16px;
-      }
-
-      header a {
-        margin-left: 12px;
-        text-decoration: none;
-      }
-
-      header h1 {
-        font-size: 24px;
-        line-height: 24px;
-        margin: 0;
-        padding: 0;
-      }
-
-      header > :first-child {
-        padding: 12px 16px;
-      }
-
-      header > :first-child * {
-        color: #6e6e6e;
-      }
-
-      header > :first-child a {
-        font-size: 14px;
-      }
-
-      header > :last-child {
-        padding: 16px;
-      }
-
-      header > :last-child a {
-        font-weight: 500;
-      }
-
-      main {
-        background-color: #f6f6f6;
-        padding: 0 16px;
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        height: 80svh;
-      }
-
-      main > strong,
-      main > small {
-        text-align: center;
-      }
-
-      main > * {
-        margin: 0 auto;
-        width: fit-content;
-      }
-
-      @media only screen and (width <= 820px) {
-        main {
-          padding-top: 64px;
-        }
-
-        main > strong {
-          font-size: 44px;
-          line-height: 56px;
-        }
-
-        main > small {
-          font-size: 16px;
-          line-height: 20px;
-          padding-top: 24px;
-          padding-bottom: 48px;
-        }
-      }
-
-      @media only screen and (width > 820px) {
-        main {
-          padding-top: 96px;
-        }
-
-        main > strong {
-          font-size: 96px;
-          line-height: 120px;
-          max-width: 75%;
-        }
-
-        main > small {
-          font-size: 24px;
-          line-height: 32px;
-          max-width: 50%;
-          padding-top: 24px;
-          padding-bottom: 64px;
-        }
-      }
-    </style>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <title>Monalisa - Hotel & Resort</title>
-    <link rel="preconnect" href="https://dictionary.mirai.com" />
-    <link rel="preconnect" href="https://reservation.mirai.com" />
-  </head>
-  <body>
-    <div id="mirai" data-mirai-id="100379008"></div>
-
-    <header>
-      <div>
-        <small>Contact us directly at +34 (0) 129 039 193</small>
-        <nav>
-          <a href="#">EUR</a>
-          <a href="#">English</a>
-        </nav>
-      </div>
-      <div>
-        <div>
-          <h1>monalisa</h1>
-          <small>Hotel & Resort</small>
-        </div>
-        <nav>
-          <a href="#">■ Login</a>
-          <a href="#">Signup</a>
-        </nav>
-      </div>
-    </header>
-
-    <main>
-      <strong>Discover the Serenity of a Perfect Stay</strong>
-      <small>
-        Experience the calming atmosphere of our serene guest rooms, each designed with your comfort in mind.
-      </small>
-      <div data-mirai-component="finder"></div>
-    </main>
-
-    <script async type="module" defer src="../../src/index.js"></script>
-  </body>
-</html>

package/public/routes/Deals.jsx

@@ -1,20 +0,0 @@
-import { Text, View } from '@mirai/ui';
-import React from 'react';
-
-import * as style from './routes.module.css';
-
-export const Deals = () => (
-  <>
-    <View tag="section" className={[style.section, style.box, style.accent]}>
-      <View className={style.wrapper}>
-        <Text bold headline level={1}>
-          Deals
-        </Text>
-        <Text>Discover exclusive hotel offers tailored just for you.</Text>
-      </View>
-    </View>
-    <View className={[style.wrapper, style.box]}>
-      <View data-mirai-component="deals" data-id="350807" />
-    </View>
-  </>
-);

package/public/routes/Finder.jsx

@@ -1,19 +0,0 @@
-import { Text, View } from '@mirai/ui';
-import React from 'react';
-
-import * as style from './routes.module.css';
-
-export const Finder = () => (
-  <>
-    <View tag="section" className={[style.section, style.box, style.accent]}>
-      <View className={(style.wrapper, style.centered)}>
-        <Text bold headline level={1}>
-          Finder
-        </Text>
-      </View>
-    </View>
-    <View className={[style.wrapper, style.box]}>
-      <View data-mirai-component="finder" data-layout="column" className={style.column} />
-    </View>
-  </>
-);

package/public/routes/Home.constants.js

@@ -1,52 +0,0 @@
-const TESTIMONIALS = [
-  {
-    text: 'My stay at Monalisa was spectacular. From the moment I entered, I was struck by the elegance and welcoming atmosphere. The staff was always friendly and helpful, making our visit even more special. We will definitely be back soon.',
-    rating: 5,
-    name: 'Hal Finney',
-    jobPosition: 'Marketing Manager',
-  },
-  {
-    text: 'The Monalisa Resort is simply incredible. The facilities are top-notch, and the views from my room were breathtaking. The customer service exceeded all my expectations. A perfect place to relax and unwind.',
-    rating: 5,
-    name: 'Gavin Andresen',
-    jobPosition: 'Financial Consultant',
-  },
-  {
-    text: 'I have never experienced such a level of luxury and comfort as at Monalisa. The attention to detail in every corner of the hotel was astonishing. The restaurant offered an exquisite variety of dishes, all delicious. Highly recommended!',
-    rating: 5,
-    name: 'Martti Malmi',
-    jobPosition: 'Real Estate Agent',
-  },
-  {
-    text: 'I had a wonderful weekend at the Monalisa Resort. The location is perfect, and the quality of service is unmatched. The spa was a rejuvenating experience that left me completely relaxed. I can’t wait to return!',
-    rating: 4,
-    name: 'Jeff Garzik',
-    jobPosition: 'Event Planner',
-  },
-  {
-    text: 'From the moment we arrived, we were treated like royalty. The staff is exceptionally attentive and kind. The rooms are spacious and comfortable, and the decor is modern and sophisticated. An unforgettable experience.',
-    rating: 5,
-    name: 'Laszlo Hanyecz',
-    jobPosition: 'Software Engineer',
-  },
-  {
-    text: 'Monalisa - Hotel & Resort is a true paradise. The leisure areas and the surrounding landscape create a serene and peaceful environment. The breakfast buffet had a great variety and everything was delicious. We will definitely be back.',
-    rating: 4,
-    name: 'Nick Szabo',
-    jobPosition: 'Architect',
-  },
-  {
-    text: 'This is the best hotel I have ever stayed in. Everything, from check-in to check-out, was impeccable. The gardens are beautiful and the staff always made sure we had everything we needed. Highly recommended.',
-    rating: 5,
-    name: 'Adam Back',
-    jobPosition: 'Business Consultant',
-  },
-  {
-    text: 'Monalisa offers a perfect combination of luxury and comfort. The views from the pool are stunning, and the quality of service is outstanding. An ideal place for a family vacation or a romantic getaway.',
-    rating: 5,
-    name: 'Charlie Lee',
-    jobPosition: 'Graphic Designer',
-  },
-];
-
-export { TESTIMONIALS };