This command will allow you import component compositions into your project.
By default, it'll import all component compositions.
## add a specific component
import { defineProperties, createSprinkles } from '@vanilla-extract/sprinkles' | |
const typographyProperties = defineProperties({ | |
...responsiveProperties, | |
properties: { | |
fontSize: fontSizePairings, | |
lineHeight: lineHeights, | |
fontWeight: fontWeights, | |
letterSpacing: letterSpacings, | |
textAlign: ['left', 'right', 'center'], |
const items = ['React', 'Solid', 'Vue']
const Basic = () => {
const contentRef = useRef(null)
const api = useVirtualizer({
count: items.length,
getScrollElement: () => contentRef.current,
estimateSize: () => 35,
const childProcess = require('child_process')
// gaze是用于监听文件变化的工具
const Gaze = require('gaze');
// 有更友好展示的console
const consola = require('consola')
class MyPlugin {
// 将 `apply` 定义为其原型方法,此方法以 compiler 作为参数
apply(compiler) {
import { useRef } from "react"; | |
import warning from "rc-util/lib/warning"; | |
/** | |
* Keep input cursor in the correct position if possible. | |
* Is this necessary since we have `formatter` which may mass the content? | |
*/ | |
export default function useCursor( | |
input: HTMLInputElement, | |
focused: boolean | |
): [() => void, () => void] { |
import fs from "fs" | |
import Discord from "discord.js" | |
import { config } from "dotenv" | |
import ora from "ora" | |
import { outdent } from "outdent" | |
config() | |
const CHANNELS = { | |
ANNOUNCEMENT: process.env.CHANNEL_ID, |
const variants = { | |
'with-indicator': definePartsStyle((props) => { | |
const sizes = { | |
md: { | |
tablist: { | |
h: 11, | |
px: 1, | |
}, | |
tab: { | |
fontSize: 'sm', |
/* Non-atomic */
.css-Box {
background: red;
font-size: 10px;
}
.css-Tab {
background: red;
const settings = {
primaryColor: "#red",
font: "UI Big",
};
const content = {
hero: {
title: "Expert homeschooling service",
desc: "Keep your kids learning at home with online or in-person lessons taught by exceptional teachers",