@stencil/react-output-target/dist/ssr.js

React output target for @stencil/core components.

import l from "react";
import { c as b } from "./create-component-C2u0Q7Hs.js";
var O = {
  animationIterationCount: 1,
  aspectRatio: 1,
  borderImageOutset: 1,
  borderImageSlice: 1,
  borderImageWidth: 1,
  boxFlex: 1,
  boxFlexGroup: 1,
  boxOrdinalGroup: 1,
  columnCount: 1,
  columns: 1,
  flex: 1,
  flexGrow: 1,
  flexPositive: 1,
  flexShrink: 1,
  flexNegative: 1,
  flexOrder: 1,
  gridRow: 1,
  gridRowEnd: 1,
  gridRowSpan: 1,
  gridRowStart: 1,
  gridColumn: 1,
  gridColumnEnd: 1,
  gridColumnSpan: 1,
  gridColumnStart: 1,
  msGridRow: 1,
  msGridRowSpan: 1,
  msGridColumn: 1,
  msGridColumnSpan: 1,
  fontWeight: 1,
  lineHeight: 1,
  opacity: 1,
  order: 1,
  orphans: 1,
  scale: 1,
  tabSize: 1,
  widows: 1,
  zIndex: 1,
  zoom: 1,
  WebkitLineClamp: 1,
  // SVG-related properties
  fillOpacity: 1,
  floodOpacity: 1,
  stopOpacity: 1,
  strokeDasharray: 1,
  strokeDashoffset: 1,
  strokeMiterlimit: 1,
  strokeOpacity: 1,
  strokeWidth: 1
}, S = "px", $ = (e) => typeof e == "number" || typeof e == "string";
function L(e) {
  return e.replace(/[A-Z]/g, (t) => `-${t.toLowerCase()}`);
}
function I(e, t, r = S) {
  if (typeof t != "string" && typeof t != "number")
    throw new Error(
      "Invalid input: value of 'cssProperties' must be string or number."
    );
  const n = O[e] === 1;
  if (typeof t == "string" || t === 0 || n)
    return `${t}`;
  const o = (typeof r == "string" ? r : r[e]) || S;
  return `${t}${o}`;
}
function A(e, t) {
  if (typeof e != "object" || e === null)
    throw new TypeError(
      `[stringifyStyleDeclaration]: Expected 'styleDeclaration' to be a non-null object, but received ${e} (type:${typeof e}).`
    );
  const r = t != null && t.important ? "!important" : "";
  return Object.entries(e).filter(([n, o]) => $(o)).map(
    ([n, o]) => `${L(n)}:${I(
      n,
      o,
      t == null ? void 0 : t.unit
    )}${r};`
  ).join("");
}
function H(e, t = !1) {
  if (typeof e != "object" || e === null)
    throw new TypeError(
      `[stringifyCSSProperties]: Expected 'cssProperties' to be a non-null object, but received ${e} (type:${typeof e}).`
    );
  return A(e, typeof t == "boolean" ? {
    important: t
  } : t);
}
const j = {
  acceptCharset: "accept-charset",
  accessKey: "accesskey",
  allowFullScreen: "allowfullscreen",
  autoCapitalize: "autocapitalize",
  autoComplete: "autocomplete",
  autoCorrect: "autocorrect",
  autoFocus: "autofocus",
  autoPlay: "autoplay",
  autoSave: "autosave",
  cellPadding: "cellpadding",
  cellSpacing: "cellspacing",
  charSet: "charset",
  className: "class",
  classID: "classid",
  colSpan: "colspan",
  contentEditable: "contenteditable",
  contextMenu: "contextmenu",
  controlsList: "controlslist",
  crossOrigin: "crossorigin",
  dangerouslySetInnerHTML: "dangerouslysetinnerhtml",
  dateTime: "datetime",
  defaultChecked: "defaultchecked",
  defaultValue: "defaultvalue",
  disablePictureInPicture: "disablepictureinpicture",
  disableRemotePlayback: "disableremoteplayback",
  encType: "enctype",
  enterKeyHint: "enterkeyhint",
  fetchPriority: "fetchpriority",
  htmlFor: "for",
  formMethod: "formmethod",
  formAction: "formaction",
  formEncType: "formenctype",
  formNoValidate: "formnovalidate",
  formTarget: "formtarget",
  frameBorder: "frameborder",
  hrefLang: "hreflang",
  httpEquiv: "http-equiv",
  imageSizes: "imagesizes",
  imageSrcSet: "imagesrcset",
  inputMode: "inputmode",
  itemID: "itemid",
  itemProp: "itemprop",
  itemRef: "itemref",
  itemScope: "itemscope",
  itemType: "itemtype",
  keyParams: "keyparams",
  keyType: "keytype",
  marginWidth: "marginwidth",
  marginHeight: "marginheight",
  maxLength: "maxlength",
  mediaGroup: "mediagroup",
  noModule: "nomodule",
  noValidate: "novalidate",
  playsInline: "playsinline",
  radioGroup: "radiogroup",
  readOnly: "readonly",
  referrerPolicy: "referrerpolicy",
  rowSpan: "rowspan",
  spellCheck: "spellcheck",
  srcDoc: "srcdoc",
  srcLang: "srclang",
  srcSet: "srcset",
  tabIndex: "tabindex",
  useMap: "usemap",
  accentHeight: "accent-height",
  alignmentBaseline: "alignment-baseline",
  arabicForm: "arabic-form",
  attributeName: "attributename",
  attributeType: "attributetype",
  autoReverse: "autoreverse",
  baseFrequency: "basefrequency",
  baselineShift: "baseline-shift",
  baseProfile: "baseprofile",
  calcMode: "calcmode",
  capHeight: "cap-height",
  clipPath: "clip-path",
  clipPathUnits: "clippathunits",
  clipRule: "clip-rule",
  colorInterpolation: "color-interpolation",
  colorInterpolationFilters: "color-interpolation-filters",
  colorProfile: "color-profile",
  colorRendering: "color-rendering",
  contentScriptType: "contentscripttype",
  contentStyleType: "contentstyletype",
  diffuseConstant: "diffuseconstant",
  dominantBaseline: "dominant-baseline",
  enableBackground: "enable-background",
  externalResourcesRequired: "externalresourcesrequired",
  fillOpacity: "fill-opacity",
  fillRule: "fill-rule",
  filterRes: "filterres",
  filterUnits: "filterunits",
  floodOpacity: "flood-opacity",
  floodColor: "flood-color",
  fontFamily: "font-family",
  fontSize: "font-size",
  fontSizeAdjust: "font-size-adjust",
  fontStretch: "font-stretch",
  fontStyle: "font-style",
  fontVariant: "font-variant",
  fontWeight: "font-weight",
  glyphName: "glyph-name",
  glyphOrientationHorizontal: "glyph-orientation-horizontal",
  glyphOrientationVertical: "glyph-orientation-vertical",
  gradientTransform: "gradienttransform",
  gradientUnits: "gradientunits",
  horizAdvX: "horiz-adv-x",
  horizOriginX: "horiz-origin-x",
  imageRendering: "image-rendering",
  kernelMatrix: "kernelmatrix",
  kernelUnitLength: "kernelunitlength",
  keyPoints: "keypoints",
  keySplines: "keysplines",
  keyTimes: "keytimes",
  lengthAdjust: "lengthadjust",
  letterSpacing: "letter-spacing",
  lightingColor: "lighting-color",
  limitingConeAngle: "limitingconeangle",
  markerEnd: "marker-end",
  markerHeight: "markerheight",
  markerMid: "marker-mid",
  markerStart: "marker-start",
  markerUnits: "markerunits",
  markerWidth: "markerwidth",
  maskContentUnits: "maskcontentunits",
  maskUnits: "maskunits",
  numOctaves: "numoctaves",
  overlinePosition: "overline-position",
  overlineThickness: "overline-thickness",
  paintOrder: "paint-order",
  panose1: "panose-1",
  pathLength: "pathlength",
  patternContentUnits: "patterncontentunits",
  patternTransform: "patterntransform",
  patternUnits: "patternunits",
  pointerEvents: "pointer-events",
  pointsAtX: "pointsatx",
  pointsAtY: "pointsaty",
  pointsAtZ: "pointsatz",
  preserveAlpha: "preservealpha",
  preserveAspectRatio: "preserveaspectratio",
  primitiveUnits: "primitiveunits",
  refX: "refx",
  refY: "refy",
  renderingIntent: "rendering-intent",
  repeatCount: "repeatcount",
  repeatDur: "repeatdur",
  requiredExtensions: "requiredextensions",
  requiredFeatures: "requiredfeatures",
  shapeRendering: "shape-rendering",
  slot: "slot",
  specularConstant: "specularconstant",
  specularExponent: "specularexponent",
  spreadMethod: "spreadmethod",
  startOffset: "startoffset",
  stdDeviation: "stddeviation",
  stitchTiles: "stitchtiles",
  stopColor: "stop-color",
  stopOpacity: "stop-opacity",
  strikethroughPosition: "strikethrough-position",
  strikethroughThickness: "strikethrough-thickness",
  strokeDasharray: "stroke-dasharray",
  strokeDashoffset: "stroke-dashoffset",
  strokeLinecap: "stroke-linecap",
  strokeLinejoin: "stroke-linejoin",
  strokeMiterlimit: "stroke-miterlimit",
  strokeWidth: "stroke-width",
  strokeOpacity: "stroke-opacity",
  suppressContentEditableWarning: "suppresscontenteditablewarning",
  suppressHydrationWarning: "suppresshydrationwarning",
  surfaceScale: "surfacescale",
  systemLanguage: "systemlanguage",
  tableValues: "tablevalues",
  targetX: "targetx",
  targetY: "targety",
  textAnchor: "text-anchor",
  textDecoration: "text-decoration",
  textLength: "textlength",
  textRendering: "text-rendering",
  transformOrigin: "transform-origin",
  underlinePosition: "underline-position",
  underlineThickness: "underline-thickness",
  unicodeBidi: "unicode-bidi",
  unicodeRange: "unicode-range",
  unitsPerEm: "units-per-em",
  vectorEffect: "vector-effect",
  vertAdvY: "vert-adv-y",
  vertOriginX: "vert-origin-x",
  vertOriginY: "vert-origin-y",
  wordSpacing: "word-spacing",
  writingMode: "writing-mode",
  xChannelSelector: "xchannelselector",
  xHeight: "x-height",
  xlinkActuate: "xlink:actuate",
  xlinkArcrole: "xlink:arcrole",
  xlinkHref: "xlink:href",
  xlinkRole: "xlink:role",
  xlinkShow: "xlink:show",
  xlinkTitle: "xlink:title",
  xlinkType: "xlink:type",
  xmlBase: "xml:base",
  xmlLang: "xml:lang",
  xmlnsXlink: "xmlns:xlink",
  yChannelSelector: "ychannelselector",
  zoomAndPan: "zoomandpan"
}, M = "[react-output-target]", u = (e) => typeof e == "string" || typeof e == "number" || typeof e == "boolean", g = (e) => e == null, w = (e) => Array.isArray(e), U = (e) => !!e && /^\s*class\s+/.test(e.toString()), _ = (e) => !!e && typeof e == "object" && "_payload" in e, W = (e) => async ({ children: t, ...r } = {}) => {
  if (!("process" in globalThis) || typeof window < "u")
    throw new Error("`createComponent` can only be run on the server");
  let n = "";
  for (const [a, i] of Object.entries(r)) {
    let s = u(i) ? `"${i}"` : typeof i != "function" ? e.serializeProperty(i) : void 0;
    if (a === "style" && typeof i == "object" && i && (s = `"${H(i)}"`), !s)
      continue;
    const m = j[a] || e.properties[a] || a;
    n += ` ${m}=${s}`;
  }
  let o = "";
  const c = `<${e.tagName}${n} suppressHydrationWarning="true">`, p = console.error;
  try {
    process.env.STENCIL_SSR_DEBUG || (console.error = () => {
    });
    const a = await y(t), { renderToString: i } = await import("react-dom/server");
    o = i(a);
  } catch (a) {
    if (process.env.STENCIL_SSR_DEBUG) {
      const i = a instanceof Error ? a : new Error("Unknown error");
      console.warn(
        `${M} Failed to serialize light DOM for ${c.slice(0, -1)} />: ${i.message} - this may impact the hydration of the component`
      );
    }
  } finally {
    console.error = p;
  }
  const v = `${c}${o}</${e.tagName}>`, { html: f } = await e.renderToString(v, {
    fullDocument: !1,
    serializeShadowRoot: e.serializeShadowRoot ?? "declarative-shadow-dom",
    prettyHtml: !0
  });
  if (!f)
    throw new Error("No HTML returned from renderToString");
  const d = f.split(`
`), C = "<!--r.1-->", k = d[1].includes('shadowrootmode="open"');
  let x;
  k && (x = d.slice(2, d.lastIndexOf("  </template>")).join(`
`).trim());
  const { default: T } = await import("html-react-parser"), E = T, z = () => E(f, {
    transform(a, i) {
      if ("name" in i && i.name === e.tagName) {
        const s = a.props, m = `${e.tagName}`;
        if (!k) {
          const { children: D, ...P } = s || {}, R = d.slice(1, -1).join(`
`).trim().replace(new RegExp("(?<=>)\\s+(?=<)", "g"), "");
          return /* @__PURE__ */ l.createElement(m, { ...P, suppressHydrationWarning: !0, dangerouslySetInnerHTML: { __html: R } });
        }
        return /* @__PURE__ */ l.createElement(m, { ...s, suppressHydrationWarning: !0 }, /* @__PURE__ */ l.createElement(
          "template",
          {
            shadowrootmode: "open",
            suppressHydrationWarning: !0,
            dangerouslySetInnerHTML: { __html: C + x }
          }
        ), t);
      }
    }
  });
  return /* @__PURE__ */ l.createElement(z, null);
};
async function y(e) {
  return u(e) || g(e) ? e : (w(e) || (e = [e]), Promise.all(
    Array.from(e).map(async (t) => {
      if (u(t) || g(t))
        return t;
      if (w(t))
        return y(t);
      if (!l.isValidElement(t))
        return t;
      const { type: r, props: n } = t;
      return {
        ...t,
        props: {
          ...n,
          children: await y(n.children)
        },
        type: await h(r, n)
      };
    })
  ));
}
const h = async (e, t) => {
  let r = null;
  if (typeof e == "string")
    return e;
  if (U(e)) {
    const n = new e(t);
    r = n.render ? n.render() : n;
  } else if (_(e)) {
    const n = e._payload, { deault: o } = n._status === -1 ? await n._result() : n._result;
    r = await h(o, t);
  } else typeof e != "object" && (r = await e(t));
  return !g(r) && !u(r) && typeof r == "object" && r !== null && "type" in r && (r = await h(r.type, t)), r;
}, G = ({
  hydrateModule: e,
  properties: t,
  tagName: r,
  serializeShadowRoot: n,
  ...o
}) => typeof window < "u" && b ? b({
  tagName: r,
  ...o
}) : async (c) => {
  const p = await e;
  return W({
    tagName: r,
    properties: t,
    renderToString: p.renderToString,
    serializeProperty: p.serializeProperty,
    serializeShadowRoot: n
  })(c);
};
export {
  G as createComponent
};
//# sourceMappingURL=ssr.js.map