@transsionfe/semi-ui-vue 0.0.1

package/lib/es/components/sideSheet/SideSheet.vue.js

@@ -0,0 +1,217 @@
+import { defineComponent as Q, computed as n, ref as y, watch as I, onMounted as Y, onBeforeUnmount as Z, createBlock as M, openBlock as H, unref as h, withCtx as b, createVNode as W, createCommentVNode as ee, normalizeStyle as te, mergeProps as ae, renderSlot as oe } from "vue";
+import le from "classnames";
+import { cssClasses as ne, strings as ie } from "@douyinfe/semi-foundation/sideSheet/constants";
+import se from "@douyinfe/semi-foundation/sideSheet/sideSheetFoundation";
+import re from "./SideSheetContent.vue.js";
+import de from "../_portal/Portal.vue.js";
+import A from "../_cssAnimation/index.vue.js";
+import { normalizeMotion as ue } from "../_utils/motion.js";
+import { useFoundation as me } from "../../_utils/useFoundation.js";
+const Se = /* @__PURE__ */ Q({
+  name: "SideSheet",
+  __name: "SideSheet",
+  props: {
+    bodyStyle: {},
+    headerStyle: {},
+    maskStyle: {},
+    style: {},
+    title: {},
+    footer: { default: null },
+    children: {},
+    onCancel: {},
+    direction: {},
+    motion: { type: [Boolean, Object, Function], default: !0 },
+    afterVisibleChange: { type: Function, default: () => {
+    } },
+    className: {},
+    closable: { type: Boolean, default: !0 },
+    closeIcon: {},
+    closeOnEsc: { type: Boolean, default: !1 },
+    disableScroll: { type: Boolean, default: !0 },
+    getPopupContainer: {},
+    height: {},
+    keepDOM: { type: Boolean, default: !1 },
+    mask: { type: Boolean, default: !0 },
+    maskClosable: { type: Boolean, default: !0 },
+    placement: { default: "right" },
+    size: { default: "small" },
+    visible: { type: Boolean, default: !1 },
+    width: {},
+    zIndex: { default: 1e3 },
+    "aria-label": {}
+  },
+  emits: ["cancel", "update:visible"],
+  setup(v, { emit: F }) {
+    const t = v, S = F, i = ne.PREFIX, j = ie.HEIGHT, w = n(() => ue(t.motion, t)), f = n(() => w.value.enabled), o = n(() => w.value.motionObject), l = y({
+      displayNone: !t.visible
+    }), g = y(""), N = y(0), C = y("100%"), K = () => {
+      const e = document.createElement("div");
+      e.style.cssText = "width: 99px; height: 99px; overflow: scroll; position: absolute; top: -9999px;", document.body.appendChild(e);
+      const a = e.offsetWidth - e.clientWidth;
+      return document.body.removeChild(e), a;
+    }, R = {
+      getProps: () => ({
+        ...t,
+        motion: f.value
+      }),
+      getProp: (e) => t[e],
+      getState: (e) => ({
+        displayNone: l.value.displayNone
+      })[e],
+      getStates: () => ({
+        displayNone: l.value.displayNone
+      }),
+      setState: (e, a) => {
+        Object.assign(l.value, e), a == null || a();
+      },
+      getContext: () => {
+      },
+      getContexts: () => ({}),
+      getCache: () => {
+      },
+      getCaches: () => ({}),
+      setCache: () => {
+      },
+      stopPropagation: (e) => {
+        var a;
+        return (a = e == null ? void 0 : e.stopPropagation) == null ? void 0 : a.call(e);
+      },
+      persistEvent: () => {
+      },
+      disabledBodyScroll: () => {
+        const { getPopupContainer: e } = t;
+        g.value = document.body.style.overflow || "", !e && g.value !== "hidden" && (document.body.style.overflow = "hidden", document.body.style.width = `calc(${C.value || "100%"} - ${N.value}px)`);
+      },
+      enabledBodyScroll: () => {
+        const { getPopupContainer: e } = t;
+        e || (document.body.style.overflow = g.value, document.body.style.width = C.value);
+      },
+      notifyCancel: (e) => {
+        S("cancel", e);
+      },
+      notifyVisibleChange: (e) => {
+        var a;
+        (a = t.afterVisibleChange) == null || a.call(t, e);
+      },
+      setOnKeyDownListener: () => {
+        typeof window < "u" && window.addEventListener("keydown", k);
+      },
+      removeKeyDownListener: () => {
+        typeof window < "u" && window.removeEventListener("keydown", k);
+      },
+      toggleDisplayNone: (e) => {
+        e !== l.value.displayNone && (l.value.displayNone = e);
+      }
+    }, { foundation: c } = me(se, R), V = (e) => {
+      c.handleCancel(e), S("update:visible", !1);
+    }, k = (e) => {
+      c.handleKeyDown(e);
+    }, P = () => {
+      var a, s, r, d, u, m;
+      const e = p.value ? "enter" : "leave";
+      o.value && (e === "enter" ? (s = (a = o.value).didEnter) == null || s.call(a) : e === "leave" && ((d = (r = o.value).didLeave) == null || d.call(r)), (m = (u = o.value).onRest) == null || m.call(u)), c.toggleDisplayNone(!t.visible);
+    }, E = () => {
+      var a, s, r, d, u, m;
+      const e = p.value ? "enter" : "leave";
+      o.value && (e === "enter" ? ((s = (a = o.value).willEnter) == null || s.call(a), (d = (r = o.value).onStart) == null || d.call(r)) : e === "leave" && ((m = (u = o.value).willLeave) == null || m.call(u)));
+    }, p = n(() => t.visible), T = n(() => t.visible || t.keepDOM || f.value && !l.value.displayNone), G = n(() => {
+      const e = {
+        zIndex: t.zIndex
+      };
+      return t.getPopupContainer && (e.position = "static"), e;
+    }), U = n(() => t.placement === "left" || t.placement === "right"), $ = n(() => t.placement === "top" || t.placement === "bottom"), X = n(() => $.value ? t.height ? t.height : j : "100%"), q = n(() => le(i, t.className, {
+      [`${i}-${t.placement}`]: t.placement,
+      [`${i}-popup`]: t.getPopupContainer,
+      [`${i}-horizontal`]: $.value,
+      [`${i}-rtl`]: t.direction === "rtl",
+      [`${i}-hidden`]: t.keepDOM && l.value.displayNone
+    })), J = n(() => ({
+      ...U.value ? t.width ? { width: t.width } : {} : { width: "100%" },
+      title: t.title,
+      footer: t.footer,
+      closable: t.closable,
+      closeIcon: t.closeIcon,
+      mask: t.mask,
+      maskClosable: t.maskClosable,
+      maskStyle: t.maskStyle,
+      headerStyle: t.headerStyle,
+      bodyStyle: t.bodyStyle,
+      size: t.size,
+      className: q.value,
+      height: X.value,
+      style: t.style,
+      "aria-label": t["aria-label"],
+      visible: t.visible,
+      motion: !1,
+      // Content doesn't handle motion, parent handles it
+      onClose: V
+    }));
+    return I(
+      () => t.visible,
+      (e, a) => {
+        var s, r, d, u, m, x, B, z, _, D, L, O;
+        e && l.value.displayNone && (l.value.displayNone = !1), !e && !f.value && !l.value.displayNone && (o.value && ((r = (s = o.value).willLeave) == null || r.call(s)), l.value.displayNone = !0, o.value && ((u = (d = o.value).didLeave) == null || u.call(d), (x = (m = o.value).onRest) == null || x.call(m))), !a && e && (o.value && ((z = (B = o.value).willEnter) == null || z.call(B), (D = (_ = o.value).onStart) == null || D.call(_)), c.beforeShow()), a && !e && (o.value && ((O = (L = o.value).willLeave) == null || O.call(L)), c.afterHide());
+      },
+      { immediate: !0 }
+    ), I(
+      () => l.value.displayNone,
+      (e) => {
+        c.onVisibleChange(!e);
+      }
+    ), Y(() => {
+      N.value = K(), C.value = document.body.style.width, t.visible && c.beforeShow();
+    }), Z(() => {
+      t.visible && c.destroy();
+    }), (e, a) => (H(), M(A, {
+      motion: f.value,
+      animationState: p.value ? "enter" : "leave",
+      startClassName: p.value ? `${h(i)}-animation-mask_show` : `${h(i)}-animation-mask_hide`,
+      onAnimationStart: E,
+      onAnimationEnd: P
+    }, {
+      default: b(({
+        animationClassName: s,
+        animationEventsNeedBind: r
+      }) => [
+        W(A, {
+          motion: f.value,
+          animationState: p.value ? "enter" : "leave",
+          startClassName: p.value ? `${h(i)}-animation-content_show_${v.placement}` : `${h(i)}-animation-content_hide_${v.placement}`,
+          onAnimationStart: E,
+          onAnimationEnd: P
+        }, {
+          default: b(({ animationClassName: d, animationStyle: u, animationEventsNeedBind: m }) => [
+            T.value ? (H(), M(de, {
+              key: 0,
+              style: te(G.value),
+              getPopupContainer: v.getPopupContainer
+            }, {
+              default: b(() => [
+                W(re, ae(J.value, {
+                  maskExtraProps: r,
+                  wrapperExtraProps: m,
+                  dialogClassName: d,
+                  maskClassName: s,
+                  maskStyle: { ...v.maskStyle },
+                  style: { ...u, ...v.style }
+                }), {
+                  default: b(() => [
+                    oe(e.$slots, "default")
+                  ]),
+                  _: 3
+                }, 16, ["maskExtraProps", "wrapperExtraProps", "dialogClassName", "maskClassName", "maskStyle", "style"])
+              ]),
+              _: 2
+            }, 1032, ["style", "getPopupContainer"])) : ee("", !0)
+          ]),
+          _: 2
+        }, 1032, ["motion", "animationState", "startClassName"])
+      ]),
+      _: 3
+    }, 8, ["motion", "animationState", "startClassName"]));
+  }
+});
+export {
+  Se as default
+};
+//# sourceMappingURL=SideSheet.vue.js.map

