@scalar/api-client 3.23.1 → 3.23.3

package/dist/v2/components/code-input/CodeInputLite.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodeInputLite.vue_vue_type_script_setup_true_lang.js","names":["$slots","PillTooltipHost","_openBlock","_createElementBlock","_Fragment","_normalizeClass","_createElementVNode","_toDisplayString","_createBlock","DataTableInputSelect","_mergeProps","_renderSlot","_createCommentVNode","_unref","EnvironmentVariableDropdown"],"sources":["../../../../src/v2/components/code-input/CodeInputLite.vue"],"sourcesContent":["<script lang=\"ts\">\n/* eslint-disable vue/one-component-per-file -- Tooltip apps mount the imported PillTooltipHost; they do not define another component. */\n/**\n * CodeInputLite\n *\n * Single-line `contenteditable` editor that renders `{{varname}}` as atomic\n * pill spans (`contenteditable=\"false\"`) and offers an env-variable\n * autocomplete on `{{`. The value is still exposed as a `{{name}}`-bearing\n * string via `update:modelValue`; DOM ↔ model conversion lives in\n * `renderModel` and `serializeEditor`.\n */\nexport default {\n  inheritAttrs: false,\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { isDefined } from '@scalar/helpers/array/is-defined'\nimport { REGEX } from '@scalar/helpers/regex/regex-helpers'\nimport {\n  CONTEXT_FUNCTION_NAMES,\n  getContextFunctionComment,\n  isContextFunctionName,\n  type ContextFunctionName,\n} from '@scalar/workspace-store/request-example'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { nanoid } from 'nanoid'\nimport {\n  computed,\n  createApp,\n  nextTick,\n  onBeforeUnmount,\n  onMounted,\n  ref,\n  useAttrs,\n  useTemplateRef,\n  watch,\n  type App,\n} from 'vue'\n\nimport DataTableInputSelect from '@/v2/components/data-table/DataTableInputSelect.vue'\nimport EnvironmentVariableDropdown from '@/v2/features/environments/components/EnvironmentVariablesDropdown.vue'\nimport { useLocalization } from '@/v2/features/localization'\nimport type { ClientLayout } from '@/v2/types/layout'\n\nimport type { CodeInputModelValue } from './CodeInput.vue'\nimport { buildPillContext } from './helpers/build-pill-context'\nimport { lookupVariableValue } from './helpers/lookup-variable-value'\nimport { pillSignature } from './helpers/pill-signature'\nimport { serializeValue } from './helpers/serialize-value'\nimport PillTooltipHost from './PillTooltipHost.vue'\n\nconst {\n  modelValue,\n  environment,\n  disabled = false,\n  readOnly = false,\n  error = false,\n  layout = 'desktop',\n  placeholder,\n  required = false,\n  emitOnBlur = true,\n  alwaysEmitChange = false,\n  withVariables = true,\n  withFakeData = false,\n  linethrough = false,\n  type,\n  enum: enumProp,\n  arrayEncoding,\n  examples,\n  default: defaultProp,\n  nullable = false,\n} = defineProps<Props>()\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n  'submit': [value: string, event: KeyboardEvent | FocusEvent]\n  'blur': [value: string, event: FocusEvent]\n  'navigate': [route: { page: 'document'; path: 'environment' }]\n}>()\n\nconst { translate } = useLocalization()\n\ntype Props = {\n  modelValue: CodeInputModelValue\n  /** Environment for variable substitution. Pass undefined to disable env vars */\n  environment: XScalarEnvironment | undefined\n  /** Render as a non-interactive read-only label */\n  disabled?: boolean\n  /** Render the input with the native `readonly` attribute (still focusable, no edits) */\n  readOnly?: boolean\n  /** Show error styling */\n  error?: boolean\n  /** Layout context affects styling and dropdown visibility */\n  layout?: ClientLayout\n  /** Placeholder text for an empty input */\n  placeholder?: string\n  /** Show required indicator */\n  required?: boolean\n  /** Emit submit on blur */\n  emitOnBlur?: boolean\n  /** Render variable pills + show the autocomplete dropdown */\n  withVariables?: boolean\n  /** Include `{{$guid}}` etc. in the autocomplete dropdown */\n  withFakeData?: boolean\n  /** Always emit change events even if the value is unchanged */\n  alwaysEmitChange?: boolean\n  /** Strike-through styling for the input text (e.g. overridden values) */\n  linethrough?: boolean\n  /** Schema type — drives boolean select mode when `boolean` is included */\n  type?: string | string[]\n  /** Predefined enum values; when set the input is replaced by a select */\n  enum?: unknown[]\n  /** Text representation of array selections. */\n  arrayEncoding?: 'json' | 'comma-separated'\n  /** Example values; when set (and no enum/boolean) the input is replaced by a select */\n  examples?: string[]\n  /** Default value to suggest in select modes */\n  default?: CodeInputModelValue\n  /** Whether the boolean select includes a `null` option */\n  nullable?: boolean\n}\n\nconst attrs = useAttrs()\nconst ariaLabel = computed(() =>\n  typeof attrs['aria-label'] === 'string' ? attrs['aria-label'] : undefined,\n)\n/** Lifted to the editable surface like aria-label, so a visible label can name it */\nconst ariaLabelledby = computed(() =>\n  typeof attrs['aria-labelledby'] === 'string'\n    ? attrs['aria-labelledby']\n    : undefined,\n)\n/**\n * The wrapper is a generic div, and ARIA prohibits naming a generic element,\n * so the naming attributes only go on the editor and not on the wrapper.\n */\nconst wrapperAttrs = computed(() => {\n  const {\n    'aria-label': _ariaLabel,\n    'aria-labelledby': _ariaLabelledby,\n    ...rest\n  } = attrs\n  return rest\n})\n\n/**\n * The id only matters once the dropdown opens (`aria-controls` /\n * `aria-activedescendant`), so we defer `nanoid()` until first focus to\n * keep idle instances cheap. A consumer-supplied `id` attr is preserved.\n */\nconst generatedComponentId = ref<string | null>(null)\nconst componentId = computed((): string | undefined =>\n  typeof attrs.id === 'string'\n    ? attrs.id\n    : (generatedComponentId.value ?? undefined),\n)\nconst ensureComponentId = (): void => {\n  if (\n    (typeof attrs.id !== 'string' || !attrs.id) &&\n    generatedComponentId.value === null\n  ) {\n    generatedComponentId.value = `id-${nanoid()}`\n  }\n}\n\nconst editorRef = useTemplateRef<HTMLDivElement>('editorRef')\nconst dropdownRef = ref<InstanceType<\n  typeof EnvironmentVariableDropdown\n> | null>(null)\n\n/** Id of the dropdown's `role=\"listbox\"` element, for the combobox wiring. */\nconst listboxId = computed((): string | undefined =>\n  componentId.value ? `${componentId.value}-listbox` : undefined,\n)\n\n/**\n * Id of the option the dropdown currently highlights. Mirrors the dropdown's\n * own selection so the editor can expose it via `aria-activedescendant`.\n */\nconst activeOptionId = computed(\n  (): string | undefined => dropdownRef.value?.activeOptionId,\n)\n\nconst isFocused = ref(false)\nconst isEmpty = ref(true)\n\n/**\n * True while an IME composition is in progress. Rebuilding the editor DOM\n * mid-composition (e.g. when `{{` forms a pill) cancels the composition, so we\n * defer those rebuilds until `compositionend`.\n */\nconst isComposing = ref(false)\n\n/**\n * Whether the serialized value should count as empty for placeholder display.\n *\n * `contenteditable` can leave behind invisible residue after some delete\n * sequences — most commonly a non-breaking space (`\\u00a0`) — which makes a\n * visually empty field report a non-zero length and silently drop its\n * placeholder. Trimming covers that case; `\\u00a0` counts as whitespace, so a\n * field that only holds editor residue is treated as empty. This affects the\n * placeholder flag only, never the value emitted via `serializeEditor`.\n */\nconst isBlankValue = (text: string): boolean => text.trim().length === 0\n\n// ───────────────────────────────────────────────────────────────────\n// Rendering-mode detection (parity with CodeInput's select dispatch)\n// ───────────────────────────────────────────────────────────────────\n\n/** True when the schema type is exactly `boolean` (or includes it in a tuple type). */\nconst isBooleanMode = computed((): boolean => {\n  if (enumProp?.length) {\n    return false\n  }\n  return type === 'boolean' || (Array.isArray(type) && type.includes('boolean'))\n})\n\nconst booleanOptions = computed((): string[] =>\n  nullable ? ['true', 'false', 'null'] : ['true', 'false'],\n)\n\n/** Default type when the schema is a tuple — picks the first non-null entry. */\nconst defaultType = computed((): string | undefined => {\n  if (Array.isArray(type)) {\n    return type.find((t) => t !== 'null') ?? 'string'\n  }\n  return type\n})\n\nconst handleSelectChange = (value: string): void =>\n  emit('update:modelValue', value)\n\n// ───────────────────────────────────────────────────────────────────\n// Per-pill tooltip apps\n// ───────────────────────────────────────────────────────────────────\n\nlet pillTooltipApps: App[] = []\n\n/**\n * Per-pill tooltips are the heaviest part of the render (a Vue app +\n * `useTooltip` watch + listeners each), so we defer mounting them until\n * the first interaction (focus, pointerover, or dropdown open). Once on,\n * subsequent rebuilds remount tooltips for the new pills.\n */\nlet tooltipsActive = false\n\nconst teardownPillTooltips = (): void => {\n  for (const app of pillTooltipApps) {\n    app.unmount()\n  }\n  pillTooltipApps = []\n}\n\nconst mountPillTooltips = (): void => {\n  if (!editorRef.value || layout === 'modal') {\n    return\n  }\n  const pills = editorRef.value.querySelectorAll<HTMLElement>('.scalar-pill')\n  for (const pillEl of pills) {\n    const variableName = pillEl.dataset.variable ?? ''\n    const context = buildPillContext(variableName, environment)\n    const app = createApp(PillTooltipHost, {\n      context,\n      target: pillEl,\n      translate,\n    })\n    // PillTooltipHost is renderless; useTooltip attaches to `target` directly.\n    app.mount(document.createElement('div'))\n    pillTooltipApps.push(app)\n  }\n}\n\n// ───────────────────────────────────────────────────────────────────\n// DOM ↔ model conversion\n// ───────────────────────────────────────────────────────────────────\n\n/**\n * Build a pill `<span>` for the given variable. `contentEditable = 'false'`\n * makes the browser treat it as a single atom (arrow keys jump over it,\n * Backspace deletes it whole); `{{` / `}}` only live in the model string.\n */\nconst createPillElement = (\n  name: string,\n  start: number,\n  end: number,\n): HTMLSpanElement => {\n  const isCtx = isContextFunctionName(name)\n  const span = document.createElement('span')\n  span.className = isCtx ? 'scalar-pill scalar-pill--context-fn' : 'scalar-pill'\n  span.contentEditable = 'false'\n  span.dataset.variable = name\n  // Model-coordinate offsets (the pill stands in for the full `{{name}}`).\n  // Used by click forwarding and tests to map a pill back to the value.\n  span.dataset.pillStart = String(start)\n  span.dataset.pillEnd = String(end)\n\n  const color = isCtx\n    ? 'var(--scalar-color-3)'\n    : environment?.color || 'var(--scalar-color-1)'\n  span.style.setProperty('--tw-bg-base', color)\n\n  // Fade env pills with no usable value. A falsy check (not just\n  // `=== undefined`) matches the tooltip path's `Boolean(value)`, so a\n  // variable declared with an empty string fades here too.\n  const isUndefinedEnv = !isCtx && !lookupVariableValue(environment, name)\n  if (isUndefinedEnv) {\n    span.style.opacity = '0.5'\n  }\n\n  span.textContent = name\n  return span\n}\n\n/** Render a model string into the editor as a mix of text nodes + pills. */\nconst renderModel = (text: string): void => {\n  const editor = editorRef.value\n  if (!editor) {\n    return\n  }\n\n  teardownPillTooltips()\n  editor.replaceChildren()\n\n  if (!withVariables || !text.includes('{{')) {\n    if (text) {\n      editor.appendChild(document.createTextNode(text))\n    }\n    isEmpty.value = isBlankValue(text)\n    return\n  }\n\n  const regex = new RegExp(REGEX.VARIABLES.source, REGEX.VARIABLES.flags)\n  let lastIndex = 0\n  let match: RegExpExecArray | null\n\n  while ((match = regex.exec(text)) !== null) {\n    const start = match.index\n    const end = start + match[0].length\n    if (start > lastIndex) {\n      editor.appendChild(document.createTextNode(text.slice(lastIndex, start)))\n    }\n    editor.appendChild(createPillElement(match[1] ?? '', start, end))\n    lastIndex = end\n  }\n\n  if (lastIndex < text.length) {\n    editor.appendChild(document.createTextNode(text.slice(lastIndex)))\n  }\n\n  isEmpty.value = false\n  if (tooltipsActive) {\n    mountPillTooltips()\n  }\n}\n\n/** Length the given child contributes to the serialized model string. */\nconst modelLengthOf = (node: Node): number => {\n  if (node.nodeType === Node.TEXT_NODE) {\n    return (node.textContent ?? '').length\n  }\n  if (node instanceof HTMLElement && node.classList.contains('scalar-pill')) {\n    return `{{${node.dataset.variable ?? ''}}}`.length\n  }\n  // Defensive: a stray element (e.g. browser-inserted <br>) — use its text.\n  return (node.textContent ?? '').length\n}\n\n/** Read the editor DOM back into a `{{name}}`-bearing model string. */\nconst serializeEditor = (): string => {\n  const editor = editorRef.value\n  if (!editor) {\n    return ''\n  }\n  let out = ''\n  for (const node of Array.from(editor.childNodes)) {\n    if (node.nodeType === Node.TEXT_NODE) {\n      out += node.textContent ?? ''\n    } else if (\n      node instanceof HTMLElement &&\n      node.classList.contains('scalar-pill')\n    ) {\n      out += `{{${node.dataset.variable ?? ''}}}`\n    } else if (node instanceof HTMLElement) {\n      // Flatten any stray <br> / <div> the browser may inject on paste/Enter.\n      out += node.textContent ?? ''\n    }\n  }\n  return out\n}\n\nlet lastPillSignature: string | null = null\nlet lastEnvKey = ''\n\n/**\n * Cache key for the env + `withVariables` state. Includes variable\n * name/value pairs so the watcher notices adds/removes/edits even when\n * `environment.color` is unchanged — without that, pills keep stale\n * `isDefined` opacity and tooltip values until the input itself changes.\n */\nconst computeEnvKey = (): string => {\n  const color = environment?.color ?? ''\n  const flag = withVariables ? '1' : '0'\n  const variables = environment?.variables ?? []\n  let vars = ''\n  for (const v of variables) {\n    const value =\n      typeof v.value === 'string' ? v.value : (v.value?.default ?? '')\n    // Unit separators (\\x1f / \\x1e) so values can safely contain `|` or `=`.\n    vars += `\\x1f${v.name}\\x1e${value}`\n  }\n  return `${color}|${flag}|${vars}`\n}\n\n/** Idempotent: first call flips `tooltipsActive` and mounts pill tooltips. */\nconst ensureTooltipsActive = (): void => {\n  if (tooltipsActive) {\n    return\n  }\n  tooltipsActive = true\n  mountPillTooltips()\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Caret ↔ model offset\n// ───────────────────────────────────────────────────────────────────\n\n/** Selection start as a model-string offset, or `null` if not inside the editor. */\nconst getModelCaret = (): number | null => {\n  const editor = editorRef.value\n  if (!editor) {\n    return null\n  }\n  const selection = window.getSelection()\n  if (!selection || selection.rangeCount === 0) {\n    return null\n  }\n  const range = selection.getRangeAt(0)\n  if (\n    range.startContainer !== editor &&\n    !editor.contains(range.startContainer)\n  ) {\n    return null\n  }\n\n  // Anchored on the editor itself: `startOffset` is a child index.\n  if (range.startContainer === editor) {\n    let pos = 0\n    for (\n      let i = 0;\n      i < range.startOffset && i < editor.childNodes.length;\n      i++\n    ) {\n      pos += modelLengthOf(editor.childNodes.item(i))\n    }\n    return pos\n  }\n\n  let pos = 0\n  for (const child of Array.from(editor.childNodes)) {\n    if (child === range.startContainer) {\n      return pos + range.startOffset\n    }\n    // Pills are non-editable; if a browser quirk still lands a selection\n    // inside one, snap to the nearest boundary instead of getting stuck.\n    if (child.contains(range.startContainer)) {\n      return range.startOffset === 0 ? pos : pos + modelLengthOf(child)\n    }\n    pos += modelLengthOf(child)\n  }\n  return pos\n}\n\n/** Place the caret at the given model offset, walking the DOM to find it. */\nconst setModelCaret = (target: number): void => {\n  const editor = editorRef.value\n  if (!editor) {\n    return\n  }\n  const range = document.createRange()\n  let pos = 0\n  let placed = false\n\n  for (const child of Array.from(editor.childNodes)) {\n    const len = modelLengthOf(child)\n    if (pos + len >= target) {\n      if (child.nodeType === Node.TEXT_NODE) {\n        const into = Math.max(\n          0,\n          Math.min(target - pos, (child.textContent ?? '').length),\n        )\n        range.setStart(child, into)\n      } else if (target - pos <= 0) {\n        range.setStartBefore(child)\n      } else {\n        range.setStartAfter(child)\n      }\n      placed = true\n      break\n    }\n    pos += len\n  }\n\n  if (!placed) {\n    range.selectNodeContents(editor)\n    range.collapse(false)\n  } else {\n    range.collapse(true)\n  }\n\n  const selection = window.getSelection()\n  if (!selection) {\n    return\n  }\n  selection.removeAllRanges()\n  selection.addRange(range)\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Environment variable dropdown\n// ───────────────────────────────────────────────────────────────────\n\nconst showDropdown = ref(false)\nconst dropdownQuery = ref('')\nconst dropdownPosition = ref({ left: 0, top: 0 })\n\nconst contextFunctionDropdownItems = computed(() =>\n  withFakeData\n    ? CONTEXT_FUNCTION_NAMES.map((key) => ({\n        key,\n        description: getContextFunctionComment(key as ContextFunctionName),\n      }))\n    : [],\n)\n\nconst displayVariablesDropdown = computed(\n  (): boolean =>\n    showDropdown.value &&\n    withVariables &&\n    layout !== 'modal' &&\n    (Boolean(environment) || withFakeData),\n)\n\nconst updateDropdownVisibility = (): void => {\n  const editor = editorRef.value\n  if (!editor) {\n    return\n  }\n  const caret = getModelCaret()\n  if (caret === null) {\n    showDropdown.value = false\n    return\n  }\n  const text = serializeEditor().slice(0, caret)\n  const lastOpen = text.lastIndexOf('{{')\n  const lastClose = text.lastIndexOf('}}')\n\n  if (lastOpen <= lastClose) {\n    showDropdown.value = false\n    return\n  }\n\n  dropdownQuery.value = text.slice(lastOpen + 2)\n  // Make sure the combobox has an id before it advertises `aria-expanded`, so\n  // `aria-controls` always resolves to the listbox we are about to render.\n  ensureComponentId()\n  showDropdown.value = true\n\n  // Anchor under the caret; `getBoundingClientRect` gives the caret rect in one read.\n  nextTick(() => {\n    const selection = window.getSelection()\n    if (!selection || selection.rangeCount === 0 || !editorRef.value) {\n      return\n    }\n    const r = selection.getRangeAt(0).cloneRange()\n    r.collapse(true)\n    const rect = r.getBoundingClientRect()\n    const editorRect = editorRef.value.getBoundingClientRect()\n    // Some browsers collapse empty ranges to a zero rect — fall back to the editor edge.\n    dropdownPosition.value = {\n      left: rect.left || editorRect.left,\n      top: rect.bottom || editorRect.bottom,\n    }\n  })\n}\n\nconst handleDropdownSelect = (item: string): void => {\n  if (readOnly) {\n    return\n  }\n  const caret = getModelCaret() ?? 0\n  const value = serializeEditor()\n  const from = Math.max(0, caret - dropdownQuery.value.length - 2)\n  const to = caret\n  const next = `${value.slice(0, from)}{{${item}}}${value.slice(to)}`\n  const nextCursor = from + `{{${item}}}`.length\n\n  // Pill set changed — force a re-render and reposition the caret.\n  lastPillSignature = pillSignature(next, withVariables)\n  renderModel(next)\n  setModelCaret(nextCursor)\n\n  showDropdown.value = false\n  emitChange(next, { skipDropdownCheck: true })\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Change / focus / blur\n// ───────────────────────────────────────────────────────────────────\n\nconst emitChange = (\n  value: string,\n  opts: { skipDropdownCheck?: boolean } = {},\n): void => {\n  const same = value === serializeValue(modelValue)\n  if (alwaysEmitChange || !same) {\n    emit('update:modelValue', value)\n  }\n  if (!opts.skipDropdownCheck) {\n    updateDropdownVisibility()\n  }\n}\n\nconst handleInput = (): void => {\n  const text = serializeEditor()\n  isEmpty.value = isBlankValue(text)\n\n  // Only rebuild when the pill set changes (e.g. `}}` closed a pattern, or\n  // a value was pasted). Skipping it for plain-text edits preserves the\n  // live selection — important for IME composition and double-click select.\n  // Also defer while composing; `handleCompositionEnd` re-runs this path so the\n  // rebuild happens once the IME has committed its text.\n  const sig = pillSignature(text, withVariables)\n  if (!isComposing.value && sig !== lastPillSignature) {\n    const caret = getModelCaret()\n    lastPillSignature = sig\n    renderModel(text)\n    if (caret !== null) {\n      setModelCaret(caret)\n    }\n  }\n\n  emitChange(text)\n}\n\nconst handleCompositionStart = (): void => {\n  isComposing.value = true\n}\n\nconst handleCompositionEnd = (): void => {\n  isComposing.value = false\n  // Run the deferred input path now that the composition has committed, so any\n  // pill that formed during composition is rendered.\n  handleInput()\n}\n\nconst handleFocus = (): void => {\n  isFocused.value = true\n  ensureComponentId()\n  ensureTooltipsActive()\n}\n\nconst handleBlur = (event: FocusEvent): void => {\n  isFocused.value = false\n  showDropdown.value = false\n  const value = serializeEditor()\n  // Check the serialized `value`, not `modelValue` — a `0` or `false` model is\n  // a valid non-empty entry that should still submit on blur.\n  if (emitOnBlur && value) {\n    emit('submit', value, event)\n  }\n  emit('blur', value, event)\n}\n\n/**\n * Strip rich content on paste; `contenteditable=\"plaintext-only\"` is not\n * reliable cross-browser, so we intercept and use `insertText` to keep undo.\n */\nconst handlePaste = (event: ClipboardEvent): void => {\n  event.preventDefault()\n  const text = event.clipboardData?.getData('text/plain') ?? ''\n  if (!text) {\n    return\n  }\n  document.execCommand('insertText', false, text.replace(/\\r?\\n/g, ' '))\n  // `insertText` normally fires an `input` event, but that is not guaranteed\n  // across browsers. Run the same path explicitly so pill rendering, emptiness,\n  // `update:modelValue`, and the dropdown never lag behind the pasted DOM.\n  handleInput()\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Keyboard handling\n// ───────────────────────────────────────────────────────────────────\n\nconst handleKeyDown = (event: KeyboardEvent): void => {\n  if (showDropdown.value) {\n    if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {\n      event.preventDefault()\n      event.stopPropagation()\n      dropdownRef.value?.handleArrowKey(\n        event.key === 'ArrowDown' ? 'down' : 'up',\n      )\n      return\n    }\n    if (event.key === 'Enter') {\n      event.preventDefault()\n      event.stopPropagation()\n      dropdownRef.value?.handleSelect()\n      return\n    }\n    if (event.key === 'Escape') {\n      event.preventDefault()\n      event.stopPropagation()\n      showDropdown.value = false\n      return\n    }\n  }\n\n  if (event.key === 'Enter') {\n    // Block the browser default so a contenteditable div does not insert\n    // <br> / <div> and break single-line semantics, then emit submit\n    // (used by the table editors).\n    event.preventDefault()\n    emit('submit', serializeEditor(), event)\n    return\n  }\n\n  // Backspace / Delete: pill atomicity is handled by the browser via\n  // `contenteditable=\"false\"` on pills — no manual `}}`-pair handling needed.\n}\n\n// ───────────────────────────────────────────────────────────────────\n// Click forwarding & lifecycle\n// ───────────────────────────────────────────────────────────────────\n\n/**\n * Clicking a pill selects it whole, so a subsequent Backspace deletes it\n * in one keystroke and typing replaces it — the usual chip/mention model.\n */\nconst handleEditorClick = (event: MouseEvent): void => {\n  const target =\n    event.target instanceof Element\n      ? event.target.closest<HTMLElement>('.scalar-pill')\n      : null\n  if (!target) {\n    return\n  }\n  const editor = editorRef.value\n  if (!editor) {\n    return\n  }\n  editor.focus()\n  const range = document.createRange()\n  range.selectNode(target)\n  const selection = window.getSelection()\n  selection?.removeAllRanges()\n  selection?.addRange(range)\n  updateDropdownVisibility()\n}\n\nonMounted(() => {\n  const initial = serializeValue(modelValue)\n  lastPillSignature = pillSignature(initial, withVariables)\n  lastEnvKey = computeEnvKey()\n  renderModel(initial)\n  isEmpty.value = isBlankValue(initial)\n\n  // `autofocus` on a contenteditable div is not honoured natively, so focus\n  // the editor ourselves when the consumer passes the attribute.\n  if (Object.hasOwn(attrs, 'autofocus')) {\n    editorRef.value?.focus()\n  }\n})\n\nwatch(\n  () => modelValue,\n  (next) => {\n    const serialized = serializeValue(next)\n    // Always sync the placeholder flag, even when the DOM already matches and we\n    // skip the rebuild below. Otherwise a value cell that switches from select\n    // mode (no editor element) into the empty editor keeps a stale `isEmpty`,\n    // and the placeholder silently disappears.\n    isEmpty.value = isBlankValue(serialized)\n    if (serializeEditor() === serialized) {\n      return\n    }\n    lastPillSignature = pillSignature(serialized, withVariables)\n    renderModel(serialized)\n  },\n)\n\n// The editable surface only exists in \"editor mode\" (see template). When a row switches into editor\n// mode after mount — most notably when this component instance is reused for a different table row —\n// `onMounted` has already run and the `modelValue` watch fired while `editorRef` was still null, so\n// the model was never painted into the freshly created element and the cell renders empty.\n//\n// Paint the model when the element appears, but only into a still-empty editor: an editor that\n// already holds text is either up to date or ahead of `modelValue` with an uncommitted edit/paste,\n// and must not be clobbered.\n//\n// `flush: 'sync'` makes the paint part of the same step that creates the element. Vue assigns a\n// non-null template ref from a post-render effect, so the element is already mounted and patched\n// when this runs — deferring any further (the `pre` default, or `post`) only pushes the paint past\n// the consumer effects that run later in the same flush. A parent that focuses the cell as it\n// switches into editor mode would then place the caret in a still-empty editor, and the paint's\n// `replaceChildren` would drop that selection.\nwatch(\n  editorRef,\n  (editor) => {\n    if (!editor || !isBlankValue(serializeEditor())) {\n      return\n    }\n    const serialized = serializeValue(modelValue)\n    if (serialized === '') {\n      return\n    }\n    lastPillSignature = pillSignature(serialized, withVariables)\n    renderModel(serialized)\n  },\n  { flush: 'sync' },\n)\n\nwatch(\n  [() => environment, () => withVariables],\n  () => {\n    // Env changes affect pill colour and `isDefined` opacity — rebuild.\n    const envKey = computeEnvKey()\n    if (envKey === lastEnvKey) {\n      return\n    }\n    lastEnvKey = envKey\n    // Most rows are plain text; skip the DOM walk when there are no pills.\n    // Pills introduced later flow through `handleInput` / the modelValue\n    // watcher, which update `lastPillSignature`.\n    if (lastPillSignature === '') {\n      return\n    }\n    lastPillSignature = pillSignature(serializeEditor(), withVariables)\n    // Preserve the caret across the rebuild so editing does not jump to the\n    // start when the environment changes mid-edit (mirrors `handleInput`).\n    const caret = getModelCaret()\n    renderModel(serializeEditor())\n    if (caret !== null) {\n      setModelCaret(caret)\n    }\n  },\n  // Variables are often mutated in place (e.g. editing a value in the env\n  // editor) without the object reference changing — deep watch catches it.\n  { deep: true },\n)\n\nonBeforeUnmount(() => {\n  teardownPillTooltips()\n})\n\n// ───────────────────────────────────────────────────────────────────\n// Public API\n// ───────────────────────────────────────────────────────────────────\n\ndefineExpose({\n  /** Focus the editor. `position` controls caret placement. */\n  focus: (position?: 'start' | 'end' | number): void => {\n    const editor = editorRef.value\n    if (!editor) {\n      return\n    }\n    editor.focus()\n    if (!isDefined(position)) {\n      return\n    }\n    const length = serializeEditor().length\n    const pos =\n      position === 'start' ? 0 : position === 'end' ? length : position\n    setModelCaret(pos)\n  },\n  /** Replace the current value programmatically and re-render the pills. */\n  setContent: (next = ''): void => {\n    if (serializeEditor() === next) {\n      return\n    }\n    lastPillSignature = pillSignature(next, withVariables)\n    renderModel(next)\n    isEmpty.value = isBlankValue(next)\n  },\n  /** Read the current value as a `{{name}}`-bearing string. */\n  getValue: (): string => serializeEditor(),\n  /** Caret offset in the model string. */\n  cursorPosition: (): number | undefined => {\n    const c = getModelCaret()\n    return c === null ? undefined : c\n  },\n  isFocused,\n  editorRef,\n})\n</script>\n\n<template>\n  <!-- Disabled mode: read-only label -->\n  <div\n    v-if=\"disabled\"\n    class=\"text-c-2 flex cursor-default items-center justify-center\"\n    :class=\"{\n      'font-code pr-2 pl-1 text-base': layout === 'modal',\n      'px-2': layout !== 'modal',\n      'line-through': linethrough,\n    }\"\n    data-testid=\"code-input-lite-disabled\">\n    <span class=\"whitespace-nowrap\">{{ modelValue }}</span>\n  </div>\n\n  <!-- Enum mode: select dropdown with predefined values -->\n  <DataTableInputSelect\n    v-else-if=\"enumProp?.length\"\n    :arrayEncoding=\"arrayEncoding\"\n    :default=\"defaultProp\"\n    :modelValue=\"modelValue\"\n    :type=\"defaultType\"\n    :value=\"enumProp\"\n    @update:modelValue=\"handleSelectChange\" />\n\n  <!-- Boolean mode: select dropdown with true/false (and optionally null) -->\n  <DataTableInputSelect\n    v-else-if=\"isBooleanMode\"\n    :default=\"defaultProp\"\n    :modelValue=\"modelValue\"\n    :value=\"booleanOptions\"\n    @update:modelValue=\"handleSelectChange\" />\n\n  <!-- Examples mode: select dropdown with example values -->\n  <DataTableInputSelect\n    v-else-if=\"examples?.length\"\n    :default=\"defaultProp\"\n    :modelValue=\"modelValue\"\n    :value=\"examples\"\n    @update:modelValue=\"handleSelectChange\" />\n\n  <!-- Editor mode -->\n  <div\n    v-else\n    :id=\"componentId\"\n    v-bind=\"wrapperAttrs\"\n    class=\"code-input-lite group/code-input-lite peer relative w-full leading-[1.44] -outline-offset-1 has-[:focus-visible]:rounded-[4px] has-[:focus-visible]:outline\"\n    :class=\"{\n      'code-input-lite--error': error,\n      'code-input-lite--empty': isEmpty,\n      'line-through': linethrough,\n    }\">\n    <!-- The single editable surface; see the file header for how pills work. -->\n    <div\n      ref=\"editorRef\"\n      :aria-activedescendant=\"\n        displayVariablesDropdown ? activeOptionId : undefined\n      \"\n      :aria-autocomplete=\"withVariables ? 'list' : undefined\"\n      :aria-controls=\"displayVariablesDropdown ? listboxId : undefined\"\n      :aria-expanded=\"displayVariablesDropdown ? 'true' : undefined\"\n      :aria-invalid=\"error ? 'true' : undefined\"\n      :aria-label=\"ariaLabel\"\n      :aria-labelledby=\"ariaLabelledby\"\n      :aria-readonly=\"readOnly ? 'true' : undefined\"\n      :aria-required=\"required ? 'true' : undefined\"\n      class=\"code-input-lite__editor\"\n      :contenteditable=\"readOnly ? 'false' : 'true'\"\n      :data-placeholder=\"placeholder\"\n      :role=\"withVariables ? 'combobox' : 'textbox'\"\n      spellcheck=\"false\"\n      @blur=\"handleBlur\"\n      @click=\"handleEditorClick\"\n      @compositionend=\"handleCompositionEnd\"\n      @compositionstart=\"handleCompositionStart\"\n      @focus=\"handleFocus\"\n      @input=\"handleInput\"\n      @keydown=\"handleKeyDown\"\n      @paste=\"handlePaste\"\n      @pointerover=\"ensureTooltipsActive\" />\n  </div>\n\n  <!--\n    Slots and the required indicator are siblings of the mode templates so\n    they render in every mode and so `absolute right-0` anchors to the\n    surrounding (relative) cell rather than the shrink-wrapped mode wrapper.\n  -->\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-[.code-input-lite__editor:focus]: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 peer-has-[.code-input-lite__editor:focus]:opacity-0\">\n    {{ translate('apiClient.codeInputLite.required') }}\n  </div>\n\n  <EnvironmentVariableDropdown\n    v-if=\"displayVariablesDropdown\"\n    ref=\"dropdownRef\"\n    :contextFunctionItems=\"contextFunctionDropdownItems\"\n    :dropdownPosition=\"dropdownPosition\"\n    :environment=\"environment\"\n    :listboxId=\"listboxId\"\n    :query=\"dropdownQuery\"\n    @close=\"showDropdown = false\"\n    @redirect=\"emit('navigate', { page: 'document', path: 'environment' })\"\n    @select=\"handleDropdownSelect\" />\n</template>\n\n<style scoped>\n.code-input-lite {\n  /* Flex so the editor centres vertically in whatever height the cell gives us.\n     Font properties inherit so we adopt the surrounding typography. */\n  display: flex;\n  align-items: center;\n}\n\n.code-input-lite__editor {\n  /* Everything font-related inherits from the surrounding context. */\n  font: inherit;\n  letter-spacing: inherit;\n  flex: 1;\n  min-width: 0;\n  background: transparent;\n  outline: none;\n  color: var(--scalar-color-1);\n  caret-color: var(--scalar-color-1);\n  /* Single-line: horizontal scroll keeps the caret visible for long values;\n     the scrollbar itself is hidden (would be noisy inside a table cell). */\n  white-space: pre;\n  overflow-x: auto;\n  overflow-y: hidden;\n  scrollbar-width: none;\n  padding: 0 0.5em;\n  box-sizing: border-box;\n  line-height: 1.44;\n  /* Positioning context for the absolutely positioned placeholder. */\n  position: relative;\n}\n\n.code-input-lite__editor::-webkit-scrollbar {\n  display: none;\n}\n\n/* Absolute so the placeholder does not occupy flow space inside the\n   contenteditable; otherwise the caret would land after it on focus.\n   `pointer-events: none` lets clicks fall through to focus the editor.\n   Hidden on focus so it never renders on top of the text caret. */\n.code-input-lite--empty .code-input-lite__editor:not(:focus)::before {\n  content: attr(data-placeholder);\n  color: var(--scalar-color-3);\n  pointer-events: none;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0.5em;\n  display: flex;\n  align-items: center;\n}\n\n.code-input-lite--error .code-input-lite__editor {\n  outline: 1px solid var(--scalar-color-red);\n}\n</style>\n\n<style>\n/* Pill styling. Each pill is `<span contenteditable=\"false\">name</span>` —\n   an atomic widget; the caret lands before or after it, never inside. */\n.scalar-pill {\n  color: var(--scalar-color-2);\n  border-radius: var(--scalar-radius-full);\n  display: inline-block;\n  font-family: var(--scalar-font-code);\n  font-size: 0.9em;\n  line-height: 1.4;\n  vertical-align: baseline;\n  background: var(--scalar-background-3);\n  padding: 0.125em 0.6em;\n  margin-right: 0.35em;\n  cursor: text;\n  /* Single click selects the whole pill — chip/mention model, deletes in one go. */\n  user-select: all;\n  -webkit-user-select: all;\n}\n\n.dark-mode .scalar-pill {\n  background: color-mix(\n    in srgb,\n    var(--tw-bg-base, var(--scalar-color-1)),\n    transparent 90%\n  );\n}\n\n.light-mode .scalar-pill {\n  background: var(--scalar-background-3);\n}\n\n.scalar-pill--context-fn {\n  /* Inset box-shadow as a border so the layout box stays identical to plain pills. */\n  box-shadow: 0 0 0 1px\n    color-mix(in srgb, var(--scalar-color-3), transparent 35%) inset;\n}\n\n.dark-mode .scalar-pill--context-fn {\n  background: color-mix(in srgb, var(--scalar-background-3), transparent 55%);\n}\n\n.light-mode .scalar-pill--context-fn {\n  background: color-mix(in srgb, var(--scalar-background-3), transparent 40%);\n}\n</style>\n"],"mappings":"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"}

