Button¶

Class Button

Output¶

Example Buttons

Twig Tag¶

Tag: UIButton
Syntax

{% UIButton Type {Parameters} %}

Type

Neutral	Make a basis Button component for any purpose
ForPrimaryAction	Make a Button component for a primary action, should be used to tell the user this is the main choice
ForSecondaryAction	Make a Button component for a secondary action, should be used to tell the user this is an second hand choice
ForPositiveAction	Make a Button component for a success action, should be used to tell the user he/she going to make a positive action/choice
ForDestructiveAction	Make a Button component for a destructive action, should be used to tell the user he/she going to make something that cannot be
AlternativeNeutral	Make a basis Button component for any purpose
ForAlternativePrimaryAction	Make a Button component for an alternative primary action, should be used to avoid the user to consider this action as the first
ForAlternativeSecondaryAction	Make a Button component for an alternative secondary action, should be used to avoid the user to focus on this
ForAlternativeValidationAction	Make a Button component for a validation action, should be used to avoid the user to focus on this
ForAlternativeDestructiveAction	Make a Button component for a destructive action, should be used to avoid the user to focus on this
ForCancel	Make a Button component for a cancel, should be used only for UI navigation, not destructive action
IconAction	@param string $sIconClasses
LinkNeutral	Make a link Button component to open an URL instead of triggering a form action
IconLink	@param string $sIconClasses
DestructiveIconLink	@param string $sIconClasses

Button Neutral¶

syntax

{% UIButton Neutral {sLabel:'value', sName:'value', sId:'value'} %}

parameters

sLabel	string	mandatory
sName	string	optional	NULL	See {@link Button::$sName}
sId	string	optional	NULL

Button ForPrimaryAction¶

syntax

{% UIButton ForPrimaryAction {sLabel:'value', sName:'value', sValue:'value', bIsSubmit:true, sId:'value'} %}

parameters

sLabel	string	mandatory
sName	string	optional	NULL	See Button::$sName
sValue	string	optional	NULL	See Button::$sValue
bIsSubmit	bool	optional	false	See Button::$sType
sId	string	optional	NULL

Button ForSecondaryAction¶

syntax

{% UIButton ForSecondaryAction {sLabel:'value', sName:'value', sValue:'value', bIsSubmit:true, sId:'value'} %}

parameters

sLabel	string	mandatory
sName	string	optional	NULL	See Button::$sName
sValue	string	optional	NULL	See Button::$sValue
bIsSubmit	bool	optional	false	See Button::$sType
sId	string	optional	NULL

Button ForPositiveAction¶

syntax

{% UIButton ForPositiveAction {sLabel:'value', sName:'value', sValue:'value', bIsSubmit:true, sId:'value'} %}

parameters

sLabel	string	mandatory
sName	string	optional	NULL	See Button::$sName
sValue	string	optional	NULL	See Button::$sValue
bIsSubmit	bool	optional	false	See Button::$sType
sId	string	optional	NULL

Button ForDestructiveAction¶

syntax

{% UIButton ForDestructiveAction {sLabel:'value', sName:'value', sValue:'value', bIsSubmit:true, sId:'value'} %}

parameters

sLabel	string	mandatory
sName	string	optional	NULL	See Button::$sName
sValue	string	optional	NULL	See Button::$sValue
bIsSubmit	bool	optional	false	See Button::$sType
sId	string	optional	NULL

Button AlternativeNeutral¶

syntax

{% UIButton AlternativeNeutral {sLabel:'value', sName:'value', sValue:'value', bIsSubmit:true, sId:'value'} %}

parameters

sLabel	string	mandatory
sName	string	optional	NULL	See Button::$sName
sValue	string	optional	NULL	See Button::$sValue
bIsSubmit	bool	optional	false	See Button::$sType
sId	string	optional	NULL

Button ForAlternativePrimaryAction¶

syntax

{% UIButton ForAlternativePrimaryAction {sLabel:'value', sName:'value', sValue:'value', bIsSubmit:true, sId:'value'} %}

parameters

sLabel	string	mandatory
sName	string	optional	NULL	See Button::$sName
sValue	string	optional	NULL	See Button::$sValue
bIsSubmit	bool	optional	false	See Button::$sType
sId	string	optional	NULL

