@pibbl/core 0.0.1

package/dist/lib/components/line.js

@@ -0,0 +1,76 @@
+import { definePrimitive } from "../define-primitive.js";
+import { stripLayoutParticipation } from "../style/resolve-built-in.js";
+import { registerOpaqueStyleProperties } from "../style/resolve-dispatch.js";
+import { layoutDiagnostic } from "../style/diagnostics.js";
+import { createLinePath } from "../geometry/line.js";
+import { validateCoordinates } from "../geometry/validation.js";
+import { renderPath } from "./path.js";
+function renderLine(props, style, ctx) {
+  const {
+    coords,
+    stroke,
+    strokeWidth,
+    opacity,
+    cursor,
+    lineInteractionWidth
+  } = style;
+  const linePath = createLinePath({ coords });
+  const interactionWidth = lineInteractionWidth ?? strokeWidth ?? 0;
+  return renderPath(
+    {
+      ...props,
+      keyboardNavigationBounds: props.keyboardNavigationBounds ?? lineBounds(coords, interactionWidth)
+    },
+    {
+      d: linePath,
+      stroke,
+      strokeWidth,
+      opacity,
+      cursor,
+      lineInteractionWidth: interactionWidth
+    },
+    ctx
+  );
+}
+const Line = definePrimitive(renderLine, {
+  resolveStyle: (style, context) => ({
+    ...stripLayoutParticipation(style),
+    coords: validateCoordinates(
+      style.coords,
+      "coords",
+      layoutGeometryErrorFactory(context)
+    )
+  })
+});
+registerOpaqueStyleProperties(Line, ["stroke", "cursor"]);
+function lineBounds(coords, interactionWidth) {
+  if (coords.length === 0) return void 0;
+  const halfWidth = interactionWidth / 2;
+  const xs = coords.map(([x]) => x);
+  const ys = coords.map(([, y]) => y);
+  const left = Math.min(...xs) - halfWidth;
+  const right = Math.max(...xs) + halfWidth;
+  const top = Math.min(...ys) - halfWidth;
+  const bottom = Math.max(...ys) + halfWidth;
+  return {
+    x: left,
+    y: top,
+    width: right - left,
+    height: bottom - top
+  };
+}
+function layoutGeometryErrorFactory(context) {
+  return (property, value, reason) => layoutDiagnostic({
+    component: context.component,
+    property,
+    value,
+    algorithm: context.algorithm,
+    constraints: context.constraints,
+    reason
+  });
+}
+export {
+  Line,
+  renderLine
+};
+//# sourceMappingURL=line.js.map

