npm - @operato/process - Versions diffs - 7.1.30 → 7.1.32 - Mend

@operato/process 7.1.30 → 7.1.32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (57) hide show

package/CHANGELOG.md +18 -0
package/dist/tsconfig.tsbuildinfo +1 -1
package/package.json +14 -14
package/.storybook/main.js +0 -3
package/.storybook/preview.js +0 -52
package/.storybook/server.mjs +0 -8
package/demo/index-modeller.html +0 -112
package/demo/index-viewer.html +0 -112
package/demo/index.html +0 -112
package/src/data-storage/data-storage.ts +0 -47
package/src/graphql/data-subscription.ts +0 -30
package/src/graphql/favorite-process.ts +0 -25
package/src/graphql/index.ts +0 -3
package/src/graphql/process-group.ts +0 -138
package/src/graphql/process.ts +0 -141
package/src/graphql/scenario.ts +0 -79
package/src/index.ts +0 -8
package/src/modeller/component-toolbar/component-detail.ts +0 -58
package/src/modeller/component-toolbar/component-menu.ts +0 -193
package/src/modeller/component-toolbar/component-toolbar.ts +0 -196
package/src/modeller/component-toolbar/mode-icons.ts +0 -88
package/src/modeller/edit-toolbar-style.ts +0 -229
package/src/modeller/edit-toolbar.ts +0 -576
package/src/modeller/property-sidebar/abstract-property.ts +0 -69
package/src/modeller/property-sidebar/data-binding/data-binding-mapper.ts +0 -475
package/src/modeller/property-sidebar/data-binding/data-binding.ts +0 -479
package/src/modeller/property-sidebar/effects/effects-shared-style.ts +0 -62
package/src/modeller/property-sidebar/effects/effects.ts +0 -52
package/src/modeller/property-sidebar/effects/property-event-hover.ts +0 -201
package/src/modeller/property-sidebar/effects/property-event-tap.ts +0 -212
package/src/modeller/property-sidebar/effects/property-event.ts +0 -76
package/src/modeller/property-sidebar/effects/property-shadow.ts +0 -114
package/src/modeller/property-sidebar/effects/value-converter.ts +0 -23
package/src/modeller/property-sidebar/inspector/inspector.ts +0 -408
package/src/modeller/property-sidebar/property-shared-style.ts +0 -136
package/src/modeller/property-sidebar/property-sidebar.ts +0 -342
package/src/modeller/property-sidebar/shapes/box-padding-editor-styles.ts +0 -94
package/src/modeller/property-sidebar/shapes/shapes.ts +0 -410
package/src/modeller/property-sidebar/specifics/specific-properties-builder.ts +0 -147
package/src/modeller/property-sidebar/specifics/specifics.ts +0 -81
package/src/modeller/property-sidebar/styles/styles.ts +0 -577
package/src/ox-editor-process-selector.ts +0 -91
package/src/ox-process-list.ts +0 -401
package/src/ox-process-modeller.ts +0 -432
package/src/ox-process-template-list.ts +0 -272
package/src/ox-process-template-viewer.ts +0 -198
package/src/ox-process-viewer.ts +0 -575
package/src/ox-property-editor-process-selector.ts +0 -23
package/src/selector/ox-process-creation-card.ts +0 -95
package/src/selector/ox-process-selector.ts +0 -324
package/src/selector/process-creation-popup.ts +0 -151
package/src/selector/process-thumbnail-card.ts +0 -175
package/src/types.ts +0 -57
package/stories/index.stories.ts +0 -54
package/tsconfig.json +0 -24
package/web-dev-server.config.mjs +0 -30
package/web-test-runner.config.mjs +0 -29

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@operato/process",
-  "version": "7.1.30",
+  "version": "7.1.32",
   "description": "Webcomponent for business process modeling following open-wc recommendations",
   "author": "heartyoh",
   "main": "dist/src/index.js",
