alga-css - npm Package Compare versions

Comparing version 1.0.0-iron-0 to 1.0.0-iron-1

package.json

 {
   "name": "alga-css",
-  "version": "1.0.0-iron-0",
+  "version": "1.0.0-iron-1",
   "description": "Alga CSS is a scope-first CSS toolkit for quickly mix or compose CSS references and share CSS properties between components",
@@ -5,0 +5,0 @@ "main": "src/index.js",

src/cores/component.js

@@ -6,2 +6,3 @@ const postcss = require('postcss')
 const camelDash = require('../helpers/camelDash.js')
+const randomChar = require('../helpers/randomChar.js')
 const reference = require('./reference.js')
@@ -95,10 +96,13 @@ const recursive = require('./recursive.js')
       defineObj['body'] = []
-      defineObj['condition'] = {}
+      defineObj['content'] = {}
+      let index = 1
       for(let dnode of rnode.nodes) {
+        const randId = randomChar(index, 6)
+        defineObj['content'][randId] = []
         if(dnode.type === 'atrule' && dnode.name === 'use') {
-          defineObj['header'] = Object.assign({}, defineObj['header'], component[componentName]['modules'][dnode.params.trim()])
+          defineObj['content'][randId].push(component[componentName]['modules'][dnode.params.trim()])
         } else if(dnode.type === 'atrule' && dnode.name === 'if') {
           if('nodes' in dnode) {
             let ifDefineObj = {}
-            ifDefineObj[dnode.params.trim()] = []
+            ifDefineObj['@if '+dnode.params.trim()] = []
             for(let ifnode of dnode.nodes) {
@@ -108,6 +112,6 @@ let ifRecursiveDefineObj = recursive(ifnode, {
               })
-              ifDefineObj[dnode.params.trim()].push(ifRecursiveDefineObj.body)
+              ifDefineObj['@if '+dnode.params.trim()].push(ifRecursiveDefineObj.body)
             }
-            ifDefineObj[dnode.params.trim()] = ifDefineObj[dnode.params.trim()].flat()
-            defineObj['condition'] = Object.assign({}, defineObj['condition'], ifDefineObj)
+            ifDefineObj['@if '+dnode.params.trim()] = ifDefineObj['@if '+dnode.params.trim()].flat()
+            defineObj['content'][randId].push(ifDefineObj)
           }
@@ -118,6 +122,9 @@ } else {
           })
-          defineObj['body'].push(recursiveDefineObj.body)
+          defineObj['content'][randId].push(recursiveDefineObj.body)
         }
+        
+        defineObj['content'][randId] = defineObj['content'][randId].flat()
+        index++
       }
-      defineObj['body'] = defineObj['body'].flat()
+      defineObj['body'] = Object.values(defineObj['content']).flat()
       component[componentName][param] = Object.assign({}, component[componentName][param], defineObj)
