@toptal/picasso-checkbox 1.0.1 → 1.0.2
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.
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { ButtonOrAnchorProps, BaseProps, TextLabelProps } from '@toptal/picasso-shared';
|
|
2
|
-
import type { ReactNode } from 'react';
|
|
2
|
+
import type { CSSProperties, ReactNode } from 'react';
|
|
3
3
|
import React from 'react';
|
|
4
4
|
import type { RequiredDecoration } from '@toptal/picasso-form';
|
|
5
5
|
export interface Props extends BaseProps, TextLabelProps, Omit<ButtonOrAnchorProps, 'onChange'> {
|
|
@@ -13,6 +13,8 @@ export interface Props extends BaseProps, TextLabelProps, Omit<ButtonOrAnchorPro
|
|
|
13
13
|
label?: ReactNode;
|
|
14
14
|
/** The id of the input element */
|
|
15
15
|
id?: string;
|
|
16
|
+
/** Label's style */
|
|
17
|
+
labelStyle?: CSSProperties;
|
|
16
18
|
/** Whether to show asterisk or (optional) postfix for the label as a 'required' decoration */
|
|
17
19
|
requiredDecoration?: RequiredDecoration;
|
|
18
20
|
/** Callback invoked when `Checkbox` changed its value */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,mBAAmB,EACnB,SAAS,EACT,cAAc,EACf,MAAM,wBAAwB,CAAA;AAE/B,OAAO,KAAK,EAAkB,SAAS,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"Checkbox.d.ts","sourceRoot":"","sources":["../../../src/Checkbox/Checkbox.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,mBAAmB,EACnB,SAAS,EACT,cAAc,EACf,MAAM,wBAAwB,CAAA;AAE/B,OAAO,KAAK,EAAkB,aAAa,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACrE,OAAO,KAAqB,MAAM,OAAO,CAAA;AAGzC,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAA;AAM9D,MAAM,WAAW,KACf,SAAQ,SAAS,EACf,cAAc,EACd,IAAI,CAAC,mBAAmB,EAAE,UAAU,CAAC;IACvC,iCAAiC;IACjC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,wCAAwC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+DAA+D;IAC/D,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,oCAAoC;IACpC,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,kCAAkC;IAClC,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,oBAAoB;IACpB,UAAU,CAAC,EAAE,aAAa,CAAA;IAC1B,8FAA8F;IAC9F,kBAAkB,CAAC,EAAE,kBAAkB,CAAA;IACvC,yDAAyD;IACzD,QAAQ,CAAC,EAAE,CACT,KAAK,EAAE,KAAK,CAAC,WAAW,CAAC,gBAAgB,CAAC,EAC1C,OAAO,EAAE,OAAO,KACb,IAAI,CAAA;IACT,yEAAyE;IACzE,KAAK,CAAC,EAAE,MAAM,CAAA;CACf;AAED,eAAO,MAAM,QAAQ,oGAgFpB,CAAA;AAUD,eAAe,QAAQ,CAAA"}
|
|
@@ -18,7 +18,7 @@ import { FormControlLabel } from '@toptal/picasso-form';
|
|
|
18
18
|
import styles from './styles';
|
|
19
19
|
const useStyles = makeStyles(styles, { name: 'PicassoCheckbox' });
|
|
20
20
|
export const Checkbox = forwardRef(function Checkbox(props, ref) {
|
|
21
|
-
const { label, id, className, style, disabled, requiredDecoration, onChange, value, checked, indeterminate, titleCase } = props, rest = __rest(props, ["label", "id", "className", "style", "disabled", "requiredDecoration", "onChange", "value", "checked", "indeterminate", "titleCase"]);
|
|
21
|
+
const { label, id, className, style, labelStyle, disabled, requiredDecoration, onChange, value, checked, indeterminate, titleCase } = props, rest = __rest(props, ["label", "id", "className", "style", "labelStyle", "disabled", "requiredDecoration", "onChange", "value", "checked", "indeterminate", "titleCase"]);
|
|
22
22
|
const classes = useStyles();
|
|
23
23
|
const rootClasses = {
|
|
24
24
|
root: classes.root,
|
|
@@ -37,7 +37,7 @@ export const Checkbox = forwardRef(function Checkbox(props, ref) {
|
|
|
37
37
|
onMouseLeave: rest.onMouseLeave,
|
|
38
38
|
onMouseOver: rest.onMouseOver,
|
|
39
39
|
};
|
|
40
|
-
return (React.createElement(FormControlLabel, Object.assign({}, externalEventListeners, { ref: ref, classes: Object.assign(Object.assign({}, rootClasses), { label: classes.label }), control: muiCheckbox, requiredDecoration: requiredDecoration, disabled: disabled, label: label, titleCase: titleCase, className: 'picasso-checkbox', "data-private": dataPrivate })));
|
|
40
|
+
return (React.createElement(FormControlLabel, Object.assign({}, externalEventListeners, { style: labelStyle, ref: ref, classes: Object.assign(Object.assign({}, rootClasses), { label: classes.label }), control: muiCheckbox, requiredDecoration: requiredDecoration, disabled: disabled, label: label, titleCase: titleCase, className: 'picasso-checkbox', "data-private": dataPrivate })));
|
|
41
41
|
});
|
|
42
42
|
Checkbox.defaultProps = {
|
|
43
43
|
disabled: false,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/Checkbox/Checkbox.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,QAAQ,IAAI,WAAW,EAAE,MAAM,mBAAmB,CAAA;AAE3D,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AAMrD,OAAO,EAAE,MAAM,YAAY,CAAA;AAE3B,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAGvD,OAAO,MAAM,MAAM,UAAU,CAAA;AAE7B,MAAM,SAAS,GAAG,UAAU,CAAQ,MAAM,EAAE,EAAE,IAAI,EAAE,iBAAiB,EAAE,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/Checkbox/Checkbox.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@toptal/picasso-checkbox",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.2",
|
|
4
4
|
"description": "Toptal UI components library - Checkbox",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
"homepage": "https://github.com/toptal/picasso/tree/master/packages/picasso#readme",
|
|
24
24
|
"dependencies": {
|
|
25
25
|
"@toptal/picasso-container": "1.0.1",
|
|
26
|
-
"@toptal/picasso-form": "1.0
|
|
26
|
+
"@toptal/picasso-form": "1.1.0",
|
|
27
27
|
"@toptal/picasso-grid": "1.0.1",
|
|
28
28
|
"@toptal/picasso-shared": "14.0.0",
|
|
29
29
|
"@toptal/picasso-utils": "1.0.1",
|
|
@@ -7,7 +7,7 @@ import type {
|
|
|
7
7
|
TextLabelProps,
|
|
8
8
|
} from '@toptal/picasso-shared'
|
|
9
9
|
import cx from 'classnames'
|
|
10
|
-
import type { ComponentProps, ReactNode } from 'react'
|
|
10
|
+
import type { ComponentProps, CSSProperties, ReactNode } from 'react'
|
|
11
11
|
import React, { forwardRef } from 'react'
|
|
12
12
|
import { Container } from '@toptal/picasso-container'
|
|
13
13
|
import { FormControlLabel } from '@toptal/picasso-form'
|
|
@@ -31,6 +31,8 @@ export interface Props
|
|
|
31
31
|
label?: ReactNode
|
|
32
32
|
/** The id of the input element */
|
|
33
33
|
id?: string
|
|
34
|
+
/** Label's style */
|
|
35
|
+
labelStyle?: CSSProperties
|
|
34
36
|
/** Whether to show asterisk or (optional) postfix for the label as a 'required' decoration */
|
|
35
37
|
requiredDecoration?: RequiredDecoration
|
|
36
38
|
/** Callback invoked when `Checkbox` changed its value */
|
|
@@ -49,6 +51,7 @@ export const Checkbox = forwardRef<HTMLButtonElement | HTMLLabelElement, Props>(
|
|
|
49
51
|
id,
|
|
50
52
|
className,
|
|
51
53
|
style,
|
|
54
|
+
labelStyle,
|
|
52
55
|
disabled,
|
|
53
56
|
requiredDecoration,
|
|
54
57
|
onChange,
|
|
@@ -105,6 +108,7 @@ export const Checkbox = forwardRef<HTMLButtonElement | HTMLLabelElement, Props>(
|
|
|
105
108
|
return (
|
|
106
109
|
<FormControlLabel
|
|
107
110
|
{...externalEventListeners}
|
|
111
|
+
style={labelStyle}
|
|
108
112
|
ref={ref as React.ForwardedRef<HTMLLabelElement>}
|
|
109
113
|
classes={{
|
|
110
114
|
...rootClasses,
|