@fmsim/machine 0.0.49

package/dist/groups/mcs-path.js

@@ -0,0 +1,28 @@
+const icon = `
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+  <style type="text/css">
+    .st0{fill:none;stroke:{{strokeColor}};stroke-width:2;stroke-linecap:round;stroke-miterlimit:10;}
+    .st1{fill:{{strokeColor}}}
+    .st2{fill:none;stroke:{{strokeColor}};stroke-miterlimit:10;}
+  </style>
+  <path class="st0" d="M26.17,27.87H8.74c-2.36,0-4.29-1.93-4.29-4.29V12.16c0-2.36,1.93-4.29,4.29-4.29h17.43
+	c2.36,0,4.29,1.93,4.29,4.29v11.43C30.46,25.94,28.53,27.87,26.17,27.87z"/>
+  <path class="st0" d="M26.46,27.87h-18c-2.2,0-4-1.8-4-4v0c0-2.2,1.8-4,4-4h18c2.2,0,4,1.8,4,4v0
+    C30.46,26.07,28.66,27.87,26.46,27.87z"/>
+  <circle class="st1" cx="10.29" cy="24.06" r="1.5"/>
+  <circle class="st1" cx="17.64" cy="24.06" r="1.5"/>
+  <circle class="st1" cx="24.99" cy="24.06" r="1.5"/>
+  <line class="st2" x1="8.61" y1="7.87" x2="8.61" y2="19.87"/>
+  <line class="st2" x1="14.57" y1="7.87" x2="14.57" y2="19.87"/>
+  <line class="st2" x1="20.53" y1="7.87" x2="20.53" y2="19.87"/>
+  <line class="st2" x1="26.49" y1="7.87" x2="26.49" y2="19.87"/>
+</svg>
+`;
+export const mcsPath = {
+    name: 'mcsPath',
+    description: 'a group of various mcs-paths',
+    icon,
+    templates: []
+};
+//# sourceMappingURL=mcs-path.js.map

package/dist/groups/mcs-path.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mcs-path.js","sourceRoot":"","sources":["../../src/groups/mcs-path.ts"],"names":[],"mappings":"AAAA,MAAM,IAAI,GAAG;;;;;;;;;;;;;;;;;;;;CAoBZ,CAAA;AAED,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,IAAI,EAAE,SAAS;IACf,WAAW,EAAE,8BAA8B;IAC3C,IAAI;IACJ,SAAS,EAAE,EAAE;CACd,CAAA","sourcesContent":["const icon = `\n<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n\t viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n  <style type=\"text/css\">\n    .st0{fill:none;stroke:{{strokeColor}};stroke-width:2;stroke-linecap:round;stroke-miterlimit:10;}\n    .st1{fill:{{strokeColor}}}\n    .st2{fill:none;stroke:{{strokeColor}};stroke-miterlimit:10;}\n  </style>\n  <path class=\"st0\" d=\"M26.17,27.87H8.74c-2.36,0-4.29-1.93-4.29-4.29V12.16c0-2.36,1.93-4.29,4.29-4.29h17.43\n\tc2.36,0,4.29,1.93,4.29,4.29v11.43C30.46,25.94,28.53,27.87,26.17,27.87z\"/>\n  <path class=\"st0\" d=\"M26.46,27.87h-18c-2.2,0-4-1.8-4-4v0c0-2.2,1.8-4,4-4h18c2.2,0,4,1.8,4,4v0\n    C30.46,26.07,28.66,27.87,26.46,27.87z\"/>\n  <circle class=\"st1\" cx=\"10.29\" cy=\"24.06\" r=\"1.5\"/>\n  <circle class=\"st1\" cx=\"17.64\" cy=\"24.06\" r=\"1.5\"/>\n  <circle class=\"st1\" cx=\"24.99\" cy=\"24.06\" r=\"1.5\"/>\n  <line class=\"st2\" x1=\"8.61\" y1=\"7.87\" x2=\"8.61\" y2=\"19.87\"/>\n  <line class=\"st2\" x1=\"14.57\" y1=\"7.87\" x2=\"14.57\" y2=\"19.87\"/>\n  <line class=\"st2\" x1=\"20.53\" y1=\"7.87\" x2=\"20.53\" y2=\"19.87\"/>\n  <line class=\"st2\" x1=\"26.49\" y1=\"7.87\" x2=\"26.49\" y2=\"19.87\"/>\n</svg>\n`\n\nexport const mcsPath = {\n  name: 'mcsPath',\n  description: 'a group of various mcs-paths',\n  icon,\n  templates: []\n}\n"]}

package/dist/groups/mcs-scs.js

@@ -0,0 +1,26 @@
+const icon = `
+<svg version="1.1" id="Layer_2" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:{{strokeColor}};}
+</style>
+<path class="st0" d="M5.51,21.16c0.64,0.41,1.61,0.77,2.62,0.77c1.27,0,1.98-0.67,1.98-1.66c0-0.92-0.55-1.46-1.93-2.02
+	c-1.79-0.72-2.93-1.78-2.93-3.53c0-1.98,1.48-3.49,3.83-3.49c1.17,0,2.04,0.29,2.61,0.61l-0.48,1.78c-0.39-0.23-1.14-0.58-2.16-0.58
+	c-1.25,0-1.8,0.76-1.8,1.46c0,0.94,0.63,1.37,2.07,2c1.88,0.79,2.8,1.85,2.8,3.6c0,1.94-1.32,3.64-4.12,3.64
+	c-1.14,0-2.33-0.36-2.93-0.76L5.51,21.16z"/>
+<path class="st0" d="M21.67,23.22c-0.47,0.27-1.5,0.54-2.8,0.54c-3.44,0-5.53-2.41-5.53-6.1c0-4,2.48-6.41,5.79-6.41
+	c1.3,0,2.24,0.31,2.64,0.54l-0.43,1.76c-0.51-0.25-1.22-0.47-2.12-0.47c-2.2,0-3.8,1.55-3.8,4.47c0,2.66,1.4,4.38,3.78,4.38
+	c0.8,0,1.64-0.18,2.16-0.45L21.67,23.22z"/>
+<path class="st0" d="M23.32,21.16c0.64,0.41,1.61,0.77,2.62,0.77c1.27,0,1.98-0.67,1.98-1.66c0-0.92-0.55-1.46-1.93-2.02
+	c-1.79-0.72-2.93-1.78-2.93-3.53c0-1.98,1.48-3.49,3.83-3.49c1.17,0,2.04,0.29,2.61,0.61l-0.48,1.78c-0.39-0.23-1.14-0.58-2.16-0.58
+	c-1.25,0-1.8,0.76-1.8,1.46c0,0.94,0.63,1.37,2.07,2c1.88,0.79,2.8,1.85,2.8,3.6c0,1.94-1.32,3.64-4.12,3.64
+	c-1.14,0-2.33-0.36-2.93-0.76L23.32,21.16z"/>
+</svg>
+`;
+export const SCS = {
+    name: 'SCS',
+    description: 'The object groups composing the SCS system',
+    icon,
+    templates: []
+};
+//# sourceMappingURL=mcs-scs.js.map

