@kronos-integration/svelte-components 2.4.92 → 2.4.94

package/LICENSE

@@ -1,4 +1,4 @@
-Copyright (c) 2019-2022 by Kronos-Integration
+Copyright (c) 2019-2023 by Kronos-Integration
 All rights reserved.
 
 Redistribution and use in source and binary forms, with or without

package/README.md

@@ -1,7 +1,7 @@
 [![Svelte v3](https://img.shields.io/badge/svelte-v3-orange.svg)](https://svelte.dev)
 [![npm](https://img.shields.io/npm/v/@kronos-integration/svelte-components.svg)](https://www.npmjs.com/package/@kronos-integration/svelte-components)
 [![License](https://img.shields.io/badge/License-BSD%203--Clause-blue.svg)](https://opensource.org/licenses/BSD-3-Clause)
-[![minified size](https://badgen.net/bundlephobia/min/@kronos-integration/svelte-components)](https://bundlephobia.com/result?p=@kronos-integration/svelte-components)
+[![bundlejs](https://deno.bundlejs.com/?q=@kronos-integration/svelte-components\&badge=detailed)](https://bundlejs.com/?q=@kronos-integration/svelte-components)
 [![downloads](http://img.shields.io/npm/dm/@kronos-integration/svelte-components.svg?style=flat-square)](https://npmjs.org/package/@kronos-integration/svelte-components)
 [![GitHub Issues](https://img.shields.io/github/issues/Kronos-Integration/svelte-components.svg?style=flat-square)](https://github.com/Kronos-Integration/svelte-components/issues)
 [![Build Status](https://img.shields.io/endpoint.svg?url=https%3A%2F%2Factions-badge.atrox.dev%2FKronos-Integration%2Fsvelte-components%2Fbadge\&style=flat)](https://actions-badge.atrox.dev/Kronos-Integration/svelte-components/goto)
@@ -26,5 +26,5 @@
 
 ### Properties
 
-*   `type` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** 
-*   `state` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** 
+*   `type` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** 
+*   `state` **[string](https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String)** 

package/package.json

@@ -1,15 +1,20 @@
 {
   "name": "@kronos-integration/svelte-components",
-  "version": "2.4.92",
+  "version": "2.4.94",
   "publishConfig": {
     "access": "public"
   },
-  "svelte": "./src/index.svelte",
+  "exports": {
+    ".": {
+      "svelte": "./src/index.svelte"
+    }
+  },
   "description": "Svelte components for Kronos",
   "keywords": [
     "component",
     "kronos-integration",
     "svelte",
+    "vite",
     "web"
   ],
   "contributors": [
@@ -20,43 +25,103 @@
   ],
   "license": "BSD-2-Clause",
   "scripts": {
-    "start": "rollup -c tests/app/rollup.config.mjs -w",
+    "prepare": "vite build",
+    "start": "vite",
     "test": "npm run test:cafe",
-    "test:cafe": "testcafe $BROWSER:headless tests/cafe/*.js -s build/test --page-request-timeout 9000 --app-init-delay 3000 --app \"rollup -c tests/app/rollup.config.mjs -w\"",
+    "test:cafe": "testcafe $BROWSER:headless tests/cafe/*-cafe.mjs --esm -s build/test --page-request-timeout 5000 --app-init-delay 8000 --app vite",
     "docs": "documentation readme --section=API ./src/**/*.mjs",
     "lint": "npm run lint:docs",
-    "lint:docs": "documentation lint ./src/**/*.mjs"
+    "lint:docs": "documentation lint ./src/**/*.mjs",
+    "preview": "vite preview"
   },
   "dependencies": {
-    "@kronos-integration/endpoint": "^9.4.32",
-    "@kronos-integration/service": "^10.4.26",
-    "svelte-guard-history-router": "^4.6.23"
+    "@kronos-integration/endpoint": "^9.4.42",
+    "@kronos-integration/service": "^10.4.47",
+    "svelte-guard-history-router": "^5.5.40"
   },
   "devDependencies": {
-    "@rollup/plugin-node-resolve": "^13.3.0",
-    "@rollup/plugin-virtual": "^2.1.0",
-    "documentation": "^13.2.5",
-    "postcss": "^8.4.14",
-    "postcss-import": "^14.1.0",
-    "rollup": "^2.75.7",
-    "rollup-plugin-dev": "^2.0.0",
-    "rollup-plugin-postcss": "^4.0.2",
-    "rollup-plugin-svelte": "^7.1.0",
-    "semantic-release": "^19.0.3",
-    "svelte": "^3.48.0",
-    "testcafe": "^1.19.0"
+    "@semantic-release/commit-analyzer": "^10.0.1",
+    "@semantic-release/exec": "^6.0.3",
+    "@semantic-release/release-notes-generator": "^11.0.4",
+    "@sveltejs/vite-plugin-svelte": "^2.4.2",
+    "documentation": "^14.0.2",
+    "npm-pkgbuild": "^11.8.14",
+    "semantic-release": "^21.0.7",
+    "svelte": "^4.0.5",
+    "testcafe": "^3.0.1",
+    "vite": "^4.4.2"
+  },
+  "optionalDependencies": {
+    "mf-hosting-frontend": "^1.10.0"
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/Kronos-Integration/svelte-components.git"
+    "url": "https://github.com/Kronos-Integration/svelte-components"
   },
   "bugs": {
     "url": "https://github.com/Kronos-Integration/svelte-components/issues"
   },
   "homepage": "https://github.com/Kronos-Integration/svelte-components#readme",
+  "pkgbuild": {
+    "content": {
+      "${install.dir}": "build/"
+    },
+    "example": true,
+    "frontend": true,
+    "name": "kronos-svelte-components"
+  },
+  "release": {
+    "plugins": [
+      "@semantic-release/commit-analyzer",
+      "@semantic-release/release-notes-generator",
+      "@semantic-release/npm",
+      [
+        "@semantic-release/exec",
+        {
+          "publishCmd": "npx npm-pkgbuild --available --continue --publish dist"
+        }
+      ],
+      [
+        "@semantic-release/github",
+        {
+          "assets": [
+            {
+              "path": "dist/*.deb",
+              "label": "any Debian Package"
+            },
+            {
+              "path": "dist/*any.pkg.*",
+              "label": "any Arch Linux Package"
+            },
+            {
+              "path": "dist/*x86_64.pkg.*",
+              "label": "x86_64 Arch Linux Package"
+            },
+            {
+              "path": "dist/*aarch64.pkg.*",
+              "label": "arm64 Arch Linux Package"
+            },
+            {
+              "path": "dist/*noarch.rpm",
+              "label": "noarch RPM"
+            },
+            {
+              "path": "dist/*x86_64.rpm",
+              "label": "x86_64 RPM"
+            },
+            {
+              "path": "dist/*aarch64.rpm",
+              "label": "arm64 RPM"
+            }
+          ]
+        }
+      ]
+    ]
+  },
   "template": {
     "inheritFrom": [
       "arlac77/template-arlac77-github",
+      "arlac77/template-pacman",
       "arlac77/template-svelte-component"
     ]
   }

package/src/ServiceRoutes.svelte

@@ -7,13 +7,14 @@
 </script>
 
 <Route path="service" component={ServicesPage} objectInstance={Service}>
-  <Route path="/:service" propertyMapping={{ service: 'name' }}>
+  <Route path="/:service" propertyMapping={{ service: "name" }}>
     <Route path="/endpoint" objectInstance={Endpoint}>
-      <Route path="/:endpoint" propertyMapping={{ endpoint: 'name' }}>
+      <Route path="/:endpoint" propertyMapping={{ endpoint: "name" }}>
         <Route path="interceptor" objectInstance={Interceptor}>
           <Route
             path="/:interceptor"
-            propertyMapping={{ interceptor: 'type' }} />
+            propertyMapping={{ interceptor: "type" }}
+          />
         </Route>
       </Route>
     </Route>

package/src/components/Connection.svelte

@@ -1,5 +1,5 @@
 <script>
-  import  {connectionPath} from "../util.mjs";
+  import { connectionPath } from "../util.mjs";
   export let from;
   export let to;
 </script>
@@ -9,4 +9,5 @@
   class="connection"
   d={connectionPath(from, to)}
   marker-end="url(#arrow)"
-  marker-start="url(#dot)" />
+  marker-start="url(#dot)"
+/>

package/src/components/Endpoint.svelte

@@ -20,11 +20,11 @@
   id={endpoint.identifier}
   class="endpoint"
   on:click={click}
-  transform="translate({endpoint.x},{endpoint.y})">
-
+  transform="translate({endpoint.x},{endpoint.y})"
+>
   <text x="-6px" y="1px">{endpoint.name}</text>
-  <circle r="3"/>
-  
+  <circle r="3" />
+
   {#each endpoint.interceptors as interceptor, i}
     <Interceptor on:interceptorAction {interceptor} x={10 + 10 * i} y={0} />
   {/each}

package/src/components/Interceptor.svelte

@@ -15,9 +15,16 @@
     });
   }
 
-  const knownInterceptorTypes = new Set(["live-probe","ctx","ctx-jwt-verify","ctx-body-param" ]);
+  const knownInterceptorTypes = new Set([
+    "live-probe",
+    "ctx",
+    "ctx-jwt-verify",
+    "ctx-body-param"
+  ]);
 
-  const href = knownInterceptorTypes.has(interceptor.type) ? '#' + interceptor.type : "#interceptor"
+  const href = knownInterceptorTypes.has(interceptor.type)
+    ? "#" + interceptor.type
+    : "#interceptor";
 </script>
 
-<use {href} {x} {y} on:click={click}/>
+<use {href} {x} {y} on:click={click} />

package/src/components/Request.svelte

@@ -6,9 +6,7 @@
   const y = owner.y + request.endpoint.y;
 </script>
 
-<g
-  class="request"
-  transform="translate({x},{y})">
+<g class="request" transform="translate({x},{y})">
   <text y="-6">0</text>
   <rect x="-4" y="-4" width="8" height="8" />
-  </g>
+</g>

package/src/components/Service.svelte

@@ -51,7 +51,8 @@
   id={service.name}
   class="service"
   transform="translate({service.x},{service.y})"
-  on:click={click}>
+  on:click={click}
+>
   <rect width={service.w} height={service.h} rx="4" />
   <text x="8" y="14">{service.name}</text>
   {#each Object.values(service.endpoints) as endpoint}

package/src/components/ServiceCanvas.svelte

@@ -55,10 +55,12 @@
     <symbol id="live-probe" y="-78" viewbox="0 0 1200 1200">
       <path
         d="M2.25 10C2.25 5.71979 5.71979 2.25 10 2.25C14.2802 2.25 17.75 5.71979 17.75 10C17.75 14.2802 14.2802 17.75 10 17.75C5.71979 17.75 2.25 14.2802 2.25 10Z"
-        fill="black" />
+        fill="black"
+      />
       <path
         d="M16.8214 15.618C17.1645 15.2749 17.7044 15.2276 18.1019 15.5059L21.9536 18.2021C22.8451 18.8261 22.957 20.1037 22.1875 20.8731L21.8731 21.1875C21.1037 21.957 19.8261 21.8451 19.2021 20.9536L16.5059 17.1019C16.2276 16.7044 16.2749 16.1645 16.618 15.8214L16.8214 15.618Z"
-        fill="black" />
+        fill="black"
+      />
     </symbol>
     <symbol id="ctx" y="-3">
       <path d="M0 -3L6 6L0 6L6 -3z" />
@@ -68,7 +70,8 @@
         fill-rule="evenodd"
         clip-rule="evenodd"
         d="M7.25 8C7.25 5.37665 9.37665 3.25 12 3.25C14.6234 3.25 16.75 5.37665 16.75 8V9.3525C17.0611 9.40539 17.3506 9.48823 17.6271 9.62137C18.3925 9.98997 19.01 10.6075 19.3786 11.3729C19.5844 11.8002 19.67 12.2587 19.7106 12.7797C19.75 13.2859 19.75 13.91 19.75 14.6837V14.7457C19.75 15.7853 19.75 16.6092 19.6982 17.2743C19.6453 17.9543 19.5349 18.5309 19.2796 19.0609C18.8127 20.0305 18.0305 20.8127 17.0609 21.2796C16.5309 21.5349 15.9543 21.6453 15.2743 21.6982C14.6092 21.75 13.7853 21.75 12.7457 21.75H11.2543C10.2147 21.75 9.39078 21.75 8.72566 21.6982C8.04571 21.6453 7.46914 21.5349 6.93905 21.2796C5.96954 20.8127 5.18729 20.0305 4.7204 19.0609C4.46512 18.5309 4.35472 17.9543 4.30178 17.2743C4.24999 16.6092 4.25 15.7853 4.25 14.7457V14.6837C4.24999 13.91 4.24999 13.2859 4.2894 12.7797C4.32996 12.2587 4.41561 11.8002 4.62137 11.3729C4.98997 10.6075 5.60753 9.98997 6.37294 9.62137C6.64939 9.48823 6.93893 9.40539 7.25 9.3525V8ZM15.25 8V9.25331C14.9657 9.24999 14.6554 9.25 14.3163 9.25H9.68375C9.34468 9.25 9.03427 9.24999 8.75 9.25331V8C8.75 6.20507 10.2051 4.75 12 4.75C13.7949 4.75 15.25 6.20507 15.25 8ZM14 14C14 14.784 13.5489 15.4626 12.8921 15.7905L13.1913 17.5856C13.2814 18.1261 13.3264 18.3964 13.1766 18.5732C13.0268 18.75 12.7529 18.75 12.2049 18.75H11.7951C11.2471 18.75 10.9732 18.75 10.8234 18.5732C10.6736 18.3964 10.7186 18.1261 10.8087 17.5856L11.1079 15.7905C10.4511 15.4626 10 14.784 10 14C10 12.8954 10.8954 12 12 12C13.1046 12 14 12.8954 14 14Z"
-        fill="black" />
+        fill="black"
+      />
     </symbol>
     <symbol id="ctx-body-param" y="-3">
       <path d="M0 -3L6 6L0 6L6 -3z" />
@@ -81,7 +84,8 @@
       refY="3"
       markerWidth="6"
       markerHeight="6"
-      orient="auto-start-reverse">
+      orient="auto-start-reverse"
+    >
       <path d="M0 0L6 3L0 6z" />
     </marker>
     <marker
@@ -90,7 +94,8 @@
       refX="4"
       refY="4"
       markerWidth="4"
-      markerHeight="4">
+      markerHeight="4"
+    >
       <circle cx="4" cy="4" r="3" />
     </marker>
   </defs>
@@ -101,7 +106,8 @@
         {service}
         on:endpointAction={endpointAction}
         on:interceptorAction={interceptorAction}
-        on:serviceAction={serviceAction} />
+        on:serviceAction={serviceAction}
+      />
     {/each}
   </g>
 

package/src/dragging.mjs

@@ -1,4 +1,4 @@
-export function makeDraggable(el,cb) {
+export function makeDraggable(el, cb) {
   let svg = el;
   while (svg && svg.tagName != "svg") svg = svg.parentNode;
   const pt = svg.createSVGPoint(),
@@ -42,7 +42,7 @@ export function makeDraggable(el,cb) {
     root.removeEventListener("pointerup", finishMove, false);
     fireEvent("dragend");
 
-    cb(xlate.matrix.e,xlate.matrix.f);
+    cb(xlate.matrix.e, xlate.matrix.f);
   }
 
   function fireEvent(eventName) {

package/src/mock-interceptor.mjs

@@ -1,25 +1,26 @@
 import { Interceptor } from "@kronos-integration/interceptor";
 
 export class MockInterceptor extends Interceptor {
+
+  #type;
+  #config;
+
   constructor(config) {
     super(config);
     if (config == undefined || config == null) {
       config = {};
     }
-    this._config = config;
-    this._type = config.type;
-    //delete config.type;
-
-    //console.log(Object.keys(this._config));
+    this.#config = config;
+    this.#type = config.type;
 
-    this._ca = Object.fromEntries(Object.keys(this._config).map(k => [k, {}]));
+    this._ca = Object.fromEntries(Object.keys(this.#config).map(k => [k, {}]));
   }
 
   get type() {
-    return this._type;
+    return this.#type;
   }
 
   get configurationAttributes() {
     return this._ca || super.configurationAttributes;
   }
-}
+}

package/src/mock-logger.mjs

@@ -1,14 +1,16 @@
 import { ServiceLogger } from "@kronos-integration/service";
 
 export class MockLogger extends ServiceLogger {
+  #state;
+
   async logEntry(entry) {}
 
   async configure(config) {
     super.configure(config);
-    this._state = config.state;
+    this.#state = config.state;
   }
 
   get state() {
-    return this._state || super.state;
+    return this.#state || super.state;
   }
 }

package/src/mock-service.mjs

@@ -1,5 +1,4 @@
 import { Service } from "@kronos-integration/service";
-
 import { MockInterceptor } from "./mock-interceptor.mjs";
 
 /**
@@ -13,11 +12,11 @@ export class MockService extends Service {
   }
 
   get state() {
-    return this.config ? this.config.state : super.state;
+    return this.config?.state || super.state;
   }
 
   get type() {
-    return this.config ? this.config.type : super.type;
+    return this.config?.type || super.type;
   }
 
   instantiateInterceptor(def) {

package/src/service-provider.mjs

@@ -25,10 +25,13 @@ export class ServiceProvider extends ServiceProviderMixin(
   MockService,
   MockLogger
 ) {
+  subscriptions = new Set();
+  requests = [];
+  width = 500;
+  height = 500;
+
   constructor(serviceStore, requestsStore) {
     super({}, new NoneWaitingInitializationContext());
-    this.subscriptions = new Set();
-    this.requests = [];
 
     if (serviceStore) {
       this.serviceStore = serviceStore;
@@ -39,9 +42,6 @@ export class ServiceProvider extends ServiceProviderMixin(
       this.requestsStore = requestsStore;
       requestsStore.subscribe(request => this.addRequest(request));
     }
-
-    this.width = 500;
-    this.height = 500;
   }
 
   subscribe(cb) {
@@ -51,9 +51,7 @@ export class ServiceProvider extends ServiceProviderMixin(
   }
 
   fireSubscriptions() {
-    if (this.subscriptions) {
-      this.subscriptions.forEach(s => s(this));
-    }
+    this.subscriptions.forEach(s => s(this));
   }
 
   async initialize(json) {
@@ -105,7 +103,7 @@ export class ServiceProvider extends ServiceProviderMixin(
     for (const service of Object.values(this.services)) {
       for (const endpoint of Object.values(service.endpoints)) {
         for (const connection of endpoint.connections()) {
-          if(!connection.x || !connection.y || !endpoint.x || !endpoint.y) {
+          if (!connection.x || !connection.y || !endpoint.x || !endpoint.y) {
             //console.log(endpoint.identifier, "no valid connection", connection);
             continue;
           }

package/src/util.mjs

@@ -3,12 +3,12 @@ export const SERVICE = "_SERVICE";
 export const ENDPOINT = "_ENDPOINT";
 export const INTERCEPTOR = "_INTERCEPTOR";
 
-
 export function connectionPath(from, to) {
-    const fx = from.x + from.owner.x;
-    const fy = from.y + from.owner.y;
-    const tx = to.x + to.owner.x;
-    const ty = to.y + to.owner.y;
+  const fx = from.x + from.owner.x;
+  const fy = from.y + from.owner.y;
+  const tx = to.x + to.owner.x;
+  const ty = to.y + to.owner.y;
 
-    return `M${fx} ${fy}H${fx+from.rx}V${ty}H${tx + 2}`;
-  }
+  const rx = from.rx === undefined ? 16 : from.rx; //TODO why
+  return `M${fx} ${fy}H${fx + rx}V${ty}H${tx + 2}`;
+}