jsx-dom-runtime - npm Package Compare versions

Comparing version 0.45.0 to 0.46.0

index.d.ts

@@ -176,3 +176,6 @@ /// <reference lib="dom" />
   // Transition Events
+  ontransitionstart?: TransitionEventHandler<T>
   ontransitionend?: TransitionEventHandler<T>
+  ontransitionrun?: TransitionEventHandler<T>
+  ontransitioncancel?: TransitionEventHandler<T>
 }
@@ -1250,6 +1253,47 @@
 interface TableHTMLAttributes extends HTMLAttributes<HTMLTableElement> {
-  cellPadding?: number | string
-  cellSpacing?: number | string
+  /**
+   * To achieve a similar effect, use the CSS properties `margin-left` and `margin-right` to `auto` or `margin` to `0 auto`.
+   * @deprecated
+   */
+  align?: 'left' | 'center' | 'right'
+  /**
+   * To achieve a similar effect, use the CSS `background-color` property.
+   * @deprecated
+   */
+  bgColor?: string;
+  /**
+   * To achieve a similar effect, use the CSS `border` property.
+   * @deprecated
+   */
+  border?: string;
+  /**
+   * To achieve a similar effect, apply the `border-collapse` CSS property to the `<table>` element, with its value set to collapse, and the `padding` property to the `<td>` elements.
+   * @deprecated
+   */
+  cellPadding?: number | string;
+  /**
+   * To achieve a similar effect, apply the `border-spacing` CSS property to the `<table>` element. `border-spacing` does not have any effect if `border-collapse` is set to `collapse`.
+   * @deprecated
+   */
+  cellSpacing?: number | string;
+  /**
+   * To achieve a similar effect, use the CSS the `border-style` and `border-width` properties.
+   * @deprecated
+   */
+  frame?: string;
+  /**
+   * Use the `<caption>` element instead
+   * @deprecated
+   */
   summary?: string
-  width?: number | string
+  /**
+   * To achieve a similar effect, use the CSS `width` property instead.
+   * @deprecated
+   */
+  width?: number | string;
+  /**
+   * To achieve a similar effect, apply the CSS `border` property to the appropriate `<thead>`, `<tbody>`, `<tfoot>`, `<col>`, or `<colgroup>` elements.
+   * @deprecated
+   */
+  rules?: 'none' | 'groups' | 'rows' | 'cols' | 'all'
 }
@@ -1276,16 +1320,51 @@
 
