@zayne-labs/toolkit-react 0.11.1 → 0.11.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/hooks/index.d.ts +3 -2
- package/dist/esm/hooks/index.js +3 -2
- package/dist/esm/{hooks-BHS1sAKT.js → hooks-CKFRcgTQ.js} +9 -2
- package/dist/esm/hooks-CKFRcgTQ.js.map +1 -0
- package/dist/esm/index-CByHxS0M.d.ts +225 -0
- package/dist/esm/{index-DUGJrMJn.d.ts → index-Dc35xGUv.d.ts} +6 -2
- package/dist/esm/utils/index.d.ts +2 -225
- package/dist/esm/utils/index.js +2 -278
- package/dist/esm/utils-Bvs8tFDM.js +279 -0
- package/dist/esm/utils-Bvs8tFDM.js.map +1 -0
- package/dist/esm/zustand/index.d.ts +2 -1
- package/dist/esm/zustand/index.js +2 -1
- package/dist/esm/zustand/index.js.map +1 -1
- package/package.json +3 -3
- package/dist/esm/hooks-BHS1sAKT.js.map +0 -1
- package/dist/esm/utils/index.js.map +0 -1
|
@@ -1,2 +1,3 @@
|
|
|
1
|
-
import { ContextError, CustomContextOptions, UseCustomContext, createCustomContext, createUseLocationState, createUseStorageState, getErrorMessage, useAfterMountEffect, useAnimateElementRefs, useAnimationInterval, useAsyncEffect, useCallbackRef, useClickOutside, useConstant, useCopyToClipboard, useDebouncedFn, useDebouncedState, useDisclosure, useEffectOnce, useIsHydrated, useIsServer, useLazyRef, useLifeCycle, useLocationState, useMountEffect, useScrollObserver, useSearch, useSearchParams, useSearchParamsObject, useShallowComparedSelector, useShallowComparedValue, useStorageState, useStore, useThrottleByFrame, useThrottleBySetTimeout, useThrottleByTimer, useToggle, useUnmountEffect } from "../index-
|
|
2
|
-
|
|
1
|
+
import { ContextError, CustomContextOptions, UseCustomContext, createCustomContext, createUseLocationState, createUseStorageState, getErrorMessage, useAfterMountEffect, useAnimateElementRefs, useAnimationInterval, useAsyncEffect, useCallbackRef, useClickOutside, useComposeRefs, useConstant, useCopyToClipboard, useDebouncedFn, useDebouncedState, useDisclosure, useEffectOnce, useIsHydrated, useIsServer, useLazyRef, useLifeCycle, useLocationState, useMountEffect, useScrollObserver, useSearch, useSearchParams, useSearchParamsObject, useShallowComparedSelector, useShallowComparedValue, useStorageState, useStore, useThrottleByFrame, useThrottleBySetTimeout, useThrottleByTimer, useToggle, useUnmountEffect } from "../index-Dc35xGUv.js";
|
|
2
|
+
import "../index-CByHxS0M.js";
|
|
3
|
+
export { ContextError, CustomContextOptions, UseCustomContext, createCustomContext, createUseLocationState, createUseStorageState, getErrorMessage, useAfterMountEffect, useAnimateElementRefs, useAnimationInterval, useAsyncEffect, useCallbackRef, useClickOutside, useComposeRefs, useConstant, useCopyToClipboard, useDebouncedFn, useDebouncedState, useDisclosure, useEffectOnce, useIsHydrated, useIsServer, useLazyRef, useLifeCycle, useLocationState, useMountEffect, useScrollObserver, useSearch, useSearchParams, useSearchParamsObject, useShallowComparedSelector, useShallowComparedValue, useStorageState, useStore, useThrottleByFrame, useThrottleBySetTimeout, useThrottleByTimer, useToggle, useUnmountEffect };
|
package/dist/esm/hooks/index.js
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
-
import { ContextError, createCustomContext, createUseLocationState, createUseStorageState, getErrorMessage, useAfterMountEffect, useAnimateElementRefs, useAnimationInterval, useAsyncEffect, useCallbackRef, useClickOutside, useConstant, useCopyToClipboard, useDebouncedFn, useDebouncedState, useDisclosure, useEffectOnce, useIsHydrated, useIsServer, useLazyRef, useLifeCycle, useLocationState, useMountEffect, useScrollObserver, useSearch, useSearchParams, useSearchParamsObject, useShallowComparedSelector, useShallowComparedValue, useStorageState, useStore, useThrottleByFrame, useThrottleBySetTimeout, useThrottleByTimer, useToggle, useUnmountEffect } from "../hooks-
|
|
1
|
+
import { ContextError, createCustomContext, createUseLocationState, createUseStorageState, getErrorMessage, useAfterMountEffect, useAnimateElementRefs, useAnimationInterval, useAsyncEffect, useCallbackRef, useClickOutside, useComposeRefs, useConstant, useCopyToClipboard, useDebouncedFn, useDebouncedState, useDisclosure, useEffectOnce, useIsHydrated, useIsServer, useLazyRef, useLifeCycle, useLocationState, useMountEffect, useScrollObserver, useSearch, useSearchParams, useSearchParamsObject, useShallowComparedSelector, useShallowComparedValue, useStorageState, useStore, useThrottleByFrame, useThrottleBySetTimeout, useThrottleByTimer, useToggle, useUnmountEffect } from "../hooks-CKFRcgTQ.js";
|
|
2
|
+
import "../utils-Bvs8tFDM.js";
|
|
2
3
|
|
|
3
|
-
export { ContextError, createCustomContext, createUseLocationState, createUseStorageState, getErrorMessage, useAfterMountEffect, useAnimateElementRefs, useAnimationInterval, useAsyncEffect, useCallbackRef, useClickOutside, useConstant, useCopyToClipboard, useDebouncedFn, useDebouncedState, useDisclosure, useEffectOnce, useIsHydrated, useIsServer, useLazyRef, useLifeCycle, useLocationState, useMountEffect, useScrollObserver, useSearch, useSearchParams, useSearchParamsObject, useShallowComparedSelector, useShallowComparedValue, useStorageState, useStore, useThrottleByFrame, useThrottleBySetTimeout, useThrottleByTimer, useToggle, useUnmountEffect };
|
|
4
|
+
export { ContextError, createCustomContext, createUseLocationState, createUseStorageState, getErrorMessage, useAfterMountEffect, useAnimateElementRefs, useAnimationInterval, useAsyncEffect, useCallbackRef, useClickOutside, useComposeRefs, useConstant, useCopyToClipboard, useDebouncedFn, useDebouncedState, useDisclosure, useEffectOnce, useIsHydrated, useIsServer, useLazyRef, useLifeCycle, useLocationState, useMountEffect, useScrollObserver, useSearch, useSearchParams, useSearchParamsObject, useShallowComparedSelector, useShallowComparedValue, useStorageState, useStore, useThrottleByFrame, useThrottleBySetTimeout, useThrottleByTimer, useToggle, useUnmountEffect };
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { composeRefs } from "./utils-Bvs8tFDM.js";
|
|
1
2
|
import { createContext, use, useCallback, useDebugValue, useEffect, useLayoutEffect, useMemo, useRef, useState, useSyncExternalStore } from "react";
|
|
2
3
|
import { copyToClipboard, createExternalStorageStore, createLocationStore, createScrollObserver, createSearchParams, debounce, lockScroll, on, onClickOutside, setAnimationInterval, shallowCompare, throttleByFrame, throttleBySetTimeout, throttleByTime, toArray } from "@zayne-labs/toolkit-core";
|
|
3
4
|
import { isArray, isBoolean, isFunction, isPlainObject } from "@zayne-labs/toolkit-type-helpers";
|
|
@@ -186,6 +187,12 @@ const useClickOutside = (options) => {
|
|
|
186
187
|
return { ref: innerRef };
|
|
187
188
|
};
|
|
188
189
|
|
|
190
|
+
//#endregion
|
|
191
|
+
//#region src/hooks/useComposeRefs.ts
|
|
192
|
+
const useComposeRefs = (...refs) => {
|
|
193
|
+
return useCallback(() => composeRefs(...refs), refs);
|
|
194
|
+
};
|
|
195
|
+
|
|
189
196
|
//#endregion
|
|
190
197
|
//#region src/hooks/useConstant.ts
|
|
191
198
|
const useConstant = (initCallbackFn) => {
|
|
@@ -538,5 +545,5 @@ const useThrottleByFrame = (callbackFn) => {
|
|
|
538
545
|
};
|
|
539
546
|
|
|
540
547
|
//#endregion
|
|
541
|
-
export { ContextError, createCustomContext, createUseLocationState, createUseStorageState, getErrorMessage, useAfterMountEffect, useAnimateElementRefs, useAnimationInterval, useAsyncEffect, useCallbackRef, useClickOutside, useConstant, useCopyToClipboard, useDebouncedFn, useDebouncedState, useDisclosure, useEffectOnce, useIsHydrated, useIsServer, useLazyRef, useLifeCycle, useLocationState, useMountEffect, useScrollObserver, useSearch, useSearchParams, useSearchParamsObject, useShallowComparedSelector, useShallowComparedValue, useStorageState, useStore, useThrottleByFrame, useThrottleBySetTimeout, useThrottleByTimer, useToggle, useUnmountEffect };
|
|
542
|
-
//# sourceMappingURL=hooks-
|
|
548
|
+
export { ContextError, createCustomContext, createUseLocationState, createUseStorageState, getErrorMessage, useAfterMountEffect, useAnimateElementRefs, useAnimationInterval, useAsyncEffect, useCallbackRef, useClickOutside, useComposeRefs, useConstant, useCopyToClipboard, useDebouncedFn, useDebouncedState, useDisclosure, useEffectOnce, useIsHydrated, useIsServer, useLazyRef, useLifeCycle, useLocationState, useMountEffect, useScrollObserver, useSearch, useSearchParams, useSearchParamsObject, useShallowComparedSelector, useShallowComparedValue, useStorageState, useStore, useThrottleByFrame, useThrottleBySetTimeout, useThrottleByTimer, useToggle, useUnmountEffect };
|
|
549
|
+
//# sourceMappingURL=hooks-CKFRcgTQ.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"hooks-CKFRcgTQ.js","names":["useCustomContext: UseCustomContext<TContextValue, TStrict>","useAfterMountEffect: typeof useEffect","useLocationState","observedElementRef: RefCallback<TElement>","useStorageState"],"sources":["../../src/hooks/createCustomContext.ts","../../src/hooks/useCallbackRef.ts","../../src/hooks/effects/useAfterMountEffect.ts","../../src/hooks/effects/useAsyncEffect.ts","../../src/hooks/effects/useEffectOnce.ts","../../src/hooks/effects/useLifeCycle.ts","../../src/hooks/effects/useMountEffect.ts","../../src/hooks/effects/useUnMountEffect.ts","../../src/hooks/useAnimateElementRefs.ts","../../src/hooks/useAnimationInterval.ts","../../src/hooks/useClickOutside.ts","../../src/hooks/useComposeRefs.ts","../../src/hooks/useConstant.ts","../../src/hooks/useCopyToClipboard.ts","../../src/hooks/useDebounce.ts","../../src/hooks/useToggle.ts","../../src/hooks/useDisclosure.ts","../../src/hooks/useIsHydrated.ts","../../src/hooks/useIsServer.ts","../../src/hooks/useStore.ts","../../src/hooks/useLocationState.ts","../../src/hooks/useScrollObserver.ts","../../src/hooks/useSearch.ts","../../src/hooks/useSearchParams.ts","../../src/hooks/useShallowCompare.ts","../../src/hooks/useStorageState.ts","../../src/hooks/useThrottle.ts"],"sourcesContent":["import { createContext, use } from \"react\";\n\nexport type CustomContextOptions<TContextValue, TStrict extends boolean> = {\n\tdefaultValue?: TContextValue | null;\n\terrorMessage?: string;\n\textension?: (contextValue: NoInfer<TContextValue> | null) => TContextValue | null;\n\thookName?: string;\n\tname?: string;\n\tproviderName?: string;\n\tstrict?: TStrict;\n};\n\nexport type UseCustomContext<TContextValue, TStrict extends boolean> = () => TStrict extends true ?\n\tTContextValue\n:\tTContextValue | null;\n\nexport const createCustomContext = <TContextValue = null, TStrict extends boolean = true>(\n\toptions: CustomContextOptions<TContextValue, TStrict> = {}\n) => {\n\tconst {\n\t\tdefaultValue = null,\n\t\terrorMessage,\n\t\textension,\n\t\thookName = \"useUnnamedContext\",\n\t\tproviderName = \"UnnamedContextProvider\",\n\t\tname = providerName.endsWith(\"Provider\") ? providerName.slice(0, -8) : \"UnnamedContext\",\n\t\tstrict = true,\n\t} = options;\n\n\tconst Context = createContext<TContextValue>(defaultValue as TContextValue);\n\n\tContext.displayName = name;\n\n\tconst useCustomContext: UseCustomContext<TContextValue, TStrict> = () => {\n\t\tconst contextValue = use(Context);\n\n\t\tconst extendedContextValue = extension?.(contextValue) ?? contextValue;\n\n\t\tif (strict && extendedContextValue === null) {\n\t\t\tthrow new ContextError(errorMessage ?? getErrorMessage(hookName, providerName));\n\t\t}\n\n\t\treturn extendedContextValue as NonNullable<typeof extendedContextValue>;\n\t};\n\n\treturn [Context, useCustomContext] as [\n\t\tProvider: typeof Context,\n\t\tuseCustomContext: typeof useCustomContext,\n\t];\n};\n\nexport class ContextError extends Error {\n\toverride name = \"ContextError\";\n}\n\nexport const getErrorMessage = (hook: string, provider: string) => {\n\treturn `${hook} returned \"null\". Did you forget to wrap the necessary components within ${provider}?`;\n};\n","import type { AnyFunction } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useCallback, useLayoutEffect, useRef } from \"react\";\n\n/**\n * Returns a stable function that always points to the latest version of the callback function.\n * @param callbackFn - The function to reference\n * @returns a stable function that always points to the latest version of the callback function\n */\n\nconst useCallbackRef = <TCallback = AnyFunction>(callbackFn: TCallback | undefined) => {\n\tconst callbackRef = useRef(callbackFn);\n\n\tuseLayoutEffect(() => {\n\t\t// == Doing this instead updating it during render cuz according to Dan Abramov, render should be pure\n\t\tcallbackRef.current = callbackFn;\n\t}, [callbackFn]);\n\n\tconst savedCallback = useCallback(\n\t\t// eslint-disable-next-line ts-eslint/no-unnecessary-condition -- callbackRef.current can be null in some cases\n\t\t(...params: unknown[]) => (callbackRef.current as AnyFunction)?.(...params) as unknown,\n\t\t[]\n\t);\n\n\treturn savedCallback as TCallback;\n};\n\nexport { useCallbackRef };\n","import { useEffect, useRef } from \"react\";\nimport { useCallbackRef } from \"../useCallbackRef\";\n\nconst useAfterMountEffect: typeof useEffect = (callBackFn, deps) => {\n\tconst isFirstMount = useRef(true);\n\tconst stableCallback = useCallbackRef(callBackFn);\n\n\tuseEffect(() => {\n\t\tif (isFirstMount.current) {\n\t\t\tisFirstMount.current = false;\n\t\t\treturn;\n\t\t}\n\n\t\tstableCallback();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps -- stableCallback is stable\n\t}, deps);\n};\nexport { useAfterMountEffect };\n","import { useEffect, useState } from \"react\";\nimport { useCallbackRef } from \"../useCallbackRef\";\n\nexport function useAsyncEffect(\n\teffect: () => Promise<ReturnType<React.EffectCallback>>,\n\tdeps?: React.DependencyList\n) {\n\tconst stableEffectCallback = useCallbackRef(effect);\n\tconst [destroy, setDestroy] = useState<ReturnType<React.EffectCallback>>();\n\n\tuseEffect(() => {\n\t\tconst e = stableEffectCallback();\n\n\t\tasync function execute() {\n\t\t\tsetDestroy(await e);\n\t\t}\n\n\t\tvoid execute();\n\n\t\treturn () => void destroy?.();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps -- stableEffectCallback is stable\n\t}, deps);\n}\n","import { useEffect, useRef } from \"react\";\nimport { useCallbackRef } from \"../useCallbackRef\";\n\nconst useEffectOnce = (callBackFn: React.EffectCallback) => {\n\tconst stableCallback = useCallbackRef(callBackFn);\n\n\tconst effectGuard = useRef(false);\n\n\t// == savedCallback is always stable so no worries about re-execution of this effect\n\tuseEffect(() => {\n\t\tif (effectGuard.current) return;\n\n\t\teffectGuard.current = true;\n\n\t\treturn stableCallback();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps -- stableCallback is stable\n\t}, []);\n};\n\nexport { useEffectOnce };\n","import { useEffect } from \"react\";\nimport { useCallbackRef } from \"../useCallbackRef\";\n\nexport type Destructor = ReturnType<React.EffectCallback>;\n\ntype LifeCycleOptions = {\n\tonMount?: () => void;\n\tonUnmount?: Destructor;\n};\n\nconst useLifeCycle = ({ onMount, onUnmount }: LifeCycleOptions) => {\n\tconst stableOnMount = useCallbackRef(onMount);\n\tconst stableOnUnmount = useCallbackRef(onUnmount);\n\n\tuseEffect(() => {\n\t\tstableOnMount();\n\n\t\treturn stableOnUnmount;\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps -- stableOnMount and stableOnUnmount are stable\n\t}, []);\n};\n\nexport { useLifeCycle };\n","import { useLifeCycle } from \"./useLifeCycle\";\n\nconst useMountEffect = (callBackFn: () => void) => {\n\tuseLifeCycle({ onMount: callBackFn });\n};\n\nexport { useMountEffect };\n","import { type Destructor, useLifeCycle } from \"./useLifeCycle\";\n\nconst useUnmountEffect = (cleanUpFn: Destructor) => useLifeCycle({ onUnmount: cleanUpFn });\n\nexport { useUnmountEffect };\n","import { on } from \"@zayne-labs/toolkit-core\";\nimport { type NonEmptyArray, isArray } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useCallback, useRef } from \"react\";\nimport { useCallbackRef } from \"./useCallbackRef\";\n\ntype ElementsInfoArray<TTargetElement extends string> = NonEmptyArray<{\n\tanimationClass: string;\n\ttargetElement: TTargetElement;\n}>;\n\nconst removeClass = (target: HTMLElement, className: string) => () => target.classList.remove(className);\n\n/**\n * This is a custom React hook that adds and removes animation classes to specified HTML elements.\n * @param elementsInfoArray - An array of objects that contain information about the animation class and the target HTML element.\n * @returns - An object containing the refs of the animated elements and a function to handle the initiation and removal animation.\n */\n\nconst useAnimateElementRefs = <TTargetElement extends string>(\n\telementsInfoArray: ElementsInfoArray<TTargetElement>\n) => {\n\tconst elementsRef = useRef<Record<TTargetElement, HTMLElement | null>>({} as never);\n\n\tconst addAnimationClasses = useCallbackRef(() => {\n\t\tif (!isArray(elementsInfoArray)) {\n\t\t\tconsole.error(\"elementsInfo is not an Array\");\n\t\t\treturn;\n\t\t}\n\n\t\tfor (const { animationClass, targetElement } of elementsInfoArray) {\n\t\t\tif (!elementsRef.current[targetElement]) {\n\t\t\t\tconsole.error(\"ElementError\", `\"${targetElement}\" element does not exist`);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\telementsRef.current[targetElement].classList.add(animationClass);\n\t\t}\n\t});\n\n\tconst removeAnimationClasses = useCallbackRef(() => {\n\t\tif (!isArray(elementsInfoArray)) {\n\t\t\tconsole.error(\"elementsInfo is not an Array\");\n\t\t\treturn;\n\t\t}\n\n\t\tfor (const { animationClass, targetElement } of elementsInfoArray) {\n\t\t\tif (!elementsRef.current[targetElement]) {\n\t\t\t\tconsole.error(\"ElementError\", `\"${targetElement}\" element does not exist`);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\ton(\n\t\t\t\t\"transitionend\",\n\t\t\t\telementsRef.current[targetElement],\n\t\t\t\tremoveClass(elementsRef.current[targetElement], animationClass)\n\t\t\t);\n\n\t\t\ton(\n\t\t\t\t\"animationend\",\n\t\t\t\telementsRef.current[targetElement],\n\t\t\t\tremoveClass(elementsRef.current[targetElement], animationClass)\n\t\t\t);\n\t\t}\n\t});\n\n\t// Add animation classes to elements and remove them after the animation ends\n\tconst handleElementsAnimation = useCallback(() => {\n\t\taddAnimationClasses();\n\n\t\tremoveAnimationClasses();\n\t}, [addAnimationClasses, removeAnimationClasses]);\n\n\treturn { animatedElements: elementsRef.current, handleElementsAnimation };\n};\n\nexport { useAnimateElementRefs };\n","import { type AnimationIntervalOptions, setAnimationInterval } from \"@zayne-labs/toolkit-core\";\nimport type { Prettify } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useEffect, useMemo } from \"react\";\nimport { useCallbackRef } from \"./useCallbackRef\";\n\ntype AnimationOptions = Prettify<\n\tAnimationIntervalOptions & {\n\t\tintervalDuration: number | null;\n\t\tonAnimation: () => void;\n\t}\n>;\n\nconst useAnimationInterval = (options: AnimationOptions) => {\n\tconst { intervalDuration, onAnimation, once } = options;\n\n\tconst latestCallback = useCallbackRef(onAnimation);\n\n\tconst { start, stop } = useMemo(\n\t\t() => setAnimationInterval(latestCallback, intervalDuration, { once }),\n\t\t[intervalDuration, latestCallback, once]\n\t);\n\n\tuseEffect(() => {\n\t\tif (intervalDuration === null) return;\n\n\t\tstart();\n\n\t\treturn stop;\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps -- start and stop are stable\n\t}, [intervalDuration]);\n\n\treturn { start, stop };\n};\n\nexport { useAnimationInterval };\n","import { onClickOutside, toArray } from \"@zayne-labs/toolkit-core\";\nimport { useEffect, useRef } from \"react\";\nimport { useCallbackRef } from \"./useCallbackRef\";\n\ntype UseClickOutsideOptions<TElement extends HTMLElement> = {\n\tenabled?: boolean;\n\tonClick: (event: MouseEvent | TouchEvent) => void;\n\tref?: Array<React.RefObject<TElement>> | React.RefObject<TElement>;\n};\n\nconst useClickOutside = <TElement extends HTMLElement>(options: UseClickOutsideOptions<TElement>) => {\n\tconst innerRef = useRef<TElement>(null);\n\n\tconst { enabled = true, onClick, ref: refOrRefArray = innerRef } = options;\n\n\tconst savedOnClick = useCallbackRef(onClick);\n\n\tuseEffect(() => {\n\t\tif (!enabled) return;\n\n\t\tconst elementArray = toArray(refOrRefArray).map((ref) => ref.current);\n\n\t\tconst cleanup = onClickOutside(elementArray, savedOnClick);\n\n\t\treturn () => cleanup();\n\t}, [enabled, refOrRefArray, savedOnClick]);\n\n\treturn {\n\t\tref: innerRef,\n\t};\n};\n\nexport { useClickOutside };\n","import { useCallback } from \"react\";\nimport { composeRefs, type PossibleRef } from \"@/utils\";\n\nconst useComposeRefs = <TRef extends HTMLElement>(...refs: Array<PossibleRef<TRef>>) => {\n\t// eslint-disable-next-line react-hooks/exhaustive-deps -- Allow\n\tconst mergedRef = useCallback(() => composeRefs(...refs), refs);\n\n\treturn mergedRef;\n};\n\nexport { useComposeRefs };\n","import { useRef } from \"react\";\n\nexport const useConstant = <TResult>(initCallbackFn: () => TResult): TResult => {\n\tconst resultRef = useRef<TResult | null>(null);\n\n\t// eslint-disable-next-line ts-eslint/prefer-nullish-coalescing -- The current case is justified since it's optimizable by the react compiler\n\tif (resultRef.current === null) {\n\t\tresultRef.current = initCallbackFn();\n\t}\n\n\treturn resultRef.current;\n};\n\nexport const useLazyRef = <TResult>(initCallbackFn: () => TResult): React.RefObject<TResult> => {\n\tconst resultRef = useRef<TResult | null>(null);\n\n\t// eslint-disable-next-line ts-eslint/prefer-nullish-coalescing -- The current case is justified since it's optimizable by the react compiler\n\tif (resultRef.current === null) {\n\t\tresultRef.current = initCallbackFn();\n\t}\n\n\treturn resultRef as React.RefObject<TResult>;\n};\n","import { copyToClipboard } from \"@zayne-labs/toolkit-core\";\nimport { useState } from \"react\";\n\nconst useCopyToClipboard = () => {\n\tconst [state, setState] = useState(\"\");\n\n\tconst handleCopy = (value: string) => {\n\t\tsetState(value);\n\t\tvoid copyToClipboard(value);\n\t};\n\n\treturn { copiedValue: state, handleCopy };\n};\n\nexport { useCopyToClipboard };\n","import { debounce } from \"@zayne-labs/toolkit-core\";\nimport type { CallbackFn } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo, useState } from \"react\";\nimport { useUnmountEffect } from \"./effects/useUnMountEffect\";\nimport { useCallbackRef } from \"./useCallbackRef\";\n\nexport const useDebouncedFn = <TParams>(callBackFn: CallbackFn<TParams>, delay: number | undefined) => {\n\tconst latestCallback = useCallbackRef(callBackFn);\n\n\tconst debouncedFn = useMemo(() => debounce(latestCallback, delay), [delay, latestCallback]);\n\n\tuseUnmountEffect(() => {\n\t\tdebouncedFn.cancel();\n\t\tdebouncedFn.cancelMaxWait();\n\t});\n\n\treturn debouncedFn;\n};\n\nexport const useDebouncedState = <TValue>(defaultValue: TValue, delay: number | undefined) => {\n\tconst [value, setValue] = useState(defaultValue);\n\n\tconst setDebouncedValue = useMemo(() => debounce(setValue, delay), [delay]);\n\n\tuseUnmountEffect(() => {\n\t\tsetDebouncedValue.cancel();\n\t\tsetDebouncedValue.cancelMaxWait();\n\t});\n\n\treturn [value, setDebouncedValue, setValue] as const;\n};\n","import { useCallback, useState } from \"react\";\n\ntype InitialState = boolean | (() => boolean);\n\nconst useToggle = (initialValue: InitialState = false) => {\n\tconst [value, setValue] = useState(initialValue);\n\n\tconst toggle = useCallback(<TValue>(newValue?: TValue) => {\n\t\tif (typeof newValue === \"boolean\") {\n\t\t\tsetValue(newValue);\n\t\t\treturn;\n\t\t}\n\n\t\tsetValue((prev) => !prev);\n\t}, []);\n\n\treturn [value, toggle] as const;\n};\n\nexport { useToggle };\n","import { lockScroll } from \"@zayne-labs/toolkit-core\";\nimport { isBoolean } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport { useCallbackRef } from \"./useCallbackRef\";\nimport { useToggle } from \"./useToggle\";\n\ntype DisclosureOptions = {\n\thasScrollControl?: boolean;\n\tinitialState?: boolean | (() => boolean);\n};\n\nconst useDisclosure = (options: DisclosureOptions = {}) => {\n\tconst { hasScrollControl = false, initialState = false } = options;\n\tconst [isOpen, toggleIsOpen] = useToggle(initialState);\n\n\tconst onOpen = useCallbackRef(() => {\n\t\ttoggleIsOpen(true);\n\t\thasScrollControl && lockScroll({ lock: true });\n\t});\n\n\tconst onClose = useCallbackRef(() => {\n\t\ttoggleIsOpen(false);\n\t\thasScrollControl && lockScroll({ lock: false });\n\t});\n\n\tconst onToggle = useCallbackRef(<TValue>(value?: TValue) => {\n\t\tif (isBoolean(value)) {\n\t\t\ttoggleIsOpen(value);\n\t\t\thasScrollControl && lockScroll({ lock: value });\n\t\t\treturn;\n\t\t}\n\n\t\tisOpen ? onClose() : onOpen();\n\t});\n\n\tconst api = useMemo(() => ({ isOpen, onClose, onOpen, onToggle }), [isOpen, onClose, onOpen, onToggle]);\n\n\treturn api;\n};\nexport { useDisclosure };\n","import { useSyncExternalStore } from \"react\";\n\nconst noop = () => {};\n\nconst emptySubscribe = () => noop;\n\n/**\n * @description Return a boolean indicating if the JS has been hydrated already.\n * When doing Server-Side Rendering, the result will always be false.\n * When doing Client-Side Rendering, the result will always be false on the\n * first render and true from then on. Even if a new component renders it will\n * always start with true.\n *\n * @see https://github.com/sergiodxa/remix-utils/blob/main/src/react/use-hydrated.ts\n *\n * @see https://github.com/sergiodxa/remix-utils/blob/main/src/react/use-hydrated.ts\n *\n * @example\n * **Example: Disable a button that needs JS to work.**\n * ```tsx\n * const isHydrated = useIsHydrated();\n *\n * return (\n * <button type=\"button\" disabled={!isHydrated} onClick={doSomethingCustom}>\n * Click me\n * </button>\n * );\n * ```\n */\nexport const useIsHydrated = () => {\n\tconst isHydrated = useSyncExternalStore(\n\t\temptySubscribe,\n\t\t() => true,\n\t\t() => false\n\t);\n\n\treturn isHydrated;\n};\n","import { useSyncExternalStore } from \"react\";\n\nconst noopStore = {\n\tgetServerSnapshot: () => true,\n\tgetSnapshot: () => false,\n\t// eslint-disable-next-line unicorn/consistent-function-scoping -- It's fine\n\tsubscribe: () => () => {},\n};\n\n/**\n * @description Returns whether the component is currently being server side rendered or\n * hydrated on the client. Can be used to delay browser-specific rendering\n * until after hydration.\n */\nconst useIsServer = () => {\n\tconst isServer = useSyncExternalStore(\n\t\tnoopStore.subscribe,\n\t\tnoopStore.getSnapshot,\n\t\tnoopStore.getServerSnapshot\n\t);\n\n\treturn isServer;\n};\n\nexport { useIsServer };\n","import type { StoreApi } from \"@zayne-labs/toolkit-core\";\nimport type { SelectorFn } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useCallback, useDebugValue, useSyncExternalStore } from \"react\";\n\nconst identity = <TState>(value: TState) => value;\n\nconst useStore = <TState, TSlice = TState>(\n\tstore: StoreApi<TState>,\n\tselector: SelectorFn<TState, TSlice> = identity as never\n) => {\n\tconst slice = useSyncExternalStore(\n\t\tstore.subscribe,\n\t\tuseCallback(() => selector(store.getState()), [store, selector]),\n\t\tuseCallback(() => selector(store.getInitialState()), [store, selector])\n\t);\n\n\tuseDebugValue(slice);\n\n\treturn slice;\n};\n\nexport { useStore };\n","import {\n\tcreateLocationStore,\n\ttype LocationInfo,\n\ttype LocationStoreApi,\n\ttype LocationStoreOptions,\n} from \"@zayne-labs/toolkit-core\";\nimport type { SelectorFn } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport { useCallbackRef } from \"./useCallbackRef\";\nimport { useStore } from \"./useStore\";\n\ntype UseLocationResult<TSlice> = [state: TSlice, actions: LocationStoreApi];\n\nexport const createUseLocationState = (options?: LocationStoreOptions) => {\n\tconst locationStore = createLocationStore(options);\n\n\ttype UseBoundLocationState = LocationStoreApi\n\t\t& (<TSlice = LocationInfo>(\n\t\t\tselector?: SelectorFn<LocationInfo, TSlice>\n\t\t) => UseLocationResult<TSlice>);\n\n\tconst useLocationState = <TSlice = LocationInfo>(\n\t\tselector?: SelectorFn<LocationInfo, TSlice>\n\t): UseLocationResult<TSlice> => {\n\t\tconst stateSlice = useStore(locationStore as never, selector);\n\n\t\treturn [stateSlice, locationStore];\n\t};\n\n\tObject.assign(useLocationState, locationStore);\n\n\treturn useLocationState as UseBoundLocationState;\n};\n\nexport const useLocationState = <TSlice = LocationInfo>(\n\tselector?: SelectorFn<LocationInfo, TSlice>,\n\toptions: LocationStoreOptions = {}\n): UseLocationResult<TSlice> => {\n\tconst { equalityFn } = options;\n\n\tconst savedEqualityFn = useCallbackRef(equalityFn);\n\n\tconst locationStore = useMemo(\n\t\t() => createLocationStore({ equalityFn: savedEqualityFn }),\n\t\t[savedEqualityFn]\n\t);\n\n\tconst stateSlice = useStore(locationStore as never, selector);\n\n\treturn [stateSlice, locationStore];\n};\n","import { createScrollObserver, type ScrollObserverOptions } from \"@zayne-labs/toolkit-core\";\nimport { type RefCallback, useMemo, useState } from \"react\";\nimport { useCallbackRef } from \"./useCallbackRef\";\n\nconst useScrollObserver = <TElement extends HTMLElement>(options: ScrollObserverOptions = {}) => {\n\tconst { onIntersection, root, rootMargin = \"10px 0px 0px 0px\", threshold } = options;\n\n\tconst [isScrolled, setIsScrolled] = useState(false);\n\n\tconst savedOnIntersection = useCallbackRef(onIntersection);\n\n\tconst { handleObservation } = useMemo(() => {\n\t\treturn createScrollObserver({\n\t\t\tonIntersection: (entry, observer) => {\n\t\t\t\tconst newIsScrolledState = !entry.isIntersecting;\n\n\t\t\t\tsetIsScrolled(newIsScrolledState);\n\n\t\t\t\t// eslint-disable-next-line no-param-reassign -- Mutation is fine here\n\t\t\t\t(entry.target as HTMLElement).dataset.scrolled = String(newIsScrolledState);\n\n\t\t\t\tsavedOnIntersection(entry, observer);\n\t\t\t},\n\t\t\troot,\n\t\t\trootMargin,\n\t\t\tthreshold,\n\t\t});\n\t}, [root, rootMargin, savedOnIntersection, threshold]);\n\n\tconst observedElementRef: RefCallback<TElement> = useCallbackRef((element) => {\n\t\tconst cleanupFn = handleObservation(element);\n\n\t\t// == React 18 may not call the cleanup function so we need to call it manually on element unmount\n\t\tif (!element) {\n\t\t\tcleanupFn?.();\n\t\t\treturn;\n\t\t}\n\n\t\treturn cleanupFn;\n\t});\n\n\treturn { isScrolled, observedElementRef };\n};\n\nexport { useScrollObserver };\n","import { isPlainObject } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useState } from \"react\";\nimport { useAfterMountEffect } from \"./effects/useAfterMountEffect\";\nimport { useDebouncedFn } from \"./useDebounce\";\n\nconst isSerializable = (item: unknown): item is boolean | number | string =>\n\ttypeof item === \"string\" || typeof item === \"number\" || typeof item === \"boolean\";\n\nconst checkObjectPropsForQuery = (item: Record<string, unknown>, query: string): boolean => {\n\tfor (const value of Object.values(item)) {\n\t\tif (isSerializable(value) && value.toString().toLowerCase().includes(query)) {\n\t\t\treturn true;\n\t\t}\n\t}\n\treturn false;\n};\n\nconst useSearch = <TData>(initialData: TData[], delay?: number) => {\n\tconst [searchQuery, setSearchQuery] = useState(\"\");\n\tconst [filteredData, setFilteredData] = useState(initialData);\n\tconst [isLoading, setIsLoading] = useState(false);\n\n\tconst handleDebouncedSearch = useDebouncedFn(() => {\n\t\tconst query = searchQuery.toLowerCase();\n\n\t\tconst filteredResults = initialData.filter((item) => {\n\t\t\tif (isSerializable(item)) {\n\t\t\t\treturn item.toString().toLowerCase().includes(query);\n\t\t\t}\n\n\t\t\tif (isPlainObject(item)) {\n\t\t\t\treturn checkObjectPropsForQuery(item, query);\n\t\t\t}\n\n\t\t\treturn false;\n\t\t});\n\n\t\tsetFilteredData(filteredResults);\n\t\tsetIsLoading(false);\n\t}, delay);\n\n\tuseAfterMountEffect(() => {\n\t\tsetIsLoading(true);\n\t\thandleDebouncedSearch();\n\t}, [searchQuery]);\n\n\treturn { data: filteredData, isLoading, query: searchQuery, setQuery: setSearchQuery };\n};\n\nexport { useSearch };\n","import {\n\ttype LocationStoreOptions,\n\ttype URLSearchParamsInit,\n\tcreateSearchParams,\n} from \"@zayne-labs/toolkit-core\";\nimport { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useLocationState } from \"./useLocationState\";\n\ntype UseSearchParamsOptions = LocationStoreOptions & {\n\taction?: \"push\" | \"replace\";\n};\n\nexport const useSearchParams = <TSearchParams extends URLSearchParamsInit>(\n\toptions?: UseSearchParamsOptions\n) => {\n\tconst { action = \"push\", ...restOfOptions } = options ?? {};\n\n\tconst [searchParams, actions] = useLocationState((state) => state.search, restOfOptions);\n\n\tconst setSearchParams = (\n\t\tnewQueryParams: TSearchParams | ((prev: URLSearchParams) => TSearchParams)\n\t) => {\n\t\tconst params = isFunction(newQueryParams) ? newQueryParams(searchParams) : newQueryParams;\n\n\t\tconst nextSearchParams = createSearchParams(params);\n\n\t\tactions[action]({ search: nextSearchParams });\n\t};\n\n\tsetSearchParams.triggerPopstateEvent = actions.triggerPopstateEvent;\n\n\treturn [searchParams, setSearchParams] as const;\n};\n\nexport const useSearchParamsObject = <TSearchParams extends Record<string, string>>(\n\toptions?: UseSearchParamsOptions\n) => {\n\tconst [searchParams, setSearchParams] = useSearchParams(options);\n\n\tconst searchParamsObject = Object.fromEntries(searchParams) as TSearchParams;\n\n\tconst setSearchParamsObject = (\n\t\tnewQueryParams: TSearchParams | ((prev: TSearchParams) => TSearchParams)\n\t) => {\n\t\tconst params = isFunction(newQueryParams) ? newQueryParams(searchParamsObject) : newQueryParams;\n\n\t\tsetSearchParams(params);\n\t};\n\n\tsetSearchParamsObject.triggerPopstateEvent = setSearchParams.triggerPopstateEvent;\n\n\treturn [searchParamsObject, setSearchParamsObject] as const;\n};\n","import { shallowCompare } from \"@zayne-labs/toolkit-core\";\nimport type { SelectorFn } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useRef } from \"react\";\n\nexport const useShallowComparedSelector = <TState, TResult>(selector: SelectorFn<TState, TResult>) => {\n\tconst prevStateRef = useRef<TResult>(undefined as never);\n\n\tconst shallowSelector = (state: TState) => {\n\t\tconst nextState = selector(state);\n\n\t\tif (shallowCompare(prevStateRef.current, nextState)) {\n\t\t\treturn prevStateRef.current;\n\t\t}\n\n\t\treturn (prevStateRef.current = nextState);\n\t};\n\n\treturn shallowSelector;\n};\n\nexport const useShallowComparedValue = <TValue>(value: TValue) => {\n\tconst prevValueRef = useRef<TValue>(value);\n\n\tif (shallowCompare(prevValueRef.current, value)) {\n\t\treturn prevValueRef.current;\n\t}\n\n\treturn (prevValueRef.current = value);\n};\n","import {\n\tcreateExternalStorageStore,\n\ttype StorageOptions,\n\ttype StorageStoreApi,\n} from \"@zayne-labs/toolkit-core\";\nimport type { SelectorFn } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport { useCallbackRef } from \"./useCallbackRef\";\nimport { useStore } from \"./useStore\";\n\ntype UseStorageResult<TState, TSlice = TState> = [state: TSlice, actions: StorageStoreApi<TState>];\n\n/**\n * @description Creates a custom hook that returns a storage state and actions to modify it. You can use this if you need shared options.\n * @note You must use this if you want to be able to prevent syncing state across tabs.\n */\nexport const createUseStorageState = <TState>(baseOptions: StorageOptions<TState>) => {\n\tconst externalStore = createExternalStorageStore(baseOptions);\n\n\ttype UseBoundStorageState = StorageStoreApi<TState>\n\t\t& (<TSlice = TState>(selector?: SelectorFn<TState, TSlice>) => UseStorageResult<TState, TSlice>);\n\n\tconst useStorageState = <TSlice = TState>(\n\t\tselector?: SelectorFn<TState, TSlice>\n\t): UseStorageResult<TState, TSlice> => {\n\t\tconst stateInStorage = useStore(externalStore, selector);\n\n\t\treturn [stateInStorage, externalStore];\n\t};\n\n\tObject.assign(useStorageState, externalStore);\n\n\treturn useStorageState as UseBoundStorageState;\n};\n\ntype UseStorageStateOptions<TValue> = Omit<StorageOptions<TValue>, \"initialValue\" | \"key\">;\n\nexport const useStorageState = <TValue, TSlice = TValue>(\n\tkey: string,\n\tinitialValue?: TValue,\n\toptions?: UseStorageStateOptions<TValue> & { select?: SelectorFn<TValue, TSlice> }\n): UseStorageResult<TValue, TSlice> => {\n\tconst { equalityFn, logger, parser, partialize, select, serializer, storageArea, syncStateAcrossTabs } =\n\t\toptions ?? {};\n\n\tconst savedEquality = useCallbackRef(equalityFn);\n\tconst savedLogger = useCallbackRef(logger);\n\tconst savedParser = useCallbackRef(parser);\n\tconst savedPartialize = useCallbackRef(partialize);\n\tconst savedSerializer = useCallbackRef(serializer);\n\n\tconst externalStore = useMemo(() => {\n\t\treturn createExternalStorageStore({\n\t\t\tequalityFn: savedEquality,\n\t\t\tinitialValue,\n\t\t\tkey,\n\t\t\tlogger: savedLogger,\n\t\t\tparser: savedParser,\n\t\t\tpartialize: savedPartialize,\n\t\t\tserializer: savedSerializer,\n\t\t\tstorageArea,\n\t\t\tsyncStateAcrossTabs,\n\t\t});\n\t}, [\n\t\tinitialValue,\n\t\tkey,\n\t\tsavedEquality,\n\t\tsavedLogger,\n\t\tsavedParser,\n\t\tsavedPartialize,\n\t\tsavedSerializer,\n\t\tstorageArea,\n\t\tsyncStateAcrossTabs,\n\t]);\n\n\tconst stateInStorage = useStore(externalStore as never, select as never);\n\n\treturn [stateInStorage as never, externalStore];\n};\n","import { throttleByFrame, throttleBySetTimeout, throttleByTime } from \"@zayne-labs/toolkit-core\";\nimport type { CallbackFn } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useMemo } from \"react\";\nimport { useUnmountEffect } from \"./effects\";\nimport { useCallbackRef } from \"./useCallbackRef\";\nimport { useConstant } from \"./useConstant\";\n\nexport const useThrottleBySetTimeout = <TParams>(callbackFn: CallbackFn<TParams>, delay: number) => {\n\tconst latestCallback = useCallbackRef(callbackFn);\n\n\tconst throttledCallback = useMemo(\n\t\t() => throttleBySetTimeout(latestCallback, delay),\n\t\t[delay, latestCallback]\n\t);\n\n\tuseUnmountEffect(() => throttledCallback.cancelTimeout());\n\n\treturn throttledCallback;\n};\n\nexport const useThrottleByTimer = <TParams>(callbackFn: CallbackFn<TParams>, delay: number) => {\n\tconst latestCallback = useCallbackRef(callbackFn);\n\n\tconst throttledCallback = useMemo(() => throttleByTime(latestCallback, delay), [delay, latestCallback]);\n\n\treturn throttledCallback;\n};\n\nexport const useThrottleByFrame = <TParams>(callbackFn: CallbackFn<TParams>) => {\n\tconst latestCallback = useCallbackRef(callbackFn);\n\n\tconst throttledCallback = useConstant(() => throttleByFrame(latestCallback));\n\n\tuseUnmountEffect(() => throttledCallback.cancelAnimation());\n\n\treturn throttledCallback;\n};\n"],"mappings":"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"}
|
|
@@ -0,0 +1,225 @@
|
|
|
1
|
+
import * as react11 from "react";
|
|
2
|
+
import { RefCallback } from "react";
|
|
3
|
+
import { AnyFunction, AnyObject, CallbackFn, EmptyObject, Prettify, UnionDiscriminator, UnionToIntersection, UnknownObject } from "@zayne-labs/toolkit-type-helpers";
|
|
4
|
+
|
|
5
|
+
//#region src/utils/composeEventHandlers.d.ts
|
|
6
|
+
declare const composeTwoEventHandlers: (formerHandler: AnyFunction | undefined, latterHandler: AnyFunction | undefined) => (event: unknown) => unknown;
|
|
7
|
+
declare const composeEventHandlers: (...eventHandlerArray: Array<AnyFunction | undefined>) => (event: unknown) => unknown;
|
|
8
|
+
//#endregion
|
|
9
|
+
//#region src/utils/composeRefs.d.ts
|
|
10
|
+
type PossibleRef<TRef extends HTMLElement> = React.Ref<TRef> | undefined;
|
|
11
|
+
/**
|
|
12
|
+
* @description Set a given ref to a given value.
|
|
13
|
+
*
|
|
14
|
+
* This utility takes care of different types of refs: callback refs and RefObject(s)
|
|
15
|
+
*/
|
|
16
|
+
declare const setRef: <TRef extends HTMLElement>(ref: PossibleRef<TRef>, node: TRef | null) => ReturnType<RefCallback<TRef>>;
|
|
17
|
+
/**
|
|
18
|
+
* @description A utility to combine refs. Accepts callback refs and RefObject(s)
|
|
19
|
+
*/
|
|
20
|
+
declare const composeRefs: <TRef extends HTMLElement>(...refs: Array<PossibleRef<TRef>>) => RefCallback<TRef>;
|
|
21
|
+
//#endregion
|
|
22
|
+
//#region src/utils/getSlot/getSlot.d.ts
|
|
23
|
+
type FunctionalComponent<TProps extends UnknownObject = never> = React.FunctionComponent<TProps>;
|
|
24
|
+
/**
|
|
25
|
+
* @description Checks if a react child (within the children array) matches the provided SlotComponent using multiple matching strategies:
|
|
26
|
+
* 1. Matches by slot symbol property
|
|
27
|
+
* 2. Matches by component name
|
|
28
|
+
*/
|
|
29
|
+
declare const matchesSlotComponent: (child: React.ReactNode, SlotComponent: FunctionalComponent) => boolean;
|
|
30
|
+
/**
|
|
31
|
+
* @description Checks if a react child (within the children array) matches any of the provided SlotComponents.
|
|
32
|
+
*/
|
|
33
|
+
declare const matchesAnySlotComponent: (child: React.ReactNode, SlotComponents: FunctionalComponent[]) => boolean;
|
|
34
|
+
type SlotOptions = {
|
|
35
|
+
/**
|
|
36
|
+
* @description The error message to throw when multiple slots are found for a given slot component
|
|
37
|
+
*/
|
|
38
|
+
errorMessage?: string;
|
|
39
|
+
/**
|
|
40
|
+
* @description When true, an AssertionError will be thrown if multiple slots are found for a given slot component
|
|
41
|
+
*/
|
|
42
|
+
throwOnMultipleSlotMatch?: boolean;
|
|
43
|
+
};
|
|
44
|
+
/**
|
|
45
|
+
* @description Retrieves a single slot element from a collection of React children that matches the provided SlotComponent component.
|
|
46
|
+
*
|
|
47
|
+
* @throws { AssertionError } when throwOnMultipleSlotMatch is true and multiple slots are found
|
|
48
|
+
*/
|
|
49
|
+
declare const getSingleSlot: (children: React.ReactNode, SlotComponent: FunctionalComponent, options?: SlotOptions) => react11.ReactNode;
|
|
50
|
+
type MultipleSlotsOptions = {
|
|
51
|
+
/**
|
|
52
|
+
* @description The error message to throw when multiple slots are found for a given slot component
|
|
53
|
+
* If a string is provided, the same message will be used for all slot components
|
|
54
|
+
* If an array is provided, each string in the array will be used as the errorMessage for the corresponding slot component
|
|
55
|
+
*/
|
|
56
|
+
errorMessage?: string | string[];
|
|
57
|
+
/**
|
|
58
|
+
* @description When true, an AssertionError will be thrown if multiple slots are found for a given slot component
|
|
59
|
+
* If a boolean is provided, the same value will be used for all slot components
|
|
60
|
+
* If an array is provided, each boolean in the array will be used as the throwOnMultipleSlotMatch value for the corresponding slot component
|
|
61
|
+
*/
|
|
62
|
+
throwOnMultipleSlotMatch?: boolean | boolean[];
|
|
63
|
+
};
|
|
64
|
+
type GetMultipleSlotsResult<TSlotComponents extends FunctionalComponent[]> = {
|
|
65
|
+
regularChildren: React.ReactNode[];
|
|
66
|
+
slots: { [Key in keyof TSlotComponents]: ReturnType<TSlotComponents[Key]> };
|
|
67
|
+
};
|
|
68
|
+
/**
|
|
69
|
+
* @description The same as getSingleSlot, but for multiple slot components
|
|
70
|
+
*/
|
|
71
|
+
declare const getMultipleSlots: <const TSlotComponents extends FunctionalComponent[]>(children: React.ReactNode, SlotComponents: TSlotComponents, options?: MultipleSlotsOptions) => Prettify<GetMultipleSlotsResult<TSlotComponents>>;
|
|
72
|
+
/**
|
|
73
|
+
* @description Returns all children that are not slot elements (i.e., don't match any of the provided slot components)
|
|
74
|
+
*/
|
|
75
|
+
declare const getRegularChildren: (children: React.ReactNode, SlotComponentOrComponents: FunctionalComponent | FunctionalComponent[]) => react11.ReactNode[];
|
|
76
|
+
//#endregion
|
|
77
|
+
//#region src/utils/getSlotMap/getSlotMap.d.ts
|
|
78
|
+
type GetSlotName<TSlotComponentProps extends GetSlotComponentProps> = string extends TSlotComponentProps["name"] ? never : "default" extends TSlotComponentProps["name"] ? never : TSlotComponentProps["name"];
|
|
79
|
+
type GetSpecificSlotsType<TSlotComponentProps extends GetSlotComponentProps> = { [TName in keyof TSlotComponentProps as GetSlotName<TSlotComponentProps>]: Extract<TSlotComponentProps["children"], React.ReactNode> };
|
|
80
|
+
/**
|
|
81
|
+
* Maps slot names to their corresponding children types
|
|
82
|
+
*/
|
|
83
|
+
type GetSlotMapResult<TSlotComponentProps extends GetSlotComponentProps> = UnionToIntersection<GetSpecificSlotsType<TSlotComponentProps>> & {
|
|
84
|
+
default: React.ReactNode[];
|
|
85
|
+
};
|
|
86
|
+
/**
|
|
87
|
+
* Symbol used to identify SlotComponent instances
|
|
88
|
+
*/
|
|
89
|
+
declare const slotComponentSymbol: unique symbol;
|
|
90
|
+
/**
|
|
91
|
+
* @description Creates a map of named slots from React children. Returns an object mapping slot names to their children,
|
|
92
|
+
* with a default slot for unmatched children.
|
|
93
|
+
*
|
|
94
|
+
* @example
|
|
95
|
+
* ```tsx
|
|
96
|
+
* import { type GetSlotComponentProps, SlotComponent } from "@zayne-labs/toolkit-react/utils"
|
|
97
|
+
*
|
|
98
|
+
* type SlotProps = GetSlotComponentProps<"header" | "footer">;
|
|
99
|
+
*
|
|
100
|
+
* function Parent({ children }: { children: React.ReactNode }) {
|
|
101
|
+
* const slots = getSlotMap<SlotProps>(children);
|
|
102
|
+
*
|
|
103
|
+
* return (
|
|
104
|
+
* <div>
|
|
105
|
+
* <header>{slots.header}</header>
|
|
106
|
+
* <main>{slots.default}</main>
|
|
107
|
+
* <footer>{slots.footer}</footer>
|
|
108
|
+
* </div>
|
|
109
|
+
* );
|
|
110
|
+
* }
|
|
111
|
+
* ```
|
|
112
|
+
*
|
|
113
|
+
* Usage:
|
|
114
|
+
* ```tsx
|
|
115
|
+
* <Parent>
|
|
116
|
+
* <SlotComponent name="header">Header Content</SlotComponent>
|
|
117
|
+
* <div>Random stuff</div>
|
|
118
|
+
* <SlotComponent name="footer">Footer Content</SlotComponent>
|
|
119
|
+
* </Parent>
|
|
120
|
+
* ```
|
|
121
|
+
*/
|
|
122
|
+
declare const getSlotMap: <TSlotComponentProps extends GetSlotComponentProps>(children: React.ReactNode) => Prettify<GetSlotMapResult<TSlotComponentProps>>;
|
|
123
|
+
/**
|
|
124
|
+
* @description Produce props for the SlotComponent
|
|
125
|
+
*
|
|
126
|
+
* @example
|
|
127
|
+
* ```ts
|
|
128
|
+
* // Pattern One (slot or slots have same children type, which is just React.ReactNode by default)
|
|
129
|
+
* type SlotProps = GetSlotComponentProps<"header" | "content" | "footer">;
|
|
130
|
+
*
|
|
131
|
+
* // Pattern Two (some slots can have different children type)
|
|
132
|
+
* type SlotProps = GetSlotComponentProps<"header", React.ReactNode> | GetSlotComponentProps<"header", (renderProp: RenderProp) => React.ReactNode>;
|
|
133
|
+
* ```
|
|
134
|
+
*/
|
|
135
|
+
type GetSlotComponentProps<TName extends string = string, TChildren extends CallbackFn<never, React.ReactNode> | React.ReactNode = CallbackFn<never, React.ReactNode> | React.ReactNode> = {
|
|
136
|
+
children: TChildren;
|
|
137
|
+
/**
|
|
138
|
+
* Name of the slot where content should be rendered
|
|
139
|
+
*/
|
|
140
|
+
name: TName;
|
|
141
|
+
};
|
|
142
|
+
/**
|
|
143
|
+
* @description Creates a slot component
|
|
144
|
+
*/
|
|
145
|
+
declare const createSlotComponent: <TSlotComponentProps extends GetSlotComponentProps>() => {
|
|
146
|
+
(props: TSlotComponentProps): React.ReactNode;
|
|
147
|
+
slotSymbol: typeof slotComponentSymbol;
|
|
148
|
+
};
|
|
149
|
+
type SlotWithNameAndSymbol<TSlotComponentProps extends GetSlotComponentProps = GetSlotComponentProps, TOtherProps extends UnknownObject = EmptyObject> = {
|
|
150
|
+
(props: Pick<TSlotComponentProps, "children"> & TOtherProps): React.ReactNode;
|
|
151
|
+
readonly slotName?: TSlotComponentProps["name"];
|
|
152
|
+
readonly slotSymbol?: symbol;
|
|
153
|
+
};
|
|
154
|
+
/**
|
|
155
|
+
* @description Adds a slot symbol and name to a slot component passed in
|
|
156
|
+
*/
|
|
157
|
+
declare const withSlotNameAndSymbol: <TSlotComponentProps extends GetSlotComponentProps, TOtherProps extends UnknownObject = EmptyObject>(name: TSlotComponentProps["name"], SlotComponent?: SlotWithNameAndSymbol<TSlotComponentProps, TOtherProps>) => SlotWithNameAndSymbol<TSlotComponentProps, TOtherProps>;
|
|
158
|
+
//#endregion
|
|
159
|
+
//#region src/utils/mergeProps.d.ts
|
|
160
|
+
type UnionToIntersection$1<TUnion> = (TUnion extends unknown ? (param: TUnion) => void : "") extends ((param: infer TParam) => void) ? TParam : "";
|
|
161
|
+
/**
|
|
162
|
+
* Merges multiple sets of React props.
|
|
163
|
+
*
|
|
164
|
+
* - It follows the Object.assign pattern where the rightmost object's fields overwrite
|
|
165
|
+
* the conflicting ones from others. This doesn't apply to event handlers, `className` and `style` props.
|
|
166
|
+
* - Event handlers are merged such that they are called in sequence (the rightmost one being called first),
|
|
167
|
+
* and allows the user to prevent the previous event handlers from being executed by calling the `preventDefault` method.
|
|
168
|
+
* - It also merges the `className` and `style` props, whereby the classes are concatenated
|
|
169
|
+
* and the rightmost styles overwrite the previous ones.
|
|
170
|
+
*
|
|
171
|
+
* @important **`ref` is not merged.**
|
|
172
|
+
* @param props props to merge.
|
|
173
|
+
* @returns the merged props.
|
|
174
|
+
*/
|
|
175
|
+
declare const mergeProps: <TProps extends Record<never, never>>(...propsObjectArray: Array<TProps | undefined>) => UnionToIntersection$1<TProps>;
|
|
176
|
+
//#endregion
|
|
177
|
+
//#region src/utils/mergeTwoProps.d.ts
|
|
178
|
+
declare const mergeTwoProps: <TProps extends Record<never, never>>(formerProps: TProps | undefined, latterProps: TProps | undefined) => TProps;
|
|
179
|
+
//#endregion
|
|
180
|
+
//#region src/utils/types/common.d.ts
|
|
181
|
+
type ForwardedRefType<TComponent extends HTMLElement | React.ElementType> = TComponent extends React.ElementType ? React.ForwardedRef<React.Ref<TComponent>> : React.ForwardedRef<TComponent>;
|
|
182
|
+
type InferProps<TComponent extends HTMLElement | React.ElementType> = TComponent extends React.ElementType ? React.ComponentPropsWithRef<TComponent> : React.HTMLAttributes<TComponent>;
|
|
183
|
+
type StateSetter<TSetter = unknown> = React.Dispatch<React.SetStateAction<TSetter>>;
|
|
184
|
+
type CssWithCustomProperties<TExtra extends Record<string, string> = NonNullable<unknown>> = React.CSSProperties & Record<`--${string}`, string> & TExtra;
|
|
185
|
+
type DefaultRenderItemErrorMessages = {
|
|
186
|
+
children: "Hey, Sorry but the children prop is redundant since you're currently using the render prop to do the same thing";
|
|
187
|
+
renderItem: "Hey, Sorry but the renderItem prop is redundant since you're currently using the children prop to do the same thing";
|
|
188
|
+
};
|
|
189
|
+
/**
|
|
190
|
+
* @description Represents a set of props that can be used to render a component conditionally based on a discriminated union type.
|
|
191
|
+
* This type allows for the use of either a render prop or children prop, but not both at the same time.
|
|
192
|
+
* If both are provided, a TypeScript error will be thrown.
|
|
193
|
+
* @template TErrorMessages An object of custom messages to display on the disallowed property.
|
|
194
|
+
*/
|
|
195
|
+
type DiscriminatedRenderItemProps<TRenderItemPropType, TErrorMessages extends Record<keyof DefaultRenderItemErrorMessages, string> = DefaultRenderItemErrorMessages> = UnionDiscriminator<[{
|
|
196
|
+
children: TRenderItemPropType;
|
|
197
|
+
}, {
|
|
198
|
+
renderItem: TRenderItemPropType;
|
|
199
|
+
}], TErrorMessages>;
|
|
200
|
+
type DefaultRenderErrorMessages = {
|
|
201
|
+
children: "Hey, Sorry but the children prop is redundant since you're currently using the render prop to do the same thing";
|
|
202
|
+
render: "Hey, Sorry but the render prop is redundant since you're currently using the children prop to do the same thing";
|
|
203
|
+
};
|
|
204
|
+
/**
|
|
205
|
+
* @description Represents a set of props that can be used to render a component conditionally based on a discriminated union type.
|
|
206
|
+
* This type allows for the use of either a render prop or children prop, but not both at the same time.
|
|
207
|
+
* If both are provided, a TypeScript error will be thrown.
|
|
208
|
+
* @template TErrorMessages An object of custom messages to display on the disallowed property.
|
|
209
|
+
*/
|
|
210
|
+
type DiscriminatedRenderProps<TRenderPropType, TErrorMessages extends Record<keyof DefaultRenderErrorMessages, string> = DefaultRenderErrorMessages> = UnionDiscriminator<[{
|
|
211
|
+
children: TRenderPropType;
|
|
212
|
+
}, {
|
|
213
|
+
render: TRenderPropType;
|
|
214
|
+
}], TErrorMessages>;
|
|
215
|
+
//#endregion
|
|
216
|
+
//#region src/utils/types/polymorphism.d.ts
|
|
217
|
+
type AsProp<TElement extends React.ElementType> = {
|
|
218
|
+
as?: TElement;
|
|
219
|
+
};
|
|
220
|
+
type InferRemainingProps<TElement extends React.ElementType, TProps> = Omit<InferProps<TElement>, keyof TProps>;
|
|
221
|
+
type MergedGivenPropsWithAs<TElement extends React.ElementType, TProps> = Prettify<Omit<AsProp<TElement>, keyof TProps> & TProps>;
|
|
222
|
+
type PolymorphicProps<TElement extends React.ElementType, TProps extends AnyObject = NonNullable<unknown>> = MergedGivenPropsWithAs<TElement, TProps> & InferRemainingProps<TElement, TProps>;
|
|
223
|
+
//#endregion
|
|
224
|
+
export { AsProp, CssWithCustomProperties, DefaultRenderErrorMessages, DefaultRenderItemErrorMessages, DiscriminatedRenderItemProps, DiscriminatedRenderProps, ForwardedRefType, FunctionalComponent, GetSlotComponentProps, GetSlotMapResult, InferProps, PolymorphicProps, PossibleRef, StateSetter, composeEventHandlers, composeRefs, composeTwoEventHandlers, createSlotComponent, getMultipleSlots, getRegularChildren, getSingleSlot, getSlotMap, matchesAnySlotComponent, matchesSlotComponent, mergeProps, mergeTwoProps, setRef, slotComponentSymbol, withSlotNameAndSymbol };
|
|
225
|
+
//# sourceMappingURL=index-CByHxS0M.d.ts.map
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { PossibleRef } from "./index-CByHxS0M.js";
|
|
1
2
|
import * as react1 from "react";
|
|
2
3
|
import { RefCallback, useEffect } from "react";
|
|
3
4
|
import * as _zayne_labs_toolkit_core0 from "@zayne-labs/toolkit-core";
|
|
@@ -90,6 +91,9 @@ declare const useClickOutside: <TElement extends HTMLElement>(options: UseClickO
|
|
|
90
91
|
ref: react1.RefObject<TElement | null>;
|
|
91
92
|
};
|
|
92
93
|
//#endregion
|
|
94
|
+
//#region src/hooks/useComposeRefs.d.ts
|
|
95
|
+
declare const useComposeRefs: <TRef extends HTMLElement>(...refs: Array<PossibleRef<TRef>>) => () => react1.RefCallback<TRef>;
|
|
96
|
+
//#endregion
|
|
93
97
|
//#region src/hooks/useConstant.d.ts
|
|
94
98
|
declare const useConstant: <TResult>(initCallbackFn: () => TResult) => TResult;
|
|
95
99
|
declare const useLazyRef: <TResult>(initCallbackFn: () => TResult) => React.RefObject<TResult>;
|
|
@@ -238,5 +242,5 @@ declare const useThrottleByFrame: <TParams>(callbackFn: CallbackFn<TParams>) =>
|
|
|
238
242
|
type InitialState = boolean | (() => boolean);
|
|
239
243
|
declare const useToggle: (initialValue?: InitialState) => readonly [boolean, <TValue>(newValue?: TValue) => void];
|
|
240
244
|
//#endregion
|
|
241
|
-
export { ContextError, CustomContextOptions, UseCustomContext, createCustomContext, createUseLocationState, createUseStorageState, getErrorMessage, useAfterMountEffect, useAnimateElementRefs, useAnimationInterval, useAsyncEffect, useCallbackRef, useClickOutside, useConstant, useCopyToClipboard, useDebouncedFn, useDebouncedState, useDisclosure, useEffectOnce, useIsHydrated, useIsServer, useLazyRef, useLifeCycle, useLocationState, useMountEffect, useScrollObserver, useSearch, useSearchParams, useSearchParamsObject, useShallowComparedSelector, useShallowComparedValue, useStorageState, useStore, useThrottleByFrame, useThrottleBySetTimeout, useThrottleByTimer, useToggle, useUnmountEffect };
|
|
242
|
-
//# sourceMappingURL=index-
|
|
245
|
+
export { ContextError, CustomContextOptions, UseCustomContext, createCustomContext, createUseLocationState, createUseStorageState, getErrorMessage, useAfterMountEffect, useAnimateElementRefs, useAnimationInterval, useAsyncEffect, useCallbackRef, useClickOutside, useComposeRefs, useConstant, useCopyToClipboard, useDebouncedFn, useDebouncedState, useDisclosure, useEffectOnce, useIsHydrated, useIsServer, useLazyRef, useLifeCycle, useLocationState, useMountEffect, useScrollObserver, useSearch, useSearchParams, useSearchParamsObject, useShallowComparedSelector, useShallowComparedValue, useStorageState, useStore, useThrottleByFrame, useThrottleBySetTimeout, useThrottleByTimer, useToggle, useUnmountEffect };
|
|
246
|
+
//# sourceMappingURL=index-Dc35xGUv.d.ts.map
|
|
@@ -1,225 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
3
|
-
import { AnyFunction, AnyObject, CallbackFn, EmptyObject, Prettify, UnionDiscriminator, UnionToIntersection, UnknownObject } from "@zayne-labs/toolkit-type-helpers";
|
|
4
|
-
|
|
5
|
-
//#region src/utils/composeEventHandlers.d.ts
|
|
6
|
-
declare const composeTwoEventHandlers: (formerHandler: AnyFunction | undefined, latterHandler: AnyFunction | undefined) => (event: unknown) => unknown;
|
|
7
|
-
declare const composeEventHandlers: (...eventHandlerArray: Array<AnyFunction | undefined>) => (event: unknown) => unknown;
|
|
8
|
-
//#endregion
|
|
9
|
-
//#region src/utils/composeRefs.d.ts
|
|
10
|
-
type PossibleRef<TRef extends HTMLElement> = React.Ref<TRef> | undefined;
|
|
11
|
-
/**
|
|
12
|
-
* @description Set a given ref to a given value.
|
|
13
|
-
*
|
|
14
|
-
* This utility takes care of different types of refs: callback refs and RefObject(s)
|
|
15
|
-
*/
|
|
16
|
-
declare const setRef: <TRef extends HTMLElement>(ref: PossibleRef<TRef>, node: TRef | null) => ReturnType<RefCallback<TRef>>;
|
|
17
|
-
/**
|
|
18
|
-
* @description A utility to combine refs. Accepts callback refs and RefObject(s)
|
|
19
|
-
*/
|
|
20
|
-
declare const composeRefs: <TRef extends HTMLElement>(...refs: Array<PossibleRef<TRef>>) => RefCallback<TRef>;
|
|
21
|
-
//#endregion
|
|
22
|
-
//#region src/utils/getSlot/getSlot.d.ts
|
|
23
|
-
type FunctionalComponent<TProps extends UnknownObject = never> = React.FunctionComponent<TProps>;
|
|
24
|
-
/**
|
|
25
|
-
* @description Checks if a react child (within the children array) matches the provided SlotComponent using multiple matching strategies:
|
|
26
|
-
* 1. Matches by slot symbol property
|
|
27
|
-
* 2. Matches by component name
|
|
28
|
-
*/
|
|
29
|
-
declare const matchesSlotComponent: (child: React.ReactNode, SlotComponent: FunctionalComponent) => boolean;
|
|
30
|
-
/**
|
|
31
|
-
* @description Checks if a react child (within the children array) matches any of the provided SlotComponents.
|
|
32
|
-
*/
|
|
33
|
-
declare const matchesAnySlotComponent: (child: React.ReactNode, SlotComponents: FunctionalComponent[]) => boolean;
|
|
34
|
-
type SlotOptions = {
|
|
35
|
-
/**
|
|
36
|
-
* @description The error message to throw when multiple slots are found for a given slot component
|
|
37
|
-
*/
|
|
38
|
-
errorMessage?: string;
|
|
39
|
-
/**
|
|
40
|
-
* @description When true, an AssertionError will be thrown if multiple slots are found for a given slot component
|
|
41
|
-
*/
|
|
42
|
-
throwOnMultipleSlotMatch?: boolean;
|
|
43
|
-
};
|
|
44
|
-
/**
|
|
45
|
-
* @description Retrieves a single slot element from a collection of React children that matches the provided SlotComponent component.
|
|
46
|
-
*
|
|
47
|
-
* @throws { AssertionError } when throwOnMultipleSlotMatch is true and multiple slots are found
|
|
48
|
-
*/
|
|
49
|
-
declare const getSingleSlot: (children: React.ReactNode, SlotComponent: FunctionalComponent, options?: SlotOptions) => react10.ReactNode;
|
|
50
|
-
type MultipleSlotsOptions = {
|
|
51
|
-
/**
|
|
52
|
-
* @description The error message to throw when multiple slots are found for a given slot component
|
|
53
|
-
* If a string is provided, the same message will be used for all slot components
|
|
54
|
-
* If an array is provided, each string in the array will be used as the errorMessage for the corresponding slot component
|
|
55
|
-
*/
|
|
56
|
-
errorMessage?: string | string[];
|
|
57
|
-
/**
|
|
58
|
-
* @description When true, an AssertionError will be thrown if multiple slots are found for a given slot component
|
|
59
|
-
* If a boolean is provided, the same value will be used for all slot components
|
|
60
|
-
* If an array is provided, each boolean in the array will be used as the throwOnMultipleSlotMatch value for the corresponding slot component
|
|
61
|
-
*/
|
|
62
|
-
throwOnMultipleSlotMatch?: boolean | boolean[];
|
|
63
|
-
};
|
|
64
|
-
type GetMultipleSlotsResult<TSlotComponents extends FunctionalComponent[]> = {
|
|
65
|
-
regularChildren: React.ReactNode[];
|
|
66
|
-
slots: { [Key in keyof TSlotComponents]: ReturnType<TSlotComponents[Key]> };
|
|
67
|
-
};
|
|
68
|
-
/**
|
|
69
|
-
* @description The same as getSingleSlot, but for multiple slot components
|
|
70
|
-
*/
|
|
71
|
-
declare const getMultipleSlots: <const TSlotComponents extends FunctionalComponent[]>(children: React.ReactNode, SlotComponents: TSlotComponents, options?: MultipleSlotsOptions) => Prettify<GetMultipleSlotsResult<TSlotComponents>>;
|
|
72
|
-
/**
|
|
73
|
-
* @description Returns all children that are not slot elements (i.e., don't match any of the provided slot components)
|
|
74
|
-
*/
|
|
75
|
-
declare const getRegularChildren: (children: React.ReactNode, SlotComponentOrComponents: FunctionalComponent | FunctionalComponent[]) => react10.ReactNode[];
|
|
76
|
-
//#endregion
|
|
77
|
-
//#region src/utils/getSlotMap/getSlotMap.d.ts
|
|
78
|
-
type GetSlotName<TSlotComponentProps extends GetSlotComponentProps> = string extends TSlotComponentProps["name"] ? never : "default" extends TSlotComponentProps["name"] ? never : TSlotComponentProps["name"];
|
|
79
|
-
type GetSpecificSlotsType<TSlotComponentProps extends GetSlotComponentProps> = { [TName in keyof TSlotComponentProps as GetSlotName<TSlotComponentProps>]: Extract<TSlotComponentProps["children"], React.ReactNode> };
|
|
80
|
-
/**
|
|
81
|
-
* Maps slot names to their corresponding children types
|
|
82
|
-
*/
|
|
83
|
-
type GetSlotMapResult<TSlotComponentProps extends GetSlotComponentProps> = UnionToIntersection<GetSpecificSlotsType<TSlotComponentProps>> & {
|
|
84
|
-
default: React.ReactNode[];
|
|
85
|
-
};
|
|
86
|
-
/**
|
|
87
|
-
* Symbol used to identify SlotComponent instances
|
|
88
|
-
*/
|
|
89
|
-
declare const slotComponentSymbol: unique symbol;
|
|
90
|
-
/**
|
|
91
|
-
* @description Creates a map of named slots from React children. Returns an object mapping slot names to their children,
|
|
92
|
-
* with a default slot for unmatched children.
|
|
93
|
-
*
|
|
94
|
-
* @example
|
|
95
|
-
* ```tsx
|
|
96
|
-
* import { type GetSlotComponentProps, SlotComponent } from "@zayne-labs/toolkit-react/utils"
|
|
97
|
-
*
|
|
98
|
-
* type SlotProps = GetSlotComponentProps<"header" | "footer">;
|
|
99
|
-
*
|
|
100
|
-
* function Parent({ children }: { children: React.ReactNode }) {
|
|
101
|
-
* const slots = getSlotMap<SlotProps>(children);
|
|
102
|
-
*
|
|
103
|
-
* return (
|
|
104
|
-
* <div>
|
|
105
|
-
* <header>{slots.header}</header>
|
|
106
|
-
* <main>{slots.default}</main>
|
|
107
|
-
* <footer>{slots.footer}</footer>
|
|
108
|
-
* </div>
|
|
109
|
-
* );
|
|
110
|
-
* }
|
|
111
|
-
* ```
|
|
112
|
-
*
|
|
113
|
-
* Usage:
|
|
114
|
-
* ```tsx
|
|
115
|
-
* <Parent>
|
|
116
|
-
* <SlotComponent name="header">Header Content</SlotComponent>
|
|
117
|
-
* <div>Random stuff</div>
|
|
118
|
-
* <SlotComponent name="footer">Footer Content</SlotComponent>
|
|
119
|
-
* </Parent>
|
|
120
|
-
* ```
|
|
121
|
-
*/
|
|
122
|
-
declare const getSlotMap: <TSlotComponentProps extends GetSlotComponentProps>(children: React.ReactNode) => Prettify<GetSlotMapResult<TSlotComponentProps>>;
|
|
123
|
-
/**
|
|
124
|
-
* @description Produce props for the SlotComponent
|
|
125
|
-
*
|
|
126
|
-
* @example
|
|
127
|
-
* ```ts
|
|
128
|
-
* // Pattern One (slot or slots have same children type, which is just React.ReactNode by default)
|
|
129
|
-
* type SlotProps = GetSlotComponentProps<"header" | "content" | "footer">;
|
|
130
|
-
*
|
|
131
|
-
* // Pattern Two (some slots can have different children type)
|
|
132
|
-
* type SlotProps = GetSlotComponentProps<"header", React.ReactNode> | GetSlotComponentProps<"header", (renderProp: RenderProp) => React.ReactNode>;
|
|
133
|
-
* ```
|
|
134
|
-
*/
|
|
135
|
-
type GetSlotComponentProps<TName extends string = string, TChildren extends CallbackFn<never, React.ReactNode> | React.ReactNode = CallbackFn<never, React.ReactNode> | React.ReactNode> = {
|
|
136
|
-
children: TChildren;
|
|
137
|
-
/**
|
|
138
|
-
* Name of the slot where content should be rendered
|
|
139
|
-
*/
|
|
140
|
-
name: TName;
|
|
141
|
-
};
|
|
142
|
-
/**
|
|
143
|
-
* @description Creates a slot component
|
|
144
|
-
*/
|
|
145
|
-
declare const createSlotComponent: <TSlotComponentProps extends GetSlotComponentProps>() => {
|
|
146
|
-
(props: TSlotComponentProps): React.ReactNode;
|
|
147
|
-
slotSymbol: typeof slotComponentSymbol;
|
|
148
|
-
};
|
|
149
|
-
type SlotWithNameAndSymbol<TSlotComponentProps extends GetSlotComponentProps = GetSlotComponentProps, TOtherProps extends UnknownObject = EmptyObject> = {
|
|
150
|
-
(props: Pick<TSlotComponentProps, "children"> & TOtherProps): React.ReactNode;
|
|
151
|
-
readonly slotName?: TSlotComponentProps["name"];
|
|
152
|
-
readonly slotSymbol?: symbol;
|
|
153
|
-
};
|
|
154
|
-
/**
|
|
155
|
-
* @description Adds a slot symbol and name to a slot component passed in
|
|
156
|
-
*/
|
|
157
|
-
declare const withSlotNameAndSymbol: <TSlotComponentProps extends GetSlotComponentProps, TOtherProps extends UnknownObject = EmptyObject>(name: TSlotComponentProps["name"], SlotComponent?: SlotWithNameAndSymbol<TSlotComponentProps, TOtherProps>) => SlotWithNameAndSymbol<TSlotComponentProps, TOtherProps>;
|
|
158
|
-
//#endregion
|
|
159
|
-
//#region src/utils/mergeProps.d.ts
|
|
160
|
-
type UnionToIntersection$1<TUnion> = (TUnion extends unknown ? (param: TUnion) => void : "") extends ((param: infer TParam) => void) ? TParam : "";
|
|
161
|
-
/**
|
|
162
|
-
* Merges multiple sets of React props.
|
|
163
|
-
*
|
|
164
|
-
* - It follows the Object.assign pattern where the rightmost object's fields overwrite
|
|
165
|
-
* the conflicting ones from others. This doesn't apply to event handlers, `className` and `style` props.
|
|
166
|
-
* - Event handlers are merged such that they are called in sequence (the rightmost one being called first),
|
|
167
|
-
* and allows the user to prevent the previous event handlers from being executed by calling the `preventDefault` method.
|
|
168
|
-
* - It also merges the `className` and `style` props, whereby the classes are concatenated
|
|
169
|
-
* and the rightmost styles overwrite the previous ones.
|
|
170
|
-
*
|
|
171
|
-
* @important **`ref` is not merged.**
|
|
172
|
-
* @param props props to merge.
|
|
173
|
-
* @returns the merged props.
|
|
174
|
-
*/
|
|
175
|
-
declare const mergeProps: <TProps extends Record<never, never>>(...propsObjectArray: Array<TProps | undefined>) => UnionToIntersection$1<TProps>;
|
|
176
|
-
//#endregion
|
|
177
|
-
//#region src/utils/mergeTwoProps.d.ts
|
|
178
|
-
declare const mergeTwoProps: <TProps extends Record<never, never>>(formerProps: TProps | undefined, latterProps: TProps | undefined) => TProps;
|
|
179
|
-
//#endregion
|
|
180
|
-
//#region src/utils/types/common.d.ts
|
|
181
|
-
type ForwardedRefType<TComponent extends HTMLElement | React.ElementType> = TComponent extends React.ElementType ? React.ForwardedRef<React.Ref<TComponent>> : React.ForwardedRef<TComponent>;
|
|
182
|
-
type InferProps<TComponent extends HTMLElement | React.ElementType> = TComponent extends React.ElementType ? React.ComponentPropsWithRef<TComponent> : React.HTMLAttributes<TComponent>;
|
|
183
|
-
type StateSetter<TSetter = unknown> = React.Dispatch<React.SetStateAction<TSetter>>;
|
|
184
|
-
type CssWithCustomProperties<TExtra extends Record<string, string> = NonNullable<unknown>> = React.CSSProperties & Record<`--${string}`, string> & TExtra;
|
|
185
|
-
type DefaultRenderItemErrorMessages = {
|
|
186
|
-
children: "Hey, Sorry but the children prop is redundant since you're currently using the render prop to do the same thing";
|
|
187
|
-
renderItem: "Hey, Sorry but the renderItem prop is redundant since you're currently using the children prop to do the same thing";
|
|
188
|
-
};
|
|
189
|
-
/**
|
|
190
|
-
* @description Represents a set of props that can be used to render a component conditionally based on a discriminated union type.
|
|
191
|
-
* This type allows for the use of either a render prop or children prop, but not both at the same time.
|
|
192
|
-
* If both are provided, a TypeScript error will be thrown.
|
|
193
|
-
* @template TErrorMessages An object of custom messages to display on the disallowed property.
|
|
194
|
-
*/
|
|
195
|
-
type DiscriminatedRenderItemProps<TRenderItemPropType, TErrorMessages extends Record<keyof DefaultRenderItemErrorMessages, string> = DefaultRenderItemErrorMessages> = UnionDiscriminator<[{
|
|
196
|
-
children: TRenderItemPropType;
|
|
197
|
-
}, {
|
|
198
|
-
renderItem: TRenderItemPropType;
|
|
199
|
-
}], TErrorMessages>;
|
|
200
|
-
type DefaultRenderErrorMessages = {
|
|
201
|
-
children: "Hey, Sorry but the children prop is redundant since you're currently using the render prop to do the same thing";
|
|
202
|
-
render: "Hey, Sorry but the render prop is redundant since you're currently using the children prop to do the same thing";
|
|
203
|
-
};
|
|
204
|
-
/**
|
|
205
|
-
* @description Represents a set of props that can be used to render a component conditionally based on a discriminated union type.
|
|
206
|
-
* This type allows for the use of either a render prop or children prop, but not both at the same time.
|
|
207
|
-
* If both are provided, a TypeScript error will be thrown.
|
|
208
|
-
* @template TErrorMessages An object of custom messages to display on the disallowed property.
|
|
209
|
-
*/
|
|
210
|
-
type DiscriminatedRenderProps<TRenderPropType, TErrorMessages extends Record<keyof DefaultRenderErrorMessages, string> = DefaultRenderErrorMessages> = UnionDiscriminator<[{
|
|
211
|
-
children: TRenderPropType;
|
|
212
|
-
}, {
|
|
213
|
-
render: TRenderPropType;
|
|
214
|
-
}], TErrorMessages>;
|
|
215
|
-
//#endregion
|
|
216
|
-
//#region src/utils/types/polymorphism.d.ts
|
|
217
|
-
type AsProp<TElement extends React.ElementType> = {
|
|
218
|
-
as?: TElement;
|
|
219
|
-
};
|
|
220
|
-
type InferRemainingProps<TElement extends React.ElementType, TProps> = Omit<InferProps<TElement>, keyof TProps>;
|
|
221
|
-
type MergedGivenPropsWithAs<TElement extends React.ElementType, TProps> = Prettify<Omit<AsProp<TElement>, keyof TProps> & TProps>;
|
|
222
|
-
type PolymorphicProps<TElement extends React.ElementType, TProps extends AnyObject = NonNullable<unknown>> = MergedGivenPropsWithAs<TElement, TProps> & InferRemainingProps<TElement, TProps>;
|
|
223
|
-
//#endregion
|
|
224
|
-
export { AsProp, CssWithCustomProperties, DefaultRenderErrorMessages, DefaultRenderItemErrorMessages, DiscriminatedRenderItemProps, DiscriminatedRenderProps, ForwardedRefType, FunctionalComponent, GetSlotComponentProps, GetSlotMapResult, InferProps, PolymorphicProps, PossibleRef, StateSetter, composeEventHandlers, composeRefs, composeTwoEventHandlers, createSlotComponent, getMultipleSlots, getRegularChildren, getSingleSlot, getSlotMap, matchesAnySlotComponent, matchesSlotComponent, mergeProps, mergeTwoProps, setRef, slotComponentSymbol, withSlotNameAndSymbol };
|
|
225
|
-
//# sourceMappingURL=index.d.ts.map
|
|
1
|
+
import { AsProp, CssWithCustomProperties, DefaultRenderErrorMessages, DefaultRenderItemErrorMessages, DiscriminatedRenderItemProps, DiscriminatedRenderProps, ForwardedRefType, FunctionalComponent, GetSlotComponentProps, GetSlotMapResult, InferProps, PolymorphicProps, PossibleRef, StateSetter, composeEventHandlers, composeRefs, composeTwoEventHandlers, createSlotComponent, getMultipleSlots, getRegularChildren, getSingleSlot, getSlotMap, matchesAnySlotComponent, matchesSlotComponent, mergeProps, mergeTwoProps, setRef, slotComponentSymbol, withSlotNameAndSymbol } from "../index-CByHxS0M.js";
|
|
2
|
+
export { AsProp, CssWithCustomProperties, DefaultRenderErrorMessages, DefaultRenderItemErrorMessages, DiscriminatedRenderItemProps, DiscriminatedRenderProps, ForwardedRefType, FunctionalComponent, GetSlotComponentProps, GetSlotMapResult, InferProps, PolymorphicProps, PossibleRef, StateSetter, composeEventHandlers, composeRefs, composeTwoEventHandlers, createSlotComponent, getMultipleSlots, getRegularChildren, getSingleSlot, getSlotMap, matchesAnySlotComponent, matchesSlotComponent, mergeProps, mergeTwoProps, setRef, slotComponentSymbol, withSlotNameAndSymbol };
|