Alex Brombal brombal

hashbang.js monitors the URL fragment (hashtag) for changes and invokes callbacks when they occur. You can specify a fragment as a string or a regular expression, and callbacks that should be fired when the fragment appears and disappears from the URL.

Examples:

As a complete object, with both plain string and regular expression matches, and 'load' and 'unload' callbacks:

hashbang({

	<?php
	/**
	* Plugin Name: ACF Wysiwyg Style Select
	* Description: Custom style select boxes for ACF Wysiwyg editors.
	* Author: Alex Brombal
	* Author URI: http://www.brombal.com
	* Version: 1.1
	* License: MIT
	*/

	/*
	* Media query helpers
	*
	* DEVICES:
	* mobile = up to, but not including landscape iPhone 6 (< 736px)
	* tablet = landscape iPhone 6 up to but not including landscape iPad (>= 736px && < 1024px)
	* desktop = landscape iPad and greater
	*
	* COMBOS:
	* compact = mobile & tablet

	/**
	* fillFont.js
	* Copyright © 2016 Alex Brombal
	*
	* Resizes an element's font size to fill its parent container.
	*
	* Usage:
	*
	* 1. Include this file on your page, after jQuery.
	*

	// Fluid Sizing
	// Fluidly scales a value between a minimum and maximum (aka "CSS-locks")
	//
	// Example:
	// @include fluid-size(font-size, 320px, 10px, 768px, 24px);
	// This will yield a font-size property that smoothly scales between 10px (when the
	// viewport is at 320px) and 24px (when the viewport is at 768px). It won't ever
	// go higher than 24px or lower than 10px.

	@function strip-unit($value) {

	import { useEffect } from 'react';

	/**
	* Just like useEffect, but only executes after `wait` milliseconds have elapsed since
	* the last time the dependencies changed.
	*/
	export default function useEffectDebounced(action: () => void, deps: any[], wait: number) {
	useEffect(() => {
	const t = setTimeout(action, wait);

	/*
	# mapObject

	mapObject<TOut, TIn = any>(
	object: TIn,
	callback: (value: any, path: string[], root: any) => any,
	options?: {
	mutate?: boolean;
	thisArg?: any;
	omitEmpty?: boolean;

	/*
	<RenderOne> renders only its first <Case> child whose `when` prop is truthy. If no <Case> has a truthy `when` prop,
	the first <Case> with no `when` prop present will render.

	E.g.:

	```jsx
	<RenderOne>
	<Case when={someCondition}>
	... someCondition is true ...

	/**
	Returns an object that can be used to compare `a` and `b` (and their nested properties) using `===`.

	The return value will be structurally the same as `b`. However, any properties that are
	equivalent objects (using a deep comparison) to `a`'s properties will be comparable using `===`.
	This will be true for properties at any nested level, including the top level (i.e. if `a` and `b`
	are equivalent, `a` will be identical to the return value).

	E.g.: