npm - @things-factory/worklist - Versions diffs - 9.0.0-beta.8 → 9.0.0-beta.80 - Mend

@things-factory/worklist 9.0.0-beta.8 → 9.0.0-beta.80

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 (186) hide show

package/README.md CHANGED Viewed

@@ -1,9 +1,34 @@
-# Worklist
+# @things-factory/worklist 모듈
-- Activity can be defined.
-- An Activity Instance can be posted by an Issuer.
-- Activity instance can be performed by assignee.
-- Manages the life cycle of Activity Instance.
+## 개요
+`@things-factory/worklist`는 Things Factory 프레임워크 내에서 비즈니스 참여자들의 작업 목록(Todo list)을 관리하기 위한 핵심 모듈입니다. BPMN(Business Process Model and Notation) 개념을 기반으로 설계되어, 복잡한 워크플로우와 작업 할당, 추적, 승인 프로세스를 효과적으로 관리할 수 있는 기능을 제공합니다.
+## 주요 기능
+- **작업 정의 (Activity)**: 다양한 유형의 비즈니스 작업(Task, Service, Manual 등)을 정의하고 상태(Draft, Released, Deprecated)를 관리합니다.
+- **작업 인스턴스 (ActivityInstance)**: 정의된 작업을 기반으로 실제 수행되는 작업 인스턴스를 생성하고 추적합니다.
+- **작업 스레드 (ActivityThread)**: 개별 작업 인스턴스 내의 상세 수행 단위(스레드)를 관리하며, 담당자 할당, 상태 변경(Assigned, Started, Submitted 등) 및 실행 기록을 추적합니다.
+- **승인 관리 (ActivityApproval)**: 작업 결과에 대한 승인 라인을 설정하고 승인/반려 프로세스를 관리합니다.
+- **역할 기반 접근 제어**: 작업 생성, 할당, 수행, 감독 등에 대한 역할을 정의하고 권한을 관리합니다.
+- **UI 컴포넌트 및 페이지**: 작업 목록, 대시보드, 작업 상세 화면 등 다양한 사용자 인터페이스 요소를 제공합니다.
+- **GraphQL API**: 외부 시스템과의 연동 및 클라이언트 애플리케이션 개발을 위한 GraphQL API를 제공합니다.
+## 사용 사례
+- 기업 내 업무 프로세스 자동화
+- 서비스 요청 처리 및 추적
+- 승인 워크플로우 관리
+- 프로젝트 작업 관리
+- 개인 및 팀별 할 일 관리
+## 기술 스택
+- **백엔드**: Node.js, TypeScript, TypeORM, TypeGraphQL
+- **프론트엔드**: LitElement, TypeScript
+- **데이터베이스**: PostgreSQL (또는 TypeORM이 지원하는 다른 데이터베이스)
+이 모듈은 Things Factory 생태계의 다른 모듈들(예: `@things-factory/auth-base`, `@things-factory/organization`)과 긴밀하게 연동되어 동작합니다.
 ## Sequence

package/dist-client/activity-summary-generator.js CHANGED Viewed

@@ -1,4 +1,3 @@
-import { __asyncGenerator, __await } from "tslib";
 import debounce from 'lodash-es/debounce';
 import gql from 'graphql-tag';
 import { client, subscribe } from '@operato/graphql';
