diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala index d2e0b4d..9a54dea 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala @@ -1,7 +1,7 @@ package works.iterative.ui.components.laminar import com.raquo.laminar.api.L.{*, given} -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag case class Bin[Source, +Value]( diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala index d2e0b4d..9a54dea 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala @@ -1,7 +1,7 @@ package works.iterative.ui.components.laminar import com.raquo.laminar.api.L.{*, given} -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag case class Bin[Source, +Value]( diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala index 15169f3..480f5a9 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala @@ -3,12 +3,12 @@ import com.raquo.laminar.api.L import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag import org.scalajs.dom.html.UList import com.raquo.laminar.nodes.ReactiveHtmlElement import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind trait DashboardComponentsModule: def dashboard: DashboardComponents diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala index d2e0b4d..9a54dea 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala @@ -1,7 +1,7 @@ package works.iterative.ui.components.laminar import com.raquo.laminar.api.L.{*, given} -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag case class Bin[Source, +Value]( diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala index 15169f3..480f5a9 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala @@ -3,12 +3,12 @@ import com.raquo.laminar.api.L import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag import org.scalajs.dom.html.UList import com.raquo.laminar.nodes.ReactiveHtmlElement import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind trait DashboardComponentsModule: def dashboard: DashboardComponents diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala index 98e31b9..5de4d67 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala @@ -2,7 +2,7 @@ import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given import com.raquo.laminar.nodes.ReactiveHtmlElement import org.scalajs.dom.html.Paragraph diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala index d2e0b4d..9a54dea 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala @@ -1,7 +1,7 @@ package works.iterative.ui.components.laminar import com.raquo.laminar.api.L.{*, given} -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag case class Bin[Source, +Value]( diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala index 15169f3..480f5a9 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala @@ -3,12 +3,12 @@ import com.raquo.laminar.api.L import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag import org.scalajs.dom.html.UList import com.raquo.laminar.nodes.ReactiveHtmlElement import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind trait DashboardComponentsModule: def dashboard: DashboardComponents diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala index 98e31b9..5de4d67 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala @@ -2,7 +2,7 @@ import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given import com.raquo.laminar.nodes.ReactiveHtmlElement import org.scalajs.dom.html.Paragraph diff --git a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala index 7777c7a..3899808 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala @@ -2,18 +2,18 @@ package laminar import com.raquo.laminar.api.L.{*, given} +import works.iterative.ui.model.color.Color object LaminarExtensions: - given colorToCSS: Conversion[experimental.Color, Modifier[HtmlElement]] with - def apply(c: experimental.Color) = cls(c.toCSS) + given colorToCSS: Conversion[Color, Modifier[HtmlElement]] with + def apply(c: Color) = cls(c.toCSS) - given colorToSVGCSS: Conversion[experimental.Color, Modifier[SvgElement]] with - def apply(c: experimental.Color) = svg.cls(c.toCSS) + given colorToSVGCSS: Conversion[Color, Modifier[SvgElement]] with + def apply(c: Color) = svg.cls(c.toCSS) - given colorSignalToCSS - : Conversion[Signal[experimental.Color], Modifier[HtmlElement]] with - def apply(c: Signal[experimental.Color]) = cls <-- c.map(_.toCSS) + given colorSignalToCSS: Conversion[Signal[Color], Modifier[HtmlElement]] with + def apply(c: Signal[Color]) = cls <-- c.map(_.toCSS) - given colorSignalToSVGCSS - : Conversion[Signal[experimental.Color], Modifier[SvgElement]] with - def apply(c: Signal[experimental.Color]) = svg.cls <-- c.map(_.toCSS) + given colorSignalToSVGCSS: Conversion[Signal[Color], Modifier[SvgElement]] + with + def apply(c: Signal[Color]) = svg.cls <-- c.map(_.toCSS) diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala index d2e0b4d..9a54dea 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala @@ -1,7 +1,7 @@ package works.iterative.ui.components.laminar import com.raquo.laminar.api.L.{*, given} -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag case class Bin[Source, +Value]( diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala index 15169f3..480f5a9 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala @@ -3,12 +3,12 @@ import com.raquo.laminar.api.L import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag import org.scalajs.dom.html.UList import com.raquo.laminar.nodes.ReactiveHtmlElement import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind trait DashboardComponentsModule: def dashboard: DashboardComponents diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala index 98e31b9..5de4d67 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala @@ -2,7 +2,7 @@ import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given import com.raquo.laminar.nodes.ReactiveHtmlElement import org.scalajs.dom.html.Paragraph diff --git a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala index 7777c7a..3899808 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala @@ -2,18 +2,18 @@ package laminar import com.raquo.laminar.api.L.{*, given} +import works.iterative.ui.model.color.Color object LaminarExtensions: - given colorToCSS: Conversion[experimental.Color, Modifier[HtmlElement]] with - def apply(c: experimental.Color) = cls(c.toCSS) + given colorToCSS: Conversion[Color, Modifier[HtmlElement]] with + def apply(c: Color) = cls(c.toCSS) - given colorToSVGCSS: Conversion[experimental.Color, Modifier[SvgElement]] with - def apply(c: experimental.Color) = svg.cls(c.toCSS) + given colorToSVGCSS: Conversion[Color, Modifier[SvgElement]] with + def apply(c: Color) = svg.cls(c.toCSS) - given colorSignalToCSS - : Conversion[Signal[experimental.Color], Modifier[HtmlElement]] with - def apply(c: Signal[experimental.Color]) = cls <-- c.map(_.toCSS) + given colorSignalToCSS: Conversion[Signal[Color], Modifier[HtmlElement]] with + def apply(c: Signal[Color]) = cls <-- c.map(_.toCSS) - given colorSignalToSVGCSS - : Conversion[Signal[experimental.Color], Modifier[SvgElement]] with - def apply(c: Signal[experimental.Color]) = svg.cls <-- c.map(_.toCSS) + given colorSignalToSVGCSS: Conversion[Signal[Color], Modifier[SvgElement]] + with + def apply(c: Signal[Color]) = svg.cls <-- c.map(_.toCSS) diff --git a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala index 6e005af..99a212a 100644 --- a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala +++ b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala @@ -13,8 +13,8 @@ import works.iterative.core.MessageCatalogue import works.iterative.ui.components.tailwind.ComponentContext import works.iterative.ui.components.tailwind.StyleGuide -import works.iterative.ui.components.tailwind.experimental.Color -import works.iterative.ui.components.tailwind.experimental.ColorWeight +import works.iterative.ui.model.color.Color +import works.iterative.ui.model.color.ColorWeight object Scenario: type Id = String diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala index d2e0b4d..9a54dea 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala @@ -1,7 +1,7 @@ package works.iterative.ui.components.laminar import com.raquo.laminar.api.L.{*, given} -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag case class Bin[Source, +Value]( diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala index 15169f3..480f5a9 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala @@ -3,12 +3,12 @@ import com.raquo.laminar.api.L import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag import org.scalajs.dom.html.UList import com.raquo.laminar.nodes.ReactiveHtmlElement import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind trait DashboardComponentsModule: def dashboard: DashboardComponents diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala index 98e31b9..5de4d67 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala @@ -2,7 +2,7 @@ import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given import com.raquo.laminar.nodes.ReactiveHtmlElement import org.scalajs.dom.html.Paragraph diff --git a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala index 7777c7a..3899808 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala @@ -2,18 +2,18 @@ package laminar import com.raquo.laminar.api.L.{*, given} +import works.iterative.ui.model.color.Color object LaminarExtensions: - given colorToCSS: Conversion[experimental.Color, Modifier[HtmlElement]] with - def apply(c: experimental.Color) = cls(c.toCSS) + given colorToCSS: Conversion[Color, Modifier[HtmlElement]] with + def apply(c: Color) = cls(c.toCSS) - given colorToSVGCSS: Conversion[experimental.Color, Modifier[SvgElement]] with - def apply(c: experimental.Color) = svg.cls(c.toCSS) + given colorToSVGCSS: Conversion[Color, Modifier[SvgElement]] with + def apply(c: Color) = svg.cls(c.toCSS) - given colorSignalToCSS - : Conversion[Signal[experimental.Color], Modifier[HtmlElement]] with - def apply(c: Signal[experimental.Color]) = cls <-- c.map(_.toCSS) + given colorSignalToCSS: Conversion[Signal[Color], Modifier[HtmlElement]] with + def apply(c: Signal[Color]) = cls <-- c.map(_.toCSS) - given colorSignalToSVGCSS - : Conversion[Signal[experimental.Color], Modifier[SvgElement]] with - def apply(c: Signal[experimental.Color]) = svg.cls <-- c.map(_.toCSS) + given colorSignalToSVGCSS: Conversion[Signal[Color], Modifier[SvgElement]] + with + def apply(c: Signal[Color]) = svg.cls <-- c.map(_.toCSS) diff --git a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala index 6e005af..99a212a 100644 --- a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala +++ b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala @@ -13,8 +13,8 @@ import works.iterative.core.MessageCatalogue import works.iterative.ui.components.tailwind.ComponentContext import works.iterative.ui.components.tailwind.StyleGuide -import works.iterative.ui.components.tailwind.experimental.Color -import works.iterative.ui.components.tailwind.experimental.ColorWeight +import works.iterative.ui.model.color.Color +import works.iterative.ui.model.color.ColorWeight object Scenario: type Id = String diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala new file mode 100644 index 0000000..7352579 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala @@ -0,0 +1,10 @@ +package works.iterative.ui.model + +import works.iterative.ui.model.color.ColorKind + +/** Representation of colored string value. + * + * Used generally to represent tags or "labels", eg. some kind of status or + * categorization. + */ +final case class Tag(value: String, color: ColorKind = ColorKind.gray) diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala index d2e0b4d..9a54dea 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala @@ -1,7 +1,7 @@ package works.iterative.ui.components.laminar import com.raquo.laminar.api.L.{*, given} -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag case class Bin[Source, +Value]( diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala index 15169f3..480f5a9 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala @@ -3,12 +3,12 @@ import com.raquo.laminar.api.L import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag import org.scalajs.dom.html.UList import com.raquo.laminar.nodes.ReactiveHtmlElement import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind trait DashboardComponentsModule: def dashboard: DashboardComponents diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala index 98e31b9..5de4d67 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala @@ -2,7 +2,7 @@ import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given import com.raquo.laminar.nodes.ReactiveHtmlElement import org.scalajs.dom.html.Paragraph diff --git a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala index 7777c7a..3899808 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala @@ -2,18 +2,18 @@ package laminar import com.raquo.laminar.api.L.{*, given} +import works.iterative.ui.model.color.Color object LaminarExtensions: - given colorToCSS: Conversion[experimental.Color, Modifier[HtmlElement]] with - def apply(c: experimental.Color) = cls(c.toCSS) + given colorToCSS: Conversion[Color, Modifier[HtmlElement]] with + def apply(c: Color) = cls(c.toCSS) - given colorToSVGCSS: Conversion[experimental.Color, Modifier[SvgElement]] with - def apply(c: experimental.Color) = svg.cls(c.toCSS) + given colorToSVGCSS: Conversion[Color, Modifier[SvgElement]] with + def apply(c: Color) = svg.cls(c.toCSS) - given colorSignalToCSS - : Conversion[Signal[experimental.Color], Modifier[HtmlElement]] with - def apply(c: Signal[experimental.Color]) = cls <-- c.map(_.toCSS) + given colorSignalToCSS: Conversion[Signal[Color], Modifier[HtmlElement]] with + def apply(c: Signal[Color]) = cls <-- c.map(_.toCSS) - given colorSignalToSVGCSS - : Conversion[Signal[experimental.Color], Modifier[SvgElement]] with - def apply(c: Signal[experimental.Color]) = svg.cls <-- c.map(_.toCSS) + given colorSignalToSVGCSS: Conversion[Signal[Color], Modifier[SvgElement]] + with + def apply(c: Signal[Color]) = svg.cls <-- c.map(_.toCSS) diff --git a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala index 6e005af..99a212a 100644 --- a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala +++ b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala @@ -13,8 +13,8 @@ import works.iterative.core.MessageCatalogue import works.iterative.ui.components.tailwind.ComponentContext import works.iterative.ui.components.tailwind.StyleGuide -import works.iterative.ui.components.tailwind.experimental.Color -import works.iterative.ui.components.tailwind.experimental.ColorWeight +import works.iterative.ui.model.color.Color +import works.iterative.ui.model.color.ColorWeight object Scenario: type Id = String diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala new file mode 100644 index 0000000..7352579 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala @@ -0,0 +1,10 @@ +package works.iterative.ui.model + +import works.iterative.ui.model.color.ColorKind + +/** Representation of colored string value. + * + * Used generally to represent tags or "labels", eg. some kind of status or + * categorization. + */ +final case class Tag(value: String, color: ColorKind = ColorKind.gray) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala new file mode 100644 index 0000000..09d6e4d --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala @@ -0,0 +1,40 @@ +package works.iterative.ui.model.color + +/** Complete color definition that can be rendered to CSS. + * + * Includes the area, kind and weight of the color. + */ +case class Color(area: ColorArea, color: ColorDef): + def toCSS: String = s"${area.name}-${color.toCSS}" + +object Color: + import ColorDef.given + + def current = ColorDef(ColorKind.current) + def inherit = ColorDef(ColorKind.inherit) + def transp = ColorDef(ColorKind.transp) + def auto = ColorDef(ColorKind.auto) + def black = ColorDef(ColorKind.black) + def white = ColorDef(ColorKind.white) + def slate(weight: ColorWeight) = ColorDef(ColorKind.slate, weight) + def gray(weight: ColorWeight) = ColorDef(ColorKind.gray, weight) + def zinc(weight: ColorWeight) = ColorDef(ColorKind.zinc, weight) + def neutral(weight: ColorWeight) = ColorDef(ColorKind.neutral, weight) + def stone(weight: ColorWeight) = ColorDef(ColorKind.stone, weight) + def red(weight: ColorWeight) = ColorDef(ColorKind.red, weight) + def orange(weight: ColorWeight) = ColorDef(ColorKind.orange, weight) + def amber(weight: ColorWeight) = ColorDef(ColorKind.amber, weight) + def yellow(weight: ColorWeight) = ColorDef(ColorKind.yellow, weight) + def lime(weight: ColorWeight) = ColorDef(ColorKind.lime, weight) + def green(weight: ColorWeight) = ColorDef(ColorKind.green, weight) + def emerald(weight: ColorWeight) = ColorDef(ColorKind.emerald, weight) + def teal(weight: ColorWeight) = ColorDef(ColorKind.teal, weight) + def cyan(weight: ColorWeight) = ColorDef(ColorKind.cyan, weight) + def sky(weight: ColorWeight) = ColorDef(ColorKind.sky, weight) + def blue(weight: ColorWeight) = ColorDef(ColorKind.blue, weight) + def indigo(weight: ColorWeight) = ColorDef(ColorKind.indigo, weight) + def violet(weight: ColorWeight) = ColorDef(ColorKind.violet, weight) + def purple(weight: ColorWeight) = ColorDef(ColorKind.purple, weight) + def fuchsia(weight: ColorWeight) = ColorDef(ColorKind.fuchsia, weight) + def pink(weight: ColorWeight) = ColorDef(ColorKind.pink, weight) + def rose(weight: ColorWeight) = ColorDef(ColorKind.rose, weight) diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala index d2e0b4d..9a54dea 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala @@ -1,7 +1,7 @@ package works.iterative.ui.components.laminar import com.raquo.laminar.api.L.{*, given} -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag case class Bin[Source, +Value]( diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala index 15169f3..480f5a9 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala @@ -3,12 +3,12 @@ import com.raquo.laminar.api.L import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag import org.scalajs.dom.html.UList import com.raquo.laminar.nodes.ReactiveHtmlElement import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind trait DashboardComponentsModule: def dashboard: DashboardComponents diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala index 98e31b9..5de4d67 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala @@ -2,7 +2,7 @@ import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given import com.raquo.laminar.nodes.ReactiveHtmlElement import org.scalajs.dom.html.Paragraph diff --git a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala index 7777c7a..3899808 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala @@ -2,18 +2,18 @@ package laminar import com.raquo.laminar.api.L.{*, given} +import works.iterative.ui.model.color.Color object LaminarExtensions: - given colorToCSS: Conversion[experimental.Color, Modifier[HtmlElement]] with - def apply(c: experimental.Color) = cls(c.toCSS) + given colorToCSS: Conversion[Color, Modifier[HtmlElement]] with + def apply(c: Color) = cls(c.toCSS) - given colorToSVGCSS: Conversion[experimental.Color, Modifier[SvgElement]] with - def apply(c: experimental.Color) = svg.cls(c.toCSS) + given colorToSVGCSS: Conversion[Color, Modifier[SvgElement]] with + def apply(c: Color) = svg.cls(c.toCSS) - given colorSignalToCSS - : Conversion[Signal[experimental.Color], Modifier[HtmlElement]] with - def apply(c: Signal[experimental.Color]) = cls <-- c.map(_.toCSS) + given colorSignalToCSS: Conversion[Signal[Color], Modifier[HtmlElement]] with + def apply(c: Signal[Color]) = cls <-- c.map(_.toCSS) - given colorSignalToSVGCSS - : Conversion[Signal[experimental.Color], Modifier[SvgElement]] with - def apply(c: Signal[experimental.Color]) = svg.cls <-- c.map(_.toCSS) + given colorSignalToSVGCSS: Conversion[Signal[Color], Modifier[SvgElement]] + with + def apply(c: Signal[Color]) = svg.cls <-- c.map(_.toCSS) diff --git a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala index 6e005af..99a212a 100644 --- a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala +++ b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala @@ -13,8 +13,8 @@ import works.iterative.core.MessageCatalogue import works.iterative.ui.components.tailwind.ComponentContext import works.iterative.ui.components.tailwind.StyleGuide -import works.iterative.ui.components.tailwind.experimental.Color -import works.iterative.ui.components.tailwind.experimental.ColorWeight +import works.iterative.ui.model.color.Color +import works.iterative.ui.model.color.ColorWeight object Scenario: type Id = String diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala new file mode 100644 index 0000000..7352579 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala @@ -0,0 +1,10 @@ +package works.iterative.ui.model + +import works.iterative.ui.model.color.ColorKind + +/** Representation of colored string value. + * + * Used generally to represent tags or "labels", eg. some kind of status or + * categorization. + */ +final case class Tag(value: String, color: ColorKind = ColorKind.gray) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala new file mode 100644 index 0000000..09d6e4d --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala @@ -0,0 +1,40 @@ +package works.iterative.ui.model.color + +/** Complete color definition that can be rendered to CSS. + * + * Includes the area, kind and weight of the color. + */ +case class Color(area: ColorArea, color: ColorDef): + def toCSS: String = s"${area.name}-${color.toCSS}" + +object Color: + import ColorDef.given + + def current = ColorDef(ColorKind.current) + def inherit = ColorDef(ColorKind.inherit) + def transp = ColorDef(ColorKind.transp) + def auto = ColorDef(ColorKind.auto) + def black = ColorDef(ColorKind.black) + def white = ColorDef(ColorKind.white) + def slate(weight: ColorWeight) = ColorDef(ColorKind.slate, weight) + def gray(weight: ColorWeight) = ColorDef(ColorKind.gray, weight) + def zinc(weight: ColorWeight) = ColorDef(ColorKind.zinc, weight) + def neutral(weight: ColorWeight) = ColorDef(ColorKind.neutral, weight) + def stone(weight: ColorWeight) = ColorDef(ColorKind.stone, weight) + def red(weight: ColorWeight) = ColorDef(ColorKind.red, weight) + def orange(weight: ColorWeight) = ColorDef(ColorKind.orange, weight) + def amber(weight: ColorWeight) = ColorDef(ColorKind.amber, weight) + def yellow(weight: ColorWeight) = ColorDef(ColorKind.yellow, weight) + def lime(weight: ColorWeight) = ColorDef(ColorKind.lime, weight) + def green(weight: ColorWeight) = ColorDef(ColorKind.green, weight) + def emerald(weight: ColorWeight) = ColorDef(ColorKind.emerald, weight) + def teal(weight: ColorWeight) = ColorDef(ColorKind.teal, weight) + def cyan(weight: ColorWeight) = ColorDef(ColorKind.cyan, weight) + def sky(weight: ColorWeight) = ColorDef(ColorKind.sky, weight) + def blue(weight: ColorWeight) = ColorDef(ColorKind.blue, weight) + def indigo(weight: ColorWeight) = ColorDef(ColorKind.indigo, weight) + def violet(weight: ColorWeight) = ColorDef(ColorKind.violet, weight) + def purple(weight: ColorWeight) = ColorDef(ColorKind.purple, weight) + def fuchsia(weight: ColorWeight) = ColorDef(ColorKind.fuchsia, weight) + def pink(weight: ColorWeight) = ColorDef(ColorKind.pink, weight) + def rose(weight: ColorWeight) = ColorDef(ColorKind.rose, weight) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala new file mode 100644 index 0000000..1211287 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala @@ -0,0 +1,16 @@ +package works.iterative.ui.model.color + +/** Defines the area the color should apply to, eg. background, text, border, + * etc. + */ +enum ColorArea(val name: String): + case bg extends ColorArea("bg") + case text extends ColorArea("text") + case decoration extends ColorArea("decoration") + case border extends ColorArea("border") + case outline extends ColorArea("outline") + case divide extends ColorArea("divide") + case ring extends ColorArea("ring") + case ringOffset extends ColorArea("ring-offset") + case shadow extends ColorArea("shadow") + case accent extends ColorArea("accent") diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala index d2e0b4d..9a54dea 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala @@ -1,7 +1,7 @@ package works.iterative.ui.components.laminar import com.raquo.laminar.api.L.{*, given} -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag case class Bin[Source, +Value]( diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala index 15169f3..480f5a9 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala @@ -3,12 +3,12 @@ import com.raquo.laminar.api.L import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag import org.scalajs.dom.html.UList import com.raquo.laminar.nodes.ReactiveHtmlElement import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind trait DashboardComponentsModule: def dashboard: DashboardComponents diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala index 98e31b9..5de4d67 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala @@ -2,7 +2,7 @@ import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given import com.raquo.laminar.nodes.ReactiveHtmlElement import org.scalajs.dom.html.Paragraph diff --git a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala index 7777c7a..3899808 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala @@ -2,18 +2,18 @@ package laminar import com.raquo.laminar.api.L.{*, given} +import works.iterative.ui.model.color.Color object LaminarExtensions: - given colorToCSS: Conversion[experimental.Color, Modifier[HtmlElement]] with - def apply(c: experimental.Color) = cls(c.toCSS) + given colorToCSS: Conversion[Color, Modifier[HtmlElement]] with + def apply(c: Color) = cls(c.toCSS) - given colorToSVGCSS: Conversion[experimental.Color, Modifier[SvgElement]] with - def apply(c: experimental.Color) = svg.cls(c.toCSS) + given colorToSVGCSS: Conversion[Color, Modifier[SvgElement]] with + def apply(c: Color) = svg.cls(c.toCSS) - given colorSignalToCSS - : Conversion[Signal[experimental.Color], Modifier[HtmlElement]] with - def apply(c: Signal[experimental.Color]) = cls <-- c.map(_.toCSS) + given colorSignalToCSS: Conversion[Signal[Color], Modifier[HtmlElement]] with + def apply(c: Signal[Color]) = cls <-- c.map(_.toCSS) - given colorSignalToSVGCSS - : Conversion[Signal[experimental.Color], Modifier[SvgElement]] with - def apply(c: Signal[experimental.Color]) = svg.cls <-- c.map(_.toCSS) + given colorSignalToSVGCSS: Conversion[Signal[Color], Modifier[SvgElement]] + with + def apply(c: Signal[Color]) = svg.cls <-- c.map(_.toCSS) diff --git a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala index 6e005af..99a212a 100644 --- a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala +++ b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala @@ -13,8 +13,8 @@ import works.iterative.core.MessageCatalogue import works.iterative.ui.components.tailwind.ComponentContext import works.iterative.ui.components.tailwind.StyleGuide -import works.iterative.ui.components.tailwind.experimental.Color -import works.iterative.ui.components.tailwind.experimental.ColorWeight +import works.iterative.ui.model.color.Color +import works.iterative.ui.model.color.ColorWeight object Scenario: type Id = String diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala new file mode 100644 index 0000000..7352579 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala @@ -0,0 +1,10 @@ +package works.iterative.ui.model + +import works.iterative.ui.model.color.ColorKind + +/** Representation of colored string value. + * + * Used generally to represent tags or "labels", eg. some kind of status or + * categorization. + */ +final case class Tag(value: String, color: ColorKind = ColorKind.gray) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala new file mode 100644 index 0000000..09d6e4d --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala @@ -0,0 +1,40 @@ +package works.iterative.ui.model.color + +/** Complete color definition that can be rendered to CSS. + * + * Includes the area, kind and weight of the color. + */ +case class Color(area: ColorArea, color: ColorDef): + def toCSS: String = s"${area.name}-${color.toCSS}" + +object Color: + import ColorDef.given + + def current = ColorDef(ColorKind.current) + def inherit = ColorDef(ColorKind.inherit) + def transp = ColorDef(ColorKind.transp) + def auto = ColorDef(ColorKind.auto) + def black = ColorDef(ColorKind.black) + def white = ColorDef(ColorKind.white) + def slate(weight: ColorWeight) = ColorDef(ColorKind.slate, weight) + def gray(weight: ColorWeight) = ColorDef(ColorKind.gray, weight) + def zinc(weight: ColorWeight) = ColorDef(ColorKind.zinc, weight) + def neutral(weight: ColorWeight) = ColorDef(ColorKind.neutral, weight) + def stone(weight: ColorWeight) = ColorDef(ColorKind.stone, weight) + def red(weight: ColorWeight) = ColorDef(ColorKind.red, weight) + def orange(weight: ColorWeight) = ColorDef(ColorKind.orange, weight) + def amber(weight: ColorWeight) = ColorDef(ColorKind.amber, weight) + def yellow(weight: ColorWeight) = ColorDef(ColorKind.yellow, weight) + def lime(weight: ColorWeight) = ColorDef(ColorKind.lime, weight) + def green(weight: ColorWeight) = ColorDef(ColorKind.green, weight) + def emerald(weight: ColorWeight) = ColorDef(ColorKind.emerald, weight) + def teal(weight: ColorWeight) = ColorDef(ColorKind.teal, weight) + def cyan(weight: ColorWeight) = ColorDef(ColorKind.cyan, weight) + def sky(weight: ColorWeight) = ColorDef(ColorKind.sky, weight) + def blue(weight: ColorWeight) = ColorDef(ColorKind.blue, weight) + def indigo(weight: ColorWeight) = ColorDef(ColorKind.indigo, weight) + def violet(weight: ColorWeight) = ColorDef(ColorKind.violet, weight) + def purple(weight: ColorWeight) = ColorDef(ColorKind.purple, weight) + def fuchsia(weight: ColorWeight) = ColorDef(ColorKind.fuchsia, weight) + def pink(weight: ColorWeight) = ColorDef(ColorKind.pink, weight) + def rose(weight: ColorWeight) = ColorDef(ColorKind.rose, weight) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala new file mode 100644 index 0000000..1211287 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala @@ -0,0 +1,16 @@ +package works.iterative.ui.model.color + +/** Defines the area the color should apply to, eg. background, text, border, + * etc. + */ +enum ColorArea(val name: String): + case bg extends ColorArea("bg") + case text extends ColorArea("text") + case decoration extends ColorArea("decoration") + case border extends ColorArea("border") + case outline extends ColorArea("outline") + case divide extends ColorArea("divide") + case ring extends ColorArea("ring") + case ringOffset extends ColorArea("ring-offset") + case shadow extends ColorArea("shadow") + case accent extends ColorArea("accent") diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorDef.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorDef.scala new file mode 100644 index 0000000..9c5ec61 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorDef.scala @@ -0,0 +1,43 @@ +package works.iterative.ui.model.color + +/** A combination of ColorKind and ColorWeight, if applicable. + * + * By applying area we get the full Color definition. + */ +sealed trait ColorDef: + def toCSS: String + + def bg = Color(ColorArea.bg, this) + def text = Color(ColorArea.text, this) + def decoration = Color(ColorArea.decoration, this) + def border = Color(ColorArea.border, this) + def outline = Color(ColorArea.outline, this) + def divide = Color(ColorArea.divide, this) + def ring = Color(ColorArea.ring, this) + def ringOffset = Color(ColorArea.ringOffset, this) + def shadow = Color(ColorArea.shadow, this) + def accent = Color(ColorArea.accent, this) + +// TODO: create a macro that will output the tailwind class as string directly during compilation, where possible. +object ColorDef: + case class WeightedColorDef( + kind: ColorKind, + weight: ColorWeight + ) extends ColorDef: + override def toCSS: String = s"${kind.name}-${weight.value}" + + case class UnweightedColorDef( + kind: ColorKind + ) extends ColorDef: + override def toCSS: String = kind.name + + // TODO: check that the kind is valid unweighted kind + // that means current, inherit, auto, transparent, black, white + // tried using implicit evidence, but the type inference for enumerations + // tends to generalize to the enum, instead of the real type + def apply[T <: ColorKind](kind: T)(using + ev: T <:< ColorKind.Unweighted + ): ColorDef = + UnweightedColorDef(kind) + def apply(kind: ColorKind, weight: ColorWeight): ColorDef = + WeightedColorDef(kind, weight) diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala index d2e0b4d..9a54dea 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala @@ -1,7 +1,7 @@ package works.iterative.ui.components.laminar import com.raquo.laminar.api.L.{*, given} -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag case class Bin[Source, +Value]( diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala index 15169f3..480f5a9 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala @@ -3,12 +3,12 @@ import com.raquo.laminar.api.L import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag import org.scalajs.dom.html.UList import com.raquo.laminar.nodes.ReactiveHtmlElement import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind trait DashboardComponentsModule: def dashboard: DashboardComponents diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala index 98e31b9..5de4d67 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala @@ -2,7 +2,7 @@ import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given import com.raquo.laminar.nodes.ReactiveHtmlElement import org.scalajs.dom.html.Paragraph diff --git a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala index 7777c7a..3899808 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala @@ -2,18 +2,18 @@ package laminar import com.raquo.laminar.api.L.{*, given} +import works.iterative.ui.model.color.Color object LaminarExtensions: - given colorToCSS: Conversion[experimental.Color, Modifier[HtmlElement]] with - def apply(c: experimental.Color) = cls(c.toCSS) + given colorToCSS: Conversion[Color, Modifier[HtmlElement]] with + def apply(c: Color) = cls(c.toCSS) - given colorToSVGCSS: Conversion[experimental.Color, Modifier[SvgElement]] with - def apply(c: experimental.Color) = svg.cls(c.toCSS) + given colorToSVGCSS: Conversion[Color, Modifier[SvgElement]] with + def apply(c: Color) = svg.cls(c.toCSS) - given colorSignalToCSS - : Conversion[Signal[experimental.Color], Modifier[HtmlElement]] with - def apply(c: Signal[experimental.Color]) = cls <-- c.map(_.toCSS) + given colorSignalToCSS: Conversion[Signal[Color], Modifier[HtmlElement]] with + def apply(c: Signal[Color]) = cls <-- c.map(_.toCSS) - given colorSignalToSVGCSS - : Conversion[Signal[experimental.Color], Modifier[SvgElement]] with - def apply(c: Signal[experimental.Color]) = svg.cls <-- c.map(_.toCSS) + given colorSignalToSVGCSS: Conversion[Signal[Color], Modifier[SvgElement]] + with + def apply(c: Signal[Color]) = svg.cls <-- c.map(_.toCSS) diff --git a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala index 6e005af..99a212a 100644 --- a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala +++ b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala @@ -13,8 +13,8 @@ import works.iterative.core.MessageCatalogue import works.iterative.ui.components.tailwind.ComponentContext import works.iterative.ui.components.tailwind.StyleGuide -import works.iterative.ui.components.tailwind.experimental.Color -import works.iterative.ui.components.tailwind.experimental.ColorWeight +import works.iterative.ui.model.color.Color +import works.iterative.ui.model.color.ColorWeight object Scenario: type Id = String diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala new file mode 100644 index 0000000..7352579 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala @@ -0,0 +1,10 @@ +package works.iterative.ui.model + +import works.iterative.ui.model.color.ColorKind + +/** Representation of colored string value. + * + * Used generally to represent tags or "labels", eg. some kind of status or + * categorization. + */ +final case class Tag(value: String, color: ColorKind = ColorKind.gray) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala new file mode 100644 index 0000000..09d6e4d --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala @@ -0,0 +1,40 @@ +package works.iterative.ui.model.color + +/** Complete color definition that can be rendered to CSS. + * + * Includes the area, kind and weight of the color. + */ +case class Color(area: ColorArea, color: ColorDef): + def toCSS: String = s"${area.name}-${color.toCSS}" + +object Color: + import ColorDef.given + + def current = ColorDef(ColorKind.current) + def inherit = ColorDef(ColorKind.inherit) + def transp = ColorDef(ColorKind.transp) + def auto = ColorDef(ColorKind.auto) + def black = ColorDef(ColorKind.black) + def white = ColorDef(ColorKind.white) + def slate(weight: ColorWeight) = ColorDef(ColorKind.slate, weight) + def gray(weight: ColorWeight) = ColorDef(ColorKind.gray, weight) + def zinc(weight: ColorWeight) = ColorDef(ColorKind.zinc, weight) + def neutral(weight: ColorWeight) = ColorDef(ColorKind.neutral, weight) + def stone(weight: ColorWeight) = ColorDef(ColorKind.stone, weight) + def red(weight: ColorWeight) = ColorDef(ColorKind.red, weight) + def orange(weight: ColorWeight) = ColorDef(ColorKind.orange, weight) + def amber(weight: ColorWeight) = ColorDef(ColorKind.amber, weight) + def yellow(weight: ColorWeight) = ColorDef(ColorKind.yellow, weight) + def lime(weight: ColorWeight) = ColorDef(ColorKind.lime, weight) + def green(weight: ColorWeight) = ColorDef(ColorKind.green, weight) + def emerald(weight: ColorWeight) = ColorDef(ColorKind.emerald, weight) + def teal(weight: ColorWeight) = ColorDef(ColorKind.teal, weight) + def cyan(weight: ColorWeight) = ColorDef(ColorKind.cyan, weight) + def sky(weight: ColorWeight) = ColorDef(ColorKind.sky, weight) + def blue(weight: ColorWeight) = ColorDef(ColorKind.blue, weight) + def indigo(weight: ColorWeight) = ColorDef(ColorKind.indigo, weight) + def violet(weight: ColorWeight) = ColorDef(ColorKind.violet, weight) + def purple(weight: ColorWeight) = ColorDef(ColorKind.purple, weight) + def fuchsia(weight: ColorWeight) = ColorDef(ColorKind.fuchsia, weight) + def pink(weight: ColorWeight) = ColorDef(ColorKind.pink, weight) + def rose(weight: ColorWeight) = ColorDef(ColorKind.rose, weight) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala new file mode 100644 index 0000000..1211287 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala @@ -0,0 +1,16 @@ +package works.iterative.ui.model.color + +/** Defines the area the color should apply to, eg. background, text, border, + * etc. + */ +enum ColorArea(val name: String): + case bg extends ColorArea("bg") + case text extends ColorArea("text") + case decoration extends ColorArea("decoration") + case border extends ColorArea("border") + case outline extends ColorArea("outline") + case divide extends ColorArea("divide") + case ring extends ColorArea("ring") + case ringOffset extends ColorArea("ring-offset") + case shadow extends ColorArea("shadow") + case accent extends ColorArea("accent") diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorDef.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorDef.scala new file mode 100644 index 0000000..9c5ec61 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorDef.scala @@ -0,0 +1,43 @@ +package works.iterative.ui.model.color + +/** A combination of ColorKind and ColorWeight, if applicable. + * + * By applying area we get the full Color definition. + */ +sealed trait ColorDef: + def toCSS: String + + def bg = Color(ColorArea.bg, this) + def text = Color(ColorArea.text, this) + def decoration = Color(ColorArea.decoration, this) + def border = Color(ColorArea.border, this) + def outline = Color(ColorArea.outline, this) + def divide = Color(ColorArea.divide, this) + def ring = Color(ColorArea.ring, this) + def ringOffset = Color(ColorArea.ringOffset, this) + def shadow = Color(ColorArea.shadow, this) + def accent = Color(ColorArea.accent, this) + +// TODO: create a macro that will output the tailwind class as string directly during compilation, where possible. +object ColorDef: + case class WeightedColorDef( + kind: ColorKind, + weight: ColorWeight + ) extends ColorDef: + override def toCSS: String = s"${kind.name}-${weight.value}" + + case class UnweightedColorDef( + kind: ColorKind + ) extends ColorDef: + override def toCSS: String = kind.name + + // TODO: check that the kind is valid unweighted kind + // that means current, inherit, auto, transparent, black, white + // tried using implicit evidence, but the type inference for enumerations + // tends to generalize to the enum, instead of the real type + def apply[T <: ColorKind](kind: T)(using + ev: T <:< ColorKind.Unweighted + ): ColorDef = + UnweightedColorDef(kind) + def apply(kind: ColorKind, weight: ColorWeight): ColorDef = + WeightedColorDef(kind, weight) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorKind.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorKind.scala new file mode 100644 index 0000000..ea24372 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorKind.scala @@ -0,0 +1,47 @@ +package works.iterative.ui.model.color + +/** Defines what color should be used, without specifying the area or weight. + */ +sealed abstract class ColorKind private (val name: String): + def apply(weight: ColorWeight): ColorDef = + ColorDef.WeightedColorDef(this, weight) + +object ColorKind: + trait Unweighted: + self: ColorKind => + override def apply(weight: ColorWeight): ColorDef = + ColorDef.UnweightedColorDef(self) + + // TODO: change the "stupid" methods to extension methods + // that will keep the invariants in comments lower + case object current extends ColorKind("current") with Unweighted + case object inherit extends ColorKind("inherit") with Unweighted + // Not present in for all methods + case object transp extends ColorKind("transparent") with Unweighted + // Seen in accent, not preset otherwise + case object auto extends ColorKind("auto") with Unweighted + // Black and white do not have weight + case object black extends ColorKind("black") with Unweighted + case object white extends ColorKind("white") with Unweighted + case object slate extends ColorKind("slate") + case object gray extends ColorKind("gray") + case object zinc extends ColorKind("zinc") + case object neutral extends ColorKind("neutral") + case object stone extends ColorKind("stone") + case object red extends ColorKind("red") + case object orange extends ColorKind("orange") + case object amber extends ColorKind("amber") + case object yellow extends ColorKind("yellow") + case object lime extends ColorKind("lime") + case object green extends ColorKind("green") + case object emerald extends ColorKind("emerald") + case object teal extends ColorKind("teal") + case object cyan extends ColorKind("cyan") + case object sky extends ColorKind("sky") + case object blue extends ColorKind("blue") + case object indigo extends ColorKind("indigo") + case object violet extends ColorKind("violet") + case object purple extends ColorKind("purple") + case object fuchsia extends ColorKind("fuchsia") + case object pink extends ColorKind("pink") + case object rose extends ColorKind("rose") diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala index d2e0b4d..9a54dea 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala @@ -1,7 +1,7 @@ package works.iterative.ui.components.laminar import com.raquo.laminar.api.L.{*, given} -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag case class Bin[Source, +Value]( diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala index 15169f3..480f5a9 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala @@ -3,12 +3,12 @@ import com.raquo.laminar.api.L import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag import org.scalajs.dom.html.UList import com.raquo.laminar.nodes.ReactiveHtmlElement import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind trait DashboardComponentsModule: def dashboard: DashboardComponents diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala index 98e31b9..5de4d67 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala @@ -2,7 +2,7 @@ import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given import com.raquo.laminar.nodes.ReactiveHtmlElement import org.scalajs.dom.html.Paragraph diff --git a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala index 7777c7a..3899808 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala @@ -2,18 +2,18 @@ package laminar import com.raquo.laminar.api.L.{*, given} +import works.iterative.ui.model.color.Color object LaminarExtensions: - given colorToCSS: Conversion[experimental.Color, Modifier[HtmlElement]] with - def apply(c: experimental.Color) = cls(c.toCSS) + given colorToCSS: Conversion[Color, Modifier[HtmlElement]] with + def apply(c: Color) = cls(c.toCSS) - given colorToSVGCSS: Conversion[experimental.Color, Modifier[SvgElement]] with - def apply(c: experimental.Color) = svg.cls(c.toCSS) + given colorToSVGCSS: Conversion[Color, Modifier[SvgElement]] with + def apply(c: Color) = svg.cls(c.toCSS) - given colorSignalToCSS - : Conversion[Signal[experimental.Color], Modifier[HtmlElement]] with - def apply(c: Signal[experimental.Color]) = cls <-- c.map(_.toCSS) + given colorSignalToCSS: Conversion[Signal[Color], Modifier[HtmlElement]] with + def apply(c: Signal[Color]) = cls <-- c.map(_.toCSS) - given colorSignalToSVGCSS - : Conversion[Signal[experimental.Color], Modifier[SvgElement]] with - def apply(c: Signal[experimental.Color]) = svg.cls <-- c.map(_.toCSS) + given colorSignalToSVGCSS: Conversion[Signal[Color], Modifier[SvgElement]] + with + def apply(c: Signal[Color]) = svg.cls <-- c.map(_.toCSS) diff --git a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala index 6e005af..99a212a 100644 --- a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala +++ b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala @@ -13,8 +13,8 @@ import works.iterative.core.MessageCatalogue import works.iterative.ui.components.tailwind.ComponentContext import works.iterative.ui.components.tailwind.StyleGuide -import works.iterative.ui.components.tailwind.experimental.Color -import works.iterative.ui.components.tailwind.experimental.ColorWeight +import works.iterative.ui.model.color.Color +import works.iterative.ui.model.color.ColorWeight object Scenario: type Id = String diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala new file mode 100644 index 0000000..7352579 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala @@ -0,0 +1,10 @@ +package works.iterative.ui.model + +import works.iterative.ui.model.color.ColorKind + +/** Representation of colored string value. + * + * Used generally to represent tags or "labels", eg. some kind of status or + * categorization. + */ +final case class Tag(value: String, color: ColorKind = ColorKind.gray) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala new file mode 100644 index 0000000..09d6e4d --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala @@ -0,0 +1,40 @@ +package works.iterative.ui.model.color + +/** Complete color definition that can be rendered to CSS. + * + * Includes the area, kind and weight of the color. + */ +case class Color(area: ColorArea, color: ColorDef): + def toCSS: String = s"${area.name}-${color.toCSS}" + +object Color: + import ColorDef.given + + def current = ColorDef(ColorKind.current) + def inherit = ColorDef(ColorKind.inherit) + def transp = ColorDef(ColorKind.transp) + def auto = ColorDef(ColorKind.auto) + def black = ColorDef(ColorKind.black) + def white = ColorDef(ColorKind.white) + def slate(weight: ColorWeight) = ColorDef(ColorKind.slate, weight) + def gray(weight: ColorWeight) = ColorDef(ColorKind.gray, weight) + def zinc(weight: ColorWeight) = ColorDef(ColorKind.zinc, weight) + def neutral(weight: ColorWeight) = ColorDef(ColorKind.neutral, weight) + def stone(weight: ColorWeight) = ColorDef(ColorKind.stone, weight) + def red(weight: ColorWeight) = ColorDef(ColorKind.red, weight) + def orange(weight: ColorWeight) = ColorDef(ColorKind.orange, weight) + def amber(weight: ColorWeight) = ColorDef(ColorKind.amber, weight) + def yellow(weight: ColorWeight) = ColorDef(ColorKind.yellow, weight) + def lime(weight: ColorWeight) = ColorDef(ColorKind.lime, weight) + def green(weight: ColorWeight) = ColorDef(ColorKind.green, weight) + def emerald(weight: ColorWeight) = ColorDef(ColorKind.emerald, weight) + def teal(weight: ColorWeight) = ColorDef(ColorKind.teal, weight) + def cyan(weight: ColorWeight) = ColorDef(ColorKind.cyan, weight) + def sky(weight: ColorWeight) = ColorDef(ColorKind.sky, weight) + def blue(weight: ColorWeight) = ColorDef(ColorKind.blue, weight) + def indigo(weight: ColorWeight) = ColorDef(ColorKind.indigo, weight) + def violet(weight: ColorWeight) = ColorDef(ColorKind.violet, weight) + def purple(weight: ColorWeight) = ColorDef(ColorKind.purple, weight) + def fuchsia(weight: ColorWeight) = ColorDef(ColorKind.fuchsia, weight) + def pink(weight: ColorWeight) = ColorDef(ColorKind.pink, weight) + def rose(weight: ColorWeight) = ColorDef(ColorKind.rose, weight) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala new file mode 100644 index 0000000..1211287 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala @@ -0,0 +1,16 @@ +package works.iterative.ui.model.color + +/** Defines the area the color should apply to, eg. background, text, border, + * etc. + */ +enum ColorArea(val name: String): + case bg extends ColorArea("bg") + case text extends ColorArea("text") + case decoration extends ColorArea("decoration") + case border extends ColorArea("border") + case outline extends ColorArea("outline") + case divide extends ColorArea("divide") + case ring extends ColorArea("ring") + case ringOffset extends ColorArea("ring-offset") + case shadow extends ColorArea("shadow") + case accent extends ColorArea("accent") diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorDef.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorDef.scala new file mode 100644 index 0000000..9c5ec61 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorDef.scala @@ -0,0 +1,43 @@ +package works.iterative.ui.model.color + +/** A combination of ColorKind and ColorWeight, if applicable. + * + * By applying area we get the full Color definition. + */ +sealed trait ColorDef: + def toCSS: String + + def bg = Color(ColorArea.bg, this) + def text = Color(ColorArea.text, this) + def decoration = Color(ColorArea.decoration, this) + def border = Color(ColorArea.border, this) + def outline = Color(ColorArea.outline, this) + def divide = Color(ColorArea.divide, this) + def ring = Color(ColorArea.ring, this) + def ringOffset = Color(ColorArea.ringOffset, this) + def shadow = Color(ColorArea.shadow, this) + def accent = Color(ColorArea.accent, this) + +// TODO: create a macro that will output the tailwind class as string directly during compilation, where possible. +object ColorDef: + case class WeightedColorDef( + kind: ColorKind, + weight: ColorWeight + ) extends ColorDef: + override def toCSS: String = s"${kind.name}-${weight.value}" + + case class UnweightedColorDef( + kind: ColorKind + ) extends ColorDef: + override def toCSS: String = kind.name + + // TODO: check that the kind is valid unweighted kind + // that means current, inherit, auto, transparent, black, white + // tried using implicit evidence, but the type inference for enumerations + // tends to generalize to the enum, instead of the real type + def apply[T <: ColorKind](kind: T)(using + ev: T <:< ColorKind.Unweighted + ): ColorDef = + UnweightedColorDef(kind) + def apply(kind: ColorKind, weight: ColorWeight): ColorDef = + WeightedColorDef(kind, weight) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorKind.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorKind.scala new file mode 100644 index 0000000..ea24372 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorKind.scala @@ -0,0 +1,47 @@ +package works.iterative.ui.model.color + +/** Defines what color should be used, without specifying the area or weight. + */ +sealed abstract class ColorKind private (val name: String): + def apply(weight: ColorWeight): ColorDef = + ColorDef.WeightedColorDef(this, weight) + +object ColorKind: + trait Unweighted: + self: ColorKind => + override def apply(weight: ColorWeight): ColorDef = + ColorDef.UnweightedColorDef(self) + + // TODO: change the "stupid" methods to extension methods + // that will keep the invariants in comments lower + case object current extends ColorKind("current") with Unweighted + case object inherit extends ColorKind("inherit") with Unweighted + // Not present in for all methods + case object transp extends ColorKind("transparent") with Unweighted + // Seen in accent, not preset otherwise + case object auto extends ColorKind("auto") with Unweighted + // Black and white do not have weight + case object black extends ColorKind("black") with Unweighted + case object white extends ColorKind("white") with Unweighted + case object slate extends ColorKind("slate") + case object gray extends ColorKind("gray") + case object zinc extends ColorKind("zinc") + case object neutral extends ColorKind("neutral") + case object stone extends ColorKind("stone") + case object red extends ColorKind("red") + case object orange extends ColorKind("orange") + case object amber extends ColorKind("amber") + case object yellow extends ColorKind("yellow") + case object lime extends ColorKind("lime") + case object green extends ColorKind("green") + case object emerald extends ColorKind("emerald") + case object teal extends ColorKind("teal") + case object cyan extends ColorKind("cyan") + case object sky extends ColorKind("sky") + case object blue extends ColorKind("blue") + case object indigo extends ColorKind("indigo") + case object violet extends ColorKind("violet") + case object purple extends ColorKind("purple") + case object fuchsia extends ColorKind("fuchsia") + case object pink extends ColorKind("pink") + case object rose extends ColorKind("rose") diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorWeight.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorWeight.scala new file mode 100644 index 0000000..7767ac5 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorWeight.scala @@ -0,0 +1,33 @@ +package works.iterative.ui.model.color + +opaque type ColorWeight = String + +extension (c: ColorWeight) def value: String = c + +/** Defines weight of a color, eg. 50, 100, 200, etc. + * + * Tailwind-like. + */ +object ColorWeight: + inline given int50: Conversion[50, ColorWeight] with + inline def apply(i: 50) = "50" + inline given int100: Conversion[100, ColorWeight] with + inline def apply(i: 100) = "100" + inline given int200: Conversion[200, ColorWeight] with + inline def apply(i: 200) = "200" + inline given int300: Conversion[300, ColorWeight] with + inline def apply(i: 300) = "300" + inline given int400: Conversion[400, ColorWeight] with + inline def apply(i: 400) = "400" + inline given int500: Conversion[500, ColorWeight] with + inline def apply(i: 500) = "500" + inline given int600: Conversion[600, ColorWeight] with + inline def apply(i: 600) = "600" + inline given int700: Conversion[700, ColorWeight] with + inline def apply(i: 700) = "700" + inline given int800: Conversion[800, ColorWeight] with + inline def apply(i: 800) = "800" + inline given int900: Conversion[900, ColorWeight] with + inline def apply(i: 900) = "900" + inline given int950: Conversion[950, ColorWeight] with + inline def apply(i: 950) = "950" diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala index d2e0b4d..9a54dea 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/Bins.scala @@ -1,7 +1,7 @@ package works.iterative.ui.components.laminar import com.raquo.laminar.api.L.{*, given} -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag case class Bin[Source, +Value]( diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala index 15169f3..480f5a9 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/DashboardComponentsModule.scala @@ -3,12 +3,12 @@ import com.raquo.laminar.api.L import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given -import works.iterative.ui.components.tailwind.experimental.ColorDef +import works.iterative.ui.model.color.ColorDef import com.raquo.laminar.builders.HtmlTag import org.scalajs.dom.html.UList import com.raquo.laminar.nodes.ReactiveHtmlElement import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind trait DashboardComponentsModule: def dashboard: DashboardComponents diff --git a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala index 98e31b9..5de4d67 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/laminar/ListComponentsModule.scala @@ -2,7 +2,7 @@ import com.raquo.laminar.api.L.{*, given} import works.iterative.ui.components.tailwind.ComponentContext -import works.iterative.ui.components.tailwind.experimental.ColorKind +import works.iterative.ui.model.color.ColorKind import works.iterative.ui.components.tailwind.laminar.LaminarExtensions.given import com.raquo.laminar.nodes.ReactiveHtmlElement import org.scalajs.dom.html.Paragraph diff --git a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala index 7777c7a..3899808 100644 --- a/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala +++ b/ui/js/src/main/scala/works/iterative/ui/components/tailwind/laminar/LaminarExtensions.scala @@ -2,18 +2,18 @@ package laminar import com.raquo.laminar.api.L.{*, given} +import works.iterative.ui.model.color.Color object LaminarExtensions: - given colorToCSS: Conversion[experimental.Color, Modifier[HtmlElement]] with - def apply(c: experimental.Color) = cls(c.toCSS) + given colorToCSS: Conversion[Color, Modifier[HtmlElement]] with + def apply(c: Color) = cls(c.toCSS) - given colorToSVGCSS: Conversion[experimental.Color, Modifier[SvgElement]] with - def apply(c: experimental.Color) = svg.cls(c.toCSS) + given colorToSVGCSS: Conversion[Color, Modifier[SvgElement]] with + def apply(c: Color) = svg.cls(c.toCSS) - given colorSignalToCSS - : Conversion[Signal[experimental.Color], Modifier[HtmlElement]] with - def apply(c: Signal[experimental.Color]) = cls <-- c.map(_.toCSS) + given colorSignalToCSS: Conversion[Signal[Color], Modifier[HtmlElement]] with + def apply(c: Signal[Color]) = cls <-- c.map(_.toCSS) - given colorSignalToSVGCSS - : Conversion[Signal[experimental.Color], Modifier[SvgElement]] with - def apply(c: Signal[experimental.Color]) = svg.cls <-- c.map(_.toCSS) + given colorSignalToSVGCSS: Conversion[Signal[Color], Modifier[SvgElement]] + with + def apply(c: Signal[Color]) = svg.cls <-- c.map(_.toCSS) diff --git a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala index 6e005af..99a212a 100644 --- a/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala +++ b/ui/js/src/main/scala/works/iterative/ui/scenarios/Scenario.scala @@ -13,8 +13,8 @@ import works.iterative.core.MessageCatalogue import works.iterative.ui.components.tailwind.ComponentContext import works.iterative.ui.components.tailwind.StyleGuide -import works.iterative.ui.components.tailwind.experimental.Color -import works.iterative.ui.components.tailwind.experimental.ColorWeight +import works.iterative.ui.model.color.Color +import works.iterative.ui.model.color.ColorWeight object Scenario: type Id = String diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala new file mode 100644 index 0000000..7352579 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/Tag.scala @@ -0,0 +1,10 @@ +package works.iterative.ui.model + +import works.iterative.ui.model.color.ColorKind + +/** Representation of colored string value. + * + * Used generally to represent tags or "labels", eg. some kind of status or + * categorization. + */ +final case class Tag(value: String, color: ColorKind = ColorKind.gray) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala new file mode 100644 index 0000000..09d6e4d --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/Color.scala @@ -0,0 +1,40 @@ +package works.iterative.ui.model.color + +/** Complete color definition that can be rendered to CSS. + * + * Includes the area, kind and weight of the color. + */ +case class Color(area: ColorArea, color: ColorDef): + def toCSS: String = s"${area.name}-${color.toCSS}" + +object Color: + import ColorDef.given + + def current = ColorDef(ColorKind.current) + def inherit = ColorDef(ColorKind.inherit) + def transp = ColorDef(ColorKind.transp) + def auto = ColorDef(ColorKind.auto) + def black = ColorDef(ColorKind.black) + def white = ColorDef(ColorKind.white) + def slate(weight: ColorWeight) = ColorDef(ColorKind.slate, weight) + def gray(weight: ColorWeight) = ColorDef(ColorKind.gray, weight) + def zinc(weight: ColorWeight) = ColorDef(ColorKind.zinc, weight) + def neutral(weight: ColorWeight) = ColorDef(ColorKind.neutral, weight) + def stone(weight: ColorWeight) = ColorDef(ColorKind.stone, weight) + def red(weight: ColorWeight) = ColorDef(ColorKind.red, weight) + def orange(weight: ColorWeight) = ColorDef(ColorKind.orange, weight) + def amber(weight: ColorWeight) = ColorDef(ColorKind.amber, weight) + def yellow(weight: ColorWeight) = ColorDef(ColorKind.yellow, weight) + def lime(weight: ColorWeight) = ColorDef(ColorKind.lime, weight) + def green(weight: ColorWeight) = ColorDef(ColorKind.green, weight) + def emerald(weight: ColorWeight) = ColorDef(ColorKind.emerald, weight) + def teal(weight: ColorWeight) = ColorDef(ColorKind.teal, weight) + def cyan(weight: ColorWeight) = ColorDef(ColorKind.cyan, weight) + def sky(weight: ColorWeight) = ColorDef(ColorKind.sky, weight) + def blue(weight: ColorWeight) = ColorDef(ColorKind.blue, weight) + def indigo(weight: ColorWeight) = ColorDef(ColorKind.indigo, weight) + def violet(weight: ColorWeight) = ColorDef(ColorKind.violet, weight) + def purple(weight: ColorWeight) = ColorDef(ColorKind.purple, weight) + def fuchsia(weight: ColorWeight) = ColorDef(ColorKind.fuchsia, weight) + def pink(weight: ColorWeight) = ColorDef(ColorKind.pink, weight) + def rose(weight: ColorWeight) = ColorDef(ColorKind.rose, weight) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala new file mode 100644 index 0000000..1211287 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorArea.scala @@ -0,0 +1,16 @@ +package works.iterative.ui.model.color + +/** Defines the area the color should apply to, eg. background, text, border, + * etc. + */ +enum ColorArea(val name: String): + case bg extends ColorArea("bg") + case text extends ColorArea("text") + case decoration extends ColorArea("decoration") + case border extends ColorArea("border") + case outline extends ColorArea("outline") + case divide extends ColorArea("divide") + case ring extends ColorArea("ring") + case ringOffset extends ColorArea("ring-offset") + case shadow extends ColorArea("shadow") + case accent extends ColorArea("accent") diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorDef.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorDef.scala new file mode 100644 index 0000000..9c5ec61 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorDef.scala @@ -0,0 +1,43 @@ +package works.iterative.ui.model.color + +/** A combination of ColorKind and ColorWeight, if applicable. + * + * By applying area we get the full Color definition. + */ +sealed trait ColorDef: + def toCSS: String + + def bg = Color(ColorArea.bg, this) + def text = Color(ColorArea.text, this) + def decoration = Color(ColorArea.decoration, this) + def border = Color(ColorArea.border, this) + def outline = Color(ColorArea.outline, this) + def divide = Color(ColorArea.divide, this) + def ring = Color(ColorArea.ring, this) + def ringOffset = Color(ColorArea.ringOffset, this) + def shadow = Color(ColorArea.shadow, this) + def accent = Color(ColorArea.accent, this) + +// TODO: create a macro that will output the tailwind class as string directly during compilation, where possible. +object ColorDef: + case class WeightedColorDef( + kind: ColorKind, + weight: ColorWeight + ) extends ColorDef: + override def toCSS: String = s"${kind.name}-${weight.value}" + + case class UnweightedColorDef( + kind: ColorKind + ) extends ColorDef: + override def toCSS: String = kind.name + + // TODO: check that the kind is valid unweighted kind + // that means current, inherit, auto, transparent, black, white + // tried using implicit evidence, but the type inference for enumerations + // tends to generalize to the enum, instead of the real type + def apply[T <: ColorKind](kind: T)(using + ev: T <:< ColorKind.Unweighted + ): ColorDef = + UnweightedColorDef(kind) + def apply(kind: ColorKind, weight: ColorWeight): ColorDef = + WeightedColorDef(kind, weight) diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorKind.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorKind.scala new file mode 100644 index 0000000..ea24372 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorKind.scala @@ -0,0 +1,47 @@ +package works.iterative.ui.model.color + +/** Defines what color should be used, without specifying the area or weight. + */ +sealed abstract class ColorKind private (val name: String): + def apply(weight: ColorWeight): ColorDef = + ColorDef.WeightedColorDef(this, weight) + +object ColorKind: + trait Unweighted: + self: ColorKind => + override def apply(weight: ColorWeight): ColorDef = + ColorDef.UnweightedColorDef(self) + + // TODO: change the "stupid" methods to extension methods + // that will keep the invariants in comments lower + case object current extends ColorKind("current") with Unweighted + case object inherit extends ColorKind("inherit") with Unweighted + // Not present in for all methods + case object transp extends ColorKind("transparent") with Unweighted + // Seen in accent, not preset otherwise + case object auto extends ColorKind("auto") with Unweighted + // Black and white do not have weight + case object black extends ColorKind("black") with Unweighted + case object white extends ColorKind("white") with Unweighted + case object slate extends ColorKind("slate") + case object gray extends ColorKind("gray") + case object zinc extends ColorKind("zinc") + case object neutral extends ColorKind("neutral") + case object stone extends ColorKind("stone") + case object red extends ColorKind("red") + case object orange extends ColorKind("orange") + case object amber extends ColorKind("amber") + case object yellow extends ColorKind("yellow") + case object lime extends ColorKind("lime") + case object green extends ColorKind("green") + case object emerald extends ColorKind("emerald") + case object teal extends ColorKind("teal") + case object cyan extends ColorKind("cyan") + case object sky extends ColorKind("sky") + case object blue extends ColorKind("blue") + case object indigo extends ColorKind("indigo") + case object violet extends ColorKind("violet") + case object purple extends ColorKind("purple") + case object fuchsia extends ColorKind("fuchsia") + case object pink extends ColorKind("pink") + case object rose extends ColorKind("rose") diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorWeight.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorWeight.scala new file mode 100644 index 0000000..7767ac5 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/ColorWeight.scala @@ -0,0 +1,33 @@ +package works.iterative.ui.model.color + +opaque type ColorWeight = String + +extension (c: ColorWeight) def value: String = c + +/** Defines weight of a color, eg. 50, 100, 200, etc. + * + * Tailwind-like. + */ +object ColorWeight: + inline given int50: Conversion[50, ColorWeight] with + inline def apply(i: 50) = "50" + inline given int100: Conversion[100, ColorWeight] with + inline def apply(i: 100) = "100" + inline given int200: Conversion[200, ColorWeight] with + inline def apply(i: 200) = "200" + inline given int300: Conversion[300, ColorWeight] with + inline def apply(i: 300) = "300" + inline given int400: Conversion[400, ColorWeight] with + inline def apply(i: 400) = "400" + inline given int500: Conversion[500, ColorWeight] with + inline def apply(i: 500) = "500" + inline given int600: Conversion[600, ColorWeight] with + inline def apply(i: 600) = "600" + inline given int700: Conversion[700, ColorWeight] with + inline def apply(i: 700) = "700" + inline given int800: Conversion[800, ColorWeight] with + inline def apply(i: 800) = "800" + inline given int900: Conversion[900, ColorWeight] with + inline def apply(i: 900) = "900" + inline given int950: Conversion[950, ColorWeight] with + inline def apply(i: 950) = "950" diff --git a/ui/shared/src/main/scala/works/iterative/ui/model/color/package.scala b/ui/shared/src/main/scala/works/iterative/ui/model/color/package.scala new file mode 100644 index 0000000..2b380e6 --- /dev/null +++ b/ui/shared/src/main/scala/works/iterative/ui/model/color/package.scala @@ -0,0 +1,12 @@ +package works.iterative.ui.model + +/** We need a generic Color model that can be used both on server and on client. + * + * We have adopted the Tailwind model for now. There is nothing inherently + * Tailwind-specific in the implementation, but all the values are taken from + * their palette and the area model is very HTML biased. + * + * Still, I think that it is a good starting point for exploration and will + * satisfy our current needs. + */ +package object color {}