feat(input): allow custom date component to be configured

If none is set we just default to the `inputComponent` aka HTML5 picker.
adfinis · Sep 14, 2022 · a5bf884 · a5bf884
1 parent 27c243b
commit a5bf884
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 0 deletions.
diff --git a/addon/components/validated-input/render.hbs b/addon/components/validated-input/render.hbs
@@ -86,6 +86,24 @@
         @update={{@update}}
         ...attributes
       />
+    {{else if (and
+      (eq @type "date") (not-eq this.dateComponent this.inputComponent)
+    )}}
+      <this.dateComponent
+        @autocomplete={{@autocomplete}}
+        @autofocus={{@autofocus}}
+        @disabled={{@disabled}}
+        @id={{@inputId}}
+        @name={{or @inputName @name}}
+        @placeholder={{@placeholder}}
+        @type={{@type}}
+        @value={{@value}}
+        @isInvalid={{@isInvalid}}
+        @isValid={{@isValid}}
+        @setDirty={{@setDirty}}
+        @update={{@update}}
+        ...attributes
+      />
     {{else}}
       <this.inputComponent
         autocomplete={{@autocomplete}}

diff --git a/addon/components/validated-input/render.js b/addon/components/validated-input/render.js
@@ -9,4 +9,5 @@ export default class RenderComponent extends Component {
   @passedOrDefault("types/radio-group") radioGroupComponent;
   @passedOrDefault("types/select") selectComponent;
   @passedOrDefault("types/textarea") textareaComponent;
+  @passedOrDefault("types/date") dateComponent;
 }
diff --git a/index.js b/index.js
@@ -58,6 +58,9 @@ module.exports = {
     this.options["@embroider/macros"].setOwnConfig["types/textarea"] =
       defaults["types/textarea"] ??
       "ember-validated-form/components/validated-input/types/textarea";
+    this.options["@embroider/macros"].setOwnConfig["types/date"] =
+      defaults["types/date"] ??
+      "ember-validated-form/components/validated-input/types/input";
   },
 
   options: {