@gemsorg/modules - npm Package Compare versions

Comparing version 0.1.4 to 0.1.5

flow-typed/types.js

@@ -21,4 +21,21 @@ // @flow
 
+type FormBuilderFactory = {
+  type: string,
+  [prop: string]: string | bool | Array<string>
+}
+
+type ModuleEditorMeta = {
+  propreties?: {
+    [key: string]: FormBuilderFactory
+  },
+  defaults?: {
+    [key: string]: any
+  }
+}
+
 declare type ModuleControlMeta = {
   type: string,
+  title?: string,
+  description?: string,
+  previewUrl?: string,
   report?: Array<string>,
@@ -28,7 +45,3 @@ validation?:  {
   },
-  editor?: {
-    defaults?: {
-      [key: string]: any
-    }
-  },
+  editor?: ModuleEditorMeta,
   verificationScore?: verificationScoreFn
@@ -35,0 +48,0 @@ }

index.js

@@ -20,4 +20,4 @@ // @flow
   FormContext,
+  FormData,
   FormDataProvider,
-  FormData,
   moduleControls,
@@ -28,2 +28,3 @@ getModuleControlsMap,
   getVariablesMap,
+  PropControlType,
 } from './src/form/Form';
@@ -88,2 +89,3 @@
   getModuleControlsMap,
+  PropControlType,
   Image,
@@ -90,0 +92,0 @@ ImageTiles,

package.json

 {
   "name": "@gemsorg/modules",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "description": "gems modules",
@@ -29,3 +29,3 @@ "main": "index.js",
   },
-  "gitHead": "4526b988c34e1863ddeced6b112553194c99f9ba"
+  "gitHead": "0c38fae2425e2d038ba678d6bdd0a291d5be6e3e"
 }

src/form/Form/index.js

@@ -11,5 +11,8 @@ // @flow
 import moduleControls, { getModuleControlsMap } from './moduleControls';
+
 import applyVariables from './variables/applyVariables';
 import getVariablesMap from './variables/getVariablesMap';
 
+import PropControlTypes from './PropControlTypes';
+
 export {
@@ -27,2 +30,3 @@ Form,
   getVariablesMap,
+  PropControlTypes,
 };

src/form/stories/index.stories.js

@@ -5,3 +5,3 @@ import React from 'react';
 
-import { Panel, Markdown } from '@gemsorg/uikit/stories/kit';
+import { Panel, Markdown, Kind } from '@gemsorg/uikit/stories/kit';
 
@@ -8,0 +8,0 @@ import Playground from './Playground/Playground';

src/modules/Agreement/Agreement.js

