@inkline/inkline
Version:
Inkline is the intuitive UI Components library that gives you a developer-friendly foundation for building high-quality, accessible, and customizable Vue.js 3 Design Systems.
59 lines (58 loc) • 1.76 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
module.exports = void 0;
var _vue = require("vue");
var _utils = require("@inkline/inkline/utils");
var _default = exports.default = (0, _vue.defineComponent)({
props: {
/**
* The primitive or render function to render. It can accept either primitive types (String, Number, Boolean), a render function, or a Vue component.
* @type String | Number | Boolean | LabelRenderFunction | Raw<Component>
* @default ''
* @name render
*/
render: {
type: [String, Number, Boolean, Function, Object],
default: ""
},
/**
* The context object that is passed to the component props, render function, or used for string interpolation.
* @type Object
* @default {}
* @name ctx
*/
ctx: {
type: Object,
default: () => ({})
},
/**
* The HTML tag to use for rendering primitives. If not specified, no tag will be rendered.
* @type String
* @default
* @name tag
*/
tag: {
type: String,
default: void 0
}
},
setup(props) {
return () => {
switch (true) {
case typeof props.render === "function":
return props.render(props.ctx);
case typeof props.render === "object":
return (0, _vue.h)(props.render, {
ctx: props.ctx
});
case typeof props.render === "string":
const children = (0, _utils.interpolate)(props.render, props.ctx);
return props.tag ? (0, _vue.h)(props.tag, children) : (0, _vue.h)(_vue.Text, children);
default:
return props.tag ? (0, _vue.h)(props.tag, props.render) : (0, _vue.h)(_vue.Text, props.render);
}
};
}
});