@layoutit/polycss 0.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2025 Layoutit
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,199 @@
1
+ > **Status: pre-1.0. APIs may still change before a stable 1.0 release.**
2
+
3
+ # polycss
4
+
5
+ Vanilla JS / custom elements package for CSS-based polygon mesh rendering. Loads OBJ, glTF, GLB, and MagicaVoxel `.vox` files; renders each polygon as a real DOM element (atlas-backed `<i>` for both textured and flat-color faces) positioned with `transform: matrix3d(...)`. No WebGL, no canvas-as-scene.
6
+
7
+ Two entry points:
8
+
9
+ - **`polycss`**: imperative `createPolyScene` API + custom element classes (without auto-registering them).
10
+ - **`polycss/elements`**: side-effect import that registers the scene, mesh, polygon, controls, camera, helper, select, and transform-control custom elements.
11
+
12
+ ## Install
13
+
14
+ ```bash
15
+ npm install @layoutit/polycss
16
+ ```
17
+
18
+ Or via CDN (no build step):
19
+
20
+ ```html
21
+ <script type="module" src="https://esm.sh/@layoutit/polycss/elements"></script>
22
+ ```
23
+
24
+ ## Custom elements (declarative, primary path)
25
+
26
+ Register elements with the side-effect import:
27
+
28
+ ```html
29
+ <script type="module" src="https://esm.sh/@layoutit/polycss/elements"></script>
30
+
31
+ <poly-scene perspective="1000" rot-x="65" rot-y="45">
32
+ <poly-mesh src="/cottage.glb"></poly-mesh>
33
+ </poly-scene>
34
+ ```
35
+
36
+ With per-polygon elements:
37
+
38
+ ```html
39
+ <poly-scene perspective="1000" rot-x="65" rot-y="45">
40
+ <poly-polygon
41
+ vertices="[[0,0,0],[1,0,0],[0,1,0]]"
42
+ color="#ff0000"
43
+ ></poly-polygon>
44
+ <poly-polygon
45
+ vertices="[[2,0,0],[3,0,0],[2,1,0]]"
46
+ color="#0000ff"
47
+ ></poly-polygon>
48
+ </poly-scene>
49
+ ```
50
+
51
+ Custom elements accept standard DOM events: no framework needed:
52
+
53
+ ```html
54
+ <poly-scene id="scene" perspective="1000" rot-x="65" rot-y="45"></poly-scene>
55
+
56
+ <script type="module">
57
+ import "https://esm.sh/@layoutit/polycss/elements";
58
+
59
+ const scene = document.querySelector("#scene");
60
+
61
+ const polygons = [
62
+ { vertices: [[0,0,0],[1,0,0],[0,1,0]], color: "#f00", id: "a" },
63
+ { vertices: [[2,0,0],[3,0,0],[2,1,0]], color: "#00f", id: "b" },
64
+ ];
65
+
66
+ polygons.forEach(p => {
67
+ const el = document.createElement("poly-polygon");
68
+ el.setAttribute("vertices", JSON.stringify(p.vertices));
69
+ el.setAttribute("color", p.color);
70
+ el.addEventListener("click", () => console.log("clicked", p.id));
71
+ el.addEventListener("mouseenter", () => el.classList.add("hover"));
72
+ el.addEventListener("mouseleave", () => el.classList.remove("hover"));
73
+ scene.appendChild(el);
74
+ });
75
+ </script>
76
+
77
+ <style>
78
+ poly-polygon.hover { filter: brightness(1.5); }
79
+ </style>
80
+ ```
81
+
82
+ ### Custom element attributes
83
+
84
+ **`<poly-scene>`**
85
+
86
+ | Attribute | Description |
87
+ |---|---|
88
+ | `perspective` | CSS perspective distance in pixels |
89
+ | `rot-x` | Camera X-axis rotation in degrees |
90
+ | `rot-y` | Camera Y-axis rotation in degrees |
91
+ | `zoom` | Scale factor |
92
+ | `directional-direction` | Comma-separated `x, y, z` e.g. `"0.5, -0.7, 0.6"` |
93
+ | `directional-color` | Directional light color hex |
94
+ | `directional-intensity` | Directional light intensity |
95
+ | `ambient-intensity` | Ambient light intensity |
96
+ | `ambient-color` | Ambient light color hex |
97
+ | `texture-lighting` | `"baked"` or `"dynamic"` |
98
+ | `atlas-scale` | Raster scale for generated atlas pages; lower values reduce memory/detail |
99
+
100
+ For pointer drag, wheel zoom, and autorotate, drop a `<poly-orbit-controls>` child inside the scene (or wire `createPolyOrbitControls(scene, ...)` against the imperative API). For pan-first map-style input use `<poly-map-controls>` / `createPolyMapControls` instead. Mirrors Three.js's split between camera state (`<poly-scene>`) and camera input.
101
+
102
+ **`<poly-mesh>`**
103
+
104
+ | Attribute | Description |
105
+ |---|---|
106
+ | `src` | URL to `.obj`, `.glb`, `.gltf`, or `.vox` |
107
+ | `position` | Comma-separated `x, y, z` |
108
+ | `scale` | Uniform scale factor |
109
+ | `rotation` | Comma-separated euler degrees `x, y, z` |
110
+ | `auto-center` | Boolean: shift mesh bbox center to origin |
111
+
112
+ **`<poly-polygon>`**
113
+
114
+ | Attribute | Description |
115
+ |---|---|
116
+ | `vertices` | JSON array of `[x,y,z]` arrays |
117
+ | `color` | CSS color |
118
+ | `texture` | Image URL |
119
+ | `uvs` | JSON array of `[u,v]` pairs |
120
+ | `position` | Comma-separated `x, y, z` |
121
+ | `scale` | Uniform scale factor |
122
+ | `rotation` | Comma-separated euler degrees `x, y, z` |
123
+
124
+ ## Imperative API (escape hatch)
125
+
126
+ For programmatic control without custom elements:
127
+
128
+ ```js
129
+ import { createPolyScene, loadMesh } from "@layoutit/polycss";
130
+
131
+ const scene = createPolyScene(document.querySelector("#scene"), {
132
+ perspective: 1000,
133
+ rotX: 65,
134
+ rotY: 45,
135
+ directionalLight: { direction: [0.5, -0.7, 0.6] },
136
+ });
137
+
138
+ const mesh = await loadMesh("/cottage.glb", {
139
+ gltfOptions: { targetSize: 60 },
140
+ });
141
+ const handle = scene.add(mesh, { position: [0, 0, 0] });
142
+
143
+ // Later:
144
+ handle.setTransform({ position: [5, 0, 0] });
145
+ handle.remove();
146
+ mesh.dispose();
147
+ ```
148
+
149
+ ### Imperative API reference
150
+
151
+ **`createPolyScene(host, options)`**
152
+
153
+ | Option | Type | Description |
154
+ |---|---|---|
155
+ | `perspective` | `number` | CSS perspective distance |
156
+ | `rotX` | `number` | Camera X rotation in degrees |
157
+ | `rotY` | `number` | Camera Y rotation in degrees |
158
+ | `zoom` | `number` | Camera zoom scale |
159
+ | `distance` | `number` | Camera dolly pull-back in CSS pixels |
160
+ | `target` | `Vec3` | World-coordinate camera target |
161
+ | `directionalLight` | `PolyDirectionalLight` | Directional light config |
162
+ | `ambientLight` | `PolyAmbientLight` | Ambient light config |
163
+ | `textureLighting` | `"baked" \| "dynamic"` | Texture lighting mode |
164
+ | `atlasScale` | `number \| "auto"` | Raster scale for generated atlas pages |
165
+ | `autoCenter` | `boolean` | Rotate around the union bbox center of added meshes |
166
+
167
+ Returns a `PolySceneHandle`:
168
+
169
+ ```ts
170
+ interface PolySceneHandle {
171
+ add(mesh: ParseResult, opts?: { position?: Vec3; scale?: number | Vec3; rotation?: Vec3 }): PolyMeshHandle;
172
+ setOptions(partial: Partial<PolySceneOptions>): void;
173
+ destroy(): void;
174
+ }
175
+ ```
176
+
177
+ **`loadMesh(url, options?)`**
178
+
179
+ Fetches and parses a mesh by URL (dispatches by extension: `.obj`, `.glb`, `.gltf`, `.vox`). Returns `Promise<ParseResult>`.
180
+
181
+ ## Subpath imports
182
+
183
+ | Import | Effect |
184
+ |---|---|
185
+ | `import { createPolyScene } from "@layoutit/polycss"` | Imperative API + custom element classes (no auto-registration) |
186
+ | `import "@layoutit/polycss/elements"` | Side-effect: registers the polycss custom elements |
187
+
188
+ ## Re-exports from `@layoutit/polycss-core`
189
+
190
+ All `@layoutit/polycss-core` exports are re-exported from `@layoutit/polycss`, so vanilla users install one package:
191
+
192
+ ```ts
193
+ import { parseObj, parseGltf, parseVox, loadMesh, normalizePolygons } from "@layoutit/polycss";
194
+ import type { Polygon, Vec3, ParseResult } from "@layoutit/polycss";
195
+ ```
196
+
197
+ ## Docs
198
+
199
+ Full documentation at [polycss.com](https://polycss.com).
@@ -0,0 +1,367 @@
1
+ import { Polygon, Vec3, ParseResult, PolyDirectionalLight, PolyAmbientLight, PolyTextureLightingMode, CameraHandle } from '@layoutit/polycss-core';
2
+
3
+ type AtlasScale = number | "auto";
4
+
5
+ /**
6
+ * createPolyScene — imperative scene API. The vanilla counterpart to
7
+ * `<PolyScene>` in React / Vue.
8
+ *
9
+ * Per §API freeze: takes a host element + scene options, returns a
10
+ * `PolySceneHandle` whose `add(parseResult, transform?)` mounts a mesh under
11
+ * the scene root and returns a removable `PolyMeshHandle`.
12
+ *
13
+ * Implementation:
14
+ * - Inserts a `<div class="polycss-scene">` into the host.
15
+ * - Each `add(...)` creates a `<div class="polycss-mesh">` with the
16
+ * mesh transform; mounts every valid polygon as an atlas-backed
17
+ * background sprite.
18
+ * - `destroy()` removes the scene element and disposes every mesh
19
+ * (which in turn disposes generated atlas blob URLs).
20
+ *
21
+ * The scene element is a 0×0 anchor at world (0,0,0) — pinned via
22
+ * top:50%/left:50% so it sits at the visible center of the host. This
23
+ * matches React/Vue's PolyScene anchor pattern. Polygons render around
24
+ * the anchor via their own matrix3d translations.
25
+ */
26
+
27
+ interface PolySceneOptions {
28
+ perspective?: number | false;
29
+ rotX?: number;
30
+ rotY?: number;
31
+ zoom?: number;
32
+ /**
33
+ * Camera pull-back distance in CSS pixels. Increasing distance moves the
34
+ * camera farther from the target (scene appears smaller), applied as an
35
+ * outermost `translateZ(-distance)` in the scene transform. Matches the
36
+ * `distance` field in core's `CameraState`. Default: 0 (no dolly offset).
37
+ */
38
+ distance?: number;
39
+ /**
40
+ * World-coordinate camera target — the world point that appears at the
41
+ * viewport centre. Matches React's `CameraState.target`. Defaults to
42
+ * `[0, 0, 0]` so existing scenes that don't set it keep working.
43
+ *
44
+ * Internally encoded as the innermost translate in the scene transform:
45
+ * `scale(zoom) rotateX(rotX) rotate(rotY) translate3d(-ty*tile, -tx*tile, -tz*tile)`
46
+ * (world→CSS axis swap: world-X→CSS-Y, world-Y→CSS-X, world-Z→CSS-Z).
47
+ */
48
+ target?: Vec3;
49
+ directionalLight?: PolyDirectionalLight;
50
+ ambientLight?: PolyAmbientLight;
51
+ /** Textured polygon lighting mode. Defaults to "baked". */
52
+ textureLighting?: PolyTextureLightingMode;
53
+ /** Raster scale for generated atlas pages. `"auto"` reduces large atlases. */
54
+ atlasScale?: AtlasScale;
55
+ /**
56
+ * When `true`, rotation pivots around the union bbox of all added meshes
57
+ * instead of world (0,0,0). The scene wraps polygons in an inner div
58
+ * translated by `-bboxCenter`. Updates whenever a mesh is added/removed
59
+ * or `setOptions` is called. Mirrors React's `<PolyScene autoCenter>`.
60
+ */
61
+ autoCenter?: boolean;
62
+ }
63
+ interface PolyMeshTransform {
64
+ /** Stable identifier — exposed on the handle and reflected on the
65
+ * wrapper as `data-poly-mesh-id`. Used by selection helpers to
66
+ * resolve clicks back to the mesh and to dedupe selection state. */
67
+ id?: string;
68
+ position?: Vec3;
69
+ scale?: number | Vec3;
70
+ rotation?: Vec3;
71
+ /**
72
+ * Whether `scene.add()` should merge coplanar polygons before rendering.
73
+ * Defaults to `true`. Set `false` for animated/deforming meshes whose
74
+ * triangle topology must remain stable from frame to frame.
75
+ */
76
+ merge?: boolean;
77
+ /**
78
+ * Keep polygon leaf DOM nodes stable across setPolygons() calls when the
79
+ * mesh topology is unchanged. Intended for animated/deforming meshes.
80
+ */
81
+ stableDom?: boolean;
82
+ /**
83
+ * When `true`, this mesh's polygons are NOT included in the scene's
84
+ * auto-center bbox. Use for debug overlays / helpers that shouldn't
85
+ * shift the camera target when toggled. Defaults to `false`.
86
+ */
87
+ excludeFromAutoCenter?: boolean;
88
+ }
89
+ interface PolyMeshHandle {
90
+ /** The polygons that were loaded after normalization and automatic merge. */
91
+ polygons: Polygon[];
92
+ /** The `.polycss-mesh` wrapper div for this mesh. Exposed so layered
93
+ * helpers (selection, transform controls) can resolve a click target
94
+ * back to its owning mesh, attach event listeners, or measure the
95
+ * mesh's screen position via `getBoundingClientRect`. */
96
+ readonly element: HTMLElement;
97
+ /** Identifier passed via `PolyMeshTransform.id` (if any). Reflected on
98
+ * the wrapper as `data-poly-mesh-id`. */
99
+ readonly id?: string;
100
+ /** Current transform snapshot (position / rotation / scale). Returned
101
+ * by reference — treat as read-only and use `setTransform` to
102
+ * mutate. */
103
+ readonly transform: PolyMeshTransform;
104
+ /** Remove the mesh from the scene. */
105
+ remove(): void;
106
+ /** Replace polygon geometry without tearing down the scene or controls. */
107
+ setPolygons(polygons: Polygon[], options?: {
108
+ merge?: boolean;
109
+ stableDom?: boolean;
110
+ recomputeAutoCenter?: boolean;
111
+ }): void;
112
+ /** Update transform without re-parsing. */
113
+ setTransform(t: Partial<PolyMeshTransform>): void;
114
+ /** Revoke any blob URLs the parse created. Idempotent. */
115
+ dispose(): void;
116
+ /**
117
+ * Re-rasterize the atlas using the directional light inverse-rotated into
118
+ * the mesh's local frame. Call this after a mesh rotation has been
119
+ * committed (e.g., on pointer release in rotate-mode transform controls) to
120
+ * correct stale baked shading.
121
+ *
122
+ * **Background:** Baked atlas tiles encode `baseColor × Lambert(worldNormal,
123
+ * worldLight)`. When the mesh wrapper rotates via CSS, the polygon's normal
124
+ * in world space changes but the baked color doesn't — faces stay lit/unlit
125
+ * incorrectly. `rebakeAtlas()` inverse-rotates the world light into the
126
+ * mesh's local frame and re-runs the rasterizer; because
127
+ * `dot(localNormal, localLight) === dot(worldNormal, worldLight)` the
128
+ * output is correct for any rotation.
129
+ *
130
+ * **Performance note:** This does NOT run on every `setTransform` call —
131
+ * only when explicitly invoked, so dragging remains smooth. Call it on
132
+ * pointer release (or any point where you want to commit the new shading).
133
+ */
134
+ rebakeAtlas(): void;
135
+ /** Current `position` from the transform (matches framework API). */
136
+ getPosition(): Vec3 | undefined;
137
+ /** Current `rotation` from the transform (matches framework API). */
138
+ getRotation(): Vec3 | undefined;
139
+ /** Current `scale` from the transform (matches framework API). */
140
+ getScale(): number | Vec3 | undefined;
141
+ /** Polygons currently being rendered (matches framework API). */
142
+ getPolygons(): Polygon[];
143
+ }
144
+ interface PolySceneHandle {
145
+ /** Add a mesh to the scene. Returns a handle for later removal. */
146
+ add(mesh: ParseResult, opts?: PolyMeshTransform): PolyMeshHandle;
147
+ /** Update scene-level config (rotation, lighting, etc.). */
148
+ setOptions(partial: Partial<PolySceneOptions>): void;
149
+ /** Tear down the scene; revokes all blob URLs of registered meshes. */
150
+ destroy(): void;
151
+ /**
152
+ * The host element passed to `createPolyScene`. Exposed for layered
153
+ * helpers like `createPolyOrbitControls` that need to attach event listeners
154
+ * without tracking the host separately.
155
+ */
156
+ readonly host: HTMLElement;
157
+ /**
158
+ * Snapshot of the current options (camera, lighting, merge, autoCenter,
159
+ * textureLighting, atlasScale, perspective). Returned by reference, so
160
+ * callers must treat it as read-only — mutations won't propagate. Used
161
+ * by helpers that need to read the current camera state without
162
+ * duplicating it.
163
+ */
164
+ getOptions(): Readonly<PolySceneOptions>;
165
+ /** Snapshot of mesh handles currently in the scene (insertion order).
166
+ * Used by selection helpers to enumerate hit-test candidates. */
167
+ meshes(): readonly PolyMeshHandle[];
168
+ /** Resolve a `.polycss-mesh` element back to its handle, or `null` if
169
+ * the element doesn't belong to this scene. */
170
+ findMeshByElement(element: Element | null): PolyMeshHandle | null;
171
+ }
172
+ declare function createPolyScene(host: HTMLElement, options?: PolySceneOptions): PolySceneHandle;
173
+
174
+ interface PolyCameraOptions {
175
+ zoom?: number;
176
+ target?: Vec3;
177
+ rotX?: number;
178
+ rotY?: number;
179
+ /** Camera pull-back in CSS pixels (dolly). Default 0. */
180
+ distance?: number;
181
+ }
182
+ interface PolyPerspectiveCameraOptions extends PolyCameraOptions {
183
+ /** CSS perspective distance in pixels. Default 8000. */
184
+ perspective?: number;
185
+ }
186
+ interface PolyOrthographicCameraOptions extends PolyCameraOptions {
187
+ }
188
+ /** Extends CameraHandle with projection info for the container element. */
189
+ interface PolyPerspectiveCameraHandle extends CameraHandle {
190
+ readonly type: "perspective";
191
+ /** CSS `perspective` value to set on the camera container element. */
192
+ readonly perspectiveStyle: string;
193
+ }
194
+ interface PolyOrthographicCameraHandle extends CameraHandle {
195
+ readonly type: "orthographic";
196
+ /** CSS `perspective` value to set on the camera container element ("none"). */
197
+ readonly perspectiveStyle: "none";
198
+ }
199
+ /**
200
+ * Creates a perspective camera handle. The `perspectiveStyle` property
201
+ * returns the CSS value to apply to the camera container's `perspective`
202
+ * property (default `"8000px"`).
203
+ */
204
+ declare function createPolyPerspectiveCamera(options?: PolyPerspectiveCameraOptions): PolyPerspectiveCameraHandle;
205
+ /**
206
+ * Creates an orthographic camera handle. The `perspectiveStyle` property
207
+ * returns `"none"` — pass it to the container element's CSS `perspective`
208
+ * to disable perspective projection.
209
+ */
210
+ declare function createPolyOrthographicCamera(options?: PolyOrthographicCameraOptions): PolyOrthographicCameraHandle;
211
+
212
+ declare const ELEMENT_BASE$8: typeof HTMLElement;
213
+ declare class PolySceneElement extends ELEMENT_BASE$8 {
214
+ static get observedAttributes(): string[];
215
+ private _scene;
216
+ /**
217
+ * Returns the underlying PolySceneHandle. Children call this during their own
218
+ * connectedCallback to register meshes.
219
+ */
220
+ getScene(): PolySceneHandle | null;
221
+ private _readOptions;
222
+ private _readDirectionalLight;
223
+ private _readAmbientLight;
224
+ connectedCallback(): void;
225
+ disconnectedCallback(): void;
226
+ attributeChangedCallback(_name: string, oldValue: string | null, newValue: string | null): void;
227
+ }
228
+
229
+ declare const ELEMENT_BASE$7: typeof HTMLElement;
230
+ declare class PolyMeshElement extends ELEMENT_BASE$7 {
231
+ static get observedAttributes(): string[];
232
+ private _handle;
233
+ private _parseResult;
234
+ private _loadToken;
235
+ /** Returns the current mesh handle, or null if not yet loaded. */
236
+ getMeshHandle(): PolyMeshHandle | null;
237
+ connectedCallback(): void;
238
+ disconnectedCallback(): void;
239
+ attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
240
+ private _tearDown;
241
+ private _maybeLoad;
242
+ }
243
+
244
+ declare const ELEMENT_BASE$6: typeof HTMLElement;
245
+ declare class PolyPolygonElement extends ELEMENT_BASE$6 {
246
+ static get observedAttributes(): string[];
247
+ private _handle;
248
+ connectedCallback(): void;
249
+ disconnectedCallback(): void;
250
+ attributeChangedCallback(_name: string, oldValue: string | null, newValue: string | null): void;
251
+ private _tearDown;
252
+ private _mount;
253
+ }
254
+
255
+ declare const ELEMENT_BASE$5: typeof HTMLElement;
256
+ declare class PolyOrbitControlsElement extends ELEMENT_BASE$5 {
257
+ static get observedAttributes(): string[];
258
+ private _controls;
259
+ private _readAnimate;
260
+ private _readOptions;
261
+ private _findScene;
262
+ private _attach;
263
+ connectedCallback(): void;
264
+ disconnectedCallback(): void;
265
+ attributeChangedCallback(_name: string, oldValue: string | null, newValue: string | null): void;
266
+ }
267
+
268
+ declare const ELEMENT_BASE$4: typeof HTMLElement;
269
+ declare class PolyMapControlsElement extends ELEMENT_BASE$4 {
270
+ static get observedAttributes(): string[];
271
+ private _controls;
272
+ private _readAnimate;
273
+ private _readOptions;
274
+ private _findScene;
275
+ private _attach;
276
+ connectedCallback(): void;
277
+ disconnectedCallback(): void;
278
+ attributeChangedCallback(_name: string, oldValue: string | null, newValue: string | null): void;
279
+ }
280
+
281
+ /**
282
+ * <poly-perspective-camera> — standalone perspective camera element.
283
+ *
284
+ * Wraps `createPolyPerspectiveCamera`. Unlike <poly-scene> which owns the
285
+ * scene DOM, this element provides a camera context that child controls can
286
+ * read. It creates a `<div class="polycss-camera">` wrapper with the
287
+ * CSS `perspective` property set.
288
+ *
289
+ * Attributes (all optional):
290
+ * perspective — number, CSS perspective in pixels (default 8000)
291
+ * zoom — number
292
+ * rot-x — number, degrees (default 65)
293
+ * rot-y — number, degrees (default 45)
294
+ * target — "x,y,z" comma-separated world coordinates
295
+ * distance — number, camera pull-back in CSS pixels
296
+ */
297
+
298
+ declare const ELEMENT_BASE$3: typeof HTMLElement;
299
+ declare class PolyPerspectiveCameraElement extends ELEMENT_BASE$3 {
300
+ static get observedAttributes(): string[];
301
+ private _camera;
302
+ private _wrapper;
303
+ /** Returns the camera handle, or null if not yet connected. */
304
+ getCamera(): PolyPerspectiveCameraHandle | null;
305
+ private _readOptions;
306
+ private _mount;
307
+ private _teardown;
308
+ connectedCallback(): void;
309
+ disconnectedCallback(): void;
310
+ attributeChangedCallback(_name: string, oldValue: string | null, newValue: string | null): void;
311
+ }
312
+
313
+ /**
314
+ * <poly-orthographic-camera> — standalone orthographic camera element.
315
+ *
316
+ * Wraps `createPolyOrthographicCamera`. Sets CSS `perspective: none` on the
317
+ * camera wrapper, disabling perspective projection.
318
+ *
319
+ * Attributes (all optional):
320
+ * zoom — number
321
+ * rot-x — number, degrees (default 65)
322
+ * rot-y — number, degrees (default 45)
323
+ * target — "x,y,z" comma-separated world coordinates
324
+ * distance — number, camera pull-back in CSS pixels
325
+ */
326
+
327
+ declare const ELEMENT_BASE$2: typeof HTMLElement;
328
+ declare class PolyOrthographicCameraElement extends ELEMENT_BASE$2 {
329
+ static get observedAttributes(): string[];
330
+ private _camera;
331
+ private _wrapper;
332
+ /** Returns the camera handle, or null if not yet connected. */
333
+ getCamera(): PolyOrthographicCameraHandle | null;
334
+ private _readOptions;
335
+ private _mount;
336
+ private _teardown;
337
+ connectedCallback(): void;
338
+ disconnectedCallback(): void;
339
+ attributeChangedCallback(_name: string, oldValue: string | null, newValue: string | null): void;
340
+ }
341
+
342
+ declare const ELEMENT_BASE$1: typeof HTMLElement;
343
+ declare class PolyTransformControlsElement extends ELEMENT_BASE$1 {
344
+ static get observedAttributes(): string[];
345
+ private _tc;
346
+ private _findScene;
347
+ private _findTargetMesh;
348
+ private _readOptions;
349
+ private _attach;
350
+ connectedCallback(): void;
351
+ disconnectedCallback(): void;
352
+ attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
353
+ }
354
+
355
+ declare const ELEMENT_BASE: typeof HTMLElement;
356
+ declare class PolySelectElement extends ELEMENT_BASE {
357
+ static get observedAttributes(): string[];
358
+ private _selection;
359
+ private _findScene;
360
+ private _readOptions;
361
+ private _attach;
362
+ connectedCallback(): void;
363
+ disconnectedCallback(): void;
364
+ attributeChangedCallback(_name: string, oldValue: string | null, newValue: string | null): void;
365
+ }
366
+
367
+ export { type PolySceneHandle as P, type PolyMeshHandle as a, type PolyCameraOptions as b, PolyMapControlsElement as c, PolyMeshElement as d, type PolyMeshTransform as e, PolyOrbitControlsElement as f, PolyOrthographicCameraElement as g, type PolyOrthographicCameraHandle as h, type PolyOrthographicCameraOptions as i, PolyPerspectiveCameraElement as j, type PolyPerspectiveCameraHandle as k, type PolyPerspectiveCameraOptions as l, PolyPolygonElement as m, PolySceneElement as n, type PolySceneOptions as o, PolySelectElement as p, PolyTransformControlsElement as q, createPolyOrthographicCamera as r, createPolyPerspectiveCamera as s, createPolyScene as t };