@ariakit/solid-core 0.0.1 → 0.1.1

package/cjs/utils/reactivity.d.cts

@@ -0,0 +1,109 @@
+import type { AnyObject } from "@ariakit/core/utils/types";
+import { type Accessor, type JSX, type Setter } from "solid-js";
+/**
+ * Creates a stable accessor. Useful when creating derived accessors that
+ * depend on a mutable variable that may change later.
+ * @example
+ * let value = 0;
+ * const accessor = stableAccessor(value, (v) => v + 1);
+ * value = 100;
+ * accessor(); // 1
+ */
+export declare function stableAccessor<T, U>(value: T, callback: (value: T) => U): () => U;
+type NullablyRequired<T> = {
+    [P in keyof T & keyof any]: T[P];
+};
+export type ExtractPropsWithDefaultsExtractedProps<P, D extends Partial<R>, R = NullablyRequired<P>> = {
+    -readonly [K in keyof R as Extract<K, keyof D>]: D[K] extends undefined ? R[K] : Exclude<R[K], undefined>;
+};
+export type ExtractPropsWithDefaultsRestProps<P, D extends Partial<P>> = Omit<P, keyof D>;
+export type ExtractPropsWithDefaultsReturn<P, D extends Partial<P>> = [
+    ExtractPropsWithDefaultsExtractedProps<P, D>,
+    ExtractPropsWithDefaultsRestProps<P, D>
+];
+/**
+ * Extracts props from a props object and applies defaults to them. The
+ * return value is a tuple of the extracted props and the rest of the props.
+ *
+ * To extract a prop without a default, set it to `undefined`.
+ * @example
+ * const [extractedProps, restProps] = extractPropsWithDefaults(
+ *   props,
+ *   { orientation: "horizontal" },
+ * );
+ */
+export declare function extractPropsWithDefaults<P extends AnyObject, const D extends Partial<P>>(props: P, defaults: D): ExtractPropsWithDefaultsReturn<P, D>;
+/**
+ * A ref object that contains the value getter (`value`) and setter (`set`) as
+ * properties for convenience. It also has a `reset` method that can be used to
+ * set the value to the initial value that was passed, which is `undefined` by
+ * default. The `current` getter can be used to obtain the value without
+ * tracking it reactively.
+ *
+ * Created by the `createRef` function.
+ * @example
+ * const ref = createRef();
+ * createEffect(() => {
+ *   console.log(ref.value);
+ * });
+ * ref.set(buttonElement);
+ * ref.reset();
+ */
+export type RefStore<T> = {
+    /**
+     * The current value of the ref. It is a non-reactive getter, wrapped with
+     * the `untrack` function.
+     *
+     * **Important note**: since this is a getter, TypeScript might reflect the
+     * wrong type in some cases. For example:
+     *
+     * ```ts
+     * const ref = createRef<number>(); // ref.current type: number | undefined
+     * ref.set(1);
+     * console.log(ref.current); // 1
+     * if (ref.current) {
+     *   // ref.current type: number (narrowed by the if statement)
+     *   console.log(ref.current); // 1
+     *   ref.set(undefined);
+     *   // ref.current type: number (wrong!)
+     *   console.log(ref.current); // undefined
+     * }
+     * ```
+     */
+    current: T;
+    /**
+     * The getter function for the ref.
+     */
+    get: Accessor<T>;
+    /**
+     * The setter function for the ref.
+     */
+    set: Setter<T>;
+    /**
+     * Resets the ref to the initial value that was passed, which is `undefined`
+     * by default.
+     */
+    reset: () => void;
+};
+/**
+ * Creates a ref object that contains the value getter (`value`) and setter
+ * (`set`) as properties for convenience. It also has a `reset` method that
+ * can be used to set the value to the initial value that was passed,
+ * which is `undefined` by default. The `current` getter can be used to obtain
+ * the value without tracking it reactively.
+ * @example
+ * ```jsx
+ * const ref = createRef();
+ * createEffect(() => {
+ *   console.log(ref.value);
+ * });
+ * <button ref={ref.set}>Button</button>
+ * ```
+ */
+export declare function createRef<T>(): RefStore<T | undefined>;
+export declare function createRef<T>(initialValue: T): RefStore<T>;
+/**
+ * Merges two sets of props.
+ */
+export declare function mergeProps<T extends JSX.HTMLAttributes<any>>(base: T, overrides: T, skipProps?: Array<keyof T>): T;
+export {};

package/cjs/utils/reactivity.d.ts