@@ -124,0 +131,0 @@ } else if(rnode.type === 'atrule' && rnode.name === 'use') {

src/cores/declaration.js

@@ -5,3 +5,3 @@ const postcss = require('postcss')
 
-module.exports = (body, props, provide, opts) => {
+const declaration = (body, props, provide, opts) => {
   const screen = Object.assign({}, flatScreen(opts.screen))
@@ -15,48 +15,69 @@ const state = Object.assign({}, statusValue(opts.state))
     const itemKey = Object.keys(item)[0]
-    const itemValues = Object.entries(item[itemKey])
-    const newRule = postcss.rule({ selector: itemKey })
-    for(let [key, val] of itemValues) {
-      if(typeof val === 'string') {
-        if(key.trim().startsWith('inject-')) {
-          for(let [keyInject, valInject] of Object.entries(provide[props[val]])) {
-            let declVal = postcss.decl({ prop: keyInject.trim(), value: valInject.trim() })
+    if(itemKey.startsWith('@if ')) {
+      const itemValue = Object.values(item)[0]
+      const ifKey = itemKey.replace('@if ', '')
+      if(ifKey.includes(' is ')) {
+        const splitKey = ifKey.trim().split(/\sis\s/g).filter(i => i !== '')
+        if(typeof props === 'object' && props !== null && splitKey[0].trim() in props && props[splitKey[0].trim()] === splitKey[1].trim()) {
+          ruleArray.push([
+            ...declaration(itemValue, props, provide, opts)
+          ])
+        }
+      } else if(ifKey.includes(' has ')) {
+        const splitKey = ifKey.trim().split(/\shas\s/g).filter(i => i !== '')
+        if(typeof props === 'object' && props !== null && splitKey[0].trim() in props && props[splitKey[0].trim()].replaceAll(' ', '').split(',').filter(i => i !== '').includes(splitKey[1].trim())) {
+          ruleArray.push([
+            ...declaration(itemValue, props, provide, opts)
+          ])
+        }
+      }
+    } else {
+      const itemValues = Object.entries(item[itemKey])
+      const newRule = postcss.rule({ selector: itemKey })
+      for(let [key, val] of itemValues) {
+        if(typeof val === 'string') {
+          if(key.trim().startsWith('inject-')) {
+            for(let [keyInject, valInject] of Object.entries(provide[props[val]])) {
+              let declVal = postcss.decl({ prop: keyInject.trim(), value: valInject.trim() })
+              newRule.append(declVal)
+            }
+          } else {
+            let declVal = undefined
+            if(val.trim().startsWith('{') && val.trim().endsWith('}')) {
+              let newDeclVal = val.replace('{', '').replace('}', '').trim()
+              const splitDeclVal = newDeclVal.split(/\(|\)|\s|,/g).filter(i => i !== '')
+              if(Number(splitDeclVal.length) === 1) {
+                declVal = postcss.decl({ prop: key.trim(), value: props[newDeclVal] })
+              } else {
+                for(let splittedDecl of splitDeclVal) {
+                  if(props[splittedDecl]) {
+                    newDeclVal = newDeclVal.replaceAll(splittedDecl, props[splittedDecl])
+                  }
+                }
+                declVal = postcss.decl({ prop: key.trim(), value: newDeclVal })
+              }
+            } else {
+              declVal = postcss.decl({ prop: key.trim(), value: val.trim() })
+            }
             newRule.append(declVal)
           }
         } else {
-          let declVal = undefined
-          if(val.trim().startsWith('{') && val.trim().endsWith('}')) {
-            let newDeclVal = val.replace('{', '').replace('}', '').trim()
-            const splitDeclVal = newDeclVal.split(/\(|\)|\s|,/g).filter(i => i !== '')
-            if(Number(splitDeclVal.length) === 1) {
-              declVal = postcss.decl({ prop: key.trim(), value: props[newDeclVal] })
-            } else {
-              for(let splittedDecl of splitDeclVal) {
-                if(props[splittedDecl]) {
-                  newDeclVal = newDeclVal.replaceAll(splittedDecl, props[splittedDecl])
-                }
-              }
-              declVal = postcss.decl({ prop: key.trim(), value: newDeclVal })
+          const splitKey = key.split('-')
+          if(splitKey.length >= 2) {
+            if(Object.keys(screen).includes(splitKey[1])) {
+              screen[splitKey[1]].value[itemKey] = Object.assign({}, screen[splitKey[1]].value[itemKey], val)
+              screen[splitKey[1]].status = true
+            } else if(Object.keys(state).includes(splitKey[1])) {
+              state[splitKey[1]].value[itemKey] = Object.assign({}, state[splitKey[1]].value[itemKey], val)
+              state[splitKey[1]].status = true
+            } else if(Object.keys(prefers).includes(splitKey[1])) {
+              prefers[splitKey[1]].value[itemKey] = Object.assign({}, prefers[splitKey[1]].value[itemKey], val)
+              prefers[splitKey[1]].status = true
             }
-          } else {
-            declVal = postcss.decl({ prop: key.trim(), value: val.trim() })
           }
-          newRule.append(declVal)
         }
-      } else {
-        const splitKey = key.split('-')
-        if(splitKey.length >= 2) {
-          if(Object.keys(screen).includes(splitKey[1])) {
-            screen[splitKey[1]].value[itemKey] = Object.assign({}, screen[splitKey[1]].value[itemKey], val)
-            screen[splitKey[1]].status = true
-          } else if(Object.keys(state).includes(splitKey[1])) {
-            state[splitKey[1]].value[itemKey] = Object.assign({}, state[splitKey[1]].value[itemKey], val)
-            state[splitKey[1]].status = true
-          } else if(Object.keys(prefers).includes(splitKey[1])) {
-            prefers[splitKey[1]].value[itemKey] = Object.assign({}, prefers[splitKey[1]].value[itemKey], val)
-            prefers[splitKey[1]].status = true
-          }
-        }
       }
+      
+      ruleArray.push(newRule)
     }
-    ruleArray.push(newRule)
   }
@@ -91,3 +112,5 @@
   
-  return [...ruleArray, ...atRuleArray]
+  return [...ruleArray.flat(), ...atRuleArray]
 }
+
+module.exports = declaration

src/cores/selector.js

@@ -6,3 +6,3 @@ module.exports = (root, param) => {
     if(newSelector.includes('&')) {
-      newSelector.replaceAll('&', param.trim())
+      newSelector = newSelector.replaceAll('&', param.trim())
     } else {
@@ -9,0 +9,0 @@ newSelector = param.trim() +' '+ newSelector

src/index.js

@@ -63,28 +63,2 @@ // Configs
           }
-          const conditionDecls = []
-          for(let [condKey, condVal] of Object.entries(config.components[param][name]['condition'])) {
-            if(condKey.includes(' is ')) {
-              const splitKey = condKey.trim().split(/\@if\s|\sis\s/g).filter(i => i !== '')
-              if(config.components[param]['props'] && splitKey[0].trim() in config.components[param]['props'] && config.components[param]['props'][splitKey[0].trim()] === splitKey[1].trim()) {
-                conditionDecls.push([
-                  ...declaration(condVal, config.components[param]['props'], config.components[param]['provide'], {
-                    screen: config.screen,
-                    state: config.state, 
-                    prefers: config.prefers
-                  })
-                ])
-              }
-            } else if(condKey.includes(' has ')) {
-              const splitKey = condKey.trim().split(/\@if\s|\shas\s/g).filter(i => i !== '')
-              if(config.components[param]['props'] && splitKey[0].trim() in config.components[param]['props'] && config.components[param]['props'][splitKey[0].trim()].replaceAll(' ', '').split(',').filter(i => i !== '').includes(splitKey[1].trim())) {
-                conditionDecls.push([
-                  ...declaration(condVal, config.components[param]['props'], config.components[param]['provide'], {
-                    screen: config.screen,
-                    state: config.state, 
-                    prefers: config.prefers
-                  })
-                ])
-              }
-            }
-          }
           newNodes = [
@@ -96,4 +70,3 @@ ...newNodes,
               prefers: config.prefers
-            }),
-            ...conditionDecls.flat()
+            })
           ]
@@ -128,28 +101,2 @@ rule.replaceWith(newNodes)
           }
-          const conditionDecls = []
-          for(let [condKey, condVal] of Object.entries(config.components[param][name]['condition'])) {
-            if(condKey.includes(' is ')) {
-              const splitKey = condKey.trim().split(/\@if\s|\sis\s/g).filter(i => i !== '')
-              if(config.components[param]['props'] && splitKey[0].trim() in config.components[param]['props'] && config.components[param]['props'][splitKey[0].trim()] === splitKey[1].trim()) {
-                conditionDecls.push([
-                  ...declaration(condVal, config.components[param]['props'], config.components[param]['provide'], {
-                    screen: config.screen,
-                    state: config.state, 
-                    prefers: config.prefers
-                  })
-                ])
-              }
-            } else if(condKey.includes(' has ')) {
-              const splitKey = condKey.trim().split(/\@if\s|\shas\s/g).filter(i => i !== '')
-              if(config.components[param]['props'] && splitKey[0].trim() in config.components[param]['props'] && config.components[param]['props'][splitKey[0].trim()].replaceAll(' ', '').split(',').filter(i => i !== '').includes(splitKey[1].trim())) {
-                conditionDecls.push([
-                  ...declaration(condVal, config.components[param]['props'], config.components[param]['provide'], {
-                    screen: config.screen,
-                    state: config.state, 
-                    prefers: config.prefers
-                  })
-                ])
-              }
-            }
-          }
           newPackNodes.push([
@@ -161,4 +108,3 @@ ...newNodes,
               prefers: config.prefers
-            }),
-            ...conditionDecls.flat()
+            })
           ])
@@ -165,0 +111,0 @@ }

Fixed alerts

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

Improved metrics

Total package byte prevSize

88639

increased by0.17%

Number of package files

44

increased by7.32%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Lines of code

1017

decreased by-1.83%

No dependency changes