var __create = Object.create;
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __getProtoOf = Object.getPrototypeOf;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
  for (var name in all)
    __defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
  if (from && typeof from === "object" || typeof from === "function") {
    for (let key of __getOwnPropNames(from))
      if (!__hasOwnProp.call(to, key) && key !== except)
        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
  }
  return to;
};
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
  // If the importer is in node compatibility mode or this is not an ESM
  // file that has been converted to a CommonJS file using a Babel-
  // compatible transform (i.e. "__esModule" has not been set), then set
  // "default" to the CommonJS "module.exports" for node compatibility.
  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
  mod
));
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// packages/remirror__extension-react-language-select/src/index.ts
var src_exports = {};
__export(src_exports, {
  CodeBlockLanguageSelect: () => CodeBlockLanguageSelect
});
module.exports = __toCommonJS(src_exports);

// packages/remirror__extension-react-language-select/src/language-select.tsx
var import_lodash = __toESM(require("lodash.memoize"), 1);
var import_react = __toESM(require("react"), 1);
var import_core = require("@remirror/core");
var import_extension_code_block = require("@remirror/extension-code-block");
var import_extension_positioner = require("@remirror/extension-positioner");
var import_react_components = require("@remirror/react-components");
var import_react_core = require("@remirror/react-core");
var import_react_hooks = require("@remirror/react-hooks");
var CodeBlockLanguageSelect = ({
  languages = [],
  className = "",
  offset = { x: 0, y: 0 },
  onLanguageChange,
  onPointerDownSelect,
  onSelectChange
}) => {
  var _a;
  const position = (0, import_react_hooks.usePositioner)(createPositioner, []);
  const { getExtension, getState } = (0, import_react_core.useRemirrorContext)();
  const { focus, updateCodeBlock } = (0, import_react_core.useCommands)();
  const languageOptions = getExtension(import_extension_code_block.CodeBlockExtension).options;
  const [aliasesMap] = (0, import_react.useState)(() => {
    const temp = /* @__PURE__ */ new Map();
    languageOptions.supportedLanguages.forEach((lang2) => {
      lang2.aliases.forEach(
        (alias) => !languages.some((lang3) => lang3.displayName === alias) && temp.set(alias, lang2.displayName)
      );
    });
    return temp;
  });
  const [lang] = (0, import_react.useState)([
    ...languages,
    {
      displayName: languageOptions.defaultLanguage
    },
    ...languageOptions.supportedLanguages
  ]);
  const { selection } = getState();
  const [width, setWidth] = (0, import_react.useState)("auto");
  const nodeLanguage = (_a = (0, import_core.findParentNodeOfType)({
    selection,
    types: "codeBlock"
  })) == null ? void 0 : _a.node.attrs.language;
  const language = (0, import_react.useMemo)(() => {
    const alias = aliasesMap.get(nodeLanguage);
    if (alias) {
      return alias;
    }
    if (languageOptions.supportedLanguages.some((lang2) => nodeLanguage === lang2.displayName)) {
      return nodeLanguage;
    }
    return languageOptions.defaultLanguage;
  }, [
    aliasesMap,
    languageOptions.defaultLanguage,
    languageOptions.supportedLanguages,
    nodeLanguage
  ]);
  (0, import_react.useEffect)(() => {
    var _a2;
    const el = position.element;
    if (onLanguageChange == null ? void 0 : onLanguageChange(language, el, setWidth)) {
      return;
    }
    const isSelectElement = (n) => n && n.nodeName === "SELECT" || false;
    if (isSelectElement(el)) {
      const width2 = (_a2 = el.options[el.selectedIndex]) == null ? void 0 : _a2.dataset.width;
      setWidth(width2 ? `${width2}px` : "auto");
    }
  }, [position.element, language, onLanguageChange]);
  return /* @__PURE__ */ import_react.default.createElement(import_react_components.PositionerPortal, null, /* @__PURE__ */ import_react.default.createElement(
    "select",
    {
      ref: position.ref,
      className,
      onBlur: () => focus(),
      onChange: (e) => {
        var _a2;
        if (onSelectChange == null ? void 0 : onSelectChange(e, setWidth)) {
          return;
        }
        setWidth(`${(_a2 = e.target.options[e.target.selectedIndex]) == null ? void 0 : _a2.dataset.width}px`);
        updateCodeBlock({
          language: e.target.dataset.value || e.target.value
        });
      },
      onPointerDown: onPointerDownSelect,
      style: {
        "--w": width,
        "--x": `${position.x + offset.x}px`,
        "--y": `${position.y + offset.y}px`,
        display: !nodeLanguage ? "none" : "block"
      },
      value: language
    },
    nodeLanguage ? getLanguageOptions(lang) : null
  ));
};
var getLanguageOptions = (0, import_lodash.default)((input) => {
  const options = (0, import_core.uniqueBy)(
    input.map(({ displayName, value }) => ({
      displayName,
      value: value || displayName
    })),
    "displayName"
  ).sort((a, b) => {
    if (a.displayName > b.displayName) {
      return 1;
    }
    if (a.displayName < b.displayName) {
      return -1;
    }
    return 0;
  }).map((o) => {
    const select = document.createElement("select");
    const option = document.createElement("option");
    let width = "0px";
    select.append(option);
    document.body.append(select);
    option.textContent = o.displayName;
    width = String(select.getBoundingClientRect().width);
    select.remove();
    return { ...o, width };
  }).map(({ displayName, value, width }) => /* @__PURE__ */ import_react.default.createElement("option", { key: displayName, "data-value": value, "data-width": width, value: displayName }, displayName));
  return options;
});
function createPositioner() {
  return import_extension_positioner.Positioner.create({
    getActive(props) {
      const { selection } = props.state;
      const codeBlockResult = (0, import_core.findParentNodeOfType)({
        selection,
        types: "codeBlock"
      });
      if (codeBlockResult) {
        const positionerData = {
          codeBlockResult
        };
        return [positionerData];
      }
      return import_extension_positioner.Positioner.EMPTY;
    },
    getPosition(props) {
      const { data, view } = props;
      const { pos } = data.codeBlockResult;
      const firstCellDOM = view.nodeDOM(pos);
      if (!firstCellDOM || !(0, import_core.isElementDomNode)(firstCellDOM)) {
        return import_extension_positioner.defaultAbsolutePosition;
      }
      const rect = firstCellDOM.getBoundingClientRect();
      const editorRect = view.dom.getBoundingClientRect();
      const left = view.dom.scrollLeft + rect.left - editorRect.left;
      const top = view.dom.scrollTop + rect.top - editorRect.top;
      const visible = (0, import_extension_positioner.isPositionVisible)(rect, view.dom);
      return {
        height: 0,
        rect,
        visible,
        width: 0,
        x: left,
        y: top
      };
    },
    hasChanged: import_extension_positioner.hasStateChanged
  });
}
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  CodeBlockLanguageSelect
});