superdesk-ui-framework 3.0.1-beta.2 → 3.0.1-beta.22

package/app-typescript/components/TimePicker.tsx

@@ -1,30 +1,53 @@
 import * as React from 'react';
+import nextId from "react-id-generator";
+import { InputWrapper } from './Form';
 
 interface IProps {
     value: string; // will output time as ISO8601 time string(e.g. 16:55) or an empty string if there's no value
     onChange(valueNext: string): void;
-    required?: boolean; // displays a button to reset time input
+    allowSeconds?: boolean;
     disabled?: boolean;
+    inlineLabel?: boolean;
+    required?: boolean;
+    fullWidth?: boolean;
+    invalid?: boolean;
+    labelHidden?: boolean;
+    tabindex?: number;
+    label?: string;
+    info?: string;
+    error?: string;
 }
 
 export class TimePicker extends React.PureComponent<IProps> {
+    private htmlId = nextId();
+
     render() {
         return (
-            <div
-                className="sd-input sd-input--no-label sd-input--no-margin"
-                style={{display: 'inline-flex'}}
-            >
+            <InputWrapper
+            label={this.props.label}
+            error={this.props.error}
+            required={this.props.required}
+            disabled={this.props.disabled}
+            invalid={this.props.invalid}
+            info={this.props.info}
+            inlineLabel={this.props.inlineLabel}
+            labelHidden={this.props.labelHidden}
+            fullWidth={this.props.fullWidth}
+            htmlId={this.htmlId}
+            tabindex={this.props.tabindex}>
                 <input
-                    type="time"
-                    className="sd-input__input"
-                    value={this.props.value}
-                    required={this.props.required}
-                    disabled={this.props.disabled}
-                    onChange={(event) => {
-                        this.props.onChange(event.target.value);
-                    }}
-                />
-            </div>
+                id={this.htmlId}
+                aria-labelledby={this.htmlId + 'label'}
+                type="time"
+                step={this.props.allowSeconds ? 1 : undefined}
+                className="sd-input__input"
+                value={this.props.value}
+                required={this.props.required}
+                disabled={this.props.disabled}
+                onChange={(event) => {
+                    this.props.onChange(event.target.value);
+                }}/>
+            </InputWrapper>
         );
     }
 }

package/app-typescript/components/Togglebox.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import classNames from 'classnames';
 import nextId from "react-id-generator";
 

package/app-typescript/components/Tooltip.tsx

@@ -5,13 +5,15 @@ interface IProps {
     text: string;
     flow?: 'top' | 'left' | 'right' | 'down'; // defaults to 'top'
     appendToBody?: boolean;
+    disabled?: boolean;
 }
 
-export const Tooltip: React.FC<IProps>  = ({appendToBody, children, ...otherProps}) =>
-    appendToBody ?
-    <TooltipAppended {...otherProps}>{children}</TooltipAppended>
-    :
-    <TooltipBasic {...otherProps}>{children}</TooltipBasic>;
+export const Tooltip: React.FC<IProps>  = ({appendToBody, children, disabled, ...otherProps}) =>
+    disabled
+    ? <React.Fragment>{children}</React.Fragment>
+    : appendToBody
+        ? <TooltipAppended {...otherProps}>{children}</TooltipAppended>
+        : <TooltipBasic {...otherProps}>{children}</TooltipBasic>;
 
 class TooltipBasic extends React.PureComponent<IProps> {
     htmlId = nextId();