package/dist/groups/mcs-scs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mcs-scs.js","sourceRoot":"","sources":["../../src/groups/mcs-scs.ts"],"names":[],"mappings":"AAAA,MAAM,IAAI,GAAG;;;;;;;;;;;;;;;;;;CAkBZ,CAAA;AAED,MAAM,CAAC,MAAM,GAAG,GAAG;IACjB,IAAI,EAAE,KAAK;IACX,WAAW,EAAE,4CAA4C;IACzD,IAAI;IACJ,SAAS,EAAE,EAAE;CACd,CAAA","sourcesContent":["const icon = `\n<svg version=\"1.1\" id=\"Layer_2\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n\t viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n<style type=\"text/css\">\n\t.st0{fill:{{strokeColor}};}\n</style>\n<path class=\"st0\" d=\"M5.51,21.16c0.64,0.41,1.61,0.77,2.62,0.77c1.27,0,1.98-0.67,1.98-1.66c0-0.92-0.55-1.46-1.93-2.02\n\tc-1.79-0.72-2.93-1.78-2.93-3.53c0-1.98,1.48-3.49,3.83-3.49c1.17,0,2.04,0.29,2.61,0.61l-0.48,1.78c-0.39-0.23-1.14-0.58-2.16-0.58\n\tc-1.25,0-1.8,0.76-1.8,1.46c0,0.94,0.63,1.37,2.07,2c1.88,0.79,2.8,1.85,2.8,3.6c0,1.94-1.32,3.64-4.12,3.64\n\tc-1.14,0-2.33-0.36-2.93-0.76L5.51,21.16z\"/>\n<path class=\"st0\" d=\"M21.67,23.22c-0.47,0.27-1.5,0.54-2.8,0.54c-3.44,0-5.53-2.41-5.53-6.1c0-4,2.48-6.41,5.79-6.41\n\tc1.3,0,2.24,0.31,2.64,0.54l-0.43,1.76c-0.51-0.25-1.22-0.47-2.12-0.47c-2.2,0-3.8,1.55-3.8,4.47c0,2.66,1.4,4.38,3.78,4.38\n\tc0.8,0,1.64-0.18,2.16-0.45L21.67,23.22z\"/>\n<path class=\"st0\" d=\"M23.32,21.16c0.64,0.41,1.61,0.77,2.62,0.77c1.27,0,1.98-0.67,1.98-1.66c0-0.92-0.55-1.46-1.93-2.02\n\tc-1.79-0.72-2.93-1.78-2.93-3.53c0-1.98,1.48-3.49,3.83-3.49c1.17,0,2.04,0.29,2.61,0.61l-0.48,1.78c-0.39-0.23-1.14-0.58-2.16-0.58\n\tc-1.25,0-1.8,0.76-1.8,1.46c0,0.94,0.63,1.37,2.07,2c1.88,0.79,2.8,1.85,2.8,3.6c0,1.94-1.32,3.64-4.12,3.64\n\tc-1.14,0-2.33-0.36-2.93-0.76L23.32,21.16z\"/>\n</svg>\n`\n\nexport const SCS = {\n  name: 'SCS',\n  description: 'The object groups composing the SCS system',\n  icon,\n  templates: []\n}\n"]}

package/dist/groups/mcs-shape.js

@@ -0,0 +1,26 @@
+const icon = `
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 35 35" style="enable-background:new 0 0 35 35;" xml:space="preserve">
+  <style type="text/css">
+    .st0{fill:{{strokeColor}}}
+  </style>
+  <path class="st0" d="M6.8,4.67L6.25,5.2L4.85,6.59L4.33,7.15l0.4,0.65l2.07,3.47l0.28,0.5h2.91l3.96,3.93
+	c-3.54,3.56-8.05,8.08-8.2,8.24C4.2,25.48,4.2,28.02,5.78,29.5c1.55,1.53,4.07,1.57,5.54,0c0.01-0.01,0.02-0.02,0.03-0.03l6.1-6.13
+	l6.13,6.16l0.09,0.06c1.56,1.47,4.03,1.49,5.48-0.06v-0.03h0.03c1.52-1.55,1.53-4.08-0.03-5.54l-0.03-0.03l-5.17-5.14
+	c3.48-0.33,6.2-3.26,6.25-6.81h0.03c0-0.02,0-0.04,0-0.06c0-0.01,0-0.02,0-0.03c0.1-1.15-0.15-2.24-0.74-3.19l-0.68-1.05l-4.61,4.61
+	l-1.39-1.46l4.71-4.71l-1.36-0.56c-0.8-0.34-1.72-0.59-2.76-0.59c-3.81,0-6.93,3.13-6.93,6.93c0,0.41,0.09,0.77,0.15,1.15
+	c-0.43,0.43-0.76,0.79-1.27,1.3l-3.93-3.93V7.43l-0.5-0.28L7.45,5.07L6.8,4.67z M23.4,6.9c0.14,0,0.24,0.08,0.37,0.09l-3.75,3.75
+	l0.68,0.71l2.79,2.88l0.68,0.71l3.93-3.93c0.02,0.23,0.18,0.39,0.15,0.65v0.09c0,2.73-2.23,4.95-4.95,4.95
+	c-0.36,0-0.8-0.09-1.3-0.19l-0.53-0.09l-0.37,0.37L9.93,28.11H9.9v0.03c-0.7,0.77-1.93,0.79-2.76-0.03v-0.03H7.11
+	c-0.77-0.7-0.79-1.93,0.03-2.76c0.38-0.38,7.65-7.71,11.21-11.27l0.4-0.4l-0.15-0.56c-0.08-0.32-0.15-0.87-0.15-1.24
+	C18.44,9.13,20.67,6.9,23.4,6.9z M7.11,7.15l2.32,1.42v0.99L9.22,9.78H8.23L6.8,7.46L7.11,7.15z M21.6,19.19l6.16,6.13v0.03h0.03
+	c0.77,0.7,0.79,1.93-0.03,2.76h-0.03v0.03c-0.7,0.77-1.93,0.79-2.76-0.03l-6.13-6.16L21.6,19.19z"/>
+</svg>
+`;
+export const mcsShape = {
+    name: 'mcsShape',
+    description: 'a group of various mcs-shapes',
+    icon,
+    templates: []
+};
+//# sourceMappingURL=mcs-shape.js.map

