Primary button mock data
attributes:
$drupal: true
type: submit
value: Primary button
This component used the form/button
component. The styling is therefore completely done by form/button
.
src/components/fsk/form/form-element/input/input--submit
// src/components/fsk/form/form-element/input/input--submit/schema.yaml
$schema: http://json-schema.org/draft-07/schema#
$id: /fsk/form/form-element/input/input--submit
additionalProperties: false
properties:
attributes:
type: object
children:
type: string
format: html
icon:
type: string
format: html
modifiers:
type: array
items:
type: string
required:
- attributes
// src/components/fsk/form/form-element/input/input--submit/mocks.yaml
$hidden: true
attributes:
$drupal: true
type: submit
$variants:
- $name: Primary button
attributes:
value: Primary button
- $name: Primary button with icon
attributes:
value: Primary button with icon
icon: ✓
- $name: Primary disabled button
attributes:
value: Primary disabled button
disabled: true
- $name: Primary disabled button with icon
attributes:
value: Primary disabled button with icon
disabled: true
icon: ✓
- $name: Secondary button
attributes:
value: Secondary button
modifiers:
- secondary
- $name: Secondary button with icon
attributes:
value: Secondary button with icon
modifiers:
- secondary
icon: ✓
- $name: Secondary disabled button
attributes:
value: Secondary disabled button
disabled: true
modifiers:
- secondary
- $name: Secondary disabled button with icon
attributes:
value: Secondary disabled button with icon
disabled: true
modifiers:
- secondary
icon: ✓
// src/components/fsk/form/form-element/input/input--submit/input--submit.html.twig
{% include "@fsk/form/button/button.html.twig" with {
attributes: attributes,
disabled: attributes.disabled,
hidden: attributes.hidden,
icon: icon,
label: attributes.value,
modifiers: modifiers,
type: attributes.type
} only %}{{ children }}
Primary button mock data
attributes:
$drupal: true
type: submit
value: Primary button
Primary button with icon mock data
attributes:
$drupal: true
type: submit
value: Primary button with icon
icon: ✓
Primary disabled button mock data
attributes:
$drupal: true
type: submit
value: Primary disabled button
disabled: true
Primary disabled button with icon mock data
attributes:
$drupal: true
type: submit
value: Primary disabled button with icon
disabled: true
icon: ✓
Secondary button mock data
attributes:
$drupal: true
type: submit
value: Secondary button
modifiers:
- secondary
Secondary button with icon mock data
attributes:
$drupal: true
type: submit
value: Secondary button with icon
modifiers:
- secondary
icon: ✓
Secondary disabled button mock data
attributes:
$drupal: true
type: submit
value: Secondary disabled button
disabled: true
modifiers:
- secondary
Secondary disabled button with icon mock data
attributes:
$drupal: true
type: submit
value: Secondary disabled button with icon
disabled: true
modifiers:
- secondary
icon: ✓