items below.",
+ "arrayOptions": [
+ {
+ "name": "id",
+ "type": "string",
+ "description": "Specific id attribute for the checkbox item. If omitted, then component global idPrefix option will be applied."
+ },
+ {
+ "name": "contentText",
+ "type": "string",
+ "description": "Required. If contentHTML is set, this is not required. Text to use within each checkbox item label. If contentHTML is provided, the contentText argument will be ignored."
+ },
+ {
+ "name": "contentHTML",
+ "type": "string",
+ "description": "Required. If contentText is set, this is not required. HTML to use within each checkbox item label. If contentHTML is provided, the contentText argument will be ignored."
+ },
+ {
+ "name": "value",
+ "type": "string",
+ "description": "Required. Value for the checkbox input."
+ },
+ {
+ "name": "checked",
+ "type": "boolean",
+ "description": "If true, checkbox will be checked."
+ },
+ {
+ "name": "disabled",
+ "type": "boolean",
+ "description": "If true, checkbox will be disabled."
+ }
+ ]
+ },
+ {
+ "name": "hint",
+ "type": "object",
+ "description": "Options for the hint component (e.g. text). See hint options below.",
+ "arrayOptions": [
+ {
+ "name": "id",
+ "type": "string",
+ "description": "Optional id attribute to add to the hint span tag."
+ },
+ {
+ "name": "contentText",
+ "type": "string",
+ "description": "Required. If contentHTML is set, this is not required. Text to use within the hint. If contentHTML is provided, the contentText argument will be ignored."
+ },
+ {
+ "name": "contentHTML",
+ "type": "string",
+ "description": "Required. If contentText is set, this is not required. HTML to use within the hint. If contentHTML is provided, the contentText argument will be ignored."
+ },
+ {
+ "name": "classes",
+ "type": "string",
+ "description": "Classes to add to the hint span tag."
+ }
+ ]
+ },
+ {
+ "name": "idPrefix",
+ "type": "string",
+ "description": "String to prefix id for each checkbox item if no id is specified on each item. If not passed, fall back to using the name option instead."
+ },
+ {
+ "name": "name",
+ "type": "string",
+ "description": "Required. Name attribute for all checkbox items."
+ },
+ {
+ "name": "classes",
+ "type": "string",
+ "description": "Classes to add to the checkboxes container."
+ },
+ {
+ "name": "error",
+ "type": "boolean",
+ "description": "If true, errorMessage will show. Defaults to false."
+ },
+ {
+ "name": "errorMessage",
+ "type": "object",
+ "description": "Options for the error message component. See errorMessage options below.",
+ "arrayOptions": [
+ {
+ "name": "id",
+ "type": "string",
+ "description": "Id attribute to add to the error message span tag."
+ },
+ {
+ "name": "contentText",
+ "type": "string",
+ "description": "Required. Text to use within the error message. If contentHTML is supplied, this is ignored."
+ },
+ {
+ "name": "contentHTML",
+ "type": "string",
+ "description": "Required. HTML to use within the error message"
+ },
+ {
+ "name": "classes",
+ "type": "string",
+ "description": "Classes to add to the error message span tag."
+ }
+ ]
+ }
+ ]
+}
diff --git a/src/wmnds/components/form-elements/number-input/_example.njk b/src/wmnds/components/form-elements/number-input/_example.njk
new file mode 100644
index 000000000..dc5ad40d8
--- /dev/null
+++ b/src/wmnds/components/form-elements/number-input/_example.njk
@@ -0,0 +1,27 @@
+{% raw %}
+{% from "wmnds/components/form-elements/number-input/_number-input.njk" import wmndsNumberInput %}
+
+{{
+ wmndsNumberInput({
+ id: "example-number-input",
+ name: "example-number-input",
+ required: true,
+ classes: null,
+ error: false,
+ errorMessage: {
+ id: null,
+ contentText: "Custom error message for this example input",
+ contentHTML: null,
+ classes: null
+ },
+ disabled: false,
+ placeholder: "1",
+ value: "",
+ label: {
+ contentText: 'Search radius',
+ classes: 'wmnds-h4'
+ }
+ })
+}}
+
+{% endraw %}
diff --git a/src/wmnds/components/form-elements/number-input/_number-input.njk b/src/wmnds/components/form-elements/number-input/_number-input.njk
new file mode 100644
index 000000000..a8115b49c
--- /dev/null
+++ b/src/wmnds/components/form-elements/number-input/_number-input.njk
@@ -0,0 +1,110 @@
+{% macro wmndsNumberInput(params) %}
+
+{# Imports #}
+{% from "wmnds/components/icon/_icon.njk" import wmndsIcon %}
+{% from "wmnds/components/form-elements/form-label/_form-label.njk" import wmndsFormLabel %}
+{% from "wmnds/components/form-elements/error-message/_error-message.njk" import wmndsFeErrorMessage %}
+
+{# Params #}
+{% set id = params.id if params.id else "input" %}
+{% set name = params.name if params.name else id %}
+{% set type = params.type if params.type else "text" %}
+{% set required = params.required if params.required else false %}
+{% set classes = " " + params.classes if params.classes %} {# set paramClass to params.classNames if any #}
+{# Error Message Params #}
+{% set groupErrorClass = " wmnds-fe-group--error" if params.error %}
+{% set inputErrorClass = " wmnds-fe-input--error" if params.error %}
+{% set errorContentText = params.errorMessage.contentText if params.errorMessage.contentText else "Please enter a value" %}
+{% set errorContentHTML = params.errorMessage.contentHTML if params.errorMessage.contentHTML else null %}
+{% set errorClasses = " " + params.errorMessage.classes if params.errorMessage.classes else null %}
+{% set errorId = params.errorMessage.id if params.errorMessage.id else null %}
+{% set disabled = params.disabled if params.disabled else null %}
+{% set maxLength = params.maxLength if params.maxLength else null %}
+{% set placeholder = params.placeholder if params.placeholder else null %}
+{% set value = params.value if params.value else "" %}
+{# Params of label #}
+{% set labelContentText = params.label.contentText if params.label.contentText else "Form label" %}
+{% set labelContentHTML = params.label.contentHTML if params.label.contentHTML else null %}
+{% set labelClasses = params.label.classes if params.label.classes else null %}
+{# Params of formGroup #}
+{% set formGroupClasses = " " + params.formGroup.classes if params.formGroup.classes else null %}
+
+false."
+ },
+ {
+ "name": "classes",
+ "type": "string",
+ "description": "Classes to add to the input component."
+ },
+ {
+ "name": "error",
+ "type": "boolean",
+ "description": "If true, error will be displayed. Defaults to false."
+ },
+ {
+ "name": "errorMessage",
+ "type": "object",
+ "description": "Options for the error message component. See errorMessage.",
+ "arrayOptions": [
+ {
+ "name": "id",
+ "type": "string",
+ "description": "Id attribute to add to the error message span tag."
+ },
+ {
+ "name": "contentText",
+ "type": "string",
+ "description": "Required. Text to use within the error message. If contentHTML is supplied, this is ignored."
+ },
+ {
+ "name": "contentHTML",
+ "type": "string",
+ "description": "Required. HTML to use within the error message. If contentHTML is provided, the contentText argument will be ignored."
+ },
+ {
+ "name": "classes",
+ "type": "string",
+ "description": "Classes to add to the error message span tag."
+ }
+ ]
+ },
+ {
+ "name": "disabled",
+ "type": "boolean",
+ "description": "If true, input should be disabled. Defaults to false."
+ },
+ {
+ "name": "placeholder",
+ "type": "string",
+ "description": "Placeholder is a short hint that describes the expected value of a input. It's an optional field."
+ },
+ {
+ "name": "value",
+ "type": "string",
+ "description": "Optional initial value of the input."
+ },
+ {
+ "name": "label",
+ "type": "object",
+ "description": "Required. Options for the label component. See label.",
+ "arrayOptions": [
+ {
+ "name": "contentText",
+ "type": "string",
+ "description": "Required. If contentHTML is set, this is not required. Text to use within the label. If contentHTML is provided, the contentText argument will be ignored."
+ },
+ {
+ "name": "contentHTML",
+ "type": "string",
+ "description": "Required. If contentText is set, this is not required. HTML to use within the label. If contentHTML is provided, the contentText argument will be ignored."
+ },
+ {
+ "name": "classes",
+ "type": "string",
+ "description": "Classes to add to the label tag."
+ }
+ ]
+ },
+ {
+ "name": "formGroup",
+ "type": "object",
+ "description": "Options for the form-group wrapper. See formGroup options below.",
+ "arrayOptions": [
+ {
+ "name": "classes",
+ "type": "string",
+ "description": "Classes to add to the form group (e.g. to show error state for the whole group)"
+ }
+ ]
+ }
+ ]
+}
diff --git a/src/wmnds/components/phase-indicator/_phase-indicator.njk b/src/wmnds/components/phase-indicator/_phase-indicator.njk
index 5a235d4e1..e39f7d015 100644
--- a/src/wmnds/components/phase-indicator/_phase-indicator.njk
+++ b/src/wmnds/components/phase-indicator/_phase-indicator.njk
@@ -1,5 +1,7 @@
{% macro wmndsPhaseIndicator(params) %}
+{% set indicatorText = params.indicatorText if params.indicatorText else "Beta" %}
+
Beta
diff --git a/src/wmnds/components/sign-in/_sign-in.scss b/src/wmnds/components/sign-in/_sign-in.scss
index 13647471e..106a54374 100644
--- a/src/wmnds/components/sign-in/_sign-in.scss
+++ b/src/wmnds/components/sign-in/_sign-in.scss
@@ -9,6 +9,10 @@
font-weight: 700;
text-decoration: none;
+ .wmnds-btn__icon {
+ vertical-align: top;
+ }
+
&:hover {
text-decoration: underline;
}
diff --git a/src/wmnds/patterns/autocomplete/_autocomplete.njk b/src/wmnds/patterns/autocomplete/_autocomplete.njk
index acd5c7393..e6c6bcd68 100644
--- a/src/wmnds/patterns/autocomplete/_autocomplete.njk
+++ b/src/wmnds/patterns/autocomplete/_autocomplete.njk
@@ -17,6 +17,7 @@
{% set selectedItem = params.selectedItem if params.selectedItem else 'Selected item' %}
{# Label #}
+{% if not params.hideLabel %}
{{
wmndsFormLabel({
for: id,
@@ -24,6 +25,7 @@
classes: params.label.classes
})
}}
+{% endif %}
{% if params.selected %}