prism-react-editor/dist/extensions/autocomplete/svelte/index.js

Lightweight, extensible code editor component for React apps

"use client";
import { g as braces } from "../../../index-DsT2G8SO.js";
import { h as htmlTags, g as globalHtmlAttributes, a as htmlEventHandlers } from "../../../data-CI2aNqpK.js";
import { getTagMatch, svgTags, globalSvgAttributes } from "../markup/index.js";
import { a as completionsFromRecords, o as optionsFromKeys, b as attrSnippet } from "../../../tooltip-P6N5ZtU4.js";
const svelteBlockSnippets = [
  {
    label: "#await",
    icon: "keyword",
    insert: "#await promise then value}\n	\n{/await",
    tabStops: [7, 14, 20, 25, 28]
  },
  {
    label: "#await then",
    icon: "keyword",
    insert: "#await promise}\n	\n{:then value}\n	\n{/await",
    tabStops: [7, 14, 17, 17, 25, 30, 33]
  },
  {
    label: "#await catch",
    icon: "keyword",
    insert: "#await promise}\n	\n{:then value}\n	\n{:catch error}\n	\n{/await",
    tabStops: [7, 14, 17, 17, 25, 30, 33, 33, 42, 47, 50]
  },
  {
    label: "#each",
    icon: "keyword",
    insert: "#each items as item}\n	\n{/each",
    tabStops: [6, 11, 15, 19, 22]
  },
  {
    label: "#if",
    icon: "keyword",
    insert: "#if condition}\n	\n{/if",
    tabStops: [4, 13, 16]
  },
  {
    label: "#key",
    icon: "keyword",
    insert: "#key value}\n	\n{/key",
    tabStops: [5, 10, 13]
  },
  {
    label: "#snippet",
    icon: "keyword",
    insert: "#snippet name(params)}\n	\n{/snippet",
    tabStops: [9, 13, 14, 20, 24]
  },
  {
    label: "@const",
    icon: "keyword",
    insert: "@const name = value",
    tabStops: [7, 11, 14, 19]
  },
  {
    label: "@debug",
    icon: "keyword"
  },
  {
    label: "@html",
    icon: "keyword"
  },
  {
    label: "@render",
    icon: "keyword",
    insert: "@render snippet(params)",
    tabStops: [8, 15, 16, 22]
  },
  {
    label: ":catch",
    icon: "keyword"
  },
  {
    label: ":else",
    icon: "keyword"
  },
  {
    label: ":else if",
    icon: "keyword"
  },
  {
    label: ":then",
    icon: "keyword"
  }
];
const tagPattern = /* @__PURE__ */ RegExp(
  `<$|<(?![\\d!])([^\\s%=<>/]+)(?:\\s(?:\\s*([^\\s{=<>/]+)(?:\\s*=\\s*(?!\\s)(?:"[^"]*(?:"|$)|'[^']*(?:'|$)|[^\\s{=<>/"']+(?!\\S])|${braces})?|(?![^\\s=]))|\\s*${braces})*)?\\s*$`
);
const globalBinds = [
  "innerHTML",
  "textContent",
  "innerText",
  "contentRect",
  "contentBoxSize",
  "borderBoxSize",
  "devicePixelContentBoxSize",
  "focused",
  "this"
];
const mediaBinds = [
  "readyState",
  "duration",
  "buffered",
  "played",
  "seekable",
  "seeking",
  "ended",
  "muted",
  "volume",
  "currentTime",
  "playbackRate",
  "paused"
];
const bindAttrs = {
  audio: mediaBinds,
  input: ["checked", "files", "group", "indeterminate", "value"],
  select: ["value"],
  textarea: ["value"],
  video: mediaBinds.concat("videoHeight", "videoWidth"),
  "svelte:document": [
    "activeElement",
    "fullscreenElement",
    "pointerLockElement",
    "visibilityState"
  ],
  "svelte:window": [
    "innerWidth",
    "innerHeight",
    "outerWidth",
    "outerHeight",
    "devicePixelRatio",
    "scrollX",
    "scrollY",
    "online"
  ]
};
const svelteTags = {
  "svelte:boundary": {
    onerror: null
  },
  "svelte:window": htmlEventHandlers,
  "svelte:document": htmlEventHandlers,
  "svelte:body": htmlEventHandlers,
  "svelte:head": htmlEventHandlers,
  "svelte:element": {
    ...globalHtmlAttributes,
    this: null
  },
  "svelte:options": {
    customElement: null,
    namespace: ["html", "svg", "mathml"],
    css: ["injected"],
    runes: null
  }
};
const createCompletion = (label, icon) => ({
  label,
  icon
});
const tagNames = completionsFromRecords([htmlTags, svgTags, svelteTags], "property");
const enumerateAttrs = (attrs, result = []) => {
  for (let attr in attrs) {
    if (attr.slice(0, 2) == "on") {
      result.push(
        attrSnippet("on:" + attr.slice(2), "{}", "event"),
        attrSnippet(attr, "{}", "event"),
        attrSnippet(attr + "capture", "{}", "event")
      );
    } else {
      result.push(createCompletion(attr, "enum"));
    }
  }
  return result;
};
const addBinds = (binds, options) => {
  for (let i = 0; i < binds.length; ) {
    options.push(attrSnippet("bind:" + binds[i++], "{}", "enum"));
  }
};
const svelteCompletion = (blockSnippets, components, nestedSource) => (context, editor) => {
  const tagMatch = getTagMatch(context, editor, tagPattern);
  if (tagMatch) {
    let [tag, tagName, lastAttr] = tagMatch;
    let start = tagMatch.index;
    let from = start + 1;
    let options;
    if (/\s/.test(tag)) {
      let tags = [htmlTags, svgTags, svelteTags, components];
      let globalAtts = [globalHtmlAttributes, globalSvgAttributes];
      let inAttrValue = /=\s*(?:"[^"]*|'[^']*|[^\s"'=]*)$/.test(tag);
      let i = 0;
      let currentTags;
      from = start + tag.search(/[^\s"'=]*$/);
      for (; currentTags = tags[i]; i++) {
        let globals = globalAtts[i];
        let tagAttrs = currentTags[tagName];
        if (tagAttrs) {
          if (inAttrValue) {
            options = (globals?.[lastAttr] || tagAttrs[lastAttr])?.map(
              (val) => createCompletion(val, "unit")
            );
          } else {
            options = enumerateAttrs(tagAttrs, []);
            if (globals) enumerateAttrs(globals, options);
            if (bindAttrs[tagName]) addBinds(bindAttrs[tagName], options);
            if (globals || i == 2 && "onclick" in tagAttrs) addBinds(globalBinds, options);
          }
          break;
        }
      }
    } else {
      options = components ? tagNames.concat(optionsFromKeys(components, "property")) : tagNames;
    }
    if (options) {
      return {
        from,
        options
      };
    }
  }
  if (tagMatch != false) {
    const blockMatch = blockSnippets && /\{[#@:]\w*$/.exec(context.lineBefore);
    if (blockMatch) {
      return {
        from: context.pos + 1 - blockMatch[0].length,
        options: blockSnippets
      };
    }
    return nestedSource?.(context, editor);
  }
};
export {
  svelteBlockSnippets,
  svelteCompletion
};
//# sourceMappingURL=index.js.map