package/dist/lib/components/line.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/lib/components/line.ts"],
+  "sourcesContent": ["import type { HorizontalLineStyle } from './horizontal-line.js';\nimport type { VerticalLineStyle } from './vertical-line.js';\nimport { definePrimitive } from '../define-primitive.js';\nimport type {\n  PibblEventFocusOptions,\n  PibblEventHandlers,\n  PibblEventParticipationOptions,\n} from '../events/types.js';\nimport {\n  RenderingContext2D,\n  SystemStyle,\n} from '../types.js';\nimport type { PibblPhysics2DPropExtension } from '../types.js';\nimport { stripLayoutParticipation } from '../style/resolve-built-in.js';\nimport { registerOpaqueStyleProperties } from '../style/resolve-dispatch.js';\nimport type {\n  BoxStyle,\n  CursorStyle,\n  LayoutItemStyle,\n  PaintStyle,\n  ResolvedDrawingStyle,\n} from '../style/types.js';\nimport { layoutDiagnostic } from '../style/diagnostics.js';\nimport { createLinePath } from '../geometry/line.js';\nimport { validateCoordinates } from '../geometry/validation.js';\nimport type { StyleResolutionContext } from '../types.js';\nimport { renderPath } from './path.js';\n\n/**\n * Authored inputs for Line, including the declared data and presentation options.\n *\n * @see {@link PibblEventHandlers}\n * @see {@link PibblEventParticipationOptions}\n * @see {@link PibblPhysics2DPropExtension}\n * @see {@link Line}\n */\nexport interface LineProps extends PibblEventHandlers, PibblEventFocusOptions, PibblEventParticipationOptions, PibblPhysics2DPropExtension {}\n\n/**\n * Supported geometry and presentation properties for Line.\n *\n * @see {@link SystemStyle}\n * @see {@link BoxStyle}\n * @see {@link LayoutItemStyle}\n * @see {@link PaintStyle}\n * @see {@link CursorStyle}\n * @see {@link Line}\n * @see {@link HorizontalLineStyle}\n * @see {@link VerticalLineStyle}\n */\nexport interface LineStyle\n  extends SystemStyle, BoxStyle, LayoutItemStyle, Omit<PaintStyle, 'fill'>, CursorStyle {\n  /** Ordered coordinate pairs describing the path vertices. See {@link LineStyle}. */\n  coords: [number, number][];\n  /**\n   * Width used for line hit testing independently of the visible stroke width. See\n   * {@link LineStyle}.\n   */\n  lineInteractionWidth?: number;\n}\n\ntype ResolvedLineStyle = ResolvedDrawingStyle<LineStyle>;\n\nexport function renderLine(\n  props: LineProps,\n  style: Readonly<ResolvedLineStyle>,\n  ctx: RenderingContext2D,\n) {\n  const {\n    coords,\n    stroke,\n    strokeWidth,\n    opacity,\n    cursor,\n    lineInteractionWidth,\n  } = style;\n  const linePath = createLinePath({ coords });\n  const interactionWidth = lineInteractionWidth ?? strokeWidth ?? 0;\n\n  return renderPath(\n    {\n      ...props,\n      keyboardNavigationBounds: props.keyboardNavigationBounds ??\n        lineBounds(coords, interactionWidth),\n    },\n    {\n      d: linePath,\n      stroke,\n      strokeWidth,\n      opacity,\n      cursor,\n      lineInteractionWidth: interactionWidth,\n    },\n    ctx,\n  );\n}\n\n/**\n * Describes a polyline primitive for JSX or createElement authoring.\n *\n * @param props - Authored component inputs, supplied through JSX or createElement. See the linked\n * props and style types.\n * @throws When called directly; Pibbl mounts this component through JSX or createElement.\n *\n * @see {@link LineProps}\n * @see {@link LineStyle}\n */\nexport const Line = definePrimitive<\n  LineProps,\n  LineStyle,\n  LineStyle,\n  ResolvedLineStyle\n>(renderLine, {\n  resolveStyle: (style, context) => ({\n    ...stripLayoutParticipation(style),\n    coords: validateCoordinates(\n      style.coords,\n      'coords',\n      layoutGeometryErrorFactory(context),\n    ),\n  }) as ResolvedLineStyle,\n});\nregisterOpaqueStyleProperties(Line, ['stroke', 'cursor']);\n\nfunction lineBounds(\n  coords: readonly [number, number][],\n  interactionWidth: number,\n) {\n  if (coords.length === 0) return undefined;\n  const halfWidth = interactionWidth / 2;\n  const xs = coords.map(([x]) => x);\n  const ys = coords.map(([, y]) => y);\n  const left = Math.min(...xs) - halfWidth;\n  const right = Math.max(...xs) + halfWidth;\n  const top = Math.min(...ys) - halfWidth;\n  const bottom = Math.max(...ys) + halfWidth;\n  return {\n    x: left,\n    y: top,\n    width: right - left,\n    height: bottom - top,\n  };\n}\n\nfunction layoutGeometryErrorFactory(context: Readonly<StyleResolutionContext>) {\n  return (property: string, value: unknown, reason: string) => layoutDiagnostic({\n    component: context.component,\n    property,\n    value,\n    algorithm: context.algorithm,\n    constraints: context.constraints,\n    reason,\n  });\n}\n"],
+  "mappings": "AAEA,SAAS,uBAAuB;AAWhC,SAAS,gCAAgC;AACzC,SAAS,qCAAqC;AAQ9C,SAAS,wBAAwB;AACjC,SAAS,sBAAsB;AAC/B,SAAS,2BAA2B;AAEpC,SAAS,kBAAkB;AAqCpB,SAAS,WACd,OACA,OACA,KACA;AACA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,WAAW,eAAe,EAAE,OAAO,CAAC;AAC1C,QAAM,mBAAmB,wBAAwB,eAAe;AAEhE,SAAO;AAAA,IACL;AAAA,MACE,GAAG;AAAA,MACH,0BAA0B,MAAM,4BAC9B,WAAW,QAAQ,gBAAgB;AAAA,IACvC;AAAA,IACA;AAAA,MACE,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,sBAAsB;AAAA,IACxB;AAAA,IACA;AAAA,EACF;AACF;AAYO,MAAM,OAAO,gBAKlB,YAAY;AAAA,EACZ,cAAc,CAAC,OAAO,aAAa;AAAA,IACjC,GAAG,yBAAyB,KAAK;AAAA,IACjC,QAAQ;AAAA,MACN,MAAM;AAAA,MACN;AAAA,MACA,2BAA2B,OAAO;AAAA,IACpC;AAAA,EACF;AACF,CAAC;AACD,8BAA8B,MAAM,CAAC,UAAU,QAAQ,CAAC;AAExD,SAAS,WACP,QACA,kBACA;AACA,MAAI,OAAO,WAAW,EAAG,QAAO;AAChC,QAAM,YAAY,mBAAmB;AACrC,QAAM,KAAK,OAAO,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;AAChC,QAAM,KAAK,OAAO,IAAI,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC;AAClC,QAAM,OAAO,KAAK,IAAI,GAAG,EAAE,IAAI;AAC/B,QAAM,QAAQ,KAAK,IAAI,GAAG,EAAE,IAAI;AAChC,QAAM,MAAM,KAAK,IAAI,GAAG,EAAE,IAAI;AAC9B,QAAM,SAAS,KAAK,IAAI,GAAG,EAAE,IAAI;AACjC,SAAO;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,IACH,OAAO,QAAQ;AAAA,IACf,QAAQ,SAAS;AAAA,EACnB;AACF;AAEA,SAAS,2BAA2B,SAA2C;AAC7E,SAAO,CAAC,UAAkB,OAAgB,WAAmB,iBAAiB;AAAA,IAC5E,WAAW,QAAQ;AAAA,IACnB;AAAA,IACA;AAAA,IACA,WAAW,QAAQ;AAAA,IACnB,aAAa,QAAQ;AAAA,IACrB;AAAA,EACF,CAAC;AACH;",
+  "names": []
+}

package/dist/lib/components/path.d.ts

@@ -0,0 +1,28 @@
+import type { SvgPathProps } from "./svg-path.js";
+import type { PibblEventFocusOptions, PibblEventHandlers, PibblEventParticipationOptions } from '../events/types.js';
+import { RenderingContext2D } from '../types.js';
+import type { PibblPhysics2DPropExtension } from '../types.js';
+import type { PathStyle, ResolvedPathStyle } from '../style/types.js';
+/**
+ * Authored inputs for Path, including the declared data and presentation options.
+ *
+ * @see {@link PibblEventHandlers}
+ * @see {@link PibblEventParticipationOptions}
+ * @see {@link PibblPhysics2DPropExtension}
+ * @see {@link Path}
+ * @see {@link SvgPathProps}
+ */
+export interface PathProps extends PibblEventHandlers, PibblEventFocusOptions, PibblEventParticipationOptions, PibblPhysics2DPropExtension {
+}
+export declare function renderPath(props: PathProps, style: Readonly<ResolvedPathStyle>, ctx: RenderingContext2D, paintBounds?: Readonly<import("@pibbl/core").LayoutBox>, directTextureFill?: boolean): void;
+/**
+ * Describes a Canvas path primitive for JSX or createElement authoring.
+ *
+ * @param props - Authored component inputs, supplied through JSX or createElement. See the linked
+ * props and style types.
+ * @throws When called directly; Pibbl mounts this component through JSX or createElement.
+ *
+ * @see {@link PathProps}
+ * @see {@link PathStyle}
+ */
+export declare const Path: import("@pibbl/core").PibblPrimitiveComponent<PathProps, import("@pibbl/core").PrimitiveInput<PathProps, PathStyle>>;

package/dist/lib/components/path.js