@@ -62,7 +61,6 @@ var generatorLocks = {
     numberOfDrafts: new AsyncLock(true)
 };
 const fetchActivitySummary = debounce(async () => {
-    var _a, _b, _c, _d;
     const response = await client.query({
         query: gql `
       query {
@@ -81,29 +79,26 @@ const fetchActivitySummary = debounce(async () => {
         summary['numberOfApprovalPendings'] = numberOfApprovalPendings;
         summary['numberOfPicks'] = numberOfPicks;
         summary['numberOfDrafts'] = numberOfDrafts;
-        (_a = generatorLocks['numberOfToDos']) === null || _a === void 0 ? void 0 : _a.unlock(numberOfToDos);
-        (_b = generatorLocks['numberOfApprovalPendings']) === null || _b === void 0 ? void 0 : _b.unlock(numberOfApprovalPendings);
-        (_c = generatorLocks['numberOfPicks']) === null || _c === void 0 ? void 0 : _c.unlock(numberOfPicks);
-        (_d = generatorLocks['numberOfDrafts']) === null || _d === void 0 ? void 0 : _d.unlock(numberOfDrafts);
+        generatorLocks['numberOfToDos']?.unlock(numberOfToDos);
+        generatorLocks['numberOfApprovalPendings']?.unlock(numberOfApprovalPendings);
+        generatorLocks['numberOfPicks']?.unlock(numberOfPicks);
+        generatorLocks['numberOfDrafts']?.unlock(numberOfDrafts);
     }
 }, 1000);
-export function generateActivitySummary(name) {
-    return __asyncGenerator(this, arguments, function* generateActivitySummary_1() {
-        var _a;
-        /* 1. 앞에 사용되었던 generator가 종료될 기회를 준다. */
-        (_a = generatorLocks[name]) === null || _a === void 0 ? void 0 : _a.unlock();
-        /* 2. 마지막 값을 일단 yield 한다. */
-        yield yield __await(summary[name]);
-        while (true) {
-            generatorLocks[name].lock();
-            let badge = yield __await(generatorLocks[name].promise);
-            if (badge === undefined) {
-                /* 새로운 generator가 생성된 경우이면, 기존 generator는 종료한다. */
-                return yield __await(void 0);
-            }
-            yield yield __await(badge);
+export async function* generateActivitySummary(name) {
+    /* 1. 앞에 사용되었던 generator가 종료될 기회를 준다. */
+    generatorLocks[name]?.unlock();
+    /* 2. 마지막 값을 일단 yield 한다. */
+    yield summary[name];
+    while (true) {
+        generatorLocks[name].lock();
+        let badge = await generatorLocks[name].promise;
+        if (badge === undefined) {
+            /* 새로운 generator가 생성된 경우이면, 기존 generator는 종료한다. */
+            return;
         }
-    });
+        yield badge;
+    }
 }
 export async function startSubscribeActivitySummary() {
     await subscribeActivityInstance();

package/dist-client/activity-summary-generator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"activity-summary-generator.js","sourceRoot":"","sources":["../client/activity-summary-generator.ts"],"names":[],"mappings":";AAAA,OAAO,QAAQ,MAAM,oBAAoB,CAAA;AACzC,OAAO,GAAG,MAAM,aAAa,CAAA;AAC7B,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAA;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAE1C,KAAK,UAAU,yBAAyB;IACtC,OAAO,MAAM,SAAS,CACpB;QACE,KAAK,EAAE,GAAG,CAAA;;;;;;OAMT;KACF,EACD;QACE,IAAI,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACvB,IAAI,IAAI,EAAE,CAAC;gBACT,oBAAoB,EAAE,CAAA;YACxB,CAAC;QACH,CAAC;KACF,CACF,CAAA;AACH,CAAC;AAED,KAAK,UAAU,uBAAuB;IACpC,OAAO,MAAM,SAAS,CACpB;QACE,KAAK,EAAE,GAAG,CAAA;;;;;;OAMT;KACF,EACD;QACE,IAAI,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACvB,IAAI,IAAI,EAAE,CAAC;gBACT,oBAAoB,EAAE,CAAA;YACxB,CAAC;QACH,CAAC;KACF,CACF,CAAA;AACH,CAAC;AAED,KAAK,UAAU,yBAAyB;IACtC,OAAO,MAAM,SAAS,CACpB;QACE,KAAK,EAAE,GAAG,CAAA;;;;;;OAMT;KACF,EACD;QACE,IAAI,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE;YACvB,IAAI,IAAI,EAAE,CAAC;gBACT,oBAAoB,EAAE,CAAA;YACxB,CAAC;QACH,CAAC;KACF,CACF,CAAA;AACH,CAAC;AAED,IAAI,OAAO,GAAG,EAAE,CAAA;AAChB,IAAI,cAAc,GAAG;IACnB,aAAa,EAAE,IAAI,SAAS,CAAC,IAAI,CAAC;IAClC,wBAAwB,EAAE,IAAI,SAAS,CAAC,IAAI,CAAC;IAC7C,aAAa,EAAE,IAAI,SAAS,CAAC,IAAI,CAAC;IAClC,cAAc,EAAE,IAAI,SAAS,CAAC,IAAI,CAAC;CACpC,CAAA;AAED,MAAM,oBAAoB,GAAG,QAAQ,CAAC,KAAK,IAAI,EAAE;;IAC/C,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;QAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;KAST;KACF,CAAC,CAAA;IAEF,IAAI,QAAQ,CAAC,IAAI,EAAE,CAAC;QAClB,MAAM,EAAE,aAAa,EAAE,wBAAwB,EAAE,aAAa,EAAE,cAAc,EAAE,GAAG,QAAQ,CAAC,IAAI,CAAC,eAAe,CAAA;QAEhH,OAAO,CAAC,eAAe,CAAC,GAAG,aAAa,CAAA;QACxC,OAAO,CAAC,0BAA0B,CAAC,GAAG,wBAAwB,CAAA;QAC9D,OAAO,CAAC,eAAe,CAAC,GAAG,aAAa,CAAA;QACxC,OAAO,CAAC,gBAAgB,CAAC,GAAG,cAAc,CAAA;QAE1C,~~MAAA,~~cAAc,CAAC,eAAe,CAAC,~~0CAAE~~,MAAM,CAAC,aAAa,CAAC,CAAA;QACtD,~~MAAA,~~cAAc,CAAC,0BAA0B,CAAC,~~0CAAE~~,MAAM,CAAC,wBAAwB,CAAC,CAAA;QAC5E,~~MAAA,~~cAAc,CAAC,eAAe,CAAC,~~0CAAE~~,MAAM,CAAC,aAAa,CAAC,CAAA;QACtD,~~MAAA,~~cAAc,CAAC,gBAAgB,CAAC,~~0CAAE~~,MAAM,CAAC,cAAc,CAAC,CAAA;IAC1D,CAAC;AACH,CAAC,EAAE,IAAI,CAAC,CAAA;AAER,MAAM,~~UAAiB~~,uBAAuB,CAAC,IAAY~~;;;QACzD~~,wCAAwC;~~QACxC~~,~~MAAA,~~cAAc,CAAC,IAAI,CAAC,~~0CAAE~~,MAAM,EAAE,CAAA;~~QAE9B~~,4BAA4B;~~QAC5B~~,~~oBAAM~~,OAAO,CAAC,IAAI,CAAC,CAAA~~,CAAA~~;~~QAEnB~~,OAAO,IAAI,EAAE,CAAC;~~YACZ~~,cAAc,CAAC,IAAI,CAAC,CAAC,IAAI,EAAE,CAAA;~~YAE3B~~,IAAI,KAAK,GAAG,~~cAAM~~,cAAc,CAAC,IAAI,CAAC,CAAC,OAAO,CAAA~~,CAAA~~;~~YAC9C~~,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;~~gBACxB~~,kDAAkD;~~gBAClD~~,~~6BAAM~~;~~YACR~~,CAAC;~~YAED~~,~~oBAAM~~,KAAK,CAAA~~,CAAA~~;~~QACb~~,CAAC;~~IACH~~,CAAC;~~CAAA;~~AAED,MAAM,CAAC,KAAK,UAAU,6BAA6B;IACjD,MAAM,yBAAyB,EAAE,CAAA;IACjC,MAAM,uBAAuB,EAAE,CAAA;IAC/B,MAAM,yBAAyB,EAAE,CAAA;IAEjC,oBAAoB,EAAE,CAAA;AACxB,CAAC","sourcesContent":["import debounce from 'lodash-es/debounce'\nimport gql from 'graphql-tag'\nimport { client, subscribe } from '@operato/graphql'\nimport { AsyncLock } from '@operato/utils'\n\nasync function subscribeActivityInstance() {\n return await subscribe(\n {\n query: gql`\n subscription {\n activityInstance {\n name\n }\n }\n `\n },\n {\n next: async ({ data }) => {\n if (data) {\n fetchActivitySummary()\n }\n }\n }\n )\n}\n\nasync function subscribeActivityThread() {\n return await subscribe(\n {\n query: gql`\n subscription {\n activityThread {\n transaction\n }\n }\n `\n },\n {\n next: async ({ data }) => {\n if (data) {\n fetchActivitySummary()\n }\n }\n }\n )\n}\n\nasync function subscribeActivityApproval() {\n return await subscribe(\n {\n query: gql`\n subscription {\n activityApproval {\n judgment\n }\n }\n `\n },\n {\n next: async ({ data }) => {\n if (data) {\n fetchActivitySummary()\n }\n }\n }\n )\n}\n\nvar summary = {}\nvar generatorLocks = {\n numberOfToDos: new AsyncLock(true),\n numberOfApprovalPendings: new AsyncLock(true),\n numberOfPicks: new AsyncLock(true),\n numberOfDrafts: new AsyncLock(true)\n}\n\nconst fetchActivitySummary = debounce(async () => {\n const response = await client.query({\n query: gql`\n query {\n activitySummary {\n numberOfToDos\n numberOfApprovalPendings\n numberOfPicks\n numberOfDrafts\n }\n }\n `\n })\n\n if (response.data) {\n const { numberOfToDos, numberOfApprovalPendings, numberOfPicks, numberOfDrafts } = response.data.activitySummary\n\n summary['numberOfToDos'] = numberOfToDos\n summary['numberOfApprovalPendings'] = numberOfApprovalPendings\n summary['numberOfPicks'] = numberOfPicks\n summary['numberOfDrafts'] = numberOfDrafts\n\n generatorLocks['numberOfToDos']?.unlock(numberOfToDos)\n generatorLocks['numberOfApprovalPendings']?.unlock(numberOfApprovalPendings)\n generatorLocks['numberOfPicks']?.unlock(numberOfPicks)\n generatorLocks['numberOfDrafts']?.unlock(numberOfDrafts)\n }\n}, 1000)\n\nexport async function* generateActivitySummary(name: string) {\n /* 1. 앞에 사용되었던 generator가 종료될 기회를 준다. /\n generatorLocks[name]?.unlock()\n\n / 2. 마지막 값을 일단 yield 한다. /\n yield summary[name]\n\n while (true) {\n generatorLocks[name].lock()\n\n let badge = await generatorLocks[name].promise\n if (badge === undefined) {\n / 새로운 generator가 생성된 경우이면, 기존 generator는 종료한다. */\n return\n }\n\n yield badge\n }\n}\n\nexport async function startSubscribeActivitySummary() {\n await subscribeActivityInstance()\n await subscribeActivityThread()\n await subscribeActivityApproval()\n\n fetchActivitySummary()\n}\n"]}
1	+ {"version":3,"file":"activity-summary-generator.js","sourceRoot":"","sources":["../client/activity-summary-generator.ts"],"names":[],"mappings":"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","sourcesContent":["import debounce from 'lodash-es/debounce'\nimport gql from 'graphql-tag'\nimport { client, subscribe } from '@operato/graphql'\nimport { AsyncLock } from '@operato/utils'\n\nasync function subscribeActivityInstance() {\n return await subscribe(\n {\n query: gql`\n subscription {\n activityInstance {\n name\n }\n }\n `\n },\n {\n next: async ({ data }) => {\n if (data) {\n fetchActivitySummary()\n }\n }\n }\n )\n}\n\nasync function subscribeActivityThread() {\n return await subscribe(\n {\n query: gql`\n subscription {\n activityThread {\n transaction\n }\n }\n `\n },\n {\n next: async ({ data }) => {\n if (data) {\n fetchActivitySummary()\n }\n }\n }\n )\n}\n\nasync function subscribeActivityApproval() {\n return await subscribe(\n {\n query: gql`\n subscription {\n activityApproval {\n judgment\n }\n }\n `\n },\n {\n next: async ({ data }) => {\n if (data) {\n fetchActivitySummary()\n }\n }\n }\n )\n}\n\nvar summary = {}\nvar generatorLocks = {\n numberOfToDos: new AsyncLock(true),\n numberOfApprovalPendings: new AsyncLock(true),\n numberOfPicks: new AsyncLock(true),\n numberOfDrafts: new AsyncLock(true)\n}\n\nconst fetchActivitySummary = debounce(async () => {\n const response = await client.query({\n query: gql`\n query {\n activitySummary {\n numberOfToDos\n numberOfApprovalPendings\n numberOfPicks\n numberOfDrafts\n }\n }\n `\n })\n\n if (response.data) {\n const { numberOfToDos, numberOfApprovalPendings, numberOfPicks, numberOfDrafts } = response.data.activitySummary\n\n summary['numberOfToDos'] = numberOfToDos\n summary['numberOfApprovalPendings'] = numberOfApprovalPendings\n summary['numberOfPicks'] = numberOfPicks\n summary['numberOfDrafts'] = numberOfDrafts\n\n generatorLocks['numberOfToDos']?.unlock(numberOfToDos)\n generatorLocks['numberOfApprovalPendings']?.unlock(numberOfApprovalPendings)\n generatorLocks['numberOfPicks']?.unlock(numberOfPicks)\n generatorLocks['numberOfDrafts']?.unlock(numberOfDrafts)\n }\n}, 1000)\n\nexport async function* generateActivitySummary(name: string) {\n /* 1. 앞에 사용되었던 generator가 종료될 기회를 준다. /\n generatorLocks[name]?.unlock()\n\n / 2. 마지막 값을 일단 yield 한다. /\n yield summary[name]\n\n while (true) {\n generatorLocks[name].lock()\n\n let badge = await generatorLocks[name].promise\n if (badge === undefined) {\n / 새로운 generator가 생성된 경우이면, 기존 generator는 종료한다. */\n return\n }\n\n yield badge\n }\n}\n\nexport async function startSubscribeActivitySummary() {\n await subscribeActivityInstance()\n await subscribeActivityThread()\n await subscribeActivityApproval()\n\n fetchActivitySummary()\n}\n"]}

package/dist-client/components/activity-/bowner-view.js CHANGED Viewed

@@ -7,6 +7,30 @@ import { client } from '@operato/graphql';
 import { i18next, localize } from '@operato/i18n';
 import { ScrollbarStyles } from '@operato/styles';
 let ActivityOwnerView = class ActivityOwnerView extends localize(i18next)(LitElement) {
+    static { this.styles = [
+        ScrollbarStyles,
+        css `
+      :host {
+        display: flex;
+        flex-direction: column;
+        background-color: var(--md-sys-color-surface);
+      }
+      content {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding: var(--spacing-medium);
+        overflow: auto;
+      }
+      section {
+        display: flex;
+        flex-direction: column;
+      }
+    `
+    ]; }
     constructor() {
         super();
         this.activityInstance = {};
@@ -61,30 +85,6 @@ let ActivityOwnerView = class ActivityOwnerView extends localize(i18next)(LitEle
         this.activity = response.data.activity;
     }
 };
-ActivityOwnerView.styles = [
-    ScrollbarStyles,
-    css `
-      :host {
-        display: flex;
-        flex-direction: column;
-        background-color: var(--md-sys-color-surface);
-      }
-      content {
-        flex: 1;
-        display: flex;
-        flex-direction: column;
-        padding: var(--spacing-medium);
-        overflow: auto;
-      }
-      section {
-        display: flex;
-        flex-direction: column;
-      }
-    `
-];
 __decorate([
     property({ type: String }),
     __metadata("design:type", String)

package/dist-client/components/activity-/bowner-view.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"activity-\bowner-view.js","sourceRoot":"","sources":["../../client/components/activity-\bowner-view.ts"],"names":[],"mappings":";AAAA,OAAO,yCAAyC,CAAA;AAEhD,OAAO,GAAG,MAAM,aAAa,CAAA;AAC7B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,IACM,iBAAiB,GADvB,MACM,iBAAkB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;~~IA6B3D~~;QACE,KAAK,EAAE,CAAA;QAEP,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAA;IAC5B,CAAC;IAED,MAAM;QACJ,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,QAAQ,IAAI,EAAE,CAAA;QAE5D,OAAO,IAAI,CAAA;;;uBAGQ,IAAI;8BACG,WAAW;;;;qBAIpB,SAAS;;;KAGzB,CAAA;IACH,CAAC;IAED,YAAY;QACV,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;IACrC,CAAC;IAED,KAAK,CAAC,aAAa,CAAC,EAAE;QACpB,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;YAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;OAsBT;YACD,SAAS,EAAE;gBACT,EAAE;aACH;SACF,CAAC,CAAA;QAEF,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAA;IACxC,CAAC;;~~AAtFM,wBAAM,GAAG~~;~~IACd,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;KAoBF;CACF,AAvBY,CAuBZ;AAC2B;~~IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;qDAAoB;AACnB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;mDAAc;AACb;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;2DAAsB;AA3B7C,iBAAiB;IADtB,aAAa,CAAC,qBAAqB,CAAC;;GAC/B,iBAAiB,CAwFtB","sourcesContent":["import '@material/web/button/elevated-button.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { ScrollbarStyles } from '@operato/styles'\n\n@customElement('activity-owner-view')\nclass ActivityOwnerView extends localize(i18next)(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: var(--md-sys-color-surface);\n }\n\n content {\n flex: 1;\n display: flex;\n flex-direction: column;\n padding: var(--spacing-medium);\n overflow: auto;\n }\n\n section {\n display: flex;\n flex-direction: column;\n }\n `\n ]\n @property({ type: String }) activityId?: string\n @property({ type: Object }) activity: any\n @property({ type: Object }) activityInstance: any\n\n constructor() {\n super()\n\n this.activityInstance = {}\n }\n\n render() {\n const { name, description, thumbnail } = this.activity \|\| {}\n\n return html`\n <content>\n <section>\n <div>name: ${name}</div>\n <div>description: ${description}</div>\n </section>\n\n <section>\n <img src=${thumbnail} />\n </section>\n </content>\n `\n }\n\n firstUpdated() {\n this.fetchActivity(this.activityId)\n }\n\n async fetchActivity(id) {\n const response = await client.query({\n query: gql`\n query activity($id: String!) {\n activity(id: $id) {\n id\n name\n description\n state\n thumbnail\n model {\n name\n description\n active\n tag\n inout\n type\n unit\n options\n quantifier\n spec\n }\n }\n }\n `,\n variables: {\n id\n }\n })\n\n this.activity = response.data.activity\n }\n}\n"]}
1	+ {"version":3,"file":"activity-\bowner-view.js","sourceRoot":"","sources":["../../client/components/activity-\bowner-view.ts"],"names":[],"mappings":";AAAA,OAAO,yCAAyC,CAAA;AAEhD,OAAO,GAAG,MAAM,aAAa,CAAA;AAC7B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAEjD,IACM,iBAAiB,GADvB,MACM,iBAAkB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;aACpD,WAAM,GAAG;QACd,eAAe;QACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;KAoBF;KACF,AAvBY,CAuBZ;IAKD;QACE,KAAK,EAAE,CAAA;QAEP,IAAI,CAAC,gBAAgB,GAAG,EAAE,CAAA;IAC5B,CAAC;IAED,MAAM;QACJ,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,QAAQ,IAAI,EAAE,CAAA;QAE5D,OAAO,IAAI,CAAA;;;uBAGQ,IAAI;8BACG,WAAW;;;;qBAIpB,SAAS;;;KAGzB,CAAA;IACH,CAAC;IAED,YAAY;QACV,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,UAAU,CAAC,CAAA;IACrC,CAAC;IAED,KAAK,CAAC,aAAa,CAAC,EAAE;QACpB,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;YAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;OAsBT;YACD,SAAS,EAAE;gBACT,EAAE;aACH;SACF,CAAC,CAAA;QAEF,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAA;IACxC,CAAC;;AA9D2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;qDAAoB;AACnB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;mDAAc;AACb;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;2DAAsB;AA3B7C,iBAAiB;IADtB,aAAa,CAAC,qBAAqB,CAAC;;GAC/B,iBAAiB,CAwFtB","sourcesContent":["import '@material/web/button/elevated-button.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { ScrollbarStyles } from '@operato/styles'\n\n@customElement('activity-owner-view')\nclass ActivityOwnerView extends localize(i18next)(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: var(--md-sys-color-surface);\n }\n\n content {\n flex: 1;\n display: flex;\n flex-direction: column;\n padding: var(--spacing-medium);\n overflow: auto;\n }\n\n section {\n display: flex;\n flex-direction: column;\n }\n `\n ]\n @property({ type: String }) activityId?: string\n @property({ type: Object }) activity: any\n @property({ type: Object }) activityInstance: any\n\n constructor() {\n super()\n\n this.activityInstance = {}\n }\n\n render() {\n const { name, description, thumbnail } = this.activity \|\| {}\n\n return html`\n <content>\n <section>\n <div>name: ${name}</div>\n <div>description: ${description}</div>\n </section>\n\n <section>\n <img src=${thumbnail} />\n </section>\n </content>\n `\n }\n\n firstUpdated() {\n this.fetchActivity(this.activityId)\n }\n\n async fetchActivity(id) {\n const response = await client.query({\n query: gql`\n query activity($id: String!) {\n activity(id: $id) {\n id\n name\n description\n state\n thumbnail\n model {\n name\n description\n active\n tag\n inout\n type\n unit\n options\n quantifier\n spec\n }\n }\n }\n `,\n variables: {\n id\n }\n })\n\n this.activity = response.data.activity\n }\n}\n"]}

package/dist-client/components/activity-approval-ribon.js CHANGED Viewed

@@ -7,53 +7,8 @@ import { customElement, property } from 'lit/decorators.js';
 import { i18next, localize } from '@operato/i18n';
 import { toggleOverlay } from '@operato/layout';
 let ActivityApprovalRibon = class ActivityApprovalRibon extends localize(i18next)(LitElement) {
-    render() {
-        var _a;
-        const { activityInstance, state } = ((_a = this.activityApproval) === null || _a === void 0 ? void 0 : _a.activityThread) || {};
-        const { description, assignee, approvalLine, activity } = activityInstance || {};
-        const { startingType } = activity || {};
-        return html `
-      <div desc>
-        <md-icon
-          @click=${() => {
-            toggleOverlay('activity-info-overlay', {
-                template: html `<activity-approval-context-template
-                .activityApproval=${this.activityApproval}
-                state=${state}
-              ></activity-approval-context-template>`
-            });
-        }}
-          >description</md-icon
-        >
-        ${description}
-      </div>
-      ${startingType == 'issue' && assignee
-            ? html `
-            <div assignee>
-              ${i18next.t('field.assignee')}
-              <span>${assignee === null || assignee === void 0 ? void 0 : assignee.name}&nbsp;</span>
-            </div>
-          `
-            : html ``}
-      ${approvalLine
-            ? html `<approval-line-brief
-            .model=${approvalLine}
-            .current=${this.activityApproval.order}
-          ></approval-line-brief>`
-            : html ``}
-      <div state>${i18next.t('label.activity-state-' + state)}</div>
-    `;
-    }
-    updated(changes) {
-        if (changes.has('activityApproval') && this.activityApproval) {
-            const { state } = this.activityApproval.activityThread;
-            this.setAttribute('state', state);
-        }
-    }
-};
-ActivityApprovalRibon.styles = [
-    css `
+    static { this.styles = [
+        css `
       :host {
         display: flex;
         background-color: var(--worklist-status-color);
@@ -152,7 +107,51 @@ ActivityApprovalRibon.styles = [
         }
       }
     `
-];
+    ]; }
+    render() {
+        const { activityInstance, state } = this.activityApproval?.activityThread || {};
+        const { description, assignee, approvalLine, activity } = activityInstance || {};
+        const { startingType } = activity || {};
+        return html `
+      <div desc>
+        <md-icon
+          @click=${() => {
+            toggleOverlay('activity-info-overlay', {
+                template: html `<activity-approval-context-template
+                .activityApproval=${this.activityApproval}
+                state=${state}
+              ></activity-approval-context-template>`
+            });
+        }}
+          >description</md-icon
+        >
+        ${description}
+      </div>
+      ${startingType == 'issue' && assignee
+            ? html `
+            <div assignee>
+              ${i18next.t('field.assignee')}
+              <span>${assignee?.name}&nbsp;</span>
+            </div>
+          `
+            : html ``}
+      ${approvalLine
+            ? html `<approval-line-brief
+            .model=${approvalLine}
+            .current=${this.activityApproval.order}
+          ></approval-line-brief>`
+            : html ``}
+      <div state>${i18next.t('label.activity-state-' + state)}</div>
+    `;
+    }
+    updated(changes) {
+        if (changes.has('activityApproval') && this.activityApproval) {
+            const { state } = this.activityApproval.activityThread;
+            this.setAttribute('state', state);
+        }
+    }
+};
 __decorate([
     property({ type: Object }),
     __metadata("design:type", Object)

package/dist-client/components/activity-approval-ribon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"activity-approval-ribon.js","sourceRoot":"","sources":["../../client/components/activity-approval-ribon.ts"],"names":[],"mappings":";AAAA,OAAO,wDAAwD,CAAA;AAC/D,OAAO,2EAA2E,CAAA;AAClF,OAAO,oDAAoD,CAAA;AAE3D,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAGxC,IAAM,qBAAqB,GAA3B,MAAM,qBAAsB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;~~IAyGtE~~,MAAM;;QACJ,MAAM,EAAE,gBAAgB,EAAE,KAAK,EAAE,GAAG,~~CAAA,MAAA,~~IAAI,CAAC,gBAAgB,~~0CAAE~~,cAAc,~~KAAI~~,EAAE,CAAA;QAC/E,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,GAAG,gBAAgB,IAAI,EAAE,CAAA;QAChF,MAAM,EAAE,YAAY,EAAE,GAAG,QAAQ,IAAI,EAAE,CAAA;QAEvC,OAAO,IAAI,CAAA;;;mBAGI,GAAG,EAAE;YACZ,aAAa,CAAC,uBAAuB,EAAE;gBACrC,QAAQ,EAAE,IAAI,CAAA;oCACQ,IAAI,CAAC,gBAAgB;wBACjC,KAAK;qDACwB;aACxC,CAAC,CAAA;QACJ,CAAC;;;UAGD,WAAW;;QAEb,YAAY,IAAI,OAAO,IAAI,QAAQ;YACnC,CAAC,CAAC,IAAI,CAAA;;gBAEE,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC;sBACrB,QAAQ,~~aAAR~~,~~QAAQ,uBAAR,QAAQ,CAAE,~~IAAI;;WAEzB;YACH,CAAC,CAAC,IAAI,CAAA,EAAE;QACR,YAAY;YACZ,CAAC,CAAC,IAAI,CAAA;qBACO,YAAY;uBACV,IAAI,CAAC,gBAAgB,CAAC,KAAK;kCAChB;YAC1B,CAAC,CAAC,IAAI,CAAA,EAAE;;mBAEG,OAAO,CAAC,CAAC,CAAC,uBAAuB,GAAG,KAAK,CAAC;KACxD,CAAA;IACH,CAAC;IAED,OAAO,CAAC,OAAO;QACb,IAAI,OAAO,CAAC,GAAG,CAAC,kBAAkB,CAAC,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC7D,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,gBAAgB,CAAC,cAAc,CAAA;YAEtD,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,KAAK,CAAC,CAAA;QACnC,CAAC;IACH,CAAC;;~~AArJM,4BAAM,GAAG~~;~~IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAkGF;CACF,AApGY,CAoGZ;AAE2B;~~IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;+DAAsB;AAvGtC,qBAAqB;IADjC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,qBAAqB,CAuJjC","sourcesContent":["import '@operato/property-editor/ox-properties-dynamic-view.js'\nimport '@things-factory/organization/dist-client/component/approval-line-brief.js'\nimport '../templates/activity-approval-context-template.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { toggleOverlay } from '@operato/layout'\n\n@customElement('activity-approval-ribon')\nexport class ActivityApprovalRibon extends localize(i18next)(LitElement) {\n static styles = [\n css`\n :host {\n display: flex;\n background-color: var(--worklist-status-color);\n color: var(--md-sys-color-on-primary);\n align-items: center;\n min-height: 44px;\n --fontsize-small: 12px;\n }\n\n div {\n border-left: var(--border-dim-color);\n padding: var(--spacing-small) var(--spacing-medium);\n align-self: center;\n }\n\n :host([state='assigned']) {\n --worklist-status-color: #5f7184;\n }\n\n :host([state='started']) {\n --worklist-status-color: #56af45;\n }\n\n :host([state='delegated']) {\n --worklist-status-color: #8654b0;\n }\n\n :host([state='submitted']) {\n --worklist-status-color: #428df3;\n }\n\n :host([state='escalated']) {\n --worklist-status-color: #595de5;\n }\n\n :host([state='rejected']) {\n --worklist-status-color: #f27429;\n }\n\n :host([state='ended']) {\n --worklist-status-color: #02acae;\n }\n\n :host([state='aborted']) {\n --worklist-status-color: #cb3a33;\n }\n\n md-icon {\n font-size: 24px;\n }\n\n [desc] {\n flex: 2;\n font-size: var(--fontsize-small);\n }\n\n [desc] * {\n vertical-align: middle;\n }\n\n [assignee] {\n text-align: center;\n font-size: var(--fontsize-small);\n line-height: 1.3;\n }\n\n [assignee] span {\n display: block;\n font-size: var(--fontsize-large);\n font-weight: bold;\n }\n\n approval-line-brief {\n background-color: var(--worklist-status-color);\n font-size: var(--fontsize-small);\n }\n\n [state] {\n text-align: right;\n font-size: var(--fontsize-small);\n }\n\n @media only screen and (max-width: 460px) {\n div {\n border-left: none;\n }\n\n [assignee] {\n display: none;\n }\n md-icon {\n padding: 0;\n }\n approval-line-brief {\n display: none;\n }\n }\n `\n ]\n\n @property({ type: Object }) activityApproval: any\n\n render() {\n const { activityInstance, state } = this.activityApproval?.activityThread \|\| {}\n const { description, assignee, approvalLine, activity } = activityInstance \|\| {}\n const { startingType } = activity \|\| {}\n\n return html`\n <div desc>\n <md-icon\n @click=${() => {\n toggleOverlay('activity-info-overlay', {\n template: html`<activity-approval-context-template\n .activityApproval=${this.activityApproval}\n state=${state}\n ></activity-approval-context-template>`\n })\n }}\n >description</md-icon\n >\n ${description}\n </div>\n ${startingType == 'issue' && assignee\n ? html`\n <div assignee>\n ${i18next.t('field.assignee')}\n <span>${assignee?.name} </span>\n </div>\n `\n : html``}\n ${approvalLine\n ? html`<approval-line-brief\n .model=${approvalLine}\n .current=${this.activityApproval.order}\n ></approval-line-brief>`\n : html``}\n\n <div state>${i18next.t('label.activity-state-' + state)}</div>\n `\n }\n\n updated(changes) {\n if (changes.has('activityApproval') && this.activityApproval) {\n const { state } = this.activityApproval.activityThread\n\n this.setAttribute('state', state)\n }\n }\n}\n"]}
1	+ {"version":3,"file":"activity-approval-ribon.js","sourceRoot":"","sources":["../../client/components/activity-approval-ribon.ts"],"names":[],"mappings":";AAAA,OAAO,wDAAwD,CAAA;AAC/D,OAAO,2EAA2E,CAAA;AAClF,OAAO,oDAAoD,CAAA;AAE3D,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAGxC,IAAM,qBAAqB,GAA3B,MAAM,qBAAsB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;aAC/D,WAAM,GAAG;QACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAkGF;KACF,AApGY,CAoGZ;IAID,MAAM;QACJ,MAAM,EAAE,gBAAgB,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,gBAAgB,EAAE,cAAc,IAAI,EAAE,CAAA;QAC/E,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,GAAG,gBAAgB,IAAI,EAAE,CAAA;QAChF,MAAM,EAAE,YAAY,EAAE,GAAG,QAAQ,IAAI,EAAE,CAAA;QAEvC,OAAO,IAAI,CAAA;;;mBAGI,GAAG,EAAE;YACZ,aAAa,CAAC,uBAAuB,EAAE;gBACrC,QAAQ,EAAE,IAAI,CAAA;oCACQ,IAAI,CAAC,gBAAgB;wBACjC,KAAK;qDACwB;aACxC,CAAC,CAAA;QACJ,CAAC;;;UAGD,WAAW;;QAEb,YAAY,IAAI,OAAO,IAAI,QAAQ;YACnC,CAAC,CAAC,IAAI,CAAA;;gBAEE,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC;sBACrB,QAAQ,EAAE,IAAI;;WAEzB;YACH,CAAC,CAAC,IAAI,CAAA,EAAE;QACR,YAAY;YACZ,CAAC,CAAC,IAAI,CAAA;qBACO,YAAY;uBACV,IAAI,CAAC,gBAAgB,CAAC,KAAK;kCAChB;YAC1B,CAAC,CAAC,IAAI,CAAA,EAAE;;mBAEG,OAAO,CAAC,CAAC,CAAC,uBAAuB,GAAG,KAAK,CAAC;KACxD,CAAA;IACH,CAAC;IAED,OAAO,CAAC,OAAO;QACb,IAAI,OAAO,CAAC,GAAG,CAAC,kBAAkB,CAAC,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC7D,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,gBAAgB,CAAC,cAAc,CAAA;YAEtD,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,KAAK,CAAC,CAAA;QACnC,CAAC;IACH,CAAC;;AA/C2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;+DAAsB;AAvGtC,qBAAqB;IADjC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,qBAAqB,CAuJjC","sourcesContent":["import '@operato/property-editor/ox-properties-dynamic-view.js'\nimport '@things-factory/organization/dist-client/component/approval-line-brief.js'\nimport '../templates/activity-approval-context-template.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { toggleOverlay } from '@operato/layout'\n\n@customElement('activity-approval-ribon')\nexport class ActivityApprovalRibon extends localize(i18next)(LitElement) {\n static styles = [\n css`\n :host {\n display: flex;\n background-color: var(--worklist-status-color);\n color: var(--md-sys-color-on-primary);\n align-items: center;\n min-height: 44px;\n --fontsize-small: 12px;\n }\n\n div {\n border-left: var(--border-dim-color);\n padding: var(--spacing-small) var(--spacing-medium);\n align-self: center;\n }\n\n :host([state='assigned']) {\n --worklist-status-color: #5f7184;\n }\n\n :host([state='started']) {\n --worklist-status-color: #56af45;\n }\n\n :host([state='delegated']) {\n --worklist-status-color: #8654b0;\n }\n\n :host([state='submitted']) {\n --worklist-status-color: #428df3;\n }\n\n :host([state='escalated']) {\n --worklist-status-color: #595de5;\n }\n\n :host([state='rejected']) {\n --worklist-status-color: #f27429;\n }\n\n :host([state='ended']) {\n --worklist-status-color: #02acae;\n }\n\n :host([state='aborted']) {\n --worklist-status-color: #cb3a33;\n }\n\n md-icon {\n font-size: 24px;\n }\n\n [desc] {\n flex: 2;\n font-size: var(--fontsize-small);\n }\n\n [desc] * {\n vertical-align: middle;\n }\n\n [assignee] {\n text-align: center;\n font-size: var(--fontsize-small);\n line-height: 1.3;\n }\n\n [assignee] span {\n display: block;\n font-size: var(--fontsize-large);\n font-weight: bold;\n }\n\n approval-line-brief {\n background-color: var(--worklist-status-color);\n font-size: var(--fontsize-small);\n }\n\n [state] {\n text-align: right;\n font-size: var(--fontsize-small);\n }\n\n @media only screen and (max-width: 460px) {\n div {\n border-left: none;\n }\n\n [assignee] {\n display: none;\n }\n md-icon {\n padding: 0;\n }\n approval-line-brief {\n display: none;\n }\n }\n `\n ]\n\n @property({ type: Object }) activityApproval: any\n\n render() {\n const { activityInstance, state } = this.activityApproval?.activityThread \|\| {}\n const { description, assignee, approvalLine, activity } = activityInstance \|\| {}\n const { startingType } = activity \|\| {}\n\n return html`\n <div desc>\n <md-icon\n @click=${() => {\n toggleOverlay('activity-info-overlay', {\n template: html`<activity-approval-context-template\n .activityApproval=${this.activityApproval}\n state=${state}\n ></activity-approval-context-template>`\n })\n }}\n >description</md-icon\n >\n ${description}\n </div>\n ${startingType == 'issue' && assignee\n ? html`\n <div assignee>\n ${i18next.t('field.assignee')}\n <span>${assignee?.name} </span>\n </div>\n `\n : html``}\n ${approvalLine\n ? html`<approval-line-brief\n .model=${approvalLine}\n .current=${this.activityApproval.order}\n ></approval-line-brief>`\n : html``}\n\n <div state>${i18next.t('label.activity-state-' + state)}</div>\n `\n }\n\n updated(changes) {\n if (changes.has('activityApproval') && this.activityApproval) {\n const { state } = this.activityApproval.activityThread\n\n this.setAttribute('state', state)\n }\n }\n}\n"]}

package/dist-client/components/activity-instance-preview.js CHANGED Viewed

@@ -14,16 +14,47 @@ let ActivityInstancePreview = class ActivityInstancePreview extends localize(i18
         this.activityInstance = {};
         this.picked = false;
     }
+    static { this.styles = [
+        CommonHeaderStyles,
+        ScrollbarStyles,
+        css `
+      :host {
+        display: flex;
+        flex-direction: column;
+        background-color: var(--md-sys-color-surface);
+      }
+      content {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding: var(--spacing-medium);
+        overflow: auto;
+      }
+      section {
+        display: flex;
+        flex-direction: column;
+      }
+      #description {
+        height: 60px;
+      }
+    `
+    ]; }
     render() {
-        var _a;
         const { id, name, description, input, state, threadsMin = 0, threadsMax = 0, activity } = this.activityInstance || {};
         const { model, thumbnail } = activity || {};
         const inputSpec = (model || [])
             .filter(item => item.inout === 'in' || item.inout === 'inout')
             .map(item => {
-            return Object.assign(Object.assign({}, item), { label: item.name });
+            return {
+                ...item,
+                label: item.name
+            };
         });
-        const pickable = !this.picked && ((_a = this.activityThreads) === null || _a === void 0 ? void 0 : _a.length) < threadsMax;
+        const pickable = !this.picked && this.activityThreads?.length < threadsMax;
         return html `
       <content>
         <section>
@@ -134,35 +165,6 @@ let ActivityInstancePreview = class ActivityInstancePreview extends localize(i18
         }
     }
 };
-ActivityInstancePreview.styles = [
-    CommonHeaderStyles,
-    ScrollbarStyles,
-    css `
-      :host {
-        display: flex;
-        flex-direction: column;
-        background-color: var(--md-sys-color-surface);
-      }
-      content {
-        flex: 1;
-        display: flex;
-        flex-direction: column;
-        padding: var(--spacing-medium);
-        overflow: auto;
-      }
-      section {
-        display: flex;
-        flex-direction: column;
-      }
-      #description {
-        height: 60px;
-      }
-    `
-];
 __decorate([
     property({ type: String }),
     __metadata("design:type", String)

package/dist-client/components/activity-instance-preview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"activity-instance-preview.js","sourceRoot":"","sources":["../../client/components/activity-instance-preview.ts"],"names":[],"mappings":";AAAA,OAAO,yCAAyC,CAAA;AAChD,OAAO,wDAAwD,CAAA;AAE/D,OAAO,GAAG,MAAM,aAAa,CAAA;AAC7B,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAA;AACxC,OAAO,EAAE,kBAAkB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAGrE,IAAM,uBAAuB,GAA7B,MAAM,uBAAwB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAAnE;;QAgC8B,qBAAgB,GAAQ,EAAE,CAAA;QAG7C,WAAM,GAAY,KAAK,CAAA;IA4IlC,CAAC;~~IA1IC~~,MAAM;;QACJ,MAAM,EACJ,EAAE,EACF,IAAI,EACJ,WAAW,EACX,KAAK,EACL,KAAK,EACL,UAAU,GAAG,CAAC,EACd,UAAU,GAAG,CAAC,EACd,QAAQ,EACT,GAAG,IAAI,CAAC,gBAAgB,IAAI,EAAE,CAAA;QAC/B,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,QAAQ,IAAI,EAAE,CAAA;QAE3C,MAAM,SAAS,GAAG,CAAC,KAAK,IAAI,EAAE,CAAC;aAC5B,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,KAAK,IAAI,IAAI,IAAI,CAAC,KAAK,KAAK,OAAO,CAAC;aAC7D,GAAG,CAAC,IAAI,CAAC,EAAE;YACV,~~uCACK~~,IAAI,~~KACP,~~KAAK,EAAE,IAAI,CAAC,IAAI,~~IACjB~~;QACH,CAAC,CAAC,CAAA;QAEJ,MAAM,QAAQ,GAAG,CAAC,IAAI,CAAC,MAAM,IAAI,~~CAAA,MAAA,~~IAAI,CAAC,eAAe,~~0CAAE~~,MAAM,~~IAAG~~,UAAU,CAAA;QAE1E,OAAO,IAAI,CAAA;;;;wBAIS,IAAI;iBACX,WAAW;0BACF,UAAU,MAAM,UAAU;qBAC/B,SAAS;;;;UAIpB,CAAC,KAAK;YACN,CAAC,CAAC,IAAI,CAAA,EAAE;YACR,CAAC,CAAC,IAAI,CAAA;;yBAES,SAAS;yBACT,KAAK;mCACK,CAAC,CAAC,EAAE;gBACrB,IAAI,CAAC,gBAAgB,CAAC,KAAK,GAAG,CAAC,CAAC,aAAa,CAAC,KAAK,CAAA;gBACnD,OAAO,CAAC,GAAG,CAAC,mBAAmB,EAAE,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAA;YAC/D,CAAC;;aAEJ;;;;;yBAKY,CAAC,CAAC,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,4BAA4B,OAAO,CAAC,CAAC,CAAC,cAAc,CAAC;UACvF,QAAQ;YACR,CAAC,CAAC,IAAI,CAAA,kBAAkB,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC;uCAC/B,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC;sBACzC;YACZ,CAAC,CAAC,IAAI,CAAA,EAAE;;KAEb,CAAA;IACH,CAAC;IAED,OAAO,CAAC,OAAO;QACb,IAAI,OAAO,CAAC,GAAG,CAAC,oBAAoB,CAAC,EAAE,CAAC;YACtC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAA;QACxC,CAAC;IACH,CAAC;IAED,KAAK,CAAC,QAAQ,CAAC,EAAE;QACf,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;YAClC,KAAK,EAAE,GAAG,CAAA;;kCAEkB,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;4FA6BwD,EAAE;;;;;;;OAOvF;SACF,CAAC,CAAA;QAEF,IAAI,CAAC,gBAAgB,GAAG,QAAQ,CAAC,IAAI,CAAC,gBAAgB,CAAA;QACtD,IAAI,CAAC,eAAe,GAAG,QAAQ,CAAC,IAAI,CAAC,eAAe,CAAC,KAAK,CAAA;IAC5D,CAAC;IAED,KAAK,CAAC,oBAAoB;QACxB,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;YACnC,QAAQ,EAAE,GAAG,CAAA;;;;;;OAMZ;YACD,SAAS,EAAE;gBACT,EAAE,EAAE,IAAI,CAAC,kBAAkB;aAC5B;SACF,CAAC,CAAA;QAEF,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;YACrB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAA;YAClB,IAAI,CAAC,eAAe,GAAG,CAAC,QAAQ,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAA;YAC3D,MAAM,CAAC;gBACL,OAAO,EAAE,OAAO,CAAC,CAAC,CAAC,0BAA0B,EAAE;oBAC7C,CAAC,EAAE,GAAG,OAAO,CAAC,CAAC,CAAC,yBAAyB,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,WAAW,CAAC,EAAE;iBACvE,CAAC;aACH,CAAC,CAAA;QACJ,CAAC;IACH,CAAC;;~~AA7KM,8BAAM,GAAG~~;~~IACd,kBAAkB;IAClB,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;KAwBF;CACF,AA5BY,CA4BZ;AAE2B;~~IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;mEAA4B;AAC3B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;iEAA2B;AAC3B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;;gEAAqB;AAEtC;IAAR,KAAK,EAAE;;uDAAwB;AAnC5B,uBAAuB;IAD5B,aAAa,CAAC,2BAA2B,CAAC;GACrC,uBAAuB,CA+K5B","sourcesContent":["import '@material/web/button/elevated-button.js'\nimport '@operato/property-editor/ox-properties-dynamic-view.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { notify } from '@operato/layout'\nimport { CommonHeaderStyles, ScrollbarStyles } from '@operato/styles'\n\n@customElement('activity-instance-preview')\nclass ActivityInstancePreview extends localize(i18next)(LitElement) {\n static styles = [\n CommonHeaderStyles,\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: var(--md-sys-color-surface);\n }\n\n content {\n flex: 1;\n display: flex;\n flex-direction: column;\n padding: var(--spacing-medium);\n overflow: auto;\n }\n\n section {\n display: flex;\n flex-direction: column;\n }\n\n #description {\n height: 60px;\n }\n `\n ]\n\n @property({ type: String }) activityInstanceId?: string\n @property({ type: Object }) activityInstance: any = {}\n @property({ type: Array }) activityThreads: any\n\n @state() picked: boolean = false\n\n render() {\n const {\n id,\n name,\n description,\n input,\n state,\n threadsMin = 0,\n threadsMax = 0,\n activity\n } = this.activityInstance \|\| {}\n const { model, thumbnail } = activity \|\| {}\n\n const inputSpec = (model \|\| [])\n .filter(item => item.inout === 'in' \|\| item.inout === 'inout')\n .map(item => {\n return {\n ...item,\n label: item.name\n }\n })\n\n const pickable = !this.picked && this.activityThreads?.length < threadsMax\n\n return html`\n <content>\n <section>\n <h2>mission statement</h2>\n <div>title: ${name}</div>\n <div>${description}</div>\n <div>min-max: ${threadsMin} - ${threadsMax}</div>\n <img src=${thumbnail} />\n </section>\n\n <label>Input</label>\n ${!model\n ? html``\n : html`\n <ox-properties-dynamic-view\n .props=${inputSpec}\n .value=${input}\n @property-change=${e => {\n this.activityInstance.input = e.currentTarget.value\n console.log('activity-instance', this.activityInstance.input)\n }}\n ></ox-properties-dynamic-view>\n `}\n </content>\n\n <div class=\"footer\">\n <div filler></div>\n <button @click=${e => history.back()}><md-icon>close</md-icon>${i18next.t('button.close')}</button>\n ${pickable\n ? html`<button @click=${this.pickActivityInstance.bind(this)} done>\n <md-icon>done</md-icon>${i18next.t('button.pick')}\n </button>`\n : html``}\n </div>\n `\n }\n\n updated(changes) {\n if (changes.has('activityInstanceId')) {\n this.fetchAll(this.activityInstanceId)\n }\n }\n\n async fetchAll(id) {\n const response = await client.query({\n query: gql`\n {\n activityInstance(id: \"${id}\") {\n id\n name\n description\n input\n state\n threadsMin\n threadsMax\n activity {\n id\n name\n description\n state\n thumbnail\n model {\n name\n description\n active\n tag\n inout\n type\n unit\n options\n quantifier\n spec\n }\n }\n }\n\n activityThreads(filters: [{ name: \"activityInstanceId\", operator: \"eq\", value: \"${id}\"}]) {\n items {\n id\n }\n total\n }\n }\n `\n })\n\n this.activityInstance = response.data.activityInstance\n this.activityThreads = response.data.activityThreads.items\n }\n\n async pickActivityInstance() {\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!) {\n pickActivityInstance(id: $id) {\n id\n }\n }\n `,\n variables: {\n id: this.activityInstanceId\n }\n })\n\n if (!response.errors) {\n this.picked = true\n this.activityThreads = [response.data.pickActivityInstance]\n notify({\n message: i18next.t('text.info_x_successfully', {\n x: `${i18next.t('label.activity-instance')} ${i18next.t('text.pick')}`\n })\n })\n }\n }\n}\n"]}
1	+ {"version":3,"file":"activity-instance-preview.js","sourceRoot":"","sources":["../../client/components/activity-instance-preview.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/button/elevated-button.js'\nimport '@operato/property-editor/ox-properties-dynamic-view.js'\n\nimport gql from 'graphql-tag'\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { client } from '@operato/graphql'\nimport { i18next, localize } from '@operato/i18n'\nimport { notify } from '@operato/layout'\nimport { CommonHeaderStyles, ScrollbarStyles } from '@operato/styles'\n\n@customElement('activity-instance-preview')\nclass ActivityInstancePreview extends localize(i18next)(LitElement) {\n static styles = [\n CommonHeaderStyles,\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n\n background-color: var(--md-sys-color-surface);\n }\n\n content {\n flex: 1;\n display: flex;\n flex-direction: column;\n padding: var(--spacing-medium);\n overflow: auto;\n }\n\n section {\n display: flex;\n flex-direction: column;\n }\n\n #description {\n height: 60px;\n }\n `\n ]\n\n @property({ type: String }) activityInstanceId?: string\n @property({ type: Object }) activityInstance: any = {}\n @property({ type: Array }) activityThreads: any\n\n @state() picked: boolean = false\n\n render() {\n const {\n id,\n name,\n description,\n input,\n state,\n threadsMin = 0,\n threadsMax = 0,\n activity\n } = this.activityInstance \|\| {}\n const { model, thumbnail } = activity \|\| {}\n\n const inputSpec = (model \|\| [])\n .filter(item => item.inout === 'in' \|\| item.inout === 'inout')\n .map(item => {\n return {\n ...item,\n label: item.name\n }\n })\n\n const pickable = !this.picked && this.activityThreads?.length < threadsMax\n\n return html`\n <content>\n <section>\n <h2>mission statement</h2>\n <div>title: ${name}</div>\n <div>${description}</div>\n <div>min-max: ${threadsMin} - ${threadsMax}</div>\n <img src=${thumbnail} />\n </section>\n\n <label>Input</label>\n ${!model\n ? html``\n : html`\n <ox-properties-dynamic-view\n .props=${inputSpec}\n .value=${input}\n @property-change=${e => {\n this.activityInstance.input = e.currentTarget.value\n console.log('activity-instance', this.activityInstance.input)\n }}\n ></ox-properties-dynamic-view>\n `}\n </content>\n\n <div class=\"footer\">\n <div filler></div>\n <button @click=${e => history.back()}><md-icon>close</md-icon>${i18next.t('button.close')}</button>\n ${pickable\n ? html`<button @click=${this.pickActivityInstance.bind(this)} done>\n <md-icon>done</md-icon>${i18next.t('button.pick')}\n </button>`\n : html``}\n </div>\n `\n }\n\n updated(changes) {\n if (changes.has('activityInstanceId')) {\n this.fetchAll(this.activityInstanceId)\n }\n }\n\n async fetchAll(id) {\n const response = await client.query({\n query: gql`\n {\n activityInstance(id: \"${id}\") {\n id\n name\n description\n input\n state\n threadsMin\n threadsMax\n activity {\n id\n name\n description\n state\n thumbnail\n model {\n name\n description\n active\n tag\n inout\n type\n unit\n options\n quantifier\n spec\n }\n }\n }\n\n activityThreads(filters: [{ name: \"activityInstanceId\", operator: \"eq\", value: \"${id}\"}]) {\n items {\n id\n }\n total\n }\n }\n `\n })\n\n this.activityInstance = response.data.activityInstance\n this.activityThreads = response.data.activityThreads.items\n }\n\n async pickActivityInstance() {\n const response = await client.mutate({\n mutation: gql`\n mutation ($id: String!) {\n pickActivityInstance(id: $id) {\n id\n }\n }\n `,\n variables: {\n id: this.activityInstanceId\n }\n })\n\n if (!response.errors) {\n this.picked = true\n this.activityThreads = [response.data.pickActivityInstance]\n notify({\n message: i18next.t('text.info_x_successfully', {\n x: `${i18next.t('label.activity-instance')} ${i18next.t('text.pick')}`\n })\n })\n }\n }\n}\n"]}

package/dist-client/components/activity-instance-ribon.js CHANGED Viewed

@@ -12,46 +12,8 @@ let ActivityInstanceRibon = class ActivityInstanceRibon extends localize(i18next
         super(...arguments);
         this.activityInstance = {};
     }
-    render() {
-        const { description, state, assignee, approvalLine, activity } = this.activityInstance || {};
-        const { startingType } = activity || {};
-        return html `
-      <div desc>
-        <md-icon
-          @click=${() => {
-            toggleOverlay('activity-info-overlay', {
-                template: html `<activity-instance-context-template
-                .activityInstance=${this.activityInstance}
-                state=${state}
-              ></activity-instance-context-template>`
-            });
-        }}
-          >description</md-icon
-        >
-        ${description}
-      </div>
-      ${startingType == 'issue' && assignee
-            ? html `
-            <div assignee>
-              ${i18next.t('field.assignee')}
-              <span>${assignee === null || assignee === void 0 ? void 0 : assignee.name}&nbsp;</span>
-            </div>
-          `
-            : html ``}
-      ${approvalLine ? html `<approval-line-brief .model=${approvalLine}></approval-line-brief>` : html ``}
-      <div state>${i18next.t('label.activity-state-' + state)}</div>
-    `;
-    }
-    updated(changes) {
-        if (changes.has('activityInstance') && this.activityInstance) {
-            const { state } = this.activityInstance;
-            this.setAttribute('state', state);
-        }
-    }
-};
-ActivityInstanceRibon.styles = [
-    css `
+    static { this.styles = [
+        css `
       :host {
         display: flex;
         background-color: var(--worklist-status-color);
@@ -146,7 +108,45 @@ ActivityInstanceRibon.styles = [
         }
       }
     `
-];
+    ]; }
+    render() {
+        const { description, state, assignee, approvalLine, activity } = this.activityInstance || {};
+        const { startingType } = activity || {};
+        return html `
+      <div desc>
+        <md-icon
+          @click=${() => {
+            toggleOverlay('activity-info-overlay', {
+                template: html `<activity-instance-context-template
+                .activityInstance=${this.activityInstance}
+                state=${state}
+              ></activity-instance-context-template>`
+            });
+        }}
+          >description</md-icon
+        >
+        ${description}
+      </div>
+      ${startingType == 'issue' && assignee
+            ? html `
+            <div assignee>
+              ${i18next.t('field.assignee')}
+              <span>${assignee?.name}&nbsp;</span>
+            </div>
+          `
+            : html ``}
+      ${approvalLine ? html `<approval-line-brief .model=${approvalLine}></approval-line-brief>` : html ``}
+      <div state>${i18next.t('label.activity-state-' + state)}</div>
+    `;
+    }
+    updated(changes) {
+        if (changes.has('activityInstance') && this.activityInstance) {
+            const { state } = this.activityInstance;
+            this.setAttribute('state', state);
+        }
+    }
+};
 __decorate([
     property({ type: Object }),
     __metadata("design:type", Object)

package/dist-client/components/activity-instance-ribon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"activity-instance-ribon.js","sourceRoot":"","sources":["../../client/components/activity-instance-ribon.ts"],"names":[],"mappings":";AAAA,OAAO,yCAAyC,CAAA;AAChD,OAAO,wDAAwD,CAAA;AAC/D,OAAO,2EAA2E,CAAA;AAClF,OAAO,oDAAoD,CAAA;AAE3D,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAGxC,IAAM,qBAAqB,GAA3B,MAAM,qBAAsB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAAjE;;QAmGuB,qBAAgB,GAAQ,EAAE,CAAA;IA0CxD,CAAC;~~IAxCC~~,MAAM;QACJ,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,gBAAgB,IAAI,EAAE,CAAA;QAC5F,MAAM,EAAE,YAAY,EAAE,GAAG,QAAQ,IAAI,EAAE,CAAA;QAEvC,OAAO,IAAI,CAAA;;;mBAGI,GAAG,EAAE;YACZ,aAAa,CAAC,uBAAuB,EAAE;gBACrC,QAAQ,EAAE,IAAI,CAAA;oCACQ,IAAI,CAAC,gBAAgB;wBACjC,KAAK;qDACwB;aACxC,CAAC,CAAA;QACJ,CAAC;;;UAGD,WAAW;;QAEb,YAAY,IAAI,OAAO,IAAI,QAAQ;YACnC,CAAC,CAAC,IAAI,CAAA;;gBAEE,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC;sBACrB,QAAQ,~~aAAR~~,~~QAAQ,uBAAR,QAAQ,CAAE,~~IAAI;;WAEzB;YACH,CAAC,CAAC,IAAI,CAAA,EAAE;QACR,YAAY,CAAC,CAAC,CAAC,IAAI,CAAA,+BAA+B,YAAY,yBAAyB,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE;;mBAErF,OAAO,CAAC,CAAC,CAAC,uBAAuB,GAAG,KAAK,CAAC;KACxD,CAAA;IACH,CAAC;IAED,OAAO,CAAC,OAAO;QACb,IAAI,OAAO,CAAC,GAAG,CAAC,kBAAkB,CAAC,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC7D,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,gBAAgB,CAAA;YAEvC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,KAAK,CAAC,CAAA;QACnC,CAAC;IACH,CAAC;;~~AA3IM,4BAAM,GAAG~~;~~IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA8FF;CACF,AAhGY,CAgGZ;AAE2B;~~IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;+DAA2B;AAnG3C,qBAAqB;IADjC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,qBAAqB,CA6IjC","sourcesContent":["import '@material/web/button/elevated-button.js'\nimport '@operato/property-editor/ox-properties-dynamic-view.js'\nimport '@things-factory/organization/dist-client/component/approval-line-brief.js'\nimport '../templates/activity-instance-context-template.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { toggleOverlay } from '@operato/layout'\n\n@customElement('activity-instance-ribon')\nexport class ActivityInstanceRibon extends localize(i18next)(LitElement) {\n static styles = [\n css`\n :host {\n display: flex;\n background-color: var(--worklist-status-color);\n color: var(--md-sys-color-on-primary);\n align-items: center;\n min-height: 44px;\n --fontsize-small: 12px;\n }\n\n div {\n border-left: var(--border-dim-color);\n padding: var(--spacing-small) var(--spacing-medium);\n align-self: center;\n }\n\n :host([state='draft']) {\n --worklist-status-color: #5f7184;\n }\n\n :host([state='issued']) {\n --worklist-status-color: #56af45;\n }\n\n :host([state='assigned']) {\n --worklist-status-color: #428df3;\n }\n\n :host([state='started']) {\n --worklist-status-color: #595de5;\n }\n\n :host([state='pending']) {\n --worklist-status-color: #f27429;\n }\n\n :host([state='ended']) {\n --worklist-status-color: #02acae;\n }\n\n :host([state='aborted']) {\n --worklist-status-color: #cb3a33;\n }\n\n md-icon {\n font-size: 24px;\n }\n\n [desc] {\n flex: 2;\n font-size: var(--fontsize-small);\n }\n\n [desc] * {\n vertical-align: middle;\n }\n\n [assignee] {\n text-align: center;\n font-size: var(--fontsize-small);\n line-height: 1.3;\n }\n\n [assignee] span {\n display: block;\n font-size: var(--fontsize-large);\n font-weight: bold;\n }\n\n approval-line-brief {\n background-color: var(--worklist-status-color);\n font-size: var(--fontsize-small);\n }\n\n [state] {\n text-align: right;\n font-size: var(--fontsize-small);\n font-weight: bold;\n }\n\n @media only screen and (max-width: 460px) {\n div {\n border-left: none;\n }\n [assignee] {\n display: none;\n }\n md-icon {\n padding: 0;\n }\n approval-line-brief {\n display: none;\n }\n }\n `\n ]\n\n @property({ type: Object }) activityInstance: any = {}\n\n render() {\n const { description, state, assignee, approvalLine, activity } = this.activityInstance \|\| {}\n const { startingType } = activity \|\| {}\n\n return html`\n <div desc>\n <md-icon\n @click=${() => {\n toggleOverlay('activity-info-overlay', {\n template: html`<activity-instance-context-template\n .activityInstance=${this.activityInstance}\n state=${state}\n ></activity-instance-context-template>`\n })\n }}\n >description</md-icon\n >\n ${description}\n </div>\n ${startingType == 'issue' && assignee\n ? html`\n <div assignee>\n ${i18next.t('field.assignee')}\n <span>${assignee?.name} </span>\n </div>\n `\n : html``}\n ${approvalLine ? html`<approval-line-brief .model=${approvalLine}></approval-line-brief>` : html``}\n\n <div state>${i18next.t('label.activity-state-' + state)}</div>\n `\n }\n\n updated(changes) {\n if (changes.has('activityInstance') && this.activityInstance) {\n const { state } = this.activityInstance\n\n this.setAttribute('state', state)\n }\n }\n}\n"]}
1	+ {"version":3,"file":"activity-instance-ribon.js","sourceRoot":"","sources":["../../client/components/activity-instance-ribon.ts"],"names":[],"mappings":";AAAA,OAAO,yCAAyC,CAAA;AAChD,OAAO,wDAAwD,CAAA;AAC/D,OAAO,2EAA2E,CAAA;AAClF,OAAO,oDAAoD,CAAA;AAE3D,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAS,MAAM,mBAAmB,CAAA;AAElE,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAGxC,IAAM,qBAAqB,GAA3B,MAAM,qBAAsB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAAjE;;QAmGuB,qBAAgB,GAAQ,EAAE,CAAA;IA0CxD,CAAC;aA5IQ,WAAM,GAAG;QACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA8FF;KACF,AAhGY,CAgGZ;IAID,MAAM;QACJ,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,gBAAgB,IAAI,EAAE,CAAA;QAC5F,MAAM,EAAE,YAAY,EAAE,GAAG,QAAQ,IAAI,EAAE,CAAA;QAEvC,OAAO,IAAI,CAAA;;;mBAGI,GAAG,EAAE;YACZ,aAAa,CAAC,uBAAuB,EAAE;gBACrC,QAAQ,EAAE,IAAI,CAAA;oCACQ,IAAI,CAAC,gBAAgB;wBACjC,KAAK;qDACwB;aACxC,CAAC,CAAA;QACJ,CAAC;;;UAGD,WAAW;;QAEb,YAAY,IAAI,OAAO,IAAI,QAAQ;YACnC,CAAC,CAAC,IAAI,CAAA;;gBAEE,OAAO,CAAC,CAAC,CAAC,gBAAgB,CAAC;sBACrB,QAAQ,EAAE,IAAI;;WAEzB;YACH,CAAC,CAAC,IAAI,CAAA,EAAE;QACR,YAAY,CAAC,CAAC,CAAC,IAAI,CAAA,+BAA+B,YAAY,yBAAyB,CAAC,CAAC,CAAC,IAAI,CAAA,EAAE;;mBAErF,OAAO,CAAC,CAAC,CAAC,uBAAuB,GAAG,KAAK,CAAC;KACxD,CAAA;IACH,CAAC;IAED,OAAO,CAAC,OAAO;QACb,IAAI,OAAO,CAAC,GAAG,CAAC,kBAAkB,CAAC,IAAI,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC7D,MAAM,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,gBAAgB,CAAA;YAEvC,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,KAAK,CAAC,CAAA;QACnC,CAAC;IACH,CAAC;;AAzC2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;+DAA2B;AAnG3C,qBAAqB;IADjC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,qBAAqB,CA6IjC","sourcesContent":["import '@material/web/button/elevated-button.js'\nimport '@operato/property-editor/ox-properties-dynamic-view.js'\nimport '@things-factory/organization/dist-client/component/approval-line-brief.js'\nimport '../templates/activity-instance-context-template.js'\n\nimport { css, html, LitElement } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { toggleOverlay } from '@operato/layout'\n\n@customElement('activity-instance-ribon')\nexport class ActivityInstanceRibon extends localize(i18next)(LitElement) {\n static styles = [\n css`\n :host {\n display: flex;\n background-color: var(--worklist-status-color);\n color: var(--md-sys-color-on-primary);\n align-items: center;\n min-height: 44px;\n --fontsize-small: 12px;\n }\n\n div {\n border-left: var(--border-dim-color);\n padding: var(--spacing-small) var(--spacing-medium);\n align-self: center;\n }\n\n :host([state='draft']) {\n --worklist-status-color: #5f7184;\n }\n\n :host([state='issued']) {\n --worklist-status-color: #56af45;\n }\n\n :host([state='assigned']) {\n --worklist-status-color: #428df3;\n }\n\n :host([state='started']) {\n --worklist-status-color: #595de5;\n }\n\n :host([state='pending']) {\n --worklist-status-color: #f27429;\n }\n\n :host([state='ended']) {\n --worklist-status-color: #02acae;\n }\n\n :host([state='aborted']) {\n --worklist-status-color: #cb3a33;\n }\n\n md-icon {\n font-size: 24px;\n }\n\n [desc] {\n flex: 2;\n font-size: var(--fontsize-small);\n }\n\n [desc] * {\n vertical-align: middle;\n }\n\n [assignee] {\n text-align: center;\n font-size: var(--fontsize-small);\n line-height: 1.3;\n }\n\n [assignee] span {\n display: block;\n font-size: var(--fontsize-large);\n font-weight: bold;\n }\n\n approval-line-brief {\n background-color: var(--worklist-status-color);\n font-size: var(--fontsize-small);\n }\n\n [state] {\n text-align: right;\n font-size: var(--fontsize-small);\n font-weight: bold;\n }\n\n @media only screen and (max-width: 460px) {\n div {\n border-left: none;\n }\n [assignee] {\n display: none;\n }\n md-icon {\n padding: 0;\n }\n approval-line-brief {\n display: none;\n }\n }\n `\n ]\n\n @property({ type: Object }) activityInstance: any = {}\n\n render() {\n const { description, state, assignee, approvalLine, activity } = this.activityInstance \|\| {}\n const { startingType } = activity \|\| {}\n\n return html`\n <div desc>\n <md-icon\n @click=${() => {\n toggleOverlay('activity-info-overlay', {\n template: html`<activity-instance-context-template\n .activityInstance=${this.activityInstance}\n state=${state}\n ></activity-instance-context-template>`\n })\n }}\n >description</md-icon\n >\n ${description}\n </div>\n ${startingType == 'issue' && assignee\n ? html`\n <div assignee>\n ${i18next.t('field.assignee')}\n <span>${assignee?.name} </span>\n </div>\n `\n : html``}\n ${approvalLine ? html`<approval-line-brief .model=${approvalLine}></approval-line-brief>` : html``}\n\n <div state>${i18next.t('label.activity-state-' + state)}</div>\n `\n }\n\n updated(changes) {\n if (changes.has('activityInstance') && this.activityInstance) {\n const { state } = this.activityInstance\n\n this.setAttribute('state', state)\n }\n }\n}\n"]}