@typed/ui 0.3.2 → 0.3.4

package/dist/esm/Anchor.js

@@ -1,73 +1,9 @@
 /**
  * @since 1.0.0
  */
-import * as Fx from "@typed/fx/Fx";
-import * as Directive from "@typed/template/Directive";
-import * as EventHandler from "@typed/template/EventHandler";
 import { html } from "@typed/template/RenderTemplate";
-import * as Effect from "effect/Effect";
-import { uncapitalize } from "effect/String";
 /**
  * @since 1.0.0
  */
-export function Anchor(props, ...children) {
-    const { data, hash, host, hostname, href, hreflang, pathname, port, protocol, ref, scrollLeft, scrollTop, search, ...rest } = props;
-    const refDirective = Directive.ref(({ value }) => Effect.gen(function* (_) {
-        yield* _(addEventListeners(props, value));
-        if (ref) {
-            yield* _(ref(value));
-        }
-    }));
-    return html `<a 
-    ref="${refDirective}"
-    .props="${rest}"
-    .data="${data}"
-    .scrollLeft="${scrollLeft}"
-    .scrollTop="${scrollTop}"
-    .hash="${hash}"
-    .host="${host}"
-    .hostname="${hostname}"
-    .href="${href}"
-    .hreflang="${hreflang}"
-    .pathname="${pathname}"
-    .port="${port}"
-    .protocol="${protocol}"
-    .search="${search}"
-  >${children}</a>`;
-}
-/**
- * @since 1.0.0
- */
-export function addEventListeners(props, ref) {
-    return Fx.forkScoped(Fx.mergeAll(getEventHandlers(props).map(([type, handler]) => addEventListener(ref, type, handler))));
-}
-function addEventListener(ref, event, handler) {
-    return Fx.mapEffect(ref.events(event, handler.options), (ev) => handler.handler(ev));
-}
-/**
- * @since 1.0.0
- */
-export function getEventHandlers(props) {
-    const eventHandlers = Object.keys(props).filter((x) => x[0] === "o" && x[1] === "n").flatMap((key) => {
-        const handler = getEventHandler(props[key]);
-        if (!handler)
-            return [];
-        const eventType = uncapitalize(key.slice(2));
-        return [[eventType, handler]];
-    });
-    return eventHandlers;
-}
-/**
- * @since 1.0.0
- */
-export function getEventHandler(handler) {
-    if (!handler)
-        return null;
-    if (Effect.isEffect(handler)) {
-        return EventHandler.make(() => handler);
-    }
-    else {
-        return handler;
-    }
-}
+export const Anchor = (props, ...children) => html `<a ...${props}>${children}</a>`;
 //# sourceMappingURL=Anchor.js.map

package/dist/esm/Anchor.js.map

@@ -1 +1 @@
-{"version":3,"file":"Anchor.js","sourceRoot":"","sources":["../../src/Anchor.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"Anchor.js","sourceRoot":"","sources":["../../src/Anchor.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,IAAI,EAAE,MAAM,gCAAgC,CAAA;AAUrD;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAA2B,CAAC,KAAK,EAAE,GAAG,QAAQ,EAAE,EAAE,CAAC,IAAI,CAAA,SAAS,KAAK,IAAI,QAAQ,MAAM,CAAA"}

package/dist/esm/Component.js

@@ -0,0 +1,5 @@
+/**
+ * @since 1.0.0
+ */
+export {};
+//# sourceMappingURL=Component.js.map

package/dist/esm/Component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Component.js","sourceRoot":"","sources":["../../src/Component.ts"],"names":[],"mappings":"AAAA;;GAEG"}

package/dist/esm/Link.js

@@ -5,11 +5,12 @@ import { makeHref } from "@typed/router";
 import * as EventHandler from "@typed/template/EventHandler";
 import { Placeholder } from "@typed/template/Placeholder";
 import * as Effect from "effect/Effect";
-import { Anchor, getEventHandler } from "./Anchor.js";
+import { Anchor } from "./Anchor.js";
+import { getEventHandler } from "./Props.js";
 /**
  * @since 1.0.0
  */
-export function Link({ onClick, ref, relative, replace, state, to, ...props }, ...children) {
+export function Link({ onClick, relative, replace, state, to, ...props }, ...children) {
     return Fx.gen(function* (_) {
         const onClickHandler = getEventHandler(onClick);
         const toRef = yield* _(Placeholder.asRef(to));
@@ -35,7 +36,7 @@ export function Link({ onClick, ref, relative, replace, state, to, ...props }, .
             }
             yield* _(navigate);
         }), onClickHandler?.options);
-        const allProps = { ...props, ref, href, state: stateRef, onClick: onClickEventHandler };
+        const allProps = { ...props, href, state: stateRef, onClick: onClickEventHandler };
         return Anchor(allProps, ...children);
     });
 }

