@cyberalien/svg-utils 1.0.9 → 1.0.10

package/lib/index.d.ts

@@ -2,7 +2,7 @@ import { ClassProp, classProps, defaultClassProp } from "./classname/const.js";
 import { splitClassName, toggleClassName } from "./classname/toggle.js";
 import { UniqueHashOptions } from "./helpers/hash/types.js";
 import { ParsedXMLNode, ParsedXMLTagElement, ParsedXMLTextElement, StringifyXMLOptions } from "./xml/types.js";
-import { ConvertSVGContentOptions, ConvertedSVGContent } from "./svg-css/types.js";
+import { BaseConvertSVGContentOptions, ConvertSVGContentOptions, ConvertedSVGContent } from "./svg-css/types.js";
 import { createCSSClassName } from "./css/hash.js";
 import { stringifyCSSKeyframes, stringifyCSSRules, stringifyCSSSelector } from "./css/stringify.js";
 import { hashString } from "./helpers/hash/hash.js";
@@ -24,4 +24,4 @@ import { changeSVGIDs } from "./svg/ids/change.js";
 import { createUniqueIDs } from "./svg/ids/unique.js";
 import { convertSVGRootToCSS } from "./svg-css/root.js";
 import { convertSVGContentToCSSRules } from "./svg-css/content.js";
-export { ChangeIDResult, ClassProp, ComparisonKey, ConvertSVGContentOptions, ConvertedSVGContent, ParsedXMLNode, ParsedXMLTagElement, ParsedXMLTextElement, StringifyXMLOptions, UniqueHashOptions, changeIDInString, changeSVGIDs, classProps, cloneObject, compareKeys, compareSets, compareValues, convertSVGContentToCSSRules, convertSVGRootToCSS, createCSSClassName, createUniqueIDs, defaultClassProp, getUniqueHash, hashString, hashToString, iterateXMLContent, parseXMLContent, removeDuplicateIDs, removeUnusedIDs, sortObject, splitClassName, stringifyCSSKeyframes, stringifyCSSRules, stringifyCSSSelector, stringifyXMLContent, toggleClassName, uniquePromise };
+export { BaseConvertSVGContentOptions, ChangeIDResult, ClassProp, ComparisonKey, ConvertSVGContentOptions, ConvertedSVGContent, ParsedXMLNode, ParsedXMLTagElement, ParsedXMLTextElement, StringifyXMLOptions, UniqueHashOptions, changeIDInString, changeSVGIDs, classProps, cloneObject, compareKeys, compareSets, compareValues, convertSVGContentToCSSRules, convertSVGRootToCSS, createCSSClassName, createUniqueIDs, defaultClassProp, getUniqueHash, hashString, hashToString, iterateXMLContent, parseXMLContent, removeDuplicateIDs, removeUnusedIDs, sortObject, splitClassName, stringifyCSSKeyframes, stringifyCSSRules, stringifyCSSSelector, stringifyXMLContent, toggleClassName, uniquePromise };

package/lib/svg-css/animations/tags.d.ts

@@ -1,3 +1,15 @@
+/**
+ * Tag used to set attribute value without animation duration
+ */
+declare const svgSetTag = "set";
+/**
+ * Tag to discard animation
+ */
+declare const svgDiscardTag = "discard";
+/**
+ * Attribute animation tag
+ */
+declare const svgAnimationTag = "animate";
 /**
  * Tags for animating one attribute in SVG
  */
@@ -14,4 +26,4 @@ declare const svgAnimateMotionTag = "animateMotion";
  * All tags for animating SVG
  */
 declare const svgAnimationTags: string[];
-export { svgAnimateMotionTag, svgAnimateTransformTag, svgAnimationTags, svgSimpleAnimationTags };
+export { svgAnimateMotionTag, svgAnimateTransformTag, svgAnimationTag, svgAnimationTags, svgDiscardTag, svgSetTag, svgSimpleAnimationTags };

package/lib/svg-css/animations/tags.js

@@ -1,10 +1,22 @@
 /**
+* Tag used to set attribute value without animation duration
+*/
+const svgSetTag = "set";
+/**
+* Tag to discard animation
+*/
+const svgDiscardTag = "discard";
+/**
+* Attribute animation tag
+*/
+const svgAnimationTag = "animate";
+/**
 * Tags for animating one attribute in SVG
 */
 const svgSimpleAnimationTags = [
-	"animate",
-	"set",
-	"discard"
+	svgSetTag,
+	svgDiscardTag,
+	svgAnimationTag
 ];
 /**
 * Tag for animating transformations in SVG
@@ -23,4 +35,4 @@ const svgAnimationTags = [
 	svgAnimateMotionTag
 ];
 
-export { svgAnimateMotionTag, svgAnimateTransformTag, svgAnimationTags, svgSimpleAnimationTags };
+export { svgAnimateMotionTag, svgAnimateTransformTag, svgAnimationTag, svgAnimationTags, svgDiscardTag, svgSetTag, svgSimpleAnimationTags };

package/lib/svg-css/content.js

@@ -8,7 +8,7 @@ import { convertSVGRootToCSS } from "./root.js";
 function convertSVGContentToCSSRules(content, options) {
 	const root = parseXMLContent(content);
 	if (!root) return { content };
-	const classes = convertSVGRootToCSS(root, options?.classNamePrefix, options?.hashOptions);
+	const classes = convertSVGRootToCSS(root, options);
 	if (classes) {
 		const newContent = stringifyXMLContent(root, options);
 		if (newContent) return {

package/lib/svg-css/props/prop.d.ts

@@ -1,5 +1,5 @@
 /**
  * Convert property to CSS
  */
