Merge branch 'master' into feature/input-file

web/ASC.Web.Components/src/components/field-container/README.md

@@ -28,6 +28,7 @@ import { FieldContainer } from "asc-web-components";
 | `isRequired`              |      `bool`       |    -     |   -    |  `false`  | Indicates that the field is required to fill     |
 | `isVertical`              |      `bool`       |    -     |   -    |  `false`  | Vertical or horizontal alignment                 |
 | `labelText`               |     `string`      |    -     |   -    |     -     | Field label text                                 |
+| `labelVisible`            |     `bool`        |    -     |   -    |  `true`   | Sets visibility of field label section            |
 | `maxLabelWidth`           |     `string`      |    -     |   -    |  `110px`  | Max label width in horizontal alignment          |
 | `style`                   |  `obj`, `array`   |    -     |   -    |     -     | Accepts css style                                |
 | `tooltipContent`          | `object`,`string` |    -     |   -    |     -     | Tooltip content                                  |

web/ASC.Web.Components/src/components/field-container/field-container.stories.js

@@ -25,6 +25,7 @@ storiesOf("Components|FieldContainer", module)
               isVertical={boolean("isVertical", false)}
               isRequired={boolean("isRequired", false)}
               hasError={boolean("hasError", false)}
+              labelVisible={boolean("labelVisible", true)}
               labelText={text("labelText", "Name:")}
               maxLabelWidth={text("maxLabelWidth", "110px")}
               tooltipContent={text("tooltipContent", "Paste you tooltip content here")}

web/ASC.Web.Components/src/components/field-container/index.js

@@ -91,6 +91,7 @@ class FieldContainer extends React.Component {
       style,
       isRequired,
       hasError,
+      labelVisible,
       labelText,
       children,
       tooltipContent,
@@ -111,22 +112,24 @@ class FieldContainer extends React.Component {
         style={style}
         maxwidth={errorMessageWidth}
       >
-        <div className="field-label-icon">
-          <Label
-            isRequired={isRequired}
-            error={hasError}
-            text={labelText}
-            truncate={true}
-            className="field-label"
-          />
-          {tooltipContent && (
-            <HelpButton
-              tooltipContent={tooltipContent}
-              place={place}
-              helpButtonHeaderContent={helpButtonHeaderContent}
+        {labelVisible &&
+          <div className="field-label-icon">
+            <Label
+              isRequired={isRequired}
+              error={hasError}
+              text={labelText}
+              truncate={true}
+              className="field-label"
             />
-          )}
-        </div>
+            {tooltipContent && (
+              <HelpButton
+                tooltipContent={tooltipContent}
+                place={place}
+                helpButtonHeaderContent={helpButtonHeaderContent}
+              />
+            )}
+          </div>
+        }
         <div className="field-body">
           {children}
           {hasError ? (
@@ -147,6 +150,7 @@ FieldContainer.propTypes = {
   className: PropTypes.string,
   isRequired: PropTypes.bool,
   hasError: PropTypes.bool,
+  labelVisible: PropTypes.bool,
   labelText: PropTypes.string,
   icon: PropTypes.string,
   children: PropTypes.oneOfType([
@@ -166,6 +170,7 @@ FieldContainer.propTypes = {
 
 FieldContainer.defaultProps = {
   place: "bottom",
+  labelVisible: true,
   maxLabelWidth: "110px",
   errorColor: "#C96C27",
   errorMessageWidth: "293px"