Fix(web-twig): Do not render input props when set to false

packages/web-twig/docs/components/DocsSection/__tests__/__fixtures__/docsSectionDefault.twig

@@ -10,7 +10,7 @@
 
 <!-- Render with all props -->
 <DocsSection
-    hasStack={false}
+    hasStack={ false }
     stackAlignment="stretch"
     tag="My tag"
     title="My Title"

packages/web-twig/src/Resources/components/Button/__tests__/__fixtures__/buttonLoadingDefault.twig

@@ -1,3 +1,3 @@
 <Button color="primary" isLoading>Loading button</Button>
 
-<Button color="primary" isLoading isDisabled={false}>Loading button should still be disabled even if isDisabled is false</Button>
+<Button color="primary" isLoading isDisabled={ false }>Loading button should still be disabled even if isDisabled is false</Button>

packages/web-twig/src/Resources/components/Button/__tests__/__fixtures__/buttonWithDisabledFalseDefault.twig

@@ -1 +1 @@
-<Button color="primary" isDisabled={false}>Not Disabled button</Button>
+<Button color="primary" isDisabled={ false }>Not Disabled button</Button>

packages/web-twig/src/Resources/components/Button/__tests__/__fixtures__/buttonWithDisabledFalsePropDefault.twig

@@ -1,2 +1,2 @@
-<Button color="primary" isDisabled={false}>Not Disabled button with boolean false prop value</Button>
+<Button color="primary" isDisabled={ false }>Not Disabled button with boolean false prop value</Button>
 <Button color="primary" isDisabled="false">Disabled button with string false prop value, should still be disabled</Button>

packages/web-twig/src/Resources/components/Button/__tests__/__fixtures__/buttonWithMainProps.twig

@@ -1,7 +1,7 @@
 {% set onClickCallback = "alert('\" test')" %}
 
-<Button id="testId" name="testName" data-main="main" aria-label="label" not-valid-prop="unexist" color="primary" onclick={onClickCallback} formtarget="_blank">button</Button>
+<Button id="testId" name="testName" data-main="main" aria-label="label" not-valid-prop="unexist" color="primary" onclick={ onClickCallback } formtarget="_blank">button</Button>
 
 {% set onClickAppend = "document.body.append('<span>hello there</span>'); return false;" %}
 
-<Button id="testId" name="testName" data-main="main" aria-label="label" not-valid-prop="unexist" color="primary" onclick={onClickAppend}>button</Button>
+<Button id="testId" name="testName" data-main="main" aria-label="label" not-valid-prop="unexist" color="primary" onclick={ onClickAppend }>button</Button>

packages/web-twig/src/Resources/components/ButtonLink/__tests__/__fixtures__/buttonLinkLoadingDefault.twig

@@ -1,3 +1,3 @@
 <ButtonLink href="#" color="primary" isLoading>Loading button link</ButtonLink>
 
-<ButtonLink href="#" color="primary" isLoading isDisabled={false}>Loading button link should still be disabled even if isDisabled is false</ButtonLink>
+<ButtonLink href="#" color="primary" isLoading isDisabled={ false }>Loading button link should still be disabled even if isDisabled is false</ButtonLink>

packages/web-twig/src/Resources/components/FileUploader/FileUploaderInput.twig

@@ -78,7 +78,7 @@
         {{ _requiredAttr }}
     />
     <div class="{{ _dropzoneClassName }}" data-spirit-element="dropZone">
-        <Icon name="{{ _iconName }}" isReusable={false} />
+        <Icon name="{{ _iconName }}" isReusable={ false } />
         <label for="{{ _id }}" class="{{ _dropzoneLabelClassName }}">
             <span {{ classProp([_linkClassName, _linkPrimaryClassName, _linkUnderlinedClassName]) }}>
                 {{- _pickAFileText -}}

packages/web-twig/src/Resources/components/FileUploader/README.md

@@ -111,7 +111,7 @@ To increase the limit for example to 20 MB, add the `maxFileSize` attribute.
 The attribute value should be given in bytes:
 
 ```twig
-<FileUploaderInput maxFileSize={20000000} />
+<FileUploaderInput maxFileSize={ 20000000 } />
 ```
 
 ### Maximum Number of Files in Queue (JavaScript)
@@ -120,7 +120,7 @@ Limit of the maximum number of uploaded files. The default value is 10, but any
 the `maxUploadedFiles` attribute:
 
 ```twig
-<FileUploaderInput maxUploadedFiles={2} />
+<FileUploaderInput maxUploadedFiles={ 2 } />
 ```
 
 ### Input Behavior When the Queue is Filled (JavaScript)
@@ -136,7 +136,7 @@ If you set the value of `queueLimitBehavior` to `disable`, the input will be dis
 `hide`, the input disappears completely. After removing a file from the queue, the input is restored.
 
 ```twig
-<FileUploaderInput maxUploadedFiles={2} queueLimitBehavior="hide" />
+<FileUploaderInput maxUploadedFiles={ 2 } queueLimitBehavior="hide" />
 ```
 
 ### Allowed File Types
@@ -210,7 +210,7 @@ To mark the input as disabled, simply add the `isDisabled` attribute:
 | `label`                 | `string`                                       | `null`                  | ✕\*      | Label text                                                            |
 | `maxFileSize`           | `number`                                       | `1000000`               | ✕        | The maximum size of the uploaded file in bytes                        |
 | `maxUploadedFiles`      | `number`                                       | `10`                    | ✕        | Maximum file upload queue size                                        |
