{"version":3,"file":"EnvInput.vue_vue_type_script_setup_true_lang.c265320e.js","sources":["../../../pw-common/src/components/smart/EnvInput.vue"],"sourcesContent":["<template>\n  <div\n    class=\"relative flex items-center flex-1 flex-shrink-0 py-4 overflow-auto whitespace-nowrap\"\n  >\n    <div class=\"absolute inset-0 flex flex-1\">\n      <div\n        ref=\"editor\"\n        :placeholder=\"placeholder\"\n        class=\"flex flex-1\"\n        :class=\"styles\"\n        @keydown.enter.prevent=\"emit('enter', $event)\"\n        @keyup=\"emit('keyup', $event)\"\n        @click=\"emit('click', $event)\"\n        @keydown=\"emit('keydown', $event)\"\n      ></div>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, onMounted, watch, nextTick, computed, Ref } from \"vue\"\nimport {\n  EditorView,\n  placeholder as placeholderExt,\n  ViewPlugin,\n  ViewUpdate,\n  keymap,\n  tooltips,\n} from \"@codemirror/view\"\nimport { EditorSelection, EditorState, Extension } from \"@codemirror/state\"\nimport { clone } from \"lodash-es\"\nimport { history, historyKeymap } from \"@codemirror/commands\"\nimport { inputTheme } from \"~/helpers/editor/themes/baseTheme\"\nimport { HoppReactiveEnvPlugin } from \"~/helpers/editor/extensions/HoppEnvironment\"\nimport { useReadonlyStream } from \"@composables/stream\"\nimport { AggregateEnvironment, aggregateEnvs$ } from \"~/newstore/environments\"\nimport { platform } from \"~/platform\"\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue?: string\n    placeholder?: string\n    styles?: string\n    envs?: { key: string; value: string; source: string }[] | null\n    focus?: boolean\n    selectTextOnMount?: boolean\n    readonly?: boolean\n  }>(),\n  {\n    modelValue: \"\",\n    placeholder: \"\",\n    styles: \"\",\n    envs: null,\n    focus: false,\n    readonly: false,\n  }\n)\n\nconst emit = defineEmits<{\n  (e: \"update:modelValue\", data: string): void\n  (e: \"change\", data: string): void\n  (e: \"paste\", data: { prevValue: string; pastedValue: string }): void\n  (e: \"enter\", ev: any): void\n  (e: \"keyup\", ev: any): void\n  (e: \"keydown\", ev: any): void\n  (e: \"click\", ev: any): void\n}>()\n\nconst cachedValue = ref(props.modelValue)\n\nconst view = ref<EditorView>()\n\nconst editor = ref<any | null>(null)\n\nwatch(\n  () => props.modelValue,\n  (newVal) => {\n    const singleLinedText = newVal.replaceAll(\"\\n\", \"\")\n\n    const currDoc = view.value?.state.doc\n      .toJSON()\n      .join(view.value.state.lineBreak)\n\n    if (cachedValue.value !== singleLinedText || newVal !== currDoc) {\n      cachedValue.value = singleLinedText\n\n      view.value?.dispatch({\n        filter: false,\n        changes: {\n          from: 0,\n          to: view.value.state.doc.length,\n          insert: singleLinedText,\n        },\n      })\n    }\n  },\n  {\n    immediate: true,\n    flush: \"sync\",\n  }\n)\n\nlet clipboardEv: ClipboardEvent | null = null\nlet pastedValue: string | null = null\n\nconst aggregateEnvs = useReadonlyStream(aggregateEnvs$, []) as Ref<\n  AggregateEnvironment[]\n>\n\nconst envVars = computed(() =>\n  props.envs\n    ? props.envs.map((x) => ({\n        key: x.key,\n        value: x.value,\n        sourceEnv: x.source,\n      }))\n    : aggregateEnvs.value\n)\n\nconst envTooltipPlugin = new HoppReactiveEnvPlugin(envVars, view)\n\nconst initView = (el: any) => {\n  const extensions: Extension = [\n    EditorView.contentAttributes.of({ \"aria-label\": props.placeholder }),\n    EditorView.updateListener.of((update) => {\n      if (props.readonly) {\n        update.view.contentDOM.inputMode = \"none\"\n      }\n    }),\n    EditorState.changeFilter.of(() => !props.readonly),\n    inputTheme,\n    props.readonly\n      ? EditorView.theme({\n          \".cm-content\": {\n            caretColor: \"var(--secondary-dark-color)\",\n            color: \"var(--secondary-dark-color)\",\n            backgroundColor: \"var(--divider-color)\",\n            opacity: 0.25,\n          },\n        })\n      : EditorView.theme({}),\n    tooltips({\n      position: \"absolute\",\n    }),\n    envTooltipPlugin,\n    placeholderExt(props.placeholder),\n    EditorView.domEventHandlers({\n      paste(ev) {\n        clipboardEv = ev\n        pastedValue = ev.clipboardData?.getData(\"text\") ?? \"\"\n      },\n      drop(ev) {\n        ev.preventDefault()\n      },\n    }),\n    ViewPlugin.fromClass(\n      class {\n        update(update: ViewUpdate) {\n          if (props.readonly) return\n\n          if (update.docChanged) {\n            const prevValue = clone(cachedValue.value)\n\n            cachedValue.value = update.state.doc\n              .toJSON()\n              .join(update.state.lineBreak)\n\n            // We do not update the cache directly in this case (to trigger value watcher to dispatch)\n            // So, we desync cachedValue a bit so we can trigger updates\n            const value = clone(cachedValue.value).replaceAll(\"\\n\", \"\")\n\n            emit(\"update:modelValue\", value)\n            emit(\"change\", value)\n\n            const pasted = !!update.transactions.find((txn) =>\n              txn.isUserEvent(\"input.paste\")\n            )\n\n            if (pasted && clipboardEv) {\n              const pastedVal = pastedValue\n              nextTick(() => {\n                emit(\"paste\", {\n                  pastedValue: pastedVal!,\n                  prevValue,\n                })\n              })\n            } else {\n              clipboardEv = null\n              pastedValue = null\n            }\n          }\n        }\n      }\n    ),\n    history(),\n    keymap.of([...historyKeymap]),\n  ]\n\n  view.value = new EditorView({\n    parent: el,\n    state: EditorState.create({\n      doc: props.modelValue,\n      extensions,\n    }),\n  })\n}\n\nconst triggerTextSelection = () => {\n  nextTick(() => {\n    view.value?.focus()\n    view.value?.dispatch({\n      selection: EditorSelection.create([\n        EditorSelection.range(0, props.modelValue.length),\n      ]),\n    })\n  })\n}\n\nonMounted(() => {\n  if (editor.value) {\n    if (!view.value) initView(editor.value)\n    if (props.selectTextOnMount) triggerTextSelection()\n    platform.ui?.onCodemirrorInstanceMount?.(editor.value)\n  }\n})\n\nwatch(editor, () => {\n  if (editor.value) {\n    if (!view.value) initView(editor.value)\n    if (props.selectTextOnMount) triggerTextSelection()\n  } else {\n    view.value?.destroy()\n    view.value = undefined\n  }\n})\n</script>\n"],"names":["cachedValue","ref","props","view","editor","watch","newVal","singleLinedText","currDoc","_a","_b","clipboardEv","pastedValue","aggregateEnvs","useReadonlyStream","aggregateEnvs$","envVars","computed","x","envTooltipPlugin","HoppReactiveEnvPlugin","initView","el","extensions","EditorView","update","EditorState","inputTheme","tooltips","placeholderExt","ev","ViewPlugin","prevValue","clone","value","emit","txn","pastedVal","nextTick","history","keymap","historyKeymap","triggerTextSelection","EditorSelection","onMounted","platform"],"mappings":"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"}