package/lib/es/components/sideSheet/SideSheet.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideSheet.vue.js","sources":["../../../../src/components/sideSheet/SideSheet.vue"],"sourcesContent":["<template>\n    <CSSAnimation\n        :motion=\"motionEnabled\"\n        :animationState=\"visible ? 'enter' : 'leave'\"\n        :startClassName=\"visible ? `${prefixCls}-animation-mask_show` : `${prefixCls}-animation-mask_hide`\"\n        :onAnimationStart=\"handleAnimationStart\"\n        :onAnimationEnd=\"updateState\"\n    >\n        <template\n            #default=\"{\n                animationClassName: maskAnimationClassName,\n                animationEventsNeedBind: maskAnimationEventsNeedBind,\n            }\"\n        >\n            <CSSAnimation\n                :motion=\"motionEnabled\"\n                :animationState=\"visible ? 'enter' : 'leave'\"\n                :startClassName=\"\n                    visible\n                        ? `${prefixCls}-animation-content_show_${placement}`\n                        : `${prefixCls}-animation-content_hide_${placement}`\n                \"\n                :onAnimationStart=\"handleAnimationStart\"\n                :onAnimationEnd=\"updateState\"\n            >\n                <template #default=\"{ animationClassName, animationStyle, animationEventsNeedBind }\">\n                    <Portal v-if=\"shouldRender\" :style=\"wrapperStyle\" :getPopupContainer=\"getPopupContainer\">\n                        <SideSheetContent\n                            v-bind=\"contentProps\"\n                            :maskExtraProps=\"maskAnimationEventsNeedBind\"\n                            :wrapperExtraProps=\"animationEventsNeedBind\"\n                            :dialogClassName=\"animationClassName\"\n                            :maskClassName=\"maskAnimationClassName\"\n                            :maskStyle=\"{ ...maskStyle }\"\n                            :style=\"{ ...animationStyle, ...style }\"\n                        >\n                            <slot></slot>\n                        </SideSheetContent>\n                    </Portal>\n                </template>\n            </CSSAnimation>\n        </template>\n    </CSSAnimation>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, watch, onMounted, onBeforeUnmount } from 'vue';\nimport classNames from 'classnames';\nimport { cssClasses, strings } from '@douyinfe/semi-foundation/sideSheet/constants';\nimport SideSheetFoundation, { SideSheetAdapter } from '@douyinfe/semi-foundation/sideSheet/sideSheetFoundation';\nimport SideSheetContent from './SideSheetContent.vue';\nimport Portal from '../_portal/Portal.vue';\nimport CSSAnimation from '../_cssAnimation/index.vue';\nimport { useFoundation } from '../_utils';\nimport { normalizeMotion } from '../_utils/motion';\nimport type { SideSheetProps, SideSheetState } from './interface';\n\ndefineOptions({\n    name: 'SideSheet',\n});\n\nconst props = withDefaults(defineProps<SideSheetProps>(), {\n    visible: false,\n    motion: true,\n    mask: true,\n    placement: 'right',\n    closable: true,\n    footer: null,\n    zIndex: 1000,\n    maskClosable: true,\n    size: 'small',\n    disableScroll: true,\n    closeOnEsc: false,\n    afterVisibleChange: () => {},\n    keepDOM: false,\n});\n\nconst emit = defineEmits<{\n    cancel: [e: MouseEvent | KeyboardEvent];\n    'update:visible': [visible: boolean];\n}>();\n\nconst prefixCls = cssClasses.PREFIX;\nconst defaultHeight = strings.HEIGHT;\n\n// Normalize motion\nconst normalizedMotion = computed(() => normalizeMotion(props.motion, props));\nconst motionEnabled = computed(() => normalizedMotion.value.enabled);\nconst motionObject = computed(() => normalizedMotion.value.motionObject);\n\n// State\nconst state = ref<SideSheetState>({\n    displayNone: !props.visible,\n});\n\nconst bodyOverflow = ref<string>('');\nconst scrollBarWidth = ref(0);\nconst originBodyWidth = ref('100%');\n\n// Get scrollbar width\nconst getScrollbarWidth = () => {\n    const scrollDiv = document.createElement('div');\n    scrollDiv.style.cssText = 'width: 99px; height: 99px; overflow: scroll; position: absolute; top: -9999px;';\n    document.body.appendChild(scrollDiv);\n    const scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth;\n    document.body.removeChild(scrollDiv);\n    return scrollbarWidth;\n};\n\n// Adapter\nconst adapter: SideSheetAdapter = {\n    getProps: () =>\n        ({\n            ...props,\n            motion: motionEnabled.value,\n        }) as any,\n    getProp: (key: string) => (props as any)[key],\n    getState: (key: string) => {\n        const stateMap: Record<string, any> = {\n            displayNone: state.value.displayNone,\n        };\n        return stateMap[key];\n    },\n    getStates: () => ({\n        displayNone: state.value.displayNone,\n    }),\n    setState: (states: Partial<SideSheetState>, callback?: () => void) => {\n        Object.assign(state.value, states);\n        callback?.();\n    },\n    getContext: () => undefined,\n    getContexts: () => ({}),\n    getCache: () => undefined,\n    getCaches: () => ({}),\n    setCache: () => {},\n    stopPropagation: (e: any) => e?.stopPropagation?.(),\n    persistEvent: () => {},\n    disabledBodyScroll: () => {\n        const { getPopupContainer } = props;\n        bodyOverflow.value = document.body.style.overflow || '';\n        if (!getPopupContainer && bodyOverflow.value !== 'hidden') {\n            document.body.style.overflow = 'hidden';\n            document.body.style.width = `calc(${originBodyWidth.value || '100%'} - ${scrollBarWidth.value}px)`;\n        }\n    },\n    enabledBodyScroll: () => {\n        const { getPopupContainer } = props;\n        if (!getPopupContainer) {\n            document.body.style.overflow = bodyOverflow.value;\n            document.body.style.width = originBodyWidth.value;\n        }\n    },\n    notifyCancel: (e: MouseEvent | KeyboardEvent) => {\n        // 在 Vue 3 中，@cancel 事件监听器会被转换为 onCancel prop\n        // emit('cancel', e) 会自动调用 props.onCancel（如果存在），避免重复调用\n        emit('cancel', e);\n    },\n    notifyVisibleChange: (visible: boolean) => {\n        props.afterVisibleChange?.(visible);\n    },\n    setOnKeyDownListener: () => {\n        if (typeof window !== 'undefined') {\n            window.addEventListener('keydown', handleKeyDown);\n        }\n    },\n    removeKeyDownListener: () => {\n        if (typeof window !== 'undefined') {\n            window.removeEventListener('keydown', handleKeyDown);\n        }\n    },\n    toggleDisplayNone: (displayNone: boolean) => {\n        if (displayNone !== state.value.displayNone) {\n            state.value.displayNone = displayNone;\n        }\n    },\n};\n\nconst { foundation } = useFoundation(SideSheetFoundation, adapter);\n\n// Handlers\nconst handleCancel = (e: MouseEvent) => {\n    foundation.handleCancel(e);\n    // 发出 update:visible 事件以支持 v-model:visible\n    emit('update:visible', false);\n};\n\nconst handleKeyDown = (e: KeyboardEvent) => {\n    foundation.handleKeyDown(e);\n};\n\nconst updateState = () => {\n    const state = visible.value ? 'enter' : 'leave';\n    if (motionObject.value) {\n        if (state === 'enter') {\n            motionObject.value.didEnter?.();\n        } else if (state === 'leave') {\n            motionObject.value.didLeave?.();\n        }\n        motionObject.value.onRest?.();\n    }\n    foundation.toggleDisplayNone(!props.visible);\n};\n\nconst handleAnimationStart = () => {\n    const state = visible.value ? 'enter' : 'leave';\n    if (motionObject.value) {\n        if (state === 'enter') {\n            motionObject.value.willEnter?.();\n            motionObject.value.onStart?.();\n        } else if (state === 'leave') {\n            motionObject.value.willLeave?.();\n        }\n    }\n};\n\n// Computed\nconst visible = computed(() => props.visible);\n\nconst shouldRender = computed(() => {\n    return props.visible || props.keepDOM || (motionEnabled.value && !state.value.displayNone);\n});\n\nconst wrapperStyle = computed(() => {\n    const style: Record<string, any> = {\n        zIndex: props.zIndex,\n    };\n    if (props.getPopupContainer) {\n        style.position = 'static';\n    }\n    return style;\n});\n\nconst isVertical = computed(() => {\n    return props.placement === 'left' || props.placement === 'right';\n});\n\nconst isHorizontal = computed(() => {\n    return props.placement === 'top' || props.placement === 'bottom';\n});\n\nconst sheetHeight = computed(() => {\n    return isHorizontal.value ? (props.height ? props.height : defaultHeight) : '100%';\n});\n\nconst classList = computed(() => {\n    return classNames(prefixCls, props.className, {\n        [`${prefixCls}-${props.placement}`]: props.placement,\n        [`${prefixCls}-popup`]: props.getPopupContainer,\n        [`${prefixCls}-horizontal`]: isHorizontal.value,\n        [`${prefixCls}-rtl`]: props.direction === 'rtl',\n        [`${prefixCls}-hidden`]: props.keepDOM && state.value.displayNone,\n    });\n});\n\nconst contentProps = computed(() => {\n    return {\n        ...(isVertical.value ? (props.width ? { width: props.width } : {}) : { width: '100%' }),\n        title: props.title,\n        footer: props.footer,\n        closable: props.closable,\n        closeIcon: props.closeIcon,\n        mask: props.mask,\n        maskClosable: props.maskClosable,\n        maskStyle: props.maskStyle,\n        headerStyle: props.headerStyle,\n        bodyStyle: props.bodyStyle,\n        size: props.size,\n        className: classList.value,\n        height: sheetHeight.value,\n        style: props.style,\n        'aria-label': props['aria-label'],\n        visible: props.visible,\n        motion: false, // Content doesn't handle motion, parent handles it\n        onClose: handleCancel,\n    };\n});\n\n// Watchers\nwatch(\n    () => props.visible,\n    (newVal, oldVal) => {\n        if (newVal && state.value.displayNone) {\n            state.value.displayNone = false;\n        }\n\n        // 当 visible 变为 false 时，如果没有动画，立即设置 displayNone\n        // 如果有动画，displayNone 会在动画结束后通过 updateState 更新\n        if (!newVal && !motionEnabled.value && !state.value.displayNone) {\n            if (motionObject.value) {\n                motionObject.value.willLeave?.();\n            }\n            state.value.displayNone = true;\n            if (motionObject.value) {\n                motionObject.value.didLeave?.();\n                motionObject.value.onRest?.();\n            }\n        }\n\n        // hide => show\n        if (!oldVal && newVal) {\n            if (motionObject.value) {\n                motionObject.value.willEnter?.();\n                motionObject.value.onStart?.();\n            }\n            foundation.beforeShow();\n        }\n        // show => hide\n        if (oldVal && !newVal) {\n            if (motionObject.value) {\n                motionObject.value.willLeave?.();\n            }\n            foundation.afterHide();\n        }\n    },\n    { immediate: true }\n);\n\nwatch(\n    () => state.value.displayNone,\n    (newVal) => {\n        foundation.onVisibleChange(!newVal);\n    }\n);\n\n// Lifecycle\nonMounted(() => {\n    scrollBarWidth.value = getScrollbarWidth();\n    originBodyWidth.value = document.body.style.width;\n    if (props.visible) {\n        foundation.beforeShow();\n    }\n});\n\nonBeforeUnmount(() => {\n    if (props.visible) {\n        foundation.destroy();\n    }\n});\n</script>\n"],"names":["props","__props","emit","__emit","prefixCls","cssClasses","defaultHeight","strings","normalizedMotion","computed","normalizeMotion","motionEnabled","motionObject","state","ref","bodyOverflow","scrollBarWidth","originBodyWidth","getScrollbarWidth","scrollDiv","scrollbarWidth","adapter","key","states","callback","_a","getPopupContainer","visible","handleKeyDown","displayNone","foundation","useFoundation","SideSheetFoundation","handleCancel","updateState","_b","_d","_c","_f","_e","handleAnimationStart","shouldRender","wrapperStyle","style","isVertical","isHorizontal","sheetHeight","classList","classNames","contentProps","watch","newVal","oldVal","_h","_g","_j","_i","_l","_k","onMounted","onBeforeUnmount","_createBlock","CSSAnimation","_unref","maskAnimationClassName","maskAnimationEventsNeedBind","_createVNode","animationClassName","animationStyle","animationEventsNeedBind","Portal","SideSheetContent","_mergeProps","_renderSlot","_ctx"],"mappings":"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"}

