circuitscript 0.0.38 → 0.1.2

package/dist/cjs/draw_symbols.js

@@ -1,11 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SymbolDrawingCommands = exports.SymbolDrawing = exports.SymbolCustomModule = exports.SymbolCustom = exports.PlaceHolderCommands = exports.SymbolPlaceholder = exports.SymbolText = exports.SymbolPointHidden = exports.SymbolFactory = exports.SymbolGraphic = void 0;
+exports.SymbolDrawingCommands = exports.SymbolDrawing = exports.SymbolCustomModule = exports.SymbolCustom = exports.PlaceHolderCommands = exports.SymbolPlaceholder = exports.SymbolText = exports.SymbolGraphic = void 0;
 const helpers_js_1 = require("./helpers.js");
 const globals_js_1 = require("./globals.js");
 const geometry_js_1 = require("./geometry.js");
 const PinTypes_js_1 = require("./objects/PinTypes.js");
 const utils_js_1 = require("./utils.js");
+const types_js_1 = require("./objects/types.js");
+const ParamDefinition_js_1 = require("./objects/ParamDefinition.js");
 class SymbolGraphic {
     constructor() {
         this.drawPortsName = true;
@@ -13,7 +15,10 @@ class SymbolGraphic {
         this._angle = 0;
         this._flipX = 0;
         this._flipY = 0;
+        this.width = (0, ParamDefinition_js_1.numeric)(-1);
+        this.height = (0, ParamDefinition_js_1.numeric)(-1);
         this.labelTexts = new Map();
+        this.drawing = new SymbolDrawing();
     }
     get angle() {
         return (this._angle % 360);
@@ -39,15 +44,21 @@ class SymbolGraphic {
     }
     calculateSize() {
         const { width, height } = this.drawing.getBoundingBox();
-        this.width = width;
-        this.height = height;
-    }
-    size() {
+        this.width = (0, ParamDefinition_js_1.numeric)(width);
+        this.height = (0, ParamDefinition_js_1.numeric)(height);
         return {
+            bodyWidth: (0, ParamDefinition_js_1.numeric)(-1),
+            bodyHeight: (0, ParamDefinition_js_1.numeric)(-1),
             width: this.width,
             height: this.height
         };
     }
+    size() {
+        return {
+            width: this.width.toNumber(),
+            height: this.height.toNumber(),
+        };
+    }
     draw(group, extra) {
         const innerGroup = group.group();
         this.drawBody(innerGroup);
@@ -84,15 +95,15 @@ class SymbolGraphic {
     drawBounds(group) {
         const bbox = this.drawing.getBoundingBox();
         const originSize = (0, helpers_js_1.milsToMM)(10);
-        group.circle(originSize)
-            .translate(-originSize / 2, -originSize / 2)
+        group.circle(originSize.toNumber())
+            .translate(originSize.neg().div(2).toNumber(), originSize.neg().div(2).toNumber())
             .fill('red')
             .stroke('none');
         group.rect(bbox.width, bbox.height)
             .translate(bbox.start[0], bbox.start[1])
             .fill('none')
             .stroke({
-            width: (0, helpers_js_1.milsToMM)(2),
+            width: (0, helpers_js_1.milsToMM)(2).toNumber(),
             color: '#ccc',
         });
     }
@@ -102,7 +113,7 @@ class SymbolGraphic {
             const { path, lineColor, fillColor, lineWidth } = pathInfo;
             group.path(path)
                 .stroke({
-                width: lineWidth,
+                width: lineWidth.toNumber(),
                 color: lineColor,
             })
                 .fill(fillColor);
@@ -122,7 +133,8 @@ class SymbolGraphic {
         const labels = this.drawing.getLabels();
         labels.forEach(label => {
             const tmpLabel = label;
-            const { fontSize = 50, anchor = geometry_js_1.HorizontalAlign.Left, vanchor = geometry_js_1.VerticalAlign.Bottom, fontWeight = 'regular', angle: labelAngle = 0, textColor = "#333", } = tmpLabel.style ?? {};
+            const { fontSize = (0, ParamDefinition_js_1.numeric)(50), anchor = geometry_js_1.HorizontalAlign.Left, vanchor = geometry_js_1.VerticalAlign.Bottom, fontWeight = 'regular', angle: tmpLabelAngle = (0, ParamDefinition_js_1.numeric)(0), textColor = "#333", } = tmpLabel.style ?? {};
+            const labelAngle = tmpLabelAngle.toNumber();
             let anchorStyle = 'start';
             let dominantBaseline = 'auto';
             let useAnchor = anchor;
@@ -134,40 +146,44 @@ class SymbolGraphic {
             }
             switch (useAnchor) {
                 case geometry_js_1.HorizontalAlign.Left:
-                    anchorStyle = (this.flipX === 0) ? 'start' : 'end';
+                    anchorStyle = (this.flipX === 0)
+                        ? geometry_js_1.HorizontalAlignProp.Start : geometry_js_1.HorizontalAlignProp.End;
                     break;
                 case geometry_js_1.HorizontalAlign.Middle:
-                    anchorStyle = 'middle';
+                    anchorStyle = geometry_js_1.HorizontalAlignProp.Middle;
                     break;
                 case geometry_js_1.HorizontalAlign.Right:
-                    anchorStyle = (this.flipX === 0) ? 'end' : 'start';
+                    anchorStyle = (this.flipX === 0)
+                        ? geometry_js_1.HorizontalAlignProp.End : geometry_js_1.HorizontalAlignProp.Start;
                     break;
             }
             switch (useDominantBaseline) {
                 case geometry_js_1.VerticalAlign.Top:
-                    dominantBaseline = (this.flipY === 0) ? 'hanging' : 'text-top';
+                    dominantBaseline = (this.flipY === 0)
+                        ? geometry_js_1.VerticalAlignProp.Hanging : geometry_js_1.VerticalAlignProp.TextTop;
                     break;
                 case geometry_js_1.VerticalAlign.Middle:
-                    dominantBaseline = 'middle';
+                    dominantBaseline = geometry_js_1.VerticalAlignProp.Central;
                     break;
                 case geometry_js_1.VerticalAlign.Bottom:
-                    dominantBaseline = (this.flipY === 0) ? 'text-top' : 'hanging';
+                    dominantBaseline = (this.flipY === 0)
+                        ? geometry_js_1.VerticalAlignProp.TextTop : geometry_js_1.VerticalAlignProp.Hanging;
                     break;
             }
             const position = tmpLabel.getLabelPosition();
             if (this.flipX !== 0) {
-                position[0] *= -1;
+                position[0] = position[0].neg();
             }
             if (this.flipY !== 0) {
-                position[1] *= -1;
+                position[1] = position[1].neg();
             }
             const useFont = globals_js_1.defaultFont;
             const textContainer = group.group();
             let translateX, translateY;
             let useRotateAngle = 0;
             if (isRotation180) {
-                translateX = -position[0];
-                translateY = -position[1];
+                translateX = position[0].neg();
+                translateY = position[1].neg();
                 useRotateAngle = 0;
             }
             else {
@@ -237,7 +253,7 @@ class SymbolGraphic {
                     }
                     textContainer.path(path)
                         .stroke({
-                        width: (0, helpers_js_1.milsToMM)(5),
+                        width: (0, helpers_js_1.milsToMM)(5).toNumber(),
                         color: '#333'
                     })
                         .fill('none')
@@ -245,47 +261,55 @@ class SymbolGraphic {
                         .translate(boundsTranslateX, boundsY - paddingVert);
                 }
             }
-            const drawTextBounds = false;
-            const drawBoxBounds = false;
-            const drawOrigin = false;
-            if (drawBoxBounds) {
+            if (globals_js_1.RenderFlags.ShowLabelBoxBounds) {
                 const box = tmpLabel.box;
-                textContainer.rect(box.width, box.height).fill('red')
+                textContainer.rect(box.width, box.height)
+                    .fill('none')
+                    .stroke({
+                    width: 0.1,
+                    color: 'blue',
+                })
                     .translate(box.xmin, box.ymin)
-                    .scale(this.flipX !== 0 ? -1 : 1, 1, -box.xmin, box.ymin);
+                    .rotate(labelAngle, -box.xmin, -box.ymin);
             }
-            if (drawTextBounds) {
+            if (globals_js_1.RenderFlags.ShowLabelBounds) {
                 const textBounds = tmpLabel.textMeasurementBounds;
                 const xOffset = (this.flipX !== 0) ? textBounds.width : 0;
-                textContainer.rect(textBounds.width, textBounds.height).fill('#cccccc')
+                textContainer.rect(textBounds.width, textBounds.height)
+                    .fill('none')
+                    .stroke({
+                    width: 0.1,
+                    color: 'red',
+                })
                     .translate(textBounds.x - xOffset, textBounds.y);
             }
-            textContainer.translate(translateX, translateY)
-                .rotate(useRotateAngle, -translateX, -translateY);
+            textContainer.translate(translateX.toNumber(), translateY.toNumber())
+                .rotate(useRotateAngle, -translateX.toNumber(), -translateY.toNumber());
             textContainer.text(tmpLabel.text)
                 .fill(textColor)
                 .font({
                 family: useFont,
-                size: fontSize * globals_js_1.fontDisplayScale,
+                size: fontSize.toNumber() * globals_js_1.fontDisplayScale,
                 anchor: anchorStyle,
                 'dominant-baseline': dominantBaseline,
                 weight: fontWeight,
             })
-                .rotate(labelAngle);
+                .attr("xml:space", "preserve")
+                .rotate(labelAngle, 0, 0);
             const { a, b, c, d, e, f } = textContainer.matrix();
             const newMatrix = {
-                a: (0, utils_js_1.roundValue)(a),
-                b: (0, utils_js_1.roundValue)(b),
-                c: (0, utils_js_1.roundValue)(c),
-                d: (0, utils_js_1.roundValue)(d),
-                e: (0, utils_js_1.roundValue)(e),
-                f: (0, utils_js_1.roundValue)(f),
+                a: (0, utils_js_1.roundValue)((0, ParamDefinition_js_1.numeric)(a)).toNumber(),
+                b: (0, utils_js_1.roundValue)((0, ParamDefinition_js_1.numeric)(b)).toNumber(),
+                c: (0, utils_js_1.roundValue)((0, ParamDefinition_js_1.numeric)(c)).toNumber(),
+                d: (0, utils_js_1.roundValue)((0, ParamDefinition_js_1.numeric)(d)).toNumber(),
+                e: (0, utils_js_1.roundValue)((0, ParamDefinition_js_1.numeric)(e)).toNumber(),
+                f: (0, utils_js_1.roundValue)((0, ParamDefinition_js_1.numeric)(f)).toNumber(),
             };
             textContainer.transform(newMatrix);
-            if (drawOrigin) {
-                const originSize = (0, helpers_js_1.milsToMM)(10);
+            if (globals_js_1.RenderFlags.ShowLabelOrigin) {
+                const originSize = (0, helpers_js_1.milsToMM)(10).toNumber();
                 textContainer.circle(originSize)
-                    .translate(originSize / 2, originSize / 2)
+                    .translate(-originSize / 2, -originSize / 2)
                     .fill('green');
             }
         });
@@ -312,43 +336,19 @@ class SymbolGraphic {
             return geometry_js_1.VerticalAlign.Middle;
         }
     }
-    setLabelValue(labelId, labelValue) {
-        this.labelTexts.set(labelId, labelValue);
-    }
-    getLabelValue(labelId) {
-        if (this.labelTexts.has(labelId)) {
-            return this.labelTexts.get(labelId);
-        }
-        return undefined;
-    }
 }
 exports.SymbolGraphic = SymbolGraphic;
-function SymbolFactory(name) {
-    switch (name) {
-        case 'point':
-            return new SymbolPointHidden();
-    }
-    return null;
-}
-exports.SymbolFactory = SymbolFactory;
-class SymbolPointHidden extends SymbolGraphic {
-    generateDrawing() {
-        const drawing = new SymbolDrawing();
-        drawing.addPin(1, 0, 0, 0, 0);
-        this.drawing = drawing;
-    }
-}
-exports.SymbolPointHidden = SymbolPointHidden;
 class SymbolText extends SymbolGraphic {
     constructor(text) {
         super();
-        this.fontSize = 40;
+        this.fontSize = (0, ParamDefinition_js_1.numeric)(40);
         this.fontWeight = 'regular';
         this.text = text;
     }
     generateDrawing() {
-        const drawing = new SymbolDrawing();
-        drawing.addTextbox(0, 0, this.text, {
+        const drawing = this.drawing;
+        drawing.clear();
+        drawing.addTextbox((0, ParamDefinition_js_1.numeric)(0), (0, ParamDefinition_js_1.numeric)(0), this.text, {
             fontSize: this.fontSize,
             anchor: geometry_js_1.HorizontalAlign.Middle,
             fontWeight: this.fontWeight,
@@ -369,13 +369,23 @@ class SymbolPlaceholder extends SymbolGraphic {
             [PlaceHolderCommands.units, ['mils'], {}],
             [PlaceHolderCommands.lineColor, [globals_js_1.ColorScheme.PinLineColor], {}],
             [PlaceHolderCommands.textColor, [globals_js_1.ColorScheme.PinNameColor], {}],
-            [PlaceHolderCommands.lineWidth, [5], {}],
+            [PlaceHolderCommands.lineWidth, [(0, ParamDefinition_js_1.numeric)(5)], {}],
             ...drawing.getCommands()
         ];
         drawing.log('id: ', drawing.id, 'angle: ', this._angle, "commands:", commands.length);
         let lineColor = "#333";
         let textColor = "#333";
-        commands.forEach(([commandName, positionParams, keywordParams]) => {
+        commands.forEach(([commandName, positionParams, keywordParams, ctx]) => {
+            positionParams = positionParams.map(param => {
+                return this.resolveReference(param);
+            });
+            if (keywordParams instanceof Map) {
+                const tmpKeywordParams = new Map(keywordParams);
+                tmpKeywordParams.forEach((value, key) => {
+                    tmpKeywordParams.set(key, this.resolveReference(value));
+                });
+                keywordParams = tmpKeywordParams;
+            }
             switch (commandName) {
                 case PlaceHolderCommands.rect:
                     drawing.log('add rect', ...positionParams);
@@ -414,7 +424,7 @@ class SymbolPlaceholder extends SymbolGraphic {
                     drawing.addArc(...positionParams);
                     break;
                 case PlaceHolderCommands.circle:
-                    drawing.addArc(...positionParams, 0, 360);
+                    drawing.addArc(...positionParams, (0, ParamDefinition_js_1.numeric)(0), (0, ParamDefinition_js_1.numeric)(360));
                     break;
                 case PlaceHolderCommands.triangle:
                     drawing.addTriangle(...positionParams);
@@ -431,23 +441,24 @@ class SymbolPlaceholder extends SymbolGraphic {
                     if (style['textColor'] === undefined) {
                         style['textColor'] = textColor;
                     }
-                    positionParams = [...positionParams];
-                    positionParams.push(style);
-                    const labelId = positionParams[0];
-                    const tmpPositionParams = [...positionParams];
-                    const tmpLabelValue = this.getLabelValue(labelId);
-                    if (tmpLabelValue !== undefined) {
-                        tmpPositionParams[3] = tmpLabelValue;
-                    }
+                    const tmpPositionParams = [
+                        positionParams[1], positionParams[2],
+                        positionParams[0], style
+                    ];
                     drawing.log('add label', JSON.stringify(tmpPositionParams));
-                    drawing.addLabelId(...tmpPositionParams);
+                    try {
+                        drawing.addLabelMils(...tmpPositionParams);
+                    }
+                    catch (err) {
+                        (0, utils_js_1.throwWithContext)(ctx, err);
+                    }
                     break;
                 }
                 case PlaceHolderCommands.text: {
                     const style = this.parseLabelStyle(keywordParams);
                     const content = keywordParams.get('content');
-                    let offsetX = 0;
-                    let offsetY = 0;
+                    let offsetX = (0, ParamDefinition_js_1.numeric)(0);
+                    let offsetY = (0, ParamDefinition_js_1.numeric)(0);
                     if (keywordParams.has('offset')) {
                         const offset = keywordParams.get('offset');
                         offsetX = offset[0];
@@ -464,13 +475,30 @@ class SymbolPlaceholder extends SymbolGraphic {
         });
         drawing.log("=== end generate drawing ===");
     }
+    resolveReference(param) {
+        if (param instanceof types_js_1.DeclaredReference) {
+            return param.value;
+        }
+        else if (param instanceof types_js_1.UndeclaredReference) {
+            throw "Undefined symbol: " + param.nameString();
+        }
+        return param;
+    }
     parseLabelStyle(keywordParams) {
         const keywords = ['fontSize', 'anchor', 'vanchor',
-            'angle', 'textColor', 'portType'];
+            'angle', 'textColor', 'portType', 'bold'];
         const style = {};
         keywords.forEach(item => {
             if (keywordParams.has(item)) {
                 style[item] = keywordParams.get(item);
+                if (item === 'bold') {
+                    if (keywordParams.get(item) === true) {
+                        style['fontWeight'] = 'bold';
+                    }
+                    else {
+                        style['fontWeight'] = 'normal';
+                    }
+                }
             }
         });
         return style;
@@ -482,6 +510,9 @@ class SymbolPlaceholder extends SymbolGraphic {
         let displayPinId = true;
         if (keywordParams.has(keywordDisplayPinId)) {
             const value = keywordParams.get(keywordDisplayPinId);
+            if (value instanceof ParamDefinition_js_1.NumericValue && value.toNumber() === 0) {
+                displayPinId = false;
+            }
             if (value === 0 || value === false) {
                 displayPinId = false;
             }
@@ -505,7 +536,7 @@ class SymbolPlaceholder extends SymbolGraphic {
                 startX,
                 startY,
                 startX,
-                startY + magnitude
+                startY.add(magnitude)
             ];
         }
         else if (commandName === PlaceHolderCommands.hpin) {
@@ -514,7 +545,7 @@ class SymbolPlaceholder extends SymbolGraphic {
                 positionParams[0],
                 startX,
                 startY,
-                startX + magnitude,
+                startX.add(magnitude),
                 startY
             ];
         }
@@ -536,11 +567,12 @@ class SymbolPlaceholder extends SymbolGraphic {
         const offset1 = 15;
         const offset2 = 15;
         let pinNameOffsetX = (0, helpers_js_1.milsToMM)(offset1);
-        let pinIdOffsetX = 0;
+        let pinIdOffsetX = (0, ParamDefinition_js_1.numeric)(0);
         let pinIdAlignment = geometry_js_1.HorizontalAlign.Left;
         let pinIdVAlignment = geometry_js_1.VerticalAlign.Bottom;
         let pinIdOffsetY = (0, helpers_js_1.milsToMM)(-offset2);
-        switch (angle) {
+        const angleValue = angle.toNumber();
+        switch (angleValue) {
             case 0:
                 pinNameAlignment = geometry_js_1.HorizontalAlign.Left;
                 pinNameOffsetX = (0, helpers_js_1.milsToMM)(offset1);
@@ -563,16 +595,16 @@ class SymbolPlaceholder extends SymbolGraphic {
                 pinIdVAlignment = geometry_js_1.VerticalAlign.Top;
                 break;
         }
-        if (angle === 0 || angle === 90 || angle === 180 || angle === 270) {
+        if (angleValue === 0 || angleValue === 90 || angleValue === 180 || angleValue === 270) {
             const usePinName = pinNameParam ?? "";
-            usePinName !== "" && drawing.addLabel(endX + pinNameOffsetX, endY, usePinName, {
-                fontSize: globals_js_1.defaultPinNameTextSize,
+            usePinName !== "" && drawing.addLabel(endX.add(pinNameOffsetX), endY, usePinName, {
+                fontSize: (0, ParamDefinition_js_1.numeric)(globals_js_1.defaultPinNameTextSize),
                 anchor: pinNameAlignment,
                 vanchor: geometry_js_1.VerticalAlign.Middle,
                 textColor: pinNameColor,
             });
-            displayPinId && drawing.addLabel(endX + pinIdOffsetX, endY + pinIdOffsetY, pinId.toString(), {
-                fontSize: globals_js_1.defaultPinIdTextSize,
+            displayPinId && drawing.addLabel(endX.add(pinIdOffsetX), endY.add(pinIdOffsetY), pinId.toDisplayString(), {
+                fontSize: (0, ParamDefinition_js_1.numeric)(globals_js_1.defaultPinIdTextSize),
                 anchor: pinIdAlignment,
                 vanchor: pinIdVAlignment,
                 textColor: lineColor
@@ -608,58 +640,75 @@ var PlaceHolderCommands;
     PlaceHolderCommands["for"] = "for";
 })(PlaceHolderCommands || (exports.PlaceHolderCommands = PlaceHolderCommands = {}));
 class SymbolCustom extends SymbolGraphic {
-    constructor(pinDefinition) {
+    constructor(pinDefinition, pinMaxPositions) {
         super();
         this.pinDefinition = [];
         this.bodyWidth = (0, helpers_js_1.milsToMM)(400);
+        this.bodyHeight = (0, helpers_js_1.milsToMM)(100);
         this.pinLength = (0, helpers_js_1.milsToMM)(100);
         this.width = (0, helpers_js_1.milsToMM)(100);
         this.height = (0, helpers_js_1.milsToMM)(100);
         this.pinSpacing = (0, helpers_js_1.milsToMM)(100);
         this.pinTextPadding = (0, helpers_js_1.milsToMM)(5);
         this.pins = [];
+        this._cacheLeftPins = [];
+        this._cacheRightPins = [];
+        this._cacheTopPins = [];
+        this._cacheBottomPins = [];
         this.pinDefinition = pinDefinition;
+        this.pinMaxPositions = pinMaxPositions;
     }
     generateDrawing() {
-        const leftPins = this.pinDefinition.filter(item => {
-            return item.side === globals_js_1.SymbolPinSide.Left;
-        });
-        const rightPins = this.pinDefinition.filter(item => {
-            return item.side === globals_js_1.SymbolPinSide.Right;
-        });
-        const maxLeftPins = Math.max(...leftPins.map(item => item.position)) + 1;
-        const maxRightPins = Math.max(...rightPins.map(item => item.position)) + 1;
-        const drawing = new SymbolDrawing();
+        const leftPins = this.getPins(globals_js_1.SymbolPinSide.Left);
+        const rightPins = this.getPins(globals_js_1.SymbolPinSide.Right);
+        const topPins = this.getPins(globals_js_1.SymbolPinSide.Top);
+        const bottomPins = this.getPins(globals_js_1.SymbolPinSide.Bottom);
+        this.drawing.clear();
+        const drawing = this.drawing;
         drawing.angle = this._angle;
         drawing.flipX = this._flipX;
         drawing.flipY = this._flipY;
-        const bodyWidth = this.bodyWidth;
-        const bodyHeight = (1 + Math.max(maxLeftPins, maxRightPins)) * this.pinSpacing;
+        const { bodyWidth, bodyHeight } = this.calculateSize();
         const defaultLineColor = globals_js_1.ColorScheme.PinLineColor;
         drawing.addSetLineColor(defaultLineColor);
-        drawing.addSetLineWidth(5);
-        drawing.addRectMM(0, 0, bodyWidth, bodyHeight);
-        this.generateDrawingPins(drawing, bodyWidth, bodyHeight, leftPins, rightPins, defaultLineColor);
+        drawing.addSetLineWidth((0, ParamDefinition_js_1.numeric)(5));
+        drawing.addRectMM((0, ParamDefinition_js_1.numeric)(0), (0, ParamDefinition_js_1.numeric)(0), bodyWidth, bodyHeight);
+        this.generateDrawingPins(drawing, bodyWidth, bodyHeight, {
+            left: leftPins, right: rightPins, top: topPins, bottom: bottomPins
+        }, defaultLineColor);
         this.drawing = drawing;
         this._cacheLeftPins = leftPins;
         this._cacheRightPins = rightPins;
+        this._cacheTopPins = topPins;
+        this._cacheBottomPins = bottomPins;
     }
-    generateDrawingPins(drawing, bodyWidthMM, bodyHeightMM, leftPins, rightPins, defaultLineColor) {
-        const leftPinStart = -bodyWidthMM / 2;
-        const rightPinStart = bodyWidthMM / 2;
-        const pinStartY = -bodyHeightMM / 2;
+    getPins(side) {
+        const pins = this.pinDefinition.filter(item => {
+            return item.side === side;
+        });
+        return pins;
+    }
+    generateDrawingPins(drawing, bodyWidthMM, bodyHeightMM, pins, defaultLineColor) {
+        const { left: leftPins, right: rightPins, top: topPins, bottom: bottomPins } = pins;
+        const leftPinStart = bodyWidthMM.neg().div(2);
+        const rightPinStart = bodyWidthMM.div(2);
+        const topPinStart = bodyHeightMM.neg().div(2);
+        const bottomPinStart = bodyHeightMM.div(2);
+        const pinStartY = bodyHeightMM.neg().div(2);
+        const pinStartX = bodyWidthMM.neg().div(2);
+        const tmpPinSpacing = this.pinSpacing.toNumber();
         leftPins.forEach(pin => {
             const position = pin.position;
-            const pinY = pinStartY + (position + 1) * this.pinSpacing;
-            drawing.addPinMM(pin.pinId, leftPinStart - this.pinLength, pinY, leftPinStart, pinY, defaultLineColor);
-            drawing.addLabel(leftPinStart + (0, helpers_js_1.milsToMM)(20), pinY, pin.text, {
-                fontSize: globals_js_1.CustomSymbolPinTextSize,
+            const pinY = pinStartY.add((position + 1) * tmpPinSpacing);
+            drawing.addPinMM((0, ParamDefinition_js_1.numeric)(pin.pinId), leftPinStart.sub(this.pinLength), pinY, leftPinStart, pinY, defaultLineColor);
+            drawing.addLabel(leftPinStart.add((0, helpers_js_1.milsToMM)(20)), pinY, pin.text, {
+                fontSize: (0, ParamDefinition_js_1.numeric)(globals_js_1.CustomSymbolPinTextSize),
                 anchor: geometry_js_1.HorizontalAlign.Left,
                 vanchor: geometry_js_1.VerticalAlign.Middle,
                 textColor: globals_js_1.ColorScheme.PinNameColor,
             });
-            drawing.addLabel(leftPinStart - (0, helpers_js_1.milsToMM)(10), pinY - (0, helpers_js_1.milsToMM)(10), pin.pinId.toString(), {
-                fontSize: globals_js_1.CustomSymbolPinIdSize,
+            drawing.addLabel(leftPinStart.sub((0, helpers_js_1.milsToMM)(10)), pinY.sub((0, helpers_js_1.milsToMM)(10)), pin.pinId.toString(), {
+                fontSize: (0, ParamDefinition_js_1.numeric)(globals_js_1.CustomSymbolPinIdSize),
                 anchor: geometry_js_1.HorizontalAlign.Right,
                 vanchor: geometry_js_1.VerticalAlign.Bottom,
                 textColor: defaultLineColor
@@ -667,32 +716,70 @@ class SymbolCustom extends SymbolGraphic {
         });
         rightPins.forEach(pin => {
             const position = pin.position;
-            const pinY = pinStartY + (position + 1) * this.pinSpacing;
-            drawing.addPinMM(pin.pinId, rightPinStart + this.pinLength, pinY, rightPinStart, pinY, defaultLineColor);
-            drawing.addLabel(rightPinStart - (0, helpers_js_1.milsToMM)(20), pinY, pin.text, {
-                fontSize: globals_js_1.CustomSymbolPinTextSize,
+            const pinY = pinStartY.add((position + 1) * tmpPinSpacing);
+            drawing.addPinMM((0, ParamDefinition_js_1.numeric)(pin.pinId), rightPinStart.add(this.pinLength), pinY, rightPinStart, pinY, defaultLineColor);
+            drawing.addLabel(rightPinStart.sub((0, helpers_js_1.milsToMM)(20)), pinY, pin.text, {
+                fontSize: (0, ParamDefinition_js_1.numeric)(globals_js_1.CustomSymbolPinTextSize),
                 anchor: geometry_js_1.HorizontalAlign.Right,
                 vanchor: geometry_js_1.VerticalAlign.Middle,
                 textColor: globals_js_1.ColorScheme.PinNameColor,
             });
-            drawing.addLabel(rightPinStart + (0, helpers_js_1.milsToMM)(10), pinY - (0, helpers_js_1.milsToMM)(10), pin.pinId.toString(), {
-                fontSize: globals_js_1.CustomSymbolPinIdSize,
+            drawing.addLabel(rightPinStart.add((0, helpers_js_1.milsToMM)(10)), pinY.sub((0, helpers_js_1.milsToMM)(10)), pin.pinId.toString(), {
+                fontSize: (0, ParamDefinition_js_1.numeric)(globals_js_1.CustomSymbolPinIdSize),
                 anchor: geometry_js_1.HorizontalAlign.Left,
                 vanchor: geometry_js_1.VerticalAlign.Bottom,
                 textColor: defaultLineColor
             });
         });
-        const instanceName = this.getLabelValue("refdes");
-        instanceName && drawing.addLabel(-bodyWidthMM / 2, -bodyHeightMM / 2 - (0, helpers_js_1.milsToMM)(20), instanceName, {
-            fontSize: globals_js_1.CustomSymbolRefDesSize,
+        topPins.forEach(pin => {
+            const position = pin.position;
+            const pinX = pinStartX.add((position + 1) * tmpPinSpacing);
+            drawing.addPinMM((0, ParamDefinition_js_1.numeric)(pin.pinId), pinX, topPinStart.sub(this.pinLength), pinX, topPinStart, defaultLineColor);
+            drawing.addLabel(pinX, topPinStart.add((0, helpers_js_1.milsToMM)(20)), pin.text, {
+                fontSize: (0, ParamDefinition_js_1.numeric)(globals_js_1.CustomSymbolPinTextSize),
+                anchor: geometry_js_1.HorizontalAlign.Right,
+                vanchor: geometry_js_1.VerticalAlign.Middle,
+                textColor: globals_js_1.ColorScheme.PinNameColor,
+                angle: (0, ParamDefinition_js_1.numeric)(-90),
+            });
+            drawing.addLabel(pinX.sub((0, helpers_js_1.milsToMM)(10)), topPinStart.sub((0, helpers_js_1.milsToMM)(10)), pin.pinId.toString(), {
+                fontSize: (0, ParamDefinition_js_1.numeric)(globals_js_1.CustomSymbolPinIdSize),
+                anchor: geometry_js_1.HorizontalAlign.Left,
+                vanchor: geometry_js_1.VerticalAlign.Bottom,
+                textColor: defaultLineColor,
+                angle: (0, ParamDefinition_js_1.numeric)(-90),
+            });
+        });
+        bottomPins.forEach(pin => {
+            const position = pin.position;
+            const pinX = pinStartX.add((position + 1) * tmpPinSpacing);
+            drawing.addPinMM((0, ParamDefinition_js_1.numeric)(pin.pinId), pinX, bottomPinStart.add(this.pinLength), pinX, bottomPinStart, defaultLineColor);
+            drawing.addLabel(pinX, bottomPinStart.sub((0, helpers_js_1.milsToMM)(20)), pin.text, {
+                fontSize: (0, ParamDefinition_js_1.numeric)(globals_js_1.CustomSymbolPinTextSize),
+                anchor: geometry_js_1.HorizontalAlign.Left,
+                vanchor: geometry_js_1.VerticalAlign.Middle,
+                textColor: globals_js_1.ColorScheme.PinNameColor,
+                angle: (0, ParamDefinition_js_1.numeric)(-90),
+            });
+            drawing.addLabel(pinX.sub((0, helpers_js_1.milsToMM)(10)), bottomPinStart.add((0, helpers_js_1.milsToMM)(10)), pin.pinId.toString(), {
+                fontSize: (0, ParamDefinition_js_1.numeric)(globals_js_1.CustomSymbolPinIdSize),
+                anchor: geometry_js_1.HorizontalAlign.Right,
+                vanchor: geometry_js_1.VerticalAlign.Bottom,
+                textColor: defaultLineColor,
+                angle: (0, ParamDefinition_js_1.numeric)(-90)
+            });
+        });
+        const instanceName = drawing.variables.get('refdes');
+        instanceName && drawing.addLabel(bodyWidthMM.neg().div(2), bodyHeightMM.neg().div(2).sub((0, helpers_js_1.milsToMM)(20)), instanceName, {
+            fontSize: (0, ParamDefinition_js_1.numeric)(globals_js_1.CustomSymbolRefDesSize),
             anchor: geometry_js_1.HorizontalAlign.Left,
         });
         const acceptedMPNKeys = ['MPN', 'mpn', 'manufacturer_pn'];
         acceptedMPNKeys.some(key => {
-            const labelValue = this.getLabelValue(key);
+            const labelValue = drawing.variables.get(key);
             if (labelValue !== undefined) {
-                drawing.addLabel(-bodyWidthMM / 2, bodyHeightMM / 2 + (0, helpers_js_1.milsToMM)(20), labelValue, {
-                    fontSize: globals_js_1.CustomSymbolParamTextSize,
+                drawing.addLabel(bodyWidthMM.neg().div(2), bodyHeightMM.div(2).add((0, helpers_js_1.milsToMM)(20)), labelValue, {
+                    fontSize: (0, ParamDefinition_js_1.numeric)(globals_js_1.CustomSymbolParamTextSize),
                     anchor: geometry_js_1.HorizontalAlign.Left,
                     vanchor: geometry_js_1.VerticalAlign.Top,
                 });
@@ -700,29 +787,59 @@ class SymbolCustom extends SymbolGraphic {
         });
     }
     calculateSize() {
-        this.width = this.bodyWidth + 2 * this.pinLength;
-        this.height = (1 + Math.max(this._cacheLeftPins.length, this._cacheRightPins.length)) * this.pinSpacing;
+        const tmpPinSpacing = this.pinSpacing.toNumber();
+        const tmpPinLength = this.pinLength.toNumber();
+        const { [globals_js_1.SymbolPinSide.Top]: maxTopPins, [globals_js_1.SymbolPinSide.Bottom]: maxBottomPins, [globals_js_1.SymbolPinSide.Left]: maxLeftPins, [globals_js_1.SymbolPinSide.Right]: maxRightPins } = this.pinMaxPositions;
+        const bodyWidthFromPins = (0, ParamDefinition_js_1.numeric)((1 + Math.max(maxTopPins, maxBottomPins)) * tmpPinSpacing);
+        const bodyWidth = Math.max(bodyWidthFromPins.toNumber(), this.bodyWidth.toNumber());
+        let tmpBodyHeight = 0;
+        if (maxLeftPins === 0 && maxRightPins === 0) {
+            tmpBodyHeight = 3;
+        }
+        else {
+            tmpBodyHeight = (1 + Math.max(maxLeftPins, maxRightPins));
+        }
+        const bodyHeight = Math.max(tmpBodyHeight * tmpPinSpacing, this.bodyHeight.toNumber());
+        const useHeight = bodyHeight
+            + ((this._cacheTopPins.length > 0) ? tmpPinLength : 0)
+            + ((this._cacheBottomPins.length > 0) ? tmpPinLength : 0);
+        const useWidth = bodyWidth
+            + ((this._cacheLeftPins.length > 0) ? tmpPinLength : 0)
+            + ((this._cacheRightPins.length > 0) ? tmpPinLength : 0);
+        this.width = (0, ParamDefinition_js_1.numeric)(useWidth);
+        this.height = (0, ParamDefinition_js_1.numeric)(useHeight);
+        return {
+            bodyWidth: (0, ParamDefinition_js_1.numeric)(bodyWidth),
+            bodyHeight: (0, ParamDefinition_js_1.numeric)(bodyHeight),
+            width: this.width,
+            height: this.height
+        };
     }
 }
 exports.SymbolCustom = SymbolCustom;
 class SymbolCustomModule extends SymbolCustom {
     constructor() {
         super(...arguments);
-        this.pinLength = 0;
+        this.pinLength = (0, helpers_js_1.milsToMM)(0);
         this.portWidth = (0, helpers_js_1.milsToMM)(100);
         this.portHeight = (0, helpers_js_1.milsToMM)(50);
     }
-    generateDrawingPins(drawing, bodyWidthMM, bodyHeightMM, leftPins, rightPins, defaultLineColor) {
-        const leftPinStart = -bodyWidthMM / 2;
-        const rightPinStart = bodyWidthMM / 2;
-        const pinStartY = -bodyHeightMM / 2;
+    generateDrawingPins(drawing, bodyWidthMM, bodyHeightMM, pins, defaultLineColor) {
+        const leftPinStart = bodyWidthMM.neg().div(2);
+        const rightPinStart = bodyWidthMM.div(2);
+        const topPinStart = bodyHeightMM.neg().div(2);
+        const bottomPinStart = bodyHeightMM.div(2);
+        const pinStartY = bodyHeightMM.neg().div(2);
+        const pinStartX = bodyWidthMM.neg().div(2);
+        const tmpPinSpacing = this.pinSpacing.toNumber();
+        const { left: leftPins, right: rightPins, top: topPins, bottom: bottomPins } = pins;
         leftPins.forEach(pin => {
             const position = pin.position;
-            const pinY = pinStartY + (position + 1) * this.pinSpacing;
-            drawing.addPinMM(pin.pinId, leftPinStart - this.pinLength, pinY, leftPinStart, pinY, defaultLineColor);
+            const pinY = pinStartY.add((position + 1) * tmpPinSpacing);
+            drawing.addPinMM((0, ParamDefinition_js_1.numeric)(pin.pinId), leftPinStart.sub(this.pinLength), pinY, leftPinStart, pinY, defaultLineColor);
             drawing.addModulePort(leftPinStart, pinY, this.portWidth, this.portHeight, pin.pinType);
-            drawing.addLabel(leftPinStart + this.portWidth + (0, helpers_js_1.milsToMM)(20), pinY, pin.text, {
-                fontSize: 40,
+            drawing.addLabel(leftPinStart.add(this.portWidth).add((0, helpers_js_1.milsToMM)(20)), pinY, pin.text, {
+                fontSize: (0, ParamDefinition_js_1.numeric)(40),
                 anchor: geometry_js_1.HorizontalAlign.Left,
                 vanchor: geometry_js_1.VerticalAlign.Middle,
                 textColor: globals_js_1.ColorScheme.PinNameColor,
@@ -730,14 +847,40 @@ class SymbolCustomModule extends SymbolCustom {
         });
         rightPins.forEach(pin => {
             const position = pin.position;
-            const pinY = pinStartY + (position + 1) * this.pinSpacing;
-            drawing.addPinMM(pin.pinId, rightPinStart + this.pinLength, pinY, rightPinStart, pinY, defaultLineColor);
+            const pinY = pinStartY.add((position + 1) * tmpPinSpacing);
+            drawing.addPinMM((0, ParamDefinition_js_1.numeric)(pin.pinId), rightPinStart.add(this.pinLength), pinY, rightPinStart, pinY, defaultLineColor);
             drawing.addModulePort(rightPinStart, pinY, this.portWidth, this.portHeight, pin.pinType, -1);
-            drawing.addLabel(rightPinStart - this.portWidth - (0, helpers_js_1.milsToMM)(20), pinY, pin.text, {
-                fontSize: 40,
+            drawing.addLabel(rightPinStart.sub(this.portWidth).sub((0, helpers_js_1.milsToMM)(20)), pinY, pin.text, {
+                fontSize: (0, ParamDefinition_js_1.numeric)(40),
+                anchor: geometry_js_1.HorizontalAlign.Right,
+                vanchor: geometry_js_1.VerticalAlign.Middle,
+                textColor: globals_js_1.ColorScheme.PinNameColor,
+            });
+        });
+        topPins.forEach(pin => {
+            const position = pin.position;
+            const pinX = pinStartX.add((position + 1) * tmpPinSpacing);
+            drawing.addPinMM((0, ParamDefinition_js_1.numeric)(pin.pinId), pinX, topPinStart.sub(this.pinLength), pinX, topPinStart, defaultLineColor);
+            drawing.addModulePort(pinX, topPinStart, this.portWidth, this.portHeight, pin.pinType, 1, 90);
+            drawing.addLabel(pinX, topPinStart.add(this.portWidth).add((0, helpers_js_1.milsToMM)(20)), pin.text, {
+                fontSize: (0, ParamDefinition_js_1.numeric)(40),
                 anchor: geometry_js_1.HorizontalAlign.Right,
                 vanchor: geometry_js_1.VerticalAlign.Middle,
                 textColor: globals_js_1.ColorScheme.PinNameColor,
+                angle: (0, ParamDefinition_js_1.numeric)(-90),
+            });
+        });
+        bottomPins.forEach(pin => {
+            const position = pin.position;
+            const pinX = pinStartX.add((position + 1) * tmpPinSpacing);
+            drawing.addPinMM((0, ParamDefinition_js_1.numeric)(pin.pinId), pinX, bottomPinStart, pinX, bottomPinStart.sub(this.pinLength), defaultLineColor);
+            drawing.addModulePort(pinX, bottomPinStart, this.portWidth, this.portHeight, pin.pinType, 1, -90);
+            drawing.addLabel(pinX, bottomPinStart.sub(this.portWidth).sub((0, helpers_js_1.milsToMM)(20)), pin.text, {
+                fontSize: (0, ParamDefinition_js_1.numeric)(40),
+                anchor: geometry_js_1.HorizontalAlign.Left,
+                vanchor: geometry_js_1.VerticalAlign.Middle,
+                textColor: globals_js_1.ColorScheme.PinNameColor,
+                angle: (0, ParamDefinition_js_1.numeric)(-90),
             });
         });
     }
@@ -750,8 +893,9 @@ class SymbolDrawing {
         this.angle = 0;
         this.flipX = 0;
         this.flipY = 0;
-        this.mainOrigin = [0, 0];
+        this.mainOrigin = [(0, ParamDefinition_js_1.numeric)(0), (0, ParamDefinition_js_1.numeric)(0)];
         this.logger = null;
+        this.variables = new Map();
     }
     clear() {
         this.items = [];
@@ -777,26 +921,30 @@ class SymbolDrawing {
     }
     addPinMM(pinId, startXMM, startYMM, endXMM, endYMM, lineColor) {
         let angle = 0;
-        if (startXMM === endXMM) {
-            if (startYMM > endYMM) {
+        const tmpStartXMM = startXMM.toNumber();
+        const tmpEndXMM = endXMM.toNumber();
+        const tmpStartYMM = startYMM.toNumber();
+        const tmpEndYMM = endYMM.toNumber();
+        if (tmpStartXMM === tmpEndXMM) {
+            if (tmpStartYMM > tmpEndYMM) {
                 angle = 270;
             }
-            else if (startYMM < endYMM) {
+            else if (tmpStartYMM < tmpEndYMM) {
                 angle = 90;
             }
         }
         else {
-            if (startXMM < endXMM) {
+            if (tmpStartXMM < tmpEndXMM) {
                 angle = 0;
             }
-            else if (startXMM > endXMM) {
+            else if (tmpStartXMM > tmpEndXMM) {
                 angle = 180;
             }
         }
         this.pins.push([
             pinId,
             geometry_js_1.Geometry.segment([startXMM, startYMM], [endXMM, endYMM]),
-            angle,
+            (0, ParamDefinition_js_1.numeric)(angle),
             lineColor
         ]);
         return this;
@@ -805,14 +953,14 @@ class SymbolDrawing {
         startX = (0, helpers_js_1.milsToMM)(startX);
         startY = (0, helpers_js_1.milsToMM)(startY);
         value = (0, helpers_js_1.milsToMM)(value);
-        this.items.push(geometry_js_1.Geometry.segment([startX, startY], [startX, startY + value]));
+        this.items.push(geometry_js_1.Geometry.segment([startX, startY], [startX, startY.add(value)]));
         return this;
     }
     addHLine(startX, startY, value) {
         startX = (0, helpers_js_1.milsToMM)(startX);
         startY = (0, helpers_js_1.milsToMM)(startY);
         value = (0, helpers_js_1.milsToMM)(value);
-        this.items.push(geometry_js_1.Geometry.segment([startX, startY], [startX + value, startY]));
+        this.items.push(geometry_js_1.Geometry.segment([startX, startY], [startX.add(value), startY]));
         return this;
     }
     addRect(centerX, centerY, width, height) {
@@ -823,14 +971,14 @@ class SymbolDrawing {
         return this.addRectMM(centerX, centerY, width, height);
     }
     addRectMM(centerX, centerY, width, height) {
-        const width2 = width / 2;
-        const height2 = height / 2;
+        const width2 = width.div(2);
+        const height2 = height.div(2);
         this.items.push(geometry_js_1.Geometry.polygon([
-            [centerX - width2, centerY - height2],
-            [centerX + width2, centerY - height2],
-            [centerX + width2, centerY + height2],
-            [centerX - width2, centerY + height2],
-            [centerX - width2, centerY - height2]
+            [centerX.sub(width2), centerY.sub(height2)],
+            [centerX.add(width2), centerY.sub(height2)],
+            [centerX.add(width2), centerY.add(height2)],
+            [centerX.sub(width2), centerY.add(height2)],
+            [centerX.sub(width2), centerY.sub(height2)]
         ]));
         return this;
     }
@@ -842,25 +990,15 @@ class SymbolDrawing {
         width = (0, helpers_js_1.milsToMM)(width);
         const line = geometry_js_1.Geometry.line(startX, startY, endX, endY);
         const normLine = line.norm;
-        const dx1 = normLine.x * width / 2;
-        const dy1 = normLine.y * width / 2;
-        const dx2 = normLine.x * -width / 2;
-        const dy2 = normLine.y * -width / 2;
+        const dx1 = (0, ParamDefinition_js_1.numeric)(normLine.x).mul(width).div(2);
+        const dy1 = (0, ParamDefinition_js_1.numeric)(normLine.y).mul(width).div(2);
+        const dx2 = (0, ParamDefinition_js_1.numeric)(normLine.x).mul(width.neg()).div(2);
+        const dy2 = (0, ParamDefinition_js_1.numeric)(normLine.y).mul(width.neg()).div(2);
         this.items.push(geometry_js_1.Geometry.polygon([
-            [dx1 + startX, dy1 + startY],
-            [dx2 + startX, dy2 + startY],
+            [dx1.add(startX), dy1.add(startY)],
+            [dx2.add(startX), dy2.add(startY)],
             [endX, endY],
-            [dx1 + startX, dy1 + startY],
-        ]));
-        return this;
-    }
-    addRect2(x, y, x2, y2) {
-        this.items.push(geometry_js_1.Geometry.polygon([
-            [x, y],
-            [x2, y],
-            [x2, y2],
-            [x, y2],
-            [x, y]
+            [dx1.add(startX), dy1.add(startY)],
         ]));
         return this;
     }
@@ -868,10 +1006,10 @@ class SymbolDrawing {
         this.items.push(geometry_js_1.Geometry.label(null, x, y, textValue, style));
         return this;
     }
-    addLabelId(id, x, y, textValue, style) {
+    addLabelMils(x, y, textValue, style) {
         x = (0, helpers_js_1.milsToMM)(x);
         y = (0, helpers_js_1.milsToMM)(y);
-        this.items.push(geometry_js_1.Geometry.label(id, x, y, textValue, style));
+        this.items.push(geometry_js_1.Geometry.label(null, x, y, textValue, style));
         return this;
     }
     addTextbox(x, y, textValue, style) {
@@ -880,54 +1018,59 @@ class SymbolDrawing {
         this.items.push(geometry_js_1.Geometry.textbox(null, x, y, textValue, style));
         return this;
     }
-    addModulePort(x, y, width, height, portType = PinTypes_js_1.PinTypes.Any, scaleX = 1) {
-        const height2 = height / 2;
+    addModulePort(x, y, width, height, portType = PinTypes_js_1.PinTypes.Any, scaleX = 1, angle = 0) {
+        const height2 = height.div(2);
         let path = [];
         const arrowSize = (0, helpers_js_1.milsToMM)(30);
         if (portType === PinTypes_js_1.PinTypes.Any) {
             path = [
-                [0, -height2],
-                [width, -height2],
-                [width, +height2],
-                [0, +height2],
-                [0, -height2]
+                [(0, ParamDefinition_js_1.numeric)(0), height2.neg()],
+                [width, height2.neg()],
+                [width, height2],
+                [(0, ParamDefinition_js_1.numeric)(0), height2],
+                [(0, ParamDefinition_js_1.numeric)(0), height2.neg()]
             ];
         }
         else if (portType === PinTypes_js_1.PinTypes.Output) {
             path = [
-                [arrowSize, -height2],
-                [width, -height2],
+                [arrowSize, height2.neg()],
+                [width, height2.neg()],
                 [width, height2],
                 [arrowSize, height2],
-                [0, 0],
-                [arrowSize, -height2]
+                [(0, ParamDefinition_js_1.numeric)(0), (0, ParamDefinition_js_1.numeric)(0)],
+                [arrowSize, height2.neg()]
             ];
         }
         else if (portType === PinTypes_js_1.PinTypes.Input) {
             path = [
-                [0, -height2],
-                [width - arrowSize, -height2],
-                [width, 0],
-                [width - arrowSize, height2],
-                [0, +height2],
-                [0, -height2],
+                [(0, ParamDefinition_js_1.numeric)(0), height2.neg()],
+                [width.sub(arrowSize), height2.neg()],
+                [width, (0, ParamDefinition_js_1.numeric)(0)],
+                [width.sub(arrowSize), height2],
+                [(0, ParamDefinition_js_1.numeric)(0), height2],
+                [(0, ParamDefinition_js_1.numeric)(0), height2.neg()],
             ];
         }
         else if (portType === PinTypes_js_1.PinTypes.IO) {
             path = [
-                [arrowSize, -height2],
-                [width - arrowSize, -height2],
-                [width, 0],
-                [width - arrowSize, +height2],
-                [arrowSize, +height2],
-                [0, 0],
-                [0 + arrowSize, -height2],
+                [arrowSize, height2.neg()],
+                [width.sub(arrowSize), height2.neg()],
+                [width, (0, ParamDefinition_js_1.numeric)(0)],
+                [width.sub(arrowSize), height2],
+                [arrowSize, height2],
+                [(0, ParamDefinition_js_1.numeric)(0), (0, ParamDefinition_js_1.numeric)(0)],
+                [arrowSize, height2.neg()],
             ];
         }
         path = path.map(point => {
-            return [x + point[0] * scaleX, y + point[1]];
+            return [
+                x.add(point[0].mul(scaleX)),
+                y.add(point[1])
+            ];
         });
-        this.items.push(geometry_js_1.Geometry.polygon(path));
+        const polygon = geometry_js_1.Geometry.polygon(path)
+            .rotate(angle * Math.PI / 180, geometry_js_1.Geometry.point(x, y));
+        this.items.push(polygon);
         return this;
     }
     addPath(...pathParts) {
@@ -936,6 +1079,9 @@ class SymbolDrawing {
                 accum = accum.concat(tmp.split(" "));
             }
             else if (typeof tmp === "number") {
+                accum.push((0, ParamDefinition_js_1.numeric)(tmp));
+            }
+            else if (tmp instanceof ParamDefinition_js_1.NumericValue) {
                 accum.push(tmp);
             }
             return accum;
@@ -948,14 +1094,14 @@ class SymbolDrawing {
                 if (currentObj !== null) {
                     geomObjects.push(currentObj);
                 }
-                const x = (0, helpers_js_1.milsToMM)(Number(parts[i + 1]));
-                const y = (0, helpers_js_1.milsToMM)(Number(parts[i + 2]));
+                const x = (0, helpers_js_1.milsToMM)(parts[i + 1]);
+                const y = (0, helpers_js_1.milsToMM)(parts[i + 2]);
                 currentObj = [[x, y]];
                 i += 2;
             }
             else if (command === 'L') {
-                const x = (0, helpers_js_1.milsToMM)(Number(parts[i + 1]));
-                const y = (0, helpers_js_1.milsToMM)(Number(parts[i + 2]));
+                const x = (0, helpers_js_1.milsToMM)(parts[i + 1]);
+                const y = (0, helpers_js_1.milsToMM)(parts[i + 2]);
                 currentObj.push([x, y]);
                 i += 2;
             }
@@ -1001,8 +1147,8 @@ class SymbolDrawing {
         x = (0, helpers_js_1.milsToMM)(x);
         y = (0, helpers_js_1.milsToMM)(y);
         radius = (0, helpers_js_1.milsToMM)(radius);
-        startAngle = startAngle * Math.PI / 180;
-        endAngle = endAngle * Math.PI / 180;
+        startAngle = startAngle.mul(Math.PI).div(180);
+        endAngle = endAngle.mul(Math.PI).div(180);
         this.items.push(geometry_js_1.Geometry.arc([x, y], radius, startAngle, endAngle, true));
         return this;
     }
@@ -1012,7 +1158,7 @@ class SymbolDrawing {
     }
     getPaths() {
         let currentFill = "#fff";
-        let currentLineWidth = 1;
+        let currentLineWidth = (0, ParamDefinition_js_1.numeric)(1);
         let currentLineColor = '#333';
         const pathItems = [];
         this.items.forEach(item => {
@@ -1079,7 +1225,7 @@ class SymbolDrawing {
     }
     getPinPosition(pinId) {
         const pin = this.pins.find(item => {
-            return item[0] === pinId;
+            return item[0].toNumber() === pinId;
         });
         if (pin) {
             const [, feature, angle] = pin;
@@ -1097,32 +1243,28 @@ class SymbolDrawing {
 }
 exports.SymbolDrawing = SymbolDrawing;
 class SymbolDrawingCommands extends SymbolDrawing {
-    constructor(commands) {
+    constructor(callback) {
         super();
         this.id = "";
-        this.commands = commands;
+        this.commands = [];
+        this.paramIds = [];
+        this.callback = callback;
         this.id = Math.random().toString().slice(2);
     }
+    runCommands() {
+        this.commands = this.callback(this.variables);
+    }
     getCommands() {
+        this.runCommands();
         return this.commands;
     }
     clone() {
-        const tmpCommands = this.commands.map(item => {
-            if (item[0] === PlaceHolderCommands.label) {
-                const commandName = item[0];
-                const positionParams = item[1];
-                const keywordParams = item[2];
-                const newMap = new Map();
-                for (const [key, value] of keywordParams) {
-                    newMap.set(key, value);
-                }
-                return [commandName, positionParams, newMap];
-            }
-            else {
-                return [...item];
-            }
-        });
-        return new SymbolDrawingCommands(tmpCommands);
+        const cloned = new SymbolDrawingCommands(this.callback);
+        cloned.variables = this.variables;
+        return cloned;
+    }
+    eq(other) {
+        return this.callback === other.callback;
     }
 }
 exports.SymbolDrawingCommands = SymbolDrawingCommands;