@@ -74,18 +74,18 @@
   },
   "dependencies": {
     "@open-wc/scoped-elements": "^2.1.3",
-    "@operato/app": "^7.1.30",
-    "@operato/board": "^7.1.30",
-    "@operato/data-grist": "^7.1.30",
-    "@operato/font": "^7.1.30",
-    "@operato/graphql": "^7.1.1",
-    "@operato/i18n": "^7.1.1",
-    "@operato/input": "^7.1.30",
-    "@operato/markdown": "^7.1.27",
-    "@operato/popup": "^7.1.30",
-    "@operato/property-editor": "^7.1.30",
-    "@operato/styles": "^7.1.27",
-    "@operato/utils": "^7.1.1",
+    "@operato/app": "^7.1.32",
+    "@operato/board": "^7.1.32",
+    "@operato/data-grist": "^7.1.32",
+    "@operato/font": "^7.1.32",
+    "@operato/graphql": "^7.1.32",
+    "@operato/i18n": "^7.1.32",
+    "@operato/input": "^7.1.32",
+    "@operato/markdown": "^7.1.32",
+    "@operato/popup": "^7.1.32",
+    "@operato/property-editor": "^7.1.32",
+    "@operato/styles": "^7.1.32",
+    "@operato/utils": "^7.1.32",
     "@polymer/paper-dropdown-menu": "^3.2.0",
     "@types/file-saver": "^2.0.4",
     "@types/sortablejs": "^1.10.7",
@@ -134,5 +134,5 @@
       "prettier --write"
     ]
   },
-  "gitHead": "863eb4937334eb66a3cd0e5dbea5c77bc1afc472"
+  "gitHead": "c4f5ed0b63d49d02c5a155b592c0ecf681c92cf7"
 }

package/.storybook/main.js DELETED Viewed

@@ -1,3 +0,0 @@
-module.exports = {
-  stories: ['../dist/stories/**/*.stories.{js,md,mdx}']
-}

package/.storybook/preview.js DELETED Viewed

@@ -1,52 +0,0 @@
-import { i18next } from '@operato/i18n'
-export const globalTypes = {
-  locale: {
-    name: 'Locale',
-    description: 'Internationalization locale',
-    toolbar: {
-      icon: 'globe',
-      items: [
-        { value: 'en', right: '🇺🇸', title: 'English' },
-        { value: 'ko', right: '🇰🇷', title: '한국어' },
-        { value: 'zh', right: '🇨🇳', title: '中文' },
-        { value: 'ja', right: '🇯🇵', title: '日本語' },
-        { value: 'ms', right: '🇲🇾', title: 'Bahasa Melayu' }
-      ],
-      showName: true
-    }
-  },
-  theme: {
-    name: 'Theme',
-    description: 'Global theme for components',
-    toolbar: {
-      icon: 'paintbrush',
-      items: [
-        { value: 'light', title: 'Light' },
-        { value: 'dark', title: 'Dark' }
-      ],
-      showName: true
-    }
-  }
-}
-export const decorators = [
-  (Story, context) => {
-    const { locale, theme } = context.globals
-    if (locale) {
-      i18next.changeLanguage(locale)
-    }
-    // Set the theme class for the document
-    if (theme === 'dark') {
-      document.documentElement.classList.add('dark')
-      document.documentElement.classList.remove('light')
-    } else {
-      document.documentElement.classList.add('light')
-      document.documentElement.classList.remove('dark')
-    }
-    return Story()
-  }
-]

package/.storybook/server.mjs DELETED Viewed

@@ -1,8 +0,0 @@
-import { storybookPlugin } from '@web/dev-server-storybook'
-import baseConfig from '../web-dev-server.config.mjs'
-export default /** @type {import('@web/dev-server').DevServerConfig} */ ({
-  ...baseConfig,
-  open: '/',
-  plugins: [storybookPlugin({ type: 'web-components' }), ...baseConfig.plugins]
-})

package/demo/index-modeller.html DELETED Viewed