package/lib/es/components/sideSheet/SideSheetContent.vue.js

@@ -0,0 +1,144 @@
+import { defineComponent as p, useAttrs as z, computed as y, createElementBlock as c, openBlock as m, mergeProps as B, createCommentVNode as k, createElementVNode as f, normalizeStyle as u, normalizeClass as d, unref as l, createBlock as C, isVNode as x, resolveDynamicComponent as g, Fragment as w, createTextVNode as A, toDisplayString as $, h as D, renderSlot as I } from "vue";
+import V from "classnames";
+import { cssClasses as F } from "@douyinfe/semi-foundation/sideSheet/constants";
+import T from "../iconButton/IconButton.vue.js";
+import M from "@douyinfe/semi-foundation/utils/getDataAttr";
+import R from "../icons/icons/IconClose.js";
+const K = /* @__PURE__ */ p({
+  name: "SideSheetContent",
+  inheritAttrs: !1,
+  __name: "SideSheetContent",
+  props: {
+    onClose: { type: Function },
+    closeIcon: {},
+    mask: { type: Boolean },
+    maskStyle: {},
+    maskClosable: { type: Boolean },
+    maskClassName: {},
+    title: {},
+    closable: { type: Boolean },
+    headerStyle: {},
+    width: {},
+    height: {},
+    style: {},
+    size: {},
+    bodyStyle: {},
+    className: {},
+    dialogClassName: {},
+    children: {},
+    footer: {},
+    "aria-label": {},
+    maskExtraProps: {},
+    wrapperExtraProps: {}
+  },
+  setup(t) {
+    const a = t, v = z(), o = F.PREFIX, S = (e) => {
+      a.maskClosable && e.target === e.currentTarget && h(e);
+    }, h = (e) => {
+      var n, r;
+      (n = e == null ? void 0 : e.stopPropagation) == null || n.call(e), (r = e == null ? void 0 : e.preventDefault) == null || r.call(e), a.onClose && typeof a.onClose == "function" && a.onClose(e);
+    }, E = y(() => V(a.className, {
+      [`${o}-fixed`]: !a.mask,
+      [`${o}-size-${a.size}`]: !a.mask
+    })), P = y(() => {
+      const e = {};
+      return !a.mask && a.width && (e.width = a.width), e;
+    }), b = y(() => {
+      const e = { ...a.style };
+      return a.width && (e.width = a.width, a.mask || (e.width = "100%")), a.height && (e.height = a.height), e;
+    }), N = y(() => M(v));
+    return (e, n) => (m(), c("div", B({
+      class: E.value,
+      style: P.value
+    }, N.value), [
+      t.mask ? (m(), c("div", {
+        key: 0,
+        "aria-hidden": "true",
+        class: d([`${l(o)}-mask`, t.maskClassName || ""]),
+        style: u(t.maskStyle),
+        onClick: S,
+        onAnimationstart: n[0] || (n[0] = //@ts-ignore
+        (...r) => {
+          var s, i;
+          return ((s = t.maskExtraProps) == null ? void 0 : s.onAnimationstart) && ((i = t.maskExtraProps) == null ? void 0 : i.onAnimationstart(...r));
+        }),
+        onAnimationend: n[1] || (n[1] = //@ts-ignore
+        (...r) => {
+          var s, i;
+          return ((s = t.maskExtraProps) == null ? void 0 : s.onAnimationend) && ((i = t.maskExtraProps) == null ? void 0 : i.onAnimationend(...r));
+        })
+      }, null, 38)) : k("", !0),
+      f("div", {
+        role: "dialog",
+        tabindex: "-1",
+        class: d([
+          `${l(o)}-inner`,
+          `${l(o)}-inner-wrap`,
+          t.dialogClassName || "",
+          `${l(o)}-size-${t.size}`
+        ]),
+        style: u(b.value),
+        onAnimationstart: n[2] || (n[2] = //@ts-ignore
+        (...r) => {
+          var s, i;
+          return ((s = t.wrapperExtraProps) == null ? void 0 : s.onAnimationstart) && ((i = t.wrapperExtraProps) == null ? void 0 : i.onAnimationstart(...r));
+        }),
+        onAnimationend: n[3] || (n[3] = //@ts-ignore
+        (...r) => {
+          var s, i;
+          return ((s = t.wrapperExtraProps) == null ? void 0 : s.onAnimationend) && ((i = t.wrapperExtraProps) == null ? void 0 : i.onAnimationend(...r));
+        })
+      }, [
+        f("div", {
+          class: d(`${l(o)}-content`)
+        }, [
+          f("div", {
+            class: d(`${l(o)}-header`),
+            role: "heading",
+            "aria-level": "1",
+            style: u(t.headerStyle)
+          }, [
+            t.title ? (m(), c("div", {
+              key: 0,
+              class: d(`${l(o)}-title`),
+              "x-semi-prop": "title"
+            }, [
+              x(t.title) ? (m(), C(g(t.title), { key: 0 })) : (m(), c(w, { key: 1 }, [
+                A($(t.title), 1)
+              ], 64))
+            ], 2)) : k("", !0),
+            t.closable ? (m(), C(T, {
+              key: "close-btn",
+              class: d(`${l(o)}-close`),
+              type: "tertiary",
+              icon: t.closeIcon || D(l(R)),
+              theme: "borderless",
+              size: "small",
+              onClick: h
+            }, null, 8, ["class", "icon"])) : k("", !0)
+          ], 6),
+          f("div", {
+            class: d(`${l(o)}-body`),
+            style: u(t.bodyStyle),
+            "x-semi-prop": "children"
+          }, [
+            I(e.$slots, "default")
+          ], 6),
+          t.footer ? (m(), c("div", {
+            key: 0,
+            class: d(`${l(o)}-footer`),
+            "x-semi-prop": "footer"
+          }, [
+            x(t.footer) ? (m(), C(g(t.footer), { key: 0 })) : (m(), c(w, { key: 1 }, [
+              A($(t.footer), 1)
+            ], 64))
+          ], 2)) : k("", !0)
+        ], 2)
+      ], 38)
+    ], 16));
+  }
+});
+export {
+  K as default
+};
+//# sourceMappingURL=SideSheetContent.vue.js.map