package/dist/esm/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../src/Link.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../src/Link.ts"],"names":[],"mappings":"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"}

package/dist/esm/Props.js

@@ -0,0 +1,19 @@
+/**
+ * @since 1.0.0
+ */
+import * as EventHandler from "@typed/template/EventHandler";
+import { Effect } from "effect";
+/**
+ * @since 1.0.0
+ */
+export function getEventHandler(handler) {
+    if (!handler)
+        return null;
+    if (Effect.isEffect(handler)) {
+        return EventHandler.make(() => handler);
+    }
+    else {
+        return handler;
+    }
+}
+//# sourceMappingURL=Props.js.map

package/dist/esm/Props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Props.js","sourceRoot":"","sources":["../../src/Props.ts"],"names":[],"mappings":"AAAA;;GAEG;AAKH,OAAO,KAAK,YAAY,MAAM,8BAA8B,CAAA;AAG5D,OAAO,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAA;AAuE/B;;GAEG;AACH,MAAM,UAAU,eAAe,CAC7B,OAA8F;IAE9F,IAAI,CAAC,OAAO;QAAE,OAAO,IAAI,CAAA;IAEzB,IAAI,MAAM,CAAC,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC;QAC7B,OAAO,YAAY,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,CAAA;IACzC,CAAC;SAAM,CAAC;QACN,OAAO,OAAO,CAAA;IAChB,CAAC;AACH,CAAC"}

package/dist/esm/dom-properties.js

@@ -0,0 +1,5 @@
+/**
+ * @since 1.0.0
+ */
+export {};
+//# sourceMappingURL=dom-properties.js.map

package/dist/esm/dom-properties.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dom-properties.js","sourceRoot":"","sources":["../../src/dom-properties.ts"],"names":[],"mappings":"AAAA;;GAEG"}

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,QAAQ;AACR,4BAA4B;AAC5B,UAAU;AACV,YAAY;AACZ,SAAS;AACT,SAAS;AACT,cAAc;AACd,gBAAgB;AAChB,WAAW;AACX,UAAU;AACV,OAAO;AACP,QAAQ;AACR,SAAS;AACT,sBAAsB;AACtB,SAAS;AACT,kBAAkB;AAClB,eAAe;AACf,mBAAmB;AACnB,SAAS;AACT,iBAAiB;AACjB,0BAA0B;AAE1B;;GAEG;AACH,cAAc,aAAa,CAAA;AAC3B;;GAEG;AACH,cAAc,WAAW,CAAA;AAEzB;;GAEG;AACH,cAAc,mBAAmB,CAAA;AAEjC;;GAEG;AACH,cAAc,oBAAoB,CAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,QAAQ;AACR,4BAA4B;AAC5B,UAAU;AACV,YAAY;AACZ,SAAS;AACT,SAAS;AACT,cAAc;AACd,gBAAgB;AAChB,WAAW;AACX,UAAU;AACV,OAAO;AACP,QAAQ;AACR,SAAS;AACT,sBAAsB;AACtB,SAAS;AACT,kBAAkB;AAClB,eAAe;AACf,mBAAmB;AACnB,SAAS;AACT,iBAAiB;AACjB,0BAA0B;AAE1B;;GAEG;AACH,cAAc,aAAa,CAAA;AAE3B;;GAEG;AACH,cAAc,WAAW,CAAA;AAEzB;;GAEG;AACH,cAAc,mBAAmB,CAAA;AAEjC;;GAEG;AACH,cAAc,oBAAoB,CAAA"}

