@crossed/styled/lib/module/Registry/RegistryBridge.js

A universal & performant styling library for React Native, Next.js & React

import { setTheme } from "../setTheme";
import { convertKeyToCss, normalizeUnitPixel } from "../plugins/utils";
import { isWeb as isWebFile } from "../isWeb";
const parse = (t, parentName, isWeb) => {
  return !isWeb ? { theme: t, values: t } : Object.entries(t).reduce(
    (acc, [key, value]) => {
      if (Array.isArray(value)) {
      } else if (["number", "string"].includes(typeof value)) {
        const name = convertKeyToCss(
          `${parentName ? `${parentName}-` : ""}${key}`
        );
        acc.theme[key] = `var(--${name})`;
        acc.values[`--${name}`] = normalizeUnitPixel(
          "marginTop",
          value,
          isWeb
        );
      } else if (typeof value === "object") {
        const toto = parse(
          value,
          convertKeyToCss(`${parentName ? `${parentName}-` : ""}${key}`),
          isWeb
        );
        acc.theme = {
          ...acc.theme,
          ...Object.entries(toto.theme).reduce(
            (acc2, [key2, value2]) => {
              acc2[key] = { ...acc2[key], [key2]: value2 };
              return acc2;
            },
            {}
          )
        };
        acc.values = {
          ...acc.values,
          ...toto.values
        };
      }
      return acc;
    },
    { theme: {}, values: {} }
  );
};
class RegistryBridge {
  constructor() {
    this.plugins = [];
    this._debug = false;
    this._listen = /* @__PURE__ */ new Set();
  }
  setThemes(themes) {
    this.themes = themes;
    return this;
  }
  get themeName() {
    return this._themeName;
  }
  setInitialThemeName(themeName) {
    if (!this._themeName) {
      setTheme(this._themeName, themeName);
      this._themeName = themeName;
    }
    return this;
  }
  setThemeName(themeName) {
    setTheme(this._themeName, themeName);
    this._themeName = themeName;
    this._listen.forEach((cb) => cb(themeName));
    return this;
  }
  getTheme(web) {
    if (!this.themes) {
      console.warn("Themes are not set");
      return {};
    }
    return parse(this.themes[this.themeName] || {}, void 0, web ?? isWebFile).theme;
  }
  getThemes() {
    return this.themes;
  }
  subscribe(cb) {
    this._listen.add(cb);
    return () => {
      this._listen.delete(cb);
    };
  }
  setDebug(d) {
    this._debug = d;
    return this;
  }
  addPlugin(plugin) {
    this.plugins.push(plugin);
    return this;
  }
  getPlugins() {
    return this.plugins;
  }
  log(e) {
    if (this._debug) {
      console.log(`[@crossed/styled] ${e}`);
    }
  }
  apply(params, options) {
    this.log(`Registry apply`);
    const par = params();
    Object.keys(par).forEach((key) => {
      const styles = par[key];
      this.plugins.forEach(({ test, apply, name }) => {
        if (typeof key === "string") {
          const keyFind = test.includes(key);
          if (keyFind) {
            this.log(`[${name}] Find "${key}" for "${name}" plugin`);
            apply == null ? void 0 : apply({ ...options, key, styles });
          }
        }
      });
    });
  }
}
export {
  RegistryBridge,
  parse
};
//# sourceMappingURL=RegistryBridge.js.map