"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.borderBeamProps = void 0;
var _vue = require("vue");
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _propsUtil = require("../_util/props-util");
var _type = require("../_util/type");
var _useConfigInject = _interopRequireDefault(require("../config-provider/hooks/useConfigInject"));
var _BorderBeamEffect = _interopRequireDefault(require("./BorderBeamEffect"));
var _useBorderSize = _interopRequireDefault(require("./hooks/useBorderSize"));
var _style = _interopRequireDefault(require("./style"));
var _util = require("./util");
var _createRef = require("../_util/createRef");
const getInset = width => {
  return typeof width === 'string' ? `calc(-1 * ${width})` : `-${width}px`;
};
const borderBeamProps = () => ({
  prefixCls: String,
  className: String,
  style: Object,
  color: {
    type: [String, Array],
    default: undefined
  },
  outset: {
    type: [Number, String],
    default: undefined
  }
});
exports.borderBeamProps = borderBeamProps;
const BorderBeam = (0, _vue.defineComponent)({
  name: 'ABorderBeam',
  inheritAttrs: false,
  compatConfig: {
    MODE: 3
  },
  props: borderBeamProps(),
  setup(props, {
    slots
  }) {
    const {
      prefixCls: prefixClsRef
    } = (0, _useConfigInject.default)('border-beam', props);
    const [wrapSSR, hashId] = (0, _style.default)(prefixClsRef);
    const childRef = (0, _vue.ref)(null);
    const borderInfo = (0, _useBorderSize.default)(childRef);
    const beamGradient = (0, _vue.computed)(() => (0, _util.getBorderBeamGradient)(props.color));
    const insetOffset = (0, _vue.computed)(() => {
      return props.outset !== undefined ? getInset(props.outset) : borderInfo.value.borderWidth.map(getInset).join(' ');
    });
    const effectStyle = (0, _vue.computed)(() => (0, _extends2.default)((0, _extends2.default)((0, _extends2.default)({}, props.style), {
      '--ant-border-beam-inset-offset': insetOffset.value,
      '--ant-border-beam-border-radius': borderInfo.value.borderRadius
    }), beamGradient.value && {
      '--ant-border-beam-beam-gradient': beamGradient.value
    }));
    return () => {
      var _a;
      const children = (0, _propsUtil.filterEmpty)((_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots));
      const childNode = children[0];
      if (!childNode) {
        return null;
      }
      const mergedChild = (0, _vue.cloneVNode)(childNode, {
        ref: (0, _createRef.composeRef)(childNode.ref, childRef)
      });
      return wrapSSR((0, _vue.createVNode)(_vue.Fragment, null, [mergedChild, (0, _vue.createVNode)(_BorderBeamEffect.default, {
        "prefixCls": prefixClsRef.value,
        "hostDom": childRef.value,
        "className": [hashId.value, props.className].filter(Boolean).join(' '),
        "style": effectStyle.value
      }, null)]));
    };
  }
});
var _default = exports.default = (0, _type.withInstall)(BorderBeam);