From a34771a4c6507eae110c99f2df8ef144425cffb3 Mon Sep 17 00:00:00 2001 From: baegteun Date: Wed, 21 Sep 2022 10:48:29 +0900 Subject: [PATCH 1/8] feat :: DMS Button Style --- .../Sources/Button/DMSButton.swift | 30 +++++++++++++++++++ .../Sources/Button/DMSButtonStyle.swift | 25 ++++++++++++++++ 2 files changed, 55 insertions(+) create mode 100644 Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift create mode 100644 Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift diff --git a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift new file mode 100644 index 00000000..b5bd43ca --- /dev/null +++ b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift @@ -0,0 +1,30 @@ +import SwiftUI + +public struct DMSButton: View { + var text: String + var style: DMSButtonStyle.Style + var color: Color + var action: () -> Void + + public init( + text: String = "", + style: DMSButtonStyle.Style = .contained, + color: Color = .blue, + action: @escaping () -> Void = {} + ) { + self.text = text + self.style = style + self.color = color + self.action = action + } + + public var body: some View { + Text("Hello, World!") + } +} + +struct DMSButton_Previews: PreviewProvider { + static var previews: some View { + DMSButton() + } +} diff --git a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift new file mode 100644 index 00000000..74b99f02 --- /dev/null +++ b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift @@ -0,0 +1,25 @@ +import SwiftUI + +public struct DMSButtonStyle: ButtonStyle { + public enum Style { + case contained + case outlined + case text + case underline + } + + var style: Style + var color: Color + + public func makeBody(configuration: Configuration) -> some View { + VStack { + } + } +} + +// MARK: - Usage +extension Button { + func dmsStyle(_ style: DMSButtonStyle.Style, color: Color) -> some View { + self.buttonStyle(DMSButtonStyle(style: style, color: color)) + } +} From d9ec3dd6e28debac4a4c657153c74e9c563a36d5 Mon Sep 17 00:00:00 2001 From: baegteun Date: Wed, 21 Sep 2022 22:41:07 +0900 Subject: [PATCH 2/8] =?UTF-8?q?feat=20::=20Button=20Style=20listing=20?= =?UTF-8?q?=EC=83=89=EC=9D=B4=20=EC=97=86=EC=9C=BC=EB=8B=88=20=EB=AD=98=20?= =?UTF-8?q?=EB=AA=BB=ED=95=A8=20=E3=85=9C=E3=85=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Sources/Button/DMSButtonStyle.swift | 52 +++++++++++++++++++ 1 file changed, 52 insertions(+) diff --git a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift index 74b99f02..973ff456 100644 --- a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift +++ b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift @@ -23,3 +23,55 @@ extension Button { self.buttonStyle(DMSButtonStyle(style: style, color: color)) } } + +// MARK: - Contained +extension Button { + struct ContainedButton: View { + let configuration: ButtonStyle.Configuration + let color: Color + @Environment(\.isEnabled) private var isEnabled: Bool + + var body: some View { + configuration.label + } + } +} + +// MARK: - Outlined +extension Button { + struct OutlinedButton: View { + let configuration: ButtonStyle.Configuration + let color: Color + @Environment(\.isEnabled) private var isEnabled: Bool + + var body: some View { + configuration.label + } + } +} + +// MARK: - Text +extension Button { + struct TextButton: View { + let configuration: ButtonStyle.Configuration + let color: Color + @Environment(\.isEnabled) private var isEnabled: Bool + + var body: some View { + configuration.label + } + } +} + +// MARK: - Underline +extension Button { + struct UnderlineButton: View { + let configuration: ButtonStyle.Configuration + let color: Color + @Environment(\.isEnabled) private var isEnabled: Bool + + var body: some View { + configuration.label + } + } +} From dbe493bd91635ceece7c2cb1028cfaf1ee57c370 Mon Sep 17 00:00:00 2001 From: baegteun Date: Fri, 23 Sep 2022 10:10:24 +0900 Subject: [PATCH 3/8] feat :: button --- .../Sources/Button/DMSButton.swift | 9 ++++-- .../Sources/Button/DMSButtonStyle.swift | 30 +++++++++++++++---- 2 files changed, 32 insertions(+), 7 deletions(-) diff --git a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift index b5bd43ca..2f2abe01 100644 --- a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift +++ b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift @@ -19,12 +19,17 @@ public struct DMSButton: View { } public var body: some View { - Text("Hello, World!") + Button(action: action) { + Text(text) + .padding(.vertical, 14) + .padding(.horizontal, 16) + } + .buttonStyle(DMSButtonStyle(style: style, color: color)) } } struct DMSButton_Previews: PreviewProvider { static var previews: some View { - DMSButton() + DMSButton(text: "Asdf") } } diff --git a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift index 973ff456..72c73117 100644 --- a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift +++ b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift @@ -12,7 +12,18 @@ public struct DMSButtonStyle: ButtonStyle { var color: Color public func makeBody(configuration: Configuration) -> some View { - VStack { + switch style { + case .contained: + return AnyView(ContainedButton(configuration: configuration, color: color)) + + case .outlined: + return AnyView(OutlinedButton(configuration: configuration, color: color)) + + case .text: + return AnyView(TextButton(configuration: configuration, color: color)) + + case .underline: + return AnyView(UnderlineButton(configuration: configuration, color: color)) } } } @@ -25,7 +36,7 @@ extension Button { } // MARK: - Contained -extension Button { +extension DMSButtonStyle { struct ContainedButton: View { let configuration: ButtonStyle.Configuration let color: Color @@ -33,12 +44,21 @@ extension Button { var body: some View { configuration.label + .dmsFont(.text(.small)) // TODO: 디자인상으로 폰트 적용될 시 수정 + .background(color) + .foregroundColor(.white) // TODO: 디자인 시스템 - 색상 나올 시 수정 + .cornerRadius(5) + .opacity( + isEnabled ? + configuration.isPressed ? 0.7 : 1.0 : + 0.5 + ) } } } // MARK: - Outlined -extension Button { +extension DMSButtonStyle { struct OutlinedButton: View { let configuration: ButtonStyle.Configuration let color: Color @@ -51,7 +71,7 @@ extension Button { } // MARK: - Text -extension Button { +extension DMSButtonStyle { struct TextButton: View { let configuration: ButtonStyle.Configuration let color: Color @@ -64,7 +84,7 @@ extension Button { } // MARK: - Underline -extension Button { +extension DMSButtonStyle { struct UnderlineButton: View { let configuration: ButtonStyle.Configuration let color: Color From a3d206511b8e95e93a490dfbd4c3ffba0d52ca1c Mon Sep 17 00:00:00 2001 From: baegteun Date: Fri, 23 Sep 2022 10:25:48 +0900 Subject: [PATCH 4/8] =?UTF-8?q?feat=20::=20=EA=B0=81=20=EC=8A=A4=ED=83=80?= =?UTF-8?q?=EC=9D=BC=EB=B3=84=20=EB=B2=84=ED=8A=BC=20=EC=83=9D=EC=84=B1=20?= =?UTF-8?q?=EC=83=89=20=EC=A0=9C=EC=99=B8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Sources/Button/DMSButton.swift | 11 ++++-- .../Sources/Button/DMSButtonStyle.swift | 36 +++++++++++++++++++ 2 files changed, 44 insertions(+), 3 deletions(-) diff --git a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift index 2f2abe01..79bb95d2 100644 --- a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift +++ b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift @@ -21,8 +21,6 @@ public struct DMSButton: View { public var body: some View { Button(action: action) { Text(text) - .padding(.vertical, 14) - .padding(.horizontal, 16) } .buttonStyle(DMSButtonStyle(style: style, color: color)) } @@ -30,6 +28,13 @@ public struct DMSButton: View { struct DMSButton_Previews: PreviewProvider { static var previews: some View { - DMSButton(text: "Asdf") + VStack(spacing: 20) { + DMSButton(text: "Contained") + DMSButton(text: "Outlined", style: .outlined) + DMSButton(text: "Text", style: .text) + DMSButton(text: "Underline", style: .underline) + } + .padding() + .background(Color.gray) } } diff --git a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift index 72c73117..76741c29 100644 --- a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift +++ b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift @@ -44,6 +44,8 @@ extension DMSButtonStyle { var body: some View { configuration.label + .padding(.vertical, 14) + .padding(.horizontal, 16) .dmsFont(.text(.small)) // TODO: 디자인상으로 폰트 적용될 시 수정 .background(color) .foregroundColor(.white) // TODO: 디자인 시스템 - 색상 나올 시 수정 @@ -66,6 +68,20 @@ extension DMSButtonStyle { var body: some View { configuration.label + .padding(.vertical, 14) + .padding(.horizontal, 16) + .dmsFont(.text(.small)) // TODO: 디자인상으로 폰트 적용될 시 수정 + .background(.clear) + .foregroundColor(.white) // TODO: 디자인 시스템 - 색상 나올 시 수정 + .overlay { + RoundedRectangle(cornerRadius: 5) + .stroke(color, lineWidth: 1) + } + .opacity( + isEnabled ? + configuration.isPressed ? 0.7 : 1.0 : + 0.5 + ) } } } @@ -79,6 +95,13 @@ extension DMSButtonStyle { var body: some View { configuration.label + .dmsFont(.text(.small)) // TODO: 디자인상으로 폰트 적용될 시 수정 + .foregroundColor(color) + .opacity( + isEnabled ? + configuration.isPressed ? 0.7 : 1.0 : + 0.5 + ) } } } @@ -92,6 +115,19 @@ extension DMSButtonStyle { var body: some View { configuration.label + .dmsFont(.text(.small)) // TODO: 디자인상으로 폰트 적용될 시 수정 + .foregroundColor(color) + .overlay(alignment: .bottom) { + Rectangle() + .foregroundColor(color) + .frame(height: 1) + .offset(y: 1) + } + .opacity( + isEnabled ? + configuration.isPressed ? 0.7 : 1.0 : + 0.5 + ) } } } From 57d69359da9fa5148a37870816737aec5a74cbde Mon Sep 17 00:00:00 2001 From: baegteun Date: Mon, 26 Sep 2022 17:44:35 +0900 Subject: [PATCH 5/8] build :: Asset Build --- .../Sources/TuistAssets+DesignSystem.swift | 91 +++++++++++++++++++ 1 file changed, 91 insertions(+) create mode 100644 Projects/UsertInterfaces/DesignSystem/Derived/Sources/TuistAssets+DesignSystem.swift diff --git a/Projects/UsertInterfaces/DesignSystem/Derived/Sources/TuistAssets+DesignSystem.swift b/Projects/UsertInterfaces/DesignSystem/Derived/Sources/TuistAssets+DesignSystem.swift new file mode 100644 index 00000000..f6f2d74b --- /dev/null +++ b/Projects/UsertInterfaces/DesignSystem/Derived/Sources/TuistAssets+DesignSystem.swift @@ -0,0 +1,91 @@ +// swiftlint:disable all +// swift-format-ignore-file +// swiftformat:disable all +// Generated using tuist — https://github.com/tuist/tuist + +#if os(macOS) + import AppKit +#elseif os(iOS) + import UIKit +#elseif os(tvOS) || os(watchOS) + import UIKit +#endif + +// swiftlint:disable superfluous_disable_command file_length implicit_return + +// MARK: - Asset Catalogs + +// swiftlint:disable identifier_name line_length nesting type_body_length type_name +public enum DesignSystemAsset { + public enum PrimaryColor { + public static let darken1 = DesignSystemColors(name: "Darken-1") + public static let darken2 = DesignSystemColors(name: "Darken-2") + public static let gray1 = DesignSystemColors(name: "Gray 1") + public static let gray2 = DesignSystemColors(name: "Gray 2") + public static let gray3 = DesignSystemColors(name: "Gray 3") + public static let gray4 = DesignSystemColors(name: "Gray 4") + public static let gray5 = DesignSystemColors(name: "Gray 5") + public static let gray6 = DesignSystemColors(name: "Gray 6") + public static let gray7 = DesignSystemColors(name: "Gray 7") + public static let gray8 = DesignSystemColors(name: "Gray 8") + public static let gray9 = DesignSystemColors(name: "Gray 9") + public static let lighten1 = DesignSystemColors(name: "Lighten-1") + public static let lighten2 = DesignSystemColors(name: "Lighten-2") + public static let primary = DesignSystemColors(name: "Primary") + } + public enum SystemColor { + public static let backgrond = DesignSystemColors(name: "Backgrond") + public static let error = DesignSystemColors(name: "Error") + public static let iconActive = DesignSystemColors(name: "IconActive") + public static let iconInactive = DesignSystemColors(name: "IconInactive") + public static let line = DesignSystemColors(name: "Line") + public static let onBackground = DesignSystemColors(name: "OnBackground") + public static let onError = DesignSystemColors(name: "OnError") + public static let onPrimary = DesignSystemColors(name: "OnPrimary") + public static let surface = DesignSystemColors(name: "Surface") + public static let text = DesignSystemColors(name: "Text") + public static let title = DesignSystemColors(name: "Title") + } +} +// swiftlint:enable identifier_name line_length nesting type_body_length type_name + +// MARK: - Implementation Details + +public final class DesignSystemColors { + public fileprivate(set) var name: String + + #if os(macOS) + public typealias Color = NSColor + #elseif os(iOS) || os(tvOS) || os(watchOS) + public typealias Color = UIColor + #endif + + @available(iOS 11.0, tvOS 11.0, watchOS 4.0, macOS 10.13, *) + public private(set) lazy var color: Color = { + guard let color = Color(asset: self) else { + fatalError("Unable to load color asset named \(name).") + } + return color + }() + + fileprivate init(name: String) { + self.name = name + } +} + +public extension DesignSystemColors.Color { + @available(iOS 11.0, tvOS 11.0, watchOS 4.0, macOS 10.13, *) + convenience init?(asset: DesignSystemColors) { + let bundle = DesignSystemResources.bundle + #if os(iOS) || os(tvOS) + self.init(named: asset.name, in: bundle, compatibleWith: nil) + #elseif os(macOS) + self.init(named: NSColor.Name(asset.name), bundle: bundle) + #elseif os(watchOS) + self.init(named: asset.name) + #endif + } +} + +// swiftlint:enable all +// swiftformat:enable all From 2b225d9e86396cd49365897649f653f920062d64 Mon Sep 17 00:00:00 2001 From: baegteun Date: Mon, 26 Sep 2022 17:48:20 +0900 Subject: [PATCH 6/8] =?UTF-8?q?feat=20::=20Component=EC=97=90=20=EC=83=89?= =?UTF-8?q?=EC=83=81=20=EC=A0=81=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DesignSystem/Sources/Button/DMSButtonStyle.swift | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift index 76741c29..4227a5a8 100644 --- a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift +++ b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift @@ -48,7 +48,7 @@ extension DMSButtonStyle { .padding(.horizontal, 16) .dmsFont(.text(.small)) // TODO: 디자인상으로 폰트 적용될 시 수정 .background(color) - .foregroundColor(.white) // TODO: 디자인 시스템 - 색상 나올 시 수정 + .foregroundColor(.GrayScale.gray1) .cornerRadius(5) .opacity( isEnabled ? @@ -72,7 +72,7 @@ extension DMSButtonStyle { .padding(.horizontal, 16) .dmsFont(.text(.small)) // TODO: 디자인상으로 폰트 적용될 시 수정 .background(.clear) - .foregroundColor(.white) // TODO: 디자인 시스템 - 색상 나올 시 수정 + .foregroundColor(.GrayScale.gray1) .overlay { RoundedRectangle(cornerRadius: 5) .stroke(color, lineWidth: 1) From 1c40cfaf0ba960cb8d453a1fc29214550e927df7 Mon Sep 17 00:00:00 2001 From: baegteun Date: Tue, 27 Sep 2022 19:51:02 +0900 Subject: [PATCH 7/8] :sparkles: :: DMSButton --- .../DesignSystem/Sources/Button/DMSButton.swift | 2 +- .../DesignSystem/Sources/Button/DMSButtonStyle.swift | 8 ++++---- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift index 79bb95d2..3953c042 100644 --- a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift +++ b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButton.swift @@ -35,6 +35,6 @@ struct DMSButton_Previews: PreviewProvider { DMSButton(text: "Underline", style: .underline) } .padding() - .background(Color.gray) + .background(Color.GrayScale.gray9) } } diff --git a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift index 4227a5a8..eeccde6c 100644 --- a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift +++ b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift @@ -46,7 +46,7 @@ extension DMSButtonStyle { configuration.label .padding(.vertical, 14) .padding(.horizontal, 16) - .dmsFont(.text(.small)) // TODO: 디자인상으로 폰트 적용될 시 수정 + .dmsFont(.button(.default)) .background(color) .foregroundColor(.GrayScale.gray1) .cornerRadius(5) @@ -70,7 +70,7 @@ extension DMSButtonStyle { configuration.label .padding(.vertical, 14) .padding(.horizontal, 16) - .dmsFont(.text(.small)) // TODO: 디자인상으로 폰트 적용될 시 수정 + .dmsFont(.button(.default)) .background(.clear) .foregroundColor(.GrayScale.gray1) .overlay { @@ -95,7 +95,7 @@ extension DMSButtonStyle { var body: some View { configuration.label - .dmsFont(.text(.small)) // TODO: 디자인상으로 폰트 적용될 시 수정 + .dmsFont(.button(.default)) .foregroundColor(color) .opacity( isEnabled ? @@ -115,7 +115,7 @@ extension DMSButtonStyle { var body: some View { configuration.label - .dmsFont(.text(.small)) // TODO: 디자인상으로 폰트 적용될 시 수정 + .dmsFont(.button(.default)) .foregroundColor(color) .overlay(alignment: .bottom) { Rectangle() From 39153dcb83ebaa51297dc524a9f05f138a36c1e3 Mon Sep 17 00:00:00 2001 From: baegteun Date: Tue, 27 Sep 2022 19:55:15 +0900 Subject: [PATCH 8/8] =?UTF-8?q?fix=20::=20=EC=A0=95=EC=83=81=EC=A0=81?= =?UTF-8?q?=EC=9D=B8=20foreground=20color=EB=A1=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DesignSystem/Sources/Button/DMSButtonStyle.swift | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift index eeccde6c..798a30d5 100644 --- a/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift +++ b/Projects/UsertInterfaces/DesignSystem/Sources/Button/DMSButtonStyle.swift @@ -72,7 +72,7 @@ extension DMSButtonStyle { .padding(.horizontal, 16) .dmsFont(.button(.default)) .background(.clear) - .foregroundColor(.GrayScale.gray1) + .foregroundColor(color) .overlay { RoundedRectangle(cornerRadius: 5) .stroke(color, lineWidth: 1)