@@ -0,0 +1,47 @@
+import { drawSimpleStretchedTexture, resolveTexturePaint } from "../textures/texture-protocol.js";
+import { getLayoutBox } from "../layout/context.js";
+import { resolvePath } from "../geometry/resolve-path.js";
+import { definePrimitive } from "../define-primitive.js";
+import { stripLayoutParticipation } from "../style/resolve-built-in.js";
+import { registerOpaqueStyleProperties } from "../style/resolve-dispatch.js";
+import { isTransparent } from "../util/is-transparent.js";
+import { wireCommonEvents } from "../util/wire-common-events.js";
+function renderPath(props, style, ctx, paintBounds = getLayoutBox(), directTextureFill = false) {
+  const {
+    d: input,
+    fill,
+    stroke,
+    strokeWidth,
+    opacity,
+    cursor,
+    lineInteractionWidth = strokeWidth ?? 0
+  } = style;
+  const d = resolvePath(input);
+  if (opacity !== void 0) {
+    ctx.globalAlpha = ctx.globalAlpha * opacity;
+  }
+  if (fill && !isTransparent(fill)) {
+    if (!directTextureFill || stroke && strokeWidth && strokeWidth > 0 || !drawSimpleStretchedTexture(fill, ctx, paintBounds)) {
+      ctx.fillStyle = resolveTexturePaint(fill, ctx, paintBounds);
+      ctx.fill(d);
+    }
+  }
+  if (stroke && strokeWidth && strokeWidth > 0) {
+    ctx.strokeStyle = resolveTexturePaint(stroke, ctx, paintBounds);
+    ctx.lineWidth = strokeWidth;
+    ctx.stroke(d);
+  }
+  wireCommonEvents(props, d, !!fill, lineInteractionWidth, cursor);
+}
+const Path = definePrimitive(renderPath, {
+  resolveStyle: resolvePathStyle
+});
+registerOpaqueStyleProperties(Path, ["fill", "stroke", "cursor"]);
+function resolvePathStyle(style, _context) {
+  return stripLayoutParticipation(style);
+}
+export {
+  Path,
+  renderPath
+};
+//# sourceMappingURL=path.js.map

package/dist/lib/components/path.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/lib/components/path.ts"],
+  "sourcesContent": ["import type { SvgPathProps } from './svg-path.js';\nimport { drawSimpleStretchedTexture, resolveTexturePaint } from '../textures/texture-protocol.js';\nimport { getLayoutBox } from '../layout/context.js';\nimport { resolvePath } from '../geometry/resolve-path.js';\nimport { definePrimitive } from '../define-primitive.js';\nimport type {\n  PibblEventFocusOptions,\n  PibblEventHandlers,\n  PibblEventParticipationOptions,\n} from '../events/types.js';\nimport { RenderingContext2D } from '../types.js';\nimport type { PibblPhysics2DPropExtension } from '../types.js';\nimport { stripLayoutParticipation } from '../style/resolve-built-in.js';\nimport { registerOpaqueStyleProperties } from '../style/resolve-dispatch.js';\nimport type { PathStyle, ResolvedPathStyle } from '../style/types.js';\nimport type { StyleResolutionContext } from '../types.js';\nimport { isTransparent } from '../util/is-transparent.js';\nimport { wireCommonEvents } from '../util/wire-common-events.js';\n\n/**\n * Authored inputs for Path, including the declared data and presentation options.\n *\n * @see {@link PibblEventHandlers}\n * @see {@link PibblEventParticipationOptions}\n * @see {@link PibblPhysics2DPropExtension}\n * @see {@link Path}\n * @see {@link SvgPathProps}\n */\nexport interface PathProps extends PibblEventHandlers, PibblEventFocusOptions, PibblEventParticipationOptions, PibblPhysics2DPropExtension {}\n\nexport function renderPath(\n  props: PathProps,\n  style: Readonly<ResolvedPathStyle>,\n  ctx: RenderingContext2D,\n  paintBounds = getLayoutBox(),\n  directTextureFill = false,\n) {\n  const {\n    d: input,\n    fill,\n    stroke,\n    strokeWidth,\n    opacity,\n    cursor,\n    lineInteractionWidth = strokeWidth ?? 0,\n  } = style;\n\n  const d = resolvePath(input);\n\n  if (opacity !== undefined) {\n    ctx.globalAlpha = ctx.globalAlpha * opacity;\n  }\n\n  if (fill && !isTransparent(fill)) {\n    if (!directTextureFill || (stroke && strokeWidth && strokeWidth > 0) ||\n      !drawSimpleStretchedTexture(fill, ctx, paintBounds)) {\n      ctx.fillStyle = resolveTexturePaint(fill, ctx, paintBounds);\n      ctx.fill(d);\n    }\n  }\n\n  if (stroke && strokeWidth && strokeWidth > 0) {\n    ctx.strokeStyle = resolveTexturePaint(stroke, ctx, paintBounds);\n    ctx.lineWidth = strokeWidth;\n    ctx.stroke(d);\n  }\n\n  wireCommonEvents(props, d, !!fill, lineInteractionWidth, cursor);\n}\n\n/**\n * Describes a Canvas path primitive for JSX or createElement authoring.\n *\n * @param props - Authored component inputs, supplied through JSX or createElement. See the linked\n * props and style types.\n * @throws When called directly; Pibbl mounts this component through JSX or createElement.\n *\n * @see {@link PathProps}\n * @see {@link PathStyle}\n */\nexport const Path = definePrimitive<\n  PathProps,\n  PathStyle,\n  PathStyle,\n  ResolvedPathStyle\n>(renderPath, {\n  resolveStyle: resolvePathStyle,\n});\nregisterOpaqueStyleProperties(Path, ['fill', 'stroke', 'cursor']);\n\nfunction resolvePathStyle(\n  style: Readonly<PathStyle>,\n  _context: Readonly<StyleResolutionContext>,\n): Readonly<ResolvedPathStyle> {\n  return stripLayoutParticipation(style) as ResolvedPathStyle;\n}\n"],
+  "mappings": "AACA,SAAS,4BAA4B,2BAA2B;AAChE,SAAS,oBAAoB;AAC7B,SAAS,mBAAmB;AAC5B,SAAS,uBAAuB;AAQhC,SAAS,gCAAgC;AACzC,SAAS,qCAAqC;AAG9C,SAAS,qBAAqB;AAC9B,SAAS,wBAAwB;AAa1B,SAAS,WACd,OACA,OACA,KACA,cAAc,aAAa,GAC3B,oBAAoB,OACpB;AACA,QAAM;AAAA,IACJ,GAAG;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,uBAAuB,eAAe;AAAA,EACxC,IAAI;AAEJ,QAAM,IAAI,YAAY,KAAK;AAE3B,MAAI,YAAY,QAAW;AACzB,QAAI,cAAc,IAAI,cAAc;AAAA,EACtC;AAEA,MAAI,QAAQ,CAAC,cAAc,IAAI,GAAG;AAChC,QAAI,CAAC,qBAAsB,UAAU,eAAe,cAAc,KAChE,CAAC,2BAA2B,MAAM,KAAK,WAAW,GAAG;AACrD,UAAI,YAAY,oBAAoB,MAAM,KAAK,WAAW;AAC1D,UAAI,KAAK,CAAC;AAAA,IACZ;AAAA,EACF;AAEA,MAAI,UAAU,eAAe,cAAc,GAAG;AAC5C,QAAI,cAAc,oBAAoB,QAAQ,KAAK,WAAW;AAC9D,QAAI,YAAY;AAChB,QAAI,OAAO,CAAC;AAAA,EACd;AAEA,mBAAiB,OAAO,GAAG,CAAC,CAAC,MAAM,sBAAsB,MAAM;AACjE;AAYO,MAAM,OAAO,gBAKlB,YAAY;AAAA,EACZ,cAAc;AAChB,CAAC;AACD,8BAA8B,MAAM,CAAC,QAAQ,UAAU,QAAQ,CAAC;AAEhE,SAAS,iBACP,OACA,UAC6B;AAC7B,SAAO,yBAAyB,KAAK;AACvC;",
+  "names": []
+}

