@scalar/api-client 2.42.0 → 3.0.0

package/dist/components/CodeInput/CodeInput.vue.script.js

@@ -1,294 +0,0 @@
-import { useLayout } from "../../hooks/useLayout.js";
-import EnvironmentVariableDropdown_default from "../../views/Environment/EnvironmentVariableDropdown.vue.js";
-import DataTableInputSelect_default from "../DataTable/DataTableInputSelect.vue.js";
-import { backspaceCommand, pillPlugin } from "./codeVariableWidget.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, mergeProps, normalizeClass, openBlock, ref, renderSlot, toDisplayString, toRef, unref, useAttrs, watch, withKeys, withModifiers } from "vue";
-import { colorPicker, useCodeMirror, useDropdown } from "@scalar/use-codemirror";
-import { nanoid } from "nanoid";
-//#region src/components/CodeInput/CodeInput.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = { class: "whitespace-nowrap" };
-var _hoisted_2 = ["id"];
-var _hoisted_3 = {
-	key: 0,
-	class: "z-context text-c-2 absolute right-1.5 bottom-1 hidden font-sans group-has-[:focus-visible]/input:block",
-	role: "alert"
-};
-var _hoisted_4 = {
-	key: 5,
-	class: "centered-y text-orange absolute right-7 text-xs"
-};
-var _hoisted_5 = {
-	key: 6,
-	class: "centered-y absolute right-0 flex h-full items-center p-1.5 group-has-[.cm-focused]:z-1"
-};
-var _hoisted_6 = {
-	key: 7,
-	class: "required centered-y text-xxs text-c-3 group-[.error]:text-red bg-b-1 pointer-events-none absolute right-0 mr-0.5 pt-px pr-2 opacity-100 shadow-[-8px_0_4px_var(--scalar-background-1)] transition-opacity duration-150 group-[.alert]:bg-transparent group-[.alert]:shadow-none group-[.error]:bg-transparent group-[.error]:shadow-none peer-has-[.cm-focused]:opacity-0"
-};
-var CodeInput_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-	inheritAttrs: false,
-	__name: "CodeInput",
-	props: {
-		colorPicker: {
-			type: Boolean,
-			default: false
-		},
-		disabled: {
-			type: Boolean,
-			default: false
-		},
-		modelValue: {},
-		error: { type: Boolean },
-		emitOnBlur: {
-			type: Boolean,
-			default: true
-		},
-		extensions: { default: () => [] },
-		lineNumbers: { type: Boolean },
-		lint: { type: Boolean },
-		disableTabIndent: {
-			type: Boolean,
-			default: false
-		},
-		language: {},
-		handleFieldSubmit: {},
-		handleFieldChange: {},
-		placeholder: {},
-		required: { type: Boolean },
-		disableEnter: {
-			type: Boolean,
-			default: false
-		},
-		disableCloseBrackets: {
-			type: Boolean,
-			default: false
-		},
-		enum: {},
-		examples: {},
-		type: {},
-		nullable: {
-			type: Boolean,
-			default: false
-		},
-		withVariables: {
-			type: Boolean,
-			default: true
-		},
-		importCurl: { type: Boolean },
-		default: {},
-		environment: {},
-		envVariables: {},
-		lineWrapping: {
-			type: Boolean,
-			default: false
-		}
-	},
-	emits: [
-		"submit",
-		"update:modelValue",
-		"curl",
-		"blur"
-	],
-	setup(__props, { expose: __expose, emit: __emit }) {
-		const props = __props;
-		const emit = __emit;
-		const attrs = useAttrs();
-		const uid = attrs.id || `id-${nanoid()}`;
-		const isFocused = ref(false);
-		const showDropdown = ref(false);
-		const dropdownQuery = ref("");
-		const dropdownPosition = ref({
-			left: 0,
-			top: 0
-		});
-		const dropdownRef = ref(null);
-		const { layout } = useLayout();
-		/** Change is emitted during typing. This does not trigger validation */
-		function handleChange(value) {
-			if (value === props.modelValue) return null;
-			if (props.importCurl && value.trim().toLowerCase().startsWith("curl")) {
-				emit("curl", value);
-				codeMirror.value?.dispatch({ changes: {
-					from: 0,
-					to: codeMirror.value.state.doc.length,
-					insert: String(props.modelValue)
-				} });
-				return null;
-			}
-			return props.handleFieldChange ? props.handleFieldChange(value) : emit("update:modelValue", value);
-		}
-		/** Submit is emitted on blur and enter. This will trigger validation */
-		function handleSubmit(value) {
-			return props.handleFieldSubmit ? props.handleFieldSubmit(value) : emit("submit", value);
-		}
-		/** Optional submit on blur.  */
-		function handleBlur(value) {
-			isFocused.value = false;
-			if (props.emitOnBlur && props.modelValue) handleSubmit(value);
-			emit("blur", value);
-		}
-		const extensions = [...props.extensions];
-		if (props.colorPicker) extensions.push(colorPicker);
-		const pillPluginExtension = computed(() => pillPlugin({
-			environment: props.environment,
-			envVariables: props.envVariables,
-			isReadOnly: layout === "modal"
-		}));
-		const baseExtensions = computed(() => [
-			...extensions,
-			pillPluginExtension.value,
-			backspaceCommand
-		]);
-		const codeMirrorRef = ref(null);
-		const { codeMirror } = useCodeMirror({
-			content: toRef(() => props.modelValue !== void 0 ? String(props.modelValue) : ""),
-			onChange: (value) => {
-				handleChange(value);
-				updateDropdownVisibility();
-			},
-			onFocus: () => isFocused.value = true,
-			onBlur: (val) => handleBlur(val),
-			codeMirrorRef,
-			disableTabIndent: toRef(() => props.disableTabIndent),
-			disableEnter: toRef(() => props.disableEnter),
-			disableCloseBrackets: toRef(() => props.disableCloseBrackets),
-			lineNumbers: toRef(() => props.lineNumbers),
-			language: toRef(() => props.language),
-			lint: toRef(() => props.lint),
-			extensions: baseExtensions,
-			placeholder: toRef(() => props.placeholder)
-		});
-		codeMirror.value?.focus();
-		watch(codeMirror, () => {
-			if (codeMirror.value && Object.hasOwn(attrs, "autofocus")) codeMirror.value.focus();
-		});
-		const { handleDropdownSelect, updateDropdownVisibility } = useDropdown({
-			codeMirror,
-			query: dropdownQuery,
-			showDropdown,
-			dropdownPosition
-		});
-		const booleanOptions = computed(() => props.nullable ? [
-			"true",
-			"false",
-			"null"
-		] : ["true", "false"]);
-		const handleKeyDown = (key, event) => {
-			if (showDropdown.value) {
-				if (key === "down") {
-					event.preventDefault();
-					dropdownRef.value?.handleArrowKey("down");
-				} else if (key === "up") {
-					event.preventDefault();
-					dropdownRef.value?.handleArrowKey("up");
-				} else if (key === "enter") {
-					event.preventDefault();
-					dropdownRef.value?.handleSelect();
-				}
-			} else if (key === "escape") {
-				if (!props.disableTabIndent) event.stopPropagation();
-			} else if (key === "enter" && event.target instanceof HTMLDivElement) handleSubmit(event.target.textContent ?? "");
-		};
-		const defaultType = computed(() => {
-			return Array.isArray(props.type) ? props.type.find((type) => type !== "null") ?? "string" : props.type;
-		});
-		const displayVariablesDropdown = computed(() => showDropdown.value && props.withVariables && layout !== "modal" && props.environment);
-		__expose({
-			focus: () => {
-				codeMirror.value?.focus();
-			},
-			handleChange,
-			handleSubmit,
-			handleBlur,
-			booleanOptions,
-			codeMirror,
-			modelValue: props.modelValue
-		});
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock(Fragment, null, [
-				__props.disabled ? (openBlock(), createElementBlock("div", {
-					key: 0,
-					class: normalizeClass(["text-c-2 flex cursor-default items-center justify-center", unref(layout) === "modal" ? "font-code pr-2 pl-1 text-base" : "px-2"]),
-					"data-testid": "code-input-disabled"
-				}, [createElementVNode("span", _hoisted_1, toDisplayString(__props.modelValue), 1)], 2)) : props.enum && props.enum.length ? (openBlock(), createBlock(DataTableInputSelect_default, {
-					key: 1,
-					default: props.default,
-					modelValue: __props.modelValue,
-					type: defaultType.value,
-					value: props.enum,
-					"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => emit("update:modelValue", $event))
-				}, null, 8, [
-					"default",
-					"modelValue",
-					"type",
-					"value"
-				])) : __props.type === "boolean" || __props.type?.includes("boolean") ? (openBlock(), createBlock(DataTableInputSelect_default, {
-					key: 2,
-					default: props.default,
-					modelValue: __props.modelValue,
-					value: booleanOptions.value,
-					"onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => emit("update:modelValue", $event))
-				}, null, 8, [
-					"default",
-					"modelValue",
-					"value"
-				])) : props.examples && props.examples.length ? (openBlock(), createBlock(DataTableInputSelect_default, {
-					key: 3,
-					default: props.default,
-					modelValue: props.modelValue,
-					value: props.examples,
-					"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => emit("update:modelValue", $event))
-				}, null, 8, [
-					"default",
-					"modelValue",
-					"value"
-				])) : (openBlock(), createElementBlock("div", mergeProps({
-					key: 4,
-					id: unref(uid)
-				}, _ctx.$attrs, {
-					ref_key: "codeMirrorRef",
-					ref: codeMirrorRef,
-					class: ["group/input group-[.alert]:outline-orange group-[.error]:outline-red font-code peer relative w-full overflow-hidden text-xs leading-[1.44] whitespace-nowrap -outline-offset-1 has-[:focus-visible]:rounded-[4px] has-[:focus-visible]:outline", {
-						"line-wrapping has-[:focus-visible]:bg-b-1 has-[:focus-visible]:absolute has-[:focus-visible]:z-1": __props.lineWrapping,
-						"flow-code-input--error": __props.error
-					}],
-					onKeydown: [
-						_cache[3] || (_cache[3] = withKeys(withModifiers(($event) => handleKeyDown("down", $event), ["stop"]), ["down"])),
-						_cache[4] || (_cache[4] = withKeys(($event) => handleKeyDown("enter", $event), ["enter"])),
-						_cache[5] || (_cache[5] = withKeys(($event) => handleKeyDown("escape", $event), ["escape"])),
-						_cache[6] || (_cache[6] = withKeys(withModifiers(($event) => handleKeyDown("up", $event), ["stop"]), ["up"]))
-					]
-				}), [!__props.disableTabIndent ? (openBlock(), createElementBlock("div", _hoisted_3, [..._cache[7] || (_cache[7] = [
-					createTextVNode(" Press ", -1),
-					createElementVNode("kbd", { class: "-mx-0.25 rounded border px-0.5 font-mono" }, "Esc", -1),
-					createTextVNode(" then ", -1),
-					createElementVNode("kbd", { class: "-mx-0.25 rounded border px-0.5 font-mono" }, "Tab", -1),
-					createTextVNode(" to exit ", -1)
-				])])) : createCommentVNode("", true)], 16, _hoisted_2)),
-				_ctx.$slots.warning ? (openBlock(), createElementBlock("div", _hoisted_4, [renderSlot(_ctx.$slots, "warning", {}, void 0, true)])) : createCommentVNode("", true),
-				_ctx.$slots.icon ? (openBlock(), createElementBlock("div", _hoisted_5, [renderSlot(_ctx.$slots, "icon", {}, void 0, true)])) : createCommentVNode("", true),
-				__props.required ? (openBlock(), createElementBlock("div", _hoisted_6, " Required ")) : createCommentVNode("", true),
-				displayVariablesDropdown.value ? (openBlock(), createBlock(EnvironmentVariableDropdown_default, {
-					key: 8,
-					ref_key: "dropdownRef",
-					ref: dropdownRef,
-					dropdownPosition: dropdownPosition.value,
-					envVariables: __props.envVariables,
-					environment: __props.environment,
-					query: dropdownQuery.value,
-					onSelect: unref(handleDropdownSelect)
-				}, null, 8, [
-					"dropdownPosition",
-					"envVariables",
-					"environment",
-					"query",
-					"onSelect"
-				])) : createCommentVNode("", true)
-			], 64);
-		};
-	}
-});
-//#endregion
-export { CodeInput_vue_vue_type_script_setup_true_lang_default as default };
-
-//# sourceMappingURL=CodeInput.vue.script.js.map

