roxxie-proxy-u-prod 0.1.0

package/source/external/dreamlandjs/src/core/jsx/definitions.ts

@@ -0,0 +1,125 @@
+import { CssInit } from "../css";
+import { Pointer } from "../state/pointers";
+import { Stateful } from "../state/state";
+import { COMMA_TOKEN } from "../consts";
+
+export type ComponentChild =
+	| Node
+	| string
+	| number
+	| boolean
+	| null
+	| undefined
+	| ComponentChild[]
+	| Pointer<ComponentChild>;
+
+type BannedPropNames = "cx" | "root";
+type BanProps<T extends object> = {
+	[K in keyof T]: K extends BannedPropNames ? never : T[K];
+};
+type MapChildren<ChildrenTy> =
+	ChildrenTy extends Array<any> ? ChildrenTy : [ChildrenTy];
+
+type _StateProps<Combined extends BanProps<Combined>> = {
+	[K in keyof Combined]: K extends "children"
+		? MapChildren<Combined[K]>
+		: Combined[K];
+} & { root: JSX.Element; cx: ComponentCx<_StateProps<Combined>> };
+type StateProps<
+	Props extends BanProps<Props>,
+	This extends BanProps<This>,
+> = _StateProps<Props & This>;
+type ComponentStateProps<T extends Component<any, any>> =
+	T extends Component<infer Props, infer This>
+		? StateProps<Props, This>
+		: never;
+
+export type FC<
+	Props extends BanProps<Props> = {},
+	This extends BanProps<This> = {},
+> = Stateful<StateProps<Props, This>>;
+
+export type ComponentFn<
+	Props extends BanProps<Props> = {},
+	This extends BanProps<This> = {},
+> = {
+	["typescript hackfix"](this: FC<Props, This>): HTMLElement;
+}["typescript hackfix"];
+export type Component<
+	Props extends BanProps<Props> = {},
+	This extends BanProps<This> = {},
+> = ComponentFn<Props, This> & { style?: CssInit };
+
+type ComponentCx<StatefulProps extends { [COMMA_TOKEN]?: never } & object> = {
+	state: Stateful<StatefulProps>;
+	id?: string;
+
+	// Run on client and server (return value not accessible)
+	init?: () => Promise<any> | any;
+	// Run only on client (return value not accessible)
+	mount?: () => Promise<any> | any;
+} & {
+	[K in keyof DLComponentContextExtraProps]?: DLComponentContextExtraProps[K];
+};
+
+export type ComponentFnState<T extends Component<any, any>> =
+	T extends ComponentFn<infer Props, infer This> ? FC<Props, This> : never;
+export type ComponentState<T extends Component<any, any>> =
+	T extends Component<infer Props, infer This> ? FC<Props, This> : never;
+export type ComponentContext<T extends Component<any, any>> = ComponentCx<
+	ComponentStateProps<T>
+>;
+export type ComponentInstance<T extends Component<any, any>> = HTMLElement & {
+	$: ComponentContext<T>;
+};
+
+type IntrinsicProps<ElementType extends Element> = {
+	this?: Pointer<ElementType | Element | null | undefined>;
+	children?: any;
+	[key: `class:${string}`]: Pointer<boolean> | boolean;
+	[key: `on:${string}`]: (e: any) => void;
+	[key: string]: any;
+};
+
+type DLElementTagNames = HTMLElementTagNameMap &
+	HTMLElementDeprecatedTagNameMap &
+	Pick<
+		SVGElementTagNameMap,
+		Exclude<keyof SVGElementTagNameMap, keyof HTMLElementTagNameMap>
+	>;
+export type DLElementNameToElement<T extends string> =
+	T extends keyof DLElementTagNames ? DLElementTagNames[T] : HTMLElement;
+type GlobalElement = Element;
+
+type MappedProps<Props> = {
+	[Key in keyof Props]: Props[Key] | Pointer<Props[Key]>;
+};
+
+// eslint-disable-next-line @typescript-eslint/no-namespace
+export namespace JSX {
+	export type IntrinsicElements = {
+		[El in keyof DLElementTagNames]: IntrinsicProps<DLElementTagNames[El]>;
+	} & {
+		[element: string]: IntrinsicProps<GlobalElement>;
+	};
+
+	export type ElementType = keyof IntrinsicElements | Component<any, any>;
+	export type Element = HTMLElement;
+	export type LibraryManagedAttributes<C, _> =
+		C extends Component<infer Props, any> ? MappedProps<Props> : never;
+}
+
+import DLJSX = JSX;
+
+declare global {
+	// we reserve the right to add new props to ComponentContext at any time without making it a breaking semver version, so be careful
+	interface DLComponentContextExtraProps {}
+
+	// eslint-disable-next-line @typescript-eslint/no-namespace
+	namespace JSX {
+		type IntrinsicElements = DLJSX.IntrinsicElements;
+		type ElementType = DLJSX.ElementType;
+		type Element = DLJSX.Element;
+		type LibraryManagedAttributes<A, B> = DLJSX.LibraryManagedAttributes<A, B>;
+	}
+}

