@gcsa/console-vue 0.1.2 → 0.1.4

package/dist/components/GcsaCascader.vue.js

@@ -19,11 +19,11 @@ const $ = ["disabled", "data-invalid"], E = ["data-placeholder"], j = { class: "
   },
   emits: ["update:modelValue", "change"],
   setup(d, { emit: C }) {
-    const p = S(), s = d, B = m(() => s.placeholder ?? p.value.selectPlaceholder), h = C, o = z([...s.modelValue]);
+    const p = S(), s = d, w = m(() => s.placeholder ?? p.value.selectPlaceholder), v = C, o = z([...s.modelValue]);
     D(() => s.modelValue, (a) => {
       o.value = [...a ?? []];
     }, { deep: !0 });
-    const w = m(() => {
+    const B = m(() => {
       var t;
       const a = [s.options];
       let c = s.options;
@@ -33,7 +33,7 @@ const $ = ["disabled", "data-invalid"], E = ["data-placeholder"], j = { class: "
         a.push(e.children), c = e.children;
       }
       return a;
-    }), v = m(() => {
+    }), h = m(() => {
       const a = [];
       let c = s.options;
       for (const t of s.modelValue ?? []) {
@@ -47,12 +47,13 @@ const $ = ["disabled", "data-invalid"], E = ["data-placeholder"], j = { class: "
       var l;
       if (a.disabled) return;
       const t = [...o.value.slice(0, c), a.value];
-      o.value = t, (!((l = a.children) != null && l.length) || s.changeOnSelect) && (h("update:modelValue", t), h("change", t));
+      o.value = t, (!((l = a.children) != null && l.length) || s.changeOnSelect) && (v("update:modelValue", t), v("change", t));
     }
     return (a, c) => (n(), _(P, {
       arrow: !1,
       portalled: d.portalled,
       gutter: 6,
+      "fit-viewport": !0,
       class: "gcsa-cascader-popover"
     }, {
       trigger: g(() => [
@@ -64,8 +65,8 @@ const $ = ["disabled", "data-invalid"], E = ["data-placeholder"], j = { class: "
         }, [
           u("span", {
             class: "gcsa-cascader__value",
-            "data-placeholder": !v.value || void 0
-          }, f(v.value || B.value), 9, E),
+            "data-placeholder": !h.value || void 0
+          }, f(h.value || w.value), 9, E),
           N(V, {
             name: "chevronDown",
             size: "sm",
@@ -75,7 +76,7 @@ const $ = ["disabled", "data-invalid"], E = ["data-placeholder"], j = { class: "
       ]),
       default: g(() => [
         u("div", j, [
-          (n(!0), r(b, null, y(w.value, (t, l) => (n(), r("div", {
+          (n(!0), r(b, null, y(B.value, (t, l) => (n(), r("div", {
             key: l,
             class: "gcsa-cascader__column",
             role: "menu"

package/dist/components/GcsaCascader.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"GcsaCascader.vue.js","sources":["../../src/components/GcsaCascader.vue"],"sourcesContent":["<template>\n  <GcsaPopover :arrow=\"false\" :portalled=\"portalled\" :gutter=\"6\" class=\"gcsa-cascader-popover\">\n    <template #trigger>\n      <button type=\"button\" class=\"gcsa-cascader__trigger gcsa-focus-ring\" :disabled=\"disabled\" :data-invalid=\"invalid || undefined\">\n        <span class=\"gcsa-cascader__value\" :data-placeholder=\"!displayLabel || undefined\">{{ displayLabel || resolvedPlaceholder }}</span>\n        <GcsaIcon name=\"chevronDown\" size=\"sm\" aria-hidden=\"true\" />\n      </button>\n    </template>\n    <div class=\"gcsa-cascader__panel\">\n      <div v-for=\"(column, depth) in columns\" :key=\"depth\" class=\"gcsa-cascader__column\" role=\"menu\">\n        <button\n          v-for=\"option in column\"\n          :key=\"option.value\"\n          type=\"button\"\n          class=\"gcsa-cascader__option gcsa-focus-ring\"\n          :class=\"{ 'gcsa-cascader__option--active': activePath[depth] === option.value }\"\n          :disabled=\"option.disabled\"\n          role=\"menuitem\"\n          @click=\"selectOption(option, depth)\"\n        >\n          <span>{{ option.label }}</span>\n          <GcsaIcon v-if=\"option.children?.length\" name=\"chevronDown\" size=\"sm\" class=\"gcsa-cascader__arrow\" aria-hidden=\"true\" />\n        </button>\n        <span v-if=\"!column.length\" class=\"gcsa-cascader__empty\">{{ messages.noOptions }}</span>\n      </div>\n    </div>\n  </GcsaPopover>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue';\nimport type { GcsaCascaderOption } from '@gcsa/console-core';\nimport type { GcsaCascaderProps } from '../types/componentProps';\nimport GcsaIcon from './GcsaIcon.vue';\nimport GcsaPopover from './GcsaPopover.vue';\nimport { useGcsaLocaleMessages } from '../composables/useGcsaLocale';\n\ndefineOptions({ name: 'GcsaCascader' });\n\nconst messages = useGcsaLocaleMessages();\n\nconst props = withDefaults(defineProps<GcsaCascaderProps>(), { modelValue: () => [], disabled: false, invalid: false, changeOnSelect: false, portalled: true });\n\nconst resolvedPlaceholder = computed(() => props.placeholder ?? messages.value.selectPlaceholder);\n\nconst emit = defineEmits<{ 'update:modelValue': [value: string[]]; change: [value: string[]] }>();\nconst activePath = ref([...props.modelValue]);\n\nwatch(() => props.modelValue, value => { activePath.value = [...(value ?? [])]; }, { deep: true });\n\nconst columns = computed(() => {\n  const result: GcsaCascaderOption[][] = [props.options];\n  let current = props.options;\n  for (const value of activePath.value) {\n    const selected = current.find(option => option.value === value);\n    if (!selected?.children?.length) break;\n    result.push(selected.children);\n    current = selected.children;\n  }\n  return result;\n});\n\nconst displayLabel = computed(() => {\n  const labels: string[] = [];\n  let current = props.options;\n  for (const value of props.modelValue ?? []) {\n    const selected = current.find(option => option.value === value);\n    if (!selected) break;\n    labels.push(selected.label);\n    current = selected.children ?? [];\n  }\n  return labels.join(' / ');\n});\n\nfunction selectOption(option: GcsaCascaderOption, depth: number) {\n  if (option.disabled) return;\n  const next = [...activePath.value.slice(0, depth), option.value];\n  activePath.value = next;\n  if (!option.children?.length || props.changeOnSelect) {\n    emit('update:modelValue', next);\n    emit('change', next);\n  }\n}\n</script>\n"],"names":["messages","useGcsaLocaleMessages","props","__props","resolvedPlaceholder","computed","emit","__emit","activePath","ref","watch","value","columns","result","current","selected","option","_a","displayLabel","labels","selectOption","depth","next","_createBlock","GcsaPopover","_createElementVNode","_toDisplayString","_hoisted_2","_createVNode","GcsaIcon","_hoisted_3","_openBlock","_createElementBlock","_Fragment","_renderList","column","_normalizeClass","$event","_hoisted_5","_unref"],"mappings":"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"}
+{"version":3,"file":"GcsaCascader.vue.js","sources":["../../src/components/GcsaCascader.vue"],"sourcesContent":["<template>\n  <GcsaPopover :arrow=\"false\" :portalled=\"portalled\" :gutter=\"6\" :fit-viewport=\"true\" class=\"gcsa-cascader-popover\">\n    <template #trigger>\n      <button type=\"button\" class=\"gcsa-cascader__trigger gcsa-focus-ring\" :disabled=\"disabled\" :data-invalid=\"invalid || undefined\">\n        <span class=\"gcsa-cascader__value\" :data-placeholder=\"!displayLabel || undefined\">{{ displayLabel || resolvedPlaceholder }}</span>\n        <GcsaIcon name=\"chevronDown\" size=\"sm\" aria-hidden=\"true\" />\n      </button>\n    </template>\n    <div class=\"gcsa-cascader__panel\">\n      <div v-for=\"(column, depth) in columns\" :key=\"depth\" class=\"gcsa-cascader__column\" role=\"menu\">\n        <button\n          v-for=\"option in column\"\n          :key=\"option.value\"\n          type=\"button\"\n          class=\"gcsa-cascader__option gcsa-focus-ring\"\n          :class=\"{ 'gcsa-cascader__option--active': activePath[depth] === option.value }\"\n          :disabled=\"option.disabled\"\n          role=\"menuitem\"\n          @click=\"selectOption(option, depth)\"\n        >\n          <span>{{ option.label }}</span>\n          <GcsaIcon v-if=\"option.children?.length\" name=\"chevronDown\" size=\"sm\" class=\"gcsa-cascader__arrow\" aria-hidden=\"true\" />\n        </button>\n        <span v-if=\"!column.length\" class=\"gcsa-cascader__empty\">{{ messages.noOptions }}</span>\n      </div>\n    </div>\n  </GcsaPopover>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue';\nimport type { GcsaCascaderOption } from '@gcsa/console-core';\nimport type { GcsaCascaderProps } from '../types/componentProps';\nimport GcsaIcon from './GcsaIcon.vue';\nimport GcsaPopover from './GcsaPopover.vue';\nimport { useGcsaLocaleMessages } from '../composables/useGcsaLocale';\n\ndefineOptions({ name: 'GcsaCascader' });\n\nconst messages = useGcsaLocaleMessages();\n\nconst props = withDefaults(defineProps<GcsaCascaderProps>(), { modelValue: () => [], disabled: false, invalid: false, changeOnSelect: false, portalled: true });\n\nconst resolvedPlaceholder = computed(() => props.placeholder ?? messages.value.selectPlaceholder);\n\nconst emit = defineEmits<{ 'update:modelValue': [value: string[]]; change: [value: string[]] }>();\nconst activePath = ref([...props.modelValue]);\n\nwatch(() => props.modelValue, value => { activePath.value = [...(value ?? [])]; }, { deep: true });\n\nconst columns = computed(() => {\n  const result: GcsaCascaderOption[][] = [props.options];\n  let current = props.options;\n  for (const value of activePath.value) {\n    const selected = current.find(option => option.value === value);\n    if (!selected?.children?.length) break;\n    result.push(selected.children);\n    current = selected.children;\n  }\n  return result;\n});\n\nconst displayLabel = computed(() => {\n  const labels: string[] = [];\n  let current = props.options;\n  for (const value of props.modelValue ?? []) {\n    const selected = current.find(option => option.value === value);\n    if (!selected) break;\n    labels.push(selected.label);\n    current = selected.children ?? [];\n  }\n  return labels.join(' / ');\n});\n\nfunction selectOption(option: GcsaCascaderOption, depth: number) {\n  if (option.disabled) return;\n  const next = [...activePath.value.slice(0, depth), option.value];\n  activePath.value = next;\n  if (!option.children?.length || props.changeOnSelect) {\n    emit('update:modelValue', next);\n    emit('change', next);\n  }\n}\n</script>\n"],"names":["messages","useGcsaLocaleMessages","props","__props","resolvedPlaceholder","computed","emit","__emit","activePath","ref","watch","value","columns","result","current","selected","option","_a","displayLabel","labels","selectOption","depth","next","_createBlock","GcsaPopover","_createElementVNode","_toDisplayString","_hoisted_2","_createVNode","GcsaIcon","_hoisted_3","_openBlock","_createElementBlock","_Fragment","_renderList","column","_normalizeClass","$event","_hoisted_5","_unref"],"mappings":"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"}

package/dist/components/GcsaPopover.vue.d.ts

@@ -2,8 +2,10 @@ import { GcsaPopoverProps } from '../types/componentProps';
 declare function __VLS_template(): any;
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<GcsaPopoverProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:open": (open: boolean) => any;
     "open-change": (open: boolean) => any;
 }, string, import('vue').PublicProps, Readonly<GcsaPopoverProps> & Readonly<{
+    "onUpdate:open"?: ((open: boolean) => any) | undefined;
     "onOpen-change"?: ((open: boolean) => any) | undefined;
 }>, {
     size: import('..').GcsaPopoverSize;
@@ -11,6 +13,7 @@ declare const __VLS_component: import('vue').DefineComponent<GcsaPopoverProps, {
     placement: import('..').GcsaPopoverPlacement;
     arrow: boolean;
     gutter: number;
+    fitViewport: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;

package/dist/components/GcsaPopover.vue.js

@@ -1,14 +1,14 @@
-import { defineComponent as $, computed as t, useSlots as V, ref as M, watch as j, openBlock as s, createBlock as c, unref as l, withCtx as a, renderSlot as f, createVNode as p, createTextVNode as w, toDisplayString as k, normalizeStyle as B, normalizeClass as A, createCommentVNode as m, createElementVNode as E, createElementBlock as Z } from "vue";
-import { Popover as n } from "@ark-ui/vue/popover";
-import { toCssLength as v, createGcsaPopupPositioning as D } from "@gcsa/console-core";
-import F from "./GcsaButton.vue.js";
-import R from "./GcsaPortal.vue.js";
-import { useGcsaLocaleMessages as q } from "../composables/useGcsaLocale.js";
-import { useGcsaPopupZIndex as H } from "../composables/useGcsaPopupZIndex.js";
-const J = { class: "gcsa-popover__body" }, K = {
+import { defineComponent as I, computed as s, useSlots as L, ref as $, watch as M, openBlock as n, createBlock as i, unref as a, withCtx as t, renderSlot as f, createVNode as p, createTextVNode as C, toDisplayString as B, normalizeStyle as k, normalizeClass as j, createCommentVNode as g, createElementVNode as A, createElementBlock as E } from "vue";
+import { Popover as l } from "@ark-ui/vue/popover";
+import { toCssLength as m, createGcsaPopupPositioning as O } from "@gcsa/console-core";
+import Z from "./GcsaButton.vue.js";
+import D from "./GcsaPortal.vue.js";
+import { useGcsaLocaleMessages as F } from "../composables/useGcsaLocale.js";
+import { useGcsaPopupZIndex as R } from "../composables/useGcsaPopupZIndex.js";
+const U = { class: "gcsa-popover__body" }, q = {
   key: 1,
   class: "gcsa-popover__footer"
-}, ae = /* @__PURE__ */ $({
+}, oe = /* @__PURE__ */ I({
   name: "GcsaPopover",
   __name: "GcsaPopover",
   props: {
@@ -19,105 +19,107 @@ const J = { class: "gcsa-popover__body" }, K = {
     portalled: { type: Boolean, default: !0 },
     gutter: { default: 8 },
     open: { type: Boolean },
+    fitViewport: { type: Boolean, default: !1 },
     size: { default: "default" },
     width: {},
     minWidth: {},
     maxWidth: {},
     contentClassName: {}
   },
-  emits: ["open-change"],
+  emits: ["open-change", "update:open"],
   setup(r, { emit: W }) {
-    const o = r, P = W, S = q(), { zIndex: d, onOpenChange: x } = H(), z = t(() => o.triggerLabel ?? S.value.open), h = V(), N = t(() => !!h.trigger), y = t(() => !!h.footer), _ = t(() => o.open !== void 0), g = M(!1), T = t(() => _.value ? o.open : g.value);
-    j(
+    const o = r, v = W, P = F(), { zIndex: c, onOpenChange: S } = R(), z = s(() => o.triggerLabel ?? P.value.open), h = L(), N = s(() => !!h.trigger), _ = s(() => !!h.footer), d = $(o.open ?? !1);
+    M(
       () => o.open,
       (e) => {
-        e !== void 0 && (g.value = e);
+        e !== void 0 && (d.value = e);
       }
     );
-    const b = t(
-      () => d.value == null ? void 0 : { zIndex: d.value }
-    ), O = t(() => {
+    const T = s(
+      () => c.value == null ? void 0 : { zIndex: c.value }
+    ), V = s(() => {
       const e = {};
-      d.value != null && (e.zIndex = d.value);
-      const i = v(o.width), u = v(o.minWidth), C = v(o.maxWidth);
-      return i && (e.width = i), u && (e.minWidth = u), C && (e.maxWidth = C), Object.keys(e).length ? e : void 0;
-    }), G = t(
+      c.value != null && (e.zIndex = c.value);
+      const u = m(o.width), y = m(o.minWidth), w = m(o.maxWidth);
+      return u && (e.width = u), y && (e.minWidth = y), w && (e.maxWidth = w), Object.keys(e).length ? e : void 0;
+    }), b = s(
       () => [
         "gcsa-popover",
         "gcsa-ui-surface",
         o.size === "lg" ? "gcsa-popover--lg" : void 0,
-        y.value ? "gcsa-popover--with-footer" : void 0,
+        _.value ? "gcsa-popover--with-footer" : void 0,
         o.contentClassName
       ].filter(Boolean).join(" ")
-    ), I = t(
-      () => D({
+    ), x = s(
+      () => O({
         placement: o.placement,
-        gutter: o.gutter
+        gutter: o.gutter,
+        fitViewport: o.fitViewport
       })
     );
-    function L(e) {
-      _.value || (g.value = e), P("open-change", e), x(e);
+    function G(e) {
+      d.value = e, v("update:open", e), v("open-change", e), S(e);
     }
-    return (e, i) => (s(), c(l(n).Root, {
-      open: T.value,
-      positioning: I.value,
-      onOpenChange: i[0] || (i[0] = (u) => L(u.open))
+    return (e, u) => (n(), i(a(l).Root, {
+      open: d.value,
+      positioning: x.value,
+      "onUpdate:open": G
     }, {
-      default: a(() => [
-        N.value ? (s(), c(l(n).Trigger, {
+      default: t(() => [
+        N.value ? (n(), i(a(l).Trigger, {
           key: 0,
           "as-child": ""
         }, {
-          default: a(() => [
+          default: t(() => [
             f(e.$slots, "trigger")
           ]),
           _: 3
-        })) : (s(), c(l(n).Trigger, { key: 1 }, {
-          default: a(() => [
-            p(F, { variant: "secondary" }, {
-              default: a(() => [
-                w(k(z.value), 1)
+        })) : (n(), i(a(l).Trigger, { key: 1 }, {
+          default: t(() => [
+            p(Z, { variant: "secondary" }, {
+              default: t(() => [
+                C(B(z.value), 1)
               ]),
               _: 1
             })
           ]),
           _: 1
         })),
-        p(R, { portalled: r.portalled }, {
-          default: a(() => [
-            p(l(n).Positioner, {
-              style: B(b.value)
+        p(D, { portalled: r.portalled }, {
+          default: t(() => [
+            p(a(l).Positioner, {
+              style: k(T.value)
             }, {
-              default: a(() => [
-                p(l(n).Content, {
-                  class: A(G.value),
-                  style: B(O.value)
+              default: t(() => [
+                p(a(l).Content, {
+                  class: j(b.value),
+                  style: k(V.value)
                 }, {
-                  default: a(() => [
-                    r.title ? (s(), c(l(n).Title, {
+                  default: t(() => [
+                    r.title ? (n(), i(a(l).Title, {
                       key: 0,
                       class: "gcsa-popover__title"
                     }, {
-                      default: a(() => [
-                        w(k(r.title), 1)
+                      default: t(() => [
+                        C(B(r.title), 1)
                       ]),
                       _: 1
-                    })) : m("", !0),
-                    E("div", J, [
+                    })) : g("", !0),
+                    A("div", U, [
                       f(e.$slots, "default")
                     ]),
-                    y.value ? (s(), Z("div", K, [
+                    _.value ? (n(), E("div", q, [
                       f(e.$slots, "footer")
-                    ])) : m("", !0),
-                    r.arrow ? (s(), c(l(n).Arrow, {
+                    ])) : g("", !0),
+                    r.arrow ? (n(), i(a(l).Arrow, {
                       key: 2,
                       class: "gcsa-popover__arrow"
                     }, {
-                      default: a(() => [
-                        p(l(n).ArrowTip, { class: "gcsa-popover__arrow-tip" })
+                      default: t(() => [
+                        p(a(l).ArrowTip, { class: "gcsa-popover__arrow-tip" })
                       ]),
                       _: 1
-                    })) : m("", !0)
+                    })) : g("", !0)
                   ]),
                   _: 3
                 }, 8, ["class", "style"])
@@ -133,6 +135,6 @@ const J = { class: "gcsa-popover__body" }, K = {
   }
 });
 export {
-  ae as default
+  oe as default
 };
 //# sourceMappingURL=GcsaPopover.vue.js.map

package/dist/components/GcsaPopover.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"GcsaPopover.vue.js","sources":["../../src/components/GcsaPopover.vue"],"sourcesContent":["<template>\n  <Popover.Root\n    :open=\"resolvedOpen\"\n    :positioning=\"positioningOptions\"\n    @open-change=\"(details) => handleOpenChange(details.open)\"\n  >\n    <Popover.Trigger v-if=\"hasTriggerSlot\" as-child>\n      <slot name=\"trigger\" />\n    </Popover.Trigger>\n    <Popover.Trigger v-else>\n      <GcsaButton variant=\"secondary\">{{ resolvedTriggerLabel }}</GcsaButton>\n    </Popover.Trigger>\n    <GcsaPortal :portalled=\"portalled\">\n      <Popover.Positioner :style=\"positionerStyle\">\n        <Popover.Content :class=\"contentClassNames\" :style=\"contentStyle\">\n          <Popover.Title v-if=\"title\" class=\"gcsa-popover__title\">{{ title }}</Popover.Title>\n          <div class=\"gcsa-popover__body\">\n            <slot />\n          </div>\n          <div v-if=\"hasFooterSlot\" class=\"gcsa-popover__footer\">\n            <slot name=\"footer\" />\n          </div>\n          <Popover.Arrow v-if=\"arrow\" class=\"gcsa-popover__arrow\">\n            <Popover.ArrowTip class=\"gcsa-popover__arrow-tip\" />\n          </Popover.Arrow>\n        </Popover.Content>\n      </Popover.Positioner>\n    </GcsaPortal>\n  </Popover.Root>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, useSlots, watch } from 'vue';\nimport { Popover } from '@ark-ui/vue/popover';\nimport { createGcsaPopupPositioning, toCssLength } from '@gcsa/console-core';\nimport type { GcsaPopoverProps } from '../types/componentProps';\nimport GcsaButton from './GcsaButton.vue';\nimport GcsaPortal from './GcsaPortal.vue';\nimport { useGcsaLocaleMessages } from '../composables/useGcsaLocale';\nimport { useGcsaPopupZIndex } from '../composables/useGcsaPopupZIndex';\n\ndefineOptions({ name: 'GcsaPopover' });\n\nconst props = withDefaults(\n  defineProps<GcsaPopoverProps>(),\n  {\n    placement: 'bottom',\n    arrow: true,\n    portalled: true,\n    gutter: 8,\n    size: 'default'\n  }\n);\n\nconst emit = defineEmits<{\n  'open-change': [open: boolean];\n}>();\n\nconst messages = useGcsaLocaleMessages();\nconst { zIndex: popupZIndex, onOpenChange: onPopupOpenChange } = useGcsaPopupZIndex();\nconst resolvedTriggerLabel = computed(() => props.triggerLabel ?? messages.value.open);\nconst slots = useSlots();\nconst hasTriggerSlot = computed(() => Boolean(slots.trigger));\nconst hasFooterSlot = computed(() => Boolean(slots.footer));\n\nconst isControlled = computed(() => props.open !== undefined);\nconst internalOpen = ref(false);\nconst resolvedOpen = computed(() => (isControlled.value ? props.open : internalOpen.value));\n\nwatch(\n  () => props.open,\n  (next) => {\n    if (next !== undefined) {\n      internalOpen.value = next;\n    }\n  }\n);\n\nconst positionerStyle = computed(() =>\n  popupZIndex.value == null ? undefined : { zIndex: popupZIndex.value }\n);\n\nconst contentStyle = computed(() => {\n  const style: Record<string, string | number> = {};\n  if (popupZIndex.value != null) style.zIndex = popupZIndex.value;\n  const resolvedWidth = toCssLength(props.width);\n  const resolvedMinWidth = toCssLength(props.minWidth);\n  const resolvedMaxWidth = toCssLength(props.maxWidth);\n  if (resolvedWidth) style.width = resolvedWidth;\n  if (resolvedMinWidth) style.minWidth = resolvedMinWidth;\n  if (resolvedMaxWidth) style.maxWidth = resolvedMaxWidth;\n  return Object.keys(style).length ? style : undefined;\n});\n\nconst contentClassNames = computed(() =>\n  [\n    'gcsa-popover',\n    'gcsa-ui-surface',\n    props.size === 'lg' ? 'gcsa-popover--lg' : undefined,\n    hasFooterSlot.value ? 'gcsa-popover--with-footer' : undefined,\n    props.contentClassName\n  ]\n    .filter(Boolean)\n    .join(' ')\n);\n\nconst positioningOptions = computed(() =>\n  createGcsaPopupPositioning({\n    placement: props.placement,\n    gutter: props.gutter\n  })\n);\n\nfunction handleOpenChange(nextOpen: boolean) {\n  if (!isControlled.value) {\n    internalOpen.value = nextOpen;\n  }\n  emit('open-change', nextOpen);\n  onPopupOpenChange(nextOpen);\n}\n</script>\n"],"names":["props","__props","emit","__emit","messages","useGcsaLocaleMessages","popupZIndex","onPopupOpenChange","useGcsaPopupZIndex","resolvedTriggerLabel","computed","slots","useSlots","hasTriggerSlot","hasFooterSlot","isControlled","internalOpen","ref","resolvedOpen","watch","next","positionerStyle","contentStyle","style","resolvedWidth","toCssLength","resolvedMinWidth","resolvedMaxWidth","contentClassNames","positioningOptions","createGcsaPopupPositioning","handleOpenChange","nextOpen","_createBlock","_unref","Popover","details","_renderSlot","_ctx","_createVNode","GcsaButton","GcsaPortal","_createElementVNode","_hoisted_1","_openBlock","_createElementBlock","_hoisted_2"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CA,UAAMA,IAAQC,GAWRC,IAAOC,GAIPC,IAAWC,EAAA,GACX,EAAE,QAAQC,GAAa,cAAcC,EAAA,IAAsBC,EAAA,GAC3DC,IAAuBC,EAAS,MAAMV,EAAM,gBAAgBI,EAAS,MAAM,IAAI,GAC/EO,IAAQC,EAAA,GACRC,IAAiBH,EAAS,MAAM,EAAQC,EAAM,OAAQ,GACtDG,IAAgBJ,EAAS,MAAM,EAAQC,EAAM,MAAO,GAEpDI,IAAeL,EAAS,MAAMV,EAAM,SAAS,MAAS,GACtDgB,IAAeC,EAAI,EAAK,GACxBC,IAAeR,EAAS,MAAOK,EAAa,QAAQf,EAAM,OAAOgB,EAAa,KAAM;AAE1F,IAAAG;AAAA,MACE,MAAMnB,EAAM;AAAA,MACZ,CAACoB,MAAS;AACR,QAAIA,MAAS,WACXJ,EAAa,QAAQI;AAAA,MAEzB;AAAA,IAAA;AAGF,UAAMC,IAAkBX;AAAA,MAAS,MAC/BJ,EAAY,SAAS,OAAO,SAAY,EAAE,QAAQA,EAAY,MAAA;AAAA,IAAM,GAGhEgB,IAAeZ,EAAS,MAAM;AAClC,YAAMa,IAAyC,CAAA;AAC/C,MAAIjB,EAAY,SAAS,SAAMiB,EAAM,SAASjB,EAAY;AAC1D,YAAMkB,IAAgBC,EAAYzB,EAAM,KAAK,GACvC0B,IAAmBD,EAAYzB,EAAM,QAAQ,GAC7C2B,IAAmBF,EAAYzB,EAAM,QAAQ;AACnD,aAAIwB,QAAqB,QAAQA,IAC7BE,QAAwB,WAAWA,IACnCC,QAAwB,WAAWA,IAChC,OAAO,KAAKJ,CAAK,EAAE,SAASA,IAAQ;AAAA,IAC7C,CAAC,GAEKK,IAAoBlB;AAAA,MAAS,MACjC;AAAA,QACE;AAAA,QACA;AAAA,QACAV,EAAM,SAAS,OAAO,qBAAqB;AAAA,QAC3Cc,EAAc,QAAQ,8BAA8B;AAAA,QACpDd,EAAM;AAAA,MAAA,EAEL,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,IAAA,GAGP6B,IAAqBnB;AAAA,MAAS,MAClCoB,EAA2B;AAAA,QACzB,WAAW9B,EAAM;AAAA,QACjB,QAAQA,EAAM;AAAA,MAAA,CACf;AAAA,IAAA;AAGH,aAAS+B,EAAiBC,GAAmB;AAC3C,MAAKjB,EAAa,UAChBC,EAAa,QAAQgB,IAEvB9B,EAAK,eAAe8B,CAAQ,GAC5BzB,EAAkByB,CAAQ;AAAA,IAC5B;2BAtHEC,EA2BeC,EAAAC,CAAA,EAAA,MAAA;AAAA,MA1BZ,MAAMjB,EAAA;AAAA,MACN,aAAaW,EAAA;AAAA,MACb,+BAAcO,MAAYL,EAAiBK,EAAQ,IAAI;AAAA,IAAA;iBAExD,MAEkB;AAAA,QAFKvB,EAAA,cAAvBoB,EAEkBC,EAAAC,CAAA,EAAA,SAAA;AAAA;UAFqB,YAAA;AAAA,QAAA;qBACrC,MAAuB;AAAA,YAAvBE,EAAuBC,EAAA,QAAA,SAAA;AAAA,UAAA;;oBAEzBL,EAEkBC,EAAAC,CAAA,EAAA,SAAA,EAAA,KAAA,KAAA;AAAA,qBADhB,MAAuE;AAAA,YAAvEI,EAAuEC,GAAA,EAA3D,SAAQ,eAAW;AAAA,yBAAC,MAA0B;AAAA,oBAAvB/B,EAAA,KAAoB,GAAA,CAAA;AAAA,cAAA;;;;;;QAEzD8B,EAeaE,GAAA,EAfA,WAAWxC,EAAA,aAAS;AAAA,qBAC/B,MAaqB;AAAA,YAbrBsC,EAaqBL,EAAAC,CAAA,EAAA,YAAA;AAAA,cAbA,SAAOd,EAAA,KAAe;AAAA,YAAA;yBACzC,MAWkB;AAAA,gBAXlBkB,EAWkBL,EAAAC,CAAA,EAAA,SAAA;AAAA,kBAXA,SAAOP,EAAA,KAAiB;AAAA,kBAAG,SAAON,EAAA,KAAY;AAAA,gBAAA;6BAC9D,MAAmF;AAAA,oBAA9DrB,EAAA,cAArBgC,EAAmFC,EAAAC,CAAA,EAAA,OAAA;AAAA;sBAAvD,OAAM;AAAA,oBAAA;iCAAsB,MAAW;AAAA,4BAARlC,EAAA,KAAK,GAAA,CAAA;AAAA,sBAAA;;;oBAChEyC,EAEM,OAFNC,GAEM;AAAA,sBADJN,EAAQC,EAAA,QAAA,SAAA;AAAA,oBAAA;oBAECxB,EAAA,SAAX8B,EAAA,GAAAC,EAEM,OAFNC,GAEM;AAAA,sBADJT,EAAsBC,EAAA,QAAA,QAAA;AAAA,oBAAA;oBAEHrC,EAAA,cAArBgC,EAEgBC,EAAAC,CAAA,EAAA,OAAA;AAAA;sBAFY,OAAM;AAAA,oBAAA;iCAChC,MAAoD;AAAA,wBAApDI,EAAoDL,EAAAC,CAAA,EAAA,UAAA,EAAlC,OAAM,2BAAyB;AAAA,sBAAA;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"GcsaPopover.vue.js","sources":["../../src/components/GcsaPopover.vue"],"sourcesContent":["<template>\n  <Popover.Root\n    :open=\"open\"\n    :positioning=\"positioningOptions\"\n    @update:open=\"handleOpenChange\"\n  >\n    <Popover.Trigger v-if=\"hasTriggerSlot\" as-child>\n      <slot name=\"trigger\" />\n    </Popover.Trigger>\n    <Popover.Trigger v-else>\n      <GcsaButton variant=\"secondary\">{{ resolvedTriggerLabel }}</GcsaButton>\n    </Popover.Trigger>\n    <GcsaPortal :portalled=\"portalled\">\n      <Popover.Positioner :style=\"positionerStyle\">\n        <Popover.Content :class=\"contentClassNames\" :style=\"contentStyle\">\n          <Popover.Title v-if=\"title\" class=\"gcsa-popover__title\">{{ title }}</Popover.Title>\n          <div class=\"gcsa-popover__body\">\n            <slot />\n          </div>\n          <div v-if=\"hasFooterSlot\" class=\"gcsa-popover__footer\">\n            <slot name=\"footer\" />\n          </div>\n          <Popover.Arrow v-if=\"arrow\" class=\"gcsa-popover__arrow\">\n            <Popover.ArrowTip class=\"gcsa-popover__arrow-tip\" />\n          </Popover.Arrow>\n        </Popover.Content>\n      </Popover.Positioner>\n    </GcsaPortal>\n  </Popover.Root>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref, useSlots, watch } from 'vue';\nimport { Popover } from '@ark-ui/vue/popover';\nimport { createGcsaPopupPositioning, toCssLength } from '@gcsa/console-core';\nimport type { GcsaPopoverProps } from '../types/componentProps';\nimport GcsaButton from './GcsaButton.vue';\nimport GcsaPortal from './GcsaPortal.vue';\nimport { useGcsaLocaleMessages } from '../composables/useGcsaLocale';\nimport { useGcsaPopupZIndex } from '../composables/useGcsaPopupZIndex';\n\ndefineOptions({ name: 'GcsaPopover' });\n\nconst props = withDefaults(\n  defineProps<GcsaPopoverProps>(),\n  {\n    placement: 'bottom',\n    arrow: true,\n    portalled: true,\n    gutter: 8,\n    size: 'default',\n    fitViewport: false\n  }\n);\n\nconst emit = defineEmits<{\n  'open-change': [open: boolean];\n  'update:open': [open: boolean];\n}>();\n\nconst messages = useGcsaLocaleMessages();\nconst { zIndex: popupZIndex, onOpenChange: onPopupOpenChange } = useGcsaPopupZIndex();\nconst resolvedTriggerLabel = computed(() => props.triggerLabel ?? messages.value.open);\nconst slots = useSlots();\nconst hasTriggerSlot = computed(() => Boolean(slots.trigger));\nconst hasFooterSlot = computed(() => Boolean(slots.footer));\n\nconst open = ref(props.open ?? false);\n\nwatch(\n  () => props.open,\n  (next) => {\n    if (next !== undefined) open.value = next;\n  }\n);\n\nconst positionerStyle = computed(() =>\n  popupZIndex.value == null ? undefined : { zIndex: popupZIndex.value }\n);\n\nconst contentStyle = computed(() => {\n  const style: Record<string, string | number> = {};\n  if (popupZIndex.value != null) style.zIndex = popupZIndex.value;\n  const resolvedWidth = toCssLength(props.width);\n  const resolvedMinWidth = toCssLength(props.minWidth);\n  const resolvedMaxWidth = toCssLength(props.maxWidth);\n  if (resolvedWidth) style.width = resolvedWidth;\n  if (resolvedMinWidth) style.minWidth = resolvedMinWidth;\n  if (resolvedMaxWidth) style.maxWidth = resolvedMaxWidth;\n  return Object.keys(style).length ? style : undefined;\n});\n\nconst contentClassNames = computed(() =>\n  [\n    'gcsa-popover',\n    'gcsa-ui-surface',\n    props.size === 'lg' ? 'gcsa-popover--lg' : undefined,\n    hasFooterSlot.value ? 'gcsa-popover--with-footer' : undefined,\n    props.contentClassName\n  ]\n    .filter(Boolean)\n    .join(' ')\n);\n\nconst positioningOptions = computed(() =>\n  createGcsaPopupPositioning({\n    placement: props.placement,\n    gutter: props.gutter,\n    fitViewport: props.fitViewport\n  })\n);\n\nfunction handleOpenChange(nextOpen: boolean) {\n  open.value = nextOpen;\n  emit('update:open', nextOpen);\n  emit('open-change', nextOpen);\n  onPopupOpenChange(nextOpen);\n}\n</script>\n"],"names":["props","__props","emit","__emit","messages","useGcsaLocaleMessages","popupZIndex","onPopupOpenChange","useGcsaPopupZIndex","resolvedTriggerLabel","computed","slots","useSlots","hasTriggerSlot","hasFooterSlot","open","ref","watch","next","positionerStyle","contentStyle","style","resolvedWidth","toCssLength","resolvedMinWidth","resolvedMaxWidth","contentClassNames","positioningOptions","createGcsaPopupPositioning","handleOpenChange","nextOpen","_createBlock","_unref","Popover","_renderSlot","_ctx","_createVNode","GcsaButton","GcsaPortal","_createElementVNode","_hoisted_1","_openBlock","_createElementBlock","_hoisted_2"],"mappings":"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"}

package/dist/components/GcsaPortal.vue.js

@@ -1,32 +1,46 @@
-import { defineComponent as u, inject as p, computed as o, ref as m, onMounted as f, openBlock as v, createBlock as i, Teleport as _, createElementVNode as h, renderSlot as s } from "vue";
-import { GCSA_THEME_KEY as g } from "../composables/useGcsaTheme.js";
-const k = ["data-gcsa-theme"], G = /* @__PURE__ */ u({
+import { defineComponent as f, inject as v, ref as d, computed as l, onMounted as h, onUnmounted as g, openBlock as _, createBlock as b, Teleport as k, createElementVNode as E, renderSlot as s } from "vue";
+import { GCSA_THEME_KEY as y } from "../composables/useGcsaTheme.js";
+const M = ["data-gcsa-theme"], P = /* @__PURE__ */ f({
   name: "GcsaPortal",
   __name: "GcsaPortal",
   props: {
     portalled: { type: Boolean, default: !0 },
     to: {}
   },
-  setup(r) {
-    const t = r, e = p(g, null), n = o(() => (e == null ? void 0 : e.value) ?? "dark"), a = m(!1);
-    f(() => {
-      a.value = !0;
+  setup(c) {
+    const u = c;
+    function o() {
+      if (typeof document > "u") return "dark";
+      const t = document.documentElement.getAttribute("data-gcsa-theme");
+      return t === "light" || t === "dark" ? t : "dark";
+    }
+    const a = v(y, null), n = d(o()), m = l(() => (a == null ? void 0 : a.value) ?? n.value), r = d(!1);
+    let e = null;
+    h(() => {
+      r.value = !0, n.value = o(), typeof MutationObserver < "u" && (e = new MutationObserver(() => {
+        n.value = o();
+      }), e.observe(document.documentElement, {
+        attributes: !0,
+        attributeFilter: ["data-gcsa-theme"]
+      }));
+    }), g(() => {
+      e == null || e.disconnect(), e = null;
     });
-    const c = o(() => t.to ?? "body"), d = o(() => t.portalled && a.value);
-    return (l, E) => d.value ? (v(), i(_, {
+    const i = l(() => u.to ?? "body"), p = l(() => u.portalled && r.value);
+    return (t, T) => p.value ? (_(), b(k, {
       key: 0,
-      to: c.value
+      to: i.value
     }, [
-      h("div", {
+      E("div", {
         class: "gcsa-portal-scope",
-        "data-gcsa-theme": n.value
+        "data-gcsa-theme": m.value
       }, [
-        s(l.$slots, "default")
-      ], 8, k)
-    ], 8, ["to"])) : s(l.$slots, "default", {}, void 0, void 0, 1);
+        s(t.$slots, "default")
+      ], 8, M)
+    ], 8, ["to"])) : s(t.$slots, "default", {}, void 0, void 0, 1);
   }
 });
 export {
-  G as default
+  P as default
 };
 //# sourceMappingURL=GcsaPortal.vue.js.map

package/dist/components/GcsaPortal.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"GcsaPortal.vue.js","sources":["../../src/components/GcsaPortal.vue"],"sourcesContent":["<template>\n  <Teleport v-if=\"shouldPortal\" :to=\"resolvedTarget\">\n    <div class=\"gcsa-portal-scope\" :data-gcsa-theme=\"theme\">\n      <slot />\n    </div>\n  </Teleport>\n  <slot v-else />\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, inject, onMounted, ref, type ComputedRef } from 'vue';\nimport type { GcsaConsoleTheme } from '@gcsa/console-core';\nimport type { GcsaPortalProps } from '../types/componentProps';\nimport { GCSA_THEME_KEY } from '../composables/useGcsaTheme';\n\ndefineOptions({ name: 'GcsaPortal' });\n\nconst props = withDefaults(\n  defineProps<GcsaPortalProps>(),\n  {\n    portalled: true\n  }\n);\n\nconst injectedTheme = inject<ComputedRef<GcsaConsoleTheme> | null>(GCSA_THEME_KEY, null);\nconst theme = computed(() => injectedTheme?.value ?? 'dark');\n\n/**\n * 延迟到客户端挂载后再创建 Teleport，避免 Suspense / 异步父组件初次渲染时\n * Vue 对 Teleport 做 deferred mount 却找不到 parentNode 的竞态。\n * 浮层统一挂 body，层级由 useGcsaZIndex 栈管理（勿挂到 modal 内 fixed 容器，会破坏定位）。\n */\nconst mounted = ref(false);\nonMounted(() => {\n  mounted.value = true;\n});\n\nconst resolvedTarget = computed(() => props.to ?? 'body');\n\nconst shouldPortal = computed(() => props.portalled && mounted.value);\n</script>\n"],"names":["props","__props","injectedTheme","inject","GCSA_THEME_KEY","theme","computed","mounted","ref","onMounted","resolvedTarget","shouldPortal","_createBlock","_Teleport","_createElementVNode","_renderSlot","_ctx"],"mappings":";;;;;;;;;;AAiBA,UAAMA,IAAQC,GAORC,IAAgBC,EAA6CC,GAAgB,IAAI,GACjFC,IAAQC,EAAS,OAAMJ,KAAA,gBAAAA,EAAe,UAAS,MAAM,GAOrDK,IAAUC,EAAI,EAAK;AACzB,IAAAC,EAAU,MAAM;AACd,MAAAF,EAAQ,QAAQ;AAAA,IAClB,CAAC;AAED,UAAMG,IAAiBJ,EAAS,MAAMN,EAAM,MAAM,MAAM,GAElDW,IAAeL,EAAS,MAAMN,EAAM,aAAaO,EAAQ,KAAK;qBAtClDI,EAAA,cAAhBC,EAIWC,GAAA;AAAA;MAJoB,IAAIH,EAAA;AAAA,IAAA;MACjCI,EAEM,OAAA;AAAA,QAFD,OAAM;AAAA,QAAqB,mBAAiBT,EAAA;AAAA,MAAA;QAC/CU,EAAQC,EAAA,QAAA,SAAA;AAAA,MAAA;qBAGZD,EAAeC,EAAA,QAAA,WAAA,CAAA,GAAA,QAAA,QAAA,CAAA;AAAA;;"}
+{"version":3,"file":"GcsaPortal.vue.js","sources":["../../src/components/GcsaPortal.vue"],"sourcesContent":["<template>\n  <Teleport v-if=\"shouldPortal\" :to=\"resolvedTarget\">\n    <div class=\"gcsa-portal-scope\" :data-gcsa-theme=\"theme\">\n      <slot />\n    </div>\n  </Teleport>\n  <slot v-else />\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, inject, onMounted, onUnmounted, ref, type ComputedRef } from 'vue';\nimport type { GcsaConsoleTheme } from '@gcsa/console-core';\nimport type { GcsaPortalProps } from '../types/componentProps';\nimport { GCSA_THEME_KEY } from '../composables/useGcsaTheme';\n\ndefineOptions({ name: 'GcsaPortal' });\n\nconst props = withDefaults(\n  defineProps<GcsaPortalProps>(),\n  {\n    portalled: true\n  }\n);\n\nfunction readDocumentTheme(): GcsaConsoleTheme {\n  if (typeof document === 'undefined') return 'dark';\n  const value = document.documentElement.getAttribute('data-gcsa-theme');\n  return value === 'light' || value === 'dark' ? value : 'dark';\n}\n\nconst injectedTheme = inject<ComputedRef<GcsaConsoleTheme> | null>(GCSA_THEME_KEY, null);\nconst documentTheme = ref<GcsaConsoleTheme>(readDocumentTheme());\nconst theme = computed(() => injectedTheme?.value ?? documentTheme.value);\n\n/**\n * 延迟到客户端挂载后再创建 Teleport，避免 Suspense / 异步父组件初次渲染时\n * Vue 对 Teleport 做 deferred mount 却找不到 parentNode 的竞态。\n * 浮层统一挂 body，层级由 useGcsaZIndex 栈管理（勿挂到 modal 内 fixed 容器，会破坏定位）。\n */\nconst mounted = ref(false);\nlet themeObserver: MutationObserver | null = null;\n\nonMounted(() => {\n  mounted.value = true;\n  documentTheme.value = readDocumentTheme();\n  if (typeof MutationObserver !== 'undefined') {\n    themeObserver = new MutationObserver(() => {\n      documentTheme.value = readDocumentTheme();\n    });\n    themeObserver.observe(document.documentElement, {\n      attributes: true,\n      attributeFilter: ['data-gcsa-theme']\n    });\n  }\n});\n\nonUnmounted(() => {\n  themeObserver?.disconnect();\n  themeObserver = null;\n});\n\nconst resolvedTarget = computed(() => props.to ?? 'body');\n\nconst shouldPortal = computed(() => props.portalled && mounted.value);\n</script>\n"],"names":["props","__props","readDocumentTheme","value","injectedTheme","inject","GCSA_THEME_KEY","documentTheme","ref","theme","computed","mounted","themeObserver","onMounted","onUnmounted","resolvedTarget","shouldPortal","_createBlock","_Teleport","_createElementVNode","_renderSlot","_ctx"],"mappings":";;;;;;;;;;AAiBA,UAAMA,IAAQC;AAOd,aAASC,IAAsC;AAC7C,UAAI,OAAO,WAAa,IAAa,QAAO;AAC5C,YAAMC,IAAQ,SAAS,gBAAgB,aAAa,iBAAiB;AACrE,aAAOA,MAAU,WAAWA,MAAU,SAASA,IAAQ;AAAA,IACzD;AAEA,UAAMC,IAAgBC,EAA6CC,GAAgB,IAAI,GACjFC,IAAgBC,EAAsBN,GAAmB,GACzDO,IAAQC,EAAS,OAAMN,KAAA,gBAAAA,EAAe,UAASG,EAAc,KAAK,GAOlEI,IAAUH,EAAI,EAAK;AACzB,QAAII,IAAyC;AAE7C,IAAAC,EAAU,MAAM;AACd,MAAAF,EAAQ,QAAQ,IAChBJ,EAAc,QAAQL,EAAA,GAClB,OAAO,mBAAqB,QAC9BU,IAAgB,IAAI,iBAAiB,MAAM;AACzC,QAAAL,EAAc,QAAQL,EAAA;AAAA,MACxB,CAAC,GACDU,EAAc,QAAQ,SAAS,iBAAiB;AAAA,QAC9C,YAAY;AAAA,QACZ,iBAAiB,CAAC,iBAAiB;AAAA,MAAA,CACpC;AAAA,IAEL,CAAC,GAEDE,EAAY,MAAM;AAChB,MAAAF,KAAA,QAAAA,EAAe,cACfA,IAAgB;AAAA,IAClB,CAAC;AAED,UAAMG,IAAiBL,EAAS,MAAMV,EAAM,MAAM,MAAM,GAElDgB,IAAeN,EAAS,MAAMV,EAAM,aAAaW,EAAQ,KAAK;qBA9DlDK,EAAA,cAAhBC,EAIWC,GAAA;AAAA;MAJoB,IAAIH,EAAA;AAAA,IAAA;MACjCI,EAEM,OAAA;AAAA,QAFD,OAAM;AAAA,QAAqB,mBAAiBV,EAAA;AAAA,MAAA;QAC/CW,EAAQC,EAAA,QAAA,SAAA;AAAA,MAAA;qBAGZD,EAAeC,EAAA,QAAA,WAAA,CAAA,GAAA,QAAA,QAAA,CAAA;AAAA;;"}