lido-player 0.0.2-alpha-60-dev → 0.0.2-alpha-62

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 (110) hide show
  1. package/dist/cjs/index.cjs.js +1 -1
  2. package/dist/cjs/lido-avatar_22.cjs.entry.js +70 -28
  3. package/dist/cjs/lido-player.cjs.js +1 -1
  4. package/dist/cjs/loader.cjs.js +1 -1
  5. package/dist/cjs/{utils-28faa755.js → utils-b13cba29.js} +130 -64
  6. package/dist/collection/components/container/lido-container.js +21 -18
  7. package/dist/collection/components/home/lido-home.js +4 -4
  8. package/dist/collection/components/root/lido-root.js +5 -5
  9. package/dist/collection/components/text/lido-text.js +3 -2
  10. package/dist/collection/stories/Templates/balancing/balancing.stories.js +1 -1
  11. package/dist/collection/stories/Templates/imageMatch/imageMatch.stories.js +16 -15
  12. package/dist/collection/stories/Templates/numberIdentification/numberIdentificationimageTotext.stories.js +9 -7
  13. package/dist/collection/stories/Templates/numberIdentification/numberIdentificationtextTotext.stories.js +8 -6
  14. package/dist/collection/stories/Templates/palEgmaCalculateSum/palEgmaMultiOption.stories.js +4 -3
  15. package/dist/collection/stories/Templates/palEgmaCalculateSum/palEgmaSumTogether.stories.js +3 -2
  16. package/dist/collection/stories/Templates/palEgmaPatternMatching/palEgmaPatternMatching.stories.js +32 -19
  17. package/dist/collection/stories/Templates/palEgmaWordProblem/palEgmaWordProblem.stories.js +5 -5
  18. package/dist/collection/stories/Templates/palEgraInventedSpelling/pal_egra_invented_spelling_schema.stories.js +10 -7
  19. package/dist/collection/stories/Templates/palEgraMCQWithImage/palEgraMCQWithImage.stories.js +11 -8
  20. package/dist/collection/stories/Templates/palEgraOptionWithAudio/palEgraOptionWithAudio.stories.js +18 -14
  21. package/dist/collection/stories/Templates/palEgraStoryMaking/pal_egra_story_making.stories.js +9 -9
  22. package/dist/collection/stories/Templates/palEgraTemplate1/palEgraLetterIdentification.stories.js +17 -10
  23. package/dist/collection/stories/Templates/palEgraWordMatch/palEgraWordMatch.stories.js +98 -0
  24. package/dist/collection/stories/Templates/palEgra_OddOneOut/palEgra_oddOneOut.stories.js +8 -8
  25. package/dist/collection/stories/Templates/palEgra_arrange_pictures/palEgra_arrange_pictures.stories.js +16 -19
  26. package/dist/collection/stories/Templates/palEgra_build_word/palEgra_build_word.stories.js +21 -18
  27. package/dist/collection/stories/Templates/palEgra_word_formation/palEgra_WordFormation.stories.js +26 -19
  28. package/dist/collection/stories/Templates/palStorytale/palStorytale.stories.js +9 -9
  29. package/dist/collection/stories/Templates/pictureClues/pictureClues.stories.js +9 -9
  30. package/dist/collection/stories/Templates/pictureWordMatch/pictureWordMatch1.stories.js +15 -15
  31. package/dist/collection/stories/Templates/pictureWordMatch/pictureWordMatch2.stories.js +11 -11
  32. package/dist/collection/stories/Templates/sentenceMatch/sentenceMatch.stories.js +63 -0
  33. package/dist/collection/stories/Templates/substraction/substractionWithimg.stories.js +7 -7
  34. package/dist/collection/stories/Templates/substraction/substractionWithoutImg.stories.js +13 -13
  35. package/dist/collection/stories/Templates/wordBuilding/wordBuildingwithimg.stories.js +7 -7
  36. package/dist/collection/stories/Templates/wordBuilding/wordBuildingwithoutimg.stories.js +1 -1
  37. package/dist/collection/stories/Templates/writeSet/writeSet.stories.js +6 -5
  38. package/dist/collection/utils/audioPlayer.js +10 -0
  39. package/dist/collection/utils/customEvents.js +2 -1
  40. package/dist/collection/utils/i18n.js +2 -0
  41. package/dist/collection/utils/utils.js +8 -12
  42. package/dist/collection/utils/utilsHandlers/clickHandler.js +20 -14
  43. package/dist/collection/utils/utilsHandlers/dragDropHandler.js +26 -52
  44. package/dist/collection/utils/utilsHandlers/lidoBalanceHandler.js +4 -5
  45. package/dist/collection/utils/utilsHandlers/timer.js +53 -0
  46. package/dist/components/index.js +1 -1
  47. package/dist/components/lido-avatar.js +1 -1
  48. package/dist/components/lido-balance.js +1 -1
  49. package/dist/components/lido-calculator.js +1 -1
  50. package/dist/components/lido-canvas.js +1 -1
  51. package/dist/components/lido-cell.js +1 -1
  52. package/dist/components/lido-col.js +1 -1
  53. package/dist/components/lido-container.js +1 -1
  54. package/dist/components/lido-flash-card.js +1 -1
  55. package/dist/components/lido-float.js +1 -1
  56. package/dist/components/lido-home.js +1 -1
  57. package/dist/components/lido-image.js +1 -1
  58. package/dist/components/lido-keyboard.js +1 -1
  59. package/dist/components/lido-math-matrix.js +1 -1
  60. package/dist/components/lido-pos.js +1 -1
  61. package/dist/components/lido-random.js +1 -1
  62. package/dist/components/lido-root.js +27 -27
  63. package/dist/components/lido-row.js +1 -1
  64. package/dist/components/lido-shape.js +1 -1
  65. package/dist/components/lido-slide-fill.js +1 -1
  66. package/dist/components/lido-text.js +1 -1
  67. package/dist/components/lido-trace.js +1 -1
  68. package/dist/components/lido-wrap.js +1 -1
  69. package/dist/components/{p-74c270d2.js → p-21938b85.js} +2 -2
  70. package/dist/components/{p-a182c9a2.js → p-39767aae.js} +1 -1
  71. package/dist/components/{p-3acd9a2e.js → p-3db5a756.js} +1 -1
  72. package/dist/components/{p-93acfbb2.js → p-40dd6fa3.js} +1 -1
  73. package/dist/components/{p-5e7c6afa.js → p-552f581f.js} +1 -1
  74. package/dist/components/{p-37c86a94.js → p-5a3a7f41.js} +47 -7
  75. package/dist/components/{p-b151457d.js → p-5da9c4a0.js} +22 -20
  76. package/dist/components/{p-3acada8c.js → p-64b85ae6.js} +1 -1
  77. package/dist/components/{p-4d01394c.js → p-6c1ea24d.js} +1 -1
  78. package/dist/components/{p-b867548e.js → p-7256917d.js} +1 -1
  79. package/dist/components/{p-8a32f7cb.js → p-777293d6.js} +1 -1
  80. package/dist/components/{p-8c0667eb.js → p-85eaa0b7.js} +1 -1
  81. package/dist/components/{p-8f082c62.js → p-8f174468.js} +1 -1
  82. package/dist/components/{p-235091a1.js → p-bd09bc5b.js} +130 -65
  83. package/dist/components/{p-32c89979.js → p-bf0c1e81.js} +1 -1
  84. package/dist/components/{p-c90d92db.js → p-cdb5b0e6.js} +1 -1
  85. package/dist/components/{p-db2a05f5.js → p-d0d890d8.js} +3 -3
  86. package/dist/components/{p-57400ebc.js → p-d2d6e641.js} +1 -1
  87. package/dist/components/{p-354f7b19.js → p-da85322a.js} +2 -2
  88. package/dist/components/{p-16604098.js → p-e42ddea5.js} +1 -1
  89. package/dist/components/{p-06cecca5.js → p-f4c980f0.js} +1 -1
  90. package/dist/components/{p-de45dcab.js → p-fb9e274c.js} +25 -25
  91. package/dist/esm/index.js +1 -1
  92. package/dist/esm/lido-avatar_22.entry.js +70 -28
  93. package/dist/esm/lido-player.js +1 -1
  94. package/dist/esm/loader.js +1 -1
  95. package/dist/esm/{utils-2edeb213.js → utils-b7ed15c2.js} +130 -65
  96. package/dist/lido-player/index.esm.js +1 -1
  97. package/dist/lido-player/lido-player.esm.js +1 -1
  98. package/dist/lido-player/{p-add7f36e.js → p-1557f3df.js} +2 -2
  99. package/dist/lido-player/p-7e79ea93.entry.js +1 -0
  100. package/dist/types/components/container/lido-container.d.ts +1 -1
  101. package/dist/types/components/home/lido-home.d.ts +1 -1
  102. package/dist/types/components/root/lido-root.d.ts +1 -1
  103. package/dist/types/components.d.ts +24 -24
  104. package/dist/types/stories/Templates/palEgraWordMatch/palEgraWordMatch.stories.d.ts +4 -0
  105. package/dist/types/stories/Templates/sentenceMatch/sentenceMatch.stories.d.ts +4 -0
  106. package/dist/types/utils/audioPlayer.d.ts +1 -0
  107. package/dist/types/utils/constants.d.ts +4 -5
  108. package/dist/types/utils/utilsHandlers/timer.d.ts +14 -0
  109. package/package.json +1 -1
  110. package/dist/lido-player/p-280e3d34.entry.js +0 -1
