@bigbluebutton/tldraw 2.0.0-alpha.19

package/dist-cjs/lib/shapes/geo/components/DrawStyleEllipse.js

@@ -0,0 +1,133 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var DrawStyleEllipse_exports = {};
+__export(DrawStyleEllipse_exports, {
+  DrawStyleEllipse: () => DrawStyleEllipse,
+  DrawStyleEllipseSvg: () => DrawStyleEllipseSvg,
+  getEllipseIndicatorPath: () => getEllipseIndicatorPath,
+  getEllipsePath: () => getEllipsePath,
+  getEllipseStrokeOptions: () => getEllipseStrokeOptions,
+  getEllipseStrokePoints: () => getEllipseStrokePoints
+});
+module.exports = __toCommonJS(DrawStyleEllipse_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_editor = require("@bigbluebutton/editor");
+var React = __toESM(require("react"));
+var import_ShapeFill = require("../../shared/ShapeFill");
+var import_getStrokeOutlinePoints = require("../../shared/freehand/getStrokeOutlinePoints");
+var import_getStrokePoints = require("../../shared/freehand/getStrokePoints");
+var import_setStrokePointRadii = require("../../shared/freehand/setStrokePointRadii");
+var import_svg = require("../../shared/freehand/svg");
+const DrawStyleEllipse = React.memo(function DrawStyleEllipse2({
+  id,
+  w,
+  h,
+  strokeWidth: sw,
+  fill,
+  color
+}) {
+  const theme = (0, import_ShapeFill.useDefaultColorTheme)();
+  const innerPath = getEllipseIndicatorPath(id, w, h, sw);
+  const outerPath = getEllipsePath(id, w, h, sw);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ShapeFill.ShapeFill, { theme, d: innerPath, color, fill }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: outerPath, fill: theme[color].solid, strokeWidth: 0, pointerEvents: "all" })
+  ] });
+});
+function DrawStyleEllipseSvg({
+  id,
+  w,
+  h,
+  strokeWidth: sw,
+  fill,
+  color,
+  theme
+}) {
+  const strokeElement = document.createElementNS("http://www.w3.org/2000/svg", "path");
+  strokeElement.setAttribute("d", getEllipsePath(id, w, h, sw));
+  strokeElement.setAttribute("fill", theme[color].solid);
+  const fillElement = (0, import_ShapeFill.getShapeFillSvg)({
+    d: getEllipseIndicatorPath(id, w, h, sw),
+    fill,
+    color,
+    theme
+  });
+  return (0, import_ShapeFill.getSvgWithShapeFill)(strokeElement, fillElement);
+}
+function getEllipseStrokeOptions(strokeWidth) {
+  return {
+    size: 1 + strokeWidth,
+    thinning: 0.25,
+    end: { taper: strokeWidth },
+    start: { taper: strokeWidth },
+    streamline: 0,
+    smoothing: 1,
+    simulatePressure: false
+  };
+}
+function getEllipseStrokePoints(id, width, height, strokeWidth) {
+  const getRandom = (0, import_editor.rng)(id);
+  const rx = width / 2;
+  const ry = height / 2;
+  const perimeter = (0, import_editor.perimeterOfEllipse)(rx, ry);
+  const points = [];
+  const start = import_editor.PI2 * getRandom();
+  const length = import_editor.PI2 + import_editor.TAU / 2 + Math.abs(getRandom()) * import_editor.TAU;
+  const count = Math.max(16, perimeter / 10);
+  for (let i = 0; i < count; i++) {
+    const t = i / (count - 1);
+    const r = start + t * length;
+    const c = Math.cos(r);
+    const s = Math.sin(r);
+    points.push(
+      new import_editor.Vec2d(
+        rx * c + width * 0.5 + 0.05 * getRandom(),
+        ry * s + height / 2 + 0.05 * getRandom(),
+        Math.min(
+          1,
+          0.5 + Math.abs(0.5 - (getRandom() > 0 ? import_editor.EASINGS.easeInOutSine(t) : import_editor.EASINGS.easeInExpo(t))) / 2
+        )
+      )
+    );
+  }
+  return (0, import_getStrokePoints.getStrokePoints)(points, getEllipseStrokeOptions(strokeWidth));
+}
+function getEllipsePath(id, width, height, strokeWidth) {
+  const options = getEllipseStrokeOptions(strokeWidth);
+  return (0, import_editor.getSvgPathFromPoints)(
+    (0, import_getStrokeOutlinePoints.getStrokeOutlinePoints)(
+      (0, import_setStrokePointRadii.setStrokePointRadii)(getEllipseStrokePoints(id, width, height, strokeWidth), options),
+      options
+    )
+  );
+}
+function getEllipseIndicatorPath(id, width, height, strokeWidth) {
+  return (0, import_svg.getSvgPathFromStrokePoints)(getEllipseStrokePoints(id, width, height, strokeWidth));
+}
+//# sourceMappingURL=DrawStyleEllipse.js.map

