@schrodinger/ui-checkbox
Advanced tools
Comparing version 0.0.11 to 1.0.0
@@ -12,13 +12,2 @@ 'use strict'; | ||
var Theme; | ||
(function (Theme) { | ||
Theme["LIGHT"] = "light"; | ||
Theme["DARK"] = "dark"; | ||
})(Theme || (Theme = {})); | ||
var UIContext = /*#__PURE__*/React.createContext({ | ||
theme: Theme.LIGHT | ||
}); | ||
function _typeof(obj) { | ||
@@ -40,2 +29,28 @@ "@babel/helpers - typeof"; | ||
function _defineProperty(obj, key, value) { | ||
if (key in obj) { | ||
Object.defineProperty(obj, key, { | ||
value: value, | ||
enumerable: true, | ||
configurable: true, | ||
writable: true | ||
}); | ||
} else { | ||
obj[key] = value; | ||
} | ||
return obj; | ||
} | ||
var Theme; | ||
(function (Theme) { | ||
Theme["LIGHT"] = "light"; | ||
Theme["DARK"] = "dark"; | ||
})(Theme || (Theme = {})); | ||
var UIContext = /*#__PURE__*/React.createContext({ | ||
theme: Theme.LIGHT | ||
}); | ||
function toVal(mix) { | ||
@@ -123,24 +138,50 @@ var k, | ||
exports.CheckboxType = void 0; | ||
(function (CheckboxType) { | ||
CheckboxType["TICK"] = "tick"; | ||
CheckboxType["SWITCH"] = "switch"; | ||
CheckboxType["RADIO"] = "radio"; | ||
CheckboxType["INVERSION"] = "inversion"; | ||
CheckboxType["TICK"] = "tick"; | ||
CheckboxType["SWITCH"] = "switch"; | ||
CheckboxType["RADIO"] = "radio"; | ||
CheckboxType["INVERSION"] = "inversion"; | ||
})(exports.CheckboxType || (exports.CheckboxType = {})); | ||
const Checkbox = React__default['default'].memo((props) => (React__default['default'].createElement(UIContext.Consumer, null, (context) => { | ||
const children = props.children && (React__default['default'].createElement("span", { className: textClassNames() }, props.children)); | ||
return (React__default['default'].createElement("label", { className: labelClassNames(props, context), title: props.title }, | ||
React__default['default'].createElement("input", { checked: props.checked === true, type: props.type === exports.CheckboxType.RADIO ? 'radio' : 'checkbox', name: props.name, value: props.value, "data-name": props.name, onChange: props.onChange, disabled: props.disabled, readOnly: props.readonly || !lodash.isFunction(props.onChange) }), | ||
React__default['default'].createElement("span", { className: checkmarkClassNames(props) }), | ||
children)); | ||
}))); | ||
const labelClassNames = (props, context) => clsx(props.className, styles.Checkbox, styles[props.theme || context.theme || Theme.LIGHT], { | ||
[styles.disabled]: props.disabled | ||
var Checkbox = /*#__PURE__*/React__default["default"].memo(function (props) { | ||
return /*#__PURE__*/React__default["default"].createElement(UIContext.Consumer, null, function (context) { | ||
var children = props.children && /*#__PURE__*/React__default["default"].createElement("span", { | ||
className: textClassNames() | ||
}, props.children); | ||
return /*#__PURE__*/React__default["default"].createElement("label", { | ||
className: labelClassNames(props, context), | ||
title: props.title | ||
}, /*#__PURE__*/React__default["default"].createElement("input", { | ||
checked: props.checked === true, | ||
type: props.type === exports.CheckboxType.RADIO ? 'radio' : 'checkbox', | ||
name: props.name, | ||
value: props.value, | ||
"data-name": props.name, | ||
onChange: props.onChange, | ||
disabled: props.disabled, | ||
readOnly: props.readonly || !lodash.isFunction(props.onChange) | ||
}), /*#__PURE__*/React__default["default"].createElement("span", { | ||
className: checkmarkClassNames(props) | ||
}), children); | ||
}); | ||
}); | ||
const checkmarkClassNames = ({ type = exports.CheckboxType.TICK, checked }) => clsx(styles.checkmark, styles[type], { | ||
[styles.checked]: checked === true, | ||
[styles.indeterminate]: checked === null, | ||
}); | ||
const textClassNames = () => clsx(styles.text); | ||
var labelClassNames = function labelClassNames(props, context) { | ||
return clsx(props.className, styles.Checkbox, styles[props.theme || context.theme || Theme.LIGHT], _defineProperty({}, styles.disabled, props.disabled)); | ||
}; | ||
var checkmarkClassNames = function checkmarkClassNames(_ref) { | ||
var _clsx2; | ||
var _ref$type = _ref.type, | ||
type = _ref$type === void 0 ? exports.CheckboxType.TICK : _ref$type, | ||
checked = _ref.checked; | ||
return clsx(styles.checkmark, styles[type], (_clsx2 = {}, _defineProperty(_clsx2, styles.checked, checked === true), _defineProperty(_clsx2, styles.indeterminate, checked === null), _clsx2)); | ||
}; | ||
var textClassNames = function textClassNames() { | ||
return clsx(styles.text); | ||
}; | ||
exports.Checkbox = Checkbox; |
import React, { createContext } from 'react'; | ||
import { isFunction } from 'lodash'; | ||
var Theme; | ||
(function (Theme) { | ||
Theme["LIGHT"] = "light"; | ||
Theme["DARK"] = "dark"; | ||
})(Theme || (Theme = {})); | ||
var UIContext = /*#__PURE__*/createContext({ | ||
theme: Theme.LIGHT | ||
}); | ||
function _typeof(obj) { | ||
@@ -31,2 +20,28 @@ "@babel/helpers - typeof"; | ||
function _defineProperty(obj, key, value) { | ||
if (key in obj) { | ||
Object.defineProperty(obj, key, { | ||
value: value, | ||
enumerable: true, | ||
configurable: true, | ||
writable: true | ||
}); | ||
} else { | ||
obj[key] = value; | ||
} | ||
return obj; | ||
} | ||
var Theme; | ||
(function (Theme) { | ||
Theme["LIGHT"] = "light"; | ||
Theme["DARK"] = "dark"; | ||
})(Theme || (Theme = {})); | ||
var UIContext = /*#__PURE__*/createContext({ | ||
theme: Theme.LIGHT | ||
}); | ||
function toVal(mix) { | ||
@@ -114,24 +129,50 @@ var k, | ||
var CheckboxType; | ||
(function (CheckboxType) { | ||
CheckboxType["TICK"] = "tick"; | ||
CheckboxType["SWITCH"] = "switch"; | ||
CheckboxType["RADIO"] = "radio"; | ||
CheckboxType["INVERSION"] = "inversion"; | ||
CheckboxType["TICK"] = "tick"; | ||
CheckboxType["SWITCH"] = "switch"; | ||
CheckboxType["RADIO"] = "radio"; | ||
CheckboxType["INVERSION"] = "inversion"; | ||
})(CheckboxType || (CheckboxType = {})); | ||
const Checkbox = React.memo((props) => (React.createElement(UIContext.Consumer, null, (context) => { | ||
const children = props.children && (React.createElement("span", { className: textClassNames() }, props.children)); | ||
return (React.createElement("label", { className: labelClassNames(props, context), title: props.title }, | ||
React.createElement("input", { checked: props.checked === true, type: props.type === CheckboxType.RADIO ? 'radio' : 'checkbox', name: props.name, value: props.value, "data-name": props.name, onChange: props.onChange, disabled: props.disabled, readOnly: props.readonly || !isFunction(props.onChange) }), | ||
React.createElement("span", { className: checkmarkClassNames(props) }), | ||
children)); | ||
}))); | ||
const labelClassNames = (props, context) => clsx(props.className, styles.Checkbox, styles[props.theme || context.theme || Theme.LIGHT], { | ||
[styles.disabled]: props.disabled | ||
var Checkbox = /*#__PURE__*/React.memo(function (props) { | ||
return /*#__PURE__*/React.createElement(UIContext.Consumer, null, function (context) { | ||
var children = props.children && /*#__PURE__*/React.createElement("span", { | ||
className: textClassNames() | ||
}, props.children); | ||
return /*#__PURE__*/React.createElement("label", { | ||
className: labelClassNames(props, context), | ||
title: props.title | ||
}, /*#__PURE__*/React.createElement("input", { | ||
checked: props.checked === true, | ||
type: props.type === CheckboxType.RADIO ? 'radio' : 'checkbox', | ||
name: props.name, | ||
value: props.value, | ||
"data-name": props.name, | ||
onChange: props.onChange, | ||
disabled: props.disabled, | ||
readOnly: props.readonly || !isFunction(props.onChange) | ||
}), /*#__PURE__*/React.createElement("span", { | ||
className: checkmarkClassNames(props) | ||
}), children); | ||
}); | ||
}); | ||
const checkmarkClassNames = ({ type = CheckboxType.TICK, checked }) => clsx(styles.checkmark, styles[type], { | ||
[styles.checked]: checked === true, | ||
[styles.indeterminate]: checked === null, | ||
}); | ||
const textClassNames = () => clsx(styles.text); | ||
var labelClassNames = function labelClassNames(props, context) { | ||
return clsx(props.className, styles.Checkbox, styles[props.theme || context.theme || Theme.LIGHT], _defineProperty({}, styles.disabled, props.disabled)); | ||
}; | ||
var checkmarkClassNames = function checkmarkClassNames(_ref) { | ||
var _clsx2; | ||
var _ref$type = _ref.type, | ||
type = _ref$type === void 0 ? CheckboxType.TICK : _ref$type, | ||
checked = _ref.checked; | ||
return clsx(styles.checkmark, styles[type], (_clsx2 = {}, _defineProperty(_clsx2, styles.checked, checked === true), _defineProperty(_clsx2, styles.indeterminate, checked === null), _clsx2)); | ||
}; | ||
var textClassNames = function textClassNames() { | ||
return clsx(styles.text); | ||
}; | ||
export { Checkbox, CheckboxType }; |
{ | ||
"name": "@schrodinger/ui-checkbox", | ||
"version": "0.0.11", | ||
"version": "1.0.0", | ||
"description": "description", | ||
@@ -29,4 +29,4 @@ "keywords": [], | ||
"devDependencies": { | ||
"@schrodinger/ui-context": "^0.0.11", | ||
"@schrodinger/ui-scripts": "^0.0.11", | ||
"@schrodinger/ui-context": "^1.0.0", | ||
"@schrodinger/ui-scripts": "^1.0.0", | ||
"react": "16.x" | ||
@@ -40,3 +40,3 @@ }, | ||
}, | ||
"gitHead": "42660f0f400c8f374a2e0215e2957130157373f6" | ||
"gitHead": "55b11c5dbcf89e54b41ab1eb99c6c770267ba3d1" | ||
} |
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
47963
551
1