package/dist/groups/mcs-shape.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mcs-shape.js","sourceRoot":"","sources":["../../src/groups/mcs-shape.ts"],"names":[],"mappings":"AAAA,MAAM,IAAI,GAAG;;;;;;;;;;;;;;;;;;CAkBZ,CAAA;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,IAAI,EAAE,UAAU;IAChB,WAAW,EAAE,+BAA+B;IAC5C,IAAI;IACJ,SAAS,EAAE,EAAE;CACd,CAAA","sourcesContent":["const icon = `\n<svg version=\"1.1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\"\n\t viewBox=\"0 0 35 35\" style=\"enable-background:new 0 0 35 35;\" xml:space=\"preserve\">\n  <style type=\"text/css\">\n    .st0{fill:{{strokeColor}}}\n  </style>\n  <path class=\"st0\" d=\"M6.8,4.67L6.25,5.2L4.85,6.59L4.33,7.15l0.4,0.65l2.07,3.47l0.28,0.5h2.91l3.96,3.93\n\tc-3.54,3.56-8.05,8.08-8.2,8.24C4.2,25.48,4.2,28.02,5.78,29.5c1.55,1.53,4.07,1.57,5.54,0c0.01-0.01,0.02-0.02,0.03-0.03l6.1-6.13\n\tl6.13,6.16l0.09,0.06c1.56,1.47,4.03,1.49,5.48-0.06v-0.03h0.03c1.52-1.55,1.53-4.08-0.03-5.54l-0.03-0.03l-5.17-5.14\n\tc3.48-0.33,6.2-3.26,6.25-6.81h0.03c0-0.02,0-0.04,0-0.06c0-0.01,0-0.02,0-0.03c0.1-1.15-0.15-2.24-0.74-3.19l-0.68-1.05l-4.61,4.61\n\tl-1.39-1.46l4.71-4.71l-1.36-0.56c-0.8-0.34-1.72-0.59-2.76-0.59c-3.81,0-6.93,3.13-6.93,6.93c0,0.41,0.09,0.77,0.15,1.15\n\tc-0.43,0.43-0.76,0.79-1.27,1.3l-3.93-3.93V7.43l-0.5-0.28L7.45,5.07L6.8,4.67z M23.4,6.9c0.14,0,0.24,0.08,0.37,0.09l-3.75,3.75\n\tl0.68,0.71l2.79,2.88l0.68,0.71l3.93-3.93c0.02,0.23,0.18,0.39,0.15,0.65v0.09c0,2.73-2.23,4.95-4.95,4.95\n\tc-0.36,0-0.8-0.09-1.3-0.19l-0.53-0.09l-0.37,0.37L9.93,28.11H9.9v0.03c-0.7,0.77-1.93,0.79-2.76-0.03v-0.03H7.11\n\tc-0.77-0.7-0.79-1.93,0.03-2.76c0.38-0.38,7.65-7.71,11.21-11.27l0.4-0.4l-0.15-0.56c-0.08-0.32-0.15-0.87-0.15-1.24\n\tC18.44,9.13,20.67,6.9,23.4,6.9z M7.11,7.15l2.32,1.42v0.99L9.22,9.78H8.23L6.8,7.46L7.11,7.15z M21.6,19.19l6.16,6.13v0.03h0.03\n\tc0.77,0.7,0.79,1.93-0.03,2.76h-0.03v0.03c-0.7,0.77-1.93,0.79-2.76-0.03l-6.13-6.16L21.6,19.19z\"/>\n</svg>\n`\n\nexport const mcsShape = {\n  name: 'mcsShape',\n  description: 'a group of various mcs-shapes',\n  icon,\n  templates: []\n}\n"]}

package/dist/index.js

@@ -0,0 +1,25 @@
+export { default as MachineGroups } from './groups';
+export { default as DataSubscription } from './data-subscription';
+export { default as MCSMachine } from './mcs-machine';
+export { default as MCSUnit } from './mcs-unit';
+export { default as MCSCarrierHolder } from './mcs-carrier-holder';
+export { default as MCSVehicle } from './mcs-vehicle';
+export { default as MCSTransport } from './mcs-transport';
+// export { default as MCSGauge } from './mcs-gauge-capacity-circle'
+export { default as StockerCapacityBar } from './stocker-capacity-bar';
+export { default as ZoneCapacityBar } from './zone-capacity-bar';
+export { default as AGVLine } from './agv-line';
+export { default as Buffer } from './buffer';
+export { default as Conveyor } from './conveyor';
+export { default as ConveyorJoin } from './conveyor-join';
+export { default as Equipment } from './equipment';
+export { default as OHTLine } from './oht-line';
+export { default as Stocker } from './stocker';
+export { default as AGV } from './agv';
+export { default as OHT } from './oht';
+// export { default as RTV } from './rtv'
+export { default as Shuttle } from './shuttle';
+export { default as Port } from './port';
+export { default as Crane } from './crane';
+export { default as Shelf } from './shelf';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,UAAU,CAAA;AAEnD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,qBAAqB,CAAA;AAEjE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,YAAY,CAAA;AAC/C,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAClE,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,eAAe,CAAA;AACrD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,iBAAiB,CAAA;AACzD,oEAAoE;AACpE,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,wBAAwB,CAAA;AACtE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,qBAAqB,CAAA;AAEhE,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,YAAY,CAAA;AAC/C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAA;AAC5C,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAA;AAChD,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,iBAAiB,CAAA;AACzD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAA;AAClD,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,YAAY,CAAA;AAC/C,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAA;AAE9C,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EAAE,OAAO,IAAI,GAAG,EAAE,MAAM,OAAO,CAAA;AACtC,yCAAyC;AACzC,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAA;AAE9C,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAA;AACxC,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAA;AAC1C,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAA","sourcesContent":["export { default as MachineGroups } from './groups'\n\nexport { default as DataSubscription } from './data-subscription'\n\nexport { default as MCSMachine } from './mcs-machine'\nexport { default as MCSUnit } from './mcs-unit'\nexport { default as MCSCarrierHolder } from './mcs-carrier-holder'\nexport { default as MCSVehicle } from './mcs-vehicle'\nexport { default as MCSTransport } from './mcs-transport'\n// export { default as MCSGauge } from './mcs-gauge-capacity-circle'\nexport { default as StockerCapacityBar } from './stocker-capacity-bar'\nexport { default as ZoneCapacityBar } from './zone-capacity-bar'\n\nexport { default as AGVLine } from './agv-line'\nexport { default as Buffer } from './buffer'\nexport { default as Conveyor } from './conveyor'\nexport { default as ConveyorJoin } from './conveyor-join'\nexport { default as Equipment } from './equipment'\nexport { default as OHTLine } from './oht-line'\nexport { default as Stocker } from './stocker'\n\nexport { default as AGV } from './agv'\nexport { default as OHT } from './oht'\n// export { default as RTV } from './rtv'\nexport { default as Shuttle } from './shuttle'\n\nexport { default as Port } from './port'\nexport { default as Crane } from './crane'\nexport { default as Shelf } from './shelf'\n"]}

