solid-js 1.8.16 → 1.8.18

package/h/dist/h.js

@@ -12,12 +12,14 @@ function createHyperScript(r) {
   function h() {
     let args = [].slice.call(arguments),
       e,
+      classes = [],
       multiExpression = false;
     while (Array.isArray(args[0])) args = args[0];
     if (args[0][$ELEMENT]) args.unshift(h.Fragment);
     typeof args[0] === "string" && detectMultiExpression(args);
     const ret = () => {
       while (args.length) item(args.shift());
+      if (e instanceof Element && classes.length) e.classList.add(...classes);
       return e;
     };
     ret[$ELEMENT] = true;
@@ -43,6 +45,18 @@ function createHyperScript(r) {
         let dynamic = false;
         const d = Object.getOwnPropertyDescriptors(l);
         for (const k in d) {
+          if (k === "class" && classes.length !== 0) {
+            const fixedClasses = classes.join(" "),
+              value =
+                typeof d["class"].value === "function"
+                  ? () => fixedClasses + " " + d["class"].value()
+                  : fixedClasses + " " + l["class"];
+            Object.defineProperty(l, "class", {
+              ...d[k],
+              value
+            });
+            classes = [];
+          }
           if (k !== "ref" && k.slice(0, 2) !== "on" && typeof d[k].value === "function") {
             r.dynamicProperty(l, k);
             dynamic = true;
@@ -97,7 +111,7 @@ function createHyperScript(r) {
           e = r.SVGElements.has(v)
             ? document.createElementNS("http://www.w3.org/2000/svg", v)
             : document.createElement(v);
-        else if (v[0] === ".") e.classList.add(s);
+        else if (v[0] === ".") classes.push(s);
         else if (v[0] === "#") e.setAttribute("id", s);
       }
     }

package/h/jsx-runtime/types/jsx.d.ts

@@ -155,6 +155,7 @@ export namespace JSX {
     onAnimationStart?: EventHandlerUnion<T, AnimationEvent>;
     onAuxClick?: EventHandlerUnion<T, MouseEvent>;
     onBeforeInput?: EventHandlerUnion<T, InputEvent>;
+    onBeforeToggle?: EventHandlerUnion<T, ToggleEvent>;
     onBlur?: EventHandlerUnion<T, FocusEvent>;
     onCanPlay?: EventHandlerUnion<T, Event>;
     onCanPlayThrough?: EventHandlerUnion<T, Event>;
@@ -220,6 +221,7 @@ export namespace JSX {
     >;
     onSuspend?: EventHandlerUnion<T, Event>;
     onTimeUpdate?: EventHandlerUnion<T, Event>;
+    onToggle?: EventHandlerUnion<T, ToggleEvent>;
     onTouchCancel?: EventHandlerUnion<T, TouchEvent>;
     onTouchEnd?: EventHandlerUnion<T, TouchEvent>;
     onTouchMove?: EventHandlerUnion<T, TouchEvent>;
@@ -242,6 +244,7 @@ export namespace JSX {
     onanimationstart?: EventHandlerUnion<T, AnimationEvent>;
     onauxclick?: EventHandlerUnion<T, MouseEvent>;
     onbeforeinput?: EventHandlerUnion<T, InputEvent>;
+    onbeforetoggle?: EventHandlerUnion<T, ToggleEvent>;
     onblur?: EventHandlerUnion<T, FocusEvent>;
     oncanplay?: EventHandlerUnion<T, Event>;
     oncanplaythrough?: EventHandlerUnion<T, Event>;
@@ -307,6 +310,7 @@ export namespace JSX {
     >;
     onsuspend?: EventHandlerUnion<T, Event>;
     ontimeupdate?: EventHandlerUnion<T, Event>;
+    ontoggle?: EventHandlerUnion<T, ToggleEvent>;
     ontouchcancel?: EventHandlerUnion<T, TouchEvent>;
     ontouchend?: EventHandlerUnion<T, TouchEvent>;
     ontouchmove?: EventHandlerUnion<T, TouchEvent>;
@@ -1820,6 +1824,7 @@ export namespace JSX {
     contentScriptType?: FunctionMaybe<string>;
     contentStyleType?: FunctionMaybe<string>;
     xmlns?: FunctionMaybe<string>;
+    "xmlns:xlink"?: FunctionMaybe<string>;
   }
   interface SwitchSVGAttributes<T>
     extends ContainerElementSVGAttributes<T>,

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "solid-js",
   "description": "A declarative JavaScript library for building user interfaces.",
-  "version": "1.8.16",
+  "version": "1.8.18",
   "author": "Ryan Carniato",
   "license": "MIT",
   "homepage": "https://solidjs.com",

package/store/types/store.d.ts

@@ -243,7 +243,7 @@ export interface SetStoreFunction<T> {
 /**
  * Creates a reactive store that can be read through a proxy object and written with a setter function
  *
- * @description https://www.solidjs.com/docs/latest/api#createstore
+ * @description https://docs.solidjs.com/reference/store-utilities/create-store
  */
 export declare function createStore<T extends object = {}>(
   ...[store, options]: {} extends T

package/types/jsx.d.ts

@@ -221,6 +221,7 @@ export namespace JSX {
     onAnimationStart?: EventHandlerUnion<T, AnimationEvent>;
     onAuxClick?: EventHandlerUnion<T, MouseEvent>;
     onBeforeInput?: InputEventHandlerUnion<T, InputEvent>;
+    onBeforeToggle?: EventHandlerUnion<T, ToggleEvent>;
     onBlur?: FocusEventHandlerUnion<T, FocusEvent>;
     onCanPlay?: EventHandlerUnion<T, Event>;
     onCanPlayThrough?: EventHandlerUnion<T, Event>;
@@ -286,6 +287,7 @@ export namespace JSX {
     >;
     onSuspend?: EventHandlerUnion<T, Event>;
     onTimeUpdate?: EventHandlerUnion<T, Event>;
+    onToggle?: EventHandlerUnion<T, ToggleEvent>;
     onTouchCancel?: EventHandlerUnion<T, TouchEvent>;
     onTouchEnd?: EventHandlerUnion<T, TouchEvent>;
     onTouchMove?: EventHandlerUnion<T, TouchEvent>;
@@ -308,6 +310,7 @@ export namespace JSX {
     onanimationstart?: EventHandlerUnion<T, AnimationEvent>;
     onauxclick?: EventHandlerUnion<T, MouseEvent>;
     onbeforeinput?: InputEventHandlerUnion<T, InputEvent>;
+    onbeforetoggle?: EventHandlerUnion<T, ToggleEvent>;
     onblur?: FocusEventHandlerUnion<T, FocusEvent>;
     oncanplay?: EventHandlerUnion<T, Event>;
     oncanplaythrough?: EventHandlerUnion<T, Event>;
@@ -373,6 +376,7 @@ export namespace JSX {
     >;
     onsuspend?: EventHandlerUnion<T, Event>;
     ontimeupdate?: EventHandlerUnion<T, Event>;
+    ontoggle?: EventHandlerUnion<T, ToggleEvent>;
     ontouchcancel?: EventHandlerUnion<T, TouchEvent>;
     ontouchend?: EventHandlerUnion<T, TouchEvent>;
     ontouchmove?: EventHandlerUnion<T, TouchEvent>;
@@ -1897,6 +1901,7 @@ export namespace JSX {
     contentScriptType?: string;
     contentStyleType?: string;
     xmlns?: string;
+    "xmlns:xlink"?: string;
   }
   interface SwitchSVGAttributes<T>
     extends ContainerElementSVGAttributes<T>,

package/types/reactive/array.d.ts

@@ -27,7 +27,7 @@ SOFTWARE.
  *
  * similar to `Array.prototype.map`, but gets the index as accessor, transforms only values that changed and returns an accessor and reactively tracks changes to the list.
  *
- * @description https://www.solidjs.com/docs/latest/api#maparray
+ * @description https://docs.solidjs.com/reference/reactive-utilities/map-array
  */
 export declare function mapArray<T, U>(
   list: Accessor<readonly T[] | undefined | null | false>,
@@ -41,7 +41,7 @@ export declare function mapArray<T, U>(
  *
  * similar to `Array.prototype.map`, but gets the value as an accessor, transforms only changed items of the original arrays anew and returns an accessor.
  *
- * @description https://www.solidjs.com/docs/latest/api#indexarray
+ * @description https://docs.solidjs.com/reference/reactive-utilities/index-array
  */
 export declare function indexArray<T, U>(
   list: Accessor<readonly T[] | undefined | null | false>,

package/types/reactive/observable.d.ts

@@ -25,7 +25,7 @@ export type ObservableObserver<T> =
  * const obsv$ = from(observable(s));
  * obsv$.subscribe((v) => console.log(v));
  * ```
- * description https://www.solidjs.com/docs/latest/api#observable
+ * description https://docs.solidjs.com/reference/reactive-utilities/observable
  */
 export declare function observable<T>(input: Accessor<T>): Observable<T>;
 export declare function from<T>(

package/types/reactive/signal.d.ts

@@ -96,7 +96,7 @@ export type RootFunction<T> = (dispose: () => void) => T;
  * @param detachedOwner optional reactive context to bind the root to
  * @returns the output of `fn`.
  *
- * @description https://www.solidjs.com/docs/latest/api#createroot
+ * @description https://docs.solidjs.com/reference/reactive-utilities/create-root
  */
 export declare function createRoot<T>(fn: RootFunction<T>, detachedOwner?: typeof Owner): T;
 export type Accessor<T> = () => T;
@@ -133,7 +133,7 @@ export interface SignalOptions<T> extends MemoOptions<T> {
  * setCount(count => count + 1);
  * ```
  *
- * @description https://www.solidjs.com/docs/latest/api#createsignal
+ * @description https://docs.solidjs.com/reference/basic-reactivity/create-signal
  */
 export declare function createSignal<T>(): Signal<T | undefined>;
 export declare function createSignal<T>(value: T, options?: SignalOptions<T>): Signal<T>;
@@ -156,7 +156,7 @@ export type EffectFunction<Prev, Next extends Prev = Prev> = (v: Prev) => Next;
  * @param value an optional initial value for the computation; if set, fn will never receive undefined as first argument
  * @param options allows to set a name in dev mode for debugging purposes
  *
- * @description https://www.solidjs.com/docs/latest/api#createcomputed
+ * @description https://docs.solidjs.com/reference/secondary-primitives/create-computed
  */
 export declare function createComputed<Next>(
   fn: EffectFunction<undefined | NoInfer<Next>, Next>
@@ -179,7 +179,7 @@ export declare function createComputed<Next, Init = Next>(
  * @param value an optional initial value for the computation; if set, fn will never receive undefined as first argument
  * @param options allows to set a name in dev mode for debugging purposes
  *
- * @description https://www.solidjs.com/docs/latest/api#createrendereffect
+ * @description https://docs.solidjs.com/reference/secondary-primitives/create-render-effect
  */
 export declare function createRenderEffect<Next>(
   fn: EffectFunction<undefined | NoInfer<Next>, Next>
@@ -202,7 +202,7 @@ export declare function createRenderEffect<Next, Init = Next>(
  * @param value an optional initial value for the computation; if set, fn will never receive undefined as first argument
  * @param options allows to set a name in dev mode for debugging purposes
  *
- * @description https://www.solidjs.com/docs/latest/api#createeffect
+ * @description https://docs.solidjs.com/reference/basic-reactivity/create-effect
  */
 export declare function createEffect<Next>(
   fn: EffectFunction<undefined | NoInfer<Next>, Next>
@@ -225,7 +225,7 @@ export declare function createEffect<Next, Init = Next>(
  * @param invalidated a function that is called when tracked function is invalidated.
  * @param options allows to set a name in dev mode for debugging purposes
  *
- * @description https://www.solidjs.com/docs/latest/api#createreaction
+ * @description https://docs.solidjs.com/reference/secondary-primitives/create-reaction
  */
 export declare function createReaction(
   onInvalidate: () => void,
@@ -251,7 +251,7 @@ export interface MemoOptions<T> extends EffectOptions {
  * @param value an optional initial value for the computation; if set, fn will never receive undefined as first argument
  * @param options allows to set a name in dev mode for debugging purposes and use a custom comparison function in equals
  *
- * @description https://www.solidjs.com/docs/latest/api#creatememo
+ * @description https://docs.solidjs.com/reference/basic-reactivity/create-memo
  */
 export declare function createMemo<Next extends Prev, Prev = Next>(
   fn: EffectFunction<undefined | NoInfer<Prev>, Next>
@@ -358,7 +358,7 @@ export type InitializedResourceReturn<T, R = unknown> = [
  * * `mutate` allows to manually overwrite the resource without calling the fetcher
  * * `refetch` will re-run the fetcher without changing the source, and if called with a value, that value will be passed to the fetcher via the `refetching` property on the fetcher's second parameter
  *
- * @description https://www.solidjs.com/docs/latest/api#createresource
+ * @description https://docs.solidjs.com/reference/basic-reactivity/create-resource
  */
 export declare function createResource<T, R = unknown>(
   fetcher: ResourceFetcher<true, T, R>,
@@ -394,7 +394,7 @@ export interface DeferredOptions<T> {
  * @param fn a function that receives its previous or the initial value, if set, and returns a new value used to react on a computation
  * @param options allows to set the timeout in milliseconds, use a custom comparison function and set a name in dev mode for debugging purposes
  *
- * @description https://www.solidjs.com/docs/latest/api#createdeferred
+ * @description https://docs.solidjs.com/reference/secondary-primitives/create-deferred
  */
 export declare function createDeferred<T>(
   source: Accessor<T>,
@@ -423,7 +423,7 @@ export type EqualityCheckerFunction<T, U> = (a: U, b: T) => boolean;
  *
  * This makes the operation O(2) instead of O(n).
  *
- * @description https://www.solidjs.com/docs/latest/api#createselector
+ * @description https://docs.solidjs.com/reference/secondary-primitives/create-selector
  */
 export declare function createSelector<T, U = T>(
   source: Accessor<T>,
@@ -435,7 +435,7 @@ export declare function createSelector<T, U = T>(
  * @param fn wraps the reactive updates that should be batched
  * @returns the return value from `fn`
  *
- * @description https://www.solidjs.com/docs/latest/api#batch
+ * @description https://docs.solidjs.com/reference/reactive-utilities/batch
  */
 export declare function batch<T>(fn: Accessor<T>): T;
 /**
@@ -443,7 +443,7 @@ export declare function batch<T>(fn: Accessor<T>): T;
  * @param fn the scope that is out of the tracking context
  * @returns the return value of `fn`
  *
- * @description https://www.solidjs.com/docs/latest/api#untrack
+ * @description https://docs.solidjs.com/reference/reactive-utilities/untrack
  */
 export declare function untrack<T>(fn: Accessor<T>): T;
 /** @deprecated */
@@ -494,7 +494,7 @@ export interface OnOptions {
  * });
  * ```
  *
- * @description https://www.solidjs.com/docs/latest/api#on
+ * @description https://docs.solidjs.com/reference/jsx-attributes/on_
  */
 export declare function on<S, Next extends Prev, Prev = Next>(
   deps: AccessorArray<S> | Accessor<S>,
@@ -516,7 +516,7 @@ export declare function on<S, Next extends Prev, Prev = Next>(
  * Runs an effect only after initial render on mount
  * @param fn an effect that should run only once on mount
  *
- * @description https://www.solidjs.com/docs/latest/api#onmount
+ * @description https://docs.solidjs.com/reference/lifecycle/on-mount
  */
 export declare function onMount(fn: () => void): void;
 /**
@@ -525,7 +525,7 @@ export declare function onMount(fn: () => void): void;
  *
  * @returns the same {@link fn} function that was passed in
  *
- * @description https://www.solidjs.com/docs/latest/api#oncleanup
+ * @description https://docs.solidjs.com/reference/lifecycle/on-cleanup
  */
 export declare function onCleanup<T extends () => any>(fn: T): T;
 /**
@@ -535,7 +535,7 @@ export declare function onCleanup<T extends () => any>(fn: T): T;
  *
  * * If the error is thrown again inside the error handler, it will trigger the next available parent handler
  *
- * @description https://www.solidjs.com/docs/latest/api#catcherror
+ * @description https://docs.solidjs.com/reference/reactive-utilities/catch-error
  */
 export declare function catchError<T>(fn: () => T, handler: (err: Error) => void): T | undefined;
 export declare function getListener(): Computation<any, any> | null;
@@ -547,7 +547,7 @@ export declare function enableScheduling(scheduler?: typeof requestCallback): vo
  * export function startTransition(fn: () => void) => Promise<void>
  * ```
  *
- * @description https://www.solidjs.com/docs/latest/api#usetransition
+ * @description https://docs.solidjs.com/reference/reactive-utilities/start-transition
  */
 export declare function startTransition(fn: () => unknown): Promise<void>;
 export type Transition = [Accessor<boolean>, (fn: () => void) => Promise<void>];
@@ -559,7 +559,7 @@ export type Transition = [Accessor<boolean>, (fn: () => void) => Promise<void>];
  * ];
  * @returns a tuple; first value is an accessor if the transition is pending and a callback to start the transition
  *
- * @description https://www.solidjs.com/docs/latest/api#usetransition
+ * @description https://docs.solidjs.com/reference/reactive-utilities/use-transition
  */
 export declare function useTransition(): Transition;
 export declare function resumeEffects(e: Computation<any>[]): void;
@@ -595,7 +595,7 @@ export interface Context<T> {
  * @param options allows to set a name in dev mode for debugging purposes
  * @returns The context that contains the Provider Component and that can be used with `useContext`
  *
- * @description https://www.solidjs.com/docs/latest/api#createcontext
+ * @description https://docs.solidjs.com/reference/component-apis/create-context
  */
 export declare function createContext<T>(
   defaultValue?: undefined,
@@ -608,7 +608,7 @@ export declare function createContext<T>(defaultValue: T, options?: EffectOption
  * @param context Context object made by `createContext`
  * @returns the current or `defaultValue`, if present
  *
- * @description https://www.solidjs.com/docs/latest/api#usecontext
+ * @description https://docs.solidjs.com/reference/component-apis/use-context
  */
 export declare function useContext<T>(context: Context<T>): T;
 export type ResolvedJSXElement = Exclude<JSX.Element, JSX.ArrayElement>;
@@ -622,7 +622,7 @@ export type ChildrenReturn = Accessor<ResolvedChildren> & {
  * @param fn an accessor for the children
  * @returns a accessor of the same children, but resolved
  *
- * @description https://www.solidjs.com/docs/latest/api#children
+ * @description https://docs.solidjs.com/reference/component-apis/children
  */
 export declare function children(fn: Accessor<JSX.Element>): ChildrenReturn;
 export type SuspenseContextType = {
@@ -656,7 +656,7 @@ export declare function writeSignal(
  *
  * * If the error is thrown again inside the error handler, it will trigger the next available parent handler
  *
- * @description https://www.solidjs.com/docs/latest/api#onerror
+ * @description https://www.solidjs.com/docs/latest/api#onerror | https://docs.solidjs.com/reference/reactive-utilities/catch-error
  */
 export declare function onError(fn: (err: Error) => void): void;
 export {};

package/types/render/Suspense.d.ts

@@ -2,7 +2,7 @@ import type { JSX } from "../jsx.js";
 /**
  * **[experimental]** Controls the order in which suspended content is rendered
  *
- * @description https://www.solidjs.com/docs/latest/api#suspenselist-experimental
+ * @description https://docs.solidjs.com/reference/components/suspense-list
  */
 export declare function SuspenseList(props: {
   children: JSX.Element;
@@ -18,7 +18,7 @@ export declare function SuspenseList(props: {
  *   <AsyncComponent />
  * </Suspense>
  * ```
- * @description https://www.solidjs.com/docs/latest/api#suspense
+ * @description https://docs.solidjs.com/reference/components/suspense
  */
 export declare function Suspense(props: {
   fallback?: JSX.Element;

package/types/render/flow.d.ts

@@ -11,7 +11,7 @@ import type { JSX } from "../jsx.js";
  * ```
  * If you have a list with fixed indices and changing values, consider using `<Index>` instead.
  *
- * @description https://www.solidjs.com/docs/latest/api#for
+ * @description https://docs.solidjs.com/reference/components/for
  */
 export declare function For<T extends readonly any[], U extends JSX.Element>(props: {
   each: T | undefined | null | false;
@@ -29,7 +29,7 @@ export declare function For<T extends readonly any[], U extends JSX.Element>(pro
  * ```
  * If you have a list with changing indices, better use `<For>`.
  *
- * @description https://www.solidjs.com/docs/latest/api#index
+ * @description https://docs.solidjs.com/reference/components/index
  */
 export declare function Index<T extends readonly any[], U extends JSX.Element>(props: {
   each: T | undefined | null | false;
@@ -39,7 +39,7 @@ export declare function Index<T extends readonly any[], U extends JSX.Element>(p
 type RequiredParameter<T> = T extends () => unknown ? never : T;
 /**
  * Conditionally render its children or an optional fallback component
- * @description https://www.solidjs.com/docs/latest/api#show
+ * @description https://docs.solidjs.com/reference/components/show
  */
 export declare function Show<
   T,
@@ -71,7 +71,7 @@ export declare function Show<
  *   </Match>
  * </Switch>
  * ```
- * @description https://www.solidjs.com/docs/latest/api#switchmatch
+ * @description https://docs.solidjs.com/reference/components/switch-and-match
  */
 export declare function Switch(props: {
   fallback?: JSX.Element;
@@ -89,7 +89,7 @@ export type MatchProps<T> = {
  *   <Content/>
  * </Match>
  * ```
- * @description https://www.solidjs.com/docs/latest/api#switchmatch
+ * @description https://docs.solidjs.com/reference/components/switch-and-match
  */
 export declare function Match<
   T,
@@ -121,7 +121,7 @@ export declare function resetErrorBoundaries(): void;
  * ```
  * Errors thrown from the fallback can be caught by a parent ErrorBoundary
  *
- * @description https://www.solidjs.com/docs/latest/api#errorboundary
+ * @description https://docs.solidjs.com/reference/components/error-boundary
  */
 export declare function ErrorBoundary(props: {
   fallback: JSX.Element | ((err: any, reset: () => void) => JSX.Element);

package/types/server/rendering.d.ts

@@ -91,7 +91,7 @@ export declare function Index<T>(props: {
 }): string | any[] | undefined;
 /**
  * Conditionally render its children or an optional fallback component
- * @description https://www.solidjs.com/docs/latest/api#show
+ * @description https://docs.solidjs.com/reference/components/show
  */
 export declare function Show<T>(props: {
   when: T | undefined | null | false;

package/web/dist/dev.cjs

@@ -40,7 +40,7 @@ function getPropAlias(prop, tagName) {
 }
 const DelegatedEvents = /*#__PURE__*/new Set(["beforeinput", "click", "dblclick", "contextmenu", "focusin", "focusout", "input", "keydown", "keyup", "mousedown", "mousemove", "mouseout", "mouseover", "mouseup", "pointerdown", "pointermove", "pointerout", "pointerover", "pointerup", "touchend", "touchmove", "touchstart"]);
 const SVGElements = /*#__PURE__*/new Set([
-"altGlyph", "altGlyphDef", "altGlyphItem", "animate", "animateColor", "animateMotion", "animateTransform", "circle", "clipPath", "color-profile", "cursor", "defs", "desc", "ellipse", "feBlend", "feColorMatrix", "feComponentTransfer", "feComposite", "feConvolveMatrix", "feDiffuseLighting", "feDisplacementMap", "feDistantLight", "feFlood", "feFuncA", "feFuncB", "feFuncG", "feFuncR", "feGaussianBlur", "feImage", "feMerge", "feMergeNode", "feMorphology", "feOffset", "fePointLight", "feSpecularLighting", "feSpotLight", "feTile", "feTurbulence", "filter", "font", "font-face", "font-face-format", "font-face-name", "font-face-src", "font-face-uri", "foreignObject", "g", "glyph", "glyphRef", "hkern", "image", "line", "linearGradient", "marker", "mask", "metadata", "missing-glyph", "mpath", "path", "pattern", "polygon", "polyline", "radialGradient", "rect",
+"altGlyph", "altGlyphDef", "altGlyphItem", "animate", "animateColor", "animateMotion", "animateTransform", "circle", "clipPath", "color-profile", "cursor", "defs", "desc", "ellipse", "feBlend", "feColorMatrix", "feComponentTransfer", "feComposite", "feConvolveMatrix", "feDiffuseLighting", "feDisplacementMap", "feDistantLight", "feDropShadow", "feFlood", "feFuncA", "feFuncB", "feFuncG", "feFuncR", "feGaussianBlur", "feImage", "feMerge", "feMergeNode", "feMorphology", "feOffset", "fePointLight", "feSpecularLighting", "feSpotLight", "feTile", "feTurbulence", "filter", "font", "font-face", "font-face-format", "font-face-name", "font-face-src", "font-face-uri", "foreignObject", "g", "glyph", "glyphRef", "hkern", "image", "line", "linearGradient", "marker", "mask", "metadata", "missing-glyph", "mpath", "path", "pattern", "polygon", "polyline", "radialGradient", "rect",
 "set", "stop",
 "svg", "switch", "symbol", "text", "textPath",
 "tref", "tspan", "use", "view", "vkern"]);
@@ -222,7 +222,7 @@ function spread(node, props = {}, isSVG, skipChildren) {
   if (!skipChildren) {
     solidJs.createRenderEffect(() => prevProps.children = insertExpression(node, props.children, prevProps.children));
   }
-  solidJs.createRenderEffect(() => props.ref && props.ref(node));
+  solidJs.createRenderEffect(() => typeof props.ref === "function" ? use(props.ref, node) : props.ref = node);
   solidJs.createRenderEffect(() => assign(node, props, isSVG, true, prevProps, true));
   return prevProps;
 }
@@ -419,7 +419,10 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
   parent = multi && current[0] && current[0].parentNode || parent;
   if (t === "string" || t === "number") {
     if (hydrating) return current;
-    if (t === "number") value = value.toString();
+    if (t === "number") {
+      value = value.toString();
+      if (value === current) return current;
+    }
     if (multi) {
       let node = current[0];
       if (node && node.nodeType === 3) {

package/web/dist/dev.js

@@ -153,6 +153,7 @@ const SVGElements = /*#__PURE__*/ new Set([
   "feDiffuseLighting",
   "feDisplacementMap",
   "feDistantLight",
+  "feDropShadow",
   "feFlood",
   "feFuncA",
   "feFuncB",
@@ -680,7 +681,9 @@ function spread(node, props = {}, isSVG, skipChildren) {
       () => (prevProps.children = insertExpression(node, props.children, prevProps.children))
     );
   }
-  createRenderEffect(() => props.ref && props.ref(node));
+  createRenderEffect(() =>
+    typeof props.ref === "function" ? use(props.ref, node) : (props.ref = node)
+  );
   createRenderEffect(() => assign(node, props, isSVG, true, prevProps, true));
   return prevProps;
 }
@@ -887,7 +890,10 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
   parent = (multi && current[0] && current[0].parentNode) || parent;
   if (t === "string" || t === "number") {
     if (hydrating) return current;
-    if (t === "number") value = value.toString();
+    if (t === "number") {
+      value = value.toString();
+      if (value === current) return current;
+    }
     if (multi) {
       let node = current[0];
       if (node && node.nodeType === 3) {

package/web/dist/server.cjs

@@ -383,7 +383,7 @@ function ssrElement(tag, props, children, needsId) {
     } else if (value == undefined || prop === "ref" || prop.slice(0, 2) === "on") {
       continue;
     } else {
-      result += `${Aliases[prop] || prop}="${escape(value, true)}"`;
+      result += `${Aliases[prop] || escape(prop)}="${escape(value, true)}"`;
     }
     if (i !== keys.length - 1) result += " ";
   }
@@ -598,13 +598,13 @@ function ssrSpread(props, isSVG, skipChildren) {
       let n;
       result += `class="${(n = props.class) ? n + " " : ""}${(n = props.className) ? n + " " : ""}${ssrClassList(props.classList)}"`;
       classResolved = true;
-    } else if (BooleanAttributes.has(prop)) {
+    } else if (prop !== "value" && Properties.has(prop)) {
       if (value) result += prop;else continue;
     } else if (value == undefined || prop === "ref" || prop.slice(0, 2) === "on" || prop.slice(0, 5) === "prop:") {
       continue;
     } else {
       if (prop.slice(0, 5) === "attr:") prop = prop.slice(5);
-      result += `${Aliases[prop] || prop}="${escape(value, true)}"`;
+      result += `${Aliases[prop] || escape(prop)}="${escape(value, true)}"`;
     }
     if (i !== keys.length - 1) result += " ";
   }

package/web/dist/server.js

@@ -447,7 +447,7 @@ function ssrElement(tag, props, children, needsId) {
     } else if (value == undefined || prop === "ref" || prop.slice(0, 2) === "on") {
       continue;
     } else {
-      result += `${Aliases[prop] || prop}="${escape(value, true)}"`;
+      result += `${Aliases[prop] || escape(prop)}="${escape(value, true)}"`;
     }
     if (i !== keys.length - 1) result += " ";
   }
@@ -669,7 +669,7 @@ function ssrSpread(props, isSVG, skipChildren) {
         (n = props.className) ? n + " " : ""
       }${ssrClassList(props.classList)}"`;
       classResolved = true;
-    } else if (BooleanAttributes.has(prop)) {
+    } else if (prop !== "value" && Properties.has(prop)) {
       if (value) result += prop;
       else continue;
     } else if (
@@ -681,7 +681,7 @@ function ssrSpread(props, isSVG, skipChildren) {
       continue;
     } else {
       if (prop.slice(0, 5) === "attr:") prop = prop.slice(5);
-      result += `${Aliases[prop] || prop}="${escape(value, true)}"`;
+      result += `${Aliases[prop] || escape(prop)}="${escape(value, true)}"`;
     }
     if (i !== keys.length - 1) result += " ";
   }

package/web/dist/web.cjs

@@ -40,7 +40,7 @@ function getPropAlias(prop, tagName) {
 }
 const DelegatedEvents = /*#__PURE__*/new Set(["beforeinput", "click", "dblclick", "contextmenu", "focusin", "focusout", "input", "keydown", "keyup", "mousedown", "mousemove", "mouseout", "mouseover", "mouseup", "pointerdown", "pointermove", "pointerout", "pointerover", "pointerup", "touchend", "touchmove", "touchstart"]);
 const SVGElements = /*#__PURE__*/new Set([
-"altGlyph", "altGlyphDef", "altGlyphItem", "animate", "animateColor", "animateMotion", "animateTransform", "circle", "clipPath", "color-profile", "cursor", "defs", "desc", "ellipse", "feBlend", "feColorMatrix", "feComponentTransfer", "feComposite", "feConvolveMatrix", "feDiffuseLighting", "feDisplacementMap", "feDistantLight", "feFlood", "feFuncA", "feFuncB", "feFuncG", "feFuncR", "feGaussianBlur", "feImage", "feMerge", "feMergeNode", "feMorphology", "feOffset", "fePointLight", "feSpecularLighting", "feSpotLight", "feTile", "feTurbulence", "filter", "font", "font-face", "font-face-format", "font-face-name", "font-face-src", "font-face-uri", "foreignObject", "g", "glyph", "glyphRef", "hkern", "image", "line", "linearGradient", "marker", "mask", "metadata", "missing-glyph", "mpath", "path", "pattern", "polygon", "polyline", "radialGradient", "rect",
+"altGlyph", "altGlyphDef", "altGlyphItem", "animate", "animateColor", "animateMotion", "animateTransform", "circle", "clipPath", "color-profile", "cursor", "defs", "desc", "ellipse", "feBlend", "feColorMatrix", "feComponentTransfer", "feComposite", "feConvolveMatrix", "feDiffuseLighting", "feDisplacementMap", "feDistantLight", "feDropShadow", "feFlood", "feFuncA", "feFuncB", "feFuncG", "feFuncR", "feGaussianBlur", "feImage", "feMerge", "feMergeNode", "feMorphology", "feOffset", "fePointLight", "feSpecularLighting", "feSpotLight", "feTile", "feTurbulence", "filter", "font", "font-face", "font-face-format", "font-face-name", "font-face-src", "font-face-uri", "foreignObject", "g", "glyph", "glyphRef", "hkern", "image", "line", "linearGradient", "marker", "mask", "metadata", "missing-glyph", "mpath", "path", "pattern", "polygon", "polyline", "radialGradient", "rect",
 "set", "stop",
 "svg", "switch", "symbol", "text", "textPath",
 "tref", "tspan", "use", "view", "vkern"]);
@@ -218,7 +218,7 @@ function spread(node, props = {}, isSVG, skipChildren) {
   if (!skipChildren) {
     solidJs.createRenderEffect(() => prevProps.children = insertExpression(node, props.children, prevProps.children));
   }
-  solidJs.createRenderEffect(() => props.ref && props.ref(node));
+  solidJs.createRenderEffect(() => typeof props.ref === "function" ? use(props.ref, node) : props.ref = node);
   solidJs.createRenderEffect(() => assign(node, props, isSVG, true, prevProps, true));
   return prevProps;
 }
@@ -414,7 +414,10 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
   parent = multi && current[0] && current[0].parentNode || parent;
   if (t === "string" || t === "number") {
     if (hydrating) return current;
-    if (t === "number") value = value.toString();
+    if (t === "number") {
+      value = value.toString();
+      if (value === current) return current;
+    }
     if (multi) {
       let node = current[0];
       if (node && node.nodeType === 3) {

package/web/dist/web.js

@@ -152,6 +152,7 @@ const SVGElements = /*#__PURE__*/ new Set([
   "feDiffuseLighting",
   "feDisplacementMap",
   "feDistantLight",
+  "feDropShadow",
   "feFlood",
   "feFuncA",
   "feFuncB",
@@ -670,7 +671,9 @@ function spread(node, props = {}, isSVG, skipChildren) {
       () => (prevProps.children = insertExpression(node, props.children, prevProps.children))
     );
   }
-  createRenderEffect(() => props.ref && props.ref(node));
+  createRenderEffect(() =>
+    typeof props.ref === "function" ? use(props.ref, node) : (props.ref = node)
+  );
   createRenderEffect(() => assign(node, props, isSVG, true, prevProps, true));
   return prevProps;
 }
@@ -875,7 +878,10 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
   parent = (multi && current[0] && current[0].parentNode) || parent;
   if (t === "string" || t === "number") {
     if (hydrating) return current;
-    if (t === "number") value = value.toString();
+    if (t === "number") {
+      value = value.toString();
+      if (value === current) return current;
+    }
     if (multi) {
       let node = current[0];
       if (node && node.nodeType === 3) {