package/lib/es/components/sideSheet/SideSheetContent.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SideSheetContent.vue.js","sources":["../../../../src/components/sideSheet/SideSheetContent.vue"],"sourcesContent":["<template>\n    <div :class=\"wrapperCls\" :style=\"wrapperStyle\" v-bind=\"dataAttr\">\n        <div\n            v-if=\"mask\"\n            aria-hidden=\"true\"\n            :class=\"[`${prefixCls}-mask`, maskClassName || '']\"\n            :style=\"maskStyle\"\n            @click=\"handleMaskClick\"\n            @animationstart=\"maskExtraProps?.onAnimationstart\"\n            @animationend=\"maskExtraProps?.onAnimationend\"\n        />\n        <div\n            role=\"dialog\"\n            tabindex=\"-1\"\n            :class=\"[\n                `${prefixCls}-inner`,\n                `${prefixCls}-inner-wrap`,\n                dialogClassName || '',\n                `${prefixCls}-size-${size}`,\n            ]\"\n            :style=\"dialogStyle\"\n            @animationstart=\"wrapperExtraProps?.onAnimationstart\"\n            @animationend=\"wrapperExtraProps?.onAnimationend\"\n        >\n            <div :class=\"`${prefixCls}-content`\">\n                <div :class=\"`${prefixCls}-header`\" role=\"heading\" aria-level=\"1\" :style=\"headerStyle\">\n                    <div v-if=\"title\" :class=\"`${prefixCls}-title`\" x-semi-prop=\"title\">\n                        <component :is=\"title\" v-if=\"isVNode(title)\" />\n                        <template v-else>{{ title }}</template>\n                    </div>\n                    <IconButton\n                        v-if=\"closable\"\n                        key=\"close-btn\"\n                        :class=\"`${prefixCls}-close`\"\n                        type=\"tertiary\"\n                        :icon=\"closeIcon || h(IconClose)\"\n                        theme=\"borderless\"\n                        size=\"small\"\n                        @click=\"close\"\n                    />\n                </div>\n                <div :class=\"`${prefixCls}-body`\" :style=\"bodyStyle\" x-semi-prop=\"children\">\n                    <slot></slot>\n                </div>\n                <div v-if=\"footer\" :class=\"`${prefixCls}-footer`\" x-semi-prop=\"footer\">\n                    <component :is=\"footer\" v-if=\"isVNode(footer)\" />\n                    <template v-else>{{ footer }}</template>\n                </div>\n            </div>\n        </div>\n    </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, h, useAttrs, isVNode, type CSSProperties } from 'vue';\nimport classNames from 'classnames';\nimport { cssClasses } from '@douyinfe/semi-foundation/sideSheet/constants';\nimport IconButton from '../iconButton/IconButton.vue';\nimport { IconClose } from '../icons';\nimport type { SideSheetContentProps } from './interface';\nimport getDataAttr from '@douyinfe/semi-foundation/utils/getDataAttr';\n\ndefineOptions({\n    name: 'SideSheetContent',\n    inheritAttrs: false,\n});\n\nconst props = defineProps<SideSheetContentProps>();\n\nconst attrs = useAttrs();\nconst prefixCls = cssClasses.PREFIX;\n\nconst handleMaskClick = (e: MouseEvent) => {\n    if (props.maskClosable && e.target === e.currentTarget) {\n        close(e);\n    }\n};\n\nconst close = (e: MouseEvent) => {\n    e?.stopPropagation?.();\n    e?.preventDefault?.();\n    if (props.onClose && typeof props.onClose === 'function') {\n        props.onClose(e);\n    }\n};\n\nconst wrapperCls = computed(() => {\n    return classNames(props.className, {\n        [`${prefixCls}-fixed`]: !props.mask,\n        [`${prefixCls}-size-${props.size}`]: !props.mask,\n    });\n});\n\nconst wrapperStyle = computed<CSSProperties>(() => {\n    const style: CSSProperties = {};\n    if (!props.mask && props.width) {\n        style.width = props.width;\n    }\n    return style;\n});\n\nconst dialogStyle = computed<CSSProperties>(() => {\n    const style: CSSProperties = { ...props.style };\n    if (props.width) {\n        style.width = props.width;\n        // When the mask is false, the width is set on the wrapper. At this time, sidesheet-inner does not need to set the width again\n        if (!props.mask) {\n            style.width = '100%';\n        }\n    }\n    if (props.height) {\n        style.height = props.height;\n    }\n    return style;\n});\n\nconst dataAttr = computed(() => {\n    return getDataAttr(attrs);\n});\n</script>\n"],"names":["props","__props","attrs","useAttrs","prefixCls","cssClasses","handleMaskClick","close","_a","_b","wrapperCls","computed","classNames","wrapperStyle","style","dialogStyle","dataAttr","getDataAttr","_openBlock","_createElementBlock","_mergeProps","_normalizeClass","_unref","_cache","args","_createElementVNode","isVNode","_createBlock","_resolveDynamicComponent","_Fragment","IconButton","h","IconClose","_renderSlot","_ctx"],"mappings":"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"}