package/dist/collection/components/text/lido-text.js CHANGED
@@ -82,7 +82,8 @@ export class LidoText {
82
82
  const base = window[LIDO_COMMON_AUDIO_PATH];
83
83
  if (!base || !this.string)
84
84
  return null;
85
- const fileName = this.string.toLowerCase().trim().replace(/\s+/g, "_").replace(/[^\w-]/g, "");
85
+ const fileName = this.string;
86
+ console.log(fileName, "filename😂");
86
87
  return `${base}/${fileName}.mp3`;
87
88
  }
88
89
  /**
@@ -149,7 +150,7 @@ export class LidoText {
149
150
  }
150
151
  }
151
152
  render() {
152
- return (h(Host, { key: '9635bba385679026c4f90aac9467612f06a21f1b', class: "lido-text", value: this.value, type: this.type, "tab-index": this.tabIndex, audio: this.audio, onTouch: this.onTouch, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, onEntry: this.onEntry, minDrops: this.minDrops, maxDrops: this.maxDrops, id: this.id, style: this.style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, "span-type": this.spanType, "disable-speak": this.disableSpeak }, this.spanType !== '' ? h("div", { class: "lido-text-content" }, " ", i18next.t(this.string)) : i18next.t(this.string)));
153
+ return (h(Host, { key: '7b3c230890775e489b3d2bc2abca683078211377', class: "lido-text", value: this.value, type: this.type, "tab-index": this.tabIndex, audio: this.audio, onTouch: this.onTouch, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, onEntry: this.onEntry, minDrops: this.minDrops, maxDrops: this.maxDrops, id: this.id, style: this.style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, "span-type": this.spanType, "disable-speak": this.disableSpeak }, this.spanType !== '' ? h("div", { class: "lido-text-content" }, " ", i18next.t(this.string)) : i18next.t(this.string)));
153
154
  }
154
155
  static get is() { return "lido-text"; }
155
156
  static get originalStyleUrls() {
package/dist/collection/stories/Templates/balancing/balancing.stories.js CHANGED
@@ -46,7 +46,7 @@ function getContainerXml(args) {
46
46
  </lido-text>
47
47
  </lido-pos>
48
48
  <!-- question -->
49
- <lido-text visible="true" tab-index="12" height="landscape.100px,portrait.175px" font-family="'Baloo Bhai 2'" font-size="60px" width="landscape.auto,portrait.86%" string="Drop the elements to match the given symbol '${objective}'" font-color="black" bg-color="white" y="landscape.0%,portrait.-12%" onEntry="this.font-weight='600'; this.position='relative';">
49
+ <lido-text visible="true" audio="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/fill-in-the-blanks/fill-upAudio.mp3" id="heading" tab-index="12" height="landscape.100px,portrait.175px" font-family="'Baloo Bhai 2'" font-size="60px" width="landscape.auto,portrait.86%" string="Drop the elements to match the given symbol '${objective}'" font-color="black" bg-color="white" y="landscape.0%,portrait.-12%" onEntry="this.speak='true';this.font-weight='600'; this.position='relative';">
50
50
  </lido-text>
51
51
  <lido-balance tilt="0" operation="add" visible="true" height="landscape.456px,portrait.500px" y="landscape.4%,portrait.0%" width="landscape.1136px,portrait.876px">
52
52
  <!-- drop Element -->
package/dist/collection/stories/Templates/imageMatch/imageMatch.stories.js CHANGED
@@ -9,13 +9,13 @@ const meta = {
9
9
  option4: { control: 'text' },
10
10
  answer: { control: 'text' },
11
11
  image: { control: 'file' },
12
- isAllowOnlyCorrect: { control: 'boolean' },
12
+ PracticeMode: { control: 'boolean' },
13
13
  },
14
14
  };
15
15
  export default meta;
16
16
  export const imageMatch = {
17
17
  args: {
18
- isAllowOnlyCorrect: true,
18
+ PracticeMode: false,
19
19
  option1: "रमन के स्कूल में खेल दिवस है।",
20
20
  option2: "रमन के स्कूल में खेल दिवस हैं।",
21
21
  option3: "रमन की स्कूल में खेल दिवस है।",
@@ -33,41 +33,42 @@ function getContainerXml(args) {
33
33
  let tabCounter = 1;
34
34
  const { isAllowOnlyCorrect = true } = args;
35
35
  return `<main>
36
- <lido-container id="lido-container" value="maincontainer" visible="true" objective="${args.answer}" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/background-images/Quiz%20literacy.png" onEntry="" is-allow-only-correct="${isAllowOnlyCorrect}" is-Continue-On-Correct="true" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';">
37
- <lido-cell layout="pos" id="pos1" disable-edit="true" value="pos1" height="landscape.415px,portrait.401px" width="landscape.374px,portrait.401px" x="landscape.25%, portrait.24%" y="landscape.52%, portrait.83%" aria-hidden="true" z="2" bg-color="transparent" type="" visible="true" audio="" onTouch="" onCorrect="">
36
+ <lido-container disable-speak="true" id="lido-container" value="maincontainer" visible="true" objective="${args.answer}" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/background-images/Quiz%20literacy.png" onEntry="text1.speak='true';" is-allow-only-correct="${args.PracticeMode}" is-Continue-On-Correct="${args.PracticeMode}" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';">
37
+ <lido-cell layout="pos" id="pos1" disable-edit="true" value="pos1" height="landscape.345px,portrait.401px" width="landscape.308px,portrait.401px" x="landscape.24%, portrait.24%" y="landscape.60%, portrait.83%" aria-hidden="true" z="2" bg-color="transparent" type="" visible="true" audio="" onTouch="" onCorrect="">
38
38
  <lido-avatar id="lido-avatar" disable-edit="true" visible="true" height="100%" width="100%" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/temp1/chimplecharacter.riv" alt-text="{chimpleCharacterRive}" bg-color="transparent">
39
39
  </lido-avatar>
40
- <lido-image id="image1" disable-edit="true" value="image1" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/temp1/Shadow.png" bg-color="transparent" width="203px" height="32px" x="landscape.87px,portrait.111px" y="landscape.338px,portrait.344px" alt-text="{shadowImgae}">
40
+ <lido-image id="image1" disable-edit="true" value="image1" visible="true" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/temp1/Shadow.png" bg-color="transparent" width="203px" height="32px" x="landscape.57px,portrait.111px" y="landscape.285px,portrait.344px" alt-text="{shadowImgae}">
41
41
  </lido-image>
42
42
  </lido-cell>
43
+ <lido-text visible="false" id="inst" string="choose the correct option"></lido-text>
43
44
  <lido-cell layout="col" visible="true" bg-Color="transparent" width="landscape.100%,portrait.90%" height="68%" margin="landscape.0px,portrait.-107px 0px 0px 0px">
44
45
 
45
46
 
46
47
 
47
- <lido-text id="text1" tab-index="1" disable-edit="true" margin="landscape.0px 0px 0px 27px,portrait.0px 0px 60px 0px" value="text1" visible="true" width="landscape.100%,portrait.90%" height="18%" bg-color="#FFF5BB" font-family="'Baloo 2', serif" font-size="60px" font-color="#000" string="${args.questionText}" y="-13%" onEntry="this.position='relative';this.fontWeight='500';this.padding='20px';this.border='2px solid #FFB612'; this.boxShadow='unset';this.border-radius='16px'; this.textAlign='start'; this.speak='true';">
48
+ <lido-text id="text1" tab-index="1" disable-edit="true" margin="landscape.0px 0px 0px 0px,portrait.0px 0px 60px 0px" value="text1" visible="true" width="landscape.92%,portrait.90%" height="18%" bg-color="#FFF5BB" font-family="'Baloo 2', serif" font-size="60px" font-color="#000" string="${args.questionText}" y="-7%" onEntry="this.position='relative';this.fontWeight='500';this.padding='0px';this.border='2px solid #FFB612'; this.boxShadow='unset';this.border-radius='16px'; this.textAlign='start'; ">
48
49
  </lido-text>
49
50
 
50
- <lido-cell layout="landscape.row,portrait.col" visible="true" bg-Color="transparent" width="landscape.130%,portrait.90%" height="68%" margin="landscape.0px,portrait.-107px 0px 0px 0px">
51
+ <lido-cell layout="landscape.row,portrait.col" visible="true" bg-Color="transparent" width="landscape.109%,portrait.90%" height="68%" margin="landscape.40px 0px -31px 0px,portrait.-107px 0px 0px 0px">
51
52
 
52
- <lido-cell visible="true" height="landscape.553px,portrait.62%" width="landscape.553px,portrait.681px" border-radius="7px"
53
+ <lido-cell visible="true" height="landscape.400px,portrait.62%" width="landscape.400px,portrait.681px" border-radius="7px"
53
54
  bg-color="white" margin="landscape.0px 0px 0px 0px, portrait.-149px 0px 25px 0px"
54
55
  onEntry="this.display='flex'; this.align-items='center'; this.justifyContent='center';">
55
56
  <lido-image visible="true"
56
- width="landscape.553px,portrait.100%"
57
- height="landscape.553px,portrait.100%"
57
+ width="landscape.400px,portrait.100%"
58
+ height="landscape.400px,portrait.100%"
58
59
  border-radius="7px" bg-color="white"
59
60
  src="${args.image}">
60
61
  </lido-image>
61
62
  </lido-cell>
62
63
 
63
- <lido-cell layout="col" visible="true" width="landscape.53%,portrait.108%" height="216px" bg-Color="transparent" margin="landscape.0px 0px 0px 0px,portrait.0px 0px 0px 0px" onEntry="this.align-items='center'; this.justify-content='center'; this.gap='40px';">
64
- <lido-text visible="true" audio="" onCorrect="this.border='5px solid green';this.cellBorderAnimate='#65BC46';" onInCorrect="this.vibrate='horizontal-shake';" id="option1" font-family="'Baloo Bhai 2'" tab-index="2" font-size="62px" border-radius="12px" font-color="black" height="120px" width="788px" string="${args.option1}" value="${args.option1}" type="click" onEntry="this.font-weight='500';this.padding='0px 64px 0px 64px';">
64
+ <lido-cell layout="col" visible="true" width="landscape.53%,portrait.108%" height="216px" bg-Color="transparent" margin="landscape.0px 0px 0px 0px,portrait.0px 0px 0px 0px" onEntry="this.align-items='center'; this.justify-content='center'; this.gap='24px';">
65
+ <lido-text visible="true" disable-speak="true" audio="" onCorrect="" onInCorrect="" id="option1" font-family="'Baloo Bhai 2'" tab-index="2" font-size="54px" border-radius="12px" font-color="black" height="120px" width="873px" string="${args.option1}" value="${args.option1}" type="click" onEntry="this.font-weight='500';this.padding='12px 19px';this.line-height='1';">
65
66
  </lido-text>
66
- <lido-text visible="true" audio="" id="option2" onCorrect="this.border='5px solid green';this.cellBorderAnimate='#65BC46';" onInCorrect="this.vibrate='horizontal-shake';" font-family="'Baloo Bhai 2'" tab-index="3" font-size="62px" border-radius="12px" font-color="black" height="120px" width="788px" string="${args.option2}" value="${args.option2}" type="click" onEntry="this.font-weight='500';this.padding='0px 64px 0px 64px';">
67
+ <lido-text visible="true" audio="" disable-speak="true" id="option2" onCorrect="" onInCorrect="" font-family="'Baloo Bhai 2'" tab-index="3" font-size="54px" border-radius="12px" font-color="black" height="120px" width="873px" string="${args.option2}" value="${args.option2}" type="click" onEntry="this.font-weight='500';this.padding='12px 19px';this.line-height='1';">
67
68
  </lido-text>
68
- <lido-text visible="true" audio="" id="option3" font-family="'Baloo Bhai 2'" tab-index="4" font-size="62px" onCorrect="this.border='5px solid green';this.cellBorderAnimate='#65BC46';" onInCorrect="this.vibrate='horizontal-shake';" border-radius="12px" font-color="black" height="120px" width="788px" string="${args.option3}" value="${args.option3}" type="click" onEntry="this.font-weight='500';this.padding='0px 64px 0px 64px';">
69
+ <lido-text visible="true" audio="" disable-speak="true" id="option3" font-family="'Baloo Bhai 2'" tab-index="4" font-size="54px" onCorrect="" onInCorrect="" border-radius="12px" font-color="black" height="120px" width="873px" string="${args.option3}" value="${args.option3}" type="click" onEntry="this.font-weight='500';this.padding='12px 19px'; this.line-height='1';">
69
70
  </lido-text>
70
- <lido-text visible="true" audio="" id="option4" font-family="'Baloo Bhai 2'" tab-index="5" font-size="62px" border-radius="12px" font-color="black" height="120px" onCorrect="this.border='5px solid green';this.cellBorderAnimate='#65BC46';" onInCorrect="this.vibrate='horizontal-shake';" width="788px" string="${args.option4}" value="${args.option4}" type="click" onEntry="this.font-weight='500';this.padding='0px 64px 0px 64px';">
71
+ <lido-text visible="true" audio="" disable-speak="true" id="option4" font-family="'Baloo Bhai 2'" tab-index="5" font-size="54px" border-radius="12px" font-color="black" height="120px" onCorrect="" onInCorrect="" width="873px" string="${args.option4}" value="${args.option4}" type="click" onEntry="this.font-weight='500';this.padding='12px 19px';this.line-height='1';">
71
72
  </lido-text>
72
73
  </lido-cell>
73
74
 
package/dist/collection/stories/Templates/numberIdentification/numberIdentificationimageTotext.stories.js CHANGED
@@ -10,11 +10,13 @@ const meta = {
10
10
  answers: { control: 'text' },
11
11
  row: { control: 'text' },
12
12
  col: { control: 'text' },
13
+ PracticeMode: { control: 'boolean' },
13
14
  },
14
15
  };
15
16
  export default meta;
16
17
  export const numberIdentificationimageTotext = {
17
18
  args: {
19
+ PracticeMode: false,
18
20
  option1: "3",
19
21
  option2: "2",
20
22
  option3: "7",
@@ -32,7 +34,7 @@ export const numberIdentificationimageTotext = {
32
34
  function getContainerXml(args) {
33
35
  let tabCounter = 1;
34
36
  return `<main>
35
- <lido-container visible="true" id="lido-container" template-id="mcq" onInCorrect="lido-avatar.avatarAnimate='Fail';this.sleep='2000';" onCorrect="lido-avatar.avatarAnimate='Success';this.sleep='2300';" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/pal_number_identification/bgImage.png" objective="${args.answer}" is-continue-on-correct="true" is-allow-only-correct="true" onEntry="inst.speak='true';question.speak='true';text1.speak='true';text2.speak='true';text3.speak='true';text4.speak='true';">
37
+ <lido-container disable-speak="true" visible="true" id="lido-container" template-id="mcq" onInCorrect="lido-avatar.avatarAnimate='Fail';this.sleep='2000';" onCorrect="lido-avatar.avatarAnimate='Success';this.sleep='2300';" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/pal_number_identification/bgImage.png" objective="${args.answer}" is-continue-on-correct="${args.PracticeMode}" is-allow-only-correct="${args.PracticeMode}" onEntry="question.speak='true';text1.speak='true';text2.speak='true';text3.speak='true';text4.speak='true';">
36
38
  <!-- Chimple Avatar -->
37
39
  <lido-cell layout="pos" id="pos1" disable-edit="true" value="pos2" height="landscape.344px,portrait.402px" width="landscape.296px,portrait.398px" x="landscape.83%, portrait.28%" y="landscape.64%, portrait.77%" aria-hidden="true" z="1" bg-color="transparent" visible="true" onEntry="">
38
40
  <lido-avatar id="lido-avatar" disable-edit="true" visible="true" height="100%" width="100%" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/temp2/chimplecharacter.riv" alt-text="{chimpleCharacterRive}">
@@ -44,8 +46,8 @@ function getContainerXml(args) {
44
46
  <lido-text id="question" tab-index="2" visible="true" value="10" string="${args.question}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.84px" bg-color="transparent"
45
47
  onEntry="this.fontWeight='700';">
46
48
  </lido-text>
47
- <lido-cell visible="true" width="400px" bg-color="transparent" height="200px" onEntry="this.display='flex';this.align-items='center';" >
48
- <lido-math-matrix id="mat1" rows="${args.row}" cols="${args.col}" defualtFill="${args.answer}" leftIndex="false" topIndex="false" clickable="true" matrixImage="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/pal_number_identification/fruit.png" activeBgColor="transparent" inactiveBgColor="transparent" border="5px soild transparent" height="200px" width="400px" visible="true" margin="landscape.0,portrait.-26px 0px 0px 0px">
49
+ <lido-cell visible="true" width="500px" bg-color="transparent" height="300px" onEntry="this.display='flex';this.align-items='center';" >
50
+ <lido-math-matrix id="mat1" rows="${args.row}" cols="${args.col}" defualtFill="${args.answer}" leftIndex="false" topIndex="false" clickable="true" matrixImage="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/pal_number_identification/fruit.png" activeBgColor="transparent" inactiveBgColor="transparent" border="5px soild transparent" height="300px" width="500px" visible="true" margin="landscape.0,portrait.-26px 0px 0px 0px">
49
51
  </lido-math-matrix>
50
52
  </lido-cell>
51
53
 
@@ -56,14 +58,14 @@ function getContainerXml(args) {
56
58
 
57
59
  <lido-cell layout="row" visible="true" margin="" onEntry="this.border-radius='24px';" height="228px" width="landscape.280px,portrait.300px" bg-color="orange" type="click" value="${args.option1}">
58
60
 
59
- <lido-text id="text1" tab-index="3" visible="true" string="${args.option1}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.100px" bg-color="orange"
61
+ <lido-text id="text1" tab-index="3" disable-speak="true" visible="true" string="${args.option1}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.100px" bg-color="orange"
60
62
  onEntry="this.fontWeight='700';">
61
63
  </lido-text>
62
64
  </lido-cell>
63
65
 
64
66
  <lido-cell layout="row" visible="true" margin="" onEntry="this.border-radius='24px';" height="228px" width="landscape.280px,portrait.300px" bg-color="orange" type="click" value="${args.option2}">
65
67
 
66
- <lido-text id="text2" tab-index="4" visible="true" string="${args.option2}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.100px" bg-color="orange"
68
+ <lido-text id="text2" tab-index="4" disable-speak="true" visible="true" string="${args.option2}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.100px" bg-color="orange"
67
69
  onEntry="this.fontWeight='700';">
68
70
  </lido-text>
69
71
  </lido-cell>
@@ -71,14 +73,14 @@ function getContainerXml(args) {
71
73
 
72
74
  <lido-cell layout="row" visible="true" margin="" onEntry="this.border-radius='24px';" height="228px" width="landscape.280px,portrait.300px" bg-color="orange" type="click" value="${args.option3}">
73
75
 
74
- <lido-text id="text3" tab-index="5" visible="true" string="${args.option3}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.100px" bg-color="orange"
76
+ <lido-text id="text3" tab-index="5" disable-speak="true" visible="true" string="${args.option3}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.100px" bg-color="orange"
75
77
  onEntry="this.fontWeight='700';">
76
78
  </lido-text>
77
79
  </lido-cell>
78
80
 
79
81
  <lido-cell layout="row" visible="true" margin="" onEntry="this.border-radius='24px';" height="228px" width="landscape.280px,portrait.300px" bg-color="orange" type="click" value="${args.option4}">
80
82
 
81
- <lido-text id="text4" tab-index="6" visible="true" string="${args.option4}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.130px, portrait.100px" bg-color="orange"
83
+ <lido-text id="text4" tab-index="6" disable-speak="true" visible="true" string="${args.option4}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.130px, portrait.100px" bg-color="orange"
82
84
  onEntry="this.fontWeight='800';">
83
85
  </lido-text>
84
86
  </lido-cell>
package/dist/collection/stories/Templates/numberIdentification/numberIdentificationtextTotext.stories.js CHANGED
@@ -8,11 +8,13 @@ const meta = {
8
8
  option4: { control: 'text' },
9
9
  question: { control: 'text' },
10
10
  answer: { control: 'text' },
11
+ PracticeMode: { control: 'boolean' },
11
12
  },
12
13
  };
13
14
  export default meta;
14
15
  export const numberIdentificationtextTotext = {
15
16
  args: {
17
+ PracticeMode: false,
16
18
  option1: "333",
17
19
  option2: "256",
18
20
  option3: "777",
@@ -28,13 +30,13 @@ export const numberIdentificationtextTotext = {
28
30
  function getContainerXml(args) {
29
31
  let tabCounter = 1;
30
32
  return `<main>
31
- <lido-container visible="true" id="lido-container" template-id="mcq" onInCorrect="lido-avatar.avatarAnimate='Fail';this.sleep='2000';" onCorrect="lido-avatar.avatarAnimate='Success';this.sleep='2300';" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/pal_number_identification/bgImage.png" objective="${args.answer}" is-continue-on-correct="true" is-allow-only-correct="true" onEntry="inst.speak='true';question.speak='true';text1.speak='true';text2.speak='true';text3.speak='true';text4.speak='true';">
33
+ <lido-container disable-speak="true" visible="true" id="lido-container" template-id="mcq" onInCorrect="lido-avatar.avatarAnimate='Fail';this.sleep='2000';" onCorrect="lido-avatar.avatarAnimate='Success';this.sleep='2300';" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/pal_number_identification/bgImage.png" objective="${args.answer}" is-continue-on-correct="${args.PracticeMode}" is-allow-only-correct="${args.PracticeMode}" onEntry="question.speak='true';text1.speak='true';text2.speak='true';text3.speak='true';text4.speak='true';">
32
34
  <!-- Chimple Avatar -->
33
35
  <lido-cell layout="pos" id="pos1" disable-edit="true" value="pos2" height="landscape.344px,portrait.402px" width="landscape.296px,portrait.398px" x="landscape.83%, portrait.28%" y="landscape.64%, portrait.77%" aria-hidden="true" z="1" bg-color="transparent" visible="true" onEntry="">
34
36
  <lido-avatar id="lido-avatar" disable-edit="true" visible="true" height="100%" width="100%" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/temp2/chimplecharacter.riv" alt-text="{chimpleCharacterRive}">
35
37
  </lido-avatar>
36
38
  </lido-cell>
37
- <lido-text visible="false" id="inst" tab-index="1" string="choose the correct option" onEntry=""></lido-text>
39
+
38
40
  <!-- question text -->
39
41
  <lido-cell layout="row" visible="true" margin="landscape.26px 0px 155px 0px, portrait.-170px 0px 0px 0px" height="290px" width="landscape.1476px,portrait.100%" bg-color="#FFF5BB" onEntry="this.justifyContent='center';this.border='2px solid #FFA500'; this.borderRadius='16px';">
40
42
  <lido-text id="question" tab-index="2" visible="true" value="10" string="${args.question}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.80px, portrait.84px" bg-color="transparent"
@@ -49,14 +51,14 @@ function getContainerXml(args) {
49
51
 
50
52
  <lido-cell layout="row" visible="true" margin="" onEntry="this.border-radius='24px';" height="228px" width="landscape.280px,portrait.300px" bg-color="orange" type="click" value="${args.option1}">
51
53
 
52
- <lido-text id="text1" tab-index="3" visible="true" string="${args.option1}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.100px" bg-color="orange"
54
+ <lido-text id="text1" tab-index="3" visible="true" disable-speak="true" string="${args.option1}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.100px" bg-color="orange"
53
55
  onEntry="this.fontWeight='700';">
54
56
  </lido-text>
55
57
  </lido-cell>
56
58
 
57
59
  <lido-cell layout="row" visible="true" margin="" onEntry="this.border-radius='24px';" height="228px" width="landscape.280px,portrait.300px" bg-color="orange" type="click" value="${args.option2}">
58
60
 
59
- <lido-text id="text2" tab-index="4" visible="true" string="${args.option2}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.100px" bg-color="orange"
61
+ <lido-text id="text2" tab-index="4" disable-speak="true" visible="true" string="${args.option2}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.100px" bg-color="orange"
60
62
  onEntry="this.fontWeight='700';">
61
63
  </lido-text>
62
64
  </lido-cell>
@@ -64,14 +66,14 @@ function getContainerXml(args) {
64
66
 
65
67
  <lido-cell layout="row" visible="true" margin="" onEntry="this.border-radius='24px';" height="228px" width="landscape.280px,portrait.300px" bg-color="orange" type="click" value="${args.option3}">
66
68
 
67
- <lido-text id="text3" tab-index="5" visible="true" string="${args.option3}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.100px" bg-color="orange"
69
+ <lido-text id="text3" tab-index="5" disable-speak="true" visible="true" string="${args.option3}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.140px, portrait.100px" bg-color="orange"
68
70
  onEntry="this.fontWeight='700';">
69
71
  </lido-text>
70
72
  </lido-cell>
71
73
 
72
74
  <lido-cell layout="row" visible="true" margin="" onEntry="this.border-radius='24px';" height="228px" width="landscape.280px,portrait.300px" bg-color="orange" type="click" value="${args.option4}">
73
75
 
74
- <lido-text id="text4" tab-index="6" visible="true" string="${args.option4}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.130px, portrait.100px" bg-color="orange"
76
+ <lido-text id="text4" tab-index="6" disable-speak="true" visible="true" string="${args.option4}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.130px, portrait.100px" bg-color="orange"
75
77
  onEntry="this.fontWeight='800';">
76
78
  </lido-text>
77
79
  </lido-cell>
package/dist/collection/stories/Templates/palEgmaCalculateSum/palEgmaMultiOption.stories.js CHANGED
@@ -45,13 +45,14 @@ function getContainerXml(args) {
45
45
  .join('\n');
46
46
  const clickCells = options
47
47
  .map((digit, i) => `
48
- <lido-text id="click-${digit}" tab-index="${50 + i}" height="landscape.212px, portrait.125px" width="landscape.270px, portrait.90px" visible="true" value="${digit}" string="${digit}" font-family="'Baloo Bhai 2'" font-color="black" type="click" font-size="104px" bg-color="#FFAC4C" onEntry="this.fontWeight='800'; this.borderRadius='24px'; this.flex-shrink='0';" border-image="" onCorrect="" onInCorrect="" >
48
+ <lido-text id="click-${digit}" disable-speak="true" tab-index="${50 + i}" height="landscape.212px, portrait.125px" width="landscape.270px, portrait.90px" visible="true" value="${digit}" string="${digit}" font-family="'Baloo Bhai 2'" font-color="black" type="click" font-size="104px" bg-color="#FFAC4C" onEntry="this.fontWeight='800'; this.borderRadius='24px'; this.flex-shrink='0';" border-image="" onCorrect="" onInCorrect="" >
49
49
  </lido-text>
50
50
  `)
51
51
  .join('\n');
52
52
  return `
53
53
  <main>
54
- <lido-container id="lido-container" objective="${objective}" tab-index="1" show-drop-border="false" is-continue-on-correct="${isAllowOnlyCorrect}" is-allow-only-correct="${isAllowOnlyCorrect}" value="mainContainer1" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGMA/pal_egma_temp_3.png" height="100%" width="100%" bg-color="transparent" visible="true" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onEntry="this.justifyContent='space-around';" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" drop-action="infinite-drop" show-check="false">
54
+
55
+ <lido-container disable-speak="true" id="lido-container" objective="${objective}" tab-index="1" show-drop-border="false" is-continue-on-correct="${isAllowOnlyCorrect}" is-allow-only-correct="${isAllowOnlyCorrect}" value="mainContainer1" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGMA/pal_egma_temp_3.png" height="100%" width="100%" bg-color="transparent" visible="true" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onEntry="this.justifyContent='space-around'; invisibleText.speak='true';" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" drop-action="infinite-drop" show-check="false">
55
56
 
56
57
  <!-- Chimple Avatar -->
57
58
  <lido-cell layout="pos" id="pos1" disable-edit="true" value="pos1" height="landscape.600px, portrait.700px" width="landscape.393px, portrait.485px" x="landscape.1310px, portrait.450px" y="landscape.418px, portrait.1020px" aria-hidden="true" z="1" bg-color="transparent" visible="true" onEntry="this.flex-shrink='0';">
@@ -94,7 +95,7 @@ function getContainerXml(args) {
94
95
  </lido-cell>
95
96
 
96
97
 
97
- <!-- answers drag cell -->
98
+ <!-- answers click cell -->
98
99
  <!-- option row-->
99
100
  <lido-cell layout="landscape.row, portrait.wrap" id="option-row" aria-hidden="true" visible="true" height="landscape.15%,portrait.5%" width="landscape.90%, portrait.106%" bg-Color="transparent" margin="landscape.65px 0px 65px 0px,portrait.-160px -65px 500px 0px" onEntry="this.z-index='1'; this.justify-content='center'; this.opacity='1';" gap="landscape.20px,portrait.5px">
100
101
  ${clickCells}
package/dist/collection/stories/Templates/palEgmaCalculateSum/palEgmaSumTogether.stories.js CHANGED
@@ -43,14 +43,15 @@ function getContainerXml(args) {
43
43
  .join('\n');
44
44
  const dragCells = options
45
45
  .map((digit, i) => `
46
- <lido-text id="drag-${digit}" tab-index="${50 + i}" height="landscape.212px, portrait.125px" width="landscape.140px, portrait.90px" visible="true" value="${digit}" string="${digit}" font-family="'Baloo Bhai 2'" font-color="black" type="drag" font-size="104px" bg-color="#FFAC4C" onEntry="this.fontWeight='800'; this.borderRadius='16px'; this.flex-shrink='0';" border-image="" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';">
46
+ <lido-text id="drag-${digit}" disable-speak="true" tab-index="${50 + i}" height="landscape.212px, portrait.125px" width="landscape.140px, portrait.90px" visible="true" value="${digit}" string="${digit}" font-family="'Baloo Bhai 2'" font-color="black" type="drag" font-size="104px" bg-color="#FFAC4C" onEntry="this.fontWeight='800'; this.borderRadius='16px'; this.flex-shrink='0';" border-image="" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';">
47
47
  </lido-text>
48
48
  `)
49
49
  .join('\n');
50
50
  return `
51
51
  <main>
52
- <lido-container id="lido-container" objective="${objectiveString}" tab-index="1" template-id="dragAndDrop" show-drop-border="false" is-continue-on-correct="true" is-allow-only-correct="${isAllowOnlyCorrect}" value="mainContainer1" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGMA/pal_egma_temp_3.png" height="100%" width="100%" bg-color="transparent" visible="true" onCorrect="this.questionBoxAnimate='true'; lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onEntry="this.justifyContent='space-around'; invisibleText.speak='true';" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" drop-action="infinite-drop" show-check="false">
52
+ <lido-container id="lido-container" disable-speak="true" objective="${objectiveString}" tab-index="1" template-id="dragAndDrop" show-drop-border="false" is-continue-on-correct="${isAllowOnlyCorrect}" is-allow-only-correct="${isAllowOnlyCorrect}" value="mainContainer1" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGMA/pal_egma_temp_3.png" height="100%" width="100%" bg-color="transparent" visible="true" onCorrect="this.questionBoxAnimate='true'; lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onEntry="this.justifyContent='space-around'; invisibleText.speak='true';" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" drop-action="infinite-drop" show-check="false">
53
53
 
54
+
54
55
  <!-- Chimple Avatar -->
55
56
  <lido-cell layout="pos" id="pos1" disable-edit="true" value="pos1" height="landscape.600px, portrait.700px" width="landscape.393px, portrait.485px" x="landscape.1310px, portrait.450px" y="landscape.100px, portrait.1020px" aria-hidden="true" z="1" bg-color="transparent" visible="true" onEntry="this.flex-shrink='0';">
56
57
  <lido-avatar id="lido-avatar" disable-edit="true" visible="true" height="inherit" width="inherit" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/temp2/chimplecharacter.riv" altText="{chimpleCharacterRive}" onEntry="">
package/dist/collection/stories/Templates/palEgmaPatternMatching/palEgmaPatternMatching.stories.js CHANGED
@@ -25,35 +25,48 @@ function getContainerXml(args) {
25
25
  const question_cells = args.questions.map((q, index) => {
26
26
  const isHidden = q === null || q === void 0 ? void 0 : q.startsWith('@');
27
27
  const actualValue = isHidden ? q.slice(1) : q;
28
- const questionString = isHidden ? '? ' : q;
29
- // add comma except for last item
30
- const comma = index < args.questions.length - 1 ? ' ,' : '';
28
+ const spokenString = isHidden ? '?' : q;
29
+ const showComma = index < args.questions.length - 1;
31
30
  return `
32
- <lido-text
33
- visible="true" tab-index="${1 + index}"
34
- value="${actualValue}"
35
- string="${questionString}${comma}"
36
- font-family="'Baloo Bhai 2'"
37
- font-color="#07004E"
38
- font-size="landscape.130px, portrait.100px"
39
- bg-color=""
40
- onEntry="this.fontWeight='800';">
41
- </lido-text>
42
- `;
31
+ <lido-text id="pattern${1 + index}"
32
+ visible="true"
33
+ tab-index="${1 + index}"
34
+ value="${actualValue}"
35
+ string="${spokenString}"
36
+ font-family="'Baloo Bhai 2'"
37
+ font-color="#07004E"
38
+ font-size="landscape.130px, portrait.100px"
39
+ bg-color=""
40
+ onEntry="this.fontWeight='800';">
41
+ </lido-text>
42
+
43
+ ${showComma ? `
44
+ <lido-text onEntry="this.fontWeight='800';"
45
+ visible="true"
46
+ value=","
47
+ string=","
48
+ speak="false"
49
+ font-family="'Baloo Bhai 2'"
50
+ font-color="#07004E"
51
+ font-size="landscape.130px, portrait.100px"
52
+ bg-color="" >
53
+ </lido-text>
54
+ ` : ''}
55
+ `;
43
56
  }).join('');
44
- const opion_cells = args.options.map((q, index) => {
57
+ const option_cells = args.options.map((q, index) => {
45
58
  return `
46
59
  <lido-cell layout="row" id="text${1 + index}" visible="true" margin="" onEntry="this.border-radius='14px';" height="landscape.270px,portrait.244px" width="landscape.270px,portrait.244px" bg-color="orange" type="click" value="${q}">
47
- <lido-text visible="true" value="${q}" string="${q}" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.130px, portrait.100px" bg-color="orange" onEntry="this.fontWeight='800';">
60
+ <lido-text visible="true" value="${q}" string="${q}" disable-speak="true" font-family="'Baloo Bhai 2'" font-color="black" font-size="landscape.130px, portrait.100px" bg-color="orange" onEntry="this.fontWeight='800';">
48
61
  </lido-text>
49
62
  </lido-cell>
50
63
  `;
51
64
  }).join('');
52
65
  return `
53
66
  <main>
54
- <lido-container visible="true" id="lido-container" template-id="mcq" onInCorrect="lido-avatar.avatarAnimate='Fail';this.sleep='2000';" onCorrect="lido-avatar.avatarAnimate='Success';this.sleep='2300';" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGMA/Frame%2051.svg" objective="${(args.questions.find(q => q.startsWith('@')) || '').slice(1)}" is-continue-on-correct="${args.PracticeMode}" is-allow-only-correct="${args.PracticeMode}" custom-style= "#text {
67
+ <lido-container disable-speak="true" visible="true" id="lido-container" template-id="mcq" onInCorrect="lido-avatar.avatarAnimate='Fail';this.sleep='2000';" onCorrect="lido-avatar.avatarAnimate='Success';this.sleep='2300';" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGMA/Frame%2051.svg" objective="${(args.questions.find(q => q.startsWith('@')) || '').slice(1)}" is-continue-on-correct="${args.PracticeMode}" is-allow-only-correct="${args.PracticeMode}" custom-style= "#text {
55
68
  box-shadow: none !important;
56
- }" onEntry="questionText.speak='true';">
69
+ }" onEntry="questionText.speak='true'; pattern1.speak='true'; pattern2.speak='true'; pattern3.speak='true'; pattern4.speak='true'; pattern5.speak='true'">
57
70
  <!-- Chimple Avatar -->
58
71
  <lido-cell layout="pos" id="pos1" disable-edit="true" value="pos2" height="landscape.328px,portrait.378px" width="landscape.284px,portrait.382px" x="landscape.87%, portrait.30%" y="landscape.68%, portrait.78%" aria-hidden="true" z="1" bg-color="transparent" visible="true" onEntry="">
59
72
  <lido-avatar id="lido-avatar" disable-edit="true" visible="true" height="100%" width="100%" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/temp2/chimplecharacter.riv" alt-text="{chimpleCharacterRive}">
@@ -74,7 +87,7 @@ function getContainerXml(args) {
74
87
 
75
88
  <!-- options cells -->
76
89
  <lido-cell layout="landscape.row, portrait.col" visible="true" margin="landscape.0px 38px 0px 0px,portrait.0" onEntry="this.border-radius='26px';" height="landscape.290px,portrait.35%" width="landscape.86%,portrait.100%" bg-color="transparent">
77
- ${opion_cells}
90
+ ${option_cells}
78
91
  </lido-cell>
79
92
 
80
93
 
package/dist/collection/stories/Templates/palEgmaWordProblem/palEgmaWordProblem.stories.js CHANGED
@@ -23,14 +23,14 @@ export const palEgmaWordProblem1 = {
23
23
  function getContainerXml(args) {
24
24
  const dragCells = args.options
25
25
  .map((digit, i) => `
26
- <lido-text id="drag${i}" tab-index="${i}" height="landscape.190px, portrait.125px" width="landscape.125px, portrait.90px" visible="true" value="${digit}" string="${digit}" font-family="'Baloo Bhai 2'" font-color="black" type="drag" font-size="104px" bg-color="orange" onEntry="this.fontWeight='800'; this.borderRadius='10px'; this.flex-shrink='0';" border-image="">
26
+ <lido-text id="drag${i}" disable-speak="true" tab-index="${11 + i}" height="landscape.190px, portrait.125px" width="landscape.125px, portrait.90px" visible="true" value="${digit}" string="${digit}" font-family="'Baloo Bhai 2'" font-color="black" type="drag" font-size="104px" bg-color="orange" onEntry="this.fontWeight='800'; this.borderRadius='10px'; this.flex-shrink='0';" border-image="">
27
27
  </lido-text>
28
28
  `)
29
29
  .join('\n');
30
30
  const objectiveArray = args.answer.split('');
31
31
  const dropCells = objectiveArray
32
32
  .map((cell, i) => `
33
- <lido-text id="drop${i}" tab-index="${i}" disable-edit="true" height="landscape.190px, portrait.auto" width="125px" visible="true" value="${cell}" string="?" font-family="'Baloo Bhai 2'" font-color="black" type="drop" font-size="landscape.130px, portrait.100px" bg-color="white" onEntry="this.fontWeight='800'; this.borderRadius='20px'; this.border='4px solid #f69820'" border-image="">
33
+ <lido-text id="drop${i}" disable-edit="true" tab-index="${10 + i}" height="landscape.190px, portrait.auto" width="125px" visible="true" value="${cell}" string="?" font-family="'Baloo Bhai 2'" font-color="black" type="drop" font-size="landscape.130px, portrait.100px" bg-color="white" onEntry="this.fontWeight='800'; this.borderRadius='20px'; this.border='4px dashed #f34d08'" border-image="">
34
34
  </lido-text>
35
35
  `)
36
36
  .join('\n');
@@ -38,7 +38,7 @@ function getContainerXml(args) {
38
38
  return `
39
39
  <main>
40
40
 
41
- <lido-container id="lido-container" objective="${args.answer.split('').join(',')}" tab-index="" template-id="dragAndDrop" show-drop-border="false" is-allow-only-correct="${args.PracticeMode}" value="mainContainer1" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGMA/new.svg" height="100%" width="100%" bg-color="transparent" visible="true" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onEntry="" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" drop-action="infinite-drop" show-check="false" custom-style= "#question11 {
41
+ <lido-container id="lido-container" disable-speak="true" objective="${args.answer.split('').join(',')}" tab-index="" template-id="dragAndDrop" show-drop-border="false" is-allow-only-correct="${args.PracticeMode}" value="mainContainer1" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGMA/new.svg" height="100%" width="100%" bg-color="transparent" visible="true" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onEntry="question.speak='true'" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" drop-action="infinite-drop" show-check="false" custom-style= "#question11 {
42
42
  box-shadow: none !important;
43
43
  }">
44
44
 
@@ -88,7 +88,7 @@ export const palEgmaWordProblem2 = {
88
88
  function getContainerXml1(args) {
89
89
  const optionCells = args.options
90
90
  .map((digit, i) => `
91
- <lido-text id="drag${i}" tab-index="${i}" height="landscape.270px, portrait.125px" width="landscape.270px, portrait.90px" visible="true" value="${digit}" string="${digit}" font-family="'Baloo Bhai 2'" font-color="black" type="click" font-size="104px" bg-color="orange" onEntry="this.fontWeight='800'; this.borderRadius='10px'; this.flex-shrink='0';" border-image="">
91
+ <lido-text id="drag${i}" tab-index="${i + 1}" disable-speak="true" height="landscape.270px, portrait.125px" width="landscape.270px, portrait.90px" visible="true" value="${digit}" string="${digit}" font-family="'Baloo Bhai 2'" font-color="black" type="click" font-size="104px" bg-color="orange" onEntry="this.fontWeight='800'; this.borderRadius='10px'; this.flex-shrink='0';" border-image="">
92
92
  </lido-text>
93
93
  `)
94
94
  .join('\n');
@@ -96,7 +96,7 @@ function getContainerXml1(args) {
96
96
  return `
97
97
  <main>
98
98
 
99
- <lido-container id="lido-container" objective="${args.answer}" tab-index="" template-id="mcq" show-drop-border="false" is-continue-on-correct="${args.PracticeMode}" is-allow-only-correct="${args.PracticeMode}" value="mainContainer1" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGMA/new.svg" height="100%" width="100%" bg-color="transparent" visible="true" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onEntry="" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" drop-action="infinite-drop" show-check="false" custom-style= "#question11 {
99
+ <lido-container id="lido-container" objective="${args.answer}" tab-index="" template-id="mcq" show-drop-border="false" is-continue-on-correct="${args.PracticeMode}" is-allow-only-correct="${args.PracticeMode}" value="mainContainer1" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGMA/new.svg" height="100%" width="100%" bg-color="transparent" visible="true" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onEntry="question.speak='true'" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" drop-action="infinite-drop" show-check="false" custom-style= "#question11 {
100
100
  box-shadow: none !important;
101
101
  }">
102
102
 
package/dist/collection/stories/Templates/palEgraInventedSpelling/pal_egra_invented_spelling_schema.stories.js CHANGED
@@ -29,7 +29,10 @@ export const Default = {
29
29
  };
30
30
  function getContainerXml(args) {
31
31
  return `<main>
32
- <lido-container objective="${(args.correctAns).toLowerCase()}" is-continue-on-correct="${args.PracticeMode}" template-id="mcq" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/background-images/Picture%20meaning.png" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onInCorrect="lido-avatar.avatarAnimate='Fail';" onEntry="inventedAudio.speak='true';">
32
+ <lido-container disable-speak="true" id="lido-container" objective="${(args.correctAns).toLowerCase()}" is-continue-on-correct="${args.PracticeMode}" template-id="mcq" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/background-images/Picture%20meaning.png" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onInCorrect="lido-avatar.avatarAnimate='Fail';" onEntry="inventedAudio.speak='true';" custom-style = "#audioCell:active {
33
+ box-shadow: 0px 0px 0px !important;
34
+ transform: translateY(7px);
35
+ }" >
33
36
  <lido-cell visible="true" layout="col" width="80%" height="90%" bg-color="transparent">
34
37
  <!-- Chimple Avatar -->
35
38
  <lido-cell layout="pos" id="pos1" disable-edit="true" value="pos2" height="landscape.300px,portrait.402px" width="landscape.250px,portrait.398px" x="landscape.56%, portrait.28%" y="landscape.200px, portrait.77%" aria-hidden="true" z="1" bg-color="transparent" visible="true">
@@ -41,18 +44,18 @@ function getContainerXml(args) {
41
44
 
42
45
  <lido-text visible="true" string="Choose the rhyming word" tab-index="1" font-size="80px" font-color="#07004E" border-radius="16px" bg-color="#FFF5BB" onEntry="this.fontWeight='700'; this.border='#FFB612 2px solid'; this.padding='25px 50px';"></lido-text>
43
46
  <lido-text visible="false" id="inventedAudio" string="${args.correctAns}" tab-index="2" font-size="80px" font-color="#07004E" border-radius="16px" bg-color="#FFF5BB" onEntry="this.fontWeight='700'; this.border='#FFB612 2px solid'; this.padding='25px 50px';"></lido-text>
44
- <lido-cell visible="true" layout="row" width="160px" height="160px" onTouch="inventedAudio.speak='true';" bg-color="white" border-radius="70px" onEntry="this.border='#ffac4c 2px solid';">
47
+ <lido-cell visible="true" id="audioCell" layout="row" width="160px" height="160px" onTouch="inventedAudio.speak='true';" bg-color="white" border-radius="70px" onEntry="this.border='#ffac4c 2px solid'; this.boxShadow='0px 8px 0px #f34d08;'">
45
48
  <lido-image visible="true" bg-color="transparent" width="100px" height="100px" src="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/Icons/palAudioIcon.png"></lido-image>
46
49
  </lido-cell>
47
50
  <lido-cell layout="col" visible="true" width="100%" height="50%" bg-color="transparent" padding="0">
48
51
  <lido-cell layout="row" visible="true" width="70%" height="50%" bg-color="transparent">
49
- <lido-text visible="true" width="400px" height="136px" type="click" value="${(args.option1).toLowerCase()}" string="${args.option1}" font-size="110px" border-radius="20px" font-color="black" onEntry="this.fontWeight='700';"></lido-text>
50
- <lido-text visible="true" width="400px" height="136px" type="click" value="${(args.option2).toLowerCase()}" string="${args.option2}" font-size="110px" border-radius="20px" font-color="black" onEntry="this.fontWeight='700';"></lido-text>
52
+ <lido-text visible="true" disable-speak="true" width="400px" height="136px" type="click" value="${(args.option1).toLowerCase()}" string="${args.option1}" font-size="110px" border-radius="20px" font-color="black" onEntry="this.fontWeight='700';"></lido-text>
53
+ <lido-text visible="true" disable-speak="true" width="400px" height="136px" type="click" value="${(args.option2).toLowerCase()}" string="${args.option2}" font-size="110px" border-radius="20px" font-color="black" onEntry="this.fontWeight='700';"></lido-text>
51
54
  </lido-cell>
52
55
  <lido-cell layout="row" visible="true" width="100%" height="50%" bg-color="transparent">
53
- <lido-text visible="true" width="400px" height="136px" type="click" value="${(args.option3).toLowerCase()}" string="${args.option3}" font-size="110px" border-radius="20px" font-color="black" onEntry="this.fontWeight='700';"></lido-text>
54
- <lido-text visible="true" width="400px" height="136px" type="click" value="${(args.option4).toLowerCase()}" string="${args.option4}" font-size="110px" border-radius="20px" font-color="black" onEntry="this.fontWeight='700';"></lido-text>
55
- <lido-text visible="true" width="400px" height="136px" type="click" value="${(args.option5).toLowerCase()}" string="${args.option5}" font-size="110px" border-radius="20px" font-color="black" onEntry="this.fontWeight='700';"></lido-text>
56
+ <lido-text visible="true" disable-speak="true" width="400px" height="136px" type="click" value="${(args.option3).toLowerCase()}" string="${args.option3}" font-size="110px" border-radius="20px" font-color="black" onEntry="this.fontWeight='700';"></lido-text>
57
+ <lido-text visible="true" disable-speak="true" width="400px" height="136px" type="click" value="${(args.option4).toLowerCase()}" string="${args.option4}" font-size="110px" border-radius="20px" font-color="black" onEntry="this.fontWeight='700';"></lido-text>
58
+ <lido-text visible="true" disable-speak="true" width="400px" height="136px" type="click" value="${(args.option5).toLowerCase()}" string="${args.option5}" font-size="110px" border-radius="20px" font-color="black" onEntry="this.fontWeight='700';"></lido-text>
56
59
  </lido-cell>
57
60
  </lido-cell>
58
61
  </lido-cell>
package/dist/collection/stories/Templates/palEgraMCQWithImage/palEgraMCQWithImage.stories.js CHANGED
@@ -16,6 +16,7 @@ const meta = {
16
16
  audio4: { control: 'text' },
17
17
  optionImg4: { control: 'text' },
18
18
  correctAns: { control: 'text' },
19
+ isAllowOnlyCorrect: { control: 'boolean' },
19
20
  },
20
21
  };
21
22
  export default meta;
@@ -35,6 +36,7 @@ export const PalEgraMCQWithImage = {
35
36
  audio4: '',
36
37
  optionImg4: 'https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGRA/rat.png',
37
38
  correctAns: 'ELEPHANT',
39
+ isAllowOnlyCorrect: true,
38
40
  },
39
41
  render: args => {
40
42
  const xml = getContainerXml(args);
@@ -43,7 +45,7 @@ export const PalEgraMCQWithImage = {
43
45
  };
44
46
  function getContainerXml(args) {
45
47
  return `<main>
46
- <lido-container id="lido-container" value="maincontainer" objective="${args.correctAns}" aria-label="This is a multiple-option question. Select one option from the list." height="100vh" width="100vw" x="0" y="0" z="0" bg-color="transparent" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGRA/palEgraTemplate3.png" visible="true" audio="background1.mp3" onTouch="" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onEntry="" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" show-check="false" is-continue-on-correct="true">
48
+ <lido-container disable-speak="true" id="lido-container" tab-index="1" value="maincontainer" objective="${args.correctAns}" aria-label="This is a multiple-option question. Select one option from the list." height="100vh" width="100vw" x="0" y="0" z="0" bg-color="transparent" bg-image="https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/PAL-EGRA/palEgraTemplate3.png" visible="true" audio="background1.mp3" onTouch="" onCorrect="lido-avatar.avatarAnimate='Success'; this.sleep='2000';" onEntry="invisibleText.speak='true';" onInCorrect="lido-avatar.avatarAnimate='Fail'; this.sleep='2000';" show-check="false" is-continue-on-correct="${args.isAllowOnlyCorrect}" is-allow-only-correct="${args.isAllowOnlyCorrect}">
47
49
 
48
50
  <!-- Chimple Avatar -->
49
51
  <lido-cell layout="pos" id="pos1" disable-edit="true" value="pos1" height="350px" width="350px" x="landscape.1228px, portrait.273px" y="landscape.125px, portrait.1200px" aria-hidden="true" z="2" bg-color="transparent" type="" visible="true" audio="" onTouch="" onCorrect="" onEntry="this.animation='leftToPlace 1.5s linear';">
@@ -53,31 +55,32 @@ function getContainerXml(args) {
53
55
  </lido-image>
54
56
  </lido-cell>
55
57
 
58
+ <lido-text tab-index="2" id="invisibleText" value="click the correct option that describes the image shown in text." visible="false" width="1000px" height="100px" onEntry="this.boxShadow='unset'; this.fontWeight='700';" string="click the correct option that describes the image shown in text." font-family="'Baloo 2', serif" font-size="90px" font-color="black" bg-color="transparent" z="0" x="25px" y="20px" ></lido-text>
59
+
56
60
  <lido-cell visible="true" layout="col" width="100%" height="100%" bg-color="transparent">
57
61
  <!-- Question -->
58
62
  <lido-cell layout="flex" visible="true" width="518px" height="landscape.198px, portrait.25%" bg-color="#FFF5BB" onEntry="this.justifyContent='center'; this.borderRadius='16px'; this.alignContent='center'; this.animation='topToPlace 0.5s linear';" margin="landscape.75px 0px 0px 0px, portrait.0px 0px 0px 0px">
59
- <lido-text id="textA" tab-index="1" value="${args.question}" visible="true" width="1000px" height="100px" onEntry="this.boxShadow='unset'; this.fontWeight='700';" string="${args.question}" font-family="'Baloo 2', serif" font-size="90px" font-color="black" bg-color="transparent" z="0" x="25px" y="20px" onTouch="this.speak='true';"></lido-text>
63
+ <lido-text id="textA" tab-index="3" value="${args.question}" visible="true" width="1000px" height="100px" onEntry="this.boxShadow='unset'; this.fontWeight='700';" string="${args.question}" font-family="'Baloo 2', serif" font-size="90px" font-color="black" bg-color="transparent" z="0" x="25px" y="20px" onTouch="this.speak='true';"></lido-text>
60
64
  </lido-cell>
61
65
 
62
66
  <!-- Options -->
63
67
  <lido-cell layout="flex" visible="true" width="100%" height="90%" bg-color="transparent" onEntry="this.justifyContent='center'; this.alignContent='center'; this.animation='bottomToPlace 1s linear';" margin="landscape.-60px 0px -210px 0px, portrait.0px 0px 0px 0px">
64
68
  <lido-cell visible="true" layout="landscape.row, portrait.wrap" width="landscape.85%, portrait.73%" height="landscape.100%, portrait.auto" bg-color="transparent" gap="landscape.0px, portrait.55px" onEntry="">
65
- <lido-cell tab-index="2" type="click" visible="true" layout="col" bg-color="transparent" width="landscape.25%, portrait.100%" value="${args.option1}" height="50%" onEntry="this.borderRadius='25px'; this.padding='0';" onCorrect="this.cellBorderAnimate='#65BC46';" onInCorrect="this.vibrate='horizontal-shake';" audio='${args.audio1}' onTouch="this.speak='true';">
69
+ <lido-cell tab-index="4" type="click" visible="true" layout="col" bg-color="transparent" width="landscape.25%, portrait.100%" value="${args.option1}" height="50%" onEntry="this.borderRadius='25px'; this.padding='0';" onCorrect="" onInCorrect="" audio='${args.audio1}' onTouch="this.speak='true';">
66
70
  <lido-image visible="true" src="${args.optionImg1}" bg-color="transparent" width="90%" height="auto" border-radius="25px 25px 0 0" onEntry="this.marginTop='10px';"></lido-image>
67
71
  </lido-cell>
68
- <lido-cell tab-index="3" type="click" visible="true" layout="col" bg-color="transparent" width="landscape.25%, portrait.100%" value="${args.option2}" height="50%" onEntry="this.borderRadius='25px'; this.padding='0';" onCorrect="this.cellBorderAnimate='#65BC46';" onInCorrect="this.vibrate='horizontal-shake';" audio='${args.audio2}' onTouch="this.speak='true';">
72
+ <lido-cell tab-index="5" type="click" visible="true" layout="col" bg-color="transparent" width="landscape.25%, portrait.100%" value="${args.option2}" height="50%" onEntry="this.borderRadius='25px'; this.padding='0';" onCorrect="" onInCorrect="" audio='${args.audio2}' onTouch="this.speak='true';">
69
73
  <lido-image visible="true" src="${args.optionImg2}" bg-color="transparent" width="90%" height="auto" border-radius="25px 25px 0 0" onEntry="this.marginTop='10px';"></lido-image>
70
74
  </lido-cell>
71
- <lido-cell tab-index="4" type="click" visible="true" layout="col" bg-color="transparent" width="landscape.25%, portrait.100%" value="${args.option3}" height="50%" onEntry="this.borderRadius='25px'; this.padding='0';" margin="landscape.0, portrait.20px 0 0 0" onCorrect="this.cellBorderAnimate='#65BC46';" onInCorrect="this.vibrate='horizontal-shake';" audio='${args.audio3}' onTouch="this.speak='true';">
75
+ <lido-cell tab-index="6" type="click" visible="true" layout="col" bg-color="transparent" width="landscape.25%, portrait.100%" value="${args.option3}" height="50%" onEntry="this.borderRadius='25px'; this.padding='0';" margin="landscape.0, portrait.20px 0 0 0" onCorrect="" onInCorrect="" audio='${args.audio3}' onTouch="this.speak='true';">
72
76
  <lido-image visible="true" src="${args.optionImg3}" bg-color="transparent" width="90%" height="auto" border-radius="25px 25px 0 0" onEntry="this.marginTop='10px';"></lido-image>
73
77
  </lido-cell>
74
- <lido-cell tab-index="5" type="click" visible="true" layout="col" bg-color="transparent" width="landscape.25%, portrait.100%" value="${args.option4}" height="50%" onEntry="this.borderRadius='25px'; this.padding='0';" margin="landscape.0, portrait.20px 0 0 0" onCorrect="this.cellBorderAnimate='#65BC46';" onInCorrect="this.vibrate='horizontal-shake';" audio='${args.audio4}' onTouch="this.speak='true';">
78
+ <lido-cell tab-index="7" type="click" visible="true" layout="col" bg-color="transparent" width="landscape.25%, portrait.100%" value="${args.option4}" height="50%" onEntry="this.borderRadius='25px'; this.padding='0';" margin="landscape.0, portrait.20px 0 0 0" onCorrect="" onInCorrect="" audio='${args.audio4}' onTouch="this.speak='true';">
75
79
  <lido-image visible="true" src="${args.optionImg4}" bg-color="transparent" width="90%" height="auto" border-radius="25px 25px 0 0" onEntry="this.marginTop='10px';"></lido-image>
76
80
  </lido-cell>
77
81
  </lido-cell>
78
82
  </lido-cell>
79
-
80
- <lido-cell layout="flex" height="30%" width="100%" x="landscape.-50px, portrait.100px" y="507px" z="2" bg-color="transparent" type="" visible="landscape.false, portrait.true" audio="" onTouch="" onCorrect="" onEntry="this.justifyContent='center'; this.alignContent='center'; this.animation='leftToPlace 1.5s linear'; ">
83
+ <lido-cell layout="flex" height="30%" width="100%" x="landscape.-50px, portrait.100px" y="507px" z="2" bg-color="transparent" type="" visible="landscape.false, portrait.true" audio="" onTouch="" onCorrect="" onEntry="this.justifyContent='center'; this.alignContent='center'; this.animation='leftToPlace 1.5s linear'; ">
81
84
 
82
85
  </lido-cell>
83
86