Package form

import "gitlab.com/zoralab/bissetii/pkg/components/internal/form"

const (
	CSSAMP = `form{margin:var(--form-margin);max-width:var(--form-max-width)}form ul,form ol{margin:var(--form-list-margin);list-style-type:var(--form-list-style-type);padding:var(--form-list-padding)}form ul li,form ol li{display:var(--form-li-display);margin:var(--form-li-margin)}form ul.inline li,form ol.inline li{--form-li-display:inline-block}form .row{width:inherit}fieldset{display:var(--fieldset-display);margin:var(--fieldset-margin);padding:var(--fieldset-padding);border-radius:var(--fieldset-border-radius);border:var(--fieldset-border);text-align:var(--fieldset-text-align)}fieldset.border{border:var(--fieldset-border-show)}fieldset.center{--fieldset-margin:1.5rem auto;--fieldset-text-align:center}legend{font-weight:var(--legend-font-weight);color:var(--legend-color)}input[type=date],input[type=time],input[type=month],input[type=week],input[type=datetime-local],input[type=color],input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],input:not([type]),select,textarea{font:var(--input-font);font-size:var(--input-font-size);vertical-align:var(--input-vertical-align);color:var(--input-color);background:var(--input-background);background-image:var(--input-background-image);border-radius:var(--input-border-radius);border:var(--input-border);border-color:var(--input-border-color);border-left-width:var(--input-border-left-width);outline:var(--input-outline);box-shadow:var(--input-box-shadow);box-sizing:var(--input-box-sizing);width:var(--input-width);height:var(--input-height);max-width:100%;min-height:var(--input-min-height);padding:var(--input-padding);-webkit-appearance:var(--input-appearance);-moz-appearance:var(--input-appearance);appearance:var(--input-appearance);-webkit-transition:var(--input-transition);-ms-transition:var(--input-transition);-moz-transition:var(--input-transition);-o-transition:var(--input-transition);transition:var(--input-transition)}input[type=date]:required:valid,input[type=date]:required:enabled:valid,input[type=date]:valid,input[type=time]:required:valid,input[type=time]:required:enabled:valid,input[type=time]:valid,input[type=month]:required:valid,input[type=month]:required:enabled:valid,input[type=month]:valid,input[type=week]:required:valid,input[type=week]:required:enabled:valid,input[type=week]:valid,input[type=datetime-local]:required:valid,input[type=datetime-local]:required:enabled:valid,input[type=datetime-local]:valid,input[type=color]:required:valid,input[type=color]:required:enabled:valid,input[type=color]:valid,input[type=email]:required:valid,input[type=email]:required:enabled:valid,input[type=email]:valid,input[type=number]:required:valid,input[type=number]:required:enabled:valid,input[type=number]:valid,input[type=password]:required:valid,input[type=password]:required:enabled:valid,input[type=password]:valid,input[type=search]:required:valid,input[type=search]:required:enabled:valid,input[type=search]:valid,input[type=tel]:required:valid,input[type=tel]:required:enabled:valid,input[type=tel]:valid,input[type=text]:required:valid,input[type=text]:required:enabled:valid,input[type=text]:valid,input[type=url]:required:valid,input[type=url]:required:enabled:valid,input[type=url]:valid,input:not([type]):required:valid,input:not([type]):required:enabled:valid,input:not([type]):valid,select:required:valid,select:required:enabled:valid,select:valid,textarea:required:valid,textarea:required:enabled:valid,textarea:valid{--input-border-color:var(--color-green-500)}input[type=date]:required:enabled,input[type=date]:required:enabled:invalid,input[type=date]:invalid,input[type=time]:required:enabled,input[type=time]:required:enabled:invalid,input[type=time]:invalid,input[type=month]:required:enabled,input[type=month]:required:enabled:invalid,input[type=month]:invalid,input[type=week]:required:enabled,input[type=week]:required:enabled:invalid,input[type=week]:invalid,input[type=datetime-local]:required:enabled,input[type=datetime-local]:required:enabled:invalid,input[type=datetime-local]:invalid,input[type=color]:required:enabled,input[type=color]:required:enabled:invalid,input[type=color]:invalid,input[type=email]:required:enabled,input[type=email]:required:enabled:invalid,input[type=email]:invalid,input[type=number]:required:enabled,input[type=number]:required:enabled:invalid,input[type=number]:invalid,input[type=password]:required:enabled,input[type=password]:required:enabled:invalid,input[type=password]:invalid,input[type=search]:required:enabled,input[type=search]:required:enabled:invalid,input[type=search]:invalid,input[type=tel]:required:enabled,input[type=tel]:required:enabled:invalid,input[type=tel]:invalid,input[type=text]:required:enabled,input[type=text]:required:enabled:invalid,input[type=text]:invalid,input[type=url]:required:enabled,input[type=url]:required:enabled:invalid,input[type=url]:invalid,input:not([type]):required:enabled,input:not([type]):required:enabled:invalid,input:not([type]):invalid,select:required:enabled,select:required:enabled:invalid,select:invalid,textarea:required:enabled,textarea:required:enabled:invalid,textarea:invalid{--input-border-color:var(--color-red-500)}input[type=date]:required:focus,input[type=date]:focus,input[type=time]:required:focus,input[type=time]:focus,input[type=month]:required:focus,input[type=month]:focus,input[type=week]:required:focus,input[type=week]:focus,input[type=datetime-local]:required:focus,input[type=datetime-local]:focus,input[type=color]:required:focus,input[type=color]:focus,input[type=email]:required:focus,input[type=email]:focus,input[type=number]:required:focus,input[type=number]:focus,input[type=password]:required:focus,input[type=password]:focus,input[type=search]:required:focus,input[type=search]:focus,input[type=tel]:required:focus,input[type=tel]:focus,input[type=text]:required:focus,input[type=text]:focus,input[type=url]:required:focus,input[type=url]:focus,input:not([type]):required:focus,input:not([type]):focus,select:required:focus,select:focus,textarea:required:focus,textarea:focus{--input-border-color:var(--color-blue-500)}input[type=date]::placeholder,input[type=time]::placeholder,input[type=month]::placeholder,input[type=week]::placeholder,input[type=datetime-local]::placeholder,input[type=color]::placeholder,input[type=email]::placeholder,input[type=number]::placeholder,input[type=password]::placeholder,input[type=search]::placeholder,input[type=tel]::placeholder,input[type=text]::placeholder,input[type=url]::placeholder,input:not([type])::placeholder,select::placeholder,textarea::placeholder{font-style:var(--placeholder-font-style);color:var(--placeholder-color)}textarea{--input-min-height:15rem}select:not([multiple]){--input-background:no-repeat left 50% bottom 0%/1rem}select:not([multiple]):required:valid,select:not([multiple]):required:enabled:valid,select:not([multiple]):valid{--input-background-image:url('data:image/svg+xml,%3Csvg width="5" height="5" version="1.1" viewBox="0 0 1.3229 1.3229" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath transform="matrix(.96764 0 0 -1.1173 .14932 1.3165)" d="m1.1976 1.1527h-1.3229l0.66146-1.1457z" fill="%230ad406" stroke="%230ad406" stroke-linecap="round" stroke-linejoin="round" stroke-width=".05109"/%3E%3C/svg%3E')}select:not([multiple]):required:enabled,select:not([multiple]):required:enabled:invalid,select:not([multiple]):invalid{--input-background-image:url('data:image/svg+xml,%3Csvg width="5" height="5" version="1.1" viewBox="0 0 1.3229 1.3229" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath transform="matrix(.96764 0 0 -1.1173 .14932 1.3165)" d="m1.1976 1.1527h-1.3229l0.66146-1.1457z" fill="%23ff0000" stroke="%23ff0000" stroke-linecap="round" stroke-linejoin="round" stroke-width=".05109"/%3E%3C/svg%3E')}select:not([multiple]):required:focus,select:not([multiple]):focus{--input-background-image:url('data:image/svg+xml,%3Csvg width="5" height="5" version="1.1" viewBox="0 0 1.3229 1.3229" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath transform="matrix(.96764 0 0 -1.1173 .14932 1.3165)" d="m1.1976 1.1527h-1.3229l0.66146-1.1457z" fill="%230000ff" stroke="%230000ff" stroke-linecap="round" stroke-linejoin="round" stroke-width=".05109"/%3E%3C/svg%3E')}select[multiple]{--input-min-height:15rem;--input-height:fit-content}select optgroup{margin:var(--optgroup-margin)}select optgroup:first-child{margin-top:0}select option{padding:var(--option-padding)}@media screen and (max-width: 320px){input[type=date],input[type=time],input[type=month],input[type=week],input[type=datetime-local]{--input-font-size:1rem}}@media only screen and (min-width: 321px)and (max-width: 427px){input[type=date],input[type=time],input[type=month],input[type=week],input[type=datetime-local]{--input-font-size:1.3rem}}label{font-size:var(--label-font-size);color:var(--label-color);width:var(--label-width);white-space:var(--label-white-space);vertical-align:var(--label-vertical-align)}label.info,label.notice,label.password-notice,label.password-rule{--label-font-size:1.4rem;--label-white-space:pre}label.password-notice,label.notice{--label-color:var(--color-red-500)}input[type=radio],input[type=checkbox]{border:var(--input-border);border-color:var(--input-border-color);vertical-align:var(--input-vertical-align)}input[type=radio]:required:not(:checked)+label,input[type=checkbox]:required:not(:checked)+label{--label-color:var(--color-red-500)}input[type=radio]:disabled+label,input[type=checkbox]:disabled+label{--label-color:var(--color-grey-400)}`

	CSSCritical = `form{margin:var(--form-margin);max-width:var(--form-max-width)}form ul,form ol{margin:var(--form-list-margin);list-style-type:var(--form-list-style-type);padding:var(--form-list-padding)}form ul li,form ol li{display:var(--form-li-display);margin:var(--form-li-margin)}form ul.inline li,form ol.inline li{--form-li-display:inline-block}form .row{width:inherit}fieldset{display:var(--fieldset-display);margin:var(--fieldset-margin);padding:var(--fieldset-padding);border-radius:var(--fieldset-border-radius);border:var(--fieldset-border);text-align:var(--fieldset-text-align)}fieldset.border{border:var(--fieldset-border-show)}fieldset.center{--fieldset-margin:1.5rem auto;--fieldset-text-align:center}legend{font-weight:var(--legend-font-weight);color:var(--legend-color)}input[type=date],input[type=time],input[type=month],input[type=week],input[type=datetime-local],input[type=color],input[type=email],input[type=number],input[type=password],input[type=search],input[type=tel],input[type=text],input[type=url],input:not([type]),select,textarea{font:var(--input-font);font-size:var(--input-font-size);vertical-align:var(--input-vertical-align);color:var(--input-color);background:var(--input-background);background-image:var(--input-background-image);border-radius:var(--input-border-radius);border:var(--input-border);border-color:var(--input-border-color);border-left-width:var(--input-border-left-width);outline:var(--input-outline);box-shadow:var(--input-box-shadow);box-sizing:var(--input-box-sizing);width:var(--input-width);height:var(--input-height);max-width:100%;min-height:var(--input-min-height);padding:var(--input-padding);-webkit-appearance:var(--input-appearance);-moz-appearance:var(--input-appearance);appearance:var(--input-appearance);-webkit-transition:var(--input-transition);-ms-transition:var(--input-transition);-moz-transition:var(--input-transition);-o-transition:var(--input-transition);transition:var(--input-transition)}input[type=date]:required:valid,input[type=date]:required:enabled:valid,input[type=date]:valid,input[type=time]:required:valid,input[type=time]:required:enabled:valid,input[type=time]:valid,input[type=month]:required:valid,input[type=month]:required:enabled:valid,input[type=month]:valid,input[type=week]:required:valid,input[type=week]:required:enabled:valid,input[type=week]:valid,input[type=datetime-local]:required:valid,input[type=datetime-local]:required:enabled:valid,input[type=datetime-local]:valid,input[type=color]:required:valid,input[type=color]:required:enabled:valid,input[type=color]:valid,input[type=email]:required:valid,input[type=email]:required:enabled:valid,input[type=email]:valid,input[type=number]:required:valid,input[type=number]:required:enabled:valid,input[type=number]:valid,input[type=password]:required:valid,input[type=password]:required:enabled:valid,input[type=password]:valid,input[type=search]:required:valid,input[type=search]:required:enabled:valid,input[type=search]:valid,input[type=tel]:required:valid,input[type=tel]:required:enabled:valid,input[type=tel]:valid,input[type=text]:required:valid,input[type=text]:required:enabled:valid,input[type=text]:valid,input[type=url]:required:valid,input[type=url]:required:enabled:valid,input[type=url]:valid,input:not([type]):required:valid,input:not([type]):required:enabled:valid,input:not([type]):valid,select:required:valid,select:required:enabled:valid,select:valid,textarea:required:valid,textarea:required:enabled:valid,textarea:valid{--input-border-color:var(--color-green-500)}input[type=date]:required:enabled,input[type=date]:required:enabled:invalid,input[type=date]:invalid,input[type=time]:required:enabled,input[type=time]:required:enabled:invalid,input[type=time]:invalid,input[type=month]:required:enabled,input[type=month]:required:enabled:invalid,input[type=month]:invalid,input[type=week]:required:enabled,input[type=week]:required:enabled:invalid,input[type=week]:invalid,input[type=datetime-local]:required:enabled,input[type=datetime-local]:required:enabled:invalid,input[type=datetime-local]:invalid,input[type=color]:required:enabled,input[type=color]:required:enabled:invalid,input[type=color]:invalid,input[type=email]:required:enabled,input[type=email]:required:enabled:invalid,input[type=email]:invalid,input[type=number]:required:enabled,input[type=number]:required:enabled:invalid,input[type=number]:invalid,input[type=password]:required:enabled,input[type=password]:required:enabled:invalid,input[type=password]:invalid,input[type=search]:required:enabled,input[type=search]:required:enabled:invalid,input[type=search]:invalid,input[type=tel]:required:enabled,input[type=tel]:required:enabled:invalid,input[type=tel]:invalid,input[type=text]:required:enabled,input[type=text]:required:enabled:invalid,input[type=text]:invalid,input[type=url]:required:enabled,input[type=url]:required:enabled:invalid,input[type=url]:invalid,input:not([type]):required:enabled,input:not([type]):required:enabled:invalid,input:not([type]):invalid,select:required:enabled,select:required:enabled:invalid,select:invalid,textarea:required:enabled,textarea:required:enabled:invalid,textarea:invalid{--input-border-color:var(--color-red-500)}input[type=date]:required:focus,input[type=date]:focus,input[type=time]:required:focus,input[type=time]:focus,input[type=month]:required:focus,input[type=month]:focus,input[type=week]:required:focus,input[type=week]:focus,input[type=datetime-local]:required:focus,input[type=datetime-local]:focus,input[type=color]:required:focus,input[type=color]:focus,input[type=email]:required:focus,input[type=email]:focus,input[type=number]:required:focus,input[type=number]:focus,input[type=password]:required:focus,input[type=password]:focus,input[type=search]:required:focus,input[type=search]:focus,input[type=tel]:required:focus,input[type=tel]:focus,input[type=text]:required:focus,input[type=text]:focus,input[type=url]:required:focus,input[type=url]:focus,input:not([type]):required:focus,input:not([type]):focus,select:required:focus,select:focus,textarea:required:focus,textarea:focus{--input-border-color:var(--color-blue-500)}input[type=date]::placeholder,input[type=time]::placeholder,input[type=month]::placeholder,input[type=week]::placeholder,input[type=datetime-local]::placeholder,input[type=color]::placeholder,input[type=email]::placeholder,input[type=number]::placeholder,input[type=password]::placeholder,input[type=search]::placeholder,input[type=tel]::placeholder,input[type=text]::placeholder,input[type=url]::placeholder,input:not([type])::placeholder,select::placeholder,textarea::placeholder{font-style:var(--placeholder-font-style);color:var(--placeholder-color)}textarea{--input-min-height:15rem}select:not([multiple]){--input-background:no-repeat left 50% bottom 0%/1rem}select:not([multiple]):required:valid,select:not([multiple]):required:enabled:valid,select:not([multiple]):valid{--input-background-image:url('data:image/svg+xml,%3Csvg width="5" height="5" version="1.1" viewBox="0 0 1.3229 1.3229" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath transform="matrix(.96764 0 0 -1.1173 .14932 1.3165)" d="m1.1976 1.1527h-1.3229l0.66146-1.1457z" fill="%230ad406" stroke="%230ad406" stroke-linecap="round" stroke-linejoin="round" stroke-width=".05109"/%3E%3C/svg%3E')}select:not([multiple]):required:enabled,select:not([multiple]):required:enabled:invalid,select:not([multiple]):invalid{--input-background-image:url('data:image/svg+xml,%3Csvg width="5" height="5" version="1.1" viewBox="0 0 1.3229 1.3229" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath transform="matrix(.96764 0 0 -1.1173 .14932 1.3165)" d="m1.1976 1.1527h-1.3229l0.66146-1.1457z" fill="%23ff0000" stroke="%23ff0000" stroke-linecap="round" stroke-linejoin="round" stroke-width=".05109"/%3E%3C/svg%3E')}select:not([multiple]):required:focus,select:not([multiple]):focus{--input-background-image:url('data:image/svg+xml,%3Csvg width="5" height="5" version="1.1" viewBox="0 0 1.3229 1.3229" xmlns="http://www.w3.org/2000/svg"%3E%3Cpath transform="matrix(.96764 0 0 -1.1173 .14932 1.3165)" d="m1.1976 1.1527h-1.3229l0.66146-1.1457z" fill="%230000ff" stroke="%230000ff" stroke-linecap="round" stroke-linejoin="round" stroke-width=".05109"/%3E%3C/svg%3E')}select[multiple]{--input-min-height:15rem;--input-height:fit-content}select optgroup{margin:var(--optgroup-margin)}select optgroup:first-child{margin-top:0}select option{padding:var(--option-padding)}@media screen and (max-width: 320px){input[type=date],input[type=time],input[type=month],input[type=week],input[type=datetime-local]{--input-font-size:1rem}}@media only screen and (min-width: 321px)and (max-width: 427px){input[type=date],input[type=time],input[type=month],input[type=week],input[type=datetime-local]{--input-font-size:1.3rem}}label{font-size:var(--label-font-size);color:var(--label-color);width:var(--label-width);white-space:var(--label-white-space);vertical-align:var(--label-vertical-align)}label.info,label.notice,label.password-notice,label.password-rule{--label-font-size:1.4rem;--label-white-space:pre}label.password-notice,label.notice{--label-color:var(--color-red-500)}input[type=radio],input[type=checkbox]{border:var(--input-border);border-color:var(--input-border-color);vertical-align:var(--input-vertical-align)}input[type=radio]:required:not(:checked)+label,input[type=checkbox]:required:not(:checked)+label{--label-color:var(--color-red-500)}input[type=radio]:disabled+label,input[type=checkbox]:disabled+label{--label-color:var(--color-grey-400)}`

	CSSTablet = ``

	CSSDesktop = ``

	CSSWidescreen = ``

	CSSPrint = `label,input,fieldset{break-inside:avoid}input[type=color]{-webkit-print-color-adjust:exact;color-adjust:exact}`

	CSSVariables    = ``

	CSSVariablesAMP = ``
)

