1.4.43 โ€ข Published 2 years ago

@hyeokjaelee/pastime-ui v1.4.43

Weekly downloads
-
License
-
Repository
-
Last release
2 years ago

header

Node.js Pnpm React Typescript SCSS CSS_Modules Vite

It is a React component library for toy projects.

๐Ÿ“š How to use

Install package

npm i @hyeokjaelee/pastime-ui

Import style

After installing the package, import the style file in your React based app.

ํŒจํ‚ค์ง€ ์„ค์น˜ ํ›„ React ๊ธฐ๋ฐ˜ ์•ฑ์—์„œ style ํŒŒ์ผ์„ import ํ•ด์ค๋‹ˆ๋‹ค.

//ex: main.tsx (React), _app.tsx (Next.js)
import '@hyeokjaelee/pastime-ui/style.css';

๐Ÿงฉ Features

  • Components that receive user input can render at the component level without affecting the external state value by using their internal state value. ์‚ฌ์šฉ์ž์˜ ์ž…๋ ฅ์„ ๋ฐ›๋Š” ์ปดํฌ๋„ŒํŠธ๋“ค์€ ๋‚ด๋ถ€ ์ƒํƒœ๊ฐ’์„ ์ด์šฉํ•ด ์™ธ๋ถ€ ์ƒํƒœ๊ฐ’์— ์˜ํ–ฅ์„ ์ฃผ์ง€ ์•Š๊ณ  ์ปดํฌ๋„ŒํŠธ ๋‹จ์œ„์˜ ๋ Œ๋”๋ง์ด ๊ฐ€๋Šฅํ•ฉ๋‹ˆ๋‹ค.

  • Components that take user input support convenient HOCs and hooks like validationObserver and useValidation for intrinsic validation. Similarly, since these features do not affect external state values, re-rendering can be minimized. ์‚ฌ์šฉ์ž์˜ ์ž…๋ ฅ์„ ๋ฐ›๋Š” ์ปดํฌ๋„ŒํŠธ๋“ค์€ ์ž์ฒด์ ์œผ๋กœ ์œ ํšจ์„ฑ ๊ฒ€์‚ฌ์™€ ์ด๋ฅผ ํ™•์ธํ•  ์ˆ˜ ์žˆ๋Š” validationObserver, useValidation๋“ฑ์˜ ํŽธ์˜์„ฑ HOC, hook์„ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค. ๋งˆ์ฐฌ๊ฐ€์ง€๋กœ ํ•ด๋‹น ๊ธฐ๋Šฅ๋“ค์€ ์™ธ๋ถ€ ์ƒํƒœ๊ฐ’์— ์˜ํ–ฅ์„ ์ฃผ์ง€ ์•Š๊ธฐ ๋•Œ๋ฌธ์— ์žฌ๋ Œ๋”๋ง์„ ์ตœ์†Œํ™” ํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.

  • It supports dark mode. By default, it follows the device value, and you can change it with the class value of the html tag.๋‹คํฌ๋ชจ๋“œ๋ฅผ ์ง€์›ํ•ฉ๋‹ˆ๋‹ค. ๊ธฐ๋ณธ์ ์œผ๋กœ ๋””๋ฐ”์ด์Šค ๊ฐ’์„ ๋”ฐ๋ฅด๋ฉฐ html ํƒœ๊ทธ์˜ class๊ฐ’์œผ๋กœ ๋ณ€๊ฒฝํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค. ex: <html lang="en" class="dark"> or <html lang="en" class="light">.

Storybook

For more detailed usage, please check the Storybook.

๊ทธ์™ธ ์ž์„ธํ•œ ์‚ฌ์šฉ๋ฒ•์€ ์Šคํ† ๋ฆฌ๋ถ์„ ํ™•์ธํ•ด ์ฃผ์„ธ์š”.

Github

npm

1.4.43

2 years ago

1.4.42

2 years ago

1.4.41

2 years ago

1.4.40-8b9cf07

2 years ago

1.4.40-a486b4d

2 years ago

1.4.40

2 years ago

1.4.39

2 years ago

1.4.38

2 years ago

1.4.37

2 years ago

1.4.36

2 years ago

1.4.35

2 years ago

1.4.34-b4dc002

2 years ago

1.4.34

2 years ago

1.4.33-5db1d51

2 years ago

1.4.33-25eb44b

2 years ago

1.4.33-c58b92c

2 years ago

1.4.33-1a3cdd5

2 years ago

1.4.33

2 years ago

1.4.32

2 years ago

1.4.31

2 years ago

1.4.30

2 years ago

1.4.29

2 years ago

1.4.28

2 years ago

1.4.27

2 years ago

1.4.26

2 years ago

1.4.25

2 years ago

1.4.24

2 years ago

1.4.23

2 years ago

1.4.22

2 years ago

1.4.19

2 years ago

1.4.18

2 years ago

1.4.16

2 years ago

1.4.15

2 years ago

1.4.14

2 years ago

1.4.13

2 years ago

1.4.12

2 years ago

1.4.11-081f80f

2 years ago

1.4.11-3d35c2f

2 years ago

1.4.11-c651e4c

2 years ago

1.4.11-0acb919

2 years ago

1.4.11

2 years ago

1.4.10

2 years ago

1.4.9

2 years ago

1.4.8

2 years ago

1.4.7

2 years ago

1.4.6

2 years ago

1.4.5

2 years ago

1.4.4

2 years ago

1.4.3-aabd258

2 years ago

1.4.3

2 years ago

1.4.2

2 years ago

1.4.1-bb68add

2 years ago

1.4.1

2 years ago

1.4.0-3b897e2

2 years ago

1.4.0

2 years ago

1.3.2-3593820

2 years ago

1.3.2-a504997

2 years ago

1.3.2-4fed28e

2 years ago

1.3.2-1554975

2 years ago

1.3.2-2a69633

2 years ago

1.3.2-29e1693

2 years ago

1.3.2-287f28f

2 years ago

1.3.2

2 years ago

1.3.1-38b7df1

2 years ago

1.3.1

2 years ago

1.3.0-8f04e09

2 years ago

1.3.0-fe2784a

2 years ago

1.3.0

2 years ago

1.2.1-6e32a7e

2 years ago

1.2.1-bdd5d4b

2 years ago

1.2.1-45d5ede

2 years ago

1.2.1-8d36a59

2 years ago

1.2.1

2 years ago

1.2.0-a413b2e

2 years ago

1.2.0-47489e7

2 years ago

1.2.0-122d768

2 years ago

1.2.0-ba40ed7

2 years ago

1.2.0-dafc907

2 years ago

1.2.0-ec3af20

2 years ago

1.2.0

2 years ago

1.1.1-abde729

2 years ago