package/lib/es/components/sideSheet/index.js

@@ -0,0 +1,7 @@
+import t from "./SideSheet.vue.js";
+/* empty css               */
+export {
+  t as SideSheet,
+  t as default
+};
+//# sourceMappingURL=index.js.map

package/lib/es/components/sideSheet/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}

package/lib/es/components/skeleton/Skeleton.vue.js

@@ -0,0 +1,33 @@
+import { defineComponent as n, computed as r, createElementBlock as c, renderSlot as s, openBlock as m, normalizeStyle as i, normalizeClass as p } from "vue";
+import d from "classnames";
+import { cssClasses as t } from "@douyinfe/semi-foundation/skeleton/constants";
+const v = /* @__PURE__ */ n({
+  __name: "Skeleton",
+  props: {
+    active: { type: Boolean },
+    className: {},
+    loading: { type: Boolean, default: !0 },
+    placeholder: {},
+    style: {}
+  },
+  setup(e) {
+    const l = e, a = r(() => d(
+      t.PREFIX,
+      {
+        [`${t.PREFIX}-active`]: !!l.active
+      },
+      l.className
+    ));
+    return (o, u) => e.loading ? (m(), c("div", {
+      key: 0,
+      class: p(a.value),
+      style: i(e.style)
+    }, [
+      s(o.$slots, "placeholder")
+    ], 6)) : s(o.$slots, "default", { key: 1 });
+  }
+});
+export {
+  v as default
+};
+//# sourceMappingURL=Skeleton.vue.js.map

