saltnpixels

const useStickyScroll = (
    {
        elementRef,
        containerRef
    }: {elementRef: any; containerRef?: any; onScroll?: (y: number) => void},
    dependencies: any[] = []
) => {
    const [isSticky, setIsSticky] = useState(false);
    // Use useRef for the callback to avoid triggering re-renders
    const onCallbackRef = useRef<(y: number) => void>();

saltnpixels

import { useState, useLayoutEffect } from 'react';
import throttle from 'lodash.throttle';

function useResizeObserver(ref: React.MutableRefObject<any>) {
  const [dimensions, setDimensions] = useState({
    width: 0,
    height: 0,
    dimensionsLoaded: false,
  });

saltnpixels

import { useRef, useEffect, Children, cloneElement, ReactElement, useState } from 'react';
import Swiper from 'swiper';
import { SwiperOptions } from 'swiper/types';
import { Pagination, Navigation } from 'swiper/modules';
import { Box, BoxProps, MotionBox } from '@components';
import { Chevronleft, Chevronright } from '@/icons';
import uniqueId from 'lodash.uniqueid';
import { Variants } from 'framer-motion';

// now importing all thee manually with emotion

saltnpixels

add_action( 'gform_after_create_post', 'gf_add_to_media_library', 10, 3 );

/**
 * Save file upload fields under custom post field to the library
 *
 * @param    $post_id  The post identifier
 * @param    $entry     The entry
 * @param    $form      The form
 */

saltnpixels

<?php
/*--------------------------------------------------------------
# Saving Features to Membership Levels from an acf repeater field for RCP Pro
--------------------------------------------------------------*/
function some_feature_list( $level ) {

	/**
	 * @var RCP_Levels $rcp_levels_db
	 */
	global $rcp_levels_db;

saltnpixels

// must have a loading state that turns true when fetching data and false afterwards
// callback is responsible for setting loading state as well as deciding if it should even run. (check if pages left etc...)
// scrollingElement defaults to viewport if none used. If wanted put it as a ref on a scrollable element
// sentry must be placed as a ref and is not optional

import { useCallback, useEffect, useRef, useState } from 'react';

export default function useInfiniteScroller({
  isLoading,
  callback,

saltnpixels

import React, { useEffect, useRef, useState, useCallback } from 'react';
import { throttle } from 'lodash';

/**
 * Returns a ref, and a stateful value bound to the ref as well as observe function
 * The observe runs automatically on window scroll but you can observe another elements scroll if you want
 */
export default function useSticky<T extends HTMLElement>(fn ?: (stickyActive?: boolean)=> void) {
  const stickyRef = useRef<T>(null);
  const [sticky, setSticky] = useState(false);

saltnpixels

html {
  font-size: 62.5%;
  box-sizing: border-box;
}

* {
  box-sizing: inherit;
}

body {

saltnpixels

• Install iTerm2 from https://www.iterm2.com/
• Install oh-my-zsh from https://ohmyz.sh/ or https://github.com/robbyrussell/oh-my-zsh
• Set iTerm2 theme tab theme to Dark - Preferences | Appearance | Tabs | Theme > Dark
• Install Fira Code fonts from https://github.com/tonsky/FiraCode (Clone and navigate to dstr > ttf, install all font files by double clicking)
• Install Powerline fonts from https://github.com/powerline/fonts
• Set fonts for iTerm2 - Preferences | Profiles | Text
  • Change Font to 14pt Fira code regular and Check Use Ligatures checkbox
  • Change Non ASCII Font to 14pt Fira mono and Check Use Ligatures checkbox
• Install iTerm2 snazzy theme from https://github.com/sindresorhus/iterm2-snazzy
  • Navigate to Preferences | Profiles | Color Presets > Snazzy

saltnpixels

.aspect-ratio {
	position: relative;
  // needs a set height, so override when using on a component

	&::before {
		content: "";
		display: block;
		height: 0;
		width: 100%;
	}