@ilokesto/utilinent 1.0.11 → 1.0.13

package/dist/components/For.js

@@ -1,6 +1,7 @@
 import { Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { createElement, forwardRef } from "react";
 import { htmlTags } from "../constants/htmlTags";
+import { PluginManager } from "../core/PluginManager";
 function BaseFor({ each, children, fallback = null, before, after, }) {
     const content = each && each.length > 0 ? each.map(children) : fallback;
     return (_jsxs(_Fragment, { children: [before, content, after] }));
@@ -11,8 +12,31 @@ forwardRef(({ each, children, fallback = null, before, after, ...props }, ref) =
     const content = each && each.length > 0 ? each.map(children) : fallback;
     return createElement(tag, { ...props, ref }, before, content, after);
 });
+// HTML 태그들을 등록
 const tagEntries = htmlTags.reduce((acc, tag) => {
     acc[tag] = renderForTag(tag);
     return acc;
 }, {});
-export const For = Object.assign(BaseFor, tagEntries);
+// Proxy를 사용하여 동적으로 플러그인 조회
+export const For = new Proxy(Object.assign(BaseFor, tagEntries), {
+    get(target, prop) {
+        // 기존 속성이 있으면 반환
+        if (prop in target) {
+            return target[prop];
+        }
+        // 플러그인에서 동적으로 조회
+        const propName = String(prop);
+        // 'for' 카테고리에서 먼저 찾기
+        if (PluginManager.has('for', propName)) {
+            const component = PluginManager.get('for', propName);
+            return renderForTag(component);
+        }
+        // 'base' 카테고리에서 찾기
+        if (PluginManager.has('base', propName)) {
+            const component = PluginManager.get('base', propName);
+            return renderForTag(component);
+        }
+        // 찾지 못하면 undefined 반환
+        return undefined;
+    }
+});

package/dist/components/Repeat.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { createElement, forwardRef } from "react";
 import { htmlTags } from "../constants/htmlTags";
+import { PluginManager } from "../core/PluginManager";
 import { For } from "./For";
 function BaseRepeat({ times, children, fallback = null }) {
     if (!times || times <= 0 || !Number.isInteger(times)) {
@@ -16,8 +17,30 @@ forwardRef(({ times, children, fallback = null, ...props }, ref) => {
         : fallback ?? null;
     return createElement(tag, { ...props, ref }, content);
 });
+// HTML 태그들을 등록
 const tagEntries = htmlTags.reduce((acc, tag) => {
     acc[tag] = renderForTag(tag);
     return acc;
 }, {});
-export const Repeat = Object.assign(BaseRepeat, tagEntries);
+export const Repeat = new Proxy(Object.assign(BaseRepeat, tagEntries), {
+    get(target, prop) {
+        // 기존 속성이 있으면 반환
+        if (prop in target) {
+            return target[prop];
+        }
+        // 플러그인에서 동적으로 조회
+        const propName = String(prop);
+        // 'repeat' 카테고리에서 먼저 찾기
+        if (PluginManager.has('repeat', propName)) {
+            const component = PluginManager.get('repeat', propName);
+            return renderForTag(component);
+        }
+        // 'base' 카테고리에서 찾기
+        if (PluginManager.has('base', propName)) {
+            const component = PluginManager.get('base', propName);
+            return renderForTag(component);
+        }
+        // 찾지 못하면 undefined 반환
+        return undefined;
+    }
+});

package/dist/components/Show.js

@@ -1,5 +1,6 @@
 import { createElement, forwardRef } from "react";
 import { htmlTags } from "../constants/htmlTags";
+import { PluginManager } from "../core/PluginManager";
 const BaseShow = ({ when, children, fallback = null }) => {
     const shouldRender = Array.isArray(when) ? when.every(Boolean) : !!when;
     return shouldRender
@@ -19,8 +20,30 @@ forwardRef(function Render({ when, children, fallback = null, ...props }, ref) {
         : fallback;
     return createElement(tag, { ...props, ref }, content);
 });
+// HTML 태그들을 등록
 const tagEntries = htmlTags.reduce((acc, tag) => {
     acc[tag] = renderForTag(tag);
     return acc;
 }, {});
-export const Show = Object.assign(BaseShow, tagEntries);
+export const Show = new Proxy(Object.assign(BaseShow, tagEntries), {
+    get(target, prop) {
+        // 기존 속성이 있으면 반환
+        if (prop in target) {
+            return target[prop];
+        }
+        // 플러그인에서 동적으로 조회
+        const propName = String(prop);
+        // 'show' 카테고리에서 먼저 찾기
+        if (PluginManager.has('show', propName)) {
+            const component = PluginManager.get('show', propName);
+            return renderForTag(component);
+        }
+        // 'base' 카테고리에서 찾기
+        if (PluginManager.has('base', propName)) {
+            const component = PluginManager.get('base', propName);
+            return renderForTag(component);
+        }
+        // 찾지 못하면 undefined 반환
+        return undefined;
+    }
+});

package/dist/constants/htmlTags.d.ts

@@ -1 +1,2 @@
-export declare const htmlTags: string[];
+export declare const htmlTags: readonly ["a", "abbr", "address", "article", "aside", "b", "bdi", "bdo", "blockquote", "button", "canvas", "cite", "code", "data", "datalist", "dd", "del", "details", "dfn", "dialog", "div", "dl", "dt", "em", "fieldset", "figcaption", "figure", "footer", "form", "h1", "h2", "h3", "h4", "h5", "h6", "header", "hr", "i", "img", "input", "ins", "kbd", "label", "legend", "li", "main", "map", "mark", "menu", "meter", "nav", "ol", "option", "output", "p", "picture", "pre", "progress", "q", "rp", "rt", "ruby", "s", "samp", "section", "select", "small", "span", "strong", "sub", "summary", "sup", "table", "tbody", "td", "textarea", "tfoot", "th", "thead", "time", "tr", "u", "ul", "var", "video"];
+export type HtmlTag = (typeof htmlTags)[number];

package/dist/core/PluginManager.d.ts

@@ -0,0 +1,88 @@
+/**
+ * 플러그인 등록을 위한 타입
+ * Register 인터페이스의 각 카테고리에 대해 부분적으로 등록 가능
+ */
+type PluginRegistration = {
+    [K in "show" | "for" | "repeat" | "base"]?: Record<string, any>;
+};
+/**
+ * 플러그인 컴포넌트를 등록하고 관리하는 싱글턴 클래스
+ *
+ * @example
+ * ```typescript
+ * import { UtilinentPluginManager } from '@ilokesto/utilinent';
+ * import Link from 'next/link';
+ * import { motion } from 'framer-motion';
+ *
+ * // 컴포넌트 등록
+ * UtilinentPluginManager.register({
+ *   show: {
+ *     Link: Link,
+ *   },
+ *   base: {
+ *     motionButton: motion.button,
+ *   }
+ * });
+ *
+ * // 타입 등록 (별도 파일에서)
+ * declare module '@ilokesto/utilinent' {
+ *   interface Register {
+ *     show: {
+ *       Link: typeof Link;
+ *     };
+ *     base: {
+ *       motionButton: typeof motion.button;
+ *     };
+ *   }
+ * }
+ * ```
+ */
+export declare class PluginManager {
+    private static instance;
+    private plugins;
+    private constructor();
+    /**
+     * PluginManager 인스턴스를 가져옵니다
+     */
+    private static getInstance;
+    /**
+     * 플러그인 컴포넌트들을 객체 형태로 등록합니다
+     *
+     * @param plugins - 카테고리별 컴포넌트 객체
+     *
+     * @example
+     * ```typescript
+     * UtilinentPluginManager.register({
+     *   show: {
+     *     Link: Link,
+     *     Button: CustomButton,
+     *   },
+     *   base: {
+     *     motionDiv: motion.div,
+     *   }
+     * });
+     * ```
+     */
+    static register(plugins: PluginRegistration): void;
+    /**
+     * 단일 플러그인 컴포넌트를 등록합니다 (내부용)
+     */
+    private registerOne;
+    /**
+     * 등록된 플러그인 컴포넌트를 가져옵니다 (내부용)
+     */
+    static get<K extends "show" | "for" | "repeat" | "base">(category: K, name: string): any;
+    /**
+     * 특정 카테고리의 모든 플러그인을 가져옵니다 (내부용)
+     */
+    static getAll<K extends "show" | "for" | "repeat" | "base">(category: K): Map<string, any>;
+    /**
+     * 플러그인이 등록되어 있는지 확인합니다
+     */
+    static has<K extends "show" | "for" | "repeat" | "base">(category: K, name: string): boolean;
+    /**
+     * 플러그인을 제거합니다
+     */
+    static unregister<K extends "show" | "for" | "repeat" | "base">(category: K, name: string): boolean;
+}
+export {};

package/dist/core/PluginManager.js

@@ -0,0 +1,116 @@
+/**
+ * 플러그인 컴포넌트를 등록하고 관리하는 싱글턴 클래스
+ *
+ * @example
+ * ```typescript
+ * import { UtilinentPluginManager } from '@ilokesto/utilinent';
+ * import Link from 'next/link';
+ * import { motion } from 'framer-motion';
+ *
+ * // 컴포넌트 등록
+ * UtilinentPluginManager.register({
+ *   show: {
+ *     Link: Link,
+ *   },
+ *   base: {
+ *     motionButton: motion.button,
+ *   }
+ * });
+ *
+ * // 타입 등록 (별도 파일에서)
+ * declare module '@ilokesto/utilinent' {
+ *   interface Register {
+ *     show: {
+ *       Link: typeof Link;
+ *     };
+ *     base: {
+ *       motionButton: typeof motion.button;
+ *     };
+ *   }
+ * }
+ * ```
+ */
+export class PluginManager {
+    static instance;
+    plugins = {
+        show: new Map(),
+        for: new Map(),
+        repeat: new Map(),
+        base: new Map(),
+    };
+    constructor() {
+        // 싱글턴 패턴: private constructor
+    }
+    /**
+     * PluginManager 인스턴스를 가져옵니다
+     */
+    static getInstance() {
+        if (!PluginManager.instance) {
+            PluginManager.instance = new PluginManager();
+        }
+        return PluginManager.instance;
+    }
+    /**
+     * 플러그인 컴포넌트들을 객체 형태로 등록합니다
+     *
+     * @param plugins - 카테고리별 컴포넌트 객체
+     *
+     * @example
+     * ```typescript
+     * UtilinentPluginManager.register({
+     *   show: {
+     *     Link: Link,
+     *     Button: CustomButton,
+     *   },
+     *   base: {
+     *     motionDiv: motion.div,
+     *   }
+     * });
+     * ```
+     */
+    static register(plugins) {
+        const instance = PluginManager.getInstance();
+        Object.keys(plugins).forEach((category) => {
+            const components = plugins[category];
+            if (components) {
+                Object.entries(components).forEach(([name, component]) => {
+                    instance.registerOne(category, name, component);
+                });
+            }
+        });
+    }
+    /**
+     * 단일 플러그인 컴포넌트를 등록합니다 (내부용)
+     */
+    registerOne(category, name, component) {
+        this.plugins[category].set(name, component);
+    }
+    /**
+     * 등록된 플러그인 컴포넌트를 가져옵니다 (내부용)
+     */
+    static get(category, name) {
+        const instance = PluginManager.getInstance();
+        return instance.plugins[category].get(name);
+    }
+    /**
+     * 특정 카테고리의 모든 플러그인을 가져옵니다 (내부용)
+     */
+    static getAll(category) {
+        const instance = PluginManager.getInstance();
+        return instance.plugins[category];
+    }
+    /**
+     * 플러그인이 등록되어 있는지 확인합니다
+     */
+    static has(category, name) {
+        const instance = PluginManager.getInstance();
+        return instance.plugins[category].has(name);
+    }
+    /**
+     * 플러그인을 제거합니다
+     */
+    static unregister(category, name) {
+        const instance = PluginManager.getInstance();
+        return instance.plugins[category].delete(name);
+    }
+}

package/dist/index.d.ts

@@ -6,3 +6,5 @@ export * from './components/Show';
 export * from './components/Slacker';
 export * from './components/Slot';
 export * from './hooks/useIntersectionObserver';
+export { PluginManager } from './core/PluginManager';
+export { UtilinentRegister } from './types/register';

package/dist/index.js

@@ -6,3 +6,4 @@ export * from './components/Show';
 export * from './components/Slacker';
 export * from './components/Slot';
 export * from './hooks/useIntersectionObserver';
+export { PluginManager } from './core/PluginManager';

package/dist/types/for.d.ts

@@ -1,100 +1,25 @@
 import { Fallback } from ".";
+import { HtmlTag } from "../constants/htmlTags";
+import { UtilinentRegisterBase, UtilinentRegisterFor } from "./register";
 export interface ForProps<T extends Array<unknown>> extends Fallback {
     each: T | null | undefined;
     children: (item: T[number], index: number) => React.ReactNode;
     before?: React.ReactNode;
     after?: React.ReactNode;
 }
-type ForTagHelper<K extends keyof JSX.IntrinsicElements> = {
+type ForTagHelper<K extends HtmlTag> = {
     <const T extends Array<unknown>>(props: ForProps<T> & Omit<React.ComponentPropsWithRef<K>, 'children'>): React.ReactNode;
 };
-export interface ForType {
+type ForRegisterHelper<C> = C extends React.ComponentType<infer P> ? {
+    <const T extends Array<unknown>>(props: Omit<P, "children"> & ForProps<T>): React.ReactNode;
+} : C;
+export type ForType = {
     <const T extends Array<unknown>>(props: ForProps<T>): React.ReactNode;
-    a: ForTagHelper<"a">;
-    abbr: ForTagHelper<"abbr">;
-    address: ForTagHelper<"address">;
-    article: ForTagHelper<"article">;
-    aside: ForTagHelper<"aside">;
-    b: ForTagHelper<"b">;
-    bdi: ForTagHelper<"bdi">;
-    bdo: ForTagHelper<"bdo">;
-    blockquote: ForTagHelper<"blockquote">;
-    button: ForTagHelper<"button">;
-    canvas: ForTagHelper<"canvas">;
-    cite: ForTagHelper<"cite">;
-    code: ForTagHelper<"code">;
-    data: ForTagHelper<"data">;
-    datalist: ForTagHelper<"datalist">;
-    dd: ForTagHelper<"dd">;
-    del: ForTagHelper<"del">;
-    details: ForTagHelper<"details">;
-    dfn: ForTagHelper<"dfn">;
-    dialog: ForTagHelper<"dialog">;
-    div: ForTagHelper<"div">;
-    dl: ForTagHelper<"dl">;
-    dt: ForTagHelper<"dt">;
-    em: ForTagHelper<"em">;
-    fieldset: ForTagHelper<"fieldset">;
-    figcaption: ForTagHelper<"figcaption">;
-    figure: ForTagHelper<"figure">;
-    footer: ForTagHelper<"footer">;
-    form: ForTagHelper<"form">;
-    h1: ForTagHelper<"h1">;
-    h2: ForTagHelper<"h2">;
-    h3: ForTagHelper<"h3">;
-    h4: ForTagHelper<"h4">;
-    h5: ForTagHelper<"h5">;
-    h6: ForTagHelper<"h6">;
-    header: ForTagHelper<"header">;
-    hr: ForTagHelper<"hr">;
-    i: ForTagHelper<"i">;
-    img: ForTagHelper<"img">;
-    input: ForTagHelper<"input">;
-    ins: ForTagHelper<"ins">;
-    kbd: ForTagHelper<"kbd">;
-    label: ForTagHelper<"label">;
-    legend: ForTagHelper<"legend">;
-    li: ForTagHelper<"li">;
-    main: ForTagHelper<"main">;
-    map: ForTagHelper<"map">;
-    mark: ForTagHelper<"mark">;
-    menu: ForTagHelper<"menu">;
-    meter: ForTagHelper<"meter">;
-    nav: ForTagHelper<"nav">;
-    ol: ForTagHelper<"ol">;
-    option: ForTagHelper<"option">;
-    output: ForTagHelper<"output">;
-    p: ForTagHelper<"p">;
-    picture: ForTagHelper<"picture">;
-    pre: ForTagHelper<"pre">;
-    progress: ForTagHelper<"progress">;
-    q: ForTagHelper<"q">;
-    rp: ForTagHelper<"rp">;
-    rt: ForTagHelper<"rt">;
-    ruby: ForTagHelper<"ruby">;
-    s: ForTagHelper<"s">;
-    samp: ForTagHelper<"samp">;
-    section: ForTagHelper<"section">;
-    select: ForTagHelper<"select">;
-    small: ForTagHelper<"small">;
-    span: ForTagHelper<"span">;
-    strong: ForTagHelper<"strong">;
-    sub: ForTagHelper<"sub">;
-    summary: ForTagHelper<"summary">;
-    sup: ForTagHelper<"sup">;
-    table: ForTagHelper<"table">;
-    tbody: ForTagHelper<"tbody">;
-    td: ForTagHelper<"td">;
-    textarea: ForTagHelper<"textarea">;
-    tfoot: ForTagHelper<"tfoot">;
-    th: ForTagHelper<"th">;
-    thead: ForTagHelper<"thead">;
-    time: ForTagHelper<"time">;
-    tr: ForTagHelper<"tr">;
-    u: ForTagHelper<"u">;
-    ul: ForTagHelper<"ul">;
-    var: ForTagHelper<"var">;
-    video: ForTagHelper<"video">;
-    [x: string]: ForTagHelper<any>;
-}
+} & {
+    [K in HtmlTag]: ForTagHelper<K>;
+} & {
+    [K in keyof UtilinentRegisterFor]: ForRegisterHelper<UtilinentRegisterFor[K]>;
+} & {
+    [K in keyof UtilinentRegisterBase]: ForRegisterHelper<UtilinentRegisterBase[K]>;
+};
 export {};

package/dist/types/index.d.ts

@@ -1,4 +1,5 @@
 import type { ReactElement } from "react";
+export type { UtilinentRegister } from "./register";
 export interface Fallback {
     fallback?: React.ReactNode;
 }
@@ -48,4 +49,3 @@ export type SlackerProps<T = any> = {
     maxRetries?: number;
     retryDelay?: number;
 };
-export {};

package/dist/types/register.d.ts

@@ -0,0 +1,14 @@
+export interface UtilinentRegister {
+}
+export type UtilinentRegisterShow = UtilinentRegister extends {
+    show: infer Show;
+} ? Show : never;
+export type UtilinentRegisterBase = UtilinentRegister extends {
+    base: infer Base;
+} ? Base : never;
+export type UtilinentRegisterFor = UtilinentRegister extends {
+    for: infer For;
+} ? For : never;
+export type UtilinentRegisterRepeat = UtilinentRegister extends {
+    repeat: infer Repeat;
+} ? Repeat : never;

package/dist/types/register.js

@@ -0,0 +1 @@
+export {};

package/dist/types/repeat.d.ts

@@ -1,99 +1,24 @@
 import { ComponentPropsWithRef } from "react";
 import { Fallback } from ".";
+import { HtmlTag } from "../constants/htmlTags";
+import { UtilinentRegisterBase, UtilinentRegisterRepeat } from "./register";
 export interface RepeatProps extends Fallback {
     times: number;
     children: (index: number) => React.ReactNode;
 }
-type RepeatTagHelper<K extends keyof JSX.IntrinsicElements> = {
+type RepeatTagHelper<K extends HtmlTag> = {
     (props: RepeatProps & Omit<ComponentPropsWithRef<K>, "children">): React.ReactNode;
 };
-export interface RepeatType {
+type RepeatRegisterHelper<C> = C extends React.ComponentType<infer P> ? {
+    (props: Omit<P, "children"> & RepeatProps): React.ReactNode;
+} : C;
+export type RepeatType = {
     (props: RepeatProps): React.ReactNode;
-    a: RepeatTagHelper<"a">;
-    abbr: RepeatTagHelper<"abbr">;
-    address: RepeatTagHelper<"address">;
-    article: RepeatTagHelper<"article">;
-    aside: RepeatTagHelper<"aside">;
-    b: RepeatTagHelper<"b">;
-    bdi: RepeatTagHelper<"bdi">;
-    bdo: RepeatTagHelper<"bdo">;
-    blockquote: RepeatTagHelper<"blockquote">;
-    button: RepeatTagHelper<"button">;
-    canvas: RepeatTagHelper<"canvas">;
-    cite: RepeatTagHelper<"cite">;
-    code: RepeatTagHelper<"code">;
-    data: RepeatTagHelper<"data">;
-    datalist: RepeatTagHelper<"datalist">;
-    dd: RepeatTagHelper<"dd">;
-    del: RepeatTagHelper<"del">;
-    details: RepeatTagHelper<"details">;
-    dfn: RepeatTagHelper<"dfn">;
-    dialog: RepeatTagHelper<"dialog">;
-    div: RepeatTagHelper<"div">;
-    dl: RepeatTagHelper<"dl">;
-    dt: RepeatTagHelper<"dt">;
-    em: RepeatTagHelper<"em">;
-    fieldset: RepeatTagHelper<"fieldset">;
-    figcaption: RepeatTagHelper<"figcaption">;
-    figure: RepeatTagHelper<"figure">;
-    footer: RepeatTagHelper<"footer">;
-    form: RepeatTagHelper<"form">;
-    h1: RepeatTagHelper<"h1">;
-    h2: RepeatTagHelper<"h2">;
-    h3: RepeatTagHelper<"h3">;
-    h4: RepeatTagHelper<"h4">;
-    h5: RepeatTagHelper<"h5">;
-    h6: RepeatTagHelper<"h6">;
-    header: RepeatTagHelper<"header">;
-    hr: RepeatTagHelper<"hr">;
-    i: RepeatTagHelper<"i">;
-    img: RepeatTagHelper<"img">;
-    input: RepeatTagHelper<"input">;
-    ins: RepeatTagHelper<"ins">;
-    kbd: RepeatTagHelper<"kbd">;
-    label: RepeatTagHelper<"label">;
-    legend: RepeatTagHelper<"legend">;
-    li: RepeatTagHelper<"li">;
-    main: RepeatTagHelper<"main">;
-    map: RepeatTagHelper<"map">;
-    mark: RepeatTagHelper<"mark">;
-    menu: RepeatTagHelper<"menu">;
-    meter: RepeatTagHelper<"meter">;
-    nav: RepeatTagHelper<"nav">;
-    ol: RepeatTagHelper<"ol">;
-    option: RepeatTagHelper<"option">;
-    output: RepeatTagHelper<"output">;
-    p: RepeatTagHelper<"p">;
-    picture: RepeatTagHelper<"picture">;
-    pre: RepeatTagHelper<"pre">;
-    progress: RepeatTagHelper<"progress">;
-    q: RepeatTagHelper<"q">;
-    rp: RepeatTagHelper<"rp">;
-    rt: RepeatTagHelper<"rt">;
-    ruby: RepeatTagHelper<"ruby">;
-    s: RepeatTagHelper<"s">;
-    samp: RepeatTagHelper<"samp">;
-    section: RepeatTagHelper<"section">;
-    select: RepeatTagHelper<"select">;
-    small: RepeatTagHelper<"small">;
-    span: RepeatTagHelper<"span">;
-    strong: RepeatTagHelper<"strong">;
-    sub: RepeatTagHelper<"sub">;
-    summary: RepeatTagHelper<"summary">;
-    sup: RepeatTagHelper<"sup">;
-    table: RepeatTagHelper<"table">;
-    tbody: RepeatTagHelper<"tbody">;
-    td: RepeatTagHelper<"td">;
-    textarea: RepeatTagHelper<"textarea">;
-    tfoot: RepeatTagHelper<"tfoot">;
-    th: RepeatTagHelper<"th">;
-    thead: RepeatTagHelper<"thead">;
-    time: RepeatTagHelper<"time">;
-    tr: RepeatTagHelper<"tr">;
-    u: RepeatTagHelper<"u">;
-    ul: RepeatTagHelper<"ul">;
-    var: RepeatTagHelper<"var">;
-    video: RepeatTagHelper<"video">;
-    [x: string]: RepeatTagHelper<any>;
-}
+} & {
+    [K in HtmlTag]: RepeatTagHelper<K>;
+} & {
+    [K in keyof UtilinentRegisterRepeat]: RepeatRegisterHelper<UtilinentRegisterRepeat[K]>;
+} & {
+    [K in keyof UtilinentRegisterBase]: RepeatRegisterHelper<UtilinentRegisterBase[K]>;
+};
 export {};

package/dist/types/show.d.ts

@@ -1,5 +1,7 @@
 import { ComponentPropsWithRef } from "react";
+import { HtmlTag } from "../constants/htmlTags";
 import { Fallback, NonNullableElements } from "./";
+import { UtilinentRegisterBase, UtilinentRegisterShow } from "./register";
 export interface ShowPropsArray<T extends unknown[]> extends Fallback {
     when: T;
     children: React.ReactNode | ((item: NonNullableElements<T>) => React.ReactNode);
@@ -8,98 +10,22 @@ export interface ShowProps<T = unknown> extends Fallback {
     when: T;
     children: React.ReactNode | ((item: NonNullable<T>) => React.ReactNode);
 }
-type ShowTagHelper<K extends keyof JSX.IntrinsicElements> = {
+type ShowTagHelper<K extends HtmlTag> = {
     <const T extends unknown[]>(props: Omit<ComponentPropsWithRef<K>, "children"> & ShowPropsArray<T>): React.ReactNode;
     <const T extends unknown>(props: Omit<ComponentPropsWithRef<K>, "children"> & ShowProps<T>): React.ReactNode;
 };
-export interface ShowType {
+type ShowRegisterHelper<C> = C extends React.ComponentType<infer P> ? {
+    <const T extends unknown[]>(props: Omit<P, "children"> & ShowPropsArray<T>): React.ReactNode;
+    <const T extends unknown>(props: Omit<P, "children"> & ShowProps<T>): React.ReactNode;
+} : C;
+export type ShowType = {
     <const T extends unknown[]>(props: ShowPropsArray<T>): React.ReactNode;
     <const T extends unknown>(props: ShowProps<T>): React.ReactNode;
-    a: ShowTagHelper<"a">;
-    abbr: ShowTagHelper<"abbr">;
-    address: ShowTagHelper<"address">;
-    article: ShowTagHelper<"article">;
-    aside: ShowTagHelper<"aside">;
-    b: ShowTagHelper<"b">;
-    bdi: ShowTagHelper<"bdi">;
-    bdo: ShowTagHelper<"bdo">;
-    blockquote: ShowTagHelper<"blockquote">;
-    button: ShowTagHelper<"button">;
-    canvas: ShowTagHelper<"canvas">;
-    cite: ShowTagHelper<"cite">;
-    code: ShowTagHelper<"code">;
-    data: ShowTagHelper<"data">;
-    datalist: ShowTagHelper<"datalist">;
-    dd: ShowTagHelper<"dd">;
-    del: ShowTagHelper<"del">;
-    details: ShowTagHelper<"details">;
-    dfn: ShowTagHelper<"dfn">;
-    dialog: ShowTagHelper<"dialog">;
-    div: ShowTagHelper<"div">;
-    dl: ShowTagHelper<"dl">;
-    dt: ShowTagHelper<"dt">;
-    em: ShowTagHelper<"em">;
-    fieldset: ShowTagHelper<"fieldset">;
-    figcaption: ShowTagHelper<"figcaption">;
-    figure: ShowTagHelper<"figure">;
-    footer: ShowTagHelper<"footer">;
-    form: ShowTagHelper<"form">;
-    h1: ShowTagHelper<"h1">;
-    h2: ShowTagHelper<"h2">;
-    h3: ShowTagHelper<"h3">;
-    h4: ShowTagHelper<"h4">;
-    h5: ShowTagHelper<"h5">;
-    h6: ShowTagHelper<"h6">;
-    header: ShowTagHelper<"header">;
-    hr: ShowTagHelper<"hr">;
-    i: ShowTagHelper<"i">;
-    img: ShowTagHelper<"img">;
-    input: ShowTagHelper<"input">;
-    ins: ShowTagHelper<"ins">;
-    kbd: ShowTagHelper<"kbd">;
-    label: ShowTagHelper<"label">;
-    legend: ShowTagHelper<"legend">;
-    li: ShowTagHelper<"li">;
-    main: ShowTagHelper<"main">;
-    map: ShowTagHelper<"map">;
-    mark: ShowTagHelper<"mark">;
-    menu: ShowTagHelper<"menu">;
-    meter: ShowTagHelper<"meter">;
-    nav: ShowTagHelper<"nav">;
-    ol: ShowTagHelper<"ol">;
-    option: ShowTagHelper<"option">;
-    output: ShowTagHelper<"output">;
-    p: ShowTagHelper<"p">;
-    picture: ShowTagHelper<"picture">;
-    pre: ShowTagHelper<"pre">;
-    progress: ShowTagHelper<"progress">;
-    q: ShowTagHelper<"q">;
-    rp: ShowTagHelper<"rp">;
-    rt: ShowTagHelper<"rt">;
-    ruby: ShowTagHelper<"ruby">;
-    s: ShowTagHelper<"s">;
-    samp: ShowTagHelper<"samp">;
-    section: ShowTagHelper<"section">;
-    select: ShowTagHelper<"select">;
-    small: ShowTagHelper<"small">;
-    span: ShowTagHelper<"span">;
-    strong: ShowTagHelper<"strong">;
-    sub: ShowTagHelper<"sub">;
-    summary: ShowTagHelper<"summary">;
-    sup: ShowTagHelper<"sup">;
-    table: ShowTagHelper<"table">;
-    tbody: ShowTagHelper<"tbody">;
-    td: ShowTagHelper<"td">;
-    textarea: ShowTagHelper<"textarea">;
-    tfoot: ShowTagHelper<"tfoot">;
-    th: ShowTagHelper<"th">;
-    thead: ShowTagHelper<"thead">;
-    time: ShowTagHelper<"time">;
-    tr: ShowTagHelper<"tr">;
-    u: ShowTagHelper<"u">;
-    ul: ShowTagHelper<"ul">;
-    var: ShowTagHelper<"var">;
-    video: ShowTagHelper<"video">;
-    [x: string]: ShowTagHelper<any>;
-}
+} & {
+    [K in HtmlTag]: ShowTagHelper<K>;
+} & {
+    [K in keyof UtilinentRegisterShow]: ShowRegisterHelper<UtilinentRegisterShow[K]>;
+} & {
+    [K in keyof UtilinentRegisterBase]: ShowRegisterHelper<UtilinentRegisterBase[K]>;
+};
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ilokesto/utilinent",
-  "version": "1.0.11",
+  "version": "1.0.13",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/ilokesto/utilinent.git"