ItsJonQ

var scroll = setInterval(() => {
  window.scrollTo(0, document.documentElement.scrollHeight)
},  2000)

var stopScrolling = () => {
  clearInterval(scroll)
}

ItsJonQ

var getViewCount = (views = '') => {
  if (!views) return null;
  const viewBase = views.split(" ")[0];
  if (viewBase.includes("M")) {
    return parseInt(views.replace("M", "")) * 1000000;
  }
  if (viewBase.includes("K")) {
    return parseInt(views.replace("K", "")) * 1000;
  }
  return Number(viewBase);

ItsJonQ

/**
 * @emotion/is-prop-valid uses a list of props to match against.
 *
 * @see https://github.com/emotion-js/emotion/blob/main/packages/is-prop-valid/src/props.js
 */
import isPropValid from '@emotion/is-prop-valid';

/**
 * # HTML attribute reference
 *

ItsJonQ

import React from 'react';
import createEmotion from '@emotion/css/create-instance';
import isPropValid from '@emotion/is-prop-valid';

/**
 * Creating our custom instance of Emotion.
 * This provides us with the core css() function, which is needed for
 * CSS style compiling.
 */
export const {

ItsJonQ

const chakraNativeCSSPseudoProps = {
  _active: '&:active',
  _activeLink: '&[aria-current=page]',
  _activeStep: '&[aria-current=step]',
  _after: '&:after',
  _autofill: '&:-webkit-autofill',
  _before: '&:before',
  _disabled: '&[disabled]',
  _empty: '&:empty',
  _even: '&:nth-of-type(even)',

ItsJonQ

import React from 'react';
import createEmotion from '@emotion/css/create-instance';
import isPropValid from '@emotion/is-prop-valid';

export const {
  flush,
  hydrate,
  cx,
  merge,
  getRegisteredStyles,

ItsJonQ

const styledSystemCSSProps = {
  // Background
  background: true,
  backgroundImage: true,
  backgroundSize: true,
  backgroundPosition: true,
  backgroundRepeat: true,
  // Border
  border: true,
  borderBottom: true,

ItsJonQ

import { useReducedMotion } from '@wp-g2/styles';
import React from 'react';
import { animated, useSpring } from 'react-spring';

function useCollapsibleHeightAnimation({ duration = 120, isVisible = false }) {
	const contentRef = React.useRef();
	const previouslyVisible = React.useRef(isVisible);
	const [reducedMotion] = useReducedMotion();

	const [animatedHeight, set] = useSpring(() => ({

ItsJonQ

<View css={{ margin: 'auto', maxWidth: 960 }}>
	<VStack>
		<HStack justify="space-between">
			<View>
				<Heading size={3}>
					Components: HStack, VStack, ZStack{' '}
					<View as="span" css={{ fontSize: 'inherit', opacity: 0.5 }}>
						#22
					</View>
				</Heading>

ItsJonQ

/**
 * Modified from:
 * https://github.com/react-spring/react-spring/blob/master/src/animated/createInterpolator.ts
 */

function clamp(value, min, max) {
	return Math.max(min, Math.min(max, value));
}

export function findRange(input, inputRange) {