@@ -0,0 +1,109 @@
+import type { AnyObject } from "@ariakit/core/utils/types";
+import { type Accessor, type JSX, type Setter } from "solid-js";
+/**
+ * Creates a stable accessor. Useful when creating derived accessors that
+ * depend on a mutable variable that may change later.
+ * @example
+ * let value = 0;
+ * const accessor = stableAccessor(value, (v) => v + 1);
+ * value = 100;
+ * accessor(); // 1
+ */
+export declare function stableAccessor<T, U>(value: T, callback: (value: T) => U): () => U;
+type NullablyRequired<T> = {
+    [P in keyof T & keyof any]: T[P];
+};
+export type ExtractPropsWithDefaultsExtractedProps<P, D extends Partial<R>, R = NullablyRequired<P>> = {
+    -readonly [K in keyof R as Extract<K, keyof D>]: D[K] extends undefined ? R[K] : Exclude<R[K], undefined>;
+};
+export type ExtractPropsWithDefaultsRestProps<P, D extends Partial<P>> = Omit<P, keyof D>;
+export type ExtractPropsWithDefaultsReturn<P, D extends Partial<P>> = [
+    ExtractPropsWithDefaultsExtractedProps<P, D>,
+    ExtractPropsWithDefaultsRestProps<P, D>
+];
+/**
+ * Extracts props from a props object and applies defaults to them. The
+ * return value is a tuple of the extracted props and the rest of the props.
+ *
+ * To extract a prop without a default, set it to `undefined`.
+ * @example
+ * const [extractedProps, restProps] = extractPropsWithDefaults(
+ *   props,
+ *   { orientation: "horizontal" },
+ * );
+ */
+export declare function extractPropsWithDefaults<P extends AnyObject, const D extends Partial<P>>(props: P, defaults: D): ExtractPropsWithDefaultsReturn<P, D>;
+/**
+ * A ref object that contains the value getter (`value`) and setter (`set`) as
+ * properties for convenience. It also has a `reset` method that can be used to
+ * set the value to the initial value that was passed, which is `undefined` by
+ * default. The `current` getter can be used to obtain the value without
+ * tracking it reactively.
+ *
+ * Created by the `createRef` function.
+ * @example
+ * const ref = createRef();
+ * createEffect(() => {
+ *   console.log(ref.value);
+ * });
+ * ref.set(buttonElement);
+ * ref.reset();
+ */
+export type RefStore<T> = {
+    /**
+     * The current value of the ref. It is a non-reactive getter, wrapped with
+     * the `untrack` function.
+     *
+     * **Important note**: since this is a getter, TypeScript might reflect the
+     * wrong type in some cases. For example:
+     *
+     * ```ts
+     * const ref = createRef<number>(); // ref.current type: number | undefined
+     * ref.set(1);
+     * console.log(ref.current); // 1
+     * if (ref.current) {
+     *   // ref.current type: number (narrowed by the if statement)
+     *   console.log(ref.current); // 1
+     *   ref.set(undefined);
+     *   // ref.current type: number (wrong!)
+     *   console.log(ref.current); // undefined
+     * }
+     * ```
+     */
+    current: T;
+    /**
+     * The getter function for the ref.
+     */
+    get: Accessor<T>;
+    /**
+     * The setter function for the ref.
+     */
+    set: Setter<T>;
+    /**
+     * Resets the ref to the initial value that was passed, which is `undefined`
+     * by default.
+     */
+    reset: () => void;
+};
+/**
+ * Creates a ref object that contains the value getter (`value`) and setter
+ * (`set`) as properties for convenience. It also has a `reset` method that
+ * can be used to set the value to the initial value that was passed,
+ * which is `undefined` by default. The `current` getter can be used to obtain
+ * the value without tracking it reactively.
+ * @example
+ * ```jsx
+ * const ref = createRef();
+ * createEffect(() => {
+ *   console.log(ref.value);
+ * });
+ * <button ref={ref.set}>Button</button>
+ * ```
+ */
+export declare function createRef<T>(): RefStore<T | undefined>;
+export declare function createRef<T>(initialValue: T): RefStore<T>;
+/**
+ * Merges two sets of props.
+ */
+export declare function mergeProps<T extends JSX.HTMLAttributes<any>>(base: T, overrides: T, skipProps?: Array<keyof T>): T;
+export {};

package/cjs/utils/system.cjs

