marcelo-ribeiro

import { useSlugify } from "./useSlugify";

const slugify = useSlugify();

console.log(slugify("São Paulo"));

marcelo-ribeiro

...
transform: {
  '^.+\\.(t|j)sx?$': [
    '@swc/jest',
    {
      jsc: {
        parser: {
          syntax: 'typescript',
          tsx: true,
          decorators: true,

marcelo-ribeiro

const apiURL = "https://brasilapi.com.br/api";
const endpoint = `${apiURL}/cep/v2`;

/**
 * @typedef IPayload
 * @type {object}
 * @property {string} cep
 * @property {string} state
 * @property {string} city
 * @property {string} neighborhood

marcelo-ribeiro

import api from 'api.js';

export default endpoint => ({
  get: (id = "") => api.get(`${endpoint}/${id}`),
  create: data => api.post(`${endpoint}`, data),
  update: ({ id, ...data }) => api.put(`${endpoint}/${id}`, data),
  patch: ({ id, ...data }) => api.patch(`${endpoint}/${id}`, data),
  delete: id => api.delete(`${endpoint}/${id}`),
  filterBy: params => api.get(`${endpoint}`, { params })
});

marcelo-ribeiro

const getColor = () => "red";

const color = getColor();

({
  red: () => alert("Vermelho"),
  blue: () => alert("Azul")
}[color]?.());

// OR

marcelo-ribeiro

const products = [
  {id: 1, title: "Trim Dress", category: "women", collection: ["new", "featured"]},
  {id: 2, title: "Belted Dress", category: "women", collection: ["featured"]},
  {id: 3, title: "Fitted Dress", category: "men", collection: ["new"]}
];

const categories = new Set(
  products.map(product => product.category)
);

marcelo-ribeiro

<select>
  <option>Afghanistan</option>
  <option>Akrotiri</option>
  <option>Albania</option>
  <option>Algeria</option>
  <option>American Samoa</option>
  <option>Andorra</option>
  <option>Angola</option>
  <option>Anguilla</option>
  <option>Antarctica</option>

marcelo-ribeiro

How to detect a click outside of an element with vanilla JavaScript

A simple way to detect a click outside of an element with vanilla JavaScript

A Pen by Marcelo Ribeiro on CodePen.

License.

marcelo-ribeiro

export const capitalize = value => {
  if (!value) return "";

  const list = value.toString().trim().split(" ");

  list.forEach((item, index) => {
    list[index] = item[0].toUpperCase() + item.slice(1).toLowerCase();
  });

  return list.join(" ");

marcelo-ribeiro

document
  .querySelectorAll(".mdc-button")
  .forEach(button => new mdc.ripple.MDCRipple(button));