@atlaskit/editor-plugin-extension 0.4.2 → 0.5.1

package/example-utils/config-panel/fields.ts

@@ -0,0 +1,611 @@
+import type { FieldDefinition } from '@atlaskit/editor-common/extensions';
+
+export const nativeFields: FieldDefinition[] = [
+  {
+    type: 'tab-group',
+    label: 'Tab type',
+    name: 'tabGroup',
+    fields: [
+      {
+        type: 'tab',
+        label: 'Tab A',
+        name: 'optionA',
+        fields: [
+          {
+            name: 'expandField',
+            type: 'expand',
+            label: 'awesome expand field',
+            isExpanded: true,
+            fields: [
+              {
+                name: 'textFieldOne',
+                type: 'string',
+                label: 'Free text',
+              },
+            ],
+          },
+          {
+            name: 'textFieldThree',
+            type: 'string',
+            label: 'Free text',
+          },
+        ],
+      },
+      {
+        type: 'tab',
+        label: 'Tab B',
+        name: 'optionB',
+        fields: [
+          {
+            name: 'textFieldTwo',
+            type: 'string',
+            label: 'Free text',
+          },
+        ],
+      },
+    ],
+  },
+  {
+    name: 'text-field',
+    type: 'string',
+    label: 'Free text',
+    isRequired: true,
+    description: 'Add any text',
+    defaultValue: 'I am the default text',
+  },
+  {
+    name: 'text-field-multiline',
+    type: 'string',
+    label: 'Free text',
+    isRequired: true,
+    description: 'Add any text across multiple lines',
+    defaultValue: 'I am the default multiline text',
+    style: 'multiline',
+  },
+  {
+    name: 'text-field-optional',
+    type: 'string',
+    label: 'Text',
+    isRequired: false,
+    description: 'Leave it empty',
+    placeholder: 'Text goes here',
+  },
+  {
+    name: 'text-field-hidden',
+    type: 'string',
+    label: 'Hidden text field',
+    defaultValue: 'this is a hidden value passed to the extension',
+    isHidden: true,
+  },
+  {
+    name: 'number-field',
+    type: 'number',
+    label: 'Number',
+    isRequired: true,
+    placeholder: 'Number goes here',
+  },
+  {
+    name: 'boolean-field-required',
+    type: 'boolean',
+    label: 'Needs to be checked',
+    description:
+      '<b>A</b> <i>checkbox</i> that can be <code>true</code> or <strong>false</strong> <em>(by design)</em>',
+    isRequired: true,
+  },
+  {
+    name: 'boolean-field-optional',
+    type: 'boolean',
+    label: 'Do you want free shipping?',
+    description: 'True or <b>FALSE</b> (should be bolded)',
+  },
+  {
+    name: 'boolean-field-toggle',
+    type: 'boolean',
+    label: 'Turn on the Wi-Fi?',
+    description: 'On or Off',
+    style: 'toggle',
+    defaultValue: true,
+  },
+  {
+    name: 'date-start',
+    type: 'date',
+    label: 'Date',
+    description: `Nothing of <a onclick="alert('something is wrong')">interest</a>`,
+    placeholder: 'Date goes here',
+  },
+  {
+    name: 'enum-select',
+    type: 'enum',
+    label: 'Select one',
+    isRequired: true,
+    description: 'Pick one',
+    style: 'select',
+    isMultiple: false,
+    placeholder: 'Selected option goes here',
+    items: [
+      { label: 'Option A', value: 'a' },
+      { label: 'Option B', value: 'b' },
+    ],
+  },
+  {
+    name: 'enum-select-icon',
+    type: 'enum',
+    label: 'Select with icons',
+    description: 'Pick one',
+    style: 'select',
+    isMultiple: false,
+    items: [
+      {
+        label: 'Option A',
+        value: 'a',
+        description: 'Recommended',
+        icon: 'https://i.picsum.photos/id/237/24/24.jpg',
+      },
+      {
+        label:
+          'Option B with a really really really really really really long label',
+        value: 'b',
+        description: 'One of the best options out there',
+        icon: 'https://i.picsum.photos/id/240/24/24.jpg',
+      },
+    ],
+  },
+  {
+    name: 'enum-select-icon-multiple',
+    type: 'enum',
+    label: 'Select with icons (multiple)',
+    description: 'Pick many',
+    defaultValue: ['a', 'b', 'long'],
+    style: 'select',
+    placeholder: 'Selected options go here',
+    isMultiple: true,
+    items: [
+      {
+        label: 'Option A',
+        value: 'a',
+        description: 'Our most popular pick',
+        icon: 'https://i.picsum.photos/id/237/24/24.jpg',
+      },
+      {
+        label: 'Option B',
+        value: 'b',
+        description: 'Many people like this one',
+        icon: 'https://i.picsum.photos/id/240/24/24.jpg',
+      },
+      {
+        label: 'Option Long, a really long label (longer than we expected)',
+        value: 'long',
+        description: 'Many people like this one',
+        icon: 'https://i.picsum.photos/id/240/24/24.jpg',
+      },
+    ],
+  },
+  {
+    name: 'enum-select-multiple',
+    type: 'enum',
+    label: 'Select 1 or many',
+    description: '1 required, no default',
+    style: 'select',
+    isRequired: true,
+    isMultiple: true,
+    items: [
+      { label: 'Option A', value: 'a' },
+      { label: 'Option B', value: 'b' },
+      { label: 'Option C', value: 'c' },
+      { label: 'Option D', value: 'd' },
+      { label: 'Option E', value: 'e' },
+    ],
+  },
+  {
+    name: 'enum-radio-required',
+    type: 'enum',
+    label: 'Select one',
+    description: 'One is always required',
+    style: 'radio',
+    isRequired: true,
+    isMultiple: false,
+    items: [
+      { label: 'Option A', value: 'a' },
+      { label: 'Option B', value: 'b' },
+      { label: 'Option C', value: 'c' },
+      { label: 'Option D', value: 'd' },
+      { label: 'Option E', value: 'e' },
+    ],
+  },
+  {
+    name: 'enum-radio-defaulted',
+    type: 'enum',
+    label: 'Select one (defaulted)',
+    description: 'One is always required, but we default it',
+    style: 'radio',
+    isRequired: false,
+    defaultValue: 'a',
+    items: [
+      { label: 'Option A', value: 'a' },
+      { label: 'Option B', value: 'b' },
+      { label: 'Option C', value: 'c' },
+      { label: 'Option D', value: 'd' },
+      { label: 'Option E', value: 'e' },
+    ],
+  },
+  {
+    name: 'enum-checkbox-multiple',
+    type: 'enum',
+    label: 'Select 1 or many, or none',
+    description: 'Nothing required, no default',
+    style: 'checkbox',
+    isRequired: false,
+    isMultiple: true,
+    items: [
+      {
+        label: 'Option A',
+        value: 'a',
+        description: 'tooltip description for a',
+      },
+      {
+        label: 'Option B',
+        value: 'b',
+        description: 'tooltip description for b',
+      },
+      {
+        label: 'Option C',
+        value: 'c',
+        description: 'tooltip description for c',
+      },
+      {
+        label: 'Option D',
+        value: 'd',
+        description: 'tooltip description for d',
+      },
+      {
+        label: 'Option E',
+        value: 'e',
+        description: 'tooltip description for e',
+      },
+    ],
+  },
+  {
+    name: 'enum-checkbox-multiple-required',
+    type: 'enum',
+    label: 'Select 1 or many',
+    description: 'Something required',
+    style: 'checkbox',
+    isRequired: true,
+    isMultiple: true,
+    items: [
+      {
+        label: 'Option A',
+        value: 'a',
+        description: 'tooltip description for a',
+      },
+      {
+        label: 'Option B',
+        value: 'b',
+        description: 'tooltip description for b',
+      },
+      {
+        label: 'Option C',
+        value: 'c',
+        description: 'tooltip description for c',
+      },
+      {
+        label: 'Option D',
+        value: 'd',
+        description: 'tooltip description for d',
+      },
+      {
+        label: 'Option E',
+        value: 'e',
+        description: 'tooltip description for e',
+      },
+    ],
+  },
+  {
+    name: 'unhandled',
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    type: 'foobar' as any,
+    label: 'Unknown type',
+  },
+  {
+    name: 'fieldset-cql',
+    type: 'fieldset',
+    label: 'CQL',
+    options: {
+      isDynamic: true,
+      transformer: {
+        type: 'cql',
+      },
+    },
+    fields: [
+      {
+        name: 'created-at',
+        type: 'date-range',
+        label: 'Created at',
+        description: `This is how we select date range in the cql component`,
+        items: [
+          { label: 'Any date', value: '' },
+          { label: 'Last 24 hours', value: 'now(-1d)' },
+          { label: 'Last week', value: 'now(-1w)' },
+          { label: 'Last month', value: 'now(-1M)' },
+          { label: 'Last year', value: 'now(-1y)' },
+        ],
+      },
+      {
+        name: 'last-modified',
+        type: 'date-range',
+        label: 'Last modified',
+        items: [
+          { label: 'Today', value: 'now(-1d)' },
+          { label: 'This week', value: 'now(-1w)' },
+          { label: 'This month', value: 'now(-1M)' },
+          { label: 'This year', value: 'now(-1y)' },
+        ],
+      },
+      {
+        name: 'query',
+        type: 'string',
+        label: 'Search term',
+      },
+      {
+        name: 'custom',
+        type: 'custom',
+        label: 'Custom: Select anything',
+        isRequired: true,
+        options: {
+          resolver: {
+            type: 'mock-resolver',
+          },
+        },
+      },
+      {
+        name: 'content',
+        type: 'enum',
+        label: 'Content Type',
+        isRequired: false,
+        style: 'checkbox',
+        isMultiple: true,
+        items: [
+          {
+            label: 'Page',
+            value: 'page',
+          },
+          {
+            label: 'Blogpost',
+            value: 'blogpost',
+          },
+          {
+            label: 'Question',
+            value: 'question',
+          },
+        ],
+      },
+    ],
+  },
+  {
+    name: 'fieldset-without-label',
+    type: 'fieldset',
+    label: 'Fieldset without label',
+    options: {
+      isDynamic: true,
+      showTitle: false,
+      transformer: {
+        type: 'cql',
+      },
+    },
+    fields: [
+      {
+        name: 'inner-text',
+        type: 'string',
+        label: 'Search term',
+      },
+    ],
+  },
+  {
+    name: 'fieldset-jira-filter',
+    type: 'fieldset',
+    label: 'Issues filter',
+    options: {
+      isDynamic: true,
+      transformer: {
+        type: 'cql',
+      },
+    },
+    fields: [
+      {
+        name: 'keywords',
+        type: 'string',
+        label: 'Keywords',
+      },
+      {
+        name: 'project',
+        type: 'enum',
+        label: 'Project',
+        isRequired: false,
+        style: 'select',
+        items: [
+          {
+            label: 'Editor platform',
+            value: 'editor-platform',
+          },
+          {
+            label: 'Editor experiences',
+            value: 'editor-experiences',
+          },
+        ],
+      },
+      {
+        name: 'status',
+        type: 'enum',
+        label: 'Status',
+        isRequired: false,
+        style: 'select',
+        items: [
+          {
+            label: 'To do',
+            value: 'to-do',
+          },
+          {
+            label: 'In Progress',
+            value: 'in-progress',
+          },
+          {
+            label: 'Done',
+            value: 'Done',
+          },
+        ],
+      },
+    ],
+  },
+  {
+    name: 'expand field',
+    type: 'expand',
+    label: 'awesome expand field',
+    fields: [
+      {
+        name: 'enum-select-expand',
+        type: 'enum',
+        label: 'Select one',
+        isRequired: true,
+        description: 'Pick one',
+        style: 'select',
+        isMultiple: false,
+        placeholder: 'Selected option goes here',
+        items: [
+          { label: 'Option A', value: 'a' },
+          { label: 'Option B', value: 'b' },
+        ],
+      },
+      {
+        name: 'enum-select-icon-expand',
+        type: 'enum',
+        label: 'Select with icons',
+        description: 'Pick one',
+        style: 'select',
+        isMultiple: false,
+        items: [
+          {
+            label: 'Option A',
+            value: 'a',
+            description: 'Recommended',
+          },
+          {
+            label:
+              'Option B with a really really really really really really long label',
+            value: 'b',
+            description: 'One of the best options out there',
+          },
+        ],
+      },
+    ],
+  },
+  {
+    name: 'color-picker',
+    label: 'Color Picker',
+    type: 'color',
+    description: 'Pick your color',
+    defaultValue: '#7AB2FF',
+  },
+  {
+    name: 'color-picker-req',
+    label: 'Color Picker Required',
+    type: 'color',
+    isRequired: true,
+    description: 'Pick your color',
+    defaultValue: '#7AB2FF',
+  },
+];
+
+export const customFields: FieldDefinition[] = [
+  {
+    name: 'custom-required',
+    type: 'custom',
+    label: 'Custom: Required',
+    description: 'Select the option',
+    isRequired: true,
+    options: {
+      resolver: {
+        type: 'mock-resolver',
+      },
+    },
+  },
+  {
+    name: 'custom-optional',
+    type: 'custom',
+    label: 'Custom: Optional',
+    description: 'Select the option, maybe',
+    options: {
+      resolver: {
+        type: 'mock-resolver',
+      },
+    },
+  },
+  {
+    name: 'custom-required-create',
+    type: 'custom',
+    label: 'Custom: Create an option',
+    description: 'Select or create an option',
+    isRequired: true,
+    options: {
+      isCreatable: true,
+      resolver: {
+        type: 'mock-resolver',
+      },
+    },
+  },
+  {
+    name: 'custom-create-multiple',
+    type: 'custom',
+    label: 'Custom: Create option(s)',
+    description: 'Select or create option(s)',
+    isMultiple: true,
+    options: {
+      isCreatable: true,
+      resolver: {
+        type: 'mock-resolver',
+      },
+    },
+  },
+  {
+    name: 'unsupported',
+    type: 'custom',
+    label: 'Custom: Missing provider',
+    options: {
+      resolver: {
+        type: 'missing-type',
+      },
+    },
+  },
+  {
+    name: 'user-jdog',
+    type: 'user',
+    label: 'JDog User',
+    options: {
+      provider: {
+        type: 'user-jdog-provider',
+      },
+    },
+  },
+  {
+    name: 'user-jdog-required',
+    type: 'user',
+    label: 'JDog User (Required)',
+    isRequired: true,
+    options: {
+      provider: {
+        type: 'user-jdog-provider',
+      },
+    },
+  },
+  {
+    name: 'user-jdog-multiple',
+    type: 'user',
+    label: 'JDog User (Multiple, Required)',
+    isRequired: true,
+    isMultiple: true,
+    options: {
+      provider: {
+        type: 'user-jdog-provider',
+      },
+    },
+  },
+];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-extension",
-  "version": "0.4.2",
+  "version": "0.5.1",
   "description": "editor-plugin-extension plugin for @atlaskit/editor-core",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