package/dist/components/CodeInput/CodeInput.vue.script.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CodeInput.vue.script.js","names":["$attrs","$slots"],"sources":["../../../src/components/CodeInput/CodeInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { Environment } from '@scalar/oas-utils/entities/environment'\nimport {\n  colorPicker as colorPickerExtension,\n  useCodeMirror,\n  useDropdown,\n  type CodeMirrorLanguage,\n  type Extension,\n} from '@scalar/use-codemirror'\nimport { nanoid } from 'nanoid'\nimport { computed, ref, toRef, useAttrs, watch, type Ref } from 'vue'\n\nimport { useLayout } from '@/hooks'\nimport type { EnvVariable } from '@/store/active-entities'\nimport EnvironmentVariableDropdown from '@/views/Environment/EnvironmentVariableDropdown.vue'\n\nimport DataTableInputSelect from '../DataTable/DataTableInputSelect.vue'\nimport { backspaceCommand, pillPlugin } from './codeVariableWidget'\n\nconst props = withDefaults(\n  defineProps<{\n    colorPicker?: boolean\n    disabled?: boolean\n    modelValue: string | number\n    error?: boolean\n    emitOnBlur?: boolean\n    extensions?: Extension[]\n    lineNumbers?: boolean\n    lint?: boolean\n    disableTabIndent?: boolean\n    language?: CodeMirrorLanguage\n    handleFieldSubmit?: (e: string) => void\n    handleFieldChange?: (e: string) => void\n    placeholder?: string\n    required?: boolean\n    disableEnter?: boolean\n    disableCloseBrackets?: boolean\n    enum?: string[]\n    examples?: string[]\n    type?: string | string[] | undefined\n    nullable?: boolean\n    withVariables?: boolean\n    importCurl?: boolean\n    default?: string | number\n    environment: Environment\n    envVariables: EnvVariable[]\n    lineWrapping?: boolean\n  }>(),\n  {\n    disableCloseBrackets: false,\n    disableEnter: false,\n    extensions: () => [],\n    disableTabIndent: false,\n    emitOnBlur: true,\n    colorPicker: false,\n    nullable: false,\n    withVariables: true,\n    disabled: false,\n    lineWrapping: false,\n  },\n)\nconst emit = defineEmits<{\n  (e: 'submit', v: string): void\n  (e: 'update:modelValue', v: string): void\n  (e: 'curl', v: string): void\n  (e: 'blur', v: string): void\n}>()\n\nconst attrs = useAttrs() as { id?: string }\nconst uid = (attrs.id as string) || `id-${nanoid()}`\n\nconst isFocused = ref(false)\n\n// Environment variable dropdown init\nconst showDropdown = ref(false)\nconst dropdownQuery = ref('')\nconst dropdownPosition = ref({ left: 0, top: 0 })\nconst dropdownRef = ref<InstanceType<\n  typeof EnvironmentVariableDropdown\n> | null>(null)\n\nconst { layout } = useLayout()\n\n// ---------------------------------------------------------------------------\n// Event mapping from codemirror to standard input interfaces\n\n/** Change is emitted during typing. This does not trigger validation */\nfunction handleChange(value: string) {\n  // We need to be careful, only if the value is different we trigger an update\n  // on initial load of the component, this gets triggered cause we set the content\n  if (value === props.modelValue) {\n    return null\n  }\n  if (props.importCurl && value.trim().toLowerCase().startsWith('curl')) {\n    emit('curl', value)\n    // Maintain previous input value\n    codeMirror.value?.dispatch({\n      changes: {\n        from: 0,\n        to: codeMirror.value.state.doc.length,\n        insert: String(props.modelValue),\n      },\n    })\n    // Prevent table value population on current request\n    return null\n  }\n\n  return props.handleFieldChange\n    ? props.handleFieldChange(value)\n    : emit('update:modelValue', value)\n}\n\n/** Submit is emitted on blur and enter. This will trigger validation */\nfunction handleSubmit(value: string) {\n  return props.handleFieldSubmit\n    ? props.handleFieldSubmit(value)\n    : emit('submit', value)\n}\n\n/** Optional submit on blur.  */\nfunction handleBlur(value: string) {\n  isFocused.value = false\n  if (props.emitOnBlur && props.modelValue) {\n    handleSubmit(value)\n  }\n  emit('blur', value)\n}\n\n// ---------------------------------------------------------------------------\n// Codemirror instance handling\n\n// WARNING: Extensions are non-reactive! If props change nothing will happen\n\nconst extensions: Extension[] = [...props.extensions]\nif (props.colorPicker) {\n  extensions.push(colorPickerExtension)\n}\n\n// Create a reactive pill plugin that updates when environment changes\nconst pillPluginExtension = computed(() =>\n  pillPlugin({\n    environment: props.environment,\n    envVariables: props.envVariables,\n    isReadOnly: layout === 'modal',\n  }),\n)\n\n// Base extensions that will be used for the editor\nconst baseExtensions = computed(() => [\n  ...extensions,\n  pillPluginExtension.value,\n  backspaceCommand,\n])\n\nconst codeMirrorRef: Ref<HTMLDivElement | null> = ref(null)\n\nconst { codeMirror } = useCodeMirror({\n  content: toRef(() =>\n    props.modelValue !== undefined ? String(props.modelValue) : '',\n  ),\n  onChange: (value) => {\n    handleChange(value)\n    updateDropdownVisibility()\n  },\n  onFocus: () => (isFocused.value = true),\n  onBlur: (val) => handleBlur(val),\n  codeMirrorRef,\n  disableTabIndent: toRef(() => props.disableTabIndent),\n  disableEnter: toRef(() => props.disableEnter),\n  disableCloseBrackets: toRef(() => props.disableCloseBrackets),\n  lineNumbers: toRef(() => props.lineNumbers),\n  language: toRef(() => props.language),\n  lint: toRef(() => props.lint),\n  extensions: baseExtensions,\n  placeholder: toRef(() => props.placeholder),\n})\n\ncodeMirror.value?.focus()\n\n// If we specify autofocus then focus codemirror on creation\nwatch(codeMirror, () => {\n  if (codeMirror.value && Object.hasOwn(attrs, 'autofocus')) {\n    codeMirror.value.focus()\n  }\n})\n\nconst { handleDropdownSelect, updateDropdownVisibility } = useDropdown({\n  codeMirror,\n  query: dropdownQuery,\n  showDropdown,\n  dropdownPosition,\n})\n\n// Computed property to check if type is boolean and nullable\nconst booleanOptions = computed(() =>\n  props.nullable ? ['true', 'false', 'null'] : ['true', 'false'],\n)\n\nconst handleKeyDown = (key: string, event: KeyboardEvent) => {\n  if (showDropdown.value) {\n    if (key === 'down') {\n      event.preventDefault()\n      dropdownRef.value?.handleArrowKey('down')\n    } else if (key === 'up') {\n      event.preventDefault()\n      dropdownRef.value?.handleArrowKey('up')\n    } else if (key === 'enter') {\n      event.preventDefault()\n      dropdownRef.value?.handleSelect()\n    }\n  } else if (key === 'escape') {\n    if (!props.disableTabIndent) {\n      event.stopPropagation()\n    }\n  } else if (key === 'enter' && event.target instanceof HTMLDivElement) {\n    handleSubmit(event.target.textContent ?? '')\n  }\n}\n\nconst defaultType = computed(() => {\n  return Array.isArray(props.type)\n    ? // Find the first type, that's not 'null'\n      (props.type.find((type) => type !== 'null') ?? 'string')\n    : // If it's not an array, just return the type\n      props.type\n})\n\nconst displayVariablesDropdown = computed(\n  () =>\n    showDropdown.value &&\n    props.withVariables &&\n    layout !== 'modal' &&\n    props.environment,\n)\n\ndefineExpose({\n  /** Expose focus method */\n  focus: () => {\n    codeMirror.value?.focus()\n  },\n  // Expose these methods for testing\n  handleChange,\n  handleSubmit,\n  handleBlur,\n  booleanOptions,\n  codeMirror,\n  modelValue: props.modelValue,\n})\n</script>\n<script lang=\"ts\">\n// use normal <script> to declare options\nexport default {\n  inheritAttrs: false,\n}\n</script>\n<template>\n  <template v-if=\"disabled\">\n    <div\n      class=\"text-c-2 flex cursor-default items-center justify-center\"\n      :class=\"layout === 'modal' ? 'font-code pr-2 pl-1 text-base' : 'px-2'\"\n      data-testid=\"code-input-disabled\">\n      <span class=\"whitespace-nowrap\">{{ modelValue }}</span>\n    </div>\n  </template>\n  <template v-else-if=\"props.enum && props.enum.length\">\n    <DataTableInputSelect\n      :default=\"props.default\"\n      :modelValue=\"modelValue\"\n      :type=\"defaultType\"\n      :value=\"props.enum\"\n      @update:modelValue=\"emit('update:modelValue', $event)\" />\n  </template>\n  <template v-else-if=\"type === 'boolean' || type?.includes('boolean')\">\n    <DataTableInputSelect\n      :default=\"props.default\"\n      :modelValue=\"modelValue\"\n      :value=\"booleanOptions\"\n      @update:modelValue=\"emit('update:modelValue', $event)\" />\n  </template>\n  <template v-else-if=\"props.examples && props.examples.length\">\n    <DataTableInputSelect\n      :default=\"props.default\"\n      :modelValue=\"props.modelValue\"\n      :value=\"props.examples\"\n      @update:modelValue=\"emit('update:modelValue', $event)\" />\n  </template>\n  <template v-else>\n    <div\n      :id=\"uid\"\n      v-bind=\"$attrs\"\n      ref=\"codeMirrorRef\"\n      class=\"group/input group-[.alert]:outline-orange group-[.error]:outline-red font-code peer relative w-full overflow-hidden text-xs leading-[1.44] whitespace-nowrap -outline-offset-1 has-[:focus-visible]:rounded-[4px] has-[:focus-visible]:outline\"\n      :class=\"{\n        'line-wrapping has-[:focus-visible]:bg-b-1 has-[:focus-visible]:absolute has-[:focus-visible]:z-1':\n          lineWrapping,\n        'flow-code-input--error': error,\n      }\"\n      @keydown.down.stop=\"handleKeyDown('down', $event)\"\n      @keydown.enter=\"handleKeyDown('enter', $event)\"\n      @keydown.escape=\"handleKeyDown('escape', $event)\"\n      @keydown.up.stop=\"handleKeyDown('up', $event)\">\n      <div\n        v-if=\"!disableTabIndent\"\n        class=\"z-context text-c-2 absolute right-1.5 bottom-1 hidden font-sans group-has-[:focus-visible]/input:block\"\n        role=\"alert\">\n        Press\n        <kbd class=\"-mx-0.25 rounded border px-0.5 font-mono\">Esc</kbd> then\n        <kbd class=\"-mx-0.25 rounded border px-0.5 font-mono\">Tab</kbd> to exit\n      </div>\n    </div>\n  </template>\n  <div\n    v-if=\"$slots.warning\"\n    class=\"centered-y text-orange absolute right-7 text-xs\">\n    <slot name=\"warning\" />\n  </div>\n  <div\n    v-if=\"$slots.icon\"\n    class=\"centered-y absolute right-0 flex h-full items-center p-1.5 group-has-[.cm-focused]:z-1\">\n    <slot name=\"icon\" />\n  </div>\n  <div\n    v-if=\"required\"\n    class=\"required centered-y text-xxs text-c-3 group-[.error]:text-red bg-b-1 pointer-events-none absolute right-0 mr-0.5 pt-px pr-2 opacity-100 shadow-[-8px_0_4px_var(--scalar-background-1)] transition-opacity duration-150 group-[.alert]:bg-transparent group-[.alert]:shadow-none group-[.error]:bg-transparent group-[.error]:shadow-none peer-has-[.cm-focused]:opacity-0\">\n    Required\n  </div>\n  <EnvironmentVariableDropdown\n    v-if=\"displayVariablesDropdown\"\n    ref=\"dropdownRef\"\n    :dropdownPosition=\"dropdownPosition\"\n    :envVariables=\"envVariables\"\n    :environment=\"environment\"\n    :query=\"dropdownQuery\"\n    @select=\"handleDropdownSelect\" />\n</template>\n<style scoped>\n/*\n Deep styling for customizing Codemirror\n*/\n:deep(.cm-editor) {\n  height: 100%;\n  outline: none;\n  padding: 0;\n  background: transparent;\n}\n:deep(.cm-placeholder) {\n  color: var(--scalar-color-3);\n}\n:deep(.cm-content) {\n  font-family: var(--scalar-font-code);\n  font-size: var(--scalar-small);\n  max-height: 20px;\n  padding: 8px 0;\n}\n/* Tooltip helper */\n:deep(.cm-tooltip) {\n  background: transparent !important;\n  filter: brightness(var(--scalar-lifted-brightness));\n  border-radius: var(--scalar-radius);\n  box-shadow: var(--scalar-shadow-2);\n  border: none !important;\n  outline: none !important;\n  overflow: hidden !important;\n}\n:deep(.cm-tooltip-autocomplete ul li) {\n  padding: 3px 6px !important;\n}\n:deep(.cm-completionIcon-type:after) {\n  color: var(--scalar-color-3) !important;\n}\n:deep(.cm-tooltip-autocomplete ul li[aria-selected]) {\n  background: var(--scalar-background-2) !important;\n  color: var(--scalar-color-1) !important;\n}\n:deep(.cm-tooltip-autocomplete ul) {\n  padding: 6px !important;\n  position: relative;\n}\n:deep(.cm-tooltip-autocomplete ul li:hover) {\n  border-radius: 3px;\n  color: var(--scalar-color-1) !important;\n  background: var(--scalar-background-3) !important;\n}\n/* Disable active line highlighting */\n:deep(.cm-activeLine),\n:deep(.cm-activeLineGutter) {\n  background-color: transparent;\n}\n/* Color selection matching */\n:deep(.cm-selectionMatch),\n:deep(.cm-matchingBracket) {\n  border-radius: var(--scalar-radius);\n  background: var(--scalar-background-4) !important;\n}\n/* Color Picker Swatches */\n:deep(.cm-css-color-picker-wrapper) {\n  display: inline-flex;\n  outline: 1px solid var(--scalar-background-3);\n  border-radius: 3px;\n  overflow: hidden;\n}\n/* Number gutter */\n:deep(.cm-gutters) {\n  background-color: transparent;\n  border-right: none;\n  color: var(--scalar-color-3);\n  font-size: var(--scalar-small);\n  line-height: 22px;\n  border-radius: 0 0 0 3px;\n}\n:deep(.cm-gutters:before) {\n  content: '';\n  position: absolute;\n  top: 2px;\n  left: 2px;\n  width: calc(100% - 2px);\n  height: calc(100% - 4px);\n  border-radius: var(--scalar-radius) 0 0 var(--scalar-radius);\n  background-color: var(--scalar-background-1);\n}\n:deep(.cm-gutterElement) {\n  font-family: var(--scalar-font-code) !important;\n  padding-left: 0px !important;\n  padding-right: 6px !important;\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  position: relative;\n}\n:deep(.cm-lineNumbers .cm-gutterElement) {\n  min-width: fit-content;\n}\n:deep(.cm-gutter + .cm-gutter :not(.cm-foldGutter) .cm-gutterElement) {\n  padding-left: 0 !important;\n}\n:deep(.cm-scroller) {\n  overflow: auto;\n}\n.line-wrapping:focus-within :deep(.cm-content) {\n  display: inline-table;\n  min-height: fit-content;\n  padding: 3px 6px;\n  white-space: break-spaces;\n  word-break: break-all;\n}\n</style>\n<style>\n.cm-pill {\n  --tw-bg-base: var(--scalar-color-1);\n  color: var(--tw-bg-base);\n  padding: 0px 9px;\n  border-radius: 3px;\n  display: inline-block;\n  border-radius: 30px;\n  font-size: var(--scalar-small);\n  background: color-mix(in srgb, var(--tw-bg-base), transparent 94%) !important;\n}\n.cm-pill.bg-grey {\n  background: var(--scalar-background-3) !important;\n}\n.dark-mode .cm-pill {\n  background: color-mix(in srgb, var(--tw-bg-base), transparent 90%) !important;\n}\n.cm-pill:first-of-type {\n  margin-left: 0;\n}\n.cm-editor .cm-widgetBuffer {\n  display: none;\n}\n.cm-foldPlaceholder:hover {\n  color: var(--scalar-color-1);\n}\n.cm-foldGutter .cm-gutterElement {\n  font-size: var(--scalar-heading-4);\n  padding: 2px !important;\n}\n.cm-foldGutter .cm-gutterElement:first-of-type {\n  display: none;\n}\n.cm-foldGutter .cm-gutterElement .cm-foldMarker {\n  padding: 2px;\n  padding-top: 2px;\n}\n.cm-foldGutter .cm-gutterElement:hover .cm-foldMarker {\n  background: var(--scalar-background-2);\n  border-radius: var(--scalar-radius);\n  color: var(--scalar-color-1);\n}\n</style>\n"],"mappings":"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"}

