Skip to content

Instantly share code, notes, and snippets.

View sarinmsari's full-sized avatar

Sarin M sarinmsari

View GitHub Profile
@sarinmsari
sarinmsari / GifPicker.vue
Created June 16, 2024 15:48
Giphy gif picker implementation: Vue3 + Tailwind CSS
<script setup>
import {ref,onMounted} from 'vue'
import { renderGrid } from '@giphy/js-components'
import { GiphyFetch } from '@giphy/js-fetch-api'
import { debounce } from 'lodash';
const emit = defineEmits(['handleGifSelection'])
let gifs = ref(null),
searchTerm = ref(''),
@sarinmsari
sarinmsari / useClickOutside.js
Created September 14, 2023 16:44
Handle outside clicks of a reference element
import { onMounted, onBeforeUnmount } from "vue";
const useClickOutside = (el_target_ref, callback_fn) => {
if (!el_target_ref) return;
let listener = (e) => {
if (
e.target == el_target_ref.value ||
e.composedPath().includes(el_target_ref.value)
) {
@sarinmsari
sarinmsari / If iframe loading in React js
Last active December 21, 2023 13:39
Add loading animation until iframe loads in react web app
class Rsvp extends React.Component {
constructor(props) {
super(props);
this.state = {
loading: true