timvir 0.2.38 → 0.2.39

package/blocks/Font/index.js

@@ -2,6 +2,7 @@ import { useMDXComponents } from '@mdx-js/react';
 import * as builtins from 'timvir/builtins';
 import * as React from 'react';
 import * as Icons from 'react-feather';
+import { jsxs, jsx } from 'react/jsx-runtime';
 
 // src/css.ts
 
@@ -60,8 +61,8 @@ function Font(props, ref) {
       const computedStyle = window.getComputedStyle(contentRef);
       const intervalId = setInterval(() => {
         if (fontSizeRef) {
-          const fontSize = parseInt(computedStyle.fontSize, 10);
-          const lineHeight = parseInt(computedStyle.lineHeight, 10);
+          const fontSize = Number.parseInt(computedStyle.fontSize, 10);
+          const lineHeight = Number.parseInt(computedStyle.lineHeight, 10);
           const innerText = `${name} – ${Math.round(fontSize)}px / ${Math.round(lineHeight / fontSize * 1000) / 1000}`;
           if (fontSizeRef.innerText !== innerText) {
             fontSizeRef.innerText = innerText;
@@ -72,64 +73,74 @@ function Font(props, ref) {
         clearInterval(intervalId);
       };
     }
-  }, [name, contentRef]);
-  return /*#__PURE__*/React.createElement(Root, {
+  }, [name, contentRef, fontSizeRef]);
+  return /*#__PURE__*/jsxs(Root, {
     ref: ref,
     className: cx_default(className),
-    ...rest
-  }, /*#__PURE__*/React.createElement("div", {
-    className: classes.meta
-  }, /*#__PURE__*/React.createElement(components.h3, {
-    className: "fc7ivp5"
-  }, /*#__PURE__*/React.createElement("span", {
-    ref: setFontSizeRef
-  }, name)), info && /*#__PURE__*/React.createElement("div", {
-    className: "de58upx",
-    onClick: () => {
-      if (infoRef && contentRef) {
-        // const contentParent = contentRef.parentElement;
-        const infoParent = infoRef.parentElement;
-        if (infoParent.style.height === "0px") {
-          infoParent.style.height = `${infoRef.getBoundingClientRect().height}px`;
-          infoParent.style.opacity = "1";
+    ...rest,
+    children: [/*#__PURE__*/jsxs("div", {
+      className: classes.meta,
+      children: [/*#__PURE__*/jsx(components.h3, {
+        className: "fc7ivp5",
+        children: /*#__PURE__*/jsx("span", {
+          ref: setFontSizeRef,
+          children: name
+        })
+      }), info && /*#__PURE__*/jsx("div", {
+        className: "de58upx",
+        onClick: () => {
+          if (infoRef && contentRef) {
+            // const contentParent = contentRef.parentElement;
+            const infoParent = infoRef.parentElement;
+            if (infoParent.style.height === "0px") {
+              infoParent.style.height = `${infoRef.getBoundingClientRect().height}px`;
+              infoParent.style.opacity = "1";
 
-          // contentParent.style.height = "0px";
-          // contentParent.style.opacity = "0";
-        } else {
-          infoParent.style.height = "0px";
-          infoParent.style.opacity = "0";
+              // contentParent.style.height = "0px";
+              // contentParent.style.opacity = "0";
+            } else {
+              infoParent.style.height = "0px";
+              infoParent.style.opacity = "0";
 
-          // contentParent.style.height = window.getComputedStyle(contentRef).height;
-          // contentParent.style.opacity = "1";
-        }
-      }
-    }
-  }, /*#__PURE__*/React.createElement(Icons.Info, {
-    size: "1.1em"
-  }))), /*#__PURE__*/React.createElement("div", {
-    className: "d10949ho"
-  }, info && /*#__PURE__*/React.createElement("div", {
-    className: "d1o2du3z",
-    style: {
-      height: 0,
-      opacity: 0
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    ref: setInfoRef,
-    className: "d1o9zhgl"
-  }, info)), /*#__PURE__*/React.createElement("div", {
-    className: "ddlplux",
-    style: {
-      height: "auto",
-      opacity: 1
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    ref: setContentRef,
-    contentEditable: true,
-    spellCheck: "false",
-    className: cx_default(font.className, "dw285p4"),
-    style: font.style
-  }, children || "The quick brown fox jumps over the lazy dog"))));
+              // contentParent.style.height = window.getComputedStyle(contentRef).height;
+              // contentParent.style.opacity = "1";
+            }
+          }
+        },
+        children: /*#__PURE__*/jsx(Icons.Info, {
+          size: "1.1em"
+        })
+      })]
+    }), /*#__PURE__*/jsxs("div", {
+      className: "d10949ho",
+      children: [info && /*#__PURE__*/jsx("div", {
+        className: "d1o2du3z",
+        style: {
+          height: 0,
+          opacity: 0
+        },
+        children: /*#__PURE__*/jsx("div", {
+          ref: setInfoRef,
+          className: "d1o9zhgl",
+          children: info
+        })
+      }), /*#__PURE__*/jsx("div", {
+        className: "ddlplux",
+        style: {
+          height: "auto",
+          opacity: 1
+        },
+        children: /*#__PURE__*/jsx("div", {
+          ref: setContentRef,
+          contentEditable: true,
+          spellCheck: "false",
+          className: cx_default(font.className, "dw285p4"),
+          style: font.style,
+          children: children || "The quick brown fox jumps over the lazy dog"
+        })
+      })]
+    })]
+  });
 }
 var Font$1 = /*#__PURE__*/React.forwardRef(Font);
 