@@ -0,0 +1,13 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+
+
+var _V3ZEI37Lcjs = require('../__chunks/V3ZEI37L.cjs');
+require('../__chunks/RLO4RIGL.cjs');
+
+
+
+
+
+exports.createHook = _V3ZEI37Lcjs.createHook; exports.createInstance = _V3ZEI37Lcjs.createInstance; exports.withOptions = _V3ZEI37Lcjs.withOptions; exports.wrapInstance = _V3ZEI37Lcjs.wrapInstance;

package/cjs/utils/system.d.cts

@@ -0,0 +1,45 @@
+import type { AnyObject, EmptyObject } from "@ariakit/core/utils/types";
+import { type ValidComponent } from "solid-js";
+import { type ExtractPropsWithDefaultsExtractedProps, type ExtractPropsWithDefaultsRestProps } from "./reactivity.ts";
+import type { HTMLProps, Hook, Options, Props, WrapInstance, WrapInstanceValue } from "./types.ts";
+/**
+ * Creates a Solid component instance that supports the `render` and
+ * `wrapInstance` props.
+ */
+export declare function createInstance(Component: ValidComponent, props: Props<ValidComponent, Options>): import("solid-js").JSX.Element;
+/**
+ * Returns props with an additional `wrapInstance` prop.
+ */
+export declare function wrapInstance<P, Q = P & {
+    wrapInstance: WrapInstance;
+}>(props: P & {
+    wrapInstance?: WrapInstance;
+}, element: WrapInstanceValue): Q;
+/**
+ * Creates a component hook that accepts props and returns props so they can be
+ * passed to a Solid component.
+ */
+export declare function createHook<T extends ValidComponent, P extends AnyObject = EmptyObject>(useProps: (props: Props<T, P>) => HTMLProps<T, P>): Hook<T, P>;
+/**
+ * Splits "option props" from the rest in a component hook. Must be called
+ * inside `createHook`.
+ *
+ * The first argument is an object that defines the props that will be extracted,
+ * with their default values. To extract a prop without a default, set it to
+ * `undefined`.
+ *
+ * The hook function must be passed as the second argument, and it will receive
+ * the rest of the props and the extracted options.
+ * @example
+ * ```jsx
+ * export const useMyComponent = createHook<TagName, MyComponentOptions>(
+ *   withOptions(
+ *     { orientation: "horizontal" },
+ *     function useMyComponent(props, options) {
+ *       // ...
+ *     },
+ *   ),
+ * );
+ * ```
+ */
+export declare function withOptions<T extends ValidComponent, P extends AnyObject, const D extends Partial<ComputedP>, ComputedP extends Props<T, P>>(defaults: D, useProps: (props: ExtractPropsWithDefaultsRestProps<ComputedP, D>, options: ExtractPropsWithDefaultsExtractedProps<ComputedP, D>) => HTMLProps<T, P>): (props: ComputedP) => HTMLProps<T, P>;

package/cjs/utils/system.d.ts

@@ -0,0 +1,45 @@
+import type { AnyObject, EmptyObject } from "@ariakit/core/utils/types";
+import { type ValidComponent } from "solid-js";
+import { type ExtractPropsWithDefaultsExtractedProps, type ExtractPropsWithDefaultsRestProps } from "./reactivity.ts";
+import type { HTMLProps, Hook, Options, Props, WrapInstance, WrapInstanceValue } from "./types.ts";
+/**
+ * Creates a Solid component instance that supports the `render` and
+ * `wrapInstance` props.
+ */
+export declare function createInstance(Component: ValidComponent, props: Props<ValidComponent, Options>): import("solid-js").JSX.Element;
+/**
+ * Returns props with an additional `wrapInstance` prop.
+ */
+export declare function wrapInstance<P, Q = P & {
+    wrapInstance: WrapInstance;
+}>(props: P & {
+    wrapInstance?: WrapInstance;
+}, element: WrapInstanceValue): Q;
+/**
+ * Creates a component hook that accepts props and returns props so they can be
+ * passed to a Solid component.
+ */
+export declare function createHook<T extends ValidComponent, P extends AnyObject = EmptyObject>(useProps: (props: Props<T, P>) => HTMLProps<T, P>): Hook<T, P>;
+/**
+ * Splits "option props" from the rest in a component hook. Must be called
+ * inside `createHook`.
+ *
+ * The first argument is an object that defines the props that will be extracted,
+ * with their default values. To extract a prop without a default, set it to
+ * `undefined`.
+ *
+ * The hook function must be passed as the second argument, and it will receive
+ * the rest of the props and the extracted options.
+ * @example
+ * ```jsx
+ * export const useMyComponent = createHook<TagName, MyComponentOptions>(
+ *   withOptions(
+ *     { orientation: "horizontal" },
+ *     function useMyComponent(props, options) {
+ *       // ...
+ *     },
+ *   ),
+ * );
+ * ```
+ */
+export declare function withOptions<T extends ValidComponent, P extends AnyObject, const D extends Partial<ComputedP>, ComputedP extends Props<T, P>>(defaults: D, useProps: (props: ExtractPropsWithDefaultsRestProps<ComputedP, D>, options: ExtractPropsWithDefaultsExtractedProps<ComputedP, D>) => HTMLProps<T, P>): (props: ComputedP) => HTMLProps<T, P>;