@@ -1,112 +0,0 @@
-<!doctype html>
-<html lang="en-GB">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
-    <style>
-      body {
-        margin: 0;
-        padding: 0;
-        overflow: hidden;
-        /* This is a font-stack that tries to use the system-default sans-serifs first */
-        font-family: Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
-        line-height: 1.5;
-        -webkit-font-smoothing: antialiased;
-      }
-      ox-process-modeller {
-        width: 100vw;
-        height: 100dvh;
-      }
-    </style>
-    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
-    <link
-      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
-      rel="stylesheet"
-    />
-    <link
-      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
-      rel="stylesheet"
-    />
-    <link
-      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
-      rel="stylesheet"
-    />
-  </head>
-  <body>
-    <div id="demo"></div>
-    <script type="module">
-      import { html, render } from 'lit'
-      import '../dist/src/ox-process-modeller.js'
-      import { ReferenceMap, create, error } from '@hatiolab/things-scene'
-      const colors = ['red', 'blue', 'orange', 'yellow', 'magenta', 'violet', 'navy', 'green', 'cyan', 'lime']
-      const processes = colors.map((color, idx) => {
-        var to = colors[(idx + 1) % colors.length]
-        return {
-          id: color,
-          model: {
-            width: 400,
-            height: 300,
-            fillStyle: color,
-            components: [
-              {
-                type: 'text',
-                left: 100,
-                top: 100,
-                width: 200,
-                height: 30,
-                text: `Click to move to ${to}`,
-                event: {
-                  tap: {
-                    action: 'goto',
-                    target: to
-                  }
-                }
-              }
-            ]
-          }
-        }
-      })
-      var provider = new ReferenceMap(
-        async (processId, resolve, reject) => {
-          try {
-            const process = processes.find(process => {
-              return process.id === processId
-            })
-            if (!process) {
-              throw `no process named as ${processId}`
-            }
-            var scene
-            try {
-              scene = await provider.get(processId)
-              console.warn('Process fetched more than twice.', processId)
-            } catch (e) {
-              scene = create({
-                model: JSON.parse(JSON.stringify(process.model)),
-                mode: 0,
-                refProvider: provider
-              })
-            }
-            resolve(scene, process)
-          } catch (e) {
-            error(e)
-            reject(e)
-          }
-        },
-        async (id, ref) => {
-          ref.dispose()
-        }
-      )
-      render(
-        html` <ox-process-modeller .process=${processes[0]} .provider=${provider}> </ox-process-modeller> `,
-        document.querySelector('#demo')
-      )
-    </script>
-  </body>
-</html>

package/demo/index-viewer.html DELETED Viewed

@@ -1,112 +0,0 @@
-<!doctype html>
-<html lang="en-GB">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
-    <style>
-      body {
-        margin: 0;
-        padding: 0;
-        overflow: hidden;
-        /* This is a font-stack that tries to use the system-default sans-serifs first */
-        font-family: Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
-        line-height: 1.5;
-        -webkit-font-smoothing: antialiased;
-      }
-      ox-process-viewer {
-        width: 100vw;
-        height: 100dvh;
-      }
-    </style>
-    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
-    <link
-      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
-      rel="stylesheet"
-    />
-    <link
-      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
-      rel="stylesheet"
-    />
-    <link
-      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
-      rel="stylesheet"
-    />
-  </head>
-  <body>
-    <div id="demo"></div>
-    <script type="module">
-      import { html, render } from 'lit'
-      import '../dist/src/ox-process-viewer.js'
-      import { ReferenceMap, create, error } from '@hatiolab/things-scene'
-      const colors = ['red', 'blue', 'orange', 'yellow', 'magenta', 'violet', 'navy', 'green', 'cyan', 'lime']
-      const processes = colors.map((color, idx) => {
-        var to = colors[(idx + 1) % colors.length]
-        return {
-          id: color,
-          model: {
-            width: 400,
-            height: 300,
-            fillStyle: color,
-            components: [
-              {
-                type: 'text',
-                left: 100,
-                top: 100,
-                width: 200,
-                height: 30,
-                text: `Click to move to ${to}`,
-                event: {
-                  tap: {
-                    action: 'goto',
-                    target: to
-                  }
-                }
-              }
-            ]
-          }
-        }
-      })
-      var provider = new ReferenceMap(
-        async (processId, resolve, reject) => {
-          try {
-            const process = processes.find(process => {
-              return process.id === processId
-            })
-            if (!process) {
-              throw `no process named as ${processId}`
-            }
-            var scene
-            try {
-              scene = await provider.get(processId)
-              console.warn('Process fetched more than twice.', processId)
-            } catch (e) {
-              scene = create({
-                model: JSON.parse(JSON.stringify(process.model)),
-                mode: 0,
-                refProvider: provider
-              })
-            }
-            resolve(scene, process)
-          } catch (e) {
-            error(e)
-            reject(e)
-          }
-        },
-        async (id, ref) => {
-          ref.dispose()
-        }
-      )
-      render(
-        html` <ox-process-viewer .process=${processes[0]} .provider=${provider}></ox-process-viewer> `,
-        document.querySelector('#demo')
-      )
-    </script>
-  </body>
-</html>

