Checker.js 5.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161
  1. var __defProp = Object.defineProperty;
  2. var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
  3. var __getOwnPropNames = Object.getOwnPropertyNames;
  4. var __hasOwnProp = Object.prototype.hasOwnProperty;
  5. var __export = (target, all) => {
  6. for (var name in all)
  7. __defProp(target, name, { get: all[name], enumerable: true });
  8. };
  9. var __copyProps = (to, from, except, desc) => {
  10. if (from && typeof from === "object" || typeof from === "function") {
  11. for (let key of __getOwnPropNames(from))
  12. if (!__hasOwnProp.call(to, key) && key !== except)
  13. __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  14. }
  15. return to;
  16. };
  17. var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
  18. var stdin_exports = {};
  19. __export(stdin_exports, {
  20. checkerProps: () => checkerProps,
  21. default: () => stdin_default
  22. });
  23. module.exports = __toCommonJS(stdin_exports);
  24. var import_vue = require("vue");
  25. var import_utils = require("../utils");
  26. var import_icon = require("../icon");
  27. const checkerProps = {
  28. name: import_utils.unknownProp,
  29. disabled: Boolean,
  30. iconSize: import_utils.numericProp,
  31. modelValue: import_utils.unknownProp,
  32. checkedColor: String,
  33. labelPosition: String,
  34. labelDisabled: Boolean
  35. };
  36. var stdin_default = (0, import_vue.defineComponent)({
  37. props: (0, import_utils.extend)({}, checkerProps, {
  38. bem: (0, import_utils.makeRequiredProp)(Function),
  39. role: String,
  40. shape: String,
  41. parent: Object,
  42. checked: Boolean,
  43. bindGroup: import_utils.truthProp,
  44. indeterminate: {
  45. type: Boolean,
  46. default: null
  47. }
  48. }),
  49. emits: ["click", "toggle"],
  50. setup(props, {
  51. emit,
  52. slots
  53. }) {
  54. const iconRef = (0, import_vue.ref)();
  55. const getParentProp = (name) => {
  56. if (props.parent && props.bindGroup) {
  57. return props.parent.props[name];
  58. }
  59. };
  60. const disabled = (0, import_vue.computed)(() => {
  61. if (props.parent && props.bindGroup) {
  62. const disabled2 = getParentProp("disabled") || props.disabled;
  63. if (props.role === "checkbox") {
  64. const checkedCount = getParentProp("modelValue").length;
  65. const max = getParentProp("max");
  66. const overlimit = max && checkedCount >= +max;
  67. return disabled2 || overlimit && !props.checked;
  68. }
  69. return disabled2;
  70. }
  71. return props.disabled;
  72. });
  73. const direction = (0, import_vue.computed)(() => getParentProp("direction"));
  74. const iconStyle = (0, import_vue.computed)(() => {
  75. const checkedColor = props.checkedColor || getParentProp("checkedColor");
  76. if (checkedColor && props.checked && !disabled.value) {
  77. return {
  78. borderColor: checkedColor,
  79. backgroundColor: checkedColor
  80. };
  81. }
  82. });
  83. const shape = (0, import_vue.computed)(() => {
  84. return props.shape || getParentProp("shape") || "round";
  85. });
  86. const onClick = (event) => {
  87. const {
  88. target
  89. } = event;
  90. const icon = iconRef.value;
  91. const iconClicked = icon === target || (icon == null ? void 0 : icon.contains(target));
  92. if (!disabled.value && (iconClicked || !props.labelDisabled)) {
  93. emit("toggle");
  94. }
  95. emit("click", event);
  96. };
  97. const renderIcon = () => {
  98. var _a, _b;
  99. const {
  100. bem,
  101. checked,
  102. indeterminate
  103. } = props;
  104. const iconSize = props.iconSize || getParentProp("iconSize");
  105. return (0, import_vue.createVNode)("div", {
  106. "ref": iconRef,
  107. "class": bem("icon", [shape.value, {
  108. disabled: disabled.value,
  109. checked,
  110. indeterminate
  111. }]),
  112. "style": shape.value !== "dot" ? {
  113. fontSize: (0, import_utils.addUnit)(iconSize)
  114. } : {
  115. width: (0, import_utils.addUnit)(iconSize),
  116. height: (0, import_utils.addUnit)(iconSize),
  117. borderColor: (_a = iconStyle.value) == null ? void 0 : _a.borderColor
  118. }
  119. }, [slots.icon ? slots.icon({
  120. checked,
  121. disabled: disabled.value
  122. }) : shape.value !== "dot" ? (0, import_vue.createVNode)(import_icon.Icon, {
  123. "name": indeterminate ? "minus" : "success",
  124. "style": iconStyle.value
  125. }, null) : (0, import_vue.createVNode)("div", {
  126. "class": bem("icon--dot__icon"),
  127. "style": {
  128. backgroundColor: (_b = iconStyle.value) == null ? void 0 : _b.backgroundColor
  129. }
  130. }, null)]);
  131. };
  132. const renderLabel = () => {
  133. const {
  134. checked
  135. } = props;
  136. if (slots.default) {
  137. return (0, import_vue.createVNode)("span", {
  138. "class": props.bem("label", [props.labelPosition, {
  139. disabled: disabled.value
  140. }])
  141. }, [slots.default({
  142. checked,
  143. disabled: disabled.value
  144. })]);
  145. }
  146. };
  147. return () => {
  148. const nodes = props.labelPosition === "left" ? [renderLabel(), renderIcon()] : [renderIcon(), renderLabel()];
  149. return (0, import_vue.createVNode)("div", {
  150. "role": props.role,
  151. "class": props.bem([{
  152. disabled: disabled.value,
  153. "label-disabled": props.labelDisabled
  154. }, direction.value]),
  155. "tabindex": disabled.value ? void 0 : 0,
  156. "aria-checked": props.checked,
  157. "onClick": onClick
  158. }, [nodes]);
  159. };
  160. }
  161. });