@6edesign/svelte-three/docs/_dist_/documentation/pages/tree/Branch.js

[Demo](https://6edesign.github.io/svelte-three-mograph/)

/* src/documentation/pages/tree/Branch.svelte generated by Svelte v3.31.2 */
import {
	SvelteComponent,
	assign,
	check_outros,
	create_component,
	destroy_component,
	detach,
	empty,
	get_spread_object,
	get_spread_update,
	group_outros,
	init,
	insert,
	mount_component,
	safe_not_equal,
	space,
	transition_in,
	transition_out
} from "../../../../web_modules/svelte/internal.js";

import { Vector3 } from "../../../../web_modules/three.js";
import Cylinder from "../../../components/primitives/Cylinder.js";
import { addVariance } from "../../../utils/index.js";

function create_if_block(ctx) {
	let branch;
	let current;
	const branch_spread_levels = [/*nextBranch*/ ctx[5]];
	let branch_props = {};

	for (let i = 0; i < branch_spread_levels.length; i += 1) {
		branch_props = assign(branch_props, branch_spread_levels[i]);
	}

	branch = new Branch({ props: branch_props });

	return {
		c() {
			create_component(branch.$$.fragment);
		},
		m(target, anchor) {
			mount_component(branch, target, anchor);
			current = true;
		},
		p(ctx, dirty) {
			const branch_changes = (dirty & /*nextBranch*/ 32)
			? get_spread_update(branch_spread_levels, [get_spread_object(/*nextBranch*/ ctx[5])])
			: {};

			branch.$set(branch_changes);
		},
		i(local) {
			if (current) return;
			transition_in(branch.$$.fragment, local);
			current = true;
		},
		o(local) {
			transition_out(branch.$$.fragment, local);
			current = false;
		},
		d(detaching) {
			destroy_component(branch, detaching);
		}
	};
}

function create_fragment(ctx) {
	let cylinder;
	let t;
	let if_block_anchor;
	let current;

	cylinder = new Cylinder({
			props: {
				position: /*position*/ ctx[0],
				rotation: /*rotation*/ ctx[2],
				height: /*height*/ ctx[3],
				radiusBottom: /*radiusBottom*/ ctx[1],
				radiusTop: /*radiusTop*/ ctx[4],
				translate: /*translate*/ ctx[6]
			}
		});

	let if_block = /*nextBranch*/ ctx[5] && create_if_block(ctx);

	return {
		c() {
			create_component(cylinder.$$.fragment);
			t = space();
			if (if_block) if_block.c();
			if_block_anchor = empty();
		},
		m(target, anchor) {
			mount_component(cylinder, target, anchor);
			insert(target, t, anchor);
			if (if_block) if_block.m(target, anchor);
			insert(target, if_block_anchor, anchor);
			current = true;
		},
		p(ctx, [dirty]) {
			const cylinder_changes = {};
			if (dirty & /*position*/ 1) cylinder_changes.position = /*position*/ ctx[0];
			if (dirty & /*rotation*/ 4) cylinder_changes.rotation = /*rotation*/ ctx[2];
			if (dirty & /*height*/ 8) cylinder_changes.height = /*height*/ ctx[3];
			if (dirty & /*radiusBottom*/ 2) cylinder_changes.radiusBottom = /*radiusBottom*/ ctx[1];
			if (dirty & /*radiusTop*/ 16) cylinder_changes.radiusTop = /*radiusTop*/ ctx[4];
			if (dirty & /*translate*/ 64) cylinder_changes.translate = /*translate*/ ctx[6];
			cylinder.$set(cylinder_changes);

			if (/*nextBranch*/ ctx[5]) {
				if (if_block) {
					if_block.p(ctx, dirty);

					if (dirty & /*nextBranch*/ 32) {
						transition_in(if_block, 1);
					}
				} else {
					if_block = create_if_block(ctx);
					if_block.c();
					transition_in(if_block, 1);
					if_block.m(if_block_anchor.parentNode, if_block_anchor);
				}
			} else if (if_block) {
				group_outros();

				transition_out(if_block, 1, 1, () => {
					if_block = null;
				});

				check_outros();
			}
		},
		i(local) {
			if (current) return;
			transition_in(cylinder.$$.fragment, local);
			transition_in(if_block);
			current = true;
		},
		o(local) {
			transition_out(cylinder.$$.fragment, local);
			transition_out(if_block);
			current = false;
		},
		d(detaching) {
			destroy_component(cylinder, detaching);
			if (detaching) detach(t);
			if (if_block) if_block.d(detaching);
			if (detaching) detach(if_block_anchor);
		}
	};
}

function instance($$self, $$props, $$invalidate) {
	let rotation;
	let height;
	let radiusTop;
	let translate;
	let { position } = $$props;
	let { baseAngle } = $$props;
	let { baseHeight } = $$props;
	let { radiusBottom } = $$props;
	let { shrinkFactor } = $$props;
	let { minHeight } = $$props;
	let { angleVariance = 0.03 } = $$props;
	let { heightVariance = 0.03 } = $$props;
	let { radiusVariance = 0.03 } = $$props;
	let nextBranch;

	$$self.$$set = $$props => {
		if ("position" in $$props) $$invalidate(0, position = $$props.position);
		if ("baseAngle" in $$props) $$invalidate(7, baseAngle = $$props.baseAngle);
		if ("baseHeight" in $$props) $$invalidate(8, baseHeight = $$props.baseHeight);
		if ("radiusBottom" in $$props) $$invalidate(1, radiusBottom = $$props.radiusBottom);
		if ("shrinkFactor" in $$props) $$invalidate(9, shrinkFactor = $$props.shrinkFactor);
		if ("minHeight" in $$props) $$invalidate(10, minHeight = $$props.minHeight);
		if ("angleVariance" in $$props) $$invalidate(11, angleVariance = $$props.angleVariance);
		if ("heightVariance" in $$props) $$invalidate(12, heightVariance = $$props.heightVariance);
		if ("radiusVariance" in $$props) $$invalidate(13, radiusVariance = $$props.radiusVariance);
	};

	$$self.$$.update = () => {
		if ($$self.$$.dirty & /*baseAngle, angleVariance*/ 2176) {
			$: $$invalidate(2, rotation = baseAngle.map(addVariance(angleVariance)));
		}

		if ($$self.$$.dirty & /*heightVariance, baseHeight*/ 4352) {
			$: $$invalidate(3, height = addVariance(heightVariance)(baseHeight));
		}

		if ($$self.$$.dirty & /*radiusVariance, radiusBottom*/ 8194) {
			$: $$invalidate(4, radiusTop = addVariance(radiusVariance)(radiusBottom * 0.2));
		}

		if ($$self.$$.dirty & /*height*/ 8) {
			$: $$invalidate(6, translate = [0, height / 2, 0]);
		}

		if ($$self.$$.dirty & /*baseHeight, minHeight, position, rotation, height, shrinkFactor, radiusTop*/ 1821) {
			$: {
				if (baseHeight > minHeight) {
					const { x, y, z } = new Vector3(...position).add(new Vector3(...rotation).normalize().multiplyScalar(height));

					$$invalidate(5, nextBranch = {
						position: [x, y, z],
						baseAngle: rotation,
						baseHeight: height * shrinkFactor,
						radiusBottom: radiusTop,
						shrinkFactor,
						minHeight
					});
				}
			}
		}
	};

	return [
		position,
		radiusBottom,
		rotation,
		height,
		radiusTop,
		nextBranch,
		translate,
		baseAngle,
		baseHeight,
		shrinkFactor,
		minHeight,
		angleVariance,
		heightVariance,
		radiusVariance
	];
}

class Branch extends SvelteComponent {
	constructor(options) {
		super();

		init(this, options, instance, create_fragment, safe_not_equal, {
			position: 0,
			baseAngle: 7,
			baseHeight: 8,
			radiusBottom: 1,
			shrinkFactor: 9,
			minHeight: 10,
			angleVariance: 11,
			heightVariance: 12,
			radiusVariance: 13
		});
	}
}

export default Branch;