@pie-element/drawing-response 3.6.0 → 3.6.1-beta.587

package/configure/src/__tests__/__snapshots__/root.test.jsx.snap

@@ -3,37 +3,52 @@
 exports[`Root snapshot renders 1`] = `
 <div>
   <ConfigLayout
+    hideSettings={false}
     settings={
       <Panel
         configuration={
           Object {
             "backgroundImage": Object {
-              "enabled": true,
               "label": "Background Image",
               "settings": true,
             },
+            "maxImageHeight": Object {
+              "prompt": 300,
+              "teacherInstructions": 300,
+            },
+            "maxImageWidth": Object {
+              "prompt": 300,
+              "teacherInstructions": 300,
+            },
             "prompt": Object {
               "label": "Prompt",
               "settings": true,
             },
-            "rationale": Object {
-              "label": "Rationale",
-              "settings": true,
+            "settingsPanelDisabled": false,
+            "spellCheck": Object {
+              "enabled": true,
+              "label": "Spellcheck",
+              "settings": false,
             },
             "teacherInstructions": Object {
               "label": "Teacher Instructions",
               "settings": true,
             },
+            "withRubric": Object {
+              "label": "Add Rubric",
+              "settings": false,
+            },
           }
         }
         groups={
           Object {
             "Properties": Object {
-              "rationaleEnabled": undefined,
+              "rubricEnabled": false,
+              "spellCheckEnabled": false,
               "teacherInstructionsEnabled": undefined,
             },
             "Settings": Object {
-              "backgroundImage.enabled": undefined,
+              "backgroundImageEnabled": undefined,
               "promptEnabled": undefined,
             },
           }
@@ -59,22 +74,27 @@ exports[`Root snapshot renders 1`] = `
         label="Item Stem"
       >
         <EditableHtml
+          languageCharactersProps={
+            Array [
+              Object {
+                "language": "spanish",
+              },
+              Object {
+                "language": "special",
+              },
+            ]
+          }
           markup="Test Prompt"
+          maxImageHeight={300}
+          maxImageWidth={300}
           onChange={[Function]}
+          toolbarOpts={
+            Object {
+              "position": "bottom",
+            }
+          }
         />
       </Component>
-      <div>
-        <WithStyles(Typography)
-          variant="subheading"
-        >
-          Define Background Image
-        </WithStyles(Typography)>
-        <WithStyles(ImageContainer)
-          imageUrl=""
-          onImageUpload={[Function]}
-          onUpdateImageDimension={[Function]}
-        />
-      </div>
     </div>
   </ConfigLayout>
 </div>

package/configure/src/__tests__/image-container.test.jsx