package/dist/v2/components/code-input/PillTooltipHost.vue.d.ts

@@ -1,5 +1,5 @@
 import type { TranslateFn } from '@scalar/localization';
-import { type ApiClientTranslationKey } from '../../../v2/features/localization/index.js';
+import { type ApiClientTranslationKey } from '../../features/localization/index.js';
 import type { PillContext } from './pill-context';
 type __VLS_Props = {
     /** Tooltip data — environment value or context-function description */

package/dist/v2/components/code-input/PillTooltipHost.vue.js

@@ -1,4 +1,4 @@
-import PillTooltipHost_vue_vue_type_script_setup_true_lang_default from "./PillTooltipHost.vue.script.js";
+import PillTooltipHost_vue_vue_type_script_setup_true_lang_default from "./PillTooltipHost.vue_vue_type_script_setup_true_lang.js";
 //#region src/v2/components/code-input/PillTooltipHost.vue
 var PillTooltipHost_default = PillTooltipHost_vue_vue_type_script_setup_true_lang_default;
 //#endregion

package/dist/v2/components/code-input/PillTooltipHost.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"PillTooltipHost.vue.js","names":[],"sources":["../../../../src/v2/components/code-input/PillTooltipHost.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * PillTooltipHost\n *\n * Renderless adapter that attaches a tooltip to an existing DOM element.\n * Both the legacy CodeMirror widget pipeline and the new `CodeInputLite`\n * overlay mount one of these per pill via `createApp` — they keep ownership\n * of the pill DOM (text, classes, styles) and we only attach hover/focus\n * behaviour through `useTooltip`.\n *\n * The component renders nothing of its own; pass the pill element via the\n * `target` prop and `useTooltip` will wire mouseenter/mouseleave/focus/blur\n * listeners onto it directly.\n */\nimport { useTooltip } from '@scalar/components/tooltip'\nimport type { TranslateFn } from '@scalar/localization'\nimport { computed, h, ref, render } from 'vue'\n\nimport {\n  useLocalization,\n  type ApiClientTranslationKey,\n} from '@/v2/features/localization'\n\nimport type { PillContext } from './pill-context'\n\nconst props = defineProps<{\n  /** Tooltip data — environment value or context-function description */\n  context: PillContext\n  /** The pill element to attach the tooltip to */\n  target: HTMLElement\n  /** Carry the owning editor's locale into this separately mounted Vue app. */\n  translate?: TranslateFn<ApiClientTranslationKey>\n}>()\n\nconst { translate: fallbackTranslate } = useLocalization()\n\ndefineOptions({ name: 'PillTooltipHost' })\n\nconst translate = props.translate ?? fallbackTranslate\n\nconst isContextFn = props.context.type === 'contextFunction'\n\n/** Two-line HTML body for context-function tooltips. */\nconst contextTooltipHtml = computed(() => {\n  if (\n    !isContextFn ||\n    typeof document === 'undefined' ||\n    props.context.type !== 'contextFunction'\n  ) {\n    return ''\n  }\n  const el = document.createElement('div')\n  render(\n    h('div', { class: 'flex flex-col gap-1.5 text-left' }, [\n      h('span', {}, props.context.details),\n      h(\n        'div',\n        { class: 'text-[color:var(--scalar-color-3)] text-[10px] font-normal' },\n        translate('apiClient.pillTooltipHost.computedAtExecution'),\n      ),\n    ]),\n    el,\n  )\n  return el.innerHTML\n})\n\nconst environmentTooltipText = computed(() => {\n  if (props.context.type !== 'environment') {\n    return ''\n  }\n  return props.context.isDefined\n    ? props.context.value\n    : translate('apiClient.pillTooltipHost.noValue')\n})\n\nconst targetRef = ref<HTMLElement>(props.target)\n\nuseTooltip({\n  content: isContextFn ? contextTooltipHtml : environmentTooltipText,\n  contentTarget: isContextFn ? 'innerHTML' : 'textContent',\n  delay: 0,\n  placement: 'bottom-start',\n  offset: 6,\n  targetRef,\n})\n</script>\n\n<!-- eslint-disable vue/valid-template-root -- Renderless: the tooltip attaches to the supplied target. -->\n<template>\n  <!-- Renderless: behaviour attaches to props.target via useTooltip -->\n</template>\n"],"mappings":""}
+{"version":3,"file":"PillTooltipHost.vue.js","names":["_sfc_main"],"sources":["../../../../src/v2/components/code-input/PillTooltipHost.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * PillTooltipHost\n *\n * Renderless adapter that attaches a tooltip to an existing DOM element.\n * Both the legacy CodeMirror widget pipeline and the new `CodeInputLite`\n * overlay mount one of these per pill via `createApp` — they keep ownership\n * of the pill DOM (text, classes, styles) and we only attach hover/focus\n * behaviour through `useTooltip`.\n *\n * The component renders nothing of its own; pass the pill element via the\n * `target` prop and `useTooltip` will wire mouseenter/mouseleave/focus/blur\n * listeners onto it directly.\n */\nimport { useTooltip } from '@scalar/components/tooltip'\nimport type { TranslateFn } from '@scalar/localization'\nimport { computed, h, ref, render } from 'vue'\n\nimport {\n  useLocalization,\n  type ApiClientTranslationKey,\n} from '@/v2/features/localization'\n\nimport type { PillContext } from './pill-context'\n\nconst props = defineProps<{\n  /** Tooltip data — environment value or context-function description */\n  context: PillContext\n  /** The pill element to attach the tooltip to */\n  target: HTMLElement\n  /** Carry the owning editor's locale into this separately mounted Vue app. */\n  translate?: TranslateFn<ApiClientTranslationKey>\n}>()\n\nconst { translate: fallbackTranslate } = useLocalization()\n\ndefineOptions({ name: 'PillTooltipHost' })\n\nconst translate = props.translate ?? fallbackTranslate\n\nconst isContextFn = props.context.type === 'contextFunction'\n\n/** Two-line HTML body for context-function tooltips. */\nconst contextTooltipHtml = computed(() => {\n  if (\n    !isContextFn ||\n    typeof document === 'undefined' ||\n    props.context.type !== 'contextFunction'\n  ) {\n    return ''\n  }\n  const el = document.createElement('div')\n  render(\n    h('div', { class: 'flex flex-col gap-1.5 text-left' }, [\n      h('span', {}, props.context.details),\n      h(\n        'div',\n        { class: 'text-[color:var(--scalar-color-3)] text-[10px] font-normal' },\n        translate('apiClient.pillTooltipHost.computedAtExecution'),\n      ),\n    ]),\n    el,\n  )\n  return el.innerHTML\n})\n\nconst environmentTooltipText = computed(() => {\n  if (props.context.type !== 'environment') {\n    return ''\n  }\n  return props.context.isDefined\n    ? props.context.value\n    : translate('apiClient.pillTooltipHost.noValue')\n})\n\nconst targetRef = ref<HTMLElement>(props.target)\n\nuseTooltip({\n  content: isContextFn ? contextTooltipHtml : environmentTooltipText,\n  contentTarget: isContextFn ? 'innerHTML' : 'textContent',\n  delay: 0,\n  placement: 'bottom-start',\n  offset: 6,\n  targetRef,\n})\n</script>\n\n<!-- eslint-disable vue/valid-template-root -- Renderless: the tooltip attaches to the supplied target. -->\n<template>\n  <!-- Renderless: behaviour attaches to props.target via useTooltip -->\n</template>\n"],"mappings":""}

