vjsolanki

import { useState, useEffect, useRef } from 'react';
import { throttle } from 'lodash'; // Import throttle from lodash or another library

const useHoverIntent = (delay = 300, velocityThreshold = 100) => {
  const [isHovered, setIsHovered] = useState(false);
  const [isIntentional, setIsIntentional] = useState(false);
  const [lastPosition, setLastPosition] = useState({ x: 0, y: 0 });
  const [velocity, setVelocity] = useState(0);
  const timeoutRef = useRef(null);
  const lastTimeRef = useRef(Date.now());

vjsolanki

import React, { createContext, useContext, useMemo, useState, useRef, useLayoutEffect, useEffect } from 'react';
import ReactDOM from 'react-dom';

function _extends() {
  _extends = Object.assign || function (target) {
    for (var i = 1; i < arguments.length; i++) {
      var source = arguments[i];

      for (var key in source) {
        if (Object.prototype.hasOwnProperty.call(source, key)) {

vjsolanki

import React, { createContext, useContext, useMemo, useState, useRef, useLayoutEffect, useEffect } from 'react';
import ReactDOM from 'react-dom';

function _extends() {
  _extends = Object.assign || function (target) {
    for (var i = 1; i < arguments.length; i++) {
      var source = arguments[i];

      for (var key in source) {
        if (Object.prototype.hasOwnProperty.call(source, key)) {

vjsolanki

const appendScript = (scriptToAppend) => {
    const script = document.createElement("script");
    script.src = scriptToAppend;
    script.async = true;
    document.body.appendChild(script);
}

const removeScript = (scriptToremove) => {
    let allsuspects=document.getElementsByTagName("script");
    for (let i=allsuspects.length; i>=0; i--){

vjsolanki

https://twitter.com/snookca/status/1073299331262889984?s=21

‪“‬In what way is JS any more maintainable than CSS? How does writing CSS in JS make it any more maintainable?”

‪Happy to chat about this. There’s an obvious disclaimer that there’s a cost to css-in-js solutions, but that cost is paid specifically for the benefits it brings; as such it’s useful for some usecases, and not meant as a replacement for all workflows. ‬

‪(These conversations always get heated on twitter, so please believe that I’m here to converse, not to convince. In return, I promise to listen to you too and change my opinions; I’ve had mad respect for you for years and would consider your feedback a gift. Also, some of the stuff I’m writing might seem obvious to you; I’m not trying to tell you if all people of some of the details, but it might be useful to someone else who bumps into this who doesn’t have context)‬

So the big deal about css-in-js (cij) is selectors.

vjsolanki

{
    "seating_charts": [
        {
            "id": 1,
            "name": "ABC",
            "status": "1"
        },
        {
            "id": 2,
            "name": "XYZ",

vjsolanki

{
    "seating_charts": [
        {
            "id": 1,
            "name": "ABC",
            "status": "1"
        },
        {
            "id": 2,
            "name": "XYZ",

vjsolanki

      /** --------------

                    *
                   **
                  ***
                 ****
                *****
               ******
              *******
             ********

vjsolanki

Fab to tab

Fab button that expands to a Tab menu

A Pen by Dirk-Jan on CodePen.

License.

vjsolanki

Fab Button

A Pen by Tyler on CodePen.

License.