package/dist/components/CodeInput/codeVariableWidget.d.ts

@@ -1,17 +0,0 @@
-import type { Environment } from '@scalar/oas-utils/entities/environment';
-import { Decoration, type DecorationSet, EditorView, ViewPlugin, type ViewUpdate } from '@scalar/use-codemirror';
-import { type EnvVariables } from '../../libs/env-helpers.js';
-/**
- * Styles the active environment variable pill
- */
-export declare const pillPlugin: (props: {
-    environment: Environment | undefined;
-    envVariables: EnvVariables | undefined;
-    isReadOnly: boolean | undefined;
-}) => ViewPlugin<{
-    decorations: DecorationSet;
-    update(update: ViewUpdate): void;
-    buildDecorations(view: EditorView): import("@codemirror/state").RangeSet<Decoration>;
-}>;
-export declare const backspaceCommand: import("@codemirror/state").Extension;
-//# sourceMappingURL=codeVariableWidget.d.ts.map

package/dist/components/CodeInput/codeVariableWidget.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"codeVariableWidget.d.ts","sourceRoot":"","sources":["../../../src/components/CodeInput/codeVariableWidget.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,wCAAwC,CAAA;AAEzE,OAAO,EACL,UAAU,EACV,KAAK,aAAa,EAClB,UAAU,EAEV,UAAU,EACV,KAAK,UAAU,EAEhB,MAAM,wBAAwB,CAAA;AAK/B,OAAO,EAAE,KAAK,YAAY,EAAe,MAAM,oBAAoB,CAAA;AAiGnE;;GAEG;AACH,eAAO,MAAM,UAAU,GAAI,OAAO;IAChC,WAAW,EAAE,WAAW,GAAG,SAAS,CAAA;IACpC,YAAY,EAAE,YAAY,GAAG,SAAS,CAAA;IACtC,UAAU,EAAE,OAAO,GAAG,SAAS,CAAA;CAChC;iBAGkB,aAAa;mBAMX,UAAU;2BASF,UAAU;EA4BpC,CAAA;AAEH,eAAO,MAAM,gBAAgB,uCA8B3B,CAAA"}

