isomorfeus-preact 10.5.7 → 10.5.11

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 363f9c3c194571b11fdf9104bdde84985ca316d64f04af0590dd06372fa51a31
-  data.tar.gz: 9b63db87c2d1d6480df2381503dff665743a4e789cff5e00fa51c238f5f42814
+  metadata.gz: 88419500cce67fa82bb314527fdfde5446514866e03ca82a4d07e2cad72f123e
+  data.tar.gz: 0d9b1adce9accf362a4177679ed70a75615527061c1930e16f3899cd79d5a19b
 SHA512:
-  metadata.gz: aedafa0eebda6332e25780787b08d842109c52cc369baea348e9d83c066554de9cb74d05c7fe8f86d68d6974a6b20d4805ff3ddcd94a18561b9ab4a44b51ab68
-  data.tar.gz: 0763a62f108c91781e8fe3475e9a0dbee3cd88daab647cb88e91a7fcd42048505292c557ff7fd0495e754582e0ccc10bc354f9e3b35aa17e9ee3863418c29a9b
+  metadata.gz: 7439461af62b5c00c13d60f5a125494ca3029997825833d5c9bd4a6b0febfd546085584e27c60109666b983a180a45de863d60268894031bd6691ea9c35ba635
+  data.tar.gz: 892814a7a6dbe6eab3d2ef7c116412f01e9815be8b37f952a8a3936d46645200289be6e3c978eaa0941f6d061c4fd6e940cccc7b0cc7834fc491241e1a904ea7

data/LICENSE

@@ -20,10 +20,37 @@ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.
 
-Files in ruby/lib/browser directory originally taken from https://github.com/clearwater-rb/bowser, version 1.1.0:
+Files in lib/browser directory originally taken from https://github.com/clearwater-rb/bowser, version 1.1.0:
 
 MIT License
 
 Copyright (c) 2015 Jamie Gaskins
 
 (as above)
+
+Javascript in file lib/nano_css.rb taken from https://github.com/streamich/nano-css:
+
+This is free and unencumbered software released into the public domain.
+
+Anyone is free to copy, modify, publish, use, compile, sell, or
+distribute this software, either in source code form or as a compiled
+binary, for any purpose, commercial or non-commercial, and by any
+means.
+
+In jurisdictions that recognize copyright laws, the author or authors
+of this software dedicate any and all copyright interest in the
+software to the public domain. We make this dedication for the benefit
+of the public at large and to the detriment of our heirs and
+successors. We intend this dedication to be an overt act of
+relinquishment in perpetuity of all present and future rights to this
+software under copyright law.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR
+OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE,
+ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+OTHER DEALINGS IN THE SOFTWARE.
+
+For more information, please refer to <https://unlicense.org>

data/README.md

@@ -13,8 +13,6 @@ Isomorfeus-preact 10.5.x implements features and the API of Preact 10.5.y and sh
 
 ## Documentation
 
