css-in-props - npm Package Compare versions

Comparing version 2.11.453 to 2.11.455

dist/cjs/registry.js

 "use strict";
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
@@ -18,5 +20,14 @@ var __export = (target, all) => {
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var registry_exports = {};
 __export(registry_exports, {
+  CSS_PREPROCS_DEFAULTS: () => CSS_PREPROCS_DEFAULTS,
   CSS_PROPS_REGISTRY: () => CSS_PROPS_REGISTRY
@@ -26,2 +37,3 @@ });
 var import_utils = require("@domql/utils");
+var preprocs = __toESM(require("./props"), 1);
 var import_atoms = require("@symbo.ls/atoms");
@@ -42,1 +54,2 @@ const CSS_PROPS_REGISTRY = (0, import_utils.mergeArray)([
 ]).class;
+const CSS_PREPROCS_DEFAULTS = (0, import_utils.mergeArray)(Object.values(preprocs));

dist/cjs/transform.js

@@ -21,2 +21,3 @@ "use strict";
 __export(transform_exports, {
+  extractCSSfromProps: () => extractCSSfromProps,
   transformClassname: () => transformClassname
@@ -28,27 +29,57 @@ });
 var import_registry = require("./registry");
-const transformClassname = (props, context = {}, registry = import_registry.CSS_PROPS_REGISTRY, excludedProps = {}, element) => {
-  const CLASS_NAMES = {};
+var import_defaults = require("./defaults");
+const transformClassname = (element, restProps = {}) => {
+  const classCss = {};
+  const { props, class: elementClass } = element;
   if (!(0, import_utils.isObject)(props))
     return;
-  (0, import_utils.merge)(element.class, registry);
-  if (Object.keys(registry)[0] !== Object.keys(import_registry.CSS_PROPS_REGISTRY)[0]) {
-    (0, import_utils.merge)(element.class, import_registry.CSS_PROPS_REGISTRY);
-  }
   for (const key in props) {
     const setter = import_atoms.keySetters[key.slice(0, 1)];
-    const hasCSS = registry[key];
+    const hasCSS = elementClass[key];
     if (setter)
-      setter(key, props[key], CLASS_NAMES, element, true);
+      setter(key, props[key], classCss, element, true);
     else if ((0, import_utils.isFunction)(hasCSS)) {
-      const stack = hasCSS({ ...element, props, context });
+      const stack = hasCSS(element, element.state, element.context);
       const exec = (0, import_utils.isArray)(stack) ? stack.reduce((a, c) => {
         return (0, import_utils.merge)(a, c);
       }, {}) : stack;
-      (0, import_utils.deepMerge)(CLASS_NAMES, exec);
+      (0, import_utils.deepMerge)(classCss, exec);
     } else if (key === "style") {
-      (0, import_utils.deepMerge)(CLASS_NAMES, props[key]);
+      (0, import_utils.deepMerge)(classCss, props[key]);
     } else
-      excludedProps[key] = props[key];
+      restProps[key] = props[key];
   }
-  return CLASS_NAMES;
+  return classCss;
 };
+const extractCSSfromProps = (element) => {
+  const { props: defProps } = element;
+  const css = {};
+  const props = {};
+  for (const key in defProps) {
+    const val = defProps[key];
+    const mediaProp = import_atoms.keySetters[key.slice(0, 1)];
+    if (mediaProp) {
+      mediaProp(key, defProps[key], css, element, true);
+      continue;
+    }
+    const preprop = import_registry.CSS_PREPROCS_DEFAULTS[key];
+    if (preprop) {
+      const stack = preprop(element, element.state, element.context);
+      const exec = (0, import_utils.isArray)(stack) ? stack.reduce((a, c) => {
+        return (0, import_utils.merge)(a, c);
+      }, {}) : stack;
+      (0, import_utils.deepMerge)(css, exec);
+      continue;
+    }
+    if (key === "style") {
+      (0, import_utils.deepMerge)(css, defProps[key]);
+      continue;
+    }
+    if (import_defaults.DEFAULT_CSS_PROPERTIES_LIST.includes(key)) {
+      css[key] = val;
+      continue;
+    }
+    props[key] = val;
+  }
+  return { css, props };
+};

package.json

@@ -5,3 +5,3 @@ {
   "author": "symbo.ls",
-  "version": "2.11.453",
+  "version": "2.11.455",
   "repository": "https://github.com/symbo-ls/smbls",
@@ -30,7 +30,7 @@ "type": "module",
     "@domql/utils": "^2.5.0",
-    "@symbo.ls/atoms": "^2.11.453",
+    "@symbo.ls/atoms": "^2.11.455",
     "@symbo.ls/emotion": "^2.11.453",
     "@symbo.ls/scratch": "^2.11.453"
   },
-  "gitHead": "8e5458a957b9d2c75944023e2c31bab157034314"
+  "gitHead": "2ec12ac36ba08a2d424a3806dba7ccb6f7bddfba"
 }

src/registry.js

 'use strict'
 
 import { mergeArray } from '@domql/utils'
+import * as preprocs from './props'
 
@@ -34,1 +35,3 @@ import {
 ]).class