package/lib/es/components/skeleton/Skeleton.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton.vue.js","sources":["../../../../src/components/skeleton/Skeleton.vue"],"sourcesContent":["<template>\n    <div v-if=\"loading\" :class=\"skeletonClasses\" :style=\"style\">\n        <slot name=\"placeholder\"></slot>\n    </div>\n    <template v-else>\n        <slot></slot>\n    </template>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport classNames from 'classnames';\nimport { cssClasses } from '@douyinfe/semi-foundation/skeleton/constants';\nimport type { SkeletonProps } from './interface';\n\nconst props = withDefaults(defineProps<SkeletonProps>(), {\n    loading: true,\n});\n\nconst skeletonClasses = computed(() => {\n    return classNames(\n        cssClasses.PREFIX,\n        {\n            [`${cssClasses.PREFIX}-active`]: Boolean(props.active),\n        },\n        props.className\n    );\n});\n</script>\n"],"names":["props","__props","skeletonClasses","computed","classNames","cssClasses","_createElementBlock","_renderSlot","_ctx"],"mappings":";;;;;;;;;;;;;AAeA,UAAMA,IAAQC,GAIRC,IAAkBC,EAAS,MACtBC;AAAA,MACHC,EAAW;AAAA,MACX;AAAA,QACI,CAAC,GAAGA,EAAW,MAAM,SAAS,GAAG,EAAQL,EAAM;AAAA,MAAM;AAAA,MAEzDA,EAAM;AAAA,IAAA,CAEb;qBA1BcC,EAAA,gBAAXK,EAEM,OAAA;AAAA;MAFe,SAAOJ,EAAA,KAAe;AAAA,MAAG,SAAOD,EAAA,KAAK;AAAA,IAAA;MACtDM,EAAgCC,EAAA,QAAA,aAAA;AAAA,IAAA,SAGhCD,EAAaC,EAAA,QAAA,WAAA,EAAA,KAAA,GAAA;AAAA;;"}

