smbls 0.8.37 → 0.8.40

package/package.json

@@ -3,7 +3,7 @@
   "description": "UI Library built on Scratch and DOMQL",
   "private": false,
   "author": "symbo.ls",
-  "version": "0.8.37",
+  "version": "0.8.40",
   "repository": "https://github.com/symbo-ls/smbls",
   "main": "src/index.js",
   "files": [

package/src/Link.js

@@ -1,10 +1,8 @@
 'use strict'
 
 import { exec } from '@domql/utils'
-import { Shape, Text } from '.'
 
 export const Link = {
-  proto: [Shape, Text],
   tag: 'a',
   props: {
     // theme: 'link',

package/src/Media.js

@@ -47,13 +47,15 @@ const convertPropsToClass = (props, result, element) => {
 const applyMediaProps = (key, props, result, element) => {
   const mediaName = CONFIG_MEDIA[key.slice(1)]
   const generatedClass = convertPropsToClass(props, result, element)
+
   const rootState = element.__root ? element.__root.state : element.state
   const { globalTheme } = rootState
   const name = key.slice(1)
+  const isTheme = ['dark', 'light'].includes(name)
   const matchesGlobal = name === globalTheme
 
-  if (globalTheme) {
-    if (matchesGlobal) merge(result, generatedClass)
+  if (globalTheme && isTheme) {
+    if (matchesGlobal) return merge(result, generatedClass)
     return
   }
 
@@ -70,7 +72,8 @@ const applySelectorProps = (key, props, result, element) => {
 
 const applyCaseProps = (key, props, result, element) => {
   const caseKey = key.slice(1)
-  if (!CONFIG_CASES[caseKey]) return
+  const isPropTrue = element.props[caseKey]
+  if (!CONFIG_CASES[caseKey] && !isPropTrue) return
   return merge(result, convertPropsToClass(props, result, element))
 }
 
@@ -81,6 +84,8 @@ const applyConditionalCaseProps = (key, props, result, element) => {
   return merge(result, convertPropsToClass(props, result, element))
 }
 
+const applyTrueProps = (props, result, element) => merge(result, convertPropsToClass(props, result, element))
+
 const beforeClassAssign = (element, s) => {
   const { props, class: className } = element
 
@@ -115,27 +120,14 @@ export const initUpdate = element => {
     const setter = keySetters[key.slice(0, 1)]
     if (key === 'theme') {
       props.update({ themeModifier: globalTheme }, { preventRecursive: true, ignoreInitUpdate: true })
-    }
+    } else if (key === 'true') applyTrueProps(props[key], CLASS_NAMES, element)
+
     if (setter) setter(key, props[key], CLASS_NAMES, element)
   }
 
   if (Object.keys(CLASS_NAMES.media).length) className.media = CLASS_NAMES.media
   className.selector = CLASS_NAMES.selector
   className.case = CLASS_NAMES.case
-
-  // for (const screen in props) {
-  //   if (screen.slice(0, 1) === '@') {
-  //     const mediaName = screen.slice(1)
-  //     const mediaKey = `@media screen and ${CONFIG_MEDIA[mediaName]}`
-  //     if (mediaName === 'dark' || mediaName === 'light') {
-  //       const { MEDIA_FORCE } = className
-  //       if (!MEDIA_FORCE) className.media = {}
-  //       if (globalTheme === mediaName) {
-  //         className.MEDIA_FORCED = className.MEDIA[mediaKey]
-  //       } else className.MEDIA_FORCED = {}
-  //     }
-  //   }
-  // }
 }
 
 export const Responsive = {