package/dist/lib/components/polygon.d.ts

@@ -0,0 +1,45 @@
+import type { PibblEventFocusOptions, PibblEventHandlers, PibblEventParticipationOptions } from '../events/types.js';
+import { SystemStyle } from '../types.js';
+import type { PibblPhysics2DPropExtension } from '../types.js';
+import type { BoxStyle, CursorStyle, LayoutItemStyle, PaintStyle, RoundedCornerStyle } from '../style/types.js';
+/**
+ * Authored inputs for Polygon, including the declared data and presentation options.
+ *
+ * @see {@link PibblEventHandlers}
+ * @see {@link PibblEventParticipationOptions}
+ * @see {@link PibblPhysics2DPropExtension}
+ * @see {@link Polygon}
+ */
+export interface PolygonProps extends PibblEventHandlers, PibblEventFocusOptions, PibblEventParticipationOptions, PibblPhysics2DPropExtension {
+}
+/**
+ * Supported geometry and presentation properties for Polygon.
+ *
+ * @see {@link RoundedCornerStyle}
+ * @see {@link SystemStyle}
+ * @see {@link PaintStyle}
+ * @see {@link CursorStyle}
+ * @see {@link BoxStyle}
+ * @see {@link LayoutItemStyle}
+ * @see {@link Polygon}
+ */
+export interface PolygonStyle extends RoundedCornerStyle, SystemStyle, PaintStyle, CursorStyle, BoxStyle, LayoutItemStyle {
+    /** Ordered coordinate pairs describing the path vertices. See {@link PolygonStyle}. */
+    coords: [number, number][];
+    /**
+     * Width used for line hit testing independently of the visible stroke width. See
+     * {@link PolygonStyle}.
+     */
+    lineInteractionWidth?: number;
+}
+/**
+ * Describes a polygon primitive for JSX or createElement authoring.
+ *
+ * @param props - Authored component inputs, supplied through JSX or createElement. See the linked
+ * props and style types.
+ * @throws When called directly; Pibbl mounts this component through JSX or createElement.
+ *
+ * @see {@link PolygonProps}
+ * @see {@link PolygonStyle}
+ */
+export declare const Polygon: import("@pibbl/core").PibblPrimitiveComponent<PolygonProps, import("@pibbl/core").PrimitiveInput<PolygonProps, PolygonStyle>>;

package/dist/lib/components/polygon.js

@@ -0,0 +1,93 @@
+import { definePrimitive } from "../define-primitive.js";
+import { stripLayoutParticipation } from "../style/resolve-built-in.js";
+import { createPolygonPath } from "../geometry/polygon.js";
+import { layoutDiagnostic } from "../style/diagnostics.js";
+import { registerOpaqueStyleProperties } from "../style/resolve-dispatch.js";
+import { renderPath } from "./path.js";
+import { resolveRoundedCornerStyle } from "./rounded-corner-style.js";
+function renderPolygon(props, style, ctx) {
+  const {
+    coords,
+    fill,
+    stroke,
+    strokeWidth,
+    opacity,
+    cursor,
+    lineInteractionWidth,
+    cornerRadius,
+    cornerRadii
+  } = style;
+  const path = createPolygonPath({ coords, cornerRadius, cornerRadii });
+  return renderPath(
+    {
+      ...props,
+      keyboardNavigationBounds: props.keyboardNavigationBounds ?? polygonBounds(coords)
+    },
+    {
+      d: path,
+      fill,
+      stroke,
+      strokeWidth,
+      opacity,
+      cursor,
+      lineInteractionWidth
+    },
+    ctx
+  );
+}
+const Polygon = definePrimitive(renderPolygon, {
+  resolveStyle: (style, context) => {
+    const coords = validatePolygonCoords(style.coords, context);
+    return {
+      ...stripLayoutParticipation(style),
+      coords,
+      ...resolveRoundedCornerStyle(coords.length, style, context)
+    };
+  }
+});
+registerOpaqueStyleProperties(Polygon, ["fill", "stroke", "cursor"]);
+function validatePolygonCoords(coords, context) {
+  for (let index = 0; index < coords.length; index++) {
+    const [x, y] = coords[index];
+    if (!Number.isFinite(x)) {
+      throw layoutDiagnostic({
+        component: context.component,
+        property: `coords[${index}][0]`,
+        value: x,
+        algorithm: context.algorithm,
+        constraints: context.constraints,
+        reason: "must be a finite number"
+      });
+    }
+    if (!Number.isFinite(y)) {
+      throw layoutDiagnostic({
+        component: context.component,
+        property: `coords[${index}][1]`,
+        value: y,
+        algorithm: context.algorithm,
+        constraints: context.constraints,
+        reason: "must be a finite number"
+      });
+    }
+  }
+  return coords;
+}
+function polygonBounds(coords) {
+  if (coords.length === 0) return void 0;
+  const xs = coords.map(([x]) => x);
+  const ys = coords.map(([, y]) => y);
+  const left = Math.min(...xs);
+  const right = Math.max(...xs);
+  const top = Math.min(...ys);
+  const bottom = Math.max(...ys);
+  return {
+    x: left,
+    y: top,
+    width: right - left,
+    height: bottom - top
+  };
+}
+export {
+  Polygon
+};
+//# sourceMappingURL=polygon.js.map

