@zayne-labs/ui-react 0.10.9 → 0.10.10
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/{cn-s-D7vHW1.js → cn-DdD3uYxA.js} +1 -1
- package/dist/esm/{cn-s-D7vHW1.js.map → cn-DdD3uYxA.js.map} +1 -1
- package/dist/esm/common/await/index.d.ts +46 -4
- package/dist/esm/common/await/index.js +86 -4
- package/dist/esm/common/await/index.js.map +1 -0
- package/dist/esm/common/error-boundary/index.d.ts +1 -1
- package/dist/esm/common/for/index.d.ts +23 -2
- package/dist/esm/common/for/index.js +1 -1
- package/dist/esm/common/presence/index.js +1 -1
- package/dist/esm/common/show/index.d.ts +32 -2
- package/dist/esm/common/slot/index.d.ts +16 -2
- package/dist/esm/common/suspense-with-boundary/index.d.ts +2 -2
- package/dist/esm/common/suspense-with-boundary/index.js +20 -3
- package/dist/esm/common/suspense-with-boundary/index.js.map +1 -0
- package/dist/esm/common/switch/index.d.ts +28 -2
- package/dist/esm/common/switch/index.js +37 -2
- package/dist/esm/common/switch/index.js.map +1 -0
- package/dist/esm/common/teleport/index.d.ts +14 -2
- package/dist/esm/common/teleport/index.js +31 -2
- package/dist/esm/common/teleport/index.js.map +1 -0
- package/dist/esm/{for-DK5rEY_m.js → for-BYsFEk3R.js} +1 -1
- package/dist/esm/{for-DK5rEY_m.js.map → for-BYsFEk3R.js.map} +1 -1
- package/dist/esm/{index-C0L6V4Zq.d.ts → index-BwhRxsrZ.d.ts} +3 -3
- package/dist/esm/{index-lw5txqar.d.ts → index-C_2Onnhl.d.ts} +4 -4
- package/dist/esm/{presence-CL5_GHQH.js → presence-CAQElNtY.js} +1 -1
- package/dist/esm/{presence-CL5_GHQH.js.map → presence-CAQElNtY.js.map} +1 -1
- package/dist/esm/ui/card/index.d.ts +20 -2
- package/dist/esm/ui/card/index.js +94 -4
- package/dist/esm/ui/card/index.js.map +1 -0
- package/dist/esm/ui/carousel/index.d.ts +95 -2
- package/dist/esm/ui/carousel/index.js +285 -13
- package/dist/esm/ui/carousel/index.js.map +1 -0
- package/dist/esm/ui/drag-scroll/index.d.ts +23 -2
- package/dist/esm/ui/drag-scroll/index.js +114 -3
- package/dist/esm/ui/drag-scroll/index.js.map +1 -0
- package/dist/esm/ui/drop-zone/index.d.ts +346 -2
- package/dist/esm/ui/drop-zone/index.js +1026 -14
- package/dist/esm/ui/drop-zone/index.js.map +1 -0
- package/dist/esm/ui/form/index.d.ts +227 -2
- package/dist/esm/ui/form/index.js +573 -5
- package/dist/esm/ui/form/index.js.map +1 -0
- package/package.json +6 -8
- package/dist/esm/await-DDgVzpvI.js +0 -87
- package/dist/esm/await-DDgVzpvI.js.map +0 -1
- package/dist/esm/card-DDLJVCwL.js +0 -95
- package/dist/esm/card-DDLJVCwL.js.map +0 -1
- package/dist/esm/carousel-B051PAAX.js +0 -285
- package/dist/esm/carousel-B051PAAX.js.map +0 -1
- package/dist/esm/common/index.d.ts +0 -9
- package/dist/esm/common/index.js +0 -11
- package/dist/esm/common-PS3X58Pj.js +0 -0
- package/dist/esm/drag-scroll-Bb1SG4On.js +0 -115
- package/dist/esm/drag-scroll-Bb1SG4On.js.map +0 -1
- package/dist/esm/drop-zone-FkkbzZ3j.js +0 -1019
- package/dist/esm/drop-zone-FkkbzZ3j.js.map +0 -1
- package/dist/esm/form-DyGy9LnA.js +0 -574
- package/dist/esm/form-DyGy9LnA.js.map +0 -1
- package/dist/esm/index-BJUTFSec.d.ts +0 -227
- package/dist/esm/index-BeCCgTjL.d.ts +0 -16
- package/dist/esm/index-BsGxDKlt.d.ts +0 -32
- package/dist/esm/index-C1GPFYKG.d.ts +0 -23
- package/dist/esm/index-CZjeBSoQ.d.ts +0 -14
- package/dist/esm/index-CffEFE66.d.ts +0 -28
- package/dist/esm/index-DFHOx2Pf.d.ts +0 -23
- package/dist/esm/index-DXwAMkn0.d.ts +0 -46
- package/dist/esm/index-RpfwCCWX.d.ts +0 -345
- package/dist/esm/index-bD-GMufy.d.ts +0 -20
- package/dist/esm/index-ipYGGqwN.d.ts +0 -95
- package/dist/esm/suspense-with-boundary-D-1NYDV4.js +0 -21
- package/dist/esm/suspense-with-boundary-D-1NYDV4.js.map +0 -1
- package/dist/esm/switch-Ch22z21e.js +0 -38
- package/dist/esm/switch-Ch22z21e.js.map +0 -1
- package/dist/esm/teleport-C8TzRm4M.js +0 -32
- package/dist/esm/teleport-C8TzRm4M.js.map +0 -1
- package/dist/esm/ui/index.d.ts +0 -6
- package/dist/esm/ui/index.js +0 -18
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cn-
|
|
1
|
+
{"version":3,"file":"cn-DdD3uYxA.js","names":[],"sources":["../../src/lib/utils/cn.ts"],"sourcesContent":["import { type ClassNameValue, twMerge } from \"tailwind-merge\";\n\nexport const cnMerge = (...classNames: ClassNameValue[]) => twMerge(classNames);\n"],"mappings":";;;AAEA,MAAa,WAAW,GAAG,eAAiC,QAAQ,WAAW"}
|
|
@@ -1,4 +1,46 @@
|
|
|
1
|
-
import "../../index-
|
|
2
|
-
import "../../index-
|
|
3
|
-
import {
|
|
4
|
-
|
|
1
|
+
import { ErrorBoundaryProps } from "../../index-BwhRxsrZ.js";
|
|
2
|
+
import { SuspenseWithBoundaryProps } from "../../index-C_2Onnhl.js";
|
|
3
|
+
import { GetSlotComponentProps } from "@zayne-labs/toolkit-react/utils";
|
|
4
|
+
import * as React from "react";
|
|
5
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
6
|
+
|
|
7
|
+
//#region src/components/common/await/await.d.ts
|
|
8
|
+
type RenderPropFn<TValue> = (result: TValue) => React.ReactNode;
|
|
9
|
+
type ChildrenType<TValue> = React.ReactNode | RenderPropFn<TValue>;
|
|
10
|
+
type AwaitRootProps<TValue> = Pick<SuspenseWithBoundaryProps, "errorFallback" | "fallback"> & {
|
|
11
|
+
asChild?: boolean;
|
|
12
|
+
children: ChildrenType<TValue>;
|
|
13
|
+
promise: Promise<TValue>;
|
|
14
|
+
withErrorBoundary?: boolean;
|
|
15
|
+
withSuspense?: boolean;
|
|
16
|
+
};
|
|
17
|
+
declare function AwaitRoot<TValue>(props: AwaitRootProps<TValue>): react_jsx_runtime0.JSX.Element;
|
|
18
|
+
type AwaitSuccessProps<TValue = unknown> = GetSlotComponentProps<"default", ChildrenType<TValue>>;
|
|
19
|
+
declare function AwaitSuccess<TPromiseOrValue, TValue = Awaited<TPromiseOrValue>>(props: Pick<AwaitSuccessProps<TValue>, "children">): React.ReactNode;
|
|
20
|
+
type AwaitErrorProps = GetSlotComponentProps<"error", ErrorBoundaryProps["fallback"]>;
|
|
21
|
+
declare const AwaitError: {
|
|
22
|
+
(props: Pick<AwaitErrorProps, "children"> & {
|
|
23
|
+
asChild?: boolean;
|
|
24
|
+
}): React.ReactNode;
|
|
25
|
+
readonly slotName?: "error" | undefined;
|
|
26
|
+
readonly slotSymbol?: symbol;
|
|
27
|
+
};
|
|
28
|
+
type AwaitPendingProps = GetSlotComponentProps<"pending", React.SuspenseProps["fallback"]>;
|
|
29
|
+
declare const AwaitPending: {
|
|
30
|
+
(props: Pick<AwaitPendingProps, "children">): React.ReactNode;
|
|
31
|
+
readonly slotName?: "pending" | undefined;
|
|
32
|
+
readonly slotSymbol?: symbol;
|
|
33
|
+
};
|
|
34
|
+
//#endregion
|
|
35
|
+
//#region src/components/common/await/await-context.d.ts
|
|
36
|
+
type AwaitContextType<TValue = unknown> = {
|
|
37
|
+
promise: Promise<TValue>;
|
|
38
|
+
result: TValue;
|
|
39
|
+
};
|
|
40
|
+
declare const useAwaitContext: <TValue>() => AwaitContextType<TValue>;
|
|
41
|
+
declare namespace await_parts_d_exports {
|
|
42
|
+
export { AwaitError as Error, AwaitPending as Pending, AwaitRoot as Root, AwaitSuccess as Success };
|
|
43
|
+
}
|
|
44
|
+
//#endregion
|
|
45
|
+
export { await_parts_d_exports as Await, AwaitError, AwaitPending, AwaitRoot, AwaitSuccess, useAwaitContext };
|
|
46
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,8 +1,90 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
import "../../
|
|
5
|
-
import "../../
|
|
6
|
-
import {
|
|
4
|
+
import { __export } from "../../chunk-CTAAG5j7.js";
|
|
5
|
+
import { ErrorBoundary, useErrorBoundaryContext } from "../../error-boundary-y9Samt_s.js";
|
|
6
|
+
import { SlotRoot } from "../../slot-WVWfOlr3.js";
|
|
7
|
+
import { getSlotMap, withSlotNameAndSymbol } from "@zayne-labs/toolkit-react/utils";
|
|
8
|
+
import { isFunction } from "@zayne-labs/toolkit-type-helpers";
|
|
9
|
+
import { Fragment, Suspense, use, useMemo } from "react";
|
|
10
|
+
import { createCustomContext } from "@zayne-labs/toolkit-react";
|
|
11
|
+
import { jsx } from "react/jsx-runtime";
|
|
7
12
|
|
|
8
|
-
|
|
13
|
+
//#region src/components/common/await/await-context.ts
|
|
14
|
+
const [AwaitContextProvider, useAwaitContextImpl] = createCustomContext({
|
|
15
|
+
hookName: "useAwaitContext",
|
|
16
|
+
name: "AwaitContext",
|
|
17
|
+
providerName: "AwaitInner"
|
|
18
|
+
});
|
|
19
|
+
const useAwaitContext = () => useAwaitContextImpl();
|
|
20
|
+
|
|
21
|
+
//#endregion
|
|
22
|
+
//#region src/components/common/await/await.tsx
|
|
23
|
+
function AwaitRoot(props) {
|
|
24
|
+
const { children, errorFallback, fallback, withErrorBoundary = true, withSuspense = true,...restOfProps } = props;
|
|
25
|
+
const WithErrorBoundary = withErrorBoundary ? ErrorBoundary : Fragment;
|
|
26
|
+
const WithSuspense = withSuspense ? Suspense : Fragment;
|
|
27
|
+
const slots = !isFunction(children) ? getSlotMap(children) : { default: children };
|
|
28
|
+
const selectedPendingFallback = slots.pending ?? fallback;
|
|
29
|
+
const selectedErrorFallback = slots.error ?? errorFallback;
|
|
30
|
+
return /* @__PURE__ */ jsx(WithErrorBoundary, {
|
|
31
|
+
...Boolean(selectedErrorFallback) && { fallback: selectedErrorFallback },
|
|
32
|
+
children: /* @__PURE__ */ jsx(WithSuspense, {
|
|
33
|
+
...Boolean(selectedPendingFallback) && { fallback: selectedPendingFallback },
|
|
34
|
+
children: /* @__PURE__ */ jsx(AwaitRootInner, {
|
|
35
|
+
...restOfProps,
|
|
36
|
+
children: slots.default
|
|
37
|
+
})
|
|
38
|
+
})
|
|
39
|
+
});
|
|
40
|
+
}
|
|
41
|
+
function AwaitRootInner(props) {
|
|
42
|
+
const { asChild, children, promise } = props;
|
|
43
|
+
const result = use(promise);
|
|
44
|
+
const resolvedChildren = isFunction(children) ? children(result) : children;
|
|
45
|
+
const Component$1 = asChild ? SlotRoot : Fragment;
|
|
46
|
+
const contextValue = useMemo(() => ({
|
|
47
|
+
promise,
|
|
48
|
+
result
|
|
49
|
+
}), [promise, result]);
|
|
50
|
+
return /* @__PURE__ */ jsx(AwaitContextProvider, {
|
|
51
|
+
value: contextValue,
|
|
52
|
+
children: /* @__PURE__ */ jsx(Component$1, {
|
|
53
|
+
...asChild && contextValue,
|
|
54
|
+
children: resolvedChildren
|
|
55
|
+
})
|
|
56
|
+
});
|
|
57
|
+
}
|
|
58
|
+
function AwaitSuccess(props) {
|
|
59
|
+
const { children } = props;
|
|
60
|
+
if (isFunction(children)) {
|
|
61
|
+
const { result } = useAwaitContext();
|
|
62
|
+
return children(result);
|
|
63
|
+
}
|
|
64
|
+
return children;
|
|
65
|
+
}
|
|
66
|
+
Object.assign(AwaitSuccess, withSlotNameAndSymbol("default"));
|
|
67
|
+
const AwaitError = withSlotNameAndSymbol("error", (props) => {
|
|
68
|
+
const { asChild, children } = props;
|
|
69
|
+
const errorBoundaryContext = useErrorBoundaryContext();
|
|
70
|
+
const Component$1 = asChild ? SlotRoot : Fragment;
|
|
71
|
+
const resolvedChildren = isFunction(children) ? children(errorBoundaryContext) : children;
|
|
72
|
+
return /* @__PURE__ */ jsx(Component$1, {
|
|
73
|
+
...asChild && errorBoundaryContext,
|
|
74
|
+
children: resolvedChildren
|
|
75
|
+
});
|
|
76
|
+
});
|
|
77
|
+
const AwaitPending = withSlotNameAndSymbol("pending");
|
|
78
|
+
|
|
79
|
+
//#endregion
|
|
80
|
+
//#region src/components/common/await/await-parts.ts
|
|
81
|
+
var await_parts_exports = __export({
|
|
82
|
+
Error: () => AwaitError,
|
|
83
|
+
Pending: () => AwaitPending,
|
|
84
|
+
Root: () => AwaitRoot,
|
|
85
|
+
Success: () => AwaitSuccess
|
|
86
|
+
});
|
|
87
|
+
|
|
88
|
+
//#endregion
|
|
89
|
+
export { await_parts_exports as Await, AwaitError, AwaitPending, AwaitRoot, AwaitSuccess, useAwaitContext };
|
|
90
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["ReactFragment","Component","Slot.Root"],"sources":["../../../../src/components/common/await/await-context.ts","../../../../src/components/common/await/await.tsx","../../../../src/components/common/await/await-parts.ts"],"sourcesContent":["import { createCustomContext } from \"@zayne-labs/toolkit-react\";\n\nexport type AwaitContextType<TValue = unknown> = {\n\tpromise: Promise<TValue>;\n\tresult: TValue;\n};\n\nconst [AwaitContextProvider, useAwaitContextImpl] = createCustomContext<AwaitContextType>({\n\thookName: \"useAwaitContext\",\n\tname: \"AwaitContext\",\n\tproviderName: \"AwaitInner\",\n});\n\nconst useAwaitContext = <TValue>() => useAwaitContextImpl() as AwaitContextType<TValue>;\n\nexport { useAwaitContext, AwaitContextProvider };\n","\"use client\";\n\nimport {\n\ttype GetSlotComponentProps,\n\tgetSlotMap,\n\twithSlotNameAndSymbol,\n} from \"@zayne-labs/toolkit-react/utils\";\nimport { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\nimport * as React from \"react\";\nimport { Fragment as ReactFragment, Suspense, use, useMemo } from \"react\";\nimport { ErrorBoundary, type ErrorBoundaryProps, useErrorBoundaryContext } from \"../error-boundary\";\nimport { Slot } from \"../slot\";\nimport type { SuspenseWithBoundaryProps } from \"../suspense-with-boundary\";\nimport { AwaitContextProvider, useAwaitContext } from \"./await-context\";\n\ntype RenderPropFn<TValue> = (result: TValue) => React.ReactNode;\n\ntype ChildrenType<TValue> = React.ReactNode | RenderPropFn<TValue>;\n\ntype AwaitRootProps<TValue> = Pick<SuspenseWithBoundaryProps, \"errorFallback\" | \"fallback\"> & {\n\tasChild?: boolean;\n\tchildren: ChildrenType<TValue>;\n\tpromise: Promise<TValue>;\n\twithErrorBoundary?: boolean;\n\twithSuspense?: boolean;\n};\n\nexport function AwaitRoot<TValue>(props: AwaitRootProps<TValue>) {\n\tconst {\n\t\tchildren,\n\t\terrorFallback,\n\t\tfallback,\n\t\twithErrorBoundary = true,\n\t\twithSuspense = true,\n\t\t...restOfProps\n\t} = props;\n\n\tconst WithErrorBoundary = withErrorBoundary ? ErrorBoundary : ReactFragment;\n\tconst WithSuspense = withSuspense ? Suspense : ReactFragment;\n\n\tconst slots =\n\t\t!isFunction(children) ?\n\t\t\tgetSlotMap<SlotComponentProps>(children)\n\t\t:\t({ default: children } as unknown as ReturnType<typeof getSlotMap<SlotComponentProps>>);\n\n\tconst selectedPendingFallback = slots.pending ?? fallback;\n\tconst selectedErrorFallback = slots.error ?? errorFallback;\n\n\treturn (\n\t\t<WithErrorBoundary {...(Boolean(selectedErrorFallback) && { fallback: selectedErrorFallback })}>\n\t\t\t<WithSuspense {...(Boolean(selectedPendingFallback) && { fallback: selectedPendingFallback })}>\n\t\t\t\t<AwaitRootInner {...restOfProps}>{slots.default}</AwaitRootInner>\n\t\t\t</WithSuspense>\n\t\t</WithErrorBoundary>\n\t);\n}\n\ntype AwaitRootInnerProps<TValue> = Pick<AwaitRootProps<TValue>, \"asChild\" | \"children\" | \"promise\">;\n\nfunction AwaitRootInner<TValue>(props: AwaitRootInnerProps<TValue>) {\n\tconst { asChild, children, promise } = props;\n\n\tconst result = use(promise);\n\n\tconst resolvedChildren = isFunction(children) ? children(result) : children;\n\n\tconst Component = asChild ? Slot.Root : ReactFragment;\n\n\tconst contextValue = useMemo(() => ({ promise, result }), [promise, result]);\n\n\treturn (\n\t\t<AwaitContextProvider value={contextValue}>\n\t\t\t<Component {...(asChild && contextValue)}>{resolvedChildren}</Component>\n\t\t</AwaitContextProvider>\n\t);\n}\n\ntype SlotComponentProps = AwaitErrorProps | AwaitPendingProps | AwaitSuccessProps;\n\ntype AwaitSuccessProps<TValue = unknown> = GetSlotComponentProps<\"default\", ChildrenType<TValue>>;\n\nexport function AwaitSuccess<TPromiseOrValue, TValue = Awaited<TPromiseOrValue>>(\n\tprops: Pick<AwaitSuccessProps<TValue>, \"children\">\n) {\n\tconst { children } = props;\n\n\tif (isFunction(children)) {\n\t\t// eslint-disable-next-line react-hooks/rules-of-hooks -- This hook only uses `use` under the hood so this is safe\n\t\tconst { result } = useAwaitContext<TValue>();\n\n\t\treturn children(result);\n\t}\n\n\treturn children;\n}\n\nObject.assign(AwaitSuccess, withSlotNameAndSymbol<AwaitSuccessProps>(\"default\"));\n\ntype AwaitErrorProps = GetSlotComponentProps<\"error\", ErrorBoundaryProps[\"fallback\"]>;\n\nexport const AwaitError = withSlotNameAndSymbol<AwaitErrorProps, { asChild?: boolean }>(\n\t\"error\",\n\t(props) => {\n\t\tconst { asChild, children } = props;\n\n\t\tconst errorBoundaryContext = useErrorBoundaryContext();\n\n\t\tconst Component = asChild ? Slot.Root : ReactFragment;\n\n\t\tconst resolvedChildren = isFunction(children) ? children(errorBoundaryContext) : children;\n\n\t\treturn <Component {...(asChild && errorBoundaryContext)}>{resolvedChildren}</Component>;\n\t}\n);\n\ntype AwaitPendingProps = GetSlotComponentProps<\"pending\", React.SuspenseProps[\"fallback\"]>;\n\nexport const AwaitPending = withSlotNameAndSymbol<AwaitPendingProps>(\"pending\");\n","export {\n\tAwaitRoot as Root,\n\tAwaitError as Error,\n\tAwaitPending as Pending,\n\tAwaitSuccess as Success,\n} from \"./await\";\n"],"mappings":";;;;;;;;;;;;;AAOA,MAAM,CAAC,sBAAsB,uBAAuB,oBAAsC;CACzF,UAAU;CACV,MAAM;CACN,cAAc;CACd,CAAC;AAEF,MAAM,wBAAgC,qBAAqB;;;;ACc3D,SAAgB,UAAkB,OAA+B;CAChE,MAAM,EACL,UACA,eACA,UACA,oBAAoB,MACpB,eAAe,KACf,GAAG,gBACA;CAEJ,MAAM,oBAAoB,oBAAoB,gBAAgBA;CAC9D,MAAM,eAAe,eAAe,WAAWA;CAE/C,MAAM,QACL,CAAC,WAAW,SAAS,GACpB,WAA+B,SAAS,GACtC,EAAE,SAAS,UAAU;CAEzB,MAAM,0BAA0B,MAAM,WAAW;CACjD,MAAM,wBAAwB,MAAM,SAAS;AAE7C,QACC,oBAAC;EAAkB,GAAK,QAAQ,sBAAsB,IAAI,EAAE,UAAU,uBAAuB;YAC5F,oBAAC;GAAa,GAAK,QAAQ,wBAAwB,IAAI,EAAE,UAAU,yBAAyB;aAC3F,oBAAC;IAAe,GAAI;cAAc,MAAM;KAAyB;IACnD;GACI;;AAMtB,SAAS,eAAuB,OAAoC;CACnE,MAAM,EAAE,SAAS,UAAU,YAAY;CAEvC,MAAM,SAAS,IAAI,QAAQ;CAE3B,MAAM,mBAAmB,WAAW,SAAS,GAAG,SAAS,OAAO,GAAG;CAEnE,MAAMC,cAAY,UAAUC,WAAYF;CAExC,MAAM,eAAe,eAAe;EAAE;EAAS;EAAQ,GAAG,CAAC,SAAS,OAAO,CAAC;AAE5E,QACC,oBAAC;EAAqB,OAAO;YAC5B,oBAACC;GAAU,GAAK,WAAW;aAAgB;IAA6B;GAClD;;AAQzB,SAAgB,aACf,OACC;CACD,MAAM,EAAE,aAAa;AAErB,KAAI,WAAW,SAAS,EAAE;EAEzB,MAAM,EAAE,WAAW,iBAAyB;AAE5C,SAAO,SAAS,OAAO;;AAGxB,QAAO;;AAGR,OAAO,OAAO,cAAc,sBAAyC,UAAU,CAAC;AAIhF,MAAa,aAAa,sBACzB,UACC,UAAU;CACV,MAAM,EAAE,SAAS,aAAa;CAE9B,MAAM,uBAAuB,yBAAyB;CAEtD,MAAMA,cAAY,UAAUC,WAAYF;CAExC,MAAM,mBAAmB,WAAW,SAAS,GAAG,SAAS,qBAAqB,GAAG;AAEjF,QAAO,oBAACC;EAAU,GAAK,WAAW;YAAwB;GAA6B;EAExF;AAID,MAAa,eAAe,sBAAyC,UAAU"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { ErrorBoundary, ErrorBoundaryContextType, ErrorBoundaryProps, FallbackProps, useErrorBoundary, useErrorBoundaryContext } from "../../index-
|
|
1
|
+
import { ErrorBoundary, ErrorBoundaryContextType, ErrorBoundaryProps, FallbackProps, useErrorBoundary, useErrorBoundaryContext } from "../../index-BwhRxsrZ.js";
|
|
2
2
|
export { ErrorBoundary, ErrorBoundaryContextType, ErrorBoundaryProps, FallbackProps, useErrorBoundary, useErrorBoundaryContext };
|
|
@@ -1,2 +1,23 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { DiscriminatedRenderItemProps, PolymorphicPropsStrict } from "@zayne-labs/toolkit-react/utils";
|
|
2
|
+
import { Prettify } from "@zayne-labs/toolkit-type-helpers";
|
|
3
|
+
import * as React from "react";
|
|
4
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
5
|
+
|
|
6
|
+
//#region src/components/common/for/for.d.ts
|
|
7
|
+
type ArrayOrNumber = number | readonly unknown[];
|
|
8
|
+
type GetArrayItemType<TArray extends ArrayOrNumber> = TArray extends readonly unknown[] ? TArray[number] : TArray extends number ? number : unknown;
|
|
9
|
+
type RenderPropFn<TArray extends ArrayOrNumber> = (item: GetArrayItemType<TArray>, index: number, array: Array<GetArrayItemType<TArray>>) => React.ReactNode;
|
|
10
|
+
type ForRenderProps<TArray extends ArrayOrNumber> = DiscriminatedRenderItemProps<RenderPropFn<TArray>>;
|
|
11
|
+
type ForProps<TArray extends ArrayOrNumber> = Prettify<{
|
|
12
|
+
each: TArray;
|
|
13
|
+
fallback?: React.ReactNode;
|
|
14
|
+
} & ForRenderProps<TArray>>;
|
|
15
|
+
declare function For<const TArray extends ArrayOrNumber>(props: ForProps<TArray>): string | number | bigint | boolean | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null;
|
|
16
|
+
declare function ForWithWrapper<const TArray extends ArrayOrNumber, TElement extends React.ElementType = "ul">(props: PolymorphicPropsStrict<TElement, ForProps<TArray>>): react_jsx_runtime0.JSX.Element;
|
|
17
|
+
//#endregion
|
|
18
|
+
//#region src/components/common/for/getElementList.d.ts
|
|
19
|
+
type GetElementListResult<TVariant extends "base" | "withWrapper"> = TVariant extends "base" ? [typeof For] : [typeof ForWithWrapper];
|
|
20
|
+
declare const getElementList: <TVariant extends "base" | "withWrapper" = "withWrapper">(variant?: TVariant) => GetElementListResult<TVariant>;
|
|
21
|
+
//#endregion
|
|
22
|
+
export { For, ForRenderProps, ForWithWrapper, getElementList };
|
|
23
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,2 +1,32 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
|
|
3
|
+
//#region src/components/common/show/show.d.ts
|
|
4
|
+
type ShowProps<TWhen> = {
|
|
5
|
+
children: React.ReactNode;
|
|
6
|
+
control: "content";
|
|
7
|
+
fallback?: React.ReactNode;
|
|
8
|
+
when?: never;
|
|
9
|
+
} | {
|
|
10
|
+
children: React.ReactNode | ((value: TWhen) => React.ReactNode);
|
|
11
|
+
control?: "root";
|
|
12
|
+
fallback?: React.ReactNode;
|
|
13
|
+
when: false | TWhen | null | undefined;
|
|
14
|
+
};
|
|
15
|
+
declare function ShowRoot<TWhen>(props: ShowProps<TWhen>): string | number | bigint | boolean | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | null;
|
|
16
|
+
type ShowContentProps<TWhen> = Pick<ShowProps<TWhen>, "children" | "when">;
|
|
17
|
+
declare function ShowContent<TWhen>(props: ShowContentProps<TWhen>): React.ReactNode;
|
|
18
|
+
declare namespace ShowContent {
|
|
19
|
+
var slotSymbol: symbol;
|
|
20
|
+
}
|
|
21
|
+
declare function ShowFallback(props: {
|
|
22
|
+
children: React.ReactNode;
|
|
23
|
+
}): React.ReactNode;
|
|
24
|
+
declare namespace ShowFallback {
|
|
25
|
+
var slotSymbol: symbol;
|
|
26
|
+
}
|
|
27
|
+
declare namespace show_parts_d_exports {
|
|
28
|
+
export { ShowContent as Content, ShowFallback as Fallback, ShowFallback as Otherwise, ShowRoot as Root };
|
|
29
|
+
}
|
|
30
|
+
//#endregion
|
|
31
|
+
export { show_parts_d_exports as Show, ShowContent, ShowFallback, ShowRoot };
|
|
32
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,2 +1,16 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { InferProps } from "@zayne-labs/toolkit-react/utils";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
import * as react_jsx_runtime39 from "react/jsx-runtime";
|
|
4
|
+
|
|
5
|
+
//#region src/components/common/slot/slot.d.ts
|
|
6
|
+
type SlotProps = InferProps<HTMLElement>;
|
|
7
|
+
declare function SlotRoot(props: SlotProps): react_jsx_runtime39.JSX.Element | null;
|
|
8
|
+
declare function SlotSlottable({
|
|
9
|
+
children
|
|
10
|
+
}: Pick<SlotProps, "children">): React.ReactNode;
|
|
11
|
+
declare namespace slot_parts_d_exports {
|
|
12
|
+
export { SlotRoot as Root, SlotSlottable as Slottable };
|
|
13
|
+
}
|
|
14
|
+
//#endregion
|
|
15
|
+
export { slot_parts_d_exports as Slot, SlotRoot, SlotSlottable };
|
|
16
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import "../../index-
|
|
2
|
-
import { SuspenseWithBoundary, SuspenseWithBoundaryProps } from "../../index-
|
|
1
|
+
import "../../index-BwhRxsrZ.js";
|
|
2
|
+
import { SuspenseWithBoundary, SuspenseWithBoundaryProps } from "../../index-C_2Onnhl.js";
|
|
3
3
|
export { SuspenseWithBoundary, SuspenseWithBoundaryProps };
|
|
@@ -1,4 +1,21 @@
|
|
|
1
|
-
import "../../error-boundary-y9Samt_s.js";
|
|
2
|
-
import {
|
|
1
|
+
import { ErrorBoundary } from "../../error-boundary-y9Samt_s.js";
|
|
2
|
+
import { Suspense } from "react";
|
|
3
|
+
import { jsx } from "react/jsx-runtime";
|
|
3
4
|
|
|
4
|
-
|
|
5
|
+
//#region src/components/common/suspense-with-boundary/suspense-with-boundary.tsx
|
|
6
|
+
function SuspenseWithBoundary(props) {
|
|
7
|
+
const { children, errorFallback, fallback } = props;
|
|
8
|
+
const errorBoundaryProps = Boolean(errorFallback) && { fallback: errorFallback };
|
|
9
|
+
const suspenseProps = Boolean(fallback) && { fallback };
|
|
10
|
+
return /* @__PURE__ */ jsx(ErrorBoundary, {
|
|
11
|
+
...errorBoundaryProps,
|
|
12
|
+
children: /* @__PURE__ */ jsx(Suspense, {
|
|
13
|
+
...suspenseProps,
|
|
14
|
+
children
|
|
15
|
+
})
|
|
16
|
+
});
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
//#endregion
|
|
20
|
+
export { SuspenseWithBoundary };
|
|
21
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/common/suspense-with-boundary/suspense-with-boundary.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Suspense } from \"react\";\nimport { ErrorBoundary, type ErrorBoundaryProps } from \"../error-boundary\";\n\nexport type SuspenseWithBoundaryProps = {\n\tchildren: React.ReactNode;\n\terrorFallback?: ErrorBoundaryProps[\"fallback\"];\n\tfallback?: React.ReactNode;\n};\n\nexport function SuspenseWithBoundary(props: SuspenseWithBoundaryProps) {\n\tconst { children, errorFallback, fallback } = props;\n\n\tconst errorBoundaryProps = Boolean(errorFallback) && { fallback: errorFallback };\n\tconst suspenseProps = Boolean(fallback) && { fallback };\n\n\treturn (\n\t\t<ErrorBoundary {...errorBoundaryProps}>\n\t\t\t<Suspense {...suspenseProps}>{children}</Suspense>\n\t\t</ErrorBoundary>\n\t);\n}\n"],"mappings":";;;;;AAUA,SAAgB,qBAAqB,OAAkC;CACtE,MAAM,EAAE,UAAU,eAAe,aAAa;CAE9C,MAAM,qBAAqB,QAAQ,cAAc,IAAI,EAAE,UAAU,eAAe;CAChF,MAAM,gBAAgB,QAAQ,SAAS,IAAI,EAAE,UAAU;AAEvD,QACC,oBAAC;EAAc,GAAI;YAClB,oBAAC;GAAS,GAAI;GAAgB;IAAoB;GACnC"}
|
|
@@ -1,2 +1,28 @@
|
|
|
1
|
-
import
|
|
2
|
-
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
|
|
3
|
+
//#region src/components/common/switch/switch.d.ts
|
|
4
|
+
type ValidSwitchComponentType = React.ReactElement<SwitchMatchProps<unknown>>;
|
|
5
|
+
type SwitchProps = {
|
|
6
|
+
children: ValidSwitchComponentType | ValidSwitchComponentType[];
|
|
7
|
+
value?: unknown;
|
|
8
|
+
};
|
|
9
|
+
declare function SwitchRoot(props: SwitchProps): React.ReactNode;
|
|
10
|
+
type SwitchMatchProps<TWhen> = {
|
|
11
|
+
children: React.ReactNode | ((value: TWhen) => React.ReactNode);
|
|
12
|
+
when: false | TWhen | null | undefined;
|
|
13
|
+
};
|
|
14
|
+
declare function SwitchMatch<TWhen>(props: SwitchMatchProps<TWhen>): React.ReactNode;
|
|
15
|
+
declare function SwitchDefault({
|
|
16
|
+
children
|
|
17
|
+
}: {
|
|
18
|
+
children: React.ReactNode;
|
|
19
|
+
}): React.ReactNode;
|
|
20
|
+
declare namespace SwitchDefault {
|
|
21
|
+
var slotSymbol: symbol;
|
|
22
|
+
}
|
|
23
|
+
declare namespace switch_parts_d_exports {
|
|
24
|
+
export { SwitchDefault as Default, SwitchMatch as Match, SwitchRoot as Root };
|
|
25
|
+
}
|
|
26
|
+
//#endregion
|
|
27
|
+
export { switch_parts_d_exports as Switch, SwitchDefault, SwitchMatch, SwitchRoot };
|
|
28
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,6 +1,41 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
import {
|
|
4
|
+
import { __export } from "../../chunk-CTAAG5j7.js";
|
|
5
|
+
import { getRegularChildren, getSingleSlot } from "@zayne-labs/toolkit-react/utils";
|
|
6
|
+
import { isFunction } from "@zayne-labs/toolkit-type-helpers";
|
|
7
|
+
import "react";
|
|
5
8
|
|
|
6
|
-
|
|
9
|
+
//#region src/components/common/switch/switch.tsx
|
|
10
|
+
const defaultValueSymbol = Symbol("default-value");
|
|
11
|
+
function SwitchRoot(props) {
|
|
12
|
+
const { children, value = defaultValueSymbol } = props;
|
|
13
|
+
const defaultCase = getSingleSlot(children, SwitchDefault, {
|
|
14
|
+
errorMessage: "Only one <Switch.Default> component is allowed",
|
|
15
|
+
throwOnMultipleSlotMatch: true
|
|
16
|
+
});
|
|
17
|
+
return getRegularChildren(children, SwitchDefault).find((child) => {
|
|
18
|
+
if (value === defaultValueSymbol) return Boolean(child.props.when);
|
|
19
|
+
return child.props.when === value;
|
|
20
|
+
}) ?? defaultCase;
|
|
21
|
+
}
|
|
22
|
+
function SwitchMatch(props) {
|
|
23
|
+
const { children, when } = props;
|
|
24
|
+
return isFunction(children) ? children(when) : children;
|
|
25
|
+
}
|
|
26
|
+
function SwitchDefault({ children }) {
|
|
27
|
+
return children;
|
|
28
|
+
}
|
|
29
|
+
SwitchDefault.slotSymbol = Symbol("switch-default");
|
|
30
|
+
|
|
31
|
+
//#endregion
|
|
32
|
+
//#region src/components/common/switch/switch-parts.ts
|
|
33
|
+
var switch_parts_exports = __export({
|
|
34
|
+
Default: () => SwitchDefault,
|
|
35
|
+
Match: () => SwitchMatch,
|
|
36
|
+
Root: () => SwitchRoot
|
|
37
|
+
});
|
|
38
|
+
|
|
39
|
+
//#endregion
|
|
40
|
+
export { switch_parts_exports as Switch, SwitchDefault, SwitchMatch, SwitchRoot };
|
|
41
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/common/switch/switch.tsx","../../../../src/components/common/switch/switch-parts.ts"],"sourcesContent":["\"use client\";\n\nimport { getRegularChildren, getSingleSlot } from \"@zayne-labs/toolkit-react/utils\";\nimport { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\nimport * as React from \"react\";\n\ntype ValidSwitchComponentType = React.ReactElement<SwitchMatchProps<unknown>>;\n\ntype SwitchProps = {\n\tchildren: ValidSwitchComponentType | ValidSwitchComponentType[];\n\tvalue?: unknown;\n};\n\nconst defaultValueSymbol = Symbol(\"default-value\");\n\nexport function SwitchRoot(props: SwitchProps) {\n\tconst { children, value = defaultValueSymbol } = props;\n\n\tconst defaultCase = getSingleSlot(children, SwitchDefault, {\n\t\terrorMessage: \"Only one <Switch.Default> component is allowed\",\n\t\tthrowOnMultipleSlotMatch: true,\n\t});\n\n\tconst childrenCasesArray = getRegularChildren(children, SwitchDefault) as ValidSwitchComponentType[];\n\n\tconst matchedCase = childrenCasesArray.find((child) => {\n\t\t// == If value is defaultValueSymbol, match the cases in order like switch(true)\n\t\tif (value === defaultValueSymbol) {\n\t\t\treturn Boolean(child.props.when);\n\t\t}\n\n\t\t// == Otherwise, match the cases like switch(value)\n\t\treturn child.props.when === value;\n\t});\n\n\treturn matchedCase ?? defaultCase;\n}\n\ntype SwitchMatchProps<TWhen> = {\n\tchildren: React.ReactNode | ((value: TWhen) => React.ReactNode);\n\twhen: false | TWhen | null | undefined;\n};\n\nexport function SwitchMatch<TWhen>(props: SwitchMatchProps<TWhen>) {\n\tconst { children, when } = props;\n\n\tconst resolvedChildren = isFunction(children) ? children(when as TWhen) : children;\n\n\treturn resolvedChildren;\n}\n\nexport function SwitchDefault({ children }: { children: React.ReactNode }) {\n\treturn children;\n}\nSwitchDefault.slotSymbol = Symbol(\"switch-default\");\n","export { SwitchDefault as Default, SwitchMatch as Match, SwitchRoot as Root } from \"./switch\";\n"],"mappings":";;;;;;;;;AAaA,MAAM,qBAAqB,OAAO,gBAAgB;AAElD,SAAgB,WAAW,OAAoB;CAC9C,MAAM,EAAE,UAAU,QAAQ,uBAAuB;CAEjD,MAAM,cAAc,cAAc,UAAU,eAAe;EAC1D,cAAc;EACd,0BAA0B;EAC1B,CAAC;AAcF,QAZ2B,mBAAmB,UAAU,cAAc,CAE/B,MAAM,UAAU;AAEtD,MAAI,UAAU,mBACb,QAAO,QAAQ,MAAM,MAAM,KAAK;AAIjC,SAAO,MAAM,MAAM,SAAS;GAC3B,IAEoB;;AAQvB,SAAgB,YAAmB,OAAgC;CAClE,MAAM,EAAE,UAAU,SAAS;AAI3B,QAFyB,WAAW,SAAS,GAAG,SAAS,KAAc,GAAG;;AAK3E,SAAgB,cAAc,EAAE,YAA2C;AAC1E,QAAO;;AAER,cAAc,aAAa,OAAO,iBAAiB"}
|
|
@@ -1,2 +1,14 @@
|
|
|
1
|
-
import {
|
|
2
|
-
|
|
1
|
+
import { AnyString } from "@zayne-labs/toolkit-type-helpers";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
|
|
4
|
+
//#region src/components/common/teleport/teleport.d.ts
|
|
5
|
+
type ValidHtmlTags = keyof HTMLElementTagNameMap;
|
|
6
|
+
type PortalProps = {
|
|
7
|
+
children: React.ReactNode;
|
|
8
|
+
insertPosition?: InsertPosition;
|
|
9
|
+
to: AnyString | HTMLElement | ValidHtmlTags | null;
|
|
10
|
+
};
|
|
11
|
+
declare function Teleport(props: PortalProps): React.ReactPortal | null;
|
|
12
|
+
//#endregion
|
|
13
|
+
export { Teleport };
|
|
14
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,3 +1,32 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { isString } from "@zayne-labs/toolkit-type-helpers";
|
|
2
|
+
import { useEffect, useState } from "react";
|
|
3
|
+
import { createPortal } from "react-dom";
|
|
2
4
|
|
|
3
|
-
|
|
5
|
+
//#region src/components/common/teleport/teleport.tsx
|
|
6
|
+
function Teleport(props) {
|
|
7
|
+
const { children, insertPosition, to } = props;
|
|
8
|
+
const [portalContainer, setPortalContainer] = useState(null);
|
|
9
|
+
useEffect(() => {
|
|
10
|
+
if (!to) return;
|
|
11
|
+
if (insertPosition) return;
|
|
12
|
+
const destination = isString(to) ? document.querySelector(to) : to;
|
|
13
|
+
destination && setPortalContainer(destination);
|
|
14
|
+
}, [to, insertPosition]);
|
|
15
|
+
useEffect(() => {
|
|
16
|
+
if (!to) return;
|
|
17
|
+
if (!insertPosition) return;
|
|
18
|
+
const destination = isString(to) ? document.querySelector(to) : to;
|
|
19
|
+
const tempWrapper = document.createElement("div");
|
|
20
|
+
tempWrapper.style.display = "contents";
|
|
21
|
+
destination?.insertAdjacentElement(insertPosition, tempWrapper);
|
|
22
|
+
setPortalContainer(tempWrapper);
|
|
23
|
+
return () => {
|
|
24
|
+
tempWrapper.remove();
|
|
25
|
+
};
|
|
26
|
+
}, [to, insertPosition]);
|
|
27
|
+
return portalContainer && createPortal(children, portalContainer);
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
//#endregion
|
|
31
|
+
export { Teleport };
|
|
32
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/common/teleport/teleport.tsx"],"sourcesContent":["\"use client\";\n\nimport { type AnyString, isString } from \"@zayne-labs/toolkit-type-helpers\";\nimport * as React from \"react\";\nimport { useEffect, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\n\ntype ValidHtmlTags = keyof HTMLElementTagNameMap;\n\ntype PortalProps = {\n\tchildren: React.ReactNode;\n\tinsertPosition?: InsertPosition;\n\tto: AnyString | HTMLElement | ValidHtmlTags | null;\n};\n\nfunction Teleport(props: PortalProps) {\n\tconst { children, insertPosition, to } = props;\n\n\tconst [portalContainer, setPortalContainer] = useState<HTMLElement | null>(null);\n\n\t/* eslint-disable react-hooks-extra/no-direct-set-state-in-use-effect -- Allow */\n\n\tuseEffect(() => {\n\t\tif (!to) return;\n\n\t\tif (insertPosition) return;\n\n\t\tconst destination = isString(to) ? document.querySelector<HTMLElement>(to) : to;\n\n\t\tdestination && setPortalContainer(destination);\n\t}, [to, insertPosition]);\n\n\tuseEffect(() => {\n\t\tif (!to) return;\n\n\t\tif (!insertPosition) return;\n\n\t\tconst destination = isString(to) ? document.querySelector<HTMLElement>(to) : to;\n\n\t\tconst tempWrapper = document.createElement(\"div\");\n\t\ttempWrapper.style.display = \"contents\";\n\n\t\tdestination?.insertAdjacentElement(insertPosition, tempWrapper);\n\n\t\tsetPortalContainer(tempWrapper);\n\n\t\treturn () => {\n\t\t\ttempWrapper.remove();\n\t\t};\n\t}, [to, insertPosition]);\n\n\t/* eslint-enable react-hooks-extra/no-direct-set-state-in-use-effect -- Allow */\n\n\treturn portalContainer && createPortal(children, portalContainer);\n}\n\nexport { Teleport };\n"],"mappings":";;;;;AAeA,SAAS,SAAS,OAAoB;CACrC,MAAM,EAAE,UAAU,gBAAgB,OAAO;CAEzC,MAAM,CAAC,iBAAiB,sBAAsB,SAA6B,KAAK;AAIhF,iBAAgB;AACf,MAAI,CAAC,GAAI;AAET,MAAI,eAAgB;EAEpB,MAAM,cAAc,SAAS,GAAG,GAAG,SAAS,cAA2B,GAAG,GAAG;AAE7E,iBAAe,mBAAmB,YAAY;IAC5C,CAAC,IAAI,eAAe,CAAC;AAExB,iBAAgB;AACf,MAAI,CAAC,GAAI;AAET,MAAI,CAAC,eAAgB;EAErB,MAAM,cAAc,SAAS,GAAG,GAAG,SAAS,cAA2B,GAAG,GAAG;EAE7E,MAAM,cAAc,SAAS,cAAc,MAAM;AACjD,cAAY,MAAM,UAAU;AAE5B,eAAa,sBAAsB,gBAAgB,YAAY;AAE/D,qBAAmB,YAAY;AAE/B,eAAa;AACZ,eAAY,QAAQ;;IAEnB,CAAC,IAAI,eAAe,CAAC;AAIxB,QAAO,mBAAmB,aAAa,UAAU,gBAAgB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"for-
|
|
1
|
+
{"version":3,"file":"for-BYsFEk3R.js","names":[],"sources":["../../src/components/common/for/for.tsx","../../src/components/common/for/getElementList.ts"],"sourcesContent":["import type {\n\tDiscriminatedRenderItemProps,\n\tPolymorphicPropsStrict,\n} from \"@zayne-labs/toolkit-react/utils\";\nimport { isArray, isNumber, type Prettify } from \"@zayne-labs/toolkit-type-helpers\";\nimport * as React from \"react\";\n\ntype ArrayOrNumber = number | readonly unknown[];\n\ntype GetArrayItemType<TArray extends ArrayOrNumber> =\n\tTArray extends readonly unknown[] ? TArray[number]\n\t: TArray extends number ? number\n\t: unknown;\n\ntype RenderPropFn<TArray extends ArrayOrNumber> = (\n\titem: GetArrayItemType<TArray>,\n\tindex: number,\n\tarray: Array<GetArrayItemType<TArray>>\n) => React.ReactNode;\n\nexport type ForRenderProps<TArray extends ArrayOrNumber> = DiscriminatedRenderItemProps<\n\tRenderPropFn<TArray>\n>;\n\n/* eslint-disable perfectionist/sort-intersection-types -- Prefer the object to come first before the render props */\ntype ForProps<TArray extends ArrayOrNumber> = Prettify<\n\t{\n\t\teach: TArray;\n\t\tfallback?: React.ReactNode;\n\t} & ForRenderProps<TArray>\n>;\n/* eslint-enable perfectionist/sort-intersection-types -- Prefer the object to come first before the render props */\n\nexport function For<const TArray extends ArrayOrNumber>(props: ForProps<TArray>) {\n\tconst { children, each, fallback = null, renderItem } = props;\n\n\t// eslint-disable-next-line ts-eslint/no-unnecessary-condition -- Allow\n\tif (each == null || (isNumber(each) && each === 0) || (isArray(each) && each.length === 0)) {\n\t\treturn fallback;\n\t}\n\n\tconst resolvedArray = isNumber(each) ? [...Array(each).keys()] : (each as unknown[]);\n\n\tif (resolvedArray.length === 0) {\n\t\treturn fallback;\n\t}\n\n\tconst selectedChildren = typeof children === \"function\" ? children : renderItem;\n\n\tconst elementList = resolvedArray.map((...params) => {\n\t\ttype Params = Parameters<RenderPropFn<TArray>>;\n\n\t\treturn selectedChildren(...(params as Params));\n\t});\n\n\treturn elementList;\n}\n\nexport function ForWithWrapper<\n\tconst TArray extends ArrayOrNumber,\n\tTElement extends React.ElementType = \"ul\",\n>(props: PolymorphicPropsStrict<TElement, ForProps<TArray>>) {\n\tconst { as: ListContainer = \"ul\", children, each, renderItem, ...restOfListProps } = props;\n\n\treturn (\n\t\t<ListContainer {...restOfListProps}>\n\t\t\t<For {...({ children, each, renderItem } as ForProps<TArray>)} />\n\t\t</ListContainer>\n\t);\n}\n","import { For, ForWithWrapper } from \"./for\";\n\ntype GetElementListResult<TVariant extends \"base\" | \"withWrapper\"> =\n\tTVariant extends \"base\" ? [typeof For] : [typeof ForWithWrapper];\n\nconst getElementList = <TVariant extends \"base\" | \"withWrapper\" = \"withWrapper\">(\n\tvariant?: TVariant\n): GetElementListResult<TVariant> => {\n\tswitch (variant) {\n\t\tcase \"base\": {\n\t\t\treturn [For] as never;\n\t\t}\n\t\tcase \"withWrapper\": {\n\t\t\treturn [ForWithWrapper] as never;\n\t\t}\n\t\tdefault: {\n\t\t\treturn [ForWithWrapper] as never;\n\t\t}\n\t}\n};\n\nexport { getElementList };\n"],"mappings":";;;;;AAiCA,SAAgB,IAAwC,OAAyB;CAChF,MAAM,EAAE,UAAU,MAAM,WAAW,MAAM,eAAe;AAGxD,KAAI,QAAQ,QAAS,SAAS,KAAK,IAAI,SAAS,KAAO,QAAQ,KAAK,IAAI,KAAK,WAAW,EACvF,QAAO;CAGR,MAAM,gBAAgB,SAAS,KAAK,GAAG,CAAC,GAAG,MAAM,KAAK,CAAC,MAAM,CAAC,GAAI;AAElE,KAAI,cAAc,WAAW,EAC5B,QAAO;CAGR,MAAM,mBAAmB,OAAO,aAAa,aAAa,WAAW;AAQrE,QANoB,cAAc,KAAK,GAAG,WAAW;AAGpD,SAAO,iBAAiB,GAAI,OAAkB;GAC7C;;AAKH,SAAgB,eAGd,OAA2D;CAC5D,MAAM,EAAE,IAAI,gBAAgB,MAAM,UAAU,MAAM,WAAY,GAAG,oBAAoB;AAErF,QACC,oBAAC;EAAc,GAAI;YAClB,oBAAC;GAAW;GAAU;GAAM;IAAqC;GAClD;;;;;AC9DlB,MAAM,kBACL,YACoC;AACpC,SAAQ,SAAR;EACC,KAAK,OACJ,QAAO,CAAC,IAAI;EAEb,KAAK,cACJ,QAAO,CAAC,eAAe;EAExB,QACC,QAAO,CAAC,eAAe"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as React$1 from "react";
|
|
2
2
|
import { Component } from "react";
|
|
3
3
|
import "@zayne-labs/toolkit-react";
|
|
4
|
-
import * as
|
|
4
|
+
import * as react_jsx_runtime1 from "react/jsx-runtime";
|
|
5
5
|
|
|
6
6
|
//#region src/components/common/error-boundary/types.d.ts
|
|
7
7
|
type FallbackProps = {
|
|
@@ -49,7 +49,7 @@ declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryS
|
|
|
49
49
|
};
|
|
50
50
|
componentDidCatch(error: Error, info: React$1.ErrorInfo): void;
|
|
51
51
|
componentDidUpdate(prevProps: ErrorBoundaryProps, prevState: ErrorBoundaryState): void;
|
|
52
|
-
render():
|
|
52
|
+
render(): react_jsx_runtime1.JSX.Element;
|
|
53
53
|
}
|
|
54
54
|
//#endregion
|
|
55
55
|
//#region src/components/common/error-boundary/error-boundary-context.d.ts
|
|
@@ -66,4 +66,4 @@ declare const useErrorBoundary: <TError extends Error>() => {
|
|
|
66
66
|
};
|
|
67
67
|
//#endregion
|
|
68
68
|
export { ErrorBoundary, type ErrorBoundaryContextType, ErrorBoundaryProps, FallbackProps, useErrorBoundary, useErrorBoundaryContext };
|
|
69
|
-
//# sourceMappingURL=index-
|
|
69
|
+
//# sourceMappingURL=index-BwhRxsrZ.d.ts.map
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { ErrorBoundaryProps } from "./index-
|
|
1
|
+
import { ErrorBoundaryProps } from "./index-BwhRxsrZ.js";
|
|
2
2
|
import * as React from "react";
|
|
3
|
-
import * as
|
|
3
|
+
import * as react_jsx_runtime38 from "react/jsx-runtime";
|
|
4
4
|
|
|
5
5
|
//#region src/components/common/suspense-with-boundary/suspense-with-boundary.d.ts
|
|
6
6
|
type SuspenseWithBoundaryProps = {
|
|
@@ -8,7 +8,7 @@ type SuspenseWithBoundaryProps = {
|
|
|
8
8
|
errorFallback?: ErrorBoundaryProps["fallback"];
|
|
9
9
|
fallback?: React.ReactNode;
|
|
10
10
|
};
|
|
11
|
-
declare function SuspenseWithBoundary(props: SuspenseWithBoundaryProps):
|
|
11
|
+
declare function SuspenseWithBoundary(props: SuspenseWithBoundaryProps): react_jsx_runtime38.JSX.Element;
|
|
12
12
|
//#endregion
|
|
13
13
|
export { SuspenseWithBoundary, SuspenseWithBoundaryProps };
|
|
14
|
-
//# sourceMappingURL=index-
|
|
14
|
+
//# sourceMappingURL=index-C_2Onnhl.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"presence-CL5_GHQH.js","names":["timeoutId: number"],"sources":["../../src/components/common/presence/use-presence.ts","../../src/components/common/presence/presence.tsx"],"sourcesContent":["import { on } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef } from \"@zayne-labs/toolkit-react\";\nimport { useEffect, useLayoutEffect, useReducer, useRef, useState } from \"react\";\n\ntype StateMachineConfig<TState extends string, TEvent extends string> = {\n\tinitial: TState;\n\tstates: Record<TState, Partial<Record<TEvent, TState>>>;\n};\n\nconst useStateMachine = <TState extends string, TEvent extends string>(\n\tconfig: StateMachineConfig<TState, TEvent>\n) => {\n\tconst reducer = (prevState: TState, event: TEvent): TState => {\n\t\tconst newState = config.states[prevState][event] ?? prevState;\n\n\t\treturn newState;\n\t};\n\n\treturn useReducer(reducer, config.initial);\n};\n\nconst getAnimationName = (styles: CSSStyleDeclaration | null) => styles?.animationName ?? \"none\";\n\nexport type UsePresenceOptions = {\n\tonExitComplete?: () => void;\n\tpresent: boolean;\n};\n\n/**\n * React hook that provides the ability to animate the mount/unmount of a component.\n * @see https://github.com/radix-ui/primitives/blob/main/packages/react/presence/src/presence.tsx\n */\n\nconst usePresence = (options: UsePresenceOptions) => {\n\tconst { onExitComplete, present } = options;\n\n\tconst saveOnExitComplete = useCallbackRef(onExitComplete);\n\n\tconst [node, setNode] = useState<HTMLElement | null>(null);\n\n\tconst stylesRef = useRef<CSSStyleDeclaration | null>(null);\n\n\tconst prevPresentRef = useRef(present);\n\tconst prevAnimationNameRef = useRef<string>(\"none\");\n\n\tconst initialState = present ? \"mounted\" : \"unmounted\";\n\n\tconst [state, send] = useStateMachine({\n\t\tinitial: initialState,\n\t\tstates: {\n\t\t\tmounted: {\n\t\t\t\tANIMATION_OUT: \"unmountSuspended\",\n\t\t\t\tUNMOUNT: \"unmounted\",\n\t\t\t},\n\t\t\tunmounted: {\n\t\t\t\tMOUNT: \"mounted\",\n\t\t\t},\n\t\t\tunmountSuspended: {\n\t\t\t\tANIMATION_END: \"unmounted\",\n\t\t\t\tMOUNT: \"mounted\",\n\t\t\t},\n\t\t},\n\t});\n\n\tuseEffect(() => {\n\t\tconst currentAnimationName = getAnimationName(stylesRef.current);\n\t\tprevAnimationNameRef.current = state === \"mounted\" ? currentAnimationName : \"none\";\n\t}, [state]);\n\n\tuseLayoutEffect(() => {\n\t\tconst styles = stylesRef.current;\n\t\tconst wasPresent = prevPresentRef.current;\n\t\tconst hasPresentChanged = wasPresent !== present;\n\n\t\tif (!hasPresentChanged) return;\n\n\t\tconst prevAnimationName = prevAnimationNameRef.current;\n\t\tconst currentAnimationName = getAnimationName(styles);\n\n\t\tswitch (true) {\n\t\t\tcase present: {\n\t\t\t\tsend(\"MOUNT\");\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tcase Boolean(node): {\n\t\t\t\tconst hasAnimation =\n\t\t\t\t\t(currentAnimationName !== \"none\" && styles?.display !== \"none\")\n\t\t\t\t\t|| (styles?.transitionProperty !== \"none\" && Number(styles?.transitionDuration) > 0);\n\n\t\t\t\t/* If there is no exit animation or the element is hidden, animations won't run, so we unmount instantly */\n\t\t\t\tif (!hasAnimation) {\n\t\t\t\t\tsend(\"UNMOUNT\");\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\t/**\n\t\t\t\t * When `present` changes to `false`, we check changes to animation-name to\n\t\t\t\t * determine whether an animation has started. We chose this approach (reading\n\t\t\t\t * computed styles) because there is no `animationrun` event and `animationstart`\n\t\t\t\t * fires after `animation-delay` has expired which would be too late.\n\t\t\t\t */\n\n\t\t\t\tconst isAnimating = prevAnimationName !== currentAnimationName;\n\n\t\t\t\tconst isAnimatingOut = wasPresent && isAnimating;\n\n\t\t\t\tif (!isAnimatingOut) {\n\t\t\t\t\tsend(\"UNMOUNT\");\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tsend(\"ANIMATION_OUT\");\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tdefault: {\n\t\t\t\tsend(\"UNMOUNT\");\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\tprevPresentRef.current = present;\n\t}, [present, node, send]);\n\n\tuseLayoutEffect(() => {\n\t\tif (!node) {\n\t\t\t// Transition to the unmounted state if the node is removed prematurely.\n\t\t\t// We avoid doing so during cleanup as the node may change but still exist.\n\t\t\tsend(\"ANIMATION_END\");\n\t\t\treturn;\n\t\t}\n\n\t\tlet timeoutId: number;\n\n\t\tconst ownerWindow = node.ownerDocument.defaultView ?? globalThis;\n\n\t\t/**\n\t\t * @description Triggering an ANIMATION_OUT during an ANIMATION_IN will fire an `animationcancel`\n\t\t * event for ANIMATION_IN after we have entered `unmountSuspended` state. So, we\n\t\t * make sure we only trigger ANIMATION_END for the currently active animation.\n\t\t */\n\t\tconst handleAnimationEnd = (event: AnimationEvent) => {\n\t\t\tconst currentAnimationName = getAnimationName(stylesRef.current);\n\n\t\t\t// The event.animationName is unescaped for CSS syntax, so we need to escape it to compare with the animationName computed from the style.\n\t\t\tconst isCurrentAnimation = currentAnimationName.includes(CSS.escape(event.animationName));\n\n\t\t\tconst isTargetAnimatingNode = event.target === node && isCurrentAnimation;\n\n\t\t\tif (!isTargetAnimatingNode) return;\n\n\t\t\t// With React 18 concurrency this update is applied a frame after the\n\t\t\t// animation ends, creating a flash of visible content. By setting the\n\t\t\t// animation fill mode to \"forwards\", we force the node to keep the\n\t\t\t// styles of the last keyframe, removing the flash.\n\n\t\t\t// Previously we flushed the update via ReactDom.flushSync, but with\n\t\t\t// exit animations this resulted in the node being removed from the\n\t\t\t// DOM before the synthetic animationEnd event was dispatched, meaning\n\t\t\t// user-provided event handlers would not be called.\n\t\t\t// https://github.com/radix-ui/primitives/pull/1849\n\t\t\tsend(\"ANIMATION_END\");\n\n\t\t\tif (!prevPresentRef.current) {\n\t\t\t\tconst currentFillMode = node.style.animationFillMode;\n\t\t\t\tnode.style.animationFillMode = \"forwards\";\n\n\t\t\t\t// Reset the style after the node had time to unmount (for cases\n\t\t\t\t// where the component chooses not to unmount). Doing this any\n\t\t\t\t// sooner than `setTimeout` (e.g. with `requestAnimationFrame`)\n\t\t\t\t// still causes a flash.\n\t\t\t\ttimeoutId = ownerWindow.setTimeout(() => {\n\t\t\t\t\tif (node.style.animationFillMode === \"forwards\") {\n\t\t\t\t\t\tnode.style.animationFillMode = currentFillMode;\n\t\t\t\t\t}\n\t\t\t\t}) as never;\n\t\t\t}\n\t\t};\n\n\t\tconst handleTransitionEnd = (event: TransitionEvent) => {\n\t\t\tconst isTargetTransitioningNode = event.target === node && !prevPresentRef.current;\n\n\t\t\tif (!isTargetTransitioningNode) return;\n\n\t\t\tsend(\"ANIMATION_END\");\n\t\t};\n\n\t\tconst handleAnimationStart = (event: AnimationEvent) => {\n\t\t\tconst isTargetAnimatingNode = event.target === node;\n\n\t\t\tif (!isTargetAnimatingNode) return;\n\n\t\t\tprevAnimationNameRef.current = getAnimationName(stylesRef.current);\n\t\t};\n\n\t\tconst onAnimationStartCleanup = on(\"animationstart\", node, handleAnimationStart);\n\t\tconst onAnimationEndCleanup = on(\"animationend\", node, handleAnimationEnd);\n\t\tconst onAnimationCancelCleanup = on(\"animationcancel\", node, handleAnimationEnd);\n\t\tconst onTransitionEndCleanup = on(\"transitionend\", node, handleTransitionEnd);\n\t\tconst onTransitionCancelCleanup = on(\"transitioncancel\", node, handleTransitionEnd);\n\n\t\treturn () => {\n\t\t\townerWindow.clearTimeout(timeoutId);\n\t\t\tonAnimationStartCleanup();\n\t\t\tonAnimationEndCleanup();\n\t\t\tonAnimationCancelCleanup();\n\t\t\tonTransitionEndCleanup();\n\t\t\tonTransitionCancelCleanup();\n\t\t};\n\t}, [node, send]);\n\n\tuseEffect(() => {\n\t\tconst isExitCompleted = state === \"unmounted\" && !present;\n\n\t\tif (!isExitCompleted) return;\n\n\t\tsaveOnExitComplete();\n\t}, [state, present, saveOnExitComplete]);\n\n\tconst isPresent = ([\"mounted\", \"unmountSuspended\"] satisfies Array<typeof state>).includes(state);\n\n\tconst ref = useCallbackRef((refNode: HTMLElement | null) => {\n\t\trefNode && (stylesRef.current = getComputedStyle(refNode));\n\t\tsetNode(refNode);\n\t});\n\n\treturn {\n\t\tisPresent,\n\t\tref,\n\t};\n};\n\nexport { usePresence };\n","\"use client\";\n\nimport { useComposeRefs } from \"@zayne-labs/toolkit-react\";\nimport { isFunction, type UnknownObject } from \"@zayne-labs/toolkit-type-helpers\";\nimport * as React from \"react\";\nimport { Children, cloneElement } from \"react\";\nimport { type UsePresenceOptions, usePresence } from \"./use-presence\";\n\ntype RefProp = { ref?: React.Ref<HTMLElement> };\n\ntype PresenceProps = UsePresenceOptions & {\n\tchildren?:\n\t\t| React.ReactElement<RefProp>\n\t\t| ((props: { isPresent: boolean }) => React.ReactElement<RefProp>);\n\tforceMount?: boolean;\n};\n\nfunction Presence(props: PresenceProps) {\n\tconst { children, forceMount = false, onExitComplete, present } = props;\n\n\tconst presence = usePresence({ onExitComplete, present });\n\n\tconst resolvedChild =\n\t\tisFunction(children) ? children({ isPresent: presence.isPresent }) : Children.only(children);\n\n\tconst childRef = (resolvedChild?.props.ref\n\t\t?? (resolvedChild as unknown as UnknownObject).ref) as React.Ref<HTMLElement>;\n\n\tconst ref = useComposeRefs(presence.ref, childRef);\n\n\tconst shouldRender = forceMount || presence.isPresent;\n\n\tif (!shouldRender) {\n\t\treturn null;\n\t}\n\n\treturn resolvedChild && cloneElement(resolvedChild, { ref });\n}\n\nexport { Presence };\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"presence-CAQElNtY.js","names":["timeoutId: number"],"sources":["../../src/components/common/presence/use-presence.ts","../../src/components/common/presence/presence.tsx"],"sourcesContent":["import { on } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef } from \"@zayne-labs/toolkit-react\";\nimport { useEffect, useLayoutEffect, useReducer, useRef, useState } from \"react\";\n\ntype StateMachineConfig<TState extends string, TEvent extends string> = {\n\tinitial: TState;\n\tstates: Record<TState, Partial<Record<TEvent, TState>>>;\n};\n\nconst useStateMachine = <TState extends string, TEvent extends string>(\n\tconfig: StateMachineConfig<TState, TEvent>\n) => {\n\tconst reducer = (prevState: TState, event: TEvent): TState => {\n\t\tconst newState = config.states[prevState][event] ?? prevState;\n\n\t\treturn newState;\n\t};\n\n\treturn useReducer(reducer, config.initial);\n};\n\nconst getAnimationName = (styles: CSSStyleDeclaration | null) => styles?.animationName ?? \"none\";\n\nexport type UsePresenceOptions = {\n\tonExitComplete?: () => void;\n\tpresent: boolean;\n};\n\n/**\n * React hook that provides the ability to animate the mount/unmount of a component.\n * @see https://github.com/radix-ui/primitives/blob/main/packages/react/presence/src/presence.tsx\n */\n\nconst usePresence = (options: UsePresenceOptions) => {\n\tconst { onExitComplete, present } = options;\n\n\tconst saveOnExitComplete = useCallbackRef(onExitComplete);\n\n\tconst [node, setNode] = useState<HTMLElement | null>(null);\n\n\tconst stylesRef = useRef<CSSStyleDeclaration | null>(null);\n\n\tconst prevPresentRef = useRef(present);\n\tconst prevAnimationNameRef = useRef<string>(\"none\");\n\n\tconst initialState = present ? \"mounted\" : \"unmounted\";\n\n\tconst [state, send] = useStateMachine({\n\t\tinitial: initialState,\n\t\tstates: {\n\t\t\tmounted: {\n\t\t\t\tANIMATION_OUT: \"unmountSuspended\",\n\t\t\t\tUNMOUNT: \"unmounted\",\n\t\t\t},\n\t\t\tunmounted: {\n\t\t\t\tMOUNT: \"mounted\",\n\t\t\t},\n\t\t\tunmountSuspended: {\n\t\t\t\tANIMATION_END: \"unmounted\",\n\t\t\t\tMOUNT: \"mounted\",\n\t\t\t},\n\t\t},\n\t});\n\n\tuseEffect(() => {\n\t\tconst currentAnimationName = getAnimationName(stylesRef.current);\n\t\tprevAnimationNameRef.current = state === \"mounted\" ? currentAnimationName : \"none\";\n\t}, [state]);\n\n\tuseLayoutEffect(() => {\n\t\tconst styles = stylesRef.current;\n\t\tconst wasPresent = prevPresentRef.current;\n\t\tconst hasPresentChanged = wasPresent !== present;\n\n\t\tif (!hasPresentChanged) return;\n\n\t\tconst prevAnimationName = prevAnimationNameRef.current;\n\t\tconst currentAnimationName = getAnimationName(styles);\n\n\t\tswitch (true) {\n\t\t\tcase present: {\n\t\t\t\tsend(\"MOUNT\");\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tcase Boolean(node): {\n\t\t\t\tconst hasAnimation =\n\t\t\t\t\t(currentAnimationName !== \"none\" && styles?.display !== \"none\")\n\t\t\t\t\t|| (styles?.transitionProperty !== \"none\" && Number(styles?.transitionDuration) > 0);\n\n\t\t\t\t/* If there is no exit animation or the element is hidden, animations won't run, so we unmount instantly */\n\t\t\t\tif (!hasAnimation) {\n\t\t\t\t\tsend(\"UNMOUNT\");\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\t/**\n\t\t\t\t * When `present` changes to `false`, we check changes to animation-name to\n\t\t\t\t * determine whether an animation has started. We chose this approach (reading\n\t\t\t\t * computed styles) because there is no `animationrun` event and `animationstart`\n\t\t\t\t * fires after `animation-delay` has expired which would be too late.\n\t\t\t\t */\n\n\t\t\t\tconst isAnimating = prevAnimationName !== currentAnimationName;\n\n\t\t\t\tconst isAnimatingOut = wasPresent && isAnimating;\n\n\t\t\t\tif (!isAnimatingOut) {\n\t\t\t\t\tsend(\"UNMOUNT\");\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tsend(\"ANIMATION_OUT\");\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tdefault: {\n\t\t\t\tsend(\"UNMOUNT\");\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\n\t\tprevPresentRef.current = present;\n\t}, [present, node, send]);\n\n\tuseLayoutEffect(() => {\n\t\tif (!node) {\n\t\t\t// Transition to the unmounted state if the node is removed prematurely.\n\t\t\t// We avoid doing so during cleanup as the node may change but still exist.\n\t\t\tsend(\"ANIMATION_END\");\n\t\t\treturn;\n\t\t}\n\n\t\tlet timeoutId: number;\n\n\t\tconst ownerWindow = node.ownerDocument.defaultView ?? globalThis;\n\n\t\t/**\n\t\t * @description Triggering an ANIMATION_OUT during an ANIMATION_IN will fire an `animationcancel`\n\t\t * event for ANIMATION_IN after we have entered `unmountSuspended` state. So, we\n\t\t * make sure we only trigger ANIMATION_END for the currently active animation.\n\t\t */\n\t\tconst handleAnimationEnd = (event: AnimationEvent) => {\n\t\t\tconst currentAnimationName = getAnimationName(stylesRef.current);\n\n\t\t\t// The event.animationName is unescaped for CSS syntax, so we need to escape it to compare with the animationName computed from the style.\n\t\t\tconst isCurrentAnimation = currentAnimationName.includes(CSS.escape(event.animationName));\n\n\t\t\tconst isTargetAnimatingNode = event.target === node && isCurrentAnimation;\n\n\t\t\tif (!isTargetAnimatingNode) return;\n\n\t\t\t// With React 18 concurrency this update is applied a frame after the\n\t\t\t// animation ends, creating a flash of visible content. By setting the\n\t\t\t// animation fill mode to \"forwards\", we force the node to keep the\n\t\t\t// styles of the last keyframe, removing the flash.\n\n\t\t\t// Previously we flushed the update via ReactDom.flushSync, but with\n\t\t\t// exit animations this resulted in the node being removed from the\n\t\t\t// DOM before the synthetic animationEnd event was dispatched, meaning\n\t\t\t// user-provided event handlers would not be called.\n\t\t\t// https://github.com/radix-ui/primitives/pull/1849\n\t\t\tsend(\"ANIMATION_END\");\n\n\t\t\tif (!prevPresentRef.current) {\n\t\t\t\tconst currentFillMode = node.style.animationFillMode;\n\t\t\t\tnode.style.animationFillMode = \"forwards\";\n\n\t\t\t\t// Reset the style after the node had time to unmount (for cases\n\t\t\t\t// where the component chooses not to unmount). Doing this any\n\t\t\t\t// sooner than `setTimeout` (e.g. with `requestAnimationFrame`)\n\t\t\t\t// still causes a flash.\n\t\t\t\ttimeoutId = ownerWindow.setTimeout(() => {\n\t\t\t\t\tif (node.style.animationFillMode === \"forwards\") {\n\t\t\t\t\t\tnode.style.animationFillMode = currentFillMode;\n\t\t\t\t\t}\n\t\t\t\t}) as never;\n\t\t\t}\n\t\t};\n\n\t\tconst handleTransitionEnd = (event: TransitionEvent) => {\n\t\t\tconst isTargetTransitioningNode = event.target === node && !prevPresentRef.current;\n\n\t\t\tif (!isTargetTransitioningNode) return;\n\n\t\t\tsend(\"ANIMATION_END\");\n\t\t};\n\n\t\tconst handleAnimationStart = (event: AnimationEvent) => {\n\t\t\tconst isTargetAnimatingNode = event.target === node;\n\n\t\t\tif (!isTargetAnimatingNode) return;\n\n\t\t\tprevAnimationNameRef.current = getAnimationName(stylesRef.current);\n\t\t};\n\n\t\tconst onAnimationStartCleanup = on(\"animationstart\", node, handleAnimationStart);\n\t\tconst onAnimationEndCleanup = on(\"animationend\", node, handleAnimationEnd);\n\t\tconst onAnimationCancelCleanup = on(\"animationcancel\", node, handleAnimationEnd);\n\t\tconst onTransitionEndCleanup = on(\"transitionend\", node, handleTransitionEnd);\n\t\tconst onTransitionCancelCleanup = on(\"transitioncancel\", node, handleTransitionEnd);\n\n\t\treturn () => {\n\t\t\townerWindow.clearTimeout(timeoutId);\n\t\t\tonAnimationStartCleanup();\n\t\t\tonAnimationEndCleanup();\n\t\t\tonAnimationCancelCleanup();\n\t\t\tonTransitionEndCleanup();\n\t\t\tonTransitionCancelCleanup();\n\t\t};\n\t}, [node, send]);\n\n\tuseEffect(() => {\n\t\tconst isExitCompleted = state === \"unmounted\" && !present;\n\n\t\tif (!isExitCompleted) return;\n\n\t\tsaveOnExitComplete();\n\t}, [state, present, saveOnExitComplete]);\n\n\tconst isPresent = ([\"mounted\", \"unmountSuspended\"] satisfies Array<typeof state>).includes(state);\n\n\tconst ref = useCallbackRef((refNode: HTMLElement | null) => {\n\t\trefNode && (stylesRef.current = getComputedStyle(refNode));\n\t\tsetNode(refNode);\n\t});\n\n\treturn {\n\t\tisPresent,\n\t\tref,\n\t};\n};\n\nexport { usePresence };\n","\"use client\";\n\nimport { useComposeRefs } from \"@zayne-labs/toolkit-react\";\nimport { isFunction, type UnknownObject } from \"@zayne-labs/toolkit-type-helpers\";\nimport * as React from \"react\";\nimport { Children, cloneElement } from \"react\";\nimport { type UsePresenceOptions, usePresence } from \"./use-presence\";\n\ntype RefProp = { ref?: React.Ref<HTMLElement> };\n\ntype PresenceProps = UsePresenceOptions & {\n\tchildren?:\n\t\t| React.ReactElement<RefProp>\n\t\t| ((props: { isPresent: boolean }) => React.ReactElement<RefProp>);\n\tforceMount?: boolean;\n};\n\nfunction Presence(props: PresenceProps) {\n\tconst { children, forceMount = false, onExitComplete, present } = props;\n\n\tconst presence = usePresence({ onExitComplete, present });\n\n\tconst resolvedChild =\n\t\tisFunction(children) ? children({ isPresent: presence.isPresent }) : Children.only(children);\n\n\tconst childRef = (resolvedChild?.props.ref\n\t\t?? (resolvedChild as unknown as UnknownObject).ref) as React.Ref<HTMLElement>;\n\n\tconst ref = useComposeRefs(presence.ref, childRef);\n\n\tconst shouldRender = forceMount || presence.isPresent;\n\n\tif (!shouldRender) {\n\t\treturn null;\n\t}\n\n\treturn resolvedChild && cloneElement(resolvedChild, { ref });\n}\n\nexport { Presence };\n"],"mappings":"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"}
|