diff options
Diffstat (limited to 'packages')
-rw-r--r-- | packages/forms/src/input/index.tsx | 11 | ||||
-rw-r--r-- | packages/theme/src/themes/dark/index.ts | 11 | ||||
-rw-r--r-- | packages/theme/src/themes/default/index.ts | 13 | ||||
-rw-r--r-- | packages/ui/src/infobox/index.tsx | 7 |
4 files changed, 41 insertions, 1 deletions
diff --git a/packages/forms/src/input/index.tsx b/packages/forms/src/input/index.tsx index ab1c33315..f89c91be5 100644 --- a/packages/forms/src/input/index.tsx +++ b/packages/forms/src/input/index.tsx | |||
@@ -25,6 +25,7 @@ interface IProps extends React.InputHTMLAttributes<HTMLInputElement>, IFormField | |||
25 | showPasswordToggle?: boolean; | 25 | showPasswordToggle?: boolean; |
26 | data: IData; | 26 | data: IData; |
27 | inputClassName?: string; | 27 | inputClassName?: string; |
28 | onEnterKey?: Function; | ||
28 | } | 29 | } |
29 | 30 | ||
30 | interface IState { | 31 | interface IState { |
@@ -33,7 +34,7 @@ interface IState { | |||
33 | } | 34 | } |
34 | 35 | ||
35 | class InputComponent extends Component<IProps, IState> { | 36 | class InputComponent extends Component<IProps, IState> { |
36 | public static defaultProps = { | 37 | static defaultProps = { |
37 | focus: false, | 38 | focus: false, |
38 | onChange: () => {}, | 39 | onChange: () => {}, |
39 | onBlur: () => {}, | 40 | onBlur: () => {}, |
@@ -81,6 +82,13 @@ class InputComponent extends Component<IProps, IState> { | |||
81 | } | 82 | } |
82 | } | 83 | } |
83 | 84 | ||
85 | onInputKeyPress(e: React.KeyboardEvent) { | ||
86 | if (e.key === "Enter") { | ||
87 | const { onEnterKey } = this.props; | ||
88 | onEnterKey && onEnterKey(); | ||
89 | } | ||
90 | } | ||
91 | |||
84 | render() { | 92 | render() { |
85 | const { | 93 | const { |
86 | classes, | 94 | classes, |
@@ -150,6 +158,7 @@ class InputComponent extends Component<IProps, IState> { | |||
150 | onFocus={onFocus} | 158 | onFocus={onFocus} |
151 | onBlur={onBlur} | 159 | onBlur={onBlur} |
152 | disabled={disabled} | 160 | disabled={disabled} |
161 | onKeyPress={this.onInputKeyPress.bind(this)} | ||
153 | min={min} | 162 | min={min} |
154 | max={max} | 163 | max={max} |
155 | step={step} | 164 | step={step} |
diff --git a/packages/theme/src/themes/dark/index.ts b/packages/theme/src/themes/dark/index.ts index 3a56719b2..cb7ffc1cf 100644 --- a/packages/theme/src/themes/dark/index.ts +++ b/packages/theme/src/themes/dark/index.ts | |||
@@ -63,3 +63,14 @@ export const selectSearchColor = inputBackground; | |||
63 | 63 | ||
64 | // Modal | 64 | // Modal |
65 | export const colorModalOverlayBackground = color(legacyStyles.darkThemeBlack).alpha(0.8).rgb().string(); | 65 | export const colorModalOverlayBackground = color(legacyStyles.darkThemeBlack).alpha(0.8).rgb().string(); |
66 | |||
67 | // Workspace Drawer | ||
68 | export const workspaceDrawerBackground = color(colorBackground).lighten(0.3).hex(); | ||
69 | export const workspaceDrawerAddButtonColor = legacyStyles.darkThemeGrayLighter; | ||
70 | export const workspaceDrawerAddButtonHoverColor = legacyStyles.darkThemeGraySmoke; | ||
71 | export const workspaceDrawerItemBorder = color(workspaceDrawerBackground).lighten(0.2).hex(); | ||
72 | export const workspaceDrawerItemActiveBackground = defaultStyles.brandPrimary; | ||
73 | export const workspaceDrawerItemNameColor = colorText; | ||
74 | export const workspaceDrawerItemNameActiveColor = 'white'; | ||
75 | export const workspaceDrawerServicesColor = color(colorText).darken(0.5).hex(); | ||
76 | export const workspaceDrawerServicesActiveColor = color(defaultStyles.brandPrimary).lighten(0.5).hex(); | ||
diff --git a/packages/theme/src/themes/default/index.ts b/packages/theme/src/themes/default/index.ts index 273792d46..f2632ee20 100644 --- a/packages/theme/src/themes/default/index.ts +++ b/packages/theme/src/themes/default/index.ts | |||
@@ -142,3 +142,16 @@ export const badgeBorderRadius = 50; | |||
142 | 142 | ||
143 | // Modal | 143 | // Modal |
144 | export const colorModalOverlayBackground = color('#000').alpha(0.5).rgb().string(); | 144 | export const colorModalOverlayBackground = color('#000').alpha(0.5).rgb().string(); |
145 | |||
146 | // Workspace Drawer | ||
147 | export const workspaceDrawerWidth = 300; | ||
148 | export const workspaceDrawerPadding = 20; | ||
149 | export const workspaceDrawerBackground = color(colorBackground).lighten(0.1).hex(); | ||
150 | export const workspaceDrawerAddButtonColor = legacyStyles.themeGrayLight; | ||
151 | export const workspaceDrawerAddButtonHoverColor = color(legacyStyles.themeGrayLight).lighten(0.1).hex(); | ||
152 | export const workspaceDrawerItemActiveBackground = legacyStyles.themeGrayLightest; | ||
153 | export const workspaceDrawerItemBorder = color(workspaceDrawerBackground).darken(0.05).hex(); | ||
154 | export const workspaceDrawerItemNameColor = colorText; | ||
155 | export const workspaceDrawerItemNameActiveColor = colorText; | ||
156 | export const workspaceDrawerServicesColor = color(colorText).lighten(1.5).hex(); | ||
157 | export const workspaceDrawerServicesActiveColor = workspaceDrawerServicesColor; | ||
diff --git a/packages/ui/src/infobox/index.tsx b/packages/ui/src/infobox/index.tsx index 1a442a733..9066a623e 100644 --- a/packages/ui/src/infobox/index.tsx +++ b/packages/ui/src/infobox/index.tsx | |||
@@ -11,6 +11,7 @@ interface IProps extends IWithStyle { | |||
11 | type?: string; | 11 | type?: string; |
12 | dismissable?: boolean; | 12 | dismissable?: boolean; |
13 | onDismiss?: () => void; | 13 | onDismiss?: () => void; |
14 | onUnmount?: () => void; | ||
14 | ctaOnClick?: () => void; | 15 | ctaOnClick?: () => void; |
15 | ctaLabel?: string; | 16 | ctaLabel?: string; |
16 | ctaLoading?: boolean; | 17 | ctaLoading?: boolean; |
@@ -46,6 +47,7 @@ const styles = (theme: Theme) => ({ | |||
46 | wrapper: { | 47 | wrapper: { |
47 | position: 'relative', | 48 | position: 'relative', |
48 | overflow: 'hidden', | 49 | overflow: 'hidden', |
50 | height: 'auto', | ||
49 | }, | 51 | }, |
50 | infobox: { | 52 | infobox: { |
51 | alignItems: 'center', | 53 | alignItems: 'center', |
@@ -129,6 +131,11 @@ class InfoboxComponent extends Component<IProps, IState> { | |||
129 | }, 3000); | 131 | }, 3000); |
130 | } | 132 | } |
131 | 133 | ||
134 | componentWillUnmount(): void { | ||
135 | const { onUnmount } = this.props; | ||
136 | if (onUnmount) onUnmount(); | ||
137 | } | ||
138 | |||
132 | render() { | 139 | render() { |
133 | const { | 140 | const { |
134 | classes, | 141 | classes, |