@coorpacademy/components 10.26.0 → 10.26.1-alpha.1

package/lib/molecule/questions/mobile/switch/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["styleSheet","StyleSheet","create","cards","flexDirection","alignItems","card","flex","choice","paddingVertical","Switch","props","templateContext","useTemplateContext","analytics","store","focusedSelectId","handleBlur","handleFocus","type","template","isDisabled","choices","min","max","unit","value","step","onSliderChange","onItemPress","onItemInputChange","onInputValueChange","handleChoicePress","useCallback","onPress","handleItemInputChange","_value","handleSlidingComplete","logEvent","ANALYTICS_EVENT_TYPE","SLIDE","id","questionType","map","index","_id","selected","label","media","undefined","console","warn"],"sources":["../../../../../src/molecule/questions/mobile/switch/index.native.tsx"],"sourcesContent":["import React, {useCallback} from 'react';\nimport {View, StyleSheet, Text, ViewStyle} from 'react-native';\n\nimport QuestionChoice from '../../../../atom/choice/index.native';\nimport QuestionDraggable from '../draggable/index.native';\nimport QuestionTemplate from '../template/index.native';\nimport QuestionSlider from '../slider/index.native';\nimport FreeText from '../../free-text/index.native';\n\nimport {useTemplateContext} from '../../../../template/app-review/template-context';\nimport {ANALYTICS_EVENT_TYPE} from '../../../../variables/analytics';\n\nimport type {\n  QuestionType,\n  Choice,\n  TemplateListOfChoices,\n  TemplateTextChoice,\n  SelectableChoice\n} from '../../types';\n\nexport type Props = {\n  type: QuestionType;\n  isDisabled?: boolean;\n  template?: string;\n  choices?: Array<Choice>;\n  min?: number;\n  max?: number;\n  unit?: string;\n  step?: number;\n  value?: number;\n  onInputValueChange?: (value: string) => void;\n  onSliderChange?: (value: number) => void;\n  // --- mobile learner only\n  onItemInputChange?: (item: Choice, value: string) => void;\n  onItemPress?: (item: Choice) => void;\n};\n\ntype StyleSheetType = {\n  cards: ViewStyle;\n  card: ViewStyle;\n  choice: ViewStyle;\n};\n\nconst styleSheet: StyleSheetType = StyleSheet.create({\n  cards: {\n    flexDirection: 'row',\n    alignItems: 'stretch'\n  },\n  card: {\n    flex: 1\n  },\n  choice: {\n    paddingVertical: 5\n  }\n});\n\nconst Switch = (props: Props) => {\n  const templateContext = useTemplateContext();\n  const {analytics, store} = templateContext;\n  const {focusedSelectId, handleBlur, handleFocus} = store;\n\n  const {\n    type,\n    template,\n    isDisabled,\n    choices = [],\n    min,\n    max,\n    unit,\n    value,\n    step,\n    onSliderChange,\n    onItemPress,\n    onItemInputChange,\n    onInputValueChange\n  } = props;\n\n  const handleChoicePress = useCallback(\n    (choice: Choice) => () => {\n      if ((choice as SelectableChoice).onPress) {\n        // e.g. app-review\n        (choice as SelectableChoice).onPress();\n      } else if (onItemPress) {\n        // e.g. learner\n        onItemPress(choice);\n      }\n    },\n    [onItemPress]\n  );\n\n  const handleItemInputChange = useCallback(\n    (choice: Choice, _value: string) => {\n      if ((choice as SelectableChoice).onPress) {\n        // e.g. app-review\n        (choice as SelectableChoice).onPress(_value);\n      } else if (onItemInputChange) {\n        // e.g. learner\n        onItemInputChange(choice, _value);\n      }\n    },\n    [onItemInputChange]\n  );\n\n  const handleSlidingComplete = useCallback(\n    _value => {\n      analytics &&\n        analytics.logEvent(ANALYTICS_EVENT_TYPE.SLIDE, {\n          id: 'slider',\n          questionType: 'slider'\n        });\n\n      if (onSliderChange) {\n        onSliderChange(_value);\n      }\n    },\n    [analytics, onSliderChange]\n  );\n\n  switch (type) {\n    case 'qcm':\n      return (\n        <View testID=\"question-choices\">\n          {(choices as SelectableChoice[]).map((choice, index) => (\n            <QuestionChoice\n              key={`question-choice-${choice._id}`}\n              onPress={handleChoicePress(choice)}\n              isDisabled={isDisabled}\n              isSelected={choice.selected}\n              testID={`question-choice-${choice._id}`}\n              style={styleSheet.choice}\n              questionType={type}\n            >\n              {choice.label}\n            </QuestionChoice>\n          ))}\n        </View>\n      );\n    case 'qcmGraphic':\n      return (\n        <View testID=\"question-choices\">\n          {(choices as SelectableChoice[]).map((choice, index) => (\n            <QuestionChoice\n              key={`question-choice-${choice._id}`}\n              onPress={handleChoicePress(choice)}\n              media={choice.media}\n              isDisabled={isDisabled}\n              isSelected={choice.selected}\n              testID={`question-choice-${choice._id}`}\n              style={styleSheet.choice}\n              questionType={type}\n            >\n              {choice.label}\n            </QuestionChoice>\n          ))}\n        </View>\n      );\n    case 'slider': {\n      if (min === undefined || max === undefined) {\n        return <View />;\n      }\n\n      return (\n        <QuestionSlider\n          min={min}\n          max={max}\n          unit={unit}\n          value={value}\n          step={step}\n          onSlidingComplete={handleSlidingComplete}\n          testID=\"question-slider\"\n        />\n      );\n    }\n    case 'template':\n      if (handleBlur === undefined || handleFocus === undefined || focusedSelectId === undefined) {\n        // eslint-disable-next-line no-console\n        console.warn('type template must implement handleFocus etc within Context.store');\n        return <View />;\n      }\n\n      return (\n        <View testID=\"question-choices\">\n          <QuestionTemplate\n            isDisabled={isDisabled}\n            template={template || ''}\n            choices={choices as (TemplateListOfChoices | TemplateTextChoice)[]}\n            onInputChange={handleItemInputChange}\n            handleBlur={handleBlur}\n            handleFocus={handleFocus}\n            focusedSelectId={focusedSelectId}\n          />\n        </View>\n      );\n    case 'qcmDrag':\n      return (\n        <View testID=\"question-draggable\">\n          <QuestionDraggable choices={choices as SelectableChoice[]} onPress={handleChoicePress} />\n        </View>\n      );\n    case 'basic':\n      if (!onInputValueChange) {\n        return <View />;\n      }\n\n      return (\n        <FreeText\n          fullWidth\n          onChange={onInputValueChange}\n          testID=\"question-input-text\"\n          questionType=\"basic\"\n          isDisabled={isDisabled}\n        />\n      );\n    default:\n      return (\n        <View>\n          <Text>Unhandled type: {type}</Text>\n        </View>\n      );\n  }\n};\n\nexport default Switch;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["styleSheet","StyleSheet","create","cards","flexDirection","alignItems","card","flex","choice","paddingVertical","Switch","props","templateContext","useTemplateContext","analytics","store","focusedSelectId","handleBlur","handleFocus","type","template","isDisabled","choices","min","max","unit","value","step","onSliderChange","onItemPress","onItemInputChange","onInputValueChange","handleChoicePress","useCallback","onPress","handleItemInputChange","_value","handleSlidingComplete","logEvent","ANALYTICS_EVENT_TYPE","SLIDE","id","questionType","map","_id","selected","label","media","undefined","console","warn"],"sources":["../../../../../src/molecule/questions/mobile/switch/index.native.tsx"],"sourcesContent":["import React, {useCallback} from 'react';\nimport {View, StyleSheet, Text, ViewStyle} from 'react-native';\n\nimport QuestionChoice from '../../../../atom/choice/index.native';\nimport QuestionDraggable from '../draggable/index.native';\nimport QuestionTemplate from '../template/index.native';\nimport QuestionSlider from '../slider/index.native';\nimport FreeText from '../../free-text/index.native';\n\nimport {useTemplateContext} from '../../../../template/app-review/template-context';\nimport {ANALYTICS_EVENT_TYPE} from '../../../../variables/analytics';\n\nimport type {\n  QuestionType,\n  Choice,\n  TemplateListOfChoices,\n  TemplateTextChoice,\n  SelectableChoice\n} from '../../types';\n\nexport type Props = {\n  type: QuestionType;\n  isDisabled?: boolean;\n  template?: string;\n  choices?: Array<Choice>;\n  min?: number;\n  max?: number;\n  unit?: string;\n  step?: number;\n  value?: number;\n  onInputValueChange?: (value: string) => void;\n  onSliderChange?: (value: number) => void;\n  // --- mobile learner only\n  onItemInputChange?: (item: Choice, value: string) => void;\n  onItemPress?: (item: Choice) => void;\n};\n\ntype StyleSheetType = {\n  cards: ViewStyle;\n  card: ViewStyle;\n  choice: ViewStyle;\n};\n\nconst styleSheet: StyleSheetType = StyleSheet.create({\n  cards: {\n    flexDirection: 'row',\n    alignItems: 'stretch'\n  },\n  card: {\n    flex: 1\n  },\n  choice: {\n    paddingVertical: 5\n  }\n});\n\nconst Switch = (props: Props) => {\n  const templateContext = useTemplateContext();\n  const {analytics, store} = templateContext;\n  const {focusedSelectId, handleBlur, handleFocus} = store;\n\n  const {\n    type,\n    template,\n    isDisabled,\n    choices = [],\n    min,\n    max,\n    unit,\n    value,\n    step,\n    onSliderChange,\n    onItemPress,\n    onItemInputChange,\n    onInputValueChange\n  } = props;\n\n  const handleChoicePress = useCallback(\n    (choice: Choice) => () => {\n      if ((choice as SelectableChoice).onPress) {\n        // e.g. app-review\n        (choice as SelectableChoice).onPress();\n      } else if (onItemPress) {\n        // e.g. learner\n        onItemPress(choice);\n      }\n    },\n    [onItemPress]\n  );\n\n  const handleItemInputChange = useCallback(\n    (choice: Choice, _value: string) => {\n      if ((choice as SelectableChoice).onPress) {\n        // e.g. app-review\n        (choice as SelectableChoice).onPress(_value);\n      } else if (onItemInputChange) {\n        // e.g. learner\n        onItemInputChange(choice, _value);\n      }\n    },\n    [onItemInputChange]\n  );\n\n  const handleSlidingComplete = useCallback(\n    _value => {\n      analytics &&\n        analytics.logEvent(ANALYTICS_EVENT_TYPE.SLIDE, {\n          id: 'slider',\n          questionType: 'slider'\n        });\n\n      if (onSliderChange) {\n        onSliderChange(_value);\n      }\n    },\n    [analytics, onSliderChange]\n  );\n\n  switch (type) {\n    case 'qcm':\n      return (\n        <View testID=\"question-choices\">\n          {(choices as SelectableChoice[]).map(choice => (\n            <QuestionChoice\n              key={`question-choice-${choice._id}`}\n              onPress={handleChoicePress(choice)}\n              isDisabled={isDisabled}\n              isSelected={choice.selected}\n              testID={`question-choice-${choice._id}`}\n              style={styleSheet.choice}\n              questionType={type}\n            >\n              {choice.label}\n            </QuestionChoice>\n          ))}\n        </View>\n      );\n    case 'qcmGraphic':\n      return (\n        <View testID=\"question-choices\">\n          {(choices as SelectableChoice[]).map(choice => (\n            <QuestionChoice\n              key={`question-choice-${choice._id}`}\n              onPress={handleChoicePress(choice)}\n              media={choice.media}\n              isDisabled={isDisabled}\n              isSelected={choice.selected}\n              testID={`question-choice-${choice._id}`}\n              style={styleSheet.choice}\n              questionType={type}\n            >\n              {choice.label}\n            </QuestionChoice>\n          ))}\n        </View>\n      );\n    case 'slider': {\n      if (min === undefined || max === undefined) {\n        return <View />;\n      }\n\n      return (\n        <QuestionSlider\n          min={min}\n          max={max}\n          unit={unit}\n          value={value}\n          step={step}\n          onSlidingComplete={handleSlidingComplete}\n          testID=\"question-slider\"\n        />\n      );\n    }\n    case 'template':\n      if (handleBlur === undefined || handleFocus === undefined || focusedSelectId === undefined) {\n        // eslint-disable-next-line no-console\n        console.warn('type template must implement handleFocus etc within Context.store');\n        return <View />;\n      }\n\n      return (\n        <View testID=\"question-choices\">\n          <QuestionTemplate\n            isDisabled={isDisabled}\n            template={template || ''}\n            choices={choices as (TemplateListOfChoices | TemplateTextChoice)[]}\n            onInputChange={handleItemInputChange}\n            handleBlur={handleBlur}\n            handleFocus={handleFocus}\n            focusedSelectId={focusedSelectId}\n          />\n        </View>\n      );\n    case 'qcmDrag':\n      return (\n        <View testID=\"question-draggable\">\n          <QuestionDraggable choices={choices as SelectableChoice[]} onPress={handleChoicePress} />\n        </View>\n      );\n    case 'basic':\n      if (!onInputValueChange) {\n        return <View />;\n      }\n\n      return (\n        <FreeText\n          fullWidth\n          onChange={onInputValueChange}\n          testID=\"question-input-text\"\n          questionType=\"basic\"\n          isDisabled={isDisabled}\n        />\n      );\n    default:\n      return (\n        <View>\n          <Text>Unhandled type: {type}</Text>\n        </View>\n      );\n  }\n};\n\nexport default Switch;\n"],"mappings":"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"}

package/lib/molecule/questions/mobile/template/index.native.js

@@ -87,7 +87,7 @@ const Item = props => {
   const id = `question-part-${index + 1}`;
   const isFocused = focusedSelectId === id;
   const coloredText = brandTheme && {
-    color: brandTheme.colors.primary
+    color: brandTheme.colors?.primary
   };
 
   if (part.type === 'answerField' && inputNames.includes(part.value)) {
@@ -122,13 +122,13 @@ const Item = props => {
 
     const selectInputStyle = [styles.selectInput];
 
-    if (value) {
+    if (coloredText && value) {
       selectInputStyle.push(coloredText);
     }
 
     const selectTextStyle = [styles.selectText];
 
-    if (value) {
+    if (coloredText && value) {
       selectTextStyle.push(coloredText);
     }
 

package/lib/molecule/questions/mobile/template/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","container","width","flexDirection","flexWrap","justifyContent","alignItems","spaced","paddingVertical","spacing","tiny","htmlText","color","colors","black","fontWeight","bold","lineHeight","selectInput","padding","borderRadius","radius","regular","minWidth","marginHorizontal","BOX_STYLE","backgroundColor","white","selectText","gray","medium","fontSize","textAlign","Item","props","part","index","isDisabled","focusedSelectId","choices","onInputChange","handleBlur","handleFocus","styles","templateContext","useTemplateContext","brandTheme","translations","inputNames","map","choice","name","id","isFocused","coloredText","primary","type","includes","value","choiceIndex","findIndex","disabledSuffix","selectedSuffix","handleInputChange","_item","_value","selectInputStyle","push","selectTextStyle","items","selectAnAnswer","trim","QuestionTemplate","template","styleSheet","setStylesheet","useState","useEffect","_stylesheet","parts","parseTemplateString"],"sources":["../../../../../src/molecule/questions/mobile/template/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {TextStyle, View, ViewStyle} from 'react-native';\n\nimport trim from 'lodash/fp/trim';\n\nimport Html from '../../../../atom/html/index.native';\nimport Select from '../../../../atom/select-modal/index.native';\nimport Space from '../../../../atom/space/index.native';\nimport type {TemplateListOfChoices, TemplateTextChoice} from '../../types';\nimport FreeText from '../../free-text/index.native';\nimport {\n  FocusedSelectId,\n  HandleBlur,\n  HandleFocus,\n  useTemplateContext\n} from '../../../../template/app-review/template-context';\nimport {Theme} from '../../../../variables/theme.native';\nimport parseTemplateString from '../../../../util/parse-template-string';\nimport {BOX_STYLE} from '../../../../variables/shadow';\n\ntype StyleSheetType = {\n  container: ViewStyle;\n  spaced: ViewStyle;\n  htmlText: TextStyle;\n  selectInput: ViewStyle;\n  selectText: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType => ({\n  container: {\n    width: '100%',\n    flexDirection: 'row',\n    flexWrap: 'wrap',\n    justifyContent: 'center',\n    alignItems: 'center'\n  },\n  spaced: {\n    paddingVertical: theme.spacing.tiny\n  },\n  htmlText: {\n    color: theme.colors.black,\n    fontWeight: theme.fontWeight.bold,\n    lineHeight: 25\n  },\n  // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n  selectInput: {\n    padding: theme.spacing.tiny,\n    borderRadius: theme.radius.regular,\n    minWidth: 175,\n    marginHorizontal: 12,\n    paddingVertical: 16,\n    ...BOX_STYLE,\n    backgroundColor: theme.colors.white\n  },\n  selectText: {\n    color: theme.colors.gray.medium,\n    fontWeight: theme.fontWeight.bold,\n    fontSize: theme.fontSize.regular,\n    textAlign: 'center'\n  }\n});\n\ntype TemplatePart = {\n  type: 'string' | 'answerField';\n  value: string;\n};\n\ntype ItemProps = {\n  part: TemplatePart;\n  choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n  index: number;\n  isDisabled?: boolean;\n  onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n  focusedSelectId: FocusedSelectId;\n  handleBlur: HandleBlur;\n  handleFocus: HandleFocus;\n  styles: StyleSheetType;\n};\n\nconst Item = (props: ItemProps) => {\n  const {\n    part,\n    index,\n    isDisabled = false,\n    focusedSelectId,\n    choices,\n    onInputChange,\n    handleBlur,\n    handleFocus,\n    styles\n  } = props;\n\n  const templateContext = useTemplateContext();\n  const {theme, brandTheme, translations} = templateContext;\n\n  const inputNames = choices.map(choice => choice.name);\n  const id = `question-part-${index + 1}`;\n  const isFocused = focusedSelectId === id;\n\n  const coloredText = brandTheme && {\n    color: brandTheme.colors.primary\n  };\n\n  if (part.type === 'answerField' && inputNames.includes(part.value)) {\n    const choiceIndex = choices.findIndex(choice => choice.name === part.value);\n    const choice = choices[choiceIndex];\n    const {value} = choice;\n\n    if (!choice || !choice.type || !choice.name) {\n      return null;\n    }\n\n    const disabledSuffix = isDisabled ? '-disabled' : '';\n    const selectedSuffix = value ? '-selected' : '';\n\n    const handleInputChange = (_item: TemplateTextChoice | TemplateListOfChoices) => (\n      _value: string\n    ) => onInputChange(_item, _value);\n\n    if (choice.type === 'text') {\n      return (\n        <View style={styles.spaced} testID={id}>\n          <FreeText\n            key={id}\n            isDisabled={isDisabled}\n            onChange={handleInputChange(choice)}\n            value={value}\n            testID={`${id}-text${selectedSuffix}${disabledSuffix}`}\n            questionType=\"template\"\n          />\n        </View>\n      );\n    }\n\n    const selectInputStyle: ViewStyle[] = [styles.selectInput];\n    if (value) {\n      selectInputStyle.push(coloredText);\n    }\n\n    const selectTextStyle: ViewStyle[] = [styles.selectText];\n    if (value) {\n      selectTextStyle.push(coloredText);\n    }\n\n    if (choice.type === 'select') {\n      return (\n        <View style={styles.spaced} testID={id}>\n          <Select\n            isDisabled={isDisabled}\n            questionType=\"template\"\n            values={choice.items}\n            value={value}\n            placeholder={translations.selectAnAnswer}\n            isFocused={isFocused}\n            onBlur={handleBlur}\n            onFocus={handleFocus(id)}\n            onChange={handleInputChange(choice)}\n            textStyle={selectTextStyle}\n            style={selectInputStyle}\n            analyticsID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n            testID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n          />\n        </View>\n      );\n    }\n  }\n\n  return (\n    <Html key={id} fontSize={theme.fontSize.regular} testID={id} style={styles.htmlText}>\n      {trim(part.value || '')}\n    </Html>\n  );\n};\n\nexport type Props = {\n  isDisabled?: boolean;\n  template: string;\n  choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n  onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n  focusedSelectId: FocusedSelectId;\n  handleBlur: HandleBlur;\n  handleFocus: HandleFocus;\n};\n\nconst QuestionTemplate = (props: Props) => {\n  const {\n    template,\n    onInputChange,\n    choices,\n    handleBlur,\n    handleFocus,\n    focusedSelectId,\n    isDisabled = false\n  } = props;\n\n  const templateContext = useTemplateContext();\n  const {theme} = templateContext;\n\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  if (!template || !styleSheet) {\n    return null;\n  }\n\n  const parts: TemplatePart[] = parseTemplateString(template);\n\n  return (\n    <View style={styleSheet.container} testID=\"question-template\">\n      {parts.map((part, id) => (\n        <View key={`question-part-${id}`} style={{flexDirection: 'row'}}>\n          <Item\n            part={part}\n            choices={choices}\n            index={id}\n            focusedSelectId={focusedSelectId}\n            isDisabled={isDisabled}\n            handleBlur={handleBlur}\n            handleFocus={handleFocus}\n            onInputChange={onInputChange}\n            styles={styleSheet}\n          />\n          <Space type=\"micro\" />\n        </View>\n      ))}\n    </View>\n  );\n};\n\nexport default QuestionTemplate;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","container","width","flexDirection","flexWrap","justifyContent","alignItems","spaced","paddingVertical","spacing","tiny","htmlText","color","colors","black","fontWeight","bold","lineHeight","selectInput","padding","borderRadius","radius","regular","minWidth","marginHorizontal","BOX_STYLE","backgroundColor","white","selectText","gray","medium","fontSize","textAlign","Item","props","part","index","isDisabled","focusedSelectId","choices","onInputChange","handleBlur","handleFocus","styles","templateContext","useTemplateContext","brandTheme","translations","inputNames","map","choice","name","id","isFocused","coloredText","primary","type","includes","value","choiceIndex","findIndex","disabledSuffix","selectedSuffix","handleInputChange","_item","_value","selectInputStyle","push","selectTextStyle","items","selectAnAnswer","trim","QuestionTemplate","template","styleSheet","setStylesheet","useState","useEffect","_stylesheet","parts","parseTemplateString"],"sources":["../../../../../src/molecule/questions/mobile/template/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {TextStyle, View, ViewStyle} from 'react-native';\n\nimport trim from 'lodash/fp/trim';\n\nimport Html from '../../../../atom/html/index.native';\nimport Select from '../../../../atom/select-modal/index.native';\nimport Space from '../../../../atom/space/index.native';\nimport type {TemplateListOfChoices, TemplateTextChoice} from '../../types';\nimport FreeText from '../../free-text/index.native';\nimport {\n  FocusedSelectId,\n  HandleBlur,\n  HandleFocus,\n  useTemplateContext\n} from '../../../../template/app-review/template-context';\nimport {Theme} from '../../../../variables/theme.native';\nimport parseTemplateString from '../../../../util/parse-template-string';\nimport {BOX_STYLE} from '../../../../variables/shadow';\n\ntype StyleSheetType = {\n  container: ViewStyle;\n  spaced: ViewStyle;\n  htmlText: TextStyle;\n  selectInput: ViewStyle;\n  selectText: TextStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType => ({\n  container: {\n    width: '100%',\n    flexDirection: 'row',\n    flexWrap: 'wrap',\n    justifyContent: 'center',\n    alignItems: 'center'\n  },\n  spaced: {\n    paddingVertical: theme.spacing.tiny\n  },\n  htmlText: {\n    color: theme.colors.black,\n    fontWeight: theme.fontWeight.bold,\n    lineHeight: 25\n  },\n  // eslint-disable-next-line @coorpacademy/coorpacademy/no-overwriting-spread\n  selectInput: {\n    padding: theme.spacing.tiny,\n    borderRadius: theme.radius.regular,\n    minWidth: 175,\n    marginHorizontal: 12,\n    paddingVertical: 16,\n    ...BOX_STYLE,\n    backgroundColor: theme.colors.white\n  },\n  selectText: {\n    color: theme.colors.gray.medium,\n    fontWeight: theme.fontWeight.bold,\n    fontSize: theme.fontSize.regular,\n    textAlign: 'center'\n  }\n});\n\ntype TemplatePart = {\n  type: 'string' | 'answerField';\n  value: string;\n};\n\ntype ItemProps = {\n  part: TemplatePart;\n  choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n  index: number;\n  isDisabled?: boolean;\n  onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n  focusedSelectId: FocusedSelectId;\n  handleBlur: HandleBlur;\n  handleFocus: HandleFocus;\n  styles: StyleSheetType;\n};\n\nconst Item = (props: ItemProps) => {\n  const {\n    part,\n    index,\n    isDisabled = false,\n    focusedSelectId,\n    choices,\n    onInputChange,\n    handleBlur,\n    handleFocus,\n    styles\n  } = props;\n\n  const templateContext = useTemplateContext();\n  const {theme, brandTheme, translations} = templateContext;\n\n  const inputNames = choices.map(choice => choice.name);\n  const id = `question-part-${index + 1}`;\n  const isFocused = focusedSelectId === id;\n\n  const coloredText = brandTheme && {\n    color: brandTheme.colors?.primary\n  };\n\n  if (part.type === 'answerField' && inputNames.includes(part.value)) {\n    const choiceIndex = choices.findIndex(choice => choice.name === part.value);\n    const choice = choices[choiceIndex];\n    const {value} = choice;\n\n    if (!choice || !choice.type || !choice.name) {\n      return null;\n    }\n\n    const disabledSuffix = isDisabled ? '-disabled' : '';\n    const selectedSuffix = value ? '-selected' : '';\n\n    const handleInputChange =\n      (_item: TemplateTextChoice | TemplateListOfChoices) => (_value: string) =>\n        onInputChange(_item, _value);\n\n    if (choice.type === 'text') {\n      return (\n        <View style={styles.spaced} testID={id}>\n          <FreeText\n            key={id}\n            isDisabled={isDisabled}\n            onChange={handleInputChange(choice)}\n            value={value}\n            testID={`${id}-text${selectedSuffix}${disabledSuffix}`}\n            questionType=\"template\"\n          />\n        </View>\n      );\n    }\n\n    const selectInputStyle: TextStyle[] = [styles.selectInput];\n    if (coloredText && value) {\n      selectInputStyle.push(coloredText);\n    }\n\n    const selectTextStyle: TextStyle[] = [styles.selectText];\n    if (coloredText && value) {\n      selectTextStyle.push(coloredText);\n    }\n\n    if (choice.type === 'select') {\n      return (\n        <View style={styles.spaced} testID={id}>\n          <Select\n            isDisabled={isDisabled}\n            questionType=\"template\"\n            values={choice.items}\n            value={value}\n            placeholder={translations.selectAnAnswer}\n            isFocused={isFocused}\n            onBlur={handleBlur}\n            onFocus={handleFocus(id)}\n            onChange={handleInputChange(choice)}\n            textStyle={selectTextStyle}\n            style={selectInputStyle}\n            analyticsID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n            testID={`${id}-select${selectedSuffix}${disabledSuffix}`}\n          />\n        </View>\n      );\n    }\n  }\n\n  return (\n    <Html key={id} fontSize={theme.fontSize.regular} testID={id} style={styles.htmlText}>\n      {trim(part.value || '')}\n    </Html>\n  );\n};\n\nexport type Props = {\n  isDisabled?: boolean;\n  template: string;\n  choices: Array<TemplateTextChoice | TemplateListOfChoices>;\n  onInputChange: (item: TemplateTextChoice | TemplateListOfChoices, value: string) => void;\n  focusedSelectId: FocusedSelectId;\n  handleBlur: HandleBlur;\n  handleFocus: HandleFocus;\n};\n\nconst QuestionTemplate = (props: Props) => {\n  const {\n    template,\n    onInputChange,\n    choices,\n    handleBlur,\n    handleFocus,\n    focusedSelectId,\n    isDisabled = false\n  } = props;\n\n  const templateContext = useTemplateContext();\n  const {theme} = templateContext;\n\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  if (!template || !styleSheet) {\n    return null;\n  }\n\n  const parts: TemplatePart[] = parseTemplateString(template);\n\n  return (\n    <View style={styleSheet.container} testID=\"question-template\">\n      {parts.map((part, id) => (\n        <View key={`question-part-${id}`} style={{flexDirection: 'row'}}>\n          <Item\n            part={part}\n            choices={choices}\n            index={id}\n            focusedSelectId={focusedSelectId}\n            isDisabled={isDisabled}\n            handleBlur={handleBlur}\n            handleFocus={handleFocus}\n            onInputChange={onInputChange}\n            styles={styleSheet}\n          />\n          <Space type=\"micro\" />\n        </View>\n      ))}\n    </View>\n  );\n};\n\nexport default QuestionTemplate;\n"],"mappings":"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"}

package/lib/molecule/questions/types.d.ts

@@ -1,14 +1,14 @@
 import { ChoiceItem } from '../../atom/select-modal/index.native';
 declare type Url = string;
 declare type VideoMimeType = 'application/kontiki' | 'application/jwplayer' | 'application/youtube' | 'application/omniPlayer' | 'application/vimeo';
-declare type ResourceMimeType = 'video/mp4' | 'image/jpeg' | 'image/png' | 'application/pdf' | VideoMimeType;
+declare type ResourceMimeType = 'video/mp4' | 'audio/acc' | 'image/jpeg' | 'image/png' | 'application/pdf' | VideoMimeType;
 export declare type Source = {
     _id?: string;
     mimeType?: ResourceMimeType;
     url: Url;
     videoId?: string;
 };
-export declare type MediaType = 'img' | 'video' | 'pdf';
+export declare type MediaType = 'img' | 'audio' | 'video' | 'pdf';
 export declare type Media = {
     type?: MediaType;
     description?: string;
@@ -19,6 +19,13 @@ export declare type Media = {
     subtitles?: Array<string>;
     posters?: Array<Url>;
     src?: Array<Source>;
+    poster?: string;
+    videoId?: string;
+    onClick?: () => void;
+    onPlay?: () => void;
+    onPause?: () => void;
+    onResume?: () => void;
+    onEnded?: () => void;
 };
 export declare type QuestionType = 'qcm' | 'qcmGraphic' | 'slider' | 'qcmDrag' | 'basic' | 'template';
 declare type ChoiceBase = {
@@ -31,7 +38,7 @@ export declare type SelectableChoice = {
     _id: string;
     label: string;
     selected: boolean;
-    onPress: Function;
+    onPress: (value?: string) => void;
     media?: Media;
 };
 export declare type TemplateTextChoice = {

package/lib/molecule/questions/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/questions/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAC,MAAM,sCAAsC,CAAC;AAEhE,aAAK,GAAG,GAAG,MAAM,CAAC;AAElB,aAAK,aAAa,GACd,qBAAqB,GACrB,sBAAsB,GACtB,qBAAqB,GACrB,wBAAwB,GACxB,mBAAmB,CAAC;AAExB,aAAK,gBAAgB,GACjB,WAAW,GACX,YAAY,GACZ,WAAW,GACX,iBAAiB,GACjB,aAAa,CAAC;AAElB,oBAAY,MAAM,GAAG;IACnB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAC5B,GAAG,EAAE,GAAG,CAAC;IACT,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,oBAAY,SAAS,GAAG,KAAK,GAAG,OAAO,GAAG,KAAK,CAAC;AAEhD,oBAAY,KAAK,GAAG;IAClB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAC5B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,SAAS,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACrB,GAAG,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;CACrB,CAAC;AAEF,oBAAY,YAAY,GAAG,KAAK,GAAG,YAAY,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,CAAC;AAE9F,aAAK,UAAU,GAAG;IAChB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,oBAAY,gBAAgB,GAAG;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,QAAQ,CAAC;IAClB,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,CAAC;AAEF,oBAAY,kBAAkB,GAAG;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,oBAAY,qBAAqB,GAAG;IAClC,IAAI,EAAE,QAAQ,CAAC;IACf,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;CAC1B,CAAC;AAEF,oBAAY,MAAM,GAAG,UAAU,GAAG,gBAAgB,GAAG,qBAAqB,GAAG,kBAAkB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/molecule/questions/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,UAAU,EAAC,MAAM,sCAAsC,CAAC;AAEhE,aAAK,GAAG,GAAG,MAAM,CAAC;AAElB,aAAK,aAAa,GACd,qBAAqB,GACrB,sBAAsB,GACtB,qBAAqB,GACrB,wBAAwB,GACxB,mBAAmB,CAAC;AAExB,aAAK,gBAAgB,GACjB,WAAW,GACX,WAAW,GACX,YAAY,GACZ,WAAW,GACX,iBAAiB,GACjB,aAAa,CAAC;AAElB,oBAAY,MAAM,GAAG;IACnB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAC5B,GAAG,EAAE,GAAG,CAAC;IACT,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,oBAAY,SAAS,GAAG,KAAK,GAAG,OAAO,GAAG,OAAO,GAAG,KAAK,CAAC;AAE1D,oBAAY,KAAK,GAAG;IAClB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,gBAAgB,CAAC;IAC5B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,GAAG,CAAC;IACf,GAAG,CAAC,EAAE,GAAG,CAAC;IACV,SAAS,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IAC1B,OAAO,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACrB,GAAG,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,oBAAY,YAAY,GAAG,KAAK,GAAG,YAAY,GAAG,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,UAAU,CAAC;AAE9F,aAAK,UAAU,GAAG;IAChB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,oBAAY,gBAAgB,GAAG;IAC7B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,OAAO,EAAE,CAAC,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,KAAK,CAAC;CACf,CAAC;AAEF,oBAAY,kBAAkB,GAAG;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,oBAAY,qBAAqB,GAAG;IAClC,IAAI,EAAE,QAAQ,CAAC;IACf,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,KAAK,CAAC,UAAU,CAAC,CAAC;CAC1B,CAAC;AAEF,oBAAY,MAAM,GAAG,UAAU,GAAG,gBAAgB,GAAG,qBAAqB,GAAG,kBAAkB,CAAC"}

package/lib/molecule/questions/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../src/molecule/questions/types.ts"],"sourcesContent":["import {ChoiceItem} from '../../atom/select-modal/index.native';\n\ntype Url = string;\n\ntype VideoMimeType =\n  | 'application/kontiki'\n  | 'application/jwplayer'\n  | 'application/youtube'\n  | 'application/omniPlayer'\n  | 'application/vimeo';\n\ntype ResourceMimeType =\n  | 'video/mp4'\n  | 'image/jpeg'\n  | 'image/png'\n  | 'application/pdf'\n  | VideoMimeType;\n\nexport type Source = {\n  _id?: string;\n  mimeType?: ResourceMimeType;\n  url: Url;\n  videoId?: string;\n};\n\nexport type MediaType = 'img' | 'video' | 'pdf';\n\nexport type Media = {\n  type?: MediaType;\n  description?: string;\n  mimeType?: ResourceMimeType;\n  _id?: string;\n  mediaUrl?: Url;\n  url?: Url;\n  subtitles?: Array<string>;\n  posters?: Array<Url>;\n  src?: Array<Source>;\n};\n\nexport type QuestionType = 'qcm' | 'qcmGraphic' | 'slider' | 'qcmDrag' | 'basic' | 'template';\n\ntype ChoiceBase = {\n  _id: string;\n  value?: string;\n  name?: string;\n  label?: string;\n};\n\nexport type SelectableChoice = {\n  _id: string;\n  label: string;\n  selected: boolean;\n  onPress: Function;\n  media?: Media;\n};\n\nexport type TemplateTextChoice = {\n  type: 'text';\n  _id: string;\n  name: string;\n  value: string;\n  label: string;\n  selected: boolean;\n};\n\nexport type TemplateListOfChoices = {\n  type: 'select';\n  _id: string;\n  name: string;\n  value: string;\n  label: string;\n  items: Array<ChoiceItem>;\n};\n\nexport type Choice = ChoiceBase | SelectableChoice | TemplateListOfChoices | TemplateTextChoice;\n"],"mappings":""}
+{"version":3,"file":"types.js","names":[],"sources":["../../../src/molecule/questions/types.ts"],"sourcesContent":["import {ChoiceItem} from '../../atom/select-modal/index.native';\n\ntype Url = string;\n\ntype VideoMimeType =\n  | 'application/kontiki'\n  | 'application/jwplayer'\n  | 'application/youtube'\n  | 'application/omniPlayer'\n  | 'application/vimeo';\n\ntype ResourceMimeType =\n  | 'video/mp4'\n  | 'audio/acc'\n  | 'image/jpeg'\n  | 'image/png'\n  | 'application/pdf'\n  | VideoMimeType;\n\nexport type Source = {\n  _id?: string;\n  mimeType?: ResourceMimeType;\n  url: Url;\n  videoId?: string;\n};\n\nexport type MediaType = 'img' | 'audio' | 'video' | 'pdf';\n\nexport type Media = {\n  type?: MediaType;\n  description?: string;\n  mimeType?: ResourceMimeType;\n  _id?: string;\n  mediaUrl?: Url;\n  url?: Url;\n  subtitles?: Array<string>;\n  posters?: Array<Url>;\n  src?: Array<Source>;\n  poster?: string;\n  videoId?: string;\n  onClick?: () => void;\n  onPlay?: () => void;\n  onPause?: () => void;\n  onResume?: () => void;\n  onEnded?: () => void;\n};\n\nexport type QuestionType = 'qcm' | 'qcmGraphic' | 'slider' | 'qcmDrag' | 'basic' | 'template';\n\ntype ChoiceBase = {\n  _id: string;\n  value?: string;\n  name?: string;\n  label?: string;\n};\n\nexport type SelectableChoice = {\n  _id: string;\n  label: string;\n  selected: boolean;\n  onPress: (value?: string) => void;\n  media?: Media;\n};\n\nexport type TemplateTextChoice = {\n  type: 'text';\n  _id: string;\n  name: string;\n  value: string;\n  label: string;\n  selected: boolean;\n};\n\nexport type TemplateListOfChoices = {\n  type: 'select';\n  _id: string;\n  name: string;\n  value: string;\n  label: string;\n  items: Array<ChoiceItem>;\n};\n\nexport type Choice = ChoiceBase | SelectableChoice | TemplateListOfChoices | TemplateTextChoice;\n"],"mappings":""}

package/lib/organism/header-v2/index.native.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
 import { GestureResponderEvent } from 'react-native';
 export interface Props {
-    onSearchPress: (event: GestureResponderEvent) => any;
-    onSettingsPress: (event: GestureResponderEvent) => any;
-    onLogoLongPress: (event: GestureResponderEvent) => any;
+    onSearchPress: (event: GestureResponderEvent) => void;
+    onSettingsPress: (event: GestureResponderEvent) => void;
+    onLogoLongPress: (event: GestureResponderEvent) => void;
 }
 export declare const HEADER_HEIGHT = 67;
 declare const Header: (props: Props) => JSX.Element | null;

package/lib/organism/header-v2/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/header-v2/index.native.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAmB,qBAAqB,EAAY,MAAM,cAAc,CAAC;AAWhF,MAAM,WAAW,KAAK;IACpB,aAAa,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,GAAG,CAAC;IACrD,eAAe,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,GAAG,CAAC;IACvD,eAAe,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,GAAG,CAAC;CACxD;AAED,eAAO,MAAM,aAAa,KAAK,CAAC;AA0ChC,QAAA,MAAM,MAAM,UAAW,KAAK,uBAyD3B,CAAC;AAEF,eAAe,MAAM,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/header-v2/index.native.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAmB,qBAAqB,EAAY,MAAM,cAAc,CAAC;AAWhF,MAAM,WAAW,KAAK;IACpB,aAAa,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACtD,eAAe,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;IACxD,eAAe,EAAE,CAAC,KAAK,EAAE,qBAAqB,KAAK,IAAI,CAAC;CACzD;AAED,eAAO,MAAM,aAAa,KAAK,CAAC;AA0ChC,QAAA,MAAM,MAAM,UAAW,KAAK,uBAyD3B,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/lib/organism/header-v2/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["HEADER_HEIGHT","ICON_WIDTH","createStyleSheet","theme","StyleSheet","create","container","position","backgroundColor","colors","white","flexDirection","alignItems","justifyContent","height","top","width","icons","icon","marginRight","logo","marginLeft","gradient","left","right","opacity","Header","props","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","onSearchPress","onSettingsPress","onLogoLongPress","logoHeight","spacing","small","useEffect","_stylesheet","tiny","gray","medium","light","dark"],"sources":["../../../src/organism/header-v2/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\n\nimport {View, StyleSheet, GestureResponderEvent, ViewStyle} from 'react-native';\nimport {\n  NovaCompositionCoorpacademySearch as SearchIcon,\n  NovaCompositionCoorpacademyCog as SettingsIcon\n} from '@coorpacademy/nova-icons';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport BrandLogo from '../../molecule/brand-logo/index.native';\nimport Gradient from '../../atom/gradient/index.native';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {Theme} from '../../variables/theme.native';\n\nexport interface Props {\n  onSearchPress: (event: GestureResponderEvent) => any;\n  onSettingsPress: (event: GestureResponderEvent) => any;\n  onLogoLongPress: (event: GestureResponderEvent) => any;\n}\n\nexport const HEADER_HEIGHT = 67;\nconst ICON_WIDTH = 20;\n\ntype StyleSheetType = {\n  container: ViewStyle;\n  icons: ViewStyle;\n  icon: ViewStyle;\n  logo: ViewStyle;\n  gradient: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme) =>\n  StyleSheet.create({\n    container: {\n      position: 'absolute',\n      backgroundColor: theme.colors.white,\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      height: HEADER_HEIGHT,\n      top: 0,\n      width: '100%'\n    },\n    icons: {\n      flexDirection: 'row'\n    },\n    icon: {\n      marginRight: 16\n    },\n    logo: {\n      width: 80,\n      marginLeft: 16\n    },\n    gradient: {\n      position: 'absolute',\n      left: 0,\n      top: HEADER_HEIGHT,\n      right: 0,\n      opacity: 0.3\n    }\n  });\n\nconst Header = (props: Props) => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme} = templateContext;\n\n  const {onSearchPress, onSettingsPress, onLogoLongPress} = props;\n  const logoHeight = HEADER_HEIGHT - theme.spacing.small * 2;\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  // ------------------------------------\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <View style={[styleSheet.container]} testID=\"header\">\n      <Gradient\n        height={theme.spacing.tiny}\n        colors={[theme.colors.gray.medium, theme.colors.gray.light]}\n        transparencyPosition=\"bottom\"\n        style={styleSheet.gradient}\n      />\n      <View style={styleSheet.logo}>\n        <Touchable\n          testID=\"header-logo\"\n          onLongPress={onLogoLongPress}\n          analyticsID=\"sign-out\"\n          isWithoutFeedback\n        >\n          <BrandLogo height={logoHeight} />\n        </Touchable>\n      </View>\n      <View style={[styleSheet.icons]}>\n        <Touchable testID=\"search-icon\" onPress={onSearchPress} analyticsID=\"search-icon\">\n          <SearchIcon\n            height={ICON_WIDTH}\n            width={ICON_WIDTH}\n            color={theme.colors.gray.dark}\n            style={styleSheet.icon}\n          />\n        </Touchable>\n        <Touchable testID=\"settings-icon\" onPress={onSettingsPress} analyticsID=\"settings-icon\">\n          <SettingsIcon\n            height={ICON_WIDTH}\n            width={ICON_WIDTH}\n            color={theme.colors.gray.dark}\n            style={styleSheet.icon}\n          />\n        </Touchable>\n      </View>\n    </View>\n  );\n};\n\nexport default Header;\n"],"mappings":";;;;;AAAA;;AAEA;;AACA;;AAIA;;AACA;;AACA;;AACA;;;;;;;;AASO,MAAMA,aAAa,GAAG,EAAtB;;AACP,MAAMC,UAAU,GAAG,EAAnB;;AAUA,MAAMC,gBAAgB,GAAIC,KAAD,IACvBC,uBAAA,CAAWC,MAAX,CAAkB;EAChBC,SAAS,EAAE;IACTC,QAAQ,EAAE,UADD;IAETC,eAAe,EAAEL,KAAK,CAACM,MAAN,CAAaC,KAFrB;IAGTC,aAAa,EAAE,KAHN;IAITC,UAAU,EAAE,QAJH;IAKTC,cAAc,EAAE,eALP;IAMTC,MAAM,EAAEd,aANC;IAOTe,GAAG,EAAE,CAPI;IAQTC,KAAK,EAAE;EARE,CADK;EAWhBC,KAAK,EAAE;IACLN,aAAa,EAAE;EADV,CAXS;EAchBO,IAAI,EAAE;IACJC,WAAW,EAAE;EADT,CAdU;EAiBhBC,IAAI,EAAE;IACJJ,KAAK,EAAE,EADH;IAEJK,UAAU,EAAE;EAFR,CAjBU;EAqBhBC,QAAQ,EAAE;IACRf,QAAQ,EAAE,UADF;IAERgB,IAAI,EAAE,CAFE;IAGRR,GAAG,EAAEf,aAHG;IAIRwB,KAAK,EAAE,CAJC;IAKRC,OAAO,EAAE;EALD;AArBM,CAAlB,CADF;;AA+BA,MAAMC,MAAM,GAAIC,KAAD,IAAkB;EAC/B,MAAMC,eAAe,GAAG,IAAAC,mCAAA,GAAxB;EACA,MAAM,CAACC,UAAD,EAAaC,aAAb,IAA8B,IAAAC,eAAA,EAAgC,IAAhC,CAApC;EACA,MAAM;IAAC7B;EAAD,IAAUyB,eAAhB;EAEA,MAAM;IAACK,aAAD;IAAgBC,eAAhB;IAAiCC;EAAjC,IAAoDR,KAA1D;EACA,MAAMS,UAAU,GAAGpC,aAAa,GAAGG,KAAK,CAACkC,OAAN,CAAcC,KAAd,GAAsB,CAAzD;EAEA,IAAAC,gBAAA,EAAU,MAAM;IACd,MAAMC,WAAW,GAAGtC,gBAAgB,CAACC,KAAD,CAApC;;IACA4B,aAAa,CAACS,WAAD,CAAb;EACD,CAHD,EAGG,CAACrC,KAAD,CAHH,EAR+B,CAa/B;;EAEA,IAAI,CAAC2B,UAAL,EAAiB;IACf,OAAO,IAAP;EACD;;EAED,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACA,UAAU,CAACxB,SAAZ,CAAb;IAAqC,MAAM,EAAC;EAA5C,gBACE,6BAAC,eAAD;IACE,MAAM,EAAEH,KAAK,CAACkC,OAAN,CAAcI,IADxB;IAEE,MAAM,EAAE,CAACtC,KAAK,CAACM,MAAN,CAAaiC,IAAb,CAAkBC,MAAnB,EAA2BxC,KAAK,CAACM,MAAN,CAAaiC,IAAb,CAAkBE,KAA7C,CAFV;IAGE,oBAAoB,EAAC,QAHvB;IAIE,KAAK,EAAEd,UAAU,CAACR;EAJpB,EADF,eAOE,6BAAC,iBAAD;IAAM,KAAK,EAAEQ,UAAU,CAACV;EAAxB,gBACE,6BAAC,eAAD;IACE,MAAM,EAAC,aADT;IAEE,WAAW,EAAEe,eAFf;IAGE,WAAW,EAAC,UAHd;IAIE,iBAAiB;EAJnB,gBAME,6BAAC,cAAD;IAAW,MAAM,EAAEC;EAAnB,EANF,CADF,CAPF,eAiBE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACN,UAAU,CAACb,KAAZ;EAAb,gBACE,6BAAC,eAAD;IAAW,MAAM,EAAC,aAAlB;IAAgC,OAAO,EAAEgB,aAAzC;IAAwD,WAAW,EAAC;EAApE,gBACE,6BAAC,4CAAD;IACE,MAAM,EAAEhC,UADV;IAEE,KAAK,EAAEA,UAFT;IAGE,KAAK,EAAEE,KAAK,CAACM,MAAN,CAAaiC,IAAb,CAAkBG,IAH3B;IAIE,KAAK,EAAEf,UAAU,CAACZ;EAJpB,EADF,CADF,eASE,6BAAC,eAAD;IAAW,MAAM,EAAC,eAAlB;IAAkC,OAAO,EAAEgB,eAA3C;IAA4D,WAAW,EAAC;EAAxE,gBACE,6BAAC,yCAAD;IACE,MAAM,EAAEjC,UADV;IAEE,KAAK,EAAEA,UAFT;IAGE,KAAK,EAAEE,KAAK,CAACM,MAAN,CAAaiC,IAAb,CAAkBG,IAH3B;IAIE,KAAK,EAAEf,UAAU,CAACZ;EAJpB,EADF,CATF,CAjBF,CADF;AAsCD,CAzDD;;eA2DeQ,M"}
+{"version":3,"file":"index.native.js","names":["HEADER_HEIGHT","ICON_WIDTH","createStyleSheet","theme","StyleSheet","create","container","position","backgroundColor","colors","white","flexDirection","alignItems","justifyContent","height","top","width","icons","icon","marginRight","logo","marginLeft","gradient","left","right","opacity","Header","props","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","onSearchPress","onSettingsPress","onLogoLongPress","logoHeight","spacing","small","useEffect","_stylesheet","tiny","gray","medium","light","dark"],"sources":["../../../src/organism/header-v2/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\n\nimport {View, StyleSheet, GestureResponderEvent, ViewStyle} from 'react-native';\nimport {\n  NovaCompositionCoorpacademySearch as SearchIcon,\n  NovaCompositionCoorpacademyCog as SettingsIcon\n} from '@coorpacademy/nova-icons';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport BrandLogo from '../../molecule/brand-logo/index.native';\nimport Gradient from '../../atom/gradient/index.native';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {Theme} from '../../variables/theme.native';\n\nexport interface Props {\n  onSearchPress: (event: GestureResponderEvent) => void;\n  onSettingsPress: (event: GestureResponderEvent) => void;\n  onLogoLongPress: (event: GestureResponderEvent) => void;\n}\n\nexport const HEADER_HEIGHT = 67;\nconst ICON_WIDTH = 20;\n\ntype StyleSheetType = {\n  container: ViewStyle;\n  icons: ViewStyle;\n  icon: ViewStyle;\n  logo: ViewStyle;\n  gradient: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme) =>\n  StyleSheet.create({\n    container: {\n      position: 'absolute',\n      backgroundColor: theme.colors.white,\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      height: HEADER_HEIGHT,\n      top: 0,\n      width: '100%'\n    },\n    icons: {\n      flexDirection: 'row'\n    },\n    icon: {\n      marginRight: 16\n    },\n    logo: {\n      width: 80,\n      marginLeft: 16\n    },\n    gradient: {\n      position: 'absolute',\n      left: 0,\n      top: HEADER_HEIGHT,\n      right: 0,\n      opacity: 0.3\n    }\n  });\n\nconst Header = (props: Props) => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme} = templateContext;\n\n  const {onSearchPress, onSettingsPress, onLogoLongPress} = props;\n  const logoHeight = HEADER_HEIGHT - theme.spacing.small * 2;\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  // ------------------------------------\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <View style={[styleSheet.container]} testID=\"header\">\n      <Gradient\n        height={theme.spacing.tiny}\n        colors={[theme.colors.gray.medium, theme.colors.gray.light]}\n        transparencyPosition=\"bottom\"\n        style={styleSheet.gradient}\n      />\n      <View style={styleSheet.logo}>\n        <Touchable\n          testID=\"header-logo\"\n          onLongPress={onLogoLongPress}\n          analyticsID=\"sign-out\"\n          isWithoutFeedback\n        >\n          <BrandLogo height={logoHeight} />\n        </Touchable>\n      </View>\n      <View style={[styleSheet.icons]}>\n        <Touchable testID=\"search-icon\" onPress={onSearchPress} analyticsID=\"search-icon\">\n          <SearchIcon\n            height={ICON_WIDTH}\n            width={ICON_WIDTH}\n            color={theme.colors.gray.dark}\n            style={styleSheet.icon}\n          />\n        </Touchable>\n        <Touchable testID=\"settings-icon\" onPress={onSettingsPress} analyticsID=\"settings-icon\">\n          <SettingsIcon\n            height={ICON_WIDTH}\n            width={ICON_WIDTH}\n            color={theme.colors.gray.dark}\n            style={styleSheet.icon}\n          />\n        </Touchable>\n      </View>\n    </View>\n  );\n};\n\nexport default Header;\n"],"mappings":";;;;;AAAA;;AAEA;;AACA;;AAIA;;AACA;;AACA;;AACA;;;;;;;;AASO,MAAMA,aAAa,GAAG,EAAtB;;AACP,MAAMC,UAAU,GAAG,EAAnB;;AAUA,MAAMC,gBAAgB,GAAIC,KAAD,IACvBC,uBAAA,CAAWC,MAAX,CAAkB;EAChBC,SAAS,EAAE;IACTC,QAAQ,EAAE,UADD;IAETC,eAAe,EAAEL,KAAK,CAACM,MAAN,CAAaC,KAFrB;IAGTC,aAAa,EAAE,KAHN;IAITC,UAAU,EAAE,QAJH;IAKTC,cAAc,EAAE,eALP;IAMTC,MAAM,EAAEd,aANC;IAOTe,GAAG,EAAE,CAPI;IAQTC,KAAK,EAAE;EARE,CADK;EAWhBC,KAAK,EAAE;IACLN,aAAa,EAAE;EADV,CAXS;EAchBO,IAAI,EAAE;IACJC,WAAW,EAAE;EADT,CAdU;EAiBhBC,IAAI,EAAE;IACJJ,KAAK,EAAE,EADH;IAEJK,UAAU,EAAE;EAFR,CAjBU;EAqBhBC,QAAQ,EAAE;IACRf,QAAQ,EAAE,UADF;IAERgB,IAAI,EAAE,CAFE;IAGRR,GAAG,EAAEf,aAHG;IAIRwB,KAAK,EAAE,CAJC;IAKRC,OAAO,EAAE;EALD;AArBM,CAAlB,CADF;;AA+BA,MAAMC,MAAM,GAAIC,KAAD,IAAkB;EAC/B,MAAMC,eAAe,GAAG,IAAAC,mCAAA,GAAxB;EACA,MAAM,CAACC,UAAD,EAAaC,aAAb,IAA8B,IAAAC,eAAA,EAAgC,IAAhC,CAApC;EACA,MAAM;IAAC7B;EAAD,IAAUyB,eAAhB;EAEA,MAAM;IAACK,aAAD;IAAgBC,eAAhB;IAAiCC;EAAjC,IAAoDR,KAA1D;EACA,MAAMS,UAAU,GAAGpC,aAAa,GAAGG,KAAK,CAACkC,OAAN,CAAcC,KAAd,GAAsB,CAAzD;EAEA,IAAAC,gBAAA,EAAU,MAAM;IACd,MAAMC,WAAW,GAAGtC,gBAAgB,CAACC,KAAD,CAApC;;IACA4B,aAAa,CAACS,WAAD,CAAb;EACD,CAHD,EAGG,CAACrC,KAAD,CAHH,EAR+B,CAa/B;;EAEA,IAAI,CAAC2B,UAAL,EAAiB;IACf,OAAO,IAAP;EACD;;EAED,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACA,UAAU,CAACxB,SAAZ,CAAb;IAAqC,MAAM,EAAC;EAA5C,gBACE,6BAAC,eAAD;IACE,MAAM,EAAEH,KAAK,CAACkC,OAAN,CAAcI,IADxB;IAEE,MAAM,EAAE,CAACtC,KAAK,CAACM,MAAN,CAAaiC,IAAb,CAAkBC,MAAnB,EAA2BxC,KAAK,CAACM,MAAN,CAAaiC,IAAb,CAAkBE,KAA7C,CAFV;IAGE,oBAAoB,EAAC,QAHvB;IAIE,KAAK,EAAEd,UAAU,CAACR;EAJpB,EADF,eAOE,6BAAC,iBAAD;IAAM,KAAK,EAAEQ,UAAU,CAACV;EAAxB,gBACE,6BAAC,eAAD;IACE,MAAM,EAAC,aADT;IAEE,WAAW,EAAEe,eAFf;IAGE,WAAW,EAAC,UAHd;IAIE,iBAAiB;EAJnB,gBAME,6BAAC,cAAD;IAAW,MAAM,EAAEC;EAAnB,EANF,CADF,CAPF,eAiBE,6BAAC,iBAAD;IAAM,KAAK,EAAE,CAACN,UAAU,CAACb,KAAZ;EAAb,gBACE,6BAAC,eAAD;IAAW,MAAM,EAAC,aAAlB;IAAgC,OAAO,EAAEgB,aAAzC;IAAwD,WAAW,EAAC;EAApE,gBACE,6BAAC,4CAAD;IACE,MAAM,EAAEhC,UADV;IAEE,KAAK,EAAEA,UAFT;IAGE,KAAK,EAAEE,KAAK,CAACM,MAAN,CAAaiC,IAAb,CAAkBG,IAH3B;IAIE,KAAK,EAAEf,UAAU,CAACZ;EAJpB,EADF,CADF,eASE,6BAAC,eAAD;IAAW,MAAM,EAAC,eAAlB;IAAkC,OAAO,EAAEgB,eAA3C;IAA4D,WAAW,EAAC;EAAxE,gBACE,6BAAC,yCAAD;IACE,MAAM,EAAEjC,UADV;IAEE,KAAK,EAAEA,UAFT;IAGE,KAAK,EAAEE,KAAK,CAACM,MAAN,CAAaiC,IAAb,CAAkBG,IAH3B;IAIE,KAAK,EAAEf,UAAU,CAACZ;EAJpB,EADF,CATF,CAjBF,CADF;AAsCD,CAzDD;;eA2DeQ,M"}

package/lib/organism/mobile-navigation/index.native.d.ts

@@ -1,7 +1,21 @@
-/// <reference types="react" />
+import { FC } from 'react';
+import { ViewStyle, TextStyle } from 'react-native';
+import { Theme } from '../../variables/theme.native';
+interface ButtonProps {
+    title: string;
+    testID: string;
+    selected: boolean;
+    Icon: FC<{
+        height: number;
+        width: number;
+        color?: string;
+    }>;
+    styles: StyleSheetType;
+    theme: Theme;
+}
 export declare type NavItemType = {
     label: string;
-    icon: any;
+    icon: ButtonProps['Icon'];
     onPress: () => void;
 };
 export interface Props {
@@ -9,6 +23,14 @@ export interface Props {
     items: Array<NavItemType>;
     selectedItemIndex: number;
 }
+declare type StyleSheetType = {
+    main: ViewStyle;
+    container: ViewStyle;
+    button: ViewStyle;
+    buttonText: TextStyle;
+    dot: ViewStyle;
+    blur: ViewStyle;
+};
 declare const NavigationBar: ({ items, selectedItemIndex }: Props) => JSX.Element | null;
 export default NavigationBar;
 //# sourceMappingURL=index.native.d.ts.map

package/lib/organism/mobile-navigation/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/mobile-navigation/index.native.tsx"],"names":[],"mappings":";AASA,oBAAY,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,GAAG,CAAC;IACV,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,MAAM,WAAW,KAAK;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,CAAC;IAC1B,iBAAiB,EAAE,MAAM,CAAC;CAC3B;AAwFD,QAAA,MAAM,aAAa,iCAAgC,KAAK,uBAoCvD,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/mobile-navigation/index.native.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAsB,EAAE,EAAC,MAAM,OAAO,CAAC;AACrD,OAAO,EAAyB,SAAS,EAAE,SAAS,EAAC,MAAM,cAAc,CAAC;AAM1E,OAAO,EAAC,KAAK,EAAC,MAAM,8BAA8B,CAAC;AAEnD,UAAU,WAAW;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,EAAE,EAAE,CAAC;QAAC,MAAM,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAC,CAAC,CAAC;IAC1D,MAAM,EAAE,cAAc,CAAC;IACvB,KAAK,EAAE,KAAK,CAAC;CACd;AAED,oBAAY,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC1B,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,MAAM,WAAW,KAAK;IACpB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,CAAC;IAC1B,iBAAiB,EAAE,MAAM,CAAC;CAC3B;AAED,aAAK,cAAc,GAAG;IACpB,IAAI,EAAE,SAAS,CAAC;IAChB,SAAS,EAAE,SAAS,CAAC;IACrB,MAAM,EAAE,SAAS,CAAC;IAClB,UAAU,EAAE,SAAS,CAAC;IACtB,GAAG,EAAE,SAAS,CAAC;IACf,IAAI,EAAE,SAAS,CAAC;CACjB,CAAC;AAsEF,QAAA,MAAM,aAAa,iCAAgC,KAAK,uBAoCvD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/organism/mobile-navigation/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","StyleSheet","create","main","marginHorizontal","container","position","bottom","width","flexDirection","justifyContent","alignSelf","overflow","height","borderRadius","backgroundColor","colors","gray","light","button","alignItems","flex","marginTop","spacing","small","buttonText","fontSize","lineHeight","color","text","primary","dot","cta","blur","transform","rotateX","scaleX","Button","testID","title","selected","Icon","styles","NavigationBar","items","selectedItemIndex","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","useEffect","_stylesheet","map","prop","index","label","icon"],"sources":["../../../src/organism/mobile-navigation/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect} from 'react';\nimport {View, StyleSheet, Text, ViewStyle, TextStyle} from 'react-native';\nimport {BlurView} from '@react-native-community/blur';\n\nimport {NovaCompositionNavigationNavBar as BlurredShadow} from '@coorpacademy/nova-icons';\n\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\n\nexport type NavItemType = {\n  label: string;\n  icon: any;\n  onPress: () => void;\n};\n\nexport interface Props {\n  testID?: string;\n  items: Array<NavItemType>;\n  selectedItemIndex: number;\n}\n\ntype StyleSheetType = {\n  main: ViewStyle;\n  container: ViewStyle;\n  button: ViewStyle;\n  buttonText: TextStyle;\n  dot: ViewStyle;\n  blur: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    main: {\n      marginHorizontal: 20\n    },\n    container: {\n      position: 'absolute',\n      bottom: 34,\n      width: '100%',\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      alignSelf: 'center',\n      overflow: 'hidden',\n      height: 66,\n      borderRadius: 12,\n      backgroundColor: theme.colors.gray.light\n    },\n    button: {\n      alignItems: 'center',\n      flex: 1,\n      height: '100%',\n      marginTop: theme.spacing.small\n    },\n    buttonText: {\n      fontSize: theme.fontSize.small,\n      lineHeight: 26,\n      // height: 11,\n      color: theme.colors.text.primary\n    },\n\n    dot: {\n      width: 8,\n      height: 8,\n      borderRadius: 8,\n      backgroundColor: theme.colors.cta,\n      marginTop: 3,\n      position: 'absolute',\n      alignSelf: 'center'\n    },\n    blur: {\n      marginTop: -87,\n      width: 200,\n      height: 100,\n      position: 'absolute',\n      alignSelf: 'center',\n      transform: [{rotateX: '180deg'}, {scaleX: 0.7}]\n    }\n  });\n\ninterface ButtonProps {\n  title: string;\n  testID: string;\n  selected: boolean;\n  Icon: any;\n  styles: StyleSheetType;\n  theme: Theme;\n}\n\nconst Button = ({testID, title, selected, Icon, styles, theme}: ButtonProps) => (\n  <View testID={testID} style={styles.button}>\n    <View style={{alignItems: 'center'}}>\n      <Icon\n        height={16}\n        width={16}\n        color={selected ? theme.colors.cta : theme.colors.text.primary}\n      />\n      <Text style={styles.buttonText}>{title}</Text>\n    </View>\n    {selected ? (\n      <View>\n        <View style={styles.dot} />\n        <BlurredShadow color={theme.colors.cta} style={styles.blur} />\n      </View>\n    ) : null}\n  </View>\n);\n\nconst NavigationBar = ({items, selectedItemIndex}: Props) => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme} = templateContext;\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <View style={styleSheet.main}>\n      <BlurView\n        style={styleSheet.container}\n        blurAmount={32}\n        reducedTransparencyFallbackColor=\"rgba(17, 17, 23, 0.5)\"\n      />\n      <View style={styleSheet.container}>\n        {items.map((prop, index) => (\n          <Button\n            key={`button-${prop.label}`}\n            title={prop.label}\n            Icon={prop.icon}\n            selected={index === selectedItemIndex}\n            testID={`navigationButton_${index}`}\n            styles={styleSheet}\n            theme={theme}\n          />\n        ))}\n      </View>\n    </View>\n  );\n};\n\nexport default NavigationBar;\n"],"mappings":"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"}
+{"version":3,"file":"index.native.js","names":["createStyleSheet","theme","StyleSheet","create","main","marginHorizontal","container","position","bottom","width","flexDirection","justifyContent","alignSelf","overflow","height","borderRadius","backgroundColor","colors","gray","light","button","alignItems","flex","marginTop","spacing","small","buttonText","fontSize","lineHeight","color","text","primary","dot","cta","blur","transform","rotateX","scaleX","Button","testID","title","selected","Icon","styles","NavigationBar","items","selectedItemIndex","templateContext","useTemplateContext","styleSheet","setStylesheet","useState","useEffect","_stylesheet","map","prop","index","label","icon"],"sources":["../../../src/organism/mobile-navigation/index.native.tsx"],"sourcesContent":["import React, {useState, useEffect, FC} from 'react';\nimport {View, StyleSheet, Text, ViewStyle, TextStyle} from 'react-native';\nimport {BlurView} from '@react-native-community/blur';\n\nimport {NovaCompositionNavigationNavBar as BlurredShadow} from '@coorpacademy/nova-icons';\n\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\n\ninterface ButtonProps {\n  title: string;\n  testID: string;\n  selected: boolean;\n  Icon: FC<{height: number; width: number; color?: string}>;\n  styles: StyleSheetType;\n  theme: Theme;\n}\n\nexport type NavItemType = {\n  label: string;\n  icon: ButtonProps['Icon'];\n  onPress: () => void;\n};\n\nexport interface Props {\n  testID?: string;\n  items: Array<NavItemType>;\n  selectedItemIndex: number;\n}\n\ntype StyleSheetType = {\n  main: ViewStyle;\n  container: ViewStyle;\n  button: ViewStyle;\n  buttonText: TextStyle;\n  dot: ViewStyle;\n  blur: ViewStyle;\n};\n\nconst createStyleSheet = (theme: Theme): StyleSheetType =>\n  StyleSheet.create({\n    main: {\n      marginHorizontal: 20\n    },\n    container: {\n      position: 'absolute',\n      bottom: 34,\n      width: '100%',\n      flexDirection: 'row',\n      justifyContent: 'space-between',\n      alignSelf: 'center',\n      overflow: 'hidden',\n      height: 66,\n      borderRadius: 12,\n      backgroundColor: theme.colors.gray.light\n    },\n    button: {\n      alignItems: 'center',\n      flex: 1,\n      height: '100%',\n      marginTop: theme.spacing.small\n    },\n    buttonText: {\n      fontSize: theme.fontSize.small,\n      lineHeight: 26,\n      // height: 11,\n      color: theme.colors.text.primary\n    },\n\n    dot: {\n      width: 8,\n      height: 8,\n      borderRadius: 8,\n      backgroundColor: theme.colors.cta,\n      marginTop: 3,\n      position: 'absolute',\n      alignSelf: 'center'\n    },\n    blur: {\n      marginTop: -87,\n      width: 200,\n      height: 100,\n      position: 'absolute',\n      alignSelf: 'center',\n      transform: [{rotateX: '180deg'}, {scaleX: 0.7}]\n    }\n  });\n\nconst Button = ({testID, title, selected, Icon, styles, theme}: ButtonProps) => (\n  <View testID={testID} style={styles.button}>\n    <View style={{alignItems: 'center'}}>\n      <Icon\n        height={16}\n        width={16}\n        color={selected ? theme.colors.cta : theme.colors.text.primary}\n      />\n      <Text style={styles.buttonText}>{title}</Text>\n    </View>\n    {selected ? (\n      <View>\n        <View style={styles.dot} />\n        <BlurredShadow color={theme.colors.cta} style={styles.blur} />\n      </View>\n    ) : null}\n  </View>\n);\n\nconst NavigationBar = ({items, selectedItemIndex}: Props) => {\n  const templateContext = useTemplateContext();\n  const [styleSheet, setStylesheet] = useState<StyleSheetType | null>(null);\n  const {theme} = templateContext;\n\n  useEffect(() => {\n    const _stylesheet = createStyleSheet(theme);\n    setStylesheet(_stylesheet);\n  }, [theme]);\n\n  if (!styleSheet) {\n    return null;\n  }\n\n  return (\n    <View style={styleSheet.main}>\n      <BlurView\n        style={styleSheet.container}\n        blurAmount={32}\n        reducedTransparencyFallbackColor=\"rgba(17, 17, 23, 0.5)\"\n      />\n      <View style={styleSheet.container}>\n        {items.map((prop, index) => (\n          <Button\n            key={`button-${prop.label}`}\n            title={prop.label}\n            Icon={prop.icon}\n            selected={index === selectedItemIndex}\n            testID={`navigationButton_${index}`}\n            styles={styleSheet}\n            theme={theme}\n          />\n        ))}\n      </View>\n    </View>\n  );\n};\n\nexport default NavigationBar;\n"],"mappings":"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"}

package/lib/organism/review-slide/index.native.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/review-slide/index.native.tsx"],"names":[],"mappings":";AAYA,OAAO,EAAC,gBAAgB,EAAa,MAAM,cAAc,CAAC;AA4K1D,QAAA,MAAM,KAAK,UAAW,gBAAgB,gBAyCrC,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"index.native.d.ts","sourceRoot":"","sources":["../../../src/organism/review-slide/index.native.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAC,gBAAgB,EAAa,MAAM,cAAc,CAAC;AAuL1D,QAAA,MAAM,KAAK,UAAW,gBAAgB,gBAyCrC,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/lib/organism/review-slide/index.native.js

@@ -31,6 +31,7 @@ const CorrectionPopin = ({
   correctionPopinProps,
   slideIndex,
   showCorrectionPopin,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   animateCorrectionPopin
 }) => {
   if (!showCorrectionPopin) return null;
@@ -55,7 +56,7 @@ const CorrectionPopin = ({
     type: correctionPopinProps.type,
     resultLabel: correctionPopinProps.resultLabel
   };
-  return /*#__PURE__*/_react.default.createElement(_index.default, null, "ReviewCorrectionPopin") // <ReviewCorrectionPopin {..._correctionPopinProps} />
+  return /*#__PURE__*/_react.default.createElement(_index.default, null, "@todo ReviewCorrectionPopin ", _correctionPopinProps.toString()) // <ReviewCorrectionPopin {..._correctionPopinProps} />
   ;
 }; // const ValidateButton = ({slideIndex, validateButton, primarySkinColor}) => {
 //   const {label, onClick, disabled} = validateButton;
@@ -107,7 +108,7 @@ const createQuestionStyle = (theme, brandTheme) => _reactNative.StyleSheet.creat
     justifyContent: 'center'
   },
   validateButton: {
-    backgroundColor: brandTheme?.colors.primary || theme.colors.text.primary,
+    backgroundColor: brandTheme?.colors?.primary || theme.colors.text.primary,
     borderRadius: 7,
     width: '100%'
   },
@@ -132,7 +133,7 @@ const Question = props => {
     theme,
     brandTheme
   } = (0, _templateContext.useTemplateContext)();
-  const [style, setStyle] = (0, _react.useState)(null);
+  const [style, setStyle] = (0, _react.useState)();
   (0, _react.useEffect)(() => {
     const questionStyle = createQuestionStyle(theme, brandTheme);
     setStyle(questionStyle);
@@ -155,7 +156,7 @@ const Question = props => {
   }, "@todo validate")));
 };
 
-const createSlideStyle = (num, screenWidth, screenHeight) => {
+const createSlideStyle = (num, screenWidth) => {
   const slideWidth = screenWidth - 40 - num * 8;
   return _reactNative.StyleSheet.create({
     slide: {
@@ -185,16 +186,14 @@ const createSlideStyle = (num, screenWidth, screenHeight) => {
 const Slide = props => {
   const {
     slide,
-    validateButton,
     correctionPopinProps,
     num,
     slideIndex = '0'
   } = props;
   const {
-    width,
-    height
+    width
   } = (0, _reactNative.useWindowDimensions)();
-  const slideStyle = createSlideStyle(num, width, height);
+  const slideStyle = createSlideStyle(num, width);
   const {
     loading,
     parentContentTitle,

package/lib/organism/review-slide/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","names":["CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","klf","getOr","information","label","message","next","get","_correctionPopinProps","onClick","console","log","type","resultLabel","createQuestionStyle","theme","brandTheme","StyleSheet","create","questionHeading","justifyContent","questionOrigin","fontSize","lineHeight","color","colors","text","primary","marginBottom","spacing","tiny","marginTop","small","textAlign","questionText","fontWeight","questionHelp","gray","medium","choicesContainer","flex","width","validateButton","backgroundColor","borderRadius","validateButtonText","white","Question","props","answerUI","useTemplateContext","style","setStyle","useState","useEffect","questionStyle","createSlideStyle","num","screenWidth","screenHeight","slideWidth","slide","position","left","bottom","height","alignItems","padding","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","Slide","useWindowDimensions","slideStyle","loading","parentContentTitle"],"sources":["../../../src/organism/review-slide/index.native.tsx"],"sourcesContent":["import React, {useEffect, useMemo, useState} from 'react';\nimport {StyleSheet, useWindowDimensions, View, ViewStyle} from 'react-native';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport Text from '../../atom/text/index.native';\nimport Answer from '../../molecule/answer/index.native';\n// import Loader from '../../atom/loader';\n// import ReviewCorrectionPopin from '../../molecule/review-correction-popin';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {ReviewCorrectionPopinProps} from '../../molecule/review-correction-popin/prop-types';\nimport {ReviewSlideProps, SlideProps} from './prop-types';\n\ntype PopinProps = {\n  correctionPopinProps: ReviewCorrectionPopinProps;\n  slideIndex: unknown;\n  showCorrectionPopin: unknown;\n  animateCorrectionPopin: unknown;\n};\n\nconst CorrectionPopin = ({\n  correctionPopinProps,\n  slideIndex,\n  showCorrectionPopin,\n  animateCorrectionPopin\n}: PopinProps) => {\n  if (!showCorrectionPopin) return null;\n\n  const klf = getOr({}, 'klf', correctionPopinProps);\n  const information = getOr({label: '', message: ''}, 'information', correctionPopinProps);\n  const next = get('next', correctionPopinProps);\n\n  const _correctionPopinProps = {\n    next: {\n      onClick: () => {\n        // eslint-disable-next-line no-console\n        console.log('Next Slide');\n      },\n      label: next && next.label,\n      'data-name': `next-question-button-${slideIndex}`,\n      'aria-label': next && next['aria-label']\n    },\n    klf,\n    information,\n    type: correctionPopinProps.type,\n    resultLabel: correctionPopinProps.resultLabel\n  };\n\n  return (\n    <Text>ReviewCorrectionPopin</Text>\n    // <ReviewCorrectionPopin {..._correctionPopinProps} />\n  );\n};\n\n// const ValidateButton = ({slideIndex, validateButton, primarySkinColor}) => {\n//   const {label, onClick, disabled} = validateButton;\n//   const validateButtonProps = {\n//     type: 'primary',\n//     label,\n//     'aria-label': label,\n//     'data-name': `slide-validate-button-${slideIndex}`,\n//     onClick,\n//     disabled,\n//     customStyle: {\n//       backgroundColor: primarySkinColor\n//     }\n//   };\n\n//   return <Button title=\"validate todo\" />;\n// };\n\nconst createQuestionStyle = (theme: Theme, brandTheme: any) =>\n  StyleSheet.create({\n    questionHeading: {\n      justifyContent: 'space-between'\n    },\n    questionOrigin: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.text.primary,\n      marginBottom: theme.spacing.tiny,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    questionText: {\n      fontSize: 16,\n      lineHeight: 22,\n      fontWeight: '700',\n      color: theme.colors.text.primary,\n      textAlign: 'center'\n    },\n    questionHelp: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.gray.medium,\n      marginBottom: 0,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    choicesContainer: {\n      flex: 1,\n      width: '100%',\n      justifyContent: 'center'\n    },\n    validateButton: {\n      backgroundColor: brandTheme?.colors.primary || theme.colors.text.primary,\n      borderRadius: 7,\n      width: '100%'\n    },\n    validateButtonText: {\n      fontSize: 14,\n      lineHeight: 20,\n      fontWeight: '700',\n      color: theme.colors.white,\n      marginBottom: 16,\n      marginTop: 16,\n      textAlign: 'center'\n    }\n  });\n\ntype QuestionProps = {\n  answerUI: SlideProps['answerUI'];\n  questionText: SlideProps['questionText'];\n  questionOrigin: SlideProps['parentContentTitle'];\n};\n\nconst Question = (props: QuestionProps) => {\n  const {answerUI, questionText, questionOrigin} = props;\n  const {theme, brandTheme} = useTemplateContext();\n  const [style, setStyle] = useState<any | null>(null);\n\n  useEffect(() => {\n    const questionStyle = createQuestionStyle(theme, brandTheme);\n    setStyle(questionStyle);\n  }, [theme, brandTheme]);\n\n  if (!answerUI || !questionText || !style) return null;\n\n  return (\n    <>\n      <View style={style.questionHeading}>\n        <Text style={style.questionOrigin}>{questionOrigin}</Text>\n        <Text style={style.questionText}>{questionText}</Text>\n        <Text style={style.questionHelp}>{get('help', answerUI)}</Text>\n      </View>\n      <View style={style.choicesContainer}>\n        <Answer {...answerUI} />\n      </View>\n      <Touchable style={style.validateButton}>\n        <Text style={style.validateButtonText}>@todo validate</Text>\n      </Touchable>\n    </>\n  );\n};\n\ntype SlideStyle = {\n  slide: ViewStyle;\n};\n\nconst createSlideStyle = (num: number, screenWidth: number, screenHeight: number): SlideStyle => {\n  const slideWidth = screenWidth - 40 - num * 8;\n\n  return StyleSheet.create({\n    slide: {\n      position: 'absolute',\n      left: 20 + num * 4,\n      bottom: 34 + num * 5,\n      backgroundColor: '#fff', // theme.colors.white\n      height: '90%',\n      width: slideWidth,\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      padding: 25,\n      shadowColor: '#000',\n      shadowOffset: {width: 0, height: -1},\n      shadowOpacity: 0.05,\n      shadowRadius: 16,\n      elevation: 10 - num * 1,\n      borderRadius: 16\n    }\n  });\n};\n\nconst Slide = (props: ReviewSlideProps) => {\n  const {slide, validateButton, correctionPopinProps, num, slideIndex = '0'} = props;\n\n  const {width, height} = useWindowDimensions();\n  const slideStyle = createSlideStyle(num, width, height);\n\n  const {\n    loading,\n    parentContentTitle,\n    questionText,\n    answerUI,\n    showCorrectionPopin,\n    animateCorrectionPopin\n  } = slide;\n\n  return (\n    <View style={slideStyle.slide}>\n      {loading ? (\n        // <Loader className={style.loader} theme=\"default\" aria-label={loadingAriaLabel} />\n        <Text>@todo loader {num}</Text>\n      ) : (\n        <>\n          <Question\n            questionOrigin={parentContentTitle}\n            questionText={questionText}\n            answerUI={answerUI}\n            key=\"question-container\"\n          />\n          {correctionPopinProps ? (\n            <CorrectionPopin\n              correctionPopinProps={correctionPopinProps}\n              slideIndex={slideIndex}\n              showCorrectionPopin={showCorrectionPopin}\n              animateCorrectionPopin={animateCorrectionPopin}\n              key=\"correction-popin\"\n            />\n          ) : null}\n        </>\n      )}\n    </View>\n  );\n};\n\nexport default Slide;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAGA;;AAEA;;;;;;;;AAJA;AACA;AAcA,MAAMA,eAAe,GAAG,CAAC;EACvBC,oBADuB;EAEvBC,UAFuB;EAGvBC,mBAHuB;EAIvBC;AAJuB,CAAD,KAKN;EAChB,IAAI,CAACD,mBAAL,EAA0B,OAAO,IAAP;EAE1B,MAAME,GAAG,GAAG,IAAAC,cAAA,EAAM,EAAN,EAAU,KAAV,EAAiBL,oBAAjB,CAAZ;EACA,MAAMM,WAAW,GAAG,IAAAD,cAAA,EAAM;IAACE,KAAK,EAAE,EAAR;IAAYC,OAAO,EAAE;EAArB,CAAN,EAAgC,aAAhC,EAA+CR,oBAA/C,CAApB;EACA,MAAMS,IAAI,GAAG,IAAAC,YAAA,EAAI,MAAJ,EAAYV,oBAAZ,CAAb;EAEA,MAAMW,qBAAqB,GAAG;IAC5BF,IAAI,EAAE;MACJG,OAAO,EAAE,MAAM;QACb;QACAC,OAAO,CAACC,GAAR,CAAY,YAAZ;MACD,CAJG;MAKJP,KAAK,EAAEE,IAAI,IAAIA,IAAI,CAACF,KALhB;MAMJ,aAAc,wBAAuBN,UAAW,EAN5C;MAOJ,cAAcQ,IAAI,IAAIA,IAAI,CAAC,YAAD;IAPtB,CADsB;IAU5BL,GAV4B;IAW5BE,WAX4B;IAY5BS,IAAI,EAAEf,oBAAoB,CAACe,IAZC;IAa5BC,WAAW,EAAEhB,oBAAoB,CAACgB;EAbN,CAA9B;EAgBA,oBACE,6BAAC,cAAD,gCADF,CAEE;EAFF;AAID,CAhCD,C,CAkCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACA;;;AAEA,MAAMC,mBAAmB,GAAG,CAACC,KAAD,EAAeC,UAAf,KAC1BC,uBAAA,CAAWC,MAAX,CAAkB;EAChBC,eAAe,EAAE;IACfC,cAAc,EAAE;EADD,CADD;EAIhBC,cAAc,EAAE;IACdC,QAAQ,EAAE,EADI;IAEdC,UAAU,EAAE,EAFE;IAGdC,KAAK,EAAET,KAAK,CAACU,MAAN,CAAaC,IAAb,CAAkBC,OAHX;IAIdC,YAAY,EAAEb,KAAK,CAACc,OAAN,CAAcC,IAJd;IAKdC,SAAS,EAAEhB,KAAK,CAACc,OAAN,CAAcG,KALX;IAMdC,SAAS,EAAE;EANG,CAJA;EAYhBC,YAAY,EAAE;IACZZ,QAAQ,EAAE,EADE;IAEZC,UAAU,EAAE,EAFA;IAGZY,UAAU,EAAE,KAHA;IAIZX,KAAK,EAAET,KAAK,CAACU,MAAN,CAAaC,IAAb,CAAkBC,OAJb;IAKZM,SAAS,EAAE;EALC,CAZE;EAmBhBG,YAAY,EAAE;IACZd,QAAQ,EAAE,EADE;IAEZC,UAAU,EAAE,EAFA;IAGZC,KAAK,EAAET,KAAK,CAACU,MAAN,CAAaY,IAAb,CAAkBC,MAHb;IAIZV,YAAY,EAAE,CAJF;IAKZG,SAAS,EAAEhB,KAAK,CAACc,OAAN,CAAcG,KALb;IAMZC,SAAS,EAAE;EANC,CAnBE;EA2BhBM,gBAAgB,EAAE;IAChBC,IAAI,EAAE,CADU;IAEhBC,KAAK,EAAE,MAFS;IAGhBrB,cAAc,EAAE;EAHA,CA3BF;EAgChBsB,cAAc,EAAE;IACdC,eAAe,EAAE3B,UAAU,EAAES,MAAZ,CAAmBE,OAAnB,IAA8BZ,KAAK,CAACU,MAAN,CAAaC,IAAb,CAAkBC,OADnD;IAEdiB,YAAY,EAAE,CAFA;IAGdH,KAAK,EAAE;EAHO,CAhCA;EAqChBI,kBAAkB,EAAE;IAClBvB,QAAQ,EAAE,EADQ;IAElBC,UAAU,EAAE,EAFM;IAGlBY,UAAU,EAAE,KAHM;IAIlBX,KAAK,EAAET,KAAK,CAACU,MAAN,CAAaqB,KAJF;IAKlBlB,YAAY,EAAE,EALI;IAMlBG,SAAS,EAAE,EANO;IAOlBE,SAAS,EAAE;EAPO;AArCJ,CAAlB,CADF;;AAuDA,MAAMc,QAAQ,GAAIC,KAAD,IAA0B;EACzC,MAAM;IAACC,QAAD;IAAWf,YAAX;IAAyBb;EAAzB,IAA2C2B,KAAjD;EACA,MAAM;IAACjC,KAAD;IAAQC;EAAR,IAAsB,IAAAkC,mCAAA,GAA5B;EACA,MAAM,CAACC,KAAD,EAAQC,QAAR,IAAoB,IAAAC,eAAA,EAAqB,IAArB,CAA1B;EAEA,IAAAC,gBAAA,EAAU,MAAM;IACd,MAAMC,aAAa,GAAGzC,mBAAmB,CAACC,KAAD,EAAQC,UAAR,CAAzC;IACAoC,QAAQ,CAACG,aAAD,CAAR;EACD,CAHD,EAGG,CAACxC,KAAD,EAAQC,UAAR,CAHH;EAKA,IAAI,CAACiC,QAAD,IAAa,CAACf,YAAd,IAA8B,CAACiB,KAAnC,EAA0C,OAAO,IAAP;EAE1C,oBACE,yEACE,6BAAC,iBAAD;IAAM,KAAK,EAAEA,KAAK,CAAChC;EAAnB,gBACE,6BAAC,cAAD;IAAM,KAAK,EAAEgC,KAAK,CAAC9B;EAAnB,GAAoCA,cAApC,CADF,eAEE,6BAAC,cAAD;IAAM,KAAK,EAAE8B,KAAK,CAACjB;EAAnB,GAAkCA,YAAlC,CAFF,eAGE,6BAAC,cAAD;IAAM,KAAK,EAAEiB,KAAK,CAACf;EAAnB,GAAkC,IAAA7B,YAAA,EAAI,MAAJ,EAAY0C,QAAZ,CAAlC,CAHF,CADF,eAME,6BAAC,iBAAD;IAAM,KAAK,EAAEE,KAAK,CAACZ;EAAnB,gBACE,6BAAC,eAAD,EAAYU,QAAZ,CADF,CANF,eASE,6BAAC,eAAD;IAAW,KAAK,EAAEE,KAAK,CAACT;EAAxB,gBACE,6BAAC,cAAD;IAAM,KAAK,EAAES,KAAK,CAACN;EAAnB,oBADF,CATF,CADF;AAeD,CA3BD;;AAiCA,MAAMW,gBAAgB,GAAG,CAACC,GAAD,EAAcC,WAAd,EAAmCC,YAAnC,KAAwE;EAC/F,MAAMC,UAAU,GAAGF,WAAW,GAAG,EAAd,GAAmBD,GAAG,GAAG,CAA5C;EAEA,OAAOxC,uBAAA,CAAWC,MAAX,CAAkB;IACvB2C,KAAK,EAAE;MACLC,QAAQ,EAAE,UADL;MAELC,IAAI,EAAE,KAAKN,GAAG,GAAG,CAFZ;MAGLO,MAAM,EAAE,KAAKP,GAAG,GAAG,CAHd;MAILd,eAAe,EAAE,MAJZ;MAIoB;MACzBsB,MAAM,EAAE,KALH;MAMLxB,KAAK,EAAEmB,UANF;MAOLxC,cAAc,EAAE,eAPX;MAQL8C,UAAU,EAAE,QARP;MASLC,OAAO,EAAE,EATJ;MAULC,WAAW,EAAE,MAVR;MAWLC,YAAY,EAAE;QAAC5B,KAAK,EAAE,CAAR;QAAWwB,MAAM,EAAE,CAAC;MAApB,CAXT;MAYLK,aAAa,EAAE,IAZV;MAaLC,YAAY,EAAE,EAbT;MAcLC,SAAS,EAAE,KAAKf,GAAG,GAAG,CAdjB;MAeLb,YAAY,EAAE;IAfT;EADgB,CAAlB,CAAP;AAmBD,CAtBD;;AAwBA,MAAM6B,KAAK,GAAIzB,KAAD,IAA6B;EACzC,MAAM;IAACa,KAAD;IAAQnB,cAAR;IAAwB7C,oBAAxB;IAA8C4D,GAA9C;IAAmD3D,UAAU,GAAG;EAAhE,IAAuEkD,KAA7E;EAEA,MAAM;IAACP,KAAD;IAAQwB;EAAR,IAAkB,IAAAS,gCAAA,GAAxB;EACA,MAAMC,UAAU,GAAGnB,gBAAgB,CAACC,GAAD,EAAMhB,KAAN,EAAawB,MAAb,CAAnC;EAEA,MAAM;IACJW,OADI;IAEJC,kBAFI;IAGJ3C,YAHI;IAIJe,QAJI;IAKJlD,mBALI;IAMJC;EANI,IAOF6D,KAPJ;EASA,oBACE,6BAAC,iBAAD;IAAM,KAAK,EAAEc,UAAU,CAACd;EAAxB,GACGe,OAAO;EAAA;EACN;EACA,6BAAC,cAAD,yBAAoBnB,GAApB,CAFM,gBAIN,yEACE,6BAAC,QAAD;IACE,cAAc,EAAEoB,kBADlB;IAEE,YAAY,EAAE3C,YAFhB;IAGE,QAAQ,EAAEe,QAHZ;IAIE,GAAG,EAAC;EAJN,EADF,EAOGpD,oBAAoB,gBACnB,6BAAC,eAAD;IACE,oBAAoB,EAAEA,oBADxB;IAEE,UAAU,EAAEC,UAFd;IAGE,mBAAmB,EAAEC,mBAHvB;IAIE,sBAAsB,EAAEC,sBAJ1B;IAKE,GAAG,EAAC;EALN,EADmB,GAQjB,IAfN,CALJ,CADF;AA0BD,CAzCD;;eA2CeyE,K"}
+{"version":3,"file":"index.native.js","names":["CorrectionPopin","correctionPopinProps","slideIndex","showCorrectionPopin","animateCorrectionPopin","klf","getOr","information","label","message","next","get","_correctionPopinProps","onClick","console","log","type","resultLabel","toString","createQuestionStyle","theme","brandTheme","StyleSheet","create","questionHeading","justifyContent","questionOrigin","fontSize","lineHeight","color","colors","text","primary","marginBottom","spacing","tiny","marginTop","small","textAlign","questionText","fontWeight","questionHelp","gray","medium","choicesContainer","flex","width","validateButton","backgroundColor","borderRadius","validateButtonText","white","Question","props","answerUI","useTemplateContext","style","setStyle","useState","useEffect","questionStyle","createSlideStyle","num","screenWidth","slideWidth","slide","position","left","bottom","height","alignItems","padding","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","Slide","useWindowDimensions","slideStyle","loading","parentContentTitle"],"sources":["../../../src/organism/review-slide/index.native.tsx"],"sourcesContent":["import React, {useEffect, useState} from 'react';\nimport {StyleSheet, TextStyle, useWindowDimensions, View, ViewStyle} from 'react-native';\nimport get from 'lodash/fp/get';\nimport getOr from 'lodash/fp/getOr';\nimport Text from '../../atom/text/index.native';\nimport Answer from '../../molecule/answer/index.native';\n// import Loader from '../../atom/loader';\n// import ReviewCorrectionPopin from '../../molecule/review-correction-popin';\nimport {useTemplateContext} from '../../template/app-review/template-context';\nimport {Theme} from '../../variables/theme.native';\nimport Touchable from '../../hoc/touchable/index.native';\nimport {Brand} from '../../variables/brand.native';\nimport {ReviewCorrectionPopinProps} from '../../molecule/review-correction-popin/prop-types';\nimport {ReviewSlideProps, SlideProps} from './prop-types';\n\ntype PopinProps = {\n  correctionPopinProps: ReviewCorrectionPopinProps;\n  slideIndex: unknown;\n  showCorrectionPopin: unknown;\n  animateCorrectionPopin: unknown;\n};\n\nconst CorrectionPopin = ({\n  correctionPopinProps,\n  slideIndex,\n  showCorrectionPopin,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  animateCorrectionPopin\n}: PopinProps) => {\n  if (!showCorrectionPopin) return null;\n\n  const klf = getOr({}, 'klf', correctionPopinProps);\n  const information = getOr({label: '', message: ''}, 'information', correctionPopinProps);\n  const next = get('next', correctionPopinProps);\n\n  const _correctionPopinProps = {\n    next: {\n      onClick: () => {\n        // eslint-disable-next-line no-console\n        console.log('Next Slide');\n      },\n      label: next && next.label,\n      'data-name': `next-question-button-${slideIndex}`,\n      'aria-label': next && next['aria-label']\n    },\n    klf,\n    information,\n    type: correctionPopinProps.type,\n    resultLabel: correctionPopinProps.resultLabel\n  };\n\n  return (\n    <Text>@todo ReviewCorrectionPopin {_correctionPopinProps.toString()}</Text>\n    // <ReviewCorrectionPopin {..._correctionPopinProps} />\n  );\n};\n\n// const ValidateButton = ({slideIndex, validateButton, primarySkinColor}) => {\n//   const {label, onClick, disabled} = validateButton;\n//   const validateButtonProps = {\n//     type: 'primary',\n//     label,\n//     'aria-label': label,\n//     'data-name': `slide-validate-button-${slideIndex}`,\n//     onClick,\n//     disabled,\n//     customStyle: {\n//       backgroundColor: primarySkinColor\n//     }\n//   };\n\n//   return <Button title=\"validate todo\" />;\n// };\n\ntype StyleSheetType = {\n  questionHeading: ViewStyle;\n  questionOrigin: ViewStyle;\n  questionText: TextStyle;\n  questionHelp: ViewStyle;\n  choicesContainer: ViewStyle;\n  validateButton: ViewStyle;\n  validateButtonText: ViewStyle;\n};\n\nconst createQuestionStyle = (theme: Theme, brandTheme: Brand): StyleSheetType =>\n  StyleSheet.create({\n    questionHeading: {\n      justifyContent: 'space-between'\n    },\n    questionOrigin: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.text.primary,\n      marginBottom: theme.spacing.tiny,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    questionText: {\n      fontSize: 16,\n      lineHeight: 22,\n      fontWeight: '700',\n      color: theme.colors.text.primary,\n      textAlign: 'center'\n    },\n    questionHelp: {\n      fontSize: 12,\n      lineHeight: 16,\n      color: theme.colors.gray.medium,\n      marginBottom: 0,\n      marginTop: theme.spacing.small,\n      textAlign: 'center'\n    },\n    choicesContainer: {\n      flex: 1,\n      width: '100%',\n      justifyContent: 'center'\n    },\n    validateButton: {\n      backgroundColor: brandTheme?.colors?.primary || theme.colors.text.primary,\n      borderRadius: 7,\n      width: '100%'\n    },\n    validateButtonText: {\n      fontSize: 14,\n      lineHeight: 20,\n      fontWeight: '700',\n      color: theme.colors.white,\n      marginBottom: 16,\n      marginTop: 16,\n      textAlign: 'center'\n    }\n  });\n\ntype QuestionProps = {\n  answerUI: SlideProps['answerUI'];\n  questionText: SlideProps['questionText'];\n  questionOrigin: SlideProps['parentContentTitle'];\n};\n\nconst Question = (props: QuestionProps) => {\n  const {answerUI, questionText, questionOrigin} = props;\n  const {theme, brandTheme} = useTemplateContext();\n  const [style, setStyle] = useState<StyleSheetType>();\n\n  useEffect(() => {\n    const questionStyle = createQuestionStyle(theme, brandTheme);\n    setStyle(questionStyle);\n  }, [theme, brandTheme]);\n\n  if (!answerUI || !questionText || !style) return null;\n\n  return (\n    <>\n      <View style={style.questionHeading}>\n        <Text style={style.questionOrigin}>{questionOrigin}</Text>\n        <Text style={style.questionText}>{questionText}</Text>\n        <Text style={style.questionHelp}>{get('help', answerUI)}</Text>\n      </View>\n      <View style={style.choicesContainer}>\n        <Answer {...answerUI} />\n      </View>\n      <Touchable style={style.validateButton}>\n        <Text style={style.validateButtonText}>@todo validate</Text>\n      </Touchable>\n    </>\n  );\n};\n\ntype SlideStyle = {\n  slide: ViewStyle;\n};\n\nconst createSlideStyle = (num: number, screenWidth: number): SlideStyle => {\n  const slideWidth = screenWidth - 40 - num * 8;\n\n  return StyleSheet.create({\n    slide: {\n      position: 'absolute',\n      left: 20 + num * 4,\n      bottom: 34 + num * 5,\n      backgroundColor: '#fff', // theme.colors.white\n      height: '90%',\n      width: slideWidth,\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      padding: 25,\n      shadowColor: '#000',\n      shadowOffset: {width: 0, height: -1},\n      shadowOpacity: 0.05,\n      shadowRadius: 16,\n      elevation: 10 - num * 1,\n      borderRadius: 16\n    }\n  });\n};\n\nconst Slide = (props: ReviewSlideProps) => {\n  const {slide, correctionPopinProps, num, slideIndex = '0'} = props;\n\n  const {width} = useWindowDimensions();\n  const slideStyle = createSlideStyle(num, width);\n\n  const {\n    loading,\n    parentContentTitle,\n    questionText,\n    answerUI,\n    showCorrectionPopin,\n    animateCorrectionPopin\n  } = slide;\n\n  return (\n    <View style={slideStyle.slide}>\n      {loading ? (\n        // <Loader className={style.loader} theme=\"default\" aria-label={loadingAriaLabel} />\n        <Text>@todo loader {num}</Text>\n      ) : (\n        <>\n          <Question\n            questionOrigin={parentContentTitle}\n            questionText={questionText}\n            answerUI={answerUI}\n            key=\"question-container\"\n          />\n          {correctionPopinProps ? (\n            <CorrectionPopin\n              correctionPopinProps={correctionPopinProps}\n              slideIndex={slideIndex}\n              showCorrectionPopin={showCorrectionPopin}\n              animateCorrectionPopin={animateCorrectionPopin}\n              key=\"correction-popin\"\n            />\n          ) : null}\n        </>\n      )}\n    </View>\n  );\n};\n\nexport default Slide;\n"],"mappings":"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"}

package/lib/template/app-player/popin-header/index.js

@@ -252,7 +252,7 @@ IconsPart.propTypes = process.env.NODE_ENV !== "production" ? {
   revival: _propTypes.default.bool
 } : {};
 
-const buildClass = (value, success, failed, loading, mode = 'default', scormStyle) => {
+const buildClass = (value, success, failed, loading, scormStyle, mode = 'default') => {
   if (loading && (0, _isNil2.default)(value)) return loading;
   if (mode === 'scorm') return scormStyle;
   return value ? failed : success;
@@ -281,7 +281,7 @@ const renderIconStatusScorm = failed => {
   }));
 };
 
-const buildDefaultOrScormStyle = (defaultStyle, mode = 'default', styleScorm, failed, failedStyle = null) => {
+const buildDefaultOrScormStyle = (defaultStyle, styleScorm, failed, mode = 'default', failedStyle = null) => {
   if (mode === 'scorm' && failed && failedStyle) return failedStyle;
   if (mode === 'scorm') return styleScorm;
   return defaultStyle;
@@ -299,12 +299,12 @@ const CorrectionPart = props => {
     mode = 'default'
   } = props;
   const isLoading = (0, _isNil2.default)(failed);
-  const className = buildClass(failed, stars && rank ? _style.default.correctionSectionEndSuccess : _style.default.correctionSectionSuccess, gameOver ? _style.default.correctionSectionFailGameOver : _style.default.correctionSectionFail, _style.default.correctionSectionLoading, mode, _style.default.resultContenantContainerScorm);
+  const className = buildClass(failed, stars && rank ? _style.default.correctionSectionEndSuccess : _style.default.correctionSectionSuccess, gameOver ? _style.default.correctionSectionFailGameOver : _style.default.correctionSectionFail, _style.default.correctionSectionLoading, _style.default.resultContenantContainerScorm, mode);
   return /*#__PURE__*/_react.default.createElement("div", {
     "data-name": "correctionSection",
     className: className
   }, mode === 'scorm' && !isLoading && renderIconStatusScorm(failed), /*#__PURE__*/_react.default.createElement("div", {
-    className: buildDefaultOrScormStyle(_style.default.titlesWrapper, mode, _style.default.titlesWrapperScorm, failed)
+    className: buildDefaultOrScormStyle(_style.default.titlesWrapper, _style.default.titlesWrapperScorm, failed, mode)
   }, isLoading ? /*#__PURE__*/_react.default.createElement(_loader.default, null) : null, /*#__PURE__*/_react.default.createElement("h1", {
     "data-name": "title",
     className: buildDefaultOrScormStyle((0, _classnames.default)(_style.default.title, _style.default.innerHTML), mode, _style.default.resultTitleScorm, failed) // eslint-disable-next-line react/no-danger