package/dist/mcs-carrier-holder.js

@@ -0,0 +1,107 @@
+import { LEGEND_CARRIER } from './features/mcs-status-default';
+import { MCSStatusMixin } from './features/mcs-status-mixin';
+import MCSUnit from './mcs-unit';
+import { themesColorMap } from './features/client-api';
+export class Carrier extends MCSStatusMixin(Object) {
+    constructor(host) {
+        super();
+        this.type = [];
+        this.host = host;
+    }
+    set data(data) {
+        const { CARRIERID, CARRIERTYPE = '', EMPTYTYPE } = data || {};
+        this.id = CARRIERID;
+        this.type = CARRIERTYPE.split(';');
+        this.emptyType = EMPTYTYPE;
+    }
+    get status() {
+        return this.emptyType;
+    }
+    get legend() {
+        var _a;
+        const { carrierLegendName } = this.host.state;
+        if (carrierLegendName) {
+            return (_a = this.host.root) === null || _a === void 0 ? void 0 : _a.style[carrierLegendName];
+        }
+        return LEGEND_CARRIER;
+    }
+    calculateShrunkRectangle(originalRect) {
+        const shrunkRect = Object.assign({}, originalRect);
+        shrunkRect.left += originalRect.width * 0.15;
+        shrunkRect.width *= 0.7;
+        shrunkRect.top += originalRect.height * 0.15;
+        shrunkRect.height *= 0.7;
+        return shrunkRect;
+    }
+    render(ctx) {
+        if (!this.id || !this.type) {
+            return;
+        }
+        const { left, top, width, height } = this.calculateShrunkRectangle(this.host.bounds);
+        const radius = Math.round(Math.min(width, height) * 0.2);
+        // 시작점 설정
+        ctx.beginPath();
+        ctx.moveTo(left + radius, top);
+        // 상단 가로선 그리기
+        ctx.lineTo(left + width - radius, top);
+        ctx.arcTo(left + width, top, left + width, top + radius, radius);
+        // 우측 세로선 그리기
+        ctx.lineTo(left + width, top + height - radius);
+        ctx.arcTo(left + width, top + height, left + width - radius, top + height, radius);
+        // 하단 가로선 그리기
+        ctx.lineTo(left + radius, top + height);
+        ctx.arcTo(left, top + height, left, top + height - radius, radius);
+        // 좌측 세로선 그리기
+        ctx.lineTo(left, top + radius);
+        ctx.arcTo(left, top, left + radius, top, radius);
+        // 경로 닫기 및 그리기
+        ctx.closePath();
+        ctx.stroke();
+        ctx.lineWidth = radius > 10 ? 2 : 1;
+        ctx.fillStyle = this.statusColor || 'transparent';
+        ctx.strokeStyle = this.auxColor || 'transparent';
+        ctx.fill();
+        ctx.stroke();
+        ctx.beginPath();
+        // 숫자 그리기
+        const count = 2; // this.type?.length
+        if (count > 1) {
+            const { x: cx, y: cy } = this.host.center;
+            ctx.fillStyle = 'red';
+            ctx.font = `bold ${Math.round(radius * 4)}px Arial`;
+            ctx.textAlign = 'center';
+            ctx.textBaseline = 'middle';
+            ctx.fillText(String(count), cx, cy);
+        }
+    }
+}
+export default class MCSCarrierHolder extends MCSUnit {
+    constructor() {
+        super(...arguments);
+        this.carrier = new Carrier(this);
+    }
+    static get properties() {
+        return [
+            ...MCSUnit.properties,
+            {
+                type: 'select',
+                label: 'carrier-legend-name',
+                name: 'carrierLegendName',
+                property: {
+                    options: themesColorMap
+                }
+            }
+        ];
+    }
+    ready() {
+        this.carrier.data = this.data;
+    }
+    postrender(ctx) {
+        this.carrier.render(ctx);
+    }
+    onchangeData(after, before) {
+        this.carrier.data = this.data;
+        super.onchangeData(after, before);
+    }
+}
+//# sourceMappingURL=mcs-carrier-holder.js.map

