@toptal/picasso 18.0.0 → 18.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/FormLabel/FormLabel.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React, { HTMLAttributes, ReactNode } from 'react';
|
|
2
|
-
import { BaseProps, TextLabelProps } from '@toptal/picasso-shared';
|
|
2
|
+
import { BaseProps, TextLabelProps, SizeType } from '@toptal/picasso-shared';
|
|
3
3
|
declare type ComponentType = 'label' | 'span';
|
|
4
4
|
export declare type RequiredDecoration = 'asterisk' | 'optional';
|
|
5
5
|
export interface Props extends BaseProps, TextLabelProps, HTMLAttributes<HTMLLabelElement | HTMLSpanElement> {
|
|
@@ -15,6 +15,8 @@ export interface Props extends BaseProps, TextLabelProps, HTMLAttributes<HTMLLab
|
|
|
15
15
|
inline?: boolean;
|
|
16
16
|
/** Component used for the root node */
|
|
17
17
|
as?: ComponentType;
|
|
18
|
+
/** Component size */
|
|
19
|
+
size?: SizeType<'medium' | 'large'>;
|
|
18
20
|
}
|
|
19
21
|
export declare const FormLabel: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLLabelElement>>;
|
|
20
22
|
export default FormLabel;
|
package/FormLabel/FormLabel.js
CHANGED
|
@@ -17,22 +17,23 @@ import styles from './styles';
|
|
|
17
17
|
import toTitleCase from '../utils/to-title-case';
|
|
18
18
|
const useStyles = makeStyles(styles, { name: 'PicassoFormLabel' });
|
|
19
19
|
export const FormLabel = forwardRef(function FormLabel(props, ref) {
|
|
20
|
-
const { children, disabled, htmlFor, className, style, inline, as: Component = 'label', titleCase: propsTitleCase, requiredDecoration } = props, rest = __rest(props, ["children", "disabled", "htmlFor", "className", "style", "inline", "as", "titleCase", "requiredDecoration"]);
|
|
21
|
-
const classes = useStyles();
|
|
20
|
+
const { children, disabled, htmlFor, className, style, inline, as: Component = 'label', titleCase: propsTitleCase, requiredDecoration, size = 'medium' } = props, rest = __rest(props, ["children", "disabled", "htmlFor", "className", "style", "inline", "as", "titleCase", "requiredDecoration", "size"]);
|
|
21
|
+
const classes = useStyles(props);
|
|
22
22
|
const isInline = inline || Component === 'span';
|
|
23
23
|
const titleCase = useTitleCase(propsTitleCase);
|
|
24
24
|
return (React.createElement(Component, Object.assign({}, rest, { ref: ref, htmlFor: htmlFor, className: cx(classes.root, {
|
|
25
25
|
[classes.disabled]: disabled,
|
|
26
26
|
[classes.inline]: isInline
|
|
27
27
|
}, className), style: style }),
|
|
28
|
-
|
|
29
|
-
|
|
28
|
+
React.createElement("span", { className: classes[size] },
|
|
29
|
+
requiredDecoration === 'asterisk' && (React.createElement("span", { className: classes.asterisk }, "*")),
|
|
30
30
|
titleCase ? toTitleCase(children) : children,
|
|
31
31
|
requiredDecoration === 'optional' && ' (optional)')));
|
|
32
32
|
});
|
|
33
33
|
FormLabel.defaultProps = {
|
|
34
34
|
as: 'label',
|
|
35
|
-
inline: false
|
|
35
|
+
inline: false,
|
|
36
|
+
size: 'medium'
|
|
36
37
|
};
|
|
37
38
|
FormLabel.displayName = 'FormLabel';
|
|
38
39
|
export default FormLabel;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FormLabel.js","sourceRoot":"","sources":["../../src/FormLabel/FormLabel.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAA6B,MAAM,OAAO,CAAA;AACpE,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAC5D,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,
|
|
1
|
+
{"version":3,"file":"FormLabel.js","sourceRoot":"","sources":["../../src/FormLabel/FormLabel.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAA6B,MAAM,OAAO,CAAA;AACpE,OAAO,EAAE,UAAU,EAAS,MAAM,0BAA0B,CAAA;AAC5D,OAAO,EAAE,MAAM,YAAY,CAAA;AAC3B,OAAO,EACL,YAAY,EAIb,MAAM,wBAAwB,CAAA;AAE/B,OAAO,MAAM,MAAM,UAAU,CAAA;AAC7B,OAAO,WAAW,MAAM,wBAAwB,CAAA;AAyBhD,MAAM,SAAS,GAAG,UAAU,CAAe,MAAM,EAAE,EAAE,IAAI,EAAE,kBAAkB,EAAE,CAAC,CAAA;AAEhF,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CAA0B,SAAS,SAAS,CAC7E,KAAK,EACL,GAAG;IAEH,MAAM,EACJ,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,SAAS,EACT,KAAK,EACL,MAAM,EACN,EAAE,EAAE,SAAS,GAAG,OAAO,EACvB,SAAS,EAAE,cAAc,EACzB,kBAAkB,EAClB,IAAI,GAAG,QAAQ,KAEb,KAAK,EADJ,IAAI,UACL,KAAK,EAZH,oHAYL,CAAQ,CAAA;IAET,MAAM,OAAO,GAAG,SAAS,CAAC,KAAK,CAAC,CAAA;IAEhC,MAAM,QAAQ,GAAG,MAAM,IAAI,SAAS,KAAK,MAAM,CAAA;IAC/C,MAAM,SAAS,GAAG,YAAY,CAAC,cAAc,CAAC,CAAA;IAE9C,OAAO,CACL,oBAAC,SAAS,oBACJ,IAAI,IACR,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,EAAE,CACX,OAAO,CAAC,IAAI,EACZ;YACE,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,QAAQ;YAC5B,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,QAAQ;SAC3B,EACD,SAAS,CACV,EACD,KAAK,EAAE,KAAK;QAEZ,8BAAM,SAAS,EAAE,OAAO,CAAC,IAAI,CAAC;YAC3B,kBAAkB,KAAK,UAAU,IAAI,CACpC,8BAAM,SAAS,EAAE,OAAO,CAAC,QAAQ,QAAU,CAC5C;YAEA,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ;YAC5C,kBAAkB,KAAK,UAAU,IAAI,aAAa,CAC9C,CACG,CACb,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,SAAS,CAAC,YAAY,GAAG;IACvB,EAAE,EAAE,OAAO;IACX,MAAM,EAAE,KAAK;IACb,IAAI,EAAE,QAAQ;CACf,CAAA;AAED,SAAS,CAAC,WAAW,GAAG,WAAW,CAAA;AAEnC,eAAe,SAAS,CAAA"}
|
package/FormLabel/styles.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { Theme } from '@material-ui/core/styles';
|
|
2
|
-
declare const _default: ({ palette }: Theme) => import("@material-ui/styles").StyleRules<{}, "
|
|
2
|
+
declare const _default: ({ palette }: Theme) => import("@material-ui/styles").StyleRules<{}, "medium" | "inline" | "large" | "disabled" | "root" | "asterisk">;
|
|
3
3
|
export default _default;
|
package/FormLabel/styles.js
CHANGED
|
@@ -10,23 +10,25 @@ export default ({ palette }) => createStyles({
|
|
|
10
10
|
disabled: {
|
|
11
11
|
color: alpha(palette.grey[400], 0.48)
|
|
12
12
|
},
|
|
13
|
-
|
|
14
|
-
fontSize: '0.
|
|
13
|
+
medium: {
|
|
14
|
+
fontSize: '0.875rem'
|
|
15
|
+
},
|
|
16
|
+
large: {
|
|
17
|
+
fontSize: '1rem'
|
|
15
18
|
},
|
|
16
19
|
asterisk: {
|
|
17
20
|
marginRight: '0.3125em',
|
|
18
|
-
color: palette.error.main
|
|
19
|
-
fontSize: '0.875em'
|
|
21
|
+
color: palette.error.main
|
|
20
22
|
},
|
|
21
23
|
inline: {
|
|
22
24
|
display: 'inline-block',
|
|
23
25
|
marginBottom: 0,
|
|
24
|
-
'& $
|
|
26
|
+
'& $medium': {
|
|
25
27
|
fontSize: '0.8125rem',
|
|
26
28
|
verticalAlign: 'top'
|
|
27
29
|
},
|
|
28
30
|
'& $asterisk': {
|
|
29
|
-
fontSize: '0.
|
|
31
|
+
fontSize: '0.8125rem',
|
|
30
32
|
verticalAlign: 'top'
|
|
31
33
|
}
|
|
32
34
|
}
|
package/FormLabel/styles.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/FormLabel/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAA;AAE9C,eAAe,CAAC,EAAE,OAAO,EAAS,EAAE,EAAE,CACpC,YAAY,CAAC;IACX,IAAI,EAAE;QACJ,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;QACxB,OAAO,EAAE,OAAO;QAChB,YAAY,EAAE,OAAO;QACrB,UAAU,EAAE,KAAK;KAClB;IAED,QAAQ,EAAE;QACR,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC;KACtC;IAED,
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/FormLabel/styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAA;AAE9C,eAAe,CAAC,EAAE,OAAO,EAAS,EAAE,EAAE,CACpC,YAAY,CAAC;IACX,IAAI,EAAE;QACJ,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC;QACxB,OAAO,EAAE,OAAO;QAChB,YAAY,EAAE,OAAO;QACrB,UAAU,EAAE,KAAK;KAClB;IAED,QAAQ,EAAE;QACR,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,IAAI,CAAC;KACtC;IAED,MAAM,EAAE;QACN,QAAQ,EAAE,UAAU;KACrB;IAED,KAAK,EAAE;QACL,QAAQ,EAAE,MAAM;KACjB;IAED,QAAQ,EAAE;QACR,WAAW,EAAE,UAAU;QACvB,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,IAAI;KAC1B;IAED,MAAM,EAAE;QACN,OAAO,EAAE,cAAc;QACvB,YAAY,EAAE,CAAC;QAEf,WAAW,EAAE;YACX,QAAQ,EAAE,WAAW;YACrB,aAAa,EAAE,KAAK;SACrB;QAED,aAAa,EAAE;YACb,QAAQ,EAAE,WAAW;YACrB,aAAa,EAAE,KAAK;SACrB;KACF;CACF,CAAC,CAAA"}
|