-| `multiple`              | `bool`                                         | `false`                 | ✕        | If true, multiple files can be selected                               |
+| `multiple`              | `void`                                         | `null`                  | ✕        | If set, [multiple files can be selected][multiple-attr]               |
 | `name`                  | `string`                                       | `null`                  | ✕        | Input name                                                            |
 | `pickAFileText`         | `string`                                       | `Upload your file`      | ✕        | Text shown in the drop zone                                           |
 | `queueLimitBehavior`    | [`hide` \| `disable` \| `none`]                | `none`                  | ✕        | Input behavior when the file queue is filled                          |
@@ -342,3 +342,4 @@ This is how all subcomponents build up the complete FileUploader:
 [mdn-template]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template
 [dictionary-validation]: https://github.com/lmc-eu/spirit-design-system/blob/main/docs/DICTIONARIES.md#validation
 [escape-hatches]: https://github.com/lmc-eu/spirit-design-system/tree/main/packages/web-twig/README.md#escape-hatches
+[multiple-attr]: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/multiple

packages/web-twig/src/Resources/components/FileUploader/stories/FileUploaderInputMultipleWithFileQueueBehaviorControl.twig

@@ -6,7 +6,7 @@
         helperText="Max size of each file is 10 MB"
         id="example-input-multiple-queue-control"
         label="Label"
-        maxUploadedFiles={2}
+        maxUploadedFiles={ 2 }
         multiple
         name="example-input-multiple-queue-control"
         pickAFileText="Upload your file(s)"

packages/web-twig/src/Resources/components/FileUploader/stories/FileUploaderMetaData.twig

@@ -35,7 +35,7 @@
         label="Label"
         multiple
         name="fileUploaderWithMetaData"
-        maxUploadedFiles={1} 
+        maxUploadedFiles={ 1 }
         queueLimitBehavior="disable"
     />
     <FileUploaderList headingId="attachments-fileUploaderMetaData" id="FileUploaderListWithMetaData" />

packages/web-twig/src/Resources/components/Header/__tests__/__fixtures__/headerDialogCloseButton.twig

@@ -3,6 +3,6 @@
 <!-- Render with all props -->
 <HeaderDialogCloseButton
     dialogId="my-menu"
-    enableDismiss={false}
+    enableDismiss={ false }
     label="Close menu"
 />

packages/web-twig/src/Resources/components/Modal/README.md

@@ -119,7 +119,7 @@ You can use the `maxHeightFromTabletUp` option to override the max height on tab
 | `maxHeightFromTabletUp`       | `string`                      | `null`    | ✕        | Max height of the modal. Accepts any valid CSS value.                                                   |
 | `method`                      | [`get` \| `post` \| `dialog`] | `null`    | ✕        | `elementType="form"` only: HTTP method to use for form submission                                       |
 | `name`                        | `string`                      | `null`    | ✕        | `elementType="form"` only: Name of the form                                                             |
-| `novalidate`                  | `bool`                        | `false`   | ✕        | `elementType="form"` only: If the dialog should have validation disabled                                |
+| `novalidate`                  | `void`                        | `null`    | ✕        | `elementType="form"` only: [If the dialog should have validation disabled][novalidate-attr]             |
 | `preferredHeightFromTabletUp` | `string`                      | `null`    | ✕        | Preferred height of the modal on tablet and larger. Accepts any valid CSS value.                        |
 | `preferredHeightOnMobile`     | `string`                      | `null`    | ✕        | Preferred height of the modal on mobile. Accepts any valid CSS value.                                   |
 | `rel`                         | `string`                      | `null`    | ✕        | `elementType="form"` only: Relationship between the current document and the linked resource            |
@@ -341,6 +341,7 @@ Or, feel free to write the controlling script yourself.
 [mdn-dialog]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog
 [mdn-dialog-form]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/dialog#usage_notes
 [autocomplete-attr]: https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete
+[novalidate-attr]: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form#novalidate
 [dictionary-alignment]: https://github.com/lmc-eu/spirit-design-system/blob/main/docs/DICTIONARIES.md#alignment
 [escape-hatches]: https://github.com/lmc-eu/spirit-design-system/tree/main/packages/web-twig/README.md#escape-hatches
 [scroll-view]: https://github.com/lmc-eu/spirit-design-system/blob/main/packages/web-twig/src/Resources/components/ScrollView/README.md

packages/web-twig/src/Resources/components/Modal/__tests__/__fixtures__/modalDefault.twig

@@ -41,7 +41,7 @@
     <ModalDialog
         autocomplete="on"
         elementType="form"
-        isExpandedOnMobile={false}
+        isExpandedOnMobile={ false }
         maxHeightFromTabletUp="700px"
         method="dialog"
         preferredHeightOnMobile="400px"
@@ -51,7 +51,7 @@
     >
         <ModalHeader
             closeLabel="Close form"
-            enableDismiss={false}
+            enableDismiss={ false }
             modalId="modal-example-2"
             titleId="modal-example-2-title"
         >

packages/web-twig/src/Resources/components/Modal/stories/ModalDefault.twig

@@ -101,7 +101,7 @@
 <Modal id="example_custom_height" titleId="example_custom_height_title">
     <ModalDialog
         elementType="form"
-        isExpandedOnMobile={false}
+        isExpandedOnMobile={ false }
         maxHeightFromTabletUp="700px"
         method="dialog"
         preferredHeightOnMobile="400px"

packages/web-twig/src/Resources/components/Tag/stories/TagDefault.twig

@@ -6,8 +6,8 @@
         {% set title = 'Size ' ~ size %}
         <DocsSection title={{ title }}>
             {% for color in colors %}
-                <Tag color={color} size={size} isSubtle>Tag {{ color }}</Tag>
-                <Tag color={color} size={size}>Tag {{ color }}</Tag>
+                <Tag color={ color } size={ size } isSubtle>Tag {{ color }}</Tag>
+                <Tag color={ color } size={ size }>Tag {{ color }}</Tag>
             {% endfor %}
         </DocsSection>
     {% endfor %}