package/blocks/Font/samples/basic.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
 import { Font } from "..";
 type Props = Partial<React.ComponentPropsWithoutRef<typeof Font>>;
-export default function Sample(props: Props): React.JSX.Element;
+export default function Sample(props: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/blocks/Font/samples/timvir/body1.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
 import { Font } from "../..";
 type Props = Partial<React.ComponentPropsWithoutRef<typeof Font>>;
-export default function Sample(props: Props): React.JSX.Element;
+export default function Sample(props: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/blocks/Font/samples/timvir/caption.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
 import { Font } from "../..";
 type Props = Partial<React.ComponentPropsWithoutRef<typeof Font>>;
-export default function Sample(props: Props): React.JSX.Element;
+export default function Sample(props: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/blocks/Font/samples/timvir/h1.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
 import { Font } from "../..";
 type Props = Partial<React.ComponentPropsWithoutRef<typeof Font>>;
-export default function Sample(props: Props): React.JSX.Element;
+export default function Sample(props: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/blocks/Font/samples/timvir/h2.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
 import { Font } from "../..";
 type Props = Partial<React.ComponentPropsWithoutRef<typeof Font>>;
-export default function Sample(props: Props): React.JSX.Element;
+export default function Sample(props: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/blocks/Font/samples/timvir/h3.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
 import { Font } from "../..";
 type Props = Partial<React.ComponentPropsWithoutRef<typeof Font>>;
-export default function Sample(props: Props): React.JSX.Element;
+export default function Sample(props: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/blocks/Font/samples/timvir/h4.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
 import { Font } from "../..";
 type Props = Partial<React.ComponentPropsWithoutRef<typeof Font>>;
-export default function Sample(props: Props): React.JSX.Element;
+export default function Sample(props: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/blocks/Grid/index.js

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import { jsx } from 'react/jsx-runtime';
 
 // src/css.ts
 
@@ -39,11 +40,12 @@ function Grid(props, ref) {
     className,
     ...rest
   } = props;
-  return /*#__PURE__*/React.createElement(Root, {
+  return /*#__PURE__*/jsx(Root, {
     ref: ref,
     className: cx_default(className, classes.root),
-    ...rest
-  }, children);
+    ...rest,
+    children: children
+  });
 }
 var Grid$1 = /*#__PURE__*/React.forwardRef(Grid);
 const classes = {

package/blocks/Grid/samples/basic.d.ts

@@ -1,2 +1 @@
-import * as React from "react";
-export default function Sample(): React.JSX.Element;
+export default function Sample(): import("react/jsx-runtime").JSX.Element;

package/blocks/Icon/index.js

@@ -1,5 +1,6 @@
 import { useResizeObserverEntry } from 'timvir/hooks';
 import * as React from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 
 // src/css.ts
 
@@ -42,23 +43,25 @@ function Canvas(props) {
     size,
     Component
   } = props;
-  return /*#__PURE__*/React.createElement(Root$1, {
+  return /*#__PURE__*/jsxs(Root$1, {
     className: "r1bcczis",
     style: {
       width,
       height
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: classes$1.backdrop
-  }), /*#__PURE__*/React.createElement(Grid, {
-    className: classes$1.grid,
-    size: size
-  }), /*#__PURE__*/React.createElement("div", {
-    style: {
-      fontSize: `${size}px`,
-      zIndex: 1
-    }
-  }, /*#__PURE__*/React.createElement(Component, null)));
+    },
+    children: [/*#__PURE__*/jsx("div", {
+      className: classes$1.backdrop
+    }), /*#__PURE__*/jsx(Grid, {
+      className: classes$1.grid,
+      size: size
+    }), /*#__PURE__*/jsx("div", {
+      style: {
+        fontSize: `${size}px`,
+        zIndex: 1
+      },
+      children: /*#__PURE__*/jsx(Component, {})
+    })]
+  });
 }
 function Grid({
   size,
@@ -70,47 +73,50 @@ function Grid({
   const Corner = ({
     dx,
     dy
-  }) => /*#__PURE__*/React.createElement("g", null, /*#__PURE__*/React.createElement("line", {
-    x1: dx(center, halfSize),
-    x2: dx(center, halfSize + whiskerLength),
-    y1: dy(center, halfSize),
-    y2: dy(center, halfSize),
-    strokeWidth: 1,
-    stroke: "#EEEEEE"
-  }), /*#__PURE__*/React.createElement("line", {
-    x1: dx(center, halfSize),
-    x2: dx(center, halfSize),
-    y1: dy(center, halfSize),
-    y2: dy(center, halfSize + whiskerLength),
-    strokeWidth: 1,
-    stroke: "#EEEEEE"
-  }));
+  }) => /*#__PURE__*/jsxs("g", {
+    children: [/*#__PURE__*/jsx("line", {
+      x1: dx(center, halfSize),
+      x2: dx(center, halfSize + whiskerLength),
+      y1: dy(center, halfSize),
+      y2: dy(center, halfSize),
+      strokeWidth: 1,
+      stroke: "#EEEEEE"
+    }), /*#__PURE__*/jsx("line", {
+      x1: dx(center, halfSize),
+      x2: dx(center, halfSize),
+      y1: dy(center, halfSize),
+      y2: dy(center, halfSize + whiskerLength),
+      strokeWidth: 1,
+      stroke: "#EEEEEE"
+    })]
+  });
   const add = (a, b) => a + b;
   const sub = (a, b) => a - b;
-  return /*#__PURE__*/React.createElement("svg", {
+  return /*#__PURE__*/jsxs("svg", {
     width: "120",
     height: "120",
     viewBox: "0 0 120 120",
-    ...rest
-  }, /*#__PURE__*/React.createElement("rect", {
-    x: center - halfSize,
-    y: center - halfSize,
-    width: size,
-    height: size,
-    fill: "#FFBBFF88"
-  }), /*#__PURE__*/React.createElement(Corner, {
-    dx: sub,
-    dy: sub
-  }), /*#__PURE__*/React.createElement(Corner, {
-    dx: add,
-    dy: sub
-  }), /*#__PURE__*/React.createElement(Corner, {
-    dx: add,
-    dy: add
-  }), /*#__PURE__*/React.createElement(Corner, {
-    dx: sub,
-    dy: add
-  }));
+    ...rest,
+    children: [/*#__PURE__*/jsx("rect", {
+      x: center - halfSize,
+      y: center - halfSize,
+      width: size,
+      height: size,
+      fill: "#FFBBFF88"
+    }), /*#__PURE__*/jsx(Corner, {
+      dx: sub,
+      dy: sub
+    }), /*#__PURE__*/jsx(Corner, {
+      dx: add,
+      dy: sub
+    }), /*#__PURE__*/jsx(Corner, {
+      dx: add,
+      dy: add
+    }), /*#__PURE__*/jsx(Corner, {
+      dx: sub,
+      dy: add
+    })]
+  });
 }
 
 /**
@@ -128,20 +134,25 @@ function Icon(props, ref) {
   } = props;
   const [roRef, roe] = useResizeObserverEntry();
   const width = roe?.contentRect.width;
-  return /*#__PURE__*/React.createElement(Root, {
+  return /*#__PURE__*/jsx(Root, {
     ref: ref,
     className: cx_default(className, "r1k0w618"),
-    ...rest
-  }, /*#__PURE__*/React.createElement("div", {
-    ref: roRef
-  }, width !== undefined && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Canvas, {
-    width: width,
-    height: width,
-    size: 32 /*descriptor.instances[0].size as number */,
-    Component: descriptor.instances[0].Component
-  }), /*#__PURE__*/React.createElement("div", {
-    className: classes.name
-  }, descriptor.name))));
+    ...rest,
+    children: /*#__PURE__*/jsx("div", {
+      ref: roRef,
+      children: width !== undefined && /*#__PURE__*/jsxs(Fragment, {
+        children: [/*#__PURE__*/jsx(Canvas, {
+          width: width,
+          height: width,
+          size: 32 /*descriptor.instances[0].size as number */,
+          Component: descriptor.instances[0].Component
+        }), /*#__PURE__*/jsx("div", {
+          className: classes.name,
+          children: descriptor.name
+        })]
+      })
+    })
+  });
 }
 var Icon$1 = /*#__PURE__*/React.forwardRef(Icon);
 

package/blocks/Icon/internal/Canvas.d.ts

@@ -5,5 +5,5 @@ interface Props {
     size: number;
     Component: React.ElementType;
 }
-declare function Canvas(props: Props): React.JSX.Element;
+declare function Canvas(props: Props): import("react/jsx-runtime").JSX.Element;
 export default Canvas;

package/blocks/Icon/samples/basic.d.ts

@@ -1,2 +1 @@
-import * as React from "react";
-export default function Sample(): React.JSX.Element;
+export default function Sample(): import("react/jsx-runtime").JSX.Element;

package/blocks/Icon/types.d.ts

@@ -1,5 +1,5 @@
-export type Size = "responsive" | number;
-export interface Instance {
+type Size = "responsive" | number;
+interface Instance {
     size: Size;
     Component: React.ElementType;
 }
@@ -7,3 +7,4 @@ export interface Descriptor {
     name: string;
     instances: Instance[];
 }
+export {};

package/blocks/Message/index.js

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import * as Icons from 'react-feather';
+import { jsxs, jsx } from 'react/jsx-runtime';
 
 // src/css.ts
 
@@ -41,25 +42,28 @@ function Message(props, ref) {
     children,
     ...rest
   } = props;
-  return /*#__PURE__*/React.createElement(Root, {
+  return /*#__PURE__*/jsxs(Root, {
     ref: ref,
     className: cx_default(className, "r1ssql2z", variant !== undefined && variantStyles[variant]),
-    ...rest
-  }, variant && /*#__PURE__*/React.createElement("div", {
-    className: icon
-  }, {
-    info: /*#__PURE__*/React.createElement(Icons.ChevronsRight, {
-      size: "1.5em"
-    }),
-    warning: /*#__PURE__*/React.createElement(Icons.AlertCircle, {
-      size: "1.5em"
-    }),
-    alert: /*#__PURE__*/React.createElement(Icons.XOctagon, {
-      size: "1.5em"
-    })
-  }[variant]), /*#__PURE__*/React.createElement("div", {
-    className: "dhvu07f"
-  }, children));
+    ...rest,
+    children: [variant && /*#__PURE__*/jsx("div", {
+      className: icon,
+      children: {
+        info: /*#__PURE__*/jsx(Icons.ChevronsRight, {
+          size: "1.5em"
+        }),
+        warning: /*#__PURE__*/jsx(Icons.AlertCircle, {
+          size: "1.5em"
+        }),
+        alert: /*#__PURE__*/jsx(Icons.XOctagon, {
+          size: "1.5em"
+        })
+      }[variant]
+    }), /*#__PURE__*/jsx("div", {
+      className: "dhvu07f",
+      children: children
+    })]
+  });
 }
 var Message$1 = /*#__PURE__*/React.forwardRef(Message);
 const icon = "i1dz18jz";

package/blocks/Message/samples/basic.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
 import { Message } from "..";
 type Props = Partial<React.ComponentPropsWithoutRef<typeof Message>>;
-export default function Sample(props: Props): React.JSX.Element;
+export default function Sample(props: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/blocks/Swatch/index.js

@@ -1,6 +1,7 @@
 'use client';
 import { useBlock } from 'timvir/core';
 import * as React from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
 
 // src/css.ts
 
@@ -51,7 +52,7 @@ function Swatch(props, ref) {
   React.useEffect(() => {
     setLabel(name);
   }, [name]);
-  return /*#__PURE__*/React.createElement(Root, {
+  return /*#__PURE__*/jsx(Root, {
     role: "button",
     ref: ref,
     ...rest,
@@ -67,18 +68,26 @@ function Swatch(props, ref) {
     onMouseLeave: ev => {
       setLabel(name);
       onMouseLeave?.(ev);
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "dhgsgky",
-    style: {
-      background: value,
-      color: contrastValue
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "dobecwk"
-  }, label && /*#__PURE__*/React.createElement("div", null, label), label === name && /*#__PURE__*/React.createElement("div", null, value)), ancestry && /*#__PURE__*/React.createElement("div", {
-    className: "dho7t08"
-  }, ancestry)));
+    },
+    children: /*#__PURE__*/jsxs("div", {
+      className: "dhgsgky",
+      style: {
+        background: value,
+        color: contrastValue
+      },
+      children: [/*#__PURE__*/jsxs("div", {
+        className: "dobecwk",
+        children: [label && /*#__PURE__*/jsx("div", {
+          children: label
+        }), label === name && /*#__PURE__*/jsx("div", {
+          children: value
+        })]
+      }), ancestry && /*#__PURE__*/jsx("div", {
+        className: "dho7t08",
+        children: ancestry
+      })]
+    })
+  });
 }
 var Swatch$1 = /*#__PURE__*/React.forwardRef(Swatch);
 

package/blocks/Swatch/samples/basic.d.ts

@@ -1,2 +1 @@
-import * as React from "react";
-export default function Sample(): React.JSX.Element;
+export default function Sample(): import("react/jsx-runtime").JSX.Element;