@ntohq/buefy-next
Version:
Lightweight UI components for Vue.js (v3) based on Bulma
337 lines (325 loc) • 11.2 kB
JavaScript
/*! Buefy v0.2.0 | MIT License | github.com/buefy/buefy */
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
typeof define === 'function' && define.amd ? define(['exports', 'vue'], factory) :
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.Icon = {}, global.Vue));
})(this, (function (exports, vue) { 'use strict';
let config = {
defaultContainerElement: null,
defaultIconPack: "mdi",
defaultIconComponent: null,
defaultIconPrev: "chevron-left",
defaultIconNext: "chevron-right",
defaultLocale: void 0,
defaultDialogConfirmText: null,
defaultDialogCancelText: null,
defaultSnackbarDuration: 3500,
defaultSnackbarPosition: null,
defaultToastDuration: 2e3,
defaultToastPosition: null,
defaultNotificationDuration: 2e3,
defaultNotificationPosition: null,
defaultTooltipType: "is-primary",
defaultTooltipDelay: null,
defaultTooltipCloseDelay: null,
defaultSidebarDelay: null,
defaultInputAutocomplete: "on",
defaultDateFormatter: null,
defaultDateParser: null,
defaultDateCreator: null,
defaultTimeCreator: null,
defaultDayNames: null,
defaultMonthNames: null,
defaultFirstDayOfWeek: null,
defaultUnselectableDaysOfWeek: null,
defaultTimeFormatter: null,
defaultTimeParser: null,
defaultDatetimeFormatter: null,
defaultDatetimeParser: null,
defaultDatetimeCreator: null,
defaultClockpickerHoursLabel: null,
defaultClockpickerMinutesLabel: null,
defaultColorFormatter: null,
defaultColorParser: null,
defaultModalCanCancel: ["escape", "x", "outside", "button"],
defaultModalScroll: null,
defaultDatepickerMobileNative: true,
defaultTimepickerMobileNative: true,
defaultTimepickerMobileModal: true,
defaultNoticeQueue: true,
defaultInputHasCounter: true,
defaultCompatFallthrough: true,
defaultTaginputHasCounter: true,
defaultUseHtml5Validation: true,
defaultDropdownMobileModal: true,
defaultFieldLabelPosition: null,
defaultDatepickerYearsRange: [-100, 10],
defaultDatepickerNearbyMonthDays: true,
defaultDatepickerNearbySelectableMonthDays: false,
defaultDatepickerShowWeekNumber: false,
defaultDatepickerWeekNumberClickable: false,
defaultDatepickerMobileModal: true,
defaultTrapFocus: true,
defaultAutoFocus: true,
defaultButtonRounded: false,
defaultSwitchRounded: true,
defaultCarouselInterval: 3500,
defaultTabsExpanded: false,
defaultTabsAnimated: true,
defaultTabsType: null,
defaultStatusIcon: true,
defaultProgrammaticPromise: false,
defaultLinkTags: [
"a",
"button",
"input",
"router-link",
"nuxt-link",
"n-link",
"RouterLink",
"NuxtLink",
"NLink"
],
defaultImageWebpFallback: null,
defaultImageLazy: true,
defaultImageResponsive: true,
defaultImageRatio: null,
defaultImageSrcsetFormatter: null,
defaultBreadcrumbTag: "a",
defaultBreadcrumbAlign: "is-left",
defaultBreadcrumbSeparator: "",
defaultBreadcrumbSize: "is-medium",
customIconPacks: null
};
var __defProp = Object.defineProperty;
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __propIsEnum = Object.prototype.propertyIsEnumerable;
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
var __spreadValues = (a, b) => {
for (var prop in b || (b = {}))
if (__hasOwnProp.call(b, prop))
__defNormalProp(a, prop, b[prop]);
if (__getOwnPropSymbols)
for (var prop of __getOwnPropSymbols(b)) {
if (__propIsEnum.call(b, prop))
__defNormalProp(a, prop, b[prop]);
}
return a;
};
const isObject = (item) => typeof item === "object" && !Array.isArray(item);
const mergeFn = (target, source, deep = false) => {
if (deep || !Object.assign) {
const isDeep = (prop) => isObject(source[prop]) && target !== null && Object.prototype.hasOwnProperty.call(target, prop) && isObject(target[prop]);
const replaced = Object.getOwnPropertyNames(source).map((prop) => ({
[prop]: isDeep(prop) ? mergeFn(target[prop], source[prop] || {}, deep) : source[prop]
})).reduce(
(a, b) => __spreadValues(__spreadValues({}, a), b),
// eslint-disable-next-line no-use-before-define
{}
);
return __spreadValues(__spreadValues({}, target), replaced);
} else {
return Object.assign(target, source);
}
};
const merge = mergeFn;
const mdiIcons = {
sizes: {
default: "mdi-24px",
"is-small": null,
"is-medium": "mdi-36px",
"is-large": "mdi-48px"
},
iconPrefix: "mdi-"
};
const faIcons = () => {
const faIconPrefix = config && config.defaultIconComponent ? "" : "fa-";
return {
sizes: {
default: null,
"is-small": null,
"is-medium": faIconPrefix + "lg",
"is-large": faIconPrefix + "2x"
},
iconPrefix: faIconPrefix,
internalIcons: {
information: "info-circle",
alert: "exclamation-triangle",
"alert-circle": "exclamation-circle",
"chevron-right": "angle-right",
"chevron-left": "angle-left",
"chevron-down": "angle-down",
"eye-off": "eye-slash",
"menu-down": "caret-down",
"menu-up": "caret-up",
"close-circle": "times-circle"
}
};
};
const getIcons = () => {
let icons = {
mdi: mdiIcons,
fa: faIcons(),
fas: faIcons(),
far: faIcons(),
fad: faIcons(),
fab: faIcons(),
fal: faIcons(),
"fa-solid": faIcons(),
"fa-regular": faIcons(),
"fa-light": faIcons(),
"fa-thin": faIcons(),
"fa-duotone": faIcons(),
"fa-brands": faIcons()
};
if (config && config.customIconPacks) {
icons = merge(icons, config.customIconPacks, true);
}
return icons;
};
var getIcons$1 = getIcons;
var _sfc_main = vue.defineComponent({
name: "BIcon",
props: {
type: [String, Object],
component: String,
pack: String,
icon: {
type: String,
required: true
},
size: String,
customSize: String,
customClass: String,
both: Boolean
// This is used internally to show both MDI and FA icon
},
computed: {
iconConfig() {
const allIcons = getIcons$1();
return allIcons[this.newPack];
},
iconPrefix() {
if (this.iconConfig && this.iconConfig.iconPrefix) {
return this.iconConfig.iconPrefix;
}
return "";
},
/**
* Internal icon name based on the pack.
* If pack is 'fa', gets the equivalent FA icon name of the MDI,
* internal icons are always MDI.
*/
newIcon() {
return `${this.iconPrefix}${this.getEquivalentIconOf(this.icon)}`;
},
newPack() {
return this.pack || config.defaultIconPack;
},
newType() {
if (!this.type)
return;
let splitType = [];
if (typeof this.type === "string") {
splitType = this.type.split("-");
} else {
for (const key in this.type) {
if (this.type[key]) {
splitType = key.split("-");
break;
}
}
}
if (splitType.length <= 1)
return;
const [, ...type] = splitType;
return `has-text-${type.join("-")}`;
},
newCustomSize() {
return this.customSize || this.customSizeByPack;
},
customSizeByPack() {
if (this.iconConfig && this.iconConfig.sizes) {
if (this.size && this.iconConfig.sizes[this.size] !== void 0) {
return this.iconConfig.sizes[this.size];
} else if (this.iconConfig.sizes.default) {
return this.iconConfig.sizes.default;
}
}
return null;
},
useIconComponent() {
return this.component || config.defaultIconComponent;
}
},
methods: {
/**
* Equivalent icon name of the MDI.
*/
getEquivalentIconOf(value) {
if (!this.both) {
return value;
}
if (this.iconConfig == null) {
return value;
}
const maybeInternal = this.iconConfig;
if (maybeInternal && maybeInternal.internalIcons && maybeInternal.internalIcons[value]) {
return maybeInternal.internalIcons[value];
}
return value;
}
}
});
var _export_sfc = (sfc, props) => {
const target = sfc.__vccOpts || sfc;
for (const [key, val] of props) {
target[key] = val;
}
return target;
};
function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
return vue.openBlock(), vue.createElementBlock(
"span",
{
class: vue.normalizeClass(["icon", [_ctx.newType, _ctx.size]])
},
[
!_ctx.useIconComponent ? (vue.openBlock(), vue.createElementBlock(
"i",
{
key: 0,
class: vue.normalizeClass([_ctx.newPack, _ctx.newIcon, _ctx.newCustomSize, _ctx.customClass])
},
null,
2
/* CLASS */
)) : (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.useIconComponent), {
key: 1,
icon: [_ctx.newPack, _ctx.newIcon],
size: _ctx.newCustomSize,
class: vue.normalizeClass([_ctx.customClass])
}, null, 8, ["icon", "size", "class"]))
],
2
/* CLASS */
);
}
var Icon = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/home/runner/work/buefy-next/buefy-next/packages/buefy-next/src/components/icon/Icon.vue"]]);
const registerComponent = (Vue, component, name) => {
const componentName = name || component.name;
if (componentName == null) {
throw new Error("Buefy.registerComponent: missing component name");
}
Vue.component(componentName, component);
};
const Plugin = {
install(Vue) {
registerComponent(Vue, Icon);
}
};
exports.BIcon = Icon;
exports.default = Plugin;
Object.defineProperty(exports, '__esModule', { value: true });
}));