From 6bf44ba742e172c016b32cd289b87a04909a5273 Mon Sep 17 00:00:00 2001 From: semnil5202 Date: Sat, 19 Oct 2024 14:35:30 +0900 Subject: [PATCH 1/9] =?UTF-8?q?refactor:=20Text=20=EC=BB=B4=ED=8F=AC?= =?UTF-8?q?=EB=84=8C=ED=8A=B8=20HTMLAttributes=20=ED=83=80=EC=9E=85=20?= =?UTF-8?q?=ED=99=95=EC=9E=A5=20=EB=B0=8F=20Theme=20Font=20=EA=B0=92=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- src/App.tsx | 4 ++-- src/components/Text/Text.tsx | 8 +++++--- src/styles/theme.ts | 4 ++++ 4 files changed, 12 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index 439eadb..eb3ee76 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "concept-be-design-system", "description": "컨셉비 디자인 시스템", - "version": "0.5.3", + "version": "0.5.5", "type": "module", "main": "dist/index.js", "module": "dist/index.js", diff --git a/src/App.tsx b/src/App.tsx index c0706d6..15ac052 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,6 +1,6 @@ import { useState } from 'react'; -import { Alert, BottomSheet, Button, Confirm } from '.'; +import { Alert, BottomSheet, Button, Confirm, Text } from '.'; const App = () => { const [isBottomSheetOpen, setIsBottomSheetOpen] = useState(false); @@ -10,7 +10,7 @@ const App = () => { return ( <> - + 피드 setIsBottomSheetOpen(false)} diff --git a/src/components/Text/Text.tsx b/src/components/Text/Text.tsx index 7d7ba33..ee4c1e8 100644 --- a/src/components/Text/Text.tsx +++ b/src/components/Text/Text.tsx @@ -1,9 +1,10 @@ import styled from '@emotion/styled'; import { - ReactNode, - ElementType, ComponentPropsWithoutRef, CSSProperties, + ElementType, + HTMLAttributes, + ReactNode, } from 'react'; import { ReactComponent as SVGTextRequired } from '../../assets/svg/text_required.svg'; @@ -16,7 +17,8 @@ type Props = { color?: ColorKeyType; required?: boolean; wordBreak?: CSSProperties['wordBreak']; -} & ComponentPropsWithoutRef; +} & ComponentPropsWithoutRef & + HTMLAttributes; const Text = ({ as, diff --git a/src/styles/theme.ts b/src/styles/theme.ts index 3c2b963..b4d9ac3 100644 --- a/src/styles/theme.ts +++ b/src/styles/theme.ts @@ -19,6 +19,10 @@ const color = { } as const; const font = { + suit10eb: { + fontSize: 10, + fontWeight: 800, + }, suit12r: { fontSize: 12, fontWeight: 400, From d0a70fcdea0c19eba6373919dfb5d18a369d7012 Mon Sep 17 00:00:00 2001 From: semnil5202 Date: Sat, 19 Oct 2024 14:40:21 +0900 Subject: [PATCH 2/9] =?UTF-8?q?chore:=200.5.6=20=EB=B2=84=EC=A0=84?= =?UTF-8?q?=EC=97=85=EB=8D=B0=EC=9D=B4=ED=8A=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 23 +++++++++++++++++++---- package.json | 2 +- yarn.lock | 2 +- 3 files changed, 21 insertions(+), 6 deletions(-) diff --git a/package-lock.json b/package-lock.json index cdbeb01..572a40e 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "concept-be-design-system", - "version": "0.5.3", + "version": "0.5.6", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "concept-be-design-system", - "version": "0.5.3", + "version": "0.5.6", "dependencies": { "@emotion/react": "^11.11.1", "@emotion/styled": "^11.11.0", @@ -35,7 +35,6 @@ "eslint": "^8.45.0", "eslint-import-resolver-typescript": "^3.6.0", "eslint-import-resolver-webpack": "^0.13.7", - "eslint-plugin-import": "^2.28.1", "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.3", "prettier": "^3.0.3", @@ -6875,7 +6874,8 @@ "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz", "integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==", "dev": true, - "license": "MIT" + "license": "MIT", + "peer": true }, "node_modules/@types/lodash": { "version": "4.14.202", @@ -7936,6 +7936,7 @@ "integrity": "sha512-dlcsNBIiWhPkHdOEEKnehA+RNUWDc4UqFtnIXU4uuYDPtA4LDkr7qip2p0VvFAEXNDr0yWZ9PJyIRiGjRLQzwQ==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "call-bind": "^1.0.2", "define-properties": "^1.2.0", @@ -7982,6 +7983,7 @@ "integrity": "sha512-LzLoiOMAxvy+Gd3BAq3B7VeIgPdo+Q8hthvKtXybMvRV0jrXfJM/t8mw7nNlpEcVlVUnCnM2KSX4XU5HmpodOA==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "call-bind": "^1.0.2", "define-properties": "^1.2.0", @@ -8002,6 +8004,7 @@ "integrity": "sha512-djYB+Zx2vLewY8RWlNCUdHjDXs2XOgm602S9E7P/UpHgfeHL00cRiIF+IN/G/aUJ7kGPb6yO/ErDI5V2s8iycA==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "call-bind": "^1.0.2", "define-properties": "^1.2.0", @@ -8021,6 +8024,7 @@ "integrity": "sha512-Ewyx0c9PmpcsByhSW4r+9zDU7sGjFc86qf/kKtuSCRdhfbk0SNLLkaT5qvcHnRGgc5NP/ly/y+qkXkqONX54CQ==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "call-bind": "^1.0.2", "define-properties": "^1.2.0", @@ -9622,6 +9626,7 @@ "integrity": "sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==", "dev": true, "license": "Apache-2.0", + "peer": true, "dependencies": { "esutils": "^2.0.2" }, @@ -10182,6 +10187,7 @@ "integrity": "sha512-WFj2isz22JahUv+B788TlO3N6zL3nNJGU8CcZbPZvVEkBPaJdCV4vy5wyghty5ROFbCRnm132v8BScu5/1BQ8g==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "debug": "^3.2.7", "is-core-module": "^2.13.0", @@ -10194,6 +10200,7 @@ "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "ms": "^2.1.1" } @@ -10347,6 +10354,7 @@ "integrity": "sha512-9I9hFlITvOV55alzoKBI+K9q74kv0iKMeY6av5+umsNwayt59fz692daGyjR+oStBQgx6nwR9rXldDev3Clw+A==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "array-includes": "^3.1.6", "array.prototype.findlastindex": "^1.2.2", @@ -10379,6 +10387,7 @@ "integrity": "sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "ms": "^2.1.1" } @@ -14421,6 +14430,7 @@ "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "minimist": "^1.2.0" }, @@ -15524,6 +15534,7 @@ "integrity": "sha512-UPbPHML6sL8PI/mOqPwsH4G6iyXcCGzLin8KvEPenOZN5lpCNBZZQ+V62vdjB1mQHrmqGQt5/OJzemUA+KJmEA==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "call-bind": "^1.0.2", "define-properties": "^1.2.0", @@ -15542,6 +15553,7 @@ "integrity": "sha512-HqaQtqLnp/8Bn4GL16cj+CUYbnpe1bh0TtEaWvybszDG4tgxCJuRpV8VGuvNaI1fAnI4lUJzDG55MXcOH4JZcQ==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "call-bind": "^1.0.2", "define-properties": "^1.2.0", @@ -15555,6 +15567,7 @@ "integrity": "sha512-aU6xnDFYT3x17e/f0IiiwlGPTy2jzMySGfUB4fq6z7CV8l85CWHDk5ErhyhpfDHhrOMwGFhSQkhMGHaIotA6Ng==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "call-bind": "^1.0.2", "define-properties": "^1.2.0", @@ -17775,6 +17788,7 @@ "integrity": "sha512-vavAMRXOgBVNF6nyEEmL3DBK19iRpDcoIwW+swQ+CbGiu7lju6t+JklA1MHweoWtadgt4ISVUsXLyDq34ddcwA==", "dev": true, "license": "MIT", + "peer": true, "engines": { "node": ">=4" } @@ -18229,6 +18243,7 @@ "integrity": "sha512-o/9iXgCYc5L/JxCHPe3Hvh8Q/2xm5Z+p18PESBU6Ff33695QnCHBEjcytY2q19ua7Mbl/DavtBOLq+oG0RCL+g==", "dev": true, "license": "MIT", + "peer": true, "dependencies": { "@types/json5": "^0.0.29", "json5": "^1.0.2", diff --git a/package.json b/package.json index eb3ee76..022bcec 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "concept-be-design-system", "description": "컨셉비 디자인 시스템", - "version": "0.5.5", + "version": "0.5.6", "type": "module", "main": "dist/index.js", "module": "dist/index.js", diff --git a/yarn.lock b/yarn.lock index 492c95f..444a0c5 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5268,7 +5268,7 @@ eslint-module-utils@^2.7.4, eslint-module-utils@^2.8.0: dependencies: debug "^3.2.7" -eslint-plugin-import@*, eslint-plugin-import@^2.28.1, eslint-plugin-import@>=1.4.0: +eslint-plugin-import@*, eslint-plugin-import@>=1.4.0: version "2.28.1" resolved "https://registry.npmjs.org/eslint-plugin-import/-/eslint-plugin-import-2.28.1.tgz" integrity sha512-9I9hFlITvOV55alzoKBI+K9q74kv0iKMeY6av5+umsNwayt59fz692daGyjR+oStBQgx6nwR9rXldDev3Clw+A== From 1b8b18112cea51efd6d9e8b81940d9b8e89c338a Mon Sep 17 00:00:00 2001 From: semnil5202 Date: Sat, 19 Oct 2024 15:03:59 +0900 Subject: [PATCH 3/9] refactor: edit Navigation justify content --- src/components/Navigation/Navigation.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/Navigation/Navigation.tsx b/src/components/Navigation/Navigation.tsx index 4b09ebf..1d091ec 100644 --- a/src/components/Navigation/Navigation.tsx +++ b/src/components/Navigation/Navigation.tsx @@ -36,6 +36,5 @@ const NavWrapper = styled.nav` position: absolute; bottom: 8%; display: flex; - justify-content: space-between; - gap: 20%; + justify-content: space-around; `; From c842da87bf88c9bc458368d357b661a6351e2679 Mon Sep 17 00:00:00 2001 From: semnil5202 Date: Sat, 19 Oct 2024 15:56:18 +0900 Subject: [PATCH 4/9] =?UTF-8?q?refactor:=20Tag,=20theme=20font=20=EC=8A=A4?= =?UTF-8?q?=ED=8E=99=20=EB=B3=80=EA=B2=BD=EC=82=AC=ED=95=AD=20=EC=A0=81?= =?UTF-8?q?=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- src/components/Tag/Tag.tsx | 3 ++- src/styles/theme.ts | 10 +++++----- 3 files changed, 8 insertions(+), 7 deletions(-) diff --git a/package.json b/package.json index 022bcec..5202952 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "concept-be-design-system", "description": "컨셉비 디자인 시스템", - "version": "0.5.6", + "version": "0.5.8", "type": "module", "main": "dist/index.js", "module": "dist/index.js", diff --git a/src/components/Tag/Tag.tsx b/src/components/Tag/Tag.tsx index 6196e39..4420cd3 100644 --- a/src/components/Tag/Tag.tsx +++ b/src/components/Tag/Tag.tsx @@ -1,10 +1,11 @@ import styled from '@emotion/styled'; +import { HTMLAttributes } from 'react'; import { ReactComponent as SVGCancel } from '../../assets/svg/cancel.svg'; import Spacer from '../Spacer/Spacer'; import Text from '../Text/Text'; -interface TagProps { +interface TagProps extends HTMLAttributes { children: string; onDelete: (name: string) => void; } diff --git a/src/styles/theme.ts b/src/styles/theme.ts index b4d9ac3..69b34ea 100644 --- a/src/styles/theme.ts +++ b/src/styles/theme.ts @@ -51,15 +51,15 @@ const font = { fontSize: 14, fontWeight: 600, }, + suit14sb: { + fontSize: 14, + fontWeight: 600, + }, suit14b: { fontSize: 14, fontWeight: 700, }, - suit15ra: { - fontSize: 15, - fontWeight: 400, - }, - suit15rb: { + suit15r: { fontSize: 15, fontWeight: 400, }, From a869897ffc04c492ccbd004864c2192688732530 Mon Sep 17 00:00:00 2001 From: semnil5202 Date: Sat, 19 Oct 2024 16:45:59 +0900 Subject: [PATCH 5/9] refactor: change badge default radius prop value, add suit16r to theme font variable --- src/components/Badge/Badge.tsx | 2 +- src/styles/theme.ts | 4 ++++ 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/src/components/Badge/Badge.tsx b/src/components/Badge/Badge.tsx index 74a5467..26488d1 100644 --- a/src/components/Badge/Badge.tsx +++ b/src/components/Badge/Badge.tsx @@ -25,7 +25,7 @@ const Badge = ({ children, backgroundColor = 'bg1', fontColor = 'b9', - radius = 4, + radius = 50, ...attributes }: Props) => { return ( diff --git a/src/styles/theme.ts b/src/styles/theme.ts index 69b34ea..91ea496 100644 --- a/src/styles/theme.ts +++ b/src/styles/theme.ts @@ -71,6 +71,10 @@ const font = { fontSize: 15, fontWeight: 600, }, + suit164: { + fontSize: 16, + fontWeight: 400, + }, suit16m: { fontSize: 16, fontWeight: 500, From ef834887f2fa75b8370d16c7ed32acd4a41cc512 Mon Sep 17 00:00:00 2001 From: semnil5202 Date: Sat, 19 Oct 2024 16:47:30 +0900 Subject: [PATCH 6/9] fix: edit theme font name --- package.json | 2 +- src/styles/theme.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 5202952..2cb5632 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "concept-be-design-system", "description": "컨셉비 디자인 시스템", - "version": "0.5.8", + "version": "0.5.10", "type": "module", "main": "dist/index.js", "module": "dist/index.js", diff --git a/src/styles/theme.ts b/src/styles/theme.ts index 91ea496..b5ad123 100644 --- a/src/styles/theme.ts +++ b/src/styles/theme.ts @@ -71,7 +71,7 @@ const font = { fontSize: 15, fontWeight: 600, }, - suit164: { + suit16r: { fontSize: 16, fontWeight: 400, }, From e0c31950d029324ea2459bde109d9a5208cfed88 Mon Sep 17 00:00:00 2001 From: semnil5202 Date: Sat, 19 Oct 2024 21:43:09 +0900 Subject: [PATCH 7/9] =?UTF-8?q?chore:=20write=20pencil=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80=20=EB=B0=8F=20storybook=20=EB=B0=98=EC=98=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/svg/write_pencil.svg | 9 +++++++++ src/index.ts | 1 + src/stories/SVGCommon.stories.tsx | 12 ++++++++---- 3 files changed, 18 insertions(+), 4 deletions(-) create mode 100644 src/assets/svg/write_pencil.svg diff --git a/src/assets/svg/write_pencil.svg b/src/assets/svg/write_pencil.svg new file mode 100644 index 0000000..bb65022 --- /dev/null +++ b/src/assets/svg/write_pencil.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/index.ts b/src/index.ts index 198ebe6..e1f3a12 100644 --- a/src/index.ts +++ b/src/index.ts @@ -60,6 +60,7 @@ export { ReactComponent as SVGScrap24 } from './assets/svg/scrap_24.svg'; export { ReactComponent as SVGScrapFilled24 } from './assets/svg/scrap_filled_24.svg'; export { ReactComponent as SVGTextRequired } from './assets/svg/text_required.svg'; export { ReactComponent as SVGTripleDots } from './assets/svg/triple_dots.svg'; +export { ReactComponent as SVGWritePencil } from './assets/svg/write_pencil.svg'; export { ReactComponent as SVGHeaderBack24B } from './assets/svg/header/back_24_B.svg'; export { ReactComponent as SVGHeaderBack24W } from './assets/svg/header/back_24_W.svg'; diff --git a/src/stories/SVGCommon.stories.tsx b/src/stories/SVGCommon.stories.tsx index 509c3d0..92d916f 100644 --- a/src/stories/SVGCommon.stories.tsx +++ b/src/stories/SVGCommon.stories.tsx @@ -4,18 +4,20 @@ import { SVGAdd24, SVGCancel, SVGCheckFilled24, + SVGDropdownArrow, SVGFeed24, SVGFeedFilled24, + SVGGoldBell, SVGProfile24, SVGProfileFilled24, + SVGRadioCheck24, + SVGRadioFilled24, + SVGRadioUncheck24, SVGScrap24, SVGScrapFilled24, - SVGRadioUncheck24, - SVGRadioFilled24, - SVGRadioCheck24, SVGTextRequired, SVGTripleDots, - SVGDropdownArrow, + SVGWritePencil, } from '../.'; const meta = { @@ -44,6 +46,8 @@ export const Default: Story = { + + ), }; From 25db04a40a0290655a81616253dfa997d4c8c2e3 Mon Sep 17 00:00:00 2001 From: semnil5202 Date: Thu, 19 Dec 2024 00:04:15 +0900 Subject: [PATCH 8/9] =?UTF-8?q?refactor:=20bottomSheet=20height=20?= =?UTF-8?q?=EA=B3=A0=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- src/components/BottomSheet/BottomSheet.tsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 2cb5632..210219b 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "concept-be-design-system", "description": "컨셉비 디자인 시스템", - "version": "0.5.10", + "version": "0.5.12", "type": "module", "main": "dist/index.js", "module": "dist/index.js", diff --git a/src/components/BottomSheet/BottomSheet.tsx b/src/components/BottomSheet/BottomSheet.tsx index 866271c..f1c707d 100644 --- a/src/components/BottomSheet/BottomSheet.tsx +++ b/src/components/BottomSheet/BottomSheet.tsx @@ -36,7 +36,7 @@ const BottomSheetWrapper = styled.div<{ isOpen: boolean }>` margin: 0 auto; width: auto; max-width: 420px; - max-height: 90%; + max-height: 70%; min-height: 70%; background-color: #fff; box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.2); From 4b8440d14ae4a8f9c68bdb019a71a332f08a3c1e Mon Sep 17 00:00:00 2001 From: semnil5202 Date: Fri, 27 Dec 2024 14:59:45 +0900 Subject: [PATCH 9/9] fix: pass html attirbutes type --- package.json | 2 +- src/components/Navigation/NavigationItem.tsx | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index 210219b..4d8d25e 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "concept-be-design-system", "description": "컨셉비 디자인 시스템", - "version": "0.5.12", + "version": "0.5.13", "type": "module", "main": "dist/index.js", "module": "dist/index.js", diff --git a/src/components/Navigation/NavigationItem.tsx b/src/components/Navigation/NavigationItem.tsx index b17a2d6..f600175 100644 --- a/src/components/Navigation/NavigationItem.tsx +++ b/src/components/Navigation/NavigationItem.tsx @@ -1,10 +1,10 @@ import { css } from '@emotion/react'; import styled from '@emotion/styled'; -import { ReactNode } from 'react'; +import { HtmlHTMLAttributes, ReactNode } from 'react'; type PositionType = 'normal' | 'center'; -export interface Props { +export interface Props extends HtmlHTMLAttributes { onClick?: () => void; position?: PositionType; children: ReactNode;