package/dist/mcs-carrier-holder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mcs-carrier-holder.js","sourceRoot":"","sources":["../src/mcs-carrier-holder.ts"],"names":[],"mappings":"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","sourcesContent":["import { BOUNDS, Component } from '@hatiolab/things-scene'\nimport { LEGEND_CARRIER, Legend } from './features/mcs-status-default'\nimport { MCSStatusMixin } from './features/mcs-status-mixin'\nimport MCSUnit from './mcs-unit'\nimport { themesColorMap } from './features/client-api'\n\nexport class Carrier extends MCSStatusMixin(Object) {\n  host: Component\n\n  id?: string\n  type: ('ALL' | 'BOBIN' | 'MAGAZINE' | 'PALLET' | 'REEL_TRAY' | 'PLATE')[] = []\n  emptyType?: 'Full' | 'Empty' | 'EmptyEmpty'\n\n  constructor(host: Component) {\n    super()\n    this.host = host\n  }\n\n  set data(data: any) {\n    const { CARRIERID, CARRIERTYPE = '', EMPTYTYPE } = data || {}\n\n    this.id = CARRIERID\n    this.type = CARRIERTYPE.split(';')\n    this.emptyType = EMPTYTYPE\n  }\n\n  get status() {\n    return this.emptyType\n  }\n\n  get legend(): Legend {\n    const { carrierLegendName } = this.host.state\n\n    if (carrierLegendName) {\n      return (this.host.root as any)?.style[carrierLegendName]\n    }\n\n    return LEGEND_CARRIER\n  }\n\n  calculateShrunkRectangle(originalRect: BOUNDS): BOUNDS {\n    const shrunkRect: BOUNDS = { ...originalRect }\n\n    shrunkRect.left += originalRect.width * 0.15\n    shrunkRect.width *= 0.7\n\n    shrunkRect.top += originalRect.height * 0.15\n    shrunkRect.height *= 0.7\n\n    return shrunkRect\n  }\n\n  render(ctx: CanvasRenderingContext2D) {\n    if (!this.id || !this.type) {\n      return\n    }\n\n    const { left, top, width, height } = this.calculateShrunkRectangle(this.host.bounds)\n\n    const radius = Math.round(Math.min(width, height) * 0.2)\n\n    // 시작점 설정\n    ctx.beginPath()\n    ctx.moveTo(left + radius, top)\n\n    // 상단 가로선 그리기\n    ctx.lineTo(left + width - radius, top)\n    ctx.arcTo(left + width, top, left + width, top + radius, radius)\n\n    // 우측 세로선 그리기\n    ctx.lineTo(left + width, top + height - radius)\n    ctx.arcTo(left + width, top + height, left + width - radius, top + height, radius)\n\n    // 하단 가로선 그리기\n    ctx.lineTo(left + radius, top + height)\n    ctx.arcTo(left, top + height, left, top + height - radius, radius)\n\n    // 좌측 세로선 그리기\n    ctx.lineTo(left, top + radius)\n    ctx.arcTo(left, top, left + radius, top, radius)\n\n    // 경로 닫기 및 그리기\n    ctx.closePath()\n    ctx.stroke()\n\n    ctx.lineWidth = radius > 10 ? 2 : 1\n    ctx.fillStyle = this.statusColor || 'transparent'\n    ctx.strokeStyle = this.auxColor || 'transparent'\n\n    ctx.fill()\n    ctx.stroke()\n\n    ctx.beginPath()\n\n    // 숫자 그리기\n    const count = 2 // this.type?.length\n\n    if (count > 1) {\n      const { x: cx, y: cy } = this.host.center\n\n      ctx.fillStyle = 'red'\n      ctx.font = `bold ${Math.round(radius * 4)}px Arial`\n      ctx.textAlign = 'center'\n      ctx.textBaseline = 'middle'\n\n      ctx.fillText(String(count), cx, cy)\n    }\n  }\n}\n\nexport default class MCSCarrierHolder extends MCSUnit {\n  static get properties(): any {\n    return [\n      ...MCSUnit.properties,\n      {\n        type: 'select',\n        label: 'carrier-legend-name',\n        name: 'carrierLegendName',\n        property: {\n          options: themesColorMap\n        }\n      }\n    ]\n  }\n\n  carrier: Carrier = new Carrier(this)\n\n  ready() {\n    this.carrier.data = this.data\n  }\n\n  postrender(ctx: CanvasRenderingContext2D) {\n    this.carrier.render(ctx)\n  }\n\n  onchangeData(after: any, before: any) {\n    this.carrier.data = this.data\n\n    super.onchangeData(after, before)\n  }\n}\n"]}

package/dist/mcs-gauge-capacity-bar.js

@@ -0,0 +1,170 @@
+import { Component, RectPath, Shape } from '@hatiolab/things-scene';
+import { MCSStatusMixin } from './features/mcs-status-mixin';
+import { LEGEND_CAPACITY } from './features/mcs-status-default';
+import { safeRound } from './utils/safe-round';
+import { getVaueOnRanges } from './utils/get-value-on-ranges';
+const NATURE = {
+    mutable: false,
+    resizable: true,
+    rotatable: true,
+    properties: [
+        {
+            type: 'number',
+            name: 'currentUsage',
+            label: 'current-usage'
+        },
+        {
+            type: 'number',
+            name: 'highWatermark',
+            label: 'high-watermark'
+        },
+        {
+            type: 'number',
+            name: 'maxCapacity',
+            label: 'max-capacity'
+        },
+        {
+            type: 'number',
+            label: 'round',
+            name: 'round',
+            property: {
+                min: 0
+            }
+        },
+        {
+            type: 'hidden',
+            name: 'usage',
+            label: 'usage'
+        }
+    ],
+    'value-property': 'usage'
+};
+var controlHandler = {
+    ondragmove: function (point, index, component) {
+        var { left, top, width, height } = component.model;
+        var transcoorded = component.transcoordP2S(point.x, point.y);
+        var round = ((transcoorded.x - left) / (width / 2)) * 100;
+        round = safeRound(round, width, height);
+        component.set({
+            round
+        });
+    }
+};
+export default class MCSGaugeCapacityBar extends MCSStatusMixin(RectPath(Shape)) {
+    static get nature() {
+        return NATURE;
+    }
+    get controls() {
+        var { left, top, width, round, height } = this.state;
+        round = round == undefined ? 0 : safeRound(round, width, height);
+        return [
+            {
+                x: left + (width / 2) * (round / 100),
+                y: top,
+                handler: controlHandler
+            }
+        ];
+    }
+    getTheme() {
+        var _a, _b;
+        const { legendName } = this.state;
+        if (legendName) {
+            return (_b = (_a = this.root) === null || _a === void 0 ? void 0 : _a.style) === null || _b === void 0 ? void 0 : _b[legendName];
+        }
+    }
+    get legend() {
+        return this.getTheme() || this.getLegendFallback();
+    }
+    getLegendFallback() {
+        return LEGEND_CAPACITY;
+    }
+    get statusColor() {
+        return getVaueOnRanges(this.usage, this.legend);
+    }
+    get text() {
+        return this.usage + '%';
+    }
+    render(context) {
+        const { left, top, width, height } = this.bounds;
+        if (width >= height) {
+            this.renderLandscape(context);
+        }
+        else {
+            this.renderPortrait(context);
+        }
+    }
+    renderLandscape(context) {
+        const { left, top, width, height } = this.bounds;
+        const { lineWidth, strokeStyle, round, fillStyle = '#aaa' } = this.state;
+        context.strokeStyle = strokeStyle;
+        context.lineWidth = lineWidth;
+        context.save();
+        context.translate(left, top);
+        // gauge background
+        context.beginPath();
+        context.fillStyle = fillStyle;
+        context.roundRect(0, 0, width, height, round);
+        context.fill();
+        context.stroke();
+        context.clip();
+        // gauge foreground
+        context.beginPath();
+        context.fillStyle = this.statusColor;
+        context.rect(0, 0, (width / 100) * this.usage, height);
+        context.fill();
+        context.beginPath();
+        context.strokeStyle = strokeStyle;
+        context.roundRect(0, 0, width, height, round);
+        context.stroke();
+        context.beginPath();
+        context.translate(-left, -top);
+        context.restore();
+    }
+    renderPortrait(context) {
+        const { left, top, width, height } = this.bounds;
+        const { lineWidth, strokeStyle, round, fillStyle } = this.state;
+        context.strokeStyle = strokeStyle;
+        context.lineWidth = lineWidth;
+        context.save();
+        context.translate(left, top);
+        // gauge background
+        context.beginPath();
+        context.fillStyle = fillStyle;
+        context.roundRect(0, 0, width, height, round);
+        context.fill();
+        context.stroke();
+        context.clip();
+        // gauge foreground
+        context.beginPath();
+        context.fillStyle = this.statusColor;
+        context.rect(0, height - (height / 100) * this.usage, width, (height / 100) * this.usage);
+        context.fill();
+        context.beginPath();
+        context.roundRect(0, 0, width, height, round);
+        context.stroke();
+        context.beginPath();
+        context.translate(-left, -top);
+        context.restore();
+    }
+    get usage() {
+        const { currentUsage = 0, maxCapacity = 100 } = this.state;
+        return Math.round((currentUsage / maxCapacity) * 100);
+    }
+    set usage(usage) {
+        // intentionally have done nothing
+    }
+    onchangeData(after, before) {
+        const { CURRENTCAPACITY = 0, MAXCAPACITY = 100, HIGHWATERMARK = 100 } = typeof this.data == 'object' ? this.data : {};
+        const currentUsage = Number(CURRENTCAPACITY) || 0;
+        const maxCapacity = Number(MAXCAPACITY) || 100;
+        const highWatermark = Number(HIGHWATERMARK) || 100;
+        this.setState({
+            currentUsage,
+            maxCapacity,
+            highWatermark,
+            usage: Math.round((currentUsage / maxCapacity) * 100)
+        });
+    }
+}
+Component.register('MCSGaugeCapacityBar', MCSGaugeCapacityBar);
+//# sourceMappingURL=mcs-gauge-capacity-bar.js.map

package/dist/mcs-gauge-capacity-bar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mcs-gauge-capacity-bar.js","sourceRoot":"","sources":["../src/mcs-gauge-capacity-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentNature, POSITION, Properties, RectPath, Shape } from '@hatiolab/things-scene'\nimport { MCSStatusMixin } from './features/mcs-status-mixin'\nimport { LEGEND_CAPACITY, Legend } from './features/mcs-status-default'\nimport { safeRound } from './utils/safe-round'\nimport { getVaueOnRanges } from './utils/get-value-on-ranges'\n\nconst NATURE: ComponentNature = {\n  mutable: false,\n  resizable: true,\n  rotatable: true,\n  properties: [\n    {\n      type: 'number',\n      name: 'currentUsage',\n      label: 'current-usage'\n    },\n    {\n      type: 'number',\n      name: 'highWatermark',\n      label: 'high-watermark'\n    },\n    {\n      type: 'number',\n      name: 'maxCapacity',\n      label: 'max-capacity'\n    },\n    {\n      type: 'number',\n      label: 'round',\n      name: 'round',\n      property: {\n        min: 0\n      }\n    },\n    {\n      type: 'hidden',\n      name: 'usage',\n      label: 'usage'\n    }\n  ],\n  'value-property': 'usage'\n}\n\nvar controlHandler = {\n  ondragmove: function (point: POSITION, index: number, component: Component) {\n    var { left, top, width, height } = component.model\n\n    var transcoorded = component.transcoordP2S(point.x, point.y)\n    var round = ((transcoorded.x - left) / (width / 2)) * 100\n\n    round = safeRound(round, width, height)\n\n    component.set({\n      round\n    })\n  }\n}\n\nexport default class MCSGaugeCapacityBar extends MCSStatusMixin(RectPath(Shape)) {\n  static get nature() {\n    return NATURE\n  }\n\n  get controls() {\n    var { left, top, width, round, height } = this.state\n    round = round == undefined ? 0 : safeRound(round, width, height)\n\n    return [\n      {\n        x: left + (width / 2) * (round / 100),\n        y: top,\n        handler: controlHandler\n      }\n    ]\n  }\n\n  getTheme() {\n    const { legendName } = this.state\n\n    if (legendName) {\n      return (this.root as any)?.style?.[legendName]\n    }\n  }\n\n  get legend(): Legend {\n    return this.getTheme() || this.getLegendFallback()\n  }\n\n  getLegendFallback() {\n    return LEGEND_CAPACITY\n  }\n\n  get statusColor() {\n    return getVaueOnRanges(this.usage, this.legend)\n  }\n\n  get text() {\n    return this.usage + '%'\n  }\n\n  render(context: CanvasRenderingContext2D) {\n    const { left, top, width, height } = this.bounds\n\n    if (width >= height) {\n      this.renderLandscape(context)\n    } else {\n      this.renderPortrait(context)\n    }\n  }\n\n  renderLandscape(context: CanvasRenderingContext2D) {\n    const { left, top, width, height } = this.bounds\n    const { lineWidth, strokeStyle, round, fillStyle = '#aaa' } = this.state\n\n    context.strokeStyle = strokeStyle\n    context.lineWidth = lineWidth\n\n    context.save()\n    context.translate(left, top)\n\n    // gauge background\n    context.beginPath()\n\n    context.fillStyle = fillStyle\n    context.roundRect(0, 0, width, height, round)\n\n    context.fill()\n    context.stroke()\n\n    context.clip()\n\n    // gauge foreground\n    context.beginPath()\n\n    context.fillStyle = this.statusColor!\n\n    context.rect(0, 0, (width / 100) * this.usage, height)\n    context.fill()\n\n    context.beginPath()\n    context.strokeStyle = strokeStyle\n    context.roundRect(0, 0, width, height, round)\n    context.stroke()\n\n    context.beginPath()\n\n    context.translate(-left, -top)\n    context.restore()\n  }\n\n  renderPortrait(context: CanvasRenderingContext2D) {\n    const { left, top, width, height } = this.bounds\n    const { lineWidth, strokeStyle, round, fillStyle } = this.state\n\n    context.strokeStyle = strokeStyle\n    context.lineWidth = lineWidth\n\n    context.save()\n    context.translate(left, top)\n\n    // gauge background\n    context.beginPath()\n\n    context.fillStyle = fillStyle\n    context.roundRect(0, 0, width, height, round)\n\n    context.fill()\n    context.stroke()\n\n    context.clip()\n\n    // gauge foreground\n    context.beginPath()\n\n    context.fillStyle = this.statusColor!\n\n    context.rect(0, height - (height / 100) * this.usage, width, (height / 100) * this.usage)\n    context.fill()\n\n    context.beginPath()\n    context.roundRect(0, 0, width, height, round)\n    context.stroke()\n\n    context.beginPath()\n\n    context.translate(-left, -top)\n    context.restore()\n  }\n\n  get usage() {\n    const { currentUsage = 0, maxCapacity = 100 } = this.state\n    return Math.round((currentUsage / maxCapacity) * 100)\n  }\n\n  set usage(usage: number) {\n    // intentionally have done nothing\n  }\n\n  onchangeData(after: Properties, before: Properties): void {\n    const {\n      CURRENTCAPACITY = 0,\n      MAXCAPACITY = 100,\n      HIGHWATERMARK = 100\n    } = typeof this.data == 'object' ? this.data : {}\n\n    const currentUsage = Number(CURRENTCAPACITY) || 0\n    const maxCapacity = Number(MAXCAPACITY) || 100\n    const highWatermark = Number(HIGHWATERMARK) || 100\n\n    this.setState({\n      currentUsage,\n      maxCapacity,\n      highWatermark,\n      usage: Math.round((currentUsage / maxCapacity) * 100)\n    })\n  }\n}\n\nComponent.register('MCSGaugeCapacityBar', MCSGaugeCapacityBar)\n"]}

package/dist/mcs-gauge-capacity-circle.js

@@ -0,0 +1,91 @@
+import { Component, Ellipse } from '@hatiolab/things-scene';
+import { getVaueOnRanges } from './utils/get-value-on-ranges';
+import { MCSStatusMixin } from './features/mcs-status-mixin';
+import { LEGEND_CAPACITY } from './features/mcs-status-default';
+const NATURE = {
+    mutable: false,
+    resizable: true,
+    rotatable: true,
+    properties: [
+        {
+            type: 'number',
+            name: 'currentUsage',
+            label: 'current-usage'
+        },
+        {
+            type: 'number',
+            name: 'highWatermark',
+            label: 'high-watermark'
+        },
+        {
+            type: 'number',
+            name: 'maxCapacity',
+            label: 'max-capacity'
+        },
+        {
+            type: 'hidden',
+            name: 'usage',
+            label: 'usage'
+        }
+    ],
+    'value-property': 'usage'
+};
+export default class MCSGaugeCapacityCircle extends MCSStatusMixin(Ellipse) {
+    static get nature() {
+        return NATURE;
+    }
+    getTheme() {
+        var _a, _b;
+        const { legendName } = this.state;
+        if (legendName) {
+            return (_b = (_a = this.root) === null || _a === void 0 ? void 0 : _a.style) === null || _b === void 0 ? void 0 : _b[legendName];
+        }
+    }
+    get legend() {
+        return this.getTheme() || this.getLegendFallback();
+    }
+    getLegendFallback() {
+        return LEGEND_CAPACITY;
+    }
+    get statusColor() {
+        return getVaueOnRanges(this.usage, this.legend);
+    }
+    render(context) {
+        var { cx, cy, rx, ry } = this.state;
+        const radius = Math.min(rx, ry);
+        context.beginPath();
+        context.arc(cx, cy, radius, 0, Math.PI * 2);
+        context.fillStyle = 'gray';
+        context.fill();
+        this.drawStroke(context);
+        const startAngle = Math.PI * -0.5;
+        const endAngle = startAngle + Math.PI * 2 * (this.value / 100);
+        context.beginPath();
+        context.moveTo(cx, cy);
+        context.arc(cx, cy, radius, startAngle, endAngle);
+        context.lineTo(cx, cy);
+        context.fillStyle = this.statusColor;
+        context.fill();
+    }
+    get usage() {
+        const { currentUsage = 0, maxCapacity = 100 } = this.state;
+        return Math.round((currentUsage / maxCapacity) * 100);
+    }
+    set usage(usage) {
+        // intentionally have done nothing
+    }
+    onchangeData(after, before) {
+        const { CURRENTCAPACITY = 0, MAXCAPACITY = 100, HIGHWATERMARK = 100 } = typeof this.data == 'object' ? this.data : {};
+        const currentUsage = Number(CURRENTCAPACITY) || 0;
+        const maxCapacity = Number(MAXCAPACITY) || 100;
+        const highWatermark = Number(HIGHWATERMARK) || 100;
+        this.setState({
+            currentUsage,
+            maxCapacity,
+            highWatermark,
+            usage: Math.round((currentUsage / maxCapacity) * 100)
+        });
+    }
+}
+Component.register('MCSGaugeCapacityCircle', MCSGaugeCapacityCircle);
+//# sourceMappingURL=mcs-gauge-capacity-circle.js.map

package/dist/mcs-gauge-capacity-circle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mcs-gauge-capacity-circle.js","sourceRoot":"","sources":["../src/mcs-gauge-capacity-circle.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentNature, Ellipse, Properties } from '@hatiolab/things-scene'\nimport { getVaueOnRanges } from './utils/get-value-on-ranges'\nimport { MCSStatusMixin } from './features/mcs-status-mixin'\nimport { LEGEND_CAPACITY, Legend } from './features/mcs-status-default'\n\nconst NATURE: ComponentNature = {\n  mutable: false,\n  resizable: true,\n  rotatable: true,\n  properties: [\n    {\n      type: 'number',\n      name: 'currentUsage',\n      label: 'current-usage'\n    },\n    {\n      type: 'number',\n      name: 'highWatermark',\n      label: 'high-watermark'\n    },\n    {\n      type: 'number',\n      name: 'maxCapacity',\n      label: 'max-capacity'\n    },\n    {\n      type: 'hidden',\n      name: 'usage',\n      label: 'usage'\n    }\n  ],\n  'value-property': 'usage'\n}\n\nexport default class MCSGaugeCapacityCircle extends MCSStatusMixin(Ellipse) {\n  static get nature() {\n    return NATURE\n  }\n\n  getTheme() {\n    const { legendName } = this.state\n\n    if (legendName) {\n      return (this.root as any)?.style?.[legendName]\n    }\n  }\n\n  get legend(): Legend {\n    return this.getTheme() || this.getLegendFallback()\n  }\n\n  getLegendFallback() {\n    return LEGEND_CAPACITY\n  }\n\n  get statusColor() {\n    return getVaueOnRanges(this.usage, this.legend)\n  }\n\n  render(context: CanvasRenderingContext2D) {\n    var { cx, cy, rx, ry } = this.state\n    const radius = Math.min(rx, ry)\n\n    context.beginPath()\n\n    context.arc(cx, cy, radius, 0, Math.PI * 2)\n    context.fillStyle = 'gray'\n    context.fill()\n    this.drawStroke(context)\n\n    const startAngle = Math.PI * -0.5\n    const endAngle = startAngle + Math.PI * 2 * (this.value / 100)\n\n    context.beginPath()\n\n    context.moveTo(cx, cy)\n    context.arc(cx, cy, radius, startAngle, endAngle)\n    context.lineTo(cx, cy)\n    context.fillStyle = this.statusColor!\n\n    context.fill()\n  }\n\n  get usage() {\n    const { currentUsage = 0, maxCapacity = 100 } = this.state\n    return Math.round((currentUsage / maxCapacity) * 100)\n  }\n\n  set usage(usage: number) {\n    // intentionally have done nothing\n  }\n\n  onchangeData(after: Properties, before: Properties): void {\n    const {\n      CURRENTCAPACITY = 0,\n      MAXCAPACITY = 100,\n      HIGHWATERMARK = 100\n    } = typeof this.data == 'object' ? this.data : {}\n\n    const currentUsage = Number(CURRENTCAPACITY) || 0\n    const maxCapacity = Number(MAXCAPACITY) || 100\n    const highWatermark = Number(HIGHWATERMARK) || 100\n\n    this.setState({\n      currentUsage,\n      maxCapacity,\n      highWatermark,\n      usage: Math.round((currentUsage / maxCapacity) * 100)\n    })\n  }\n}\n\nComponent.register('MCSGaugeCapacityCircle', MCSGaugeCapacityCircle)\n"]}

package/dist/mcs-machine.js

@@ -0,0 +1,84 @@
+import { ContainerAbstract } from '@hatiolab/things-scene';
+import { MCSStatusMixin, MCSStatusMixinProperties } from './features/mcs-status-mixin';
+import { safeRound } from './utils/safe-round';
+import { LEGEND_MACHINE } from './features/mcs-status-default';
+import { getLocaleLanguage } from './utils/get-locale';
+/**
+ * MCS Machine의 공통 속성을 정의한 최상위 오브젝트
+ * - Container
+ * -
+ */
+export default class MCSMachine extends MCSStatusMixin(ContainerAbstract) {
+    static get properties() {
+        return [
+            ...MCSStatusMixinProperties,
+            {
+                type: 'number',
+                name: 'round',
+                label: 'round'
+            }
+        ];
+    }
+    containable(component) {
+        return ['rect', 'ellipse'].includes(component.state.type);
+    }
+    get reactionDecorators() {
+        return ['bouncing-arrow'];
+    }
+    getTheme() {
+        var _a, _b;
+        const { legendName } = this.state;
+        if (legendName) {
+            return (_b = (_a = this.root) === null || _a === void 0 ? void 0 : _a.style) === null || _b === void 0 ? void 0 : _b[legendName];
+        }
+    }
+    get hasTextProperty() {
+        return true;
+    }
+    get status() {
+        var _a;
+        return (_a = this.data) === null || _a === void 0 ? void 0 : _a.STATUS;
+    }
+    get auxStatus() {
+        var _a;
+        return (_a = this.data) === null || _a === void 0 ? void 0 : _a.STATUS;
+    }
+    get legend() {
+        return this.getTheme() || this.getLegendFallback();
+    }
+    get auxLegend() {
+        return LEGEND_MACHINE;
+    }
+    get auxColor() {
+        return this.state.strokeStyle;
+    }
+    getLegendFallback() {
+        return LEGEND_MACHINE;
+    }
+    render(ctx) {
+        var { round = 0, lineWidth } = this.state;
+        var { left, top, width, height } = this.bounds;
+        ctx.beginPath();
+        ctx.strokeStyle = this.auxColor;
+        ctx.fillStyle = this.statusColor;
+        ctx.lineWidth = lineWidth || 1;
+        ctx.lineCap = 'round';
+        ctx.setLineDash([]);
+        round = safeRound(round, width, height);
+        ctx.roundRect(left, top, width, height, round);
+        ctx.fill();
+        ctx.stroke();
+    }
+    get text() {
+        var _a;
+        if ((_a = this.data) === null || _a === void 0 ? void 0 : _a.LOCALENAME) {
+            // TODO 왜 LOCALENAME 데이타는 문자열인가 ? 오브젝트로 보내달라.
+            return JSON.parse(this.data.LOCALENAME)[getLocaleLanguage()];
+        }
+        return super.text;
+    }
+    set text(text) {
+        super.text = text;
+    }
+}
+//# sourceMappingURL=mcs-machine.js.map