package/lib/es/components/skeleton/SkeletonAvatar.vue.js

@@ -0,0 +1,30 @@
+import { defineComponent as t, computed as l, createElementBlock as r, openBlock as o, normalizeStyle as c, normalizeClass as m } from "vue";
+import n from "classnames";
+import { cssClasses as p } from "@douyinfe/semi-foundation/skeleton/constants";
+const v = /* @__PURE__ */ t({
+  __name: "SkeletonAvatar",
+  props: {
+    size: { default: "medium" },
+    shape: { default: "circle" },
+    prefixCls: { default: p.PREFIX },
+    className: {},
+    style: {},
+    type: {}
+  },
+  setup(a) {
+    const e = a, s = l(() => n(
+      e.className,
+      `${e.prefixCls}-avatar`,
+      `${e.prefixCls}-avatar-${e.size}`,
+      `${e.prefixCls}-avatar-${e.shape}`
+    ));
+    return (i, f) => (o(), r("div", {
+      class: m(s.value),
+      style: c(a.style)
+    }, null, 6));
+  }
+});
+export {
+  v as default
+};
+//# sourceMappingURL=SkeletonAvatar.vue.js.map

package/lib/es/components/skeleton/SkeletonAvatar.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonAvatar.vue.js","sources":["../../../../src/components/skeleton/SkeletonAvatar.vue"],"sourcesContent":["<template>\n    <div :class=\"avatarClasses\" :style=\"style\"></div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport classNames from 'classnames';\nimport { cssClasses } from '@douyinfe/semi-foundation/skeleton/constants';\nimport type { AvatarProps } from './interface';\n\nconst props = withDefaults(defineProps<AvatarProps>(), {\n    prefixCls: cssClasses.PREFIX,\n    size: 'medium',\n    shape: 'circle',\n});\n\nconst avatarClasses = computed(() => {\n    return classNames(\n        props.className,\n        `${props.prefixCls}-avatar`,\n        `${props.prefixCls}-avatar-${props.size}`,\n        `${props.prefixCls}-avatar-${props.shape}`\n    );\n});\n</script>\n"],"names":["props","__props","avatarClasses","computed","classNames","_createElementBlock"],"mappings":";;;;;;;;;;;;;;AAUA,UAAMA,IAAQC,GAMRC,IAAgBC,EAAS,MACpBC;AAAA,MACHJ,EAAM;AAAA,MACN,GAAGA,EAAM,SAAS;AAAA,MAClB,GAAGA,EAAM,SAAS,WAAWA,EAAM,IAAI;AAAA,MACvC,GAAGA,EAAM,SAAS,WAAWA,EAAM,KAAK;AAAA,IAAA,CAE/C;2BAtBGK,EAAiD,OAAA;AAAA,MAA3C,SAAOH,EAAA,KAAa;AAAA,MAAG,SAAOD,EAAA,KAAK;AAAA,IAAA;;;"}

package/lib/es/components/skeleton/SkeletonButton.vue.js

@@ -0,0 +1,23 @@
+import { defineComponent as l, computed as o, createElementBlock as a, openBlock as n, normalizeStyle as r, normalizeClass as c } from "vue";
+import m from "classnames";
+import { cssClasses as p } from "@douyinfe/semi-foundation/skeleton/constants";
+const y = /* @__PURE__ */ l({
+  __name: "SkeletonButton",
+  props: {
+    prefixCls: { default: p.PREFIX },
+    className: {},
+    style: {},
+    type: {}
+  },
+  setup(e) {
+    const s = e, t = o(() => m(s.className, `${s.prefixCls}-button`));
+    return (u, i) => (n(), a("div", {
+      class: c(t.value),
+      style: r(e.style)
+    }, null, 6));
+  }
+});
+export {
+  y as default
+};
+//# sourceMappingURL=SkeletonButton.vue.js.map

package/lib/es/components/skeleton/SkeletonButton.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonButton.vue.js","sources":["../../../../src/components/skeleton/SkeletonButton.vue"],"sourcesContent":["<template>\n    <div :class=\"buttonClasses\" :style=\"style\"></div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport classNames from 'classnames';\nimport { cssClasses } from '@douyinfe/semi-foundation/skeleton/constants';\nimport type { BasicProps } from './interface';\n\nconst props = withDefaults(defineProps<BasicProps>(), {\n    prefixCls: cssClasses.PREFIX,\n});\n\nconst buttonClasses = computed(() => {\n    return classNames(props.className, `${props.prefixCls}-button`);\n});\n</script>\n"],"names":["props","__props","buttonClasses","computed","classNames","_createElementBlock"],"mappings":";;;;;;;;;;;;AAUA,UAAMA,IAAQC,GAIRC,IAAgBC,EAAS,MACpBC,EAAWJ,EAAM,WAAW,GAAGA,EAAM,SAAS,SAAS,CACjE;2BAfGK,EAAiD,OAAA;AAAA,MAA3C,SAAOH,EAAA,KAAa;AAAA,MAAG,SAAOD,EAAA,KAAK;AAAA,IAAA;;;"}

package/lib/es/components/skeleton/SkeletonImage.vue.js

@@ -0,0 +1,23 @@
+import { defineComponent as t, computed as a, createElementBlock as o, openBlock as m, normalizeStyle as r, normalizeClass as n } from "vue";
+import c from "classnames";
+import { cssClasses as p } from "@douyinfe/semi-foundation/skeleton/constants";
+const y = /* @__PURE__ */ t({
+  __name: "SkeletonImage",
+  props: {
+    prefixCls: { default: p.PREFIX },
+    className: {},
+    style: {},
+    type: {}
+  },
+  setup(e) {
+    const s = e, l = a(() => c(s.className, `${s.prefixCls}-image`));
+    return (i, f) => (m(), o("div", {
+      class: n(l.value),
+      style: r(e.style)
+    }, null, 6));
+  }
+});
+export {
+  y as default
+};
+//# sourceMappingURL=SkeletonImage.vue.js.map