package/source/external/dreamlandjs/src/core/jsx/dom.ts

@@ -0,0 +1,49 @@
+import { MAP } from "../consts";
+import { genuid } from "../css";
+import { Component, ComponentContext, ComponentState } from "./definitions";
+
+export let CSS_IDENT = "dlcss-";
+
+type NodeConstructor = (text?: string) => any;
+type CssUidGenerator = (init: Component<any, any>) => string;
+type IsHydrating = (el: HTMLElement) => boolean;
+type SsrTransformCallback = <T extends Component<any, any>>(
+	init: T,
+	state: ComponentState<T>,
+	cx?: ComponentContext<T>
+) => void;
+type CxList = ComponentContext<Component<any, any>>[];
+type CbRetList = (Promise<any> | any)[];
+
+export type DomImpl = [
+	document: any,
+	Node: any,
+	new_Text: NodeConstructor,
+	new_Comment: NodeConstructor,
+	gencssuid: CssUidGenerator,
+	cssinfo: Map<any, any>,
+	hydrating?: IsHydrating,
+	ssrTransform?: SsrTransformCallback,
+	cxs?: CxList,
+	inits?: CbRetList,
+	mounts?: CbRetList,
+];
+
+export interface CssInfo {
+	_id: string;
+	_vars: [string, (props: any) => any][];
+}
+let componentCssInfo: Map<Component, CssInfo> = MAP();
+export let getDom: () => DomImpl = () => [
+	globalThis.document,
+	globalThis.Node,
+	(text) => new Text(text),
+	(text) => new Comment(text),
+	(init) => init.name + "-" + genuid(),
+	componentCssInfo,
+	() => false,
+];
+
+export let setDomImpl = (impl: () => DomImpl) => {
+	getDom = impl;
+};

package/source/external/dreamlandjs/src/core/jsx/index.ts

