deps: Add ember-modifier types

CrowdStrike · Jun 28, 2023 · c1130c6 · c1130c6
1 parent 19bddc4
commit c1130c6
Show file tree

Hide file tree

Showing 4 changed files with 98 additions and 10 deletions.
diff --git a/.changeset/empty-carrots-laugh.md b/.changeset/empty-carrots-laugh.md
@@ -0,0 +1,24 @@
+---
+'@crowdstrike/ember-toucan-form': patch
+---
+
+The `ToucanForm` component now yields back `submit` and `reset` actions as the functionality was added to `ember-headless-form` [in this PR](https://github.com/CrowdStrike/ember-headless-form/pull/136).
+
+**NOTE:** Calling `submit` directly is **not** required for most cases. The implementation only requires a button tag with the `type="submit"` attribute set.
+
+```hbs
+<ToucanForm as |form|>
+  {{! This should be used for most cases }}
+  <button type='submit'>Submit</button>
+  <button {{on 'click' form.reset}} type='button'>Reset</button>
+</ToucanForm>
+```
+
+However, if you have a more complex case with submission, you can use `form.submit`.
+
+```hbs
+<ToucanForm as |form|>
+  <button {{on 'click' form.submit}} type='button'>Submit</button>
+  <button {{on 'click' form.reset}} type='button'>Reset</button>
+</ToucanForm>
+```
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/test-app/package.json b/test-app/package.json
@@ -56,6 +56,7 @@
     "@types/ember__destroyable": "^4.0.1",
     "@types/ember__engine": "^4.0.4",
     "@types/ember__error": "^4.0.2",
+    "@types/ember__modifier": "^4.0.3",
     "@types/ember__object": "^4.0.5",
     "@types/ember__polyfills": "^4.0.1",
     "@types/ember__routing": "^4.0.12",
@@ -89,8 +90,8 @@
     "ember-load-initializers": "^2.1.2",
     "ember-qunit": "^7.0.0",
     "ember-resolver": "^10.0.0",
-    "ember-source-channel-url": "^3.0.0",
     "ember-source": "~5.1.0",
+    "ember-source-channel-url": "^3.0.0",
     "ember-template-imports": "^3.1.2",
     "ember-template-lint": "^5.8.0",
     "ember-try": "^2.0.0",

diff --git a/test-app/tests/integration/components/toucan-form/toucan-form-test.gts b/test-app/tests/integration/components/toucan-form/toucan-form-test.gts
@@ -112,7 +112,11 @@ module('Integration | Component | ToucanForm', function (hooks) {
         <form.Input @label="Input" @name="name" data-name />
         <form.Input @label="Email" @name="email" data-email />
 
-        <button data-test-reset {{on "click" form.reset}}>Submit</button>
+        <button
+          type="button"
+          data-test-reset
+          {{on "click" form.reset}}
+        >Submit</button>
       </ToucanForm>
     </template>);