react-native-unistyles 3.0.0-alpha.8 → 3.0.0-beta.1

package/lib/module/web/registry.js

@@ -1,32 +1,167 @@
 "use strict";
 
-import { createTypeStyle } from 'typestyle';
-import { convertToTypeStyle } from './convert';
-import { UnistylesState } from './state';
+import { UnistylesRuntime } from './runtime';
+import { extractMediaQueryValue, keyInObject, getMediaQuery, generateHash, extractUnistyleDependencies } from './utils';
+import { UnistylesListener } from './listener';
+import { convertUnistyles } from './convert';
 class UnistylesRegistryBuilder {
-  createStyles = (stylesheet, key) => {
-    const stylesTag = UnistylesState.createTag();
-    const unistyles = createTypeStyle(stylesTag);
-    const typestyleStylesheet = convertToTypeStyle(stylesheet);
-    const className = unistyles.style({
-      $debugName: String(key)
-    }, typestyleStylesheet);
-    if (stylesheet._web?._css) {
-      const customClassName = Array.isArray(stylesheet._web._css) ? stylesheet._web._css.join(' ') : stylesheet._web._css;
+  stylesheets = new Map();
+  stylesCounter = new Map();
+  #styleTag = null;
+  disposeListenersMap = new Map();
+  dependenciesMap = new Map();
+  get styleTag() {
+    const tag = this.#styleTag;
+    if (!tag) {
+      const newTag = document.createElement('style');
+      newTag.id = 'unistyles-web';
+      this.#styleTag = newTag;
+      document.head.appendChild(newTag);
+      return newTag;
+    }
+    return tag;
+  }
+  getComputedStylesheet = stylesheet => {
+    if (typeof stylesheet !== 'function') {
+      return stylesheet;
+    }
+    const computedStylesheet = this.stylesheets.get(stylesheet);
+    if (computedStylesheet) {
+      return computedStylesheet;
+    }
+    const createdStylesheet = stylesheet(UnistylesRuntime.theme, UnistylesRuntime.miniRuntime);
+    const dependencies = Object.values(createdStylesheet).flatMap(value => extractUnistyleDependencies(value));
+    this.addDependenciesToStylesheet(stylesheet, dependencies);
+    this.stylesheets.set(stylesheet, createdStylesheet);
+    return createdStylesheet;
+  };
+  addDependenciesToStylesheet = (stylesheet, dependencies) => {
+    this.disposeListenersMap.get(stylesheet)?.();
+    const dependenciesMap = this.dependenciesMap.get(stylesheet) ?? new Set(dependencies);
+    dependencies.forEach(dependency => dependenciesMap.add(dependency));
+    const dispose = UnistylesListener.addStylesheetListeners(Array.from(dependenciesMap), () => {
+      const newComputedStylesheet = stylesheet(UnistylesRuntime.theme, UnistylesRuntime.miniRuntime);
+      this.stylesheets.set(stylesheet, newComputedStylesheet);
+    });
+    this.dependenciesMap.set(stylesheet, dependenciesMap);
+    this.disposeListenersMap.set(stylesheet, dispose);
+  };
+  add = value => {
+    const hash = generateHash(value);
+    const existingCounter = this.stylesCounter.get(hash);
+    if (!existingCounter || existingCounter.size === 0) {
+      const counter = new Set();
+      counter.add(value);
+      this.stylesCounter.set(hash, counter);
+      this.applyStyles(hash, convertUnistyles(value));
       return {
-        className: `${className} ${customClassName}`,
-        unistyles
+        hash,
+        existingHash: false
       };
     }
+    existingCounter.add(value);
     return {
-      className,
-      unistyles
+      hash,
+      existingHash: true
     };
   };
-  updateStyles = (unistyles, stylesheet, className) => {
-    const typestyleStylesheet = convertToTypeStyle(stylesheet);
-    unistyles.reinit();
-    unistyles.cssRule(`.${className}`, typestyleStylesheet);
+  applyStyles = (hash, styles) => {
+    Object.entries(styles).forEach(([key, value]) => {
+      if (!this.styleTag.sheet) {
+        return;
+      }
+      if (typeof value === 'object' && !key.startsWith('_')) {
+        const mediaQuery = getMediaQuery(key);
+        const cssRules = Array.from(this.styleTag.sheet.cssRules);
+        let queryRule = cssRules.find(rule => {
+          if (!(rule instanceof CSSMediaRule)) {
+            return false;
+          }
+          return rule.media.item(0)?.includes(mediaQuery);
+        }) ?? null;
+        if (!queryRule) {
+          const mediaQueryValue = extractMediaQueryValue(mediaQuery);
+          const ruleIndex = mediaQueryValue ? cssRules.reduce((acc, rule, ruleIndex) => {
+            if (!(rule instanceof CSSMediaRule)) {
+              return acc;
+            }
+            const ruleMediaQueryValue = extractMediaQueryValue(rule.conditionText);
+            if (ruleMediaQueryValue === undefined) {
+              return;
+            }
+            return ruleMediaQueryValue > mediaQueryValue ? ruleIndex : acc;
+          }, cssRules.length) : undefined;
+          queryRule = this.styleTag.sheet.cssRules.item(this.styleTag.sheet.insertRule(`@media ${mediaQuery} {.${hash} {}}`, ruleIndex));
+        }
+        if (queryRule instanceof CSSMediaRule) {
+          Object.entries(value).forEach(([mqKey, mqValue]) => {
+            this.applyRule({
+              hash,
+              key: mqKey,
+              value: mqValue,
+              sheet: queryRule
+            });
+          });
+        }
+        return;
+      }
+
+      // Pseudo
+      if (typeof value === 'object') {
+        Object.entries(value).forEach(([pseudoKey, pseudoValue]) => {
+          this.applyRule({
+            hash: `${hash}${key.replace('_', ':')}`,
+            key: pseudoKey,
+            value: pseudoValue,
+            sheet: this.styleTag.sheet
+          });
+        });
+        return;
+      }
+      this.applyRule({
+        hash,
+        key,
+        value,
+        sheet: this.styleTag.sheet
+      });
+    });
+  };
+  applyRule = ({
+    hash,
+    key,
+    value,
+    sheet
+  }) => {
+    let rule = Array.from(sheet.cssRules).find(rule => {
+      if (!(rule instanceof CSSStyleRule)) {
+        return false;
+      }
+
+      // In unistyles pseudos are prefixed with ':' but in css some of them are prefixed with '::'
+      return rule.selectorText.replace('::', ':').includes(hash);
+    }) ?? null;
+    if (!rule) {
+      rule = sheet.cssRules.item(sheet.insertRule(`.${hash} {}`));
+    }
+    if (!(rule instanceof CSSStyleRule) || !keyInObject(rule.style, key)) {
+      return;
+    }
+    rule.style[key] = value;
+  };
+  remove = value => {
+    const hash = generateHash(value);
+    const existingStyles = this.stylesCounter.get(hash);
+    if (!existingStyles) {
+      return;
+    }
+    existingStyles.delete(value);
+    if (existingStyles.size === 0) {
+      const ruleIndex = Array.from(this.styleTag.sheet?.cssRules ?? []).findIndex(rule => rule.cssText.includes(`.${hash}`));
+      if (ruleIndex === -1) {
+        return;
+      }
+      this.styleTag.sheet?.deleteRule(ruleIndex);
+    }
   };
 }
 export const UnistylesRegistry = new UnistylesRegistryBuilder();

package/lib/module/web/registry.js.map

@@ -1 +1 @@
-{"version":3,"names":["createTypeStyle","convertToTypeStyle","UnistylesState","UnistylesRegistryBuilder","createStyles","stylesheet","key","stylesTag","createTag","unistyles","typestyleStylesheet","className","style","$debugName","String","_web","_css","customClassName","Array","isArray","join","updateStyles","reinit","cssRule","UnistylesRegistry"],"sourceRoot":"../../../src","sources":["web/registry.ts"],"mappings":";;AAAA,SAASA,eAAe,QAAmB,WAAW;AAEtD,SAASC,kBAAkB,QAAQ,WAAW;AAC9C,SAASC,cAAc,QAAQ,SAAS;AAExC,MAAMC,wBAAwB,CAAC;EAC3BC,YAAY,GAAGA,CAACC,UAA2B,EAAEC,GAAoB,KAAK;IAClE,MAAMC,SAAS,GAAGL,cAAc,CAACM,SAAS,CAAC,CAAC;IAC5C,MAAMC,SAAS,GAAGT,eAAe,CAACO,SAAS,CAAC;IAC5C,MAAMG,mBAAmB,GAAGT,kBAAkB,CAACI,UAAU,CAAC;IAE1D,MAAMM,SAAS,GAAGF,SAAS,CAACG,KAAK,CAAC;MAC9BC,UAAU,EAAEC,MAAM,CAACR,GAAG;IAC1B,CAAC,EAAEI,mBAAmB,CAAC;IAEvB,IAAIL,UAAU,CAACU,IAAI,EAAEC,IAAI,EAAE;MACvB,MAAMC,eAAe,GAAGC,KAAK,CAACC,OAAO,CAACd,UAAU,CAACU,IAAI,CAACC,IAAI,CAAC,GACrDX,UAAU,CAACU,IAAI,CAACC,IAAI,CAACI,IAAI,CAAC,GAAG,CAAC,GAC9Bf,UAAU,CAACU,IAAI,CAACC,IAAI;MAE1B,OAAO;QACHL,SAAS,EAAE,GAAGA,SAAS,IAAIM,eAAe,EAAE;QAC5CR;MACJ,CAAC;IACL;IAEA,OAAO;MACHE,SAAS;MACTF;IACJ,CAAC;EACL,CAAC;EAEDY,YAAY,GAAGA,CAACZ,SAAoB,EAAEJ,UAA2B,EAAEM,SAAiB,KAAK;IACrF,MAAMD,mBAAmB,GAAGT,kBAAkB,CAACI,UAAU,CAAC;IAE1DI,SAAS,CAACa,MAAM,CAAC,CAAC;IAClBb,SAAS,CAACc,OAAO,CAAC,IAAIZ,SAAS,EAAE,EAAED,mBAAmB,CAAC;EAC3D,CAAC;AACL;AAEA,OAAO,MAAMc,iBAAiB,GAAG,IAAIrB,wBAAwB,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["UnistylesRuntime","extractMediaQueryValue","keyInObject","getMediaQuery","generateHash","extractUnistyleDependencies","UnistylesListener","convertUnistyles","UnistylesRegistryBuilder","stylesheets","Map","stylesCounter","styleTag","disposeListenersMap","dependenciesMap","tag","newTag","document","createElement","id","head","appendChild","getComputedStylesheet","stylesheet","computedStylesheet","get","createdStylesheet","theme","miniRuntime","dependencies","Object","values","flatMap","value","addDependenciesToStylesheet","set","Set","forEach","dependency","add","dispose","addStylesheetListeners","Array","from","newComputedStylesheet","hash","existingCounter","size","counter","applyStyles","existingHash","styles","entries","key","sheet","startsWith","mediaQuery","cssRules","queryRule","find","rule","CSSMediaRule","media","item","includes","mediaQueryValue","ruleIndex","reduce","acc","ruleMediaQueryValue","conditionText","undefined","length","insertRule","mqKey","mqValue","applyRule","pseudoKey","pseudoValue","replace","CSSStyleRule","selectorText","style","remove","existingStyles","delete","findIndex","cssText","deleteRule","UnistylesRegistry"],"sourceRoot":"../../../src","sources":["web/registry.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/web/runtime.js

@@ -6,7 +6,7 @@ import { WebContentSizeCategory } from '../types';
 import { UnistylesListener } from './listener';
 import { NavigationBar, StatusBar } from './mock';
 import { UnistylesState } from './state';
-import { hexToRGBA, isServer, schemeToTheme } from './utils';
+import { error, isServer, schemeToTheme } from './utils';
 class UnistylesRuntimeBuilder {
   lightMedia = this.getLightMedia();
   darkMedia = this.getDarkMedia();
@@ -39,11 +39,17 @@ class UnistylesRuntimeBuilder {
     }
   }
   get themeName() {
+    if (UnistylesState.hasAdaptiveThemes) {
+      return schemeToTheme(this.colorScheme);
+    }
     return UnistylesState.themeName;
   }
   get contentSizeCategory() {
     return WebContentSizeCategory.Unspecified;
   }
+  get breakpoints() {
+    return UnistylesState.breakpoints ?? {};
+  }
   get breakpoint() {
     return UnistylesState.breakpoint;
   }
@@ -54,14 +60,7 @@ class UnistylesRuntimeBuilder {
     return screen.orientation.type.includes('portrait') ? Orientation.Portrait : Orientation.Landscape;
   }
   get theme() {
-    if (!this.themeName) {
-      throw new Error('🦄 No theme selected!');
-    }
-    const theme = UnistylesState.themes.get(this.themeName);
-    if (!theme) {
-      throw new Error(`🦄 Theme "${this.themeName}" is not registered!`);
-    }
-    return theme;
+    return this.getTheme(this.themeName);
   }
   get pixelRatio() {
     return isServer() ? 1 : window.devicePixelRatio;
@@ -108,7 +107,8 @@ class UnistylesRuntimeBuilder {
       themeName: this.themeName,
       contentSizeCategory: this.contentSizeCategory,
       breakpoint: this.breakpoint,
-      orientation: this.orientation,
+      isLandscape: this.orientation === Orientation.Landscape,
+      isPortrait: this.orientation === Orientation.Portrait,
       pixelRatio: this.pixelRatio,
       screen: this.screen,
       fontScale: this.fontScale,
@@ -126,6 +126,9 @@ class UnistylesRuntimeBuilder {
     };
   }
   setTheme = themeName => {
+    if (this.hasAdaptiveThemes) {
+      throw error(`You're trying to set theme to: '${themeName}', but adaptiveThemes are enabled.`);
+    }
     if (themeName === UnistylesRuntime.themeName) {
       return;
     }
@@ -140,21 +143,27 @@ class UnistylesRuntimeBuilder {
     }
     this.setTheme(schemeToTheme(UnistylesRuntime.colorScheme));
   };
-  setRootViewBackgroundColor = (hex, alpha) => {
+  setRootViewBackgroundColor = color => {
     if (isServer()) {
       return;
     }
-    document.documentElement.style.backgroundColor = alpha ? hexToRGBA(hex, alpha) : hex;
+    document.documentElement.style.backgroundColor = color;
   };
   setImmersiveMode = () => {};
   updateTheme = (themeName, updater) => {
     const oldTheme = UnistylesState.themes.get(themeName);
     if (!oldTheme) {
-      throw new Error(`🦄 Theme "${themeName}" is not registered!`);
+      throw error(`Unistyles: You're trying to update theme "${themeName}" but it wasn't registered.`);
     }
     UnistylesState.themes.set(themeName, updater(oldTheme));
   };
-  getSSRUnistyles = () => UnistylesState.tags;
+  getTheme = (themeName = this.themeName) => {
+    const theme = UnistylesState.themes.get(themeName ?? '');
+    if (!themeName || !theme) {
+      throw error(`You're trying to get theme "${themeName}" but it wasn't registered.`);
+    }
+    return theme;
+  };
 }
 export const UnistylesRuntime = new UnistylesRuntimeBuilder();
 //# sourceMappingURL=runtime.js.map

package/lib/module/web/runtime.js.map

@@ -1 +1 @@
-{"version":3,"names":["UnistyleDependency","ColorScheme","Orientation","WebContentSizeCategory","UnistylesListener","NavigationBar","StatusBar","UnistylesState","hexToRGBA","isServer","schemeToTheme","UnistylesRuntimeBuilder","lightMedia","getLightMedia","darkMedia","getDarkMedia","window","matchMedia","colorScheme","matches","Light","Dark","Unspecified","themeName","contentSizeCategory","breakpoint","orientation","Portrait","screen","type","includes","Landscape","theme","Error","themes","get","pixelRatio","devicePixelRatio","width","height","innerWidth","innerHeight","fontScale","insets","top","bottom","left","right","ime","statusBar","rtl","document","documentElement","dir","hasAdaptiveThemes","navigationBar","miniRuntime","setTheme","UnistylesRuntime","emitChange","Theme","ThemeName","setAdaptiveThemes","isEnabled","setRootViewBackgroundColor","hex","alpha","style","backgroundColor","setImmersiveMode","updateTheme","updater","oldTheme","set","getSSRUnistyles","tags"],"sourceRoot":"../../../src","sources":["web/runtime.ts"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["UnistyleDependency","ColorScheme","Orientation","WebContentSizeCategory","UnistylesListener","NavigationBar","StatusBar","UnistylesState","error","isServer","schemeToTheme","UnistylesRuntimeBuilder","lightMedia","getLightMedia","darkMedia","getDarkMedia","window","matchMedia","colorScheme","matches","Light","Dark","Unspecified","themeName","hasAdaptiveThemes","contentSizeCategory","breakpoints","breakpoint","orientation","Portrait","screen","type","includes","Landscape","theme","getTheme","pixelRatio","devicePixelRatio","width","height","innerWidth","innerHeight","fontScale","insets","top","bottom","left","right","ime","statusBar","rtl","document","documentElement","dir","navigationBar","miniRuntime","isLandscape","isPortrait","setTheme","UnistylesRuntime","emitChange","Theme","ThemeName","setAdaptiveThemes","isEnabled","setRootViewBackgroundColor","color","style","backgroundColor","setImmersiveMode","updateTheme","updater","oldTheme","themes","get","set"],"sourceRoot":"../../../src","sources":["web/runtime.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/web/shadowRegistry.js

@@ -0,0 +1,139 @@
+"use strict";
+
+import { convertUnistyles } from './convert';
+import { UnistylesListener } from './listener';
+import { UnistylesRegistry } from './registry';
+import { deepMergeObjects } from '../utils';
+import { equal, extractSecrets, extractUnistyleDependencies, isInDocument } from './utils';
+import { getVariants } from './variants';
+class UnistylesShadowRegistryBuilder {
+  // MOCKS
+  name = 'UnistylesShadowRegistry';
+  __type = 'web';
+  equals = () => true;
+  toString = () => 'UnistylesShadowRegistry';
+  dispose = () => {};
+  // END MOCKS
+
+  resultsMap = new Map();
+  hashMap = new Map();
+  classNamesMap = new Map();
+  add = (ref, styles, _variants, _args) => {
+    // Styles are not provided
+    if (!styles) {
+      return;
+    }
+
+    // Ref is unmounted, remove style tags from the document
+    if (ref === null) {
+      const secrets = extractSecrets(styles);
+      if (secrets) {
+        secrets.__uni__refs.forEach(ref => {
+          if (isInDocument(ref)) {
+            return;
+          }
+          const oldResult = this.resultsMap.get(ref);
+          this.resultsMap.delete(ref);
+          this.classNamesMap.delete(ref);
+          if (oldResult) {
+            UnistylesRegistry.remove(oldResult);
+          }
+        });
+      }
+      return;
+    }
+
+    // Ref is not an HTMLElement
+    if (!(ref instanceof HTMLElement)) {
+      return;
+    }
+    const parsedStyles = styles.flat().flatMap((unistyleStyle, styleIndex) => {
+      if (!unistyleStyle) {
+        return [];
+      }
+      const secrets = extractSecrets(unistyleStyle);
+
+      // Regular style
+      if (!secrets) {
+        return unistyleStyle;
+      }
+      const {
+        __uni__key,
+        __uni__stylesheet,
+        __uni__variants,
+        __uni__args = [],
+        __uni__refs
+      } = secrets;
+      const newComputedStylesheet = UnistylesRegistry.getComputedStylesheet(__uni__stylesheet);
+      const style = newComputedStylesheet[__uni__key];
+      const variants = _variants && Object.keys(_variants).length > 0 ? _variants : __uni__variants;
+      const args = _args[styleIndex] && _args[styleIndex].length > 0 ? _args[styleIndex] : __uni__args;
+      const result = typeof style === 'function' ? style(...args) : style;
+      const {
+        variantsResult
+      } = Object.fromEntries(getVariants({
+        variantsResult: result
+      }, variants));
+      const resultWithVariants = deepMergeObjects(result, variantsResult ?? {});
+      const dependencies = extractUnistyleDependencies(resultWithVariants);
+      if (typeof __uni__stylesheet === 'function') {
+        // Add dependencies from dynamic styles to stylesheet
+        UnistylesRegistry.addDependenciesToStylesheet(__uni__stylesheet, dependencies);
+      }
+      __uni__refs.add(ref);
+      const dispose = UnistylesListener.addListeners(extractUnistyleDependencies(resultWithVariants), () => {
+        const hash = this.hashMap.get(ref);
+
+        // Dispose listener if there is no hash
+        if (!hash) {
+          dispose();
+          return;
+        }
+        const newComputedStyleSheet = UnistylesRegistry.getComputedStylesheet(__uni__stylesheet);
+        const newValue = newComputedStyleSheet[__uni__key];
+        const result = typeof newValue === 'function' ? newValue(...args) : newValue;
+        const {
+          variantsResult
+        } = Object.fromEntries(getVariants({
+          variantsResult: result
+        }, variants));
+        const resultWithVariants = deepMergeObjects(result, variantsResult ?? {});
+        UnistylesRegistry.applyStyles(hash, convertUnistyles(resultWithVariants));
+      });
+      return resultWithVariants;
+    });
+    const combinedStyles = deepMergeObjects(...parsedStyles);
+    const oldStyles = this.resultsMap.get(ref);
+    if (equal(combinedStyles, oldStyles)) {
+      return;
+    }
+    const oldClassNames = this.classNamesMap.get(ref);
+
+    // Remove old styles
+    if (oldStyles) {
+      UnistylesRegistry.remove(oldStyles);
+    }
+
+    // Remove old classnames from the ref
+    oldClassNames?.forEach(className => ref.classList.remove(className));
+    this.resultsMap.set(ref, combinedStyles);
+    const {
+      hash,
+      existingHash
+    } = UnistylesRegistry.add(combinedStyles);
+    const injectedClassNames = combinedStyles?._web?._classNames ?? [];
+    const newClassNames = (Array.isArray(injectedClassNames) ? injectedClassNames : [injectedClassNames]).concat(hash);
+    this.classNamesMap.set(ref, newClassNames);
+    // Add new classnames to the ref
+    ref.classList.add(...newClassNames);
+
+    // If it is new hash add it to the map to use for the listener
+    if (!existingHash) {
+      this.hashMap.set(ref, hash);
+    }
+    return newClassNames;
+  };
+  remove = () => {};
+}
+export const UnistylesShadowRegistry = new UnistylesShadowRegistryBuilder();
+//# sourceMappingURL=shadowRegistry.js.map

package/lib/module/web/shadowRegistry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["convertUnistyles","UnistylesListener","UnistylesRegistry","deepMergeObjects","equal","extractSecrets","extractUnistyleDependencies","isInDocument","getVariants","UnistylesShadowRegistryBuilder","name","__type","equals","toString","dispose","resultsMap","Map","hashMap","classNamesMap","add","ref","styles","_variants","_args","secrets","__uni__refs","forEach","oldResult","get","delete","remove","HTMLElement","parsedStyles","flat","flatMap","unistyleStyle","styleIndex","__uni__key","__uni__stylesheet","__uni__variants","__uni__args","newComputedStylesheet","getComputedStylesheet","style","variants","Object","keys","length","args","result","variantsResult","fromEntries","resultWithVariants","dependencies","addDependenciesToStylesheet","addListeners","hash","newComputedStyleSheet","newValue","applyStyles","combinedStyles","oldStyles","oldClassNames","className","classList","set","existingHash","injectedClassNames","_web","_classNames","newClassNames","Array","isArray","concat","UnistylesShadowRegistry"],"sourceRoot":"../../../src","sources":["web/shadowRegistry.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/web/state.js

@@ -1,20 +1,24 @@
 "use strict";
 
-import { createElement, createRef } from 'react';
 import { UnistylesRuntime } from './runtime';
-import { isServer, schemeToTheme } from './utils';
+import { error, isServer, schemeToTheme } from './utils';
 import { UnistylesListener } from './listener';
 import { UnistyleDependency } from '../specs/NativePlatform';
 class UnistylesStateBuilder {
-  isSSR = isServer();
-  tags = [];
   themes = new Map();
+  matchingBreakpoints = new Map();
+  get breakpoint() {
+    const [currentBreakpoint] = Array.from(this.matchingBreakpoints).reverse().find(([_key, value]) => value) ?? [];
+    return currentBreakpoint;
+  }
   hasAdaptiveThemes = false;
   init = config => {
     this.initThemes(config.themes);
     this.initBreakpoints(config.breakpoints);
-    this.initSettings(config.settings);
-    if (this.isSSR) {
+    if (config.settings) {
+      this.initSettings(config.settings);
+    }
+    if (isServer()) {
       return;
     }
     UnistylesListener.initListeners();
@@ -26,92 +30,47 @@ class UnistylesStateBuilder {
   };
   initSettings = settings => {
     this.hasAdaptiveThemes = settings?.adaptiveThemes ?? false;
-    const themeNames = Array.from(this.themes.keys());
-
-    // Single theme + no settings
-    if (!settings?.adaptiveThemes && !settings?.initialTheme && themeNames.length === 1) {
-      this.themeName = themeNames[0];
-      return;
-    }
-
-    // No settings
-    if (!settings?.adaptiveThemes && !settings?.initialTheme) {
-      throw new Error('🦄 You need to specify either "initialTheme" or "adaptiveThemes" in your config');
+    if (settings.initialTheme && settings.adaptiveThemes) {
+      throw error('You\'re trying to set initial theme and enable adaptiveThemes, but these options are mutually exclusive.');
     }
 
     // Adaptive themes
     if (settings.adaptiveThemes) {
+      if (!this.themes.get('light') || !this.themes.get('dark')) {
+        throw error(`You're trying to enable adaptiveThemes, but you didn't register both 'light' and 'dark' themes.`);
+      }
       this.themeName = schemeToTheme(UnistylesRuntime.colorScheme);
       return;
     }
-
-    // Initial theme
-    this.themeName = typeof settings.initialTheme === 'function' ? settings.initialTheme() : settings.initialTheme;
+    if (settings.initialTheme) {
+      const initialTheme = typeof settings.initialTheme === 'function' ? settings.initialTheme() : settings.initialTheme;
+      if (!this.themes.get(initialTheme)) {
+        throw error(`You're trying to select theme "${initialTheme}" but it wasn't registered.`);
+      }
+      this.themeName = initialTheme;
+    }
   };
   initBreakpoints = (breakpoints = {}) => {
-    const breakpointsMap = new Map();
     this.breakpoints = breakpoints;
-    Object.entries(breakpoints).sort(([, a], [, b]) => a - b).forEach(([breakpoint, value]) => {
+    const breakpointsEntries = Object.entries(breakpoints);
+    if (breakpointsEntries.length === 0) {
+      throw error('StyleSheet.configure\'s breakpoints can\'t be empty.');
+    }
+    if (breakpointsEntries?.[0]?.[1] !== 0) {
+      throw error('StyleSheet.configure\'s first breakpoint must start from 0.');
+    }
+    breakpointsEntries.sort(([, a], [, b]) => a - b).forEach(([breakpoint, value]) => {
       if (isServer()) {
         return;
       }
       const mediaQuery = window.matchMedia(`(min-width: ${value}px)`);
-      breakpointsMap.set(breakpoint, mediaQuery);
-      if (mediaQuery.matches) {
-        this.breakpoint = breakpoint;
-      }
+      this.matchingBreakpoints.set(breakpoint, mediaQuery.matches);
       mediaQuery.addEventListener('change', event => {
-        if (!event.matches) {
-          const [currentBreakpoint] = Array.from(breakpointsMap).find(([, mq]) => mq.matches) ?? [];
-          if (currentBreakpoint) {
-            this.breakpoint = currentBreakpoint;
-            UnistylesListener.emitChange(UnistyleDependency.Breakpoints);
-          }
-          return;
-        }
-        this.breakpoint = breakpoint;
+        this.matchingBreakpoints.set(breakpoint, event.matches);
         UnistylesListener.emitChange(UnistyleDependency.Breakpoints);
       });
     });
   };
-  createTag() {
-    if (!this.isSSR) {
-      const tag = document.createElement('style');
-      document.head.appendChild(tag);
-      return tag;
-    }
-    const tagRef = new Proxy(/*#__PURE__*/createRef(), {
-      set: (target, prop, value) => {
-        // When ref is assigned
-        if ('textContent' in value) {
-          value.textContent = tag.textContent;
-        }
-        return Reflect.set(target, prop, value);
-      }
-    });
-    const tagElement = /*#__PURE__*/createElement('style', {
-      ref: tagRef,
-      key: this.tags.length
-    }, '');
-    const tag = new Proxy({
-      textContent: ''
-    }, {
-      set: (target, prop, value) => {
-        if (prop !== 'textContent') {
-          return false;
-        }
-
-        // When css is updated
-        target.textContent = value;
-        if (tagRef.current) {
-          tagRef.current.textContent = value;
-        }
-        return true;
-      }
-    });
-    this.tags.push(tagElement);
-    return tag;
-  }
 }
 export const UnistylesState = new UnistylesStateBuilder();
 //# sourceMappingURL=state.js.map