+
+export const CSS_PREPROCS_DEFAULTS = mergeArray(Object.values(preprocs))

src/transform.js

@@ -6,21 +6,27 @@ 'use strict'
 
-import { CSS_PROPS_REGISTRY } from './registry'
+import { CSS_PREPROCS_DEFAULTS } from './registry'
+import { DEFAULT_CSS_PROPERTIES_LIST } from './defaults'
 
-export const transformClassname = (props, context = {}, registry = CSS_PROPS_REGISTRY, excludedProps = {}, element) => {
-  const CLASS_NAMES = {}
+export const transformClassname = (
+  element,
+  restProps = {}
+) => {
+  const classCss = {}
+  const { props, class: elementClass } = element
+
   if (!isObject(props)) return
 
-  merge(element.class, registry)
-  if (Object.keys(registry)[0] !== Object.keys(CSS_PROPS_REGISTRY)[0]) {
-    merge(element.class, CSS_PROPS_REGISTRY)
-  }
+  // merge(elementClass, registry)
+  // if (registry && Object.keys(registry)[0] !== Object.keys(CSS_PROPS_REGISTRY)[0]) {
+  //   merge(elementClass, CSS_PROPS_REGISTRY)
+  // }
 
   for (const key in props) {
     const setter = keySetters[key.slice(0, 1)]
-    const hasCSS = registry[key]
+    const hasCSS = elementClass[key]
 
-    if (setter) setter(key, props[key], CLASS_NAMES, element, true)
+    if (setter) setter(key, props[key], classCss, element, true)
     else if (isFunction(hasCSS)) {
       // const stack = hasCSS(element)
-      const stack = hasCSS({ ...element, props, context })
+      const stack = hasCSS(element, element.state, element.context)
       const exec = isArray(stack)
@@ -31,9 +37,52 @@ ? stack.reduce((a, c) => {
         : stack
-      deepMerge(CLASS_NAMES, exec)
+      deepMerge(classCss, exec)
     } else if (key === 'style') {
-      deepMerge(CLASS_NAMES, props[key])
-    } else excludedProps[key] = props[key]
+      deepMerge(classCss, props[key])
+    } else restProps[key] = props[key]
   }
 
-  return CLASS_NAMES
+  return classCss
 }
+
+export const extractCSSfromProps = (element) => {
+  const { props: defProps } = element
+  const css = {}
+  const props = {}
+
+  for (const key in defProps) {
+    const val = defProps[key]
+
+    const mediaProp = keySetters[key.slice(0, 1)]
+    if (mediaProp) {
+      mediaProp(key, defProps[key], css, element, true)
+      continue
+    }
+
+    const preprop = CSS_PREPROCS_DEFAULTS[key]
+    if (preprop) {
+      // const stack = hasCSS(element)
+      const stack = preprop(element, element.state, element.context)
+      const exec = isArray(stack)
+        ? stack.reduce((a, c) => {
+          return merge(a, c)
+        }, {})
+        : stack
+      deepMerge(css, exec)
+      continue
+    }
+
+    if (key === 'style') {
+      deepMerge(css, defProps[key])
+      continue
+    }
+
+    if (DEFAULT_CSS_PROPERTIES_LIST.includes(key)) {
+      css[key] = val
+      continue
+    }
+
+    props[key] = val
+  }
+
+  return { css, props }
+}

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

42839

increased by247.52%

Number of package files

23

increased by76.92%

Lines of code

1427

increased by420.8%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• [e-mail]/atoms@^2.11.455