@teachinglab/omd 0.3.1 → 0.3.3

package/omd/core/omdEquationStack.js

@@ -536,4 +536,12 @@ export class omdEquationStack extends jsvgGroup {
         this.updateLayout();
         return true;
     }
+
+    /**
+     * Returns the SVG element for the entire equation stack.
+     * @returns {SVGElement} The SVG element representing the equation stack.
+     */
+    getSvg() {
+        return this.svgObject;
+    }
 } 

package/omd/display/omdDisplay.js

@@ -952,4 +952,12 @@ export class omdDisplay {
     getCurrentNode() {
         return this.node;
     }
+
+    /**
+     * Returns the SVG element for the entire display.
+     * @returns {SVGElement} The SVG element representing the display.
+     */
+    getSVG() {
+        return this.svg.svgObject;
+    }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teachinglab/omd",
-  "version": "0.3.1",
+  "version": "0.3.3",
   "description": "omd",
   "main": "./index.js",
   "module": "./index.js",
@@ -34,6 +34,7 @@
   "dependencies": {
     "@netlify/vite-plugin": "^2.5.4",
     "@teachinglab/jsvg": "0.1.1",
+    "@teachinglab/omd": "^0.3.1",
     "dotenv": "^17.2.1",
     "express": "^4.18.2",
     "mathjs": "^14.5.2",

package/src/omdEquation.js

@@ -114,6 +114,11 @@ export class omdEquation extends omdMetaExpression
 
         this.setWidthAndHeight( this.backRect.width, this.backRect.height );
 
+        // Set individual width/height properties and viewBox for API compatibility
+        this.width = this.backRect.width;
+        this.height = this.backRect.height;
+        this.svgObject.setAttribute('viewBox', `0 0 ${this.width} ${this.height}`);
+
         if ( this.centerEquation )
         {
             var leftShift = this.leftExpression.width + this.equalSign.width*0.50;

package/src/omdExpression.js

@@ -100,5 +100,10 @@ export class omdExpression extends omdMetaExpression
         this.backRect.setWidthAndHeight( W + this.inset*2, 30 );
 
         this.setWidthAndHeight( this.backRect.width, this.backRect.height );
+
+        // Set individual width/height properties and viewBox for API compatibility
+        this.width = this.backRect.width;
+        this.height = this.backRect.height;
+        this.svgObject.setAttribute('viewBox', `0 0 ${this.width} ${this.height}`);
     }
 }

package/src/omdRatioChart.js

@@ -22,9 +22,17 @@ export class omdRatioChart extends jsvgGroup
     {
         if ( typeof data.valueA != "undefined" )
             this.valueA = data.valueA;
+        if ( typeof data.numerator != "undefined" )
+            this.valueA = data.numerator;
 
         if ( typeof data.valueB != "undefined" )
             this.valueB = data.valueB;
+        if ( typeof data.denominator != "undefined" ) {
+            // For fractions: denominator = total tiles, numerator = filled tiles
+            // So valueB should be (denominator - numerator) = unfilled tiles
+            this.valueA = data.numerator;
+            this.valueB = data.denominator - data.numerator;
+        }
 
         if ( typeof data.renderType != "undefined" )
             this.renderType = data.renderType;

package/src/omdShapes.js

@@ -87,6 +87,11 @@ export class omdRightTriangle extends jsvgGroup
             L.initializeWithShapePath( this.shapePath, [A,B,C] );
             this.labelsHolder.addChild( L );
         }
+
+        // Set dimensions and viewBox for API compatibility
+        this.width = this.unitScale * this.horizontalLeg + 20;
+        this.height = this.unitScale * this.verticalLeg + 20;
+        this.svgObject.setAttribute('viewBox', `0 0 ${this.width} ${this.height}`);
     }
 }
 
@@ -154,6 +159,11 @@ export class omdIsoscelesTriangle extends jsvgGroup
             L.initializeWithShapePath( this.shapePath );
             this.labelsHolder.addChild( L );
         }
+
+        // Set dimensions and viewBox for API compatibility
+        this.width = this.unitScale * this.triangleBase + 20;
+        this.height = this.unitScale * this.triangleHeight + 20;
+        this.svgObject.setAttribute('viewBox', `0 0 ${this.width} ${this.height}`);
     }
 }
 
@@ -222,6 +232,11 @@ export class omdRectangle extends jsvgGroup
             L.initializeWithShapePath( this.shapePath, [A,B,"",""] );
             this.labelsHolder.addChild( L );
         }
+
+        // Set dimensions and viewBox for API compatibility
+        this.width = this.unitScale * this.rectWidth + 20;
+        this.height = this.unitScale * this.rectHeight + 20;
+        this.svgObject.setAttribute('viewBox', `0 0 ${this.width} ${this.height}`);
     }
 }
 
@@ -266,6 +281,11 @@ export class omdEllipse extends jsvgGroup
     updateLayout()
     {
         this.shapePath.setWidthAndHeight( this.rectWidth*this.unitScale, this.rectHeight*this.unitScale );
+
+        // Set dimensions and viewBox for API compatibility
+        this.width = this.rectWidth * this.unitScale + 20;
+        this.height = this.rectHeight * this.unitScale + 20;
+        this.svgObject.setAttribute('viewBox', `0 0 ${this.width} ${this.height}`);
     }
 }
 
@@ -305,6 +325,11 @@ export class omdCircle extends jsvgGroup
     updateLayout()
     {
         this.shapePath.setWidthAndHeight( 2.0*this.radius*this.unitScale, 2.0*this.radius*this.unitScale );
+
+        // Set dimensions and viewBox for API compatibility
+        this.width = 2.0 * this.radius * this.unitScale + 20;
+        this.height = 2.0 * this.radius * this.unitScale + 20;
+        this.svgObject.setAttribute('viewBox', `0 0 ${this.width} ${this.height}`);
     }
 }
 
@@ -387,6 +412,11 @@ export class omdRegularPolygon extends jsvgGroup
             L.initializeWithShapePath( this.shapePath, [ A ] );
             this.labelsHolder.addChild( L );
         }
+
+        // Set dimensions and viewBox for API compatibility
+        this.width = 2.0 * this.radius * this.unitScale + 20;
+        this.height = 2.0 * this.radius * this.unitScale + 20;
+        this.svgObject.setAttribute('viewBox', `0 0 ${this.width} ${this.height}`);
     }
 }
 

package/src/omdSpinner.js

@@ -136,7 +136,10 @@ export class omdSpinner extends jsvgGroup
         var A = -90 + 360.0 / this.divisions * (this.arrowPosition-0.5);
         this.arrow.setRotation( A );
 
-
+        // Set dimensions and viewBox for API compatibility
+        this.width = circleSize;
+        this.height = circleSize;
+        this.svgObject.setAttribute('viewBox', `0 0 ${this.width} ${this.height}`);
 
         // var L = new jsvgLine();
         // var lineLength = circleSize*0.4;