-declare function convertSVGPropertyToCSS(tag: string, prop: string, value: string | number): [string, string] | undefined;
+declare function convertSVGPropertyToCSS(tag: string, prop: string, value: string | number, supportLegacyBrowsers?: boolean): [string, string] | undefined;
 export { convertSVGPropertyToCSS };

package/lib/svg-css/props/prop.js

@@ -57,10 +57,10 @@ function getSVGPropertyType(tag, prop) {
 /**
 * Convert property to CSS
 */
-function convertSVGPropertyToCSS(tag, prop, value) {
+function convertSVGPropertyToCSS(tag, prop, value, supportLegacyBrowsers = false) {
 	switch (getSVGPropertyType(tag, prop)) {
 		case "path":
-			if (typeof value !== "string") return;
+			if (supportLegacyBrowsers || typeof value !== "string") return;
 			return [prop, `path("${value.replace(/\s+/g, " ")}")`];
 		case "px":
 			if (typeof value === "string" && !value.match(/^[0-9.-]+$/)) return [prop, value];

package/lib/svg-css/props/props.d.ts

@@ -5,5 +5,5 @@ import { SVGConvertedToCSSProperties } from "./types.js";
  *
  * Returns CSS rules, does not add a class to tag, but does remove properties from tag
  */
-declare function extractSVGTagPropertiesForCSS(tag: ParsedXMLTagElement): SVGConvertedToCSSProperties | undefined;
+declare function extractSVGTagPropertiesForCSS(tag: ParsedXMLTagElement, supportLegacyBrowsers?: boolean): SVGConvertedToCSSProperties | undefined;
 export { extractSVGTagPropertiesForCSS };

package/lib/svg-css/props/props.js

@@ -7,7 +7,7 @@ import { svgAnimateTransformTag, svgSimpleAnimationTags } from "../animations/ta
 *
 * Returns CSS rules, does not add a class to tag, but does remove properties from tag
 */
-function extractSVGTagPropertiesForCSS(tag) {
+function extractSVGTagPropertiesForCSS(tag, supportLegacyBrowsers = false) {
 	const result = {
 		props: [],
 		rules: Object.create(null)
@@ -24,7 +24,7 @@ function extractSVGTagPropertiesForCSS(tag) {
 	});
 	for (const prop in tag.attribs) if (!animatedProps.has(prop)) {
 		const value = tag.attribs[prop];
-		const converted = convertSVGPropertyToCSS(tag.tag, prop, value);
+		const converted = convertSVGPropertyToCSS(tag.tag, prop, value, supportLegacyBrowsers);
 		if (converted) {
 			const [propName, propValue] = converted;
 			result.props.push(propName);

package/lib/svg-css/root.d.ts

@@ -1,9 +1,10 @@
-import { CSSHashOptions, CSSRules } from "../css/types.js";
+import { CSSRules } from "../css/types.js";
 import { ParsedXMLTagElement } from "../xml/types.js";
+import { BaseConvertSVGContentOptions } from "./types.js";
 /**
  * Convert SVG tags tree to SVG+CSS
  *
  * Returns used CSS class names with rules
  */
-declare function convertSVGRootToCSS(root: ParsedXMLTagElement[], classNamePrefix?: string, hashOptions?: CSSHashOptions): Record<string, CSSRules>;
+declare function convertSVGRootToCSS(root: ParsedXMLTagElement[], options?: BaseConvertSVGContentOptions): Record<string, CSSRules>;
 export { convertSVGRootToCSS };

package/lib/svg-css/root.js

@@ -8,11 +8,13 @@ import { extractSVGTagPropertiesForCSS } from "./props/props.js";
 *
 * Returns used CSS class names with rules
 */
-function convertSVGRootToCSS(root, classNamePrefix = "", hashOptions) {
+function convertSVGRootToCSS(root, options = {}) {
 	const rules = Object.create(null);
+	const hashOptions = options.hashOptions || {};
+	const classNamePrefix = options.classNamePrefix || "";
 	iterateXMLContent(root, (node) => {
 		if (node.type === "tag") {
-			const props = extractSVGTagPropertiesForCSS(node);
+			const props = extractSVGTagPropertiesForCSS(node, options.legacy);
 			if (props) {
 				const className = createCSSClassName(props.rules, classNamePrefix, hashOptions);
 				toggleClassName(node.attribs, className, true);

package/lib/svg-css/types.d.ts

@@ -1,12 +1,17 @@
 import { CSSHashOptions, CSSKeyframes, CSSRules } from "../css/types.js";
 import { StringifyXMLOptions } from "../xml/types.js";
 /**
- * Options for converting SVG content to SVG+CSS
+ * Options for converting SVG tags to SVG+CSS
  */
-interface ConvertSVGContentOptions extends StringifyXMLOptions {
+interface BaseConvertSVGContentOptions {
   classNamePrefix?: string;
   hashOptions?: CSSHashOptions;
+  legacy?: boolean;
 }
+/**
+ * Options for converting SVG content to SVG+CSS
+ */
+interface ConvertSVGContentOptions extends StringifyXMLOptions, BaseConvertSVGContentOptions {}
 /**
  * Result of converting SVG content to SVG+CSS
  */
@@ -15,4 +20,4 @@ interface ConvertedSVGContent {
   classes?: Record<string, CSSRules>;
   keyframes?: Record<string, CSSKeyframes>;
 }
-export { ConvertSVGContentOptions, ConvertedSVGContent };
+export { BaseConvertSVGContentOptions, ConvertSVGContentOptions, ConvertedSVGContent };

package/package.json

@@ -3,7 +3,7 @@
   "type": "module",
   "description": "Common functions for working with SVG used by various packages.",
   "author": "Vjacheslav Trushkin",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "license": "MIT",
   "bugs": "https://github.com/cyberalien/svg-utils/issues",
   "homepage": "https://cyberalien.dev/",