{"version":3,"file":"Guide.acf3fa8b.js","sources":["../../../app/javascript/modules/timeline_selection.ts","../../../app/javascript/components/guide/Guide.vue"],"sourcesContent":["import { computed, Ref, ref } from \"vue\";\nimport { eventHasCmdOrCtrlKey } from \"@modules/helpers\";\nimport { Action } from \"@models/ActionHierarchy\";\nimport VoiceOver from \"@models/VoiceOver\";\n\n// globally define pivoting action\nconst selectionPivotingActionId: Ref<string | null> = ref(null);\n\nexport const useTimelineSelection = ({\n  props,\n  emitSelectActionIds,\n  emitSelectVoiceOverId,\n  goToActionId,\n}: {\n  props: {\n    actions: Action[];\n    selectedActionIds: string[];\n    selectedVoiceOverId?: string;\n  };\n  emitSelectActionIds: (ids: string[]) => void;\n  emitSelectVoiceOverId: (id: string | null) => void;\n  goToActionId: (id: string) => void;\n}): {\n  handleClickOnActionId: (actionId: string, event: MouseEvent) => void;\n  handleClickOnVoiceOverId: (voiceOverId: string, forceSelection: boolean) => void;\n  selectVoiceOverId: (voiceOverId: string) => void;\n  goToStartOfVoiceOverId: (voiceOverId: string) => void;\n} => {\n  const selectionPivotingAction: Ref<Action | null> = computed(() => {\n    if (selectionPivotingActionId.value) {\n      return props.actions.find((a) => a.id === selectionPivotingActionId.value) || null;\n    }\n    return null;\n  });\n\n  const selectedActions: Ref<Action[]> = computed(() =>\n    props.actions.filter((action) => props.selectedActionIds.includes(action.id)),\n  );\n\n  function resetVoiceOverSelection(): void {\n    // console.log(\"timeline_selection -> resetVoiceOverSelection\");\n    if (!props.selectedVoiceOverId) return;\n    emitSelectVoiceOverId(null);\n  }\n\n  function selectVoiceOverId(voiceOverId: string): void {\n    // console.log(\"timeline_selection -> selectVoiceOverId\", voiceOverId);\n    if (props.selectedVoiceOverId === voiceOverId) return;\n    emitSelectVoiceOverId(voiceOverId);\n  }\n\n  function goToStartOfVoiceOverId(voiceOverId: string): void {\n    // FIXME: for the Guide we want to actually jump to the voice over itself (which appears above its first action.)\n    // See the note in Guide (the watcher on props.currentActionId) for more details.\n    const voiceOver = VoiceOver.find(voiceOverId); // TODO: this is slow, remove if possible\n    const action = voiceOver?.firstVisibleAction || voiceOver?.firstAction;\n    if (action) goToActionId(action.id);\n  }\n\n  function handleClickOnVoiceOverId(voiceOverId: string, forceSelection = false): void {\n    // console.log(\"timeline_selection -> handleClickOnVoiceOverId\", voiceOverId, forceSelection);\n    if (props.selectedVoiceOverId !== voiceOverId || forceSelection) {\n      selectVoiceOverId(voiceOverId);\n      goToStartOfVoiceOverId(voiceOverId);\n    } else {\n      resetVoiceOverSelection();\n    }\n  }\n\n  function handleClickOnActionId(actionId: string, event: MouseEvent): void {\n    // Our goal here is replicate the same selection routines that macOS supports for list views.\n    // Especially regarding: 1) modifier keys (shift + cmd/ctrl), and 2) mouse drags.\n\n    let selectedActionIds = Array.from(props.selectedActionIds);\n    const cmdOrCtrlKey = eventHasCmdOrCtrlKey(event);\n    const action = props.actions.find((a) => a.id === actionId);\n\n    if (!action) return;\n    // console.log(\"clicked action\", action.id, {\n    //   shiftKey: event.shiftKey,\n    //   cmdOrCtrlKey,\n    //   selectedActionIds,\n    // });\n\n    const indexOfSelectedActionId = selectedActionIds.indexOf(actionId);\n\n    if (cmdOrCtrlKey) {\n      // Add single action to existing selection.\n      if (selectedActionIds.includes(actionId)) {\n        selectedActionIds.splice(indexOfSelectedActionId, 1);\n        // Reset shift-clicks to start at the next (or otherwise _last_) _selected_ action:\n        const nextSelectedAction = selectedActions.value.find(\n          (a) => a.index != null && a.index > (action.index ?? 0),\n        );\n        if (nextSelectedAction) selectionPivotingActionId.value = nextSelectedAction.id;\n        else {\n          const lastSelectedActionId = selectedActions.value\n            .filter((a) => a.index != null && a.index < (action.index ?? 0))\n            .map((a) => a.id)\n            .reverse()[0];\n          if (lastSelectedActionId) selectionPivotingActionId.value = lastSelectedActionId;\n        }\n      } else {\n        selectedActionIds.push(actionId);\n        // Reset shift-clicks to start at this action:\n        selectionPivotingActionId.value = actionId;\n      }\n    } else if (event?.shiftKey) {\n      const pivotingAction = selectionPivotingAction.value || props.actions[0];\n      if (!pivotingAction) return;\n      \n      const actionIndex = action.index ?? props.actions.indexOf(action);\n      const pivotingActionIndex = pivotingAction.index ?? props.actions.indexOf(pivotingAction);\n      // if (typeof pivotingAction?.index === \"number\") {\n      const startRangeAtIndex = Math.min(actionIndex, pivotingActionIndex);\n      const endRangeAtIndex = Math.max(actionIndex, pivotingActionIndex);\n      const actionsInRange = props.actions.slice(startRangeAtIndex, endRangeAtIndex + 1);\n      // console.log(\"SHIFT\", {\n      //   selectionPivotingAction: selectionPivotingAction.value,\n      //   action,\n      //   startRangeAtIndex,\n      //   endRangeAtIndex,\n      //   actionsInRange,\n      // });\n      actionsInRange.forEach((a) => {\n        if (!selectedActionIds.includes(a.id)) selectedActionIds.push(a.id);\n      });\n      // }\n    } else {\n      // This is a completely new selection, so we’ll reset selectionPivotingAction:\n      selectionPivotingActionId.value = actionId;\n      if (selectedActionIds.length === 1 && selectedActionIds.includes(actionId)) {\n        // This was the last id selected, so let’s deselect the action (here we deviate from\n        // macOS Finder’s standard behavior)\n        selectedActionIds = [];\n      } else {\n        goToActionId(actionId);\n        selectedActionIds = [actionId];\n      }\n    }\n    emitSelectActionIds(selectedActionIds);\n  }\n\n  return {\n    handleClickOnActionId,\n    handleClickOnVoiceOverId,\n    selectVoiceOverId,\n    goToStartOfVoiceOverId,\n  };\n};\n\nexport default useTimelineSelection;\n","<template>\n  <main\n    class=\"relative flex flex-col justify-center p-2 text-xs text-black md:flex-row md:p-6 md:text-sm lg:text-base\"\n  >\n    <nav v-if=\"showChapterNavigation\" class=\"px-6 md:w-64 md:pr-0 print:hidden\">\n      <ol\n        v-if=\"chapters.length > 0\"\n        class=\"sticky left-2 top-6 z-10 overflow-hidden rounded-[9px] border-neutral-300 bg-white shadow md:ml-0\"\n      >\n        <li v-for=\"chapter in chapters\" :key=\"chapter.id\" class=\"group\">\n          <a\n            :href=\"`#guide-chapter-${chapter.id}`\"\n            class=\"block border-b border-neutral-200 px-4 py-2 text-neutral-600 transition-all hover:bg-blue-100/20 hover:text-blue-600 active:bg-blue-600 active:text-white group-first:pt-2.5 group-last:border-b-0 group-last:pb-2.5\"\n            @click=\"openChapter\"\n            >{{ chapter.name }}</a\n          >\n        </li>\n      </ol>\n    </nav>\n\n    <ol\n      class=\"relative z-0 flex min-h-[400px] w-full max-w-2xl flex-col items-center gap-4 px-2 py-6 md:px-6\"\n      role=\"list\"\n    >\n      <li\n        v-for=\"group in groups\"\n        :id=\"`guide-chapter-${group.id}`\"\n        :key=\"group.id\"\n        role=\"group\"\n        class=\"w-full\"\n      >\n        <h2\n          v-if=\"group.voiceOver && group.voiceOver.text\"\n          class=\"mb-2 flex items-center justify-center px-4 py-2 text-center text-base font-bold leading-6 md:text-xl\"\n          :class=\"[\n            selectedVoiceOverId === group.voiceOver.id\n              ? 'rounded-[9px] bg-voiceover-100 text-green-950 ring-2 ring-voiceover-500 ring-offset-2 ring-offset-white'\n              : '',\n          ]\"\n          :data-testid=\"`guide-chapter-${group.id}-label`\"\n          @click=\"handleClickOnVoiceOverId(group.voiceOver!.id, false)\"\n        >\n          {{ group.voiceOver.text }}\n        </h2>\n        <!-- <div v-else :id=\"group.id\">empty group</div> -->\n        <ol class=\"flex flex-col gap-4\">\n          <li\n            v-for=\"action in group.actions\"\n            :id=\"`guide-action-${action.id}`\"\n            :key=\"action.id\"\n            :data-testid=\"`guide-action-${action.id}`\"\n            class=\"group/action break-inside-avoid rounded-[9px] screen:shadow-lg\"\n            :class=\"[\n              selectedActionIds?.includes(action.id)\n                ? 'bg-blue-200 ring-2 ring-accent-500 ring-offset-2 ring-offset-white'\n                : 'bg-white ring-1 ring-neutral-100',\n              action.type === 'VideoSlide' ? 'print:hidden' : '',\n            ]\"\n            role=\"listitem\"\n            @click.capture=\"handleClickOnActionId(action.id, $event)\"\n          >\n            <PureSlide\n              v-if=\"action.type === 'TextSlide'\"\n              class=\"w-full overflow-hidden rounded-[9px]\"\n              v-bind=\"action.slide\"\n            />\n            <img\n              v-else-if=\"action.type === 'ImageSlide'\"\n              :src=\"action.imageUrl\"\n              class=\"w-full overflow-hidden rounded-[9px]\"\n            />\n            <MediaPlayer\n              v-else-if=\"action.type === 'VideoSlide'\"\n              data-chromatic=\"ignore\"\n              :src=\"action.videoUrl\"\n              :playlist-url=\"action.playlistUrl\"\n              :poster=\"action.imageUrl\"\n              :controls=\"true\"\n              type=\"video\"\n              :preload=\"false\"\n              :is-playing=\"false\"\n              :is-seeking=\"0\"\n              :start-from=\"0\"\n              class=\"w-full overflow-hidden rounded-[9px]\"\n            />\n            <div v-else class=\"rounded-[9px] p-2 sm:p-4\">\n              <h3\n                v-if=\"action.descriptionForGuide && !action.slide\"\n                class=\"text-md mb-2 flex items-center gap-1.5 sm:mb-4 sm:gap-2\"\n              >\n                <div\n                  v-if=\"action.stepNumber\"\n                  class=\"flex size-6 shrink-0 items-center justify-center rounded-full text-center sm:size-8\"\n                  :class=\"[\n                    selectedActionIds?.includes(action.id)\n                      ? 'bg-accent-500 text-white'\n                      : 'bg-blue-100 text-blue-600 print:bg-transparent print:font-bold print:ring-1 print:ring-blue-600',\n                  ]\"\n                >\n                  {{ action.stepNumber }}\n                </div>\n\n                <div class=\"flex justify-start whitespace-pre-line leading-none print:font-bold\">\n                  {{ action.descriptionForGuide }}\n                </div>\n              </h3>\n              <div\n                v-if=\"action.screenshotUrl\"\n                class=\"relative aspect-video w-full overflow-hidden rounded ring-neutral-100 screen:shadow-sm print:ring-1\"\n              >\n                <div\n                  v-if=\"action.type === 'Click' && action.relativePosition\"\n                  class=\"absolute size-0\"\n                  :style=\"{\n                    top: `${action.relativePosition.top * 100}%`,\n                    left: `${action.relativePosition.left * 100}%`,\n                  }\"\n                >\n                  <div\n                    class=\"absolute -left-4 -top-4 size-8 rounded-full bg-red-500/20 ring ring-red-500 transition-transform group-hover/action:scale-125 print:bg-transparent\"\n                  ></div>\n                </div>\n                <img\n                  :src=\"action.screenshotUrl\"\n                  :alt=\"action.descriptionForGuide\"\n                  class=\"size-full object-cover\"\n                />\n              </div>\n            </div>\n          </li>\n        </ol>\n      </li>\n    </ol>\n  </main>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, computed, onMounted, onUnmounted, watch, reactive, nextTick } from \"vue\";\nimport Video from \"@models/Video\";\nimport { Action, BrowserAction, TextSlide, ImageSlide, VideoSlide } from \"@models/ActionHierarchy\";\nimport { AnyAction, AnyBrowserAction } from \"@models/AnyAction\";\nimport VoiceOver from \"@models/VoiceOver\";\nimport PureSlide from \"@components/PureSlide.vue\";\nimport MediaPlayer from \"@components/MediaPlayer.vue\";\nimport { useTimelineSelection } from \"@modules/timeline_selection\";\nimport { useCachedTimeBasedTimeline } from \"@modules/cached_time_based_timeline\";\n\ntype Props = {\n  video: Video;\n  actions: Action[];\n  voiceOvers: VoiceOver[];\n  currentActionId?: string;\n  selectedActionIds: string[];\n  selectedVoiceOverId?: string;\n  videoDimensions: { width: number; height: number };\n  baseFileUrl: string;\n  showChapterNavigation?: boolean;\n  isRecordingBrowser?: boolean;\n};\n\nconst props = defineProps<Props>();\n\nconst emit = defineEmits<{\n  (e: \"jump-to-action-id\", id: string): void;\n  (e: \"select-action-ids\", id: string[]): void;\n  (e: \"select-voice-over-id\", id: string | null): void;\n}>();\n\nconst { handleClickOnActionId, handleClickOnVoiceOverId } = useTimelineSelection({\n  // props,\n  props: {\n    actions: props.actions,\n    selectedActionIds: props.selectedActionIds,\n    selectedVoiceOverId: props.selectedVoiceOverId,\n  },\n  emitSelectActionIds: (ids) => emit(\"select-action-ids\", ids),\n  emitSelectVoiceOverId: (id) => emit(\"select-voice-over-id\", id),\n  goToActionId: (id) => {\n    // do nothing, because jumping when we just clicked on something feels awkward.\n  },\n});\n\nconst { groups: groupsForPlayer } = useCachedTimeBasedTimeline(props);\n\nconst groups = computed(() => {\n  // only return groups that have actions that should be visible in the guide\n\n  const groupsWithVisibleActions = groupsForPlayer.value.map((group) => {\n    const actions = group.actions.filter((action) => action.visibleInGuide);\n    return { ...group, actions };\n  });\n  return groupsWithVisibleActions.filter((group) => group.actions.length > 0);\n});\n\nconst chapters = computed(() =>\n  groups.value\n    .filter((group) => group.voiceOver?.text)\n    .map((group) => ({\n      id: group.id,\n      name: group.voiceOver!.text,\n    })),\n);\n\nconst steps = computed(() => groups.value.map((group) => group.actions).flat());\nconst stepCount = computed(() => steps.value.length);\n\nfunction scrollToActionId(actionId: string): void {\n  const element = document.getElementById(`guide-action-${actionId}`);\n  console.log(\"Guide->scrollToActionId\", actionId, element);\n  if (!element) return;\n  requestAnimationFrame(() => {\n    element.scrollIntoView({ behavior: \"smooth\", block: \"nearest\" });\n  });\n}\n\nfunction scrollToVoiceOverId(voiceOverId: string): void {\n  const element = document.getElementById(`guide-chapter-${voiceOverId}`);\n  if (!element) return;\n  requestAnimationFrame(() => {\n    element.scrollIntoView({ behavior: \"smooth\", block: \"nearest\" });\n  });\n}\n\nwatch(\n  () => props.currentActionId,\n  (actionId) => {\n    if (!actionId) return;\n    if (props.selectedVoiceOverId) {\n      const voiceOver = props.voiceOvers.find((vo) => vo.id === props.selectedVoiceOverId);\n      if (voiceOver?.startAtId === actionId) {\n        // At the moment, when you select a voice over, we jump to the action that it starts at. That’s fine for the\n        // timelines because there the voice over appears adjacent to the action. But in the guide the voice over\n        // above the action.\n        // Therefore (as a bit of a hack), we just jump to the voice over if the current action is the one that the\n        // selected voice over starts at. The voice over is generally pretty low in height, so it’s awkward.\n        scrollToVoiceOverId(props.selectedVoiceOverId);\n        return;\n      }\n    }\n    scrollToActionId(actionId);\n  },\n);\n\nwatch(\n  () => props.selectedVoiceOverId,\n  (selectedVoiceOverId) => {\n    // sdf\n    if (!selectedVoiceOverId) return;\n    scrollToVoiceOverId(selectedVoiceOverId);\n  },\n);\n\nwatch(\n  () => props.actions.length,\n  () => {\n    console.log(\"Guide->watch:actions.length\", props.actions.length, props.isRecordingBrowser);\n    const lastAction = props.actions[props.actions.length - 1];\n    if (props.isRecordingBrowser && lastAction) nextTick(() => scrollToActionId(lastAction.id));\n  },\n);\n\nfunction openChapter(event) {\n  const id = event.target.href.replace(/.+#/, \"\");\n  const element = document.getElementById(id);\n  event.preventDefault();\n  // console.log(\"chapter element\", id, element);\n  if (!element) return;\n  // console.log(\"chapter element found\", element);\n  requestAnimationFrame(() => {\n    element.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\n  });\n}\n</script>\n"],"names":["selectionPivotingActionId","ref","useTimelineSelection","props","emitSelectActionIds","emitSelectVoiceOverId","goToActionId","selectionPivotingAction","computed","a","selectedActions","action","resetVoiceOverSelection","selectVoiceOverId","voiceOverId","goToStartOfVoiceOverId","voiceOver","VoiceOver","handleClickOnVoiceOverId","forceSelection","handleClickOnActionId","actionId","event","selectedActionIds","cmdOrCtrlKey","eventHasCmdOrCtrlKey","indexOfSelectedActionId","nextSelectedAction","_a","lastSelectedActionId","pivotingAction","actionIndex","pivotingActionIndex","_b","startRangeAtIndex","endRangeAtIndex","ids","emit","id","groupsForPlayer","useCachedTimeBasedTimeline","groups","group","actions","chapters","steps","scrollToActionId","element","scrollToVoiceOverId","watch","vo","selectedVoiceOverId","lastAction","nextTick","openChapter"],"mappings":"mRAMA,MAAMA,EAAgDC,EAAI,IAAI,EAEjDC,EAAuB,CAAC,CACnC,MAAAC,EACA,oBAAAC,EACA,sBAAAC,EACA,aAAAC,CACF,IAcK,CACG,MAAAC,EAA8CC,EAAS,IACvDR,EAA0B,OACrBG,EAAM,QAAQ,KAAMM,GAAMA,EAAE,KAAOT,EAA0B,KAAK,GAAK,IAGjF,EAEKU,EAAiCF,EAAS,IAC9CL,EAAM,QAAQ,OAAQQ,GAAWR,EAAM,kBAAkB,SAASQ,EAAO,EAAE,CAAC,CAAA,EAG9E,SAASC,GAAgC,CAEnC,CAACT,EAAM,qBACXE,EAAsB,IAAI,CAC5B,CAEA,SAASQ,EAAkBC,EAA2B,CAEhDX,EAAM,sBAAwBW,GAClCT,EAAsBS,CAAW,CACnC,CAEA,SAASC,EAAuBD,EAA2B,CAGnD,MAAAE,EAAYC,EAAU,KAAKH,CAAW,EACtCH,GAASK,GAAA,YAAAA,EAAW,sBAAsBA,GAAA,YAAAA,EAAW,aACvDL,GAAQL,EAAaK,EAAO,EAAE,CACpC,CAES,SAAAO,EAAyBJ,EAAqBK,EAAiB,GAAa,CAE/EhB,EAAM,sBAAwBW,GAAeK,GAC/CN,EAAkBC,CAAW,EAC7BC,EAAuBD,CAAW,GAEVF,GAE5B,CAES,SAAAQ,EAAsBC,EAAkBC,EAAyB,SAIxE,IAAIC,EAAoB,MAAM,KAAKpB,EAAM,iBAAiB,EACpD,MAAAqB,EAAeC,EAAqBH,CAAK,EACzCX,EAASR,EAAM,QAAQ,KAAM,GAAM,EAAE,KAAOkB,CAAQ,EAE1D,GAAI,CAACV,EAAQ,OAOP,MAAAe,EAA0BH,EAAkB,QAAQF,CAAQ,EAElE,GAAIG,EAEE,GAAAD,EAAkB,SAASF,CAAQ,EAAG,CACtBE,EAAA,OAAOG,EAAyB,CAAC,EAE7C,MAAAC,EAAqBjB,EAAgB,MAAM,KAC9CD,UAAM,OAAAA,EAAE,OAAS,MAAQA,EAAE,QAASmB,EAAAjB,EAAO,QAAP,KAAAiB,EAAgB,GAAA,EAEnD,GAAAD,EAAoB3B,EAA0B,MAAQ2B,EAAmB,OACxE,CACG,MAAAE,EAAuBnB,EAAgB,MAC1C,OAAQD,GAAM,OAAA,OAAAA,EAAE,OAAS,MAAQA,EAAE,QAASmB,EAAAjB,EAAO,QAAP,KAAAiB,EAAgB,GAAE,EAC9D,IAAKnB,GAAMA,EAAE,EAAE,EACf,QAAU,EAAA,GACToB,IAAsB7B,EAA0B,MAAQ6B,EAC9D,CAAA,MAEAN,EAAkB,KAAKF,CAAQ,EAE/BrB,EAA0B,MAAQqB,UAE3BC,GAAA,MAAAA,EAAO,SAAU,CAC1B,MAAMQ,EAAiBvB,EAAwB,OAASJ,EAAM,QAAQ,GACtE,GAAI,CAAC2B,EAAgB,OAErB,MAAMC,GAAcH,EAAAjB,EAAO,QAAP,KAAAiB,EAAgBzB,EAAM,QAAQ,QAAQQ,CAAM,EAC1DqB,GAAsBC,EAAAH,EAAe,QAAf,KAAAG,EAAwB9B,EAAM,QAAQ,QAAQ2B,CAAc,EAElFI,EAAoB,KAAK,IAAIH,EAAaC,CAAmB,EAC7DG,EAAkB,KAAK,IAAIJ,EAAaC,CAAmB,EAC1C7B,EAAM,QAAQ,MAAM+B,EAAmBC,EAAkB,CAAC,EAQlE,QAAS1B,GAAM,CACvBc,EAAkB,SAASd,EAAE,EAAE,GAAqBc,EAAA,KAAKd,EAAE,EAAE,CAAA,CACnE,CAAA,MAIDT,EAA0B,MAAQqB,EAC9BE,EAAkB,SAAW,GAAKA,EAAkB,SAASF,CAAQ,EAGvEE,EAAoB,CAAA,GAEpBjB,EAAae,CAAQ,EACrBE,EAAoB,CAACF,CAAQ,GAGjCjB,EAAoBmB,CAAiB,CACvC,CAEO,MAAA,CACL,sBAAAH,EACA,yBAAAF,EACA,kBAAAL,EACA,uBAAAE,CAAA,CAEJ,+3CCmBM,CAAE,sBAAAK,EAAuB,yBAAAF,CAAyB,EAAIhB,EAAqB,CAE/E,MAAO,CACL,QAASC,EAAM,QACf,kBAAmBA,EAAM,kBACzB,oBAAqBA,EAAM,mBAC7B,EACA,oBAAsBiC,GAAQC,EAAK,oBAAqBD,CAAG,EAC3D,sBAAwBE,GAAOD,EAAK,uBAAwBC,CAAE,EAC9D,aAAeA,GAAO,CAEtB,CAAA,CACD,EAEK,CAAE,OAAQC,CAAgB,EAAIC,EAA2BrC,CAAK,EAE9DsC,EAASjC,EAAS,IAGW+B,EAAgB,MAAM,IAAKG,GAAU,CACpE,MAAMC,EAAUD,EAAM,QAAQ,OAAQ/B,GAAWA,EAAO,cAAc,EAC/D,MAAA,CAAE,GAAG+B,EAAO,QAAAC,EAAQ,CAC5B,EAC+B,OAAQD,GAAUA,EAAM,QAAQ,OAAS,CAAC,CAC3E,EAEKE,EAAWpC,EAAS,IACxBiC,EAAO,MACJ,OAAQC,GAAA,OAAU,OAAAd,EAAAc,EAAM,YAAN,YAAAd,EAAiB,KAAI,EACvC,IAAKc,IAAW,CACf,GAAIA,EAAM,GACV,KAAMA,EAAM,UAAW,IAAA,EACvB,CAAA,EAGAG,EAAQrC,EAAS,IAAMiC,EAAO,MAAM,IAAKC,GAAUA,EAAM,OAAO,EAAE,KAAM,CAAA,EAC5DlC,EAAS,IAAMqC,EAAM,MAAM,MAAM,EAEnD,SAASC,EAAiBzB,EAAwB,CAChD,MAAM0B,EAAU,SAAS,eAAe,gBAAgB1B,GAAU,EAC1D,QAAA,IAAI,0BAA2BA,EAAU0B,CAAO,EACnDA,GACL,sBAAsB,IAAM,CAC1BA,EAAQ,eAAe,CAAE,SAAU,SAAU,MAAO,UAAW,CAAA,CAChE,CACH,CAEA,SAASC,EAAoBlC,EAA2B,CACtD,MAAMiC,EAAU,SAAS,eAAe,iBAAiBjC,GAAa,EAClE,CAACiC,GACL,sBAAsB,IAAM,CAC1BA,EAAQ,eAAe,CAAE,SAAU,SAAU,MAAO,UAAW,CAAA,CAChE,CACH,CAEAE,EACE,IAAM9C,EAAM,gBACXkB,GAAa,CACZ,GAAI,EAACA,EACL,IAAIlB,EAAM,oBAAqB,CACvB,MAAAa,EAAYb,EAAM,WAAW,KAAM+C,GAAOA,EAAG,KAAO/C,EAAM,mBAAmB,EAC/E,IAAAa,GAAA,YAAAA,EAAW,aAAcK,EAAU,CAMrC2B,EAAoB7C,EAAM,mBAAmB,EAC7C,MACF,CACF,CACA2C,EAAiBzB,CAAQ,EAC3B,CAAA,EAGF4B,EACE,IAAM9C,EAAM,oBACXgD,GAAwB,CAEnB,CAACA,GACLH,EAAoBG,CAAmB,CACzC,CAAA,EAGFF,EACE,IAAM9C,EAAM,QAAQ,OACpB,IAAM,CACJ,QAAQ,IAAI,8BAA+BA,EAAM,QAAQ,OAAQA,EAAM,kBAAkB,EACzF,MAAMiD,EAAajD,EAAM,QAAQA,EAAM,QAAQ,OAAS,GACpDA,EAAM,oBAAsBiD,GAAYC,EAAS,IAAMP,EAAiBM,EAAW,EAAE,CAAC,CAC5F,CAAA,EAGF,SAASE,EAAYhC,EAAO,CAC1B,MAAMgB,EAAKhB,EAAM,OAAO,KAAK,QAAQ,MAAO,EAAE,EACxCyB,EAAU,SAAS,eAAeT,CAAE,EAC1ChB,EAAM,eAAe,EAEhByB,GAEL,sBAAsB,IAAM,CAC1BA,EAAQ,eAAe,CAAE,SAAU,SAAU,MAAO,QAAS,CAAA,CAC9D,CACH"}