Big News: Socket raises $60M Series C at a $1B valuation to secure software supply chains for AI-driven development.Announcement
Sign In

@namelessdev/flow

Package Overview
Dependencies
Maintainers
1
Versions
4
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@namelessdev/flow - npm Package Compare versions

Comparing version
0.0.2
to
0.0.3
+3
-3
build/Deferred.d.mts

@@ -1,7 +0,7 @@

import React from 'react';
import React, { ReactNode } from 'react';
type DeferredProps = {
timeout: number;
children: JSX.Element;
placeholder?: JSX.Element;
children: ReactNode;
placeholder?: ReactNode;
};

@@ -8,0 +8,0 @@ declare const Deferred: React.FC<DeferredProps>;

@@ -1,7 +0,7 @@

import React from 'react';
import React, { ReactNode } from 'react';
type DeferredProps = {
timeout: number;
children: JSX.Element;
placeholder?: JSX.Element;
children: ReactNode;
placeholder?: ReactNode;
};

@@ -8,0 +8,0 @@ declare const Deferred: React.FC<DeferredProps>;

@@ -1,1 +0,1 @@

{"version":3,"sources":["../src/Deferred.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,UAAU,WAAW,mBAAmB;AAQjD,MAAM,WAAoC,MAAM;AAAA,EACrD,CAAC,EAAE,SAAS,UAAU,YAAY,MAAM;AACtC,UAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAE5C,UAAM,mBAAmB,YAAY,MAAM;AACzC,iBAAW,IAAI;AAAA,IACjB,GAAG,CAAC,CAAC;AAEL,cAAU,MAAM;AACd,YAAM,QAAQ,WAAW,kBAAkB,OAAO;AAClD,aAAO,MAAM,aAAa,KAAK;AAAA,IACjC,GAAG,CAAC,SAAS,gBAAgB,CAAC;AAE9B,WAAO,UAAU,WAAW,eAAe;AAAA,EAC7C;AACF;AAEA,IAAO,mBAAQ","sourcesContent":["\"use client\";\nimport React, { useState, useEffect, useCallback } from \"react\";\n\ntype DeferredProps = {\n timeout: number;\n children: JSX.Element;\n placeholder?: JSX.Element;\n};\n\nexport const Deferred: React.FC<DeferredProps> = React.memo(\n ({ timeout, children, placeholder }) => {\n const [isShown, setIsShown] = useState(false);\n\n const handleSetIsShown = useCallback(() => {\n setIsShown(true);\n }, []);\n\n useEffect(() => {\n const timer = setTimeout(handleSetIsShown, timeout);\n return () => clearTimeout(timer);\n }, [timeout, handleSetIsShown]);\n\n return isShown ? children : placeholder || null;\n },\n);\n\nexport default Deferred;\n"]}
{"version":3,"sources":["../src/Deferred.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,UAAU,WAAW,mBAA8B;AAQ5D,MAAM,WAAoC,MAAM;AAAA,EACrD,CAAC,EAAE,SAAS,UAAU,YAAY,MAAM;AACtC,UAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAE5C,UAAM,mBAAmB,YAAY,MAAM;AACzC,iBAAW,IAAI;AAAA,IACjB,GAAG,CAAC,CAAC;AAEL,cAAU,MAAM;AACd,YAAM,QAAQ,WAAW,kBAAkB,OAAO;AAClD,aAAO,MAAM,aAAa,KAAK;AAAA,IACjC,GAAG,CAAC,SAAS,gBAAgB,CAAC;AAE9B,WAAO,UAAU,WAAW,eAAe;AAAA,EAC7C;AACF;AAEA,IAAO,mBAAQ","sourcesContent":["\"use client\";\nimport React, { useState, useEffect, useCallback, ReactNode } from \"react\";\n\ntype DeferredProps = {\n timeout: number;\n children: ReactNode;\n placeholder?: ReactNode;\n};\n\nexport const Deferred: React.FC<DeferredProps> = React.memo(\n ({ timeout, children, placeholder }) => {\n const [isShown, setIsShown] = useState(false);\n\n const handleSetIsShown = useCallback(() => {\n setIsShown(true);\n }, []);\n\n useEffect(() => {\n const timer = setTimeout(handleSetIsShown, timeout);\n return () => clearTimeout(timer);\n }, [timeout, handleSetIsShown]);\n\n return isShown ? children : placeholder || null;\n },\n);\n\nexport default Deferred;\n"]}

@@ -1,1 +0,1 @@

{"version":3,"sources":["../../src/Deferred.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,UAAU,WAAW,mBAAmB;AAQjD,MAAM,WAAoC,MAAM;AAAA,EACrD,CAAC,EAAE,SAAS,UAAU,YAAY,MAAM;AACtC,UAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAE5C,UAAM,mBAAmB,YAAY,MAAM;AACzC,iBAAW,IAAI;AAAA,IACjB,GAAG,CAAC,CAAC;AAEL,cAAU,MAAM;AACd,YAAM,QAAQ,WAAW,kBAAkB,OAAO;AAClD,aAAO,MAAM,aAAa,KAAK;AAAA,IACjC,GAAG,CAAC,SAAS,gBAAgB,CAAC;AAE9B,WAAO,UAAU,WAAW,eAAe;AAAA,EAC7C;AACF;AAEA,IAAO,mBAAQ","sourcesContent":["\"use client\";\nimport React, { useState, useEffect, useCallback } from \"react\";\n\ntype DeferredProps = {\n timeout: number;\n children: JSX.Element;\n placeholder?: JSX.Element;\n};\n\nexport const Deferred: React.FC<DeferredProps> = React.memo(\n ({ timeout, children, placeholder }) => {\n const [isShown, setIsShown] = useState(false);\n\n const handleSetIsShown = useCallback(() => {\n setIsShown(true);\n }, []);\n\n useEffect(() => {\n const timer = setTimeout(handleSetIsShown, timeout);\n return () => clearTimeout(timer);\n }, [timeout, handleSetIsShown]);\n\n return isShown ? children : placeholder || null;\n },\n);\n\nexport default Deferred;\n"]}
{"version":3,"sources":["../../src/Deferred.tsx"],"names":[],"mappings":";AACA,OAAO,SAAS,UAAU,WAAW,mBAA8B;AAQ5D,MAAM,WAAoC,MAAM;AAAA,EACrD,CAAC,EAAE,SAAS,UAAU,YAAY,MAAM;AACtC,UAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAE5C,UAAM,mBAAmB,YAAY,MAAM;AACzC,iBAAW,IAAI;AAAA,IACjB,GAAG,CAAC,CAAC;AAEL,cAAU,MAAM;AACd,YAAM,QAAQ,WAAW,kBAAkB,OAAO;AAClD,aAAO,MAAM,aAAa,KAAK;AAAA,IACjC,GAAG,CAAC,SAAS,gBAAgB,CAAC;AAE9B,WAAO,UAAU,WAAW,eAAe;AAAA,EAC7C;AACF;AAEA,IAAO,mBAAQ","sourcesContent":["\"use client\";\nimport React, { useState, useEffect, useCallback, ReactNode } from \"react\";\n\ntype DeferredProps = {\n timeout: number;\n children: ReactNode;\n placeholder?: ReactNode;\n};\n\nexport const Deferred: React.FC<DeferredProps> = React.memo(\n ({ timeout, children, placeholder }) => {\n const [isShown, setIsShown] = useState(false);\n\n const handleSetIsShown = useCallback(() => {\n setIsShown(true);\n }, []);\n\n useEffect(() => {\n const timer = setTimeout(handleSetIsShown, timeout);\n return () => clearTimeout(timer);\n }, [timeout, handleSetIsShown]);\n\n return isShown ? children : placeholder || null;\n },\n);\n\nexport default Deferred;\n"]}

@@ -1,1 +0,1 @@

{"version":3,"sources":["../../src/If.tsx"],"names":["True","False"],"mappings":"AAAA,OAAO,WAAiC;AACxC,SAAS,eAAe;AACxB,SAAS,SAAe,YAAY;AAO7B,MAAM,KAAiB,CAAC,EAAE,MAAM,SAAS,MAAM;AACpD,QAAM,EAAE,MAAAA,OAAM,OAAAC,OAAM,IAAI,QAAQ,UAAU,QAAQ,OAAO;AAGzD,SAAO,QAAQ,KAAK,MAAM,oCAACD,OAAA,IAAK,GAAI,oCAACC,QAAA,IAAM,CAAE;AAC/C;AAEO,MAAM,OAAO,KAAK,MAAM;AACxB,MAAM,QAAQ,KAAK,OAAO","sourcesContent":["import React, { FC, ReactElement } from \"react\";\nimport { Logical } from \"@namelessdev/helper\";\nimport { retrive, Slot, slot } from \"@namelessdev/slots\";\n\ntype IFComonent = FC<{\n when: boolean;\n children: ReactElement | ReactElement[];\n}>\n\nexport const If: IFComonent = ({ when, children }) => {\n const { True, False } = retrive(children, \"true\", \"false\");\n // console.log(children, <True />);\n \n return Logical.when(when, <True />, <False />);\n};\n\nexport const True = slot(\"true\");\nexport const False = slot(\"false\")\n"]}
{"version":3,"sources":["../../src/If.tsx"],"names":["True","False"],"mappings":"AAAA,OAAO,WAAiC;AACxC,SAAS,eAAe;AACxB,SAAS,SAAe,YAAY;AAO7B,MAAM,KAAkB,CAAC,EAAE,MAAM,SAAS,MAAM;AACrD,QAAM,EAAE,MAAAA,OAAM,OAAAC,OAAM,IAAI,QAAQ,UAAU,QAAQ,OAAO;AAEzD,SAAO,QAAQ,KAAK,MAAM,oCAACD,OAAA,IAAK,GAAI,oCAACC,QAAA,IAAM,CAAE;AAC/C;AAGO,MAAM,OAAqB,KAAK,MAAM;AAEtC,MAAM,QAAsB,KAAK,OAAO","sourcesContent":["import React, { FC, ReactElement } from \"react\";\nimport { Logical } from \"@namelessdev/helper\";\nimport { retrive, Slot, slot } from \"@namelessdev/slots\";\n\ntype IfProps = {\n when: boolean;\n children: ReactElement | ReactElement[];\n};\n\nexport const If: FC<IfProps> = ({ when, children }) => {\n const { True, False } = retrive(children, \"true\", \"false\");\n\n return Logical.when(when, <True />, <False />);\n};\n\n// @ts-ignore\nexport const True: Slot<\"true\"> = slot(\"true\");\n// @ts-ignore\nexport const False: Slot<\"true\"> = slot(\"false\");\n"]}

@@ -1,1 +0,1 @@

export{Show}from"./Show";export{False,If,True}from"./If";export{Switch}from"./Switch";export{Match}from"./Match";export{For}from"./For";export{Repeat}from"./Repeat";export{Dynamic}from"./Dynamic";export{overriding}from"./overriding";//# sourceMappingURL=index.js.map
export{Show}from"./Show";export{False,If,True}from"./If";export{Match,Switch}from"./Switch";export{For}from"./For";export{Repeat}from"./Repeat";export{Dynamic}from"./Dynamic";//# sourceMappingURL=index.js.map

@@ -1,1 +0,1 @@

{"version":3,"sources":["../../src/index.tsx"],"names":[],"mappings":"AAAA,SAAS,YAAY;AACrB,SAAS,IAAI,MAAM,aAAa;AAChC,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,WAAW;AACpB,SAAS,cAAc;AAEvB,SAAS,eAAe;AACxB,SAAS,kBAAkB","sourcesContent":["export { Show } from \"./Show\";\nexport { If, True, False } from \"./If\";\nexport { Switch } from \"./Switch\";\nexport { Match } from \"./Match\";\nexport { For } from \"./For\";\nexport { Repeat } from \"./Repeat\";\n// export { Deferred } from \"./Deferred\";\nexport { Dynamic } from \"./Dynamic\";\nexport { overriding } from \"./overriding\";\n"]}
{"version":3,"sources":["../../src/index.tsx"],"names":[],"mappings":"AAAA,SAAS,YAAY;AACrB,SAAS,IAAI,MAAM,aAAa;AAChC,SAAS,QAAQ,aAAa;AAE9B,SAAS,WAAW;AACpB,SAAS,cAAc;AAEvB,SAAS,eAAe","sourcesContent":["export { Show } from \"./Show\";\nexport { If, True, False } from \"./If\";\nexport { Switch, Match } from \"./Switch\";\n// export { Match } from \"./Match\";\nexport { For } from \"./For\";\nexport { Repeat } from \"./Repeat\";\n// export { Deferred } from \"./Deferred\";\nexport { Dynamic } from \"./Dynamic\";\n"]}

@@ -1,1 +0,1 @@

import t,{memo as e}from"react";const n=e((({count:e,children:n,empty:r})=>{const o=r=>{if(r>=e)return null;const c="function"==typeof n?n(r):n;return t.createElement(t.Fragment,{key:r},c,o(r+1))};return t.createElement(t.Fragment,null,0===e?"function"==typeof r?r():r:o(0))}));export{n as Repeat};//# sourceMappingURL=Repeat.js.map
import r,{memo as t}from"react";import{For as e}from"./For";const m=t((({count:t,children:m,empty:o})=>r.createElement(e,{items:Array.from({length:t}).map(((r,t)=>t)),empty:o},m)));export{m as Repeat};//# sourceMappingURL=Repeat.js.map

@@ -1,1 +0,1 @@

{"version":3,"sources":["../../src/Repeat.tsx"],"names":[],"mappings":"AAAA,OAAO,SAAkC,YAAY;AA2B9C,MAAM,SAAgC;AAAA,EAC3C,CAAC,EAAE,OAAO,UAAU,MAAM,MAAM;AAC9B,UAAM,iBAAiB,CAAC,UAA6B;AACnD,UAAI,SAAS;AAAO,eAAO;AAC3B,YAAM,UACJ,OAAO,aAAa,aAAa,SAAS,KAAK,IAAI;AACrD,aACE,oCAAC,MAAM,UAAN,EAAe,KAAK,SAClB,SACA,eAAe,QAAQ,CAAC,CAC3B;AAAA,IAEJ;AAEA,WACE,0DACG,UAAU,IACP,OAAO,UAAU,aACf,MAAM,IACN,QACF,eAAe,CAAC,CACtB;AAAA,EAEJ;AACF","sourcesContent":["import React, { ReactNode, ReactElement, memo } from \"react\";\n\ntype RepeatProps = {\n count: number;\n children: ReactNode | ((index: number) => ReactNode);\n empty?: ReactNode | (() => ReactNode);\n};\n\n/**\n * Компонент Repeat для повторения дочерних элементов.\n *\n * @param {RepeatProps} props - Параметры компонента.\n * @param {number} props.count - Количество повторений.\n * @param {ReactNode | ((index: number) => ReactNode)} props.children - Дочерние элементы или функция для их рендера.\n * @param {ReactNode | (() => ReactNode)} [props.empty] - Элемент, отображаемый при отсутствии дочерних элементов.\n *\n * @returns {React.ReactElement} React-компонент.\n *\n * @example\n * <Repeat count={5}>\n * {(index) => <p>Элемент {index}</p>}\n * </Repeat>\n *\n * @example\n * <Repeat count={0} empty={<p>Нет элементов</p>}/>\n *\n */\nexport const Repeat: React.FC<RepeatProps> = memo(\n ({ count, children, empty }) => {\n const renderChildren = (index: number): ReactNode => {\n if (index >= count) return null;\n const element =\n typeof children === \"function\" ? children(index) : children;\n return (\n <React.Fragment key={index}>\n {element}\n {renderChildren(index + 1)}\n </React.Fragment>\n );\n };\n\n return (\n <>\n {count === 0\n ? typeof empty === \"function\"\n ? empty()\n : empty\n : renderChildren(0)}\n </>\n );\n },\n);\n"]}
{"version":3,"sources":["../../src/Repeat.tsx"],"names":[],"mappings":"AAAA,OAAO,SAAkC,YAA4B;AACrE,SAAS,WAAW;AAQb,MAAM,SAAgC;AAAA,EAC3C,CAAC,EAAE,OAAO,UAAU,MAAM,MACxB,oCAAC,OAAI,OAAO,MAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,EAAE,IAAI,CAAC,GAAG,MAAM,CAAC,GAAG,SACzD,QACH;AAEJ","sourcesContent":["import React, { ReactNode, ReactElement, memo, isValidElement } from \"react\";\nimport { For } from \"./For\";\n\ntype RepeatProps = {\n count: number;\n children: (item: number, index: number) => ReactNode;\n empty?: ReactNode | (() => ReactNode);\n};\n\nexport const Repeat: React.FC<RepeatProps> = memo(\n ({ count, children, empty }) => (\n <For items={Array.from({ length: count }).map((_, i) => i)} empty={empty}>\n {children}\n </For>\n ),\n);\n"]}

@@ -1,1 +0,1 @@

{"version":3,"sources":["../../src/Show.tsx"],"names":[],"mappings":"AAAA,SAAS,eAAe;AAgBjB,MAAM,OAAsB,CAAC;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AACF,MAAM;AAEJ,SAAO,QAAQ,KAAK,MAAM,UAAU,YAAY,IAAI;AAwBtD","sourcesContent":["import { Logical } from \"@namelessdev/helper\";\nimport React, {\n FC,\n Fragment,\n ReactElement,\n cloneElement,\n createElement,\n isValidElement,\n} from \"react\";\n\ntype ShowProps = {\n when: boolean;\n fallback?: React.ReactNode;\n children: React.ReactNode;\n};\n\nexport const Show: FC<ShowProps> = ({\n when,\n fallback,\n children,\n}) => {\n // return when ? children : fallback || null;\n return Logical.when(when, children, fallback || null)\n // const Comp = when ? children : fallback || null;\n // if (!slot) return Comp;\n //\n // const cloneComp = (component: ReactElement) =>\n // cloneElement(\n // component,\n // Object.assign({}, component.props, { slot, ...props }),\n // component.props.children,\n // );\n //\n // if (Array.isArray(Comp))\n // return createElement(\n // Fragment,\n // {},\n // Comp.map((elem) => {\n // if (!isValidElement(elem)) return elem;\n // return cloneComp(elem);\n // }),\n // );\n // else {\n // if (!isValidElement(Comp)) return <slot name={slot}> {Comp} </slot>;\n // return cloneComp(Comp);\n // }\n};\n"]}
{"version":3,"sources":["../../src/Show.tsx"],"names":[],"mappings":"AAAA,SAAS,eAAe;AASjB,MAAM,OAAsB,CAAC,EAAE,MAAM,UAAU,SAAS,MAAM;AACnE,SAAO,QAAQ,KAAK,MAAM,UAAU,YAAY,IAAI;AACtD","sourcesContent":["import { Logical } from \"@namelessdev/helper\";\nimport { FC, ReactNode } from \"react\";\n\ntype ShowProps = {\n when: boolean;\n fallback?: ReactNode;\n children: ReactNode;\n};\n\nexport const Show: FC<ShowProps> = ({ when, fallback, children }) => {\n return Logical.when(when, children, fallback || null);\n};\n"]}

@@ -1,1 +0,1 @@

import e from"react";import{Match as r}from"./Match";import{Logical as t}from"@namelessdev/helper";const n=({children:n,fallback:l})=>{const o=e.Children.toArray(n).find((n=>t.and(e.isValidElement(n),n.type===r,n.props.when)));return e.createElement(e.Fragment,null,o||l)};export{n as Switch};//# sourceMappingURL=Switch.js.map
import e from"react";import{wrap as t,retrive as r}from"@namelessdev/slots";const l=({children:t,fallback:l})=>{const{Match:n}=r(t,{name:"match",filter:t=>e.isValidElement(t)&&t.props.when});return e.createElement(n,null,l)},n=t("match",(({children:e})=>e));export{n as Match,l as Switch};//# sourceMappingURL=Switch.js.map

@@ -1,1 +0,1 @@

{"version":3,"sources":["../../src/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,WAA6B;AACpC,SAAS,aAAa;AACtB,SAAS,eAAe;AAsBjB,MAAM,SAAgC,CAAC,EAAE,UAAU,SAAS,MAAM;AACvE,QAAM,QAAQ,MAAM,SAAS,QAAQ,QAAQ,EAAE;AAAA,IAC7C,CAAC,UACC,QAAQ;AAAA,MACN,MAAM,eAAe,KAAK;AAAA,MACzB,MAAuB,SAAS;AAAA,MAChC,MAAuB,MAAM;AAAA,IAChC;AAAA,EACJ;AAEA,SAAO,0DAAG,SAAS,QAAS;AAC9B","sourcesContent":["import React, { ReactElement } from \"react\";\nimport { Match } from \"./Match\";\nimport { Logical } from \"@namelessdev/helper\";\n\ninterface SwitchProps {\n children: ReactElement | ReactElement[];\n fallback: ReactElement;\n}\n/**\n * Компонент `Switch` работает аналогично оператору switch в JavaScript.\n * Он принимает произвольное количество дочерних компонентов `Match` и возвращает первый `Match`, чье свойство `when` равно `true`.\n * Если такого `Match` нет, возвращается компонент, указанный в свойстве `fallback`.\n *\n * @param {ReactElement | ReactElement[]} children - Дочерние элементы, которые могут включать один или несколько компонентов `Match`.\n * @param {ReactElement} fallback - Элемент, который будет отображен, если ни один из дочерних компонентов `Match` не соответствует условию.\n * @returns {ReactElement} Возвращает первый подходящий `Match` или `fallback` элемент.\n *\n * @example\n * <Switch fallback={<DefaultComponent />}>\n * <Match when={condition1}><Component1 /></Match>\n * <Match when={condition2}><Component2 /></Match>\n * ...\n * </Switch>\n */\nexport const Switch: React.FC<SwitchProps> = ({ children, fallback }) => {\n const match = React.Children.toArray(children).find(\n (child: React.ReactNode) =>\n Logical.and(\n React.isValidElement(child),\n (child as ReactElement).type === Match,\n (child as ReactElement).props.when,\n ),\n ) as ReactElement | undefined;\n\n return <>{match || fallback}</>;\n};\n"]}
{"version":3,"sources":["../../src/Switch.tsx"],"names":["Match"],"mappings":"AAAA,OAAO,WAA4C;AACnD,SAAS,SAAS,YAAY;AAOvB,MAAM,SAAgC,CAAC,EAAE,UAAU,SAAS,MAAM;AACvE,QAAM,EAAE,OAAAA,OAAM,IAAI,QAAQ,UAAU;AAAA,IAClC,MAAM;AAAA,IACN,QAAQ,CAAC,UACP,MAAM,eAAe,KAAK,KAAM,MAAuB,MAAM;AAAA,EACjE,CAAC;AACD,SAAO,oCAACA,QAAA,MAAO,QAAS;AAC1B;AAOO,MAAM,QAAwB,KAAK,SAAS,CAAC,EAAE,SAAS,MAAM,QAAQ","sourcesContent":["import React, { FC, ReactElement, ReactNode } from \"react\";\nimport { retrive, wrap } from \"@namelessdev/slots\";\n\ninterface SwitchProps {\n children: ReactElement | ReactElement[];\n fallback: ReactElement;\n}\n\nexport const Switch: React.FC<SwitchProps> = ({ children, fallback }) => {\n const { Match } = retrive(children, {\n name: \"match\",\n filter: (child) =>\n React.isValidElement(child) && (child as ReactElement).props.when,\n });\n return <Match>{fallback}</Match>;\n};\n\ninterface MatchProps {\n when: boolean;\n children: ReactNode;\n}\n\nexport const Match: FC<MatchProps> = wrap(\"match\", ({ children }) => children);\n"]}

@@ -1,19 +0,12 @@

import React, { FC, ReactElement } from 'react';
import { FC, ReactElement } from 'react';
import { Slot } from '@namelessdev/slots';
type IFComonent = FC<{
type IfProps = {
when: boolean;
children: ReactElement | ReactElement[];
}>;
declare const If: IFComonent;
declare const True: React.FC<{
children: React.ReactNode;
}> & {
slot: "true";
};
declare const False: React.FC<{
children: React.ReactNode;
}> & {
slot: "false";
};
declare const If: FC<IfProps>;
declare const True: Slot<"true">;
declare const False: Slot<"true">;
export { False, If, True };

@@ -1,19 +0,12 @@

import React, { FC, ReactElement } from 'react';
import { FC, ReactElement } from 'react';
import { Slot } from '@namelessdev/slots';
type IFComonent = FC<{
type IfProps = {
when: boolean;
children: ReactElement | ReactElement[];
}>;
declare const If: IFComonent;
declare const True: React.FC<{
children: React.ReactNode;
}> & {
slot: "true";
};
declare const False: React.FC<{
children: React.ReactNode;
}> & {
slot: "false";
};
declare const If: FC<IfProps>;
declare const True: Slot<"true">;
declare const False: Slot<"true">;
export { False, If, True };

@@ -1,1 +0,1 @@

{"version":3,"sources":["../src/If.tsx"],"names":["True","False"],"mappings":"AAAA,OAAO,WAAiC;AACxC,SAAS,eAAe;AACxB,SAAS,SAAe,YAAY;AAO7B,MAAM,KAAiB,CAAC,EAAE,MAAM,SAAS,MAAM;AACpD,QAAM,EAAE,MAAAA,OAAM,OAAAC,OAAM,IAAI,QAAQ,UAAU,QAAQ,OAAO;AAGzD,SAAO,QAAQ,KAAK,MAAM,oCAACD,OAAA,IAAK,GAAI,oCAACC,QAAA,IAAM,CAAE;AAC/C;AAEO,MAAM,OAAO,KAAK,MAAM;AACxB,MAAM,QAAQ,KAAK,OAAO","sourcesContent":["import React, { FC, ReactElement } from \"react\";\nimport { Logical } from \"@namelessdev/helper\";\nimport { retrive, Slot, slot } from \"@namelessdev/slots\";\n\ntype IFComonent = FC<{\n when: boolean;\n children: ReactElement | ReactElement[];\n}>\n\nexport const If: IFComonent = ({ when, children }) => {\n const { True, False } = retrive(children, \"true\", \"false\");\n // console.log(children, <True />);\n \n return Logical.when(when, <True />, <False />);\n};\n\nexport const True = slot(\"true\");\nexport const False = slot(\"false\")\n"]}
{"version":3,"sources":["../src/If.tsx"],"names":["True","False"],"mappings":"AAAA,OAAO,WAAiC;AACxC,SAAS,eAAe;AACxB,SAAS,SAAe,YAAY;AAO7B,MAAM,KAAkB,CAAC,EAAE,MAAM,SAAS,MAAM;AACrD,QAAM,EAAE,MAAAA,OAAM,OAAAC,OAAM,IAAI,QAAQ,UAAU,QAAQ,OAAO;AAEzD,SAAO,QAAQ,KAAK,MAAM,oCAACD,OAAA,IAAK,GAAI,oCAACC,QAAA,IAAM,CAAE;AAC/C;AAGO,MAAM,OAAqB,KAAK,MAAM;AAEtC,MAAM,QAAsB,KAAK,OAAO","sourcesContent":["import React, { FC, ReactElement } from \"react\";\nimport { Logical } from \"@namelessdev/helper\";\nimport { retrive, Slot, slot } from \"@namelessdev/slots\";\n\ntype IfProps = {\n when: boolean;\n children: ReactElement | ReactElement[];\n};\n\nexport const If: FC<IfProps> = ({ when, children }) => {\n const { True, False } = retrive(children, \"true\", \"false\");\n\n return Logical.when(when, <True />, <False />);\n};\n\n// @ts-ignore\nexport const True: Slot<\"true\"> = slot(\"true\");\n// @ts-ignore\nexport const False: Slot<\"true\"> = slot(\"false\");\n"]}
export { Show } from './Show.mjs';
export { False, If, True } from './If.mjs';
export { Switch } from './Switch.mjs';
export { Match } from './Match.mjs';
export { Match, Switch } from './Switch.mjs';
export { For } from './For.mjs';
export { Repeat } from './Repeat.mjs';
export { Dynamic } from './Dynamic.mjs';
export { overriding } from './overriding.mjs';
import 'react';
import '@namelessdev/helper';
import '@namelessdev/slots';
export { Show } from './Show.js';
export { False, If, True } from './If.js';
export { Switch } from './Switch.js';
export { Match } from './Match.js';
export { Match, Switch } from './Switch.js';
export { For } from './For.js';
export { Repeat } from './Repeat.js';
export { Dynamic } from './Dynamic.js';
export { overriding } from './overriding.js';
import 'react';
import '@namelessdev/helper';
import '@namelessdev/slots';

@@ -1,1 +0,1 @@

"use strict";var e=require("./Show"),r=require("./If"),t=require("./Switch"),n=require("./Match"),i=require("./For"),u=require("./Repeat"),o=require("./Dynamic"),c=require("./overriding");Object.defineProperty(exports,"Show",{enumerable:!0,get:function(){return e.Show}}),Object.defineProperty(exports,"False",{enumerable:!0,get:function(){return r.False}}),Object.defineProperty(exports,"If",{enumerable:!0,get:function(){return r.If}}),Object.defineProperty(exports,"True",{enumerable:!0,get:function(){return r.True}}),Object.defineProperty(exports,"Switch",{enumerable:!0,get:function(){return t.Switch}}),Object.defineProperty(exports,"Match",{enumerable:!0,get:function(){return n.Match}}),Object.defineProperty(exports,"For",{enumerable:!0,get:function(){return i.For}}),Object.defineProperty(exports,"Repeat",{enumerable:!0,get:function(){return u.Repeat}}),Object.defineProperty(exports,"Dynamic",{enumerable:!0,get:function(){return o.Dynamic}}),Object.defineProperty(exports,"overriding",{enumerable:!0,get:function(){return c.overriding}});//# sourceMappingURL=index.js.map
"use strict";var e=require("./Show"),r=require("./If"),t=require("./Switch"),n=require("./For"),u=require("./Repeat"),o=require("./Dynamic");Object.defineProperty(exports,"Show",{enumerable:!0,get:function(){return e.Show}}),Object.defineProperty(exports,"False",{enumerable:!0,get:function(){return r.False}}),Object.defineProperty(exports,"If",{enumerable:!0,get:function(){return r.If}}),Object.defineProperty(exports,"True",{enumerable:!0,get:function(){return r.True}}),Object.defineProperty(exports,"Match",{enumerable:!0,get:function(){return t.Match}}),Object.defineProperty(exports,"Switch",{enumerable:!0,get:function(){return t.Switch}}),Object.defineProperty(exports,"For",{enumerable:!0,get:function(){return n.For}}),Object.defineProperty(exports,"Repeat",{enumerable:!0,get:function(){return u.Repeat}}),Object.defineProperty(exports,"Dynamic",{enumerable:!0,get:function(){return o.Dynamic}});//# sourceMappingURL=index.js.map

@@ -1,1 +0,1 @@

{"version":3,"sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,SAAS,YAAY;AACrB,SAAS,IAAI,MAAM,aAAa;AAChC,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,WAAW;AACpB,SAAS,cAAc;AAEvB,SAAS,eAAe;AACxB,SAAS,kBAAkB","sourcesContent":["export { Show } from \"./Show\";\nexport { If, True, False } from \"./If\";\nexport { Switch } from \"./Switch\";\nexport { Match } from \"./Match\";\nexport { For } from \"./For\";\nexport { Repeat } from \"./Repeat\";\n// export { Deferred } from \"./Deferred\";\nexport { Dynamic } from \"./Dynamic\";\nexport { overriding } from \"./overriding\";\n"]}
{"version":3,"sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,SAAS,YAAY;AACrB,SAAS,IAAI,MAAM,aAAa;AAChC,SAAS,QAAQ,aAAa;AAE9B,SAAS,WAAW;AACpB,SAAS,cAAc;AAEvB,SAAS,eAAe","sourcesContent":["export { Show } from \"./Show\";\nexport { If, True, False } from \"./If\";\nexport { Switch, Match } from \"./Switch\";\n// export { Match } from \"./Match\";\nexport { For } from \"./For\";\nexport { Repeat } from \"./Repeat\";\n// export { Deferred } from \"./Deferred\";\nexport { Dynamic } from \"./Dynamic\";\n"]}

@@ -5,26 +5,7 @@ import React, { ReactNode } from 'react';

count: number;
children: ReactNode | ((index: number) => ReactNode);
children: (item: number, index: number) => ReactNode;
empty?: ReactNode | (() => ReactNode);
};
/**
* Компонент Repeat для повторения дочерних элементов.
*
* @param {RepeatProps} props - Параметры компонента.
* @param {number} props.count - Количество повторений.
* @param {ReactNode | ((index: number) => ReactNode)} props.children - Дочерние элементы или функция для их рендера.
* @param {ReactNode | (() => ReactNode)} [props.empty] - Элемент, отображаемый при отсутствии дочерних элементов.
*
* @returns {React.ReactElement} React-компонент.
*
* @example
* <Repeat count={5}>
* {(index) => <p>Элемент {index}</p>}
* </Repeat>
*
* @example
* <Repeat count={0} empty={<p>Нет элементов</p>}/>
*
*/
declare const Repeat: React.FC<RepeatProps>;
export { Repeat };

@@ -5,26 +5,7 @@ import React, { ReactNode } from 'react';

count: number;
children: ReactNode | ((index: number) => ReactNode);
children: (item: number, index: number) => ReactNode;
empty?: ReactNode | (() => ReactNode);
};
/**
* Компонент Repeat для повторения дочерних элементов.
*
* @param {RepeatProps} props - Параметры компонента.
* @param {number} props.count - Количество повторений.
* @param {ReactNode | ((index: number) => ReactNode)} props.children - Дочерние элементы или функция для их рендера.
* @param {ReactNode | (() => ReactNode)} [props.empty] - Элемент, отображаемый при отсутствии дочерних элементов.
*
* @returns {React.ReactElement} React-компонент.
*
* @example
* <Repeat count={5}>
* {(index) => <p>Элемент {index}</p>}
* </Repeat>
*
* @example
* <Repeat count={0} empty={<p>Нет элементов</p>}/>
*
*/
declare const Repeat: React.FC<RepeatProps>;
export { Repeat };

@@ -1,1 +0,1 @@

"use strict";var e=require("react");function t(e){return e&&e.__esModule?e:{default:e}}var n=t(e);const r=e.memo((({count:e,children:t,empty:r})=>{const u=r=>{if(r>=e)return null;const a="function"==typeof t?t(r):t;return n.default.createElement(n.default.Fragment,{key:r},a,u(r+1))};return n.default.createElement(n.default.Fragment,null,0===e?"function"==typeof r?r():r:u(0))}));exports.Repeat=r;//# sourceMappingURL=Repeat.js.map
"use strict";var e=require("react"),r=require("./For");function t(e){return e&&e.__esModule?e:{default:e}}var a=t(e);const o=e.memo((({count:e,children:t,empty:o})=>a.default.createElement(r.For,{items:Array.from({length:e}).map(((e,r)=>r)),empty:o},t)));exports.Repeat=o;//# sourceMappingURL=Repeat.js.map

@@ -1,1 +0,1 @@

{"version":3,"sources":["../src/Repeat.tsx"],"names":[],"mappings":"AAAA,OAAO,SAAkC,YAAY;AA2B9C,MAAM,SAAgC;AAAA,EAC3C,CAAC,EAAE,OAAO,UAAU,MAAM,MAAM;AAC9B,UAAM,iBAAiB,CAAC,UAA6B;AACnD,UAAI,SAAS;AAAO,eAAO;AAC3B,YAAM,UACJ,OAAO,aAAa,aAAa,SAAS,KAAK,IAAI;AACrD,aACE,oCAAC,MAAM,UAAN,EAAe,KAAK,SAClB,SACA,eAAe,QAAQ,CAAC,CAC3B;AAAA,IAEJ;AAEA,WACE,0DACG,UAAU,IACP,OAAO,UAAU,aACf,MAAM,IACN,QACF,eAAe,CAAC,CACtB;AAAA,EAEJ;AACF","sourcesContent":["import React, { ReactNode, ReactElement, memo } from \"react\";\n\ntype RepeatProps = {\n count: number;\n children: ReactNode | ((index: number) => ReactNode);\n empty?: ReactNode | (() => ReactNode);\n};\n\n/**\n * Компонент Repeat для повторения дочерних элементов.\n *\n * @param {RepeatProps} props - Параметры компонента.\n * @param {number} props.count - Количество повторений.\n * @param {ReactNode | ((index: number) => ReactNode)} props.children - Дочерние элементы или функция для их рендера.\n * @param {ReactNode | (() => ReactNode)} [props.empty] - Элемент, отображаемый при отсутствии дочерних элементов.\n *\n * @returns {React.ReactElement} React-компонент.\n *\n * @example\n * <Repeat count={5}>\n * {(index) => <p>Элемент {index}</p>}\n * </Repeat>\n *\n * @example\n * <Repeat count={0} empty={<p>Нет элементов</p>}/>\n *\n */\nexport const Repeat: React.FC<RepeatProps> = memo(\n ({ count, children, empty }) => {\n const renderChildren = (index: number): ReactNode => {\n if (index >= count) return null;\n const element =\n typeof children === \"function\" ? children(index) : children;\n return (\n <React.Fragment key={index}>\n {element}\n {renderChildren(index + 1)}\n </React.Fragment>\n );\n };\n\n return (\n <>\n {count === 0\n ? typeof empty === \"function\"\n ? empty()\n : empty\n : renderChildren(0)}\n </>\n );\n },\n);\n"]}
{"version":3,"sources":["../src/Repeat.tsx"],"names":[],"mappings":"AAAA,OAAO,SAAkC,YAA4B;AACrE,SAAS,WAAW;AAQb,MAAM,SAAgC;AAAA,EAC3C,CAAC,EAAE,OAAO,UAAU,MAAM,MACxB,oCAAC,OAAI,OAAO,MAAM,KAAK,EAAE,QAAQ,MAAM,CAAC,EAAE,IAAI,CAAC,GAAG,MAAM,CAAC,GAAG,SACzD,QACH;AAEJ","sourcesContent":["import React, { ReactNode, ReactElement, memo, isValidElement } from \"react\";\nimport { For } from \"./For\";\n\ntype RepeatProps = {\n count: number;\n children: (item: number, index: number) => ReactNode;\n empty?: ReactNode | (() => ReactNode);\n};\n\nexport const Repeat: React.FC<RepeatProps> = memo(\n ({ count, children, empty }) => (\n <For items={Array.from({ length: count }).map((_, i) => i)} empty={empty}>\n {children}\n </For>\n ),\n);\n"]}

@@ -1,7 +0,7 @@

import React, { FC } from 'react';
import { FC, ReactNode } from 'react';
type ShowProps = {
when: boolean;
fallback?: React.ReactNode;
children: React.ReactNode;
fallback?: ReactNode;
children: ReactNode;
};

@@ -8,0 +8,0 @@ declare const Show: FC<ShowProps>;

@@ -1,7 +0,7 @@

import React, { FC } from 'react';
import { FC, ReactNode } from 'react';
type ShowProps = {
when: boolean;
fallback?: React.ReactNode;
children: React.ReactNode;
fallback?: ReactNode;
children: ReactNode;
};

@@ -8,0 +8,0 @@ declare const Show: FC<ShowProps>;

@@ -1,1 +0,1 @@

{"version":3,"sources":["../src/Show.tsx"],"names":[],"mappings":"AAAA,SAAS,eAAe;AAgBjB,MAAM,OAAsB,CAAC;AAAA,EAClC;AAAA,EACA;AAAA,EACA;AACF,MAAM;AAEJ,SAAO,QAAQ,KAAK,MAAM,UAAU,YAAY,IAAI;AAwBtD","sourcesContent":["import { Logical } from \"@namelessdev/helper\";\nimport React, {\n FC,\n Fragment,\n ReactElement,\n cloneElement,\n createElement,\n isValidElement,\n} from \"react\";\n\ntype ShowProps = {\n when: boolean;\n fallback?: React.ReactNode;\n children: React.ReactNode;\n};\n\nexport const Show: FC<ShowProps> = ({\n when,\n fallback,\n children,\n}) => {\n // return when ? children : fallback || null;\n return Logical.when(when, children, fallback || null)\n // const Comp = when ? children : fallback || null;\n // if (!slot) return Comp;\n //\n // const cloneComp = (component: ReactElement) =>\n // cloneElement(\n // component,\n // Object.assign({}, component.props, { slot, ...props }),\n // component.props.children,\n // );\n //\n // if (Array.isArray(Comp))\n // return createElement(\n // Fragment,\n // {},\n // Comp.map((elem) => {\n // if (!isValidElement(elem)) return elem;\n // return cloneComp(elem);\n // }),\n // );\n // else {\n // if (!isValidElement(Comp)) return <slot name={slot}> {Comp} </slot>;\n // return cloneComp(Comp);\n // }\n};\n"]}
{"version":3,"sources":["../src/Show.tsx"],"names":[],"mappings":"AAAA,SAAS,eAAe;AASjB,MAAM,OAAsB,CAAC,EAAE,MAAM,UAAU,SAAS,MAAM;AACnE,SAAO,QAAQ,KAAK,MAAM,UAAU,YAAY,IAAI;AACtD","sourcesContent":["import { Logical } from \"@namelessdev/helper\";\nimport { FC, ReactNode } from \"react\";\n\ntype ShowProps = {\n when: boolean;\n fallback?: ReactNode;\n children: ReactNode;\n};\n\nexport const Show: FC<ShowProps> = ({ when, fallback, children }) => {\n return Logical.when(when, children, fallback || null);\n};\n"]}

@@ -1,2 +0,2 @@

import React, { ReactElement } from 'react';
import React, { FC, ReactElement, ReactNode } from 'react';

@@ -7,20 +7,9 @@ interface SwitchProps {

}
/**
* Компонент `Switch` работает аналогично оператору switch в JavaScript.
* Он принимает произвольное количество дочерних компонентов `Match` и возвращает первый `Match`, чье свойство `when` равно `true`.
* Если такого `Match` нет, возвращается компонент, указанный в свойстве `fallback`.
*
* @param {ReactElement | ReactElement[]} children - Дочерние элементы, которые могут включать один или несколько компонентов `Match`.
* @param {ReactElement} fallback - Элемент, который будет отображен, если ни один из дочерних компонентов `Match` не соответствует условию.
* @returns {ReactElement} Возвращает первый подходящий `Match` или `fallback` элемент.
*
* @example
* <Switch fallback={<DefaultComponent />}>
* <Match when={condition1}><Component1 /></Match>
* <Match when={condition2}><Component2 /></Match>
* ...
* </Switch>
*/
declare const Switch: React.FC<SwitchProps>;
interface MatchProps {
when: boolean;
children: ReactNode;
}
declare const Match: FC<MatchProps>;
export { Switch };
export { Match, Switch };

@@ -1,2 +0,2 @@

import React, { ReactElement } from 'react';
import React, { FC, ReactElement, ReactNode } from 'react';

@@ -7,20 +7,9 @@ interface SwitchProps {

}
/**
* Компонент `Switch` работает аналогично оператору switch в JavaScript.
* Он принимает произвольное количество дочерних компонентов `Match` и возвращает первый `Match`, чье свойство `when` равно `true`.
* Если такого `Match` нет, возвращается компонент, указанный в свойстве `fallback`.
*
* @param {ReactElement | ReactElement[]} children - Дочерние элементы, которые могут включать один или несколько компонентов `Match`.
* @param {ReactElement} fallback - Элемент, который будет отображен, если ни один из дочерних компонентов `Match` не соответствует условию.
* @returns {ReactElement} Возвращает первый подходящий `Match` или `fallback` элемент.
*
* @example
* <Switch fallback={<DefaultComponent />}>
* <Match when={condition1}><Component1 /></Match>
* <Match when={condition2}><Component2 /></Match>
* ...
* </Switch>
*/
declare const Switch: React.FC<SwitchProps>;
interface MatchProps {
when: boolean;
children: ReactNode;
}
declare const Match: FC<MatchProps>;
export { Switch };
export { Match, Switch };

@@ -1,1 +0,1 @@

"use strict";var e=require("react"),r=require("./Match"),t=require("@namelessdev/helper");function a(e){return e&&e.__esModule?e:{default:e}}var l=a(e);exports.Switch=({children:e,fallback:a})=>{const n=l.default.Children.toArray(e).find((e=>t.Logical.and(l.default.isValidElement(e),e.type===r.Match,e.props.when)));return l.default.createElement(l.default.Fragment,null,n||a)};//# sourceMappingURL=Switch.js.map
"use strict";var e=require("react"),t=require("@namelessdev/slots");function r(e){return e&&e.__esModule?e:{default:e}}var a=r(e);const l=t.wrap("match",(({children:e})=>e));exports.Match=l,exports.Switch=({children:e,fallback:r})=>{const{Match:l}=t.retrive(e,{name:"match",filter:e=>a.default.isValidElement(e)&&e.props.when});return a.default.createElement(l,null,r)};//# sourceMappingURL=Switch.js.map

@@ -1,1 +0,1 @@

{"version":3,"sources":["../src/Switch.tsx"],"names":[],"mappings":"AAAA,OAAO,WAA6B;AACpC,SAAS,aAAa;AACtB,SAAS,eAAe;AAsBjB,MAAM,SAAgC,CAAC,EAAE,UAAU,SAAS,MAAM;AACvE,QAAM,QAAQ,MAAM,SAAS,QAAQ,QAAQ,EAAE;AAAA,IAC7C,CAAC,UACC,QAAQ;AAAA,MACN,MAAM,eAAe,KAAK;AAAA,MACzB,MAAuB,SAAS;AAAA,MAChC,MAAuB,MAAM;AAAA,IAChC;AAAA,EACJ;AAEA,SAAO,0DAAG,SAAS,QAAS;AAC9B","sourcesContent":["import React, { ReactElement } from \"react\";\nimport { Match } from \"./Match\";\nimport { Logical } from \"@namelessdev/helper\";\n\ninterface SwitchProps {\n children: ReactElement | ReactElement[];\n fallback: ReactElement;\n}\n/**\n * Компонент `Switch` работает аналогично оператору switch в JavaScript.\n * Он принимает произвольное количество дочерних компонентов `Match` и возвращает первый `Match`, чье свойство `when` равно `true`.\n * Если такого `Match` нет, возвращается компонент, указанный в свойстве `fallback`.\n *\n * @param {ReactElement | ReactElement[]} children - Дочерние элементы, которые могут включать один или несколько компонентов `Match`.\n * @param {ReactElement} fallback - Элемент, который будет отображен, если ни один из дочерних компонентов `Match` не соответствует условию.\n * @returns {ReactElement} Возвращает первый подходящий `Match` или `fallback` элемент.\n *\n * @example\n * <Switch fallback={<DefaultComponent />}>\n * <Match when={condition1}><Component1 /></Match>\n * <Match when={condition2}><Component2 /></Match>\n * ...\n * </Switch>\n */\nexport const Switch: React.FC<SwitchProps> = ({ children, fallback }) => {\n const match = React.Children.toArray(children).find(\n (child: React.ReactNode) =>\n Logical.and(\n React.isValidElement(child),\n (child as ReactElement).type === Match,\n (child as ReactElement).props.when,\n ),\n ) as ReactElement | undefined;\n\n return <>{match || fallback}</>;\n};\n"]}
{"version":3,"sources":["../src/Switch.tsx"],"names":["Match"],"mappings":"AAAA,OAAO,WAA4C;AACnD,SAAS,SAAS,YAAY;AAOvB,MAAM,SAAgC,CAAC,EAAE,UAAU,SAAS,MAAM;AACvE,QAAM,EAAE,OAAAA,OAAM,IAAI,QAAQ,UAAU;AAAA,IAClC,MAAM;AAAA,IACN,QAAQ,CAAC,UACP,MAAM,eAAe,KAAK,KAAM,MAAuB,MAAM;AAAA,EACjE,CAAC;AACD,SAAO,oCAACA,QAAA,MAAO,QAAS;AAC1B;AAOO,MAAM,QAAwB,KAAK,SAAS,CAAC,EAAE,SAAS,MAAM,QAAQ","sourcesContent":["import React, { FC, ReactElement, ReactNode } from \"react\";\nimport { retrive, wrap } from \"@namelessdev/slots\";\n\ninterface SwitchProps {\n children: ReactElement | ReactElement[];\n fallback: ReactElement;\n}\n\nexport const Switch: React.FC<SwitchProps> = ({ children, fallback }) => {\n const { Match } = retrive(children, {\n name: \"match\",\n filter: (child) =>\n React.isValidElement(child) && (child as ReactElement).props.when,\n });\n return <Match>{fallback}</Match>;\n};\n\ninterface MatchProps {\n when: boolean;\n children: ReactNode;\n}\n\nexport const Match: FC<MatchProps> = wrap(\"match\", ({ children }) => children);\n"]}
{
"name": "@namelessdev/flow",
"version": "0.0.2",
"version": "0.0.3",
"description": "",

@@ -44,4 +44,4 @@ "main": "./build/index.js",

"dependencies": {
"@namelessdev/helper": "0.0.2",
"@namelessdev/slots": "0.0.2"
"@namelessdev/slots": "0.0.7",
"@namelessdev/helper": "0.0.2"
},

@@ -48,0 +48,0 @@ "scripts": {

+147
-1

@@ -1,1 +0,147 @@

# `@namelessdev/helper`
## Beta version, not intended for production
Library for controlling the flow of displaying page elements.
## For
A component for drawing arrays. This component will add for you
element key, you can pass a function to define kye to props keys,
if you don't, it will take the index of the element.
It is also possible to pass an item that will be displayed if the
the array you passed to items is empty.
```tsx
type ForProps<T> = {
items: T[];
children: (item: T, index: number) => ReactNode;
keys?: (item: T, index: number) => React.Key;
empty?: ReactNode | (() => ReactNode) | React.FC;
};
<For
items={[1, 2, 3, 4, 5]}
keys={(item, index) => item * index}
empty={<div>Array is Empty</div>}
>
{(item) => <div>Element: {item}</div>}
</For>;
```
## Repeat
A simple component that repeats count once, it is also possible to display an item if count === 0
```tsx
type RepeatProps = {
count: number;
children: ReactNode | ((index: number) => ReactNode);
empty?: ReactNode | (() => ReactNode);
};
<Repeat count={5}>
{(index) => <p>Element {index}</p>}
</Repeat>
<Repeat count={0} empty={<p>There are no elements</p>}/>
```
## Show
Component for conditional drawing of children. It takes a condition in props when and draws children if it is true. If you need to draw another element if the condition is false, you can pass it to the props fallback, but for such cases it is better to use the If component.
```tsx
type ShowProps = {
when: boolean;
fallback?: ReactNode;
children: ReactNode;
};
<Show when={isShow}>
<h1>Hello User</h1>
</Show>;
```
## If
Also a conditional drawing component, but more designed to draw either one element or the other. It is based on the slots system from the [@namelessdev/slots](https://www.npmjs.com/package/@namelessdev/slots) library. It takes a condition in props when and two child elements that are slots true and false. it also comes with components that are these slots True and False or you can give a slot="true" attribute to the element or wrap it in a `<slot name="true">` tag. components that are not slots will not be rendered.
```tsx
type IfProps = {
when: boolean;
children: ReactElement | ReactElement[];
};
<If when={isAutorizate}>
<True>You're logged in</True>
<False>Please log in to your account</False>
</If>
<If when={isAutorizate}>
<h1 slot="true">You're logged in</h1>
<h1 slot="false">Please log in to your account</h1>
</If>
<If when={isAutorizate}>
<slot name="true">You're logged in</slot>
<slot name="false">Please log in to your account</slot>
</If>
```
## Switch / Match
This is analogous to switch/case from JS, but for drawing elements.
The Switch component is a wrapper that accepts Match components as children and an optional fallback attribute, which is an element if no element will be rendered. All Match with when === true will be rendered.
The Match component accepts the when attribute which is a condition and child elements.
```tsx
type SwitchProps = {
children: ReactElement | ReactElement[];
fallback: ReactElement;
};
type MatchProps = {
when: boolean;
children: ReactNode;
};
<Switch fallback={"You are not authorised"}>
<Match when={user.role === "user"}>Your role as User</Match>
<Match when={user.role === "creator"}>Your role as Creator</Match>
<Match when={user.role === "admin"}>Your role as Admin</Match>
</Switch>;
```
## Deferred
A component that displays child elements after a timeout of milliseconds and can display placeholder until then
```tsx
type DeferredProps = {
timeout: number;
children: ReactNode;
placeholder?: ReactNode;
};
<Deferred timeout={2500} placeholder={"Wait 2.5 seconds."}>
It's been 2.5 seconds
</Deferred>;
```
## Dynamic
A component that can dynamically modify the tag or component it is. It accepts the tag or component to use and the props of that element
```tsx
const RedThing = () => <strong>Red Thing</strong>;
const GreenThing = () => <strong>Green Thing</strong>;
const BlueThing = () => <strong>Blue Thing</strong>;
const options = {
red: RedThing,
green: GreenThing,
blue: BlueThing
}
<Dynamic component={options[selected]} />
<Dynamic component={options[selected]} props={{ className: "active" }} />
```
import e from"react";const r=e.memo((({children:r})=>e.createElement(e.Fragment,null,r)));export{r as Match};//# sourceMappingURL=Match.js.map
{"version":3,"sources":["../../src/Match.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW;AAmBX,MAAM,QAA8B,MAAM,KAAK,CAAC,EAAE,SAAS,MAAM;AACtE,SAAO,0DAAG,QAAS;AACrB,CAAC","sourcesContent":["import React from \"react\";\n\ninterface MatchProps {\n when: boolean;\n children: React.ReactNode;\n}\n/**\n * Компонент `Match` используется в сочетании с `Switch`.\n * Он отображает своих детей (`children`), если свойство `when` истинно (true).\n *\n * @param {boolean} when - Условие, определяющее, будет ли отображаться содержимое компонента.\n * @param {React.ReactNode} children - Дочерние элементы, которые будут отображаться, если `when` истинно.\n * @returns {ReactElement | null} Возвращает дочерние элементы, если `when` истинно, в противном случае ничего не отображает.\n *\n * @example\n * <Match when={someCondition}>\n * <SomeComponent />\n * </Match>\n */\nexport const Match: React.FC<MatchProps> = React.memo(({ children }) => {\n return <>{children}</>;\n});\n"]}
import r from"react";import{Record as e,cn as s}from"@namelessdev/helper";const p=(e,s,n)=>r.Children.map(e,(e=>r.isValidElement(e)?e.props[`data-${s}`]?Object.assign({},e,{props:n(e.props)}):e.props||e.props.children?r.cloneElement(e,e.props,p(e.props.children||[],s,n)):e:e));const n=(r,e)=>Object.entries(e).reduce(((r,[e,s])=>Array.isArray(s)?s.reduce(((r,s)=>p(r,e,s)),r):p(r,e,s)),r);n.chain=function(...r){return(...e)=>r.forEach((r=>{"function"==typeof r&&r(...e)}))},n.assign=e.assing,n.cn=(...r)=>s(...r),n.props=r=>e=>Object.assign({},e,r(e));export{n as overriding,p as overridingRoot};//# sourceMappingURL=overriding.js.map
{"version":3,"sources":["../../src/overriding.ts"],"names":[],"mappings":"AAAA,OAAO,WAA6B;AACpC,SAAS,IAAI,cAAc;AAOpB,MAAM,iBAAiB,CAI5B,UACA,MACA,WACiB;AACjB,SAAO,MAAM,SAAS,IAAI,UAAU,CAAC,UAAwB;AAC3D,QAAI,CAAC,MAAM,eAAe,KAAK;AAAG,aAAO;AACzC,QAAK,MAAM,MAA4C,QAAQ,IAAI,EAAE;AACnE,aAAO,OAAO,OAAO,CAAC,GAAG,OAAO;AAAA,QAC9B,OAAO,OAAO,MAAM,KAAU;AAAA,MAChC,CAAC;AAEH,QAAI,CAAC,MAAM,SAAS,CAAE,MAAM,MAAkC;AAC5D,aAAO;AAAA;AAEP,aAAO,MAAM;AAAA,QACX;AAAA,QACC,MAAuB;AAAA,QACxB,eAAgB,MAAM,MAAc,YAAY,CAAC,GAAG,MAAM,MAAM;AAAA,MAClE;AAAA,EACJ,CAAC;AACH;AAIA,SAAS,SAAY,QAA2B;AAC9C,SAAO,IAAI,SACT,OAAO,QAAQ,CAAC,OAAO;AACrB,QAAI,OAAO,OAAO;AAAY,SAAG,GAAG,IAAI;AAAA,EAC1C,CAAC;AACL;AAEO,MAAM,aAAa,CACxB,UACA,SAKoB;AACpB,SAAO,OAAO,QAAQ,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,MAAM,KAAK,MAAM;AACzD,QAAI,CAAC,MAAM,QAAQ,KAAK;AAAG,aAAO,eAAe,KAAK,MAAM,KAAK;AAAA;AAC5D,aAAO,MAAM,OAAO,CAAC,IAAI,OAAO,eAAe,IAAI,MAAM,EAAE,GAAG,GAAG;AAAA,EACxE,GAAG,QAAQ;AACb;AAEA,WAAW,QAAQ;AACnB,WAAW,SAAS,OAAO;AAC3B,WAAW,KAAK,IAAI,SAAgB,GAAG,GAAG,IAAI;AAC9C,WAAW,QACT,CAAC,aACD,CAAC,UACC,OAAO,OAAO,CAAC,GAAG,OAAO,SAAS,KAAK,CAAC","sourcesContent":["import React, { ReactElement } from \"react\";\nimport { cn, Record } from \"@namelessdev/helper\";\n\ntype OverridingFunction<\n P extends Record<string, unknown>,\n T extends Record<string, unknown>,\n> = (props: P) => T;\n\nexport const overridingRoot = <\n P extends Record<string, unknown>,\n T extends Record<string, unknown>,\n>(\n children: ReactElement,\n name: string,\n setter: OverridingFunction<P, T>,\n): ReactElement => {\n return React.Children.map(children, (child: ReactElement) => {\n if (!React.isValidElement(child)) return child;\n if ((child.props as Record<`data-${string}`, unknown>)[`data-${name}`])\n return Object.assign({}, child, {\n props: setter(child.props as P),\n });\n\n if (!child.props && !(child.props as Record<string, unknown>).children)\n return child;\n else\n return React.cloneElement(\n child,\n (child as ReactElement).props,\n overridingRoot((child.props as any).children || [], name, setter),\n );\n }) as unknown as ReactElement;\n};\n\ntype FunctionType<T> = (...args: any[]) => T;\n\nfunction chain<T>(...functs: FunctionType<T>[]) {\n return (...args: any[]) =>\n functs.forEach((fn) => {\n if (typeof fn === \"function\") fn(...args);\n });\n}\n\nexport const overriding = <P extends Record<string, unknown>, C>(\n children: ReactElement,\n over: Record<\n string,\n | OverridingFunction<P, Record<string, unknown>>\n | Array<OverridingFunction<P, Record<string, unknown>>>\n >,\n): ReactElement<C> => {\n return Object.entries(over).reduce((acc, [name, funcs]) => {\n if (!Array.isArray(funcs)) return overridingRoot(acc, name, funcs);\n else return funcs.reduce((ac, fn) => overridingRoot(ac, name, fn), acc);\n }, children);\n};\n\noverriding.chain = chain;\noverriding.assign = Record.assing;\noverriding.cn = (...args: any[]) => cn(...args);\noverriding.props =\n (newProps: (props: ReactElement[\"props\"]) => Record<string, unknown>) =>\n (props: ReactElement[\"props\"]) =>\n Object.assign({}, props, newProps(props));\n"]}
import React from 'react';
interface MatchProps {
when: boolean;
children: React.ReactNode;
}
/**
* Компонент `Match` используется в сочетании с `Switch`.
* Он отображает своих детей (`children`), если свойство `when` истинно (true).
*
* @param {boolean} when - Условие, определяющее, будет ли отображаться содержимое компонента.
* @param {React.ReactNode} children - Дочерние элементы, которые будут отображаться, если `when` истинно.
* @returns {ReactElement | null} Возвращает дочерние элементы, если `when` истинно, в противном случае ничего не отображает.
*
* @example
* <Match when={someCondition}>
* <SomeComponent />
* </Match>
*/
declare const Match: React.FC<MatchProps>;
export { Match };
import React from 'react';
interface MatchProps {
when: boolean;
children: React.ReactNode;
}
/**
* Компонент `Match` используется в сочетании с `Switch`.
* Он отображает своих детей (`children`), если свойство `when` истинно (true).
*
* @param {boolean} when - Условие, определяющее, будет ли отображаться содержимое компонента.
* @param {React.ReactNode} children - Дочерние элементы, которые будут отображаться, если `when` истинно.
* @returns {ReactElement | null} Возвращает дочерние элементы, если `when` истинно, в противном случае ничего не отображает.
*
* @example
* <Match when={someCondition}>
* <SomeComponent />
* </Match>
*/
declare const Match: React.FC<MatchProps>;
export { Match };
"use strict";function e(e){return e&&e.__esModule?e:{default:e}}var t=e(require("react"));const r=t.default.memo((({children:e})=>t.default.createElement(t.default.Fragment,null,e)));exports.Match=r;//# sourceMappingURL=Match.js.map
{"version":3,"sources":["../src/Match.tsx"],"names":[],"mappings":"AAAA,OAAO,WAAW;AAmBX,MAAM,QAA8B,MAAM,KAAK,CAAC,EAAE,SAAS,MAAM;AACtE,SAAO,0DAAG,QAAS;AACrB,CAAC","sourcesContent":["import React from \"react\";\n\ninterface MatchProps {\n when: boolean;\n children: React.ReactNode;\n}\n/**\n * Компонент `Match` используется в сочетании с `Switch`.\n * Он отображает своих детей (`children`), если свойство `when` истинно (true).\n *\n * @param {boolean} when - Условие, определяющее, будет ли отображаться содержимое компонента.\n * @param {React.ReactNode} children - Дочерние элементы, которые будут отображаться, если `when` истинно.\n * @returns {ReactElement | null} Возвращает дочерние элементы, если `when` истинно, в противном случае ничего не отображает.\n *\n * @example\n * <Match when={someCondition}>\n * <SomeComponent />\n * </Match>\n */\nexport const Match: React.FC<MatchProps> = React.memo(({ children }) => {\n return <>{children}</>;\n});\n"]}
import React, { ReactElement } from 'react';
import { Record } from '@namelessdev/helper';
type OverridingFunction<P extends Record<string, unknown>, T extends Record<string, unknown>> = (props: P) => T;
declare const overridingRoot: <P extends Record<string, unknown>, T extends Record<string, unknown>>(children: ReactElement, name: string, setter: OverridingFunction<P, T>) => ReactElement;
type FunctionType<T> = (...args: any[]) => T;
declare function chain<T>(...functs: FunctionType<T>[]): (...args: any[]) => void;
declare const overriding: {
<P extends Record<string, unknown>, C>(children: ReactElement, over: Record<string, OverridingFunction<P, Record<string, unknown>> | OverridingFunction<P, Record<string, unknown>>[]>): React.ReactElement<C, string | React.JSXElementConstructor<any>>;
chain: typeof chain;
assign: (receiverObject: Record<string, any>, ...sourceObjects: Record<string, any>[]) => Record<string, any>;
cn(...args: any[]): string;
props(newProps: (props: ReactElement["props"]) => Record<string, unknown>): (props: ReactElement["props"]) => any;
};
export { overriding, overridingRoot };
import React, { ReactElement } from 'react';
import { Record } from '@namelessdev/helper';
type OverridingFunction<P extends Record<string, unknown>, T extends Record<string, unknown>> = (props: P) => T;
declare const overridingRoot: <P extends Record<string, unknown>, T extends Record<string, unknown>>(children: ReactElement, name: string, setter: OverridingFunction<P, T>) => ReactElement;
type FunctionType<T> = (...args: any[]) => T;
declare function chain<T>(...functs: FunctionType<T>[]): (...args: any[]) => void;
declare const overriding: {
<P extends Record<string, unknown>, C>(children: ReactElement, over: Record<string, OverridingFunction<P, Record<string, unknown>> | OverridingFunction<P, Record<string, unknown>>[]>): React.ReactElement<C, string | React.JSXElementConstructor<any>>;
chain: typeof chain;
assign: (receiverObject: Record<string, any>, ...sourceObjects: Record<string, any>[]) => Record<string, any>;
cn(...args: any[]): string;
props(newProps: (props: ReactElement["props"]) => Record<string, unknown>): (props: ReactElement["props"]) => any;
};
export { overriding, overridingRoot };
"use strict";var e=require("react"),r=require("@namelessdev/helper");function s(e){return e&&e.__esModule?e:{default:e}}var n=s(e);const t=(e,r,s)=>n.default.Children.map(e,(e=>n.default.isValidElement(e)?e.props[`data-${r}`]?Object.assign({},e,{props:s(e.props)}):e.props||e.props.children?n.default.cloneElement(e,e.props,t(e.props.children||[],r,s)):e:e));const o=(e,r)=>Object.entries(r).reduce(((e,[r,s])=>Array.isArray(s)?s.reduce(((e,s)=>t(e,r,s)),e):t(e,r,s)),e);o.chain=function(...e){return(...r)=>e.forEach((e=>{"function"==typeof e&&e(...r)}))},o.assign=r.Record.assing,o.cn=(...e)=>r.cn(...e),o.props=e=>r=>Object.assign({},r,e(r)),exports.overriding=o,exports.overridingRoot=t;//# sourceMappingURL=overriding.js.map
{"version":3,"sources":["../src/overriding.ts"],"names":[],"mappings":"AAAA,OAAO,WAA6B;AACpC,SAAS,IAAI,cAAc;AAOpB,MAAM,iBAAiB,CAI5B,UACA,MACA,WACiB;AACjB,SAAO,MAAM,SAAS,IAAI,UAAU,CAAC,UAAwB;AAC3D,QAAI,CAAC,MAAM,eAAe,KAAK;AAAG,aAAO;AACzC,QAAK,MAAM,MAA4C,QAAQ,IAAI,EAAE;AACnE,aAAO,OAAO,OAAO,CAAC,GAAG,OAAO;AAAA,QAC9B,OAAO,OAAO,MAAM,KAAU;AAAA,MAChC,CAAC;AAEH,QAAI,CAAC,MAAM,SAAS,CAAE,MAAM,MAAkC;AAC5D,aAAO;AAAA;AAEP,aAAO,MAAM;AAAA,QACX;AAAA,QACC,MAAuB;AAAA,QACxB,eAAgB,MAAM,MAAc,YAAY,CAAC,GAAG,MAAM,MAAM;AAAA,MAClE;AAAA,EACJ,CAAC;AACH;AAIA,SAAS,SAAY,QAA2B;AAC9C,SAAO,IAAI,SACT,OAAO,QAAQ,CAAC,OAAO;AACrB,QAAI,OAAO,OAAO;AAAY,SAAG,GAAG,IAAI;AAAA,EAC1C,CAAC;AACL;AAEO,MAAM,aAAa,CACxB,UACA,SAKoB;AACpB,SAAO,OAAO,QAAQ,IAAI,EAAE,OAAO,CAAC,KAAK,CAAC,MAAM,KAAK,MAAM;AACzD,QAAI,CAAC,MAAM,QAAQ,KAAK;AAAG,aAAO,eAAe,KAAK,MAAM,KAAK;AAAA;AAC5D,aAAO,MAAM,OAAO,CAAC,IAAI,OAAO,eAAe,IAAI,MAAM,EAAE,GAAG,GAAG;AAAA,EACxE,GAAG,QAAQ;AACb;AAEA,WAAW,QAAQ;AACnB,WAAW,SAAS,OAAO;AAC3B,WAAW,KAAK,IAAI,SAAgB,GAAG,GAAG,IAAI;AAC9C,WAAW,QACT,CAAC,aACD,CAAC,UACC,OAAO,OAAO,CAAC,GAAG,OAAO,SAAS,KAAK,CAAC","sourcesContent":["import React, { ReactElement } from \"react\";\nimport { cn, Record } from \"@namelessdev/helper\";\n\ntype OverridingFunction<\n P extends Record<string, unknown>,\n T extends Record<string, unknown>,\n> = (props: P) => T;\n\nexport const overridingRoot = <\n P extends Record<string, unknown>,\n T extends Record<string, unknown>,\n>(\n children: ReactElement,\n name: string,\n setter: OverridingFunction<P, T>,\n): ReactElement => {\n return React.Children.map(children, (child: ReactElement) => {\n if (!React.isValidElement(child)) return child;\n if ((child.props as Record<`data-${string}`, unknown>)[`data-${name}`])\n return Object.assign({}, child, {\n props: setter(child.props as P),\n });\n\n if (!child.props && !(child.props as Record<string, unknown>).children)\n return child;\n else\n return React.cloneElement(\n child,\n (child as ReactElement).props,\n overridingRoot((child.props as any).children || [], name, setter),\n );\n }) as unknown as ReactElement;\n};\n\ntype FunctionType<T> = (...args: any[]) => T;\n\nfunction chain<T>(...functs: FunctionType<T>[]) {\n return (...args: any[]) =>\n functs.forEach((fn) => {\n if (typeof fn === \"function\") fn(...args);\n });\n}\n\nexport const overriding = <P extends Record<string, unknown>, C>(\n children: ReactElement,\n over: Record<\n string,\n | OverridingFunction<P, Record<string, unknown>>\n | Array<OverridingFunction<P, Record<string, unknown>>>\n >,\n): ReactElement<C> => {\n return Object.entries(over).reduce((acc, [name, funcs]) => {\n if (!Array.isArray(funcs)) return overridingRoot(acc, name, funcs);\n else return funcs.reduce((ac, fn) => overridingRoot(ac, name, fn), acc);\n }, children);\n};\n\noverriding.chain = chain;\noverriding.assign = Record.assing;\noverriding.cn = (...args: any[]) => cn(...args);\noverriding.props =\n (newProps: (props: ReactElement[\"props\"]) => Record<string, unknown>) =>\n (props: ReactElement[\"props\"]) =>\n Object.assign({}, props, newProps(props));\n"]}