package/dist/components/CodeInput/codeVariableWidget.js

@@ -1,135 +0,0 @@
-import { getEnvColor } from "../../libs/env-helpers.js";
-import { parseEnvVariables } from "../../libs/environment-parser.js";
-import { createApp, defineComponent, h } from "vue";
-import { ScalarTooltip } from "@scalar/components";
-import { REGEX } from "@scalar/oas-utils/helpers";
-import { ScalarIconGlobe } from "@scalar/icons";
-import { Decoration, EditorView, RangeSetBuilder, ViewPlugin, WidgetType } from "@scalar/use-codemirror";
-import { nanoid } from "nanoid";
-//#region src/components/CodeInput/codeVariableWidget.ts
-/**
-* Displays the value of a variable of the active environment in a pill
-*/
-var PillWidget = class PillWidget extends WidgetType {
-	app;
-	uid;
-	environment;
-	envVariables;
-	isReadOnly;
-	constructor(variableName, environment, envVariables, isReadOnly) {
-		super();
-		this.variableName = variableName;
-		this.variableName = variableName;
-		this.environment = environment;
-		this.envVariables = envVariables;
-		this.isReadOnly = isReadOnly ?? false;
-		this.uid = nanoid();
-	}
-	toDOM() {
-		const span = document.createElement("span");
-		span.className = "cm-pill";
-		span.textContent = `${this.variableName}`;
-		this.app = createApp(defineComponent({
-			props: { variableName: {
-				type: String,
-				default: null
-			} },
-			render: () => {
-				const val = this.envVariables ? parseEnvVariables(this.envVariables).find((thing) => thing.key === this.variableName) : void 0;
-				const isGlobal = val?.source === "global";
-				const pillColor = isGlobal ? "var(--scalar-color-1)" : val && this.environment && this.environment.name !== "No Environment" ? getEnvColor(this.environment) : "var(--scalar-color-1)";
-				span.style.setProperty("--tw-bg-base", pillColor);
-				span.style.opacity = val?.value ? "1" : "0.5";
-				const tooltipContent = val?.value || "No value";
-				const tooltipTrigger = h("div", { class: "flex items-center gap-1 whitespace-nowrap" }, [(isGlobal || this.environment?.name === "No Environment" && val?.value) && h(ScalarIconGlobe, {
-					class: "size-3 -ml-1",
-					icon: "Globe"
-				}), h("span", this.variableName)]);
-				return h(ScalarTooltip, {
-					content: tooltipContent,
-					delay: 0,
-					placement: "bottom",
-					offset: 6
-				}, { default: () => tooltipTrigger });
-			}
-		}), { variableName: this.variableName });
-		this.app.mount(span);
-		return span;
-	}
-	destroy() {
-		if (this.app) this.app.unmount();
-	}
-	eq(other) {
-		return other instanceof PillWidget && other.variableName === this.variableName && other.uid === this.uid;
-	}
-	ignoreEvent() {
-		return false;
-	}
-};
-/**
-* Styles the active environment variable pill
-*/
-var pillPlugin = (props) => ViewPlugin.fromClass(class {
-	decorations;
-	constructor(view) {
-		this.decorations = this.buildDecorations(view);
-	}
-	update(update) {
-		if (update.docChanged || update.viewportChanged) requestAnimationFrame(() => {
-			this.decorations = this.buildDecorations(update.view);
-			update.view.update([]);
-		});
-	}
-	buildDecorations(view) {
-		const builder = new RangeSetBuilder();
-		for (const { from, to } of view.visibleRanges) {
-			const text = view.state.doc.sliceString(from, to);
-			let match;
-			while ((match = REGEX.VARIABLES.exec(text)) !== null) {
-				const start = from + match.index;
-				const end = start + match[0].length;
-				const variableName = match[1] ?? "";
-				builder.add(start, end, Decoration.widget({
-					widget: new PillWidget(variableName, props.environment, props.envVariables, props.isReadOnly),
-					side: 1
-				}));
-			}
-		}
-		return builder.finish();
-	}
-}, { decorations: (v) => v.decorations });
-var backspaceCommand = EditorView.domEventHandlers({ keydown(event, view) {
-	if (event.key === "Backspace") {
-		const { state } = view;
-		const { from, to } = state.selection.main;
-		if (from === 0 && to === state.doc.length) {
-			view.dispatch({
-				changes: {
-					from: 0,
-					to: state.doc.length
-				},
-				selection: { anchor: 0 }
-			});
-			event.preventDefault();
-			return true;
-		}
-		if (from === to && from > 0) {
-			if (state.doc.sliceString(from - 2, from) === "}}") {
-				view.dispatch({
-					changes: {
-						from: from - 2,
-						to
-					},
-					selection: { anchor: from - 2 }
-				});
-				event.preventDefault();
-				return true;
-			}
-		}
-	}
-	return false;
-} });
-//#endregion
-export { backspaceCommand, pillPlugin };
-
-//# sourceMappingURL=codeVariableWidget.js.map

