@nextcloud/vue 8.12.0 → 8.14.0

package/dist/Components/NcChip.mjs

@@ -0,0 +1,112 @@
+import '../assets/NcChip-CQm1mq2C.css';
+import { defineComponent } from "vue";
+import { r as register, q as t17, a as t } from "../chunks/_l10n-DDx8P-X1.mjs";
+import { N as NcActions } from "../chunks/NcActions-CL3YRRgz.mjs";
+import NcActionButton from "./NcActionButton.mjs";
+import { N as NcIconSvgWrapper } from "../chunks/NcIconSvgWrapper-Ckqpz-vm.mjs";
+import { n as normalizeComponent } from "../chunks/_plugin-vue2_normalizer-D637Qkok.mjs";
+var mdiClose = "M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z";
+register(t17);
+const _sfc_main = defineComponent({
+  name: "NcChip",
+  components: {
+    NcActions,
+    NcActionButton,
+    NcIconSvgWrapper
+  },
+  props: {
+    /**
+     * aria label to set on the close button
+     * @default 'Close'
+     */
+    ariaLabelClose: {
+      type: String,
+      default: t("Close")
+    },
+    /**
+     * Main text of the chip
+     */
+    text: {
+      type: String,
+      default: ""
+    },
+    /**
+     * Chip style
+     * This sets the background style of the chip, similar to NcButton's `type`
+     */
+    type: {
+      type: String,
+      default: "secondary",
+      validator: (value) => ["primary", "secondary", "tertiary"].includes(value)
+    },
+    /**
+     * SVG path of the icon to use.
+     * For example icon paths from `@mdi/js` can be used.
+     */
+    iconPath: {
+      type: String,
+      default: null
+    },
+    /**
+     * Inline SVG to use as the icon
+     */
+    iconSvg: {
+      type: String,
+      default: null
+    },
+    /**
+     * Set to true to prevent the close button to be shown
+     */
+    noClose: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["close"],
+  setup() {
+    return {
+      mdiClose
+    };
+  },
+  computed: {
+    canClose() {
+      return !this.noClose;
+    },
+    hasActions() {
+      var _a;
+      return this.canClose || ((_a = this.$slots) == null ? void 0 : _a.actions) !== void 0 || this.$scopedSlots.actions !== void 0;
+    }
+  },
+  methods: {
+    t,
+    onClose() {
+      this.$emit("close");
+    }
+  }
+});
+var _sfc_render = function render() {
+  var _vm = this, _c = _vm._self._c;
+  _vm._self._setupProxy;
+  return _c("div", { staticClass: "nc-chip", class: { ["nc-chip--".concat(_vm.type)]: true, "nc-chip--no-actions": !_vm.hasActions } }, [_c("span", { staticClass: "nc-chip__icon" }, [_vm._t("icon", function() {
+    return [_vm.iconPath || _vm.iconSvg ? _c("NcIconSvgWrapper", { attrs: { "inline": "", "path": _vm.iconPath, "svg": _vm.iconPath ? void 0 : _vm.iconSvg, "size": 18 } }) : _vm._e()];
+  })], 2), _c("span", { staticClass: "nc-chip__text" }, [_vm._t("default", function() {
+    return [_vm._v(_vm._s(_vm.text))];
+  })], 2), _vm.hasActions ? _c("NcActions", { staticClass: "nc-chip__actions", attrs: { "force-menu": !_vm.canClose, "type": "tertiary-no-background" } }, [_vm.canClose ? _c("NcActionButton", { attrs: { "close-after-click": "" }, on: { "click": _vm.onClose }, scopedSlots: _vm._u([{ key: "icon", fn: function() {
+    return [_c("NcIconSvgWrapper", { attrs: { "path": _vm.mdiClose, "size": 20 } })];
+  }, proxy: true }], null, false, 2592946578) }, [_vm._v(" " + _vm._s(_vm.ariaLabelClose) + " ")]) : _vm._e(), _vm._t("actions")], 2) : _vm._e()], 1);
+};
+var _sfc_staticRenderFns = [];
+var __component__ = /* @__PURE__ */ normalizeComponent(
+  _sfc_main,
+  _sfc_render,
+  _sfc_staticRenderFns,
+  false,
+  null,
+  "e01fcb1e",
+  null,
+  null
+);
+const NcChip = __component__.exports;
+export {
+  NcChip as default
+};