François Georgy francoisgeorgy

jQuery source is now authored using ES6 modules. It's possible to use them directly in the browser without any build process.

To test it locally, first clone the jQuery repository:

git clone [email protected]:jquery/jquery.git

Then, write the following index.html file:

	function useStickyState(defaultValue, key) {
	const [value, setValue] = React.useState(() => {
	const stickyValue = window.localStorage.getItem(key);
	return stickyValue !== null
	? JSON.parse(stickyValue)
	: defaultValue;
	});
	React.useEffect(() => {
	window.localStorage.setItem(key, JSON.stringify(value));
	}, [key, value]);

	// Nullable values to hooks

	const [user, setUser] = React.useState<IUser \| null>(null);

	// Generic Components

	interface Props<T> {
	items: T[];
	renderItem: (item: T) => React.ReactNode;
	}

	//extending interfaces
	interface PartialPointX { x: number; }
	interface Point extends PartialPointX { y: number; }

	//extending types
	type PartialPointX = { x: number; };
	type Point = PartialPointX & { y: number; };

	// Interface extends type
	type PartialPointX = { x: number; };

	enum SelectableButtonTypes {
	Important = "important",
	Optional = "optional",
	Irrelevant = "irrelevant"


	interface IButtonProps {
	text: string,
	/** The type of button, pulled from the Enum SelectableButtonTypes */
	type: SelectableButtonTypes,

	interface IButtonProps {
	text: string,
	type: ButtonTypes,
	action: () => void
	}

	const ExtendedButton : React.FC<IButtonProps> = ({text, type, action}) => {
	//...
	}

	function Box({ as = "div", children, ...props }) {
	if (typeof children === "function") {
	return children(props);
	}
	return React.createElement(as, props, children);
	}

	// <div id="id">
	<Box id="id" />

	.container {
	display: grid;
	grid-gap: 5px;
	grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
	grid-template-rows: repeat(2, 100px);
	}

	let a = ["zero", "one", "two", "three"];
	a.slice(0).reverse().map((o, i) => {
	console.log(`${i}, ${o}`);
	});

	/* RESULT:
	> let a = ["zero", "one", "two", "three"];
	> a.slice(0).reverse().map((o, i) => { console.log(`${i}, ${o}`); });
	0, three
	1, two