package/dist/components/CodeInput/codeVariableWidget.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"codeVariableWidget.js","names":[],"sources":["../../../src/components/CodeInput/codeVariableWidget.ts"],"sourcesContent":["import { ScalarTooltip } from '@scalar/components'\nimport { ScalarIconGlobe } from '@scalar/icons'\nimport type { Environment } from '@scalar/oas-utils/entities/environment'\nimport { REGEX } from '@scalar/oas-utils/helpers'\nimport {\n  Decoration,\n  type DecorationSet,\n  EditorView,\n  RangeSetBuilder,\n  ViewPlugin,\n  type ViewUpdate,\n  WidgetType,\n} from '@scalar/use-codemirror'\nimport { nanoid } from 'nanoid'\nimport { createApp, defineComponent, h } from 'vue'\n\nimport { parseEnvVariables } from '@/libs'\nimport { type EnvVariables, getEnvColor } from '@/libs/env-helpers'\n\n/**\n * Displays the value of a variable of the active environment in a pill\n */\nclass PillWidget extends WidgetType {\n  private app: any\n  private uid: string\n  environment: Environment | undefined\n  envVariables: EnvVariables | undefined\n  isReadOnly: boolean\n\n  constructor(\n    private variableName: string,\n    environment: Environment | undefined,\n    envVariables: EnvVariables | undefined,\n    isReadOnly: boolean | undefined,\n  ) {\n    super()\n    this.variableName = variableName\n    this.environment = environment\n    this.envVariables = envVariables\n    this.isReadOnly = isReadOnly ?? false\n    this.uid = nanoid()\n  }\n\n  toDOM() {\n    const span = document.createElement('span')\n    span.className = 'cm-pill'\n    span.textContent = `${this.variableName}`\n\n    const tooltipComponent = defineComponent({\n      props: { variableName: { type: String, default: null } },\n      render: () => {\n        const val = this.envVariables\n          ? parseEnvVariables(this.envVariables).find((thing) => thing.key === this.variableName)\n          : undefined\n\n        // Set the pill color based on the environment source or fallback to default color\n        const isGlobal = val?.source === 'global'\n        const pillColor = isGlobal\n          ? 'var(--scalar-color-1)'\n          : val && this.environment && this.environment.name !== 'No Environment'\n            ? getEnvColor(this.environment)\n            : 'var(--scalar-color-1)'\n\n        span.style.setProperty('--tw-bg-base', pillColor)\n\n        // Set opacity based on the existence of a value\n        span.style.opacity = val?.value ? '1' : '0.5'\n\n        // Tooltip content as string\n        const tooltipContent = val?.value || 'No value'\n\n        // Tooltip trigger element\n        const tooltipTrigger = h('div', { class: 'flex items-center gap-1 whitespace-nowrap' }, [\n          (isGlobal || (this.environment?.name === 'No Environment' && val?.value)) &&\n            h(ScalarIconGlobe, { class: 'size-3 -ml-1', icon: 'Globe' }),\n          h('span', this.variableName),\n        ])\n\n        return h(\n          ScalarTooltip,\n          {\n            content: tooltipContent,\n            delay: 0,\n            placement: 'bottom',\n            offset: 6,\n          },\n          {\n            default: () => tooltipTrigger,\n          },\n        )\n      },\n    })\n\n    this.app = createApp(tooltipComponent, { variableName: this.variableName })\n    this.app.mount(span)\n\n    return span\n  }\n\n  override destroy() {\n    if (this.app) {\n      this.app.unmount()\n    }\n  }\n\n  override eq(other: WidgetType) {\n    return other instanceof PillWidget && other.variableName === this.variableName && other.uid === this.uid\n  }\n\n  override ignoreEvent() {\n    return false\n  }\n}\n\n/**\n * Styles the active environment variable pill\n */\nexport const pillPlugin = (props: {\n  environment: Environment | undefined\n  envVariables: EnvVariables | undefined\n  isReadOnly: boolean | undefined\n}) =>\n  ViewPlugin.fromClass(\n    class {\n      decorations: DecorationSet\n\n      constructor(view: EditorView) {\n        this.decorations = this.buildDecorations(view)\n      }\n\n      update(update: ViewUpdate) {\n        if (update.docChanged || update.viewportChanged) {\n          requestAnimationFrame(() => {\n            this.decorations = this.buildDecorations(update.view)\n            update.view.update([])\n          })\n        }\n      }\n\n      buildDecorations(view: EditorView) {\n        const builder = new RangeSetBuilder<Decoration>()\n\n        for (const { from, to } of view.visibleRanges) {\n          const text = view.state.doc.sliceString(from, to)\n          let match\n\n          while ((match = REGEX.VARIABLES.exec(text)) !== null) {\n            const start = from + match.index\n            const end = start + match[0].length\n            const variableName = match[1] ?? ''\n            builder.add(\n              start,\n              end,\n              Decoration.widget({\n                widget: new PillWidget(variableName, props.environment, props.envVariables, props.isReadOnly),\n                side: 1,\n              }),\n            )\n          }\n        }\n\n        return builder.finish()\n      }\n    },\n    {\n      decorations: (v) => v.decorations,\n    },\n  )\n\nexport const backspaceCommand = EditorView.domEventHandlers({\n  keydown(event, view) {\n    if (event.key === 'Backspace') {\n      const { state } = view\n      const { from, to } = state.selection.main\n\n      // Prevent breaking line content addition on pill removal\n      if (from === 0 && to === state.doc.length) {\n        view.dispatch({\n          changes: { from: 0, to: state.doc.length },\n          selection: { anchor: 0 },\n        })\n        event.preventDefault()\n        return true\n      }\n\n      if (from === to && from > 0) {\n        const before = state.doc.sliceString(from - 2, from)\n        if (before === '}}') {\n          view.dispatch({\n            changes: { from: from - 2, to },\n            selection: { anchor: from - 2 },\n          })\n          event.preventDefault()\n          return true\n        }\n      }\n    }\n    return false\n  },\n})\n"],"mappings":"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"}