package/demo/index.html DELETED Viewed

@@ -1,112 +0,0 @@
-<!doctype html>
-<html lang="en-GB">
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
-    <style>
-      body {
-        margin: 0;
-        padding: 0;
-        overflow: hidden;
-        /* This is a font-stack that tries to use the system-default sans-serifs first */
-        font-family: Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
-        line-height: 1.5;
-        -webkit-font-smoothing: antialiased;
-      }
-      ox-process-viewer {
-        width: 100vw;
-        height: 100dvh;
-      }
-    </style>
-    <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500" rel="stylesheet" />
-    <link
-      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL@20..48,100..700,0..1"
-      rel="stylesheet"
-    />
-    <link
-      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL@20..48,100..700,0..1"
-      rel="stylesheet"
-    />
-    <link
-      href="https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL@20..48,100..700,0..1"
-      rel="stylesheet"
-    />
-  </head>
-  <body>
-    <div id="demo"></div>
-    <script type="module">
-      import { html, render } from 'lit'
-      import '../dist/src/ox-process-viewer.js'
-      import { ReferenceMap, create, error } from '@hatiolab/things-scene'
-      const colors = ['red', 'blue', 'orange', 'yellow', 'magenta', 'violet', 'navy', 'green', 'cyan', 'lime']
-      const processes = colors.map((color, idx) => {
-        var to = colors[(idx + 1) % colors.length]
-        return {
-          id: color,
-          model: {
-            width: 400,
-            height: 300,
-            fillStyle: color,
-            components: [
-              {
-                type: 'text',
-                left: 100,
-                top: 100,
-                width: 200,
-                height: 30,
-                text: `Click to move to ${to}`,
-                event: {
-                  tap: {
-                    action: 'goto',
-                    target: to
-                  }
-                }
-              }
-            ]
-          }
-        }
-      })
-      var provider = new ReferenceMap(
-        async (processId, resolve, reject) => {
-          try {
-            const process = processes.find(process => {
-              return process.id === processId
-            })
-            if (!process) {
-              throw `no process named as ${processId}`
-            }
-            var scene
-            try {
-              scene = await provider.get(processId)
-              console.warn('Process fetched more than twice.', processId)
-            } catch (e) {
-              scene = create({
-                model: JSON.parse(JSON.stringify(process.model)),
-                mode: 0,
-                refProvider: provider
-              })
-            }
-            resolve(scene, process)
-          } catch (e) {
-            error(e)
-            reject(e)
-          }
-        },
-        async (id, ref) => {
-          ref.dispose()
-        }
-      )
-      render(
-        html` <ox-process-viewer .process=${processes[0]} .provider=${provider}></ox-process-viewer> `,
-        document.querySelector('#demo')
-      )
-    </script>
-  </body>
-</html>

package/src/data-storage/data-storage.ts DELETED Viewed

@@ -1,47 +0,0 @@
-import Dexie from 'dexie'
-import { Component, PersistentDataStorage } from '@hatiolab/things-scene'
-class ProcessDatabase extends Dexie {
-  process_data!: Dexie.Table<IProcessData, number> // number = type of the primkey
-  //...other tables goes here...
-  constructor() {
-    super('operato-process-database')
-    this.version(1).stores({
-      process_data: '[process+refid]'
-      //...other tables goes here...
-    })
-  }
-}
-interface IProcessData {
-  id?: number
-  process: string
-  refid: string | number
-  data: any
-  timestamp: number
-}
-const db = new ProcessDatabase()
-export class DataStorage implements PersistentDataStorage {
-  private id: string
-  constructor(id: string) {
-    this.id = id
-  }
-  public async load(key: Component): Promise<any> {
-    const saved = await db.process_data.where({ process: this.id, refid: key.state.refid }).first()
-    return saved?.data
-  }
-  public async save(key: Component, value: any): Promise<void> {
-    await db.process_data.put({ process: this.id, refid: key.state.refid, data: value, timestamp: Date.now() })
-  }
-  public async clear(key: Component): Promise<void> {
-    await db.process_data.where({ process: this.id, refid: key.state.refid }).delete()
-  }
-}