package/dist/v2/components/code-input/{PillTooltipHost.vue.script.js → PillTooltipHost.vue_vue_type_script_setup_true_lang.js}

@@ -56,4 +56,4 @@ var PillTooltipHost_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 //#endregion
 export { PillTooltipHost_vue_vue_type_script_setup_true_lang_default as default };
 
-//# sourceMappingURL=PillTooltipHost.vue.script.js.map
+//# sourceMappingURL=PillTooltipHost.vue_vue_type_script_setup_true_lang.js.map

package/dist/v2/components/code-input/PillTooltipHost.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PillTooltipHost.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../src/v2/components/code-input/PillTooltipHost.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * PillTooltipHost\n *\n * Renderless adapter that attaches a tooltip to an existing DOM element.\n * Both the legacy CodeMirror widget pipeline and the new `CodeInputLite`\n * overlay mount one of these per pill via `createApp` — they keep ownership\n * of the pill DOM (text, classes, styles) and we only attach hover/focus\n * behaviour through `useTooltip`.\n *\n * The component renders nothing of its own; pass the pill element via the\n * `target` prop and `useTooltip` will wire mouseenter/mouseleave/focus/blur\n * listeners onto it directly.\n */\nimport { useTooltip } from '@scalar/components/tooltip'\nimport type { TranslateFn } from '@scalar/localization'\nimport { computed, h, ref, render } from 'vue'\n\nimport {\n  useLocalization,\n  type ApiClientTranslationKey,\n} from '@/v2/features/localization'\n\nimport type { PillContext } from './pill-context'\n\nconst props = defineProps<{\n  /** Tooltip data — environment value or context-function description */\n  context: PillContext\n  /** The pill element to attach the tooltip to */\n  target: HTMLElement\n  /** Carry the owning editor's locale into this separately mounted Vue app. */\n  translate?: TranslateFn<ApiClientTranslationKey>\n}>()\n\nconst { translate: fallbackTranslate } = useLocalization()\n\ndefineOptions({ name: 'PillTooltipHost' })\n\nconst translate = props.translate ?? fallbackTranslate\n\nconst isContextFn = props.context.type === 'contextFunction'\n\n/** Two-line HTML body for context-function tooltips. */\nconst contextTooltipHtml = computed(() => {\n  if (\n    !isContextFn ||\n    typeof document === 'undefined' ||\n    props.context.type !== 'contextFunction'\n  ) {\n    return ''\n  }\n  const el = document.createElement('div')\n  render(\n    h('div', { class: 'flex flex-col gap-1.5 text-left' }, [\n      h('span', {}, props.context.details),\n      h(\n        'div',\n        { class: 'text-[color:var(--scalar-color-3)] text-[10px] font-normal' },\n        translate('apiClient.pillTooltipHost.computedAtExecution'),\n      ),\n    ]),\n    el,\n  )\n  return el.innerHTML\n})\n\nconst environmentTooltipText = computed(() => {\n  if (props.context.type !== 'environment') {\n    return ''\n  }\n  return props.context.isDefined\n    ? props.context.value\n    : translate('apiClient.pillTooltipHost.noValue')\n})\n\nconst targetRef = ref<HTMLElement>(props.target)\n\nuseTooltip({\n  content: isContextFn ? contextTooltipHtml : environmentTooltipText,\n  contentTarget: isContextFn ? 'innerHTML' : 'textContent',\n  delay: 0,\n  placement: 'bottom-start',\n  offset: 6,\n  targetRef,\n})\n</script>\n\n<!-- eslint-disable vue/valid-template-root -- Renderless: the tooltip attaches to the supplied target. -->\n<template>\n  <!-- Renderless: behaviour attaches to props.target via useTooltip -->\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;EAyBA,MAAM,QAAQ;EASd,MAAM,EAAE,WAAW,sBAAsB,gBAAgB;EAIzD,MAAM,YAAY,MAAM,aAAa;EAErC,MAAM,cAAc,MAAM,QAAQ,SAAS;;EAG3C,MAAM,qBAAqB,eAAe;GACxC,IACE,CAAC,eACD,OAAO,aAAa,eACpB,MAAM,QAAQ,SAAS,mBAEvB,OAAO;GAET,MAAM,KAAK,SAAS,cAAc,KAAK;GACvC,OACE,EAAE,OAAO,EAAE,OAAO,kCAAkC,GAAG,CACrD,EAAE,QAAQ,CAAC,GAAG,MAAM,QAAQ,OAAO,GACnC,EACE,OACA,EAAE,OAAO,6DAA6D,GACtE,UAAU,+CAA+C,CAC3D,CACF,CAAC,GACD,EACF;GACA,OAAO,GAAG;EACZ,CAAC;EAED,MAAM,yBAAyB,eAAe;GAC5C,IAAI,MAAM,QAAQ,SAAS,eACzB,OAAO;GAET,OAAO,MAAM,QAAQ,YACjB,MAAM,QAAQ,QACd,UAAU,mCAAmC;EACnD,CAAC;EAED,MAAM,YAAY,IAAiB,MAAM,MAAM;EAE/C,WAAW;GACT,SAAS,cAAc,qBAAqB;GAC5C,eAAe,cAAc,cAAc;GAC3C,OAAO;GACP,WAAW;GACX,QAAQ;GACR;EACF,CAAC"}

