Skip to content

Instantly share code, notes, and snippets.

Working from home

Mateus Vahl mateusvahl

Working from home
View GitHub Profile
mateusvahl / Box.tsx
Last active Dec 7, 2021
React / Typescript Dynamic tag with intellisense autocomplete
View Box.tsx
import { ReactNode, ElementType, ComponentPropsWithoutRef } from "react";
export type Prefer<P, T> = P & Omit<T, keyof P>;
export type ElementPropsWithoutRef<T extends ElementType> = Pick<
keyof ComponentPropsWithoutRef<T>
export type OverwritableType<OwnProps, Type extends ElementType> = Prefer<
View gist:d71eb727410e76886930a22f8b252bae
"[html]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
View gist:08e462c8d0f9f6d5b6c8500301c2142e
View VSCode config.txt
"editor.fontFamily": "Inconsolata-Regular, Consolas, 'Courier New', monospace",
"editor.selectionHighlight": false,
"editor.fontSize": 14,
"editor.renderWhitespace": "none",
"editor.cursorStyle": "line",
"editor.multiCursorModifier": "ctrlCmd",
"editor.wordWrap": "off",
"editor.accessibilitySupport": "off",
"editor.cursorBlinking": "smooth",
View parse_tag_expression.js
const parseElementExpression = (str) => {
const elements = /([\#|\.][a-zA-Z]+)/;
const itens = str.split(elements).filter(x => x);
const getClassOrIdNames = (idOrClass) =>
.filter(_ => _.charAt(0) === idOrClass)
.map(_ => _.slice(1));
const tag = itens.filter(_ => (_.charAt(0) !== '#') && (_.charAt(0) !== '.'));
const id = getClassOrIdNames('#');
mateusvahl / gist:12c7579ed40abe5d2ff0b821b5b2cc01
Created Aug 21, 2017
Javascript html structure like hiccup
View gist:12c7579ed40abe5d2ff0b821b5b2cc01
View find_css_selectors_not_used.rb
#!/usr/bin/env ruby
#require "./selector_cleaner/version"
require "nokogiri"
module Selector
# Returns a array of elements that match with the css selector
# Params:
# +selector+:: CSS selector to be found
# +html+:: File to be searched
def self.find(selector, html)
View gist:6398b14b419e64c40ca9f247c7dd7638
handlebars.createHelper('>>', function(partial, context) {
var html = handlebars.partials[partial];
delete this.styleModifier
var template = handlebars.compile(html)(Object.assin({}, this, context.hash));
return handlebars.SafeString(template);
View gist:1d9409bf28865522a89a283da3133e98
var pattern = name;
var outlet = new Handlebars.SafeString(options.fn(this));
var params = Object.assign(options.hash, {outlet: outlet});
var template = Handlebars.compile(`{{> ${name} }}`);
return template(params);
View Txt
Writes a new render engine:
{(yields}} can be implemented with helpers.
{{content_for}} and {{output_for}} can be implemented with helpers and state.
{{docs}} can be implemented with helpers+state+blocks, also use handlebars to output default cars in doc.
{{metadata}} can be implemented with helpers in a before render step.
{{lorem 1000}} writes 1000 lines of lorem ipsum
final step: check for patterns not used