package/dist/lib/components/polygon.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/lib/components/polygon.ts"],
+  "sourcesContent": ["import { definePrimitive } from '../define-primitive.js';\nimport type {\n  PibblEventFocusOptions,\n  PibblEventHandlers,\n  PibblEventParticipationOptions,\n} from '../events/types.js';\nimport {\n  RenderingContext2D,\n  SystemStyle,\n} from '../types.js';\nimport type { PibblPhysics2DPropExtension } from '../types.js';\nimport { stripLayoutParticipation } from '../style/resolve-built-in.js';\nimport { createPolygonPath } from '../geometry/polygon.js';\nimport { layoutDiagnostic } from '../style/diagnostics.js';\nimport { registerOpaqueStyleProperties } from '../style/resolve-dispatch.js';\nimport type {\n  BoxStyle,\n  CursorStyle,\n  LayoutItemStyle,\n  PaintStyle,\n  RoundedCornerStyle,\n  ResolvedDrawingStyle,\n} from '../style/types.js';\nimport type { StyleResolutionContext } from '../types.js';\nimport { renderPath } from './path.js';\nimport { resolveRoundedCornerStyle } from './rounded-corner-style.js';\n\n/**\n * Authored inputs for Polygon, including the declared data and presentation options.\n *\n * @see {@link PibblEventHandlers}\n * @see {@link PibblEventParticipationOptions}\n * @see {@link PibblPhysics2DPropExtension}\n * @see {@link Polygon}\n */\nexport interface PolygonProps extends PibblEventHandlers, PibblEventFocusOptions, PibblEventParticipationOptions, PibblPhysics2DPropExtension {}\n\n/**\n * Supported geometry and presentation properties for Polygon.\n *\n * @see {@link RoundedCornerStyle}\n * @see {@link SystemStyle}\n * @see {@link PaintStyle}\n * @see {@link CursorStyle}\n * @see {@link BoxStyle}\n * @see {@link LayoutItemStyle}\n * @see {@link Polygon}\n */\nexport interface PolygonStyle\n  extends\n    RoundedCornerStyle,\n    SystemStyle,\n    PaintStyle,\n    CursorStyle,\n    BoxStyle,\n    LayoutItemStyle {\n  /** Ordered coordinate pairs describing the path vertices. See {@link PolygonStyle}. */\n  coords: [number, number][];\n  /**\n   * Width used for line hit testing independently of the visible stroke width. See\n   * {@link PolygonStyle}.\n   */\n  lineInteractionWidth?: number;\n}\n\ntype ResolvedPolygonStyle = Omit<\n  ResolvedDrawingStyle<PolygonStyle>,\n  keyof RoundedCornerStyle\n> & {\n  coords: [number, number][];\n  cornerRadius?: number;\n  cornerRadii?: readonly (number | null | undefined)[];\n};\n\nfunction renderPolygon(\n  props: PolygonProps,\n  style: Readonly<ResolvedPolygonStyle>,\n  ctx: RenderingContext2D,\n) {\n  const {\n    coords,\n    fill,\n    stroke,\n    strokeWidth,\n    opacity,\n    cursor,\n    lineInteractionWidth,\n    cornerRadius,\n    cornerRadii,\n  } = style;\n  const path = createPolygonPath({ coords, cornerRadius, cornerRadii });\n\n  return renderPath(\n    {\n      ...props,\n      keyboardNavigationBounds: props.keyboardNavigationBounds ??\n        polygonBounds(coords),\n    },\n    {\n      d: path,\n      fill,\n      stroke,\n      strokeWidth,\n      opacity,\n      cursor,\n      lineInteractionWidth,\n    },\n    ctx,\n  );\n}\n\n/**\n * Describes a polygon primitive for JSX or createElement authoring.\n *\n * @param props - Authored component inputs, supplied through JSX or createElement. See the linked\n * props and style types.\n * @throws When called directly; Pibbl mounts this component through JSX or createElement.\n *\n * @see {@link PolygonProps}\n * @see {@link PolygonStyle}\n */\nexport const Polygon = definePrimitive<\n  PolygonProps,\n  PolygonStyle,\n  PolygonStyle,\n  ResolvedPolygonStyle\n>(renderPolygon, {\n  resolveStyle: (style, context) => {\n    const coords = validatePolygonCoords(style.coords, context);\n    return {\n      ...stripLayoutParticipation(style),\n      coords,\n      ...resolveRoundedCornerStyle(coords.length, style, context),\n    } as ResolvedPolygonStyle;\n  },\n});\nregisterOpaqueStyleProperties(Polygon, ['fill', 'stroke', 'cursor']);\n\nfunction validatePolygonCoords(\n  coords: [number, number][],\n  context: Readonly<StyleResolutionContext>,\n) {\n  for (let index = 0; index < coords.length; index++) {\n    const [x, y] = coords[index];\n    if (!Number.isFinite(x)) {\n      throw layoutDiagnostic({\n        component: context.component,\n        property: `coords[${index}][0]`,\n        value: x,\n        algorithm: context.algorithm,\n        constraints: context.constraints,\n        reason: 'must be a finite number',\n      });\n    }\n    if (!Number.isFinite(y)) {\n      throw layoutDiagnostic({\n        component: context.component,\n        property: `coords[${index}][1]`,\n        value: y,\n        algorithm: context.algorithm,\n        constraints: context.constraints,\n        reason: 'must be a finite number',\n      });\n    }\n  }\n  return coords;\n}\n\nfunction polygonBounds(coords: readonly [number, number][]) {\n  if (coords.length === 0) return undefined;\n  const xs = coords.map(([x]) => x);\n  const ys = coords.map(([, y]) => y);\n  const left = Math.min(...xs);\n  const right = Math.max(...xs);\n  const top = Math.min(...ys);\n  const bottom = Math.max(...ys);\n  return {\n    x: left,\n    y: top,\n    width: right - left,\n    height: bottom - top,\n  };\n}\n"],
+  "mappings": "AAAA,SAAS,uBAAuB;AAWhC,SAAS,gCAAgC;AACzC,SAAS,yBAAyB;AAClC,SAAS,wBAAwB;AACjC,SAAS,qCAAqC;AAU9C,SAAS,kBAAkB;AAC3B,SAAS,iCAAiC;AAiD1C,SAAS,cACP,OACA,OACA,KACA;AACA,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AACJ,QAAM,OAAO,kBAAkB,EAAE,QAAQ,cAAc,YAAY,CAAC;AAEpE,SAAO;AAAA,IACL;AAAA,MACE,GAAG;AAAA,MACH,0BAA0B,MAAM,4BAC9B,cAAc,MAAM;AAAA,IACxB;AAAA,IACA;AAAA,MACE,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,EACF;AACF;AAYO,MAAM,UAAU,gBAKrB,eAAe;AAAA,EACf,cAAc,CAAC,OAAO,YAAY;AAChC,UAAM,SAAS,sBAAsB,MAAM,QAAQ,OAAO;AAC1D,WAAO;AAAA,MACL,GAAG,yBAAyB,KAAK;AAAA,MACjC;AAAA,MACA,GAAG,0BAA0B,OAAO,QAAQ,OAAO,OAAO;AAAA,IAC5D;AAAA,EACF;AACF,CAAC;AACD,8BAA8B,SAAS,CAAC,QAAQ,UAAU,QAAQ,CAAC;AAEnE,SAAS,sBACP,QACA,SACA;AACA,WAAS,QAAQ,GAAG,QAAQ,OAAO,QAAQ,SAAS;AAClD,UAAM,CAAC,GAAG,CAAC,IAAI,OAAO,KAAK;AAC3B,QAAI,CAAC,OAAO,SAAS,CAAC,GAAG;AACvB,YAAM,iBAAiB;AAAA,QACrB,WAAW,QAAQ;AAAA,QACnB,UAAU,UAAU,KAAK;AAAA,QACzB,OAAO;AAAA,QACP,WAAW,QAAQ;AAAA,QACnB,aAAa,QAAQ;AAAA,QACrB,QAAQ;AAAA,MACV,CAAC;AAAA,IACH;AACA,QAAI,CAAC,OAAO,SAAS,CAAC,GAAG;AACvB,YAAM,iBAAiB;AAAA,QACrB,WAAW,QAAQ;AAAA,QACnB,UAAU,UAAU,KAAK;AAAA,QACzB,OAAO;AAAA,QACP,WAAW,QAAQ;AAAA,QACnB,aAAa,QAAQ;AAAA,QACrB,QAAQ;AAAA,MACV,CAAC;AAAA,IACH;AAAA,EACF;AACA,SAAO;AACT;AAEA,SAAS,cAAc,QAAqC;AAC1D,MAAI,OAAO,WAAW,EAAG,QAAO;AAChC,QAAM,KAAK,OAAO,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC;AAChC,QAAM,KAAK,OAAO,IAAI,CAAC,CAAC,EAAE,CAAC,MAAM,CAAC;AAClC,QAAM,OAAO,KAAK,IAAI,GAAG,EAAE;AAC3B,QAAM,QAAQ,KAAK,IAAI,GAAG,EAAE;AAC5B,QAAM,MAAM,KAAK,IAAI,GAAG,EAAE;AAC1B,QAAM,SAAS,KAAK,IAAI,GAAG,EAAE;AAC7B,SAAO;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,IACH,OAAO,QAAQ;AAAA,IACf,QAAQ,SAAS;AAAA,EACnB;AACF;",
+  "names": []
+}