package/dist/v2/components/code-input/code-variable-widget.d.ts

@@ -1,7 +1,7 @@
 import type { TranslateFn } from '@scalar/localization';
 import { type DecorationSet, EditorView, ViewPlugin, type ViewUpdate } from '@scalar/use-codemirror';
 import type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments';
-import type { ApiClientTranslationKey } from '../../../v2/features/localization/index.js';
+import type { ApiClientTranslationKey } from '../../features/localization/index.js';
 /**
  * Styles the active environment variable pill.
  * This plugin creates decorations for environment variables in the editor.
@@ -16,7 +16,7 @@ export declare const pillPlugin: (props: {
     lastEnvironment: XScalarEnvironment | undefined;
     update(update: ViewUpdate): void;
     buildDecorations(view: EditorView): DecorationSet;
-}>;
+}, undefined>;
 /**
  * Custom backspace handler for the editor.
  * Handles special cases like removing entire variable syntax and clearing all content.

package/dist/v2/components/code-input/code-variable-widget.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"code-variable-widget.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/code-input/code-variable-widget.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAA;AACvD,OAAO,EAEL,KAAK,aAAa,EAClB,UAAU,EAEV,UAAU,EACV,KAAK,UAAU,EAEhB,MAAM,wBAAwB,CAAA;AAE/B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AAGnH,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,4BAA4B,CAAA;AAwGzE;;;GAGG;AACH,eAAO,MAAM,UAAU,GAAI,OAAO;IAChC,WAAW,EAAE,kBAAkB,GAAG,SAAS,CAAA;IAC3C,UAAU,EAAE,OAAO,GAAG,SAAS,CAAA;IAC/B,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAA;IACjD,SAAS,CAAC,EAAE,WAAW,CAAC,uBAAuB,CAAC,CAAA;CACjD;iBAGkB,aAAa;qBACT,kBAAkB,GAAG,SAAS;mBAOhC,UAAU,GAAG,IAAI;2BAcT,UAAU,GAAG,aAAa;EAyCpD,CAAA;AAEH;;;GAGG;AACH,eAAO,MAAM,gBAAgB,uCAoC3B,CAAA"}
+{"version":3,"file":"code-variable-widget.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/code-input/code-variable-widget.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAA;AACvD,OAAO,EAEL,KAAK,aAAa,EAClB,UAAU,EAEV,UAAU,EACV,KAAK,UAAU,EAEhB,MAAM,wBAAwB,CAAA;AAE/B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,2EAA2E,CAAA;AAGnH,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,4BAA4B,CAAA;AAwGzE;;;GAGG;AACH,eAAO,MAAM,UAAU,GAAI,OAAO;IAChC,WAAW,EAAE,kBAAkB,GAAG,SAAS,CAAA;IAC3C,UAAU,EAAE,OAAO,GAAG,SAAS,CAAA;IAC/B,qBAAqB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,OAAO,CAAA;IACjD,SAAS,CAAC,EAAE,WAAW,CAAC,uBAAuB,CAAC,CAAA;CACjD;iBAGkB,aAAa;qBACT,kBAAkB,GAAG,SAAS;mBAOhC,UAAU,GAAG,IAAI;2BAcT,UAAU,GAAG,aAAa;aAyCpD,CAAA;AAEH;;;GAGG;AACH,eAAO,MAAM,gBAAgB,uCAoC3B,CAAA"}

package/dist/v2/components/code-input/code-variable-widget.js.map

@@ -1 +1 @@
-{"version":3,"file":"code-variable-widget.js","names":[],"sources":["../../../../src/v2/components/code-input/code-variable-widget.ts"],"sourcesContent":["import { REGEX } from '@scalar/helpers/regex/regex-helpers'\nimport type { TranslateFn } from '@scalar/localization'\nimport {\n  Decoration,\n  type DecorationSet,\n  EditorView,\n  RangeSetBuilder,\n  ViewPlugin,\n  type ViewUpdate,\n  WidgetType,\n} from '@scalar/use-codemirror'\nimport { type ContextFunctionName, getContextFunctionComment } from '@scalar/workspace-store/request-example'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { createApp } from 'vue'\n\nimport type { ApiClientTranslationKey } from '@/v2/features/localization'\n\nimport PillTooltipHost from './PillTooltipHost.vue'\nimport type { PillContext } from './pill-context'\n\n/**\n * Displays `{{name}}` as a pill: environment variables show the resolved value;\n * context functions (e.g. `{{$guid}}`) show that the value is generated at send time.\n */\nclass PillWidget extends WidgetType {\n  private app: any\n  private readonly pillColor: string\n  private readonly variableInfo: PillContext\n\n  constructor(\n    private readonly variableName: string,\n    environment: XScalarEnvironment | undefined,\n    variant: PillContext['type'],\n    private readonly translate?: TranslateFn<ApiClientTranslationKey>,\n  ) {\n    super()\n    if (variant === 'contextFunction') {\n      this.pillColor = 'var(--scalar-color-3)'\n      this.variableInfo = {\n        type: 'contextFunction',\n        identifier: variableName,\n        details: getContextFunctionComment(variableName as ContextFunctionName),\n      }\n      return\n    }\n\n    this.pillColor = environment?.color || 'var(--scalar-color-1)'\n\n    const variable = environment?.variables?.find((v) => v.name === variableName)\n    const value = typeof variable?.value === 'string' ? variable.value : variable?.value?.default\n    this.variableInfo = {\n      type: 'environment',\n      name: variableName,\n      value: value || 'No value',\n      isDefined: Boolean(value),\n    }\n  }\n\n  toDOM(): HTMLElement {\n    const span = document.createElement('span')\n    span.className = this.variableInfo.type === 'contextFunction' ? 'cm-pill cm-pill--context-fn' : 'cm-pill'\n    span.textContent = this.variableName\n\n    span.style.setProperty('--tw-bg-base', this.pillColor)\n\n    if (this.variableInfo.type === 'environment') {\n      span.style.opacity = this.variableInfo.isDefined ? '1' : '0.5'\n    }\n\n    // PillTooltipHost is renderless and attaches `useTooltip` listeners to\n    // `target` directly — mount onto a throwaway container so the pill DOM\n    // we just built is preserved.\n    this.app = createApp(PillTooltipHost, {\n      context: this.variableInfo,\n      target: span,\n      translate: this.translate,\n    })\n    this.app.mount(document.createElement('div'))\n\n    return span\n  }\n\n  override destroy(): void {\n    if (this.app) {\n      this.app.unmount()\n      this.app = null\n    }\n  }\n\n  override eq(other: WidgetType): boolean {\n    if (!(other instanceof PillWidget)) {\n      return false\n    }\n    if (\n      other.variableName !== this.variableName ||\n      other.pillColor !== this.pillColor ||\n      other.variableInfo.type !== this.variableInfo.type\n    ) {\n      return false\n    }\n    const a = other.variableInfo\n    const b = this.variableInfo\n    if (a.type !== b.type) {\n      return false\n    }\n    if (a.type === 'environment' && b.type === 'environment') {\n      return a.name === b.name && a.value === b.value && a.isDefined === b.isDefined\n    }\n    if (a.type === 'contextFunction' && b.type === 'contextFunction') {\n      return a.identifier === b.identifier && a.details === b.details\n    }\n    return false\n  }\n\n  override ignoreEvent(): boolean {\n    return false\n  }\n}\n\n/**\n * Styles the active environment variable pill.\n * This plugin creates decorations for environment variables in the editor.\n */\nexport const pillPlugin = (props: {\n  environment: XScalarEnvironment | undefined\n  isReadOnly: boolean | undefined\n  isContextFunctionName?: (name: string) => boolean\n  translate?: TranslateFn<ApiClientTranslationKey>\n}) =>\n  ViewPlugin.fromClass(\n    class {\n      decorations: DecorationSet\n      lastEnvironment: XScalarEnvironment | undefined\n\n      constructor(view: EditorView) {\n        this.lastEnvironment = props.environment\n        this.decorations = this.buildDecorations(view)\n      }\n\n      update(update: ViewUpdate): void {\n        // Rebuild decorations if environment changed\n        if (props.environment !== this.lastEnvironment) {\n          this.lastEnvironment = props.environment\n          this.decorations = this.buildDecorations(update.view)\n          return\n        }\n\n        // Only rebuild decorations if document or viewport changed\n        if (update.docChanged || update.viewportChanged) {\n          this.decorations = this.buildDecorations(update.view)\n        }\n      }\n\n      buildDecorations(view: EditorView): DecorationSet {\n        const builder = new RangeSetBuilder<Decoration>()\n        const isContextFn = props.isContextFunctionName ?? (() => false)\n\n        for (const { from, to } of view.visibleRanges) {\n          const text = view.state.doc.sliceString(from, to)\n\n          // Create a new regex instance to ensure lastIndex is reset\n          const regex = new RegExp(REGEX.VARIABLES.source, REGEX.VARIABLES.flags)\n          let match: RegExpExecArray | null\n\n          while ((match = regex.exec(text)) !== null) {\n            const start = from + match.index\n            const end = start + match[0].length\n            const variableName = match[1] ?? ''\n\n            // Skip decorations that span line breaks as CodeMirror does not allow them\n            const matchedText = view.state.doc.sliceString(start, end)\n            if (matchedText.includes('\\n')) {\n              continue\n            }\n\n            const variant: PillContext['type'] = isContextFn(variableName) ? 'contextFunction' : 'environment'\n\n            builder.add(\n              start,\n              end,\n              Decoration.widget({\n                widget: new PillWidget(variableName, props.environment, variant, props.translate),\n                side: 1,\n              }),\n            )\n          }\n        }\n\n        return builder.finish()\n      }\n    },\n    {\n      decorations: (v) => v.decorations,\n    },\n  )\n\n/**\n * Custom backspace handler for the editor.\n * Handles special cases like removing entire variable syntax and clearing all content.\n */\nexport const backspaceCommand = EditorView.domEventHandlers({\n  keydown(event, view): boolean {\n    if (event.key !== 'Backspace') {\n      return false\n    }\n\n    const { state } = view\n    const { from, to } = state.selection.main\n\n    // When selecting all content and pressing backspace,\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    // When cursor is after a variable closing bracket (}}),\n    // remove the entire closing syntax at once\n    if (from === to && from >= 2) {\n      const before = state.doc.sliceString(from - 2, from)\n      if (before === '}}') {\n        view.dispatch({\n          changes: { from: from - 2, to: from },\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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"}
+{"version":3,"file":"code-variable-widget.js","names":["PillTooltipHost"],"sources":["../../../../src/v2/components/code-input/code-variable-widget.ts"],"sourcesContent":["import { REGEX } from '@scalar/helpers/regex/regex-helpers'\nimport type { TranslateFn } from '@scalar/localization'\nimport {\n  Decoration,\n  type DecorationSet,\n  EditorView,\n  RangeSetBuilder,\n  ViewPlugin,\n  type ViewUpdate,\n  WidgetType,\n} from '@scalar/use-codemirror'\nimport { type ContextFunctionName, getContextFunctionComment } from '@scalar/workspace-store/request-example'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { createApp } from 'vue'\n\nimport type { ApiClientTranslationKey } from '@/v2/features/localization'\n\nimport PillTooltipHost from './PillTooltipHost.vue'\nimport type { PillContext } from './pill-context'\n\n/**\n * Displays `{{name}}` as a pill: environment variables show the resolved value;\n * context functions (e.g. `{{$guid}}`) show that the value is generated at send time.\n */\nclass PillWidget extends WidgetType {\n  private app: any\n  private readonly pillColor: string\n  private readonly variableInfo: PillContext\n\n  constructor(\n    private readonly variableName: string,\n    environment: XScalarEnvironment | undefined,\n    variant: PillContext['type'],\n    private readonly translate?: TranslateFn<ApiClientTranslationKey>,\n  ) {\n    super()\n    if (variant === 'contextFunction') {\n      this.pillColor = 'var(--scalar-color-3)'\n      this.variableInfo = {\n        type: 'contextFunction',\n        identifier: variableName,\n        details: getContextFunctionComment(variableName as ContextFunctionName),\n      }\n      return\n    }\n\n    this.pillColor = environment?.color || 'var(--scalar-color-1)'\n\n    const variable = environment?.variables?.find((v) => v.name === variableName)\n    const value = typeof variable?.value === 'string' ? variable.value : variable?.value?.default\n    this.variableInfo = {\n      type: 'environment',\n      name: variableName,\n      value: value || 'No value',\n      isDefined: Boolean(value),\n    }\n  }\n\n  toDOM(): HTMLElement {\n    const span = document.createElement('span')\n    span.className = this.variableInfo.type === 'contextFunction' ? 'cm-pill cm-pill--context-fn' : 'cm-pill'\n    span.textContent = this.variableName\n\n    span.style.setProperty('--tw-bg-base', this.pillColor)\n\n    if (this.variableInfo.type === 'environment') {\n      span.style.opacity = this.variableInfo.isDefined ? '1' : '0.5'\n    }\n\n    // PillTooltipHost is renderless and attaches `useTooltip` listeners to\n    // `target` directly — mount onto a throwaway container so the pill DOM\n    // we just built is preserved.\n    this.app = createApp(PillTooltipHost, {\n      context: this.variableInfo,\n      target: span,\n      translate: this.translate,\n    })\n    this.app.mount(document.createElement('div'))\n\n    return span\n  }\n\n  override destroy(): void {\n    if (this.app) {\n      this.app.unmount()\n      this.app = null\n    }\n  }\n\n  override eq(other: WidgetType): boolean {\n    if (!(other instanceof PillWidget)) {\n      return false\n    }\n    if (\n      other.variableName !== this.variableName ||\n      other.pillColor !== this.pillColor ||\n      other.variableInfo.type !== this.variableInfo.type\n    ) {\n      return false\n    }\n    const a = other.variableInfo\n    const b = this.variableInfo\n    if (a.type !== b.type) {\n      return false\n    }\n    if (a.type === 'environment' && b.type === 'environment') {\n      return a.name === b.name && a.value === b.value && a.isDefined === b.isDefined\n    }\n    if (a.type === 'contextFunction' && b.type === 'contextFunction') {\n      return a.identifier === b.identifier && a.details === b.details\n    }\n    return false\n  }\n\n  override ignoreEvent(): boolean {\n    return false\n  }\n}\n\n/**\n * Styles the active environment variable pill.\n * This plugin creates decorations for environment variables in the editor.\n */\nexport const pillPlugin = (props: {\n  environment: XScalarEnvironment | undefined\n  isReadOnly: boolean | undefined\n  isContextFunctionName?: (name: string) => boolean\n  translate?: TranslateFn<ApiClientTranslationKey>\n}) =>\n  ViewPlugin.fromClass(\n    class {\n      decorations: DecorationSet\n      lastEnvironment: XScalarEnvironment | undefined\n\n      constructor(view: EditorView) {\n        this.lastEnvironment = props.environment\n        this.decorations = this.buildDecorations(view)\n      }\n\n      update(update: ViewUpdate): void {\n        // Rebuild decorations if environment changed\n        if (props.environment !== this.lastEnvironment) {\n          this.lastEnvironment = props.environment\n          this.decorations = this.buildDecorations(update.view)\n          return\n        }\n\n        // Only rebuild decorations if document or viewport changed\n        if (update.docChanged || update.viewportChanged) {\n          this.decorations = this.buildDecorations(update.view)\n        }\n      }\n\n      buildDecorations(view: EditorView): DecorationSet {\n        const builder = new RangeSetBuilder<Decoration>()\n        const isContextFn = props.isContextFunctionName ?? (() => false)\n\n        for (const { from, to } of view.visibleRanges) {\n          const text = view.state.doc.sliceString(from, to)\n\n          // Create a new regex instance to ensure lastIndex is reset\n          const regex = new RegExp(REGEX.VARIABLES.source, REGEX.VARIABLES.flags)\n          let match: RegExpExecArray | null\n\n          while ((match = regex.exec(text)) !== null) {\n            const start = from + match.index\n            const end = start + match[0].length\n            const variableName = match[1] ?? ''\n\n            // Skip decorations that span line breaks as CodeMirror does not allow them\n            const matchedText = view.state.doc.sliceString(start, end)\n            if (matchedText.includes('\\n')) {\n              continue\n            }\n\n            const variant: PillContext['type'] = isContextFn(variableName) ? 'contextFunction' : 'environment'\n\n            builder.add(\n              start,\n              end,\n              Decoration.widget({\n                widget: new PillWidget(variableName, props.environment, variant, props.translate),\n                side: 1,\n              }),\n            )\n          }\n        }\n\n        return builder.finish()\n      }\n    },\n    {\n      decorations: (v) => v.decorations,\n    },\n  )\n\n/**\n * Custom backspace handler for the editor.\n * Handles special cases like removing entire variable syntax and clearing all content.\n */\nexport const backspaceCommand = EditorView.domEventHandlers({\n  keydown(event, view): boolean {\n    if (event.key !== 'Backspace') {\n      return false\n    }\n\n    const { state } = view\n    const { from, to } = state.selection.main\n\n    // When selecting all content and pressing backspace,\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    // When cursor is after a variable closing bracket (}}),\n    // remove the entire closing syntax at once\n    if (from === to && from >= 2) {\n      const before = state.doc.sliceString(from - 2, from)\n      if (before === '}}') {\n        view.dispatch({\n          changes: { from: from - 2, to: from },\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/v2/components/context-menu/ContextMenu.vue.js

@@ -1,5 +1,5 @@
-import ContextMenu_vue_vue_type_script_setup_true_lang_default from "./ContextMenu.vue.script.js";
-/* empty css                          */
+import ContextMenu_vue_vue_type_script_setup_true_lang_default from "./ContextMenu.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                */
 //#region src/v2/components/context-menu/ContextMenu.vue
 var ContextMenu_default = ContextMenu_vue_vue_type_script_setup_true_lang_default;
 //#endregion

package/dist/v2/components/context-menu/ContextMenu.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.vue.js","names":[],"sources":["../../../../src/v2/components/context-menu/ContextMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ContextMenuContent,\n  ContextMenuItem,\n  ContextMenuPortal,\n  ContextMenuRoot,\n  ContextMenuTrigger,\n} from 'radix-vue'\n\nconst props = withDefaults(\n  defineProps<{\n    align?: 'start' | 'center' | 'end'\n    side?: 'top' | 'right' | 'bottom' | 'left'\n    sideOffset?: number\n    disabled?: boolean\n    triggerClass?: string\n  }>(),\n  {\n    side: 'bottom',\n    align: 'center',\n    disabled: false,\n  },\n)\n</script>\n\n<template>\n  <ContextMenuRoot>\n    <ContextMenuTrigger\n      :class=\"triggerClass\"\n      :disabled=\"props.disabled\">\n      <slot name=\"trigger\" />\n    </ContextMenuTrigger>\n    <ContextMenuPortal>\n      <ContextMenuContent\n        :align=\"props.align\"\n        class=\"scalar-api-client-context-menu\"\n        :side=\"props.side\"\n        :sideOffset=\"props.sideOffset\">\n        <ContextMenuItem>\n          <slot name=\"content\" />\n        </ContextMenuItem>\n      </ContextMenuContent>\n    </ContextMenuPortal>\n  </ContextMenuRoot>\n</template>\n\n<style>\n@reference \"@/style.css\";\n\n/**\n * The content wrapper (data-radix-popper-content-wrapper) creates\n * a new stacking context, so we need to override the z-index there.\n * We need to target our own context menu class to keep the styles from\n * leaking out and affecting other Radix UI components.\n */\n[data-radix-popper-content-wrapper]:has(.scalar-api-client-context-menu) {\n  /**\n   * We have to use important because Radix UI sets the z-index in a style\n   * attribute on the content wrapper.\n   */\n  @apply z-context!;\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"ContextMenu.vue.js","names":["_sfc_main"],"sources":["../../../../src/v2/components/context-menu/ContextMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ContextMenuContent,\n  ContextMenuItem,\n  ContextMenuPortal,\n  ContextMenuRoot,\n  ContextMenuTrigger,\n} from 'radix-vue'\n\nconst props = withDefaults(\n  defineProps<{\n    align?: 'start' | 'center' | 'end'\n    side?: 'top' | 'right' | 'bottom' | 'left'\n    sideOffset?: number\n    disabled?: boolean\n    triggerClass?: string\n  }>(),\n  {\n    side: 'bottom',\n    align: 'center',\n    disabled: false,\n  },\n)\n</script>\n\n<template>\n  <ContextMenuRoot>\n    <ContextMenuTrigger\n      :class=\"triggerClass\"\n      :disabled=\"props.disabled\">\n      <slot name=\"trigger\" />\n    </ContextMenuTrigger>\n    <ContextMenuPortal>\n      <ContextMenuContent\n        :align=\"props.align\"\n        class=\"scalar-api-client-context-menu\"\n        :side=\"props.side\"\n        :sideOffset=\"props.sideOffset\">\n        <ContextMenuItem>\n          <slot name=\"content\" />\n        </ContextMenuItem>\n      </ContextMenuContent>\n    </ContextMenuPortal>\n  </ContextMenuRoot>\n</template>\n\n<style>\n@reference \"@/style.css\";\n\n/**\n * The content wrapper (data-radix-popper-content-wrapper) creates\n * a new stacking context, so we need to override the z-index there.\n * We need to target our own context menu class to keep the styles from\n * leaking out and affecting other Radix UI components.\n */\n[data-radix-popper-content-wrapper]:has(.scalar-api-client-context-menu) {\n  /**\n   * We have to use important because Radix UI sets the z-index in a style\n   * attribute on the content wrapper.\n   */\n  @apply z-context!;\n}\n</style>\n"],"mappings":""}

