@oscarpalmer/toretto 0.3.0 → 0.5.0

package/dist/attribute.js

@@ -10,6 +10,15 @@ function getString(value2) {
   const asString = valueOff?.toString?.() ?? String(valueOff);
   return asString.startsWith("[object ") ? JSON.stringify(value2) : asString;
 }
+// node_modules/@oscarpalmer/atoms/dist/js/is.mjs
+function isPlainObject(value2) {
+  if (typeof value2 !== "object" || value2 === null) {
+    return false;
+  }
+  const prototype = Object.getPrototypeOf(value2);
+  return (prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null) && !(Symbol.toStringTag in value2) && !(Symbol.iterator in value2);
+}
+
 // src/attribute.ts
 function isBadAttribute(attribute) {
   return onPrefix.test(attribute.name) || sourcePrefix.test(attribute.name) && valuePrefix.test(attribute.value);
@@ -28,7 +37,7 @@ function isInvalidBooleanAttribute(attribute) {
   return !(normalised.length === 0 || normalised === attribute.name || attribute.name === "hidden" && normalised === "until-found");
 }
 function setAttribute(element, first, second) {
-  if (typeof first === "object" && typeof first?.name === "string") {
+  if (isPlainObject(first) && typeof first?.name === "string") {
     setAttributeValue(element, first.name, first.value);
   } else if (typeof first === "string") {
     setAttributeValue(element, first, second);

package/dist/attribute.mjs

@@ -1,4 +1,5 @@
 // src/attribute.ts
+import {isPlainObject} from "@oscarpalmer/atoms/is";
 import {getString} from "@oscarpalmer/atoms/string";
 function isBadAttribute(attribute) {
   return onPrefix.test(attribute.name) || sourcePrefix.test(attribute.name) && valuePrefix.test(attribute.value);
@@ -17,7 +18,7 @@ function isInvalidBooleanAttribute(attribute) {
   return !(normalised.length === 0 || normalised === attribute.name || attribute.name === "hidden" && normalised === "until-found");
 }
 function setAttribute(element, first, second) {
-  if (typeof first === "object" && typeof first?.name === "string") {
+  if (isPlainObject(first) && typeof first?.name === "string") {
     setAttributeValue(element, first.name, first.value);
   } else if (typeof first === "string") {
     setAttributeValue(element, first, second);

package/dist/data.js

@@ -0,0 +1,79 @@
+// node_modules/@oscarpalmer/atoms/dist/js/is.mjs
+function isNullableOrWhitespace(value) {
+  return value == null || /^\s*$/.test(getString(value));
+}
+function isPlainObject(value) {
+  if (typeof value !== "object" || value === null) {
+    return false;
+  }
+  const prototype = Object.getPrototypeOf(value);
+  return (prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null) && !(Symbol.toStringTag in value) && !(Symbol.iterator in value);
+}
+// node_modules/@oscarpalmer/atoms/dist/js/string/index.mjs
+function getString(value2) {
+  if (typeof value2 === "string") {
+    return value2;
+  }
+  if (typeof value2 !== "object" || value2 == null) {
+    return String(value2);
+  }
+  const valueOff = value2.valueOf?.() ?? value2;
+  const asString = valueOff?.toString?.() ?? String(valueOff);
+  return asString.startsWith("[object ") ? JSON.stringify(value2) : asString;
+}
+function parse(value2, reviver) {
+  try {
+    return JSON.parse(value2, reviver);
+  } catch {
+  }
+}
+// src/internal/element-value.ts
+function setElementValues(element, first, second, callback) {
+  if (isPlainObject(first)) {
+    const entries = Object.entries(first);
+    const { length } = entries;
+    for (let index = 0;index < length; index += 1) {
+      const [key, value2] = entries[index];
+      callback(element, key, value2);
+    }
+  } else if (first != null) {
+    callback(element, first, second);
+  }
+}
+function updateElementValue(element, key, value2, set3, remove, json) {
+  if (isNullableOrWhitespace(value2)) {
+    remove.call(element, key);
+  } else {
+    set3.call(element, key, json ? JSON.stringify(value2) : String(value2));
+  }
+}
+
+// src/data.ts
+function getData(element, keys) {
+  if (typeof keys === "string") {
+    return getDataValue(element, keys);
+  }
+  const { length } = keys;
+  const data = {};
+  for (let index = 0;index < length; index += 1) {
+    const key = keys[index];
+    data[key] = getDataValue(element, key);
+  }
+  return data;
+}
+function getDataValue(element, key) {
+  const value2 = element.dataset[key];
+  if (value2 != null) {
+    return parse(value2);
+  }
+}
+function setData(element, first, second) {
+  setElementValues(element, first, second, updateDataAttribute);
+}
+function updateDataAttribute(element, key, value2) {
+  updateElementValue(element, `data-${key}`, value2, element.setAttribute, element.removeAttribute, true);
+}
+export {
+  setData,
+  getData
+};

package/dist/data.mjs

@@ -0,0 +1,31 @@
+// src/data.ts
+import {parse} from "@oscarpalmer/atoms/string";
+import {setElementValues, updateElementValue} from "./internal/element-value";
+function getData(element, keys) {
+  if (typeof keys === "string") {
+    return getDataValue(element, keys);
+  }
+  const { length } = keys;
+  const data = {};
+  for (let index = 0;index < length; index += 1) {
+    const key = keys[index];
+    data[key] = getDataValue(element, key);
+  }
+  return data;
+}
+function getDataValue(element, key) {
+  const value = element.dataset[key];
+  if (value != null) {
+    return parse(value);
+  }
+}
+function setData(element, first, second) {
+  setElementValues(element, first, second, updateDataAttribute);
+}
+function updateDataAttribute(element, key, value) {
+  updateElementValue(element, `data-${key}`, value, element.setAttribute, element.removeAttribute, true);
+}
+export {
+  setData,
+  getData
+};

package/dist/index.js

@@ -10,6 +10,24 @@ function getString(value2) {
   const asString = valueOff?.toString?.() ?? String(valueOff);
   return asString.startsWith("[object ") ? JSON.stringify(value2) : asString;
 }
+function parse(value2, reviver) {
+  try {
+    return JSON.parse(value2, reviver);
+  } catch {
+  }
+}
+// node_modules/@oscarpalmer/atoms/dist/js/is.mjs
+function isNullableOrWhitespace(value2) {
+  return value2 == null || /^\s*$/.test(getString(value2));
+}
+function isPlainObject(value2) {
+  if (typeof value2 !== "object" || value2 === null) {
+    return false;
+  }
+  const prototype = Object.getPrototypeOf(value2);
+  return (prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null) && !(Symbol.toStringTag in value2) && !(Symbol.iterator in value2);
+}
+
 // src/attribute.ts
 function isBadAttribute(attribute) {
   return onPrefix.test(attribute.name) || sourcePrefix.test(attribute.name) && valuePrefix.test(attribute.value);
@@ -28,7 +46,7 @@ function isInvalidBooleanAttribute(attribute) {
   return !(normalised.length === 0 || normalised === attribute.name || attribute.name === "hidden" && normalised === "until-found");
 }
 function setAttribute(element, first, second) {
-  if (typeof first === "object" && typeof first?.name === "string") {
+  if (isPlainObject(first) && typeof first?.name === "string") {
     setAttributeValue(element, first.name, first.value);
   } else if (typeof first === "string") {
     setAttributeValue(element, first, second);
@@ -83,12 +101,90 @@ var booleanAttributes = Object.freeze([
 var onPrefix = /^on/i;
 var sourcePrefix = /^(href|src|xlink:href)$/i;
 var valuePrefix = /(data:text\/html|javascript:)/i;
+// src/internal/element-value.ts
+function setElementValues(element, first, second, callback) {
+  if (isPlainObject(first)) {
+    const entries = Object.entries(first);
+    const { length } = entries;
+    for (let index = 0;index < length; index += 1) {
+      const [key, value2] = entries[index];
+      callback(element, key, value2);
+    }
+  } else if (first != null) {
+    callback(element, first, second);
+  }
+}
+function updateElementValue(element, key, value2, set3, remove, json) {
+  if (isNullableOrWhitespace(value2)) {
+    remove.call(element, key);
+  } else {
+    set3.call(element, key, json ? JSON.stringify(value2) : String(value2));
+  }
+}
+
+// src/data.ts
+function getData(element, keys) {
+  if (typeof keys === "string") {
+    return getDataValue(element, keys);
+  }
+  const { length } = keys;
+  const data = {};
+  for (let index = 0;index < length; index += 1) {
+    const key = keys[index];
+    data[key] = getDataValue(element, key);
+  }
+  return data;
+}
+function getDataValue(element, key) {
+  const value2 = element.dataset[key];
+  if (value2 != null) {
+    return parse(value2);
+  }
+}
+function setData(element, first, second) {
+  setElementValues(element, first, second, updateDataAttribute);
+}
+function updateDataAttribute(element, key, value2) {
+  updateElementValue(element, `data-${key}`, value2, element.setAttribute, element.removeAttribute, true);
+}
+// src/style.ts
+function getStyle(element, property) {
+  return element.style[property];
+}
+function getStyles(element, properties) {
+  const styles = {};
+  const { length } = properties;
+  for (let index = 0;index < length; index += 1) {
+    const property = properties[index];
+    styles[property] = element.style[property];
+  }
+  return styles;
+}
+function setStyle(element, property, value2) {
+  setElementValues(element, property, value2, updateStyleProperty);
+}
+function setStyles(element, styles) {
+  setElementValues(element, styles, null, updateStyleProperty);
+}
+function updateStyleProperty(element, key, value2) {
+  updateElementValue(element, key, value2, function(property, value3) {
+    this.style[property] = value3;
+  }, function(property) {
+    this.style[property] = "";
+  }, false);
+}
 export {
+  setStyles,
+  setStyle,
+  setData,
   setAttributes,
   setAttribute,
   isInvalidBooleanAttribute,
   isEmptyNonBooleanAttribute,
   isBooleanAttribute,
   isBadAttribute,
+  getStyles,
+  getStyle,
+  getData,
   booleanAttributes
 };

package/dist/index.mjs

@@ -1,2 +1,4 @@
 // src/index.ts
 export * from "./attribute";
+export * from "./data";
+export * from "./style";

package/dist/internal/element-value.js

@@ -0,0 +1,48 @@
+// node_modules/@oscarpalmer/atoms/dist/js/string/index.mjs
+function getString(value2) {
+  if (typeof value2 === "string") {
+    return value2;
+  }
+  if (typeof value2 !== "object" || value2 == null) {
+    return String(value2);
+  }
+  const valueOff = value2.valueOf?.() ?? value2;
+  const asString = valueOff?.toString?.() ?? String(valueOff);
+  return asString.startsWith("[object ") ? JSON.stringify(value2) : asString;
+}
+// node_modules/@oscarpalmer/atoms/dist/js/is.mjs
+function isNullableOrWhitespace(value2) {
+  return value2 == null || /^\s*$/.test(getString(value2));
+}
+function isPlainObject(value2) {
+  if (typeof value2 !== "object" || value2 === null) {
+    return false;
+  }
+  const prototype = Object.getPrototypeOf(value2);
+  return (prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null) && !(Symbol.toStringTag in value2) && !(Symbol.iterator in value2);
+}
+
+// src/internal/element-value.ts
+function setElementValues(element, first, second, callback) {
+  if (isPlainObject(first)) {
+    const entries = Object.entries(first);
+    const { length } = entries;
+    for (let index = 0;index < length; index += 1) {
+      const [key, value2] = entries[index];
+      callback(element, key, value2);
+    }
+  } else if (first != null) {
+    callback(element, first, second);
+  }
+}
+function updateElementValue(element, key, value2, set3, remove, json) {
+  if (isNullableOrWhitespace(value2)) {
+    remove.call(element, key);
+  } else {
+    set3.call(element, key, json ? JSON.stringify(value2) : String(value2));
+  }
+}
+export {
+  updateElementValue,
+  setElementValues
+};

package/dist/internal/element-value.mjs

@@ -0,0 +1,25 @@
+// src/internal/element-value.ts
+import {isNullableOrWhitespace, isPlainObject} from "@oscarpalmer/atoms/is";
+function setElementValues(element, first, second, callback) {
+  if (isPlainObject(first)) {
+    const entries = Object.entries(first);
+    const { length } = entries;
+    for (let index = 0;index < length; index += 1) {
+      const [key, value] = entries[index];
+      callback(element, key, value);
+    }
+  } else if (first != null) {
+    callback(element, first, second);
+  }
+}
+function updateElementValue(element, key, value, set, remove, json) {
+  if (isNullableOrWhitespace(value)) {
+    remove.call(element, key);
+  } else {
+    set.call(element, key, json ? JSON.stringify(value) : String(value));
+  }
+}
+export {
+  updateElementValue,
+  setElementValues
+};

package/dist/style.js

@@ -0,0 +1,77 @@
+// node_modules/@oscarpalmer/atoms/dist/js/string/index.mjs
+function getString(value2) {
+  if (typeof value2 === "string") {
+    return value2;
+  }
+  if (typeof value2 !== "object" || value2 == null) {
+    return String(value2);
+  }
+  const valueOff = value2.valueOf?.() ?? value2;
+  const asString = valueOff?.toString?.() ?? String(valueOff);
+  return asString.startsWith("[object ") ? JSON.stringify(value2) : asString;
+}
+// node_modules/@oscarpalmer/atoms/dist/js/is.mjs
+function isNullableOrWhitespace(value2) {
+  return value2 == null || /^\s*$/.test(getString(value2));
+}
+function isPlainObject(value2) {
+  if (typeof value2 !== "object" || value2 === null) {
+    return false;
+  }
+  const prototype = Object.getPrototypeOf(value2);
+  return (prototype === null || prototype === Object.prototype || Object.getPrototypeOf(prototype) === null) && !(Symbol.toStringTag in value2) && !(Symbol.iterator in value2);
+}
+
+// src/internal/element-value.ts
+function setElementValues(element, first, second, callback) {
+  if (isPlainObject(first)) {
+    const entries = Object.entries(first);
+    const { length } = entries;
+    for (let index = 0;index < length; index += 1) {
+      const [key, value2] = entries[index];
+      callback(element, key, value2);
+    }
+  } else if (first != null) {
+    callback(element, first, second);
+  }
+}
+function updateElementValue(element, key, value2, set3, remove, json) {
+  if (isNullableOrWhitespace(value2)) {
+    remove.call(element, key);
+  } else {
+    set3.call(element, key, json ? JSON.stringify(value2) : String(value2));
+  }
+}
+
+// src/style.ts
+function getStyle(element, property) {
+  return element.style[property];
+}
+function getStyles(element, properties) {
+  const styles = {};
+  const { length } = properties;
+  for (let index = 0;index < length; index += 1) {
+    const property = properties[index];
+    styles[property] = element.style[property];
+  }
+  return styles;
+}
+function setStyle(element, property, value2) {
+  setElementValues(element, property, value2, updateStyleProperty);
+}
+function setStyles(element, styles) {
+  setElementValues(element, styles, null, updateStyleProperty);
+}
+function updateStyleProperty(element, key, value2) {
+  updateElementValue(element, key, value2, function(property, value3) {
+    this.style[property] = value3;
+  }, function(property) {
+    this.style[property] = "";
+  }, false);
+}
+export {
+  setStyles,
+  setStyle,
+  getStyles,
+  getStyle
+};

package/dist/style.mjs

@@ -0,0 +1,33 @@
+// src/style.ts
+import {setElementValues, updateElementValue} from "./internal/element-value";
+function getStyle(element, property) {
+  return element.style[property];
+}
+function getStyles(element, properties) {
+  const styles = {};
+  const { length } = properties;
+  for (let index = 0;index < length; index += 1) {
+    const property = properties[index];
+    styles[property] = element.style[property];
+  }
+  return styles;
+}
+function setStyle(element, property, value) {
+  setElementValues(element, property, value, updateStyleProperty);
+}
+function setStyles(element, styles) {
+  setElementValues(element, styles, null, updateStyleProperty);
+}
+function updateStyleProperty(element, key, value) {
+  updateElementValue(element, key, value, function(property, value2) {
+    this.style[property] = value2;
+  }, function(property) {
+    this.style[property] = "";
+  }, false);
+}
+export {
+  setStyles,
+  setStyle,
+  getStyles,
+  getStyle
+};

package/package.json

@@ -32,6 +32,18 @@
 			"bun": "./src/attribute.ts",
 			"import": "./dist/attribute.mjs",
 			"require": "./dist/attribute.js"
+		},
+		"./data": {
+			"types": "./types/data.d.ts",
+			"bun": "./src/data.ts",
+			"import": "./dist/data.mjs",
+			"require": "./dist/data.js"
+		},
+		"./style": {
+			"types": "./types/style.d.ts",
+			"bun": "./src/style.ts",
+			"import": "./dist/style.mjs",
+			"require": "./dist/style.js"
 		}
 	},
 	"files": ["dist", "src", "types"],
@@ -56,5 +68,5 @@
 	},
 	"type": "module",
 	"types": "types/index.d.cts",
-	"version": "0.3.0"
+	"version": "0.5.0"
 }

package/src/attribute.ts

@@ -1,3 +1,4 @@
+import {isPlainObject} from '@oscarpalmer/atoms/is';
 import {getString} from '@oscarpalmer/atoms/string';
 
 type Attribute<Value = unknown> = {
@@ -107,10 +108,7 @@ export function setAttribute(
 	first: unknown,
 	second?: unknown,
 ): void {
-	if (
-		typeof first === 'object' &&
-		typeof (first as Attribute)?.name === 'string'
-	) {
+	if (isPlainObject(first) && typeof (first as Attribute)?.name === 'string') {
 		setAttributeValue(
 			element,
 			(first as Attribute).name,

package/src/data.ts

@@ -0,0 +1,82 @@
+import type {PlainObject} from '@oscarpalmer/atoms/models';
+import {parse} from '@oscarpalmer/atoms/string';
+import {setElementValues, updateElementValue} from './internal/element-value';
+
+/**
+ * Get data values from an element
+ */
+export function getData<Value extends PlainObject>(
+	element: HTMLElement,
+	keys: string[],
+): Value;
+
+/**
+ * Get a data value from an element
+ */
+export function getData(element: HTMLElement, key: string): unknown;
+
+export function getData(
+	element: HTMLElement,
+	keys: string | string[],
+): unknown {
+	if (typeof keys === 'string') {
+		return getDataValue(element, keys);
+	}
+
+	const {length} = keys;
+
+	const data: PlainObject = {};
+
+	for (let index = 0; index < length; index += 1) {
+		const key = keys[index];
+
+		data[key] = getDataValue(element, key);
+	}
+
+	return data;
+}
+
+function getDataValue(element: HTMLElement, key: string): unknown {
+	const value = element.dataset[key];
+
+	if (value != null) {
+		return parse(value);
+	}
+}
+
+/**
+ * Set data values on an element
+ */
+export function setData(element: HTMLElement, data: PlainObject): void;
+
+/**
+ * Set a data value on an element
+ */
+export function setData(
+	element: HTMLElement,
+	key: string,
+	value: unknown,
+): void;
+
+export function setData(
+	element: HTMLElement,
+	first: PlainObject | string,
+	second?: unknown,
+): void {
+	setElementValues(element, first, second, updateDataAttribute);
+}
+
+function updateDataAttribute(
+	element: HTMLElement,
+	key: string,
+	value: unknown,
+): void {
+	updateElementValue(
+		element,
+		`data-${key}`,
+		value,
+		element.setAttribute,
+		element.removeAttribute,
+		true,
+	);
+}

package/src/index.ts

@@ -1 +1,3 @@
 export * from './attribute';
+export * from './data';
+export * from './style';

package/src/internal/element-value.ts

@@ -0,0 +1,37 @@
+import {isNullableOrWhitespace, isPlainObject} from '@oscarpalmer/atoms/is';
+import type {PlainObject} from '@oscarpalmer/atoms/models';
+
+export function setElementValues(
+	element: HTMLElement,
+	first: PlainObject | string,
+	second: unknown,
+	callback: (element: HTMLElement, key: string, value: unknown) => void,
+): void {
+	if (isPlainObject(first)) {
+		const entries = Object.entries(first);
+		const {length} = entries;
+
+		for (let index = 0; index < length; index += 1) {
+			const [key, value] = entries[index];
+
+			callback(element, key, value);
+		}
+	} else if (first != null) {
+		callback(element, first, second);
+	}
+}
+
+export function updateElementValue(
+	element: HTMLElement,
+	key: string,
+	value: unknown,
+	set: (key: string, value: string) => void,
+	remove: (key: string) => void,
+	json: boolean,
+): void {
+	if (isNullableOrWhitespace(value)) {
+		remove.call(element, key);
+	} else {
+		set.call(element, key, json ? JSON.stringify(value) : String(value));
+	}
+}

package/src/style.ts

@@ -0,0 +1,70 @@
+import {setElementValues, updateElementValue} from './internal/element-value';
+
+/**
+ * Get a style from an element
+ */
+export function getStyle(
+	element: HTMLElement,
+	property: keyof CSSStyleDeclaration,
+): string {
+	return element.style[property as never];
+}
+
+/**
+ * Get styles from an element
+ */
+export function getStyles<Property extends keyof CSSStyleDeclaration>(
+	element: HTMLElement,
+	properties: Property[],
+): Pick<CSSStyleDeclaration, Property> {
+	const styles = {} as Pick<CSSStyleDeclaration, Property>;
+	const {length} = properties;
+
+	for (let index = 0; index < length; index += 1) {
+		const property = properties[index];
+
+		styles[property] = element.style[property as never] as never;
+	}
+
+	return styles;
+}
+
+/**
+ * Set a style on an element
+ */
+export function setStyle(
+	element: HTMLElement,
+	property: keyof CSSStyleDeclaration,
+	value?: string,
+): void {
+	setElementValues(element, property as string, value, updateStyleProperty);
+}
+
+/**
+ * Set styles on an element
+ */
+export function setStyles(
+	element: HTMLElement,
+	styles: Partial<CSSStyleDeclaration>,
+): void {
+	setElementValues(element, styles as string, null, updateStyleProperty);
+}
+
+function updateStyleProperty(
+	element: HTMLElement,
+	key: string,
+	value: unknown,
+): void {
+	updateElementValue(
+		element,
+		key,
+		value,
+		function (this: HTMLElement, property: string, value: string) {
+			this.style[property as never] = value;
+		},
+		function (this: HTMLElement, property: string) {
+			this.style[property as never] = '';
+		},
+		false,
+	);
+}

package/types/data.d.ts

@@ -0,0 +1,17 @@
+import type { PlainObject } from '@oscarpalmer/atoms/models';
+/**
+ * Get data values from an element
+ */
+export declare function getData<Value extends PlainObject>(element: HTMLElement, keys: string[]): Value;
+/**
+ * Get a data value from an element
+ */
+export declare function getData(element: HTMLElement, key: string): unknown;
+/**
+ * Set data values on an element
+ */
+export declare function setData(element: HTMLElement, data: PlainObject): void;
+/**
+ * Set a data value on an element
+ */
+export declare function setData(element: HTMLElement, key: string, value: unknown): void;

package/types/index.d.cts

@@ -41,5 +41,69 @@ export declare function setAttributes(element: Element, attributes: Attribute[])
  * Set one or more attributes on an element  _(or remove them, if their value is `null` or `undefined`)_
  */
 export declare function setAttributes(element: Element, attributes: Record<string, unknown>): void;
+/**
+Represents an object with `unknown` value. You probably want this instead of `{}`.
+
+Use case: You have an object whose keys and values are unknown to you.
+
+@example
+```
+import type {UnknownRecord} from 'type-fest';
+
+function toJson(object: UnknownRecord) {
+	return JSON.stringify(object);
+}
+
+toJson({hello: 'world'});
+//=> '{"hello":"world"}'
+
+function isObject(value: unknown): value is UnknownRecord {
+	return typeof value === 'object' && value !== null;
+}
+
+isObject({hello: 'world'});
+//=> true
+
+isObject('hello');
+//=> false
+```
+
+@category Type
+@category Object
+*/
+export type UnknownRecord = Record<PropertyKey, unknown>;
+export type PlainObject = UnknownRecord;
+/**
+ * Get data values from an element
+ */
+export declare function getData<Value extends PlainObject>(element: HTMLElement, keys: string[]): Value;
+/**
+ * Get a data value from an element
+ */
+export declare function getData(element: HTMLElement, key: string): unknown;
+/**
+ * Set data values on an element
+ */
+export declare function setData(element: HTMLElement, data: PlainObject): void;
+/**
+ * Set a data value on an element
+ */
+export declare function setData(element: HTMLElement, key: string, value: unknown): void;
+/**
+ * Get a style from an element
+ */
+export declare function getStyle(element: HTMLElement, property: keyof CSSStyleDeclaration): string;
+/**
+ * Get styles from an element
+ */
+export declare function getStyles<Property extends keyof CSSStyleDeclaration>(element: HTMLElement, properties: Property[]): Pick<CSSStyleDeclaration, Property>;
+/**
+ * Set a style on an element
+ */
+export declare function setStyle(element: HTMLElement, property: keyof CSSStyleDeclaration, value?: string): void;
+/**
+ * Set styles on an element
+ */
+export declare function setStyles(element: HTMLElement, styles: Partial<CSSStyleDeclaration>): void;
 
 export {};

package/types/index.d.ts

@@ -1 +1,3 @@
 export * from './attribute';
+export * from './data';
+export * from './style';

package/types/internal/element-value.d.ts

@@ -0,0 +1,3 @@
+import type { PlainObject } from '@oscarpalmer/atoms/models';
+export declare function setElementValues(element: HTMLElement, first: PlainObject | string, second: unknown, callback: (element: HTMLElement, key: string, value: unknown) => void): void;
+export declare function updateElementValue(element: HTMLElement, key: string, value: unknown, set: (key: string, value: string) => void, remove: (key: string) => void, json: boolean): void;

package/types/style.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Get a style from an element
+ */
+export declare function getStyle(element: HTMLElement, property: keyof CSSStyleDeclaration): string;
+/**
+ * Get styles from an element
+ */
+export declare function getStyles<Property extends keyof CSSStyleDeclaration>(element: HTMLElement, properties: Property[]): Pick<CSSStyleDeclaration, Property>;
+/**
+ * Set a style on an element
+ */
+export declare function setStyle(element: HTMLElement, property: keyof CSSStyleDeclaration, value?: string): void;
+/**
+ * Set styles on an element
+ */
+export declare function setStyles(element: HTMLElement, styles: Partial<CSSStyleDeclaration>): void;