From 8770c32e5bae105455471d03e50ef8feb9095e4b Mon Sep 17 00:00:00 2001
From: yutent <yutent.io@gmail.com>
Date: Mon, 27 Mar 2023 16:13:46 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0classMap=E5=92=8CstyleMap2?=
 =?UTF-8?q?=E4=B8=AA=E5=87=BD=E6=95=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json |  2 +-
 src/index.js | 23 ++++++++++++++++++++++-
 src/utils.js |  5 +++++
 3 files changed, 28 insertions(+), 2 deletions(-)

diff --git a/package.json b/package.json
index ccae4a1..7a905ef 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@bd/core",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "type": "module",
   "description": "百搭UI组件库的核心",
   "main": "dist/index.js",
diff --git a/src/index.js b/src/index.js
index 33c095d..1f86093 100644
--- a/src/index.js
+++ b/src/index.js
@@ -16,10 +16,31 @@ import {
 } from './constants.js'
 import { css, adoptStyles } from './css.js'
 import { render, html, svg } from './html.js'
-import { nextTick, fire, bind, unbind } from './utils.js'
+import { nextTick, fire, bind, unbind, hyphen } from './utils.js'
 export { $, $$, offset, outsideClick, clearOutsideClick } from './utils.js'
 export { html, css, svg, bind, unbind, nextTick }
 
+// 简单的类名解析
+export function classMap(data = {}) {
+  let output = ''
+  for (let k in data) {
+    if (data[k]) {
+      output += ' ' + k
+    }
+  }
+  return output.slice(1)
+}
+// 简单的样式解析
+export function styleMap(data = {}) {
+  let output = ''
+  for (let k in data) {
+    if (data[k]) {
+      output += hyphen(k) + ':' + data[k] + ';'
+    }
+  }
+  return output
+}
+
 export class Component extends HTMLElement {
   /**
    * 声明可监听变化的属性列表
diff --git a/src/utils.js b/src/utils.js
index 363057f..e9f95c7 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -42,6 +42,11 @@ export const nextTick = (function () {
   }
 })()
 
+//驼峰转换为连字符线风格
+export function hyphen(target) {
+  return target.replace(/([a-z\d])([A-Z]+)/g, '$1-$2').toLowerCase()
+}
+
 //取得距离页面左上角的坐标
 export function offset(node) {
   try {