package/dist/esm/useClickAway.js.map

@@ -1 +1 @@
-{"version":3,"file":"useClickAway.js","sourceRoot":"","sources":["../../src/useClickAway.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AAE9C,OAAO,KAAK,EAAE,MAAM,cAAc,CAAA;AAElC,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAG3D,OAAO,KAAK,MAAM,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAA;AAE/D;;GAEG;AACH,MAAM,UAAU,YAAY,CAC1B,IAAU,EACV,CAA0G;IAE1G,OAAO,EAAE,CAAC,UAAU,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAA;AAC5C,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,WAAW,CACzB,IAAU,EACV,CAAiG;IAEjG,OAAO,EAAE,CAAC,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE;QAChD,MAAM,MAAM,GAAG,iBAAiB,CAAC,QAAQ,EAAE,OAAO,EAAE,UAAU,EAAE,aAAa,CAAC,CAAA;QAC9E,MAAM,QAAQ,GAAG,EAAE,CAAC,GAAG,CACrB,EAAE,CAAC,KAAK,CAAC,IAA0D,CAAC,EACpE,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,WAAW,CAAC,CAClC,CAAA;QAED,OAAO,EAAE,CAAC,SAAS,CACjB,EAAE,CAAC,OAAO,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,EAAE,QAAQ,EAAE,YAAY,CAAC,CAAC,EACvD,CAAC,CACF,CAAA;IACH,CAAC,CAAC,CAAC,CAAA;AACL,CAAC;AAED,MAAM,YAAY,GAAG,CACnB,KAAgE,EAChE,IAA4B,EAC8C,EAAE;IAC5E,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAA;IAE3B,IACE,MAAM,KAAK,IAAI;QACf,IAAI,CAAC,IAAI,CACP,CAAC,CAAC,EAAE,EAAE,CACJ,CAAC,KAAK,MAAM;YACZ,CAAC,CAAC,QAAQ,CAAC,MAAiB,CAAC,CAChC,EACD,CAAC;QACD,OAAO,MAAM,CAAC,IAAI,EAAE,CAAA;IACtB,CAAC;SAAM,CAAC;QACN,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;IAC3B,CAAC;AACH,CAAC,CAAA"}
+{"version":3,"file":"useClickAway.js","sourceRoot":"","sources":["../../src/useClickAway.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAA;AAE9C,OAAO,KAAK,EAAE,MAAM,cAAc,CAAA;AAElC,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAA;AAG3D,OAAO,KAAK,MAAM,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAA;AAE/D;;GAEG;AACH,MAAM,UAAU,YAAY,CAC1B,IAAU,EACV,CAA0G;IAE1G,OAAO,EAAE,CAAC,UAAU,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAA;AAC5C,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,WAAW,CACzB,IAAU,EACV,CAAiG;IAEjG,OAAO,EAAE,CAAC,YAAY,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE;QAChD,MAAM,MAAM,GAAG,iBAAiB,CAAC,QAAQ,EAAE,OAAO,EAAE,UAAU,EAAE,aAAa,CAAC,CAAA;QAC9E,MAAM,QAAQ,GAAG,EAAE,CAAC,GAAG,CACrB,EAAE,CAAC,KAAK,CAAC,IAA0D,CAAC,EACpE,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,OAAO,CAAC,WAAW,CAAC,CAClC,CAAA;QAED,OAAO,EAAE,CAAC,SAAS,CACjB,EAAE,CAAC,OAAO,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,EAAE,QAAQ,EAAE,YAAY,CAAC,CAAC,EACvD,CAAC,CACF,CAAA;IACH,CAAC,CAAC,CAAC,CAAA;AACL,CAAC;AAED,MAAM,YAAY,GAAG,CACnB,KAAgE,EAChE,IAA4B,EAC8C,EAAE;IAC5E,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAA;IAE3B,IACE,MAAM,KAAK,IAAI;QACf,IAAI,CAAC,IAAI,CACP,CAAC,CAAC,EAAE,EAAE,CACJ,CAAC,KAAK,MAAM;YACZ,CAAC,CAAC,QAAQ,CAAC,MAAc,CAAC,CAC7B,EACD,CAAC;QACD,OAAO,MAAM,CAAC,IAAI,EAAE,CAAA;IACtB,CAAC;SAAM,CAAC;QACN,OAAO,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;IAC3B,CAAC;AACH,CAAC,CAAA"}

package/dom-properties/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../dist/cjs/dom-properties.js",
+  "module": "../dist/esm/dom-properties.js",
+  "types": "../dist/dts/dom-properties.d.ts",
+  "sideEffects": []
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@typed/ui",
-  "version": "0.3.2",
+  "version": "0.3.4",
   "description": "",
   "license": "MIT",
   "repository": {
@@ -10,18 +10,18 @@
   "sideEffects": [],
   "author": "Typed contributors",
   "dependencies": {
-    "@effect/platform": "^0.41.0",
-    "@effect/schema": "0.59.1",
+    "@effect/platform": "0.42.2",
+    "@effect/schema": "0.60.2",
     "csstype": "^3.1.3",
-    "effect": "^2.0.3",
-    "@typed/context": "0.21.0",
-    "@typed/dom": "9.0.0",
-    "@typed/environment": "0.3.0",
-    "@typed/fx": "1.20.0",
-    "@typed/navigation": "0.8.0",
-    "@typed/route": "2.0.0",
-    "@typed/router": "0.21.0",
-    "@typed/template": "0.3.2"
+    "effect": "^2.1.0",
+    "@typed/dom": "9.0.1",
+    "@typed/fx": "1.20.2",
+    "@typed/environment": "0.3.1",
+    "@typed/context": "0.21.1",
+    "@typed/navigation": "0.8.2",
+    "@typed/router": "0.21.2",
+    "@typed/template": "0.3.4",
+    "@typed/route": "2.0.2"
   },
   "main": "./dist/cjs/index.js",
   "module": "./dist/esm/index.js",
@@ -38,11 +38,26 @@
       "import": "./dist/esm/Anchor.js",
       "default": "./dist/cjs/Anchor.js"
     },
+    "./Component": {
+      "types": "./dist/dts/Component.d.ts",
+      "import": "./dist/esm/Component.js",
+      "default": "./dist/cjs/Component.js"
+    },
     "./Link": {
       "types": "./dist/dts/Link.d.ts",
       "import": "./dist/esm/Link.js",
       "default": "./dist/cjs/Link.js"
     },
+    "./Props": {
+      "types": "./dist/dts/Props.d.ts",
+      "import": "./dist/esm/Props.js",
+      "default": "./dist/cjs/Props.js"
+    },
+    "./dom-properties": {
+      "types": "./dist/dts/dom-properties.d.ts",
+      "import": "./dist/esm/dom-properties.js",
+      "default": "./dist/cjs/dom-properties.js"
+    },
     "./useClickAway": {
       "types": "./dist/dts/useClickAway.d.ts",
       "import": "./dist/esm/useClickAway.js",
@@ -59,9 +74,18 @@
       "Anchor": [
         "./dist/dts/Anchor.d.ts"
       ],
+      "Component": [
+        "./dist/dts/Component.d.ts"
+      ],
       "Link": [
         "./dist/dts/Link.d.ts"
       ],
+      "Props": [
+        "./dist/dts/Props.d.ts"
+      ],
+      "dom-properties": [
+        "./dist/dts/dom-properties.d.ts"
+      ],
       "useClickAway": [
         "./dist/dts/useClickAway.d.ts"
       ],

package/src/Anchor.ts

@@ -2,201 +2,17 @@
  * @since 1.0.0
  */
 
-import type { EventWithCurrentTarget } from "@typed/dom/EventTarget"
-import * as Fx from "@typed/fx/Fx"
-import * as Directive from "@typed/template/Directive"
-import type { DefaultEventMap, ElementSource } from "@typed/template/ElementSource"
-import * as EventHandler from "@typed/template/EventHandler"
-import type { Placeholder } from "@typed/template/Placeholder"
-import type { Renderable } from "@typed/template/Renderable"
-import type { RenderEvent } from "@typed/template/RenderEvent"
-import { html, type RenderTemplate } from "@typed/template/RenderTemplate"
-import type { Rendered } from "@typed/wire"
-import type { ReadonlyRecord, Scope } from "effect"
-import * as Effect from "effect/Effect"
-import { uncapitalize } from "effect/String"
-import type { HTMLAnchorElementProperties } from "./internal/dom-properties.js"
+import { html } from "@typed/template/RenderTemplate"
+import type { Component } from "./Component.js"
+import type { HTMLAnchorElementProperties } from "./dom-properties.js"
+import type { TypedProps } from "./Props.js"
 
 /**
  * @since 1.0.0
  */
-export type AnchorProps =
-  & {
-    readonly [K in keyof HTMLAnchorElementProperties]?:
-      | HTMLAnchorElementProperties[K]
-      | Placeholder.Any<HTMLAnchorElementProperties[K]>
-      | undefined
-  }
-  & {
-    readonly ref?: ((ref: ElementSource<HTMLAnchorElement>) => Effect.Effect<any, any, any>) | undefined
-    readonly data?: Placeholder.Any<ReadonlyRecord.ReadonlyRecord<any>> | undefined
-  }
-  & EventHandlerProps<HTMLAnchorElement>
+export type AnchorProps = TypedProps<HTMLAnchorElementProperties, HTMLAnchorElement>
 
 /**
  * @since 1.0.0
  */
-export type EventHandlerProps<El extends HTMLElement | SVGElement, EventMap extends {} = DefaultEventMap<El>> = {
-  readonly [K in keyof EventMap as K extends string ? `on${Capitalize<K>}` : never]?:
-    | EventHandler.EventHandler<
-      any,
-      any,
-      EventWithCurrentTarget<El, Extract<EventMap[K], Event>>
-    >
-    | Effect.Effect<any, any, unknown>
-    | null
-    | undefined
-}
-type ReturnOf<T> = T extends (...args: any) => infer R ? R : never
-
-/**
- * @since 1.0.0
- */
-export function Anchor<
-  const Props extends AnchorProps,
-  Children extends ReadonlyArray<Renderable<any, any>> = readonly []
->(
-  props: Props,
-  ...children: Children
-): Fx.Fx<
-  RenderTemplate | Scope.Scope | Placeholder.Context<Props[keyof Props] | ReturnOf<Props["ref"]> | Children[number]>,
-  Placeholder.Error<Props[keyof Props] | ReturnOf<Props["ref"]> | Children[number]>,
-  RenderEvent
-> {
-  const {
-    data,
-    hash,
-    host,
-    hostname,
-    href,
-    hreflang,
-    pathname,
-    port,
-    protocol,
-    ref,
-    scrollLeft,
-    scrollTop,
-    search,
-    ...rest
-  } = props
-
-  const refDirective = Directive.ref(({ value }) =>
-    Effect.gen(function*(_) {
-      yield* _(addEventListeners(props, value))
-
-      if (ref) {
-        yield* _(ref(value as any))
-      }
-    })
-  )
-  return html`<a 
-    ref="${refDirective}"
-    .props="${rest}"
-    .data="${data}"
-    .scrollLeft="${scrollLeft}"
-    .scrollTop="${scrollTop}"
-    .hash="${hash}"
-    .host="${host}"
-    .hostname="${hostname}"
-    .href="${href}"
-    .hreflang="${hreflang}"
-    .pathname="${pathname}"
-    .port="${port}"
-    .protocol="${protocol}"
-    .search="${search}"
-  >${children}</a>` as any
-}
-
-/**
- * @since 1.0.0
- */
-export function addEventListeners<Props extends EventHandlerProps<any>, T extends Rendered>(
-  props: Props,
-  ref: ElementSource<T>
-): Effect.Effect<Scope.Scope | GetEventHandlersContext<Props>, never, void> {
-  return Fx.forkScoped(
-    Fx.mergeAll(
-      getEventHandlers(props).map(([type, handler]: any) => addEventListener(ref, type, handler))
-    )
-  ) as any
-}
-
-function addEventListener<T extends Rendered, R, E, Ev extends Event>(
-  ref: ElementSource<T>,
-  event: string,
-  handler: EventHandler.EventHandler<R, E, Ev>
-) {
-  return Fx.mapEffect(ref.events(event as any, handler.options), (ev) => handler.handler(ev as any))
-}
-
-type ValuesOf<T> = [T[keyof T]] extends [infer R] ? R : never
-
-type ToEventType<T> = T extends `on${infer S}` ? Uncapitalize<S> : never
-
-/**
- * @since 1.0.0
- */
-export type GetEventHandlersContext<T extends EventHandlerProps<any>> = ValuesOf<
-  {
-    readonly [K in keyof T as K extends `on${string}` ? K : never]: EventHandler.Context<GetEventHandler<T[K]>>
-  }
->
-
-/**
- * @since 1.0.0
- */
-export type GetEventHandlers<T extends EventHandlerProps<any>> = [
-  ReadonlyArray<
-    ValuesOf<
-      {
-        readonly [K in keyof T as K extends `on${string}` ? K : never]: readonly [ToEventType<K>, GetEventHandler<T[K]>]
-      }
-    >
-  >
-] extends [ReadonlyArray<infer R>] ? ReadonlyArray<R> : never
-
-type GetEventHandler<
-  T
-> = T extends EventHandler.EventHandler<infer R, infer E, infer Ev> ? EventHandler.EventHandler<R, E, Ev>
-  : T extends Effect.Effect<infer R, infer E, infer _> ? EventHandler.EventHandler<R, E, Event>
-  : never
-
-/**
- * @since 1.0.0
- */
-export function getEventHandlers<Props extends EventHandlerProps<any>>(props: Props) {
-  const eventHandlers: Array<readonly [string, EventHandler.EventHandler<any, any, any>]> = Object.keys(props).filter((
-    x
-  ) => x[0] === "o" && x[1] === "n").flatMap((key) => {
-    const handler = getEventHandler(
-      props[key as keyof typeof props] as
-        | EventHandler.EventHandler<any, any, any>
-        | Effect.Effect<any, any, unknown>
-        | null
-        | undefined
-    )
-
-    if (!handler) return []
-
-    const eventType = uncapitalize(key.slice(2))
-
-    return [[eventType, handler] as const]
-  })
-
-  return eventHandlers as any as GetEventHandlers<Props>
-}
-
-/**
- * @since 1.0.0
- */
-export function getEventHandler<R, E, Ev extends Event = Event>(
-  handler: EventHandler.EventHandler<R, E, Ev> | Effect.Effect<R, E, unknown> | null | undefined
-): EventHandler.EventHandler<R, E, Ev> | null {
-  if (!handler) return null
-
-  if (Effect.isEffect(handler)) {
-    return EventHandler.make(() => handler)
-  } else {
-    return handler
-  }
-}
+export const Anchor: Component<AnchorProps> = (props, ...children) => html`<a ...${props}>${children}</a>`

package/src/Component.ts

@@ -0,0 +1,24 @@
+/**
+ * @since 1.0.0
+ */
+
+import type { Fx } from "@typed/fx/Fx"
+import type { Placeholder } from "@typed/template/Placeholder"
+import type { Renderable } from "@typed/template/Renderable"
+import type { RenderEvent } from "@typed/template/RenderEvent"
+import type { RenderTemplate } from "@typed/template/RenderTemplate"
+import type { Scope } from "effect"
+
+/**
+ * @since 1.0.0
+ */
+export interface Component<Props, R = never, E = never> {
+  <P extends Props, Children extends ReadonlyArray<Renderable<any, any>>>(
+    props: P,
+    ...children: Children
+  ): Fx<
+    R | Scope.Scope | RenderTemplate | Placeholder.Context<P[keyof P] | Children[number]>,
+    E | Placeholder.Error<P[keyof P] | Children[number]>,
+    RenderEvent
+  >
+}

package/src/Link.ts

@@ -14,7 +14,8 @@ import type { RenderEvent } from "@typed/template/RenderEvent"
 import type { RenderTemplate } from "@typed/template/RenderTemplate"
 import * as Effect from "effect/Effect"
 import type * as Scope from "effect/Scope"
-import { Anchor, type AnchorProps, getEventHandler } from "./Anchor.js"
+import { Anchor, type AnchorProps } from "./Anchor.js"
+import { getEventHandler } from "./Props.js"
 
 /**
  * @since 1.0.0
@@ -31,53 +32,28 @@ export type LinkProps = Omit<AnchorProps, keyof URL> & {
  * @since 1.0.0
  */
 export function Link<Props extends LinkProps, Children extends ReadonlyArray<Renderable<any, any>> = readonly []>(
-  { onClick, ref, relative, replace, state, to, ...props }: Props,
+  { onClick, relative, replace, state, to, ...props }: Props,
   ...children: Children
 ): Fx.Fx<
   | Navigation.Navigation
   | CurrentRoute
   | RenderTemplate
   | Scope.Scope
-  | Placeholder.Context<Props[keyof Props] | Children[number]>
-  | Fx.Context<Props[keyof Props] | Children[number]>,
-  Placeholder.Error<Props[keyof Props] | Children[number]> | Fx.Error<Props[keyof Props] | Children[number]>,
+  | Placeholder.Context<Props[keyof Props] | Children[number]>,
+  Placeholder.Error<Props[keyof Props] | Children[number]>,
   RenderEvent
 > {
   return Fx.gen(function*(_) {
     const onClickHandler = getEventHandler(onClick)
-    const toRef = yield* _(
-      Placeholder.asRef<Placeholder.Context<Props["to"]>, Placeholder.Error<Props["to"]>, string>(to)
-    )
-    const relativeRef = yield* _(
-      Placeholder.asRef<Placeholder.Context<Props["relative"]>, Placeholder.Error<Props["relative"]>, boolean>(
-        relative ?? true
-      )
-    )
-    const replaceRef = yield* _(
-      Placeholder.asRef<Placeholder.Context<Props["replace"]>, Placeholder.Error<Props["replace"]>, boolean>(
-        replace ?? false
-      )
-    )
-    const stateRef = yield* _(
-      Placeholder.asRef<Placeholder.Context<Props["state"]>, Placeholder.Error<Props["state"]>, unknown>(
-        state as Placeholder.Any<unknown>
-      )
-    )
-    const reloadDocument = yield* _(
-      Placeholder.asRef<
-        Placeholder.Context<Props["reloadDocument"]>,
-        Placeholder.Error<Props["reloadDocument"]>,
-        boolean
-      >(
-        props.reloadDocument ?? false
-      )
-    )
-
+    const toRef = yield* _(Placeholder.asRef(to))
+    const relativeRef = yield* _(Placeholder.asRef(relative ?? true))
+    const replaceRef = yield* _(Placeholder.asRef(replace ?? false))
+    const stateRef = yield* _(Placeholder.asRef(state as Placeholder.Any<unknown>))
+    const reloadDocument = yield* _(Placeholder.asRef(props.reloadDocument ?? false))
     const href = RefSubject.mapEffect(
       RefSubject.tuple([relativeRef, toRef]),
       ([rel, to]) => rel ? makeHref(to) : Effect.succeed(to)
     )
-
     const navigate = Effect.gen(function*(_) {
       const current = yield* _(Effect.all({ replace: replaceRef, state: stateRef, reloadDocument }))
       const url = yield* _(href)
@@ -103,11 +79,8 @@ export function Link<Props extends LinkProps, Children extends ReadonlyArray<Ren
       onClickHandler?.options
     )
 
-    const allProps = { ...props, ref, href, state: stateRef, onClick: onClickEventHandler }
+    const allProps = { ...props, href, state: stateRef, onClick: onClickEventHandler }
 
-    return Anchor(
-      allProps as any as AnchorProps,
-      ...children
-    )
+    return Anchor(allProps as any as Props, ...children)
   })
 }