const (
	// Name is the block name (`{{- define "this-name" -}}`).
	Name = "form"

	// AMPName is the AMP HTML block name.
	AMPName = core.AMPPrefix + Name

	// ParametersComment are the list of comment headers
	// describing inputs.
	ParametersComment = `
{{- /* .Method            = Form method                             */ -}}
{{- /* .Action            = Form action                             */ -}}
{{- /* .Content           = Form content                            */ -}}
{{- /* .ID                = Form id attribute (optional)            */ -}}
{{- /* .Class             = Form class attribute (optional)         */ -}}
{{- /* .Label             = Form aria-label attribute (optional)    */ -}}
`
)

const (
	// DepHTML is the vanilla HTML output type.
	DepHTML = ``

	// DepAMPHTML is the Accelerated Mobile Pages HTML output
	// type.
	DepAMPHTML = ``
)

const (
	// HTML is the vanilla HTML output type.
	HTML = `
<form method="{{- .Method -}}" action="{{- .Action -}}"
{{- if .ID }}

	id="{{- .ID -}}"
{{- end }}
{{- if .Class }}

	class="{{- .Class -}}"
{{- end }}
{{- if .Label }}

	aria-label="{{- .Label -}}"
{{- end -}}
>
{{- if .Content }}

	{{ .Content }}
{{- end }}
</form>
`

	// AMPHTML is the Accelerated Mobile Pages HTML output type.
	AMPHTML = `
<form method="{{- .Method -}}"
{{- if eq .Method "post" }}

	action-xhr="{{- .Action -}}"
{{- else }}

	action="{{- .Action -}}"
{{- end }}
{{- if .ID }}

	id="{{- .ID -}}"
{{- end }}
{{- if .Class }}

	class="{{- .Class -}}"
{{- end }}
{{- if .Label }}

	aria-label="{{- .Label -}}"
{{- end -}}
>

	{{ .Content }}
</form>
`
)

type Data struct {
	Method  string
	Action  string
	Content string
	ID      string
	Class   string
	Label   string
}