package/dist-cjs/lib/shapes/geo/components/DrawStyleEllipse.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/lib/shapes/geo/components/DrawStyleEllipse.tsx"],
+  "sourcesContent": ["import {\n\tEASINGS,\n\tPI2,\n\tTAU,\n\tTLDefaultColorTheme,\n\tTLGeoShape,\n\tTLShapeId,\n\tVec2d,\n\tgetSvgPathFromPoints,\n\tperimeterOfEllipse,\n\trng,\n} from '@bigbluebutton/editor'\n\nimport * as React from 'react'\nimport {\n\tShapeFill,\n\tgetShapeFillSvg,\n\tgetSvgWithShapeFill,\n\tuseDefaultColorTheme,\n} from '../../shared/ShapeFill'\nimport { getStrokeOutlinePoints } from '../../shared/freehand/getStrokeOutlinePoints'\nimport { getStrokePoints } from '../../shared/freehand/getStrokePoints'\nimport { setStrokePointRadii } from '../../shared/freehand/setStrokePointRadii'\nimport { getSvgPathFromStrokePoints } from '../../shared/freehand/svg'\n\nexport const DrawStyleEllipse = React.memo(function DrawStyleEllipse({\n\tid,\n\tw,\n\th,\n\tstrokeWidth: sw,\n\tfill,\n\tcolor,\n}: Pick<TLGeoShape['props'], 'w' | 'h' | 'fill' | 'color'> & {\n\tstrokeWidth: number\n\tid: TLShapeId\n}) {\n\tconst theme = useDefaultColorTheme()\n\tconst innerPath = getEllipseIndicatorPath(id, w, h, sw)\n\tconst outerPath = getEllipsePath(id, w, h, sw)\n\n\treturn (\n\t\t<>\n\t\t\t<ShapeFill theme={theme} d={innerPath} color={color} fill={fill} />\n\t\t\t<path d={outerPath} fill={theme[color].solid} strokeWidth={0} pointerEvents=\"all\" />\n\t\t</>\n\t)\n})\n\nexport function DrawStyleEllipseSvg({\n\tid,\n\tw,\n\th,\n\tstrokeWidth: sw,\n\tfill,\n\tcolor,\n\ttheme,\n}: Pick<TLGeoShape['props'], 'w' | 'h' | 'fill' | 'color'> & {\n\tstrokeWidth: number\n\tid: TLShapeId\n\ttheme: TLDefaultColorTheme\n}) {\n\tconst strokeElement = document.createElementNS('http://www.w3.org/2000/svg', 'path')\n\tstrokeElement.setAttribute('d', getEllipsePath(id, w, h, sw))\n\tstrokeElement.setAttribute('fill', theme[color].solid)\n\n\t// Get the fill element, if any\n\tconst fillElement = getShapeFillSvg({\n\t\td: getEllipseIndicatorPath(id, w, h, sw),\n\t\tfill,\n\t\tcolor,\n\t\ttheme,\n\t})\n\n\treturn getSvgWithShapeFill(strokeElement, fillElement)\n}\n\nexport function getEllipseStrokeOptions(strokeWidth: number) {\n\treturn {\n\t\tsize: 1 + strokeWidth,\n\t\tthinning: 0.25,\n\t\tend: { taper: strokeWidth },\n\t\tstart: { taper: strokeWidth },\n\t\tstreamline: 0,\n\t\tsmoothing: 1,\n\t\tsimulatePressure: false,\n\t}\n}\n\nexport function getEllipseStrokePoints(\n\tid: string,\n\twidth: number,\n\theight: number,\n\tstrokeWidth: number\n) {\n\tconst getRandom = rng(id)\n\n\tconst rx = width / 2\n\tconst ry = height / 2\n\tconst perimeter = perimeterOfEllipse(rx, ry)\n\n\tconst points: Vec2d[] = []\n\n\tconst start = PI2 * getRandom()\n\tconst length = PI2 + TAU / 2 + Math.abs(getRandom()) * TAU\n\tconst count = Math.max(16, perimeter / 10)\n\n\tfor (let i = 0; i < count; i++) {\n\t\tconst t = i / (count - 1)\n\t\tconst r = start + t * length\n\t\tconst c = Math.cos(r)\n\t\tconst s = Math.sin(r)\n\t\tpoints.push(\n\t\t\tnew Vec2d(\n\t\t\t\trx * c + width * 0.5 + 0.05 * getRandom(),\n\t\t\t\try * s + height / 2 + 0.05 * getRandom(),\n\t\t\t\tMath.min(\n\t\t\t\t\t1,\n\t\t\t\t\t0.5 +\n\t\t\t\t\t\tMath.abs(0.5 - (getRandom() > 0 ? EASINGS.easeInOutSine(t) : EASINGS.easeInExpo(t))) / 2\n\t\t\t\t)\n\t\t\t)\n\t\t)\n\t}\n\n\treturn getStrokePoints(points, getEllipseStrokeOptions(strokeWidth))\n}\n\nexport function getEllipsePath(id: string, width: number, height: number, strokeWidth: number) {\n\tconst options = getEllipseStrokeOptions(strokeWidth)\n\treturn getSvgPathFromPoints(\n\t\tgetStrokeOutlinePoints(\n\t\t\tsetStrokePointRadii(getEllipseStrokePoints(id, width, height, strokeWidth), options),\n\t\t\toptions\n\t\t)\n\t)\n}\n\nexport function getEllipseIndicatorPath(\n\tid: string,\n\twidth: number,\n\theight: number,\n\tstrokeWidth: number\n) {\n\treturn getSvgPathFromStrokePoints(getEllipseStrokePoints(id, width, height, strokeWidth))\n}\n"],
+  "mappings": "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",
+  "names": ["DrawStyleEllipse"]
+}

package/dist-cjs/lib/shapes/geo/components/DrawStylePolygon.js

@@ -0,0 +1,93 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var DrawStylePolygon_exports = {};
+__export(DrawStylePolygon_exports, {
+  DrawStylePolygon: () => DrawStylePolygon,
+  DrawStylePolygonSvg: () => DrawStylePolygonSvg
+});
+module.exports = __toCommonJS(DrawStylePolygon_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var React = __toESM(require("react"));
+var import_ShapeFill = require("../../shared/ShapeFill");
+var import_polygon_helpers = require("../../shared/polygon-helpers");
+const DrawStylePolygon = React.memo(function DrawStylePolygon2({
+  id,
+  outline,
+  lines,
+  fill,
+  color,
+  strokeWidth
+}) {
+  const theme = (0, import_ShapeFill.useDefaultColorTheme)();
+  const polygonPoints = (0, import_polygon_helpers.getRoundedPolygonPoints)(id, outline, strokeWidth / 3, strokeWidth * 2, 2);
+  let strokePathData = (0, import_polygon_helpers.getRoundedInkyPolygonPath)(polygonPoints);
+  if (lines) {
+    for (const [A, B] of lines) {
+      strokePathData += `M${A.x},${A.y}L${B.x},${B.y}`;
+    }
+  }
+  const innerPolygonPoints = (0, import_polygon_helpers.getRoundedPolygonPoints)(id, outline, 0, strokeWidth * 2, 1);
+  const innerPathData = (0, import_polygon_helpers.getRoundedInkyPolygonPath)(innerPolygonPoints);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ShapeFill.ShapeFill, { d: innerPathData, fill, color, theme }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: strokePathData, stroke: theme[color].solid, strokeWidth, fill: "none" })
+  ] });
+});
+function DrawStylePolygonSvg({
+  id,
+  outline,
+  lines,
+  fill,
+  color,
+  theme,
+  strokeWidth
+}) {
+  const polygonPoints = (0, import_polygon_helpers.getRoundedPolygonPoints)(id, outline, strokeWidth / 3, strokeWidth * 2, 2);
+  let strokePathData = (0, import_polygon_helpers.getRoundedInkyPolygonPath)(polygonPoints);
+  if (lines) {
+    for (const [A, B] of lines) {
+      strokePathData += `M${A.x},${A.y}L${B.x},${B.y}`;
+    }
+  }
+  const innerPolygonPoints = (0, import_polygon_helpers.getRoundedPolygonPoints)(id, outline, 0, strokeWidth * 2, 1);
+  const innerPathData = (0, import_polygon_helpers.getRoundedInkyPolygonPath)(innerPolygonPoints);
+  const strokeElement = document.createElementNS("http://www.w3.org/2000/svg", "path");
+  strokeElement.setAttribute("d", strokePathData);
+  strokeElement.setAttribute("fill", "none");
+  strokeElement.setAttribute("stroke", theme[color].solid);
+  strokeElement.setAttribute("stroke-width", strokeWidth.toString());
+  const fillElement = (0, import_ShapeFill.getShapeFillSvg)({
+    d: innerPathData,
+    fill,
+    color,
+    theme
+  });
+  return (0, import_ShapeFill.getSvgWithShapeFill)(strokeElement, fillElement);
+}
+//# sourceMappingURL=DrawStylePolygon.js.map