package/dist/v2/components/context-menu/{ContextMenu.vue.script.js → ContextMenu.vue_vue_type_script_setup_true_lang.js}

@@ -50,4 +50,4 @@ var ContextMenu_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 //#endregion
 export { ContextMenu_vue_vue_type_script_setup_true_lang_default as default };
 
-//# sourceMappingURL=ContextMenu.vue.script.js.map
+//# sourceMappingURL=ContextMenu.vue_vue_type_script_setup_true_lang.js.map

package/dist/v2/components/context-menu/ContextMenu.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContextMenu.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_unref","_withCtx","_createVNode","_normalizeClass","_renderSlot"],"sources":["../../../../src/v2/components/context-menu/ContextMenu.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  ContextMenuContent,\n  ContextMenuItem,\n  ContextMenuPortal,\n  ContextMenuRoot,\n  ContextMenuTrigger,\n} from 'radix-vue'\n\nconst props = withDefaults(\n  defineProps<{\n    align?: 'start' | 'center' | 'end'\n    side?: 'top' | 'right' | 'bottom' | 'left'\n    sideOffset?: number\n    disabled?: boolean\n    triggerClass?: string\n  }>(),\n  {\n    side: 'bottom',\n    align: 'center',\n    disabled: false,\n  },\n)\n</script>\n\n<template>\n  <ContextMenuRoot>\n    <ContextMenuTrigger\n      :class=\"triggerClass\"\n      :disabled=\"props.disabled\">\n      <slot name=\"trigger\" />\n    </ContextMenuTrigger>\n    <ContextMenuPortal>\n      <ContextMenuContent\n        :align=\"props.align\"\n        class=\"scalar-api-client-context-menu\"\n        :side=\"props.side\"\n        :sideOffset=\"props.sideOffset\">\n        <ContextMenuItem>\n          <slot name=\"content\" />\n        </ContextMenuItem>\n      </ContextMenuContent>\n    </ContextMenuPortal>\n  </ContextMenuRoot>\n</template>\n\n<style>\n@reference \"@/style.css\";\n\n/**\n * The content wrapper (data-radix-popper-content-wrapper) creates\n * a new stacking context, so we need to override the z-index there.\n * We need to target our own context menu class to keep the styles from\n * leaking out and affecting other Radix UI components.\n */\n[data-radix-popper-content-wrapper]:has(.scalar-api-client-context-menu) {\n  /**\n   * We have to use important because Radix UI sets the z-index in a style\n   * attribute on the content wrapper.\n   */\n  @apply z-context!;\n}\n</style>\n"],"mappings":";;;;;;;;;;;;;;;;EASA,MAAM,QAAQ;;GAiBZ,OAAAA,UAAA,GAAAC,YAiBkBC,MAAA,eAAA,GAAA,MAAA;IAhBhB,SAAAC,cAIqB,CAJrBC,YAIqBF,MAAA,kBAAA,GAAA;KAHlB,OAAKG,eAAE,QAAA,YAAY;KACnB,UAAU,MAAM;;KACjB,SAAAF,cAAuB,CAAvBG,WAAuB,KAAA,QAAA,SAAA,C;;I,8BAEzBF,YAUoBF,MAAA,iBAAA,GAAA,MAAA;KATlB,SAAAC,cAQqB,CARrBC,YAQqBF,MAAA,kBAAA,GAAA;MAPlB,OAAO,MAAM;MACd,OAAM;MACL,MAAM,MAAM;MACZ,YAAY,MAAM;;MACnB,SAAAC,cAEkB,CAFlBC,YAEkBF,MAAA,eAAA,GAAA,MAAA;OADhB,SAAAC,cAAuB,CAAvBG,WAAuB,KAAA,QAAA,SAAA,C"}

package/dist/v2/components/context-menu/index.js

@@ -1,2 +1 @@
-import ContextMenu_default from "./ContextMenu.vue.js";
-export { ContextMenu_default as ContextMenu };
+export { default as ContextMenu } from "./ContextMenu.vue.js";

package/dist/v2/components/data-table/DataTable.vue.js

@@ -1,4 +1,4 @@
-import DataTable_vue_vue_type_script_setup_true_lang_default from "./DataTable.vue.script.js";
+import DataTable_vue_vue_type_script_setup_true_lang_default from "./DataTable.vue_vue_type_script_setup_true_lang.js";
 //#region src/v2/components/data-table/DataTable.vue
 var DataTable_default = DataTable_vue_vue_type_script_setup_true_lang_default;
 //#endregion

package/dist/v2/components/data-table/DataTable.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTable.vue.js","names":[],"sources":["../../../../src/v2/components/data-table/DataTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\ndefineProps<{\n  columns: (string | undefined)[]\n  /** Scroll horizontally */\n  scroll?: boolean\n  /** Presentational table */\n  presentational?: boolean\n}>()\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    v-bind=\"\n      cx(\n        scroll ? 'overflow-x-auto custom-scroll' : 'overflow-visible',\n        'scalar-data-table',\n      )\n    \">\n    <table\n      class=\"mb-0 grid min-h-8 auto-rows-auto\"\n      :class=\"{ 'w-max min-w-full': scroll }\"\n      :role=\"presentational ? 'presentation' : 'table'\"\n      :style=\"{\n        gridTemplateColumns: columns.map((col) => col || '1fr').join(' '),\n      }\">\n      <caption\n        v-if=\"$slots.caption\"\n        class=\"sr-only\">\n        <slot name=\"caption\" />\n      </caption>\n      <!--\n        The HTML parser inserts a `tbody` around rows that sit directly under a `table`, so the\n        rows are wrapped in one here to keep server-rendered markup hydratable. `contents` keeps\n        it out of the table's grid, the same way the rows lay themselves out.\n      -->\n      <tbody class=\"contents\">\n        <slot />\n      </tbody>\n    </table>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"DataTable.vue.js","names":["_sfc_main"],"sources":["../../../../src/v2/components/data-table/DataTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\ndefineProps<{\n  columns: (string | undefined)[]\n  /** Scroll horizontally */\n  scroll?: boolean\n  /** Presentational table */\n  presentational?: boolean\n}>()\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    v-bind=\"\n      cx(\n        scroll ? 'overflow-x-auto custom-scroll' : 'overflow-visible',\n        'scalar-data-table',\n      )\n    \">\n    <table\n      class=\"mb-0 grid min-h-8 auto-rows-auto\"\n      :class=\"{ 'w-max min-w-full': scroll }\"\n      :role=\"presentational ? 'presentation' : 'table'\"\n      :style=\"{\n        gridTemplateColumns: columns.map((col) => col || '1fr').join(' '),\n      }\">\n      <caption\n        v-if=\"$slots.caption\"\n        class=\"sr-only\">\n        <slot name=\"caption\" />\n      </caption>\n      <!--\n        The HTML parser inserts a `tbody` around rows that sit directly under a `table`, so the\n        rows are wrapped in one here to keep server-rendered markup hydratable. `contents` keeps\n        it out of the table's grid, the same way the rows lay themselves out.\n      -->\n      <tbody class=\"contents\">\n        <slot />\n      </tbody>\n    </table>\n  </div>\n</template>\n"],"mappings":""}

