@alexgyver/component 1.0.15 → 1.0.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/component.js +18 -7
  2. package/package.json +1 -1
package/component.js CHANGED
@@ -75,7 +75,8 @@ export class Component {
75
75
  context {object} контекст для параметра 'var' и вызовов 'also'
76
76
  text {string} добавить в textContent
77
77
  html {string} добавить в innerHTML
78
- attr {object} добавить аттрибуты
78
+ attrs {object} добавить аттрибуты
79
+ props {object} добавить свойства
79
80
  class {string} добавить в className
80
81
  also {function} - вызвать с текущим компонентом: { ... , also(el) { console.log(el); }, }
81
82
  export {array} - положить в 0 ячейку указанного массива
@@ -90,12 +91,8 @@ export class Component {
90
91
  * Создать компонент
91
92
  * @param {string} tag html tag элемента
92
93
  * @param {object} data параметры
93
- * @param {string|array} style стили в виде css строки или [ 'class', ['color: red', 'padding: 0'], ... ]
94
- * @param {string|this} id уникальный id стиля
95
- * @param {boolean} ext внешний стиль - может быть удалён по id
96
94
  */
97
- static make(tag, data = {}, style = null, id = null, ext = false) {
98
- Sheet.addStyle(style, id, ext);
95
+ static make(tag, data = {}) {
99
96
  if (!tag || typeof data !== 'object') return null;
100
97
  if (data instanceof Node) return data;
101
98
 
@@ -115,7 +112,8 @@ export class Component {
115
112
  case 'var': if (context) context['$' + val] = $el; break;
116
113
  case 'events': for (let ev in val) if (val[ev]) $el.addEventListener(ev, val[ev].bind(context)); break;
117
114
  case 'parent': if (val instanceof Element) val.append($el); break;
118
- case 'attr': for (let attr in val) $el.setAttribute(attr, val[attr]); break;
115
+ case 'attrs': for (let attr in val) $el.setAttribute(attr, val[attr]); break;
116
+ case 'props': for (let prop in val) $el[prop] = val[prop]; break;
119
117
  case 'style':
120
118
  if (typeof val === 'string') $el.style = val + ';';
121
119
  else for (let st in val) $el.style[st] = val[st];
@@ -139,6 +137,19 @@ export class Component {
139
137
  return $el;
140
138
  }
141
139
 
140
+ /**
141
+ * Создать компонент со стилем
142
+ * @param {string} tag html tag элемента
143
+ * @param {object} data параметры
144
+ * @param {string|array} style стили в виде css строки или [ 'class', ['color: red', 'padding: 0'], ... ]
145
+ * @param {string|this} id уникальный id стиля
146
+ * @param {boolean} ext внешний стиль - может быть удалён по id
147
+ */
148
+ static makeStyled(tag, data = {}, style = null, id = null, ext = false) {
149
+ Sheet.addStyle(style, id, ext);
150
+ return Component.make(tag, data);
151
+ }
152
+
142
153
  /**
143
154
  * Создать массив компонентов из массива объектов конфигурации
144
155
  * @param {array} arr массив объектов конфигурации
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alexgyver/component",
3
- "version": "1.0.15",
3
+ "version": "1.0.17",
4
4
  "description": "Simple HTML element builder",
5
5
  "main": "./component.js",
6
6
  "module": "./component.js",