import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
import _extends from '@babel/runtime/helpers/esm/extends';
import { defineComponent, unref, mergeProps, ref, computed, createVNode, Fragment, watchEffect, watch, nextTick, resolveDirective, withCtx, withDirectives, createBlock, openBlock, renderList, useSSRContext, renderSlot } from 'vue';
import { _ as __nuxt_component_2, t as tooltipDefaultProps, b as abstractTooltipProps, c as getArrowStyle, P as PresetColors } from './index-Dxyzjwb5.mjs';
import { a8 as withInstall, a as useConfigStore, J as initDefaultProps, aE as warning, C as useConfigInject, D as genComponentStyleHook, F as classNames, E as omit, ab as getTransitionName, aF as useRouter, aG as useRoute, b as useUserStore, Z as merge, ae as initZoomMotion, a3 as filterEmpty, L as anyType, u as useRouter$1, az as useSwipe, x as getSupabaseStorageUrl, N as resetComponent, aH as api } from './server.mjs';
import { ssrRenderAttrs, ssrRenderComponent, ssrInterpolate, ssrRenderList, ssrGetDirectiveProps, ssrRenderAttr, ssrRenderClass, ssrIncludeBooleanAttr, ssrLooseContain, ssrRenderSlot } from 'vue/server-renderer';
import { U as UserProfilePic } from './UserProfilePic-DXA233hi.mjs';
import { B as BasicIconOld } from './BasicIconOld-I4c2ShMu.mjs';
import { d as getHighlightsList, e as getUserStories } from './media-BbtM6xvT.mjs';
import { s as setInterval, C as CustomProgressBar, a as _imports_0$2, i as img_gif } from './FullScreenStories-QnVpPJpC.mjs';
import { Swiper, SwiperSlide } from 'swiper/vue';
import { u as useMediaStore } from './media-kxpEX2xr.mjs';
import { e as empty_user } from './empty_user-BaUNCdgf.mjs';
import { i as img_gif$1 } from './post_loading-BiySI7bp.mjs';
import { B as BasicSheet } from './index-DVD7vSfp.mjs';
import { cloneDeep } from 'lodash-es';
import { _ as _export_sfc } from './_plugin-vue_export-helper-1tPrXgE0.mjs';