package/dist/lib/components/rect.d.ts

@@ -0,0 +1,24 @@
+import type { PibblEventFocusOptions, PibblEventHandlers, PibblEventParticipationOptions } from '../events/types.js';
+import type { PibblPhysics2DPropExtension } from '../types.js';
+import type { RectStyle } from '../style/types.js';
+/**
+ * Authored inputs for Rectangle, including the declared data and presentation options.
+ *
+ * @see {@link PibblEventHandlers}
+ * @see {@link PibblEventParticipationOptions}
+ * @see {@link PibblPhysics2DPropExtension}
+ * @see {@link Rectangle}
+ */
+export interface RectangleProps extends PibblEventHandlers, PibblEventFocusOptions, PibblEventParticipationOptions, PibblPhysics2DPropExtension {
+}
+/**
+ * Describes a rectangle primitive for JSX or createElement authoring.
+ *
+ * @param props - Authored component inputs, supplied through JSX or createElement. See the linked
+ * props and style types.
+ * @throws When called directly; Pibbl mounts this component through JSX or createElement.
+ *
+ * @see {@link RectangleProps}
+ * @see {@link RectStyle}
+ */
+export declare const Rectangle: import("@pibbl/core").PibblPrimitiveComponent<RectangleProps, import("@pibbl/core").PrimitiveInput<RectangleProps, RectStyle>>;

package/dist/lib/components/rect.js