package/dist/components/CodeInput/index.d.ts

@@ -1,2 +0,0 @@
-export { default as CodeInput } from './CodeInput.vue.js';
-//# sourceMappingURL=index.d.ts.map

package/dist/components/CodeInput/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/CodeInput/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iBAAiB,CAAA"}

package/dist/components/CodeInput/index.js

@@ -1,2 +0,0 @@
-import CodeInput_default from "./CodeInput.vue.js";
-export { CodeInput_default as CodeInput };

package/dist/components/CommandPalette/CommandActionForm.vue.d.ts

@@ -1,31 +0,0 @@
-import { type LoadingState } from '@scalar/components';
-type __VLS_Props = {
-    loader?: LoadingState;
-    disabled?: boolean;
-};
-declare var __VLS_1: {}, __VLS_3: {}, __VLS_11: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_1) => any;
-} & {
-    options?: (props: typeof __VLS_3) => any;
-} & {
-    submit?: (props: typeof __VLS_11) => any;
-};
-declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    submit: () => any;
-    cancel: () => any;
-    back: (e: KeyboardEvent) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    onSubmit?: (() => any) | undefined;
-    onCancel?: (() => any) | undefined;
-    onBack?: ((e: KeyboardEvent) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};
-//# sourceMappingURL=CommandActionForm.vue.d.ts.map