@@ -0,0 +1,289 @@
+import { getDom, CSS_IDENT, CssInfo } from "./dom";
+import { CSS_COMPONENT, genuid } from "../css";
+import {
+	Component,
+	ComponentChild,
+	ComponentContext,
+	ComponentInstance,
+	DLElementNameToElement,
+} from "./definitions";
+import { Pointer, maybeListen } from "../state/pointers";
+import { createState, stateProxy, Stateful } from "../state/state";
+import { DelegateListener } from "../delegate";
+import { mapChild } from "./child";
+
+export let currentComponentCx:
+	| ComponentContext<Component<any, any>>
+	| undefined;
+export let callDelegateListeners = (
+	value: any,
+	listeners: DelegateListener<any>[]
+): void =>
+	listeners.map((x) => {
+		let old = currentComponentCx;
+		currentComponentCx = x._cx;
+		x._callback(value);
+		currentComponentCx = old;
+	}) as any as void;
+
+let CREATE_ELEMENT = "createElement" as const;
+
+function _jsx<T extends Component<any, any>>(
+	init: T,
+	props: Record<string, any> | null,
+	key?: string
+): ComponentInstance<T>;
+function _jsx<T extends string>(
+	init: T,
+	props: Record<string, any> | null,
+	key?: string
+): DLElementNameToElement<T>;
+function _jsx(
+	init: Component<any, any> | string,
+	_props: Record<string, any> | null,
+	key?: string
+): HTMLElement {
+	let [
+		DOCUMENT,
+		NODE,
+		,
+		,
+		genCssUid,
+		componentCssInfo,
+		hydrating,
+		ssrTransform,
+		cxs = [],
+		inits = [],
+		mounts = [],
+	] = getDom();
+	let lastCssIdent = currentComponentCx?.id;
+
+	dev: {
+		if (!["string", "function"].includes(typeof init))
+			throw new Error("invalid component");
+	}
+
+	let { children: _children, ...props } = _props!;
+	if (init === Fragment) return _children;
+	if (key) props.key = key;
+	_children ||= [];
+	let children = _children instanceof Array ? _children : [_children];
+
+	let el: HTMLElement;
+	let setStyle = (ptr: Pointer<any>, style: CSSStyleDeclaration, k: string) =>
+		maybeListen(ptr, el, (v: any) => {
+			if (v === undefined) style.removeProperty(k);
+			else style.setProperty(k, v);
+		});
+
+	if (typeof init === "function") {
+		let state = createState({ children }) as Stateful<any>;
+		let cssInfo: CssInfo | undefined = componentCssInfo.get(init);
+
+		for (let attr in props) {
+			let val = props[attr];
+
+			if (val instanceof Pointer) {
+				stateProxy(state, attr, val);
+			} else {
+				state[attr] = val;
+			}
+		}
+
+		ssrTransform?.(init, state);
+
+		for (let child of children) {
+			// any pointers passed as children were unable to inherit the currentCssIdent.
+			// we add the currentCssIdent (which is of the parent) here since we know that the pointer came from the parent.
+			// this might break if pointers of elements are being passed as props but oh well
+			if (child instanceof Pointer) {
+				child._cssIdent ||= lastCssIdent;
+			}
+		}
+
+		if (init.style) {
+			let style = init.style;
+			let styleEl = DOCUMENT[CREATE_ELEMENT]("style");
+			if (!cssInfo) {
+				cssInfo = { _id: CSS_IDENT + genCssUid(init), _vars: [] };
+				let cssString = "";
+
+				for (let i = 0; i < style._strings.length; i++) {
+					cssString += style._strings[i];
+					if (i + 1 < style._strings.length) {
+						let func = style._funcs[i];
+						if (typeof func === "string") {
+							cssString += func;
+						} else {
+							let varid = genuid();
+							cssString += `var(--${varid})`;
+							cssInfo._vars.push([varid, func]);
+						}
+					}
+				}
+
+				if (!hydrating?.(styleEl)) {
+					styleEl.setAttribute(CSS_COMPONENT, init.name);
+					styleEl.setAttribute(CSS_IDENT + "id", cssInfo._id);
+
+					DOCUMENT.head.append(styleEl);
+					style._rewrite(styleEl, cssString, cssInfo._id);
+				}
+				componentCssInfo.set(init, cssInfo);
+			}
+		}
+
+		let cx = {
+			state,
+			id: cssInfo?._id,
+		} as ComponentContext<any>;
+
+		let old = currentComponentCx;
+		state.cx = cx;
+		currentComponentCx = cx;
+		el = init.call(state);
+		currentComponentCx = old;
+		state.root = el;
+
+		if (el instanceof NODE) {
+			dev: {
+				if ((el as ComponentInstance<any>).$ && cssInfo)
+					throw new Error("Wrapper components cannot have CSS");
+			}
+
+			(el as ComponentInstance<any>).$ = cx;
+
+			el.classList.add(CSS_COMPONENT);
+
+			if (cssInfo)
+				for (let [varid, func] of cssInfo._vars) {
+					let id = `--${varid}`;
+					let style = el.style;
+					setStyle(func(cx.state), style, id);
+				}
+		}
+
+		ssrTransform?.(init, state, cx);
+
+		currentComponentCx = cx;
+		inits.push(cx.init?.());
+
+		if (el instanceof NODE && hydrating?.(el)) cxs.push(cx);
+		else if (hydrating) {
+			mounts.push(cx.mount?.());
+		}
+		currentComponentCx = old;
+	} else {
+		// <svg> elemnts need to be created with createElementNS specifically
+		// we know it's an svg element if it has the xmlns attribute
+		let xmlns = props?.xmlns;
+		let setAttr = (param: string, val: any) => {
+			if (hydrating?.(el)) return;
+
+			if (val === undefined || val === false) el.removeAttribute(param);
+			else el.setAttribute(param, val);
+		};
+		el = (DOCUMENT as any)[CREATE_ELEMENT + (xmlns ? "NS" : "")](
+			xmlns || init,
+			xmlns && init,
+			props,
+			children
+		);
+
+		for (let child of children) {
+			let ret = mapChild(child, el, lastCssIdent);
+			ret.map((x) => {
+				if (x.parentNode !== el) el.appendChild(x);
+			});
+		}
+
+		let classList = el.classList;
+
+		for (let attr in props) {
+			let val = props[attr];
+			let oldClasses: string[] = [];
+			if (attr === "this") {
+				val.value = el;
+			} else if (attr === "value" || attr === "checked") {
+				maybeListen(
+					val,
+					el,
+					(val: any) => {
+						setAttr(attr, val);
+						(el as any)[attr] = val;
+					},
+					() => {
+						el.addEventListener("input", () => (val.value = (el as any)[attr]));
+					}
+				);
+			} else if (attr === "class") {
+				maybeListen(val, el, (val: string) => {
+					// document.createElement("div").classList.{add,remove}(...[]) work
+					// document.createElement("div").classList.{add,remove}(...[""]) throw
+					let classes = val.split(" ").filter((x) => x.length);
+					classList.remove(...oldClasses);
+					classList.add(...classes);
+					oldClasses = classes;
+				});
+			} else if (attr.startsWith("on:")) {
+				el.addEventListener(attr.slice(3), val);
+			} else if (attr.startsWith("class:")) {
+				maybeListen(val, el, (val: boolean) => {
+					classList[val ? "add" : "remove"](attr.slice(6));
+				});
+			} else if (attr.startsWith("attr:")) {
+				maybeListen(val, el, (val: boolean) => {
+					if (!hydrating?.(el)) (el as any)[attr.slice(5)] = val;
+				});
+			} else if (
+				attr == "style" &&
+				typeof val == "object" &&
+				!(val instanceof Pointer)
+			) {
+				for (let k in val) {
+					setStyle(val[k], el.style, k);
+				}
+			} else {
+				maybeListen(val, el, (val) => setAttr(attr, val));
+			}
+		}
+
+		if (lastCssIdent && ![...classList].find((x) => x.startsWith(CSS_IDENT)))
+			classList.add(lastCssIdent);
+
+		// all children would need to also be created with the correct namespace if we were doing this properly
+		// this is annoying and expensive bundle size wise, so it's easier to just force a reparse
+		// NOTE: bindings on children of svgs will be lost, and conditionals inside svgs will break
+		// this is fine, no one does that anyway
+		// eslint-disable-next-line no-self-assign
+		if (xmlns) el.innerHTML = el.innerHTML;
+	}
+
+	return el;
+}
+
+function _h<T extends Component<any, any>>(
+	init: T,
+	props: Record<string, any> | null,
+	...children: ComponentChild[]
+): ComponentInstance<T>;
+function _h<T extends string>(
+	init: T,
+	props: Record<string, any> | null,
+	...children: ComponentChild[]
+): DLElementNameToElement<T>;
+function _h(
+	init: Component<any, any> | string,
+	props: Record<string, any> | null,
+	...children: ComponentChild[]
+): HTMLElement {
+	// @ts-expect-error you suck
+	return jsx(init, { children, ...props });
+}
+
+export let h = _h;
+export let jsx = _jsx;
+
+export let Fragment = ((_: any) => 0) as any as Component<{
+	children?: ComponentChild;
+}>;

package/source/external/dreamlandjs/src/core/state/index.ts

@@ -0,0 +1 @@
+export { defineUse } from "./use";