package/dist-cjs/lib/shapes/geo/components/DrawStylePolygon.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/lib/shapes/geo/components/DrawStylePolygon.tsx"],
+  "sourcesContent": ["import { TLDefaultColorTheme, TLGeoShape, VecLike } from '@bigbluebutton/editor'\nimport * as React from 'react'\nimport {\n\tShapeFill,\n\tgetShapeFillSvg,\n\tgetSvgWithShapeFill,\n\tuseDefaultColorTheme,\n} from '../../shared/ShapeFill'\nimport { getRoundedInkyPolygonPath, getRoundedPolygonPoints } from '../../shared/polygon-helpers'\n\nexport const DrawStylePolygon = React.memo(function DrawStylePolygon({\n\tid,\n\toutline,\n\tlines,\n\tfill,\n\tcolor,\n\tstrokeWidth,\n}: Pick<TLGeoShape['props'], 'fill' | 'color'> & {\n\tid: TLGeoShape['id']\n\toutline: VecLike[]\n\tstrokeWidth: number\n\tlines?: VecLike[][]\n}) {\n\tconst theme = useDefaultColorTheme()\n\tconst polygonPoints = getRoundedPolygonPoints(id, outline, strokeWidth / 3, strokeWidth * 2, 2)\n\tlet strokePathData = getRoundedInkyPolygonPath(polygonPoints)\n\n\tif (lines) {\n\t\tfor (const [A, B] of lines) {\n\t\t\tstrokePathData += `M${A.x},${A.y}L${B.x},${B.y}`\n\t\t}\n\t}\n\n\tconst innerPolygonPoints = getRoundedPolygonPoints(id, outline, 0, strokeWidth * 2, 1)\n\tconst innerPathData = getRoundedInkyPolygonPath(innerPolygonPoints)\n\n\treturn (\n\t\t<>\n\t\t\t<ShapeFill d={innerPathData} fill={fill} color={color} theme={theme} />\n\t\t\t<path d={strokePathData} stroke={theme[color].solid} strokeWidth={strokeWidth} fill=\"none\" />\n\t\t</>\n\t)\n})\n\nexport function DrawStylePolygonSvg({\n\tid,\n\toutline,\n\tlines,\n\tfill,\n\tcolor,\n\ttheme,\n\tstrokeWidth,\n}: Pick<TLGeoShape['props'], 'fill' | 'color'> & {\n\tid: TLGeoShape['id']\n\toutline: VecLike[]\n\tlines?: VecLike[][]\n\tstrokeWidth: number\n\ttheme: TLDefaultColorTheme\n}) {\n\tconst polygonPoints = getRoundedPolygonPoints(id, outline, strokeWidth / 3, strokeWidth * 2, 2)\n\n\tlet strokePathData = getRoundedInkyPolygonPath(polygonPoints)\n\n\tif (lines) {\n\t\tfor (const [A, B] of lines) {\n\t\t\tstrokePathData += `M${A.x},${A.y}L${B.x},${B.y}`\n\t\t}\n\t}\n\n\tconst innerPolygonPoints = getRoundedPolygonPoints(id, outline, 0, strokeWidth * 2, 1)\n\tconst innerPathData = getRoundedInkyPolygonPath(innerPolygonPoints)\n\n\tconst strokeElement = document.createElementNS('http://www.w3.org/2000/svg', 'path')\n\tstrokeElement.setAttribute('d', strokePathData)\n\tstrokeElement.setAttribute('fill', 'none')\n\tstrokeElement.setAttribute('stroke', theme[color].solid)\n\tstrokeElement.setAttribute('stroke-width', strokeWidth.toString())\n\n\t// Get the fill element, if any\n\tconst fillElement = getShapeFillSvg({\n\t\td: innerPathData,\n\t\tfill,\n\t\tcolor,\n\t\ttheme,\n\t})\n\n\treturn getSvgWithShapeFill(strokeElement, fillElement)\n}\n\n// function getPolygonDrawPoints(id: string, outline: VecLike[], strokeWidth: number) {\n// \tconst points: Vec2d[] = []\n\n// \tconst getRandom = rng(id)\n\n// \tconst start = Math.round(Math.abs(getRandom()) * outline.length)\n\n// \tconst corners = outline.map((p) =>\n// \t\tVec2d.AddXY(p, (getRandom() * strokeWidth) / 4, (getRandom() * strokeWidth) / 4)\n// \t)\n\n// \tconst len = corners.length\n\n// \tfor (let i = 0, n = len + 1; i < n; i++) {\n// \t\tconst At = corners[(start + i) % len]\n// \t\tconst Bt = corners[(start + i + 1) % len]\n\n// \t\tconst dist = Math.min(Vec2d.Dist(At, Bt) / 2, strokeWidth / 2)\n// \t\tconst A = Vec2d.Nudge(At, Bt, dist)\n\n// \t\tconst D = Vec2d.Med(At, Bt)\n\n// \t\tif (i === 0) {\n// \t\t\tBt.z = 0.7\n// \t\t\tpoints.push(new Vec2d(D.x, D.y, 0.7), Bt)\n// \t\t} else if (i === outline.length) {\n// \t\t\tconst lastSegPoints = Vec2d.PointsBetween(A, D, 4)\n// \t\t\tlastSegPoints.forEach((p) => (p.z = 0.7))\n// \t\t\tpoints.push(...lastSegPoints)\n// \t\t} else {\n// \t\t\tpoints.push(...Vec2d.PointsBetween(A, Bt, 6))\n// \t\t}\n// \t}\n\n// \treturn points\n// }\n\n// export function getPolygonIndicatorPath(id: string, outline: VecLike[], strokeWidth: number) {\n// \tconst points = getPolygonDrawPoints(id, outline, strokeWidth)\n// \tconst options = getPolygonStrokeOptions(strokeWidth)\n// \tconst strokePoints = getStrokePoints(points, options)\n\n// \treturn getSvgPathFromStrokePoints(strokePoints, true)\n// }\n\n// function getPolygonStrokeOptions(strokeWidth: number) {\n// \treturn {\n// \t\tsize: 1 + strokeWidth * 0.618,\n// \t\tlast: true,\n// \t\tsimulatePressure: false,\n// \t\tstreamline: 0.25,\n// \t\tthinning: 0.9,\n// \t}\n// }\n\n// function getPolygonstrokePathData(id: string, outline: VecLike[], strokeWidth: number) {\n// \t// draw a line between all of the points\n// \tlet d = `M${outline[0].x},${outline[0].y}`\n// \td += 'Z'\n\n// \tfor (const { x, y } of outline) {\n// \t\td += `${x},${y}`\n// \t}\n\n// \treturn d\n// }\n\n// function SimpleInkyPolygon(id: string, outline: VecLike[], offset: number) {\n// \tconst random = rng(id)\n// \tlet p = outline[0]\n\n// \tlet ox = random() * offset\n// \tlet oy = random() * offset\n\n// \tlet polylineA = `M${p.x - ox},${p.y - oy}L`\n// \tlet polylineB = `${p.x + ox},${p.y + oy} `\n\n// \tfor (let i = 1, n = outline.length; i < n; i++) {\n// \t\tp = outline[i]\n// \t\tox = random() * offset\n// \t\toy = random() * offset\n\n// \t\tpolylineA += `${p.x - ox},${p.y - oy} `\n// \t\tpolylineB += `${p.x + ox},${p.y + oy} `\n// \t}\n\n// \tpolylineB += 'Z'\n\n// \tpolylineA += polylineB\n\n// \treturn polylineA\n// }\n\n// function CubicInkyPolygon(id: string, outline: VecLike[], offset: number) {\n// \tconst random = rng(id)\n// \tlet p0 = outline[0]\n// \tlet p1 = p0\n\n// \tlet ox: number\n// \tlet oy: number\n\n// \tlet polylineA = `M${p0.x},${p0.y} L`\n// \tlet polylineB = `M${p0.x},${p0.y}`\n\n// \tfor (let i = 0, n = outline.length; i < n; i++) {\n// \t\tp0 = outline[i]\n// \t\tp1 = outline[(i + 1) % n]\n\n// \t\tpolylineA += `${p1.x},${p1.y} `\n\n// \t\tox = random() * offset\n// \t\toy = random() * offset\n// \t\tconst c1 = Vec2d.Lrp(p0, p1, 0.25)\n// \t\tconst c2 = Vec2d.Lrp(p0, p1, 0.75)\n\n// \t\tpolylineB += `C${c1.x + ox},${c1.y + oy} ${c2.x - ox},${c2.y - oy} ${p1.x},${p1.y}`\n// \t}\n\n// \tpolylineB += 'Z'\n\n// \tpolylineA += polylineB\n\n// \treturn polylineA\n// }\n\n// function QuadraticInkyPolygon(id: string, outline: VecLike[], offset: number) {\n// \tconst random = rng(id)\n// \tlet p0 = outline[0]\n// \tlet p1 = p0\n\n// \tlet polylineA = `M${p0.x},${p0.y} Q`\n\n// \tconst len = outline.length\n\n// \tfor (let i = 0, n = len * 2; i < n; i++) {\n// \t\tp0 = outline[i % len]\n// \t\tp1 = outline[(i + 1) % len]\n// \t\tconst dist = Vec2d.Dist(p0, p1)\n\n// \t\tconst c1 = Vec2d.Lrp(p0, p1, 0.5 + random() / 2)\n// \t\tpolylineA += `${c1.x + random() * Math.min(dist / 10, offset)},${\n// \t\t\tc1.y + random() * Math.min(dist / 10, offset)\n// \t\t} ${p1.x + (random() * offset) / 2},${p1.y + (random() * offset) / 2} `\n// \t}\n\n// \tpolylineA += 'Z'\n\n// \treturn polylineA\n// }\n\n// function GlobyInkyPolygon(id: string, outline: VecLike[], offset: number) {\n// \tconst random = rng(id)\n// \tlet p0 = outline[0]\n// \tlet p1 = p0\n\n// \tlet polylineA = `M${p0.x},${p0.y} Q`\n\n// \tconst len = outline.length\n\n// \tfor (let i = 0, n = len * 2; i < n; i++) {\n// \t\tp0 = outline[i % len]\n// \t\tp1 = outline[(i + 1) % len]\n// \t\tconst dist = Vec2d.Dist(p0, p1)\n\n// \t\tconst c1 = Vec2d.Lrp(p0, p1, 0.5 + random() / 2)\n// \t\tpolylineA += `${c1.x + random() * Math.min(dist / 10, offset)},${\n// \t\t\tc1.y + random() * Math.min(dist / 10, offset)\n// \t\t} ${p1.x + (random() * offset) / 2},${p1.y + (random() * offset) / 2} `\n// \t}\n\n// \tpolylineA += 'Z'\n\n// \treturn polylineA\n// }\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqCE;AApCF,YAAuB;AACvB,uBAKO;AACP,6BAAmE;AAE5D,MAAM,mBAAmB,MAAM,KAAK,SAASA,kBAAiB;AAAA,EACpE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAKG;AACF,QAAM,YAAQ,uCAAqB;AACnC,QAAM,oBAAgB,gDAAwB,IAAI,SAAS,cAAc,GAAG,cAAc,GAAG,CAAC;AAC9F,MAAI,qBAAiB,kDAA0B,aAAa;AAE5D,MAAI,OAAO;AACV,eAAW,CAAC,GAAG,CAAC,KAAK,OAAO;AAC3B,wBAAkB,IAAI,EAAE,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,CAAC;AAAA,IAC/C;AAAA,EACD;AAEA,QAAM,yBAAqB,gDAAwB,IAAI,SAAS,GAAG,cAAc,GAAG,CAAC;AACrF,QAAM,oBAAgB,kDAA0B,kBAAkB;AAElE,SACC,4EACC;AAAA,gDAAC,8BAAU,GAAG,eAAe,MAAY,OAAc,OAAc;AAAA,IACrE,4CAAC,UAAK,GAAG,gBAAgB,QAAQ,MAAM,KAAK,EAAE,OAAO,aAA0B,MAAK,QAAO;AAAA,KAC5F;AAEF,CAAC;AAEM,SAAS,oBAAoB;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAMG;AACF,QAAM,oBAAgB,gDAAwB,IAAI,SAAS,cAAc,GAAG,cAAc,GAAG,CAAC;AAE9F,MAAI,qBAAiB,kDAA0B,aAAa;AAE5D,MAAI,OAAO;AACV,eAAW,CAAC,GAAG,CAAC,KAAK,OAAO;AAC3B,wBAAkB,IAAI,EAAE,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,CAAC,IAAI,EAAE,CAAC;AAAA,IAC/C;AAAA,EACD;AAEA,QAAM,yBAAqB,gDAAwB,IAAI,SAAS,GAAG,cAAc,GAAG,CAAC;AACrF,QAAM,oBAAgB,kDAA0B,kBAAkB;AAElE,QAAM,gBAAgB,SAAS,gBAAgB,8BAA8B,MAAM;AACnF,gBAAc,aAAa,KAAK,cAAc;AAC9C,gBAAc,aAAa,QAAQ,MAAM;AACzC,gBAAc,aAAa,UAAU,MAAM,KAAK,EAAE,KAAK;AACvD,gBAAc,aAAa,gBAAgB,YAAY,SAAS,CAAC;AAGjE,QAAM,kBAAc,kCAAgB;AAAA,IACnC,GAAG;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AAED,aAAO,sCAAoB,eAAe,WAAW;AACtD;",
+  "names": ["DrawStylePolygon"]
+}

