react-native-unistyles 3.0.0-alpha.6 → 3.0.0-alpha.8

package/lib/commonjs/web/registry.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.UnistylesRegistry = void 0;
+var _typestyle = require("typestyle");
+var _convert = require("./convert");
+var _state = require("./state");
+class UnistylesRegistryBuilder {
+  createStyles = (stylesheet, key) => {
+    const stylesTag = _state.UnistylesState.createTag();
+    const unistyles = (0, _typestyle.createTypeStyle)(stylesTag);
+    const typestyleStylesheet = (0, _convert.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;
+      return {
+        className: `${className} ${customClassName}`,
+        unistyles
+      };
+    }
+    return {
+      className,
+      unistyles
+    };
+  };
+  updateStyles = (unistyles, stylesheet, className) => {
+    const typestyleStylesheet = (0, _convert.convertToTypeStyle)(stylesheet);
+    unistyles.reinit();
+    unistyles.cssRule(`.${className}`, typestyleStylesheet);
+  };
+}
+const UnistylesRegistry = exports.UnistylesRegistry = new UnistylesRegistryBuilder();
+//# sourceMappingURL=registry.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["_typestyle","require","_convert","_state","UnistylesRegistryBuilder","createStyles","stylesheet","key","stylesTag","UnistylesState","createTag","unistyles","createTypeStyle","typestyleStylesheet","convertToTypeStyle","className","style","$debugName","String","_web","_css","customClassName","Array","isArray","join","updateStyles","reinit","cssRule","UnistylesRegistry","exports"],"sourceRoot":"../../../src","sources":["web/registry.ts"],"mappings":";;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AAEA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAF,OAAA;AAEA,MAAMG,wBAAwB,CAAC;EAC3BC,YAAY,GAAGA,CAACC,UAA2B,EAAEC,GAAoB,KAAK;IAClE,MAAMC,SAAS,GAAGC,qBAAc,CAACC,SAAS,CAAC,CAAC;IAC5C,MAAMC,SAAS,GAAG,IAAAC,0BAAe,EAACJ,SAAS,CAAC;IAC5C,MAAMK,mBAAmB,GAAG,IAAAC,2BAAkB,EAACR,UAAU,CAAC;IAE1D,MAAMS,SAAS,GAAGJ,SAAS,CAACK,KAAK,CAAC;MAC9BC,UAAU,EAAEC,MAAM,CAACX,GAAG;IAC1B,CAAC,EAAEM,mBAAmB,CAAC;IAEvB,IAAIP,UAAU,CAACa,IAAI,EAAEC,IAAI,EAAE;MACvB,MAAMC,eAAe,GAAGC,KAAK,CAACC,OAAO,CAACjB,UAAU,CAACa,IAAI,CAACC,IAAI,CAAC,GACrDd,UAAU,CAACa,IAAI,CAACC,IAAI,CAACI,IAAI,CAAC,GAAG,CAAC,GAC9BlB,UAAU,CAACa,IAAI,CAACC,IAAI;MAE1B,OAAO;QACHL,SAAS,EAAE,GAAGA,SAAS,IAAIM,eAAe,EAAE;QAC5CV;MACJ,CAAC;IACL;IAEA,OAAO;MACHI,SAAS;MACTJ;IACJ,CAAC;EACL,CAAC;EAEDc,YAAY,GAAGA,CAACd,SAAoB,EAAEL,UAA2B,EAAES,SAAiB,KAAK;IACrF,MAAMF,mBAAmB,GAAG,IAAAC,2BAAkB,EAACR,UAAU,CAAC;IAE1DK,SAAS,CAACe,MAAM,CAAC,CAAC;IAClBf,SAAS,CAACgB,OAAO,CAAC,IAAIZ,SAAS,EAAE,EAAEF,mBAAmB,CAAC;EAC3D,CAAC;AACL;AAEO,MAAMe,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAIxB,wBAAwB,CAAC,CAAC","ignoreList":[]}

package/lib/commonjs/web/runtime.js

