complete restyling

This commit is contained in:
InsanusMokrassar 2022-11-16 13:18:52 +06:00
parent 9fe7c458e9
commit 3be0f24eac
21 changed files with 214 additions and 148 deletions

View File

@ -5,6 +5,7 @@ import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.setValue import androidx.compose.runtime.setValue
import dev.inmo.kmppscriptbuilder.core.models.Config import dev.inmo.kmppscriptbuilder.core.models.Config
import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultBox
import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultDivider import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultDivider
@Composable @Composable
@ -44,6 +45,7 @@ class BuilderView : View() {
config = it config = it
} }
DefaultBox {
projectTypeView.build() projectTypeView.build()
DefaultDivider() DefaultDivider()
licensesView.build() licensesView.build()
@ -51,3 +53,4 @@ class BuilderView : View() {
mavenInfoView.build() mavenInfoView.build()
} }
} }
}

View File

@ -2,11 +2,13 @@ package dev.inmo.kmppscriptbuilder.core.ui
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateListOf
import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.setValue import androidx.compose.runtime.setValue
import dev.inmo.kmppscriptbuilder.core.models.Developer import dev.inmo.kmppscriptbuilder.core.models.Developer
import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonText
import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonTextField import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonTextField
import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultBox
import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultSmallVerticalMargin
class DeveloperState( class DeveloperState(
id: String = "", id: String = "",
@ -38,17 +40,19 @@ class DevelopersView : ListView<DeveloperState>("Developers info") {
override fun createItem(): DeveloperState = DeveloperState() override fun createItem(): DeveloperState = DeveloperState()
@Composable @Composable
override fun buildView(item: DeveloperState) { override fun buildView(item: DeveloperState) {
CommonText("Developer username")
CommonTextField( CommonTextField(
item.id, item.id,
"Developer username",
) { item.id = it } ) { item.id = it }
DefaultSmallVerticalMargin()
CommonText("Developer name")
CommonTextField( CommonTextField(
item.name, item.name,
"Developer name",
) { item.name = it } ) { item.name = it }
DefaultSmallVerticalMargin()
CommonText("Developer E-Mail")
CommonTextField( CommonTextField(
item.eMail, item.eMail,
"Developer E-Mail",
) { item.eMail = it } ) { item.eMail = it }
} }
} }

View File

@ -5,18 +5,19 @@ import androidx.compose.runtime.derivedStateOf
import androidx.compose.runtime.getValue import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateListOf import androidx.compose.runtime.mutableStateListOf
import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue import androidx.compose.runtime.setValue
import dev.inmo.kmppscriptbuilder.core.models.License import dev.inmo.kmppscriptbuilder.core.models.License
import dev.inmo.kmppscriptbuilder.core.models.getLicenses import dev.inmo.kmppscriptbuilder.core.models.getLicenses
import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonText
import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonTextField import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonTextField
import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultSmallVerticalMargin
import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer
import io.ktor.client.HttpClient import io.ktor.client.HttpClient
import kotlinx.coroutines.CoroutineScope import kotlinx.coroutines.CoroutineScope
import kotlinx.coroutines.Dispatchers import kotlinx.coroutines.Dispatchers
import kotlinx.coroutines.launch import kotlinx.coroutines.launch
internal class LicenseState( class LicenseState(
id: String = "", id: String = "",
title: String = "", title: String = "",
url: String? = null url: String? = null
@ -32,13 +33,12 @@ internal fun License.toLicenseState() = LicenseState(id, title, url)
expect object LicensesDrawer : Drawer<LicensesView> expect object LicensesDrawer : Drawer<LicensesView>
class LicensesView: VerticalView("Licenses") { class LicensesView : ListView<LicenseState>("Licenses") {
internal var licensesListState = mutableStateListOf<LicenseState>()
var licenses: List<License> var licenses: List<License>
get() = licensesListState.map { it.toLicense() } get() = itemsList.map { it.toLicense() }
set(value) { set(value) {
licensesListState.clear() itemsList.clear()
licensesListState.addAll(value.map { it.toLicenseState() }) itemsList.addAll(value.map { it.toLicenseState() })
} }
internal val availableLicensesState = mutableStateListOf<License>() internal val availableLicensesState = mutableStateListOf<License>()
internal var licenseSearchFilter by mutableStateOf("") internal var licenseSearchFilter by mutableStateOf("")
@ -50,6 +50,9 @@ class LicensesView: VerticalView("Licenses") {
} }
} }
override val addItemText: String
get() = "Add empty license"
init { init {
CoroutineScope(Dispatchers.Default).launch { CoroutineScope(Dispatchers.Default).launch {
val client = HttpClient() val client = HttpClient()
@ -58,6 +61,27 @@ class LicensesView: VerticalView("Licenses") {
} }
} }
override fun createItem(): LicenseState = LicenseState()
@Composable
override fun buildView(item: LicenseState) {
CommonText("License ID")
CommonTextField(
item.id,
"Short name like \"Apache-2.0\"",
) { item.id = it }
CommonText("License title")
CommonTextField(
item.title,
"Official title of license (like \"Apache Software License 2.0\")",
) { item.title = it }
CommonText("License URL")
CommonTextField(
item.url ?: "",
"Link to your LICENSE file OR official license file (like \"https://opensource.org/licenses/Apache-2.0\")",
) { item.url = it }
}
override val content: @Composable () -> Unit = { override val content: @Composable () -> Unit = {
CommonTextField( CommonTextField(
licenseSearchFilter, licenseSearchFilter,
@ -68,7 +92,12 @@ class LicensesView: VerticalView("Licenses") {
) { filterText -> ) { filterText ->
licenseSearchFilter = filterText licenseSearchFilter = filterText
} }
DefaultSmallVerticalMargin()
with(LicensesDrawer) { draw() } with(LicensesDrawer) { draw() }
DefaultSmallVerticalMargin()
super.content()
} }
} }

View File

@ -7,7 +7,9 @@ import dev.inmo.kmppscriptbuilder.core.models.SonatypeRepository
import dev.inmo.kmppscriptbuilder.core.models.defaultProjectDescription import dev.inmo.kmppscriptbuilder.core.models.defaultProjectDescription
import dev.inmo.kmppscriptbuilder.core.models.defaultProjectName import dev.inmo.kmppscriptbuilder.core.models.defaultProjectName
import dev.inmo.kmppscriptbuilder.core.ui.utils.ButtonsPanel import dev.inmo.kmppscriptbuilder.core.ui.utils.ButtonsPanel
import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonText
import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonTextField import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonTextField
import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultSmallVerticalMargin
import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer
import dev.inmo.kmppscriptbuilder.core.ui.utils.SwitchWithLabel import dev.inmo.kmppscriptbuilder.core.ui.utils.SwitchWithLabel
@ -56,21 +58,28 @@ class MavenInfoView : VerticalView("Project information") {
private val gpgSigningDrawer = GpgSigningOptionDrawerWithView(this) private val gpgSigningDrawer = GpgSigningOptionDrawerWithView(this)
override val content: @Composable () -> Unit = { override val content: @Composable () -> Unit = {
CommonText("Public project name")
CommonTextField( CommonTextField(
projectNameProperty, projectNameProperty,
"Public project name", "\${project.name}",
) { projectNameProperty = it } ) { projectNameProperty = it }
DefaultSmallVerticalMargin()
CommonText("Public project description")
CommonTextField( CommonTextField(
projectDescriptionProperty, projectDescriptionProperty,
"Public project description", "\${project.name}",
) { projectDescriptionProperty = it } ) { projectDescriptionProperty = it }
DefaultSmallVerticalMargin()
CommonText("Public project URL")
CommonTextField( CommonTextField(
projectUrlProperty, projectUrlProperty,
"Public project URL", "Type url to github or other source with readme",
) { projectUrlProperty = it } ) { projectUrlProperty = it }
DefaultSmallVerticalMargin()
CommonText("Public project VCS URL (with .git)")
CommonTextField( CommonTextField(
projectVcsUrlProperty, projectVcsUrlProperty,
"Public project VCS URL (with .git)", "Type url to github .git file"
) { projectVcsUrlProperty = it } ) { projectVcsUrlProperty = it }
ButtonsPanel( ButtonsPanel(

View File

@ -9,6 +9,7 @@ import dev.inmo.kmppscriptbuilder.core.models.JVMProjectType
import dev.inmo.kmppscriptbuilder.core.models.MultiplatformProjectType import dev.inmo.kmppscriptbuilder.core.models.MultiplatformProjectType
import dev.inmo.kmppscriptbuilder.core.models.ProjectType import dev.inmo.kmppscriptbuilder.core.models.ProjectType
import dev.inmo.kmppscriptbuilder.core.ui.utils.ButtonsPanel import dev.inmo.kmppscriptbuilder.core.ui.utils.ButtonsPanel
import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultSmallVerticalMargin
import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer
expect class ProjectTypeDrawer : Drawer<ProjectType> expect class ProjectTypeDrawer : Drawer<ProjectType>

View File

@ -2,12 +2,12 @@ package dev.inmo.kmppscriptbuilder.core.ui
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateListOf
import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.setValue import androidx.compose.runtime.setValue
import dev.inmo.kmppscriptbuilder.core.models.MavenPublishingRepository import dev.inmo.kmppscriptbuilder.core.models.MavenPublishingRepository
import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonText
import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonTextField import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonTextField
import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultSmallVerticalMargin
class RepositoryState( class RepositoryState(
name: String = "", name: String = "",
@ -38,13 +38,16 @@ class RepositoriesView : ListView<RepositoryState>("Repositories info") {
@Composable @Composable
override fun buildView(item: RepositoryState) { override fun buildView(item: RepositoryState) {
CommonText("Repository name")
CommonTextField( CommonTextField(
item.name, item.name,
"Repository name", "This name will be used to identify repository in gradle"
) { item.name = it } ) { item.name = it }
DefaultSmallVerticalMargin()
CommonText("Repository url")
CommonTextField( CommonTextField(
item.url, item.url,
"Repository url", "For example: https://repo.maven.apache.org/maven2/"
) { item.url = it } ) { item.url = it }
} }

View File

@ -1,11 +1,14 @@
package dev.inmo.kmppscriptbuilder.core.ui package dev.inmo.kmppscriptbuilder.core.ui
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultBox
abstract class VerticalView(protected val title: String) : View() { abstract class VerticalView(protected val title: String) : View() {
abstract val content: @Composable () -> Unit abstract val content: @Composable () -> Unit
@Composable @Composable
override fun build() { override fun build() {
DefaultBox {
DrawVertically(title, content) DrawVertically(title, content)
} }
} }
}

View File

@ -11,7 +11,7 @@ expect fun CommonText(text: String, onClick: (() -> Unit)? = null)
@Composable @Composable
expect fun CommonTextField( expect fun CommonTextField(
presetText: String, presetText: String,
hint: String, hint: String? = null,
onFocusChanged: (Boolean) -> Unit = {}, onFocusChanged: (Boolean) -> Unit = {},
onChange: (String) -> Unit onChange: (String) -> Unit
) )
@ -41,3 +41,9 @@ fun <T> ButtonsPanel(
@Composable @Composable
expect fun DefaultDivider() expect fun DefaultDivider()
@Composable
expect fun DefaultSmallVerticalMargin()
@Composable
expect fun DefaultBox(block: @Composable () -> Unit)

View File

@ -4,6 +4,7 @@ import androidx.compose.runtime.Composable
import dev.inmo.jsuikit.elements.DefaultButton import dev.inmo.jsuikit.elements.DefaultButton
import dev.inmo.jsuikit.modifiers.UIKitButton import dev.inmo.jsuikit.modifiers.UIKitButton
import dev.inmo.jsuikit.modifiers.UIKitMargin import dev.inmo.jsuikit.modifiers.UIKitMargin
import dev.inmo.jsuikit.modifiers.UIKitTooltipModifier
import dev.inmo.jsuikit.modifiers.UIKitUtility import dev.inmo.jsuikit.modifiers.UIKitUtility
import dev.inmo.kmppscriptbuilder.core.models.GpgSigning import dev.inmo.kmppscriptbuilder.core.models.GpgSigning
import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer
@ -14,10 +15,17 @@ actual class GpgSigningOptionDrawer(
) : Drawer<GpgSigning> { ) : Drawer<GpgSigning> {
@Composable @Composable
override fun GpgSigning.draw() { override fun GpgSigning.draw() {
val tooltipModifier = UIKitTooltipModifier(
when (this) {
GpgSigning.Disabled -> "Signing will not be added"
GpgSigning.Enabled -> "Signing will be always enabled"
GpgSigning.Optional -> "Signing will be added, but disabled in case of absence 'signatory.keyId'"
}
)
if (mavenInfoView.gpgSignProperty == this) { if (mavenInfoView.gpgSignProperty == this) {
DefaultButton(name, UIKitButton.Type.Primary, UIKitMargin.Small.Horizontal, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded) DefaultButton(name, UIKitButton.Type.Primary, UIKitButton.Size.Small, UIKitMargin.Small.Horizontal, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded, tooltipModifier)
} else { } else {
DefaultButton(name, UIKitButton.Type.Default, UIKitMargin.Small.Horizontal, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded) { DefaultButton(name, UIKitButton.Type.Default, UIKitButton.Size.Small, UIKitMargin.Small.Horizontal, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded, tooltipModifier) {
mavenInfoView.gpgSignProperty = this mavenInfoView.gpgSignProperty = this
} }
} }

View File

@ -28,34 +28,10 @@ actual object LicensesDrawer : Drawer<LicensesView> {
it.title, it.title,
UIKitButton.Type.Text UIKitButton.Type.Text
) { _ -> ) { _ ->
licensesListState.add(it.toLicenseState()) itemsList.add(it.toLicenseState())
licenseSearchFilter = "" licenseSearchFilter = ""
} }
Divider.Common() Divider.Common()
} }
DefaultButton("Add empty license", UIKitButton.Type.Primary, UIKitMargin.Small, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded) {
licensesListState.add(LicenseState())
}
licensesListState.forEach { license ->
Div(UIKitMargin.Small.builder()) {
CommonTextField(
license.id,
"License ID",
) { license.id = it }
CommonTextField(
license.title,
"License title",
) { license.title = it }
CommonTextField(
license.url ?: "",
"License URL",
) { license.url = it }
DefaultButton("Remove", UIKitButton.Type.Default, UIKitMargin.Small, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded) {
licensesListState.remove(license)
}
}
}
} }
} }

View File

@ -6,6 +6,7 @@ import dev.inmo.jsuikit.modifiers.UIKitButton
import dev.inmo.jsuikit.modifiers.UIKitMargin import dev.inmo.jsuikit.modifiers.UIKitMargin
import dev.inmo.jsuikit.modifiers.UIKitUtility import dev.inmo.jsuikit.modifiers.UIKitUtility
import dev.inmo.jsuikit.modifiers.builder import dev.inmo.jsuikit.modifiers.builder
import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultBox
import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer
import dev.inmo.kmppscriptbuilder.core.ui.utils.NoTransform import dev.inmo.kmppscriptbuilder.core.ui.utils.NoTransform
import org.jetbrains.compose.web.dom.Div import org.jetbrains.compose.web.dom.Div
@ -13,14 +14,17 @@ import org.jetbrains.compose.web.dom.Div
actual class ListViewDrawer<T> : Drawer<ListView<T>> { actual class ListViewDrawer<T> : Drawer<ListView<T>> {
@Composable @Composable
override fun ListView<T>.draw() { override fun ListView<T>.draw() {
DefaultButton(addItemText, UIKitButton.Type.Primary, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded ) { itemsList.add(createItem()) }
itemsList.forEach { item -> itemsList.forEach { item ->
Div(UIKitMargin.Small.builder()) { DefaultBox {
buildView(item) buildView(item)
DefaultButton(removeItemText, UIKitButton.Type.Default, UIKitMargin.Small, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded) { DefaultButton(removeItemText, UIKitButton.Type.Default, UIKitMargin.Small, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded) {
itemsList.remove(item) itemsList.remove(item)
} }
} }
DefaultButton(addItemText, UIKitButton.Type.Primary, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded ) { itemsList.add(createItem()) }
}
if (itemsList.isEmpty()) {
DefaultButton(addItemText, UIKitButton.Type.Primary, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded ) { itemsList.add(createItem()) }
} }
} }
} }

View File

@ -16,9 +16,9 @@ actual class ProjectTypeDrawer(
@Composable @Composable
override fun ProjectType.draw() { override fun ProjectType.draw() {
if (projectTypeView.projectType == this) { if (projectTypeView.projectType == this) {
DefaultButton(name, UIKitButton.Type.Primary, UIKitMargin.Small.Horizontal, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded) DefaultButton(name, UIKitButton.Type.Primary, UIKitButton.Size.Small, UIKitMargin.Small.Horizontal, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded)
} else { } else {
DefaultButton(name, UIKitButton.Type.Default, UIKitMargin.Small.Horizontal, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded) { DefaultButton(name, UIKitButton.Type.Default, UIKitButton.Size.Small, UIKitMargin.Small.Horizontal, UIKitUtility.NoTransform, UIKitUtility.Border.Rounded) {
projectTypeView.projectType = this projectTypeView.projectType = this
} }
} }

View File

@ -6,10 +6,16 @@ import dev.inmo.jsuikit.elements.NavItemElement
import dev.inmo.jsuikit.elements.Navbar import dev.inmo.jsuikit.elements.Navbar
import dev.inmo.jsuikit.elements.NavbarNav import dev.inmo.jsuikit.elements.NavbarNav
import dev.inmo.jsuikit.elements.drawAsLink import dev.inmo.jsuikit.elements.drawAsLink
import dev.inmo.jsuikit.modifiers.UIKitBackground
import dev.inmo.jsuikit.modifiers.UIKitInverse
import dev.inmo.jsuikit.modifiers.UIKitMargin import dev.inmo.jsuikit.modifiers.UIKitMargin
import dev.inmo.jsuikit.modifiers.UIKitModifier
import dev.inmo.jsuikit.modifiers.UIKitNavbar
import dev.inmo.jsuikit.modifiers.UIKitPadding import dev.inmo.jsuikit.modifiers.UIKitPadding
import dev.inmo.jsuikit.modifiers.UIKitSection
import dev.inmo.jsuikit.modifiers.UIKitText import dev.inmo.jsuikit.modifiers.UIKitText
import dev.inmo.jsuikit.modifiers.UIKitTooltipModifier import dev.inmo.jsuikit.modifiers.UIKitTooltipModifier
import dev.inmo.jsuikit.modifiers.attrsBuilder
import dev.inmo.jsuikit.modifiers.builder import dev.inmo.jsuikit.modifiers.builder
import dev.inmo.jsuikit.modifiers.include import dev.inmo.jsuikit.modifiers.include
import dev.inmo.jsuikit.utils.AttrsWithContentBuilder import dev.inmo.jsuikit.utils.AttrsWithContentBuilder
@ -20,6 +26,7 @@ import dev.inmo.kmppscriptbuilder.core.utils.saveConfig
import org.jetbrains.compose.web.dom.A import org.jetbrains.compose.web.dom.A
import org.jetbrains.compose.web.dom.Div import org.jetbrains.compose.web.dom.Div
import org.jetbrains.compose.web.dom.Img import org.jetbrains.compose.web.dom.Img
import org.jetbrains.compose.web.dom.Section
import org.jetbrains.compose.web.dom.Text import org.jetbrains.compose.web.dom.Text
@Composable @Composable
@ -29,6 +36,7 @@ actual fun TopAppBar(
onSaveAvailable: (Boolean) -> Unit, onSaveAvailable: (Boolean) -> Unit,
onNewConfig: (Config) -> Unit onNewConfig: (Config) -> Unit
) { ) {
Section(attrsBuilder(UIKitSection.Style.Primary, UIKitInverse.Light)) {
Navbar( Navbar(
leftBuilder = AttrsWithContentBuilder { leftBuilder = AttrsWithContentBuilder {
Div( Div(
@ -77,6 +85,8 @@ actual fun TopAppBar(
} }
}, },
) )
} },
navModifiers = arrayOf(UIKitNavbar.Transparent)
) )
} }
}

View File

@ -3,6 +3,7 @@ package dev.inmo.kmppscriptbuilder.core.ui
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import dev.inmo.jsuikit.modifiers.UIKitForm import dev.inmo.jsuikit.modifiers.UIKitForm
import dev.inmo.jsuikit.modifiers.builder import dev.inmo.jsuikit.modifiers.builder
import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultSmallVerticalMargin
import org.jetbrains.compose.web.dom.Legend import org.jetbrains.compose.web.dom.Legend
import org.jetbrains.compose.web.dom.Text import org.jetbrains.compose.web.dom.Text
@ -16,5 +17,7 @@ actual fun View.DrawVertically(title: String, block: @Composable () -> Unit) {
Legend(UIKitForm.Legend.builder()) { Legend(UIKitForm.Legend.builder()) {
Text(title) Text(title)
} }
DefaultSmallVerticalMargin()
block() block()
DefaultSmallVerticalMargin()
} }

View File

@ -6,21 +6,17 @@ import dev.inmo.jsuikit.elements.DefaultInput
import dev.inmo.jsuikit.elements.Divider import dev.inmo.jsuikit.elements.Divider
import dev.inmo.jsuikit.elements.Flex import dev.inmo.jsuikit.elements.Flex
import dev.inmo.jsuikit.elements.Icon import dev.inmo.jsuikit.elements.Icon
import dev.inmo.jsuikit.elements.Label
import dev.inmo.jsuikit.elements.drawAsFormInputPart import dev.inmo.jsuikit.elements.drawAsFormInputPart
import dev.inmo.jsuikit.modifiers.UIKitButton import dev.inmo.jsuikit.modifiers.UIKitButton
import dev.inmo.jsuikit.modifiers.UIKitCustom
import dev.inmo.jsuikit.modifiers.UIKitFlex import dev.inmo.jsuikit.modifiers.UIKitFlex
import dev.inmo.jsuikit.modifiers.UIKitForm import dev.inmo.jsuikit.modifiers.UIKitForm
import dev.inmo.jsuikit.modifiers.UIKitInverse import dev.inmo.jsuikit.modifiers.UIKitInverse
import dev.inmo.jsuikit.modifiers.UIKitMargin import dev.inmo.jsuikit.modifiers.UIKitMargin
import dev.inmo.jsuikit.modifiers.UIKitText
import dev.inmo.jsuikit.modifiers.UIKitUtility import dev.inmo.jsuikit.modifiers.UIKitUtility
import dev.inmo.jsuikit.modifiers.attrsBuilder
import dev.inmo.jsuikit.modifiers.builder import dev.inmo.jsuikit.modifiers.builder
import dev.inmo.jsuikit.modifiers.include import dev.inmo.jsuikit.modifiers.include
import dev.inmo.jsuikit.utils.Attrs
import kotlinx.browser.window import kotlinx.browser.window
import kotlinx.coroutines.withTimeout
import org.jetbrains.compose.web.attributes.InputType import org.jetbrains.compose.web.attributes.InputType
import org.jetbrains.compose.web.dom.Div import org.jetbrains.compose.web.dom.Div
import org.jetbrains.compose.web.dom.Legend import org.jetbrains.compose.web.dom.Legend
@ -51,7 +47,7 @@ actual fun CommonText(text: String, onClick: (() -> Unit)?) {
@Composable @Composable
actual fun CommonTextField( actual fun CommonTextField(
presetText: String, presetText: String,
hint: String, hint: String?,
onFocusChanged: (Boolean) -> Unit, onFocusChanged: (Boolean) -> Unit,
onChange: (String) -> Unit onChange: (String) -> Unit
) { ) {
@ -118,3 +114,15 @@ actual fun <T> ButtonsPanel(
actual fun DefaultDivider() { actual fun DefaultDivider() {
Divider.Common() Divider.Common()
} }
@Composable
actual fun DefaultSmallVerticalMargin() {
Div(UIKitMargin.Small.Top.builder())
}
@Composable
actual fun DefaultBox(block: @Composable () -> Unit) {
Div(attrsBuilder(UIKitMargin.Small.Horizontal, UIKitMargin.Small.Vertical)) {
block()
}
}

View File

@ -8,10 +8,11 @@ import androidx.compose.foundation.layout.padding
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultSmallVerticalMargin
import dev.inmo.kmppscriptbuilder.core.ui.utils.TitleText import dev.inmo.kmppscriptbuilder.core.ui.utils.TitleText
actual abstract class View { actual abstract class View {
internal open val defaultModifier = Modifier.fillMaxWidth().padding(8.dp) internal open val defaultModifier = Modifier.fillMaxWidth()
@Composable @Composable
actual abstract fun build() actual abstract fun build()
} }
@ -22,10 +23,11 @@ actual fun View.DrawVertically(
block: @Composable () -> Unit block: @Composable () -> Unit
) { ) {
TitleText(title) TitleText(title)
DefaultSmallVerticalMargin()
Column(defaultModifier) { Column(defaultModifier) {
block() block()
} }
Spacer(Modifier.fillMaxWidth().height(8.dp)) DefaultSmallVerticalMargin()
} }

View File

@ -20,7 +20,7 @@ actual class GpgSigningOptionDrawer(
@Composable @Composable
override fun GpgSigning.draw() { override fun GpgSigning.draw() {
if (mavenInfoView.gpgSignProperty == this) { if (mavenInfoView.gpgSignProperty == this) {
Button({}, Modifier.padding(8.dp)) { Button({}, Modifier.padding(8.dp, 0.dp)) {
Text(name) Text(name)
} }
} else { } else {
@ -28,7 +28,7 @@ actual class GpgSigningOptionDrawer(
{ {
mavenInfoView.gpgSignProperty = this mavenInfoView.gpgSignProperty = this
}, },
Modifier.padding(8.dp) Modifier.padding(8.dp, 0.dp)
) { ) {
Text(name) Text(name)
} }

View File

@ -5,8 +5,6 @@ import androidx.compose.foundation.layout.padding
import androidx.compose.material.Button import androidx.compose.material.Button
import androidx.compose.material.Divider import androidx.compose.material.Divider
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonText import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonText
@ -21,7 +19,7 @@ actual object LicensesDrawer : Drawer<LicensesView> {
licensesOffersToShow.value.forEach { licensesOffersToShow.value.forEach {
Column(Modifier.padding(16.dp, 8.dp, 8.dp, 8.dp)) { Column(Modifier.padding(16.dp, 8.dp, 8.dp, 8.dp)) {
CommonText(it.title) { CommonText(it.title) {
licensesListState.add(it.toLicenseState()) itemsList.add(it.toLicenseState())
licenseSearchFilter = "" licenseSearchFilter = ""
} }
Divider() Divider()
@ -29,29 +27,5 @@ actual object LicensesDrawer : Drawer<LicensesView> {
} }
} }
} }
Button({ licensesListState.add(LicenseState()) }, Modifier.padding(8.dp)) {
CommonText("Add empty license")
}
licensesListState.forEach { license ->
Column(Modifier.padding(8.dp)) {
CommonTextField(
license.id,
"License ID",
) { license.id = it }
CommonTextField(
license.title,
"License title",
) { license.title = it }
CommonTextField(
license.url ?: "",
"License URL",
) { license.url = it }
Button({ licensesListState.remove(license) }, Modifier.padding(8.dp)) {
CommonText("Remove",)
}
}
}
} }
} }

View File

@ -3,25 +3,32 @@ package dev.inmo.kmppscriptbuilder.core.ui
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.material.Button import androidx.compose.material.Button
import androidx.compose.material.OutlinedButton
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonText import dev.inmo.kmppscriptbuilder.core.ui.utils.CommonText
import dev.inmo.kmppscriptbuilder.core.ui.utils.DefaultBox
import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer import dev.inmo.kmppscriptbuilder.core.ui.utils.Drawer
actual class ListViewDrawer<T> : Drawer<ListView<T>> { actual class ListViewDrawer<T> : Drawer<ListView<T>> {
@Composable @Composable
override fun ListView<T>.draw() { override fun ListView<T>.draw() {
Button({ itemsList.add(createItem()) }) {
CommonText(addItemText,)
}
itemsList.forEach { item -> itemsList.forEach { item ->
Column(Modifier.padding(8.dp)) { DefaultBox {
buildView(item) buildView(item)
Button({ itemsList.remove(item) }, Modifier.padding(8.dp)) { OutlinedButton({ itemsList.remove(item) }, Modifier.padding(8.dp)) {
CommonText(removeItemText,) CommonText(removeItemText,)
} }
} }
Button({ itemsList.add(createItem()) }) {
CommonText(addItemText,)
}
}
if (itemsList.isEmpty()) {
Button({ itemsList.add(createItem()) }) {
CommonText(addItemText,)
}
} }
} }
} }

View File

@ -21,7 +21,7 @@ actual class ProjectTypeDrawer(
@Composable @Composable
override fun ProjectType.draw() { override fun ProjectType.draw() {
if (projectTypeView.projectType == this) { if (projectTypeView.projectType == this) {
Button({}, Modifier.padding(8.dp)) { Button({}, Modifier.padding(8.dp, 0.dp)) {
Text(name) Text(name)
} }
} else { } else {
@ -29,7 +29,7 @@ actual class ProjectTypeDrawer(
{ {
projectTypeView.projectType = this projectTypeView.projectType = this
}, },
Modifier.padding(8.dp) Modifier.padding(8.dp, 0.dp)
) { ) {
Text(name) Text(name)
} }

View File

@ -3,7 +3,9 @@ package dev.inmo.kmppscriptbuilder.core.ui.utils
import androidx.compose.foundation.clickable import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.material.Divider import androidx.compose.material.Divider
@ -50,7 +52,7 @@ actual fun SwitchWithLabel(
@Composable @Composable
actual fun CommonTextField( actual fun CommonTextField(
presetText: String, presetText: String,
hint: String, hint: String?,
onFocusChanged: (Boolean) -> Unit, onFocusChanged: (Boolean) -> Unit,
onChange: (String) -> Unit onChange: (String) -> Unit
) { ) {
@ -61,8 +63,10 @@ actual fun CommonTextField(
onFocusChanged(it.isFocused) onFocusChanged(it.isFocused)
}, },
singleLine = true, singleLine = true,
label = { label = hint ?.let {
CommonText(hint,) {
CommonText(hint)
}
} }
) )
} }
@ -94,3 +98,15 @@ actual fun <T> ButtonsPanel(
actual fun DefaultDivider() { actual fun DefaultDivider() {
Divider() Divider()
} }
@Composable
actual fun DefaultSmallVerticalMargin() {
Spacer(Modifier.padding(0.dp, 4.dp))
}
@Composable
actual fun DefaultBox(block: @Composable () -> Unit) {
Column(Modifier.padding(8.dp)) {
block()
}
}