scanfile/server/web/templui/components/separator/separator.templ
2025-06-03 15:44:56 +02:00

97 lines
2 KiB
Text

// templui component separator - version: main installed by templui v0.71.0
package separator
import "git.jmbit.de/jmb/scanfile/server/web/templui/utils"
type Orientation string
type Decoration string
const (
OrientationHorizontal Orientation = "horizontal"
OrientationVertical Orientation = "vertical"
)
const (
DecorationDashed Decoration = "dashed"
DecorationDotted Decoration = "dotted"
)
type Props struct {
ID string
Class string
Attributes templ.Attributes
Orientation Orientation
Decoration Decoration
}
templ Separator(props ...Props) {
{{ var p Props }}
if len(props) > 0 {
{{ p = props[0] }}
}
if p.Orientation == "" {
{{ p.Orientation = OrientationHorizontal }}
}
if p.Orientation == OrientationHorizontal {
<div
if p.ID != "" {
id={ p.ID }
}
role="separator"
aria-orientation="horizontal"
class={ utils.TwMerge("shrink-0 w-full", p.Class) }
{ p.Attributes... }
>
<div class="relative flex items-center w-full">
<span
class={
utils.TwMerge(
"absolute w-full border-t h-[1px]",
decorationClasses(p.Decoration),
),
}
aria-hidden="true"
></span>
<span class="relative mx-auto bg-background px-2 text-xs text-muted-foreground">
{ children... }
</span>
</div>
</div>
} else {
<div
if p.ID != "" {
id={ p.ID }
}
role="separator"
aria-orientation="vertical"
class={ utils.TwMerge("shrink-0 h-full", p.Class) }
{ p.Attributes... }
>
<div class="relative flex flex-col items-center h-full">
<span
class={
utils.TwMerge(
"absolute h-full border-l w-[1px]",
decorationClasses(p.Decoration),
),
}
aria-hidden="true"
></span>
<span class="relative my-auto bg-background py-2 text-xs text-muted-foreground">
{ children... }
</span>
</div>
</div>
}
}
func decorationClasses(decoration Decoration) string {
switch decoration {
case DecorationDashed:
return "border-dashed"
case DecorationDotted:
return "border-dotted"
default:
return ""
}
}