package/lib/es/components/skeleton/SkeletonImage.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonImage.vue.js","sources":["../../../../src/components/skeleton/SkeletonImage.vue"],"sourcesContent":["<template>\n    <div :class=\"imageClasses\" :style=\"style\"></div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport classNames from 'classnames';\nimport { cssClasses } from '@douyinfe/semi-foundation/skeleton/constants';\nimport type { BasicProps } from './interface';\n\nconst props = withDefaults(defineProps<BasicProps>(), {\n    prefixCls: cssClasses.PREFIX,\n});\n\nconst imageClasses = computed(() => {\n    return classNames(props.className, `${props.prefixCls}-image`);\n});\n</script>\n"],"names":["props","__props","imageClasses","computed","classNames","_createElementBlock"],"mappings":";;;;;;;;;;;;AAUA,UAAMA,IAAQC,GAIRC,IAAeC,EAAS,MACnBC,EAAWJ,EAAM,WAAW,GAAGA,EAAM,SAAS,QAAQ,CAChE;2BAfGK,EAAgD,OAAA;AAAA,MAA1C,SAAOH,EAAA,KAAY;AAAA,MAAG,SAAOD,EAAA,KAAK;AAAA,IAAA;;;"}

package/lib/es/components/skeleton/SkeletonParagraph.vue.js

@@ -0,0 +1,26 @@
+import { defineComponent as o, computed as n, createElementBlock as s, openBlock as r, normalizeStyle as m, normalizeClass as c, Fragment as p, renderList as u } from "vue";
+import i from "classnames";
+import { cssClasses as f } from "@douyinfe/semi-foundation/skeleton/constants";
+const k = /* @__PURE__ */ o({
+  __name: "SkeletonParagraph",
+  props: {
+    rows: { default: 4 },
+    prefixCls: { default: f.PREFIX },
+    className: {},
+    style: {},
+    type: {}
+  },
+  setup(e) {
+    const a = e, t = n(() => i(a.className, `${a.prefixCls}-paragraph`));
+    return (d, y) => (r(), s("ul", {
+      class: c(t.value),
+      style: m(e.style)
+    }, [
+      (r(!0), s(p, null, u(e.rows, (l) => (r(), s("li", { key: l }))), 128))
+    ], 6));
+  }
+});
+export {
+  k as default
+};
+//# sourceMappingURL=SkeletonParagraph.vue.js.map

package/lib/es/components/skeleton/SkeletonParagraph.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonParagraph.vue.js","sources":["../../../../src/components/skeleton/SkeletonParagraph.vue"],"sourcesContent":["<template>\n    <ul :class=\"paragraphClasses\" :style=\"style\">\n        <li v-for=\"i in rows\" :key=\"i\"></li>\n    </ul>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport classNames from 'classnames';\nimport { cssClasses } from '@douyinfe/semi-foundation/skeleton/constants';\nimport type { ParagraphProps } from './interface';\n\nconst props = withDefaults(defineProps<ParagraphProps>(), {\n    prefixCls: cssClasses.PREFIX,\n    rows: 4,\n});\n\nconst paragraphClasses = computed(() => {\n    return classNames(props.className, `${props.prefixCls}-paragraph`);\n});\n</script>\n"],"names":["props","__props","paragraphClasses","computed","classNames","_createElementBlock","_Fragment","_renderList","i"],"mappings":";;;;;;;;;;;;;AAYA,UAAMA,IAAQC,GAKRC,IAAmBC,EAAS,MACvBC,EAAWJ,EAAM,WAAW,GAAGA,EAAM,SAAS,YAAY,CACpE;2BAlBGK,EAEK,MAAA;AAAA,MAFA,SAAOH,EAAA,KAAgB;AAAA,MAAG,SAAOD,EAAA,KAAK;AAAA,IAAA;cACvCI,EAAoCC,GAAA,MAAAC,EAApBN,EAAA,MAAI,CAATO,YAAXH,EAAoC,MAAA,EAAb,KAAKG,GAAC;;;;"}

package/lib/es/components/skeleton/SkeletonTitle.vue.js

@@ -0,0 +1,23 @@
+import { defineComponent as l, computed as a, createElementBlock as o, openBlock as r, normalizeStyle as n, normalizeClass as c } from "vue";
+import m from "classnames";
+import { cssClasses as i } from "@douyinfe/semi-foundation/skeleton/constants";
+const y = /* @__PURE__ */ l({
+  __name: "SkeletonTitle",
+  props: {
+    prefixCls: { default: i.PREFIX },
+    className: {},
+    style: {},
+    type: {}
+  },
+  setup(e) {
+    const s = e, t = a(() => m(s.className, `${s.prefixCls}-title`));
+    return (p, f) => (r(), o("div", {
+      class: c(t.value),
+      style: n(e.style)
+    }, null, 6));
+  }
+});
+export {
+  y as default
+};
+//# sourceMappingURL=SkeletonTitle.vue.js.map

package/lib/es/components/skeleton/SkeletonTitle.vue.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SkeletonTitle.vue.js","sources":["../../../../src/components/skeleton/SkeletonTitle.vue"],"sourcesContent":["<template>\n    <div :class=\"titleClasses\" :style=\"style\"></div>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport classNames from 'classnames';\nimport { cssClasses } from '@douyinfe/semi-foundation/skeleton/constants';\nimport type { BasicProps } from './interface';\n\nconst props = withDefaults(defineProps<BasicProps>(), {\n    prefixCls: cssClasses.PREFIX,\n});\n\nconst titleClasses = computed(() => {\n    return classNames(props.className, `${props.prefixCls}-title`);\n});\n</script>\n"],"names":["props","__props","titleClasses","computed","classNames","_createElementBlock"],"mappings":";;;;;;;;;;;;AAUA,UAAMA,IAAQC,GAIRC,IAAeC,EAAS,MACnBC,EAAWJ,EAAM,WAAW,GAAGA,EAAM,SAAS,QAAQ,CAChE;2BAfGK,EAAgD,OAAA;AAAA,MAA1C,SAAOH,EAAA,KAAY;AAAA,MAAG,SAAOD,EAAA,KAAK;AAAA,IAAA;;;"}