Button ForAlternativeSecondaryAction¶

syntax

{% UIButton ForAlternativeSecondaryAction {sLabel:'value', sName:'value', sValue:'value', bIsSubmit:true, sId:'value'} %}

parameters

sLabel	string	mandatory
sName	string	optional	NULL	See Button::$sName
sValue	string	optional	NULL	See Button::$sValue
bIsSubmit	bool	optional	false	See Button::$sType
sId	string	optional	NULL

Button ForAlternativeValidationAction¶

syntax

{% UIButton ForAlternativeValidationAction {sLabel:'value', sName:'value', sValue:'value', bIsSubmit:true, sId:'value'} %}

parameters

sLabel	string	mandatory
sName	string	optional	NULL	See Button::$sName
sValue	string	optional	NULL	See Button::$sValue
bIsSubmit	bool	optional	false	See Button::$sType
sId	string	optional	NULL

Button ForAlternativeDestructiveAction¶

syntax

{% UIButton ForAlternativeDestructiveAction {sLabel:'value', sName:'value', sValue:'value', bIsSubmit:true, sId:'value'} %}

parameters

sLabel	string	mandatory
sName	string	optional	NULL	See Button::$sName
sValue	string	optional	NULL	See Button::$sValue
bIsSubmit	bool	optional	false	See Button::$sType
sId	string	optional	NULL

Button ForCancel¶

syntax

{% UIButton ForCancel {sLabel:'value', sName:'value', sValue:'value', bIsSubmit:true, sId:'value'} %}

parameters

sLabel	string	optional	NULL
sName	string	optional	NULL	See Button::$sName
sValue	string	optional	NULL	See Button::$sValue
bIsSubmit	bool	optional	false	See Button::$sType
sId	string	optional	NULL

Button IconAction¶

syntax

{% UIButton IconAction {sIconClasses:'value', sTooltipText:'value', sName:'value', sValue:'value', bIsSubmit:true, sId:'value'} %}

parameters

sIconClasses	string	mandatory
sTooltipText	string	optional	‘’
sName	string	optional	NULL
sValue	string	optional	NULL
bIsSubmit	bool	optional	false
sId	string	optional	NULL

Button LinkNeutral¶

syntax

{% UIButton LinkNeutral {sURL:'value', sLabel:'value', sIconClasses:'value', sTarget:'value', sId:'value'} %}

parameters

sURL	string	mandatory
sLabel	string	optional	‘’
sIconClasses	string	optional	NULL
sTarget	string	optional	NULL
sId	string	optional	NULL

Button IconLink¶

syntax

{% UIButton IconLink {sIconClasses:'value', sTooltipText:'value', sURL:'value', sTarget:'value', sId:'value'} %}

parameters

sIconClasses	string	mandatory
sTooltipText	string	mandatory
sURL	string	optional	‘’
sTarget	string	optional	NULL
sId	string	optional	NULL

Button DestructiveIconLink¶

syntax

{% UIButton DestructiveIconLink {sIconClasses:'value', sTooltipText:'value', sURL:'value', sName:'value', sTarget:'value', sId:'value'} %}

parameters

sIconClasses	string	mandatory
sTooltipText	string	mandatory
sURL	string	optional	NULL
sName	string	optional	NULL
sTarget	string	optional	NULL
sId	string	optional	NULL

Button common parameters¶

ActionType	string
AddCSSClass	string	CSS class to add to the generated html block
AddCSSClasses	array	like <code>[‘ibo-is-hidden’, ‘ibo-alert–body’]</code>
AddCssFileRelPath	string
AddHtml	string
AddJsFileRelPath	string
AddMultipleCssFilesRelPaths	array
AddMultipleJsFilesRelPaths	array
CSSClasses	array	like <code>[‘ibo-is-hidden’, ‘ibo-alert–body’]</code>
Color	string
DataAttributes	array	Array of data attributes in the format [‘name’ => ‘value’]
IconClass	string
IsHidden	bool	Indicates if the block is hidden by default
JsCode	string
Label	string
OnClickJsCode	string
Tooltip	string

Examples¶

No examples provided yet