package/cjs/utils/types.cjs

@@ -0,0 +1 @@
+"use strict";

package/cjs/utils/types.d.cts

@@ -0,0 +1,56 @@
+import type { AnyObject, EmptyObject } from "@ariakit/core/utils/types";
+import type { Component, ComponentProps, JSX, ParentProps, ValidComponent } from "solid-js";
+/**
+ * A value that can be rendered when passed to the `render` prop or the
+ * `wrapInstance` prop.
+ */
+export type RenderValue<P extends AnyObject> = JSX.Element | Component<P>;
+/**
+ * A value passed to the `wrapInstance` prop.
+ */
+export type WrapInstanceValue = RenderValue<ParentProps>;
+/**
+ * The `wrapInstance` prop.
+ */
+export type WrapInstance = Array<WrapInstanceValue>;
+/**
+ * Custom props including the `render` prop.
+ */
+export interface Options {
+    wrapInstance?: WrapInstance;
+    /**
+     * Allows the component to be rendered as a different HTML element or Solid
+     * component. The value can be an `As` component instance or a function that
+     * takes in the original component props and gives back a Solid component
+     * instance with the props merged.
+     *
+     * Check out the [Composition](https://solid.ariakit.org/guide/composition) guide
+     * for more details.
+     */
+    render?: RenderValue<JSX.HTMLAttributes<any>>;
+}
+/**
+ * HTML props based on the element type, excluding custom props.
+ * @template T The element type.
+ * @template P Custom props.
+ * @example
+ * type ButtonHTMLProps = HTMLProps<"button", { custom?: boolean }>;
+ */
+export type HTMLProps<T extends ValidComponent, P extends AnyObject = EmptyObject> = Omit<ComponentProps<T>, keyof P> & {
+    [index: `data-${string}`]: unknown;
+};
+/**
+ * Props based on the element type, including custom props.
+ * @template T The element type.
+ * @template P Custom props.
+ */
+export type Props<T extends ValidComponent, P extends AnyObject = EmptyObject> = P & HTMLProps<T, P>;
+/**
+ * A component hook that supports the `render` prop and returns HTML props based
+ * on the element type.
+ * @template T The element type.
+ * @template P Custom props.
+ * @example
+ * type UseButton = Hook<"button", { custom?: boolean }>;
+ */
+export type Hook<T extends ValidComponent, P extends AnyObject = EmptyObject> = <ElementType extends ValidComponent = T>(props?: Props<ElementType, P>) => HTMLProps<ElementType, P>;

package/cjs/utils/types.d.ts

@@ -0,0 +1,56 @@
+import type { AnyObject, EmptyObject } from "@ariakit/core/utils/types";
+import type { Component, ComponentProps, JSX, ParentProps, ValidComponent } from "solid-js";
+/**
+ * A value that can be rendered when passed to the `render` prop or the
+ * `wrapInstance` prop.
+ */
+export type RenderValue<P extends AnyObject> = JSX.Element | Component<P>;
+/**
+ * A value passed to the `wrapInstance` prop.
+ */
+export type WrapInstanceValue = RenderValue<ParentProps>;
+/**
+ * The `wrapInstance` prop.
+ */
+export type WrapInstance = Array<WrapInstanceValue>;
+/**
+ * Custom props including the `render` prop.
+ */
+export interface Options {
+    wrapInstance?: WrapInstance;
+    /**
+     * Allows the component to be rendered as a different HTML element or Solid
+     * component. The value can be an `As` component instance or a function that
+     * takes in the original component props and gives back a Solid component
+     * instance with the props merged.
+     *
+     * Check out the [Composition](https://solid.ariakit.org/guide/composition) guide
+     * for more details.
+     */
+    render?: RenderValue<JSX.HTMLAttributes<any>>;
+}
+/**
+ * HTML props based on the element type, excluding custom props.
+ * @template T The element type.
+ * @template P Custom props.
+ * @example
+ * type ButtonHTMLProps = HTMLProps<"button", { custom?: boolean }>;
+ */
+export type HTMLProps<T extends ValidComponent, P extends AnyObject = EmptyObject> = Omit<ComponentProps<T>, keyof P> & {
+    [index: `data-${string}`]: unknown;
+};
+/**
+ * Props based on the element type, including custom props.
+ * @template T The element type.
+ * @template P Custom props.
+ */
+export type Props<T extends ValidComponent, P extends AnyObject = EmptyObject> = P & HTMLProps<T, P>;
+/**
+ * A component hook that supports the `render` prop and returns HTML props based
+ * on the element type.
+ * @template T The element type.
+ * @template P Custom props.
+ * @example
+ * type UseButton = Hook<"button", { custom?: boolean }>;
+ */
+export type Hook<T extends ValidComponent, P extends AnyObject = EmptyObject> = <ElementType extends ValidComponent = T>(props?: Props<ElementType, P>) => HTMLProps<ElementType, P>;

