This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {Button} from '@chakra-ui/button' | |
import {Input} from '@chakra-ui/input' | |
import {Box, Divider, Heading, VStack} from '@chakra-ui/layout' | |
import React, {useState} from 'react' | |
import { | |
atom, | |
atomFamily, | |
DefaultValue, | |
useRecoilCallback, | |
useRecoilState, |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {Button} from '@chakra-ui/button' | |
import {Input} from '@chakra-ui/input' | |
import {Box, Divider, Heading, VStack} from '@chakra-ui/layout' | |
import React, {useState} from 'react' | |
import {atom, atomFamily, useRecoilCallback, useRecoilState, useRecoilValue, useResetRecoilState} from 'recoil' | |
type ItemType = { | |
label: string | |
checked: boolean | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {Button} from '@chakra-ui/button' | |
import {Input} from '@chakra-ui/input' | |
import {Box, Divider, Heading, VStack} from '@chakra-ui/layout' | |
import produce from 'immer' | |
import React, {useState} from 'react' | |
import {atom, useRecoilState, useResetRecoilState} from 'recoil' | |
type ItemType = { | |
label: string | |
checked: boolean |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {Box, Text, VStack} from '@chakra-ui/layout' | |
import {Skeleton} from '@chakra-ui/skeleton' | |
export const ImageInfo = () => { | |
return ( | |
<VStack spacing={2} alignItems="flex-start" width="100%"> | |
<Info label="Author" value="Value goes here" /> | |
<Info label="Image URL" value="Value goes here" /> | |
</VStack> | |
) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {Box, Spinner} from '@chakra-ui/react' | |
import {getBorderColor} from '../../util' | |
export const RectangleLoading = ({selected}: {selected: boolean}) => { | |
return ( | |
<Box | |
position="absolute" | |
border={`1px solid ${getBorderColor(selected)}`} | |
transition="0.1s border-color ease-in-out" | |
width="100%" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
export const getWeather = (zipCode: string) => { | |
return new Promise<number>((resolve) => { | |
setTimeout(() => { | |
if (!getWeatherCache[zipCode]) { | |
getWeatherCache[zipCode] = randomIntBetween(5, 35) | |
} else { | |
getWeatherCache[zipCode] += randomIntBetween(-1, 2) | |
} | |
resolve(getWeatherCache[zipCode]) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {Container, Heading, Text} from '@chakra-ui/layout' | |
import {Select} from '@chakra-ui/select' | |
import {atom, useRecoilState} from 'recoil' | |
const userIdState = atom<number | undefined>({ | |
key: 'userId', | |
default: undefined, | |
}) | |
export const Async = () => { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {InputGroup, InputRightElement, NumberInput, NumberInputField, Text, VStack} from '@chakra-ui/react' | |
export const EditProperties = () => { | |
return ( | |
<Card> | |
<Section heading="Position"> | |
<Property label="Top" value={1} onChange={(top) => {}} /> | |
<Property label="Left" value={1} onChange={(left) => {}} /> | |
</Section> | |
</Card> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import {createContext, useState} from 'react' | |
import {Element, Rectangle} from './components/Rectangle/Rectangle' | |
import {PageContainer} from './PageContainer' | |
import {Toolbar} from './Toolbar' | |
type ElementsContextType = { | |
elements: Element[] | |
addElement: () => void | |
setElement: SetElement | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { | |
Box, | |
FormControl, | |
FormLabel, | |
Heading, | |
HStack, | |
Icon, | |
NumberInput, | |
NumberInputField, | |
Switch, |
NewerOlder