@@ -0,0 +1,83 @@
+import { definePrimitive } from "../define-primitive.js";
+import {
+  resolveRequiredLength,
+  stripLayoutParticipation
+} from "../style/resolve-built-in.js";
+import { registerOpaqueStyleProperties } from "../style/resolve-dispatch.js";
+import { adjustRectangleToPixelGrid } from "../util/pixel-grid-adjustments.js";
+import { renderPath } from "./path.js";
+import { createRectanglePath } from "../geometry/rectangle.js";
+import { resolveRoundedCornerStyle } from "./rounded-corner-style.js";
+function renderRectangle(props, style, ctx) {
+  let {
+    x = 0,
+    y = 0,
+    width,
+    height,
+    alignToPixelGrid,
+    cornerRadius,
+    cornerRadii,
+    ...pathStyle
+  } = style;
+  if (alignToPixelGrid) {
+    ({ x, y, width, height } = adjustRectangleToPixelGrid(
+      style.strokeWidth ?? 0,
+      x,
+      y,
+      width,
+      height,
+      alignToPixelGrid
+    ));
+  }
+  const rectPath = createRectanglePath({
+    x,
+    y,
+    width,
+    height,
+    cornerRadius,
+    cornerRadii
+  });
+  renderPath(
+    {
+      ...props,
+      keyboardNavigationBounds: props.keyboardNavigationBounds ?? {
+        x,
+        y,
+        width,
+        height
+      }
+    },
+    {
+      ...pathStyle,
+      d: rectPath
+    },
+    ctx,
+    { x, y, width, height },
+    cornerRadius === void 0 && cornerRadii === void 0
+  );
+}
+const Rectangle = definePrimitive(renderRectangle, {
+  resolveStyle: (style, context) => ({
+    ...stripLayoutParticipation(style),
+    x: 0,
+    y: 0,
+    width: resolveRequiredLength(
+      style.width,
+      context.percentageBasis.width,
+      "width",
+      context
+    ),
+    height: resolveRequiredLength(
+      style.height,
+      context.percentageBasis.height,
+      "height",
+      context
+    ),
+    ...resolveRoundedCornerStyle(4, style, context)
+  })
+});
+registerOpaqueStyleProperties(Rectangle, ["fill", "stroke", "cursor"]);
+export {
+  Rectangle
+};
+//# sourceMappingURL=rect.js.map

package/dist/lib/components/rect.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/lib/components/rect.ts"],
+  "sourcesContent": ["import { definePrimitive } from '../define-primitive.js';\nimport type {\n  PibblEventFocusOptions,\n  PibblEventHandlers,\n  PibblEventParticipationOptions,\n} from '../events/types.js';\nimport { RenderingContext2D } from '../types.js';\nimport type { PibblPhysics2DPropExtension } from '../types.js';\nimport {\n  resolveRequiredLength,\n  stripLayoutParticipation,\n} from '../style/resolve-built-in.js';\nimport type { RectStyle, ResolvedRectStyle } from '../style/types.js';\nimport { registerOpaqueStyleProperties } from '../style/resolve-dispatch.js';\nimport { adjustRectangleToPixelGrid } from '../util/pixel-grid-adjustments.js';\nimport { renderPath } from './path.js';\nimport { createRectanglePath } from '../geometry/rectangle.js';\nimport { resolveRoundedCornerStyle } from './rounded-corner-style.js';\n\n/**\n * Authored inputs for Rectangle, including the declared data and presentation options.\n *\n * @see {@link PibblEventHandlers}\n * @see {@link PibblEventParticipationOptions}\n * @see {@link PibblPhysics2DPropExtension}\n * @see {@link Rectangle}\n */\nexport interface RectangleProps extends PibblEventHandlers, PibblEventFocusOptions, PibblEventParticipationOptions, PibblPhysics2DPropExtension {}\n\nfunction renderRectangle(\n  props: RectangleProps,\n  style: Readonly<ResolvedRectStyle>,\n  ctx: RenderingContext2D,\n) {\n  let {\n    x = 0,\n    y = 0,\n    width,\n    height,\n    alignToPixelGrid,\n    cornerRadius,\n    cornerRadii,\n    ...pathStyle\n  } = style;\n\n  if (alignToPixelGrid) {\n    ({ x, y, width, height } = adjustRectangleToPixelGrid(\n      style.strokeWidth ?? 0,\n      x,\n      y,\n      width,\n      height,\n      alignToPixelGrid,\n    ));\n  }\n\n  const rectPath = createRectanglePath({\n    x,\n    y,\n    width,\n    height,\n    cornerRadius,\n    cornerRadii,\n  });\n\n  renderPath(\n    {\n      ...props,\n      keyboardNavigationBounds: props.keyboardNavigationBounds ?? {\n        x,\n        y,\n        width,\n        height,\n      },\n    },\n    {\n      ...pathStyle,\n      d: rectPath,\n    },\n    ctx,\n    { x, y, width, height },\n    cornerRadius === undefined && cornerRadii === undefined,\n  );\n}\n\n/**\n * Describes a rectangle primitive for JSX or createElement authoring.\n *\n * @param props - Authored component inputs, supplied through JSX or createElement. See the linked\n * props and style types.\n * @throws When called directly; Pibbl mounts this component through JSX or createElement.\n *\n * @see {@link RectangleProps}\n * @see {@link RectStyle}\n */\nexport const Rectangle = definePrimitive<\n  RectangleProps,\n  RectStyle,\n  RectStyle,\n  ResolvedRectStyle\n>(renderRectangle, {\n  resolveStyle: (style, context) => ({\n    ...stripLayoutParticipation(style),\n    x: 0,\n    y: 0,\n    width: resolveRequiredLength(\n      style.width,\n      context.percentageBasis.width,\n      'width',\n      context,\n    ),\n    height: resolveRequiredLength(\n      style.height,\n      context.percentageBasis.height,\n      'height',\n      context,\n    ),\n    ...resolveRoundedCornerStyle(4, style, context),\n  }) as ResolvedRectStyle,\n});\nregisterOpaqueStyleProperties(Rectangle, ['fill', 'stroke', 'cursor']);\n"],
+  "mappings": "AAAA,SAAS,uBAAuB;AAQhC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AAEP,SAAS,qCAAqC;AAC9C,SAAS,kCAAkC;AAC3C,SAAS,kBAAkB;AAC3B,SAAS,2BAA2B;AACpC,SAAS,iCAAiC;AAY1C,SAAS,gBACP,OACA,OACA,KACA;AACA,MAAI;AAAA,IACF,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AAEJ,MAAI,kBAAkB;AACpB,KAAC,EAAE,GAAG,GAAG,OAAO,OAAO,IAAI;AAAA,MACzB,MAAM,eAAe;AAAA,MACrB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AAEA,QAAM,WAAW,oBAAoB;AAAA,IACnC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED;AAAA,IACE;AAAA,MACE,GAAG;AAAA,MACH,0BAA0B,MAAM,4BAA4B;AAAA,QAC1D;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA,IACF;AAAA,IACA;AAAA,MACE,GAAG;AAAA,MACH,GAAG;AAAA,IACL;AAAA,IACA;AAAA,IACA,EAAE,GAAG,GAAG,OAAO,OAAO;AAAA,IACtB,iBAAiB,UAAa,gBAAgB;AAAA,EAChD;AACF;AAYO,MAAM,YAAY,gBAKvB,iBAAiB;AAAA,EACjB,cAAc,CAAC,OAAO,aAAa;AAAA,IACjC,GAAG,yBAAyB,KAAK;AAAA,IACjC,GAAG;AAAA,IACH,GAAG;AAAA,IACH,OAAO;AAAA,MACL,MAAM;AAAA,MACN,QAAQ,gBAAgB;AAAA,MACxB;AAAA,MACA;AAAA,IACF;AAAA,IACA,QAAQ;AAAA,MACN,MAAM;AAAA,MACN,QAAQ,gBAAgB;AAAA,MACxB;AAAA,MACA;AAAA,IACF;AAAA,IACA,GAAG,0BAA0B,GAAG,OAAO,OAAO;AAAA,EAChD;AACF,CAAC;AACD,8BAA8B,WAAW,CAAC,QAAQ,UAAU,QAAQ,CAAC;",
+  "names": []
+}