@@ -0,0 +1,164 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.UnistylesRuntime = void 0;
+var _NativePlatform = require("../specs/NativePlatform");
+var _types = require("../specs/types");
+var _types2 = require("../types");
+var _listener = require("./listener");
+var _mock = require("./mock");
+var _state = require("./state");
+var _utils = require("./utils");
+class UnistylesRuntimeBuilder {
+  lightMedia = this.getLightMedia();
+  darkMedia = this.getDarkMedia();
+  getLightMedia() {
+    if ((0, _utils.isServer)()) {
+      return null;
+    }
+    if (!this.lightMedia) {
+      this.lightMedia = window.matchMedia('(prefers-color-scheme: light)');
+    }
+    return this.lightMedia;
+  }
+  getDarkMedia() {
+    if ((0, _utils.isServer)()) {
+      return null;
+    }
+    if (!this.darkMedia) {
+      this.darkMedia = window.matchMedia('(prefers-color-scheme: dark)');
+    }
+    return this.darkMedia;
+  }
+  get colorScheme() {
+    switch (true) {
+      case this.getLightMedia()?.matches:
+        return _types.ColorScheme.Light;
+      case this.getDarkMedia()?.matches:
+        return _types.ColorScheme.Dark;
+      default:
+        return _types.ColorScheme.Unspecified;
+    }
+  }
+  get themeName() {
+    return _state.UnistylesState.themeName;
+  }
+  get contentSizeCategory() {
+    return _types2.WebContentSizeCategory.Unspecified;
+  }
+  get breakpoint() {
+    return _state.UnistylesState.breakpoint;
+  }
+  get orientation() {
+    if ((0, _utils.isServer)()) {
+      return _types.Orientation.Portrait;
+    }
+    return screen.orientation.type.includes('portrait') ? _types.Orientation.Portrait : _types.Orientation.Landscape;
+  }
+  get theme() {
+    if (!this.themeName) {
+      throw new Error('🦄 No theme selected!');
+    }
+    const theme = _state.UnistylesState.themes.get(this.themeName);
+    if (!theme) {
+      throw new Error(`🦄 Theme "${this.themeName}" is not registered!`);
+    }
+    return theme;
+  }
+  get pixelRatio() {
+    return (0, _utils.isServer)() ? 1 : window.devicePixelRatio;
+  }
+  get screen() {
+    if ((0, _utils.isServer)()) {
+      return {
+        width: 0,
+        height: 0
+      };
+    }
+    return {
+      width: window.innerWidth,
+      height: window.innerHeight
+    };
+  }
+  get fontScale() {
+    return 1;
+  }
+  get insets() {
+    return {
+      top: 0,
+      bottom: 0,
+      left: 0,
+      right: 0,
+      ime: 0
+    };
+  }
+  get statusBar() {
+    return _mock.StatusBar;
+  }
+  get rtl() {
+    return (0, _utils.isServer)() ? true : document.documentElement.dir === 'rtl';
+  }
+  get hasAdaptiveThemes() {
+    return _state.UnistylesState.hasAdaptiveThemes;
+  }
+  get navigationBar() {
+    return _mock.NavigationBar;
+  }
+  get miniRuntime() {
+    return {
+      colorScheme: this.colorScheme,
+      themeName: this.themeName,
+      contentSizeCategory: this.contentSizeCategory,
+      breakpoint: this.breakpoint,
+      orientation: this.orientation,
+      pixelRatio: this.pixelRatio,
+      screen: this.screen,
+      fontScale: this.fontScale,
+      insets: this.insets,
+      statusBar: {
+        width: this.statusBar.width,
+        height: this.statusBar.height
+      },
+      navigationBar: {
+        width: this.navigationBar.width,
+        height: this.navigationBar.height
+      },
+      rtl: this.rtl,
+      hasAdaptiveThemes: this.hasAdaptiveThemes
+    };
+  }
+  setTheme = themeName => {
+    if (themeName === UnistylesRuntime.themeName) {
+      return;
+    }
+    _state.UnistylesState.themeName = themeName;
+    _listener.UnistylesListener.emitChange(_NativePlatform.UnistyleDependency.Theme);
+    _listener.UnistylesListener.emitChange(_NativePlatform.UnistyleDependency.ThemeName);
+  };
+  setAdaptiveThemes = isEnabled => {
+    _state.UnistylesState.hasAdaptiveThemes = isEnabled;
+    if (!isEnabled) {
+      return;
+    }
+    this.setTheme((0, _utils.schemeToTheme)(UnistylesRuntime.colorScheme));
+  };
+  setRootViewBackgroundColor = (hex, alpha) => {
+    if ((0, _utils.isServer)()) {
+      return;
+    }
+    document.documentElement.style.backgroundColor = alpha ? (0, _utils.hexToRGBA)(hex, alpha) : hex;
+  };
+  setImmersiveMode = () => {};
+  updateTheme = (themeName, updater) => {
+    const oldTheme = _state.UnistylesState.themes.get(themeName);
+    if (!oldTheme) {
+      throw new Error(`🦄 Theme "${themeName}" is not registered!`);
+    }
+    _state.UnistylesState.themes.set(themeName, updater(oldTheme));
+  };
+  getSSRUnistyles = () => _state.UnistylesState.tags;
+}
+const UnistylesRuntime = exports.UnistylesRuntime = new UnistylesRuntimeBuilder();
+//# sourceMappingURL=runtime.js.map

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

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

