125 lines
3 KiB
Text
125 lines
3 KiB
Text
// templui component popover - version: v0.84.0 installed by templui v0.84.0
|
|
package popover
|
|
|
|
import (
|
|
"git.jmbit.de/jmb/scanfile/server/web/templui/utils"
|
|
"strconv"
|
|
)
|
|
|
|
type Placement string
|
|
|
|
const (
|
|
PlacementTop Placement = "top"
|
|
PlacementTopStart Placement = "top-start"
|
|
PlacementTopEnd Placement = "top-end"
|
|
PlacementRight Placement = "right"
|
|
PlacementRightStart Placement = "right-start"
|
|
PlacementRightEnd Placement = "right-end"
|
|
PlacementBottom Placement = "bottom"
|
|
PlacementBottomStart Placement = "bottom-start"
|
|
PlacementBottomEnd Placement = "bottom-end"
|
|
PlacementLeft Placement = "left"
|
|
PlacementLeftStart Placement = "left-start"
|
|
PlacementLeftEnd Placement = "left-end"
|
|
)
|
|
|
|
type TriggerType string
|
|
|
|
const (
|
|
TriggerTypeHover TriggerType = "hover"
|
|
TriggerTypeClick TriggerType = "click"
|
|
)
|
|
|
|
type TriggerProps struct {
|
|
ID string
|
|
Class string
|
|
Attributes templ.Attributes
|
|
For string
|
|
TriggerType TriggerType
|
|
}
|
|
|
|
type ContentProps struct {
|
|
ID string
|
|
Class string
|
|
Attributes templ.Attributes
|
|
Placement Placement
|
|
Offset int
|
|
DisableClickAway bool
|
|
DisableESC bool
|
|
ShowArrow bool
|
|
HoverDelay int
|
|
HoverOutDelay int
|
|
MatchWidth bool
|
|
}
|
|
|
|
templ Trigger(props ...TriggerProps) {
|
|
{{ var p TriggerProps }}
|
|
if len(props) > 0 {
|
|
{{ p = props[0] }}
|
|
}
|
|
if p.TriggerType == "" {
|
|
{{ p.TriggerType = TriggerTypeClick }}
|
|
}
|
|
<span
|
|
if p.ID != "" {
|
|
id={ p.ID }
|
|
}
|
|
class={ utils.TwMerge("group cursor-pointer", p.Class) }
|
|
if p.For != "" {
|
|
data-popover-trigger={ p.For }
|
|
}
|
|
data-open="false"
|
|
data-popover-type={ string(p.TriggerType) }
|
|
{ p.Attributes... }
|
|
>
|
|
{ children... }
|
|
</span>
|
|
}
|
|
|
|
templ Content(props ...ContentProps) {
|
|
{{ var p ContentProps }}
|
|
if len(props) > 0 {
|
|
{{ p = props[0] }}
|
|
}
|
|
if p.Placement == "" {
|
|
{{ p.Placement = PlacementBottom }}
|
|
}
|
|
if p.Offset == 0 {
|
|
if p.ShowArrow {
|
|
{{ p.Offset = 8 }}
|
|
} else {
|
|
{{ p.Offset = 4 }}
|
|
}
|
|
}
|
|
<div
|
|
id={ p.ID }
|
|
data-popover-id={ p.ID }
|
|
data-open="false"
|
|
data-popover-placement={ string(p.Placement) }
|
|
data-popover-offset={ strconv.Itoa(p.Offset) }
|
|
data-popover-disable-clickaway={ strconv.FormatBool(p.DisableClickAway) }
|
|
data-popover-disable-esc={ strconv.FormatBool(p.DisableESC) }
|
|
data-popover-show-arrow={ strconv.FormatBool(p.ShowArrow) }
|
|
data-popover-hover-delay={ strconv.Itoa(p.HoverDelay) }
|
|
data-popover-hover-out-delay={ strconv.Itoa(p.HoverOutDelay) }
|
|
if p.MatchWidth {
|
|
data-popover-match-width="true"
|
|
}
|
|
class={ utils.TwMerge(
|
|
"bg-popover rounded-lg border text-popover-foreground text-sm shadow-lg pointer-events-auto absolute z-[9999] hidden top-0 left-0",
|
|
p.Class,
|
|
) }
|
|
{ p.Attributes... }
|
|
>
|
|
<div class="w-full overflow-hidden">
|
|
{ children... }
|
|
</div>
|
|
if p.ShowArrow {
|
|
<div data-popover-arrow class="absolute h-2.5 w-2.5 rotate-45 bg-background border"></div>
|
|
}
|
|
</div>
|
|
}
|
|
|
|
templ Script() {
|
|
<script defer src="/assets/js/popover.min.js"></script>
|
|
}
|