Ribbon.js 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
  2. import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
  3. import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
  4. var _excluded = ["class", "style"];
  5. import { createVNode as _createVNode } from "vue";
  6. import { isPresetColor } from './utils';
  7. import { defineComponent, computed } from 'vue';
  8. import PropTypes from '../_util/vue-types';
  9. import useConfigInject from '../_util/hooks/useConfigInject';
  10. export var ribbonProps = function ribbonProps() {
  11. return {
  12. prefix: String,
  13. color: {
  14. type: String
  15. },
  16. text: PropTypes.any,
  17. placement: {
  18. type: String,
  19. default: 'end'
  20. }
  21. };
  22. };
  23. export default defineComponent({
  24. compatConfig: {
  25. MODE: 3
  26. },
  27. name: 'ABadgeRibbon',
  28. inheritAttrs: false,
  29. props: ribbonProps(),
  30. slots: ['text'],
  31. setup: function setup(props, _ref) {
  32. var attrs = _ref.attrs,
  33. slots = _ref.slots;
  34. var _useConfigInject = useConfigInject('ribbon', props),
  35. prefixCls = _useConfigInject.prefixCls,
  36. direction = _useConfigInject.direction;
  37. var colorInPreset = computed(function () {
  38. return isPresetColor(props.color);
  39. });
  40. var ribbonCls = computed(function () {
  41. var _ref2;
  42. return [prefixCls.value, "".concat(prefixCls.value, "-placement-").concat(props.placement), (_ref2 = {}, _defineProperty(_ref2, "".concat(prefixCls.value, "-rtl"), direction.value === 'rtl'), _defineProperty(_ref2, "".concat(prefixCls.value, "-color-").concat(props.color), colorInPreset.value), _ref2)];
  43. });
  44. return function () {
  45. var _slots$default, _slots$text;
  46. var className = attrs.class,
  47. style = attrs.style,
  48. restAttrs = _objectWithoutProperties(attrs, _excluded);
  49. var colorStyle = {};
  50. var cornerColorStyle = {};
  51. if (props.color && !colorInPreset.value) {
  52. colorStyle.background = props.color;
  53. cornerColorStyle.color = props.color;
  54. }
  55. return _createVNode("div", _objectSpread({
  56. "class": "".concat(prefixCls.value, "-wrapper")
  57. }, restAttrs), [(_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots), _createVNode("div", {
  58. "class": [ribbonCls.value, className],
  59. "style": _objectSpread(_objectSpread({}, colorStyle), style)
  60. }, [_createVNode("span", {
  61. "class": "".concat(prefixCls.value, "-text")
  62. }, [props.text || ((_slots$text = slots.text) === null || _slots$text === void 0 ? void 0 : _slots$text.call(slots))]), _createVNode("div", {
  63. "class": "".concat(prefixCls.value, "-corner"),
  64. "style": cornerColorStyle
  65. }, null)])]);
  66. };
  67. }
  68. });