SolidJS web components is overriding jQuery

[mhamri]

I'm trying to use a SolidJS web component alongside a legacy application and gradually convert it piece by piece to SolidJS.

Unfortunately, after building and including the script, jQuery stopped working.

As demonstrated in the attached image, as soon as SolidJS is added to the application, jQuery stops working.

My assumption is that web components shouldn’t affect any library or global variables when they are added to the page.

my web component doesn't include any package or any code defining $. as you can see in below generated code $ is set to nulll somewhere

in case if this would help

Details

(function(){const t=document.createElement("link").relList;if(t&&t.supports&&t.supports("modulepreload"))return;for(const n of document.querySelectorAll('link[rel="modulepreload"]'))r(n);new MutationObserver(n=>{for(const i of n)if(i.type==="childList")for(const o of i.addedNodes)o.tagName==="LINK"&&o.rel==="modulepreload"&&r(o)}).observe(document,{childList:!0,subtree:!0});function s(n){const i={};return n.integrity&&(i.integrity=n.integrity),n.referrerPolicy&&(i.referrerPolicy=n.referrerPolicy),n.crossOrigin==="use-credentials"?i.credentials="include":n.crossOrigin==="anonymous"?i.credentials="omit":i.credentials="same-origin",i}function r(n){if(n.ep)return;n.ep=!0;const i=s(n);fetch(n.href,i)}})();const X=!1,Y=(e,t)=>e===t,O={equals:Y};let D=G;const y=1,x=2,V={owned:null,cleanups:null,context:null,owner:null};var d=null;let $=null,ee=null,a=null,h=null,g=null,N=0;function te(e,t){const s=a,r=d,n=e.length===0,i=t===void 0?r:t,o=n?V:{owned:null,cleanups:null,context:i?i.context:null,owner:i},l=n?e:()=>e(()=>T(()=>S(o)));d=o,a=null;try{return m(l,!0)}finally{a=s,d=r}}function se(e,t){t=t?Object.assign({},O,t):O;const s={value:e,observers:null,observerSlots:null,comparator:t.equals||void 0},r=n=>(typeof n=="function"&&(n=n(s.value)),U(s,n));return[F.bind(s),r]}function v(e,t,s){const r=k(e,t,!1,y);L(r)}function ne(e,t,s){s=s?Object.assign({},O,s):O;const r=k(e,t,!0,0);return r.observers=null,r.observerSlots=null,r.comparator=s.equals||void 0,L(r),F.bind(r)}function T(e){if(a===null)return e();const t=a;a=null;try{return e()}finally{a=t}}function F(){if(this.sources&&this.state)if(this.state===y)L(this);else{const e=h;h=null,m(()=>P(this),!1),h=e}if(a){const e=this.observers?this.observers.length:0;a.sources?(a.sources.push(this),a.sourceSlots.push(e)):(a.sources=[this],a.sourceSlots=[e]),this.observers?(this.observers.push(a),this.observerSlots.push(a.sources.length-1)):(this.observers=[a],this.observerSlots=[a.sources.length-1])}return this.value}function U(e,t,s){let r=e.value;return(!e.comparator||!e.comparator(r,t))&&(e.value=t,e.observers&&e.observers.length&&m(()=>{for(let n=0;n1e6)throw h=[],new Error},!1)),t}function L(e){if(!e.fn)return;S(e);const t=N;re(e,e.value,t)}function re(e,t,s){let r;const n=d,i=a;a=d=e;try{r=e.fn(t)}catch(o){return e.pure&&(e.state=y,e.owned&&e.owned.forEach(S),e.owned=null),e.updatedAt=s+1,J(o)}finally{a=i,d=n}(!e.updatedAt||e.updatedAt<=s)&&(e.updatedAt!=null&&"observers"in e?U(e,r):e.value=r,e.updatedAt=s)}function k(e,t,s,r=y,n){const i={fn:e,state:r,updatedAt:null,owned:null,sources:null,sourceSlots:null,cleanups:null,value:t,owner:d,context:d?d.context:null,pure:s};return d===null||d!==V&&(d.owned?d.owned.push(i):d.owned=[i]),i}function q(e){if(e.state===0)return;if(e.state===x)return P(e);if(e.suspense&&T(e.suspense.inFallback))return e.suspense.effects.push(e);const t=[e];for(;(e=e.owner)&&(!e.updatedAt||e.updatedAt=0;s--)if(e=t[s],e.state===y)L(e);else if(e.state===x){const r=h;h=null,m(()=>P(e,t[0]),!1),h=r}}function m(e,t){if(h)return e();let s=!1;t||(h=[]),g?s=!0:g=[],N++;try{const r=e();return ie(s),r}catch(r){s||(g=null),h=null,J(r)}}function ie(e){if(h&&(G(h),h=null),e)return;const t=g;g=null,t.length&&m(()=>D(t),!1)}function G(e){for(let t=0;t=0;t--)S(e.tOwned[t]);delete e.tOwned}if(e.owned){for(t=e.owned.length-1;t>=0;t--)S(e.owned[t]);e.owned=null}if(e.cleanups){for(t=e.cleanups.length-1;t>=0;t--)e.cleanups[t]();e.cleanups=null}e.state=0}function le(e){return e instanceof Error?e:new Error(typeof e=="string"?e:"Unknown error",{cause:e})}function J(e,t=d){throw le(e)}function oe(e,t){return T(()=>e(t||{}))}function ue(e,t,s){let r=s.length,n=t.length,i=r,o=0,l=0,c=t[n-1].nextSibling,u=null;for(;of-l){const A=t[o];for(;l{const l=document.createElement("template");return l.innerHTML=e,l.content.firstChild},o=()=>(n||(n=i())).cloneNode(!0);return o.cloneNode=o,o}function R(e,t,s){s==null?e.removeAttribute(t):e.setAttribute(t,s)}function K(e,t){t==null?e.removeAttribute("class"):e.className=t}function ce(e,t,s){return T(()=>e(t,s))}function B(e,t,s,r){if(s!==void 0&&!r&&(r=[]),typeof t!="function")return j(e,t,r,s);v(n=>j(e,t(),n,s),r)}function j(e,t,s,r,n){for(;typeof s=="function";)s=s();if(t===s)return s;const i=typeof t,o=r!==void 0;if(e=o&&s[0]&&s[0].parentNode||e,i==="string"||i==="number"){if(i==="number"&&(t=t.toString(),t===s))return s;if(o){let l=s[0];l&&l.nodeType===3?l.data!==t&&(l.data=t):l=document.createTextNode(t),s=_(e,s,r,l)}else s!==""&&typeof s=="string"?s=e.firstChild.data=t:s=e.textContent=t}else if(t==null||i==="boolean")s=_(e,s,r);else{if(i==="function")return v(()=>{let l=t();for(;typeof l=="function";)l=l();s=j(e,l,s,r)}),()=>s;if(Array.isArray(t)){const l=[],c=s&&Array.isArray(s);if(M(l,t,s,n))return v(()=>s=j(e,l,s,r,!0)),()=>s;if(l.length===0){if(s=_(e,s,r),o)return s}else c?s.length===0?z(e,l,r):ue(e,s,l):(s&&_(e),z(e,l));s=l}else if(t.nodeType){if(Array.isArray(s)){if(o)return s=_(e,s,r,t);_(e,s,null,t)}else s==null||s===""||!e.firstChild?e.appendChild(t):e.replaceChild(t,e.firstChild);s=t}}return s}function M(e,t,s,r){let n=!1;for(let i=0,o=t.length;i=0;o--){const l=t[o];if(n!==l){const c=l.parentNode===e;!i&&!o?c?e.replaceChild(n,l):e.insertBefore(n,s):c&&l.remove()}else i=!0}}else e.insertBefore(n,s);return[n]}function fe(e){return Object.keys(e).reduce((s,r)=>{const n=e[r];return s[r]=Object.assign({},n),Z(n.value)&&!ge(n.value)&&!Array.isArray(n.value)&&(s[r].value=Object.assign({},n.value)),Array.isArray(n.value)&&(s[r].value=n.value.slice(0)),s},{})}function ae(e){return e?Object.keys(e).reduce((s,r)=>{const n=e[r];return s[r]=Z(n)&&"value"in n?n:{value:n},s[r].attribute||(s[r].attribute=pe(r)),s[r].parse="parse"in s[r]?s[r].parse:typeof s[r].value!="string",s},{}):{}}function he(e){return Object.keys(e).reduce((s,r)=>(s[r]=e[r].value,s),{})}function de(e,t){const s=fe(t);return Object.keys(t).forEach(n=>{const i=s[n],o=e.getAttribute(i.attribute),l=e[n];o!=null&&(i.value=i.parse?W(o):o),l!=null&&(i.value=Array.isArray(l)?l.slice(0):l),i.reflect&&I(e,i.attribute,i.value,!!i.parse),Object.defineProperty(e,n,{get(){return i.value},set(c){const u=i.value;i.value=c,i.reflect&&I(this,i.attribute,i.value,!!i.parse);for(let f=0,p=this.__propertyChangedCallbacks.length;fdelete e.__updating[t])}function pe(e){return e.replace(/\.?([A-Z]+)/g,(t,s)=>"-"+s.toLowerCase()).replace("_","-").replace(/^-/,"")}function Z(e){return e!=null&&(typeof e=="object"||typeof e=="function")}function ge(e){return Object.prototype.toString.call(e)==="[object Function]"}function ye(e){return typeof e=="function"&&e.toString().indexOf("class")===0}let C;function be(){Object.defineProperty(C,"renderRoot",{value:C})}function _e(e,t){const s=Object.keys(t);return class extends e{static get observedAttributes(){return s.map(n=>t[n].attribute)}constructor(){super(),this.__initialized=!1,this.__released=!1,this.__releaseCallbacks=[],this.__propertyChangedCallbacks=[],this.__updating={},this.props={}}connectedCallback(){if(this.__initialized)return;this.__releaseCallbacks=[],this.__propertyChangedCallbacks=[],this.__updating={},this.props=de(this,t);const n=he(this.props),i=this.Component,o=C;try{C=this,this.__initialized=!0,ye(i)?new i(n,{element:this}):i(n,{element:this})}finally{C=o}}async disconnectedCallback(){if(await Promise.resolve(),this.isConnected)return;this.__propertyChangedCallbacks.length=0;let n=null;for(;n=this.__releaseCallbacks.pop();)n(this);delete this.__initialized,this.__released=!0}attributeChangedCallback(n,i,o){if(this.__initialized&&!this.__updating[n]&&(n=this.lookupProp(n),n in t)){if(o==null&&!this[n])return;this[n]=t[n].parse?W(o):o}}lookupProp(n){if(t)return s.find(i=>n===i||n===t[i].attribute)}get renderRoot(){return this.shadowRoot||this.attachShadow({mode:"open"})}addReleaseCallback(n){this.__releaseCallbacks.push(n)}addPropertyChangedCallback(n){this.__propertyChangedCallbacks.push(n)}}}function we(e,t={},s={}){const{BaseElement:r=HTMLElement,extension:n,customElements:i=window.customElements}=s;return o=>{let l=i.get(e);return l?(l.prototype.Component=o,l):(l=_e(r,ae(t)),l.prototype.Component=o,l.prototype.registeredTag=e,i.define(e,l,n),l)}}function Ce(e){const t=Object.keys(e),s={};for(let r=0;ro)}})}return s}function ve(e){if(e.assignedSlot&&e.assignedSlot._$owner)return e.assignedSlot._$owner;let t=e.parentNode;for(;t&&!t._$owner&&!(t.assignedSlot&&t.assignedSlot._$owner);)t=t.parentNode;return t&&t.assignedSlot?t.assignedSlot._$owner:e._$owner}function Se(e){return(t,s)=>{const{element:r}=s;return te(n=>{const i=Ce(t);r.addPropertyChangedCallback((l,c)=>i[l]=c),r.addReleaseCallback(()=>{r.renderRoot.textContent="",n()});const o=e(i,s);return B(r.renderRoot,o)},ve(r))}}function me(e,t,s){return arguments.length===2&&(s=t,t={}),we(e,t)(Se(s))}const Ae="_root_4gc8u_5",Ee="_card_4gc8u_27",Oe="_mizi_4gc8u_50",xe="_small_4gc8u_63",E={root:Ae,card:Ee,mizi:Oe,small:xe};var Pe=Q("

"),je=Q("");const Ne=e=>{console.log(e);let t;function s(){globalThis.SVGInject(t)}return(()=>{var r=Pe(),n=r.firstChild,i=n.firstChild,o=i.firstChild,l=i.nextSibling,c=t;return typeof c=="function"?ce(c,o):t=o,o.addEventListener("load",s),B(l,()=>e.title),B(n,(()=>{var u=ne(()=>!!e.link);return()=>u()&&(()=>{var f=je();return v(()=>R(f,"href",e.link)),f})()})(),null),v(u=>{var f=E.root,p=E.card,b=`${E.mizi} ${e.small&&E.small}`,w=e.img,A=e.title;return f!==u.e&&K(r,u.e=f),p!==u.t&&K(n,u.t=p),b!==u.a&&K(i,u.a=b),w!==u.o&&R(o,"src",u.o=w),A!==u.i&&R(o,"alt",u.i=A),u},{e:void 0,t:void 0,a:void 0,o:void 0,i:void 0}),r})()};me("company-card",{title:null,link:null,small:!0,img:void 0},(e,{element:t})=>(be(),oe(Ne,e)));

[atk]

Is window.jQuery defined? In that case, you could wrap your code in a closure:

(($) => {
  // your code
})(globalThis.jQuery);

[mhamri]

I haven’t checked yet, but we’re discussing how I need to go into six repositories and wrap every single JavaScript file in a function. 🥹

[atk]

A workaround is better than no solution... 🤞

[ryansolid]

Does this happen when minification is turned off? Solid nor Solid Element has no reason to mess with global $ but I'm wondering if this is like a weird minification that is producing a $ variable that then is shadowing context sort of issue. Something that is an artifact of the bundling process.

[mhamri]

You're right! Setting "minify" to false makes it work. I wonder if this is something I should report to the Vite team?

this is the not minified version

true&&(function polyfill() {
  const relList = document.createElement("link").relList;
  if (relList && relList.supports && relList.supports("modulepreload")) {
    return;
  }
  for (const link of document.querySelectorAll('link[rel="modulepreload"]')) {
    processPreload(link);
  }
  new MutationObserver((mutations) => {
    for (const mutation of mutations) {
      if (mutation.type !== "childList") {
        continue;
      }
      for (const node of mutation.addedNodes) {
        if (node.tagName === "LINK" && node.rel === "modulepreload")
          processPreload(node);
      }
    }
  }).observe(document, { childList: true, subtree: true });
  function getFetchOpts(link) {
    const fetchOpts = {};
    if (link.integrity) fetchOpts.integrity = link.integrity;
    if (link.referrerPolicy) fetchOpts.referrerPolicy = link.referrerPolicy;
    if (link.crossOrigin === "use-credentials")
      fetchOpts.credentials = "include";
    else if (link.crossOrigin === "anonymous") fetchOpts.credentials = "omit";
    else fetchOpts.credentials = "same-origin";
    return fetchOpts;
  }
  function processPreload(link) {
    if (link.ep)
      return;
    link.ep = true;
    const fetchOpts = getFetchOpts(link);
    fetch(link.href, fetchOpts);
  }
}());

const IS_DEV = false;
const equalFn = (a, b) => a === b;
const signalOptions = {
  equals: equalFn
};
let runEffects = runQueue;
const STALE = 1;
const PENDING = 2;
const UNOWNED = {
  owned: null,
  cleanups: null,
  context: null,
  owner: null
};
var Owner = null;
let Transition = null;
let ExternalSourceConfig = null;
let Listener = null;
let Updates = null;
let Effects = null;
let ExecCount = 0;
function createRoot(fn, detachedOwner) {
  const listener = Listener,
    owner = Owner,
    unowned = fn.length === 0,
    current = detachedOwner === undefined ? owner : detachedOwner,
    root = unowned
      ? UNOWNED
      : {
          owned: null,
          cleanups: null,
          context: current ? current.context : null,
          owner: current
        },
    updateFn = unowned ? fn : () => fn(() => untrack(() => cleanNode(root)));
  Owner = root;
  Listener = null;
  try {
    return runUpdates(updateFn, true);
  } finally {
    Listener = listener;
    Owner = owner;
  }
}
function createSignal(value, options) {
  options = options ? Object.assign({}, signalOptions, options) : signalOptions;
  const s = {
    value,
    observers: null,
    observerSlots: null,
    comparator: options.equals || undefined
  };
  const setter = value => {
    if (typeof value === "function") {
      value = value(s.value);
    }
    return writeSignal(s, value);
  };
  return [readSignal.bind(s), setter];
}
function createRenderEffect(fn, value, options) {
  const c = createComputation(fn, value, false, STALE);
  updateComputation(c);
}
function createMemo(fn, value, options) {
  options = options ? Object.assign({}, signalOptions, options) : signalOptions;
  const c = createComputation(fn, value, true, 0);
  c.observers = null;
  c.observerSlots = null;
  c.comparator = options.equals || undefined;
  updateComputation(c);
  return readSignal.bind(c);
}
function untrack(fn) {
  if (Listener === null) return fn();
  const listener = Listener;
  Listener = null;
  try {
    if (ExternalSourceConfig) ;
    return fn();
  } finally {
    Listener = listener;
  }
}
function readSignal() {
  if (this.sources && (this.state)) {
    if ((this.state) === STALE) updateComputation(this);
    else {
      const updates = Updates;
      Updates = null;
      runUpdates(() => lookUpstream(this), false);
      Updates = updates;
    }
  }
  if (Listener) {
    const sSlot = this.observers ? this.observers.length : 0;
    if (!Listener.sources) {
      Listener.sources = [this];
      Listener.sourceSlots = [sSlot];
    } else {
      Listener.sources.push(this);
      Listener.sourceSlots.push(sSlot);
    }
    if (!this.observers) {
      this.observers = [Listener];
      this.observerSlots = [Listener.sources.length - 1];
    } else {
      this.observers.push(Listener);
      this.observerSlots.push(Listener.sources.length - 1);
    }
  }
  return this.value;
}
function writeSignal(node, value, isComp) {
  let current =
    node.value;
  if (!node.comparator || !node.comparator(current, value)) {
    node.value = value;
    if (node.observers && node.observers.length) {
      runUpdates(() => {
        for (let i = 0; i < node.observers.length; i += 1) {
          const o = node.observers[i];
          const TransitionRunning = Transition && Transition.running;
          if (TransitionRunning && Transition.disposed.has(o)) ;
          if (TransitionRunning ? !o.tState : !o.state) {
            if (o.pure) Updates.push(o);
            else Effects.push(o);
            if (o.observers) markDownstream(o);
          }
          if (!TransitionRunning) o.state = STALE;
        }
        if (Updates.length > 10e5) {
          Updates = [];
          if (IS_DEV);
          throw new Error();
        }
      }, false);
    }
  }
  return value;
}
function updateComputation(node) {
  if (!node.fn) return;
  cleanNode(node);
  const time = ExecCount;
  runComputation(
    node,
    node.value,
    time
  );
}
function runComputation(node, value, time) {
  let nextValue;
  const owner = Owner,
    listener = Listener;
  Listener = Owner = node;
  try {
    nextValue = node.fn(value);
  } catch (err) {
    if (node.pure) {
      {
        node.state = STALE;
        node.owned && node.owned.forEach(cleanNode);
        node.owned = null;
      }
    }
    node.updatedAt = time + 1;
    return handleError(err);
  } finally {
    Listener = listener;
    Owner = owner;
  }
  if (!node.updatedAt || node.updatedAt <= time) {
    if (node.updatedAt != null && "observers" in node) {
      writeSignal(node, nextValue);
    } else node.value = nextValue;
    node.updatedAt = time;
  }
}
function createComputation(fn, init, pure, state = STALE, options) {
  const c = {
    fn,
    state: state,
    updatedAt: null,
    owned: null,
    sources: null,
    sourceSlots: null,
    cleanups: null,
    value: init,
    owner: Owner,
    context: Owner ? Owner.context : null,
    pure
  };
  if (Owner === null);
  else if (Owner !== UNOWNED) {
    {
      if (!Owner.owned) Owner.owned = [c];
      else Owner.owned.push(c);
    }
  }
  return c;
}
function runTop(node) {
  if ((node.state) === 0) return;
  if ((node.state) === PENDING) return lookUpstream(node);
  if (node.suspense && untrack(node.suspense.inFallback)) return node.suspense.effects.push(node);
  const ancestors = [node];
  while ((node = node.owner) && (!node.updatedAt || node.updatedAt < ExecCount)) {
    if (node.state) ancestors.push(node);
  }
  for (let i = ancestors.length - 1; i >= 0; i--) {
    node = ancestors[i];
    if ((node.state) === STALE) {
      updateComputation(node);
    } else if ((node.state) === PENDING) {
      const updates = Updates;
      Updates = null;
      runUpdates(() => lookUpstream(node, ancestors[0]), false);
      Updates = updates;
    }
  }
}
function runUpdates(fn, init) {
  if (Updates) return fn();
  let wait = false;
  if (!init) Updates = [];
  if (Effects) wait = true;
  else Effects = [];
  ExecCount++;
  try {
    const res = fn();
    completeUpdates(wait);
    return res;
  } catch (err) {
    if (!wait) Effects = null;
    Updates = null;
    handleError(err);
  }
}
function completeUpdates(wait) {
  if (Updates) {
    runQueue(Updates);
    Updates = null;
  }
  if (wait) return;
  const e = Effects;
  Effects = null;
  if (e.length) runUpdates(() => runEffects(e), false);
}
function runQueue(queue) {
  for (let i = 0; i < queue.length; i++) runTop(queue[i]);
}
function lookUpstream(node, ignore) {
  node.state = 0;
  for (let i = 0; i < node.sources.length; i += 1) {
    const source = node.sources[i];
    if (source.sources) {
      const state = source.state;
      if (state === STALE) {
        if (source !== ignore && (!source.updatedAt || source.updatedAt < ExecCount))
          runTop(source);
      } else if (state === PENDING) lookUpstream(source, ignore);
    }
  }
}
function markDownstream(node) {
  for (let i = 0; i < node.observers.length; i += 1) {
    const o = node.observers[i];
    if (!o.state) {
      o.state = PENDING;
      if (o.pure) Updates.push(o);
      else Effects.push(o);
      o.observers && markDownstream(o);
    }
  }
}
function cleanNode(node) {
  let i;
  if (node.sources) {
    while (node.sources.length) {
      const source = node.sources.pop(),
        index = node.sourceSlots.pop(),
        obs = source.observers;
      if (obs && obs.length) {
        const n = obs.pop(),
          s = source.observerSlots.pop();
        if (index < obs.length) {
          n.sourceSlots[s] = index;
          obs[index] = n;
          source.observerSlots[index] = s;
        }
      }
    }
  }
  if (node.tOwned) {
    for (i = node.tOwned.length - 1; i >= 0; i--) cleanNode(node.tOwned[i]);
    delete node.tOwned;
  }
  if (node.owned) {
    for (i = node.owned.length - 1; i >= 0; i--) cleanNode(node.owned[i]);
    node.owned = null;
  }
  if (node.cleanups) {
    for (i = node.cleanups.length - 1; i >= 0; i--) node.cleanups[i]();
    node.cleanups = null;
  }
  node.state = 0;
}
function castError(err) {
  if (err instanceof Error) return err;
  return new Error(typeof err === "string" ? err : "Unknown error", {
    cause: err
  });
}
function handleError(err, owner = Owner) {
  const error = castError(err);
  throw error;
}
function createComponent(Comp, props) {
  return untrack(() => Comp(props || {}));
}

function reconcileArrays(parentNode, a, b) {
  let bLength = b.length,
    aEnd = a.length,
    bEnd = bLength,
    aStart = 0,
    bStart = 0,
    after = a[aEnd - 1].nextSibling,
    map = null;
  while (aStart < aEnd || bStart < bEnd) {
    if (a[aStart] === b[bStart]) {
      aStart++;
      bStart++;
      continue;
    }
    while (a[aEnd - 1] === b[bEnd - 1]) {
      aEnd--;
      bEnd--;
    }
    if (aEnd === aStart) {
      const node = bEnd < bLength ? (bStart ? b[bStart - 1].nextSibling : b[bEnd - bStart]) : after;
      while (bStart < bEnd) parentNode.insertBefore(b[bStart++], node);
    } else if (bEnd === bStart) {
      while (aStart < aEnd) {
        if (!map || !map.has(a[aStart])) a[aStart].remove();
        aStart++;
      }
    } else if (a[aStart] === b[bEnd - 1] && b[bStart] === a[aEnd - 1]) {
      const node = a[--aEnd].nextSibling;
      parentNode.insertBefore(b[bStart++], a[aStart++].nextSibling);
      parentNode.insertBefore(b[--bEnd], node);
      a[aEnd] = b[bEnd];
    } else {
      if (!map) {
        map = new Map();
        let i = bStart;
        while (i < bEnd) map.set(b[i], i++);
      }
      const index = map.get(a[aStart]);
      if (index != null) {
        if (bStart < index && index < bEnd) {
          let i = aStart,
            sequence = 1,
            t;
          while (++i < aEnd && i < bEnd) {
            if ((t = map.get(a[i])) == null || t !== index + sequence) break;
            sequence++;
          }
          if (sequence > index - bStart) {
            const node = a[aStart];
            while (bStart < index) parentNode.insertBefore(b[bStart++], node);
          } else parentNode.replaceChild(b[bStart++], a[aStart++]);
        } else aStart++;
      } else a[aStart++].remove();
    }
  }
}
function template(html, isImportNode, isSVG, isMathML) {
  let node;
  const create = () => {
    const t = document.createElement("template");
    t.innerHTML = html;
    return t.content.firstChild;
  };
  const fn = () => (node || (node = create())).cloneNode(true);
  fn.cloneNode = fn;
  return fn;
}
function setAttribute(node, name, value) {
  if (value == null) node.removeAttribute(name);
  else node.setAttribute(name, value);
}
function className(node, value) {
  if (value == null) node.removeAttribute("class");
  else node.className = value;
}
function use(fn, element, arg) {
  return untrack(() => fn(element, arg));
}
function insert(parent, accessor, marker, initial) {
  if (marker !== undefined && !initial) initial = [];
  if (typeof accessor !== "function") return insertExpression(parent, accessor, initial, marker);
  createRenderEffect(current => insertExpression(parent, accessor(), current, marker), initial);
}
function insertExpression(parent, value, current, marker, unwrapArray) {
  while (typeof current === "function") current = current();
  if (value === current) return current;
  const t = typeof value,
    multi = marker !== undefined;
  parent = (multi && current[0] && current[0].parentNode) || parent;
  if (t === "string" || t === "number") {
    if (t === "number") {
      value = value.toString();
      if (value === current) return current;
    }
    if (multi) {
      let node = current[0];
      if (node && node.nodeType === 3) {
        node.data !== value && (node.data = value);
      } else node = document.createTextNode(value);
      current = cleanChildren(parent, current, marker, node);
    } else {
      if (current !== "" && typeof current === "string") {
        current = parent.firstChild.data = value;
      } else current = parent.textContent = value;
    }
  } else if (value == null || t === "boolean") {
    current = cleanChildren(parent, current, marker);
  } else if (t === "function") {
    createRenderEffect(() => {
      let v = value();
      while (typeof v === "function") v = v();
      current = insertExpression(parent, v, current, marker);
    });
    return () => current;
  } else if (Array.isArray(value)) {
    const array = [];
    const currentArray = current && Array.isArray(current);
    if (normalizeIncomingArray(array, value, current, unwrapArray)) {
      createRenderEffect(() => (current = insertExpression(parent, array, current, marker, true)));
      return () => current;
    }
    if (array.length === 0) {
      current = cleanChildren(parent, current, marker);
      if (multi) return current;
    } else if (currentArray) {
      if (current.length === 0) {
        appendNodes(parent, array, marker);
      } else reconcileArrays(parent, current, array);
    } else {
      current && cleanChildren(parent);
      appendNodes(parent, array);
    }
    current = array;
  } else if (value.nodeType) {
    if (Array.isArray(current)) {
      if (multi) return (current = cleanChildren(parent, current, marker, value));
      cleanChildren(parent, current, null, value);
    } else if (current == null || current === "" || !parent.firstChild) {
      parent.appendChild(value);
    } else parent.replaceChild(value, parent.firstChild);
    current = value;
  } else;
  return current;
}
function normalizeIncomingArray(normalized, array, current, unwrap) {
  let dynamic = false;
  for (let i = 0, len = array.length; i < len; i++) {
    let item = array[i],
      prev = current && current[normalized.length],
      t;
    if (item == null || item === true || item === false);
    else if ((t = typeof item) === "object" && item.nodeType) {
      normalized.push(item);
    } else if (Array.isArray(item)) {
      dynamic = normalizeIncomingArray(normalized, item, prev) || dynamic;
    } else if (t === "function") {
      if (unwrap) {
        while (typeof item === "function") item = item();
        dynamic =
          normalizeIncomingArray(
            normalized,
            Array.isArray(item) ? item : [item],
            Array.isArray(prev) ? prev : [prev]
          ) || dynamic;
      } else {
        normalized.push(item);
        dynamic = true;
      }
    } else {
      const value = String(item);
      if (prev && prev.nodeType === 3 && prev.data === value) normalized.push(prev);
      else normalized.push(document.createTextNode(value));
    }
  }
  return dynamic;
}
function appendNodes(parent, array, marker = null) {
  for (let i = 0, len = array.length; i < len; i++) parent.insertBefore(array[i], marker);
}
function cleanChildren(parent, current, marker, replacement) {
  if (marker === undefined) return (parent.textContent = "");
  const node = replacement || document.createTextNode("");
  if (current.length) {
    let inserted = false;
    for (let i = current.length - 1; i >= 0; i--) {
      const el = current[i];
      if (node !== el) {
        const isParent = el.parentNode === parent;
        if (!inserted && !i)
          isParent ? parent.replaceChild(node, el) : parent.insertBefore(node, marker);
        else isParent && el.remove();
      } else inserted = true;
    }
  } else parent.insertBefore(node, marker);
  return [node];
}

function cloneProps(props) {
  const propKeys = Object.keys(props);
  return propKeys.reduce((memo, k) => {
    const prop = props[k];
    memo[k] = Object.assign({}, prop);
    if (isObject(prop.value) && !isFunction(prop.value) && !Array.isArray(prop.value)) memo[k].value = Object.assign({}, prop.value);
    if (Array.isArray(prop.value)) memo[k].value = prop.value.slice(0);
    return memo;
  }, {});
}
function normalizePropDefs(props) {
  if (!props) return {};
  const propKeys = Object.keys(props);
  return propKeys.reduce((memo, k) => {
    const v = props[k];
    memo[k] = !(isObject(v) && "value" in v) ? {
      value: v
    } : v;
    memo[k].attribute || (memo[k].attribute = toAttribute(k));
    memo[k].parse = "parse" in memo[k] ? memo[k].parse : typeof memo[k].value !== "string";
    return memo;
  }, {});
}
function propValues(props) {
  const propKeys = Object.keys(props);
  return propKeys.reduce((memo, k) => {
    memo[k] = props[k].value;
    return memo;
  }, {});
}
function initializeProps(element, propDefinition) {
  const props = cloneProps(propDefinition),
    propKeys = Object.keys(propDefinition);
  propKeys.forEach(key => {
    const prop = props[key],
      attr = element.getAttribute(prop.attribute),
      value = element[key];
    if (attr != null) prop.value = prop.parse ? parseAttributeValue(attr) : attr;
    if (value != null) prop.value = Array.isArray(value) ? value.slice(0) : value;
    prop.reflect && reflect(element, prop.attribute, prop.value, !!prop.parse);
    Object.defineProperty(element, key, {
      get() {
        return prop.value;
      },
      set(val) {
        const oldValue = prop.value;
        prop.value = val;
        prop.reflect && reflect(this, prop.attribute, prop.value, !!prop.parse);
        for (let i = 0, l = this.__propertyChangedCallbacks.length; i < l; i++) {
          this.__propertyChangedCallbacks[i](key, val, oldValue);
        }
      },
      enumerable: true,
      configurable: true
    });
  });
  return props;
}
function parseAttributeValue(value) {
  if (!value) return;
  try {
    return JSON.parse(value);
  } catch (err) {
    return value;
  }
}
function reflect(node, attribute, value, parse) {
  if (value == null || value === false) return node.removeAttribute(attribute);
  let reflect = parse ? JSON.stringify(value) : value;
  node.__updating[attribute] = true;
  if (reflect === "true") reflect = "";
  node.setAttribute(attribute, reflect);
  Promise.resolve().then(() => delete node.__updating[attribute]);
}
function toAttribute(propName) {
  return propName.replace(/\.?([A-Z]+)/g, (x, y) => "-" + y.toLowerCase()).replace("_", "-").replace(/^-/, "");
}
function isObject(obj) {
  return obj != null && (typeof obj === "object" || typeof obj === "function");
}
function isFunction(val) {
  return Object.prototype.toString.call(val) === "[object Function]";
}
function isConstructor(f) {
  return typeof f === "function" && f.toString().indexOf("class") === 0;
}

let currentElement;
function noShadowDOM() {
  Object.defineProperty(currentElement, "renderRoot", {
    value: currentElement
  });
}
function createElementType(BaseElement, propDefinition) {
  const propKeys = Object.keys(propDefinition);
  return class CustomElement extends BaseElement {
    static get observedAttributes() {
      return propKeys.map(k => propDefinition[k].attribute);
    }
    constructor() {
      super();
      this.__initialized = false;
      this.__released = false;
      this.__releaseCallbacks = [];
      this.__propertyChangedCallbacks = [];
      this.__updating = {};
      this.props = {};
    }
    connectedCallback() {
      if (this.__initialized) return;
      this.__releaseCallbacks = [];
      this.__propertyChangedCallbacks = [];
      this.__updating = {};
      this.props = initializeProps(this, propDefinition);
      const props = propValues(this.props),
        ComponentType = this.Component,
        outerElement = currentElement;
      try {
        currentElement = this;
        this.__initialized = true;
        if (isConstructor(ComponentType)) new ComponentType(props, {
          element: this
        });else ComponentType(props, {
          element: this
        });
      } finally {
        currentElement = outerElement;
      }
    }
    async disconnectedCallback() {
      // prevent premature releasing when element is only temporarely removed from DOM
      await Promise.resolve();
      if (this.isConnected) return;
      this.__propertyChangedCallbacks.length = 0;
      let callback = null;
      while (callback = this.__releaseCallbacks.pop()) callback(this);
      delete this.__initialized;
      this.__released = true;
    }
    attributeChangedCallback(name, oldVal, newVal) {
      if (!this.__initialized) return;
      if (this.__updating[name]) return;
      name = this.lookupProp(name);
      if (name in propDefinition) {
        if (newVal == null && !this[name]) return;
        this[name] = propDefinition[name].parse ? parseAttributeValue(newVal) : newVal;
      }
    }
    lookupProp(attrName) {
      if (!propDefinition) return;
      return propKeys.find(k => attrName === k || attrName === propDefinition[k].attribute);
    }
    get renderRoot() {
      return this.shadowRoot || this.attachShadow({
        mode: "open"
      });
    }
    addReleaseCallback(fn) {
      this.__releaseCallbacks.push(fn);
    }
    addPropertyChangedCallback(fn) {
      this.__propertyChangedCallbacks.push(fn);
    }
  };
}

function register(tag, props = {}, options = {}) {
  const {
    BaseElement = HTMLElement,
    extension,
    customElements = window.customElements
  } = options;
  return ComponentType => {
    let ElementType = customElements.get(tag);
    if (ElementType) {
      // Consider disabling this in a production mode
      ElementType.prototype.Component = ComponentType;
      return ElementType;
    }
    ElementType = createElementType(BaseElement, normalizePropDefs(props));
    ElementType.prototype.Component = ComponentType;
    ElementType.prototype.registeredTag = tag;
    customElements.define(tag, ElementType, extension);
    return ElementType;
  };
}

function createProps(raw) {
  const keys = Object.keys(raw);
  const props = {};
  for (let i = 0; i < keys.length; i++) {
    const [get, set] = createSignal(raw[keys[i]]);
    Object.defineProperty(props, keys[i], {
      get,
      set(v) {
        set(() => v);
      }
    });
  }
  return props;
}
function lookupContext(el) {
  if (el.assignedSlot && el.assignedSlot._$owner) return el.assignedSlot._$owner;
  let next = el.parentNode;
  while (next && !next._$owner && !(next.assignedSlot && next.assignedSlot._$owner))
    next = next.parentNode;
  return next && next.assignedSlot ? next.assignedSlot._$owner : el._$owner;
}
function withSolid(ComponentType) {
  return (rawProps, options) => {
    const { element } = options;
    return createRoot(dispose => {
      const props = createProps(rawProps);
      element.addPropertyChangedCallback((key, val) => (props[key] = val));
      element.addReleaseCallback(() => {
        element.renderRoot.textContent = "";
        dispose();
      });
      const comp = ComponentType(props, options);
      return insert(element.renderRoot, comp);
    }, lookupContext(element));
  };
}
function customElement(tag, props, ComponentType) {
  if (arguments.length === 2) {
    ComponentType = props;
    props = {};
  }
  return register(tag, props)(withSolid(ComponentType));
}

const root = "_root_4gc8u_5";
const card = "_card_4gc8u_27";
const mizi = "_mizi_4gc8u_50";
const small = "_small_4gc8u_63";
const styles = {
	root: root,
	card: card,
	mizi: mizi,
	small: small
};

var _tmpl$ = /* @__PURE__ */ template(`<div><div><i><img></i><h4>`), _tmpl$2 = /* @__PURE__ */ template(`<a title=props.title>`);
const Card = (props) => {
  console.log(props);
  let imageRef;
  function SVGInject() {
    globalThis.SVGInject(imageRef);
  }
  return (() => {
    var _el$ = _tmpl$(), _el$2 = _el$.firstChild, _el$3 = _el$2.firstChild, _el$4 = _el$3.firstChild, _el$5 = _el$3.nextSibling;
    var _ref$ = imageRef;
    typeof _ref$ === "function" ? use(_ref$, _el$4) : imageRef = _el$4;
    _el$4.addEventListener("load", SVGInject);
    insert(_el$5, () => props.title);
    insert(_el$2, (() => {
      var _c$ = createMemo(() => !!props.link);
      return () => _c$() && (() => {
        var _el$6 = _tmpl$2();
        createRenderEffect(() => setAttribute(_el$6, "href", props.link));
        return _el$6;
      })();
    })(), null);
    createRenderEffect((_p$) => {
      var _v$ = styles.root, _v$2 = styles.card, _v$3 = `${styles.mizi} ${props.small && styles.small}`, _v$4 = props.img, _v$5 = props.title;
      _v$ !== _p$.e && className(_el$, _p$.e = _v$);
      _v$2 !== _p$.t && className(_el$2, _p$.t = _v$2);
      _v$3 !== _p$.a && className(_el$3, _p$.a = _v$3);
      _v$4 !== _p$.o && setAttribute(_el$4, "src", _p$.o = _v$4);
      _v$5 !== _p$.i && setAttribute(_el$4, "alt", _p$.i = _v$5);
      return _p$;
    }, {
      e: void 0,
      t: void 0,
      a: void 0,
      o: void 0,
      i: void 0
    });
    return _el$;
  })();
};
customElement("company-card", {
  title: null,
  link: null,
  small: true,
  img: void 0
}, (props, {
  element
}) => {
  noShadowDOM();
  return createComponent(Card, props);
});

and this is minifed (beautified) version

(function() {
    const t = document.createElement("link").relList;
    if (t && t.supports && t.supports("modulepreload")) return;
    for (const n of document.querySelectorAll('link[rel="modulepreload"]')) r(n);
    new MutationObserver(n => {
        for (const i of n)
            if (i.type === "childList")
                for (const o of i.addedNodes) o.tagName === "LINK" && o.rel === "modulepreload" && r(o)
    }).observe(document, {
        childList: !0,
        subtree: !0
    });

    function s(n) {
        const i = {};
        return n.integrity && (i.integrity = n.integrity), n.referrerPolicy && (i.referrerPolicy = n.referrerPolicy), n.crossOrigin === "use-credentials" ? i.credentials = "include" : n.crossOrigin === "anonymous" ? i.credentials = "omit" : i.credentials = "same-origin", i
    }

    function r(n) {
        if (n.ep) return;
        n.ep = !0;
        const i = s(n);
        fetch(n.href, i)
    }
})();
const X = !1,
    Y = (e, t) => e === t,
    O = {
        equals: Y
    };
let D = G;
const y = 1,
    x = 2,
    V = {
        owned: null,
        cleanups: null,
        context: null,
        owner: null
    };
var d = null;
let $ = null,
    ee = null,
    a = null,
    h = null,
    g = null,
    N = 0;

function te(e, t) {
    const s = a,
        r = d,
        n = e.length === 0,
        i = t === void 0 ? r : t,
        o = n ? V : {
            owned: null,
            cleanups: null,
            context: i ? i.context : null,
            owner: i
        },
        l = n ? e : () => e(() => T(() => S(o)));
    d = o, a = null;
    try {
        return m(l, !0)
    } finally {
        a = s, d = r
    }
}

function se(e, t) {
    t = t ? Object.assign({}, O, t) : O;
    const s = {
            value: e,
            observers: null,
            observerSlots: null,
            comparator: t.equals || void 0
        },
        r = n => (typeof n == "function" && (n = n(s.value)), U(s, n));
    return [F.bind(s), r]
}

function v(e, t, s) {
    const r = k(e, t, !1, y);
    L(r)
}

function ne(e, t, s) {
    s = s ? Object.assign({}, O, s) : O;
    const r = k(e, t, !0, 0);
    return r.observers = null, r.observerSlots = null, r.comparator = s.equals || void 0, L(r), F.bind(r)
}

function T(e) {
    if (a === null) return e();
    const t = a;
    a = null;
    try {
        return e()
    } finally {
        a = t
    }
}

function F() {
    if (this.sources && this.state)
        if (this.state === y) L(this);
        else {
            const e = h;
            h = null, m(() => P(this), !1), h = e
        } if (a) {
        const e = this.observers ? this.observers.length : 0;
        a.sources ? (a.sources.push(this), a.sourceSlots.push(e)) : (a.sources = [this], a.sourceSlots = [e]), this.observers ? (this.observers.push(a), this.observerSlots.push(a.sources.length - 1)) : (this.observers = [a], this.observerSlots = [a.sources.length - 1])
    }
    return this.value
}

function U(e, t, s) {
    let r = e.value;
    return (!e.comparator || !e.comparator(r, t)) && (e.value = t, e.observers && e.observers.length && m(() => {
        for (let n = 0; n < e.observers.length; n += 1) {
            const i = e.observers[n],
                o = $ && $.running;
            o && $.disposed.has(i), (o ? !i.tState : !i.state) && (i.pure ? h.push(i) : g.push(i), i.observers && H(i)), o || (i.state = y)
        }
        if (h.length > 1e6) throw h = [], new Error
    }, !1)), t
}

function L(e) {
    if (!e.fn) return;
    S(e);
    const t = N;
    re(e, e.value, t)
}

function re(e, t, s) {
    let r;
    const n = d,
        i = a;
    a = d = e;
    try {
        r = e.fn(t)
    } catch (o) {
        return e.pure && (e.state = y, e.owned && e.owned.forEach(S), e.owned = null), e.updatedAt = s + 1, J(o)
    } finally {
        a = i, d = n
    }(!e.updatedAt || e.updatedAt <= s) && (e.updatedAt != null && "observers" in e ? U(e, r) : e.value = r, e.updatedAt = s)
}

function k(e, t, s, r = y, n) {
    const i = {
        fn: e,
        state: r,
        updatedAt: null,
        owned: null,
        sources: null,
        sourceSlots: null,
        cleanups: null,
        value: t,
        owner: d,
        context: d ? d.context : null,
        pure: s
    };
    return d === null || d !== V && (d.owned ? d.owned.push(i) : d.owned = [i]), i
}

function q(e) {
    if (e.state === 0) return;
    if (e.state === x) return P(e);
    if (e.suspense && T(e.suspense.inFallback)) return e.suspense.effects.push(e);
    const t = [e];
    for (;
        (e = e.owner) && (!e.updatedAt || e.updatedAt < N);) e.state && t.push(e);
    for (let s = t.length - 1; s >= 0; s--)
        if (e = t[s], e.state === y) L(e);
        else if (e.state === x) {
        const r = h;
        h = null, m(() => P(e, t[0]), !1), h = r
    }
}

function m(e, t) {
    if (h) return e();
    let s = !1;
    t || (h = []), g ? s = !0 : g = [], N++;
    try {
        const r = e();
        return ie(s), r
    } catch (r) {
        s || (g = null), h = null, J(r)
    }
}

function ie(e) {
    if (h && (G(h), h = null), e) return;
    const t = g;
    g = null, t.length && m(() => D(t), !1)
}

function G(e) {
    for (let t = 0; t < e.length; t++) q(e[t])
}

function P(e, t) {
    e.state = 0;
    for (let s = 0; s < e.sources.length; s += 1) {
        const r = e.sources[s];
        if (r.sources) {
            const n = r.state;
            n === y ? r !== t && (!r.updatedAt || r.updatedAt < N) && q(r) : n === x && P(r, t)
        }
    }
}

function H(e) {
    for (let t = 0; t < e.observers.length; t += 1) {
        const s = e.observers[t];
        s.state || (s.state = x, s.pure ? h.push(s) : g.push(s), s.observers && H(s))
    }
}

function S(e) {
    let t;
    if (e.sources)
        for (; e.sources.length;) {
            const s = e.sources.pop(),
                r = e.sourceSlots.pop(),
                n = s.observers;
            if (n && n.length) {
                const i = n.pop(),
                    o = s.observerSlots.pop();
                r < n.length && (i.sourceSlots[o] = r, n[r] = i, s.observerSlots[r] = o)
            }
        }
    if (e.tOwned) {
        for (t = e.tOwned.length - 1; t >= 0; t--) S(e.tOwned[t]);
        delete e.tOwned
    }
    if (e.owned) {
        for (t = e.owned.length - 1; t >= 0; t--) S(e.owned[t]);
        e.owned = null
    }
    if (e.cleanups) {
        for (t = e.cleanups.length - 1; t >= 0; t--) e.cleanups[t]();
        e.cleanups = null
    }
    e.state = 0
}

function le(e) {
    return e instanceof Error ? e : new Error(typeof e == "string" ? e : "Unknown error", {
        cause: e
    })
}

function J(e, t = d) {
    throw le(e)
}

function oe(e, t) {
    return T(() => e(t || {}))
}

function ue(e, t, s) {
    let r = s.length,
        n = t.length,
        i = r,
        o = 0,
        l = 0,
        c = t[n - 1].nextSibling,
        u = null;
    for (; o < n || l < i;) {
        if (t[o] === s[l]) {
            o++, l++;
            continue
        }
        for (; t[n - 1] === s[i - 1];) n--, i--;
        if (n === o) {
            const f = i < r ? l ? s[l - 1].nextSibling : s[i - l] : c;
            for (; l < i;) e.insertBefore(s[l++], f)
        } else if (i === l)
            for (; o < n;)(!u || !u.has(t[o])) && t[o].remove(), o++;
        else if (t[o] === s[i - 1] && s[l] === t[n - 1]) {
            const f = t[--n].nextSibling;
            e.insertBefore(s[l++], t[o++].nextSibling), e.insertBefore(s[--i], f), t[n] = s[i]
        } else {
            if (!u) {
                u = new Map;
                let p = l;
                for (; p < i;) u.set(s[p], p++)
            }
            const f = u.get(t[o]);
            if (f != null)
                if (l < f && f < i) {
                    let p = o,
                        b = 1,
                        w;
                    for (; ++p < n && p < i && !((w = u.get(t[p])) == null || w !== f + b);) b++;
                    if (b > f - l) {
                        const A = t[o];
                        for (; l < f;) e.insertBefore(s[l++], A)
                    } else e.replaceChild(s[l++], t[o++])
                } else o++;
            else t[o++].remove()
        }
    }
}

function Q(e, t, s, r) {
    let n;
    const i = () => {
            const l = document.createElement("template");
            return l.innerHTML = e, l.content.firstChild
        },
        o = () => (n || (n = i())).cloneNode(!0);
    return o.cloneNode = o, o
}

function R(e, t, s) {
    s == null ? e.removeAttribute(t) : e.setAttribute(t, s)
}

function K(e, t) {
    t == null ? e.removeAttribute("class") : e.className = t
}

function ce(e, t, s) {
    return T(() => e(t, s))
}

function B(e, t, s, r) {
    if (s !== void 0 && !r && (r = []), typeof t != "function") return j(e, t, r, s);
    v(n => j(e, t(), n, s), r)
}

function j(e, t, s, r, n) {
    for (; typeof s == "function";) s = s();
    if (t === s) return s;
    const i = typeof t,
        o = r !== void 0;
    if (e = o && s[0] && s[0].parentNode || e, i === "string" || i === "number") {
        if (i === "number" && (t = t.toString(), t === s)) return s;
        if (o) {
            let l = s[0];
            l && l.nodeType === 3 ? l.data !== t && (l.data = t) : l = document.createTextNode(t), s = _(e, s, r, l)
        } else s !== "" && typeof s == "string" ? s = e.firstChild.data = t : s = e.textContent = t
    } else if (t == null || i === "boolean") s = _(e, s, r);
    else {
        if (i === "function") return v(() => {
            let l = t();
            for (; typeof l == "function";) l = l();
            s = j(e, l, s, r)
        }), () => s;
        if (Array.isArray(t)) {
            const l = [],
                c = s && Array.isArray(s);
            if (M(l, t, s, n)) return v(() => s = j(e, l, s, r, !0)), () => s;
            if (l.length === 0) {
                if (s = _(e, s, r), o) return s
            } else c ? s.length === 0 ? z(e, l, r) : ue(e, s, l) : (s && _(e), z(e, l));
            s = l
        } else if (t.nodeType) {
            if (Array.isArray(s)) {
                if (o) return s = _(e, s, r, t);
                _(e, s, null, t)
            } else s == null || s === "" || !e.firstChild ? e.appendChild(t) : e.replaceChild(t, e.firstChild);
            s = t
        }
    }
    return s
}

function M(e, t, s, r) {
    let n = !1;
    for (let i = 0, o = t.length; i < o; i++) {
        let l = t[i],
            c = s && s[e.length],
            u;
        if (!(l == null || l === !0 || l === !1))
            if ((u = typeof l) == "object" && l.nodeType) e.push(l);
            else if (Array.isArray(l)) n = M(e, l, c) || n;
        else if (u === "function")
            if (r) {
                for (; typeof l == "function";) l = l();
                n = M(e, Array.isArray(l) ? l : [l], Array.isArray(c) ? c : [c]) || n
            } else e.push(l), n = !0;
        else {
            const f = String(l);
            c && c.nodeType === 3 && c.data === f ? e.push(c) : e.push(document.createTextNode(f))
        }
    }
    return n
}

function z(e, t, s = null) {
    for (let r = 0, n = t.length; r < n; r++) e.insertBefore(t[r], s)
}

function _(e, t, s, r) {
    if (s === void 0) return e.textContent = "";
    const n = r || document.createTextNode("");
    if (t.length) {
        let i = !1;
        for (let o = t.length - 1; o >= 0; o--) {
            const l = t[o];
            if (n !== l) {
                const c = l.parentNode === e;
                !i && !o ? c ? e.replaceChild(n, l) : e.insertBefore(n, s) : c && l.remove()
            } else i = !0
        }
    } else e.insertBefore(n, s);
    return [n]
}

function fe(e) {
    return Object.keys(e).reduce((s, r) => {
        const n = e[r];
        return s[r] = Object.assign({}, n), Z(n.value) && !ge(n.value) && !Array.isArray(n.value) && (s[r].value = Object.assign({}, n.value)), Array.isArray(n.value) && (s[r].value = n.value.slice(0)), s
    }, {})
}

function ae(e) {
    return e ? Object.keys(e).reduce((s, r) => {
        const n = e[r];
        return s[r] = Z(n) && "value" in n ? n : {
            value: n
        }, s[r].attribute || (s[r].attribute = pe(r)), s[r].parse = "parse" in s[r] ? s[r].parse : typeof s[r].value != "string", s
    }, {}) : {}
}

function he(e) {
    return Object.keys(e).reduce((s, r) => (s[r] = e[r].value, s), {})
}

function de(e, t) {
    const s = fe(t);
    return Object.keys(t).forEach(n => {
        const i = s[n],
            o = e.getAttribute(i.attribute),
            l = e[n];
        o != null && (i.value = i.parse ? W(o) : o), l != null && (i.value = Array.isArray(l) ? l.slice(0) : l), i.reflect && I(e, i.attribute, i.value, !!i.parse), Object.defineProperty(e, n, {
            get() {
                return i.value
            },
            set(c) {
                const u = i.value;
                i.value = c, i.reflect && I(this, i.attribute, i.value, !!i.parse);
                for (let f = 0, p = this.__propertyChangedCallbacks.length; f < p; f++) this.__propertyChangedCallbacks[f](n, c, u)
            },
            enumerable: !0,
            configurable: !0
        })
    }), s
}

function W(e) {
    if (e) try {
        return JSON.parse(e)
    } catch {
        return e
    }
}

function I(e, t, s, r) {
    if (s == null || s === !1) return e.removeAttribute(t);
    let n = r ? JSON.stringify(s) : s;
    e.__updating[t] = !0, n === "true" && (n = ""), e.setAttribute(t, n), Promise.resolve().then(() => delete e.__updating[t])
}

function pe(e) {
    return e.replace(/\.?([A-Z]+)/g, (t, s) => "-" + s.toLowerCase()).replace("_", "-").replace(/^-/, "")
}

function Z(e) {
    return e != null && (typeof e == "object" || typeof e == "function")
}

function ge(e) {
    return Object.prototype.toString.call(e) === "[object Function]"
}

function ye(e) {
    return typeof e == "function" && e.toString().indexOf("class") === 0
}
let C;

function be() {
    Object.defineProperty(C, "renderRoot", {
        value: C
    })
}

function _e(e, t) {
    const s = Object.keys(t);
    return class extends e {
        static get observedAttributes() {
            return s.map(n => t[n].attribute)
        }
        constructor() {
            super(), this.__initialized = !1, this.__released = !1, this.__releaseCallbacks = [], this.__propertyChangedCallbacks = [], this.__updating = {}, this.props = {}
        }
        connectedCallback() {
            if (this.__initialized) return;
            this.__releaseCallbacks = [], this.__propertyChangedCallbacks = [], this.__updating = {}, this.props = de(this, t);
            const n = he(this.props),
                i = this.Component,
                o = C;
            try {
                C = this, this.__initialized = !0, ye(i) ? new i(n, {
                    element: this
                }) : i(n, {
                    element: this
                })
            } finally {
                C = o
            }
        }
        async disconnectedCallback() {
            if (await Promise.resolve(), this.isConnected) return;
            this.__propertyChangedCallbacks.length = 0;
            let n = null;
            for (; n = this.__releaseCallbacks.pop();) n(this);
            delete this.__initialized, this.__released = !0
        }
        attributeChangedCallback(n, i, o) {
            if (this.__initialized && !this.__updating[n] && (n = this.lookupProp(n), n in t)) {
                if (o == null && !this[n]) return;
                this[n] = t[n].parse ? W(o) : o
            }
        }
        lookupProp(n) {
            if (t) return s.find(i => n === i || n === t[i].attribute)
        }
        get renderRoot() {
            return this.shadowRoot || this.attachShadow({
                mode: "open"
            })
        }
        addReleaseCallback(n) {
            this.__releaseCallbacks.push(n)
        }
        addPropertyChangedCallback(n) {
            this.__propertyChangedCallbacks.push(n)
        }
    }
}

function we(e, t = {}, s = {}) {
    const {
        BaseElement: r = HTMLElement,
        extension: n,
        customElements: i = window.customElements
    } = s;
    return o => {
        let l = i.get(e);
        return l ? (l.prototype.Component = o, l) : (l = _e(r, ae(t)), l.prototype.Component = o, l.prototype.registeredTag = e, i.define(e, l, n), l)
    }
}

function Ce(e) {
    const t = Object.keys(e),
        s = {};
    for (let r = 0; r < t.length; r++) {
        const [n, i] = se(e[t[r]]);
        Object.defineProperty(s, t[r], {
            get: n,
            set(o) {
                i(() => o)
            }
        })
    }
    return s
}

function ve(e) {
    if (e.assignedSlot && e.assignedSlot._$owner) return e.assignedSlot._$owner;
    let t = e.parentNode;
    for (; t && !t._$owner && !(t.assignedSlot && t.assignedSlot._$owner);) t = t.parentNode;
    return t && t.assignedSlot ? t.assignedSlot._$owner : e._$owner
}

function Se(e) {
    return (t, s) => {
        const {
            element: r
        } = s;
        return te(n => {
            const i = Ce(t);
            r.addPropertyChangedCallback((l, c) => i[l] = c), r.addReleaseCallback(() => {
                r.renderRoot.textContent = "", n()
            });
            const o = e(i, s);
            return B(r.renderRoot, o)
        }, ve(r))
    }
}

function me(e, t, s) {
    return arguments.length === 2 && (s = t, t = {}), we(e, t)(Se(s))
}
const Ae = "_root_4gc8u_5",
    Ee = "_card_4gc8u_27",
    Oe = "_mizi_4gc8u_50",
    xe = "_small_4gc8u_63",
    E = {
        root: Ae,
        card: Ee,
        mizi: Oe,
        small: xe
    };
var Pe = Q("<div><div><i><img></i><h4>"),
    je = Q("<a title=props.title>");
const Ne = e => {
    console.log(e);
    let t;

    function s() {
        globalThis.SVGInject(t)
    }
    return (() => {
        var r = Pe(),
            n = r.firstChild,
            i = n.firstChild,
            o = i.firstChild,
            l = i.nextSibling,
            c = t;
        return typeof c == "function" ? ce(c, o) : t = o, o.addEventListener("load", s), B(l, () => e.title), B(n, (() => {
            var u = ne(() => !!e.link);
            return () => u() && (() => {
                var f = je();
                return v(() => R(f, "href", e.link)), f
            })()
        })(), null), v(u => {
            var f = E.root,
                p = E.card,
                b = `${E.mizi} ${e.small&&E.small}`,
                w = e.img,
                A = e.title;
            return f !== u.e && K(r, u.e = f), p !== u.t && K(n, u.t = p), b !== u.a && K(i, u.a = b), w !== u.o && R(o, "src", u.o = w), A !== u.i && R(o, "alt", u.i = A), u
        }, {
            e: void 0,
            t: void 0,
            a: void 0,
            o: void 0,
            i: void 0
        }), r
    })()
};
me("company-card", {
    title: null,
    link: null,
    small: !0,
    img: void 0
}, (e, {
    element: t
}) => (be(), oe(Ne, e)));

look like Transition is replaced with $

[ryansolid]

Yeah I mean there isn't anything for us to fix on our side. It is just choosing an arbitrary symbol. The fix is either in the bundling or the scope jQuery is injected. So I'm closing it here.