package/lib/commonjs/web/state.js

@@ -0,0 +1,121 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.UnistylesState = void 0;
+var _react = require("react");
+var _runtime = require("./runtime");
+var _utils = require("./utils");
+var _listener = require("./listener");
+var _NativePlatform = require("../specs/NativePlatform");
+class UnistylesStateBuilder {
+  isSSR = (0, _utils.isServer)();
+  tags = [];
+  themes = new Map();
+  hasAdaptiveThemes = false;
+  init = config => {
+    this.initThemes(config.themes);
+    this.initBreakpoints(config.breakpoints);
+    this.initSettings(config.settings);
+    if (this.isSSR) {
+      return;
+    }
+    _listener.UnistylesListener.initListeners();
+  };
+  initThemes = (themes = {}) => {
+    Object.entries(themes).forEach(([themeName, theme]) => {
+      this.themes.set(themeName, theme);
+    });
+  };
+  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');
+    }
+
+    // Adaptive themes
+    if (settings.adaptiveThemes) {
+      this.themeName = (0, _utils.schemeToTheme)(_runtime.UnistylesRuntime.colorScheme);
+      return;
+    }
+
+    // Initial theme
+    this.themeName = typeof settings.initialTheme === 'function' ? settings.initialTheme() : settings.initialTheme;
+  };
+  initBreakpoints = (breakpoints = {}) => {
+    const breakpointsMap = new Map();
+    this.breakpoints = breakpoints;
+    Object.entries(breakpoints).sort(([, a], [, b]) => a - b).forEach(([breakpoint, value]) => {
+      if ((0, _utils.isServer)()) {
+        return;
+      }
+      const mediaQuery = window.matchMedia(`(min-width: ${value}px)`);
+      breakpointsMap.set(breakpoint, mediaQuery);
+      if (mediaQuery.matches) {
+        this.breakpoint = breakpoint;
+      }
+      mediaQuery.addEventListener('change', event => {
+        if (!event.matches) {
+          const [currentBreakpoint] = Array.from(breakpointsMap).find(([, mq]) => mq.matches) ?? [];
+          if (currentBreakpoint) {
+            this.breakpoint = currentBreakpoint;
+            _listener.UnistylesListener.emitChange(_NativePlatform.UnistyleDependency.Breakpoints);
+          }
+          return;
+        }
+        this.breakpoint = breakpoint;
+        _listener.UnistylesListener.emitChange(_NativePlatform.UnistyleDependency.Breakpoints);
+      });
+    });
+  };
+  createTag() {
+    if (!this.isSSR) {
+      const tag = document.createElement('style');
+      document.head.appendChild(tag);
+      return tag;
+    }
+    const tagRef = new Proxy(/*#__PURE__*/(0, _react.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__*/(0, _react.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;
+  }
+}
+const UnistylesState = exports.UnistylesState = new UnistylesStateBuilder();
+//# sourceMappingURL=state.js.map

package/lib/commonjs/web/state.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_runtime","_utils","_listener","_NativePlatform","UnistylesStateBuilder","isSSR","isServer","tags","themes","Map","hasAdaptiveThemes","init","config","initThemes","initBreakpoints","breakpoints","initSettings","settings","UnistylesListener","initListeners","Object","entries","forEach","themeName","theme","set","adaptiveThemes","themeNames","Array","from","keys","initialTheme","length","Error","schemeToTheme","UnistylesRuntime","colorScheme","breakpointsMap","sort","a","b","breakpoint","value","mediaQuery","window","matchMedia","matches","addEventListener","event","currentBreakpoint","find","mq","emitChange","UnistyleDependency","Breakpoints","createTag","tag","document","createElement","head","appendChild","tagRef","Proxy","createRef","target","prop","textContent","Reflect","tagElement","ref","key","current","push","UnistylesState","exports"],"sourceRoot":"../../../src","sources":["web/state.ts"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/web/utils.js

@@ -0,0 +1,78 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.warn = exports.toReactNativeClassName = exports.schemeToTheme = exports.reduceObject = exports.keyInObject = exports.isServer = exports.hexToRGBA = exports.equal = exports.deepMergeObjects = void 0;
+var _types = require("../specs/types");
+const reduceObject = (obj, reducer) => Object.fromEntries(Object.entries(obj).map(([key, value]) => [key, reducer(value, key)]));
+exports.reduceObject = reduceObject;
+const toReactNativeClassName = (className, values) => {
+  const returnValue = className ? {
+    $$css: true,
+    [className]: className
+  } : {};
+  Object.defineProperties(returnValue, reduceObject(values, value => ({
+    value,
+    enumerable: false,
+    configurable: true
+  })));
+  return returnValue;
+};
+exports.toReactNativeClassName = toReactNativeClassName;
+const keyInObject = (obj, key) => key in obj;
+exports.keyInObject = keyInObject;
+const schemeToTheme = scheme => {
+  switch (scheme) {
+    case _types.ColorScheme.Dark:
+      return 'dark';
+    case _types.ColorScheme.Light:
+    default:
+      return 'light';
+  }
+};
+exports.schemeToTheme = schemeToTheme;
+const hexToRGBA = (hex, opacity) => hex.replace('#', '').split(/(?=(?:..)*$)/).map(x => parseInt(x, 16)).filter(num => !isNaN(num)).reduce((acc, color) => `${acc}${color},`, 'rgba(').concat(`${opacity})`);
+exports.hexToRGBA = hexToRGBA;
+const isServer = () => typeof window === 'undefined';
+
+/**
+* Deeply merges properties of passed object
+*/
+exports.isServer = isServer;
+const deepMergeObjects = (...sources) => {
+  const target = {};
+  sources.forEach(source => {
+    Object.keys(source).forEach(key => {
+      const sourceValue = source[key];
+      const targetValue = target[key];
+      if (Object(sourceValue) == sourceValue && Object(targetValue) === targetValue) {
+        // @ts-expect-error - can't assign to generic
+        target[key] = deepMergeObjects(targetValue, sourceValue);
+        return;
+      }
+
+      // @ts-expect-error - can't assign to generic
+      target[key] = sourceValue;
+    });
+  });
+  return target;
+};
+exports.deepMergeObjects = deepMergeObjects;
+const warn = message => console.warn(`🦄 [react-native-unistyles] ${message}`);
+exports.warn = warn;
+const equal = (a, b) => {
+  if (Object.is(a, b)) {
+    return true;
+  }
+  if (typeof a !== 'object' || a === null || typeof b !== 'object' || b === null) {
+    return false;
+  }
+  const keysA = Object.keys(a);
+  if (keysA.length !== Object.keys(b).length) {
+    return false;
+  }
+  return keysA.every(key => Object.is(a[key], b[key]) && Object.prototype.hasOwnProperty.call(b, key));
+};
+exports.equal = equal;
+//# sourceMappingURL=utils.js.map

package/lib/commonjs/web/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_types","require","reduceObject","obj","reducer","Object","fromEntries","entries","map","key","value","exports","toReactNativeClassName","className","values","returnValue","$$css","defineProperties","enumerable","configurable","keyInObject","schemeToTheme","scheme","ColorScheme","Dark","Light","hexToRGBA","hex","opacity","replace","split","x","parseInt","filter","num","isNaN","reduce","acc","color","concat","isServer","window","deepMergeObjects","sources","target","forEach","source","keys","sourceValue","targetValue","warn","message","console","equal","a","b","is","keysA","length","every","prototype","hasOwnProperty","call"],"sourceRoot":"../../../src","sources":["web/utils.ts"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/web/variants/getVariants.js

@@ -0,0 +1,39 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getVariants = void 0;
+var _utils = require("../utils");
+const hasVariants = value => 'variants' in value[1];
+const getVariants = (styles, selectedVariants) => {
+  return Object.entries(styles).filter(hasVariants).filter(([_key, {
+    variants
+  }]) => Object.keys(variants).some(variant => variant in variants)).map(([key, {
+    variants,
+    compoundVariants = []
+  }]) => {
+    const variantStyles = Object.entries(variants).flatMap(([variant, styles]) => {
+      const selectedVariant = selectedVariants[variant];
+      const selectedVariantStyles = styles[selectedVariant] ?? styles['default'];
+      if (!selectedVariantStyles) {
+        return [];
+      }
+      return selectedVariantStyles;
+    });
+    const compoundVariantStyles = compoundVariants.flatMap(compoundVariant => {
+      const {
+        styles,
+        ...conditions
+      } = compoundVariant;
+      if (Object.entries(conditions).some(([variant, value]) => String(selectedVariants[variant]) !== String(value))) {
+        return [];
+      }
+      return styles;
+    });
+    const mergedVariantStyles = (0, _utils.deepMergeObjects)(...variantStyles, ...compoundVariantStyles);
+    return [key, mergedVariantStyles];
+  });
+};
+exports.getVariants = getVariants;
+//# sourceMappingURL=getVariants.js.map

package/lib/commonjs/web/variants/getVariants.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_utils","require","hasVariants","value","getVariants","styles","selectedVariants","Object","entries","filter","_key","variants","keys","some","variant","map","key","compoundVariants","variantStyles","flatMap","selectedVariant","selectedVariantStyles","compoundVariantStyles","compoundVariant","conditions","String","mergedVariantStyles","deepMergeObjects","exports"],"sourceRoot":"../../../../src","sources":["web/variants/getVariants.ts"],"mappings":";;;;;;AACA,IAAAA,MAAA,GAAAC,OAAA;AAQA,MAAMC,WAAW,GAAsBC,KAAkB,IAAgD,UAAU,IAAIA,KAAK,CAAC,CAAC,CAAC;AAExH,MAAMC,WAAW,GAAGA,CAACC,MAAyC,EAAEC,gBAAqC,KAAK;EAC7G,OAAOC,MAAM,CAACC,OAAO,CAACH,MAAM,CAAC,CACxBI,MAAM,CAACP,WAAW,CAAC,CACnBO,MAAM,CAAC,CAAC,CAACC,IAAI,EAAE;IAAEC;EAAS,CAAC,CAAC,KAAKJ,MAAM,CAACK,IAAI,CAACD,QAAQ,CAAC,CAACE,IAAI,CAACC,OAAO,IAAIA,OAAO,IAAIH,QAAQ,CAAC,CAAC,CAC5FI,GAAG,CAAC,CAAC,CAACC,GAAG,EAAE;IAAEL,QAAQ;IAAEM,gBAAgB,GAAG;EAAG,CAAC,CAAC,KAAK;IACjD,MAAMC,aAAa,GAAGX,MAAM,CAACC,OAAO,CAACG,QAAQ,CAAC,CAACQ,OAAO,CAAC,CAAC,CAACL,OAAO,EAAET,MAAM,CAAC,KAAK;MAC1E,MAAMe,eAAe,GAAGd,gBAAgB,CAACQ,OAAO,CAAC;MACjD,MAAMO,qBAAqB,GAAGhB,MAAM,CAACe,eAAe,CAAC,IAAIf,MAAM,CAAC,SAAS,CAAC;MAE1E,IAAI,CAACgB,qBAAqB,EAAE;QACxB,OAAO,EAAE;MACb;MAEA,OAAOA,qBAAqB;IAChC,CAAC,CAAC;IAEF,MAAMC,qBAAqB,GAAGL,gBAAgB,CAACE,OAAO,CAACI,eAAe,IAAI;MACtE,MAAM;QAAElB,MAAM;QAAE,GAAGmB;MAAW,CAAC,GAAGD,eAAe;MAEjD,IAAIhB,MAAM,CAACC,OAAO,CAACgB,UAAU,CAAC,CAACX,IAAI,CAAC,CAAC,CAACC,OAAO,EAAEX,KAAK,CAAC,KAAKsB,MAAM,CAACnB,gBAAgB,CAACQ,OAAO,CAAC,CAAC,KAAKW,MAAM,CAACtB,KAAK,CAAC,CAAC,EAAE;QAC5G,OAAO,EAAE;MACb;MAEA,OAAOE,MAAM;IACjB,CAAC,CAAC;IAEF,MAAMqB,mBAAmB,GAAG,IAAAC,uBAAgB,EAAC,GAAGT,aAAa,EAAE,GAAGI,qBAAqB,CAAC;IAExF,OAAO,CAACN,GAAG,EAAEU,mBAAmB,CAAC;EACrC,CAAC,CAAC;AACV,CAAC;AAAAE,OAAA,CAAAxB,WAAA,GAAAA,WAAA","ignoreList":[]}

package/lib/commonjs/web/variants/index.js

@@ -0,0 +1,28 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _useVariants = require("./useVariants");
+Object.keys(_useVariants).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _useVariants[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _useVariants[key];
+    }
+  });
+});
+var _getVariants = require("./getVariants");
+Object.keys(_getVariants).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _getVariants[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _getVariants[key];
+    }
+  });
+});
+//# sourceMappingURL=index.js.map