package/cjs/visually-hidden/visually-hidden.cjs

@@ -0,0 +1,10 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+var _JFCGWMZCcjs = require('../__chunks/JFCGWMZC.cjs');
+require('../__chunks/V3ZEI37L.cjs');
+require('../__chunks/RLO4RIGL.cjs');
+
+
+
+exports.VisuallyHidden = _JFCGWMZCcjs.VisuallyHidden; exports.useVisuallyHidden = _JFCGWMZCcjs.useVisuallyHidden;

package/cjs/visually-hidden/visually-hidden.d.cts

@@ -0,0 +1,34 @@
+import type { ValidComponent } from "solid-js";
+import type { Options, Props } from "../utils/types.ts";
+declare const TagName = "span";
+type TagName = typeof TagName;
+/**
+ * Returns props to create a `VisuallyHidden` component. When applying the props
+ * returned by this hook to a component, the component will be visually hidden,
+ * but still accessible to screen readers.
+ * @see https://solid.ariakit.org/components/visually-hidden
+ * @example
+ * ```jsx
+ * const props = useVisuallyHidden();
+ * <a href="#">
+ *   Learn more<Role {...props}> about the Solar System</Role>.
+ * </a>
+ * ```
+ */
+export declare const useVisuallyHidden: import("../utils/types.ts").Hook<"span", VisuallyHiddenOptions<"span">>;
+/**
+ * Renders an element that's visually hidden, but still accessible to screen
+ * readers.
+ * @see https://solid.ariakit.org/components/visually-hidden
+ * @example
+ * ```jsx
+ * <a href="#">
+ *   Learn more<VisuallyHidden> about the Solar System</VisuallyHidden>.
+ * </a>
+ * ```
+ */
+export declare function VisuallyHidden(props: VisuallyHiddenProps): import("solid-js").JSX.Element;
+export interface VisuallyHiddenOptions<_T extends ValidComponent = TagName> extends Options {
+}
+export type VisuallyHiddenProps = Props<TagName, VisuallyHiddenOptions>;
+export {};

package/cjs/visually-hidden/visually-hidden.d.ts

@@ -0,0 +1,34 @@
+import type { ValidComponent } from "solid-js";
+import type { Options, Props } from "../utils/types.ts";
+declare const TagName = "span";
+type TagName = typeof TagName;
+/**
+ * Returns props to create a `VisuallyHidden` component. When applying the props
+ * returned by this hook to a component, the component will be visually hidden,
+ * but still accessible to screen readers.
+ * @see https://solid.ariakit.org/components/visually-hidden
+ * @example
+ * ```jsx
+ * const props = useVisuallyHidden();
+ * <a href="#">
+ *   Learn more<Role {...props}> about the Solar System</Role>.
+ * </a>
+ * ```
+ */
+export declare const useVisuallyHidden: import("../utils/types.ts").Hook<"span", VisuallyHiddenOptions<"span">>;
+/**
+ * Renders an element that's visually hidden, but still accessible to screen
+ * readers.
+ * @see https://solid.ariakit.org/components/visually-hidden
+ * @example
+ * ```jsx
+ * <a href="#">
+ *   Learn more<VisuallyHidden> about the Solar System</VisuallyHidden>.
+ * </a>
+ * ```
+ */
+export declare function VisuallyHidden(props: VisuallyHiddenProps): import("solid-js").JSX.Element;
+export interface VisuallyHiddenOptions<_T extends ValidComponent = TagName> extends Options {
+}
+export type VisuallyHiddenProps = Props<TagName, VisuallyHiddenOptions>;
+export {};