package/dist/v2/components/data-table/{DataTable.vue.script.js → DataTable.vue_vue_type_script_setup_true_lang.js}

@@ -28,4 +28,4 @@ var DataTable_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ define
 //#endregion
 export { DataTable_vue_vue_type_script_setup_true_lang_default as default };
 
-//# sourceMappingURL=DataTable.vue.script.js.map
+//# sourceMappingURL=DataTable.vue_vue_type_script_setup_true_lang.js.map

package/dist/v2/components/data-table/DataTable.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.vue_vue_type_script_setup_true_lang.js","names":["$slots","_openBlock","_createElementBlock","_normalizeProps","_guardReactiveProps","_unref","_createElementVNode","_normalizeClass","_normalizeStyle","_renderSlot","_createCommentVNode"],"sources":["../../../../src/v2/components/data-table/DataTable.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\ndefineProps<{\n  columns: (string | undefined)[]\n  /** Scroll horizontally */\n  scroll?: boolean\n  /** Presentational table */\n  presentational?: boolean\n}>()\nconst { cx } = useBindCx()\n</script>\n<template>\n  <div\n    v-bind=\"\n      cx(\n        scroll ? 'overflow-x-auto custom-scroll' : 'overflow-visible',\n        'scalar-data-table',\n      )\n    \">\n    <table\n      class=\"mb-0 grid min-h-8 auto-rows-auto\"\n      :class=\"{ 'w-max min-w-full': scroll }\"\n      :role=\"presentational ? 'presentation' : 'table'\"\n      :style=\"{\n        gridTemplateColumns: columns.map((col) => col || '1fr').join(' '),\n      }\">\n      <caption\n        v-if=\"$slots.caption\"\n        class=\"sr-only\">\n        <slot name=\"caption\" />\n      </caption>\n      <!--\n        The HTML parser inserts a `tbody` around rows that sit directly under a `table`, so the\n        rows are wrapped in one here to keep server-rendered markup hydratable. `contents` keeps\n        it out of the table's grid, the same way the rows lay themselves out.\n      -->\n      <tbody class=\"contents\">\n        <slot />\n      </tbody>\n    </table>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;EAUA,MAAM,EAAE,OAAO,UAAU;;GAGvB,OAAAC,UAAA,GAAAC,mBA4BM,OAAAC,eAAAC,mBA3BWC,MAAA,EAAA,CAAE,CAAU,QAAA,SAAM,kCAAA,oB,yBAMjCC,mBAoBQ,SAAA;IAnBN,OAAKC,eAAA,CAAC,oCAAkC,EAAA,oBACV,QAAA,OAAM,CAAA,CAAA;IACnC,MAAM,QAAA,iBAAc,iBAAA;IACpB,OAAKC,eAAA,EAAiC,qBAAA,QAAA,QAAQ,KAAK,QAAQ,OAAG,KAAA,CAAA,CAAW,KAAI,GAAA,E;G,IAItER,KAAAA,OAAO,WADfC,UAAA,GAAAC,mBAIU,WAJV,YAIU,CADRO,WAAuB,KAAA,QAAA,SAAA,C,oCAOzBH,mBAEQ,SAFR,YAEQ,CADNG,WAAQ,KAAA,QAAA,SAAA,C"}

package/dist/v2/components/data-table/DataTableCell.vue.js

@@ -1,4 +1,4 @@
-import DataTableCell_vue_vue_type_script_setup_true_lang_default from "./DataTableCell.vue.script.js";
+import DataTableCell_vue_vue_type_script_setup_true_lang_default from "./DataTableCell.vue_vue_type_script_setup_true_lang.js";
 //#region src/v2/components/data-table/DataTableCell.vue
 var DataTableCell_default = DataTableCell_vue_vue_type_script_setup_true_lang_default;
 //#endregion

package/dist/v2/components/data-table/DataTableCell.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableCell.vue.js","names":[],"sources":["../../../../src/v2/components/data-table/DataTableCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport type { Component } from 'vue'\n\nwithDefaults(\n  defineProps<{\n    is?: string | Component\n  }>(),\n  { is: 'td' },\n)\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <component\n    :is=\"is\"\n    v-bind=\"\n      cx(\n        'box-content max-h-8 min-h-8 min-w-8 border-l-0 border-t border-b-0 border-r flex text-base/5 last:border-r-0 group-last:border-b-transparent p-0 m-0 relative',\n      )\n    \"\n    class=\"group-[.alert]:bg-b-alert group-[.error]:bg-b-danger\">\n    <slot />\n  </component>\n</template>\n"],"mappings":""}
+{"version":3,"file":"DataTableCell.vue.js","names":["_sfc_main"],"sources":["../../../../src/v2/components/data-table/DataTableCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport type { Component } from 'vue'\n\nwithDefaults(\n  defineProps<{\n    is?: string | Component\n  }>(),\n  { is: 'td' },\n)\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <component\n    :is=\"is\"\n    v-bind=\"\n      cx(\n        'box-content max-h-8 min-h-8 min-w-8 border-l-0 border-t border-b-0 border-r flex text-base/5 last:border-r-0 group-last:border-b-transparent p-0 m-0 relative',\n      )\n    \"\n    class=\"group-[.alert]:bg-b-alert group-[.error]:bg-b-danger\">\n    <slot />\n  </component>\n</template>\n"],"mappings":""}

package/dist/v2/components/data-table/{DataTableCell.vue.script.js → DataTableCell.vue_vue_type_script_setup_true_lang.js}

@@ -18,4 +18,4 @@ var DataTableCell_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 //#endregion
 export { DataTableCell_vue_vue_type_script_setup_true_lang_default as default };
 
-//# sourceMappingURL=DataTableCell.vue.script.js.map
+//# sourceMappingURL=DataTableCell.vue_vue_type_script_setup_true_lang.js.map

package/dist/v2/components/data-table/DataTableCell.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableCell.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","_resolveDynamicComponent","_mergeProps","_unref","_withCtx","_renderSlot"],"sources":["../../../../src/v2/components/data-table/DataTableCell.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\nimport type { Component } from 'vue'\n\nwithDefaults(\n  defineProps<{\n    is?: string | Component\n  }>(),\n  { is: 'td' },\n)\n\ndefineOptions({ inheritAttrs: false })\nconst { cx } = useBindCx()\n</script>\n<template>\n  <component\n    :is=\"is\"\n    v-bind=\"\n      cx(\n        'box-content max-h-8 min-h-8 min-w-8 border-l-0 border-t border-b-0 border-r flex text-base/5 last:border-r-0 group-last:border-b-transparent p-0 m-0 relative',\n      )\n    \"\n    class=\"group-[.alert]:bg-b-alert group-[.error]:bg-b-danger\">\n    <slot />\n  </component>\n</template>\n"],"mappings":";;;;;;;;EAYA,MAAM,EAAE,OAAO,UAAU;;GAGvB,OAAAA,UAAA,GAAAC,YASYC,wBARL,QAAA,EAAE,GADTC,WAEiBC,MAAA,EAAA,CAAE,C,kKAKjB,EAAA,OAAM,uDAAsD,CAAA,GAAA;IAC5D,SAAAC,cAAQ,CAARC,WAAQ,KAAA,QAAA,SAAA,C"}

package/dist/v2/components/data-table/DataTableCheckbox.vue.js

@@ -1,4 +1,4 @@
-import DataTableCheckbox_vue_vue_type_script_setup_true_lang_default from "./DataTableCheckbox.vue.script.js";
+import DataTableCheckbox_vue_vue_type_script_setup_true_lang_default from "./DataTableCheckbox.vue_vue_type_script_setup_true_lang.js";
 //#region src/v2/components/data-table/DataTableCheckbox.vue
 var DataTableCheckbox_default = DataTableCheckbox_vue_vue_type_script_setup_true_lang_default;
 //#endregion

package/dist/v2/components/data-table/DataTableCheckbox.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableCheckbox.vue.js","names":[],"sources":["../../../../src/v2/components/data-table/DataTableCheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarIcon } from '@scalar/components/icon'\nimport { cva } from '@scalar/use-hooks/useBindCx'\n\nimport { useLocalization } from '@/v2/features/localization'\n\nimport DataTableCell from './DataTableCell.vue'\n\nwithDefaults(\n  defineProps<{\n    modelValue: boolean\n    disabled?: boolean\n    align?: 'left' | 'center'\n    ariaLabel?: string\n  }>(),\n  {\n    align: 'center',\n  },\n)\n\ndefineEmits<{\n  (e: 'update:modelValue', v: boolean): void\n}>()\n\nconst { translate } = useLocalization()\n\nconst variants = cva({\n  base: 'w-8 h-8 flex items-center justify-center text-b-2 peer-checked:text-c-1 pointer-events-none absolute',\n  variants: {\n    align: {\n      left: 'left-0',\n      center: 'centered',\n    },\n  },\n})\n</script>\n<template>\n  <DataTableCell class=\"group/cell relative flex min-w-8\">\n    <input\n      :aria-label=\"ariaLabel ?? translate('apiClient.dataTableCheckbox.toggle')\"\n      :checked=\"modelValue\"\n      class=\"peer absolute inset-0 size-full cursor-pointer opacity-0 disabled:cursor-default\"\n      :disabled=\"Boolean(disabled)\"\n      type=\"checkbox\"\n      @change=\"(e: any) => $emit('update:modelValue', e.target.checked)\" />\n    <div :class=\"variants({ align })\">\n      <div\n        class=\"absolute m-auto size-3/4 rounded border-[1px] opacity-0\"\n        :class=\"\n          !disabled &&\n          'group-has-[:focus-visible]/cell:border-c-accent group-hover:opacity-100 group-has-[:focus-visible]/cell:opacity-100'\n        \" />\n      <ScalarIcon\n        icon=\"Checkmark\"\n        size=\"xs\"\n        thickness=\"2.5\" />\n    </div>\n  </DataTableCell>\n</template>\n"],"mappings":""}
+{"version":3,"file":"DataTableCheckbox.vue.js","names":["_sfc_main"],"sources":["../../../../src/v2/components/data-table/DataTableCheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarIcon } from '@scalar/components/icon'\nimport { cva } from '@scalar/use-hooks/useBindCx'\n\nimport { useLocalization } from '@/v2/features/localization'\n\nimport DataTableCell from './DataTableCell.vue'\n\nwithDefaults(\n  defineProps<{\n    modelValue: boolean\n    disabled?: boolean\n    align?: 'left' | 'center'\n    ariaLabel?: string\n  }>(),\n  {\n    align: 'center',\n  },\n)\n\ndefineEmits<{\n  (e: 'update:modelValue', v: boolean): void\n}>()\n\nconst { translate } = useLocalization()\n\nconst variants = cva({\n  base: 'w-8 h-8 flex items-center justify-center text-b-2 peer-checked:text-c-1 pointer-events-none absolute',\n  variants: {\n    align: {\n      left: 'left-0',\n      center: 'centered',\n    },\n  },\n})\n</script>\n<template>\n  <DataTableCell class=\"group/cell relative flex min-w-8\">\n    <input\n      :aria-label=\"ariaLabel ?? translate('apiClient.dataTableCheckbox.toggle')\"\n      :checked=\"modelValue\"\n      class=\"peer absolute inset-0 size-full cursor-pointer opacity-0 disabled:cursor-default\"\n      :disabled=\"Boolean(disabled)\"\n      type=\"checkbox\"\n      @change=\"(e: any) => $emit('update:modelValue', e.target.checked)\" />\n    <div :class=\"variants({ align })\">\n      <div\n        class=\"absolute m-auto size-3/4 rounded border-[1px] opacity-0\"\n        :class=\"\n          !disabled &&\n          'group-has-[:focus-visible]/cell:border-c-accent group-hover:opacity-100 group-has-[:focus-visible]/cell:opacity-100'\n        \" />\n      <ScalarIcon\n        icon=\"Checkmark\"\n        size=\"xs\"\n        thickness=\"2.5\" />\n    </div>\n  </DataTableCell>\n</template>\n"],"mappings":""}

package/dist/v2/components/data-table/{DataTableCheckbox.vue.script.js → DataTableCheckbox.vue_vue_type_script_setup_true_lang.js}

@@ -49,4 +49,4 @@ var DataTableCheckbox_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*
 //#endregion
 export { DataTableCheckbox_vue_vue_type_script_setup_true_lang_default as default };
 
-//# sourceMappingURL=DataTableCheckbox.vue.script.js.map
+//# sourceMappingURL=DataTableCheckbox.vue_vue_type_script_setup_true_lang.js.map

package/dist/v2/components/data-table/DataTableCheckbox.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableCheckbox.vue_vue_type_script_setup_true_lang.js","names":["$emit","_openBlock","_createBlock","DataTableCell","_withCtx","_createElementVNode","_unref","_normalizeClass","_createVNode"],"sources":["../../../../src/v2/components/data-table/DataTableCheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarIcon } from '@scalar/components/icon'\nimport { cva } from '@scalar/use-hooks/useBindCx'\n\nimport { useLocalization } from '@/v2/features/localization'\n\nimport DataTableCell from './DataTableCell.vue'\n\nwithDefaults(\n  defineProps<{\n    modelValue: boolean\n    disabled?: boolean\n    align?: 'left' | 'center'\n    ariaLabel?: string\n  }>(),\n  {\n    align: 'center',\n  },\n)\n\ndefineEmits<{\n  (e: 'update:modelValue', v: boolean): void\n}>()\n\nconst { translate } = useLocalization()\n\nconst variants = cva({\n  base: 'w-8 h-8 flex items-center justify-center text-b-2 peer-checked:text-c-1 pointer-events-none absolute',\n  variants: {\n    align: {\n      left: 'left-0',\n      center: 'centered',\n    },\n  },\n})\n</script>\n<template>\n  <DataTableCell class=\"group/cell relative flex min-w-8\">\n    <input\n      :aria-label=\"ariaLabel ?? translate('apiClient.dataTableCheckbox.toggle')\"\n      :checked=\"modelValue\"\n      class=\"peer absolute inset-0 size-full cursor-pointer opacity-0 disabled:cursor-default\"\n      :disabled=\"Boolean(disabled)\"\n      type=\"checkbox\"\n      @change=\"(e: any) => $emit('update:modelValue', e.target.checked)\" />\n    <div :class=\"variants({ align })\">\n      <div\n        class=\"absolute m-auto size-3/4 rounded border-[1px] opacity-0\"\n        :class=\"\n          !disabled &&\n          'group-has-[:focus-visible]/cell:border-c-accent group-hover:opacity-100 group-has-[:focus-visible]/cell:opacity-100'\n        \" />\n      <ScalarIcon\n        icon=\"Checkmark\"\n        size=\"xs\"\n        thickness=\"2.5\" />\n    </div>\n  </DataTableCell>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EAwBA,MAAM,EAAE,cAAc,gBAAgB;EAEtC,MAAM,WAAW,IAAI;GACnB,MAAM;GACN,UAAU,EACR,OAAO;IACL,MAAM;IACN,QAAQ;GACV,EACF;EACF,CAAC;;GAGC,OAAAC,UAAA,GAAAC,YAoBgBC,uBAAA,EApBD,OAAM,mCAAkC,GAAA;IACrD,SAAAC,cAMuE,CANvEC,mBAMuE,SAAA;KALpE,cAAY,QAAA,aAAaC,MAAA,SAAA,CAAS,CAAA,oCAAA;KAClC,SAAS,QAAA;KACV,OAAM;KACL,UAAU,QAAQ,QAAA,QAAQ;KAC3B,MAAK;KACJ,UAAM,OAAA,OAAA,OAAA,MAAG,MAAWN,KAAAA,MAAK,qBAAsB,EAAE,OAAO,OAAO;I,0BAClEK,mBAWM,OAAA,EAXA,OAAKE,eAAED,MAAA,QAAA,CAAQ,CAAA,EAAA,OAAG,QAAA,MAAK,CAAA,CAAA,E,IAC3BD,mBAKM,OAAA,EAJJ,OAAKE,eAAA,CAAC,2DACc,CAAA,QAAA,Y,qIAItBC,YAGoBF,MAAA,UAAA,GAAA;KAFlB,MAAK;KACL,MAAK;KACL,WAAU"}

