update templui components
This commit is contained in:
parent
d223d76401
commit
78047c7ee8
52 changed files with 162 additions and 123 deletions
|
|
@ -1,4 +1,4 @@
|
|||
// templui component checkbox - version: v0.101.0 installed by templui v0.101.0
|
||||
// templui component checkbox - version: v1.2.0 installed by templui v1.2.0
|
||||
// 📚 Documentation: https://templui.io/docs/components/checkbox
|
||||
package checkbox
|
||||
|
||||
|
|
@ -8,15 +8,17 @@ import (
|
|||
)
|
||||
|
||||
type Props struct {
|
||||
ID string
|
||||
Class string
|
||||
Attributes templ.Attributes
|
||||
Name string
|
||||
Value string
|
||||
Disabled bool
|
||||
Checked bool
|
||||
Form string
|
||||
Icon templ.Component
|
||||
ID string
|
||||
Class string
|
||||
Attributes templ.Attributes
|
||||
Name string
|
||||
Value string
|
||||
Disabled bool
|
||||
Checked bool
|
||||
Group string
|
||||
GroupParent bool
|
||||
Form string
|
||||
Icon templ.Component
|
||||
}
|
||||
|
||||
templ Checkbox(props ...Props) {
|
||||
|
|
@ -42,6 +44,12 @@ templ Checkbox(props ...Props) {
|
|||
if p.Form != "" {
|
||||
form={ p.Form }
|
||||
}
|
||||
if p.Group != "" {
|
||||
data-tui-checkbox-group={ p.Group }
|
||||
}
|
||||
if p.GroupParent {
|
||||
data-tui-checkbox-parent="true"
|
||||
}
|
||||
type="checkbox"
|
||||
class={
|
||||
utils.TwMerge(
|
||||
|
|
@ -49,6 +57,7 @@ templ Checkbox(props ...Props) {
|
|||
"focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:border-ring",
|
||||
"disabled:cursor-not-allowed disabled:opacity-50",
|
||||
"checked:bg-primary checked:text-primary-foreground checked:border-primary",
|
||||
"indeterminate:bg-primary indeterminate:text-primary-foreground indeterminate:border-primary",
|
||||
"appearance-none cursor-pointer transition-shadow",
|
||||
"relative",
|
||||
p.Class,
|
||||
|
|
@ -57,7 +66,7 @@ templ Checkbox(props ...Props) {
|
|||
{ p.Attributes... }
|
||||
/>
|
||||
<div
|
||||
class="absolute left-0 top-0 h-4 w-4 pointer-events-none flex items-center justify-center text-primary-foreground opacity-0 peer-checked:opacity-100"
|
||||
class="absolute inset-0 pointer-events-none flex items-center justify-center text-primary-foreground opacity-0 peer-checked:opacity-100"
|
||||
>
|
||||
if p.Icon != nil {
|
||||
@p.Icon
|
||||
|
|
@ -65,5 +74,14 @@ templ Checkbox(props ...Props) {
|
|||
@icon.Check(icon.Props{Size: 14})
|
||||
}
|
||||
</div>
|
||||
<div
|
||||
class="absolute inset-0 pointer-events-none flex items-center justify-center text-primary-foreground opacity-0 peer-indeterminate:opacity-100"
|
||||
>
|
||||
@icon.Minus(icon.Props{Size: 14})
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
templ Script() {
|
||||
<script defer nonce={ templ.GetNonce(ctx) } src={ utils.ScriptURL("/assets/js/checkbox.min.js") }></script>
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue