μ°¨κ°μ΄ λμμΈ μμ€ν (CDS, Cold Design System) μ React μ»΄ν¬λνΈ λΌμ΄λΈλ¬λ¦¬μ λλ€.
μΌκ΄μ μΈ UI λμμΈκ³Ό μ κ·Όμ±μ κ³ λ €ν μ¬μ©μ μΈν°λμ μ μ 곡ν©λλ€.
Storybook λ¬Έμ μμ μ 곡νλ μ»΄ν¬λνΈμ μ’ λ₯μ μ©λ‘λ₯Ό νμΈν μ μμ΅λλ€.
npm install @chwh/cdsyarn add @chwh/cdsCdsProviderλ‘ κ°μΈμΌ ν©λλ€.
const App = () => {
return (
<CdsProvider>
// ... your components
</CdsProvider>
);
};π
μλ μΈν°νμ΄μ€ μ€ μΌλΆλ₯Ό μ¬μ μν κ°μ²΄λ₯Ό CdsProviderμ themeColor propsλ‘ μ λ¬ν΄ ν
λ§ μ»¬λ¬λ₯Ό λ³κ²½ν μ μμ΅λλ€.
type ColorSet = {
primary: Property.Color;
primaryLight: Property.Color;
primaryDark: Property.Color;
alert: Property.Color;
info: Property.Color;
success: Property.Color;
warning: Property.Color;
error: Property.Color;
black: Property.Color;
white: Property.Color;
offWhite: Property.Color;
background: Property.Color;
gray100: Property.Color;
gray200: Property.Color;
gray300: Property.Color;
gray400: Property.Color;
};| @prayinforrain | @iyu88 | @se030 | @leesunmin1231 | @dohun31 |
|---|---|---|---|---|