package/dist/v2/components/data-table/DataTableHeader.vue.js

@@ -1,4 +1,4 @@
-import DataTableHeader_vue_vue_type_script_setup_true_lang_default from "./DataTableHeader.vue.script.js";
+import DataTableHeader_vue_vue_type_script_setup_true_lang_default from "./DataTableHeader.vue_vue_type_script_setup_true_lang.js";
 //#region src/v2/components/data-table/DataTableHeader.vue
 var DataTableHeader_default = DataTableHeader_vue_vue_type_script_setup_true_lang_default;
 //#endregion

package/dist/v2/components/data-table/DataTableHeader.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableHeader.vue.js","names":[],"sources":["../../../../src/v2/components/data-table/DataTableHeader.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport DataTableCell from './DataTableCell.vue'\n\nconst { cx } = useBindCx()\n</script>\n<template>\n  <DataTableCell\n    is=\"th\"\n    v-bind=\"cx('items-center font-medium px-2 min-w-0 -outline-offset-1')\">\n    <slot />\n  </DataTableCell>\n</template>\n"],"mappings":""}
+{"version":3,"file":"DataTableHeader.vue.js","names":["_sfc_main"],"sources":["../../../../src/v2/components/data-table/DataTableHeader.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport DataTableCell from './DataTableCell.vue'\n\nconst { cx } = useBindCx()\n</script>\n<template>\n  <DataTableCell\n    is=\"th\"\n    v-bind=\"cx('items-center font-medium px-2 min-w-0 -outline-offset-1')\">\n    <slot />\n  </DataTableCell>\n</template>\n"],"mappings":""}

package/dist/v2/components/data-table/{DataTableHeader.vue.script.js → DataTableHeader.vue_vue_type_script_setup_true_lang.js}

@@ -17,4 +17,4 @@ var DataTableHeader_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/
 //#endregion
 export { DataTableHeader_vue_vue_type_script_setup_true_lang_default as default };
 
-//# sourceMappingURL=DataTableHeader.vue.script.js.map
+//# sourceMappingURL=DataTableHeader.vue_vue_type_script_setup_true_lang.js.map

package/dist/v2/components/data-table/DataTableHeader.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableHeader.vue_vue_type_script_setup_true_lang.js","names":["_openBlock","_createBlock","DataTableCell","_mergeProps","_unref","_withCtx","_renderSlot"],"sources":["../../../../src/v2/components/data-table/DataTableHeader.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useBindCx } from '@scalar/use-hooks/useBindCx'\n\nimport DataTableCell from './DataTableCell.vue'\n\nconst { cx } = useBindCx()\n</script>\n<template>\n  <DataTableCell\n    is=\"th\"\n    v-bind=\"cx('items-center font-medium px-2 min-w-0 -outline-offset-1')\">\n    <slot />\n  </DataTableCell>\n</template>\n"],"mappings":";;;;;;;EAKA,MAAM,EAAE,OAAO,UAAU;;GAGvB,OAAAA,UAAA,GAAAC,YAIgBC,uBAJhBC,WAIgB,EAHd,IAAG,KAAI,GACCC,MAAA,EAAA,CAAE,CAAA,yDAAA,CAAA,GAAA;IACV,SAAAC,cAAQ,CAARC,WAAQ,KAAA,QAAA,SAAA,C"}

package/dist/v2/components/data-table/DataTableInput.vue.d.ts

@@ -1,5 +1,5 @@
 import type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments';
-import type { VueClassProp } from '../../../types/vue';
+import type { VueClassProp } from '../../../types/vue.js';
 type __VLS_Props = {
     id?: string;
     type?: string | undefined;

package/dist/v2/components/data-table/DataTableInput.vue.js

@@ -1,6 +1,6 @@
 import _plugin_vue_export_helper_default from "../../../_virtual/_plugin-vue_export-helper.js";
-import DataTableInput_vue_vue_type_script_setup_true_lang_default from "./DataTableInput.vue.script.js";
-/* empty css                             */
+import DataTableInput_vue_vue_type_script_setup_true_lang_default from "./DataTableInput.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                                   */
 //#region src/v2/components/data-table/DataTableInput.vue
 var DataTableInput_default = /*#__PURE__*/ _plugin_vue_export_helper_default(DataTableInput_vue_vue_type_script_setup_true_lang_default, [["__scopeId", "data-v-029a43f5"]]);
 //#endregion

package/dist/v2/components/data-table/DataTableInput.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataTableInput.vue.js","names":[],"sources":["../../../../src/v2/components/data-table/DataTableInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarIconButton } from '@scalar/components/icon-button'\nimport { ScalarIconEye, ScalarIconEyeSlash, ScalarIconX } from '@scalar/icons'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { computed, nextTick, ref, useTemplateRef, watch } from 'vue'\n\nimport type { VueClassProp } from '@/types/vue'\nimport { CodeInputLite } from '@/v2/components/code-input'\nimport { useLocalization } from '@/v2/features/localization'\n\nimport DataTableCell from './DataTableCell.vue'\nimport DataTableInputSelect from './DataTableInputSelect.vue'\n\nconst props = withDefaults(\n  defineProps<{\n    id?: string\n    type?: string | undefined\n    /** Class for the wrapping cell because attrs is bound to the input */\n    containerClass?: VueClassProp | undefined\n    required?: boolean\n    modelValue: string\n    /** Allows adding a custom value to the enum dropdown, defaults to true */\n    canAddCustomEnumValue?: boolean\n    readOnly?: boolean\n    enum?: string[]\n    environment: XScalarEnvironment\n    description?: string | undefined\n    /** Whether to show context function suggestions like $guid, $timestamp. Defaults to true */\n    withFakeData?: boolean\n  }>(),\n  {\n    canAddCustomEnumValue: true,\n    required: false,\n    readOnly: false,\n    withFakeData: true,\n  },\n)\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', v: string | number): void\n  (e: 'inputFocus'): void\n  (e: 'inputBlur'): void\n  (e: 'selectVariable', value: string): void\n}>()\n\nconst { translate } = useLocalization()\n\ndefineOptions({ inheritAttrs: false })\n\nconst mask = ref(true)\nconst interactingWithDropdown = ref(false)\nconst codeInput = useTemplateRef('codeInput')\nconst maskedInput = useTemplateRef('maskedInput')\n\n/**\n * Whether focus is inside the field. Tracked with focusin and focusout on the wrapper because the\n * revealed editor does not report its own focus, and swapping it out mid-typing would drop focus.\n */\nconst fieldFocused = ref(false)\n\n/** There is nothing to reveal in an empty field, so the toggle only shows once it has a value */\nconst showVisibilityToggle = computed(\n  () => props.type === 'password' && Boolean(props.modelValue),\n)\n\n// An emptied secret goes back to masked, so whatever is typed or pasted next stays hidden\nwatch(\n  () => props.modelValue,\n  (value) => {\n    if (!value && !fieldFocused.value) {\n      mask.value = true\n    }\n  },\n)\n\n/** A field emptied while typing in the revealed editor masks once focus leaves it */\nconst handleFieldFocusOut = (): void => {\n  fieldFocused.value = false\n\n  if (!props.modelValue) {\n    mask.value = true\n  }\n}\n\nconst handleBlur = () => !interactingWithDropdown.value && emit('inputBlur')\n\nconst inputType = computed(() =>\n  props.type === 'password' ? 'text' : (props.type ?? 'text'),\n)\n\n/** Focus whichever editor is showing, the masked input or the code input */\nconst focus = (): void => {\n  codeInput.value?.focus()\n  maskedInput.value?.focus()\n}\n\n// If not an enum nor read only, focus the code input or masked input\nconst handleLabelClick = () => {\n  if (!props.enum?.length && !props.readOnly) {\n    focus()\n  }\n}\n\n/**\n * The clear button disappears once the field is empty, so focus moves to the field instead of\n * falling back to the page. A cleared secret is masked again so the next one is not shown.\n */\nconst clearValue = async (): Promise<void> => {\n  mask.value = true\n  emit('update:modelValue', '')\n  await nextTick()\n  focus()\n}\n\ndefineExpose({ focus })\n</script>\n<template>\n  <DataTableCell\n    class=\"relative flex\"\n    :class=\"containerClass\">\n    <div\n      v-if=\"$slots.default\"\n      class=\"text-c-1 flex items-center pr-0 pl-3\"\n      @click=\"handleLabelClick\">\n      <slot />:\n    </div>\n    <div\n      class=\"relative flex min-w-0 flex-1\"\n      @focusin=\"fieldFocused = true\"\n      @focusout=\"handleFieldFocusOut\">\n      <template v-if=\"props.enum && props.enum.length\">\n        <DataTableInputSelect\n          :canAddCustomValue=\"props.canAddCustomEnumValue\"\n          :modelValue=\"props.modelValue\"\n          :value=\"props.enum\"\n          @update:modelValue=\"emit('update:modelValue', $event)\" />\n      </template>\n      <template v-else>\n        <input\n          v-if=\"mask && type === 'password'\"\n          v-bind=\"id ? { ...$attrs, id: id } : $attrs\"\n          ref=\"maskedInput\"\n          autocomplete=\"off\"\n          class=\"text-c-1 disabled:text-c-2 peer w-full min-w-0 border-none px-2 py-1.25 -outline-offset-1\"\n          :class=\"{ 'scalar-password-input': type === 'password' }\"\n          data-1p-ignore\n          :readOnly=\"readOnly\"\n          spellcheck=\"false\"\n          :type=\"inputType\"\n          :value=\"modelValue\"\n          @input=\"\n            emit(\n              'update:modelValue',\n              ($event.target as HTMLInputElement).value ?? '',\n            )\n          \" />\n        <CodeInputLite\n          v-else\n          v-bind=\"$attrs\"\n          :id=\"id\"\n          ref=\"codeInput\"\n          class=\"text-c-1 disabled:text-c-2 peer w-full min-w-0 border-none -outline-offset-1\"\n          :class=\"[\n            type === 'password' && description && 'pr-12',\n            description && 'pr-8',\n            type === 'password' && 'scalar-password-input',\n          ]\"\n          :environment=\"environment\"\n          :modelValue=\"modelValue ?? ''\"\n          :readOnly=\"readOnly\"\n          :required=\"Boolean(required)\"\n          :type=\"inputType\"\n          :withFakeData=\"withFakeData\"\n          @blur=\"handleBlur\"\n          @focus=\"emit('inputFocus')\"\n          @update:modelValue=\"(value) => emit('update:modelValue', value)\" />\n      </template>\n    </div>\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    <slot name=\"icon\" />\n    <!-- Clear -->\n    <ScalarIconButton\n      v-if=\"modelValue && !readOnly\"\n      class=\"-ml-.25 h-6 w-6 self-center p-1.25\"\n      :icon=\"ScalarIconX\"\n      :label=\"translate('apiClient.dataTableInput.clearValue')\"\n      @click=\"clearValue\" />\n    <!-- Toggle Visibility -->\n    <!-- A toggle button keeps one name and reports its state, so the label\n         stays \"Show Password\" while `aria-pressed` says whether the value is\n         revealed. Flipping the name instead leaves screen readers silent,\n         because activating a button does not re-announce its name. -->\n    <ScalarIconButton\n      v-if=\"showVisibilityToggle\"\n      :aria-pressed=\"!mask\"\n      class=\"-ml-.5 mr-1.25 h-6 w-6 self-center p-1.25\"\n      data-testid=\"data-table-password-toggle\"\n      :icon=\"mask ? ScalarIconEye : ScalarIconEyeSlash\"\n      :label=\"translate('apiClient.dataTableInput.showPassword')\"\n      @click=\"mask = !mask\" />\n  </DataTableCell>\n</template>\n\n<style scoped>\n:deep(.code-input-lite__editor) {\n  background-color: transparent;\n  font-family: var(--scalar-font);\n  font-size: var(--scalar-small);\n  padding: 5px 8px;\n}\n:deep(.scalar-pill:not(:last-of-type)) {\n  margin-right: 0.15em;\n}\n:deep(.scalar-pill:not(:first-of-type)) {\n  margin-left: 0.5px;\n}\n/* Tailwind placeholder is busted */\ninput::placeholder {\n  color: var(--scalar-color-3);\n}\n/* we want our inputs to look like a password input but not be one */\n.scalar-password-input {\n  text-security: disc;\n  -webkit-text-security: disc;\n  -moz-text-security: disc;\n}\n</style>\n"],"mappings":""}
+{"version":3,"file":"DataTableInput.vue.js","names":["_sfc_main"],"sources":["../../../../src/v2/components/data-table/DataTableInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarIconButton } from '@scalar/components/icon-button'\nimport { ScalarIconEye, ScalarIconEyeSlash, ScalarIconX } from '@scalar/icons'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { computed, nextTick, ref, useTemplateRef, watch } from 'vue'\n\nimport type { VueClassProp } from '@/types/vue'\nimport { CodeInputLite } from '@/v2/components/code-input'\nimport { useLocalization } from '@/v2/features/localization'\n\nimport DataTableCell from './DataTableCell.vue'\nimport DataTableInputSelect from './DataTableInputSelect.vue'\n\nconst props = withDefaults(\n  defineProps<{\n    id?: string\n    type?: string | undefined\n    /** Class for the wrapping cell because attrs is bound to the input */\n    containerClass?: VueClassProp | undefined\n    required?: boolean\n    modelValue: string\n    /** Allows adding a custom value to the enum dropdown, defaults to true */\n    canAddCustomEnumValue?: boolean\n    readOnly?: boolean\n    enum?: string[]\n    environment: XScalarEnvironment\n    description?: string | undefined\n    /** Whether to show context function suggestions like $guid, $timestamp. Defaults to true */\n    withFakeData?: boolean\n  }>(),\n  {\n    canAddCustomEnumValue: true,\n    required: false,\n    readOnly: false,\n    withFakeData: true,\n  },\n)\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', v: string | number): void\n  (e: 'inputFocus'): void\n  (e: 'inputBlur'): void\n  (e: 'selectVariable', value: string): void\n}>()\n\nconst { translate } = useLocalization()\n\ndefineOptions({ inheritAttrs: false })\n\nconst mask = ref(true)\nconst interactingWithDropdown = ref(false)\nconst codeInput = useTemplateRef('codeInput')\nconst maskedInput = useTemplateRef('maskedInput')\n\n/**\n * Whether focus is inside the field. Tracked with focusin and focusout on the wrapper because the\n * revealed editor does not report its own focus, and swapping it out mid-typing would drop focus.\n */\nconst fieldFocused = ref(false)\n\n/** There is nothing to reveal in an empty field, so the toggle only shows once it has a value */\nconst showVisibilityToggle = computed(\n  () => props.type === 'password' && Boolean(props.modelValue),\n)\n\n// An emptied secret goes back to masked, so whatever is typed or pasted next stays hidden\nwatch(\n  () => props.modelValue,\n  (value) => {\n    if (!value && !fieldFocused.value) {\n      mask.value = true\n    }\n  },\n)\n\n/** A field emptied while typing in the revealed editor masks once focus leaves it */\nconst handleFieldFocusOut = (): void => {\n  fieldFocused.value = false\n\n  if (!props.modelValue) {\n    mask.value = true\n  }\n}\n\nconst handleBlur = () => !interactingWithDropdown.value && emit('inputBlur')\n\nconst inputType = computed(() =>\n  props.type === 'password' ? 'text' : (props.type ?? 'text'),\n)\n\n/** Focus whichever editor is showing, the masked input or the code input */\nconst focus = (): void => {\n  codeInput.value?.focus()\n  maskedInput.value?.focus()\n}\n\n// If not an enum nor read only, focus the code input or masked input\nconst handleLabelClick = () => {\n  if (!props.enum?.length && !props.readOnly) {\n    focus()\n  }\n}\n\n/**\n * The clear button disappears once the field is empty, so focus moves to the field instead of\n * falling back to the page. A cleared secret is masked again so the next one is not shown.\n */\nconst clearValue = async (): Promise<void> => {\n  mask.value = true\n  emit('update:modelValue', '')\n  await nextTick()\n  focus()\n}\n\ndefineExpose({ focus })\n</script>\n<template>\n  <DataTableCell\n    class=\"relative flex\"\n    :class=\"containerClass\">\n    <div\n      v-if=\"$slots.default\"\n      class=\"text-c-1 flex items-center pr-0 pl-3\"\n      @click=\"handleLabelClick\">\n      <slot />:\n    </div>\n    <div\n      class=\"relative flex min-w-0 flex-1\"\n      @focusin=\"fieldFocused = true\"\n      @focusout=\"handleFieldFocusOut\">\n      <template v-if=\"props.enum && props.enum.length\">\n        <DataTableInputSelect\n          :canAddCustomValue=\"props.canAddCustomEnumValue\"\n          :modelValue=\"props.modelValue\"\n          :value=\"props.enum\"\n          @update:modelValue=\"emit('update:modelValue', $event)\" />\n      </template>\n      <template v-else>\n        <input\n          v-if=\"mask && type === 'password'\"\n          v-bind=\"id ? { ...$attrs, id: id } : $attrs\"\n          ref=\"maskedInput\"\n          autocomplete=\"off\"\n          class=\"text-c-1 disabled:text-c-2 peer w-full min-w-0 border-none px-2 py-1.25 -outline-offset-1\"\n          :class=\"{ 'scalar-password-input': type === 'password' }\"\n          data-1p-ignore\n          :readOnly=\"readOnly\"\n          spellcheck=\"false\"\n          :type=\"inputType\"\n          :value=\"modelValue\"\n          @input=\"\n            emit(\n              'update:modelValue',\n              ($event.target as HTMLInputElement).value ?? '',\n            )\n          \" />\n        <CodeInputLite\n          v-else\n          v-bind=\"$attrs\"\n          :id=\"id\"\n          ref=\"codeInput\"\n          class=\"text-c-1 disabled:text-c-2 peer w-full min-w-0 border-none -outline-offset-1\"\n          :class=\"[\n            type === 'password' && description && 'pr-12',\n            description && 'pr-8',\n            type === 'password' && 'scalar-password-input',\n          ]\"\n          :environment=\"environment\"\n          :modelValue=\"modelValue ?? ''\"\n          :readOnly=\"readOnly\"\n          :required=\"Boolean(required)\"\n          :type=\"inputType\"\n          :withFakeData=\"withFakeData\"\n          @blur=\"handleBlur\"\n          @focus=\"emit('inputFocus')\"\n          @update:modelValue=\"(value) => emit('update:modelValue', value)\" />\n      </template>\n    </div>\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    <slot name=\"icon\" />\n    <!-- Clear -->\n    <ScalarIconButton\n      v-if=\"modelValue && !readOnly\"\n      class=\"-ml-.25 h-6 w-6 self-center p-1.25\"\n      :icon=\"ScalarIconX\"\n      :label=\"translate('apiClient.dataTableInput.clearValue')\"\n      @click=\"clearValue\" />\n    <!-- Toggle Visibility -->\n    <!-- A toggle button keeps one name and reports its state, so the label\n         stays \"Show Password\" while `aria-pressed` says whether the value is\n         revealed. Flipping the name instead leaves screen readers silent,\n         because activating a button does not re-announce its name. -->\n    <ScalarIconButton\n      v-if=\"showVisibilityToggle\"\n      :aria-pressed=\"!mask\"\n      class=\"-ml-.5 mr-1.25 h-6 w-6 self-center p-1.25\"\n      data-testid=\"data-table-password-toggle\"\n      :icon=\"mask ? ScalarIconEye : ScalarIconEyeSlash\"\n      :label=\"translate('apiClient.dataTableInput.showPassword')\"\n      @click=\"mask = !mask\" />\n  </DataTableCell>\n</template>\n\n<style scoped>\n:deep(.code-input-lite__editor) {\n  background-color: transparent;\n  font-family: var(--scalar-font);\n  font-size: var(--scalar-small);\n  padding: 5px 8px;\n}\n:deep(.scalar-pill:not(:last-of-type)) {\n  margin-right: 0.15em;\n}\n:deep(.scalar-pill:not(:first-of-type)) {\n  margin-left: 0.5px;\n}\n/* Tailwind placeholder is busted */\ninput::placeholder {\n  color: var(--scalar-color-3);\n}\n/* we want our inputs to look like a password input but not be one */\n.scalar-password-input {\n  text-security: disc;\n  -webkit-text-security: disc;\n  -moz-text-security: disc;\n}\n</style>\n"],"mappings":""}

