@mirai/core 0.1.10 → 0.1.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +103 -0
- package/build/components/finder/Deals.js +10 -0
- package/build/components/finder/Deals.js.map +1 -0
- package/build/components/index.js +3 -1
- package/build/components/index.js.map +1 -1
- package/build/components/user/BookingQuery.js +10 -0
- package/build/components/user/BookingQuery.js.map +1 -0
- package/build/helpers/consolidateStore.js +5 -3
- package/build/helpers/consolidateStore.js.map +1 -1
- package/build/index.js +6 -0
- package/build/index.js.map +1 -1
- package/package.json +3 -3
- package/public/index.css +42 -12
- package/public/index.html +15 -9
package/README.md
CHANGED
|
@@ -1 +1,104 @@
|
|
|
1
1
|
# @mirai/core
|
|
2
|
+
|
|
3
|
+
# 1. Installation
|
|
4
|
+
|
|
5
|
+
The installation of the new mirai's core is very simple. You will simply have to add 2 files inside your html page.
|
|
6
|
+
|
|
7
|
+
## 1.1 Requirements
|
|
8
|
+
|
|
9
|
+
The first one will be our styles file for the default theme. This file only contains css variable assignments, so it will never conflict with any other css files you have. Here you have an example of how you should instantiate it:
|
|
10
|
+
|
|
11
|
+
```html
|
|
12
|
+
<head>
|
|
13
|
+
<link rel="stylesheet" href="https://static.mirai.com/core/theme.css" rel="preload" defer />
|
|
14
|
+
...
|
|
15
|
+
</head>
|
|
16
|
+
```
|
|
17
|
+
|
|
18
|
+
The next file we need is our component repository file. This JavaScript file provides an asynchronous loading system for components, so it will not influence the overall loading of your html page much. Here you have an example of how you should instantiate it:
|
|
19
|
+
|
|
20
|
+
```html
|
|
21
|
+
...
|
|
22
|
+
<script type="module" defer src="https://static.mirai.com/core/index.js"></script>
|
|
23
|
+
</body>
|
|
24
|
+
```
|
|
25
|
+
|
|
26
|
+
## 1.2 Creating a data repository instance
|
|
27
|
+
|
|
28
|
+
Once the two main files of our new core are instantiated, we need to indicate which data repository we want to load. For this we will use an html element within our html page:
|
|
29
|
+
|
|
30
|
+
```html
|
|
31
|
+
<body>
|
|
32
|
+
<div data-mirai-id="501404" hidden></div>
|
|
33
|
+
...
|
|
34
|
+
</body>
|
|
35
|
+
```
|
|
36
|
+
|
|
37
|
+
The attributes that we can set in this instance are:
|
|
38
|
+
|
|
39
|
+
- `data-mirai-id`: the hotel or chain identifier.
|
|
40
|
+
- `data-type`: `hotel` or `chain` instance type (default is `hotel`)
|
|
41
|
+
- `data-locale`: in case we want to set a different language locale than the default.
|
|
42
|
+
- `data-currency`: in case we want to set a currency than the default.
|
|
43
|
+
|
|
44
|
+
Here you have an complete example using all these attributes:
|
|
45
|
+
|
|
46
|
+
```html
|
|
47
|
+
<body>
|
|
48
|
+
<div data-mirai-id="500255" data-type="chain" data-currency="JPY" data-locale="ja-JA" hidden></div>
|
|
49
|
+
...
|
|
50
|
+
</body>
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
## 1.3 Environments
|
|
54
|
+
|
|
55
|
+
Our new core has different execution environments. These differ for the most part in the way they have been compiled.
|
|
56
|
+
|
|
57
|
+
- `production` (https://static.mirai.com) the bundle has been generated by minifying and obfuscating the largest code base possible.
|
|
58
|
+
- `development` (https://static-pre.mirai.com) the bundle has been generated in development mode with _sourceMaps_ as well as the access to the services is also in development mode.
|
|
59
|
+
|
|
60
|
+
# 2. Components
|
|
61
|
+
|
|
62
|
+
To instantiate any component from the core repository we have to take into account these properties common to all components:
|
|
63
|
+
|
|
64
|
+
- `data-mirai-component:string`: ndicates the name of the component to instantiate
|
|
65
|
+
- `data-mobile:bool`: if you only want to instantiate the component in a mobile environment.
|
|
66
|
+
- `data-desktop:bool`: if you only want to instantiate the component in a non mobile environment.
|
|
67
|
+
|
|
68
|
+
Here you have an example of how you should instantiate it:
|
|
69
|
+
|
|
70
|
+
```html
|
|
71
|
+
<div data-mirai-component="finder" data-mobile="true"></div>
|
|
72
|
+
```
|
|
73
|
+
|
|
74
|
+
It should also be noted that some components may offer the _ghosting_ system. This means that that component can receive different html markup than the default component provides. Let's see a naive example:
|
|
75
|
+
|
|
76
|
+
```html
|
|
77
|
+
<div data-mirai-component="session">
|
|
78
|
+
<button>Login here</button>
|
|
79
|
+
</div>
|
|
80
|
+
```
|
|
81
|
+
|
|
82
|
+
> In this example we replace the html markup with a `<button>` with the content `Login Here`
|
|
83
|
+
|
|
84
|
+
## 2.1 `<BookingQuery>`
|
|
85
|
+
|
|
86
|
+
This component shows a modal in which it asks the user for the `bookingId` and `pinCode` if both fields are correct, it redirects to the page to manage the reservation.
|
|
87
|
+
|
|
88
|
+
```html
|
|
89
|
+
<div data-mirai-component="bookingQuery"></div>
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
## 2.2 `<Deals>`
|
|
93
|
+
|
|
94
|
+
This component displays a form to be able to search for rooms with a certain offer. This form contains 3 fields:
|
|
95
|
+
|
|
96
|
+
- `calendar` (check-in & check-out)
|
|
97
|
+
- `occupation`
|
|
98
|
+
- `promocode`
|
|
99
|
+
|
|
100
|
+
```html
|
|
101
|
+
<div data-mirai-component="deals" data-id="293842"></div>
|
|
102
|
+
```
|
|
103
|
+
|
|
104
|
+
This component needs a `data-id` property that will contain the `id` of the offer to display.
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Deals.js","names":["Deals"],"sources":["../../../src/components/finder/Deals.jsx"],"sourcesContent":["import { Deals } from '@mirai/finder';\n\nexport default Deals;\n"],"mappings":";;;;;;AAAA;AAAsC,eAEvBA,aAAK;AAAA"}
|
|
@@ -10,10 +10,12 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
10
10
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
11
11
|
var _default = {
|
|
12
12
|
// @mirai/finder
|
|
13
|
-
finder:
|
|
13
|
+
// finder: React.lazy(() => import('./finder/Finder')),
|
|
14
|
+
deals: /*#__PURE__*/_react.default.lazy(() => Promise.resolve().then(() => _interopRequireWildcard(require('./finder/Deals')))),
|
|
14
15
|
// @mirai/user
|
|
15
16
|
session: /*#__PURE__*/_react.default.lazy(() => Promise.resolve().then(() => _interopRequireWildcard(require('./user/Session')))),
|
|
16
17
|
signup: /*#__PURE__*/_react.default.lazy(() => Promise.resolve().then(() => _interopRequireWildcard(require('./user/Signup')))),
|
|
18
|
+
bookingQuery: /*#__PURE__*/_react.default.lazy(() => Promise.resolve().then(() => _interopRequireWildcard(require('./user/BookingQuery')))),
|
|
17
19
|
// Internal
|
|
18
20
|
environment: /*#__PURE__*/_react.default.lazy(() => Promise.resolve().then(() => _interopRequireWildcard(require('./__internal__/Environment')))),
|
|
19
21
|
state: /*#__PURE__*/_react.default.lazy(() => Promise.resolve().then(() => _interopRequireWildcard(require('./__internal__/State')))),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["
|
|
1
|
+
{"version":3,"file":"index.js","names":["deals","React","lazy","session","signup","bookingQuery","environment","state","ghost"],"sources":["../../src/components/index.js"],"sourcesContent":["import React from 'react';\n\nexport default {\n // @mirai/finder\n // finder: React.lazy(() => import('./finder/Finder')),\n deals: React.lazy(() => import('./finder/Deals')),\n\n // @mirai/user\n session: React.lazy(() => import('./user/Session')),\n signup: React.lazy(() => import('./user/Signup')),\n bookingQuery: React.lazy(() => import('./user/BookingQuery')),\n\n // Internal\n environment: React.lazy(() => import('./__internal__/Environment')),\n state: React.lazy(() => import('./__internal__/State')),\n ghost: React.lazy(() => import('./__internal__/Ghost')),\n};\n"],"mappings":";;;;;;AAAA;AAA0B;AAAA;AAAA;AAAA,eAEX;EACb;EACA;EACAA,KAAK,eAAEC,cAAK,CAACC,IAAI,CAAC,mEAAa,gBAAgB,GAAC,CAAC;EAEjD;EACAC,OAAO,eAAEF,cAAK,CAACC,IAAI,CAAC,mEAAa,gBAAgB,GAAC,CAAC;EACnDE,MAAM,eAAEH,cAAK,CAACC,IAAI,CAAC,mEAAa,eAAe,GAAC,CAAC;EACjDG,YAAY,eAAEJ,cAAK,CAACC,IAAI,CAAC,mEAAa,qBAAqB,GAAC,CAAC;EAE7D;EACAI,WAAW,eAAEL,cAAK,CAACC,IAAI,CAAC,mEAAa,4BAA4B,GAAC,CAAC;EACnEK,KAAK,eAAEN,cAAK,CAACC,IAAI,CAAC,mEAAa,sBAAsB,GAAC,CAAC;EACvDM,KAAK,eAAEP,cAAK,CAACC,IAAI,CAAC,mEAAa,sBAAsB,GAAC;AACxD,CAAC;AAAA"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _user = require("@mirai/user");
|
|
8
|
+
var _default = _user.BookingQuery;
|
|
9
|
+
exports.default = _default;
|
|
10
|
+
//# sourceMappingURL=BookingQuery.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BookingQuery.js","names":["BookingQuery"],"sources":["../../../src/components/user/BookingQuery.jsx"],"sourcesContent":["import { BookingQuery } from '@mirai/user';\n\nexport default BookingQuery;\n"],"mappings":";;;;;;AAAA;AAA2C,eAE5BA,kBAAY;AAAA"}
|
|
@@ -31,7 +31,7 @@ const consolidateStore = function () {
|
|
|
31
31
|
// currency
|
|
32
32
|
const currency = (forceUri ? urlParams.currency : undefined) || cookies.currency || urlParams.currency || instance.currency || _locale.DEFAULT_CURRENCY;
|
|
33
33
|
|
|
34
|
-
// club
|
|
34
|
+
// club
|
|
35
35
|
let club;
|
|
36
36
|
if (config.club) {
|
|
37
37
|
let {
|
|
@@ -56,7 +56,7 @@ const consolidateStore = function () {
|
|
|
56
56
|
};
|
|
57
57
|
}
|
|
58
58
|
|
|
59
|
-
// hotel
|
|
59
|
+
// hotel
|
|
60
60
|
let hotel = {
|
|
61
61
|
id
|
|
62
62
|
};
|
|
@@ -92,7 +92,7 @@ const consolidateStore = function () {
|
|
|
92
92
|
hotel,
|
|
93
93
|
promo,
|
|
94
94
|
session,
|
|
95
|
-
//
|
|
95
|
+
// @mirai/finder
|
|
96
96
|
finder: {
|
|
97
97
|
// ! TODO: we should hydrate it
|
|
98
98
|
place: undefined,
|
|
@@ -100,6 +100,8 @@ const consolidateStore = function () {
|
|
|
100
100
|
occupation: undefined,
|
|
101
101
|
promocode: promo?.code
|
|
102
102
|
},
|
|
103
|
+
deals: undefined,
|
|
104
|
+
// @mirai/user
|
|
103
105
|
signup: undefined
|
|
104
106
|
};
|
|
105
107
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"consolidateStore.js","names":["consolidateStore","config","cookies","instance","el","id","type","session","urlParams","forceUri","navigatorLanguage","countryLanguage","window","navigator","language","split","country","locale","lang","currency","undefined","DEFAULT_CURRENCY","club","authentication","idClub","name","conditionsUrl","conditions","privacyPolicyUrl","privacy","url","hotel","promo","showPromoNav","accomodation","configPromo","promoText","placeholder","DEFAULT_LOCALE","finder","place","calendar","occupation","promocode","code","signup"],"sources":["../../src/helpers/consolidateStore.js"],"sourcesContent":["import { DEFAULT_CURRENCY, DEFAULT_LOCALE } from '@mirai/locale';\n\n/* eslint-disable no-unused-vars */\nexport const consolidateStore = ({\n config = {},\n cookies = {},\n instance: { el, id, type, ...instance } = {},\n session,\n urlParams = {},\n} = {}) => {\n const { forceUri = false } = urlParams;\n\n // language & country\n const [navigatorLanguage, countryLanguage] = window.navigator.language?.split('-') || [];\n let [language = navigatorLanguage, country = countryLanguage] = instance.locale?.split('-') || [];\n if (urlParams.lang && urlParams.lang === navigatorLanguage) language = urlParams.lang;\n\n // currency\n const currency =\n (forceUri ? urlParams.currency : undefined) ||\n cookies.currency ||\n urlParams.currency ||\n instance.currency ||\n DEFAULT_CURRENCY;\n\n // club
|
|
1
|
+
{"version":3,"file":"consolidateStore.js","names":["consolidateStore","config","cookies","instance","el","id","type","session","urlParams","forceUri","navigatorLanguage","countryLanguage","window","navigator","language","split","country","locale","lang","currency","undefined","DEFAULT_CURRENCY","club","authentication","idClub","name","conditionsUrl","conditions","privacyPolicyUrl","privacy","url","hotel","promo","showPromoNav","accomodation","configPromo","promoText","placeholder","DEFAULT_LOCALE","finder","place","calendar","occupation","promocode","code","deals","signup"],"sources":["../../src/helpers/consolidateStore.js"],"sourcesContent":["import { DEFAULT_CURRENCY, DEFAULT_LOCALE } from '@mirai/locale';\n\n/* eslint-disable no-unused-vars */\nexport const consolidateStore = ({\n config = {},\n cookies = {},\n instance: { el, id, type, ...instance } = {},\n session,\n urlParams = {},\n} = {}) => {\n const { forceUri = false } = urlParams;\n\n // language & country\n const [navigatorLanguage, countryLanguage] = window.navigator.language?.split('-') || [];\n let [language = navigatorLanguage, country = countryLanguage] = instance.locale?.split('-') || [];\n if (urlParams.lang && urlParams.lang === navigatorLanguage) language = urlParams.lang;\n\n // currency\n const currency =\n (forceUri ? urlParams.currency : undefined) ||\n cookies.currency ||\n urlParams.currency ||\n instance.currency ||\n DEFAULT_CURRENCY;\n\n // club\n let club;\n if (config.club) {\n let {\n club: {\n club: { authentication, idClub: id, name },\n conditionsUrl: conditions,\n privacyPolicyUrl: privacy,\n },\n } = config;\n club = { authentication, id, name, url: { conditions, privacy } };\n }\n\n // hotel\n let hotel = {\n id,\n };\n\n // promo\n let promo;\n if (config.showPromoNav) {\n const { accomodation: { promo: configPromo = {} } = {}, promoText: placeholder = {} } = config;\n promo = { ...configPromo, placeholder };\n }\n\n return {\n config,\n cookies,\n urlParams,\n ...instance,\n id,\n type,\n\n // region\n currency,\n language,\n country,\n locale: language && country ? `${language}-${country}` : DEFAULT_LOCALE,\n\n // entities,\n club,\n hotel,\n promo,\n session,\n\n // @mirai/finder\n finder: {\n // ! TODO: we should hydrate it\n place: undefined,\n calendar: undefined,\n occupation: undefined,\n promocode: promo?.code,\n },\n deals: undefined,\n\n // @mirai/user\n signup: undefined,\n };\n};\n"],"mappings":";;;;;;AAAA;AAEA;AACO,MAAMA,gBAAgB,GAAG,YAMrB;EAAA,IANsB;IAC/BC,MAAM,GAAG,CAAC,CAAC;IACXC,OAAO,GAAG,CAAC,CAAC;IACZC,QAAQ,EAAE;MAAEC,EAAE;MAAEC,EAAE;MAAEC,IAAI;MAAE,GAAGH;IAAS,CAAC,GAAG,CAAC,CAAC;IAC5CI,OAAO;IACPC,SAAS,GAAG,CAAC;EACf,CAAC,uEAAG,CAAC,CAAC;EACJ,MAAM;IAAEC,QAAQ,GAAG;EAAM,CAAC,GAAGD,SAAS;;EAEtC;EACA,MAAM,CAACE,iBAAiB,EAAEC,eAAe,CAAC,GAAGC,MAAM,CAACC,SAAS,CAACC,QAAQ,EAAEC,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE;EACxF,IAAI,CAACD,QAAQ,GAAGJ,iBAAiB,EAAEM,OAAO,GAAGL,eAAe,CAAC,GAAGR,QAAQ,CAACc,MAAM,EAAEF,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE;EACjG,IAAIP,SAAS,CAACU,IAAI,IAAIV,SAAS,CAACU,IAAI,KAAKR,iBAAiB,EAAEI,QAAQ,GAAGN,SAAS,CAACU,IAAI;;EAErF;EACA,MAAMC,QAAQ,GACZ,CAACV,QAAQ,GAAGD,SAAS,CAACW,QAAQ,GAAGC,SAAS,KAC1ClB,OAAO,CAACiB,QAAQ,IAChBX,SAAS,CAACW,QAAQ,IAClBhB,QAAQ,CAACgB,QAAQ,IACjBE,wBAAgB;;EAElB;EACA,IAAIC,IAAI;EACR,IAAIrB,MAAM,CAACqB,IAAI,EAAE;IACf,IAAI;MACFA,IAAI,EAAE;QACJA,IAAI,EAAE;UAAEC,cAAc;UAAEC,MAAM,EAAEnB,EAAE;UAAEoB;QAAK,CAAC;QAC1CC,aAAa,EAAEC,UAAU;QACzBC,gBAAgB,EAAEC;MACpB;IACF,CAAC,GAAG5B,MAAM;IACVqB,IAAI,GAAG;MAAEC,cAAc;MAAElB,EAAE;MAAEoB,IAAI;MAAEK,GAAG,EAAE;QAAEH,UAAU;QAAEE;MAAQ;IAAE,CAAC;EACnE;;EAEA;EACA,IAAIE,KAAK,GAAG;IACV1B;EACF,CAAC;;EAED;EACA,IAAI2B,KAAK;EACT,IAAI/B,MAAM,CAACgC,YAAY,EAAE;IACvB,MAAM;MAAEC,YAAY,EAAE;QAAEF,KAAK,EAAEG,WAAW,GAAG,CAAC;MAAE,CAAC,GAAG,CAAC,CAAC;MAAEC,SAAS,EAAEC,WAAW,GAAG,CAAC;IAAE,CAAC,GAAGpC,MAAM;IAC9F+B,KAAK,GAAG;MAAE,GAAGG,WAAW;MAAEE;IAAY,CAAC;EACzC;EAEA,OAAO;IACLpC,MAAM;IACNC,OAAO;IACPM,SAAS;IACT,GAAGL,QAAQ;IACXE,EAAE;IACFC,IAAI;IAEJ;IACAa,QAAQ;IACRL,QAAQ;IACRE,OAAO;IACPC,MAAM,EAAEH,QAAQ,IAAIE,OAAO,GAAI,GAAEF,QAAS,IAAGE,OAAQ,EAAC,GAAGsB,sBAAc;IAEvE;IACAhB,IAAI;IACJS,KAAK;IACLC,KAAK;IACLzB,OAAO;IAEP;IACAgC,MAAM,EAAE;MACN;MACAC,KAAK,EAAEpB,SAAS;MAChBqB,QAAQ,EAAErB,SAAS;MACnBsB,UAAU,EAAEtB,SAAS;MACrBuB,SAAS,EAAEX,KAAK,EAAEY;IACpB,CAAC;IACDC,KAAK,EAAEzB,SAAS;IAEhB;IACA0B,MAAM,EAAE1B;EACV,CAAC;AACH,CAAC;AAAC"}
|
package/build/index.js
CHANGED
|
@@ -15,6 +15,12 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
15
15
|
|
|
16
16
|
window.Mirai = window.Mirai || {};
|
|
17
17
|
window.Mirai.environment = process && process.env && process.env.NODE_ENV || "production";
|
|
18
|
+
window.Mirai.services = {
|
|
19
|
+
club: process && process.env && process.env.SERVICE_CLUB || "https://api.mirai.com",
|
|
20
|
+
engine: process && process.env && process.env.SERVICE_ENGINE || "https://engine.mirai.com",
|
|
21
|
+
static: process && process.env && process.env.SERVICE_STATIC || "https://static.mirai.com",
|
|
22
|
+
user: process && process.env && process.env.SERVICE_USER || "https://api.mirai.com"
|
|
23
|
+
};
|
|
18
24
|
window.Mirai.version = _package.version;
|
|
19
25
|
window.Mirai.core = async () => {
|
|
20
26
|
const isProduction = (process && process.env && process.env.NODE_ENV || "production") === 'production';
|
package/build/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["window","Mirai","environment","version","core","isProduction","isDevelopment","console","log","name","urlParams","fetchUrlParams","location","search","substring","cookies","fetchCookies","COOKIE_CART","COOKIE_VALUES","session","fetchSession","env","loadEnvironment","undefined","instance","findInstance","components","findComponents","length","config","fetchConfig","theme","store","consolidateStore","ReactDOM","render","el"],"sources":["../src/index.js"],"sourcesContent":["/* eslint-disable no-console */\nimport { MetricsProvider, StoreProvider } from '@mirai/data-sources';\nimport React from 'react';\nimport ReactDOM from 'react-dom';\n\n// ! TODO: Load this file before index.css\n// import '../node_modules/@mirai/ui/build/theme/default.theme.css';\n\nimport { name, version } from '../package.json';\nimport { Core } from './Core';\nimport { COOKIE_CART, COOKIE_VALUES } from './Core.definition';\nimport {\n consolidateStore,\n fetchConfig,\n fetchCookies,\n fetchSession,\n fetchUrlParams,\n findComponents,\n findInstance,\n loadEnvironment,\n theme,\n} from './helpers';\n\nwindow.Mirai = window.Mirai || {};\n\nwindow.Mirai.environment = process.env.NODE_ENV;\n\nwindow.Mirai.version = version;\n\nwindow.Mirai.core = async () => {\n const isProduction = process.env.NODE_ENV === 'production';\n const isDevelopment = process.env.NODE_ENV === 'development';\n\n console.log(`${isProduction ? '🟢' : isDevelopment ? '🟡' : '🔴'} ${name} v${version} [${process.env.NODE_ENV}]`);\n\n // 1. Fetch client-side dataSources\n const urlParams = fetchUrlParams(location.search.substring(1));\n const cookies = fetchCookies([COOKIE_CART, COOKIE_VALUES]);\n const session = fetchSession(urlParams);\n\n // 2. Analize environment\n const environment = urlParams.env && isProduction ? loadEnvironment(urlParams.env) : undefined;\n if (environment) return;\n\n // 3. Find instance\n const instance = findInstance();\n if (!instance) return;\n\n // 4. Find components\n const components = findComponents();\n if (!components.length) return;\n\n // 5. Analize id to fetch its config\n const config = await fetchConfig(instance);\n if (!config) return;\n\n // 6. Theming\n theme();\n\n // 7. Consolidate store\n const store = consolidateStore({ config, cookies, instance, session, urlParams });\n\n // 8. Render components\n ReactDOM.render(\n <React.StrictMode>\n <MetricsProvider token={process.env.METRICS}>\n <StoreProvider value={store}>\n <Core {...{ components }} />\n </StoreProvider>\n </MetricsProvider>\n </React.StrictMode>,\n instance.el,\n );\n};\n\nwindow.Mirai.core();\n"],"mappings":";;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AAUmB;AArBnB;;AAKA;AACA;;AAiBAA,MAAM,CAACC,KAAK,GAAGD,MAAM,CAACC,KAAK,IAAI,CAAC,CAAC;AAEjCD,MAAM,CAACC,KAAK,CAACC,WAAW,iEAAuB;AAE/CF,MAAM,CAACC,KAAK,CAACE,OAAO,GAAGA,gBAAO;
|
|
1
|
+
{"version":3,"file":"index.js","names":["window","Mirai","environment","services","club","engine","static","user","version","core","isProduction","isDevelopment","console","log","name","urlParams","fetchUrlParams","location","search","substring","cookies","fetchCookies","COOKIE_CART","COOKIE_VALUES","session","fetchSession","env","loadEnvironment","undefined","instance","findInstance","components","findComponents","length","config","fetchConfig","theme","store","consolidateStore","ReactDOM","render","el"],"sources":["../src/index.js"],"sourcesContent":["/* eslint-disable no-console */\nimport { MetricsProvider, StoreProvider } from '@mirai/data-sources';\nimport React from 'react';\nimport ReactDOM from 'react-dom';\n\n// ! TODO: Load this file before index.css\n// import '../node_modules/@mirai/ui/build/theme/default.theme.css';\n\nimport { name, version } from '../package.json';\nimport { Core } from './Core';\nimport { COOKIE_CART, COOKIE_VALUES } from './Core.definition';\nimport {\n consolidateStore,\n fetchConfig,\n fetchCookies,\n fetchSession,\n fetchUrlParams,\n findComponents,\n findInstance,\n loadEnvironment,\n theme,\n} from './helpers';\n\nwindow.Mirai = window.Mirai || {};\n\nwindow.Mirai.environment = process.env.NODE_ENV;\n\nwindow.Mirai.services = {\n club: process.env.SERVICE_CLUB,\n engine: process.env.SERVICE_ENGINE,\n static: process.env.SERVICE_STATIC,\n user: process.env.SERVICE_USER,\n};\n\nwindow.Mirai.version = version;\n\nwindow.Mirai.core = async () => {\n const isProduction = process.env.NODE_ENV === 'production';\n const isDevelopment = process.env.NODE_ENV === 'development';\n\n console.log(`${isProduction ? '🟢' : isDevelopment ? '🟡' : '🔴'} ${name} v${version} [${process.env.NODE_ENV}]`);\n\n // 1. Fetch client-side dataSources\n const urlParams = fetchUrlParams(location.search.substring(1));\n const cookies = fetchCookies([COOKIE_CART, COOKIE_VALUES]);\n const session = fetchSession(urlParams);\n\n // 2. Analize environment\n const environment = urlParams.env && isProduction ? loadEnvironment(urlParams.env) : undefined;\n if (environment) return;\n\n // 3. Find instance\n const instance = findInstance();\n if (!instance) return;\n\n // 4. Find components\n const components = findComponents();\n if (!components.length) return;\n\n // 5. Analize id to fetch its config\n const config = await fetchConfig(instance);\n if (!config) return;\n\n // 6. Theming\n theme();\n\n // 7. Consolidate store\n const store = consolidateStore({ config, cookies, instance, session, urlParams });\n\n // 8. Render components\n ReactDOM.render(\n <React.StrictMode>\n <MetricsProvider token={process.env.METRICS}>\n <StoreProvider value={store}>\n <Core {...{ components }} />\n </StoreProvider>\n </MetricsProvider>\n </React.StrictMode>,\n instance.el,\n );\n};\n\nwindow.Mirai.core();\n"],"mappings":";;AACA;AACA;AACA;AAKA;AACA;AACA;AACA;AAUmB;AArBnB;;AAKA;AACA;;AAiBAA,MAAM,CAACC,KAAK,GAAGD,MAAM,CAACC,KAAK,IAAI,CAAC,CAAC;AAEjCD,MAAM,CAACC,KAAK,CAACC,WAAW,iEAAuB;AAE/CF,MAAM,CAACC,KAAK,CAACE,QAAQ,GAAG;EACtBC,IAAI,+EAA0B;EAC9BC,MAAM,oFAA4B;EAClCC,MAAM,oFAA4B;EAClCC,IAAI;AACN,CAAC;AAEDP,MAAM,CAACC,KAAK,CAACO,OAAO,GAAGA,gBAAO;AAE9BR,MAAM,CAACC,KAAK,CAACQ,IAAI,GAAG,YAAY;EAC9B,MAAMC,YAAY,GAAG,qEAAyB,YAAY;EAC1D,MAAMC,aAAa,GAAG,qEAAyB,aAAa;EAE5DC,OAAO,CAACC,GAAG,CAAE,GAAEH,YAAY,GAAG,IAAI,GAAGC,aAAa,GAAG,IAAI,GAAG,IAAK,IAAGG,aAAK,KAAIN,gBAAQ,KAAE,8DAAuB,GAAE,CAAC;;EAEjH;EACA,MAAMO,SAAS,GAAG,IAAAC,uBAAc,EAACC,QAAQ,CAACC,MAAM,CAACC,SAAS,CAAC,CAAC,CAAC,CAAC;EAC9D,MAAMC,OAAO,GAAG,IAAAC,qBAAY,EAAC,CAACC,kBAAW,EAAEC,oBAAa,CAAC,CAAC;EAC1D,MAAMC,OAAO,GAAG,IAAAC,qBAAY,EAACV,SAAS,CAAC;;EAEvC;EACA,MAAMb,WAAW,GAAGa,SAAS,CAACW,GAAG,IAAIhB,YAAY,GAAG,IAAAiB,wBAAe,EAACZ,SAAS,CAACW,GAAG,CAAC,GAAGE,SAAS;EAC9F,IAAI1B,WAAW,EAAE;;EAEjB;EACA,MAAM2B,QAAQ,GAAG,IAAAC,qBAAY,GAAE;EAC/B,IAAI,CAACD,QAAQ,EAAE;;EAEf;EACA,MAAME,UAAU,GAAG,IAAAC,uBAAc,GAAE;EACnC,IAAI,CAACD,UAAU,CAACE,MAAM,EAAE;;EAExB;EACA,MAAMC,MAAM,GAAG,MAAM,IAAAC,oBAAW,EAACN,QAAQ,CAAC;EAC1C,IAAI,CAACK,MAAM,EAAE;;EAEb;EACA,IAAAE,cAAK,GAAE;;EAEP;EACA,MAAMC,KAAK,GAAG,IAAAC,yBAAgB,EAAC;IAAEJ,MAAM;IAAEd,OAAO;IAAES,QAAQ;IAAEL,OAAO;IAAET;EAAU,CAAC,CAAC;;EAEjF;EACAwB,iBAAQ,CAACC,MAAM,eACb,6BAAC,cAAK,CAAC,UAAU,qBACf,6BAAC,4BAAe;IAAC,KAAK;EAAsB,gBAC1C,6BAAC,0BAAa;IAAC,KAAK,EAAEH;EAAM,gBAC1B,6BAAC,UAAI;IAAON;EAAU,EAAM,CACd,CACA,CACD,EACnBF,QAAQ,CAACY,EAAE,CACZ;AACH,CAAC;AAEDzC,MAAM,CAACC,KAAK,CAACQ,IAAI,EAAE"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mirai/core",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.12",
|
|
4
4
|
"source": "src/index.js",
|
|
5
5
|
"repository": "https://gitlab.com/miraicorp/dev/frontend/core",
|
|
6
6
|
"author": "JΛVI <hello@soyjavi.com>",
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"build:pro": "node scripts/bundle.js",
|
|
14
14
|
"build:dev": "node scripts/bundle.js development",
|
|
15
15
|
"lint": "eslint --cache --fix --format codeframe --ext .jsx,.js src",
|
|
16
|
-
"test": "node scripts/test.js --watchAll=false",
|
|
16
|
+
"test": "node scripts/test.js --watchAll=false --silent",
|
|
17
17
|
"test:coverage": "node scripts/test.js --coverage --coverageReporters=text --detectOpenHandles --forceExit --silent",
|
|
18
18
|
"test:watch": "node scripts/test.js",
|
|
19
19
|
"pipeline": "yarn lint && yarn test && yarn build",
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
23
|
"@mirai/data-sources": "^0.1",
|
|
24
|
-
"@mirai/finder": "^0.
|
|
24
|
+
"@mirai/finder": "^0.2",
|
|
25
25
|
"@mirai/locale": "^0.2",
|
|
26
26
|
"@mirai/services": "^0.2",
|
|
27
27
|
"@mirai/ui": "^1.0",
|
package/public/index.css
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
:root {
|
|
2
2
|
/* legacy */
|
|
3
3
|
/* --corporative-color: #f2a900; */
|
|
4
|
-
--border-radius: 2px;
|
|
4
|
+
/* --border-radius: 2px; */
|
|
5
5
|
/* theming */
|
|
6
6
|
--mirai-ui-accent: #f2a900;
|
|
7
7
|
}
|
|
@@ -19,6 +19,8 @@ footer {
|
|
|
19
19
|
}
|
|
20
20
|
|
|
21
21
|
header {
|
|
22
|
+
align-items: center;
|
|
23
|
+
display: flex;
|
|
22
24
|
background-color: var(--mirai-ui-accent);
|
|
23
25
|
position: fixed;
|
|
24
26
|
top: 0;
|
|
@@ -37,26 +39,43 @@ header h1 {
|
|
|
37
39
|
color: var(--mirai-ui-base);
|
|
38
40
|
}
|
|
39
41
|
|
|
42
|
+
header nav {
|
|
43
|
+
align-items: center;
|
|
44
|
+
display: flex;
|
|
45
|
+
}
|
|
46
|
+
|
|
40
47
|
header nav > * {
|
|
48
|
+
display: flex;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
header nav > *:not(:last-child) {
|
|
41
52
|
margin-left: 1rem;
|
|
42
53
|
}
|
|
43
54
|
|
|
44
55
|
section {
|
|
56
|
+
align-items: center;
|
|
57
|
+
align-content: center;
|
|
58
|
+
justify-content: center;
|
|
59
|
+
display: flex;
|
|
60
|
+
width: 100%;
|
|
61
|
+
border-bottom: solid 1px var(--mirai-ui-content-border);
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
section article {
|
|
45
65
|
padding: 1rem;
|
|
46
66
|
}
|
|
47
67
|
|
|
48
|
-
section.
|
|
68
|
+
section.finder {
|
|
49
69
|
align-items: center;
|
|
50
70
|
background-color: var(--mirai-ui-content-border);
|
|
51
71
|
display: flex;
|
|
52
72
|
justify-content: center;
|
|
53
|
-
margin-top: 5rem;
|
|
54
73
|
padding: 3rem 0;
|
|
74
|
+
margin-top: 5rem;
|
|
55
75
|
}
|
|
56
76
|
|
|
57
|
-
section
|
|
58
|
-
padding: 1rem;
|
|
59
|
-
width: 50%;
|
|
77
|
+
section.deals {
|
|
78
|
+
padding: 1rem 0;
|
|
60
79
|
}
|
|
61
80
|
|
|
62
81
|
footer {
|
|
@@ -64,19 +83,30 @@ footer {
|
|
|
64
83
|
display: flex;
|
|
65
84
|
justify-content: center;
|
|
66
85
|
}
|
|
86
|
+
|
|
67
87
|
footer > * {
|
|
68
88
|
padding: 1rem;
|
|
69
89
|
}
|
|
70
90
|
|
|
71
|
-
.row {
|
|
72
|
-
align-items: center;
|
|
73
|
-
display: flex;
|
|
74
|
-
flex-direction: row;
|
|
75
|
-
}
|
|
76
|
-
|
|
77
91
|
.wrapper {
|
|
78
92
|
align-items: flex-start;
|
|
79
93
|
max-width: calc(var(--mirai-ui-breakpoint-content) * 0.75);
|
|
80
94
|
margin: 0 auto;
|
|
81
95
|
width: 100%;
|
|
82
96
|
}
|
|
97
|
+
|
|
98
|
+
@media only screen and (max-width: 430px) {
|
|
99
|
+
section {
|
|
100
|
+
flex-direction: column;
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
section article {
|
|
104
|
+
width: calc(100vw - 2rem);
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
@media only screen and (min-width: 431px) {
|
|
109
|
+
section article {
|
|
110
|
+
width: 50%;
|
|
111
|
+
}
|
|
112
|
+
}
|
package/public/index.html
CHANGED
|
@@ -4,7 +4,8 @@
|
|
|
4
4
|
<meta charset="utf-8" />
|
|
5
5
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
6
6
|
<title>@mirai/core</title>
|
|
7
|
-
<!-- <link rel="stylesheet" href="https://static.mirai.com/core/
|
|
7
|
+
<!-- <link rel="stylesheet" href="https://static.mirai.com/core/theme.css" rel="preload" defer /> -->
|
|
8
|
+
<!-- <link rel="stylesheet" href="https://static-pre.mirai.com/core/theme.css" rel="preload" defer /> -->
|
|
8
9
|
<!-- <link rel="stylesheet" href="../dist/theme.css" rel="preload" defer /> -->
|
|
9
10
|
<link rel="stylesheet" href="../src/theme.css" rel="preload" defer />
|
|
10
11
|
<link rel="stylesheet" href="index.css" />
|
|
@@ -14,12 +15,12 @@
|
|
|
14
15
|
|
|
15
16
|
<!-- <div data-mirai-id="500255" data-type="chain" data-locale="es-ES" hidden></div> -->
|
|
16
17
|
<!-- <div data-mirai-id="501404" data-locale="en-GB" data-currency="GBP" hidden></div> -->
|
|
17
|
-
<div data-mirai-id="501404" data-type="chain" hidden></div>
|
|
18
|
+
<div data-mirai-id="501404" data-type="chain" data-locale="en-GB" hidden></div>
|
|
18
19
|
|
|
19
|
-
<header
|
|
20
|
+
<header>
|
|
20
21
|
<h1>@mirai/core</h1>
|
|
21
|
-
<nav
|
|
22
|
-
<div data-mirai-component="session">
|
|
22
|
+
<nav>
|
|
23
|
+
<div data-mirai-component="session" data-mobile="false">
|
|
23
24
|
<!-- <button class="login" data-ghost>Login</button> -->
|
|
24
25
|
|
|
25
26
|
<!-- <div class="session" data-ghost>
|
|
@@ -28,15 +29,20 @@
|
|
|
28
29
|
<span>{{lastName}}</span>
|
|
29
30
|
</div> -->
|
|
30
31
|
</div>
|
|
31
|
-
<div data-mirai-component="
|
|
32
|
-
<div data-mirai-component="
|
|
32
|
+
<div data-mirai-component="bookingQuery"></div>
|
|
33
|
+
<div data-mirai-component="environment"></div>
|
|
34
|
+
<!-- <div data-mirai-component="state"></div> -->
|
|
33
35
|
</nav>
|
|
34
36
|
</header>
|
|
35
37
|
|
|
36
|
-
<section class="
|
|
38
|
+
<section class="finder">
|
|
37
39
|
<div data-mirai-component="finder"></div>
|
|
38
40
|
</section>
|
|
39
41
|
|
|
42
|
+
<section class="deals">
|
|
43
|
+
<div data-mirai-component="deals"></div>
|
|
44
|
+
</section>
|
|
45
|
+
|
|
40
46
|
<section class="row wrapper">
|
|
41
47
|
<article>
|
|
42
48
|
<h2>Lorem ipsum dolor sit amet consectetur adipisicing elit.</h2>
|
|
@@ -75,7 +81,6 @@
|
|
|
75
81
|
<!-- <div data-mirai-component="ghost"></div> -->
|
|
76
82
|
|
|
77
83
|
<!-- This ones are not in our repository> -->
|
|
78
|
-
<div data-mirai-component="login" data-id="10030559"></div>
|
|
79
84
|
<div data-mirai-component="fi_nder" data-id="10030559"></div>
|
|
80
85
|
</section>
|
|
81
86
|
|
|
@@ -83,6 +88,7 @@
|
|
|
83
88
|
<small>Copyright, 2022</small>
|
|
84
89
|
</footer>
|
|
85
90
|
|
|
91
|
+
<!-- <script type="module" defer src="https://static.mirai.com/core/index.js"></script> -->
|
|
86
92
|
<!-- <script type="module" defer src="https://static-pre.mirai.com/core/index.js"></script> -->
|
|
87
93
|
<!-- <script type="module" defer src="../dist/index.js"></script> -->
|
|
88
94
|
<script type="module" defer src="../src/index.js"></script>
|