package/dist-cjs/lib/shapes/geo/components/SolidStyleCloud.js

@@ -0,0 +1,79 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var SolidStyleCloud_exports = {};
+__export(SolidStyleCloud_exports, {
+  SolidStyleCloud: () => SolidStyleCloud,
+  SolidStyleCloudSvg: () => SolidStyleCloudSvg
+});
+module.exports = __toCommonJS(SolidStyleCloud_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var React = __toESM(require("react"));
+var import_ShapeFill = require("../../shared/ShapeFill");
+var import_cloudOutline = require("../cloudOutline");
+const SolidStyleCloud = React.memo(function SolidStyleCloud2({
+  fill,
+  color,
+  strokeWidth,
+  w,
+  h,
+  id,
+  size
+}) {
+  const theme = (0, import_ShapeFill.useDefaultColorTheme)();
+  const path = (0, import_cloudOutline.cloudSvgPath)(w, h, id, size);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ShapeFill.ShapeFill, { theme, d: path, fill, color }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: path, stroke: theme[color].solid, strokeWidth, fill: "none" })
+  ] });
+});
+function SolidStyleCloudSvg({
+  fill,
+  color,
+  strokeWidth,
+  theme,
+  w,
+  h,
+  id,
+  size
+}) {
+  const pathData = (0, import_cloudOutline.cloudSvgPath)(w, h, id, size);
+  const strokeElement = document.createElementNS("http://www.w3.org/2000/svg", "path");
+  strokeElement.setAttribute("d", pathData);
+  strokeElement.setAttribute("stroke-width", strokeWidth.toString());
+  strokeElement.setAttribute("stroke", theme[color].solid);
+  strokeElement.setAttribute("fill", "none");
+  const fillElement = (0, import_ShapeFill.getShapeFillSvg)({
+    d: pathData,
+    fill,
+    color,
+    theme
+  });
+  return (0, import_ShapeFill.getSvgWithShapeFill)(strokeElement, fillElement);
+}
+//# sourceMappingURL=SolidStyleCloud.js.map

