TabTitle.js 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  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 name2 in all)
  7. __defProp(target, name2, { get: all[name2], 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. TabTitle: () => TabTitle
  21. });
  22. module.exports = __toCommonJS(stdin_exports);
  23. var import_vue = require("vue");
  24. var import_utils = require("../utils");
  25. var import_badge = require("../badge");
  26. const [name, bem] = (0, import_utils.createNamespace)("tab");
  27. const TabTitle = (0, import_vue.defineComponent)({
  28. name,
  29. props: {
  30. id: String,
  31. dot: Boolean,
  32. type: String,
  33. color: String,
  34. title: String,
  35. badge: import_utils.numericProp,
  36. shrink: Boolean,
  37. isActive: Boolean,
  38. disabled: Boolean,
  39. controls: String,
  40. scrollable: Boolean,
  41. activeColor: String,
  42. inactiveColor: String,
  43. showZeroBadge: import_utils.truthProp
  44. },
  45. setup(props, {
  46. slots
  47. }) {
  48. const style = (0, import_vue.computed)(() => {
  49. const style2 = {};
  50. const {
  51. type,
  52. color,
  53. disabled,
  54. isActive,
  55. activeColor,
  56. inactiveColor
  57. } = props;
  58. const isCard = type === "card";
  59. if (color && isCard) {
  60. style2.borderColor = color;
  61. if (!disabled) {
  62. if (isActive) {
  63. style2.backgroundColor = color;
  64. } else {
  65. style2.color = color;
  66. }
  67. }
  68. }
  69. const titleColor = isActive ? activeColor : inactiveColor;
  70. if (titleColor) {
  71. style2.color = titleColor;
  72. }
  73. return style2;
  74. });
  75. const renderText = () => {
  76. const Text = (0, import_vue.createVNode)("span", {
  77. "class": bem("text", {
  78. ellipsis: !props.scrollable
  79. })
  80. }, [slots.title ? slots.title() : props.title]);
  81. if (props.dot || (0, import_utils.isDef)(props.badge) && props.badge !== "") {
  82. return (0, import_vue.createVNode)(import_badge.Badge, {
  83. "dot": props.dot,
  84. "content": props.badge,
  85. "showZero": props.showZeroBadge
  86. }, {
  87. default: () => [Text]
  88. });
  89. }
  90. return Text;
  91. };
  92. return () => (0, import_vue.createVNode)("div", {
  93. "id": props.id,
  94. "role": "tab",
  95. "class": [bem([props.type, {
  96. grow: props.scrollable && !props.shrink,
  97. shrink: props.shrink,
  98. active: props.isActive,
  99. disabled: props.disabled
  100. }])],
  101. "style": style.value,
  102. "tabindex": props.disabled ? void 0 : props.isActive ? 0 : -1,
  103. "aria-selected": props.isActive,
  104. "aria-disabled": props.disabled || void 0,
  105. "aria-controls": props.controls,
  106. "data-allow-mismatch": "attribute"
  107. }, [renderText()]);
  108. }
  109. });