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

React output target for @stencil/core components.

import s, { Fragment as j } from "react";
import { c as T } from "./create-component-CXb2e9Nm.js";
var U = {
  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
}, v = "px", _ = (e) => typeof e == "number" || typeof e == "string";
function F(e) {
  return e.replace(/[A-Z]/g, (t) => `-${t.toLowerCase()}`);
}
function N(e, t, r = v) {
  if (typeof t != "string" && typeof t != "number")
    throw new Error(
      "Invalid input: value of 'cssProperties' must be string or number."
    );
  const n = U[e] === 1;
  if (typeof t == "string" || t === 0 || n)
    return `${t}`;
  const o = (typeof r == "string" ? r : r[e]) || v;
  return `${t}${o}`;
}
function W(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]) => `${F(n)}:${N(
      n,
      o,
      t == null ? void 0 : t.unit
    )}${r};`
  ).join("");
}
function D(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 W(e, typeof t == "boolean" ? {
    important: t
  } : t);
}
const G = {
  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"
}, q = "[react-output-target]", u = (e) => typeof e == "string" || typeof e == "number" || typeof e == "boolean", y = (e) => e == null, C = (e) => Array.isArray(e), B = (e) => !!e && /^\s*class\s+/.test(e.toString()), V = (e) => !!e && typeof e == "object" && "_payload" in e, X = (e) => async ({ children: t, ...r } = {}) => {
  if (!("process" in globalThis) || typeof window < "u")
    throw new Error("`createComponentForServerSideRendering` can only be run on the server");
  let n = "";
  for (const [a, i] of Object.entries(r)) {
    if (typeof i == "boolean" && i === !1)
      continue;
    let l = u(i) ? `"${i}"` : typeof i != "function" ? e.serializeProperty(i) : void 0;
    if (a === "style" && typeof i == "object" && i && (l = `"${D(i)}"`), !l)
      continue;
    const d = G[a] || e.properties[a] || a;
    n += ` ${d}=${l}`;
  }
  let o = "";
  const p = e.transformTag ? e.transformTag(e.tagName) : e.tagName, S = `<${p}${n} suppressHydrationWarning="true">`, E = console.error;
  try {
    process.env.STENCIL_SSR_DEBUG || (console.error = () => {
    });
    const a = await h(t), { renderToString: i } = await import("react-dom/server");
    o = i(a).replace(/\n\s+/g, "");
  } catch (a) {
    if (process.env.STENCIL_SSR_DEBUG) {
      const i = a instanceof Error ? a : new Error("Unknown error");
      console.warn(
        `${q} Failed to serialize light DOM for ${S.slice(0, -1)} />: ${i.message} - this may impact the hydration of the component`
      );
    }
  } finally {
    console.error = E;
  }
  const z = `${S}${o}</${p}>`, { html: f, styles: x } = await e.renderToString(z, {
    fullDocument: !1,
    serializeShadowRoot: e.serializeShadowRoot ?? "declarative-shadow-dom",
    prettyHtml: !0
  });
  if (!f)
    throw new Error("No HTML returned from renderToString");
  const c = f.split(`
`), P = "<!--r.1-->", b = c[1].includes('shadowrootmode="open"'), R = c[1].includes("shadowrootdelegatesfocus");
  let w;
  b && (w = c.slice(2, c.lastIndexOf("  </template>")).join(`
`).trim());
  const { default: $ } = await import("html-react-parser"), O = $, L = () => O(f, {
    transform(a, i) {
      if ("name" in i && (i.name === p || i.name === e.tagName)) {
        const l = a.props, d = `${p}`;
        if (!b) {
          const { children: Y, ...M } = l || {}, H = c.slice(1, -1).join(`
`).trim().replace(new RegExp("(?<=>)\\s+(?=<)", "g"), "").replace(/\n\s+/g, ""), I = x.length > 0 && x.map((m, A) => /* @__PURE__ */ s.createElement(
            "style",
            {
              href: `stencil-${m.id || e.tagName}`,
              key: m.id || A,
              id: m.id,
              precedence: "stencil",
              suppressHydrationWarning: !0,
              dangerouslySetInnerHTML: { __html: m.content || "" }
            }
          ));
          return /* @__PURE__ */ s.createElement(j, null, I, /* @__PURE__ */ s.createElement(d, { ...M, suppressHydrationWarning: !0, dangerouslySetInnerHTML: { __html: H } }));
        }
        return /* @__PURE__ */ s.createElement(d, { ...l, suppressHydrationWarning: !0 }, /* @__PURE__ */ s.createElement(
          "template",
          {
            shadowrootmode: "open",
            ...R ? { shadowrootdelegatesfocus: "" } : {},
            suppressHydrationWarning: !0,
            dangerouslySetInnerHTML: { __html: P + w }
          }
        ), t);
      }
    }
  });
  return /* @__PURE__ */ s.createElement(L, null);
};
async function h(e) {
  return u(e) || y(e) ? e : (C(e) || (e = [e]), Promise.all(
    Array.from(e).map(async (t) => {
      if (u(t) || y(t))
        return t;
      if (C(t))
        return h(t);
      if (!s.isValidElement(t))
        return t;
      const { type: r, props: n } = t;
      return {
        ...t,
        props: {
          ...n,
          children: await h(n.children)
        },
        type: await k(r, n)
      };
    })
  ));
}
const k = async (e, t) => {
  let r = null;
  if (typeof e == "string")
    return e;
  if (B(e)) {
    const n = new e(t);
    r = n.render ? n.render() : n;
  } else if (V(e)) {
    const n = e._payload, { default: o } = n._status === -1 ? await n._result() : n._result;
    r = await k(o, t);
  } else typeof e != "object" && (r = await e(t));
  return !y(r) && !u(r) && typeof r == "object" && r !== null && "type" in r && (r = await k(r.type, t)), r;
};
let g = null;
const J = (e) => {
  if (typeof window < "u") {
    if (e.clientModule)
      return e.clientModule;
    if (T)
      return T({
        tagName: e.tagName,
        properties: e.properties
      });
  }
  return async (t) => {
    let r = !1;
    g || (g = await e.hydrateModule, r = !0);
    const n = g;
    if (e.getTagTransformer && r) {
      const o = e.getTagTransformer();
      o && n.setTagTransformer(o);
    }
    return e.transformTag = n.transformTag, X({
      renderToString: n.renderToString,
      serializeProperty: n.serializeProperty,
      ...e
    })(t);
  };
};
export {
  J as createComponent
};
//# sourceMappingURL=ssr.js.map