package/dist-cjs/lib/shapes/geo/components/SolidStyleCloud.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/lib/shapes/geo/components/SolidStyleCloud.tsx"],
+  "sourcesContent": ["import { TLDefaultColorTheme, TLGeoShape, TLShapeId } from '@bigbluebutton/editor'\nimport * as React from 'react'\nimport {\n\tShapeFill,\n\tgetShapeFillSvg,\n\tgetSvgWithShapeFill,\n\tuseDefaultColorTheme,\n} from '../../shared/ShapeFill'\nimport { cloudSvgPath } from '../cloudOutline'\n\nexport const SolidStyleCloud = React.memo(function SolidStyleCloud({\n\tfill,\n\tcolor,\n\tstrokeWidth,\n\tw,\n\th,\n\tid,\n\tsize,\n}: Pick<TLGeoShape['props'], 'fill' | 'color' | 'w' | 'h' | 'size'> & {\n\tstrokeWidth: number\n\tid: TLShapeId\n}) {\n\tconst theme = useDefaultColorTheme()\n\tconst path = cloudSvgPath(w, h, id, size)\n\n\treturn (\n\t\t<>\n\t\t\t<ShapeFill theme={theme} d={path} fill={fill} color={color} />\n\t\t\t<path d={path} stroke={theme[color].solid} strokeWidth={strokeWidth} fill=\"none\" />\n\t\t</>\n\t)\n})\n\nexport function SolidStyleCloudSvg({\n\tfill,\n\tcolor,\n\tstrokeWidth,\n\ttheme,\n\tw,\n\th,\n\tid,\n\tsize,\n}: Pick<TLGeoShape['props'], 'fill' | 'color' | 'w' | 'h' | 'size'> & {\n\tstrokeWidth: number\n\ttheme: TLDefaultColorTheme\n\tid: TLShapeId\n}) {\n\tconst pathData = cloudSvgPath(w, h, id, size)\n\n\tconst strokeElement = document.createElementNS('http://www.w3.org/2000/svg', 'path')\n\tstrokeElement.setAttribute('d', pathData)\n\tstrokeElement.setAttribute('stroke-width', strokeWidth.toString())\n\tstrokeElement.setAttribute('stroke', theme[color].solid)\n\tstrokeElement.setAttribute('fill', 'none')\n\n\t// Get the fill element, if any\n\tconst fillElement = getShapeFillSvg({\n\t\td: pathData,\n\t\tfill,\n\t\tcolor,\n\t\ttheme,\n\t})\n\n\treturn getSvgWithShapeFill(strokeElement, fillElement)\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA0BE;AAzBF,YAAuB;AACvB,uBAKO;AACP,0BAA6B;AAEtB,MAAM,kBAAkB,MAAM,KAAK,SAASA,iBAAgB;AAAA,EAClE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAGG;AACF,QAAM,YAAQ,uCAAqB;AACnC,QAAM,WAAO,kCAAa,GAAG,GAAG,IAAI,IAAI;AAExC,SACC,4EACC;AAAA,gDAAC,8BAAU,OAAc,GAAG,MAAM,MAAY,OAAc;AAAA,IAC5D,4CAAC,UAAK,GAAG,MAAM,QAAQ,MAAM,KAAK,EAAE,OAAO,aAA0B,MAAK,QAAO;AAAA,KAClF;AAEF,CAAC;AAEM,SAAS,mBAAmB;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAIG;AACF,QAAM,eAAW,kCAAa,GAAG,GAAG,IAAI,IAAI;AAE5C,QAAM,gBAAgB,SAAS,gBAAgB,8BAA8B,MAAM;AACnF,gBAAc,aAAa,KAAK,QAAQ;AACxC,gBAAc,aAAa,gBAAgB,YAAY,SAAS,CAAC;AACjE,gBAAc,aAAa,UAAU,MAAM,KAAK,EAAE,KAAK;AACvD,gBAAc,aAAa,QAAQ,MAAM;AAGzC,QAAM,kBAAc,kCAAgB;AAAA,IACnC,GAAG;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AAED,aAAO,sCAAoB,eAAe,WAAW;AACtD;",
+  "names": ["SolidStyleCloud"]
+}