-- [Installation](https://github.com/isomorfeus/isomorfeus-preact/blob/master/ruby/docs/installation.md)
-
 Because isomorfeus-preact follows closely the Preact principles/implementation/API and Documentation, most things of the official Preact documentation
 apply, but in the Ruby way, see:
 - [https://preactjs.com/guide/v10/getting-started](https://preactjs.com/guide/v10/getting-started)
@@ -27,8 +25,7 @@ Component Types:
 - [React Javascript Components and React Elements](https://github.com/isomorfeus/isomorfeus-preact/blob/master/ruby/docs/javascript_component.md)
 
 Which component to use?
-- Usually LucidApp and LucidComponent along with some imported javascript components.
-- For MaterialUI LucidMaterial::App and LucidMaterial::Component along with some imported javascript components.
+- Usually LucidApp and LucidComponent.
 
 Specific to Class, Lucid and LucidMaterial Components:
 - [Events](https://github.com/isomorfeus/isomorfeus-preact/blob/master/ruby/docs/events.md)
@@ -47,7 +44,7 @@ Special React Features:
 - [Refs](https://github.com/isomorfeus/isomorfeus-preact/blob/master/ruby/docs/refs.md)
 
 Other Features:
-- [Hot Module Reloading](https://github.com/isomorfeus/isomorfeus-preact/blob/master/ruby/docs/hot_module_relaoding.md)
+- [Hot Module Reloading](https://github.com/isomorfeus/isomorfeus-preact/blob/master/ruby/docs/hot_module_reloading.md)
 - [Server Side Rendering](https://github.com/isomorfeus/isomorfeus-preact/blob/master/ruby/docs/server_side_rendering.md)
 - [Using Wouter as Router](https://github.com/isomorfeus/isomorfeus-preact/blob/master/ruby/docs/wouter.md)
 - [Isomorfeus Helpers](https://github.com/isomorfeus/isomorfeus-preact/blob/master/ruby/docs/isomorfeus_helpers.md)

data/lib/isomorfeus/preact/imports.rb

@@ -6,13 +6,6 @@ module Isomorfeus
         Isomorfeus.add_common_js_import('preact/hooks', 'PreactHooks', '*')
         Isomorfeus.add_common_js_import('wouter-preact', nil, ['Router', 'Link', 'Redirect', 'Route', 'Switch'])
 
-        Isomorfeus.add_common_js_import('nano-css', 'NanoCSS', '*')
-        %w[rule sheet nesting hydrate unitless global keyframes].each do |addon|
-          Isomorfeus.add_common_js_import("nano-css/addon/#{addon}", 'NanoCSSAddons', 'addon', addon)
-        end
-        Isomorfeus.add_common_js_import("nano-css/addon/animate/fadeIn", 'NanoCSSAddons', 'addon', 'fadeIn')
-        Isomorfeus.add_common_js_import("nano-css/addon/animate/fadeOut", 'NanoCSSAddons', 'addon', 'fadeOut')
-
         Isomorfeus.add_ssr_js_import('preact-render-to-string', 'Preact', ['render'], nil, 'renderToString')
         Isomorfeus.add_ssr_js_import('wouter-preact/static-location', 'staticLocationHook')
 

data/lib/isomorfeus/preact_view_helper.rb

@@ -135,13 +135,13 @@ module Isomorfeus
         Isomorfeus.raise_error(message: exception['message'], stack: exception['stack']) if exception
         render_result << " data-iso-hydrated='true'" if rendered_tree
         if Isomorfeus.respond_to?(:current_user) && Isomorfeus.current_user && !Isomorfeus.current_user.anonymous?
-          render_result << " data-iso-usid=#{Oj.dump(Isomorfeus.current_user.to_sid, mode: :strict)}"
+          render_result << " data-iso-usid=#{Oj.dump(Isomorfeus.current_user.sid, mode: :strict)}"
         end
         render_result << " data-iso-nloc='#{props[:locale]}'>"
         render_result << (rendered_tree ? rendered_tree : "SSR didn't work")
       else
         if Isomorfeus.respond_to?(:current_user) && Isomorfeus.current_user && !Isomorfeus.current_user.anonymous?
-          render_result << " data-iso-usid=#{Oj.dump(Isomorfeus.current_user.to_sid, mode: :strict)}"
+          render_result << " data-iso-usid=#{Oj.dump(Isomorfeus.current_user.sid, mode: :strict)}"
         end
         render_result << " data-iso-nloc='#{props[:locale]}'>"
       end

data/lib/isomorfeus-preact.rb

@@ -19,6 +19,9 @@ if RUBY_ENGINE == 'opal'
     require 'isomorfeus/top_level_ssr'
   end
 
+  # nanocss
+  require 'nano_css'
+  
   # preact
   require 'preact/version'
   require 'preact'

data/lib/lucid_app/context.rb

@@ -5,18 +5,18 @@ module LucidApp
       css_server = `null`
       css_server = `document.getElementById('css-server-side')` unless on_ssr?
       %x{
-        let og = Opal.global;
-        nano_css = (css_server) ? og.NanoCSS.create({ sh: css_server }) : og.NanoCSS.create();
-        og.NanoCSSAddons.rule(nano_css);
-        og.NanoCSSAddons.sheet(nano_css);
-        og.NanoCSSAddons.nesting(nano_css);
-        og.NanoCSSAddons.hydrate(nano_css);
-        og.NanoCSSAddons.unitless(nano_css);
-        og.NanoCSSAddons.global(nano_css);
-        og.NanoCSSAddons.keyframes(nano_css);
-        og.NanoCSSAddons.fadeIn(nano_css);
-        og.NanoCSSAddons.fadeOut(nano_css);
-        og.NanoCSSInstance = nano_css;
+        n = Opal.NanoCSS;
+        nano_css = (css_server) ? n.create({ sh: css_server }) : n.create();
+        n.rule(nano_css);
+        n.sheet(nano_css);
+        n.nesting(nano_css);
+        n.hydrate(nano_css);
+        n.unitless(nano_css);
+        n.global(nano_css);
+        n.keyframes(nano_css);
+        n.fadeIn(nano_css);
+        n.fadeOut(nano_css);
+        Opal.global.NanoCSSInstance = nano_css;
       }
       Preact.create_context('LucidApplicationContext', { iso_store: Isomorfeus.store, nano_css: nano_css })
     end

data/lib/nano_css.rb

@@ -0,0 +1,464 @@
+module NanoCSS
+  %x{
+    var KEBAB_REGEX = /[A-Z]/g;
+
+    function hash(str) {
+      var h = 5381, i = str.length;
+      while (i) h = (h * 33) ^ str.charCodeAt(--i);
+      return '_' + (h >>> 0).toString(36);
+    };
+  }
+
+  %x{
+    self.create = function (config) {
+      config = config || {};
+      var assign = config.assign || Object.assign;
+      var client = typeof window === 'object';
+
+      // Check if we are really in browser environment.
+      if (process.env.NODE_ENV !== 'production') {
+        if (client) {
+          if ((typeof document !== 'object') || !document.getElementsByTagName('HTML')) {
+            console.error('nano-css detected browser environment because of "window" global, but "document" global seems to be defective.');
+          }
+        }
+      }
+
+      var renderer = assign({
+        raw: '',
+        pfx: '_',
+        client: client,
+        assign: assign,
+        stringify: JSON.stringify,
+        kebab: function (prop) {
+          return prop.replace(KEBAB_REGEX, '-$&').toLowerCase();
+        },
+        decl: function (key, value) {
+          key = renderer.kebab(key);
+          return key + ':' + value + ';';
+        },
+        hash: function (obj) { return hash(renderer.stringify(obj)); },
+        selector: function (parent, selector) {
+          return parent + (selector[0] === ':' ? ''  : ' ') + selector;
+        },
+        putRaw: function (rawCssRule) { renderer.raw += rawCssRule; }
+      }, config);
+
+      if (renderer.client) {
+        if (!renderer.sh) { document.head.appendChild(renderer.sh = document.createElement('style')); }
+
+        if (process.env.NODE_ENV !== 'production') {
+          renderer.sh.setAttribute('data-nano-css-dev', '');
+
+          // Test style sheet used in DEV mode to test if .insetRule() would throw.
+          renderer.shTest = document.createElement('style');
+          renderer.shTest.setAttribute('data-nano-css-dev-tests', '');
+          document.head.appendChild(renderer.shTest);
+        }
+
+        renderer.putRaw = function (rawCssRule) {
+          // .insertRule() is faster than .appendChild(), that's why we use it in PROD.
+          // But CSS injected using .insertRule() is not displayed in Chrome Devtools,
+          // that's why we use .appendChild in DEV.
+          if (process.env.NODE_ENV === 'production') {
+            var sheet = renderer.sh.sheet;
+
+            // Unknown pseudo-selectors will throw, this try/catch swallows all errors.
+            try { sheet.insertRule(rawCssRule, sheet.cssRules.length); } 
+            catch (error) {}
+          } else {
+            // Test if .insertRule() works in dev mode. Unknown pseudo-selectors will throw when
+            // .insertRule() is used, but .appendChild() will not throw.
+            try {
+              renderer.shTest.sheet.insertRule(rawCssRule, renderer.shTest.sheet.cssRules.length);
+            } catch (error) {
+              if (config.verbose) {
+                console.error(error);
+              }
+            }
+
+            // Insert pretty-printed CSS for dev mode.
+            renderer.sh.appendChild(document.createTextNode(rawCssRule));
+          }
+        };
+      }
+
+      renderer.put = function (selector, decls, atrule) {
+        var str = '';
+        var prop, value;
+        var postponed = [];
+
+        for (prop in decls) {
+          value = decls[prop];
+
+          if ((value instanceof Object) && !(value instanceof Array)) {
+            postponed.push(prop);
+          } else {
+            if ((process.env.NODE_ENV !== 'production') && !renderer.sourcemaps) {
+              str += '    ' + renderer.decl(prop, value, selector, atrule) + '\n';
+            } else {
+              str += renderer.decl(prop, value, selector, atrule);
+            }
+          }
+        }
+
+        if (str) {
+          if ((process.env.NODE_ENV !== 'production') && !renderer.sourcemaps) {
+            str = '\n' + selector + ' {\n' + str + '}\n';
+          } else {
+            str = selector + '{' + str + '}';
+          }
+          renderer.putRaw(atrule ? atrule + '{' + str + '}' : str);
+        }
+
+        for (var i = 0; i < postponed.length; i++) {
+          prop = postponed[i];
+
+          if (prop[0] === '@' && prop !== '@font-face') {
+            renderer.putAt(selector, decls[prop], prop);
+          } else {
+            renderer.put(renderer.selector(selector, prop), decls[prop], atrule);
+          }
+        }
+      };
+
+      renderer.putAt = renderer.put;
+
+      return renderer;
+    };
+  }   
+  
+  # addons
+
+  %x{
+    self.rule = function (renderer) {
+      var blocks;
+      if (process.env.NODE_ENV !== 'production') {
+          blocks = {};
+      }
+  
+      renderer.rule = function (css, block) {
+          // Warn user if CSS selectors clash.
+          if (process.env.NODE_ENV !== 'production') {
+              if (block) {
+                  if (typeof block !== 'string') {
+                      throw new TypeError(
+                          'nano-css block name must be a string. ' +
+                          'For example, use nano.rule({color: "red"}, "RedText").'
+                      );
+                  }
+  
+                  if (blocks[block]) {
+                      console.error('Block name "' + block + '" used more than once.');
+                  }
+  
+                  blocks[block] = 1;
+              }
+          }
+  
+          block = block || renderer.hash(css);
+          block = renderer.pfx + block;
+          renderer.put('.' + block, css);
+  
+          return ' ' + block;
+      };
+    };
+  }
+
+  %x{
+    self.sheet = function (renderer) { 
+      renderer.sheet = function (map, block) {
+        var result = {};
+  
+        if (!block) {
+          block = renderer.hash(map);
+        }
+  
+        var onElementModifier = function (elementModifier) {
+          var styles = map[elementModifier];
+  
+          if ((process.env.NODE_ENV !== 'production') && renderer.sourcemaps) {
+            // In dev mode emit CSS immediately to generate sourcemaps.
+            result[elementModifier] = renderer.rule(styles, block + '-' + elementModifier);
+          } else {
+            Object.defineProperty(result, elementModifier, {
+              configurable: true,
+              enumerable: true,
+              get: function () {
+                var classNames = renderer.rule(styles, block + '-' + elementModifier);
+  
+                Object.defineProperty(result, elementModifier, {
+                  value: classNames,
+                  enumerable: true
+                });
+  
+                return classNames;
+              },
+            });
+          }
+        };
+  
+        for (var elementModifier in map) {
+          onElementModifier(elementModifier);
+        }
+  
+        return result;
+      };
+    };
+  }
+
+  %x{
+    self.nesting = function (renderer) {
+      renderer.selector = function (parentSelectors, selector) {
+        var parents = parentSelectors.split(',');
+        var result = [];
+        var selectors = selector.split(',');
+        var len1 = parents.length;
+        var len2 = selectors.length;
+        var i, j, sel, pos, parent, replacedSelector;
+  
+        for (i = 0; i < len2; i++) {
+          sel = selectors[i];
+          pos = sel.indexOf('&');
+  
+          if (pos > -1) {
+            for (j = 0; j < len1; j++) {
+              parent = parents[j];
+              replacedSelector = sel.replace(/&/g, parent);
+              result.push(replacedSelector);
+            }
+          } else {
+            for (j = 0; j < len1; j++) {
+              parent = parents[j];
+  
+              if (parent) {
+                result.push(parent + ' ' + sel);
+              } else {
+                result.push(sel);
+              }
+            }
+          }
+        }
+  
+        return result.join(',');
+      };
+    };
+  }
+
+  %x{
+    self.hydrate = function (renderer) {
+      var hydrated = {};
+  
+      renderer.hydrate = function (sh) {
+        var cssRules = sh.cssRules || sh.sheet.cssRules;
+  
+        for (var i = 0; i < cssRules.length; i++)
+          hydrated[cssRules[i].selectorText] = 1;
+      };
+  
+      if (renderer.client) {
+        if (renderer.sh) renderer.hydrate(renderer.sh);
+  
+        var put = renderer.put;
+  
+        renderer.put = function (selector, css) {
+          if (selector in hydrated) return;
+  
+          put(selector, css);
+        };
+      }
+    };
+  }
+  
+  %x{
+    var UNITLESS_NUMBER_PROPS = [
+      'animation-iteration-count',
+      'border-image-outset',
+      'border-image-slice',
+      'border-image-width',
+      'box-flex',
+      'box-flex-group',
+      'box-ordinal-group',
+      'column-count',
+      'columns',
+      'flex',
+      'flex-grow',
+      'flex-positive',
+      'flex-shrink',
+      'flex-negative',
+      'flex-order',
+      'grid-row',
+      'grid-row-end',
+      'grid-row-span',
+      'grid-row-start',
+      'grid-column',
+      'grid-column-end',
+      'grid-column-span',
+      'grid-column-start',
+      'font-weight',
+      'line-clamp',
+      'line-height',
+      'opacity',
+      'order',
+      'orphans',
+      'tabSize',
+      'widows',
+      'z-index',
+      'zoom',
+  
+      // SVG-related properties
+      'fill-opacity',
+      'flood-opacity',
+      'stop-opacity',
+      'stroke-dasharray',
+      'stroke-dashoffset',
+      'stroke-miterlimit',
+      'stroke-opacity',
+      'stroke-width',
+    ];
+    
+    var unitlessCssProperties = {};
+    
+    for (var i = 0; i < UNITLESS_NUMBER_PROPS.length; i++) {
+      var prop = UNITLESS_NUMBER_PROPS[i];
+    
+      unitlessCssProperties[prop] = 1;
+      unitlessCssProperties['-webkit-' + prop] = 1;
+      unitlessCssProperties['-ms-' + prop] = 1;
+      unitlessCssProperties['-moz-' + prop] = 1;
+      unitlessCssProperties['-o-' + prop] = 1;
+    }
+    
+    self.unitless = function (renderer) {
+      var decl = renderer.decl;
+  
+      renderer.decl = function (prop, value) {
+        var str = decl(prop, value);
+  
+        if (typeof value === 'number') {
+          var pos = str.indexOf(':');
+          var propKebab = str.substr(0, pos);
+  
+          if (!unitlessCssProperties[propKebab]) {
+            return decl(prop, value + 'px');
+          }
+        }
+  
+        return str;
+      };
+    };
+  }
+
+  %x{
+    self.global = function (renderer) {
+      var selector = renderer.selector;
+  
+      renderer.selector = function (parent, current) {
+        if (parent.indexOf(':global') > -1) parent = '';
+  
+        return selector(parent, current);
+      };
+  
+      renderer.global = function (css) {
+        return renderer.put('', css);
+      };
+    };
+  }
+
+  %x{
+    self.keyframes = function (renderer, config) { 
+      config = renderer.assign({
+        prefixes: ['-webkit-', '-moz-', '-o-', ''],
+      }, config || {});
+  
+      var prefixes = config.prefixes;
+  
+      if (renderer.client) {
+        // Craete @keyframe Stylesheet `ksh`.
+        document.head.appendChild(renderer.ksh = document.createElement('style'));
+      }
+  
+      var putAt = renderer.putAt;
+  
+      renderer.putAt = function (__, keyframes, prelude) {
+        // @keyframes
+        if (prelude[1] === 'k') {
+          var str = '';
+  
+          for (var keyframe in keyframes) {
+            var decls = keyframes[keyframe];
+            var strDecls = '';
+  
+            for (var prop in decls)
+              strDecls += renderer.decl(prop, decls[prop]);
+  
+            str += keyframe + '{' + strDecls + '}';
+          }
+  
+          for (var i = 0; i < prefixes.length; i++) {
+            var prefix = prefixes[i];
+            var rawKeyframes = prelude.replace('@keyframes', '@' + prefix + 'keyframes') + '{' + str + '}';
+  
+            if (renderer.client) {
+              renderer.ksh.appendChild(document.createTextNode(rawKeyframes));
+            } else {
+              renderer.putRaw(rawKeyframes);
+            }
+          }
+  
+          return;
+        }
+  
+        putAt(__, keyframes, prelude);
+      };
+  
+      renderer.keyframes = function (keyframes, block) {
+        if (!block) block = renderer.hash(keyframes);
+          block = renderer.pfx + block;
+  
+        renderer.putAt('', keyframes, '@keyframes ' + block);
+  
+        return block;
+      };
+    };
+  }
+
+  %x{
+    self.fadeIn = function (renderer) {
+      renderer.put('', {
+        '@keyframes fadeIn': {
+          from: {
+            opacity: 0,
+          },
+          to: {
+            opacity: 1,
+          }
+        },
+  
+        '.fadeIn': {
+          animation: 'fadeIn .4s linear',
+        }
+      });
+    };
+  }
+
+  %x{
+    self.fadeOut = function (renderer) {
+      renderer.put('', {
+        '@keyframes fadeOut': {
+          from: {
+            opacity: 1,
+          },
+          to: {
+            opacity: 0,
+          }
+        },
+  
+        '.fadeOut': {
+          animation: 'fadeOut .3s linear',
+          'animation-fill-mode': 'forwards',
+        }
+      });
+    };
+  }
+end

data/lib/preact/version.rb

@@ -1,3 +1,3 @@
 module Preact
-  VERSION = '10.5.7'
+  VERSION = '10.5.11'
 end