@contena/meteor-component-library 5.6.2 → 5.7.0

package/dist/mt-empty-state.css

@@ -1,37 +1 @@
-
-.mt-empty-state[data-v-07f005f6] {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  max-width: 560px;
-  text-align: center;
-}
-
-/* @deprecated tag:v5 remove leftAligned class */
-.mt-empty-state--left-aligned[data-v-07f005f6] {
-  align-items: flex-start;
-  max-width: none;
-  text-align: left;
-}
-.mt-empty-state__icon[data-v-07f005f6] {
-  width: var(--scale-size-48);
-  height: var(--scale-size-48);
-  display: grid;
-  place-items: center;
-  border-radius: var(--border-radius-xs);
-  background-color: var(--color-background-tertiary-default);
-}
-.mt-empty-state__headline[data-v-07f005f6] {
-  margin-top: var(--scale-size-24);
-  margin-bottom: 0;
-}
-.mt-empty-state__description[data-v-07f005f6] {
-  margin-top: var(--scale-size-8);
-  text-wrap: pretty;
-}
-.mt-empty-state__link[data-v-07f005f6] {
-  margin-top: var(--scale-size-8);
-}
-.mt-empty-state__button[data-v-07f005f6] {
-  margin-top: var(--scale-size-24);
-}
+.mt-empty-state[data-v-07f005f6]{display:flex;flex-direction:column;align-items:center;max-width:560px;text-align:center}.mt-empty-state--left-aligned[data-v-07f005f6]{align-items:flex-start;max-width:none;text-align:left}.mt-empty-state__icon[data-v-07f005f6]{width:var(--scale-size-48);height:var(--scale-size-48);display:grid;place-items:center;border-radius:var(--border-radius-xs);background-color:var(--color-background-tertiary-default)}.mt-empty-state__headline[data-v-07f005f6]{margin-top:var(--scale-size-24);margin-bottom:0}.mt-empty-state__description[data-v-07f005f6]{margin-top:var(--scale-size-8);text-wrap:pretty}.mt-empty-state__link[data-v-07f005f6]{margin-top:var(--scale-size-8)}.mt-empty-state__button[data-v-07f005f6]{margin-top:var(--scale-size-24)}

package/dist/mt-entity-data-table.css

@@ -1,43 +1 @@
-/* ------------------------------------
- * Administration variables
- * Table of contents
- *
- * 1. Primary colors
- * 2. Status colors
- * 3. Module colors
- * 4. Generic colors
- * 5. Gradients
- * 6. Typography
- * 7. Miscellaneous
- * 8. z-index
- * 9. Global widths
- * ------------------------------------ */
-/* ------------------------------------
- * 1. Primary colors
- * ------------------------------------ */
-/* ------------------------------------
- * 2. Status colors
- * ------------------------------------ */
-/* ------------------------------------
- * 3. Module colors
- * ------------------------------------ */
-/* ------------------------------------
- * 4. Generic colors
- * ------------------------------------ */
-/* ------------------------------------
- * 5. Gradients
- * ------------------------------------ */
-/* ------------------------------------
- * 6. Typography
- * ------------------------------------ */
-/* ------------------------------------
- * 7. Miscellaneous
- * ------------------------------------ */
-/* ------------------------------------
- * 8. z-index
- * ------------------------------------ */
-.mt-entity-data-table__delete-modal-footer {
-  display: flex;
-  gap: 0.5rem;
-  justify-content: flex-end;
-}
+.mt-entity-data-table__delete-modal-footer{display:flex;gap:.5rem;justify-content:flex-end}

package/dist/{mt-entity-data-table.vue_vue_type_style_index_0_lang-84494335.js → mt-entity-data-table.vue_vue_type_style_index_0_lang-063ce600.js}

@@ -2,7 +2,7 @@ import './mt-entity-data-table.css';
 "use strict";
 const vue = require("vue");
 const Criteria = require("./Criteria-86968a69.js");
-const useRepository = require("./useRepository-6804d3b6.js");
+const useRepository = require("./useRepository-86f5a789.js");
 const MtDataTable = require("./common/MtDataTable.js");
 const index = require("./index-e582fef8.js");
 const vueI18n = require("vue-i18n");