@@ -11,2 +11,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 export default class Agreement extends Component {
@@ -30,2 +32,3 @@ static propTypes = {
     type: 'agreement',
+    name: 'License Agreement',
     validation: {
@@ -35,2 +38,20 @@ isTrue: rules.isTrue,
     editor: {
+      properties: {
+        button: {
+          type: PropControlTypes.string,
+          placeholder: 'button caption',
+        },
+        label: {
+          type: PropControlTypes.string,
+          placeholder: 'Checkbox label',
+          required: true,
+        },
+        headline: {
+          type: PropControlTypes.string,
+          placeholder: 'Modal headline',
+        },
+        modules: {
+          type: PropControlTypes.modules,
+        },
+      },
       defaults: {
@@ -37,0 +58,0 @@ button: 'Rules',

src/modules/Article/Article.js

@@ -10,2 +10,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './Article.module.styl';
@@ -30,3 +32,18 @@
     type: 'article',
+    name: 'Article',
     editor: {
+      properties: {
+        title: {
+          type: PropControlTypes.string,
+          placeholder: 'Article title',
+        },
+        content: {
+          type: PropControlTypes.richText,
+          placeholder: 'Article content',
+        },
+        image: {
+          type: PropControlTypes.string,
+          placeholder: 'Image Url',
+        },
+      },
       defaults: {
@@ -33,0 +50,0 @@ title: 'article title',

src/modules/Checkbox/Checkbox.js

@@ -7,2 +7,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './Checkbox.module.styl';
@@ -25,2 +27,3 @@
     type: 'checkbox',
+    name: 'Checkbox',
     validation: {
@@ -31,2 +34,8 @@ isTrue: rules.isTrue,
     editor: {
+      properties: {
+        label: {
+          type: PropControlTypes.string,
+          placeholder: 'Checkbox label',
+        },
+      },
       defaults: {
@@ -33,0 +42,0 @@ label: 'Checkbox label',

src/modules/ClipboardText/ClipboardText.js

@@ -8,2 +8,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './ClipboardText.module.styl';
@@ -24,3 +26,10 @@
     type: 'clipboardText',
+    name: 'Copy to clipboard',
     editor: {
+      properties: {
+        text: {
+          type: PropControlTypes.string,
+          placeholder: 'Text',
+        },
+      },
       defaults: {
@@ -27,0 +36,0 @@ text: 'Click to copy text',

src/modules/Collapsable/Collapsable.js

@@ -8,2 +8,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './Collapsable.module.styl';
@@ -25,2 +27,16 @@
     editor: {
+      properties: {
+        header: {
+          type: PropControlTypes.string,
+          placeholder: 'Title text',
+          required: true,
+        },
+        expanded: {
+          type: PropControlTypes.boolean,
+          label: 'Expanded by default',
+        },
+        modules: {
+          type: PropControlTypes.modules,
+        },
+      },
       defaults: {
@@ -27,0 +43,0 @@ header: 'Click to Expand/Collapse',

src/modules/Description/Description.js

@@ -7,2 +7,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './Description.module.styl';
@@ -25,3 +27,17 @@
     type: 'description',
+    name: 'Description',
     editor: {
+      properties: {
+        content: {
+          type: PropControlTypes.richText,
+          placeholder: 'Article content',
+          required: true,
+        },
+        fontSize: {
+          type: PropControlTypes.enum,
+          label: 'Font size',
+          options: ['small', 'medium', 'large'],
+          default: 'medium',
+        },
+      },
       defaults: {
@@ -28,0 +44,0 @@ content: `Write a trivia question with three multiple-choice answers. One answer

src/modules/Dropdown/Dropdown.js

@@ -35,2 +35,3 @@ import React, { Component } from 'react';
     type: 'dropdown',
+    name: 'Dropdown',
     validation: {
@@ -37,0 +38,0 @@ isRequired: rules.isRequired,

src/modules/Image/Image.js

@@ -5,2 +5,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './Image.module.styl';
@@ -20,4 +22,12 @@
     type: 'image',
+    name: 'Image',
     report: ['Image is not loading'],
     editor: {
+      properties: {
+        src: {
+          type: PropControlTypes.string,
+          placeholder: 'Image Url',
+          required: true,
+        },
+      },
       defaults: {
@@ -24,0 +34,0 @@ src: 'https://portal.gems.org/images/complete-tasks.png',

src/modules/ImageTiles/ImageTiles.js

@@ -8,2 +8,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './ImageTiles.module.styl';
@@ -29,2 +31,3 @@
     type: 'imageTiles',
+    name: 'Image Tiles',
     validation: {
@@ -35,2 +38,19 @@ isRequired: rules.isRequiredArray,
     editor: {
+      properties: {
+        image: {
+          type: PropControlTypes.string,
+          placeholder: 'Image Url',
+          required: true,
+        },
+        columns: {
+          columns: PropControlTypes.number,
+          placeholder: 'Number of columns',
+          default: 4,
+        },
+        rows: {
+          columns: PropControlTypes.number,
+          placeholder: 'Number of rows',
+          default: 4,
+        },
+      },
       defaults: {
@@ -37,0 +57,0 @@ image: 'https://portal.gems.org/images/complete-tasks.png',

src/modules/Input/Input.js

@@ -10,2 +10,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './Input.module.styl';
@@ -31,2 +33,3 @@
     type: ['text', 'number', 'email', 'password'],
+    name: 'Input',
     report: ['Unable to fill field'],
@@ -47,2 +50,12 @@ validation: {
     editor: {
+      propreties: {
+        placeholder: {
+          type: PropControlTypes.string,
+          placeholder: 'Placeholder',
+        },
+        label: {
+          type: PropControlTypes.string,
+          placeholder: 'Label',
+        },
+      },
       defaults: {
@@ -49,0 +62,0 @@ placeholder: 'some text...',

src/modules/Instructions/Instructions.js

@@ -10,2 +10,3 @@ import React, { Component } from 'react';
     type: 'instructions',
+    name: 'Instructions',
     editor: {
@@ -12,0 +13,0 @@ defaults: {

src/modules/Paragraph/Paragraph.js

@@ -5,2 +5,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './Paragraph.module.styl';
@@ -25,3 +27,21 @@
     type: 'paragraph',
+    name: 'Text paragraph',
     editor: {
+      properties: {
+        content: {
+          type: PropControlTypes.richText,
+          placeholder: 'Article content',
+          required: true,
+        },
+        fontSize: {
+          type: PropControlTypes.enum,
+          label: 'Font size',
+          options: ['small', 'medium'],
+          default: 'small',
+        },
+        centered: {
+          type: PropControlTypes.boolean,
+          label: 'Text align center',
+        },
+      },
       defaults: {
@@ -28,0 +48,0 @@ content:

src/modules/Progress/Progress.js

@@ -16,2 +16,3 @@ import React, { Component } from 'react';
     type: 'progress',
+    name: 'QA Progress',
     editor: {
@@ -18,0 +19,0 @@ defaults: {

src/modules/Question/Question.js

@@ -6,2 +6,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './Question.module.styl';
@@ -24,3 +26,20 @@
     type: 'question',
+    name: 'Question',
     editor: {
+      properties: {
+        title: {
+          type: PropControlTypes.string,
+          placeholder: 'Title',
+        },
+        content: {
+          type: PropControlTypes.richText,
+          placeholder: 'Article content',
+        },
+        padding: {
+          type: PropControlTypes.enum,
+          label: 'Padding',
+          options: ['small', 'medium', 'none'],
+          default: 'medium',
+        },
+      },
       defaults: {
@@ -27,0 +46,0 @@ title: 'question title',

src/modules/RegionSelect/RegionMultiselect.js

@@ -9,2 +9,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './styles.module.styl';
@@ -51,2 +53,3 @@
     type: 'regionMultiselect',
+    name: 'Image Region Multiselect',
     report: ['Image is not loading'],
@@ -58,2 +61,13 @@ validation: {
     editor: {
+      properties: {
+        image: {
+          type: PropControlTypes.string,
+          placeholder: 'Image Url',
+          required: true,
+        },
+        readOnly: {
+          type: PropControlTypes.boolean,
+          placeholder: 'Read only',
+        },
+      },
       defaults: {
@@ -60,0 +74,0 @@ image: 'https://portal.gems.org/images/complete-tasks.png',

src/modules/RegionSelect/RegionSelect.js

@@ -9,2 +9,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './styles.module.styl';
@@ -40,2 +42,3 @@
     type: 'regionSelect',
+    name: 'Image Region Select',
     validation: {
@@ -47,2 +50,13 @@ isRequired: rules.isRequired,
     editor: {
+      properties: {
+        image: {
+          type: PropControlTypes.string,
+          placeholder: 'Image Url',
+          required: true,
+        },
+        readOnly: {
+          type: PropControlTypes.boolean,
+          placeholder: 'Read only',
+        },
+      },
       defaults: {
@@ -49,0 +63,0 @@ image: 'https://portal.gems.org/images/complete-tasks.png',

src/modules/Select/MultiSelectModule.js

@@ -11,2 +11,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 export default class MultiSelectModule extends Component {
@@ -43,2 +45,13 @@ static propTypes = {
     editor: {
+      properties: {
+        columns: {
+          type: PropControlTypes.enum,
+          options: [2, 3],
+          default: 2,
+        },
+        readOnly: {
+          type: PropControlTypes.boolean,
+          placeholder: 'Read only',
+        },
+      },
       defaults: {
@@ -45,0 +58,0 @@ options: [

src/modules/Select/SelectModule.js

@@ -11,2 +11,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 export default class SelectModule extends Component {
@@ -34,2 +36,3 @@ static propTypes = {
     type: 'select',
+    name: 'Select',
     validation: {
@@ -47,2 +50,18 @@ isRequired: rules.isRequired,
     editor: {
+      properties: {
+        columns: {
+          type: PropControlTypes.enum,
+          label: 'Columns number',
+          options: [2, 3],
+          default: 2,
+        },
+        answer: {
+          type: PropControlTypes.string,
+          placeholder: 'Answer',
+        },
+        readOnly: {
+          type: PropControlTypes.boolean,
+          placeholder: 'Read only',
+        },
+      },
       defaults: {
@@ -49,0 +68,0 @@ options: [

src/modules/Submit/Submit.js

@@ -8,2 +8,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './Submit.module.styl';
@@ -25,3 +27,17 @@
     type: 'submit',
+    name: 'Submit buttom',
     editor: {
+      properties: {
+        caption: {
+          type: PropControlTypes.string,
+          placeholder: 'Button caption',
+          required: true,
+        },
+        justify: {
+          type: PropControlTypes.enum,
+          label: 'justify button',
+          options: ['left', 'right', 'center'],
+          default: 'left',
+        },
+      },
       defaults: {
@@ -28,0 +44,0 @@ caption: 'Submit',

src/modules/TagVideo/MultipleTagVideo.js

@@ -8,2 +8,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 export default class MultipleTagVideo extends Component {
@@ -33,2 +35,3 @@ static propTypes = {
     type: 'multipleTagVideo',
+    name: 'Video Tagging (multiple)',
     validation: {
@@ -40,2 +43,13 @@ isRequired: rules.isRequiredArray,
     editor: {
+      properties: {
+        src: {
+          type: PropControlTypes.string,
+          placeholder: 'Video url',
+          required: true,
+        },
+        startTime: {
+          type: PropControlTypes.number,
+          placeholder: 'Start playback from',
+        },
+      },
       defaults: {
@@ -42,0 +56,0 @@ src: 'https://www.youtube.com/watch?v=PXi3Mv6KMzY',

src/modules/TagVideo/TagVideo.js

@@ -6,2 +6,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 export default class TagVideo extends Component {
@@ -37,2 +39,3 @@ static propTypes = {
     type: 'tagVideo',
+    name: 'Video Tagging',
     validation: {
@@ -51,2 +54,17 @@ isRequired: value => {
     editor: {
+      properties: {
+        src: {
+          type: PropControlTypes.string,
+          placeholder: 'Video url',
+          required: true,
+        },
+        readOnly: {
+          type: PropControlTypes.boolean,
+          placeholder: 'Read only',
+        },
+        startTime: {
+          type: PropControlTypes.number,
+          placeholder: 'Start playback from',
+        },
+      },
       defaults: {
@@ -53,0 +71,0 @@ src: 'https://www.youtube.com/watch?v=PXi3Mv6KMzY',

src/modules/Title/Title.js

@@ -8,2 +8,4 @@ import React, { Component } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 export default class Title extends Component {
@@ -24,3 +26,14 @@ static propTypes = {
     type: 'title',
+    name: 'Title',
     editor: {
+      properties: {
+        title: {
+          type: PropControlTypes.string,
+          placeholder: 'Title text',
+        },
+        centered: {
+          type: PropControlTypes.boolean,
+          label: 'Text align: center',
+        },
+      },
       defaults: {
@@ -27,0 +40,0 @@ title: 'some title',

src/modules/Video/Video.js

@@ -7,2 +7,4 @@ import React, { Component, createRef } from 'react';
 
+import PropControlTypes from '../../form/Form/PropControlTypes';
+
 import styles from './Video.module.styl';
@@ -40,4 +42,39 @@
     type: 'video',
+    name: 'Video',
     report: ['video is not loading'],
     editor: {
+      properties: {
+        src: {
+          type: PropControlTypes.string,
+          placeholder: 'Video src',
+          required: true,
+        },
+        subtitles: {
+          type: PropControlTypes.string,
+          placeholder: 'Subtitles src',
+        },
+        playerControls: {
+          type: PropControlTypes.boolean,
+          label: 'Show player controls',
+          default: true,
+        },
+        autoPlay: {
+          type: PropControlTypes.boolean,
+          label: 'Show player controls',
+        },
+        loop: {
+          type: PropControlTypes.boolean,
+          label: 'Loop video',
+        },
+        muted: {
+          type: PropControlTypes.string,
+          label: 'Muted',
+        },
+        justify: {
+          type: PropControlTypes.enum,
+          label: 'justify video',
+          options: ['left', 'right', 'center', 'between'],
+          default: 'center',
+        },
+      },
       defaults: {
@@ -44,0 +81,0 @@ src: 'http://media.gettyimages.com/videos/cap-video-id896606100',

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

266198

increased by3.61%

Number of package files

236

increased by0.43%

Lines of code

7067

increased by5.01%

No dependency changes