package/lib/commonjs/web/variants/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_useVariants","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_getVariants"],"sourceRoot":"../../../../src","sources":["web/variants/index.ts"],"mappings":";;;;;AAAA,IAAAA,YAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,YAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,YAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,YAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,YAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,YAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,YAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAC,YAAA,CAAAL,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}

package/lib/commonjs/web/variants/useVariants.js

@@ -0,0 +1,75 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createUseVariants = void 0;
+var _react = require("react");
+var _utils = require("../utils");
+var _registry = require("../registry");
+var _getVariants = require("./getVariants");
+const createUseVariants = (styles, setSelectedVariants) => {
+  const useVariants = selectedVariants => {
+    const [unistylesMap] = (0, _react.useState)(() => new Map());
+    const [classNameMap] = (0, _react.useState)(() => new Map());
+    const [selectedVariantStylesMap] = (0, _react.useState)(() => new Map());
+    const lastSelectedVariantsRef = (0, _react.useRef)();
+    // Variable that determines if variants have changed and we need to recalculate styles
+    const variantsChanged = !(0, _utils.equal)(lastSelectedVariantsRef.current, selectedVariants);
+    if (variantsChanged) {
+      lastSelectedVariantsRef.current = selectedVariants;
+      setSelectedVariants(selectedVariants);
+    }
+    const combinedVariantStyles = (0, _react.useMemo)(() => {
+      const result = (0, _getVariants.getVariants)(styles, selectedVariants);
+      result.forEach(([key, value]) => {
+        selectedVariantStylesMap.set(key, value);
+      });
+      return result;
+    }, [lastSelectedVariantsRef.current]);
+    if (unistylesMap.size === 0 && combinedVariantStyles.length > 0) {
+      combinedVariantStyles.forEach(([key, value]) => {
+        const {
+          className,
+          unistyles
+        } = _registry.UnistylesRegistry.createStyles(value, `variant-${key}`);
+        unistylesMap.set(key, unistyles);
+        classNameMap.set(key, className);
+      });
+    }
+    combinedVariantStyles.forEach(([key, value]) => {
+      const styleEntry = styles[key];
+      const unistyles = unistylesMap.get(key);
+      const className = classNameMap.get(key);
+      const selectedVariantStyles = selectedVariantStylesMap.get(key);
+      if (!unistyles || !className) {
+        return;
+      }
+      if (variantsChanged) {
+        _registry.UnistylesRegistry.updateStyles(unistyles, value, className);
+      }
+      Object.defineProperties(styleEntry, (0, _utils.reduceObject)(selectedVariantStyles ?? {}, value => ({
+        value,
+        enumerable: false,
+        configurable: true
+      })));
+      if (styleEntry) {
+        Object.keys(styleEntry ?? {}).forEach(key => {
+          if (!key.startsWith('variant-')) {
+            return;
+          }
+
+          // @ts-expect-error - remove old variants
+          delete styleEntry[key];
+        });
+        // @ts-expect-error - apply variant className
+        styleEntry[className] = className;
+      }
+    });
+  };
+  Object.defineProperty(styles, 'useVariants', {
+    value: useVariants
+  });
+};
+exports.createUseVariants = createUseVariants;
+//# sourceMappingURL=useVariants.js.map

