@kaspersky/components
Version:
Kaspersky Design System UI Kit
20 lines (19 loc) • 7.25 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.getCheckboxCss = exports.checkboxCss = exports.StyledCheckboxGroup = void 0;
var _antd = require("antd");
var _styledComponents = _interopRequireWildcard(require("styled-components"));
var _getFromProps = require("../../helpers/getFromProps.js");
var _variables = require("../../design-system/theme/themes/variables.js");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
const fromCheckboxProps = (0, _getFromProps.getFromProps)();
const getCheckboxCss = fromProps => (0, _styledComponents.css)(["color:", ";line-height:", "px;&&{position:relative;display:inline-flex;align-items:flex-start;}&.ant-checkbox-wrapper + &.ant-checkbox-wrapper{margin-left:0;}.ant-checkbox{top:3px;}.ant-checkbox + span{padding:0;margin-left:4px;& .form-label{cursor:pointer;}}.ant-checkbox-inner{height:", "px;width:", "px;border-color:", ";background-color:", ";border-radius:", "px;}.ant-checkbox-checked .ant-checkbox-inner,.ant-checkbox-indeterminate .ant-checkbox-inner{border-color:", ";background-color:", ";&::after{border-color:", ";border-radius:1px;border-bottom-left-radius:2px;border-top-right-radius:2px;width:5px;height:7.5px;}}.ant-checkbox-checked::after{border:none;}.ant-checkbox-indeterminate .ant-checkbox-inner::after{background-color:", ";width:", "px;height:", "px;border-radius:", "px;}&:hover{.ant-checkbox-inner{background-color:", ";border-color:", ";}.ant-checkbox-checked .ant-checkbox-inner,.ant-checkbox-indeterminate .ant-checkbox-inner{background-color:", ";border-color:transparent;}.ant-checkbox-indeterminate .ant-checkbox-inner::after{border-color:", ";}.ant-checkbox-indeterminate .ant-checkbox-inner::after{background-color:", ";}}.ant-checkbox-input:focus + .ant-checkbox-inner{border-color:", ";}.ant-checkbox-checked .ant-checkbox-input:focus + .ant-checkbox-inner,.ant-checkbox-indeterminate .ant-checkbox-input:focus + .ant-checkbox-inner{border-color:transparent;}.ant-checkbox-input:focus-visible + .ant-checkbox-inner{box-shadow:", ";}.ant-checkbox-checked .ant-checkbox-input:focus-visible + .ant-checkbox-inner,.ant-checkbox-indeterminate .ant-checkbox-input:focus-visible + .ant-checkbox-inner{background-color:", ";}.ant-checkbox-checked .ant-checkbox-input:focus-visible + .ant-checkbox-inner::after{border-color:", ";}.ant-checkbox-indeterminate .ant-checkbox-input:focus-visible + .ant-checkbox-inner::after{background-color:", ";}&:active{.ant-checkbox-inner{background-color:", ";border-color:", ";}.ant-checkbox-checked .ant-checkbox-inner,.ant-checkbox-indeterminate .ant-checkbox-inner{background-color:", ";border-color:", ";box-shadow:none;}.ant-checkbox-checked .ant-checkbox-inner::after{border-color:", ";}.ant-checkbox-indeterminate .ant-checkbox-inner::after{background-color:", ";}}&&.kl6-checkbox-invalid{.ant-checkbox-inner{border-color:", ";background-color:", ";box-shadow:none;}.ant-checkbox-checked .ant-checkbox-inner,.ant-checkbox-indeterminate .ant-checkbox-inner{background-color:", ";border-color:", ";}.ant-checkbox-checked .ant-checkbox-inner::after{border-color:", ";}.ant-checkbox-indeterminate .ant-checkbox-inner::after{background-color:", ";}}&.ant-checkbox-wrapper-disabled,.ant-checkbox-disabled{cursor:not-allowed;}.ant-checkbox-disabled{+ span{color:", ";cursor:default;& .form-label > span{cursor:default;color:", ";}}.ant-checkbox-inner{background-color:", " !important;border-color:transparent !important;}&.ant-checkbox-checked .ant-checkbox-inner,&.ant-checkbox-indeterminate .ant-checkbox-inner{background-color:", " !important;}&.ant-checkbox-checked .ant-checkbox-inner::after{border-color:", " !important;}&.ant-checkbox-indeterminate .ant-checkbox-inner::after{background-color:", " !important;}}&.kl6-checkbox-readonly.ant-checkbox-wrapper-disabled,&.kl6-checkbox-readonly .ant-checkbox-disabled{cursor:default;}&.kl6-checkbox-readonly .ant-checkbox-disabled{+ span{color:", ";cursor:default;& .form-label > span{cursor:default;color:", ";}}.ant-checkbox-inner{background-color:", " !important;border-color:transparent !important;}&.ant-checkbox-checked .ant-checkbox-inner,&.ant-checkbox-indeterminate .ant-checkbox-inner{background-color:", " !important;}&.ant-checkbox-checked .ant-checkbox-inner::after{border-color:", " !important;}&.ant-checkbox-indeterminate .ant-checkbox-inner::after{background-color:", " !important;}}"], fromProps('normal.color'), _variables.SPACES[10], _variables.SPACES[7], _variables.SPACES[7], fromProps('normal.borderColor'), fromProps('normal.bgColor'), _variables.BORDER_RADIUS[2], fromProps('normal.checkBgColor'), fromProps('normal.checkBgColor'), fromProps('normal.checkColor'), fromProps('normal.checkColor'), _variables.SPACES[4], _variables.SPACES[1], _variables.BORDER_RADIUS[2], fromProps('hover.bgColor'), fromProps('hover.borderColor'), fromProps('hover.checkBgColor'), fromProps('hover.checkColor'), fromProps('hover.checkColor'), fromProps('normal.borderColor'), fromProps('focus.boxShadow'), fromProps('normal.checkBgColor'), fromProps('normal.checkColor'), fromProps('normal.checkColor'), fromProps('active.bgColor'), fromProps('active.borderColor'), fromProps('active.checkBgColor'), fromProps('active.borderColor'), fromProps('active.checkColor'), fromProps('active.checkColor'), fromProps('invalid.borderColor'), fromProps('invalid.bgColor'), fromProps('invalid.checkBgColor'), fromProps('invalid.borderColor'), fromProps('invalid.checkColor'), fromProps('invalid.checkColor'), fromProps('disabled.color'), fromProps('disabled.color'), fromProps('disabled.bgColor'), fromProps('disabled.checkBgColor'), fromProps('disabled.checkColor'), fromProps('disabled.checkColor'), fromProps('readonly.color'), fromProps('readonly.color'), fromProps('readonly.bgColor'), fromProps('readonly.checkBgColor'), fromProps('readonly.checkColor'), fromProps('readonly.checkColor'));
exports.getCheckboxCss = getCheckboxCss;
const checkboxCss = exports.checkboxCss = getCheckboxCss(fromCheckboxProps);
const StyledCheckboxGroup = exports.StyledCheckboxGroup = (0, _styledComponents.default)(_antd.Checkbox.Group).withConfig({
displayName: "checkboxCss__StyledCheckboxGroup",
componentId: "sc-nafr2d-0"
})(["&.kl6-checkbox-group-vertical{display:flex;flex-direction:column;align-items:flex-start;gap:", "px;}&.kl6-checkbox-group-horizontal{display:flex;flex-direction:row;gap:", "px;}.ant-checkbox-wrapper + .ant-checkbox-wrapper{margin-left:0;}"], _variables.SPACES[4], _variables.SPACES[8]);