diff --git a/assets/javascripts/discourse/components/custom-wizard-date-input.js.es6 b/assets/javascripts/discourse/components/custom-wizard-date-input.js.es6 index 9c8e4bff..2805c370 100644 --- a/assets/javascripts/discourse/components/custom-wizard-date-input.js.es6 +++ b/assets/javascripts/discourse/components/custom-wizard-date-input.js.es6 @@ -3,6 +3,7 @@ import discourseComputed from "discourse-common/utils/decorators"; export default DateInput.extend({ useNativePicker: false, + classNameBindings: ["fieldClass"], @discourseComputed() placeholder() { diff --git a/assets/javascripts/discourse/components/custom-wizard-date-time-input.js.es6 b/assets/javascripts/discourse/components/custom-wizard-date-time-input.js.es6 index 44b675b0..1fcb62f5 100644 --- a/assets/javascripts/discourse/components/custom-wizard-date-time-input.js.es6 +++ b/assets/javascripts/discourse/components/custom-wizard-date-time-input.js.es6 @@ -2,6 +2,8 @@ import DateTimeInput from "discourse/components/date-time-input"; import discourseComputed from "discourse-common/utils/decorators"; export default DateTimeInput.extend({ + classNameBindings: ["fieldClass"], + @discourseComputed("timeFirst", "tabindex") timeTabindex(timeFirst, tabindex) { return timeFirst ? tabindex : tabindex + 1; diff --git a/assets/javascripts/discourse/components/custom-wizard-field-time.js.es6 b/assets/javascripts/discourse/components/custom-wizard-field-time.js.es6 index 82f9c68b..1406d63b 100644 --- a/assets/javascripts/discourse/components/custom-wizard-field-time.js.es6 +++ b/assets/javascripts/discourse/components/custom-wizard-field-time.js.es6 @@ -2,6 +2,8 @@ import Component from "@ember/component"; import { observes } from "discourse-common/utils/decorators"; export default Component.extend({ + classNameBindings: ["fieldClass"], + @observes("time") setValue() { this.set("field.value", this.time.format(this.field.format)); diff --git a/assets/javascripts/discourse/components/custom-wizard-field-upload.js.es6 b/assets/javascripts/discourse/components/custom-wizard-field-upload.js.es6 index eb5d318b..990d7daa 100644 --- a/assets/javascripts/discourse/components/custom-wizard-field-upload.js.es6 +++ b/assets/javascripts/discourse/components/custom-wizard-field-upload.js.es6 @@ -4,7 +4,7 @@ import { computed } from "@ember/object"; export default Component.extend(UppyUploadMixin, { classNames: ["wizard-field-upload"], - classNameBindings: ["isImage"], + classNameBindings: ["isImage", "fieldClass"], uploading: false, type: computed(function () { return `wizard_${this.field.id}`; diff --git a/assets/javascripts/discourse/components/custom-wizard-field-user-selector.js.es6 b/assets/javascripts/discourse/components/custom-wizard-field-user-selector.js.es6 index 87d5ddb0..64741c6b 100644 --- a/assets/javascripts/discourse/components/custom-wizard-field-user-selector.js.es6 +++ b/assets/javascripts/discourse/components/custom-wizard-field-user-selector.js.es6 @@ -1,3 +1,5 @@ import Component from "@ember/component"; -export default Component.extend({}); +export default Component.extend({ + classNameBindings: ["fieldClass"], +}); diff --git a/assets/javascripts/discourse/components/custom-wizard-step.js.es6 b/assets/javascripts/discourse/components/custom-wizard-step.js.es6 index b98db1ab..ee318b60 100644 --- a/assets/javascripts/discourse/components/custom-wizard-step.js.es6 +++ b/assets/javascripts/discourse/components/custom-wizard-step.js.es6 @@ -9,6 +9,7 @@ import CustomWizard, { updateCachedWizard, } from "discourse/plugins/discourse-custom-wizard/discourse/models/custom-wizard"; import { alias, not } from "@ember/object/computed"; +import discourseLater from "discourse-common/lib/later"; const alreadyWarned = {}; @@ -110,29 +111,24 @@ export default Component.extend({ }, autoFocus() { - schedule("afterRender", () => { - const $invalid = $( - ".wizard-field.invalid:nth-of-type(1) .wizard-focusable" - ); - - if ($invalid.length) { - return $invalid.focus(); - } - - $(".wizard-focusable:first").focus(); + discourseLater(() => { + schedule("afterRender", () => { + if ($(".invalid .wizard-focusable").length) { + this.animateInvalidFields(); + } else { + $(".wizard-focusable:first").focus(); + } + }); }); }, animateInvalidFields() { schedule("afterRender", () => { - let $element = $( - ".invalid input[type=text],.invalid textarea,.invalid input[type=checkbox],.invalid .select-kit" - ); - - if ($element.length) { + let $invalid = $(".invalid .wizard-focusable"); + if ($invalid.length) { $([document.documentElement, document.body]).animate( { - scrollTop: $element.offset().top - 200, + scrollTop: $invalid.offset().top - 200, }, 400 ); diff --git a/assets/javascripts/discourse/models/custom-wizard-field.js.es6 b/assets/javascripts/discourse/models/custom-wizard-field.js.es6 index a03c7c9e..2afe79d9 100644 --- a/assets/javascripts/discourse/models/custom-wizard-field.js.es6 +++ b/assets/javascripts/discourse/models/custom-wizard-field.js.es6 @@ -72,7 +72,7 @@ export default EmberObject.extend(ValidState, { valid = true; } - this.setValid(valid); + this.setValid(Boolean(valid)); return valid; }, diff --git a/assets/javascripts/discourse/templates/components/custom-wizard-date-input.hbs b/assets/javascripts/discourse/templates/components/custom-wizard-date-input.hbs index 3b776215..0f798714 100644 --- a/assets/javascripts/discourse/templates/components/custom-wizard-date-input.hbs +++ b/assets/javascripts/discourse/templates/components/custom-wizard-date-input.hbs @@ -1,11 +1,11 @@ -{{input - type=inputType +
diff --git a/assets/javascripts/discourse/templates/components/custom-wizard-field-category.hbs b/assets/javascripts/discourse/templates/components/custom-wizard-field-category.hbs index 9cce87bc..79180dc4 100644 --- a/assets/javascripts/discourse/templates/components/custom-wizard-field-category.hbs +++ b/assets/javascripts/discourse/templates/components/custom-wizard-field-category.hbs @@ -1,5 +1,6 @@ {{custom-wizard-category-selector categories=categories + class=fieldClass whitelist=field.content onChange=(action (mut categories)) tabindex=field.tabindex diff --git a/assets/javascripts/discourse/templates/components/custom-wizard-field-checkbox.hbs b/assets/javascripts/discourse/templates/components/custom-wizard-field-checkbox.hbs index 053e0218..0ceeb11b 100644 --- a/assets/javascripts/discourse/templates/components/custom-wizard-field-checkbox.hbs +++ b/assets/javascripts/discourse/templates/components/custom-wizard-field-checkbox.hbs @@ -1 +1,7 @@ -{{input type="checkbox" id=field.id checked=field.value tabindex=field.tabindex}} + diff --git a/assets/javascripts/discourse/templates/components/custom-wizard-field-composer.hbs b/assets/javascripts/discourse/templates/components/custom-wizard-field-composer.hbs index 51964a1b..2c966d24 100644 --- a/assets/javascripts/discourse/templates/components/custom-wizard-field-composer.hbs +++ b/assets/javascripts/discourse/templates/components/custom-wizard-field-composer.hbs @@ -2,6 +2,7 @@ field=field composer=composer wizard=wizard + fieldClass=fieldClass groupsMentioned=(action "groupsMentioned") cannotSeeMention=(action "cannotSeeMention") importQuote=(action "importQuote") diff --git a/assets/javascripts/discourse/templates/components/custom-wizard-field-group.hbs b/assets/javascripts/discourse/templates/components/custom-wizard-field-group.hbs index 6873f9bd..75a5b2b1 100644 --- a/assets/javascripts/discourse/templates/components/custom-wizard-field-group.hbs +++ b/assets/javascripts/discourse/templates/components/custom-wizard-field-group.hbs @@ -1,5 +1,6 @@ {{custom-wizard-group-selector groups=site.groups + class=fieldClass field=field whitelist=field.content value=field.value diff --git a/assets/javascripts/discourse/templates/components/custom-wizard-field-number.hbs b/assets/javascripts/discourse/templates/components/custom-wizard-field-number.hbs index f5d6543c..3049ab08 100644 --- a/assets/javascripts/discourse/templates/components/custom-wizard-field-number.hbs +++ b/assets/javascripts/discourse/templates/components/custom-wizard-field-number.hbs @@ -1 +1,9 @@ -{{input type="number" step="0.01" id=field.id value=field.value tabindex=field.tabindex}} + + diff --git a/assets/javascripts/discourse/templates/components/custom-wizard-field-tag.hbs b/assets/javascripts/discourse/templates/components/custom-wizard-field-tag.hbs index 90679ae7..17f68b92 100644 --- a/assets/javascripts/discourse/templates/components/custom-wizard-field-tag.hbs +++ b/assets/javascripts/discourse/templates/components/custom-wizard-field-tag.hbs @@ -1,5 +1,6 @@ {{custom-wizard-tag-chooser tags=field.value + class=fieldClass tabindex=field.tabindex tagGroups=field.tag_groups everyTag=true diff --git a/assets/javascripts/discourse/templates/components/custom-wizard-field-text.hbs b/assets/javascripts/discourse/templates/components/custom-wizard-field-text.hbs index 08733d3f..ed3f4f37 100644 --- a/assets/javascripts/discourse/templates/components/custom-wizard-field-text.hbs +++ b/assets/javascripts/discourse/templates/components/custom-wizard-field-text.hbs @@ -1 +1,8 @@ -{{input id=field.id value=field.value class=fieldClass placeholder=field.translatedPlaceholder tabindex=field.tabindex autocomplete=autocomplete}} + diff --git a/assets/javascripts/discourse/templates/components/custom-wizard-field-textarea.hbs b/assets/javascripts/discourse/templates/components/custom-wizard-field-textarea.hbs index dda299bc..1d43813e 100644 --- a/assets/javascripts/discourse/templates/components/custom-wizard-field-textarea.hbs +++ b/assets/javascripts/discourse/templates/components/custom-wizard-field-textarea.hbs @@ -1 +1,7 @@ -{{textarea id=field.id value=field.value class=fieldClass placeholder=field.translatedPlaceholder tabindex=field.tabindex}} + diff --git a/assets/javascripts/discourse/templates/components/custom-wizard-field-url.hbs b/assets/javascripts/discourse/templates/components/custom-wizard-field-url.hbs index c7e1a508..5d1c4574 100644 --- a/assets/javascripts/discourse/templates/components/custom-wizard-field-url.hbs +++ b/assets/javascripts/discourse/templates/components/custom-wizard-field-url.hbs @@ -1 +1,6 @@ -{{input type="text" id=field.id value=field.value tabindex=field.tabindex}} + diff --git a/assets/stylesheets/common/wizard/field.scss b/assets/stylesheets/common/wizard/field.scss index f710632b..71f12d84 100644 --- a/assets/stylesheets/common/wizard/field.scss +++ b/assets/stylesheets/common/wizard/field.scss @@ -32,13 +32,8 @@ body.custom-wizard { } } - &.invalid { - textarea, - input[type="text"], - input[type="checkbox"], - .select-kit { - outline: 4px solid var(--danger); - } + &.invalid .wizard-focusable { + outline: 4px solid var(--danger); } } diff --git a/plugin.rb b/plugin.rb index 55c22304..1cf51e6a 100644 --- a/plugin.rb +++ b/plugin.rb @@ -1,7 +1,7 @@ # frozen_string_literal: true # name: discourse-custom-wizard # about: Forms for Discourse. Better onboarding, structured posting, data enrichment, automated actions and much more. -# version: 2.2.16 +# version: 2.2.17 # authors: Angus McLeod, Faizaan Gagan, Robert Barrow, Keegan George, Kaitlin Maddever # url: https://github.com/paviliondev/discourse-custom-wizard # contact_emails: development@pavilion.tech