@chayns-components/core 5.0.0-beta.359 → 5.0.0-beta.360
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.
|
@@ -12,6 +12,10 @@ export type CheckboxProps = {
|
|
|
12
12
|
* Disables the checkbox or switch so it cannot be toggled
|
|
13
13
|
*/
|
|
14
14
|
isDisabled?: boolean;
|
|
15
|
+
/**
|
|
16
|
+
* Classname for the label
|
|
17
|
+
*/
|
|
18
|
+
labelClassName?: string;
|
|
15
19
|
/**
|
|
16
20
|
* Function to be executed if the checked value changes
|
|
17
21
|
*/
|
|
@@ -15,6 +15,7 @@ const Checkbox = _ref => {
|
|
|
15
15
|
children,
|
|
16
16
|
isChecked,
|
|
17
17
|
isDisabled,
|
|
18
|
+
labelClassName,
|
|
18
19
|
onChange,
|
|
19
20
|
shouldShowAsSwitch,
|
|
20
21
|
shouldShowCentered = false
|
|
@@ -37,6 +38,7 @@ const Checkbox = _ref => {
|
|
|
37
38
|
onChange: handleChange,
|
|
38
39
|
type: "checkbox"
|
|
39
40
|
}), /*#__PURE__*/_react.default.createElement(_Checkbox.StyledCheckboxLabel, {
|
|
41
|
+
className: labelClassName,
|
|
40
42
|
htmlFor: uuid,
|
|
41
43
|
isChecked: isChecked ?? isActive,
|
|
42
44
|
isDisabled: isDisabled,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.js","names":["_react","_interopRequireWildcard","require","_uuid","_calculate","_Checkbox","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","Checkbox","_ref","children","isChecked","isDisabled","onChange","shouldShowAsSwitch","shouldShowCentered","isActive","setIsActive","useState","handleChange","useCallback","event","target","checked","preventDefault","stopPropagation","uuid","useUuid","lineHeight","useMemo","undefined","getHeightOfSingleTextLine","createElement","StyledCheckbox","StyledCheckboxInput","disabled","id","type","StyledCheckboxLabel","htmlFor","displayName","_default","exports"],"sources":["../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n ChangeEventHandler,\n FC,\n ReactElement,\n useCallback,\n useMemo,\n useState,\n} from 'react';\nimport { useUuid } from '../../hooks/uuid';\nimport { getHeightOfSingleTextLine } from '../../utils/calculate';\nimport { StyledCheckbox, StyledCheckboxInput, StyledCheckboxLabel } from './Checkbox.styles';\n\nexport type CheckboxProps = {\n /**\n * Text for checkbox or switch\n */\n children?: ReactElement;\n /**\n * Indicates whether the checkbox or switch is selected\n */\n isChecked?: boolean;\n /**\n * Disables the checkbox or switch so it cannot be toggled\n */\n isDisabled?: boolean;\n /**\n * Function to be executed if the checked value changes\n */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Changes the design to use switch instead of checkbox\n */\n shouldShowAsSwitch?: boolean;\n /**\n * Whether the Checkbox should be displayed centered to the label or at the top\n */\n shouldShowCentered?: boolean;\n};\n\nconst Checkbox: FC<CheckboxProps> = ({\n children,\n isChecked,\n isDisabled,\n onChange,\n shouldShowAsSwitch,\n shouldShowCentered = false,\n}) => {\n const [isActive, setIsActive] = useState(isChecked ?? false);\n\n const handleChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n setIsActive(event.target.checked);\n\n event.preventDefault();\n event.stopPropagation();\n\n if (typeof onChange === 'function') {\n onChange(event);\n }\n },\n [onChange],\n );\n\n const uuid = useUuid();\n\n const lineHeight = useMemo(\n () => (shouldShowCentered ? undefined : getHeightOfSingleTextLine()),\n [shouldShowCentered],\n );\n\n return (\n <StyledCheckbox>\n <StyledCheckboxInput\n checked={isChecked}\n disabled={isDisabled}\n id={uuid}\n onChange={handleChange}\n type=\"checkbox\"\n />\n <StyledCheckboxLabel\n htmlFor={uuid}\n isChecked={isChecked ?? isActive}\n isDisabled={isDisabled}\n shouldShowAsSwitch={shouldShowAsSwitch}\n lineHeight={lineHeight}\n >\n {children}\n </StyledCheckboxLabel>\n </StyledCheckbox>\n );\n};\n\nCheckbox.displayName = 'Checkbox';\n\nexport default Checkbox;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AASA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAF,OAAA;AACA,IAAAG,SAAA,GAAAH,OAAA;AAA6F,SAAAI,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAN,wBAAAM,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAc,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAgB,GAAA,CAAAnB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;
|
|
1
|
+
{"version":3,"file":"Checkbox.js","names":["_react","_interopRequireWildcard","require","_uuid","_calculate","_Checkbox","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","Checkbox","_ref","children","isChecked","isDisabled","labelClassName","onChange","shouldShowAsSwitch","shouldShowCentered","isActive","setIsActive","useState","handleChange","useCallback","event","target","checked","preventDefault","stopPropagation","uuid","useUuid","lineHeight","useMemo","undefined","getHeightOfSingleTextLine","createElement","StyledCheckbox","StyledCheckboxInput","disabled","id","type","StyledCheckboxLabel","className","htmlFor","displayName","_default","exports"],"sources":["../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n ChangeEventHandler,\n FC,\n ReactElement,\n useCallback,\n useMemo,\n useState,\n} from 'react';\nimport { useUuid } from '../../hooks/uuid';\nimport { getHeightOfSingleTextLine } from '../../utils/calculate';\nimport { StyledCheckbox, StyledCheckboxInput, StyledCheckboxLabel } from './Checkbox.styles';\n\nexport type CheckboxProps = {\n /**\n * Text for checkbox or switch\n */\n children?: ReactElement;\n /**\n * Indicates whether the checkbox or switch is selected\n */\n isChecked?: boolean;\n /**\n * Disables the checkbox or switch so it cannot be toggled\n */\n isDisabled?: boolean;\n /**\n * Classname for the label\n */\n labelClassName?: string;\n /**\n * Function to be executed if the checked value changes\n */\n onChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Changes the design to use switch instead of checkbox\n */\n shouldShowAsSwitch?: boolean;\n /**\n * Whether the Checkbox should be displayed centered to the label or at the top\n */\n shouldShowCentered?: boolean;\n};\n\nconst Checkbox: FC<CheckboxProps> = ({\n children,\n isChecked,\n isDisabled,\n labelClassName,\n onChange,\n shouldShowAsSwitch,\n shouldShowCentered = false,\n}) => {\n const [isActive, setIsActive] = useState(isChecked ?? false);\n\n const handleChange = useCallback(\n (event: ChangeEvent<HTMLInputElement>) => {\n setIsActive(event.target.checked);\n\n event.preventDefault();\n event.stopPropagation();\n\n if (typeof onChange === 'function') {\n onChange(event);\n }\n },\n [onChange],\n );\n\n const uuid = useUuid();\n\n const lineHeight = useMemo(\n () => (shouldShowCentered ? undefined : getHeightOfSingleTextLine()),\n [shouldShowCentered],\n );\n\n return (\n <StyledCheckbox>\n <StyledCheckboxInput\n checked={isChecked}\n disabled={isDisabled}\n id={uuid}\n onChange={handleChange}\n type=\"checkbox\"\n />\n <StyledCheckboxLabel\n className={labelClassName}\n htmlFor={uuid}\n isChecked={isChecked ?? isActive}\n isDisabled={isDisabled}\n shouldShowAsSwitch={shouldShowAsSwitch}\n lineHeight={lineHeight}\n >\n {children}\n </StyledCheckboxLabel>\n </StyledCheckbox>\n );\n};\n\nCheckbox.displayName = 'Checkbox';\n\nexport default Checkbox;\n"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chayns-components/core",
|
|
3
|
-
"version": "5.0.0-beta.
|
|
3
|
+
"version": "5.0.0-beta.360",
|
|
4
4
|
"description": "A set of beautiful React components for developing your own applications with chayns.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"chayns",
|
|
@@ -70,5 +70,5 @@
|
|
|
70
70
|
"publishConfig": {
|
|
71
71
|
"access": "public"
|
|
72
72
|
},
|
|
73
|
-
"gitHead": "
|
|
73
|
+
"gitHead": "fbb1d1316a8b6a97098f7f980e30f3281e8fbff9"
|
|
74
74
|
}
|