Commit0a01cc2

authored

input with error (#1399)

1 parent639fc9a commit0a01cc2Copy full SHA for 0a01cc2

File tree

+42

-2

lines changed

pgml-dashboard/src/components
- inputs/text/input
- pages/demo
  - template.html

+42

-2

lines changed

Lines changed: 12 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,13 @@`
`1`	`1`	`div[data-controller="inputs-text-input"] {`
	`2`	`+--bs-danger:#{$peach-shade-100};`
	`3`	`+`
`2`	`4`	`span.material-symbols-outlined {`
`3`	`5`	`margin-left:-40px;`
`4`	`6`	`color:#{$slate-shade-100};`
	`7`	`+`
	`8`	`+&.is-invalid {`
	`9`	`+color:var(--bs-danger);`
	`10`	`+ }`
`5`	`11`	`}`
`6`	`12`
`7`	`13`	`input.form-control {`
`@@ -12,4 +18,10 @@ div[data-controller="inputs-text-input"] {`
`12`	`18`	`label.form-label {`
`13`	`19`	`font-weight:#{$font-weight-normal};`
`14`	`20`	`}`
	`21`	`+`
	`22`	`+p {`
	`23`	`+small {`
	`24`	`+color:var(--bs-danger);`
	`25`	`+ }`
	`26`	`+ }`
`15`	`27`	`}`

Lines changed: 7 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -16,6 +16,7 @@ pub struct Input {`
`16`	`16`	`autocomplete:bool,`
`17`	`17`	`value:String,`
`18`	`18`	`required:bool,`
	`19`	`+error:Option<String>,`
`19`	`20`	`}`
`20`	`21`
`21`	`22`	`implInput{`
`@@ -38,6 +39,7 @@ impl Input {`
`38`	`39`	`autocomplete:false,`
`39`	`40`	`value:"".to_string(),`
`40`	`41`	`required:false,`
	`42`	`+error:None,`
`41`	`43`	`}`
`42`	`44`	`}`
`43`	`45`
`@@ -90,6 +92,11 @@ impl Input {`
`90`	`92`	`self.required =true;`
`91`	`93`	`self`
`92`	`94`	`}`
	`95`	`+`
	`96`	`+pubfnerror(mutself,error:Option<implToString>) ->Self{`
	`97`	`+self.error = error.map(\|e\| e.to_string());`
	`98`	`+self`
	`99`	`+}`
`93`	`100`	`}`
`94`	`101`
`95`	`102`	`component!(Input);`

Lines changed: 13 additions & 2 deletions

Original file line number	Diff line number	Diff line change
`@@ -1,3 +1,9 @@`
	`1`	`+<% let (input_classes, icon_classes) = if error.is_some() {`
	`2`	`+ ("form-control is-invalid", "material-symbols-outlined is-invalid")`
	`3`	`+} else {`
	`4`	`+ ("form-control", "material-symbols-outlined")`
	`5`	`+};`
	`6`	`+%>`
`1`	`7`	`<divdata-controller="inputs-text-input">`
`2`	`8`	`<% if let Some(label) = label { %>`
`3`	`9`	`<labelclass="form-label"for="<%= id %>"><%+ label %></label>`
`@@ -8,7 +14,7 @@`
`8`	`14`	`id="<%= id %>"`
`9`	`15`	`type="<%= type_ %>"`
`10`	`16`	`name="<%= name %>"`
`11`		`-class="form-control"`
	`17`	`+class="<%= input_classes %>"`
`12`	`18`	`placeholder="<%= placeholder %>"`
`13`	`19`	`data-action="<%= input_actions %>"`
`14`	`20`	`autocomplete="<%= autocomplete %>"`
`@@ -20,10 +26,15 @@`
`20`	`26`
`21`	`27`	`<% if let Some(icon) = icon { %>`
`22`	`28`	`<span`
`23`		`-class="material-symbols-outlined"`
	`29`	`+class="<%= icon_classes %>"`
`24`	`30`	`data-action="<%= icon_actions %>">`
`25`	`31`	`<%= icon %>`
`26`	`32`	`</span>`
`27`	`33`	`<% } %>`
`28`	`34`	`</div>`
	`35`	`+<% if let Some(error) = error { %>`
	`36`	`+<pclass="mt-1 mb-0">`
	`37`	`+<small><%= error %></small>`
	`38`	`+</p>`
	`39`	`+<% } %>`
`29`	`40`	`</div>`

Lines changed: 10 additions & 0 deletions

Original file line number	Diff line number	Diff line change
`@@ -58,6 +58,16 @@`
`58`	`58`	`.type_("text") %>`
`59`	`59`	`</div>`
`60`	`60`
	`61`	`+<divclass="py-5">`
	`62`	`+<%+ Input::new()`
	`63`	`+ .label("What is your name?".into())`
	`64`	`+ .icon("person")`
	`65`	`+ .placeholder("Enter your name")`
	`66`	`+ .name("name")`
	`67`	`+ .type_("text")`
	`68`	`+ .error(Some("Your name is not valid.")) %>`
	`69`	`+</div>`
	`70`	`+`
`61`	`71`	`<divclass="py-5">`
`62`	`72`	`<%+ Search::new(SearchOptions {`
`63`	`73`	`name: "Model search".into(),`

Comments

(0)