@@ -5,14 +5,14 @@ import { ImageContainer } from '../image-container';
 
 jest.mock('@pie-lib/config-ui', () => ({
   settings: {
-    Panel: props => <div {...props} />,
+    Panel: (props) => <div {...props} />,
     toggle: jest.fn(),
     radio: jest.fn(),
-    dropdown: jest.fn()
+    dropdown: jest.fn(),
   },
   layout: {
-    ConfigLayout: props => <div>{props.children}</div>
-  }
+    ConfigLayout: (props) => <div>{props.children}</div>,
+  },
 }));
 
 describe('ImageContainer', () => {
@@ -25,7 +25,7 @@ describe('ImageContainer', () => {
       classes: {},
       imageUrl: 'url',
       onUpdateImageDimension,
-      onImageUpload
+      onImageUpload,
     };
     wrapper = () => shallow(<ImageContainer {...props} />);
   });
@@ -73,30 +73,32 @@ describe('ImageContainer', () => {
       w.instance().handleOnDrop({
         preventDefault: jest.fn(),
         dataTransfer: {
-          items: [{
-            kind: 'file',
-            getAsFile: jest.fn().mockReturnValue({ type: 'image', key: 'item' })
-          }
+          items: [
+            {
+              kind: 'file',
+              getAsFile: jest.fn().mockReturnValue({ type: 'image', key: 'item' }),
+            },
           ],
-          files: []
-        }
+          files: [],
+        },
       });
 
       expect(onImageUpload).toBeCalledWith({ type: 'image', key: 'item' });
       expect(onImageUpload).toHaveBeenCalledTimes(3);
     });
 
-    it('handleOnDrop calls handleFileRead which doesn\'t call onImageUpload if item is file but not image', () => {
+    it("handleOnDrop calls handleFileRead which doesn't call onImageUpload if item is file but not image", () => {
       w.instance().handleOnDrop({
         preventDefault: jest.fn(),
         dataTransfer: {
-          items: [{
-            kind: 'file',
-            getAsFile: jest.fn().mockReturnValue({ type: 'jpg' })
-          }
+          items: [
+            {
+              kind: 'file',
+              getAsFile: jest.fn().mockReturnValue({ type: 'jpg' }),
+            },
           ],
-          files: []
-        }
+          files: [],
+        },
       });
 
       // same times number as in previous test, meaning that is was not called again
@@ -107,30 +109,32 @@ describe('ImageContainer', () => {
       w.instance().handleOnDrop({
         preventDefault: jest.fn(),
         dataTransfer: {
-          items: [{
-            kind: 'something else',
-            getAsFile: jest.fn().mockReturnValue({ type: 'image' })
-          }
+          items: [
+            {
+              kind: 'something else',
+              getAsFile: jest.fn().mockReturnValue({ type: 'image' }),
+            },
           ],
-          files: [{ type: 'image', key: 'file' }]
-        }
+          files: [{ type: 'image', key: 'file' }],
+        },
       });
 
       expect(onImageUpload).toBeCalledWith({ type: 'image', key: 'file' });
       expect(onImageUpload).toHaveBeenCalledTimes(4);
     });
 
-    it('handleOnDrop calls handleFileRead which doesn\'t call onImageUpload if item is not file and file is not image', () => {
+    it("handleOnDrop calls handleFileRead which doesn't call onImageUpload if item is not file and file is not image", () => {
       w.instance().handleOnDrop({
         preventDefault: jest.fn(),
         dataTransfer: {
-          items: [{
-            kind: 'something else',
-            getAsFile: jest.fn().mockReturnValue({ type: 'image' })
-          }
+          items: [
+            {
+              kind: 'something else',
+              getAsFile: jest.fn().mockReturnValue({ type: 'image' }),
+            },
           ],
-          files: [{ type: 'something else', key: 'file' }]
-        }
+          files: [{ type: 'something else', key: 'file' }],
+        },
       });
 
       // same times number as in previous test, meaning that is was not called again
@@ -138,16 +142,20 @@ describe('ImageContainer', () => {
     });
 
     it('handleOnImageLoad calls onUpdateImageDimension', () => {
-      w.instance().handleOnImageLoad({ target: { offsetHeight: 50, offsetWidth: 50 }});
+      w.instance().handleOnImageLoad({
+        target: { offsetHeight: 50, offsetWidth: 50, naturalWidth: 50, naturalHeight: 50 },
+      });
 
       expect(onUpdateImageDimension).toHaveBeenCalledWith({
         height: 50,
-        width: 50
+        width: 50,
       });
     });
 
     it('stopResizing calls onUpdateImageDimension', () => {
-      w.instance().handleOnImageLoad({ target: { offsetHeight: 50, offsetWidth: 50 }});
+      w.instance().handleOnImageLoad({
+        target: { offsetHeight: 50, offsetWidth: 50, naturalWidth: 50, naturalHeight: 50 },
+      });
 
       expect(onUpdateImageDimension).toHaveBeenCalledWith(w.instance().state.dimensions);
     });
@@ -157,4 +165,3 @@ describe('ImageContainer', () => {
     });
   });
 });
-

package/configure/src/__tests__/index.test.js

@@ -4,13 +4,13 @@ import { shallow } from 'enzyme';
 
 jest.mock('@pie-lib/config-ui', () => ({
   choiceUtils: {
-    firstAvailableIndex: jest.fn()
+    firstAvailableIndex: jest.fn(),
   },
   settings: {
-    Panel: props => <div {...props} />,
+    Panel: (props) => <div {...props} />,
     toggle: jest.fn(),
-    radio: jest.fn()
-  }
+    radio: jest.fn(),
+  },
 }));
 
 const model = () => ({
@@ -19,12 +19,12 @@ const model = () => ({
   imageUrl: '',
   imageDimensions: {
     height: 0,
-    width: 0
-  }
+    width: 0,
+  },
 });
 
 jest.mock('react-dom', () => ({
-  render: jest.fn()
+  render: jest.fn(),
 }));
 
 describe('index', () => {

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

@@ -6,14 +6,14 @@ import defaults from '../defaults';
 
 jest.mock('@pie-lib/config-ui', () => ({
   settings: {
-    Panel: props => <div {...props} />,
+    Panel: (props) => <div {...props} />,
     toggle: jest.fn(),
     radio: jest.fn(),
-    dropdown: jest.fn()
+    dropdown: jest.fn(),
   },
   layout: {
-    ConfigLayout: props => <div>{props.children}</div>
-  }
+    ConfigLayout: (props) => <div>{props.children}</div>,
+  },
 }));
 
 const model = {
@@ -22,8 +22,8 @@ const model = {
   imageUrl: '',
   imageDimensions: {
     height: 100,
-    width: 100
-  }
+    width: 100,
+  },
 };
 
 describe('Root', () => {
@@ -58,44 +58,37 @@ describe('Root', () => {
     it('onPromptChanged calls onModelChanged', () => {
       w.instance().onPromptChanged('New Prompt');
 
-      expect(onModelChanged).toHaveBeenCalledWith(
-          expect.objectContaining({ prompt: 'New Prompt' }))
-    });
-
-    it('onRationaleChanged calls onModelChanged', () => {
-      w.instance().onRationaleChanged('New Rationale');
-
-      expect(onModelChanged).toHaveBeenCalledWith(
-          expect.objectContaining({ rationale: 'New Rationale' }))
+      expect(onModelChanged).toHaveBeenCalledWith(expect.objectContaining({ prompt: 'New Prompt' }));
     });
 
     it('onTeacherInstructionsChanged calls onModelChanged', () => {
       w.instance().onTeacherInstructionsChanged('New Teacher Instructions');
 
       expect(onModelChanged).toHaveBeenCalledWith(
-          expect.objectContaining({ teacherInstructions: 'New Teacher Instructions' }))
+        expect.objectContaining({ teacherInstructions: 'New Teacher Instructions' }),
+      );
     });
 
     it('onUpdateImageDimension calls onModelChanged', () => {
       w.instance().onUpdateImageDimension({
         height: 200,
-        width: 200
+        width: 200,
       });
 
       expect(onModelChanged).toHaveBeenCalledWith(
-          expect.objectContaining({ imageDimensions: {
-              height: 200,
-              width: 200
-            }
-          }))
+        expect.objectContaining({
+          imageDimensions: {
+            height: 200,
+            width: 200,
+          },
+        }),
+      );
     });
 
     it('onImageUpload calls onModelChanged', () => {
       w.instance().onImageUpload('url');
 
-      expect(onModelChanged).toHaveBeenCalledWith(
-          expect.objectContaining({ imageUrl: 'url' }))
+      expect(onModelChanged).toHaveBeenCalledWith(expect.objectContaining({ imageUrl: 'url' }));
     });
   });
 });
-

package/configure/src/button.jsx

@@ -22,20 +22,20 @@ RawButton.propTypes = {
   className: PropTypes.string,
   disabled: PropTypes.bool,
   label: PropTypes.string,
-  onClick: PropTypes.func
+  onClick: PropTypes.func,
 };
 
 RawButton.defaultProps = {
   className: '',
   disabled: false,
   label: 'Add',
-  onClick: () => {}
+  onClick: () => {},
 };
 
 const styles = () => ({
   addButton: {
-    marginLeft: 8
-  }
+    marginLeft: 8,
+  },
 });
 
 const ButtonStyled = withStyles(styles)(RawButton);

package/configure/src/defaults.js

@@ -4,30 +4,45 @@ export default {
     imageUrl: '',
     imageDimensions: {
       height: 0,
-      width: 0
+      width: 0,
     },
-    rationaleEnabled: true,
     promptEnabled: true,
     teacherInstructionsEnabled: true,
     studentInstructionsEnabled: true,
+    backgroundImageEnabled: true,
+    spellCheckEnabled: true,
+    toolbarEditorPosition: 'bottom',
   },
   configuration: {
+    spellCheck: {
+      label: 'Spellcheck',
+      settings: false,
+      enabled: true,
+    },
     backgroundImage: {
       settings: true,
       label: 'Background Image',
-      enabled: true
-    },
-    rationale: {
-      settings: true,
-      label: 'Rationale'
     },
     prompt: {
       settings: true,
-      label: 'Prompt'
+      label: 'Prompt',
     },
+    settingsPanelDisabled: false,
     teacherInstructions: {
       settings: true,
       label: 'Teacher Instructions',
-    }
-  }
+    },
+    maxImageWidth: {
+      teacherInstructions: 300,
+      prompt: 300,
+    },
+    maxImageHeight: {
+      teacherInstructions: 300,
+      prompt: 300,
+    },
+    withRubric: {
+      settings: false,
+      label: 'Add Rubric',
+    },
+  },
 };