@micromag/screen-urbania-horoscope 0.3.76 → 0.3.79

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.
Files changed (4) hide show
  1. package/assets/css/styles.css +1 -1
  2. package/es/index.js +61 -113
  3. package/lib/index.js +60 -112
  4. package/package.json +14 -14
package/assets/css/styles.css CHANGED
@@ -1,3 +1,3 @@
1
1
  .micromag-screen-urbania-horoscope-sign-modal-container{width:100%;height:100%;overflow:hidden}.micromag-screen-urbania-horoscope-sign-modal-disabled.micromag-screen-urbania-horoscope-sign-modal-container{overflow:hidden;pointer-events:none}.micromag-screen-urbania-horoscope-sign-modal-hidden.micromag-screen-urbania-horoscope-sign-modal-container{display:none;visibility:hidden}.micromag-screen-urbania-horoscope-sign-modal-placeholder.micromag-screen-urbania-horoscope-sign-modal-container .micromag-screen-urbania-horoscope-sign-modal-content{position:relative;padding:6px}.micromag-screen-urbania-horoscope-sign-modal-container{position:relative;z-index:4}.micromag-screen-urbania-horoscope-sign-modal-container .micromag-screen-urbania-horoscope-sign-modal-backButton{position:absolute;top:7px;left:5px;padding-left:10%;border-radius:25px;background-color:#fff;-webkit-box-shadow:0 0 0 2px hsla(0,0%,100%,.85),0 0 4px #010f66;box-shadow:0 0 0 2px hsla(0,0%,100%,.85),0 0 4px #010f66;color:#010f66;font-family:Agrandir Tight,sans-serif;font-weight:700}.micromag-screen-urbania-horoscope-sign-modal-container .micromag-screen-urbania-horoscope-sign-modal-arrow{padding-right:5px;font-size:20px;vertical-align:middle}.micromag-screen-urbania-horoscope-sign-modal-container .micromag-screen-urbania-horoscope-sign-modal-modalContainer{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-content:center;-ms-flex-line-pack:center;align-content:center;margin:60px 18px 30px;padding:10px;border-radius:22px;background-color:#0ff;-webkit-box-shadow:0 0 4px #010f66;box-shadow:0 0 4px #010f66;color:#1d3af2}.micromag-screen-urbania-horoscope-sign-modal-container .micromag-screen-urbania-horoscope-sign-modal-signName{padding:7px auto 5px;font-family:Agrandir Tight,sans-serif;font-weight:900;text-transform:uppercase}.micromag-screen-urbania-horoscope-sign-modal-container .micromag-screen-urbania-horoscope-sign-modal-wordContainer{margin-bottom:5px;border:1px solid #1d3af2;border-radius:9px;text-transform:uppercase}.micromag-screen-urbania-horoscope-sign-modal-container .micromag-screen-urbania-horoscope-sign-modal-wordTitle{padding:3px;font-family:Agrandir Tight,sans-serif;font-size:12px;font-weight:500}.micromag-screen-urbania-horoscope-sign-modal-container .micromag-screen-urbania-horoscope-sign-modal-word{font-family:Agrandir Narrow,sans-serif;font-size:16px;font-weight:700}.micromag-screen-urbania-horoscope-sign-modal-container .micromag-screen-urbania-horoscope-sign-modal-description{padding-bottom:5px;font-family:Roboto,sans-serif;font-size:12px;line-height:1.2}.micromag-screen-urbania-horoscope-sign-modal-container .micromag-screen-urbania-horoscope-sign-modal-image{width:85%;height:auto;margin:0 auto}
2
- .micromag-screen-urbania-horoscope-signs-grid-container{width:100%;height:100%;overflow:hidden}.micromag-screen-urbania-horoscope-signs-grid-disabled.micromag-screen-urbania-horoscope-signs-grid-container{overflow:hidden;pointer-events:none}.micromag-screen-urbania-horoscope-signs-grid-hidden.micromag-screen-urbania-horoscope-signs-grid-container{display:none;visibility:hidden}.micromag-screen-urbania-horoscope-signs-grid-placeholder.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-content{position:relative;padding:6px}.micromag-screen-urbania-horoscope-signs-grid-container{position:relative;z-index:6}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-closeButton{position:absolute;z-index:5;top:7px;right:7px;width:30px;height:30px;padding:0;border-radius:50%;background-color:#fff;-webkit-box-shadow:0 0 0 2px hsla(0,0%,100%,.85),0 0 4px #010f66;box-shadow:0 0 0 2px hsla(0,0%,100%,.85),0 0 4px #010f66}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-closeX{-webkit-transform:scale(.8);-ms-transform:scale(.8);transform:scale(.8);color:#000}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-gridContainer{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;padding:30px}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-gridContainer.micromag-screen-urbania-horoscope-signs-grid-isPlaceholder{padding:0}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-signPlaceholder{width:30px;height:30px;margin:1px;background-color:#b3b3b3}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-gridElement{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;width:80px;height:85px;margin-bottom:8px;padding:5px;-webkit-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out;border:0;border-radius:20px;background-color:#1d3af2}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-gridElement:hover{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05)}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-image{max-height:44px;padding-bottom:4px}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-signName{width:100%;margin-bottom:4px;padding:2px 5px 1px;border-radius:24px;background-color:#fffc00;-webkit-box-shadow:0 0 0 2px rgba(255,250,0,.6);box-shadow:0 0 0 2px rgba(255,250,0,.6);color:#222;font-family:Agrandir Tight,sans-serif;font-size:12px;font-weight:700}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-date{color:#fffa00;font-family:Agrandir,sans-serif;font-size:8px}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-backButton{position:absolute;z-index:8;top:7px;left:5px;padding-left:10%;border-radius:25px;background-color:#fff;-webkit-box-shadow:0 0 0 2px hsla(0,0%,100%,.85),0 0 4px #010f66;box-shadow:0 0 0 2px hsla(0,0%,100%,.85),0 0 4px #010f66;color:#010f66;font-family:Agrandir Tight,sans-serif;font-weight:700}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-signModal{position:absolute;top:0;left:0}.micromag-screen-urbania-horoscope-signs-grid-enter{z-index:1;-webkit-transition:opacity .5s ease-out;-o-transition:opacity .5s ease-out;transition:opacity .5s ease-out;opacity:0}.micromag-screen-urbania-horoscope-signs-grid-enterActive,.micromag-screen-urbania-horoscope-signs-grid-exit{opacity:1}.micromag-screen-urbania-horoscope-signs-grid-exit{z-index:2;-webkit-transition:opacity .8s ease-out;-o-transition:opacity .8s ease-out;transition:opacity .8s ease-out}.micromag-screen-urbania-horoscope-signs-grid-exitActive{opacity:0}.micromag-screen-urbania-horoscope-signs-grid-modalEnter{z-index:1;-webkit-transform:scale(20%);-ms-transform:scale(20%);transform:scale(20%);-webkit-transition:-webkit-transform .5s ease-out;transition:-webkit-transform .5s ease-out;-o-transition:transform .5s ease-out;transition:transform .5s ease-out;transition:transform .5s ease-out, -webkit-transform .5s ease-out}.micromag-screen-urbania-horoscope-signs-grid-modalEnterActive{-webkit-transform:scale(100%);-ms-transform:scale(100%);transform:scale(100%)}.micromag-screen-urbania-horoscope-signs-grid-modalExit{z-index:2;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);-webkit-transition:-webkit-transform .5s ease-out;transition:-webkit-transform .5s ease-out;-o-transition:transform .5s ease-out;transition:transform .5s ease-out;transition:transform .5s ease-out, -webkit-transform .5s ease-out}.micromag-screen-urbania-horoscope-signs-grid-modalExitActive{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%)}
2
+ .micromag-screen-urbania-horoscope-signs-grid-container{width:100%;height:100%;overflow:hidden}.micromag-screen-urbania-horoscope-signs-grid-disabled.micromag-screen-urbania-horoscope-signs-grid-container{overflow:hidden;pointer-events:none}.micromag-screen-urbania-horoscope-signs-grid-hidden.micromag-screen-urbania-horoscope-signs-grid-container{display:none;visibility:hidden}.micromag-screen-urbania-horoscope-signs-grid-placeholder.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-content{position:relative;padding:6px}.micromag-screen-urbania-horoscope-signs-grid-container{position:relative;z-index:2}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-closeButton{position:absolute;z-index:5;top:7px;right:7px;width:30px;height:30px;padding:0;border-radius:50%;background-color:#fff;-webkit-box-shadow:0 0 0 2px hsla(0,0%,100%,.85),0 0 4px #010f66;box-shadow:0 0 0 2px hsla(0,0%,100%,.85),0 0 4px #010f66}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-closeX{-webkit-transform:scale(.8);-ms-transform:scale(.8);transform:scale(.8);color:#000}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-gridContainer{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-justify-content:space-between;-ms-flex-pack:justify;justify-content:space-between;padding:30px}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-gridContainer.micromag-screen-urbania-horoscope-signs-grid-isPlaceholder{padding:0}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-signPlaceholder{width:30px;height:30px;margin:1px;background-color:#b3b3b3}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-gridElement{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;width:80px;height:85px;margin-bottom:8px;padding:5px;-webkit-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out;border:0;border-radius:20px;background-color:#1d3af2}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-gridElement:hover{-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05)}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-image{max-height:44px;padding-bottom:4px}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-signName{width:100%;margin-bottom:4px;padding:2px 5px 1px;border-radius:24px;background-color:#fffc00;-webkit-box-shadow:0 0 0 2px rgba(255,250,0,.6);box-shadow:0 0 0 2px rgba(255,250,0,.6);color:#222;font-family:Agrandir Tight,sans-serif;font-size:12px;font-weight:700}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-date{color:#fffa00;font-family:Agrandir,sans-serif;font-size:8px}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-backButton{position:absolute;z-index:5;top:7px;left:0;padding-left:20px;border-top-right-radius:25px;border-bottom-right-radius:25px;background-color:#fff;-webkit-box-shadow:0 0 0 2px hsla(0,0%,100%,.85),0 0 4px #010f66;box-shadow:0 0 0 2px hsla(0,0%,100%,.85),0 0 4px #010f66;color:#010f66;font-family:Agrandir Tight,sans-serif;font-weight:700}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-arrow{padding-right:5px;font-size:20px;vertical-align:middle}.micromag-screen-urbania-horoscope-signs-grid-container .micromag-screen-urbania-horoscope-signs-grid-modalContainer{position:absolute;top:0;right:0;left:0}.micromag-screen-urbania-horoscope-signs-grid-gridContainer.micromag-screen-urbania-horoscope-signs-grid-enter{z-index:1;-webkit-transition:opacity .5s ease-out;-o-transition:opacity .5s ease-out;transition:opacity .5s ease-out;opacity:0}.micromag-screen-urbania-horoscope-signs-grid-gridContainer.micromag-screen-urbania-horoscope-signs-grid-enterActive{opacity:1}.micromag-screen-urbania-horoscope-signs-grid-gridContainer.micromag-screen-urbania-horoscope-signs-grid-exit{z-index:2;-webkit-transition:opacity .8s ease-out;-o-transition:opacity .8s ease-out;transition:opacity .8s ease-out;opacity:1}.micromag-screen-urbania-horoscope-signs-grid-gridContainer.micromag-screen-urbania-horoscope-signs-grid-exitActive{opacity:0}.micromag-screen-urbania-horoscope-signs-grid-modalContainer.micromag-screen-urbania-horoscope-signs-grid-enter .micromag-screen-urbania-horoscope-signs-grid-signModal{z-index:1;-webkit-transform:scale(20%);-ms-transform:scale(20%);transform:scale(20%);-webkit-transition:-webkit-transform .5s ease-out;transition:-webkit-transform .5s ease-out;-o-transition:transform .5s ease-out;transition:transform .5s ease-out;transition:transform .5s ease-out, -webkit-transform .5s ease-out}.micromag-screen-urbania-horoscope-signs-grid-modalContainer.micromag-screen-urbania-horoscope-signs-grid-enter .micromag-screen-urbania-horoscope-signs-grid-backButton{z-index:1;-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px);-webkit-transition:all .5s ease-out;-o-transition:all .5s ease-out;transition:all .5s ease-out;opacity:0}.micromag-screen-urbania-horoscope-signs-grid-modalContainer.micromag-screen-urbania-horoscope-signs-grid-enterActive .micromag-screen-urbania-horoscope-signs-grid-signModal{-webkit-transform:scale(100%);-ms-transform:scale(100%);transform:scale(100%)}.micromag-screen-urbania-horoscope-signs-grid-modalContainer.micromag-screen-urbania-horoscope-signs-grid-enterActive .micromag-screen-urbania-horoscope-signs-grid-backButton{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);opacity:1}.micromag-screen-urbania-horoscope-signs-grid-modalContainer.micromag-screen-urbania-horoscope-signs-grid-exit{z-index:2;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);-webkit-transition:-webkit-transform .5s ease-out;transition:-webkit-transform .5s ease-out;-o-transition:transform .5s ease-out;transition:transform .5s ease-out;transition:transform .5s ease-out, -webkit-transform .5s ease-out}.micromag-screen-urbania-horoscope-signs-grid-modalContainer.micromag-screen-urbania-horoscope-signs-grid-exit .micromag-screen-urbania-horoscope-signs-grid-backButton,.micromag-screen-urbania-horoscope-signs-grid-modalContainer.micromag-screen-urbania-horoscope-signs-grid-exit .micromag-screen-urbania-horoscope-signs-grid-signModal{z-index:2;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);-webkit-transition:all .5s ease-out;-o-transition:all .5s ease-out;transition:all .5s ease-out;opacity:1}.micromag-screen-urbania-horoscope-signs-grid-modalContainer.micromag-screen-urbania-horoscope-signs-grid-exitActive .micromag-screen-urbania-horoscope-signs-grid-signModal{-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%)}.micromag-screen-urbania-horoscope-signs-grid-modalContainer.micromag-screen-urbania-horoscope-signs-grid-exitActive .micromag-screen-urbania-horoscope-signs-grid-backButton{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px);opacity:0}
3
3
  .micromag-screen-urbania-horoscope-container{position:relative;width:100%;height:100%;overflow:hidden}.micromag-screen-urbania-horoscope-disabled.micromag-screen-urbania-horoscope-container{overflow:hidden;pointer-events:none}.micromag-screen-urbania-horoscope-hidden.micromag-screen-urbania-horoscope-container{display:none;visibility:hidden}.micromag-screen-urbania-horoscope-placeholder.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-content{position:relative;padding:6px}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-emptyText,.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-emptyTitle{margin:5px auto;border:2px dashed #343434;color:#343434}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-layout{display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around;text-align:center}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-emptyText,.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-emptyTitle{width:100%;margin:10px auto}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-emptyTitle{height:100px}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-emptyText{height:50px}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-headerContainer{width:300px}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-title{color:#0ff;font-family:Agrandir Tight,sans-serif;font-size:48px;font-weight:700;letter-spacing:-1px;text-shadow:-3px -3px 0 #000f66;text-transform:uppercase;-webkit-text-stroke:1px #000f66}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-titleImage{width:100%;height:auto}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-titlePlaceholder{padding:10px;background-color:#343434}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-description{margin-bottom:8px;padding:10px;color:#0ff;font-family:Agrandir Tight,sans-serif;font-size:18px;font-weight:700}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-descriptionPlaceholder{padding:10px 10px 30px}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-author{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;margin:0 auto}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-button{padding:10px 15px 7px;-webkit-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;transition:all .2s ease-in-out;border-radius:24px;background-color:#fffc00;-webkit-box-shadow:0 0 0 6px rgba(255,250,0,.6);box-shadow:0 0 0 6px rgba(255,250,0,.6)}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-button .micromag-screen-urbania-horoscope-buttonLabel{color:#000;font-family:Agrandir Tight,sans-serif;font-size:22px;font-weight:700;letter-spacing:.05rem}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-button:hover{-webkit-transform:scale(1.02);-ms-transform:scale(1.02);transform:scale(1.02)}.micromag-screen-urbania-horoscope-container .micromag-screen-urbania-horoscope-signsGrid{position:absolute;bottom:0;left:0}.micromag-screen-urbania-horoscope-container.micromag-screen-urbania-horoscope-isPlaceholder .micromag-screen-urbania-horoscope-layout{padding:10px}.micromag-screen-urbania-horoscope-enter{z-index:1;-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);-webkit-transition:-webkit-transform .5s ease-out;transition:-webkit-transform .5s ease-out;-o-transition:transform .5s ease-out;transition:transform .5s ease-out;transition:transform .5s ease-out, -webkit-transform .5s ease-out}.micromag-screen-urbania-horoscope-enterActive,.micromag-screen-urbania-horoscope-exit{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}.micromag-screen-urbania-horoscope-exit{z-index:2;-webkit-transition:-webkit-transform .5s ease-out;transition:-webkit-transform .5s ease-out;-o-transition:transform .5s ease-out;transition:transform .5s ease-out;transition:transform .5s ease-out, -webkit-transform .5s ease-out}.micromag-screen-urbania-horoscope-exitActive{-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%)}
package/es/index.js CHANGED
@@ -4,7 +4,7 @@ import _objectSpread from '@babel/runtime/helpers/objectSpread2';
4
4
  import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
5
5
  import classNames from 'classnames';
6
6
  import PropTypes from 'prop-types';
7
- import React, { useState, useEffect, useCallback } from 'react';
7
+ import React, { useState, useCallback } from 'react';
8
8
  import { TransitionGroup, CSSTransition } from 'react-transition-group';
9
9
  import { PropTypes as PropTypes$1 } from '@micromag/core';
10
10
  import { ScreenElement, PlaceholderTitle, TransitionsStagger } from '@micromag/core/components';
@@ -37,8 +37,6 @@ var styles$2 = {"container":"micromag-screen-urbania-horoscope-sign-modal-contai
37
37
  var propTypes$3 = {
38
38
  width: PropTypes.number,
39
39
  height: PropTypes.number,
40
- background: PropTypes$1.backgroundElement,
41
- backButton: PropTypes.func,
42
40
  sign: PropTypes.shape({
43
41
  id: PropTypes.string,
44
42
  label: PropTypes.string,
@@ -54,8 +52,6 @@ var propTypes$3 = {
54
52
  var defaultProps$3 = {
55
53
  width: null,
56
54
  height: null,
57
- background: null,
58
- backButton: null,
59
55
  sign: null,
60
56
  subtitle: null,
61
57
  current: true,
@@ -64,13 +60,12 @@ var defaultProps$3 = {
64
60
 
65
61
  var SignModal = function SignModal(_ref) {
66
62
  var width = _ref.width,
67
- height = _ref.height;
68
- _ref.background;
69
- var backButton = _ref.backButton,
63
+ height = _ref.height,
70
64
  sign = _ref.sign,
71
65
  subtitle = _ref.subtitle,
72
66
  current = _ref.current,
73
67
  className = _ref.className;
68
+ // eslint-disable-next-line no-unused-vars
74
69
  var _sign$label = sign.label,
75
70
  label = _sign$label === void 0 ? null : _sign$label,
76
71
  _sign$image = sign.image,
@@ -85,9 +80,8 @@ var SignModal = function SignModal(_ref) {
85
80
  _ref2$body = _ref2.body,
86
81
  wordBody = _ref2$body === void 0 ? null : _ref2$body;
87
82
 
88
- var _useScreenRenderConte = useScreenRenderContext();
89
- _useScreenRenderConte.isView;
90
- var isPreview = _useScreenRenderConte.isPreview,
83
+ var _useScreenRenderConte = useScreenRenderContext(),
84
+ isPreview = _useScreenRenderConte.isPreview,
91
85
  isPlaceholder = _useScreenRenderConte.isPlaceholder,
92
86
  isEdit = _useScreenRenderConte.isEdit,
93
87
  isStatic = _useScreenRenderConte.isStatic,
@@ -97,18 +91,7 @@ var SignModal = function SignModal(_ref) {
97
91
  var hasSubtitle = isTextFilled(subtitle);
98
92
  var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
99
93
  var scrollingDisabled = !isEdit && transitionDisabled || !current;
100
- var items = [/*#__PURE__*/React.createElement(Button, {
101
- onClick: backButton,
102
- className: styles$2.backButton
103
- }, /*#__PURE__*/React.createElement("span", {
104
- className: styles$2.arrow
105
- }, "\u2190"), ' ', /*#__PURE__*/React.createElement(FormattedMessage, {
106
- id: "keK5s0",
107
- defaultMessage: [{
108
- "type": 0,
109
- "value": "Back to the Signs"
110
- }]
111
- })), /*#__PURE__*/React.createElement(ScreenElement, null, /*#__PURE__*/React.createElement("h2", {
94
+ var items = [/*#__PURE__*/React.createElement(ScreenElement, null, /*#__PURE__*/React.createElement("h2", {
112
95
  className: styles$2.signName
113
96
  }, /*#__PURE__*/React.createElement(FormattedMessage, label))), hasWord ? /*#__PURE__*/React.createElement("div", {
114
97
  className: styles$2.wordContainer
@@ -193,7 +176,7 @@ var Close = function Close(_ref) {
193
176
  Close.propTypes = propTypes$2;
194
177
  Close.defaultProps = defaultProps$2;
195
178
 
196
- var styles$1 = {"container":"micromag-screen-urbania-horoscope-signs-grid-container","disabled":"micromag-screen-urbania-horoscope-signs-grid-disabled","hidden":"micromag-screen-urbania-horoscope-signs-grid-hidden","placeholder":"micromag-screen-urbania-horoscope-signs-grid-placeholder","content":"micromag-screen-urbania-horoscope-signs-grid-content","closeButton":"micromag-screen-urbania-horoscope-signs-grid-closeButton","closeX":"micromag-screen-urbania-horoscope-signs-grid-closeX","gridContainer":"micromag-screen-urbania-horoscope-signs-grid-gridContainer","isPlaceholder":"micromag-screen-urbania-horoscope-signs-grid-isPlaceholder","signPlaceholder":"micromag-screen-urbania-horoscope-signs-grid-signPlaceholder","gridElement":"micromag-screen-urbania-horoscope-signs-grid-gridElement","image":"micromag-screen-urbania-horoscope-signs-grid-image","signName":"micromag-screen-urbania-horoscope-signs-grid-signName","date":"micromag-screen-urbania-horoscope-signs-grid-date","backButton":"micromag-screen-urbania-horoscope-signs-grid-backButton","signModal":"micromag-screen-urbania-horoscope-signs-grid-signModal","enter":"micromag-screen-urbania-horoscope-signs-grid-enter","enterActive":"micromag-screen-urbania-horoscope-signs-grid-enterActive","exit":"micromag-screen-urbania-horoscope-signs-grid-exit","exitActive":"micromag-screen-urbania-horoscope-signs-grid-exitActive","modalEnter":"micromag-screen-urbania-horoscope-signs-grid-modalEnter","modalEnterActive":"micromag-screen-urbania-horoscope-signs-grid-modalEnterActive","modalExit":"micromag-screen-urbania-horoscope-signs-grid-modalExit","modalExitActive":"micromag-screen-urbania-horoscope-signs-grid-modalExitActive"};
179
+ var styles$1 = {"container":"micromag-screen-urbania-horoscope-signs-grid-container","disabled":"micromag-screen-urbania-horoscope-signs-grid-disabled","hidden":"micromag-screen-urbania-horoscope-signs-grid-hidden","placeholder":"micromag-screen-urbania-horoscope-signs-grid-placeholder","content":"micromag-screen-urbania-horoscope-signs-grid-content","closeButton":"micromag-screen-urbania-horoscope-signs-grid-closeButton","closeX":"micromag-screen-urbania-horoscope-signs-grid-closeX","gridContainer":"micromag-screen-urbania-horoscope-signs-grid-gridContainer","isPlaceholder":"micromag-screen-urbania-horoscope-signs-grid-isPlaceholder","signPlaceholder":"micromag-screen-urbania-horoscope-signs-grid-signPlaceholder","gridElement":"micromag-screen-urbania-horoscope-signs-grid-gridElement","image":"micromag-screen-urbania-horoscope-signs-grid-image","signName":"micromag-screen-urbania-horoscope-signs-grid-signName","date":"micromag-screen-urbania-horoscope-signs-grid-date","backButton":"micromag-screen-urbania-horoscope-signs-grid-backButton","arrow":"micromag-screen-urbania-horoscope-signs-grid-arrow","modalContainer":"micromag-screen-urbania-horoscope-signs-grid-modalContainer","enter":"micromag-screen-urbania-horoscope-signs-grid-enter","enterActive":"micromag-screen-urbania-horoscope-signs-grid-enterActive","exit":"micromag-screen-urbania-horoscope-signs-grid-exit","exitActive":"micromag-screen-urbania-horoscope-signs-grid-exitActive","signModal":"micromag-screen-urbania-horoscope-signs-grid-signModal"};
197
180
 
198
181
  var defaultBackground = {
199
182
  image: {
@@ -247,28 +230,17 @@ var SignsGrid = function SignsGrid(_ref) {
247
230
 
248
231
  var _useState = useState(null),
249
232
  _useState2 = _slicedToArray(_useState, 2),
250
- activeSign = _useState2[0],
251
- setActiveSign = _useState2[1];
252
-
253
- useEffect(function () {
254
- var _ref2 = activeSign || {},
255
- _ref2$id = _ref2.id,
256
- currentId = _ref2$id === void 0 ? null : _ref2$id;
257
-
258
- var currentSign = signs.find(function (_ref3) {
259
- var _ref3$id = _ref3.id,
260
- id = _ref3$id === void 0 ? null : _ref3$id;
261
- return currentId !== null && currentId === id;
262
- }) || null;
263
-
264
- if (currentSign !== null) {
265
- setActiveSign(currentSign);
266
- }
267
- }, [activeSign, setActiveSign, signs]);
268
-
269
- var closeModal = function closeModal() {
270
- return setActiveSign(null);
271
- };
233
+ activeSignId = _useState2[0],
234
+ setActiveSignId = _useState2[1];
235
+
236
+ var activeSign = signs.find(function (_ref2) {
237
+ var _ref2$id = _ref2.id,
238
+ id = _ref2$id === void 0 ? null : _ref2$id;
239
+ return activeSignId === id;
240
+ }) || null;
241
+ var closeModal = useCallback(function () {
242
+ return setActiveSignId(null);
243
+ }, [activeSignId, setActiveSignId]);
272
244
 
273
245
  var _useScreenRenderConte = useScreenRenderContext(),
274
246
  isView = _useScreenRenderConte.isView,
@@ -295,24 +267,22 @@ var SignsGrid = function SignsGrid(_ref) {
295
267
  className: styles$1.closeButton
296
268
  }, /*#__PURE__*/React.createElement(Close, {
297
269
  className: styles$1.closeX
298
- })) : null, /*#__PURE__*/React.createElement(TransitionGroup, null, !activeSign ? /*#__PURE__*/React.createElement(CSSTransition, {
270
+ })) : null, /*#__PURE__*/React.createElement(TransitionGroup, null, !activeSignId ? /*#__PURE__*/React.createElement(CSSTransition, {
299
271
  key: "grid",
300
272
  classNames: styles$1,
301
273
  timeout: 1000
302
274
  }, /*#__PURE__*/React.createElement("div", {
303
275
  className: classNames([styles$1.gridContainer, _defineProperty({}, styles$1.isPlaceholder, isPlaceholder)])
304
276
  }, signs.map(function (sign) {
305
- var _ref6 = sign || {},
306
- _ref6$id = _ref6.id,
307
- id = _ref6$id === void 0 ? null : _ref6$id,
308
- _ref6$image = _ref6.image,
309
- image = _ref6$image === void 0 ? null : _ref6$image,
310
- _ref6$label = _ref6.label,
311
- label = _ref6$label === void 0 ? null : _ref6$label,
312
- _ref6$date = _ref6.date,
313
- date = _ref6$date === void 0 ? null : _ref6$date;
314
- _ref6.word;
315
- _ref6.description;
277
+ var _ref5 = sign || {},
278
+ _ref5$id = _ref5.id,
279
+ id = _ref5$id === void 0 ? null : _ref5$id,
280
+ _ref5$image = _ref5.image,
281
+ image = _ref5$image === void 0 ? null : _ref5$image,
282
+ _ref5$label = _ref5.label,
283
+ label = _ref5$label === void 0 ? null : _ref5$label,
284
+ _ref5$date = _ref5.date,
285
+ date = _ref5$date === void 0 ? null : _ref5$date;
316
286
 
317
287
  return /*#__PURE__*/React.createElement(ScreenElement, {
318
288
  key: id,
@@ -332,7 +302,7 @@ var SignsGrid = function SignsGrid(_ref) {
332
302
  className: styles$1.gridElement,
333
303
  type: "button",
334
304
  onClick: function onClick() {
335
- return setActiveSign(sign);
305
+ return setActiveSignId(id);
336
306
  }
337
307
  }, image !== null ? /*#__PURE__*/React.createElement("img", {
338
308
  className: styles$1.image,
@@ -345,48 +315,30 @@ var SignsGrid = function SignsGrid(_ref) {
345
315
  }, label !== null ? /*#__PURE__*/React.createElement(FormattedMessage, label) : null), /*#__PURE__*/React.createElement("p", {
346
316
  className: styles$1.date
347
317
  }, date !== null ? /*#__PURE__*/React.createElement(FormattedMessage, date) : null))));
348
- }))) :
349
- /*#__PURE__*/
350
- // <>
351
- // <CSSTransition
352
- // key="backButton"
353
- // // classNames={{
354
- // // enter: styles.buttonEnter,
355
- // // enterActive: styles.buttonEnterActive,
356
- // // exit: styles.buttonExit,
357
- // // exitActive: styles.buttonExitActive,
358
- // // }}
359
- // // classNames={{
360
- // // enter: styles.modalEnter,
361
- // // enterActive: styles.modalEnterActive,
362
- // // exit: styles.modalExit,
363
- // // exitActive: styles.modalExitActive,
364
- // // }}
365
- // classNames={styles}
366
- // timeout={1000}
367
- // >
368
- // <Button onClick={closeModal} className={styles.backButton}>
369
- // <span className={styles.arrow}>←</span> Back to the signs
370
- // </Button>
371
- // </CSSTransition>
372
- React.createElement(CSSTransition, {
318
+ }))) : /*#__PURE__*/React.createElement(CSSTransition, {
373
319
  key: "modal",
374
- classNames: {
375
- enter: styles$1.modalEnter,
376
- enterActive: styles$1.modalEnterActive,
377
- exit: styles$1.modalExit,
378
- exitActive: styles$1.modalExitActive
379
- },
320
+ classNames: styles$1,
380
321
  timeout: 500
381
- }, /*#__PURE__*/React.createElement(SignModal, {
322
+ }, /*#__PURE__*/React.createElement("div", {
323
+ className: styles$1.modalContainer
324
+ }, /*#__PURE__*/React.createElement(Button, {
325
+ onClick: closeModal,
326
+ className: styles$1.backButton
327
+ }, /*#__PURE__*/React.createElement("span", {
328
+ className: styles$1.arrow
329
+ }, "\u2190"), /*#__PURE__*/React.createElement(FormattedMessage, {
330
+ id: "keK5s0",
331
+ defaultMessage: [{
332
+ "type": 0,
333
+ "value": "Back to the Signs"
334
+ }]
335
+ })), /*#__PURE__*/React.createElement(SignModal, {
382
336
  width: width,
383
337
  height: height,
384
338
  className: styles$1.signModal,
385
- backButton: closeModal,
386
339
  sign: activeSign,
387
340
  subtitle: signSubtitle
388
- })) // </>
389
- ))));
341
+ })))))));
390
342
  };
391
343
 
392
344
  SignsGrid.propTypes = propTypes$1;
@@ -623,6 +575,8 @@ var propTypes = {
623
575
  popupBackground: PropTypes$1.backgroundElement,
624
576
  current: PropTypes.bool,
625
577
  active: PropTypes.bool,
578
+ enableInteraction: PropTypes.func,
579
+ disableInteraction: PropTypes.func,
626
580
  transitions: PropTypes$1.transitions,
627
581
  transitionStagger: PropTypes.number,
628
582
  className: PropTypes.string
@@ -640,6 +594,8 @@ var defaultProps = {
640
594
  popupBackground: null,
641
595
  current: true,
642
596
  active: true,
597
+ enableInteraction: null,
598
+ disableInteraction: null,
643
599
  transitions: null,
644
600
  transitionStagger: 100,
645
601
  className: null
@@ -660,6 +616,8 @@ var Horoscope = function Horoscope(_ref) {
660
616
  popupBackground = _ref.popupBackground,
661
617
  current = _ref.current,
662
618
  active = _ref.active,
619
+ enableInteraction = _ref.enableInteraction,
620
+ disableInteraction = _ref.disableInteraction,
663
621
  transitions = _ref.transitions,
664
622
  transitionStagger = _ref.transitionStagger,
665
623
  className = _ref.className;
@@ -671,10 +629,12 @@ var Horoscope = function Horoscope(_ref) {
671
629
 
672
630
  var openPopup = useCallback(function () {
673
631
  setHasPopup(true);
674
- }, [hasPopup, setHasPopup]);
632
+ disableInteraction();
633
+ }, [hasPopup, setHasPopup, disableInteraction]);
675
634
  var closePopup = useCallback(function () {
676
635
  setHasPopup(false);
677
- }, [hasPopup, setHasPopup]);
636
+ enableInteraction();
637
+ }, [hasPopup, setHasPopup, enableInteraction]);
678
638
  var signs = defaultSigns.map(function (sign, index) {
679
639
  return _objectSpread(_objectSpread({}, sign), signsValue !== null && signsValue[index] ? signsValue[index] || null : null);
680
640
  });
@@ -850,9 +810,6 @@ var definition = [{
850
810
  fields: [{
851
811
  name: 'title',
852
812
  type: 'heading-element',
853
- theme: {
854
- textStyle: 'heading1'
855
- },
856
813
  label: defineMessage({
857
814
  id: "N25iDO",
858
815
  defaultMessage: [{
@@ -863,9 +820,6 @@ var definition = [{
863
820
  }, {
864
821
  name: 'description',
865
822
  type: 'text-element',
866
- theme: {
867
- textStyle: 'text'
868
- },
869
823
  label: defineMessage({
870
824
  id: "Y7bs1v",
871
825
  defaultMessage: [{
@@ -876,9 +830,6 @@ var definition = [{
876
830
  }, {
877
831
  name: 'author',
878
832
  type: 'author-element',
879
- theme: {
880
- textStyle: 'text'
881
- },
882
833
  label: defineMessage({
883
834
  id: "73hxYw",
884
835
  defaultMessage: [{
@@ -889,9 +840,6 @@ var definition = [{
889
840
  }, {
890
841
  name: 'button',
891
842
  type: 'button-element',
892
- theme: {
893
- textStyle: 'button'
894
- },
895
843
  label: defineMessage({
896
844
  id: "i6bmbD",
897
845
  defaultMessage: [{
@@ -902,9 +850,6 @@ var definition = [{
902
850
  }, {
903
851
  name: 'signs',
904
852
  component: 'items',
905
- theme: {
906
- textStyle: 'text'
907
- },
908
853
  label: defineMessage({
909
854
  id: "J6cnbt",
910
855
  defaultMessage: [{
@@ -925,7 +870,7 @@ var definition = [{
925
870
  "value": "Sign"
926
871
  }]
927
872
  }),
928
- labelPath: 'id',
873
+ labelPath: 'label',
929
874
  fields: [{
930
875
  name: 'word',
931
876
  type: 'heading-element',
@@ -951,8 +896,11 @@ var definition = [{
951
896
  }, {
952
897
  name: 'signSubtitle',
953
898
  type: 'heading-element',
899
+ defaultValue: {
900
+ body: 'Le mot de la semaine'
901
+ },
954
902
  label: defineMessage({
955
- id: "Om6Dis",
903
+ id: "Qe03Xz",
956
904
  defaultMessage: [{
957
905
  "type": 0,
958
906
  "value": "Sign Subtitle"
package/lib/index.js CHANGED
@@ -71,8 +71,6 @@ var styles$2 = {"container":"micromag-screen-urbania-horoscope-sign-modal-contai
71
71
  var propTypes$3 = {
72
72
  width: PropTypes__default["default"].number,
73
73
  height: PropTypes__default["default"].number,
74
- background: core.PropTypes.backgroundElement,
75
- backButton: PropTypes__default["default"].func,
76
74
  sign: PropTypes__default["default"].shape({
77
75
  id: PropTypes__default["default"].string,
78
76
  label: PropTypes__default["default"].string,
@@ -88,8 +86,6 @@ var propTypes$3 = {
88
86
  var defaultProps$3 = {
89
87
  width: null,
90
88
  height: null,
91
- background: null,
92
- backButton: null,
93
89
  sign: null,
94
90
  subtitle: null,
95
91
  current: true,
@@ -98,13 +94,12 @@ var defaultProps$3 = {
98
94
 
99
95
  var SignModal = function SignModal(_ref) {
100
96
  var width = _ref.width,
101
- height = _ref.height;
102
- _ref.background;
103
- var backButton = _ref.backButton,
97
+ height = _ref.height,
104
98
  sign = _ref.sign,
105
99
  subtitle = _ref.subtitle,
106
100
  current = _ref.current,
107
101
  className = _ref.className;
102
+ // eslint-disable-next-line no-unused-vars
108
103
  var _sign$label = sign.label,
109
104
  label = _sign$label === void 0 ? null : _sign$label,
110
105
  _sign$image = sign.image,
@@ -119,9 +114,8 @@ var SignModal = function SignModal(_ref) {
119
114
  _ref2$body = _ref2.body,
120
115
  wordBody = _ref2$body === void 0 ? null : _ref2$body;
121
116
 
122
- var _useScreenRenderConte = contexts.useScreenRenderContext();
123
- _useScreenRenderConte.isView;
124
- var isPreview = _useScreenRenderConte.isPreview,
117
+ var _useScreenRenderConte = contexts.useScreenRenderContext(),
118
+ isPreview = _useScreenRenderConte.isPreview,
125
119
  isPlaceholder = _useScreenRenderConte.isPlaceholder,
126
120
  isEdit = _useScreenRenderConte.isEdit,
127
121
  isStatic = _useScreenRenderConte.isStatic,
@@ -131,18 +125,7 @@ var SignModal = function SignModal(_ref) {
131
125
  var hasSubtitle = utils.isTextFilled(subtitle);
132
126
  var transitionDisabled = isStatic || isCapture || isPlaceholder || isPreview || isEdit;
133
127
  var scrollingDisabled = !isEdit && transitionDisabled || !current;
134
- var items = [/*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
135
- onClick: backButton,
136
- className: styles$2.backButton
137
- }, /*#__PURE__*/React__default["default"].createElement("span", {
138
- className: styles$2.arrow
139
- }, "\u2190"), ' ', /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
140
- id: "keK5s0",
141
- defaultMessage: [{
142
- "type": 0,
143
- "value": "Back to the Signs"
144
- }]
145
- })), /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, null, /*#__PURE__*/React__default["default"].createElement("h2", {
128
+ var items = [/*#__PURE__*/React__default["default"].createElement(components.ScreenElement, null, /*#__PURE__*/React__default["default"].createElement("h2", {
146
129
  className: styles$2.signName
147
130
  }, /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, label))), hasWord ? /*#__PURE__*/React__default["default"].createElement("div", {
148
131
  className: styles$2.wordContainer
@@ -227,7 +210,7 @@ var Close = function Close(_ref) {
227
210
  Close.propTypes = propTypes$2;
228
211
  Close.defaultProps = defaultProps$2;
229
212
 
230
- var styles$1 = {"container":"micromag-screen-urbania-horoscope-signs-grid-container","disabled":"micromag-screen-urbania-horoscope-signs-grid-disabled","hidden":"micromag-screen-urbania-horoscope-signs-grid-hidden","placeholder":"micromag-screen-urbania-horoscope-signs-grid-placeholder","content":"micromag-screen-urbania-horoscope-signs-grid-content","closeButton":"micromag-screen-urbania-horoscope-signs-grid-closeButton","closeX":"micromag-screen-urbania-horoscope-signs-grid-closeX","gridContainer":"micromag-screen-urbania-horoscope-signs-grid-gridContainer","isPlaceholder":"micromag-screen-urbania-horoscope-signs-grid-isPlaceholder","signPlaceholder":"micromag-screen-urbania-horoscope-signs-grid-signPlaceholder","gridElement":"micromag-screen-urbania-horoscope-signs-grid-gridElement","image":"micromag-screen-urbania-horoscope-signs-grid-image","signName":"micromag-screen-urbania-horoscope-signs-grid-signName","date":"micromag-screen-urbania-horoscope-signs-grid-date","backButton":"micromag-screen-urbania-horoscope-signs-grid-backButton","signModal":"micromag-screen-urbania-horoscope-signs-grid-signModal","enter":"micromag-screen-urbania-horoscope-signs-grid-enter","enterActive":"micromag-screen-urbania-horoscope-signs-grid-enterActive","exit":"micromag-screen-urbania-horoscope-signs-grid-exit","exitActive":"micromag-screen-urbania-horoscope-signs-grid-exitActive","modalEnter":"micromag-screen-urbania-horoscope-signs-grid-modalEnter","modalEnterActive":"micromag-screen-urbania-horoscope-signs-grid-modalEnterActive","modalExit":"micromag-screen-urbania-horoscope-signs-grid-modalExit","modalExitActive":"micromag-screen-urbania-horoscope-signs-grid-modalExitActive"};
213
+ var styles$1 = {"container":"micromag-screen-urbania-horoscope-signs-grid-container","disabled":"micromag-screen-urbania-horoscope-signs-grid-disabled","hidden":"micromag-screen-urbania-horoscope-signs-grid-hidden","placeholder":"micromag-screen-urbania-horoscope-signs-grid-placeholder","content":"micromag-screen-urbania-horoscope-signs-grid-content","closeButton":"micromag-screen-urbania-horoscope-signs-grid-closeButton","closeX":"micromag-screen-urbania-horoscope-signs-grid-closeX","gridContainer":"micromag-screen-urbania-horoscope-signs-grid-gridContainer","isPlaceholder":"micromag-screen-urbania-horoscope-signs-grid-isPlaceholder","signPlaceholder":"micromag-screen-urbania-horoscope-signs-grid-signPlaceholder","gridElement":"micromag-screen-urbania-horoscope-signs-grid-gridElement","image":"micromag-screen-urbania-horoscope-signs-grid-image","signName":"micromag-screen-urbania-horoscope-signs-grid-signName","date":"micromag-screen-urbania-horoscope-signs-grid-date","backButton":"micromag-screen-urbania-horoscope-signs-grid-backButton","arrow":"micromag-screen-urbania-horoscope-signs-grid-arrow","modalContainer":"micromag-screen-urbania-horoscope-signs-grid-modalContainer","enter":"micromag-screen-urbania-horoscope-signs-grid-enter","enterActive":"micromag-screen-urbania-horoscope-signs-grid-enterActive","exit":"micromag-screen-urbania-horoscope-signs-grid-exit","exitActive":"micromag-screen-urbania-horoscope-signs-grid-exitActive","signModal":"micromag-screen-urbania-horoscope-signs-grid-signModal"};
231
214
 
232
215
  var defaultBackground = {
233
216
  image: {
@@ -281,28 +264,17 @@ var SignsGrid = function SignsGrid(_ref) {
281
264
 
282
265
  var _useState = React.useState(null),
283
266
  _useState2 = _slicedToArray__default["default"](_useState, 2),
284
- activeSign = _useState2[0],
285
- setActiveSign = _useState2[1];
286
-
287
- React.useEffect(function () {
288
- var _ref2 = activeSign || {},
289
- _ref2$id = _ref2.id,
290
- currentId = _ref2$id === void 0 ? null : _ref2$id;
291
-
292
- var currentSign = signs.find(function (_ref3) {
293
- var _ref3$id = _ref3.id,
294
- id = _ref3$id === void 0 ? null : _ref3$id;
295
- return currentId !== null && currentId === id;
296
- }) || null;
297
-
298
- if (currentSign !== null) {
299
- setActiveSign(currentSign);
300
- }
301
- }, [activeSign, setActiveSign, signs]);
302
-
303
- var closeModal = function closeModal() {
304
- return setActiveSign(null);
305
- };
267
+ activeSignId = _useState2[0],
268
+ setActiveSignId = _useState2[1];
269
+
270
+ var activeSign = signs.find(function (_ref2) {
271
+ var _ref2$id = _ref2.id,
272
+ id = _ref2$id === void 0 ? null : _ref2$id;
273
+ return activeSignId === id;
274
+ }) || null;
275
+ var closeModal = React.useCallback(function () {
276
+ return setActiveSignId(null);
277
+ }, [activeSignId, setActiveSignId]);
306
278
 
307
279
  var _useScreenRenderConte = contexts.useScreenRenderContext(),
308
280
  isView = _useScreenRenderConte.isView,
@@ -329,24 +301,22 @@ var SignsGrid = function SignsGrid(_ref) {
329
301
  className: styles$1.closeButton
330
302
  }, /*#__PURE__*/React__default["default"].createElement(Close, {
331
303
  className: styles$1.closeX
332
- })) : null, /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.TransitionGroup, null, !activeSign ? /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.CSSTransition, {
304
+ })) : null, /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.TransitionGroup, null, !activeSignId ? /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.CSSTransition, {
333
305
  key: "grid",
334
306
  classNames: styles$1,
335
307
  timeout: 1000
336
308
  }, /*#__PURE__*/React__default["default"].createElement("div", {
337
309
  className: classNames__default["default"]([styles$1.gridContainer, _defineProperty__default["default"]({}, styles$1.isPlaceholder, isPlaceholder)])
338
310
  }, signs.map(function (sign) {
339
- var _ref6 = sign || {},
340
- _ref6$id = _ref6.id,
341
- id = _ref6$id === void 0 ? null : _ref6$id,
342
- _ref6$image = _ref6.image,
343
- image = _ref6$image === void 0 ? null : _ref6$image,
344
- _ref6$label = _ref6.label,
345
- label = _ref6$label === void 0 ? null : _ref6$label,
346
- _ref6$date = _ref6.date,
347
- date = _ref6$date === void 0 ? null : _ref6$date;
348
- _ref6.word;
349
- _ref6.description;
311
+ var _ref5 = sign || {},
312
+ _ref5$id = _ref5.id,
313
+ id = _ref5$id === void 0 ? null : _ref5$id,
314
+ _ref5$image = _ref5.image,
315
+ image = _ref5$image === void 0 ? null : _ref5$image,
316
+ _ref5$label = _ref5.label,
317
+ label = _ref5$label === void 0 ? null : _ref5$label,
318
+ _ref5$date = _ref5.date,
319
+ date = _ref5$date === void 0 ? null : _ref5$date;
350
320
 
351
321
  return /*#__PURE__*/React__default["default"].createElement(components.ScreenElement, {
352
322
  key: id,
@@ -366,7 +336,7 @@ var SignsGrid = function SignsGrid(_ref) {
366
336
  className: styles$1.gridElement,
367
337
  type: "button",
368
338
  onClick: function onClick() {
369
- return setActiveSign(sign);
339
+ return setActiveSignId(id);
370
340
  }
371
341
  }, image !== null ? /*#__PURE__*/React__default["default"].createElement("img", {
372
342
  className: styles$1.image,
@@ -379,48 +349,30 @@ var SignsGrid = function SignsGrid(_ref) {
379
349
  }, label !== null ? /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, label) : null), /*#__PURE__*/React__default["default"].createElement("p", {
380
350
  className: styles$1.date
381
351
  }, date !== null ? /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, date) : null))));
382
- }))) :
383
- /*#__PURE__*/
384
- // <>
385
- // <CSSTransition
386
- // key="backButton"
387
- // // classNames={{
388
- // // enter: styles.buttonEnter,
389
- // // enterActive: styles.buttonEnterActive,
390
- // // exit: styles.buttonExit,
391
- // // exitActive: styles.buttonExitActive,
392
- // // }}
393
- // // classNames={{
394
- // // enter: styles.modalEnter,
395
- // // enterActive: styles.modalEnterActive,
396
- // // exit: styles.modalExit,
397
- // // exitActive: styles.modalExitActive,
398
- // // }}
399
- // classNames={styles}
400
- // timeout={1000}
401
- // >
402
- // <Button onClick={closeModal} className={styles.backButton}>
403
- // <span className={styles.arrow}>←</span> Back to the signs
404
- // </Button>
405
- // </CSSTransition>
406
- React__default["default"].createElement(reactTransitionGroup.CSSTransition, {
352
+ }))) : /*#__PURE__*/React__default["default"].createElement(reactTransitionGroup.CSSTransition, {
407
353
  key: "modal",
408
- classNames: {
409
- enter: styles$1.modalEnter,
410
- enterActive: styles$1.modalEnterActive,
411
- exit: styles$1.modalExit,
412
- exitActive: styles$1.modalExitActive
413
- },
354
+ classNames: styles$1,
414
355
  timeout: 500
415
- }, /*#__PURE__*/React__default["default"].createElement(SignModal, {
356
+ }, /*#__PURE__*/React__default["default"].createElement("div", {
357
+ className: styles$1.modalContainer
358
+ }, /*#__PURE__*/React__default["default"].createElement(Button__default["default"], {
359
+ onClick: closeModal,
360
+ className: styles$1.backButton
361
+ }, /*#__PURE__*/React__default["default"].createElement("span", {
362
+ className: styles$1.arrow
363
+ }, "\u2190"), /*#__PURE__*/React__default["default"].createElement(reactIntl.FormattedMessage, {
364
+ id: "keK5s0",
365
+ defaultMessage: [{
366
+ "type": 0,
367
+ "value": "Back to the Signs"
368
+ }]
369
+ })), /*#__PURE__*/React__default["default"].createElement(SignModal, {
416
370
  width: width,
417
371
  height: height,
418
372
  className: styles$1.signModal,
419
- backButton: closeModal,
420
373
  sign: activeSign,
421
374
  subtitle: signSubtitle
422
- })) // </>
423
- ))));
375
+ })))))));
424
376
  };
425
377
 
426
378
  SignsGrid.propTypes = propTypes$1;
@@ -657,6 +609,8 @@ var propTypes = {
657
609
  popupBackground: core.PropTypes.backgroundElement,
658
610
  current: PropTypes__default["default"].bool,
659
611
  active: PropTypes__default["default"].bool,
612
+ enableInteraction: PropTypes__default["default"].func,
613
+ disableInteraction: PropTypes__default["default"].func,
660
614
  transitions: core.PropTypes.transitions,
661
615
  transitionStagger: PropTypes__default["default"].number,
662
616
  className: PropTypes__default["default"].string
@@ -674,6 +628,8 @@ var defaultProps = {
674
628
  popupBackground: null,
675
629
  current: true,
676
630
  active: true,
631
+ enableInteraction: null,
632
+ disableInteraction: null,
677
633
  transitions: null,
678
634
  transitionStagger: 100,
679
635
  className: null
@@ -694,6 +650,8 @@ var Horoscope = function Horoscope(_ref) {
694
650
  popupBackground = _ref.popupBackground,
695
651
  current = _ref.current,
696
652
  active = _ref.active,
653
+ enableInteraction = _ref.enableInteraction,
654
+ disableInteraction = _ref.disableInteraction,
697
655
  transitions = _ref.transitions,
698
656
  transitionStagger = _ref.transitionStagger,
699
657
  className = _ref.className;
@@ -705,10 +663,12 @@ var Horoscope = function Horoscope(_ref) {
705
663
 
706
664
  var openPopup = React.useCallback(function () {
707
665
  setHasPopup(true);
708
- }, [hasPopup, setHasPopup]);
666
+ disableInteraction();
667
+ }, [hasPopup, setHasPopup, disableInteraction]);
709
668
  var closePopup = React.useCallback(function () {
710
669
  setHasPopup(false);
711
- }, [hasPopup, setHasPopup]);
670
+ enableInteraction();
671
+ }, [hasPopup, setHasPopup, enableInteraction]);
712
672
  var signs = defaultSigns.map(function (sign, index) {
713
673
  return _objectSpread__default["default"](_objectSpread__default["default"]({}, sign), signsValue !== null && signsValue[index] ? signsValue[index] || null : null);
714
674
  });
@@ -884,9 +844,6 @@ var definition = [{
884
844
  fields: [{
885
845
  name: 'title',
886
846
  type: 'heading-element',
887
- theme: {
888
- textStyle: 'heading1'
889
- },
890
847
  label: reactIntl.defineMessage({
891
848
  id: "N25iDO",
892
849
  defaultMessage: [{
@@ -897,9 +854,6 @@ var definition = [{
897
854
  }, {
898
855
  name: 'description',
899
856
  type: 'text-element',
900
- theme: {
901
- textStyle: 'text'
902
- },
903
857
  label: reactIntl.defineMessage({
904
858
  id: "Y7bs1v",
905
859
  defaultMessage: [{
@@ -910,9 +864,6 @@ var definition = [{
910
864
  }, {
911
865
  name: 'author',
912
866
  type: 'author-element',
913
- theme: {
914
- textStyle: 'text'
915
- },
916
867
  label: reactIntl.defineMessage({
917
868
  id: "73hxYw",
918
869
  defaultMessage: [{
@@ -923,9 +874,6 @@ var definition = [{
923
874
  }, {
924
875
  name: 'button',
925
876
  type: 'button-element',
926
- theme: {
927
- textStyle: 'button'
928
- },
929
877
  label: reactIntl.defineMessage({
930
878
  id: "i6bmbD",
931
879
  defaultMessage: [{
@@ -936,9 +884,6 @@ var definition = [{
936
884
  }, {
937
885
  name: 'signs',
938
886
  component: 'items',
939
- theme: {
940
- textStyle: 'text'
941
- },
942
887
  label: reactIntl.defineMessage({
943
888
  id: "J6cnbt",
944
889
  defaultMessage: [{
@@ -959,7 +904,7 @@ var definition = [{
959
904
  "value": "Sign"
960
905
  }]
961
906
  }),
962
- labelPath: 'id',
907
+ labelPath: 'label',
963
908
  fields: [{
964
909
  name: 'word',
965
910
  type: 'heading-element',
@@ -985,8 +930,11 @@ var definition = [{
985
930
  }, {
986
931
  name: 'signSubtitle',
987
932
  type: 'heading-element',
933
+ defaultValue: {
934
+ body: 'Le mot de la semaine'
935
+ },
988
936
  label: reactIntl.defineMessage({
989
- id: "Om6Dis",
937
+ id: "Qe03Xz",
990
938
  defaultMessage: [{
991
939
  "type": 0,
992
940
  "value": "Sign Subtitle"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@micromag/screen-urbania-horoscope",
3
- "version": "0.3.76",
3
+ "version": "0.3.79",
4
4
  "description": "",
5
5
  "keywords": [
6
6
  "javascript"
@@ -50,18 +50,18 @@
50
50
  },
51
51
  "dependencies": {
52
52
  "@babel/runtime": "^7.13.10",
53
- "@micromag/core": "^0.3.74",
54
- "@micromag/element-background": "^0.3.74",
55
- "@micromag/element-button": "^0.3.76",
56
- "@micromag/element-call-to-action": "^0.3.76",
57
- "@micromag/element-container": "^0.3.74",
58
- "@micromag/element-grid": "^0.3.74",
59
- "@micromag/element-heading": "^0.3.74",
60
- "@micromag/element-layout": "^0.3.74",
61
- "@micromag/element-scroll": "^0.3.74",
62
- "@micromag/element-text": "^0.3.74",
63
- "@micromag/element-urbania-author": "^0.3.76",
64
- "@micromag/transforms": "^0.3.74",
53
+ "@micromag/core": "^0.3.78",
54
+ "@micromag/element-background": "^0.3.78",
55
+ "@micromag/element-button": "^0.3.79",
56
+ "@micromag/element-call-to-action": "^0.3.79",
57
+ "@micromag/element-container": "^0.3.78",
58
+ "@micromag/element-grid": "^0.3.78",
59
+ "@micromag/element-heading": "^0.3.78",
60
+ "@micromag/element-layout": "^0.3.78",
61
+ "@micromag/element-scroll": "^0.3.78",
62
+ "@micromag/element-text": "^0.3.78",
63
+ "@micromag/element-urbania-author": "^0.3.79",
64
+ "@micromag/transforms": "^0.3.78",
65
65
  "classnames": "^2.2.6",
66
66
  "lodash": "^4.17.21",
67
67
  "prop-types": "^15.7.2",
@@ -72,5 +72,5 @@
72
72
  "publishConfig": {
73
73
  "access": "public"
74
74
  },
75
- "gitHead": "c86e3ead134f626899cfdfc34fac84eb1d02864a"
75
+ "gitHead": "b25bd1907137fd148b912a5a48c1bc9d2bd0dadd"
76
76
  }