@@ -10,9 +10,10 @@
   "atlassian": {
     "team": "Editor: Scarlet",
     "singleton": true,
-    "releaseModel": "continuous"
+    "releaseModel": "continuous",
+    "runReact18": false
   },
-  "repository": "https://bitbucket.org/atlassian/atlassian-frontend",
+  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "module:es2019": "dist/es2019/index.js",
@@ -23,22 +24,58 @@
     ".": "./src/index.ts"
   },
   "dependencies": {
-    "@atlaskit/editor-common": "^76.26.0",
+    "@atlaskit/adf-schema": "^35.3.0",
+    "@atlaskit/adf-utils": "^19.0.0",
+    "@atlaskit/analytics-next": "^9.1.0",
+    "@atlaskit/avatar": "^21.4.0",
+    "@atlaskit/button": "^17.2.0",
+    "@atlaskit/checkbox": "^13.0.0",
+    "@atlaskit/datetime-picker": "^13.0.3",
+    "@atlaskit/editor-common": "^76.39.0",
+    "@atlaskit/editor-json-transformer": "^8.10.0",
     "@atlaskit/editor-plugin-analytics": "^0.4.0",
     "@atlaskit/editor-plugin-context-panel": "^0.2.0",
     "@atlaskit/editor-plugin-decorations": "^0.2.0",
     "@atlaskit/editor-plugin-feature-flags": "^1.0.0",
     "@atlaskit/editor-plugin-width": "^0.2.0",
     "@atlaskit/editor-prosemirror": "1.1.0",
-    "@babel/runtime": "^7.0.0"
+    "@atlaskit/editor-shared-styles": "^2.9.0",
+    "@atlaskit/editor-tables": "^2.3.0",
+    "@atlaskit/empty-state": "^7.6.0",
+    "@atlaskit/form": "^9.0.3",
+    "@atlaskit/icon": "^22.0.0",
+    "@atlaskit/platform-feature-flags": "^0.2.0",
+    "@atlaskit/radio": "^6.0.0",
+    "@atlaskit/section-message": "^6.4.0",
+    "@atlaskit/select": "^17.0.3",
+    "@atlaskit/smart-user-picker": "^6.4.0",
+    "@atlaskit/spinner": "^16.0.0",
+    "@atlaskit/tabs": "^14.0.0",
+    "@atlaskit/textarea": "^5.0.0",
+    "@atlaskit/textfield": "^6.0.0",
+    "@atlaskit/theme": "^12.6.0",
+    "@atlaskit/toggle": "^13.0.0",
+    "@atlaskit/tokens": "^1.33.0",
+    "@atlaskit/tooltip": "^18.1.0",
+    "@babel/runtime": "^7.0.0",
+    "@emotion/react": "^11.7.1",
+    "is-number": "^7.0.0",
+    "lodash": "^4.17.21",
+    "memoize-one": "^6.0.0",
+    "react-loadable": "^5.1.0"
   },
   "peerDependencies": {
-    "react": "^16.8.0"
+    "react": "^16.8.0",
+    "react-intl-next": "npm:react-intl@^5.18.1"
   },
   "devDependencies": {
     "@atlassian/atlassian-frontend-prettier-config-1.0.0": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.0",
     "@testing-library/react": "^12.1.5",
+    "@testing-library/react-hooks": "^8.0.1",
+    "@testing-library/user-event": "^14.4.3",
     "react-dom": "^16.8.0",
+    "react-select": "^5.4.0",
+    "react-test-renderer": "^16.8.0",
     "typescript": "~4.9.5"
   },
   "techstack": {
@@ -73,5 +110,10 @@
       ]
     }
   },
-  "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.0"
+  "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.0",
+  "platform-feature-flags": {
+    "platform.editor.multi-bodied-extension_0rygg": {
+      "type": "boolean"
+    }
+  }
 }