@pie-element/hotspot 10.0.0-beta.0 → 10.0.0-next.0

package/configure/lib/root.js.map

@@ -1 +1 @@
-{"version":3,"file":"root.js","names":["_react","_interopRequireDefault","require","_configUi","_propTypes","_editableHtml","_styles","_Typography","_Info","_Tooltip","_hotspotPalette","_hotspotContainer","_utils","Panel","toggle","dropdown","settings","DimensionsContainer","styled","theme","display","marginBottom","spacing","FieldContainer","flex","width","PromptContainer","InputContainer","paddingTop","marginTop","SubHeading","Typography","marginRight","FlexContainer","alignItems","StyledTooltip","Tooltip","fontSize","typography","whiteSpace","maxWidth","ErrorText","color","palette","error","main","Root","React","Component","constructor","args","_defineProperty2","default","fieldType","onColorChanged","props","cType","value","resizeType","model","dimensions","shapes","configuration","preserveAspectRatio","onUpdateImageDimension","onUpdateShapes","nextImageDimensions","updatedDimensions","updateImageDimensions","enabled","shapesArray","getAllShapes","updatedShapes","getUpdatedShapes","groupShapes","render","imageSupport","uploadSoundSupport","onConfigurationChanged","onImageUpload","onModelChangedByConfig","onPromptChanged","onRationaleChanged","onTeacherInstructionsChanged","baseInputConfiguration","contentDimensions","maxImageWidth","maxImageHeight","multipleCorrect","partialScoring","prompt","rationale","settingsPanelDisabled","spellCheck","teacherInstructions","withRubric","mathMlOptions","language","languageChoices","errors","extraCSSRules","promptEnabled","rationaleEnabled","spellCheckEnabled","teacherInstructionsEnabled","toolbarEditorPosition","promptError","rationaleError","shapesError","selections","selectionsError","teacherInstructionsError","validationMessage","generateValidationMessage","defaultImageMaxWidth","defaultImageMaxHeight","toolbarOpts","position","panelSettings","label","options","panelProperties","rubricEnabled","getPluginProps","createElement","layout","ConfigLayout","hideSettings","onChangeModel","onChangeConfiguration","groups","Settings","Properties","markup","onChange","nonEmpty","pluginProps","inputConfiguration","languageCharactersProps","variant","disableFocusListener","disableTouchListener","placement","title","style","float","hotspotColor","hotspotList","outlineColor","outlineList","onHotspotColorChange","handleColorChange","onOutlineColorChange","imageUrl","hasErrors","selectedHotspotColor","hoverOutlineColor","strokeWidth","preserveAspectRatioEnabled","insertImage","add","Fragment","NumberTextField","key","min","e","handleOnUpdateImageDimensions","showErrorWhenOutsideRange","height","exports","propTypes","PropTypes","object","isRequired","shape","func","delete","_default"],"sources":["../src/root.jsx"],"sourcesContent":["import React from 'react';\nimport { settings, layout, InputContainer, NumberTextField } from '@pie-lib/config-ui';\nimport PropTypes from 'prop-types';\nimport EditableHtml from '@pie-lib/editable-html';\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\nimport Info from '@mui/icons-material/Info';\nimport Tooltip from '@mui/material/Tooltip';\nimport HotspotPalette from './hotspot-palette';\nimport HotspotContainer from './hotspot-container';\nimport { updateImageDimensions, generateValidationMessage, getUpdatedShapes, getAllShapes, groupShapes } from './utils';\n\nconst { Panel, toggle, dropdown } = settings;\n\nconst DimensionsContainer = styled('div')(({ theme }) => ({\n  display: 'flex',\n  marginBottom: theme.spacing(1.5),\n}));\n\nconst FieldContainer = styled('div')({\n  flex: 1,\n  width: '90%',\n});\n\nconst PromptContainer = styled(InputContainer)(({ theme }) => ({\n  paddingTop: theme.spacing(1),\n  marginTop: theme.spacing(2),\n  marginBottom: theme.spacing(2),\n  width: '100%',\n}));\n\nconst SubHeading = styled(Typography)(({ theme }) => ({\n  marginRight: theme.spacing(1),\n}));\n\nconst FlexContainer = styled('div')({\n  display: 'flex',\n  alignItems: 'center',\n});\n\nconst StyledTooltip = styled(Tooltip)(({ theme }) => ({\n  '& .MuiTooltip-tooltip': {\n    fontSize: theme.typography.fontSize - 2,\n    whiteSpace: 'pre',\n    maxWidth: '500px',\n  },\n}));\n\nconst ErrorText = styled('div')(({ theme }) => ({\n  fontSize: theme.typography.fontSize - 2,\n  color: theme.palette.error.main,\n  paddingTop: theme.spacing(1),\n}));\n\nexport class Root extends React.Component {\n  handleColorChange = (fieldType, color) => {\n    const { onColorChanged } = this.props;\n    const cType = `${fieldType}Color`;\n\n    onColorChanged(cType, color);\n  };\n\n  handleOnUpdateImageDimensions = (value, resizeType) => {\n    const {\n      model: { dimensions, shapes },\n      configuration: { preserveAspectRatio = {} },\n      onUpdateImageDimension,\n      onUpdateShapes,\n    } = this.props;\n\n    const nextImageDimensions = { ...dimensions, [resizeType]: value };\n\n    // if preserveAspectRatio.enabled, updateImageDimensions function makes sure aspect ratio is kept\n    const updatedDimensions = updateImageDimensions(\n      dimensions,\n      nextImageDimensions,\n      preserveAspectRatio.enabled,\n      resizeType,\n    );\n    // transform shapes map into shapes array\n    const shapesArray = getAllShapes(shapes);\n    // transform all the shapes to fit the re-sized image\n    const updatedShapes = getUpdatedShapes(dimensions, updatedDimensions, shapesArray);\n    // transform shapes array back into shapes map\n\n    onUpdateShapes(groupShapes(updatedShapes));\n    onUpdateImageDimension(updatedDimensions);\n  };\n\n  render() {\n    const {\n      configuration,\n      model,\n      imageSupport,\n      uploadSoundSupport,\n      onConfigurationChanged,\n      onImageUpload,\n      onModelChangedByConfig,\n      onPromptChanged,\n      onRationaleChanged,\n      onUpdateImageDimension,\n      onTeacherInstructionsChanged,\n      onUpdateShapes,\n    } = this.props;\n    const {\n      baseInputConfiguration = {},\n      contentDimensions = {},\n      maxImageWidth = {},\n      maxImageHeight = {},\n      multipleCorrect = {},\n      partialScoring = {},\n      preserveAspectRatio = {},\n      prompt = {},\n      rationale = {},\n      settingsPanelDisabled,\n      spellCheck = {},\n      teacherInstructions = {},\n      withRubric = {},\n      mathMlOptions = {},\n      language = {},\n      languageChoices = {},\n    } = configuration || {};\n    const {\n      errors,\n      extraCSSRules,\n      promptEnabled,\n      rationaleEnabled,\n      spellCheckEnabled,\n      teacherInstructionsEnabled,\n      toolbarEditorPosition,\n    } = model || {};\n    const {\n      prompt: promptError,\n      rationale: rationaleError,\n      shapes: shapesError,\n      selections: selectionsError,\n      teacherInstructions: teacherInstructionsError,\n    } = errors || {};\n    const validationMessage = generateValidationMessage(configuration);\n\n    const defaultImageMaxWidth = maxImageWidth && maxImageWidth.prompt;\n    const defaultImageMaxHeight = maxImageHeight && maxImageHeight.prompt;\n\n    const toolbarOpts = {\n      position: toolbarEditorPosition === 'top' ? 'top' : 'bottom',\n    };\n\n    const panelSettings = {\n      multipleCorrect: multipleCorrect.settings && toggle(multipleCorrect.label),\n      partialScoring: partialScoring.settings && toggle(partialScoring.label),\n      promptEnabled: prompt.settings && toggle(prompt.label),\n      'language.enabled': language.settings && toggle(language.label, true),\n      language: language.settings && language.enabled && dropdown(languageChoices.label, languageChoices.options),\n    };\n    const panelProperties = {\n      teacherInstructionsEnabled: teacherInstructions.settings && toggle(teacherInstructions.label),\n      rationaleEnabled: rationale.settings && toggle(rationale.label),\n      spellCheckEnabled: spellCheck.settings && toggle(spellCheck.label),\n      rubricEnabled: withRubric?.settings && toggle(withRubric?.label),\n    };\n\n    const getPluginProps = (props = {}) => ({\n      ...baseInputConfiguration,\n      ...props,\n    });\n\n    return (\n      <layout.ConfigLayout\n        extraCSSRules={extraCSSRules}\n        dimensions={contentDimensions}\n        hideSettings={settingsPanelDisabled}\n        settings={\n          <Panel\n            model={model}\n            onChangeModel={onModelChangedByConfig}\n            configuration={configuration}\n            onChangeConfiguration={onConfigurationChanged}\n            groups={{\n              Settings: panelSettings,\n              Properties: panelProperties,\n            }}\n          />\n        }\n      >\n        {teacherInstructionsEnabled && (\n          <PromptContainer label={teacherInstructions.label}>\n            <EditableHtml\n              markup={model.teacherInstructions || ''}\n              onChange={onTeacherInstructionsChanged}\n              imageSupport={imageSupport}\n              nonEmpty={false}\n              error={teacherInstructionsError}\n              toolbarOpts={toolbarOpts}\n              pluginProps={getPluginProps(teacherInstructions?.inputConfiguration)}\n              spellCheck={spellCheckEnabled}\n              maxImageWidth={(maxImageWidth && maxImageWidth.teacherInstructions) || defaultImageMaxWidth}\n              maxImageHeight={(maxImageHeight && maxImageHeight.teacherInstructions) || defaultImageMaxHeight}\n              uploadSoundSupport={uploadSoundSupport}\n              languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n              mathMlOptions={mathMlOptions}\n            />\n            {teacherInstructionsError && <ErrorText>{teacherInstructionsError}</ErrorText>}\n          </PromptContainer>\n        )}\n\n        {promptEnabled && (\n          <PromptContainer label={prompt.label}>\n            <EditableHtml\n              markup={model.prompt || ''}\n              onChange={onPromptChanged}\n              imageSupport={imageSupport}\n              nonEmpty={false}\n              error={promptError}\n              toolbarOpts={toolbarOpts}\n              pluginProps={getPluginProps(prompt?.inputConfiguration)}\n              spellCheck={spellCheckEnabled}\n              maxImageWidth={defaultImageMaxWidth}\n              maxImageHeight={defaultImageMaxHeight}\n              uploadSoundSupport={uploadSoundSupport}\n              languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n              mathMlOptions={mathMlOptions}\n            />\n            {promptError && <ErrorText>{promptError}</ErrorText>}\n          </PromptContainer>\n        )}\n\n        <FlexContainer>\n          <SubHeading variant=\"h6\">\n            Define Hotspot\n          </SubHeading>\n          <StyledTooltip\n            disableFocusListener\n            disableTouchListener\n            placement={'left'}\n            title={validationMessage}\n          >\n            <Info fontSize={'small'} color={'primary'} style={{ float: 'right' }} />\n          </StyledTooltip>\n        </FlexContainer>\n\n        <HotspotPalette\n          hotspotColor={model.hotspotColor}\n          hotspotList={model.hotspotList}\n          outlineColor={model.outlineColor}\n          outlineList={model.outlineList}\n          onHotspotColorChange={(color) => this.handleColorChange('hotspot', color)}\n          onOutlineColorChange={(color) => this.handleColorChange('outline', color)}\n        />\n\n        <HotspotContainer\n          dimensions={model.dimensions}\n          imageUrl={model.imageUrl}\n          multipleCorrect={model.multipleCorrect}\n          hasErrors={!!shapesError || !!selectionsError}\n          hotspotColor={model.hotspotColor}\n          outlineColor={model.outlineColor}\n          selectedHotspotColor={model.selectedHotspotColor}\n          hoverOutlineColor={model.hoverOutlineColor}\n          onUpdateImageDimension={onUpdateImageDimension}\n          onUpdateShapes={onUpdateShapes}\n          onImageUpload={onImageUpload}\n          shapes={model.shapes}\n          strokeWidth={model.strokeWidth}\n          preserveAspectRatioEnabled={preserveAspectRatio.enabled}\n          insertImage={imageSupport && imageSupport.add}\n        />\n        {shapesError && <ErrorText>{shapesError}</ErrorText>}\n        {selectionsError && <ErrorText>{selectionsError}</ErrorText>}\n\n        {model.imageUrl && (\n          <React.Fragment>\n            <Typography variant=\"h6\">Image Dimensions</Typography>\n\n            <DimensionsContainer>\n              <FieldContainer>\n                <NumberTextField\n                  key=\"hotspot-manual-width\"\n                  label=\"Width\"\n                  value={model.dimensions.width}\n                  min={0}\n                  onChange={(e, value) => this.handleOnUpdateImageDimensions(value, 'width')}\n                  showErrorWhenOutsideRange\n                />\n              </FieldContainer>\n\n              <FieldContainer>\n                <NumberTextField\n                  key=\"hotspot-manual-height\"\n                  label=\"Height\"\n                  value={model.dimensions.height}\n                  min={0}\n                  onChange={(e, value) => this.handleOnUpdateImageDimensions(value, 'height')}\n                  showErrorWhenOutsideRange\n                />\n              </FieldContainer>\n            </DimensionsContainer>\n          </React.Fragment>\n        )}\n\n        {rationaleEnabled && (\n          <PromptContainer label={rationale.label}>\n            <EditableHtml\n              markup={model.rationale || ''}\n              onChange={onRationaleChanged}\n              imageSupport={imageSupport}\n              error={rationaleError}\n              toolbarOpts={toolbarOpts}\n              pluginProps={getPluginProps(rationale?.inputConfiguration)}\n              spellCheck={spellCheckEnabled}\n              maxImageWidth={(maxImageWidth && maxImageWidth.rationale) || defaultImageMaxWidth}\n              maxImageHeight={(maxImageHeight && maxImageHeight.rationale) || defaultImageMaxHeight}\n              uploadSoundSupport={uploadSoundSupport}\n              languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n              mathMlOptions={mathMlOptions}\n            />\n            {rationaleError && <ErrorText>{rationaleError}</ErrorText>}\n          </PromptContainer>\n        )}\n      </layout.ConfigLayout>\n    );\n  }\n}\n\nRoot.propTypes = {\n  configuration: PropTypes.object,\n  model: PropTypes.object.isRequired,\n  imageSupport: PropTypes.shape({\n    add: PropTypes.func,\n    delete: PropTypes.func,\n  }),\n  uploadSoundSupport: PropTypes.shape({\n    add: PropTypes.func,\n    delete: PropTypes.func,\n  }),\n  onImageUpload: PropTypes.func.isRequired,\n  onColorChanged: PropTypes.func.isRequired,\n  onPromptChanged: PropTypes.func.isRequired,\n  onUpdateImageDimension: PropTypes.func.isRequired,\n  onUpdateShapes: PropTypes.func.isRequired,\n  onModelChangedByConfig: PropTypes.func.isRequired,\n  onRationaleChanged: PropTypes.func.isRequired,\n  onConfigurationChanged: PropTypes.func.isRequired,\n  onTeacherInstructionsChanged: PropTypes.func.isRequired,\n};\n\nexport default Root;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"root.js","names":["_react","_interopRequireDefault","require","_configUi","_propTypes","_editableHtmlTipTap","_styles","_Typography","_Info","_Tooltip","_hotspotPalette","_hotspotContainer","_utils","Panel","toggle","dropdown","settings","DimensionsContainer","styled","theme","display","marginBottom","spacing","FieldContainer","flex","width","PromptContainer","InputContainer","paddingTop","marginTop","SubHeading","Typography","marginRight","FlexContainer","alignItems","StyledTooltip","Tooltip","fontSize","typography","whiteSpace","maxWidth","ErrorText","color","palette","error","main","Root","React","Component","constructor","args","_defineProperty2","default","fieldType","onColorChanged","props","cType","value","resizeType","model","dimensions","shapes","configuration","preserveAspectRatio","onUpdateImageDimension","onUpdateShapes","nextImageDimensions","updatedDimensions","updateImageDimensions","enabled","shapesArray","getAllShapes","updatedShapes","getUpdatedShapes","groupShapes","render","imageSupport","uploadSoundSupport","onConfigurationChanged","onImageUpload","onModelChangedByConfig","onPromptChanged","onRationaleChanged","onTeacherInstructionsChanged","baseInputConfiguration","contentDimensions","maxImageWidth","maxImageHeight","multipleCorrect","partialScoring","prompt","rationale","settingsPanelDisabled","spellCheck","teacherInstructions","withRubric","mathMlOptions","language","languageChoices","errors","extraCSSRules","promptEnabled","rationaleEnabled","spellCheckEnabled","teacherInstructionsEnabled","toolbarEditorPosition","promptError","rationaleError","shapesError","selections","selectionsError","teacherInstructionsError","validationMessage","generateValidationMessage","defaultImageMaxWidth","defaultImageMaxHeight","toolbarOpts","position","panelSettings","label","options","panelProperties","rubricEnabled","getPluginProps","createElement","layout","ConfigLayout","hideSettings","onChangeModel","onChangeConfiguration","groups","Settings","Properties","markup","onChange","nonEmpty","pluginProps","inputConfiguration","languageCharactersProps","variant","disableFocusListener","disableTouchListener","placement","title","style","float","hotspotColor","hotspotList","outlineColor","outlineList","onHotspotColorChange","handleColorChange","onOutlineColorChange","imageUrl","hasErrors","selectedHotspotColor","hoverOutlineColor","strokeWidth","preserveAspectRatioEnabled","insertImage","add","Fragment","NumberTextField","key","min","e","handleOnUpdateImageDimensions","showErrorWhenOutsideRange","height","exports","propTypes","PropTypes","object","isRequired","shape","func","delete","_default"],"sources":["../src/root.jsx"],"sourcesContent":["import React from 'react';\nimport { settings, layout, InputContainer, NumberTextField } from '@pie-lib/config-ui';\nimport PropTypes from 'prop-types';\nimport EditableHtml from '@pie-lib/editable-html-tip-tap';\nimport { styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\nimport Info from '@mui/icons-material/Info';\nimport Tooltip from '@mui/material/Tooltip';\nimport HotspotPalette from './hotspot-palette';\nimport HotspotContainer from './hotspot-container';\nimport { updateImageDimensions, generateValidationMessage, getUpdatedShapes, getAllShapes, groupShapes } from './utils';\n\nconst { Panel, toggle, dropdown } = settings;\n\nconst DimensionsContainer = styled('div')(({ theme }) => ({\n  display: 'flex',\n  marginBottom: theme.spacing(1.5),\n}));\n\nconst FieldContainer = styled('div')({\n  flex: 1,\n  width: '90%',\n});\n\nconst PromptContainer = styled(InputContainer)(({ theme }) => ({\n  paddingTop: theme.spacing(1),\n  marginTop: theme.spacing(2),\n  marginBottom: theme.spacing(2),\n  width: '100%',\n}));\n\nconst SubHeading = styled(Typography)(({ theme }) => ({\n  marginRight: theme.spacing(1),\n}));\n\nconst FlexContainer = styled('div')({\n  display: 'flex',\n  alignItems: 'center',\n});\n\nconst StyledTooltip = styled(Tooltip)(({ theme }) => ({\n  '& .MuiTooltip-tooltip': {\n    fontSize: theme.typography.fontSize - 2,\n    whiteSpace: 'pre',\n    maxWidth: '500px',\n  },\n}));\n\nconst ErrorText = styled('div')(({ theme }) => ({\n  fontSize: theme.typography.fontSize - 2,\n  color: theme.palette.error.main,\n  paddingTop: theme.spacing(1),\n}));\n\nexport class Root extends React.Component {\n  handleColorChange = (fieldType, color) => {\n    const { onColorChanged } = this.props;\n    const cType = `${fieldType}Color`;\n\n    onColorChanged(cType, color);\n  };\n\n  handleOnUpdateImageDimensions = (value, resizeType) => {\n    const {\n      model: { dimensions, shapes },\n      configuration: { preserveAspectRatio = {} },\n      onUpdateImageDimension,\n      onUpdateShapes,\n    } = this.props;\n\n    const nextImageDimensions = { ...dimensions, [resizeType]: value };\n\n    // if preserveAspectRatio.enabled, updateImageDimensions function makes sure aspect ratio is kept\n    const updatedDimensions = updateImageDimensions(\n      dimensions,\n      nextImageDimensions,\n      preserveAspectRatio.enabled,\n      resizeType,\n    );\n    // transform shapes map into shapes array\n    const shapesArray = getAllShapes(shapes);\n    // transform all the shapes to fit the re-sized image\n    const updatedShapes = getUpdatedShapes(dimensions, updatedDimensions, shapesArray);\n    // transform shapes array back into shapes map\n\n    onUpdateShapes(groupShapes(updatedShapes));\n    onUpdateImageDimension(updatedDimensions);\n  };\n\n  render() {\n    const {\n      configuration,\n      model,\n      imageSupport,\n      uploadSoundSupport,\n      onConfigurationChanged,\n      onImageUpload,\n      onModelChangedByConfig,\n      onPromptChanged,\n      onRationaleChanged,\n      onUpdateImageDimension,\n      onTeacherInstructionsChanged,\n      onUpdateShapes,\n    } = this.props;\n    const {\n      baseInputConfiguration = {},\n      contentDimensions = {},\n      maxImageWidth = {},\n      maxImageHeight = {},\n      multipleCorrect = {},\n      partialScoring = {},\n      preserveAspectRatio = {},\n      prompt = {},\n      rationale = {},\n      settingsPanelDisabled,\n      spellCheck = {},\n      teacherInstructions = {},\n      withRubric = {},\n      mathMlOptions = {},\n      language = {},\n      languageChoices = {},\n    } = configuration || {};\n    const {\n      errors,\n      extraCSSRules,\n      promptEnabled,\n      rationaleEnabled,\n      spellCheckEnabled,\n      teacherInstructionsEnabled,\n      toolbarEditorPosition,\n    } = model || {};\n    const {\n      prompt: promptError,\n      rationale: rationaleError,\n      shapes: shapesError,\n      selections: selectionsError,\n      teacherInstructions: teacherInstructionsError,\n    } = errors || {};\n    const validationMessage = generateValidationMessage(configuration);\n\n    const defaultImageMaxWidth = maxImageWidth && maxImageWidth.prompt;\n    const defaultImageMaxHeight = maxImageHeight && maxImageHeight.prompt;\n\n    const toolbarOpts = {\n      position: toolbarEditorPosition === 'top' ? 'top' : 'bottom',\n    };\n\n    const panelSettings = {\n      multipleCorrect: multipleCorrect.settings && toggle(multipleCorrect.label),\n      partialScoring: partialScoring.settings && toggle(partialScoring.label),\n      promptEnabled: prompt.settings && toggle(prompt.label),\n      'language.enabled': language.settings && toggle(language.label, true),\n      language: language.settings && language.enabled && dropdown(languageChoices.label, languageChoices.options),\n    };\n    const panelProperties = {\n      teacherInstructionsEnabled: teacherInstructions.settings && toggle(teacherInstructions.label),\n      rationaleEnabled: rationale.settings && toggle(rationale.label),\n      spellCheckEnabled: spellCheck.settings && toggle(spellCheck.label),\n      rubricEnabled: withRubric?.settings && toggle(withRubric?.label),\n    };\n\n    const getPluginProps = (props = {}) => ({\n      ...baseInputConfiguration,\n      ...props,\n    });\n\n    return (\n      <layout.ConfigLayout\n        extraCSSRules={extraCSSRules}\n        dimensions={contentDimensions}\n        hideSettings={settingsPanelDisabled}\n        settings={\n          <Panel\n            model={model}\n            onChangeModel={onModelChangedByConfig}\n            configuration={configuration}\n            onChangeConfiguration={onConfigurationChanged}\n            groups={{\n              Settings: panelSettings,\n              Properties: panelProperties,\n            }}\n          />\n        }\n      >\n        {teacherInstructionsEnabled && (\n          <PromptContainer label={teacherInstructions.label}>\n            <EditableHtml\n              markup={model.teacherInstructions || ''}\n              onChange={onTeacherInstructionsChanged}\n              imageSupport={imageSupport}\n              nonEmpty={false}\n              error={teacherInstructionsError}\n              toolbarOpts={toolbarOpts}\n              pluginProps={getPluginProps(teacherInstructions?.inputConfiguration)}\n              spellCheck={spellCheckEnabled}\n              maxImageWidth={(maxImageWidth && maxImageWidth.teacherInstructions) || defaultImageMaxWidth}\n              maxImageHeight={(maxImageHeight && maxImageHeight.teacherInstructions) || defaultImageMaxHeight}\n              uploadSoundSupport={uploadSoundSupport}\n              languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n              mathMlOptions={mathMlOptions}\n            />\n            {teacherInstructionsError && <ErrorText>{teacherInstructionsError}</ErrorText>}\n          </PromptContainer>\n        )}\n\n        {promptEnabled && (\n          <PromptContainer label={prompt.label}>\n            <EditableHtml\n              markup={model.prompt || ''}\n              onChange={onPromptChanged}\n              imageSupport={imageSupport}\n              nonEmpty={false}\n              error={promptError}\n              toolbarOpts={toolbarOpts}\n              pluginProps={getPluginProps(prompt?.inputConfiguration)}\n              spellCheck={spellCheckEnabled}\n              maxImageWidth={defaultImageMaxWidth}\n              maxImageHeight={defaultImageMaxHeight}\n              uploadSoundSupport={uploadSoundSupport}\n              languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n              mathMlOptions={mathMlOptions}\n            />\n            {promptError && <ErrorText>{promptError}</ErrorText>}\n          </PromptContainer>\n        )}\n\n        <FlexContainer>\n          <SubHeading variant=\"h6\">\n            Define Hotspot\n          </SubHeading>\n          <StyledTooltip\n            disableFocusListener\n            disableTouchListener\n            placement={'left'}\n            title={validationMessage}\n          >\n            <Info fontSize={'small'} color={'primary'} style={{ float: 'right' }} />\n          </StyledTooltip>\n        </FlexContainer>\n\n        <HotspotPalette\n          hotspotColor={model.hotspotColor}\n          hotspotList={model.hotspotList}\n          outlineColor={model.outlineColor}\n          outlineList={model.outlineList}\n          onHotspotColorChange={(color) => this.handleColorChange('hotspot', color)}\n          onOutlineColorChange={(color) => this.handleColorChange('outline', color)}\n        />\n\n        <HotspotContainer\n          dimensions={model.dimensions}\n          imageUrl={model.imageUrl}\n          multipleCorrect={model.multipleCorrect}\n          hasErrors={!!shapesError || !!selectionsError}\n          hotspotColor={model.hotspotColor}\n          outlineColor={model.outlineColor}\n          selectedHotspotColor={model.selectedHotspotColor}\n          hoverOutlineColor={model.hoverOutlineColor}\n          onUpdateImageDimension={onUpdateImageDimension}\n          onUpdateShapes={onUpdateShapes}\n          onImageUpload={onImageUpload}\n          shapes={model.shapes}\n          strokeWidth={model.strokeWidth}\n          preserveAspectRatioEnabled={preserveAspectRatio.enabled}\n          insertImage={imageSupport && imageSupport.add}\n        />\n        {shapesError && <ErrorText>{shapesError}</ErrorText>}\n        {selectionsError && <ErrorText>{selectionsError}</ErrorText>}\n\n        {model.imageUrl && (\n          <React.Fragment>\n            <Typography variant=\"h6\">Image Dimensions</Typography>\n\n            <DimensionsContainer>\n              <FieldContainer>\n                <NumberTextField\n                  key=\"hotspot-manual-width\"\n                  label=\"Width\"\n                  value={model.dimensions.width}\n                  min={0}\n                  onChange={(e, value) => this.handleOnUpdateImageDimensions(value, 'width')}\n                  showErrorWhenOutsideRange\n                />\n              </FieldContainer>\n\n              <FieldContainer>\n                <NumberTextField\n                  key=\"hotspot-manual-height\"\n                  label=\"Height\"\n                  value={model.dimensions.height}\n                  min={0}\n                  onChange={(e, value) => this.handleOnUpdateImageDimensions(value, 'height')}\n                  showErrorWhenOutsideRange\n                />\n              </FieldContainer>\n            </DimensionsContainer>\n          </React.Fragment>\n        )}\n\n        {rationaleEnabled && (\n          <PromptContainer label={rationale.label}>\n            <EditableHtml\n              markup={model.rationale || ''}\n              onChange={onRationaleChanged}\n              imageSupport={imageSupport}\n              error={rationaleError}\n              toolbarOpts={toolbarOpts}\n              pluginProps={getPluginProps(rationale?.inputConfiguration)}\n              spellCheck={spellCheckEnabled}\n              maxImageWidth={(maxImageWidth && maxImageWidth.rationale) || defaultImageMaxWidth}\n              maxImageHeight={(maxImageHeight && maxImageHeight.rationale) || defaultImageMaxHeight}\n              uploadSoundSupport={uploadSoundSupport}\n              languageCharactersProps={[{ language: 'spanish' }, { language: 'special' }]}\n              mathMlOptions={mathMlOptions}\n            />\n            {rationaleError && <ErrorText>{rationaleError}</ErrorText>}\n          </PromptContainer>\n        )}\n      </layout.ConfigLayout>\n    );\n  }\n}\n\nRoot.propTypes = {\n  configuration: PropTypes.object,\n  model: PropTypes.object.isRequired,\n  imageSupport: PropTypes.shape({\n    add: PropTypes.func,\n    delete: PropTypes.func,\n  }),\n  uploadSoundSupport: PropTypes.shape({\n    add: PropTypes.func,\n    delete: PropTypes.func,\n  }),\n  onImageUpload: PropTypes.func.isRequired,\n  onColorChanged: PropTypes.func.isRequired,\n  onPromptChanged: PropTypes.func.isRequired,\n  onUpdateImageDimension: PropTypes.func.isRequired,\n  onUpdateShapes: PropTypes.func.isRequired,\n  onModelChangedByConfig: PropTypes.func.isRequired,\n  onRationaleChanged: PropTypes.func.isRequired,\n  onConfigurationChanged: PropTypes.func.isRequired,\n  onTeacherInstructionsChanged: PropTypes.func.isRequired,\n};\n\nexport default Root;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,mBAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AACA,IAAAK,WAAA,GAAAN,sBAAA,CAAAC,OAAA;AACA,IAAAM,KAAA,GAAAP,sBAAA,CAAAC,OAAA;AACA,IAAAO,QAAA,GAAAR,sBAAA,CAAAC,OAAA;AACA,IAAAQ,eAAA,GAAAT,sBAAA,CAAAC,OAAA;AACA,IAAAS,iBAAA,GAAAV,sBAAA,CAAAC,OAAA;AACA,IAAAU,MAAA,GAAAV,OAAA;AAEA,MAAM;EAAEW,KAAK;EAAEC,MAAM;EAAEC;AAAS,CAAC,GAAGC,kBAAQ;AAE5C,MAAMC,mBAAmB,GAAG,IAAAC,cAAM,EAAC,KAAK,CAAC,CAAC,CAAC;EAAEC;AAAM,CAAC,MAAM;EACxDC,OAAO,EAAE,MAAM;EACfC,YAAY,EAAEF,KAAK,CAACG,OAAO,CAAC,GAAG;AACjC,CAAC,CAAC,CAAC;AAEH,MAAMC,cAAc,GAAG,IAAAL,cAAM,EAAC,KAAK,CAAC,CAAC;EACnCM,IAAI,EAAE,CAAC;EACPC,KAAK,EAAE;AACT,CAAC,CAAC;AAEF,MAAMC,eAAe,GAAG,IAAAR,cAAM,EAACS,wBAAc,CAAC,CAAC,CAAC;EAAER;AAAM,CAAC,MAAM;EAC7DS,UAAU,EAAET,KAAK,CAACG,OAAO,CAAC,CAAC,CAAC;EAC5BO,SAAS,EAAEV,KAAK,CAACG,OAAO,CAAC,CAAC,CAAC;EAC3BD,YAAY,EAAEF,KAAK,CAACG,OAAO,CAAC,CAAC,CAAC;EAC9BG,KAAK,EAAE;AACT,CAAC,CAAC,CAAC;AAEH,MAAMK,UAAU,GAAG,IAAAZ,cAAM,EAACa,mBAAU,CAAC,CAAC,CAAC;EAAEZ;AAAM,CAAC,MAAM;EACpDa,WAAW,EAAEb,KAAK,CAACG,OAAO,CAAC,CAAC;AAC9B,CAAC,CAAC,CAAC;AAEH,MAAMW,aAAa,GAAG,IAAAf,cAAM,EAAC,KAAK,CAAC,CAAC;EAClCE,OAAO,EAAE,MAAM;EACfc,UAAU,EAAE;AACd,CAAC,CAAC;AAEF,MAAMC,aAAa,GAAG,IAAAjB,cAAM,EAACkB,gBAAO,CAAC,CAAC,CAAC;EAAEjB;AAAM,CAAC,MAAM;EACpD,uBAAuB,EAAE;IACvBkB,QAAQ,EAAElB,KAAK,CAACmB,UAAU,CAACD,QAAQ,GAAG,CAAC;IACvCE,UAAU,EAAE,KAAK;IACjBC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC,CAAC;AAEH,MAAMC,SAAS,GAAG,IAAAvB,cAAM,EAAC,KAAK,CAAC,CAAC,CAAC;EAAEC;AAAM,CAAC,MAAM;EAC9CkB,QAAQ,EAAElB,KAAK,CAACmB,UAAU,CAACD,QAAQ,GAAG,CAAC;EACvCK,KAAK,EAAEvB,KAAK,CAACwB,OAAO,CAACC,KAAK,CAACC,IAAI;EAC/BjB,UAAU,EAAET,KAAK,CAACG,OAAO,CAAC,CAAC;AAC7B,CAAC,CAAC,CAAC;AAEI,MAAMwB,IAAI,SAASC,cAAK,CAACC,SAAS,CAAC;EAAAC,YAAA,GAAAC,IAAA;IAAA,SAAAA,IAAA;IAAA,IAAAC,gBAAA,CAAAC,OAAA,6BACpB,CAACC,SAAS,EAAEX,KAAK,KAAK;MACxC,MAAM;QAAEY;MAAe,CAAC,GAAG,IAAI,CAACC,KAAK;MACrC,MAAMC,KAAK,GAAG,GAAGH,SAAS,OAAO;MAEjCC,cAAc,CAACE,KAAK,EAAEd,KAAK,CAAC;IAC9B,CAAC;IAAA,IAAAS,gBAAA,CAAAC,OAAA,yCAE+B,CAACK,KAAK,EAAEC,UAAU,KAAK;MACrD,MAAM;QACJC,KAAK,EAAE;UAAEC,UAAU;UAAEC;QAAO,CAAC;QAC7BC,aAAa,EAAE;UAAEC,mBAAmB,GAAG,CAAC;QAAE,CAAC;QAC3CC,sBAAsB;QACtBC;MACF,CAAC,GAAG,IAAI,CAACV,KAAK;MAEd,MAAMW,mBAAmB,GAAG;QAAE,GAAGN,UAAU;QAAE,CAACF,UAAU,GAAGD;MAAM,CAAC;;MAElE;MACA,MAAMU,iBAAiB,GAAG,IAAAC,4BAAqB,EAC7CR,UAAU,EACVM,mBAAmB,EACnBH,mBAAmB,CAACM,OAAO,EAC3BX,UACF,CAAC;MACD;MACA,MAAMY,WAAW,GAAG,IAAAC,mBAAY,EAACV,MAAM,CAAC;MACxC;MACA,MAAMW,aAAa,GAAG,IAAAC,uBAAgB,EAACb,UAAU,EAAEO,iBAAiB,EAAEG,WAAW,CAAC;MAClF;;MAEAL,cAAc,CAAC,IAAAS,kBAAW,EAACF,aAAa,CAAC,CAAC;MAC1CR,sBAAsB,CAACG,iBAAiB,CAAC;IAC3C,CAAC;EAAA;EAEDQ,MAAMA,CAAA,EAAG;IACP,MAAM;MACJb,aAAa;MACbH,KAAK;MACLiB,YAAY;MACZC,kBAAkB;MAClBC,sBAAsB;MACtBC,aAAa;MACbC,sBAAsB;MACtBC,eAAe;MACfC,kBAAkB;MAClBlB,sBAAsB;MACtBmB,4BAA4B;MAC5BlB;IACF,CAAC,GAAG,IAAI,CAACV,KAAK;IACd,MAAM;MACJ6B,sBAAsB,GAAG,CAAC,CAAC;MAC3BC,iBAAiB,GAAG,CAAC,CAAC;MACtBC,aAAa,GAAG,CAAC,CAAC;MAClBC,cAAc,GAAG,CAAC,CAAC;MACnBC,eAAe,GAAG,CAAC,CAAC;MACpBC,cAAc,GAAG,CAAC,CAAC;MACnB1B,mBAAmB,GAAG,CAAC,CAAC;MACxB2B,MAAM,GAAG,CAAC,CAAC;MACXC,SAAS,GAAG,CAAC,CAAC;MACdC,qBAAqB;MACrBC,UAAU,GAAG,CAAC,CAAC;MACfC,mBAAmB,GAAG,CAAC,CAAC;MACxBC,UAAU,GAAG,CAAC,CAAC;MACfC,aAAa,GAAG,CAAC,CAAC;MAClBC,QAAQ,GAAG,CAAC,CAAC;MACbC,eAAe,GAAG,CAAC;IACrB,CAAC,GAAGpC,aAAa,IAAI,CAAC,CAAC;IACvB,MAAM;MACJqC,MAAM;MACNC,aAAa;MACbC,aAAa;MACbC,gBAAgB;MAChBC,iBAAiB;MACjBC,0BAA0B;MAC1BC;IACF,CAAC,GAAG9C,KAAK,IAAI,CAAC,CAAC;IACf,MAAM;MACJ+B,MAAM,EAAEgB,WAAW;MACnBf,SAAS,EAAEgB,cAAc;MACzB9C,MAAM,EAAE+C,WAAW;MACnBC,UAAU,EAAEC,eAAe;MAC3BhB,mBAAmB,EAAEiB;IACvB,CAAC,GAAGZ,MAAM,IAAI,CAAC,CAAC;IAChB,MAAMa,iBAAiB,GAAG,IAAAC,gCAAyB,EAACnD,aAAa,CAAC;IAElE,MAAMoD,oBAAoB,GAAG5B,aAAa,IAAIA,aAAa,CAACI,MAAM;IAClE,MAAMyB,qBAAqB,GAAG5B,cAAc,IAAIA,cAAc,CAACG,MAAM;IAErE,MAAM0B,WAAW,GAAG;MAClBC,QAAQ,EAAEZ,qBAAqB,KAAK,KAAK,GAAG,KAAK,GAAG;IACtD,CAAC;IAED,MAAMa,aAAa,GAAG;MACpB9B,eAAe,EAAEA,eAAe,CAACxE,QAAQ,IAAIF,MAAM,CAAC0E,eAAe,CAAC+B,KAAK,CAAC;MAC1E9B,cAAc,EAAEA,cAAc,CAACzE,QAAQ,IAAIF,MAAM,CAAC2E,cAAc,CAAC8B,KAAK,CAAC;MACvElB,aAAa,EAAEX,MAAM,CAAC1E,QAAQ,IAAIF,MAAM,CAAC4E,MAAM,CAAC6B,KAAK,CAAC;MACtD,kBAAkB,EAAEtB,QAAQ,CAACjF,QAAQ,IAAIF,MAAM,CAACmF,QAAQ,CAACsB,KAAK,EAAE,IAAI,CAAC;MACrEtB,QAAQ,EAAEA,QAAQ,CAACjF,QAAQ,IAAIiF,QAAQ,CAAC5B,OAAO,IAAItD,QAAQ,CAACmF,eAAe,CAACqB,KAAK,EAAErB,eAAe,CAACsB,OAAO;IAC5G,CAAC;IACD,MAAMC,eAAe,GAAG;MACtBjB,0BAA0B,EAAEV,mBAAmB,CAAC9E,QAAQ,IAAIF,MAAM,CAACgF,mBAAmB,CAACyB,KAAK,CAAC;MAC7FjB,gBAAgB,EAAEX,SAAS,CAAC3E,QAAQ,IAAIF,MAAM,CAAC6E,SAAS,CAAC4B,KAAK,CAAC;MAC/DhB,iBAAiB,EAAEV,UAAU,CAAC7E,QAAQ,IAAIF,MAAM,CAAC+E,UAAU,CAAC0B,KAAK,CAAC;MAClEG,aAAa,EAAE3B,UAAU,EAAE/E,QAAQ,IAAIF,MAAM,CAACiF,UAAU,EAAEwB,KAAK;IACjE,CAAC;IAED,MAAMI,cAAc,GAAGA,CAACpE,KAAK,GAAG,CAAC,CAAC,MAAM;MACtC,GAAG6B,sBAAsB;MACzB,GAAG7B;IACL,CAAC,CAAC;IAEF,oBACEvD,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACzH,SAAA,CAAA0H,MAAM,CAACC,YAAY;MAClB1B,aAAa,EAAEA,aAAc;MAC7BxC,UAAU,EAAEyB,iBAAkB;MAC9B0C,YAAY,EAAEnC,qBAAsB;MACpC5E,QAAQ,eACNhB,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAAC/G,KAAK;QACJ8C,KAAK,EAAEA,KAAM;QACbqE,aAAa,EAAEhD,sBAAuB;QACtClB,aAAa,EAAEA,aAAc;QAC7BmE,qBAAqB,EAAEnD,sBAAuB;QAC9CoD,MAAM,EAAE;UACNC,QAAQ,EAAEb,aAAa;UACvBc,UAAU,EAAEX;QACd;MAAE,CACH;IACF,GAEAjB,0BAA0B,iBACzBxG,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAAClG,eAAe;MAAC6F,KAAK,EAAEzB,mBAAmB,CAACyB;IAAM,gBAChDvH,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACvH,mBAAA,CAAA+C,OAAY;MACXiF,MAAM,EAAE1E,KAAK,CAACmC,mBAAmB,IAAI,EAAG;MACxCwC,QAAQ,EAAEnD,4BAA6B;MACvCP,YAAY,EAAEA,YAAa;MAC3B2D,QAAQ,EAAE,KAAM;MAChB3F,KAAK,EAAEmE,wBAAyB;MAChCK,WAAW,EAAEA,WAAY;MACzBoB,WAAW,EAAEb,cAAc,CAAC7B,mBAAmB,EAAE2C,kBAAkB,CAAE;MACrE5C,UAAU,EAAEU,iBAAkB;MAC9BjB,aAAa,EAAGA,aAAa,IAAIA,aAAa,CAACQ,mBAAmB,IAAKoB,oBAAqB;MAC5F3B,cAAc,EAAGA,cAAc,IAAIA,cAAc,CAACO,mBAAmB,IAAKqB,qBAAsB;MAChGtC,kBAAkB,EAAEA,kBAAmB;MACvC6D,uBAAuB,EAAE,CAAC;QAAEzC,QAAQ,EAAE;MAAU,CAAC,EAAE;QAAEA,QAAQ,EAAE;MAAU,CAAC,CAAE;MAC5ED,aAAa,EAAEA;IAAc,CAC9B,CAAC,EACDe,wBAAwB,iBAAI/G,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACnF,SAAS,QAAEsE,wBAAoC,CAC9D,CAClB,EAEAV,aAAa,iBACZrG,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAAClG,eAAe;MAAC6F,KAAK,EAAE7B,MAAM,CAAC6B;IAAM,gBACnCvH,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACvH,mBAAA,CAAA+C,OAAY;MACXiF,MAAM,EAAE1E,KAAK,CAAC+B,MAAM,IAAI,EAAG;MAC3B4C,QAAQ,EAAErD,eAAgB;MAC1BL,YAAY,EAAEA,YAAa;MAC3B2D,QAAQ,EAAE,KAAM;MAChB3F,KAAK,EAAE8D,WAAY;MACnBU,WAAW,EAAEA,WAAY;MACzBoB,WAAW,EAAEb,cAAc,CAACjC,MAAM,EAAE+C,kBAAkB,CAAE;MACxD5C,UAAU,EAAEU,iBAAkB;MAC9BjB,aAAa,EAAE4B,oBAAqB;MACpC3B,cAAc,EAAE4B,qBAAsB;MACtCtC,kBAAkB,EAAEA,kBAAmB;MACvC6D,uBAAuB,EAAE,CAAC;QAAEzC,QAAQ,EAAE;MAAU,CAAC,EAAE;QAAEA,QAAQ,EAAE;MAAU,CAAC,CAAE;MAC5ED,aAAa,EAAEA;IAAc,CAC9B,CAAC,EACDU,WAAW,iBAAI1G,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACnF,SAAS,QAAEiE,WAAuB,CACpC,CAClB,eAED1G,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAAC3F,aAAa,qBACZjC,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAAC9F,UAAU;MAAC6G,OAAO,EAAC;IAAI,GAAC,gBAEb,CAAC,eACb3I,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACzF,aAAa;MACZyG,oBAAoB;MACpBC,oBAAoB;MACpBC,SAAS,EAAE,MAAO;MAClBC,KAAK,EAAE/B;IAAkB,gBAEzBhH,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACpH,KAAA,CAAA4C,OAAI;MAACf,QAAQ,EAAE,OAAQ;MAACK,KAAK,EAAE,SAAU;MAACsG,KAAK,EAAE;QAAEC,KAAK,EAAE;MAAQ;IAAE,CAAE,CAC1D,CACF,CAAC,eAEhBjJ,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAAClH,eAAA,CAAA0C,OAAc;MACb8F,YAAY,EAAEvF,KAAK,CAACuF,YAAa;MACjCC,WAAW,EAAExF,KAAK,CAACwF,WAAY;MAC/BC,YAAY,EAAEzF,KAAK,CAACyF,YAAa;MACjCC,WAAW,EAAE1F,KAAK,CAAC0F,WAAY;MAC/BC,oBAAoB,EAAG5G,KAAK,IAAK,IAAI,CAAC6G,iBAAiB,CAAC,SAAS,EAAE7G,KAAK,CAAE;MAC1E8G,oBAAoB,EAAG9G,KAAK,IAAK,IAAI,CAAC6G,iBAAiB,CAAC,SAAS,EAAE7G,KAAK;IAAE,CAC3E,CAAC,eAEF1C,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACjH,iBAAA,CAAAyC,OAAgB;MACfQ,UAAU,EAAED,KAAK,CAACC,UAAW;MAC7B6F,QAAQ,EAAE9F,KAAK,CAAC8F,QAAS;MACzBjE,eAAe,EAAE7B,KAAK,CAAC6B,eAAgB;MACvCkE,SAAS,EAAE,CAAC,CAAC9C,WAAW,IAAI,CAAC,CAACE,eAAgB;MAC9CoC,YAAY,EAAEvF,KAAK,CAACuF,YAAa;MACjCE,YAAY,EAAEzF,KAAK,CAACyF,YAAa;MACjCO,oBAAoB,EAAEhG,KAAK,CAACgG,oBAAqB;MACjDC,iBAAiB,EAAEjG,KAAK,CAACiG,iBAAkB;MAC3C5F,sBAAsB,EAAEA,sBAAuB;MAC/CC,cAAc,EAAEA,cAAe;MAC/Bc,aAAa,EAAEA,aAAc;MAC7BlB,MAAM,EAAEF,KAAK,CAACE,MAAO;MACrBgG,WAAW,EAAElG,KAAK,CAACkG,WAAY;MAC/BC,0BAA0B,EAAE/F,mBAAmB,CAACM,OAAQ;MACxD0F,WAAW,EAAEnF,YAAY,IAAIA,YAAY,CAACoF;IAAI,CAC/C,CAAC,EACDpD,WAAW,iBAAI5G,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACnF,SAAS,QAAEmE,WAAuB,CAAC,EACnDE,eAAe,iBAAI9G,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACnF,SAAS,QAAEqE,eAA2B,CAAC,EAE3DnD,KAAK,CAAC8F,QAAQ,iBACbzJ,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAAC5H,MAAA,CAAAoD,OAAK,CAAC6G,QAAQ,qBACbjK,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACrH,WAAA,CAAA6C,OAAU;MAACuF,OAAO,EAAC;IAAI,GAAC,kBAA4B,CAAC,eAEtD3I,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAAC3G,mBAAmB,qBAClBjB,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACrG,cAAc,qBACbvB,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACzH,SAAA,CAAA+J,eAAe;MACdC,GAAG,EAAC,sBAAsB;MAC1B5C,KAAK,EAAC,OAAO;MACb9D,KAAK,EAAEE,KAAK,CAACC,UAAU,CAACnC,KAAM;MAC9B2I,GAAG,EAAE,CAAE;MACP9B,QAAQ,EAAEA,CAAC+B,CAAC,EAAE5G,KAAK,KAAK,IAAI,CAAC6G,6BAA6B,CAAC7G,KAAK,EAAE,OAAO,CAAE;MAC3E8G,yBAAyB;IAAA,CAC1B,CACa,CAAC,eAEjBvK,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACrG,cAAc,qBACbvB,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACzH,SAAA,CAAA+J,eAAe;MACdC,GAAG,EAAC,uBAAuB;MAC3B5C,KAAK,EAAC,QAAQ;MACd9D,KAAK,EAAEE,KAAK,CAACC,UAAU,CAAC4G,MAAO;MAC/BJ,GAAG,EAAE,CAAE;MACP9B,QAAQ,EAAEA,CAAC+B,CAAC,EAAE5G,KAAK,KAAK,IAAI,CAAC6G,6BAA6B,CAAC7G,KAAK,EAAE,QAAQ,CAAE;MAC5E8G,yBAAyB;IAAA,CAC1B,CACa,CACG,CACP,CACjB,EAEAjE,gBAAgB,iBACftG,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAAClG,eAAe;MAAC6F,KAAK,EAAE5B,SAAS,CAAC4B;IAAM,gBACtCvH,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACvH,mBAAA,CAAA+C,OAAY;MACXiF,MAAM,EAAE1E,KAAK,CAACgC,SAAS,IAAI,EAAG;MAC9B2C,QAAQ,EAAEpD,kBAAmB;MAC7BN,YAAY,EAAEA,YAAa;MAC3BhC,KAAK,EAAE+D,cAAe;MACtBS,WAAW,EAAEA,WAAY;MACzBoB,WAAW,EAAEb,cAAc,CAAChC,SAAS,EAAE8C,kBAAkB,CAAE;MAC3D5C,UAAU,EAAEU,iBAAkB;MAC9BjB,aAAa,EAAGA,aAAa,IAAIA,aAAa,CAACK,SAAS,IAAKuB,oBAAqB;MAClF3B,cAAc,EAAGA,cAAc,IAAIA,cAAc,CAACI,SAAS,IAAKwB,qBAAsB;MACtFtC,kBAAkB,EAAEA,kBAAmB;MACvC6D,uBAAuB,EAAE,CAAC;QAAEzC,QAAQ,EAAE;MAAU,CAAC,EAAE;QAAEA,QAAQ,EAAE;MAAU,CAAC,CAAE;MAC5ED,aAAa,EAAEA;IAAc,CAC9B,CAAC,EACDW,cAAc,iBAAI3G,MAAA,CAAAoD,OAAA,CAAAwE,aAAA,CAACnF,SAAS,QAAEkE,cAA0B,CAC1C,CAEA,CAAC;EAE1B;AACF;AAAC8D,OAAA,CAAA3H,IAAA,GAAAA,IAAA;AAEDA,IAAI,CAAC4H,SAAS,GAAG;EACf5G,aAAa,EAAE6G,kBAAS,CAACC,MAAM;EAC/BjH,KAAK,EAAEgH,kBAAS,CAACC,MAAM,CAACC,UAAU;EAClCjG,YAAY,EAAE+F,kBAAS,CAACG,KAAK,CAAC;IAC5Bd,GAAG,EAAEW,kBAAS,CAACI,IAAI;IACnBC,MAAM,EAAEL,kBAAS,CAACI;EACpB,CAAC,CAAC;EACFlG,kBAAkB,EAAE8F,kBAAS,CAACG,KAAK,CAAC;IAClCd,GAAG,EAAEW,kBAAS,CAACI,IAAI;IACnBC,MAAM,EAAEL,kBAAS,CAACI;EACpB,CAAC,CAAC;EACFhG,aAAa,EAAE4F,kBAAS,CAACI,IAAI,CAACF,UAAU;EACxCvH,cAAc,EAAEqH,kBAAS,CAACI,IAAI,CAACF,UAAU;EACzC5F,eAAe,EAAE0F,kBAAS,CAACI,IAAI,CAACF,UAAU;EAC1C7G,sBAAsB,EAAE2G,kBAAS,CAACI,IAAI,CAACF,UAAU;EACjD5G,cAAc,EAAE0G,kBAAS,CAACI,IAAI,CAACF,UAAU;EACzC7F,sBAAsB,EAAE2F,kBAAS,CAACI,IAAI,CAACF,UAAU;EACjD3F,kBAAkB,EAAEyF,kBAAS,CAACI,IAAI,CAACF,UAAU;EAC7C/F,sBAAsB,EAAE6F,kBAAS,CAACI,IAAI,CAACF,UAAU;EACjD1F,4BAA4B,EAAEwF,kBAAS,CAACI,IAAI,CAACF;AAC/C,CAAC;AAAC,IAAAI,QAAA,GAAAR,OAAA,CAAArH,OAAA,GAEaN,IAAI","ignoreList":[]}

package/configure/lib/utils.js

@@ -1,11 +1,10 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.updateImageDimensions = exports.isPointInsidePolygon = exports.groupShapes = exports.getUpdatedShapes = exports.getUpdatedRectangle = exports.getUpdatedPolygon = exports.getAllShapes = exports.generateValidationMessage = exports.calculate = void 0;
-var _cloneDeep = _interopRequireDefault(require("lodash/cloneDeep"));
+var _lodashEs = require("lodash-es");
 var _shapes = require("./shapes");
 const updateImageDimensions = (initialDim, nextDim, keepAspectRatio, resizeType) => {
   // if we want to keep image aspect ratio
@@ -118,7 +117,7 @@ const groupShapes = shapesArray => {
       return acc;
     }, shapesMap);
   }
-  return (0, _cloneDeep.default)(shapesMap);
+  return (0, _lodashEs.cloneDeep)(shapesMap);
 };
 exports.groupShapes = groupShapes;
 const isPointInsidePolygon = (polygon, x, y) => {

package/configure/lib/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","names":["_cloneDeep","_interopRequireDefault","require","_shapes","updateImageDimensions","initialDim","nextDim","keepAspectRatio","resizeType","imageAspectRatio","width","height","exports","getDelta","referenceInitialValue","referenceNextValue","currentValue","getUpdatedRectangle","shape","x","y","getUpdatedCircles","radius","getUpdatedPolygon","points","map","point","getUpdatedShapes","shapes","group","SHAPE_GROUPS","RECTANGLES","POLYGONS","CIRCLES","getAllShapes","shapesMap","shapesArray","shapesKeys","Object","keys","length","reduce","acc","currentShapeKey","concat","index","groupShapes","rectangles","polygons","circles","shapeProps","cloneDeep","isPointInsidePolygon","polygon","inside","i","j","xi","yi","xj","yj","intersect","calculate","polygonPoints","xPoints","yPoints","minX","Math","min","minY","maxX","max","maxY","textX","textY","generateValidationMessage","config","minShapes","maxShapes","maxSelections","shapesMessage","selectionsMessage","message"],"sources":["../src/utils.js"],"sourcesContent":["import cloneDeep from 'lodash/cloneDeep';\nimport { SHAPE_GROUPS } from './shapes';\n\nconst updateImageDimensions = (initialDim, nextDim, keepAspectRatio, resizeType) => {\n  // if we want to keep image aspect ratio\n  if (keepAspectRatio) {\n    const imageAspectRatio = initialDim.width / initialDim.height;\n\n    if (resizeType === 'height') {\n      // if we want to change image height => we update the width accordingly\n      return {\n        width: nextDim.height * imageAspectRatio,\n        height: nextDim.height,\n      };\n    }\n\n    // if we want to change image width => we update the height accordingly\n    return {\n      width: nextDim.width,\n      height: nextDim.width / imageAspectRatio,\n    };\n  }\n\n  // if we don't want to keep aspect ratio, we just update both values\n  return {\n    width: nextDim.width,\n    height: nextDim.height,\n  };\n};\n\n// referenceInitialValue = the initial value of the Stage\n// referenceNextValue = the next value of the Stage\n// currentValue = the value that has to be re-sized influenced by the changes that were made on the Stage\nconst getDelta = (referenceInitialValue, referenceNextValue, currentValue) =>\n  (referenceNextValue / referenceInitialValue) * currentValue;\n\nconst getUpdatedRectangle = (initialDim, nextDim, shape) => ({\n  ...shape,\n  width: getDelta(initialDim.width, nextDim.width, shape.width),\n  height: getDelta(initialDim.height, nextDim.height, shape.height),\n  x: getDelta(initialDim.width, nextDim.width, shape.x),\n  y: getDelta(initialDim.height, nextDim.height, shape.y),\n});\n\nconst getUpdatedCircles = (initialDim, nextDim, shape) => ({\n  ...shape,\n  radius: getDelta(initialDim.width, nextDim.width, shape.radius),\n  x: getDelta(initialDim.width, nextDim.width, shape.x),\n  y: getDelta(initialDim.height, nextDim.height, shape.y),\n});\n\nconst getUpdatedPolygon = (initialDim, nextDim, shape) => ({\n  ...shape,\n  points: shape.points.map((point) => ({\n    x: getDelta(initialDim.width, nextDim.width, point.x),\n    y: getDelta(initialDim.height, nextDim.height, point.y),\n  })),\n});\n\n// initialDim = the initial dimensions: { width, height } of the Stage\n// nextDim = the next dimensions: { width, height } of the Stage\n// shapes = array of shapes that have to be re-sized and re-positioned\nconst getUpdatedShapes = (initialDim, nextDim, shapes) => {\n  return shapes.map((shape) => {\n    if (shape.group === SHAPE_GROUPS.RECTANGLES) {\n      return getUpdatedRectangle(initialDim, nextDim, shape);\n    }\n\n    if (shape.group === SHAPE_GROUPS.POLYGONS) {\n      return getUpdatedPolygon(initialDim, nextDim, shape);\n    }\n\n    if (shape.group === SHAPE_GROUPS.CIRCLES) {\n      return getUpdatedCircles(initialDim, nextDim, shape);\n    }\n  });\n};\n\n// converts shapes map to shapes array\n// example:\n// from: { rectangles: [r1], polygons: [p1, p2]}\n// to: [{ ...r1, group: 'rectangles' }, { ...p1, group: 'polygons' }, { ...p2, group: 'polygons' }]\n// if a shape has index defined, keep it, otherwise initialize it\n// index is used for the UNDO function\nconst getAllShapes = (shapesMap) => {\n  shapesMap = shapesMap || {};\n  const shapesArray = [];\n  const shapesKeys = Object.keys(shapesMap);\n\n  return shapesKeys.length\n    ? shapesKeys.reduce(\n        (acc, currentShapeKey) =>\n          acc.concat(\n            shapesMap[currentShapeKey]\n              ? shapesMap[currentShapeKey].map((shape, index) => ({\n                  ...shape,\n                  group: currentShapeKey,\n                  index: shape.index || acc.length + index,\n                }))\n              : [],\n          ),\n        shapesArray,\n      )\n    : shapesArray;\n};\n\n// converts shapes array to shapes map\n// is the reverse of getAllShapes function\n// example:\n// from: [{ ...r1, group: 'rectangles' }, { ...p1, group: 'polygons' }, { ...p2, group: 'polygons' }]\n// to: { rectangles: [r1], polygons: [p1, p2]}\nconst groupShapes = (shapesArray) => {\n  shapesArray = shapesArray || [];\n  const shapesMap = {\n    rectangles: [],\n    polygons: [],\n    circles: [],\n  };\n\n  if (shapesArray.length) {\n    return shapesArray.reduce((acc, { group, ...shapeProps }) => {\n      acc[group] = [...(acc[group] || []), shapeProps];\n      return acc;\n    }, shapesMap);\n  }\n\n  return cloneDeep(shapesMap);\n};\n\nconst isPointInsidePolygon = (polygon, x, y) => {\n  let inside = false;\n\n  if (!polygon || polygon.length <= 0) {\n    return inside;\n  }\n\n  for (let i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {\n    const xi = polygon[i].x;\n    const yi = polygon[i].y;\n    const xj = polygon[j].x;\n    const yj = polygon[j].y;\n\n    const intersect = yi > y !== yj > y && x < ((xj - xi) * (y - yi)) / (yj - yi) + xi;\n\n    if (intersect) {\n      inside = !inside;\n    }\n  }\n\n  return inside;\n};\n\nconst calculate = (polygonPoints) => {\n  if (!polygonPoints || polygonPoints.length <= 0) {\n    return { x: 0, y: 0 };\n  }\n\n  const xPoints = polygonPoints.map((point) => point.x);\n  const yPoints = polygonPoints.map((point) => point.y);\n  const minX = Math.min(...xPoints);\n  const minY = Math.min(...yPoints);\n  const maxX = Math.max(...xPoints);\n  const maxY = Math.max(...yPoints);\n\n  // Find a suitable position for the text element within the polygon\n  let textX, textY;\n\n  for (let x = minX; x <= maxX - 20; x++) {\n    for (let y = maxY - 20; y > minY; y--) {\n      // Check if the text element's position (x, y) is within the polygon\n      if (isPointInsidePolygon(polygonPoints, x, y)) {\n        textX = x - 10;\n        textY = y;\n        break;\n      }\n    }\n  }\n\n  return { x: textX, y: textY };\n};\n\nconst generateValidationMessage = (config) => {\n  const { minShapes, maxShapes, maxSelections } = config;\n\n  const shapesMessage =\n    `\\nThere should be at least ${minShapes} ` + (maxShapes ? `and at most ${maxShapes} ` : '') + 'shapes defined.';\n\n  const selectionsMessage =\n    '\\nThere should be at least 1 ' +\n    (maxSelections ? `and at most ${maxSelections} ` : '') +\n    'shape' +\n    (maxSelections ? 's' : '') +\n    ' selected.';\n\n  const message = 'Validation requirements:' + shapesMessage + selectionsMessage;\n\n  return message;\n};\n\nexport {\n  calculate,\n  isPointInsidePolygon,\n  updateImageDimensions,\n  generateValidationMessage,\n  getUpdatedShapes,\n  getAllShapes,\n  groupShapes,\n  getUpdatedRectangle,\n  getUpdatedPolygon,\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"utils.js","names":["_lodashEs","require","_shapes","updateImageDimensions","initialDim","nextDim","keepAspectRatio","resizeType","imageAspectRatio","width","height","exports","getDelta","referenceInitialValue","referenceNextValue","currentValue","getUpdatedRectangle","shape","x","y","getUpdatedCircles","radius","getUpdatedPolygon","points","map","point","getUpdatedShapes","shapes","group","SHAPE_GROUPS","RECTANGLES","POLYGONS","CIRCLES","getAllShapes","shapesMap","shapesArray","shapesKeys","Object","keys","length","reduce","acc","currentShapeKey","concat","index","groupShapes","rectangles","polygons","circles","shapeProps","cloneDeep","isPointInsidePolygon","polygon","inside","i","j","xi","yi","xj","yj","intersect","calculate","polygonPoints","xPoints","yPoints","minX","Math","min","minY","maxX","max","maxY","textX","textY","generateValidationMessage","config","minShapes","maxShapes","maxSelections","shapesMessage","selectionsMessage","message"],"sources":["../src/utils.js"],"sourcesContent":["import { cloneDeep } from 'lodash-es';\nimport { SHAPE_GROUPS } from './shapes';\n\nconst updateImageDimensions = (initialDim, nextDim, keepAspectRatio, resizeType) => {\n  // if we want to keep image aspect ratio\n  if (keepAspectRatio) {\n    const imageAspectRatio = initialDim.width / initialDim.height;\n\n    if (resizeType === 'height') {\n      // if we want to change image height => we update the width accordingly\n      return {\n        width: nextDim.height * imageAspectRatio,\n        height: nextDim.height,\n      };\n    }\n\n    // if we want to change image width => we update the height accordingly\n    return {\n      width: nextDim.width,\n      height: nextDim.width / imageAspectRatio,\n    };\n  }\n\n  // if we don't want to keep aspect ratio, we just update both values\n  return {\n    width: nextDim.width,\n    height: nextDim.height,\n  };\n};\n\n// referenceInitialValue = the initial value of the Stage\n// referenceNextValue = the next value of the Stage\n// currentValue = the value that has to be re-sized influenced by the changes that were made on the Stage\nconst getDelta = (referenceInitialValue, referenceNextValue, currentValue) =>\n  (referenceNextValue / referenceInitialValue) * currentValue;\n\nconst getUpdatedRectangle = (initialDim, nextDim, shape) => ({\n  ...shape,\n  width: getDelta(initialDim.width, nextDim.width, shape.width),\n  height: getDelta(initialDim.height, nextDim.height, shape.height),\n  x: getDelta(initialDim.width, nextDim.width, shape.x),\n  y: getDelta(initialDim.height, nextDim.height, shape.y),\n});\n\nconst getUpdatedCircles = (initialDim, nextDim, shape) => ({\n  ...shape,\n  radius: getDelta(initialDim.width, nextDim.width, shape.radius),\n  x: getDelta(initialDim.width, nextDim.width, shape.x),\n  y: getDelta(initialDim.height, nextDim.height, shape.y),\n});\n\nconst getUpdatedPolygon = (initialDim, nextDim, shape) => ({\n  ...shape,\n  points: shape.points.map((point) => ({\n    x: getDelta(initialDim.width, nextDim.width, point.x),\n    y: getDelta(initialDim.height, nextDim.height, point.y),\n  })),\n});\n\n// initialDim = the initial dimensions: { width, height } of the Stage\n// nextDim = the next dimensions: { width, height } of the Stage\n// shapes = array of shapes that have to be re-sized and re-positioned\nconst getUpdatedShapes = (initialDim, nextDim, shapes) => {\n  return shapes.map((shape) => {\n    if (shape.group === SHAPE_GROUPS.RECTANGLES) {\n      return getUpdatedRectangle(initialDim, nextDim, shape);\n    }\n\n    if (shape.group === SHAPE_GROUPS.POLYGONS) {\n      return getUpdatedPolygon(initialDim, nextDim, shape);\n    }\n\n    if (shape.group === SHAPE_GROUPS.CIRCLES) {\n      return getUpdatedCircles(initialDim, nextDim, shape);\n    }\n  });\n};\n\n// converts shapes map to shapes array\n// example:\n// from: { rectangles: [r1], polygons: [p1, p2]}\n// to: [{ ...r1, group: 'rectangles' }, { ...p1, group: 'polygons' }, { ...p2, group: 'polygons' }]\n// if a shape has index defined, keep it, otherwise initialize it\n// index is used for the UNDO function\nconst getAllShapes = (shapesMap) => {\n  shapesMap = shapesMap || {};\n  const shapesArray = [];\n  const shapesKeys = Object.keys(shapesMap);\n\n  return shapesKeys.length\n    ? shapesKeys.reduce(\n        (acc, currentShapeKey) =>\n          acc.concat(\n            shapesMap[currentShapeKey]\n              ? shapesMap[currentShapeKey].map((shape, index) => ({\n                  ...shape,\n                  group: currentShapeKey,\n                  index: shape.index || acc.length + index,\n                }))\n              : [],\n          ),\n        shapesArray,\n      )\n    : shapesArray;\n};\n\n// converts shapes array to shapes map\n// is the reverse of getAllShapes function\n// example:\n// from: [{ ...r1, group: 'rectangles' }, { ...p1, group: 'polygons' }, { ...p2, group: 'polygons' }]\n// to: { rectangles: [r1], polygons: [p1, p2]}\nconst groupShapes = (shapesArray) => {\n  shapesArray = shapesArray || [];\n  const shapesMap = {\n    rectangles: [],\n    polygons: [],\n    circles: [],\n  };\n\n  if (shapesArray.length) {\n    return shapesArray.reduce((acc, { group, ...shapeProps }) => {\n      acc[group] = [...(acc[group] || []), shapeProps];\n      return acc;\n    }, shapesMap);\n  }\n\n  return cloneDeep(shapesMap);\n};\n\nconst isPointInsidePolygon = (polygon, x, y) => {\n  let inside = false;\n\n  if (!polygon || polygon.length <= 0) {\n    return inside;\n  }\n\n  for (let i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {\n    const xi = polygon[i].x;\n    const yi = polygon[i].y;\n    const xj = polygon[j].x;\n    const yj = polygon[j].y;\n\n    const intersect = yi > y !== yj > y && x < ((xj - xi) * (y - yi)) / (yj - yi) + xi;\n\n    if (intersect) {\n      inside = !inside;\n    }\n  }\n\n  return inside;\n};\n\nconst calculate = (polygonPoints) => {\n  if (!polygonPoints || polygonPoints.length <= 0) {\n    return { x: 0, y: 0 };\n  }\n\n  const xPoints = polygonPoints.map((point) => point.x);\n  const yPoints = polygonPoints.map((point) => point.y);\n  const minX = Math.min(...xPoints);\n  const minY = Math.min(...yPoints);\n  const maxX = Math.max(...xPoints);\n  const maxY = Math.max(...yPoints);\n\n  // Find a suitable position for the text element within the polygon\n  let textX, textY;\n\n  for (let x = minX; x <= maxX - 20; x++) {\n    for (let y = maxY - 20; y > minY; y--) {\n      // Check if the text element's position (x, y) is within the polygon\n      if (isPointInsidePolygon(polygonPoints, x, y)) {\n        textX = x - 10;\n        textY = y;\n        break;\n      }\n    }\n  }\n\n  return { x: textX, y: textY };\n};\n\nconst generateValidationMessage = (config) => {\n  const { minShapes, maxShapes, maxSelections } = config;\n\n  const shapesMessage =\n    `\\nThere should be at least ${minShapes} ` + (maxShapes ? `and at most ${maxShapes} ` : '') + 'shapes defined.';\n\n  const selectionsMessage =\n    '\\nThere should be at least 1 ' +\n    (maxSelections ? `and at most ${maxSelections} ` : '') +\n    'shape' +\n    (maxSelections ? 's' : '') +\n    ' selected.';\n\n  const message = 'Validation requirements:' + shapesMessage + selectionsMessage;\n\n  return message;\n};\n\nexport {\n  calculate,\n  isPointInsidePolygon,\n  updateImageDimensions,\n  generateValidationMessage,\n  getUpdatedShapes,\n  getAllShapes,\n  groupShapes,\n  getUpdatedRectangle,\n  getUpdatedPolygon,\n};\n"],"mappings":"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","ignoreList":[]}

package/configure/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/hotspot-configure",
   "private": true,
-  "version": "9.0.0-beta.0",
+  "version": "9.0.0-beta.1",
   "description": "",
   "main": "lib/index.js",
   "module": "src/index.js",
@@ -12,15 +12,15 @@
     "@mui/icons-material": "^7.3.4",
     "@mui/material": "^7.3.4",
     "@pie-framework/pie-configure-events": "^1.3.0",
-    "@pie-lib/config-ui": "11.30.4-next.0",
-    "@pie-lib/editable-html": "11.21.4-next.0",
-    "debug": "^3.1.0",
+    "@pie-lib/config-ui": "12.1.1-next.3",
+    "@pie-lib/editable-html-tip-tap": "1.1.1-next.3",
+    "debug": "^4.1.1",
     "konva": "8.3.0",
-    "lodash": "^4.17.15",
+    "lodash-es": "^4.17.23",
     "prop-types": "^15.7.2",
-    "react": "18.2.0",
-    "react-dom": "18.2.0",
-    "react-konva": "18.1.0"
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
+    "react-konva": "^18.2.14"
   },
   "license": "ISC"
 }

package/configure/src/__tests__/DeleteWidget.test.jsx

@@ -0,0 +1,366 @@
+import React from 'react';
+import { render, fireEvent } from '@testing-library/react';
+import Konva from 'konva';
+import DeleteWidget from '../DeleteWidget';
+
+Konva.isBrowser = false;
+
+jest.mock('react-konva', () => {
+  const React = require('react');
+  return {
+    Group: ({ children, onClick, ...props }) => {
+      return React.createElement('div', { 'data-testid': 'group', onClick, ...props }, children);
+    },
+  };
+});
+
+jest.mock('../image-konva', () => {
+  return function ImageComponent({ src, x, y }) {
+    return <div data-testid="delete-icon" data-src={src} data-x={x} data-y={y} />;
+  };
+});
+
+jest.mock('../utils', () => ({
+  calculate: jest.fn((points) => {
+    const xValues = points.map(p => p.x);
+    const yValues = points.map(p => p.y);
+    return {
+      x: Math.max(...xValues),
+      y: Math.max(...yValues),
+    };
+  }),
+}));
+
+describe('DeleteWidget', () => {
+  let defaultProps;
+
+  beforeEach(() => {
+    defaultProps = {
+      id: 'shape1',
+      x: 100,
+      y: 150,
+      handleWidgetClick: jest.fn(),
+    };
+  });
+
+  describe('rendering', () => {
+    it('should render without crashing', () => {
+      const { container } = render(<DeleteWidget {...defaultProps} width={200} height={150} />);
+      expect(container).toBeTruthy();
+    });
+
+    it('should render Group component', () => {
+      const { getByTestId } = render(<DeleteWidget {...defaultProps} width={200} height={150} />);
+      expect(getByTestId('group')).toBeInTheDocument();
+    });
+
+    it('should render delete icon', () => {
+      const { getByTestId } = render(<DeleteWidget {...defaultProps} width={200} height={150} />);
+      expect(getByTestId('delete-icon')).toBeInTheDocument();
+    });
+  });
+
+  describe('rectangle positioning', () => {
+    it('should position delete icon at bottom-right for rectangles', () => {
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          x={100}
+          y={150}
+          width={200}
+          height={150}
+        />
+      );
+      
+      const icon = getByTestId('delete-icon');
+      // positionX = x + width - offset = 100 + 200 - 20 = 280
+      // positionY = y + height - offset = 150 + 150 - 20 = 280
+      expect(icon).toHaveAttribute('data-x', '280');
+      expect(icon).toHaveAttribute('data-y', '280');
+    });
+
+    it('should handle different rectangle dimensions', () => {
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          x={50}
+          y={75}
+          width={300}
+          height={200}
+        />
+      );
+      
+      const icon = getByTestId('delete-icon');
+      // positionX = 50 + 300 - 20 = 330
+      // positionY = 75 + 200 - 20 = 255
+      expect(icon).toHaveAttribute('data-x', '330');
+      expect(icon).toHaveAttribute('data-y', '255');
+    });
+  });
+
+  describe('circle positioning', () => {
+    it('should position delete icon above circle', () => {
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          x={200}
+          y={200}
+          isCircle={true}
+          radius={50}
+        />
+      );
+      
+      const icon = getByTestId('delete-icon');
+      // positionX = x + radius - offset = 200 + 50 - 20 = 230
+      // positionY = y = 200
+      expect(icon).toHaveAttribute('data-x', '230');
+      expect(icon).toHaveAttribute('data-y', '200');
+    });
+
+    it('should handle different circle sizes', () => {
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          x={100}
+          y={100}
+          isCircle={true}
+          radius={75}
+        />
+      );
+      
+      const icon = getByTestId('delete-icon');
+      // positionX = 100 + 75 - 20 = 155
+      // positionY = 100
+      expect(icon).toHaveAttribute('data-x', '155');
+      expect(icon).toHaveAttribute('data-y', '100');
+    });
+
+    it('should handle small circles', () => {
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          x={150}
+          y={150}
+          isCircle={true}
+          radius={20}
+        />
+      );
+      
+      const icon = getByTestId('delete-icon');
+      // positionX = 150 + 20 - 20 = 150
+      // positionY = 150
+      expect(icon).toHaveAttribute('data-x', '150');
+      expect(icon).toHaveAttribute('data-y', '150');
+    });
+  });
+
+  describe('polygon positioning', () => {
+    it('should position delete icon using calculate function for polygons', () => {
+      const { calculate } = require('../utils');
+      const points = [
+        { x: 10, y: 10 },
+        { x: 100, y: 20 },
+        { x: 90, y: 90 },
+        { x: 20, y: 80 },
+      ];
+      
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          points={points}
+        />
+      );
+      
+      expect(calculate).toHaveBeenCalledWith(points);
+      
+      const icon = getByTestId('delete-icon');
+      // Based on mocked calculate function: max x = 100, max y = 90
+      expect(icon).toHaveAttribute('data-x', '100');
+      expect(icon).toHaveAttribute('data-y', '90');
+    });
+
+    it('should handle triangular polygons', () => {
+      const { calculate } = require('../utils');
+      const points = [
+        { x: 50, y: 0 },
+        { x: 100, y: 100 },
+        { x: 0, y: 100 },
+      ];
+      
+      render(
+        <DeleteWidget
+          {...defaultProps}
+          points={points}
+        />
+      );
+      
+      expect(calculate).toHaveBeenCalledWith(points);
+    });
+
+    it('should handle complex polygons', () => {
+      const { calculate } = require('../utils');
+      const points = [
+        { x: 10, y: 10 },
+        { x: 50, y: 5 },
+        { x: 90, y: 10 },
+        { x: 100, y: 50 },
+        { x: 90, y: 90 },
+        { x: 50, y: 100 },
+        { x: 10, y: 90 },
+        { x: 0, y: 50 },
+      ];
+      
+      render(
+        <DeleteWidget
+          {...defaultProps}
+          points={points}
+        />
+      );
+      
+      expect(calculate).toHaveBeenCalledWith(points);
+    });
+  });
+
+  describe('interactions', () => {
+    it('should call handleWidgetClick when clicked', () => {
+      const handleWidgetClick = jest.fn();
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          handleWidgetClick={handleWidgetClick}
+          width={200}
+          height={150}
+        />
+      );
+      
+      const group = getByTestId('group');
+      fireEvent.click(group);
+      
+      expect(handleWidgetClick).toHaveBeenCalledWith('shape1');
+    });
+
+    it('should call handleWidgetClick with correct id for circles', () => {
+      const handleWidgetClick = jest.fn();
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          id="circle1"
+          handleWidgetClick={handleWidgetClick}
+          isCircle={true}
+          radius={50}
+        />
+      );
+      
+      const group = getByTestId('group');
+      fireEvent.click(group);
+      
+      expect(handleWidgetClick).toHaveBeenCalledWith('circle1');
+    });
+
+    it('should call handleWidgetClick with correct id for polygons', () => {
+      const handleWidgetClick = jest.fn();
+      const points = [
+        { x: 10, y: 10 },
+        { x: 100, y: 20 },
+        { x: 50, y: 100 },
+      ];
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          id="polygon1"
+          handleWidgetClick={handleWidgetClick}
+          points={points}
+        />
+      );
+      
+      const group = getByTestId('group');
+      fireEvent.click(group);
+      
+      expect(handleWidgetClick).toHaveBeenCalledWith('polygon1');
+    });
+  });
+
+  describe('edge cases', () => {
+    it('should handle zero dimensions for rectangles', () => {
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          x={0}
+          y={0}
+          width={0}
+          height={0}
+        />
+      );
+      
+      const icon = getByTestId('delete-icon');
+      // positionX = 0 + 0 - 20 = -20
+      // positionY = 0 + 0 - 20 = -20
+      expect(icon).toHaveAttribute('data-x', '-20');
+      expect(icon).toHaveAttribute('data-y', '-20');
+    });
+
+    it('should handle zero radius for circles', () => {
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          x={100}
+          y={100}
+          isCircle={true}
+          radius={0}
+        />
+      );
+      
+      const icon = getByTestId('delete-icon');
+      // positionX = 100 + 0 - 20 = 80
+      // positionY = 100
+      expect(icon).toHaveAttribute('data-x', '80');
+      expect(icon).toHaveAttribute('data-y', '100');
+    });
+
+    it('should handle negative coordinates', () => {
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          x={-50}
+          y={-75}
+          width={100}
+          height={100}
+        />
+      );
+      
+      const icon = getByTestId('delete-icon');
+      // positionX = -50 + 100 - 20 = 30
+      // positionY = -75 + 100 - 20 = 5
+      expect(icon).toHaveAttribute('data-x', '30');
+      expect(icon).toHaveAttribute('data-y', '5');
+    });
+
+    it('should handle single point polygon', () => {
+      const points = [{ x: 50, y: 50 }];
+      
+      const { container } = render(
+        <DeleteWidget
+          {...defaultProps}
+          points={points}
+        />
+      );
+      
+      expect(container).toBeTruthy();
+    });
+  });
+
+  describe('icon rendering', () => {
+    it('should pass correct src to ImageComponent', () => {
+      const { getByTestId } = render(
+        <DeleteWidget
+          {...defaultProps}
+          width={200}
+          height={150}
+        />
+      );
+      
+      const icon = getByTestId('delete-icon');
+      expect(icon).toHaveAttribute('data-src');
+    });
+  });
+});