package/src/graphql/data-subscription.ts DELETED Viewed

@@ -1,30 +0,0 @@
-import { Component, DataSubscriptionProvider } from '@hatiolab/things-scene'
-import gql from 'graphql-tag'
-import { subscribe } from '@operato/graphql'
-export class DataSubscriptionProviderImpl implements DataSubscriptionProvider {
-  async subscribe(tag: string, component: Component) {
-    return await subscribe(
-      {
-        query: gql`
-                  subscription {
-                    data(tag: "${tag}") {
-                      tag
-                      data
-                    }
-                  }
-                `
-      },
-      {
-        next: async ({ data }: { data: any }) => {
-          if (data) {
-            component.data = data.data.data
-          }
-        }
-      }
-    )
-  }
-  dispose() {}
-}

package/src/graphql/favorite-process.ts DELETED Viewed

@@ -1,25 +0,0 @@
-import { buildArgs, client } from '@operato/graphql'
-import gql from 'graphql-tag'
-export async function fetchFavoriteProcessList(listParam = {}) {
-  const response = await client.query({
-    query: gql`
-      {
-        favoriteProcesses(${buildArgs(listParam)}) {
-          items {
-            id
-            name
-            description
-            thumbnail
-            createdAt
-            updatedAt
-          }
-          total
-        }
-      }
-    `
-  })
-  return response.data
-}

package/src/graphql/index.ts DELETED Viewed

@@ -1,3 +0,0 @@
-export * from './process'
-export * from './process-group'
-export * from './favorite-process'

package/src/graphql/process-group.ts DELETED Viewed

@@ -1,138 +0,0 @@
-import { ProcessGroup } from '../types'
-import { client } from '@operato/graphql'
-import gql from 'graphql-tag'
-export async function fetchProcessGroup(id: string) {
-  const response = await client.query({
-    query: gql`
-      query FetchProcessGroupById($id: String!) {
-        group(id: $id) {
-          id
-          name
-          description
-          createdAt
-          creator {
-            id
-            name
-          }
-          updatedAt
-          updater {
-            id
-            name
-          }
-        }
-      }
-    `,
-    variables: { id }
-  })
-  return response.data
-}
-export async function updateProcessGroup(group: ProcessGroup) {
-  var { id, name, description } = group
-  const response = await client.mutate({
-    mutation: gql`
-      mutation UpdateProcessGroup($id: String!, $patch: ProcessGroupPatch!) {
-        updateProcessGroup(id: $id, patch: $patch) {
-          id
-          name
-          description
-          createdAt
-          updatedAt
-        }
-      }
-    `,
-    variables: {
-      id,
-      patch: { name, description }
-    }
-  })
-  return response.data
-}
-export async function deleteProcessGroup(id: string) {
-  const response = await client.mutate({
-    mutation: gql`
-      mutation ($id: String!) {
-        deleteProcessGroup(id: $id)
-      }
-    `,
-    variables: {
-      id
-    }
-  })
-  return response.data
-}
-export async function fetchProcessGroupList() {
-  const response = await client.query({
-    query: gql`
-      {
-        processGroups {
-          items {
-            id
-            name
-            description
-            createdAt
-            updatedAt
-          }
-          total
-        }
-      }
-    `
-  })
-  return response.data
-}
-export async function createProcessGroup(group: ProcessGroup) {
-  const response = await client.mutate({
-    mutation: gql`
-      mutation CreateProcessGroup($group: NewProcessGroup!) {
-        createProcessGroup(group: $group) {
-          id
-          name
-          description
-          createdAt
-          updatedAt
-        }
-      }
-    `,
-    variables: { group }
-  })
-  return response.data
-}
-export async function joinProcessGroup(processId: string, groupId: string) {
-  const response = await client.mutate({
-    mutation: gql`
-      mutation JoinProcessGroup($id: String!, $processIds: [String!]!) {
-        joinProcessGroup(id: $id, processIds: $processIds) {
-          id
-          name
-          description
-          processes {
-            id
-            name
-            description
-            createdAt
-            updatedAt
-          }
-          createdAt
-          updatedAt
-        }
-      }
-    `,
-    variables: {
-      id: groupId,
-      processIds: [processId]
-    }
-  })
-  return response.data
-}