package/lib/commonjs/web/variants/useVariants.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_utils","_registry","_getVariants","createUseVariants","styles","setSelectedVariants","useVariants","selectedVariants","unistylesMap","useState","Map","classNameMap","selectedVariantStylesMap","lastSelectedVariantsRef","useRef","variantsChanged","equal","current","combinedVariantStyles","useMemo","result","getVariants","forEach","key","value","set","size","length","className","unistyles","UnistylesRegistry","createStyles","styleEntry","get","selectedVariantStyles","updateStyles","Object","defineProperties","reduceObject","enumerable","configurable","keys","startsWith","defineProperty","exports"],"sourceRoot":"../../../../src","sources":["web/variants/useVariants.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/specs/ShadowRegistry/index.js

@@ -10,11 +10,11 @@ const findShadowNodeForHandle = handle => {
   }
   return node;
 };
-HybridShadowRegistry.add = (handle, style) => {
+HybridShadowRegistry.add = (handle, style, variants) => {
   if (!handle || !style?.__unid) {
     return;
   }
-  HybridShadowRegistry.link(findShadowNodeForHandle(handle), style);
+  HybridShadowRegistry.link(findShadowNodeForHandle(handle), style, variants ?? {});
 };
 HybridShadowRegistry.remove = (handle, style) => {
   if (!handle || !style?.__unid) {

package/lib/module/specs/ShadowRegistry/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["NitroModules","HybridShadowRegistry","createHybridObject","findShadowNodeForHandle","handle","node","__internalInstanceHandle","stateNode","getScrollResponder","getNativeScrollRef","Error","add","style","__unid","link","remove","unlink","UnistylesShadowRegistry"],"sourceRoot":"../../../../src","sources":["specs/ShadowRegistry/index.ts"],"mappings":";;AAAA,SAASA,YAAY,QAAQ,4BAA4B;AAazD,MAAMC,oBAAoB,GAAGD,YAAY,CAACE,kBAAkB,CAAiB,yBAAyB,CAAC;AAEvG,MAAMC,uBAAuB,GAAIC,MAAkB,IAAK;EACpD,MAAMC,IAAI,GAAGD,MAAM,EAAEE,wBAAwB,EAAEC,SAAS,EAAEF,IAAI,IACvDD,MAAM,EAAEI,kBAAkB,GAAG,CAAC,EAAEC,kBAAkB,GAAG,CAAC,EAAEH,wBAAwB,EAAEC,SAAS,EAAEF,IAAI,IACjGD,MAAM,EAAEK,kBAAkB,GAAG,CAAC,EAAEH,wBAAwB,EAAEC,SAAS,EAAEF,IAAI;EAEhF,IAAI,CAACA,IAAI,EAAE;IACP;IACA,MAAM,IAAIK,KAAK,CAAC,uDAAuD,CAAC;EAC5E;EAEA,OAAOL,IAAI;AACf,CAAC;AAEDJ,oBAAoB,CAACU,GAAG,GAAG,CAACP,MAAM,EAAEQ,KAAK,KAAK;EAC1C,IAAI,CAACR,MAAM,IAAI,CAACQ,KAAK,EAAEC,MAAM,EAAE;IAC3B;EACJ;EAEAZ,oBAAoB,CAACa,IAAI,CAACX,uBAAuB,CAACC,MAAM,CAAC,EAAEQ,KAAK,CAAC;AACrE,CAAC;AAEDX,oBAAoB,CAACc,MAAM,GAAG,CAACX,MAAM,EAAEQ,KAAK,KAAK;EAC7C,IAAI,CAACR,MAAM,IAAI,CAACQ,KAAK,EAAEC,MAAM,EAAE;IAC3B;EACJ;EAEAZ,oBAAoB,CAACe,MAAM,CAACb,uBAAuB,CAACC,MAAM,CAAC,EAAEQ,KAAK,CAAC;AACvE,CAAC;AAQD,OAAO,MAAMK,uBAAuB,GAAGhB,oBAA4D","ignoreList":[]}
+{"version":3,"names":["NitroModules","HybridShadowRegistry","createHybridObject","findShadowNodeForHandle","handle","node","__internalInstanceHandle","stateNode","getScrollResponder","getNativeScrollRef","Error","add","style","variants","__unid","link","remove","unlink","UnistylesShadowRegistry"],"sourceRoot":"../../../../src","sources":["specs/ShadowRegistry/index.ts"],"mappings":";;AAAA,SAASA,YAAY,QAAQ,4BAA4B;AAazD,MAAMC,oBAAoB,GAAGD,YAAY,CAACE,kBAAkB,CAAiB,yBAAyB,CAAC;AAEvG,MAAMC,uBAAuB,GAAIC,MAAkB,IAAK;EACpD,MAAMC,IAAI,GAAGD,MAAM,EAAEE,wBAAwB,EAAEC,SAAS,EAAEF,IAAI,IACvDD,MAAM,EAAEI,kBAAkB,GAAG,CAAC,EAAEC,kBAAkB,GAAG,CAAC,EAAEH,wBAAwB,EAAEC,SAAS,EAAEF,IAAI,IACjGD,MAAM,EAAEK,kBAAkB,GAAG,CAAC,EAAEH,wBAAwB,EAAEC,SAAS,EAAEF,IAAI;EAEhF,IAAI,CAACA,IAAI,EAAE;IACP;IACA,MAAM,IAAIK,KAAK,CAAC,uDAAuD,CAAC;EAC5E;EAEA,OAAOL,IAAI;AACf,CAAC;AAEDJ,oBAAoB,CAACU,GAAG,GAAG,CAACP,MAAM,EAAEQ,KAAK,EAAEC,QAAQ,KAAK;EACpD,IAAI,CAACT,MAAM,IAAI,CAACQ,KAAK,EAAEE,MAAM,EAAE;IAC3B;EACJ;EAEAb,oBAAoB,CAACc,IAAI,CAACZ,uBAAuB,CAACC,MAAM,CAAC,EAAEQ,KAAK,EAAEC,QAAQ,IAAI,CAAC,CAAC,CAAC;AACrF,CAAC;AAEDZ,oBAAoB,CAACe,MAAM,GAAG,CAACZ,MAAM,EAAEQ,KAAK,KAAK;EAC7C,IAAI,CAACR,MAAM,IAAI,CAACQ,KAAK,EAAEE,MAAM,EAAE;IAC3B;EACJ;EAEAb,oBAAoB,CAACgB,MAAM,CAACd,uBAAuB,CAACC,MAAM,CAAC,EAAEQ,KAAK,CAAC;AACvE,CAAC;AAQD,OAAO,MAAMM,uBAAuB,GAAGjB,oBAA4D","ignoreList":[]}

package/lib/module/specs/StyleSheet/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["NitroModules","processColor","StyleSheet","NativeStyleSheet","HybridUnistylesStyleSheet","createHybridObject","absoluteFillObject","absoluteFill","flatten","compose","jsMethods"],"sourceRoot":"../../../../src","sources":["specs/StyleSheet/index.ts"],"mappings":";;AAAA,SAASA,YAAY,QAAQ,4BAA4B;AACzD,SAASC,YAAY,EAAEC,UAAU,IAAIC,gBAAgB,QAAQ,cAAc;AA+B3E,MAAMC,yBAAyB,GAAGJ,YAAY,CACzCK,kBAAkB,CAAsB,qBAAqB,CAAC;AAEnED,yBAAyB,CAACE,kBAAkB,GAAGH,gBAAgB,CAACG,kBAAkB;AAClFF,yBAAyB,CAACG,YAAY,GAAGJ,gBAAgB,CAACI,YAAY;AACtEH,yBAAyB,CAACI,OAAO,GAAGL,gBAAgB,CAACK,OAAO;AAC5DJ,yBAAyB,CAACK,OAAO,GAAGN,gBAAgB,CAACM,OAAO;AAC5DL,yBAAyB,CAACM,SAAS,GAAG;EAClCT;AACJ,CAAC;AAED,OAAO,MAAMC,UAAU,GAAGE,yBAAmE","ignoreList":[]}
+{"version":3,"names":["NitroModules","processColor","StyleSheet","NativeStyleSheet","HybridUnistylesStyleSheet","createHybridObject","absoluteFillObject","absoluteFill","flatten","compose","jsMethods"],"sourceRoot":"../../../../src","sources":["specs/StyleSheet/index.ts"],"mappings":";;AAAA,SAASA,YAAY,QAAQ,4BAA4B;AACzD,SAASC,YAAY,EAAEC,UAAU,IAAIC,gBAAgB,QAAQ,cAAc;AA+B3E,MAAMC,yBAAyB,GAAGJ,YAAY,CACzCK,kBAAkB,CAAsB,qBAAqB,CAAC;AAEnED,yBAAyB,CAACE,kBAAkB,GAAGH,gBAAgB,CAACG,kBAAkB;AAClFF,yBAAyB,CAACG,YAAY,GAAGJ,gBAAgB,CAACI,YAAY;AACtEH,yBAAyB,CAACI,OAAO,GAAGL,gBAAgB,CAACK,OAAO;AAC5DJ,yBAAyB,CAACK,OAAO,GAAGN,gBAAgB,CAACM,OAAO;AAC5DL,yBAAyB,CAACM,SAAS,GAAG;EAClCT;AACJ,CAAC;AAID,OAAO,MAAMC,UAAU,GAAGE,yBAAsE","ignoreList":[]}

package/lib/module/specs/index.web.js

@@ -1,5 +1,5 @@
 "use strict";
 
 export const getSSRUnistyles = () => [];
-export * from '../../web';
+export * from '../web';
 //# sourceMappingURL=index.web.js.map

package/lib/module/specs/index.web.js.map

@@ -1 +1 @@
-{"version":3,"names":["getSSRUnistyles"],"sourceRoot":"../../../src","sources":["specs/index.web.ts"],"mappings":";;AAEA,OAAO,MAAMA,eAAe,GAAGA,CAAA,KAAM,EAAyB;AAE9D,cAAc,WAAW","ignoreList":[]}
+{"version":3,"names":["getSSRUnistyles"],"sourceRoot":"../../../src","sources":["specs/index.web.ts"],"mappings":";;AAEA,OAAO,MAAMA,eAAe,GAAGA,CAAA,KAAM,EAAyB;AAE9D,cAAc,QAAQ","ignoreList":[]}