package/dist-cjs/lib/shapes/geo/components/SolidStyleEllipse.js

@@ -0,0 +1,84 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var SolidStyleEllipse_exports = {};
+__export(SolidStyleEllipse_exports, {
+  SolidStyleEllipse: () => SolidStyleEllipse,
+  SolidStyleEllipseSvg: () => SolidStyleEllipseSvg
+});
+module.exports = __toCommonJS(SolidStyleEllipse_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var React = __toESM(require("react"));
+var import_ShapeFill = require("../../shared/ShapeFill");
+const SolidStyleEllipse = React.memo(function SolidStyleEllipse2({
+  w,
+  h,
+  strokeWidth: sw,
+  fill,
+  color
+}) {
+  const theme = (0, import_ShapeFill.useDefaultColorTheme)();
+  const cx = w / 2;
+  const cy = h / 2;
+  const rx = Math.max(0, cx);
+  const ry = Math.max(0, cy);
+  const d = `M${cx - rx},${cy}a${rx},${ry},0,1,1,${rx * 2},0a${rx},${ry},0,1,1,-${rx * 2},0`;
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ShapeFill.ShapeFill, { d, color, fill, theme }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d, stroke: theme[color].solid, strokeWidth: sw, fill: "none" })
+  ] });
+});
+function SolidStyleEllipseSvg({
+  w,
+  h,
+  strokeWidth: sw,
+  fill,
+  color,
+  theme
+}) {
+  const cx = w / 2;
+  const cy = h / 2;
+  const rx = Math.max(0, cx);
+  const ry = Math.max(0, cy);
+  const d = `M${cx - rx},${cy}a${rx},${ry},0,1,1,${rx * 2},0a${rx},${ry},0,1,1,-${rx * 2},0`;
+  const strokeElement = document.createElementNS("http://www.w3.org/2000/svg", "path");
+  strokeElement.setAttribute("d", d);
+  strokeElement.setAttribute("stroke-width", sw.toString());
+  strokeElement.setAttribute("width", w.toString());
+  strokeElement.setAttribute("height", h.toString());
+  strokeElement.setAttribute("fill", "none");
+  strokeElement.setAttribute("stroke", theme[color].solid);
+  const fillElement = (0, import_ShapeFill.getShapeFillSvg)({
+    d,
+    fill,
+    color,
+    theme
+  });
+  return (0, import_ShapeFill.getSvgWithShapeFill)(strokeElement, fillElement);
+}
+//# sourceMappingURL=SolidStyleEllipse.js.map

