diff --git a/addons/rose/addon/components/rose/form/helper-text.js b/addons/rose/addon/components/rose/form/helper-text.js new file mode 100644 index 000000000..399088c44 --- /dev/null +++ b/addons/rose/addon/components/rose/form/helper-text.js @@ -0,0 +1,7 @@ +import Component from '@ember/component'; +import layout from '../../../templates/components/rose/form/helper-text'; + +export default Component.extend({ + layout, + tagName: '', +}); diff --git a/addons/rose/addon/components/rose/form/helper-text.stories.mdx b/addons/rose/addon/components/rose/form/helper-text.stories.mdx new file mode 100644 index 000000000..ce556bcc5 --- /dev/null +++ b/addons/rose/addon/components/rose/form/helper-text.stories.mdx @@ -0,0 +1,28 @@ +import { Meta, Story, Preview } from '@storybook/addon-docs/blocks'; +import { hbs } from 'ember-cli-htmlbars'; +import { action } from '@storybook/addon-actions'; +import { text, boolean } from '@storybook/addon-knobs'; + + + +# Form Helper Text + +Displays helpful messages related to a form field. This component is used +by form fields and should not be used directly. + +```html + + Helper text + +``` + + + {{ + template: hbs` + + Helper text + + `, + context: {}, + }} + diff --git a/addons/rose/addon/templates/components/rose/form/helper-text.hbs b/addons/rose/addon/templates/components/rose/form/helper-text.hbs new file mode 100644 index 000000000..62f9197ee --- /dev/null +++ b/addons/rose/addon/templates/components/rose/form/helper-text.hbs @@ -0,0 +1,6 @@ + + {{yield}} + diff --git a/addons/rose/addon/templates/components/rose/form/input.hbs b/addons/rose/addon/templates/components/rose/form/input.hbs index 1a6061750..571b435b0 100644 --- a/addons/rose/addon/templates/components/rose/form/input.hbs +++ b/addons/rose/addon/templates/components/rose/form/input.hbs @@ -3,11 +3,9 @@ {{@label}} {{#if @helperText}} - + {{@helperText}} - + {{/if}} {{@label}} {{#if @helperText}} - + {{@helperText}} - + {{/if}} {{yield (hash diff --git a/addons/rose/addon/templates/components/rose/form/textarea.hbs b/addons/rose/addon/templates/components/rose/form/textarea.hbs index 96a6d8ae0..7786ace3c 100644 --- a/addons/rose/addon/templates/components/rose/form/textarea.hbs +++ b/addons/rose/addon/templates/components/rose/form/textarea.hbs @@ -3,11 +3,9 @@ {{@label}} {{#if @helperText}} - + {{@helperText}} - + {{/if}}