-interface TdHTMLAttributes extends HTMLAttributes<HTMLTableDataCellElement> {
-  align?: 'left' | 'center' | 'right' | 'justify' | 'char'
+interface TdHTMLAttributes extends HTMLAttributes<HTMLTableCellElement> {
   colSpan?: number | `${number}`
   headers?: string
   rowSpan?: number | `${number}`
+  /**
+   * Do not use this attribute as it is obsolete in the latest standard. Alternatively, you can put the abbreviated description inside the cell and place the long content in the title attribute.
+   * @deprecated
+   */
+  abbr?: string
+  /**
+   * To achieve the same effect as the `left`, `center`, `right` or `justify` values, apply the CSS `text-align` property to the element, the `char` value, give the `text-align` property the same value you would use for the `char`.
+   * @deprecated
+   */
+  align?: 'left' | 'center' | 'right' | 'justify' | 'char'
+  /** @deprecated */
+  axis?: string;
+  /**
+   * To achieve a similar effect, use the CSS `background-color` property
+   * @deprecated
+   */
+  bgColor?: string;
+  /**
+   * To achieve the same effect, you can specify the character as the first value of the `text-align` property.
+   * @deprecated
+   */
+  char?: string;
+  /** @deprecated */
+  charoff?: string
+  /** @deprecated */
   scope?: string
-  abbr?: string
+  /**
+   * To achieve a similar effect, use the CSS `height` property instead.
+   * @deprecated
+   */
   height?: number | string
+  /**
+   * To achieve a similar effect,use the CSS `width` property instead
+   * @deprecated
+   */
   width?: number | string
+  /**
+   * To achieve a similar effect, use the CSS `vertical-align` property
+   * @deprecated
+   */
   valign?: 'top' | 'middle' | 'bottom' | 'baseline'
 }
 
-interface ThHTMLAttributes extends HTMLAttributes<HTMLTableHeaderCellElement> {
-  align?: 'left' | 'center' | 'right' | 'justify' | 'char'
+interface ThHTMLAttributes extends HTMLAttributes<HTMLTableCellElement> {
+  abbr?: string
   colSpan?: number | `${number}`
@@ -1295,3 +1374,36 @@ headers?: string
   scope?: string
-  abbr?: string
+  /**
+   * To achieve the same effect as the `left`, `center`, `right` or `justify` values, apply the CSS `text-align` property to the element, the `char` value, give the `text-align` property the same value you would use for the `char`.
+   * @deprecated
+   */
+  align?: 'left' | 'center' | 'right' | 'justify' | 'char'
+  /** @deprecated */
+  axis?: string;
+  /**
+   * To achieve a similar effect, use the CSS `background-color` property
+   * @deprecated
+   */
+  bgColor?: string;
+  /**
+   * To achieve the same effect, you can specify the character as the first value of the `text-align` property.
+   * @deprecated
+   */
+  char?: string;
+  /** @deprecated */
+  charoff?: string
+  /**
+   * To achieve a similar effect, use the CSS `height` property instead.
+   * @deprecated
+   */
+  height?: number | string
+  /**
+   * To achieve a similar effect,use the CSS `width` property instead
+   * @deprecated
+   */
+  width?: number | string
+  /**
+   * To achieve a similar effect, use the CSS `vertical-align` property
+   * @deprecated
+   */
+  valign?: 'top' | 'middle' | 'bottom' | 'baseline'
 }
@@ -1379,2 +1491,4 @@
       abbr: HTMLAttributes<HTMLElement>
+      /** @deprecated */
+      acronym: HTMLAttributes<HTMLElement>
       address: HTMLAttributes<HTMLElement>
@@ -1389,3 +1503,6 @@ area: AreaHTMLAttributes
       bdo: HTMLAttributes<HTMLElement>
+      /** @deprecated */
       big: HTMLAttributes<HTMLElement>
+      /** @deprecated */
+      blink: HTMLAttributes<HTMLUnknownElement>
       blockquote: QuoteHTMLAttributes
@@ -1397,2 +1514,4 @@ body: HTMLAttributes<HTMLBodyElement>
       caption: HTMLAttributes<HTMLElement>
+      /** @deprecated */
+      center: HTMLAttributes<HTMLElement>
       cite: HTMLAttributes<HTMLElement>
@@ -1409,2 +1528,4 @@ code: HTMLAttributes<HTMLElement>
       dialog: DialogHTMLAttributes
+      /** @deprecated */
+      dir: HTMLAttributes<HTMLDirectoryElement>
       div: HTMLAttributes<HTMLDivElement>
@@ -1418,2 +1539,4 @@ dl: HTMLAttributes<HTMLDListElement>
       figure: HTMLAttributes<HTMLElement>
+      /** @deprecated */
+      font: HTMLAttributes<HTMLFontElement>
       footer: HTMLAttributes<HTMLElement>
@@ -1438,2 +1561,3 @@ form: FormHTMLAttributes
       kbd: HTMLAttributes<HTMLElement>
+      /** @deprecated */
       keygen: HTMLAttributes<HTMLUnknownElement>;
@@ -1447,2 +1571,3 @@ label: LabelHTMLAttributes
       mark: HTMLAttributes<HTMLElement>
+      /** @deprecated */
       marquee: HTMLAttributes<MarqueeHTMLElement>
@@ -1454,4 +1579,10 @@ menu: MenuHTMLAttributes
       nav: HTMLAttributes<HTMLElement>
+      /** @deprecated */
+      nobr: HTMLAttributes<HTMLElement>
+      /** @deprecated */
+      noembed: HTMLAttributes<HTMLUnknownElement>
+      /** @deprecated */
+      noframes: HTMLAttributes<HTMLUnknownElement>
       noindex: HTMLAttributes<HTMLElement>
-      noscript: HTMLAttributes<HTMLElement>
+      noscript: HTMLAttributes<HTMLUnknownElement>
       object: ObjectHTMLAttributes
@@ -1463,7 +1594,12 @@ ol: OlHTMLAttributes
       p: HTMLAttributes<HTMLParagraphElement>
+      /** @deprecated */
       param: ParamHTMLAttributes
       picture: HTMLAttributes<HTMLPictureElement>
+      /** @deprecated */
+      plaintext: HTMLAttributes<HTMLElement>
       pre: HTMLAttributes<HTMLPreElement>
       progress: ProgressHTMLAttributes
       q: QuoteHTMLAttributes
+      /** @deprecated */
+      rb: HTMLAttributes<HTMLElement>
       rp: HTMLAttributes<HTMLElement>
@@ -1481,2 +1617,4 @@ rt: HTMLAttributes<HTMLElement>
       span: HTMLAttributes<HTMLSpanElement>
+      /** @deprecated */
+      strike: HTMLAttributes<HTMLElement>
       strong: HTMLAttributes<HTMLElement>
@@ -1499,2 +1637,4 @@ style: StyleHTMLAttributes
       track: TrackHTMLAttributes
+      /** @deprecated */
+      tt: HTMLAttributes<HTMLElement>
       u: HTMLAttributes<HTMLElement>
@@ -1505,2 +1645,4 @@ ul: HTMLAttributes<HTMLUListElement>
       wbr: HTMLAttributes<HTMLElement>
+      /** @deprecated */
+      xmp: HTMLAttributes<HTMLElement>
       webview: WebViewHTMLAttributes
@@ -1510,3 +1652,3 @@
       animateMotion: SVGAttributes<SVGAnimateMotionElement>
-      animateTransform: SVGAttributes<SVGAnimateElement>
+      animateTransform: SVGAttributes<SVGAnimateTransformElement>
       circle: SVGAttributes<SVGCircleElement>
@@ -1513,0 +1655,0 @@ clipPath: SVGAttributes<SVGClipPathElement>

jsx-runtime/index.js

@@ -25,7 +25,6 @@ let appendChildren = (node, children) => {
 let properties = new Set(['value']);
-let jsx = (key, props) => {
-  let val,
-    node = props.__ns ? document.createElementNS('http://www.w3.org/2000/svg', key) : document.createElement(key);
-
-  // reuse `key` variable
+let jsx = (tag, props) => {
+  let key,
+    val,
+    node = props.__ns ? document.createElementNS('http://www.w3.org/2000/svg', tag) : document.createElement(tag);
   for (key in props) {
@@ -59,3 +58,3 @@ if (internalKeys.has(key)) {
   }
-  appendChildren(node.localName === 'template' ? node.content : node, props.children);
+  appendChildren(tag === 'template' ? node.content : node, props.children);
 
@@ -62,0 +61,0 @@ // reuse `val` variable

package.json

 {
   "name": "jsx-dom-runtime",
-  "version": "0.45.0",
+  "version": "0.46.0",
   "description": "A tiny in 500 bytes library to JSX syntax templates for DOM",
@@ -70,3 +70,3 @@ "type": "module",
     "jest-environment-jsdom": "^29.5.0",
-    "rollup": "^3.21.6",
+    "rollup": "^3.21.7",
     "size-limit": "^8.2.4",
@@ -73,0 +73,0 @@ "typescript": "^5.0.4"

No alert changes

Improved metrics

Total package byte prevSize

77985

increased by6.25%

Lines of code

2011

increased by7.2%

No dependency changes