package/dist/components/CommandPalette/CommandActionForm.vue.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CommandActionForm.vue.d.ts","sourceRoot":"","sources":["../../../src/components/CommandPalette/CommandActionForm.vue"],"names":[],"mappings":"AAyCA,OAAO,EAA2B,KAAK,YAAY,EAAE,MAAM,oBAAoB,CAAA;AAE/E,KAAK,WAAW,GAAG;IACjB,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAC;AA0FF,QAAA,IAAI,OAAO,IAAU,EAAE,OAAO,IAAU,EAAE,QAAQ,IAAY,CAAE;AAChE,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAK/C,QAAA,MAAM,UAAU;;;;;;;;kFAGd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AACzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/components/CommandPalette/CommandActionForm.vue.js

@@ -1,7 +0,0 @@
-import CommandActionForm_vue_vue_type_script_setup_true_lang_default from "./CommandActionForm.vue.script.js";
-//#region src/components/CommandPalette/CommandActionForm.vue
-var CommandActionForm_default = CommandActionForm_vue_vue_type_script_setup_true_lang_default;
-//#endregion
-export { CommandActionForm_default as default };
-
-//# sourceMappingURL=CommandActionForm.vue.js.map

package/dist/components/CommandPalette/CommandActionForm.vue.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CommandActionForm.vue.js","names":[],"sources":["../../../src/components/CommandPalette/CommandActionForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, useBindCx, type LoadingState } from '@scalar/components'\n\nconst { loader, disabled = false } = defineProps<{\n  loader?: LoadingState\n  disabled?: boolean\n}>()\n\ndefineEmits<{\n  (event: 'submit'): void\n  (event: 'cancel'): void\n  (event: 'back', e: KeyboardEvent): void\n}>()\n\nconst { cx } = useBindCx()\n</script>\n<template>\n  <form\n    class=\"flex w-full flex-col gap-3\"\n    @keydown.enter.stop\n    @submit.prevent.stop=\"!disabled && $emit('submit')\">\n    <div v-bind=\"cx('relative flex min-h-20 flex-col rounded')\">\n      <slot />\n    </div>\n    <div class=\"flex gap-2\">\n      <div class=\"flex max-h-8 flex-1\">\n        <slot name=\"options\" />\n      </div>\n      <ScalarButton\n        class=\"max-h-8 px-3 text-xs\"\n        :disabled=\"disabled\"\n        :loader\n        type=\"submit\">\n        <slot name=\"submit\">Continue</slot>\n      </ScalarButton>\n    </div>\n  </form>\n</template>\n"],"mappings":""}