@@ -238,7 +238,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       itemToDelete.value = id;
       const isInIframe = window.self !== window.top;
       if (isInIframe && !props.forceRealModal) {
-        const { ui } = await Promise.resolve().then(() => require("./index-2cb63874.js"));
+        const { ui } = await Promise.resolve().then(() => require("./index-269e5194.js"));
         ui.modal.open({
           title: t("entity.delete.title"),
           textContent: t("entity.delete.description"),

package/dist/{mt-entity-data-table.vue_vue_type_style_index_0_lang-20da6e77.mjs → mt-entity-data-table.vue_vue_type_style_index_0_lang-24a26788.mjs}

@@ -1,7 +1,7 @@
 import './mt-entity-data-table.css';
 import { defineComponent, ref, watch, onMounted, openBlock, createElementBlock, Fragment, createVNode, mergeProps, unref, createSlots, renderList, withCtx, renderSlot, normalizeProps, guardReactiveProps, createElementVNode, toDisplayString, createBlock, createCommentVNode, createTextVNode } from "vue";
 import { C as Criteria } from "./Criteria-dda62b10.mjs";
-import { u as useRepository, g as getRepository } from "./useRepository-28dfccf5.mjs";
+import { u as useRepository, g as getRepository } from "./useRepository-f3e9ffc6.mjs";
 import MtDataTable from "./esm/MtDataTable.js";
 import { c as computedAsync } from "./index-03602e2a.mjs";
 import { useI18n } from "vue-i18n";
@@ -237,7 +237,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       itemToDelete.value = id;
       const isInIframe = window.self !== window.top;
       if (isInIframe && !props.forceRealModal) {
-        const { ui } = await import("./index-ddce4e37.mjs");
+        const { ui } = await import("./index-b57e37f8.mjs");
         ui.modal.open({
           title: t("entity.delete.title"),
           textContent: t("entity.delete.description"),

package/dist/{mt-entity-select.vue_vue_type_script_setup_true_lang-2cdffea0.js → mt-entity-select.vue_vue_type_script_setup_true_lang-eb9894c1.js}

@@ -2,7 +2,7 @@
 const vue = require("vue");
 const MtSelect = require("./common/MtSelect.js");
 const Criteria = require("./Criteria-86968a69.js");
-const useRepository = require("./useRepository-6804d3b6.js");
+const useRepository = require("./useRepository-86f5a789.js");
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "mt-entity-select",
   props: {

package/dist/{mt-entity-select.vue_vue_type_script_setup_true_lang-f3c35d00.mjs → mt-entity-select.vue_vue_type_script_setup_true_lang-f94e984f.mjs}

@@ -1,7 +1,7 @@
 import { defineComponent, ref, onMounted, openBlock, createBlock, mergeProps, createSlots, renderList, withCtx, renderSlot, normalizeProps, guardReactiveProps } from "vue";
 import MtSelect from "./esm/MtSelect.js";
 import { C as Criteria } from "./Criteria-dda62b10.mjs";
-import { u as useRepository } from "./useRepository-28dfccf5.mjs";
+import { u as useRepository } from "./useRepository-f3e9ffc6.mjs";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "mt-entity-select",
   props: {

package/dist/mt-field-affix.css

@@ -1,23 +1 @@
-
-.mt-field-affix[data-v-97222200] {
-  display: grid;
-  place-items: center;
-  padding-inline: var(--scale-size-12);
-  color: var(--color-text-primary-default);
-  font-family: var(--font-family-body);
-  font-size: var(--font-size-2xs);
-  line-height: var(--font-line-height-2xs);
-  font-weight: var(--font-weight-medium);
-  background: var(--color-background-tertiary-default);
-  height: 100%;
-}
-.mt-field-affix--suffix[data-v-97222200] {
-  border-inline-start: 1px solid var(--color-border-primary-default);
-  border-top-right-radius: var(--border-radius-xs);
-  border-bottom-right-radius: var(--border-radius-xs);
-}
-.mt-field-affix--prefix[data-v-97222200] {
-  border-inline-end: 1px solid var(--color-border-primary-default);
-  border-top-left-radius: var(--border-radius-xs);
-  border-bottom-left-radius: var(--border-radius-xs);
-}
+.mt-field-affix[data-v-97222200]{display:grid;place-items:center;padding-inline:var(--scale-size-12);color:var(--color-text-primary-default);font-family:var(--font-family-body);font-size:var(--font-size-2xs);line-height:var(--font-line-height-2xs);font-weight:var(--font-weight-medium);background:var(--color-background-tertiary-default);height:100%}.mt-field-affix--suffix[data-v-97222200]{border-inline-start:1px solid var(--color-border-primary-default);border-top-right-radius:var(--border-radius-xs);border-bottom-right-radius:var(--border-radius-xs)}.mt-field-affix--prefix[data-v-97222200]{border-inline-end:1px solid var(--color-border-primary-default);border-top-left-radius:var(--border-radius-xs);border-bottom-left-radius:var(--border-radius-xs)}

package/dist/mt-field-copyable.css

@@ -1,4 +1 @@
-
-.mt-field-copyable[data-v-ec56a4b5] {
-  cursor: pointer;
-}
+.mt-field-copyable[data-v-ec56a4b5]{cursor:pointer}

package/dist/mt-field-error.css

@@ -1,8 +1 @@
-
-.mt-field__error[data-v-d0181d69] {
-  display: flex;
-  align-items: center;
-  gap: var(--scale-size-4);
-  margin-top: var(--scale-size-4);
-  color: var(--color-icon-critical-default);
-}
+.mt-field__error[data-v-d0181d69]{display:flex;align-items:center;gap:var(--scale-size-4);margin-top:var(--scale-size-4);color:var(--color-icon-critical-default)}

package/dist/mt-field-hint.css

@@ -1,24 +1 @@
-
-.mt-field-hint[data-v-e5d87355] {
-  display: flex;
-  flex-direction: row;
-  align-items: flex-start;
-  gap: var(--scale-size-4);
-  padding: var(--scale-size-3);
-  min-width: 0;
-}
-.mt-field-hint__icon[data-v-e5d87355] {
-  flex-shrink: 0;
-  /*
-   * Keeps the icon optically centered on the first line of the hint instead of
-   * on the whole block, so it stays put when the hint text wraps.
-   */
-  margin-top: calc((var(--font-line-height-xs) - var(--scale-size-12)) / 2);
-}
-.mt-field-hint__text[data-v-e5d87355] {
-  color: var(--color-text-secondary-default);
-  font-family: var(--font-family-body);
-  font-size: var(--font-size-xs, 14px);
-  font-weight: var(--font-weight-regular);
-  line-height: var(--font-line-height-xs);
-}
+.mt-field-hint[data-v-10dc0393]{display:flex;flex-direction:row;align-items:flex-start;gap:var(--scale-size-4);min-width:0;color:var(--color-text-secondary-default);font-family:var(--font-family-body);font-size:var(--font-size-xs, 14px);font-weight:var(--font-weight-regular);line-height:var(--font-line-height-xs)}.mt-field-hint__icon-wrapper[data-v-10dc0393]{flex-shrink:0;display:flex;align-items:center;height:1lh}.mt-field-hint__text[data-v-10dc0393]{min-width:0}

package/dist/mt-field-label.css

@@ -1,31 +1 @@
-
-.mt-field-label[data-v-03761b39] {
-  display: flex;
-  column-gap: var(--scale-size-4);
-  align-items: center;
-  color: var(--color-text-primary-default);
-  font-family: var(--font-family-body);
-  font-size: var(--font-size-xs);
-  font-weight: var(--font-weight-regular);
-  line-height: var(--font-line-height-xs);
-}
-.mt-field-label--is-required[data-v-03761b39]::after {
-  content: "*";
-  color: var(--color-text-brand-default);
-}
-.mt-field-label--has-linked-inheritance[data-v-03761b39] {
-  color: var(--color-text-accent-default);
-}
-.mt-field-label--with-error[data-v-03761b39] {
-  color: var(--color-text-critical-default);
-}
-.mt-field-label__inheritance-switch {
-&[data-v-03761b39] {
-  margin-right: var(--scale-size-4);
-  }
-&[data-v-03761b39]:focus-visible {
-    outline-offset: 0.25rem;
-    border-radius: var(--border-radius-2xs);
-    outline-color: var(--color-border-brand-default);
-}
-}
+.mt-field-label[data-v-03761b39]{display:flex;column-gap:var(--scale-size-4);align-items:center;color:var(--color-text-primary-default);font-family:var(--font-family-body);font-size:var(--font-size-xs);font-weight:var(--font-weight-regular);line-height:var(--font-line-height-xs)}.mt-field-label--is-required[data-v-03761b39]:after{content:"*";color:var(--color-text-brand-default)}.mt-field-label--has-linked-inheritance[data-v-03761b39]{color:var(--color-text-accent-default)}.mt-field-label--with-error[data-v-03761b39]{color:var(--color-text-critical-default)}.mt-field-label__inheritance-switch[data-v-03761b39]{margin-right:var(--scale-size-4)}.mt-field-label__inheritance-switch[data-v-03761b39]:focus-visible{outline-offset:.25rem;border-radius:var(--border-radius-2xs);outline-color:var(--color-border-brand-default)}

package/dist/mt-floating-ui.css

@@ -1,87 +1 @@
-/* ------------------------------------
- * Administration variables
- * Table of contents
- *
- * 1. Primary colors
- * 2. Status colors
- * 3. Module colors
- * 4. Generic colors
- * 5. Gradients
- * 6. Typography
- * 7. Miscellaneous
- * 8. z-index
- * 9. Global widths
- * ------------------------------------ */
-/* ------------------------------------
- * 1. Primary colors
- * ------------------------------------ */
-/* ------------------------------------
- * 2. Status colors
- * ------------------------------------ */
-/* ------------------------------------
- * 3. Module colors
- * ------------------------------------ */
-/* ------------------------------------
- * 4. Generic colors
- * ------------------------------------ */
-/* ------------------------------------
- * 5. Gradients
- * ------------------------------------ */
-/* ------------------------------------
- * 6. Typography
- * ------------------------------------ */
-/* ------------------------------------
- * 7. Miscellaneous
- * ------------------------------------ */
-/* ------------------------------------
- * 8. z-index
- * ------------------------------------ */
-.mt-floating-ui {
-  display: inline-block;
-  position: relative;
-}
-.mt-floating-ui .mt-floating-ui__trigger {
-  display: inline-block;
-}
-.mt-floating-ui.mt-floating-ui--detached {
-  display: contents;
-}
-.mt-floating-ui__content {
-  position: fixed;
-  top: 0;
-  left: 0;
-  z-index: 1070;
-  /***
-  * Arrow indicator
-  */
-}
-.mt-floating-ui__content[data-show] {
-  display: block;
-}
-.mt-floating-ui__content .mt-floating-ui__arrow {
-  position: absolute;
-  width: var(--scale-size-8);
-  height: var(--scale-size-8);
-  background: inherit;
-  transform: rotate(45deg);
-}
-.mt-floating-ui__content.mt-floating-ui--top .mt-popover__content {
-  transform-origin: top;
-}
-.mt-floating-ui__content.mt-floating-ui--right .mt-popover__content {
-  transform-origin: right;
-}
-.mt-floating-ui__content.mt-floating-ui--bottom .mt-popover__content {
-  transform-origin: bottom;
-}
-.mt-floating-ui__content.mt-floating-ui--left .mt-popover__content {
-  transform-origin: left;
-}
-.popoverTransition-enter-active,
-.popoverTransition-leave-active {
-  transition: transform 0.15s, opacity 0.15s;
-}
-.popoverTransition-enter, .popoverTransition-leave-to {
-  transform: scale3d(1, 0, 1);
-  opacity: 0;
-}
+.mt-floating-ui{display:inline-block;position:relative}.mt-floating-ui .mt-floating-ui__trigger{display:inline-block}.mt-floating-ui.mt-floating-ui--detached{display:contents}.mt-floating-ui__content{position:fixed;top:0;left:0;z-index:1070}.mt-floating-ui__content[data-show]{display:block}.mt-floating-ui__content .mt-floating-ui__arrow{position:absolute;width:var(--scale-size-8);height:var(--scale-size-8);background:inherit;transform:rotate(45deg)}.mt-floating-ui__content.mt-floating-ui--top .mt-popover__content{transform-origin:top}.mt-floating-ui__content.mt-floating-ui--right .mt-popover__content{transform-origin:right}.mt-floating-ui__content.mt-floating-ui--bottom .mt-popover__content{transform-origin:bottom}.mt-floating-ui__content.mt-floating-ui--left .mt-popover__content{transform-origin:left}.popoverTransition-enter-active,.popoverTransition-leave-active{transition:transform .15s,opacity .15s}.popoverTransition-enter-from,.popoverTransition-leave-to{transform:scale3d(1,0,1);opacity:0}

package/dist/{mt-floating-ui.vue_vue_type_style_index_0_lang-90b9d50a.mjs → mt-floating-ui.vue_vue_type_style_index_0_lang-1e4e0347.mjs}

@@ -1,6 +1,6 @@
 import './mt-floating-ui.css';
 import { getCurrentScope, onScopeDispose, toRef as toRef$1, readonly, customRef, ref, watch, toValue, computed, defineComponent, nextTick, onBeforeUnmount, openBlock, createElementBlock, normalizeClass, renderSlot, createCommentVNode, createBlock, Teleport, withDirectives, normalizeStyle, createVNode, Transition, withCtx, unref } from "vue";
-import { b as autoUpdate, c as computePosition, o as offset, a as arrow, f as flip, d as size } from "./floating-ui.dom-3a2ca2f5.mjs";
+import { b as autoUpdate, c as computePosition, o as offset, a as arrow, f as flip, d as size, h as hide } from "./floating-ui.dom-3a2ca2f5.mjs";
 function tryOnScopeDispose(fn) {
   if (getCurrentScope()) {
     onScopeDispose(fn);
@@ -316,17 +316,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         (c) => c !== "mt-floating-ui"
       );
       floatingUiContent.value.classList.add(...givenClasses);
+      const { middleware: consumerMiddleware, ...consumerOptions } = props.floatingUiOptions ?? {};
       cleanup = autoUpdate(
         referenceEl,
         floatingUiContent.value,
         () => {
-          var _a3;
           if (!referenceEl || !floatingUiContent.value) {
             return;
           }
           computePosition(referenceEl, floatingUiContent.value, {
             placement: "bottom-start",
             strategy: "fixed",
+            ...consumerOptions,
             middleware: [
               offset(props.offset ?? 6),
               ...(() => {
@@ -336,16 +337,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 return [];
               })(),
               flip(),
-              ...((_a3 = props.floatingUiOptions) == null ? void 0 : _a3.middleware) ?? [],
+              ...consumerMiddleware ?? [],
               size({
                 apply({ rects }) {
                   referenceElementWidth.value = rects.reference.width ?? 0;
                   referenceElementHeight.value = rects.reference.height ?? 0;
                 }
-              })
-            ],
-            ...props.floatingUiOptions
+              }),
+              hide()
+            ]
           }).then(({ x, y, middlewareData, placement, strategy }) => {
+            var _a3;
             if (!floatingUiContent.value) {
               return;
             }
@@ -364,10 +366,16 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 [staticSide]: "-2px"
               });
             }
+            const referenceRect = referenceEl.getBoundingClientRect();
+            const referenceIsMeasurable = referenceRect.width > 0 && referenceRect.height > 0;
             Object.assign(floatingUiContent.value.style, {
               position: strategy,
               left: `${x}px`,
-              top: `${y}px`
+              top: `${y}px`,
+              // The content follows its reference on scroll; once the reference is
+              // fully scrolled out of its clipping containers the content must not
+              // stay visible (it would float over unrelated UI).
+              visibility: referenceIsMeasurable && ((_a3 = middlewareData.hide) == null ? void 0 : _a3.referenceHidden) ? "hidden" : "visible"
             });
             ["top", "right", "bottom", "left"].forEach((side) => {
               var _a4;

package/dist/{mt-floating-ui.vue_vue_type_style_index_0_lang-2ea8a18a.js → mt-floating-ui.vue_vue_type_style_index_0_lang-f48de489.js}

@@ -317,17 +317,18 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         (c) => c !== "mt-floating-ui"
       );
       floatingUiContent.value.classList.add(...givenClasses);
+      const { middleware: consumerMiddleware, ...consumerOptions } = props.floatingUiOptions ?? {};
       cleanup = floatingUi_dom.autoUpdate(
         referenceEl,
         floatingUiContent.value,
         () => {
-          var _a3;
           if (!referenceEl || !floatingUiContent.value) {
             return;
           }
           floatingUi_dom.computePosition(referenceEl, floatingUiContent.value, {
             placement: "bottom-start",
             strategy: "fixed",
+            ...consumerOptions,
             middleware: [
               floatingUi_dom.offset(props.offset ?? 6),
               ...(() => {
@@ -337,16 +338,17 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                 return [];
               })(),
               floatingUi_dom.flip(),
-              ...((_a3 = props.floatingUiOptions) == null ? void 0 : _a3.middleware) ?? [],
+              ...consumerMiddleware ?? [],
               floatingUi_dom.size({
                 apply({ rects }) {
                   referenceElementWidth.value = rects.reference.width ?? 0;
                   referenceElementHeight.value = rects.reference.height ?? 0;
                 }
-              })
-            ],
-            ...props.floatingUiOptions
+              }),
+              floatingUi_dom.hide()
+            ]
           }).then(({ x, y, middlewareData, placement, strategy }) => {
+            var _a3;
             if (!floatingUiContent.value) {
               return;
             }
@@ -365,10 +367,16 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
                 [staticSide]: "-2px"
               });
             }
+            const referenceRect = referenceEl.getBoundingClientRect();
+            const referenceIsMeasurable = referenceRect.width > 0 && referenceRect.height > 0;
             Object.assign(floatingUiContent.value.style, {
               position: strategy,
               left: `${x}px`,
-              top: `${y}px`
+              top: `${y}px`,
+              // The content follows its reference on scroll; once the reference is
+              // fully scrolled out of its clipping containers the content must not
+              // stay visible (it would float over unrelated UI).
+              visibility: referenceIsMeasurable && ((_a3 = middlewareData.hide) == null ? void 0 : _a3.referenceHidden) ? "hidden" : "visible"
             });
             ["top", "right", "bottom", "left"].forEach((side) => {
               var _a4;

package/dist/mt-grant-permission-service-banner-62995d3a.mjs

@@ -0,0 +1,191 @@
+import './mt-grant-permission-service-banner.css';
+import { ref, computed, defineComponent, useId, unref, openBlock, createElementBlock, createElementVNode, createVNode, withCtx, createTextVNode, toDisplayString, createCommentVNode } from "vue";
+import { c as computedAsync } from "./index-03602e2a.mjs";
+import { useI18n } from "vue-i18n";
+import { _ as _sfc_main$1 } from "./mt-icon.vue_vue_type_style_index_0_lang-c90dc25b.mjs";
+import MtText from "./esm/MtText.js";
+import MtButton from "./esm/MtButton.js";
+import { c as createSender } from "./channel-24cdec8b.mjs";
+import { g as getAppInformation } from "./index-1e353711.mjs";
+import { _ as _export_sfc } from "./_plugin-vue_export-helper-cc2b3d55.mjs";
+const isService = createSender("contextIsService", {});
+const grant = createSender("servicePermissionGrant", {});
+const isGranted = createSender("servicePermissionIsGranted", {});
+function useServicePermission() {
+  const isGranting = ref(false);
+  const isService$1 = computedAsync(async () => {
+    try {
+      return await isService();
+    } catch {
+      return null;
+    }
+  }, null);
+  const permissionGranted = computedAsync(async () => {
+    try {
+      return await isGranted();
+    } catch {
+      return null;
+    }
+  }, null);
+  const isShowPermissionUI = computed(
+    () => isService$1.value === true && permissionGranted.value === false
+  );
+  async function grant$1() {
+    if (isGranting.value)
+      return;
+    isGranting.value = true;
+    try {
+      await grant();
+    } catch (error) {
+      console.error("Error granting permission:", error);
+      throw error;
+    } finally {
+      isGranting.value = false;
+    }
+  }
+  return {
+    isGranting,
+    isService: isService$1,
+    permissionGranted,
+    isShowPermissionUI,
+    grant: grant$1
+  };
+}
+const dispatch = createSender("telemetryDispatch");
+const _hoisted_1 = {
+  key: 0,
+  class: "mt-grant-permission-service-banner__container"
+};
+const _hoisted_2 = ["aria-labelledby"];
+const _hoisted_3 = { class: "mt-grant-permission-service-banner__body" };
+const _hoisted_4 = { class: "mt-grant-permission-service-banner__actions" };
+const _hoisted_5 = { class: "mt-grant-permission-service-banner__label--short" };
+const _hoisted_6 = { class: "mt-grant-permission-service-banner__label--long" };
+const __default__ = {
+  name: "MtGrantPermissionServiceBanner"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  emits: ["grant-success", "grant-error", "more-info"],
+  setup(__props, { emit: __emit }) {
+    const { t } = useI18n({
+      messages: {
+        en: {
+          title: "Grant permissions to activate this service.",
+          description: "Only the data needed to function will be accessed.",
+          grantLabel: "Grant permissions",
+          grantLongLabel: "Grant permissions and activate",
+          moreInfo: "More info",
+          moreInfoUrl: "https://developer.contena.cn/docs/"
+        },
+        zh: {
+          title: "授予权限以启用此服务。",
+          description: "仅访问此功能运行所需的数据。",
+          grantLabel: "授予权限",
+          grantLongLabel: "授予权限并启用",
+          moreInfo: "了解更多",
+          moreInfoUrl: "https://developer.contena.cn/docs/"
+        }
+      }
+    });
+    const titleId = useId();
+    const emit = __emit;
+    const { isGranting, isShowPermissionUI, grant: grant2 } = useServicePermission();
+    const appInfo = computedAsync(async () => {
+      return await getAppInformation();
+    }, null);
+    function track(event, data) {
+      dispatch({ event, data }).catch(() => void 0);
+    }
+    async function handleGrantPermission() {
+      var _a, _b;
+      track(`${(_a = appInfo.value) == null ? void 0 : _a.name}_grant_permission_clicked`, {
+        contena_version: (_b = appInfo.value) == null ? void 0 : _b.version
+      });
+      try {
+        await grant2();
+        emit("grant-success");
+      } catch (error) {
+        emit("grant-error", error);
+      }
+    }
+    function handleClickMoreInfo() {
+      var _a;
+      track(`${(_a = appInfo.value) == null ? void 0 : _a.name}_grant_permission_more_info`);
+      emit("more-info");
+    }
+    return (_ctx, _cache) => {
+      return unref(isShowPermissionUI) ? (openBlock(), createElementBlock("div", _hoisted_1, [
+        createElementVNode("section", {
+          class: "mt-grant-permission-service-banner",
+          "aria-labelledby": unref(titleId)
+        }, [
+          createVNode(_sfc_main$1, {
+            class: "mt-grant-permission-service-banner__icon",
+            name: "regular-trust",
+            size: "32",
+            decorative: ""
+          }),
+          createElementVNode("div", _hoisted_3, [
+            createVNode(MtText, {
+              id: unref(titleId),
+              as: "h3",
+              weight: "bold",
+              size: "xs",
+              class: "mt-grant-permission-service-banner__title"
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(unref(t)("title")), 1)
+              ]),
+              _: 1
+            }, 8, ["id"]),
+            createVNode(MtText, {
+              size: "2xs",
+              color: "color-text-secondary-default",
+              class: "mt-grant-permission-service-banner__description"
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(unref(t)("description")), 1)
+              ]),
+              _: 1
+            })
+          ]),
+          createElementVNode("div", _hoisted_4, [
+            createVNode(MtButton, {
+              variant: "primary",
+              class: "mt-grant-permission-service-banner__grant",
+              "is-loading": unref(isGranting),
+              onClick: handleGrantPermission
+            }, {
+              default: withCtx(() => [
+                createElementVNode("span", _hoisted_5, toDisplayString(unref(t)("grantLabel")), 1),
+                createElementVNode("span", _hoisted_6, toDisplayString(unref(t)("grantLongLabel")), 1)
+              ]),
+              _: 1
+            }, 8, ["is-loading"]),
+            createVNode(MtButton, {
+              is: "a",
+              variant: "secondary",
+              class: "mt-grant-permission-service-banner__more-info",
+              href: unref(t)("moreInfoUrl"),
+              target: "_blank",
+              rel: "noopener noreferrer",
+              onClick: handleClickMoreInfo
+            }, {
+              default: withCtx(() => [
+                createTextVNode(toDisplayString(unref(t)("moreInfo")), 1)
+              ]),
+              _: 1
+            }, 8, ["href"])
+          ])
+        ], 8, _hoisted_2)
+      ])) : createCommentVNode("", true);
+    };
+  }
+});
+const mtGrantPermissionServiceBanner_vue_vue_type_style_index_0_scoped_038d2bc3_lang = "";
+const mtGrantPermissionServiceBanner = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-038d2bc3"]]);
+export {
+  mtGrantPermissionServiceBanner as m,
+  useServicePermission as u
+};