const genBaseStyle = (token) => {
  const {
    componentCls,
    popoverBg,
    popoverColor,
    width,
    fontWeightStrong,
    popoverPadding,
    boxShadowSecondary,
    colorTextHeading,
    borderRadiusLG: borderRadius,
    zIndexPopup,
    marginXS,
    colorBgElevated
  } = token;
  return [
    {
      [componentCls]: _extends(_extends({}, resetComponent(token)), {
        position: "absolute",
        top: 0,
        // use `left` to fix https://github.com/ant-design/ant-design/issues/39195
        left: {
          _skip_check_: true,
          value: 0
        },
        zIndex: zIndexPopup,
        fontWeight: "normal",
        whiteSpace: "normal",
        textAlign: "start",
        cursor: "auto",
        userSelect: "text",
        "--antd-arrow-background-color": colorBgElevated,
        "&-rtl": {
          direction: "rtl"
        },
        "&-hidden": {
          display: "none"
        },
        [`${componentCls}-content`]: {
          position: "relative"
        },
        [`${componentCls}-inner`]: {
          backgroundColor: popoverBg,
          backgroundClip: "padding-box",
          borderRadius,
          boxShadow: boxShadowSecondary,
          padding: popoverPadding
        },
        [`${componentCls}-title`]: {
          minWidth: width,
          marginBottom: marginXS,
          color: colorTextHeading,
          fontWeight: fontWeightStrong
        },
        [`${componentCls}-inner-content`]: {
          color: popoverColor
        }
      })
    },
    // Arrow Style
    getArrowStyle(token, {
      colorBg: "var(--antd-arrow-background-color)"
    }),
    // Pure Render
    {
      [`${componentCls}-pure`]: {
        position: "relative",
        maxWidth: "none",
        [`${componentCls}-content`]: {
          display: "inline-block"
        }
      }
    }
  ];
};
const genColorStyle = (token) => {
  const {
    componentCls
  } = token;
  return {
    [componentCls]: PresetColors.map((colorKey) => {
      const lightColor = token[`${colorKey}-6`];
      return {
        [`&${componentCls}-${colorKey}`]: {
          "--antd-arrow-background-color": lightColor,
          [`${componentCls}-inner`]: {
            backgroundColor: lightColor
          },
          [`${componentCls}-arrow`]: {
            background: "transparent"
          }
        }
      };
    })
  };
};
const genWireframeStyle = (token) => {
  const {
    componentCls,
    lineWidth,
    lineType,
    colorSplit,
    paddingSM,
    controlHeight,
    fontSize,
    lineHeight,
    padding
  } = token;
  const titlePaddingBlockDist = controlHeight - Math.round(fontSize * lineHeight);
  const popoverTitlePaddingBlockTop = titlePaddingBlockDist / 2;
  const popoverTitlePaddingBlockBottom = titlePaddingBlockDist / 2 - lineWidth;
  const popoverPaddingHorizontal = padding;
  return {
    [componentCls]: {
      [`${componentCls}-inner`]: {
        padding: 0
      },
      [`${componentCls}-title`]: {
        margin: 0,
        padding: `${popoverTitlePaddingBlockTop}px ${popoverPaddingHorizontal}px ${popoverTitlePaddingBlockBottom}px`,
        borderBottom: `${lineWidth}px ${lineType} ${colorSplit}`
      },
      [`${componentCls}-inner-content`]: {
        padding: `${paddingSM}px ${popoverPaddingHorizontal}px`
      }
    }
  };
};
const useStyle = genComponentStyleHook("Popover", (token) => {
  const {
    colorBgElevated,
    colorText,
    wireframe
  } = token;
  const popoverToken = merge(token, {
    popoverBg: colorBgElevated,
    popoverColor: colorText,
    popoverPadding: 12
    // Fixed Value
  });
  return [genBaseStyle(popoverToken), genColorStyle(popoverToken), wireframe && genWireframeStyle(popoverToken), initZoomMotion(popoverToken, "zoom-big")];
}, (_ref) => {
  let {
    zIndexPopupBase
  } = _ref;
  return {
    zIndexPopup: zIndexPopupBase + 30,
    width: 177
  };
});
const popoverProps = () => _extends(_extends({}, abstractTooltipProps()), {
  content: anyType(),
  title: anyType()
});
const Popover = defineComponent({
  compatConfig: {
    MODE: 3
  },
  name: "APopover",
  inheritAttrs: false,
  props: initDefaultProps(popoverProps(), _extends(_extends({}, tooltipDefaultProps()), {
    trigger: "hover",
    placement: "top",
    mouseEnterDelay: 0.1,
    mouseLeaveDelay: 0.1
  })),
  setup(props, _ref) {
    let {
      expose,
      slots,
      attrs
    } = _ref;
    const tooltipRef = ref();
    warning(props.visible === void 0);
    expose({
      getPopupDomNode: () => {
        var _a, _b;
        return (_b = (_a = tooltipRef.value) === null || _a === void 0 ? void 0 : _a.getPopupDomNode) === null || _b === void 0 ? void 0 : _b.call(_a);
      }
    });
    const {
      prefixCls,
      configProvider
    } = useConfigInject("popover", props);
    const [wrapSSR, hashId] = useStyle(prefixCls);
    const rootPrefixCls = computed(() => configProvider.getPrefixCls());
    const getOverlay = () => {
      var _a, _b;
      const {
        title = filterEmpty((_a = slots.title) === null || _a === void 0 ? void 0 : _a.call(slots)),
        content = filterEmpty((_b = slots.content) === null || _b === void 0 ? void 0 : _b.call(slots))
      } = props;
      const hasTitle = !!(Array.isArray(title) ? title.length : title);
      const hasContent = !!(Array.isArray(content) ? content.length : title);
      if (!hasTitle && !hasContent) return null;
      return createVNode(Fragment, null, [hasTitle && createVNode("div", {
        "class": `${prefixCls.value}-title`
      }, [title]), createVNode("div", {
        "class": `${prefixCls.value}-inner-content`
      }, [content])]);
    };
    return () => {
      const overlayCls = classNames(props.overlayClassName, hashId.value);
      return wrapSSR(createVNode(__nuxt_component_2, _objectSpread(_objectSpread(_objectSpread({}, omit(props, ["title", "content"])), attrs), {}, {
        "prefixCls": prefixCls.value,
        "ref": tooltipRef,
        "overlayClassName": overlayCls,
        "transitionName": getTransitionName(rootPrefixCls.value, "zoom-big", props.transitionName),
        "data-popover-inject": true
      }), {
        title: getOverlay,
        default: slots.default
      }));
    };
  }
});
const __nuxt_component_1 = withInstall(Popover);
const _imports_2 = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20xml:space='preserve'%20viewBox='0%200%2050%2050'%20id='grid'%3e%3cpath%20d='M48%202H2v46h46V2zm-2%2011h-9V4h9v9zm-20%200V4h9v9h-9zm9%202v9h-9v-9h9zm-11-2h-9V4h9v9zm0%202v9h-9v-9h9zm-11%209H4v-9h9v9zm0%202v9H4v-9h9zm2%200h9v9h-9v-9zm9%2011v9h-9v-9h9zm2%200h9v9h-9v-9zm0-2v-9h9v9h-9zm11-9h9v9h-9v-9zm0-2v-9h9v9h-9zM13%204v9H4V4h9zM4%2037h9v9H4v-9zm33%209v-9h9v9h-9z'/%3e%3c/svg%3e";
const _imports_3 = "data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20id='Layer_1'%20data-name='Layer%201'%20viewBox='0%200%20122.64%20122.88'%3e%3ctitle%3estories%3c/title%3e%3cpath%20d='M104,31.15c2.31,5.65,5.11,11.94,6.52,17.55a51.83,51.83,0,0,1,1.54,15.24,50.9,50.9,0,0,1-3,15,49.87,49.87,0,0,1-7.24,13.23A49.12,49.12,0,0,1,91,102.49h0a54.85,54.85,0,0,1-4.74,3q-2.44,1.38-5,2.49a52,52,0,0,1-11.38,3.56,49.5,49.5,0,0,1-11.67.82L57,112.28l-2.76,10.28,1.89.15A60.44,60.44,0,0,0,71.05,122a63,63,0,0,0,14.51-4.42q2.94-1.3,5.83-2.93c1.87-1.06,3.75-2.25,5.62-3.55A59.59,59.59,0,0,0,119,82.48,61.68,61.68,0,0,0,120.7,46.1c-2-5.77-4.18-13.39-8.31-19.22-2.73-3.86-10.73-1.57-8.35,4.27ZM56,44.74a5.34,5.34,0,1,1,10.67,0V56.1H78a5.34,5.34,0,0,1,0,10.68H66.66V78.14a5.34,5.34,0,1,1-10.67,0V66.78H44.62a5.34,5.34,0,1,1,0-10.68H56V44.74ZM24.25,110.36a59.9,59.9,0,0,0,11.46,7l1.69.79,2.75-10.25L39,107.35a49.27,49.27,0,0,1-8.38-5.28,50.34,50.34,0,0,1-7.25-6.93l-.85-1-9.17,5.29,1.18,1.43a61.27,61.27,0,0,0,9.72,9.48ZM.57,69.53A59.49,59.49,0,0,0,4,82.67l.65,1.72,9.17-5.29-.44-1.24a49.32,49.32,0,0,1-2.4-9.72,48.75,48.75,0,0,1-.37-10l.07-1.29L.41,54.15.24,56A58.82,58.82,0,0,0,.57,69.53ZM8.38,31c-.92,1.55-1.75,3.11-2.51,4.7l-.81,1.7,10.25,2.75L15.89,39c.58-1.13,1.19-2.23,1.83-3.29s1.35-2.13,2.1-3.17a61.6,61.6,0,0,1,3.9-4.93A53.89,53.89,0,0,1,28,23.22l.93-.85-5.31-9.21-1.44,1.25a66.4,66.4,0,0,0-5.74,5.65,72.56,72.56,0,0,0-5.15,6.41c-1.05,1.48-2,3-2.92,4.5ZM50.44.78A54.27,54.27,0,0,0,40.27,3.52l-1.74.65,5.3,9.18,1.22-.43a44.39,44.39,0,0,1,15.71-2.43c1.21,0,2.48.11,3.79.26s2.51.33,3.74.58,2.55.56,3.8.93,2.5.8,3.79,1.3h0a5.24,5.24,0,1,0,3.79-9.77C78.15,3.2,76.59,2.67,75,2.2s-3.12-.84-4.65-1.15S67.28.5,65.76.33,62.63.05,61,0A55.87,55.87,0,0,0,50.44.78Z'/%3e%3c/svg%3e";
const _imports_0$1 = "data:image/svg+xml,%3csvg%20width='23'%20height='23'%20viewBox='0%200%2023%2023'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20x='1.04163'%20y='1.52081'%20width='20'%20height='20'%20rx='5'%20stroke='white'%20stroke-width='2'/%3e%3cpath%20d='M11.0416%206.02081L11.0416%2017.0208'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'/%3e%3cpath%20d='M16.5416%2011.5208L5.54163%2011.5208'%20stroke='white'%20stroke-width='2'%20stroke-linecap='round'/%3e%3c/svg%3e";
const _imports_1$1 = "data:image/svg+xml,%3csvg%20width='23'%20height='23'%20viewBox='0%200%2023%2023'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20x='1.04163'%20y='1.52081'%20width='20'%20height='20'%20rx='5'%20stroke='black'%20stroke-width='2'/%3e%3cpath%20d='M11.0416%206.02081L11.0416%2017.0208'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'/%3e%3cpath%20d='M16.5416%2011.5208L5.54163%2011.5208'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'/%3e%3c/svg%3e";
const _sfc_main$6 = /* @__PURE__ */ defineComponent({
  __name: "add",
  __ssrInlineRender: true,
  setup(__props) {
    const config = useConfigStore();
    return (_ctx, _push, _parent, _attrs) => {
      if (unref(config).isNightStore) {
        _push(`<img${ssrRenderAttrs(mergeProps({
          src: _imports_0$1,
          alt: "comment",
          "cursor-pointer": ""
        }, _attrs))}>`);
      } else {
        _push(`<img${ssrRenderAttrs(mergeProps({
          src: _imports_1$1,
          alt: "comment",
          "cursor-pointer": ""
        }, _attrs))}>`);
      }
    };
  }
});
const _sfc_setup$6 = _sfc_main$6.setup;
_sfc_main$6.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("assets/img/icons/add.vue");
  return _sfc_setup$6 ? _sfc_setup$6(props, ctx) : void 0;
};
const _imports_0 = "data:image/svg+xml,%3csvg%20width='21'%20height='18'%20viewBox='0%200%2021%2018'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M20.25%200H1.25L1.14823%200.00684662C0.782154%200.056509%200.5%200.370304%200.5%200.75C0.5%201.16421%200.835786%201.5%201.25%201.5H20.25L20.3518%201.49315C20.7178%201.44349%2021%201.1297%2021%200.75C21%200.335786%2020.6642%200%2020.25%200ZM1.25%208H20.25C20.6642%208%2021%208.33579%2021%208.75C21%209.1297%2020.7178%209.44349%2020.3518%209.49315L20.25%209.5H1.25C0.835786%209.5%200.5%209.16421%200.5%208.75C0.5%208.3703%200.782154%208.05651%201.14823%208.00685L1.25%208ZM1.25%2016H20.25C20.6642%2016%2021%2016.3358%2021%2016.75C21%2017.1297%2020.7178%2017.4435%2020.3518%2017.4932L20.25%2017.5H1.25C0.835786%2017.5%200.5%2017.1642%200.5%2016.75C0.5%2016.3703%200.782154%2016.0565%201.14823%2016.0068L1.25%2016Z'%20fill='white'/%3e%3c/svg%3e";
const _imports_1 = "data:image/svg+xml,%3csvg%20width='21'%20height='18'%20viewBox='0%200%2021%2018'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20fill-rule='evenodd'%20clip-rule='evenodd'%20d='M20.25%200H1.25L1.14823%200.00684662C0.782154%200.056509%200.5%200.370304%200.5%200.75C0.5%201.16421%200.835786%201.5%201.25%201.5H20.25L20.3518%201.49315C20.7178%201.44349%2021%201.1297%2021%200.75C21%200.335786%2020.6642%200%2020.25%200ZM1.25%208H20.25C20.6642%208%2021%208.33579%2021%208.75C21%209.1297%2020.7178%209.44349%2020.3518%209.49315L20.25%209.5H1.25C0.835786%209.5%200.5%209.16421%200.5%208.75C0.5%208.3703%200.782154%208.05651%201.14823%208.00685L1.25%208ZM1.25%2016H20.25C20.6642%2016%2021%2016.3358%2021%2016.75C21%2017.1297%2020.7178%2017.4435%2020.3518%2017.4932L20.25%2017.5H1.25C0.835786%2017.5%200.5%2017.1642%200.5%2016.75C0.5%2016.3703%200.782154%2016.0565%201.14823%2016.0068L1.25%2016Z'%20fill='%23262626'/%3e%3c/svg%3e";
const _sfc_main$5 = /* @__PURE__ */ defineComponent({
  __name: "menu",
  __ssrInlineRender: true,
  setup(__props) {
    const config = useConfigStore();
    return (_ctx, _push, _parent, _attrs) => {
      if (unref(config).isNightStore) {
        _push(`<img${ssrRenderAttrs(mergeProps({
          src: _imports_0,
          alt: "comment",
          "cursor-pointer": ""
        }, _attrs))}>`);
      } else {
        _push(`<img${ssrRenderAttrs(mergeProps({
          src: _imports_1,
          alt: "comment",
          "cursor-pointer": ""
        }, _attrs))}>`);
      }
    };
  }
});
const _sfc_setup$5 = _sfc_main$5.setup;
_sfc_main$5.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("assets/img/icons/menu.vue");
  return _sfc_setup$5 ? _sfc_setup$5(props, ctx) : void 0;
};
const _sfc_main$4 = /* @__PURE__ */ defineComponent({
  __name: "StoriesComponent",
  __ssrInlineRender: true,
  props: {
    story: {},
    selectedStory: {}
  },
  emits: ["update:selectedStory"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emit = __emit;
    const isSelected = computed(() => {
      var _a, _b;
      return (_b = props.selectedStory) == null ? void 0 : _b.includes((_a = props.story) == null ? void 0 : _a.id);
    });
    const internalSelectedStory = computed({
      get() {
        return props.selectedStory;
      },
      set(value) {
        emit("update:selectedStory", value);
      }
    });
    return (_ctx, _push, _parent, _attrs) => {
      var _a2;
      var _a;
      const _directive_lazy = resolveDirective("lazy");
      let _temp0;
      _push(`<div${ssrRenderAttrs(mergeProps({ class: "w-full h-full aspect-[2/3] relative" }, _attrs))}><img${ssrRenderAttrs(_temp0 = mergeProps({
        class: ["w-full h-full object-cover aspect-[2/3]", isSelected.value && "bg-gray-500 opacity-50"]
      }, ssrGetDirectiveProps(_ctx, _directive_lazy, {
        src: unref(getSupabaseStorageUrl)((_a = _ctx.story) == null ? void 0 : _a.media_url),
        loading: unref(img_gif$1),
        error: unref(img_gif$1)
      })))}>${"textContent" in _temp0 ? ssrInterpolate(_temp0.textContent) : (_a2 = _temp0.innerHTML) != null ? _a2 : ""}<input type="checkbox"${ssrRenderAttr("id", `story-${_ctx.story.id}`)}${ssrRenderAttr("value", _ctx.story)}${ssrIncludeBooleanAttr(Array.isArray(internalSelectedStory.value) ? ssrLooseContain(internalSelectedStory.value, _ctx.story) : internalSelectedStory.value) ? " checked" : ""} class="absolute opacity-0 w-full h-full peer"><label${ssrRenderAttr("for", `story-${_ctx.story.id}`)} class="absolute bottom-2 right-2 w-5 h-5 rounded border-1 border-black cursor-pointer transition-all group-hover:ring-2 group-hover:ring-blue-400 peer-checked:bg-black peer-checked:border-black"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" class="${ssrRenderClass([isSelected.value ? "peer-checked:opacity-100" : "opacity-0", "w-18px h-18px text-white bg-black transition-opacity"])}"><path d="M5 12l5 5L20 7"></path></svg></label></div>`);
    };
  }
});
const _sfc_setup$4 = _sfc_main$4.setup;
_sfc_main$4.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("components/StoriesComponent.vue");
  return _sfc_setup$4 ? _sfc_setup$4(props, ctx) : void 0;
};
const _sfc_main$3 = /* @__PURE__ */ defineComponent({
  __name: "AddStoryToHighlightModal",
  __ssrInlineRender: true,
  props: {
    modelValue: {
      type: Boolean,
      required: true
    },
    highlightId: {
      type: String,
      required: false
    }
  },
  emits: ["update:modelValue", "close", "success"],
  setup(__props, { emit: __emit }) {
    const props = __props;
    const emit = __emit;
    const config = useConfigStore();
    const { user } = useUserStore();
    const selectedStory = ref(null);
    const stories = ref([]);
    const loading = ref(false);
    const close = (e) => {
      emit("update:modelValue", false);
    };
    watch(() => props.modelValue, (newVal) => {
      if (!newVal) {
        close();
      }
    });
    const getStories = async () => {
      try {
        loading.value = true;
        const storiesRequest = await getUserStories(user == null ? void 0 : user.user_id);
        stories.value = storiesRequest == null ? void 0 : storiesRequest.flatMap((story) => story == null ? void 0 : story.mediaitems);
      } catch (e) {
        api.error("error in fetching stories");
      } finally {
        loading.value = false;
      }
    };
    getStories();
    return (_ctx, _push, _parent, _attrs) => {
      if (__props.modelValue) {
        _push(`<div${ssrRenderAttrs(mergeProps({ class: "flex full_story z-400 justify-center fixed inset-0 bg-opacity-0" }, _attrs))}><div class="w-full md:w-426px bg-black pb-5rem"><div class="flex p-4 gap-8 justify-between items-center"><div class="flex gap-4 items-center">`);
        _push(ssrRenderComponent(BasicIconOld, {
          icon: !unref(config).isRTL ? "vuesax-linear:arrow-left" : "vuesax-linear:arrow-right",
          color: "white",
          onClick: close
        }, null, _parent));
        _push(`<div class="font-semibold text-white text-lg">${ssrInterpolate(unref(config).useString("selectsStory"))}</div></div><div class="${ssrRenderClass([!selectedStory.value && "cursor-not-allowed !text-gray", "text-primary text-sm fw-bold"])}"${ssrIncludeBooleanAttr(!selectedStory.value) ? " disabled" : ""}>${ssrInterpolate(unref(config).useString("done"))}</div></div><div class="w-full grid grid-cols-3 mt-2 gap-2px pb-5vh"><!--[-->`);
        ssrRenderList(stories.value, (story) => {
          _push(ssrRenderComponent(_sfc_main$4, {
            key: story.id,
            story,
            selectedStory: selectedStory.value,
            "onUpdate:selectedStory": ($event) => selectedStory.value = $event
          }, null, _parent));
        });
        _push(`<!--]--></div></div></div>`);
      } else {
        _push(`<!---->`);
      }
    };
  }
});
const _sfc_setup$3 = _sfc_main$3.setup;
_sfc_main$3.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("components/AddStoryToHighlightModal.vue");
  return _sfc_setup$3 ? _sfc_setup$3(props, ctx) : void 0;
};
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
  __name: "ActionsHighlightBottomSheet",
  __ssrInlineRender: true,
  props: {
    open: { type: Boolean, default: false },
    isEdit: { type: Boolean },
    data: {}
  },
  emits: ["update:open", "update:isEdit", "success"],
  setup(__props, { emit: __emit }) {
    useConfigStore();
    const sheetRef = ref(null);
    computed(() => {
      return formFields.value.id ? "\u0648\u06CC\u0631\u0627\u06CC\u0634 \u0622\u062F\u0631\u0633" : "\u062B\u0628\u062A \u0622\u062F\u0631\u0633 \u062C\u062F\u06CC\u062F";
    });
    const emits = __emit;
    const formFields = ref({
      default_address: false,
      city: "",
      province: "",
      phone: "",
      address: "",
      zip: ""
    });
    const props = __props;
    ref();
    const cloneAddress = cloneDeep(formFields.value);
    function resetAddress() {
      formFields.value = cloneDeep(cloneAddress);
    }
    const addForm = () => {
      resetAddress();
    };
    const editForm = () => {
      var _a;
      Object.assign(formFields.value, (_a = props.data) == null ? void 0 : _a.payload);
      console.log(formFields.value);
    };
    watch(props, (value) => {
      if (value.open) {
        openSheet();
      } else {
        closeSheet();
      }
      if (props.isEdit) {
        editForm();
      } else {
        addForm();
      }
    });
    async function openSheet() {
      var _a;
      await nextTick();
      await ((_a = sheetRef.value) == null ? void 0 : _a.setOpen());
    }
    async function closeSheet() {
      var _a;
      await nextTick();
      await ((_a = sheetRef.value) == null ? void 0 : _a.setClose());
      emits("update:open", false);
    }
    return (_ctx, _push, _parent, _attrs) => {
      _push(ssrRenderComponent(BasicSheet, mergeProps({
        title: "",
        ref_key: "sheetRef",
        ref: sheetRef,
        headerCls: "",
        closeOnClickOutside: "",
        onOnClickOutside: ($event) => emits("update:open", false),
        onOnClose: ($event) => emits("update:open", false)
      }, _attrs), {
        default: withCtx((_, _push2, _parent2, _scopeId) => {
          if (_push2) {
            _push2(`<div class="min-h-10vh overflow-y-auto px-2 mt3 pb-10"${_scopeId}>`);
            ssrRenderSlot(_ctx.$slots, "default", {}, null, _push2, _parent2, _scopeId);
            _push2(`</div>`);
          } else {
            return [
              createVNode("div", { class: "min-h-10vh overflow-y-auto px-2 mt3 pb-10" }, [
                renderSlot(_ctx.$slots, "default")
              ])
            ];
          }
        }),
        _: 3
      }, _parent));
    };
  }
});
const _sfc_setup$2 = _sfc_main$2.setup;
_sfc_main$2.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("components/ActionsHighlightBottomSheet.vue");
  return _sfc_setup$2 ? _sfc_setup$2(props, ctx) : void 0;
};
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
  __name: "HighlightStories",
  __ssrInlineRender: true,
  props: {
    id: {},
    specifyId: { type: Boolean, default: false },
    stories: {},
    highlightId: {},
    cover: {},
    title: {}
  },
  emits: ["update:id", "refresh"],
  setup(__props, { emit: __emit }) {
    useRouter$1();
    ref();
    const swiperRef = ref(null);
    const indexStory = ref(0);
    const playingSlide = ref(0);
    const storySlides = ref(0);
    ref("");
    const config = useConfigStore();
    const props = __props;
    const emits = __emit;
    const progress = ref([]);
    const target = ref(null);
    const { direction, isSwiping } = useSwipe(target);
    ref(false);
    ref(false);
    ref(false);
    const userStory = computed(() => {
      var _a;
      if ((_a = props.stories) == null ? void 0 : _a.length) return props.stories[indexStory.value];
    });
    useMediaStore();
    useUserStore();
    const isPaused = ref(false);
    const swiperReady = ref(false);
    ref(false);
    watchEffect(() => {
      if (isSwiping.value && direction.value === "down") {
        emits("update:id", void 0);
      }
    });
    watch(indexStory, async (n) => {
      await indexHandle();
    });
    async function indexHandle() {
      var _a;
      storySlides.value = (_a = props.stories) == null ? void 0 : _a.length;
      progress.value = [];
      await nextTick();
      if (swiperRef.value) {
        swiperRef.value.activeIndex = indexStory.value;
      }
      for (let i = 0; i < storySlides.value; i++) {
        progress.value.push(0);
      }
      startOver();
    }
    const onSwiper = (swiper) => {
      swiperRef.value = swiper;
      swiperReady.value = true;
    };
    const onSlideChange = (swiper) => {
      if (!swiperReady.value) return;
      const newIndex = swiper == null ? void 0 : swiper.activeIndex;
      if (playingSlide.value !== newIndex) {
        playingSlide.value = newIndex;
      }
    };
    function startOver() {
      setInterval();
    }
    watch([playingSlide, swiperReady], ([newPlayingSlide, isReady]) => {
      var _a;
      if (!isReady || !swiperRef.value || !((_a = props.stories) == null ? void 0 : _a.length)) {
        return;
      }
      const safeIndex = Math.max(0, Math.min(newPlayingSlide, props.stories.length - 1));
      if (swiperRef.value.activeIndex === safeIndex) {
        return;
      }
      setTimeout(() => {
        var _a2;
        try {
          (_a2 = swiperRef.value) == null ? void 0 : _a2.slideTo(safeIndex);
        } catch (error) {
          swiperReady.value = false;
          nextTick(() => swiperReady.value = true);
        }
      }, 50);
    }, { immediate: true });
    return (_ctx, _push, _parent, _attrs) => {
      var _a;
      const _directive_lazy = resolveDirective("lazy");
      let _temp0, _temp1;
      _push(`<!--[--><div class="flex full_story z-400 justify-center" dir="ltr"><div class="relative w-full md:w-426px bg-black flex items-center pb-5rem">`);
      if (!isPaused.value) {
        _push(`<div class="absolute w-full top-0 right-0 left-0 z-1000 blurred-gradient-bg"><div class="flex gap-2px shadow-xl"><!--[-->`);
        ssrRenderList(_ctx.stories, (story, index) => {
          _push(ssrRenderComponent(CustomProgressBar, {
            key: index,
            percent: progress.value[index]
          }, null, _parent));
        });
        _push(`<!--]--></div><div class="p-2 flex items-center gap-2 account-detail-area"><div class="relative">${ssrInterpolate(userStory.value)} <img${ssrRenderAttrs(_temp0 = mergeProps({
          class: "w-2.5rem h-2.5rem rounded-full",
          alt: ""
        }, ssrGetDirectiveProps(_ctx, _directive_lazy, {
          src: unref(getSupabaseStorageUrl)(_ctx.cover),
          loading: unref(empty_user),
          error: unref(empty_user)
        })))}>${"textContent" in _temp0 ? ssrInterpolate(_temp0.textContent) : (_a = _temp0.innerHTML) != null ? _a : ""}`);
        if (unref(config).isSeller) {
          _push(`<img${ssrRenderAttr("src", _imports_0$2)} alt="" class="w-15px absolute right-0 bottom-0 bg-white rounded-full">`);
        } else {
          _push(`<!---->`);
        }
        _push(`</div><p class="text-white">${ssrInterpolate(_ctx.title)}</p></div></div>`);
      } else {
        _push(`<!---->`);
      }
      _push(`<div class="w-full">`);
      _push(ssrRenderComponent(unref(Swiper), {
        key: indexStory.value,
        ref_key: "swiperRef",
        ref: swiperRef,
        onSwiper,
        onSlideChange,
        initialSlide: indexStory.value,
        grabCursor: true,
        modules: [],
        speed: 0,
        noSwiping: true,
        class: "mySwiper6"
      }, {
        default: withCtx((_, _push2, _parent2, _scopeId) => {
          if (_push2) {
            _push2(`<!--[-->`);
            ssrRenderList(_ctx.stories, (story, i) => {
              _push2(ssrRenderComponent(unref(SwiperSlide), {
                key: i,
                class: "self-center"
              }, {
                default: withCtx((_2, _push3, _parent3, _scopeId2) => {
                  var _a3;
                  var _a2, _b;
                  if (_push3) {
                    _push3(`<img${ssrRenderAttrs(_temp1 = mergeProps({
                      alt: "instagram",
                      class: "w-full bg-black",
                      key: indexStory.value
                    }, ssrGetDirectiveProps(_ctx, _directive_lazy, {
                      src: unref(getSupabaseStorageUrl)((_a2 = story == null ? void 0 : story.media) == null ? void 0 : _a2.media_url),
                      loading: unref(img_gif),
                      error: unref(img_gif)
                    })))}${_scopeId2}>${"textContent" in _temp1 ? ssrInterpolate(_temp1.textContent) : (_a3 = _temp1.innerHTML) != null ? _a3 : ""}`);
                  } else {
                    return [
                      withDirectives((openBlock(), createBlock("img", {
                        alt: "instagram",
                        class: "w-full bg-black",
                        key: indexStory.value
                      })), [
                        [_directive_lazy, {
                          src: unref(getSupabaseStorageUrl)((_b = story == null ? void 0 : story.media) == null ? void 0 : _b.media_url),
                          loading: unref(img_gif),
                          error: unref(img_gif)
                        }]
                      ])
                    ];
                  }
                }),
                _: 2
              }, _parent2, _scopeId));
            });
            _push2(`<!--]-->`);
          } else {
            return [
              (openBlock(true), createBlock(Fragment, null, renderList(_ctx.stories, (story, i) => {
                return openBlock(), createBlock(unref(SwiperSlide), {
                  key: i,
                  class: "self-center"
                }, {
                  default: withCtx(() => {
                    var _a2;
                    return [
                      withDirectives((openBlock(), createBlock("img", {
                        alt: "instagram",
                        class: "w-full bg-black",
                        key: indexStory.value
                      })), [
                        [_directive_lazy, {
                          src: unref(getSupabaseStorageUrl)((_a2 = story == null ? void 0 : story.media) == null ? void 0 : _a2.media_url),
                          loading: unref(img_gif),
                          error: unref(img_gif)
                        }]
                      ])
                    ];
                  }),
                  _: 2
                }, 1024);
              }), 128))
            ];
          }
        }),
        _: 1
      }, _parent));
      _push(`</div></div></div>`);
      if (!isPaused.value) {
        _push(`<div class="absolute w-full bottom-0 right-0 left-0 z-1000 flex items-center gap8 px5 functions_area">`);
        if (unref(config).isSeller) {
          _push(`<div class="flex gap-5 items-center" dir="rtl"><div class="flex flex-col items-center gap-2 text-white functions-area basic-icon-old">`);
          _push(ssrRenderComponent(BasicIconOld, {
            icon: "vuesax-linear:trash",
            color: "red",
            size: "22",
            class: "h7"
          }, null, _parent));
          _push(`<div class="text-xs text-red-6">${ssrInterpolate(unref(config).useString("delete"))}</div></div></div>`);
        } else {
          _push(`<!---->`);
        }
        if (unref(config).isSeller) {
          _push(`<div class="flex gap-5 items-center" dir="rtl"><div class="flex flex-col items-center gap-2 text-white functions-area basic-icon-old">`);
          _push(ssrRenderComponent(BasicIconOld, {
            icon: "vuesax-linear:edit-2",
            size: "22",
            class: "h6"
          }, null, _parent));
          _push(`<div class="text-xs">${ssrInterpolate(unref(config).useString("edit"))}</div></div></div>`);
        } else {
          _push(`<!---->`);
        }
        _push(`</div>`);
      } else {
        _push(`<!---->`);
      }
      _push(`<!--]-->`);
    };
  }
});
const _sfc_setup$1 = _sfc_main$1.setup;
_sfc_main$1.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("components/HighlightStories.vue");
  return _sfc_setup$1 ? _sfc_setup$1(props, ctx) : void 0;
};
const _sfc_main = /* @__PURE__ */ defineComponent({
  __name: "Highlights",
  __ssrInlineRender: true,
  props: {
    currentUser: {}
  },
  setup(__props) {
    const highlights = ref([]);
    useRouter();
    const route = useRoute();
    const selectedStoryId = ref(null);
    const highlightId = ref(null);
    const highlightTitle = ref(null);
    const highlightCover = ref(null);
    ref(null);
    const stories = ref([]);
    ref(false);
    const config = useConfigStore();
    const { user } = useUserStore();
    const props = __props;
    const highlightsUser = async () => {
      var _a;
      try {
        const data = await getHighlightsList(((_a = route == null ? void 0 : route.params) == null ? void 0 : _a.id) || (user == null ? void 0 : user.id), { page: 1, limit: 40 });
        highlights.value = data;
      } catch (e) {
        console.log(e);
      }
    };
    function updateHighlight() {
      highlightsUser();
      selectedStoryId.value = null;
    }
    return (_ctx, _push, _parent, _attrs) => {
      var _a, _b;
      const _component_UserProfilePic = UserProfilePic;
      _push(`<div${ssrRenderAttrs(mergeProps({ class: "stories-container -ms4" }, _attrs))} data-v-8f3ee43c><div class="scroll-wrapper ps-3" data-v-8f3ee43c>`);
      if (((_a = unref(user)) == null ? void 0 : _a.id) === ((_b = props.currentUser) == null ? void 0 : _b.id)) {
        _push(`<div class="me-2" data-v-8f3ee43c><div class="border-gray-600 border-1 border-solid w-70px h-70px rounded-full flex items-center justify-center" data-v-8f3ee43c>`);
        _push(ssrRenderComponent(BasicIconOld, { icon: "vuesax-linear:add" }, null, _parent));
        _push(`</div><div class="text-center text-xs mt-7px" data-v-8f3ee43c>${ssrInterpolate(unref(config).useString("new"))}</div></div>`);
      } else {
        _push(`<!---->`);
      }
      _push(`<!--[-->`);
      ssrRenderList(highlights.value, (highlight) => {
        _push(`<div class="story" data-v-8f3ee43c><div class="text-center" data-v-8f3ee43c>`);
        _push(ssrRenderComponent(_component_UserProfilePic, {
          src: highlight == null ? void 0 : highlight.cover_media_url,
          "seen-story": true,
          width: "75"
        }, null, _parent));
        _push(`</div><div class="w-full text-center text-xs truncate" data-v-8f3ee43c>${ssrInterpolate(highlight == null ? void 0 : highlight.title)}</div></div>`);
      });
      _push(`<!--]--></div>`);
      if (selectedStoryId.value) {
        _push(ssrRenderComponent(_sfc_main$1, {
          id: selectedStoryId.value,
          "onUpdate:id": ($event) => selectedStoryId.value = $event,
          highlightId: highlightId.value,
          title: highlightTitle.value,
          cover: highlightCover.value,
          stories: stories.value,
          onRefresh: updateHighlight
        }, null, _parent));
      } else {
        _push(`<!---->`);
      }
      _push(`</div>`);
    };
  }
});
const _sfc_setup = _sfc_main.setup;
_sfc_main.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("components/Highlights.vue");
  return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
};
const Highlights = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-8f3ee43c"]]);

export { Highlights as H, __nuxt_component_1 as _, _sfc_main$6 as a, _imports_2 as b, _imports_3 as c, _sfc_main$5 as d };
//# sourceMappingURL=Highlights-DaFoTGEN.mjs.map