package/dist-cjs/lib/shapes/geo/components/SolidStyleEllipse.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/lib/shapes/geo/components/SolidStyleEllipse.tsx"],
+  "sourcesContent": ["import { TLDefaultColorTheme, TLGeoShape } from '@bigbluebutton/editor'\nimport * as React from 'react'\nimport {\n\tShapeFill,\n\tgetShapeFillSvg,\n\tgetSvgWithShapeFill,\n\tuseDefaultColorTheme,\n} from '../../shared/ShapeFill'\n\nexport const SolidStyleEllipse = React.memo(function SolidStyleEllipse({\n\tw,\n\th,\n\tstrokeWidth: sw,\n\tfill,\n\tcolor,\n}: Pick<TLGeoShape['props'], 'w' | 'h' | 'fill' | 'color'> & { strokeWidth: number }) {\n\tconst theme = useDefaultColorTheme()\n\tconst cx = w / 2\n\tconst cy = h / 2\n\tconst rx = Math.max(0, cx)\n\tconst ry = Math.max(0, cy)\n\n\tconst d = `M${cx - rx},${cy}a${rx},${ry},0,1,1,${rx * 2},0a${rx},${ry},0,1,1,-${rx * 2},0`\n\n\treturn (\n\t\t<>\n\t\t\t<ShapeFill d={d} color={color} fill={fill} theme={theme} />\n\t\t\t<path d={d} stroke={theme[color].solid} strokeWidth={sw} fill=\"none\" />\n\t\t</>\n\t)\n})\n\nexport function SolidStyleEllipseSvg({\n\tw,\n\th,\n\tstrokeWidth: sw,\n\tfill,\n\tcolor,\n\ttheme,\n}: Pick<TLGeoShape['props'], 'w' | 'h' | 'fill' | 'color'> & {\n\tstrokeWidth: number\n\ttheme: TLDefaultColorTheme\n}) {\n\tconst cx = w / 2\n\tconst cy = h / 2\n\tconst rx = Math.max(0, cx)\n\tconst ry = Math.max(0, cy)\n\n\tconst d = `M${cx - rx},${cy}a${rx},${ry},0,1,1,${rx * 2},0a${rx},${ry},0,1,1,-${rx * 2},0`\n\n\tconst strokeElement = document.createElementNS('http://www.w3.org/2000/svg', 'path')\n\tstrokeElement.setAttribute('d', d)\n\tstrokeElement.setAttribute('stroke-width', sw.toString())\n\tstrokeElement.setAttribute('width', w.toString())\n\tstrokeElement.setAttribute('height', h.toString())\n\tstrokeElement.setAttribute('fill', 'none')\n\tstrokeElement.setAttribute('stroke', theme[color].solid)\n\n\t// Get the fill element, if any\n\tconst fillElement = getShapeFillSvg({\n\t\td,\n\t\tfill,\n\t\tcolor,\n\t\ttheme,\n\t})\n\n\treturn getSvgWithShapeFill(strokeElement, fillElement)\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyBE;AAxBF,YAAuB;AACvB,uBAKO;AAEA,MAAM,oBAAoB,MAAM,KAAK,SAASA,mBAAkB;AAAA,EACtE;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AACD,GAAsF;AACrF,QAAM,YAAQ,uCAAqB;AACnC,QAAM,KAAK,IAAI;AACf,QAAM,KAAK,IAAI;AACf,QAAM,KAAK,KAAK,IAAI,GAAG,EAAE;AACzB,QAAM,KAAK,KAAK,IAAI,GAAG,EAAE;AAEzB,QAAM,IAAI,IAAI,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,KAAK,CAAC,MAAM,EAAE,IAAI,EAAE,WAAW,KAAK,CAAC;AAEtF,SACC,4EACC;AAAA,gDAAC,8BAAU,GAAM,OAAc,MAAY,OAAc;AAAA,IACzD,4CAAC,UAAK,GAAM,QAAQ,MAAM,KAAK,EAAE,OAAO,aAAa,IAAI,MAAK,QAAO;AAAA,KACtE;AAEF,CAAC;AAEM,SAAS,qBAAqB;AAAA,EACpC;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AACD,GAGG;AACF,QAAM,KAAK,IAAI;AACf,QAAM,KAAK,IAAI;AACf,QAAM,KAAK,KAAK,IAAI,GAAG,EAAE;AACzB,QAAM,KAAK,KAAK,IAAI,GAAG,EAAE;AAEzB,QAAM,IAAI,IAAI,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,KAAK,CAAC,MAAM,EAAE,IAAI,EAAE,WAAW,KAAK,CAAC;AAEtF,QAAM,gBAAgB,SAAS,gBAAgB,8BAA8B,MAAM;AACnF,gBAAc,aAAa,KAAK,CAAC;AACjC,gBAAc,aAAa,gBAAgB,GAAG,SAAS,CAAC;AACxD,gBAAc,aAAa,SAAS,EAAE,SAAS,CAAC;AAChD,gBAAc,aAAa,UAAU,EAAE,SAAS,CAAC;AACjD,gBAAc,aAAa,QAAQ,MAAM;AACzC,gBAAc,aAAa,UAAU,MAAM,KAAK,EAAE,KAAK;AAGvD,QAAM,kBAAc,kCAAgB;AAAA,IACnC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AAED,aAAO,sCAAoB,eAAe,WAAW;AACtD;",
+  "names": ["SolidStyleEllipse"]
+}

package/dist-cjs/lib/shapes/geo/components/SolidStyleOval.js

@@ -0,0 +1,99 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var SolidStyleOval_exports = {};
+__export(SolidStyleOval_exports, {
+  SolidStyleOval: () => SolidStyleOval,
+  SolidStyleOvalSvg: () => SolidStyleOvalSvg,
+  getOvalIndicatorPath: () => getOvalIndicatorPath
+});
+module.exports = __toCommonJS(SolidStyleOval_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var React = __toESM(require("react"));
+var import_ShapeFill = require("../../shared/ShapeFill");
+const SolidStyleOval = React.memo(function SolidStyleOval2({
+  w,
+  h,
+  strokeWidth: sw,
+  fill,
+  color
+}) {
+  const theme = (0, import_ShapeFill.useDefaultColorTheme)();
+  const d = getOvalIndicatorPath(w, h);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ShapeFill.ShapeFill, { d, color, fill, theme }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d, stroke: theme[color].solid, strokeWidth: sw, fill: "none" })
+  ] });
+});
+function SolidStyleOvalSvg({
+  w,
+  h,
+  strokeWidth: sw,
+  fill,
+  color,
+  theme
+}) {
+  const d = getOvalIndicatorPath(w, h);
+  const strokeElement = document.createElementNS("http://www.w3.org/2000/svg", "path");
+  strokeElement.setAttribute("d", d);
+  strokeElement.setAttribute("stroke-width", sw.toString());
+  strokeElement.setAttribute("width", w.toString());
+  strokeElement.setAttribute("height", h.toString());
+  strokeElement.setAttribute("fill", "none");
+  strokeElement.setAttribute("stroke", theme[color].solid);
+  const fillElement = (0, import_ShapeFill.getShapeFillSvg)({
+    d,
+    fill,
+    color,
+    theme
+  });
+  return (0, import_ShapeFill.getSvgWithShapeFill)(strokeElement, fillElement);
+}
+function getOvalIndicatorPath(w, h) {
+  let d;
+  if (h > w) {
+    const offset = w / 2;
+    d = `
+    M0,${offset}
+    a${offset},${offset},0,1,1,${offset * 2},0
+    L${w},${h - offset}
+    a${offset},${offset},0,1,1,-${offset * 2},0
+    Z`;
+  } else {
+    const offset = h / 2;
+    d = `
+    M${offset},0
+    L${w - offset},0
+    a${offset},${offset},0,1,1,0,${offset * 2}
+    L${offset},${h}
+    a${offset},${offset},0,1,1,0,${-offset * 2}
+    Z`;
+  }
+  return d;
+}
+//# sourceMappingURL=SolidStyleOval.js.map