package/dist/v2/components/data-table/{DataTableInput.vue.script.js → DataTableInput.vue_vue_type_script_setup_true_lang.js}

@@ -188,4 +188,4 @@ var DataTableInput_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ d
 //#endregion
 export { DataTableInput_vue_vue_type_script_setup_true_lang_default as default };
 
-//# sourceMappingURL=DataTableInput.vue.script.js.map
+//# sourceMappingURL=DataTableInput.vue_vue_type_script_setup_true_lang.js.map

package/dist/v2/components/data-table/DataTableInput.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableInput.vue_vue_type_script_setup_true_lang.js","names":["$slots","$attrs","_openBlock","_createBlock","DataTableCell","_normalizeClass","_withCtx","_createElementBlock","_renderSlot","_createTextVNode","_createCommentVNode","_createElementVNode","DataTableInputSelect","_Fragment","_mergeProps","_unref","CodeInputLite"],"sources":["../../../../src/v2/components/data-table/DataTableInput.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ScalarIconButton } from '@scalar/components/icon-button'\nimport { ScalarIconEye, ScalarIconEyeSlash, ScalarIconX } from '@scalar/icons'\nimport type { XScalarEnvironment } from '@scalar/workspace-store/schemas/extensions/document/x-scalar-environments'\nimport { computed, nextTick, ref, useTemplateRef, watch } from 'vue'\n\nimport type { VueClassProp } from '@/types/vue'\nimport { CodeInputLite } from '@/v2/components/code-input'\nimport { useLocalization } from '@/v2/features/localization'\n\nimport DataTableCell from './DataTableCell.vue'\nimport DataTableInputSelect from './DataTableInputSelect.vue'\n\nconst props = withDefaults(\n  defineProps<{\n    id?: string\n    type?: string | undefined\n    /** Class for the wrapping cell because attrs is bound to the input */\n    containerClass?: VueClassProp | undefined\n    required?: boolean\n    modelValue: string\n    /** Allows adding a custom value to the enum dropdown, defaults to true */\n    canAddCustomEnumValue?: boolean\n    readOnly?: boolean\n    enum?: string[]\n    environment: XScalarEnvironment\n    description?: string | undefined\n    /** Whether to show context function suggestions like $guid, $timestamp. Defaults to true */\n    withFakeData?: boolean\n  }>(),\n  {\n    canAddCustomEnumValue: true,\n    required: false,\n    readOnly: false,\n    withFakeData: true,\n  },\n)\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', v: string | number): void\n  (e: 'inputFocus'): void\n  (e: 'inputBlur'): void\n  (e: 'selectVariable', value: string): void\n}>()\n\nconst { translate } = useLocalization()\n\ndefineOptions({ inheritAttrs: false })\n\nconst mask = ref(true)\nconst interactingWithDropdown = ref(false)\nconst codeInput = useTemplateRef('codeInput')\nconst maskedInput = useTemplateRef('maskedInput')\n\n/**\n * Whether focus is inside the field. Tracked with focusin and focusout on the wrapper because the\n * revealed editor does not report its own focus, and swapping it out mid-typing would drop focus.\n */\nconst fieldFocused = ref(false)\n\n/** There is nothing to reveal in an empty field, so the toggle only shows once it has a value */\nconst showVisibilityToggle = computed(\n  () => props.type === 'password' && Boolean(props.modelValue),\n)\n\n// An emptied secret goes back to masked, so whatever is typed or pasted next stays hidden\nwatch(\n  () => props.modelValue,\n  (value) => {\n    if (!value && !fieldFocused.value) {\n      mask.value = true\n    }\n  },\n)\n\n/** A field emptied while typing in the revealed editor masks once focus leaves it */\nconst handleFieldFocusOut = (): void => {\n  fieldFocused.value = false\n\n  if (!props.modelValue) {\n    mask.value = true\n  }\n}\n\nconst handleBlur = () => !interactingWithDropdown.value && emit('inputBlur')\n\nconst inputType = computed(() =>\n  props.type === 'password' ? 'text' : (props.type ?? 'text'),\n)\n\n/** Focus whichever editor is showing, the masked input or the code input */\nconst focus = (): void => {\n  codeInput.value?.focus()\n  maskedInput.value?.focus()\n}\n\n// If not an enum nor read only, focus the code input or masked input\nconst handleLabelClick = () => {\n  if (!props.enum?.length && !props.readOnly) {\n    focus()\n  }\n}\n\n/**\n * The clear button disappears once the field is empty, so focus moves to the field instead of\n * falling back to the page. A cleared secret is masked again so the next one is not shown.\n */\nconst clearValue = async (): Promise<void> => {\n  mask.value = true\n  emit('update:modelValue', '')\n  await nextTick()\n  focus()\n}\n\ndefineExpose({ focus })\n</script>\n<template>\n  <DataTableCell\n    class=\"relative flex\"\n    :class=\"containerClass\">\n    <div\n      v-if=\"$slots.default\"\n      class=\"text-c-1 flex items-center pr-0 pl-3\"\n      @click=\"handleLabelClick\">\n      <slot />:\n    </div>\n    <div\n      class=\"relative flex min-w-0 flex-1\"\n      @focusin=\"fieldFocused = true\"\n      @focusout=\"handleFieldFocusOut\">\n      <template v-if=\"props.enum && props.enum.length\">\n        <DataTableInputSelect\n          :canAddCustomValue=\"props.canAddCustomEnumValue\"\n          :modelValue=\"props.modelValue\"\n          :value=\"props.enum\"\n          @update:modelValue=\"emit('update:modelValue', $event)\" />\n      </template>\n      <template v-else>\n        <input\n          v-if=\"mask && type === 'password'\"\n          v-bind=\"id ? { ...$attrs, id: id } : $attrs\"\n          ref=\"maskedInput\"\n          autocomplete=\"off\"\n          class=\"text-c-1 disabled:text-c-2 peer w-full min-w-0 border-none px-2 py-1.25 -outline-offset-1\"\n          :class=\"{ 'scalar-password-input': type === 'password' }\"\n          data-1p-ignore\n          :readOnly=\"readOnly\"\n          spellcheck=\"false\"\n          :type=\"inputType\"\n          :value=\"modelValue\"\n          @input=\"\n            emit(\n              'update:modelValue',\n              ($event.target as HTMLInputElement).value ?? '',\n            )\n          \" />\n        <CodeInputLite\n          v-else\n          v-bind=\"$attrs\"\n          :id=\"id\"\n          ref=\"codeInput\"\n          class=\"text-c-1 disabled:text-c-2 peer w-full min-w-0 border-none -outline-offset-1\"\n          :class=\"[\n            type === 'password' && description && 'pr-12',\n            description && 'pr-8',\n            type === 'password' && 'scalar-password-input',\n          ]\"\n          :environment=\"environment\"\n          :modelValue=\"modelValue ?? ''\"\n          :readOnly=\"readOnly\"\n          :required=\"Boolean(required)\"\n          :type=\"inputType\"\n          :withFakeData=\"withFakeData\"\n          @blur=\"handleBlur\"\n          @focus=\"emit('inputFocus')\"\n          @update:modelValue=\"(value) => emit('update:modelValue', value)\" />\n      </template>\n    </div>\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    <slot name=\"icon\" />\n    <!-- Clear -->\n    <ScalarIconButton\n      v-if=\"modelValue && !readOnly\"\n      class=\"-ml-.25 h-6 w-6 self-center p-1.25\"\n      :icon=\"ScalarIconX\"\n      :label=\"translate('apiClient.dataTableInput.clearValue')\"\n      @click=\"clearValue\" />\n    <!-- Toggle Visibility -->\n    <!-- A toggle button keeps one name and reports its state, so the label\n         stays \"Show Password\" while `aria-pressed` says whether the value is\n         revealed. Flipping the name instead leaves screen readers silent,\n         because activating a button does not re-announce its name. -->\n    <ScalarIconButton\n      v-if=\"showVisibilityToggle\"\n      :aria-pressed=\"!mask\"\n      class=\"-ml-.5 mr-1.25 h-6 w-6 self-center p-1.25\"\n      data-testid=\"data-table-password-toggle\"\n      :icon=\"mask ? ScalarIconEye : ScalarIconEyeSlash\"\n      :label=\"translate('apiClient.dataTableInput.showPassword')\"\n      @click=\"mask = !mask\" />\n  </DataTableCell>\n</template>\n\n<style scoped>\n:deep(.code-input-lite__editor) {\n  background-color: transparent;\n  font-family: var(--scalar-font);\n  font-size: var(--scalar-small);\n  padding: 5px 8px;\n}\n:deep(.scalar-pill:not(:last-of-type)) {\n  margin-right: 0.15em;\n}\n:deep(.scalar-pill:not(:first-of-type)) {\n  margin-left: 0.5px;\n}\n/* Tailwind placeholder is busted */\ninput::placeholder {\n  color: var(--scalar-color-3);\n}\n/* we want our inputs to look like a password input but not be one */\n.scalar-password-input {\n  text-security: disc;\n  -webkit-text-security: disc;\n  -moz-text-security: disc;\n}\n</style>\n"],"mappings":"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"}

package/dist/v2/components/data-table/DataTableInputSelect.vue.d.ts

@@ -1,4 +1,4 @@
-import type { CodeInputModelValue } from '../../../v2/components/code-input/CodeInput.vue.js';
+import type { CodeInputModelValue } from '../code-input/CodeInput.vue.js';
 type __VLS_Props = {
     modelValue: CodeInputModelValue;
     value?: unknown[];

package/dist/v2/components/data-table/DataTableInputSelect.vue.js

@@ -1,4 +1,4 @@
-import DataTableInputSelect_vue_vue_type_script_setup_true_lang_default from "./DataTableInputSelect.vue.script.js";
+import DataTableInputSelect_vue_vue_type_script_setup_true_lang_default from "./DataTableInputSelect.vue_vue_type_script_setup_true_lang.js";
 //#region src/v2/components/data-table/DataTableInputSelect.vue
 var DataTableInputSelect_default = DataTableInputSelect_vue_vue_type_script_setup_true_lang_default;
 //#endregion