package/dist/components/CommandPalette/CommandActionForm.vue.script.js

@@ -1,42 +0,0 @@
-import { createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, guardReactiveProps, normalizeProps, openBlock, renderSlot, unref, withCtx, withKeys, withModifiers } from "vue";
-import { ScalarButton, useBindCx } from "@scalar/components";
-//#region src/components/CommandPalette/CommandActionForm.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = { class: "flex gap-2" };
-var _hoisted_2 = { class: "flex max-h-8 flex-1" };
-var CommandActionForm_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
-	__name: "CommandActionForm",
-	props: {
-		loader: {},
-		disabled: {
-			type: Boolean,
-			default: false
-		}
-	},
-	emits: [
-		"submit",
-		"cancel",
-		"back"
-	],
-	setup(__props) {
-		const { cx } = useBindCx();
-		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("form", {
-				class: "flex w-full flex-col gap-3",
-				onKeydown: _cache[0] || (_cache[0] = withKeys(withModifiers(() => {}, ["stop"]), ["enter"])),
-				onSubmit: _cache[1] || (_cache[1] = withModifiers(($event) => !__props.disabled && _ctx.$emit("submit"), ["prevent", "stop"]))
-			}, [createElementVNode("div", normalizeProps(guardReactiveProps(unref(cx)("relative flex min-h-20 flex-col rounded"))), [renderSlot(_ctx.$slots, "default")], 16), createElementVNode("div", _hoisted_1, [createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "options")]), createVNode(unref(ScalarButton), {
-				class: "max-h-8 px-3 text-xs",
-				disabled: __props.disabled,
-				loader: __props.loader,
-				type: "submit"
-			}, {
-				default: withCtx(() => [renderSlot(_ctx.$slots, "submit", {}, () => [_cache[2] || (_cache[2] = createTextVNode("Continue", -1))])]),
-				_: 3
-			}, 8, ["disabled", "loader"])])], 32);
-		};
-	}
-});
-//#endregion
-export { CommandActionForm_vue_vue_type_script_setup_true_lang_default as default };
-
-//# sourceMappingURL=CommandActionForm.vue.script.js.map

package/dist/components/CommandPalette/CommandActionForm.vue.script.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CommandActionForm.vue.script.js","names":["$emit"],"sources":["../../../src/components/CommandPalette/CommandActionForm.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarButton, useBindCx, type LoadingState } from '@scalar/components'\n\nconst { loader, disabled = false } = defineProps<{\n  loader?: LoadingState\n  disabled?: boolean\n}>()\n\ndefineEmits<{\n  (event: 'submit'): void\n  (event: 'cancel'): void\n  (event: 'back', e: KeyboardEvent): void\n}>()\n\nconst { cx } = useBindCx()\n</script>\n<template>\n  <form\n    class=\"flex w-full flex-col gap-3\"\n    @keydown.enter.stop\n    @submit.prevent.stop=\"!disabled && $emit('submit')\">\n    <div v-bind=\"cx('relative flex min-h-20 flex-col rounded')\">\n      <slot />\n    </div>\n    <div class=\"flex gap-2\">\n      <div class=\"flex max-h-8 flex-1\">\n        <slot name=\"options\" />\n      </div>\n      <ScalarButton\n        class=\"max-h-8 px-3 text-xs\"\n        :disabled=\"disabled\"\n        :loader\n        type=\"submit\">\n        <slot name=\"submit\">Continue</slot>\n      </ScalarButton>\n    </div>\n  </form>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;EAcA,MAAM,EAAE,OAAO,WAAU;;uBAGvB,mBAmBO,QAAA;IAlBL,OAAM;IACL,WAAO,OAAA,OAAA,OAAA,KAAA,SAAA,oBAAR,IAAmB,CAAA,OAAA,CAAA,EAAA,CAAA,QAAA,CAAA;IAClB,UAAM,OAAA,OAAA,OAAA,KAAA,eAAA,WAAA,CAAgB,QAAA,YAAYA,KAAAA,MAAK,SAAA,EAAA,CAAA,WAAA,OAAA,CAAA;OACxC,mBAEM,OAAA,eAAA,mBAFO,MAAA,GAAE,CAAA,0CAAA,CAAA,CAAA,EAAA,CACb,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,GAAA,EAEV,mBAWM,OAXN,YAWM,CAVJ,mBAEM,OAFN,YAEM,CADJ,WAAuB,KAAA,QAAA,UAAA,CAAA,CAAA,EAEzB,YAMe,MAAA,aAAA,EAAA;IALb,OAAM;IACL,UAAU,QAAA;IACV,QAAA,QAAA;IACD,MAAK;;2BAC8B,CAAnC,WAAmC,KAAA,QAAA,UAAA,EAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KAAA,gBAAf,YAAQ,GAAA,EAAA,CAAA,CAAA,CAAA"}

package/dist/components/CommandPalette/CommandActionInput.vue.d.ts

@@ -1,15 +0,0 @@
-type __VLS_Props = {
-    modelValue?: string;
-    placeholder?: string;
-    autofocus?: boolean;
-};
-declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    "update:modelValue": (v: string) => any;
-    onDelete: (event: KeyboardEvent) => any;
-}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{
-    "onUpdate:modelValue"?: ((v: string) => any) | undefined;
-    onOnDelete?: ((event: KeyboardEvent) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const _default: typeof __VLS_export;
-export default _default;
-//# sourceMappingURL=CommandActionInput.vue.d.ts.map

package/dist/components/CommandPalette/CommandActionInput.vue.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CommandActionInput.vue.d.ts","sourceRoot":"","sources":["../../../src/components/CommandPalette/CommandActionInput.vue"],"names":[],"mappings":"AAoEA,KAAK,WAAW,GAAG;IACjB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAC;AAuGF,QAAA,MAAM,YAAY;;;;;;kFAGhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}