package/esm/__chunks/I7JSIDPD.js

@@ -0,0 +1,7 @@
+// src/heading/heading-context.tsx
+import { createContext } from "solid-js";
+var HeadingContext = createContext();
+
+export {
+  HeadingContext
+};

package/esm/__chunks/ILGMKAYU.js

@@ -0,0 +1,37 @@
+import {
+  useVisuallyHidden
+} from "./SFKMELHD.js";
+import {
+  createHook,
+  createInstance
+} from "./OKOFCLOZ.js";
+import {
+  mergeProps
+} from "./QKOHDUFI.js";
+
+// src/focus-trap/focus-trap.tsx
+var TagName = "span";
+var useFocusTrap = createHook(function useFocusTrap2(props) {
+  props = mergeProps({
+    "data-focus-trap": "",
+    tabIndex: 0,
+    "aria-hidden": true,
+    style: {
+      // Prevents unintended scroll jumps.
+      position: "fixed",
+      top: 0,
+      left: 0
+    }
+  }, props);
+  props = useVisuallyHidden(props);
+  return props;
+});
+function FocusTrap(props) {
+  const htmlProps = useFocusTrap(props);
+  return createInstance(TagName, htmlProps);
+}
+
+export {
+  useFocusTrap,
+  FocusTrap
+};

package/esm/__chunks/NX66AMGW.js

@@ -0,0 +1,39 @@
+import {
+  mergeProps
+} from "./QKOHDUFI.js";
+
+// src/as/as.tsx
+import { createComponent as _$createComponent } from "solid-js/web";
+import { mergeProps as _$mergeProps } from "solid-js/web";
+import { Dynamic } from "solid-js/web";
+var cache = /* @__PURE__ */ new Map();
+var As = new Proxy(function As2(props) {
+  return (parentProps) => (
+    // TODO: replace with LazyDynamic
+    _$createComponent(Dynamic, _$mergeProps(() => mergeProps(parentProps, props), {
+      get component() {
+        return props.component;
+      }
+    }))
+  );
+}, {
+  get: (_, key) => {
+    let component = cache.get(key);
+    if (!component) {
+      component = function AsElement(props) {
+        return (parentProps) => (
+          // TODO: replace with LazyDynamic
+          _$createComponent(Dynamic, _$mergeProps(() => mergeProps(parentProps, props), {
+            component: key
+          }))
+        );
+      };
+      cache.set(key, component);
+    }
+    return component;
+  }
+});
+
+export {
+  As
+};

package/esm/__chunks/OKOFCLOZ.js

@@ -0,0 +1,61 @@
+import {
+  extractPropsWithDefaults
+} from "./QKOHDUFI.js";
+
+// src/utils/system.tsx
+import { createComponent as _$createComponent } from "solid-js/web";
+import { mergeProps as _$mergeProps } from "solid-js/web";
+import { memo as _$memo } from "solid-js/web";
+import { mergeProps, splitProps } from "solid-js";
+import { Dynamic } from "solid-js/web";
+function createInstance(Component, props) {
+  const [features, rest] = splitProps(props, ["render", "wrapInstance"]);
+  const withRender = () => (
+    // TODO: replace with LazyDynamic
+    _$createComponent(Dynamic, _$mergeProps(rest, {
+      get component() {
+        var _a;
+        return (_a = features.render) != null ? _a : Component;
+      }
+    }))
+  );
+  let tree = withRender;
+  if (features.wrapInstance) {
+    for (const element of features.wrapInstance) {
+      const children = tree;
+      tree = () => (
+        // TODO: replace with LazyDynamic
+        _$createComponent(Dynamic, {
+          component: element,
+          get children() {
+            return children();
+          }
+        })
+      );
+    }
+  }
+  return tree();
+}
+function wrapInstance(props, element) {
+  var _a;
+  const wrapInstance2 = [...(_a = props.wrapInstance) != null ? _a : [], element];
+  return mergeProps(props, {
+    wrapInstance: wrapInstance2
+  });
+}
+function createHook(useProps) {
+  return useProps;
+}
+function withOptions(defaults, useProps) {
+  return function usePropsWithOptions(props) {
+    const [options, rest] = extractPropsWithDefaults(props, defaults);
+    return useProps(rest, options);
+  };
+}
+
+export {
+  createInstance,
+  wrapInstance,
+  createHook,
+  withOptions
+};