package/dist-cjs/lib/shapes/geo/components/SolidStyleOval.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/lib/shapes/geo/components/SolidStyleOval.tsx"],
+  "sourcesContent": ["import { TLDefaultColorTheme, TLGeoShape } from '@bigbluebutton/editor'\nimport * as React from 'react'\nimport {\n\tShapeFill,\n\tgetShapeFillSvg,\n\tgetSvgWithShapeFill,\n\tuseDefaultColorTheme,\n} from '../../shared/ShapeFill'\n\nexport const SolidStyleOval = React.memo(function SolidStyleOval({\n\tw,\n\th,\n\tstrokeWidth: sw,\n\tfill,\n\tcolor,\n}: Pick<TLGeoShape['props'], 'w' | 'h' | 'fill' | 'color'> & {\n\tstrokeWidth: number\n}) {\n\tconst theme = useDefaultColorTheme()\n\tconst d = getOvalIndicatorPath(w, h)\n\treturn (\n\t\t<>\n\t\t\t<ShapeFill d={d} color={color} fill={fill} theme={theme} />\n\t\t\t<path d={d} stroke={theme[color].solid} strokeWidth={sw} fill=\"none\" />\n\t\t</>\n\t)\n})\n\nexport function SolidStyleOvalSvg({\n\tw,\n\th,\n\tstrokeWidth: sw,\n\tfill,\n\tcolor,\n\ttheme,\n}: Pick<TLGeoShape['props'], 'w' | 'h' | 'fill' | 'color'> & {\n\tstrokeWidth: number\n\ttheme: TLDefaultColorTheme\n}) {\n\tconst d = getOvalIndicatorPath(w, h)\n\tconst strokeElement = document.createElementNS('http://www.w3.org/2000/svg', 'path')\n\tstrokeElement.setAttribute('d', d)\n\tstrokeElement.setAttribute('stroke-width', sw.toString())\n\tstrokeElement.setAttribute('width', w.toString())\n\tstrokeElement.setAttribute('height', h.toString())\n\tstrokeElement.setAttribute('fill', 'none')\n\tstrokeElement.setAttribute('stroke', theme[color].solid)\n\n\t// Get the fill element, if any\n\tconst fillElement = getShapeFillSvg({\n\t\td,\n\t\tfill,\n\t\tcolor,\n\t\ttheme,\n\t})\n\n\treturn getSvgWithShapeFill(strokeElement, fillElement)\n}\n\nexport function getOvalIndicatorPath(w: number, h: number) {\n\tlet d: string\n\n\tif (h > w) {\n\t\tconst offset = w / 2\n\t\td = `\n    M0,${offset}\n    a${offset},${offset},0,1,1,${offset * 2},0\n    L${w},${h - offset}\n    a${offset},${offset},0,1,1,-${offset * 2},0\n    Z`\n\t} else {\n\t\tconst offset = h / 2\n\t\td = `\n    M${offset},0\n    L${w - offset},0\n    a${offset},${offset},0,1,1,0,${offset * 2}\n    L${offset},${h}\n    a${offset},${offset},0,1,1,0,${-offset * 2}\n    Z`\n\t}\n\n\treturn d\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAqBE;AApBF,YAAuB;AACvB,uBAKO;AAEA,MAAM,iBAAiB,MAAM,KAAK,SAASA,gBAAe;AAAA,EAChE;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AACD,GAEG;AACF,QAAM,YAAQ,uCAAqB;AACnC,QAAM,IAAI,qBAAqB,GAAG,CAAC;AACnC,SACC,4EACC;AAAA,gDAAC,8BAAU,GAAM,OAAc,MAAY,OAAc;AAAA,IACzD,4CAAC,UAAK,GAAM,QAAQ,MAAM,KAAK,EAAE,OAAO,aAAa,IAAI,MAAK,QAAO;AAAA,KACtE;AAEF,CAAC;AAEM,SAAS,kBAAkB;AAAA,EACjC;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA;AACD,GAGG;AACF,QAAM,IAAI,qBAAqB,GAAG,CAAC;AACnC,QAAM,gBAAgB,SAAS,gBAAgB,8BAA8B,MAAM;AACnF,gBAAc,aAAa,KAAK,CAAC;AACjC,gBAAc,aAAa,gBAAgB,GAAG,SAAS,CAAC;AACxD,gBAAc,aAAa,SAAS,EAAE,SAAS,CAAC;AAChD,gBAAc,aAAa,UAAU,EAAE,SAAS,CAAC;AACjD,gBAAc,aAAa,QAAQ,MAAM;AACzC,gBAAc,aAAa,UAAU,MAAM,KAAK,EAAE,KAAK;AAGvD,QAAM,kBAAc,kCAAgB;AAAA,IACnC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAC;AAED,aAAO,sCAAoB,eAAe,WAAW;AACtD;AAEO,SAAS,qBAAqB,GAAW,GAAW;AAC1D,MAAI;AAEJ,MAAI,IAAI,GAAG;AACV,UAAM,SAAS,IAAI;AACnB,QAAI;AAAA,SACG,MAAM;AAAA,OACR,MAAM,IAAI,MAAM,UAAU,SAAS,CAAC;AAAA,OACpC,CAAC,IAAI,IAAI,MAAM;AAAA,OACf,MAAM,IAAI,MAAM,WAAW,SAAS,CAAC;AAAA;AAAA,EAE3C,OAAO;AACN,UAAM,SAAS,IAAI;AACnB,QAAI;AAAA,OACC,MAAM;AAAA,OACN,IAAI,MAAM;AAAA,OACV,MAAM,IAAI,MAAM,YAAY,SAAS,CAAC;AAAA,OACtC,MAAM,IAAI,CAAC;AAAA,OACX,MAAM,IAAI,MAAM,YAAY,CAAC,SAAS,CAAC;AAAA;AAAA,EAE7C;AAEA,SAAO;AACR;",
+  "names": ["SolidStyleOval"]
+}