Initial commit

.github/workflows/test.yml

@@ -0,0 +1,26 @@
+name: Temp test kotlin npm install
+
+on:
+  workflow_dispatch:
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Setup Java
+        uses: actions/setup-java@v3
+        with:
+          distribution: temurin
+          java-version: 11
+
+      - name: Setup Gradle
+        uses: gradle/gradle-build-action@v2
+
+      - name: Make gradlew executable
+        run: chmod +x gradlew
+
+      - name: Test NPM install is working
+        run: ./gradlew :kotlinNpmInstall

.gitignore

@@ -0,0 +1,27 @@
+# General ignores
+.DS_Store
+build
+out
+kotlin-js-store
+
+# IntelliJ ignores
+*.iml
+/*.ipr
+
+/.idea/caches
+/.idea/libraries
+/.idea/modules.xml
+/.idea/workspace.xml
+/.idea/gradle.xml
+/.idea/navEditor.xml
+/.idea/assetWizardSettings.xml
+/.idea/artifacts
+/.idea/compiler.xml
+/.idea/jarRepositories.xml
+/.idea/*.iml
+/.idea/modules
+/.idea/libraries-with-intellij-classes.xml
+
+# Gradle ignores
+.gradle
+

README.md

@@ -0,0 +1,53 @@
+This is a [Kobweb](https://github.com/varabyte/kobweb) project bootstrapped with the `app/empty` template.
+
+This template is useful if you already know what you're doing and just want a clean slate. By default, it
+just creates a blank home page (which prints to the console so you can confirm it's working)
+
+If you are still learning, consider instantiating the `app` template (or one of the examples) to see actual,
+working projects.
+
+## Getting Started
+
+First, run the development server by typing the following command in a terminal under the `site` folder:
+
+```bash
+$ cd site
+$ kobweb run
+```
+
+Open [http://localhost:8080](http://localhost:8080) with your browser to see the result.
+
+You can use any editor you want for the project, but we recommend using **IntelliJ IDEA Community Edition** downloaded
+using the [Toolbox App](https://www.jetbrains.com/toolbox-app/).
+
+Press `Q` in the terminal to gracefully stop the server.
+
+### Live Reload
+
+Feel free to edit / add / delete new components, pages, and API endpoints! When you make any changes, the site will
+indicate the status of the build and automatically reload when ready.
+
+## Exporting the Project
+
+When you are ready to ship, you should shutdown the development server and then export the project using:
+
+```bash
+kobweb export
+```
+
+When finished, you can run a Kobweb server in production mode:
+
+```bash
+kobweb run --env prod
+```
+
+If you want to run this command in the Cloud provider of your choice, consider disabling interactive mode since nobody
+is sitting around watching the console in that case anyway. To do that, use:
+
+```bash
+kobweb run --env prod --notty
+```
+
+Kobweb also supports exporting to a static layout which is compatible with static hosting providers, such as GitHub
+Pages, Netlify, Firebase, any presumably all the others. You can read more about that approach here:
+https://bitspittle.dev/blog/2022/staticdeploy

bootstrap/build.gradle.kts

@@ -0,0 +1,46 @@
+import com.varabyte.kobweb.gradle.library.util.configAsKobwebLibrary
+
+plugins {
+    alias(libs.plugins.kotlin.multiplatform)
+    alias(libs.plugins.jetbrains.compose)
+    alias(libs.plugins.kobweb.library)
+    `maven-publish`
+}
+
+group = "com.stevdza.san.bootstrap"
+version = "0.0.1"
+
+kotlin {
+    configAsKobwebLibrary(includeServer = false)
+
+    @Suppress("UNUSED_VARIABLE")
+    sourceSets {
+        val commonMain by getting {
+            dependencies {
+                implementation(compose.runtime)
+            }
+        }
+
+        val jsMain by getting {
+            dependencies {
+                implementation(compose.html.core)
+                implementation(libs.kobweb.core)
+                implementation(libs.kobweb.silk.core)
+                implementation(libs.kobweb.silk.icons.fa)
+                implementation(npm("is-sorted", "1.0.5"))
+                implementation(npm("bootstrap", "5.3.1"))
+            }
+        }
+    }
+}
+
+publishing {
+    publications {
+        register("mavenJsLibrary", MavenPublication::class) {
+            from(components["kotlin"])
+            groupId = "com.github.stevdza-san"
+            artifactId = "KotlinBootstrap"
+            version = "0.0.1"
+        }
+    }
+}

bootstrap/src/jsMain/kotlin/com/stevdza/san/kotlinbs/IsSorted.kt

@@ -0,0 +1,5 @@
+package com.stevdza.san.kotlinbs
+
+@JsModule("is-sorted")
+@JsNonModule
+external fun <T> sorted(a: Array<T>): Boolean

bootstrap/src/jsMain/kotlin/com/stevdza/san/kotlinbs/components/BSAccordion.kt

@@ -0,0 +1,71 @@
+package com.stevdza.san.kotlinbs.components
+
+import androidx.compose.runtime.Composable
+import com.stevdza.san.kotlinbs.models.AccordionItem
+import com.varabyte.kobweb.compose.ui.Modifier
+import com.varabyte.kobweb.compose.ui.modifiers.classNames
+import com.varabyte.kobweb.compose.ui.modifiers.id
+import com.varabyte.kobweb.compose.ui.toAttrs
+import com.varabyte.kobweb.silk.components.text.SpanText
+import org.jetbrains.compose.web.dom.Button
+import org.jetbrains.compose.web.dom.Div
+import org.jetbrains.compose.web.dom.H2
+
+/**
+ * UI element that allows you to create collapsible and expandable sections of content.
+ * It is often used to display information in a compact and organized manner,
+ * especially when you have a lot of content to present in a limited space.
+ * @param id A unique identifier for the parent.
+ * @param items One or multiple [AccordionItem]'s that represents the content that
+ * you want to make expandable.
+ * */
+@Composable
+fun BSAccordion(
+    modifier: Modifier = Modifier,
+    id: String,
+    items: List<AccordionItem>
+) {
+    Div(
+        attrs = modifier
+            .id(id)
+            .classNames("accordion")
+            .toAttrs()
+    ) {
+        items.forEach { accordionItem ->
+            Div(attrs = Modifier.classNames("accordion-item").toAttrs()) {
+                H2(
+                    attrs = Modifier
+                        .id("header${accordionItem.body.hashCode()}")
+                        .classNames("accordion-header")
+                        .toAttrs()
+                ) {
+                    Button(attrs = Modifier
+                        .classNames("accordion-button", "collapsed")
+                        .toAttrs {
+                            attr("type", "button")
+                            attr("data-bs-toggle", "collapse")
+                            attr("data-bs-target", "#collapse${accordionItem.hashCode()}")
+                            attr("aria-expanded", "true")
+                            attr("aria-controls", "collapse${accordionItem.hashCode()}")
+                        }
+                    ) {
+                        SpanText(text = accordionItem.title)
+                    }
+                }
+                Div(
+                    attrs = Modifier
+                        .id("collapse${accordionItem.hashCode()}")
+                        .classNames("accordion-collapse", "collapse")
+                        .toAttrs {
+                            attr("aria-labelledby", "header${accordionItem.body.hashCode()}")
+                            attr("data-bs-parent", id)
+                        }
+                ) {
+                    Div(attrs = Modifier.classNames("accordion-body").toAttrs()) {
+                        SpanText(accordionItem.body)
+                    }
+                }
+            }
+        }
+    }
+}