package/dist/lib/components/regular-polygon.d.ts

@@ -0,0 +1,102 @@
+import type { PibblEventFocusOptions, PibblEventHandlers, PibblEventParticipationOptions } from '../events/types.js';
+import type { BoxStyle, CursorStyle, LayoutItemStyle, Length, PaintStyle, RoundedCornerStyle } from '../style/types.js';
+import type { SystemStyle } from '../types.js';
+import type { PibblPhysics2DPropExtension } from '../types.js';
+/**
+ * Authored inputs for RegularPolygon, including the declared data and presentation options.
+ *
+ * @see {@link PibblEventHandlers}
+ * @see {@link PibblEventParticipationOptions}
+ * @see {@link PibblPhysics2DPropExtension}
+ * @see {@link RegularPolygon}
+ */
+export interface RegularPolygonProps extends PibblEventHandlers, PibblEventFocusOptions, PibblEventParticipationOptions, PibblPhysics2DPropExtension {
+}
+/**
+ * Center, side count, rotation, and paint shared by regular-polygon size variants.
+ *
+ * @see {@link RegularPolygonStyle}
+ */
+interface RegularPolygonCommonStyle extends RoundedCornerStyle {
+    /** Number of sides of the regular polygon. See {@link RegularPolygonCommonStyle}. */
+    sides: number;
+    /** Horizontal coordinate of the center. See {@link Length}. */
+    cx?: Exclude<Length, 'auto'>;
+    /** Vertical coordinate of the center. See {@link Length}. */
+    cy?: Exclude<Length, 'auto'>;
+    /** Rotation applied to the containing geometry. See {@link RegularPolygonCommonStyle}. */
+    rotation?: number;
+    /**
+     * Width used for line hit testing independently of the visible stroke width. See
+     * {@link RegularPolygonCommonStyle}.
+     */
+    lineInteractionWidth?: number;
+}
+/**
+ * Exactly one declared size measure for a regular polygon.
+ *
+ * @see {@link RegularPolygonStyle}
+ */
+type RegularPolygonSizeStyle = {
+    /** Distance from the polygon center to a vertex. See {@link Length}. */
+    circumradius: Exclude<Length, 'auto'>;
+    /**
+     * Not accepted in this variant; use the alternative fields instead. See
+     * {@link RegularPolygonSizeStyle}.
+     */
+    inradius?: never;
+    /**
+     * Not accepted in this variant; use the alternative fields instead. See
+     * {@link RegularPolygonSizeStyle}.
+     */
+    sideLength?: never;
+} | {
+    /**
+     * Not accepted in this variant; use the alternative fields instead. See
+     * {@link RegularPolygonSizeStyle}.
+     */
+    circumradius?: never;
+    /** Distance from the polygon center to an edge. See {@link Length}. */
+    inradius: Exclude<Length, 'auto'>;
+    /**
+     * Not accepted in this variant; use the alternative fields instead. See
+     * {@link RegularPolygonSizeStyle}.
+     */
+    sideLength?: never;
+} | {
+    /**
+     * Not accepted in this variant; use the alternative fields instead. See
+     * {@link RegularPolygonSizeStyle}.
+     */
+    circumradius?: never;
+    /**
+     * Not accepted in this variant; use the alternative fields instead. See
+     * {@link RegularPolygonSizeStyle}.
+     */
+    inradius?: never;
+    /** Length of one polygon edge. See {@link Length}. */
+    sideLength: Exclude<Length, 'auto'>;
+};
+/**
+ * Supported geometry and presentation properties for RegularPolygon.
+ *
+ * @see {@link SystemStyle}
+ * @see {@link PaintStyle}
+ * @see {@link CursorStyle}
+ * @see {@link BoxStyle}
+ * @see {@link LayoutItemStyle}
+ * @see {@link RegularPolygon}
+ */
+export type RegularPolygonStyle = RegularPolygonCommonStyle & RegularPolygonSizeStyle & SystemStyle & PaintStyle & CursorStyle & BoxStyle & LayoutItemStyle;
+/**
+ * Describes a regular-polygon primitive for JSX or createElement authoring.
+ *
+ * @param props - Authored component inputs, supplied through JSX or createElement. See the linked
+ * props and style types.
+ * @throws When called directly; Pibbl mounts this component through JSX or createElement.
+ *
+ * @see {@link RegularPolygonProps}
+ * @see {@link RegularPolygonStyle}
+ */
+export declare const RegularPolygon: import("@pibbl/core").PibblPrimitiveComponent<RegularPolygonProps, import("@pibbl/core").PrimitiveInput<RegularPolygonProps, RegularPolygonStyle>>;
+export {};