@zayne-labs/ui-react 0.10.43 → 0.10.45
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/{client-gate-Cw8xLDk7.js → client-gate-B3fRopBx.js} +1 -1
- package/dist/esm/{client-gate-Cw8xLDk7.js.map → client-gate-B3fRopBx.js.map} +1 -1
- package/dist/esm/{cn-CRgXviN7.js → cn-Dnsqr-G7.js} +1 -1
- package/dist/esm/{cn-CRgXviN7.js.map → cn-Dnsqr-G7.js.map} +1 -1
- package/dist/esm/common/await/index.d.ts +6 -6
- package/dist/esm/common/await/index.js +3 -3
- package/dist/esm/common/client-gate/index.d.ts +2 -2
- package/dist/esm/common/client-gate/index.js +1 -1
- package/dist/esm/common/error-boundary/index.d.ts +1 -1
- package/dist/esm/common/error-boundary/index.js +1 -1
- package/dist/esm/common/for/index.d.ts +4 -4
- package/dist/esm/common/for/index.js +1 -1
- package/dist/esm/common/presence/index.d.ts +2 -2
- package/dist/esm/common/presence/index.js +1 -1
- package/dist/esm/common/show/index.d.ts +4 -4
- package/dist/esm/common/show/index.js +1 -1
- package/dist/esm/common/slot/index.d.ts +4 -4
- package/dist/esm/common/slot/index.js +1 -1
- package/dist/esm/common/suspense-with-boundary/index.d.ts +2 -2
- package/dist/esm/common/suspense-with-boundary/index.js +1 -1
- package/dist/esm/common/switch/index.d.ts +4 -4
- package/dist/esm/common/teleport/index.d.ts +1 -1
- package/dist/esm/common/teleport/index.js +3 -4
- package/dist/esm/common/teleport/index.js.map +1 -1
- package/dist/esm/{error-boundary-d5gAkevd.js → error-boundary-TM4xzQfq.js} +2 -2
- package/dist/esm/{error-boundary-d5gAkevd.js.map → error-boundary-TM4xzQfq.js.map} +1 -1
- package/dist/esm/{for-DsdwXl8s.js → for-BeCRb3k2.js} +1 -1
- package/dist/esm/{for-DsdwXl8s.js.map → for-BeCRb3k2.js.map} +1 -1
- package/dist/esm/{index-B18eyjt6.d.ts → index-Dvt8y6Uu.d.ts} +6 -6
- package/dist/esm/{index-TuD6cvBZ.d.ts → index-DzMX8Xce.d.ts} +4 -4
- package/dist/esm/{presence-C2HmLiVc.js → presence-Ctp-Trws.js} +3 -3
- package/dist/esm/{presence-C2HmLiVc.js.map → presence-Ctp-Trws.js.map} +1 -1
- package/dist/esm/{show-Ch_s-Sr-.js → show-7VInUu_D.js} +1 -1
- package/dist/esm/{show-Ch_s-Sr-.js.map → show-7VInUu_D.js.map} +1 -1
- package/dist/esm/{slot-DL8c8KCQ.js → slot-CURylbjq.js} +1 -1
- package/dist/esm/{slot-DL8c8KCQ.js.map → slot-CURylbjq.js.map} +1 -1
- package/dist/esm/ui/card/index.d.ts +8 -8
- package/dist/esm/ui/card/index.js +2 -2
- package/dist/esm/ui/carousel/index.js +4 -4
- package/dist/esm/ui/drag-scroll/index.js +2 -2
- package/dist/esm/ui/drop-zone/index.d.ts +17 -17
- package/dist/esm/ui/drop-zone/index.js +5 -5
- package/dist/esm/ui/form/index.d.ts +22 -22
- package/dist/esm/ui/form/index.js +12 -12
- package/dist/esm/ui/form/index.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"client-gate-
|
|
1
|
+
{"version":3,"file":"client-gate-B3fRopBx.js","names":[],"sources":["../../src/components/common/client-gate/client-gate.tsx"],"sourcesContent":["\"use client\";\n\nimport { useIsHydrated } from \"@zayne-labs/toolkit-react\";\nimport { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\n\ntype ClientGateProps = {\n\t/**\n\t * You are encouraged to add a fallback that is the same dimensions\n\t * as the client rendered children. This will avoid content layout\n\t * shift which is disgusting 🥲\n\t */\n\tchildren: React.ReactNode | (() => React.ReactNode);\n\tfallback?: React.ReactNode;\n};\n\n/**\n * @description Render the children only after the JS has loaded client-side. Use an optional\n * fallback component if the JS is not yet loaded.\n *\n * @example\n * **Render a Chart component if JS loads, renders a simple FakeChart\n * component server-side or if there is no JS. The FakeChart can have only the\n * UI without the behavior or be a loading spinner or skeleton.**\n *\n * ```tsx\n * return (\n * <ClientOnly fallback={<FakeChart />}>\n * {() => <Chart />}\n * </ClientOnly>\n * );\n * ```\n */\nfunction ClientGate(props: ClientGateProps) {\n\tconst { children, fallback } = props;\n\n\tconst isHydrated = useIsHydrated();\n\n\tconst getResolvedChildren = () => (isFunction(children) ? children() : children);\n\n\treturn isHydrated ? getResolvedChildren() : fallback;\n}\n\nexport { ClientGate };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAgCA,SAAS,WAAW,OAAwB;CAC3C,MAAM,EAAE,UAAU,aAAa;CAE/B,MAAM,aAAa,eAAe;CAElC,MAAM,4BAA6B,WAAW,SAAS,GAAG,UAAU,GAAG;AAEvE,QAAO,aAAa,qBAAqB,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cn-
|
|
1
|
+
{"version":3,"file":"cn-Dnsqr-G7.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,8 +1,8 @@
|
|
|
1
|
-
import { a as ErrorBoundaryProps } from "../../index-
|
|
2
|
-
import { n as SuspenseWithBoundaryProps } from "../../index-
|
|
1
|
+
import { a as ErrorBoundaryProps } from "../../index-Dvt8y6Uu.js";
|
|
2
|
+
import { n as SuspenseWithBoundaryProps } from "../../index-DzMX8Xce.js";
|
|
3
3
|
import { GetSlotComponentProps } from "@zayne-labs/toolkit-react/utils";
|
|
4
|
-
import * as
|
|
5
|
-
import * as
|
|
4
|
+
import * as react17 from "react";
|
|
5
|
+
import * as react_jsx_runtime29 from "react/jsx-runtime";
|
|
6
6
|
|
|
7
7
|
//#region src/components/common/await/await.d.ts
|
|
8
8
|
type RenderPropFn<TValue> = (result: TValue) => React.ReactNode;
|
|
@@ -14,9 +14,9 @@ type AwaitRootProps<TValue> = Pick<SuspenseWithBoundaryProps, "errorFallback" |
|
|
|
14
14
|
withErrorBoundary?: boolean;
|
|
15
15
|
withSuspense?: boolean;
|
|
16
16
|
};
|
|
17
|
-
declare function AwaitRoot<TValue>(props: AwaitRootProps<TValue>):
|
|
17
|
+
declare function AwaitRoot<TValue>(props: AwaitRootProps<TValue>): react_jsx_runtime29.JSX.Element;
|
|
18
18
|
type AwaitSuccessProps<TValue = unknown> = GetSlotComponentProps<"default", ChildrenType<TValue>>;
|
|
19
|
-
declare function AwaitSuccess<TPromiseOrValue, TValue = Awaited<TPromiseOrValue>>(props: Pick<AwaitSuccessProps<TValue>, "children">):
|
|
19
|
+
declare function AwaitSuccess<TPromiseOrValue, TValue = Awaited<TPromiseOrValue>>(props: Pick<AwaitSuccessProps<TValue>, "children">): react17.ReactNode;
|
|
20
20
|
type AwaitErrorProps = GetSlotComponentProps<"error", ErrorBoundaryProps["fallback"]>;
|
|
21
21
|
declare const AwaitError: {
|
|
22
22
|
(props: Pick<AwaitErrorProps, "children"> & {
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
|
|
3
3
|
import { t as __export } from "../../chunk-BL-4obUL.js";
|
|
4
|
-
import { n as
|
|
5
|
-
import { n as
|
|
4
|
+
import { n as ErrorBoundary, r as useErrorBoundaryContext } from "../../error-boundary-TM4xzQfq.js";
|
|
5
|
+
import { n as SlotRoot } from "../../slot-CURylbjq.js";
|
|
6
6
|
import { getSlotMap, withSlotNameAndSymbol } from "@zayne-labs/toolkit-react/utils";
|
|
7
7
|
import { isFunction } from "@zayne-labs/toolkit-type-helpers";
|
|
8
8
|
import { Fragment, Suspense, use, useMemo } from "react";
|
|
9
|
-
import { jsx } from "react/jsx-runtime";
|
|
10
9
|
import { createCustomContext } from "@zayne-labs/toolkit-react";
|
|
10
|
+
import { jsx } from "react/jsx-runtime";
|
|
11
11
|
|
|
12
12
|
//#region src/components/common/await/await-context.ts
|
|
13
13
|
const [AwaitContextProvider, useAwaitContextImpl] = createCustomContext({
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react19 from "react";
|
|
2
2
|
|
|
3
3
|
//#region src/components/common/client-gate/client-gate.d.ts
|
|
4
4
|
type ClientGateProps = {
|
|
@@ -27,7 +27,7 @@ type ClientGateProps = {
|
|
|
27
27
|
* );
|
|
28
28
|
* ```
|
|
29
29
|
*/
|
|
30
|
-
declare function ClientGate(props: ClientGateProps):
|
|
30
|
+
declare function ClientGate(props: ClientGateProps): react19.ReactNode;
|
|
31
31
|
//#endregion
|
|
32
32
|
export { ClientGate };
|
|
33
33
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import { a as ErrorBoundaryProps, i as ErrorBoundary, n as ErrorBoundaryContextType, o as FallbackProps, r as useErrorBoundaryContext, t as useErrorBoundary } from "../../index-
|
|
1
|
+
import { a as ErrorBoundaryProps, i as ErrorBoundary, n as ErrorBoundaryContextType, o as FallbackProps, r as useErrorBoundaryContext, t as useErrorBoundary } from "../../index-Dvt8y6Uu.js";
|
|
2
2
|
export { ErrorBoundary, ErrorBoundaryContextType, ErrorBoundaryProps, FallbackProps, useErrorBoundary, useErrorBoundaryContext };
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
|
|
3
|
-
import { n as ErrorBoundary, r as useErrorBoundaryContext, t as useErrorBoundary } from "../../error-boundary-
|
|
3
|
+
import { n as ErrorBoundary, r as useErrorBoundaryContext, t as useErrorBoundary } from "../../error-boundary-TM4xzQfq.js";
|
|
4
4
|
|
|
5
5
|
export { ErrorBoundary, useErrorBoundary, useErrorBoundaryContext };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { DiscriminatedRenderItemProps, PolymorphicPropsStrict } from "@zayne-labs/toolkit-react/utils";
|
|
2
2
|
import { Prettify } from "@zayne-labs/toolkit-type-helpers";
|
|
3
|
-
import * as
|
|
4
|
-
import * as
|
|
3
|
+
import * as react21 from "react";
|
|
4
|
+
import * as react_jsx_runtime32 from "react/jsx-runtime";
|
|
5
5
|
|
|
6
6
|
//#region src/components/common/for/for.d.ts
|
|
7
7
|
type ArrayOrNumber = number | readonly unknown[];
|
|
@@ -12,10 +12,10 @@ type ForProps<TArray extends ArrayOrNumber> = Prettify<{
|
|
|
12
12
|
each: TArray;
|
|
13
13
|
fallback?: React.ReactNode;
|
|
14
14
|
} & ForRenderProps<TArray>>;
|
|
15
|
-
declare function For<const TArray extends ArrayOrNumber>(props: ForProps<TArray>): string | number | bigint | boolean |
|
|
15
|
+
declare function For<const TArray extends ArrayOrNumber>(props: ForProps<TArray>): string | number | bigint | boolean | react21.ReactElement<unknown, string | react21.JSXElementConstructor<any>> | Iterable<react21.ReactNode> | Promise<string | number | bigint | boolean | react21.ReactPortal | react21.ReactElement<unknown, string | react21.JSXElementConstructor<any>> | Iterable<react21.ReactNode> | null | undefined> | null;
|
|
16
16
|
declare function ForWithWrapper<const TArray extends ArrayOrNumber, TElement extends React.ElementType = "ul">(props: PolymorphicPropsStrict<TElement, ForProps<TArray>> & {
|
|
17
17
|
displayFallBackWhenEmpty?: boolean;
|
|
18
|
-
}): string | number | bigint | boolean | Iterable<
|
|
18
|
+
}): string | number | bigint | boolean | react_jsx_runtime32.JSX.Element | Iterable<react21.ReactNode> | Promise<string | number | bigint | boolean | react21.ReactPortal | react21.ReactElement<unknown, string | react21.JSXElementConstructor<any>> | Iterable<react21.ReactNode> | null | undefined> | null;
|
|
19
19
|
//#endregion
|
|
20
20
|
//#region src/components/common/for/getElementList.d.ts
|
|
21
21
|
type GetElementListResult<TVariant extends "base" | "withWrapper"> = TVariant extends "base" ? [typeof For] : [typeof ForWithWrapper];
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { InferProps } from "@zayne-labs/toolkit-react/utils";
|
|
2
|
-
import * as
|
|
2
|
+
import * as react_jsx_runtime31 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/common/presence/use-presence.d.ts
|
|
5
5
|
type UsePresenceOptions = {
|
|
@@ -30,7 +30,7 @@ type PresenceProps = UsePresenceOptions & {
|
|
|
30
30
|
className?: string;
|
|
31
31
|
forceMount?: boolean;
|
|
32
32
|
};
|
|
33
|
-
declare function Presence(props: PresenceProps):
|
|
33
|
+
declare function Presence(props: PresenceProps): react_jsx_runtime31.JSX.Element | null;
|
|
34
34
|
//#endregion
|
|
35
35
|
export { Presence };
|
|
36
36
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react5 from "react";
|
|
2
2
|
|
|
3
3
|
//#region src/components/common/show/show.d.ts
|
|
4
4
|
type ShowProps<TWhen> = {
|
|
@@ -12,15 +12,15 @@ type ShowProps<TWhen> = {
|
|
|
12
12
|
fallback?: React.ReactNode;
|
|
13
13
|
when: false | TWhen | null | undefined;
|
|
14
14
|
};
|
|
15
|
-
declare function ShowRoot<TWhen>(props: ShowProps<TWhen>): string | number | bigint | boolean |
|
|
15
|
+
declare function ShowRoot<TWhen>(props: ShowProps<TWhen>): string | number | bigint | boolean | react5.ReactElement<unknown, string | react5.JSXElementConstructor<any>> | Iterable<react5.ReactNode> | Promise<string | number | bigint | boolean | react5.ReactPortal | react5.ReactElement<unknown, string | react5.JSXElementConstructor<any>> | Iterable<react5.ReactNode> | null | undefined> | null;
|
|
16
16
|
type ShowContentProps<TWhen> = Pick<ShowProps<TWhen>, "children" | "when">;
|
|
17
|
-
declare function ShowContent<TWhen>(props: ShowContentProps<TWhen>):
|
|
17
|
+
declare function ShowContent<TWhen>(props: ShowContentProps<TWhen>): react5.ReactNode;
|
|
18
18
|
declare namespace ShowContent {
|
|
19
19
|
var slotSymbol: symbol;
|
|
20
20
|
}
|
|
21
21
|
declare function ShowFallback(props: {
|
|
22
22
|
children: React.ReactNode;
|
|
23
|
-
}):
|
|
23
|
+
}): react5.ReactNode;
|
|
24
24
|
declare namespace ShowFallback {
|
|
25
25
|
var slotSymbol: symbol;
|
|
26
26
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
|
|
3
|
-
import { i as ShowRoot, n as ShowContent, r as ShowFallback, t as show_parts_exports } from "../../show-
|
|
3
|
+
import { i as ShowRoot, n as ShowContent, r as ShowFallback, t as show_parts_exports } from "../../show-7VInUu_D.js";
|
|
4
4
|
|
|
5
5
|
export { show_parts_exports as Show, ShowContent, ShowFallback, ShowRoot };
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import { InferProps } from "@zayne-labs/toolkit-react/utils";
|
|
2
|
-
import * as
|
|
3
|
-
import * as
|
|
2
|
+
import * as react0 from "react";
|
|
3
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
4
|
|
|
5
5
|
//#region src/components/common/slot/slot.d.ts
|
|
6
6
|
type SlotProps = InferProps<HTMLElement> & {
|
|
7
7
|
ref?: React.Ref<HTMLElement>;
|
|
8
8
|
};
|
|
9
|
-
declare function SlotRoot(props: SlotProps):
|
|
9
|
+
declare function SlotRoot(props: SlotProps): react_jsx_runtime0.JSX.Element | null;
|
|
10
10
|
declare function SlotSlottable({
|
|
11
11
|
children
|
|
12
|
-
}: Pick<SlotProps, "children">):
|
|
12
|
+
}: Pick<SlotProps, "children">): react0.ReactNode;
|
|
13
13
|
declare namespace slot_parts_d_exports {
|
|
14
14
|
export { SlotRoot as Root, SlotSlottable as Slottable };
|
|
15
15
|
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import "../../index-
|
|
2
|
-
import { n as SuspenseWithBoundaryProps, t as SuspenseWithBoundary } from "../../index-
|
|
1
|
+
import "../../index-Dvt8y6Uu.js";
|
|
2
|
+
import { n as SuspenseWithBoundaryProps, t as SuspenseWithBoundary } from "../../index-DzMX8Xce.js";
|
|
3
3
|
export { SuspenseWithBoundary, SuspenseWithBoundaryProps };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as react14 from "react";
|
|
2
2
|
|
|
3
3
|
//#region src/components/common/switch/switch.d.ts
|
|
4
4
|
type ValidSwitchComponentType = React.ReactElement<SwitchMatchProps<unknown>>;
|
|
@@ -6,17 +6,17 @@ type SwitchProps = {
|
|
|
6
6
|
children: ValidSwitchComponentType | ValidSwitchComponentType[];
|
|
7
7
|
value?: unknown;
|
|
8
8
|
};
|
|
9
|
-
declare function SwitchRoot(props: SwitchProps):
|
|
9
|
+
declare function SwitchRoot(props: SwitchProps): react14.ReactNode;
|
|
10
10
|
type SwitchMatchProps<TWhen> = {
|
|
11
11
|
children: React.ReactNode | ((value: TWhen) => React.ReactNode);
|
|
12
12
|
when: false | TWhen | null | undefined;
|
|
13
13
|
};
|
|
14
|
-
declare function SwitchMatch<TWhen>(props: SwitchMatchProps<TWhen>):
|
|
14
|
+
declare function SwitchMatch<TWhen>(props: SwitchMatchProps<TWhen>): react14.ReactNode;
|
|
15
15
|
declare function SwitchDefault({
|
|
16
16
|
children
|
|
17
17
|
}: {
|
|
18
18
|
children: React.ReactNode;
|
|
19
|
-
}):
|
|
19
|
+
}): react14.ReactNode;
|
|
20
20
|
declare namespace SwitchDefault {
|
|
21
21
|
var slotSymbol: symbol;
|
|
22
22
|
}
|
|
@@ -8,7 +8,7 @@ type PortalProps = {
|
|
|
8
8
|
insertPosition?: InsertPosition;
|
|
9
9
|
to: AnyString | HTMLElement | ValidHtmlTags | null;
|
|
10
10
|
};
|
|
11
|
-
declare function Teleport(props: PortalProps): react_jsx_runtime8.JSX.Element
|
|
11
|
+
declare function Teleport(props: PortalProps): react_jsx_runtime8.JSX.Element;
|
|
12
12
|
//#endregion
|
|
13
13
|
export { Teleport };
|
|
14
14
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { t as ClientGate } from "../../client-gate-
|
|
1
|
+
import { t as ClientGate } from "../../client-gate-B3fRopBx.js";
|
|
2
2
|
import { isString } from "@zayne-labs/toolkit-type-helpers";
|
|
3
3
|
import { useLayoutEffect, useState } from "react";
|
|
4
|
-
import { jsx } from "react/jsx-runtime";
|
|
5
4
|
import { useCallbackRef } from "@zayne-labs/toolkit-react";
|
|
5
|
+
import { jsx } from "react/jsx-runtime";
|
|
6
6
|
import { createPortal } from "react-dom";
|
|
7
7
|
|
|
8
8
|
//#region src/components/common/teleport/teleport.tsx
|
|
@@ -37,8 +37,7 @@ function Teleport(props) {
|
|
|
37
37
|
insertPosition,
|
|
38
38
|
stableUpdatePortalContainer
|
|
39
39
|
]);
|
|
40
|
-
|
|
41
|
-
return /* @__PURE__ */ jsx(ClientGate, { children: () => createPortal(children, portalContainer, TELEPORT_KEY) });
|
|
40
|
+
return /* @__PURE__ */ jsx(ClientGate, { children: () => portalContainer && createPortal(children, portalContainer, TELEPORT_KEY) });
|
|
42
41
|
}
|
|
43
42
|
|
|
44
43
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/common/teleport/teleport.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCallbackRef } from \"@zayne-labs/toolkit-react\";\nimport { type AnyString, isString } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useLayoutEffect, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { ClientGate } from \"../client-gate\";\n\ntype ValidHtmlTags = keyof HTMLElementTagNameMap;\n\ntype PortalProps = {\n\tchildren: React.ReactNode;\n\tinsertPosition?: InsertPosition;\n\tto: AnyString | HTMLElement | ValidHtmlTags | null;\n};\n\nconst TELEPORT_KEY = \"teleport-wrapper\";\n\nfunction Teleport(props: PortalProps) {\n\tconst { children, insertPosition, to } = props;\n\n\tconst [portalContainer, setPortalContainer] = useState<HTMLElement | null>(null);\n\n\tconst stableUpdatePortalContainer = useCallbackRef((destination: HTMLElement | null) => {\n\t\tsetPortalContainer(destination);\n\t});\n\n\tuseLayoutEffect(() => {\n\t\tif (!to) return;\n\n\t\tconst destination = isString(to) ? document.querySelector<HTMLElement>(to) : to;\n\n\t\tif (!insertPosition) {\n\t\t\tdestination && stableUpdatePortalContainer(destination);\n\t\t\treturn;\n\t\t}\n\n\t\tconst tempWrapper = document.createElement(\"div\");\n\t\ttempWrapper.id = TELEPORT_KEY;\n\t\ttempWrapper.style.display = \"contents\";\n\n\t\tdestination?.insertAdjacentElement(insertPosition, tempWrapper);\n\n\t\tconst timeoutId = setTimeout(() => {\n\t\t\ttempWrapper.replaceWith(...tempWrapper.children);\n\t\t}, 0);\n\n\t\tstableUpdatePortalContainer(tempWrapper);\n\n\t\treturn () => {\n\t\t\ttempWrapper.remove();\n\t\t\tclearTimeout(timeoutId);\n\t\t};\n\t}, [to, insertPosition, stableUpdatePortalContainer]);\n\n\
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/common/teleport/teleport.tsx"],"sourcesContent":["\"use client\";\n\nimport { useCallbackRef } from \"@zayne-labs/toolkit-react\";\nimport { type AnyString, isString } from \"@zayne-labs/toolkit-type-helpers\";\nimport { useLayoutEffect, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { ClientGate } from \"../client-gate\";\n\ntype ValidHtmlTags = keyof HTMLElementTagNameMap;\n\ntype PortalProps = {\n\tchildren: React.ReactNode;\n\tinsertPosition?: InsertPosition;\n\tto: AnyString | HTMLElement | ValidHtmlTags | null;\n};\n\nconst TELEPORT_KEY = \"teleport-wrapper\";\n\nfunction Teleport(props: PortalProps) {\n\tconst { children, insertPosition, to } = props;\n\n\tconst [portalContainer, setPortalContainer] = useState<HTMLElement | null>(null);\n\n\tconst stableUpdatePortalContainer = useCallbackRef((destination: HTMLElement | null) => {\n\t\tsetPortalContainer(destination);\n\t});\n\n\tuseLayoutEffect(() => {\n\t\tif (!to) return;\n\n\t\tconst destination = isString(to) ? document.querySelector<HTMLElement>(to) : to;\n\n\t\tif (!insertPosition) {\n\t\t\tdestination && stableUpdatePortalContainer(destination);\n\t\t\treturn;\n\t\t}\n\n\t\tconst tempWrapper = document.createElement(\"div\");\n\t\ttempWrapper.id = TELEPORT_KEY;\n\t\ttempWrapper.style.display = \"contents\";\n\n\t\tdestination?.insertAdjacentElement(insertPosition, tempWrapper);\n\n\t\tconst timeoutId = setTimeout(() => {\n\t\t\ttempWrapper.replaceWith(...tempWrapper.children);\n\t\t}, 0);\n\n\t\tstableUpdatePortalContainer(tempWrapper);\n\n\t\treturn () => {\n\t\t\ttempWrapper.remove();\n\t\t\tclearTimeout(timeoutId);\n\t\t};\n\t}, [to, insertPosition, stableUpdatePortalContainer]);\n\n\treturn (\n\t\t<ClientGate>\n\t\t\t{() => portalContainer && createPortal(children, portalContainer, TELEPORT_KEY)}\n\t\t</ClientGate>\n\t);\n}\n\nexport { Teleport };\n"],"mappings":";;;;;;;;AAgBA,MAAM,eAAe;AAErB,SAAS,SAAS,OAAoB;CACrC,MAAM,EAAE,UAAU,gBAAgB,OAAO;CAEzC,MAAM,CAAC,iBAAiB,sBAAsB,SAA6B,KAAK;CAEhF,MAAM,8BAA8B,gBAAgB,gBAAoC;AACvF,qBAAmB,YAAY;GAC9B;AAEF,uBAAsB;AACrB,MAAI,CAAC,GAAI;EAET,MAAM,cAAc,SAAS,GAAG,GAAG,SAAS,cAA2B,GAAG,GAAG;AAE7E,MAAI,CAAC,gBAAgB;AACpB,kBAAe,4BAA4B,YAAY;AACvD;;EAGD,MAAM,cAAc,SAAS,cAAc,MAAM;AACjD,cAAY,KAAK;AACjB,cAAY,MAAM,UAAU;AAE5B,eAAa,sBAAsB,gBAAgB,YAAY;EAE/D,MAAM,YAAY,iBAAiB;AAClC,eAAY,YAAY,GAAG,YAAY,SAAS;KAC9C,EAAE;AAEL,8BAA4B,YAAY;AAExC,eAAa;AACZ,eAAY,QAAQ;AACpB,gBAAa,UAAU;;IAEtB;EAAC;EAAI;EAAgB;EAA4B,CAAC;AAErD,QACC,oBAAC,8BACO,mBAAmB,aAAa,UAAU,iBAAiB,aAAa,GACnE"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { isFunction } from "@zayne-labs/toolkit-type-helpers";
|
|
2
2
|
import { Component, useState } from "react";
|
|
3
|
-
import { jsx } from "react/jsx-runtime";
|
|
4
3
|
import { createCustomContext, useCallbackRef } from "@zayne-labs/toolkit-react";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
5
|
|
|
6
6
|
//#region src/components/common/error-boundary/error-boundary-context.ts
|
|
7
7
|
const [ErrorBoundaryContext, useErrorBoundaryContext] = createCustomContext({
|
|
@@ -117,4 +117,4 @@ const useErrorBoundary = () => {
|
|
|
117
117
|
|
|
118
118
|
//#endregion
|
|
119
119
|
export { ErrorBoundary as n, useErrorBoundaryContext as r, useErrorBoundary as t };
|
|
120
|
-
//# sourceMappingURL=error-boundary-
|
|
120
|
+
//# sourceMappingURL=error-boundary-TM4xzQfq.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"error-boundary-
|
|
1
|
+
{"version":3,"file":"error-boundary-TM4xzQfq.js","names":["initialState: ErrorBoundaryState","#resetErrorBoundary"],"sources":["../../src/components/common/error-boundary/error-boundary-context.ts","../../src/components/common/error-boundary/error-boundary.tsx","../../src/components/common/error-boundary/useErrorBoundary.ts"],"sourcesContent":["import { createCustomContext } from \"@zayne-labs/toolkit-react\";\n\nexport type ErrorBoundaryContextType = {\n\terror: unknown;\n\thasError: boolean;\n\tresetErrorBoundary: (...args: unknown[]) => void;\n};\n\nconst [ErrorBoundaryContext, useErrorBoundaryContext] = createCustomContext<ErrorBoundaryContextType>({\n\thookName: \"useErrorBoundaryContext\",\n\tname: \"ErrorBoundaryContext\",\n\tproviderName: \"ErrorBoundaryContextProvider\",\n});\n\nexport { ErrorBoundaryContext, useErrorBoundaryContext };\n","import { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\n\nimport { Component } from \"react\";\nimport { ErrorBoundaryContext, type ErrorBoundaryContextType } from \"./error-boundary-context\";\nimport type { ErrorBoundaryProps, FallbackProps } from \"./types\";\n\ntype ErrorBoundaryState =\n\t| {\n\t\t\terror: Error;\n\t\t\thasError: true;\n\t }\n\t| {\n\t\t\terror: null;\n\t\t\thasError: false;\n\t };\n\nconst initialState: ErrorBoundaryState = {\n\terror: null,\n\thasError: false,\n};\n\nconst hasArrayChanged = (arrayOne: unknown[] = [], arrayTwo: unknown[] = []) => {\n\treturn (\n\t\tarrayOne.length !== arrayTwo.length\n\t\t|| arrayOne.some((item, index) => !Object.is(item, arrayTwo[index]))\n\t);\n};\n\n/**\n * Copied from react-error-boundary package\n * @see https://github.com/bvaughn/react-error-boundary\n */\n\nexport class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {\n\tconstructor(props: ErrorBoundaryProps) {\n\t\tsuper(props);\n\n\t\tthis.state = initialState;\n\t}\n\n\tstatic getDerivedStateFromError(error: Error) {\n\t\treturn { error, hasError: true };\n\t}\n\n\toverride componentDidCatch(error: Error, info: React.ErrorInfo) {\n\t\tthis.props.onError?.({ error, info });\n\t}\n\n\toverride componentDidUpdate(prevProps: ErrorBoundaryProps, prevState: ErrorBoundaryState) {\n\t\tconst { hasError } = this.state;\n\t\tconst { resetKeys } = this.props;\n\n\t\t// == There's an edge case where if the thing that triggered the error happens to *also* be in the resetKeys array, we'd end up resetting the error boundary immediately.\n\t\t// == This would likely trigger a second error to be thrown.\n\t\t// == So we make sure that we don't check the resetKeys on the first call of cDU after the error is set.\n\n\t\tif (hasError && prevState.error !== null && hasArrayChanged(prevProps.resetKeys, resetKeys)) {\n\t\t\tthis.props.onReset?.({\n\t\t\t\tnext: resetKeys,\n\t\t\t\tprev: prevProps.resetKeys,\n\t\t\t\treason: \"keys\",\n\t\t\t});\n\n\t\t\tthis.setState(initialState);\n\t\t}\n\t}\n\n\toverride render() {\n\t\tconst { children, fallback } = this.props;\n\t\tconst { error, hasError } = this.state;\n\n\t\tlet childToRender = children;\n\n\t\tif (hasError) {\n\t\t\tswitch (true) {\n\t\t\t\tcase isFunction(fallback): {\n\t\t\t\t\tconst fallbackRenderProps = {\n\t\t\t\t\t\terror,\n\t\t\t\t\t\tresetErrorBoundary: this.#resetErrorBoundary,\n\t\t\t\t\t} satisfies FallbackProps;\n\n\t\t\t\t\tchildToRender = fallback(fallbackRenderProps);\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tcase Boolean(fallback): {\n\t\t\t\t\tchildToRender = fallback;\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\n\t\t\t\tdefault: {\n\t\t\t\t\tconsole.warn(\"No fallback provided to error boundary\");\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tconst contextValue = {\n\t\t\terror,\n\t\t\thasError,\n\t\t\tresetErrorBoundary: this.#resetErrorBoundary,\n\t\t} satisfies ErrorBoundaryContextType;\n\n\t\treturn <ErrorBoundaryContext value={contextValue}>{childToRender}</ErrorBoundaryContext>;\n\t}\n\n\t#resetErrorBoundary = (...parameters: unknown[]) => {\n\t\tconst { error } = this.state;\n\n\t\tif (error !== null) {\n\t\t\tthis.props.onReset?.({\n\t\t\t\targs: parameters,\n\t\t\t\treason: \"imperative-api\",\n\t\t\t});\n\n\t\t\tthis.setState(initialState);\n\t\t}\n\t};\n}\n","import { useCallbackRef } from \"@zayne-labs/toolkit-react\";\nimport { useState } from \"react\";\nimport { useErrorBoundaryContext } from \"./error-boundary-context\";\n\ntype UseErrorBoundaryState<TError extends Error> =\n\t| {\n\t\t\terror: null;\n\t\t\thasError: false;\n\t }\n\t| {\n\t\t\terror: TError;\n\t\t\thasError: true;\n\t };\n\nexport const useErrorBoundary = <TError extends Error>() => {\n\tconst { resetErrorBoundary } = useErrorBoundaryContext();\n\n\tconst [state, setState] = useState<UseErrorBoundaryState<TError>>({\n\t\terror: null,\n\t\thasError: false,\n\t});\n\n\tif (state.hasError) {\n\t\tthrow state.error;\n\t}\n\n\tconst resetBoundary = useCallbackRef(() => {\n\t\tresetErrorBoundary();\n\n\t\tsetState({\n\t\t\terror: null,\n\t\t\thasError: false,\n\t\t});\n\t});\n\n\tconst showBoundary = useCallbackRef((error: TError) => {\n\t\tsetState({\n\t\t\terror,\n\t\t\thasError: true,\n\t\t});\n\t});\n\n\treturn { resetBoundary, showBoundary };\n};\n"],"mappings":";;;;;;AAQA,MAAM,CAAC,sBAAsB,2BAA2B,oBAA8C;CACrG,UAAU;CACV,MAAM;CACN,cAAc;CACd,CAAC;;;;ACIF,MAAMA,eAAmC;CACxC,OAAO;CACP,UAAU;CACV;AAED,MAAM,mBAAmB,WAAsB,EAAE,EAAE,WAAsB,EAAE,KAAK;AAC/E,QACC,SAAS,WAAW,SAAS,UAC1B,SAAS,MAAM,MAAM,UAAU,CAAC,OAAO,GAAG,MAAM,SAAS,OAAO,CAAC;;;;;;AAStE,IAAa,gBAAb,cAAmC,UAAkD;CACpF,YAAY,OAA2B;AACtC,QAAM,MAAM;AAEZ,OAAK,QAAQ;;CAGd,OAAO,yBAAyB,OAAc;AAC7C,SAAO;GAAE;GAAO,UAAU;GAAM;;CAGjC,AAAS,kBAAkB,OAAc,MAAuB;AAC/D,OAAK,MAAM,UAAU;GAAE;GAAO;GAAM,CAAC;;CAGtC,AAAS,mBAAmB,WAA+B,WAA+B;EACzF,MAAM,EAAE,aAAa,KAAK;EAC1B,MAAM,EAAE,cAAc,KAAK;AAM3B,MAAI,YAAY,UAAU,UAAU,QAAQ,gBAAgB,UAAU,WAAW,UAAU,EAAE;AAC5F,QAAK,MAAM,UAAU;IACpB,MAAM;IACN,MAAM,UAAU;IAChB,QAAQ;IACR,CAAC;AAEF,QAAK,SAAS,aAAa;;;CAI7B,AAAS,SAAS;EACjB,MAAM,EAAE,UAAU,aAAa,KAAK;EACpC,MAAM,EAAE,OAAO,aAAa,KAAK;EAEjC,IAAI,gBAAgB;AAEpB,MAAI,SACH,SAAQ,MAAR;GACC,KAAK,WAAW,SAAS;AAMxB,oBAAgB,SALY;KAC3B;KACA,oBAAoB,MAAKC;KACzB,CAE4C;AAC7C;GAGD,KAAK,QAAQ,SAAS;AACrB,oBAAgB;AAChB;GAGD,QACC,SAAQ,KAAK,yCAAyC;;AAWzD,SAAO,oBAAC;GAAqB,OANR;IACpB;IACA;IACA,oBAAoB,MAAKA;IACzB;aAEkD;IAAqC;;CAGzF,uBAAuB,GAAG,eAA0B;EACnD,MAAM,EAAE,UAAU,KAAK;AAEvB,MAAI,UAAU,MAAM;AACnB,QAAK,MAAM,UAAU;IACpB,MAAM;IACN,QAAQ;IACR,CAAC;AAEF,QAAK,SAAS,aAAa;;;;;;;ACpG9B,MAAa,yBAA+C;CAC3D,MAAM,EAAE,uBAAuB,yBAAyB;CAExD,MAAM,CAAC,OAAO,YAAY,SAAwC;EACjE,OAAO;EACP,UAAU;EACV,CAAC;AAEF,KAAI,MAAM,SACT,OAAM,MAAM;AAmBb,QAAO;EAAE,eAhBa,qBAAqB;AAC1C,uBAAoB;AAEpB,YAAS;IACR,OAAO;IACP,UAAU;IACV,CAAC;IACD;EASsB,cAPH,gBAAgB,UAAkB;AACtD,YAAS;IACR;IACA,UAAU;IACV,CAAC;IACD;EAEoC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"for-
|
|
1
|
+
{"version":3,"file":"for-BeCRb3k2.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\";\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\nconst isArrayEmpty = <TArray extends ArrayOrNumber>(each: TArray) => {\n\t// eslint-disable-next-line ts-eslint/no-unnecessary-condition -- Allow\n\treturn each == null || (isNumber(each) && each === 0) || (isArray(each) && each.length === 0);\n};\n\nexport function For<const TArray extends ArrayOrNumber>(props: ForProps<TArray>) {\n\tconst { children, each, fallback = null, renderItem } = props;\n\n\tif (isArrayEmpty(each)) {\n\t\treturn fallback;\n\t}\n\n\tconst resolvedArray = isNumber(each) ? [...Array(each).keys()] : (each as unknown[]);\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>> & { displayFallBackWhenEmpty?: boolean }) {\n\tconst {\n\t\tas: ListContainer = \"ul\",\n\t\tchildren,\n\t\tdisplayFallBackWhenEmpty = false,\n\t\teach,\n\t\tfallback = null,\n\t\trenderItem,\n\t\t...restOfProps\n\t} = props;\n\n\tif (displayFallBackWhenEmpty && isArrayEmpty(each)) {\n\t\treturn fallback;\n\t}\n\n\treturn (\n\t\t<ListContainer {...restOfProps}>\n\t\t\t<For {...({ children, each, fallback, 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":";;;;AAgCA,MAAM,gBAA8C,SAAiB;AAEpE,QAAO,QAAQ,QAAS,SAAS,KAAK,IAAI,SAAS,KAAO,QAAQ,KAAK,IAAI,KAAK,WAAW;;AAG5F,SAAgB,IAAwC,OAAyB;CAChF,MAAM,EAAE,UAAU,MAAM,WAAW,MAAM,eAAe;AAExD,KAAI,aAAa,KAAK,CACrB,QAAO;CAGR,MAAM,gBAAgB,SAAS,KAAK,GAAG,CAAC,GAAG,MAAM,KAAK,CAAC,MAAM,CAAC,GAAI;CAElE,MAAM,mBAAmB,OAAO,aAAa,aAAa,WAAW;AAQrE,QANoB,cAAc,KAAK,GAAG,WAAW;AAGpD,SAAO,iBAAiB,GAAI,OAAkB;GAC7C;;AAKH,SAAgB,eAGd,OAAoG;CACrG,MAAM,EACL,IAAI,gBAAgB,MACpB,UACA,2BAA2B,OAC3B,MACA,WAAW,MACX,YACA,GAAG,gBACA;AAEJ,KAAI,4BAA4B,aAAa,KAAK,CACjD,QAAO;AAGR,QACC,oBAAC;EAAc,GAAI;YAClB,oBAAC;GAAW;GAAU;GAAM;GAAU;IAAqC;GAC5D;;;;;ACzElB,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
|
-
import * as
|
|
1
|
+
import * as react20 from "react";
|
|
2
2
|
import { Component } from "react";
|
|
3
|
-
import * as
|
|
4
|
-
import * as
|
|
3
|
+
import * as _zayne_labs_toolkit_react1 from "@zayne-labs/toolkit-react";
|
|
4
|
+
import * as react_jsx_runtime30 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.ErrorInfo): void;
|
|
51
51
|
componentDidUpdate(prevProps: ErrorBoundaryProps, prevState: ErrorBoundaryState): void;
|
|
52
|
-
render():
|
|
52
|
+
render(): react_jsx_runtime30.JSX.Element;
|
|
53
53
|
}
|
|
54
54
|
//#endregion
|
|
55
55
|
//#region src/components/common/error-boundary/error-boundary-context.d.ts
|
|
@@ -58,7 +58,7 @@ type ErrorBoundaryContextType = {
|
|
|
58
58
|
hasError: boolean;
|
|
59
59
|
resetErrorBoundary: (...args: unknown[]) => void;
|
|
60
60
|
};
|
|
61
|
-
declare const ErrorBoundaryContext:
|
|
61
|
+
declare const ErrorBoundaryContext: react20.Context<ErrorBoundaryContextType>, useErrorBoundaryContext: _zayne_labs_toolkit_react1.UseCustomContext<ErrorBoundaryContextType, true>;
|
|
62
62
|
//#endregion
|
|
63
63
|
//#region src/components/common/error-boundary/useErrorBoundary.d.ts
|
|
64
64
|
declare const useErrorBoundary: <TError extends Error>() => {
|
|
@@ -67,4 +67,4 @@ declare const useErrorBoundary: <TError extends Error>() => {
|
|
|
67
67
|
};
|
|
68
68
|
//#endregion
|
|
69
69
|
export { ErrorBoundaryProps as a, ErrorBoundary as i, ErrorBoundaryContextType as n, FallbackProps as o, useErrorBoundaryContext as r, useErrorBoundary as t };
|
|
70
|
-
//# sourceMappingURL=index-
|
|
70
|
+
//# sourceMappingURL=index-Dvt8y6Uu.d.ts.map
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { a as ErrorBoundaryProps } from "./index-
|
|
2
|
-
import * as
|
|
1
|
+
import { a as ErrorBoundaryProps } from "./index-Dvt8y6Uu.js";
|
|
2
|
+
import * as react_jsx_runtime9 from "react/jsx-runtime";
|
|
3
3
|
|
|
4
4
|
//#region src/components/common/suspense-with-boundary/suspense-with-boundary.d.ts
|
|
5
5
|
type SuspenseWithBoundaryProps = {
|
|
@@ -7,7 +7,7 @@ type SuspenseWithBoundaryProps = {
|
|
|
7
7
|
errorFallback?: ErrorBoundaryProps["fallback"];
|
|
8
8
|
fallback?: React.ReactNode;
|
|
9
9
|
};
|
|
10
|
-
declare function SuspenseWithBoundary(props: SuspenseWithBoundaryProps):
|
|
10
|
+
declare function SuspenseWithBoundary(props: SuspenseWithBoundaryProps): react_jsx_runtime9.JSX.Element;
|
|
11
11
|
//#endregion
|
|
12
12
|
export { SuspenseWithBoundaryProps as n, SuspenseWithBoundary as t };
|
|
13
|
-
//# sourceMappingURL=index-
|
|
13
|
+
//# sourceMappingURL=index-DzMX8Xce.d.ts.map
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import { n as SlotRoot } from "./slot-
|
|
1
|
+
import { n as SlotRoot } from "./slot-CURylbjq.js";
|
|
2
2
|
import { isFunction } from "@zayne-labs/toolkit-type-helpers";
|
|
3
3
|
import { useCallback, useEffect, useLayoutEffect, useMemo, useReducer, useRef, useState } from "react";
|
|
4
|
+
import { useCallbackRef, useComposeRefs, useToggle } from "@zayne-labs/toolkit-react";
|
|
4
5
|
import { jsx } from "react/jsx-runtime";
|
|
5
6
|
import { dataAttr, on } from "@zayne-labs/toolkit-core";
|
|
6
|
-
import { useCallbackRef, useComposeRefs, useToggle } from "@zayne-labs/toolkit-react";
|
|
7
7
|
|
|
8
8
|
//#region src/components/common/presence/use-presence.ts
|
|
9
9
|
const useStateMachine = (config) => {
|
|
@@ -208,4 +208,4 @@ function Presence(props) {
|
|
|
208
208
|
|
|
209
209
|
//#endregion
|
|
210
210
|
export { Presence as t };
|
|
211
|
-
//# sourceMappingURL=presence-
|
|
211
|
+
//# sourceMappingURL=presence-Ctp-Trws.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"presence-C2HmLiVc.js","names":["timeoutId: number","getPresenceProps: UsePresenceResult[\"propGetters\"][\"getPresenceProps\"]","Slot.Root"],"sources":["../../src/components/common/presence/use-presence.ts","../../src/components/common/presence/presence.tsx"],"sourcesContent":["import { dataAttr, on } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef, useToggle } from \"@zayne-labs/toolkit-react\";\nimport type { InferProps } from \"@zayne-labs/toolkit-react/utils\";\nimport { useCallback, useEffect, useLayoutEffect, useMemo, 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\t/**\n\t * @default \"animation\"\n\t */\n\tvariant?: \"animation\" | \"transition\";\n};\n\nexport type UsePresenceResult = {\n\tisPresent: boolean;\n\tisPresentOrIsTransitionComplete: boolean;\n\tpropGetters: {\n\t\tgetPresenceProps: (innerProps: InferProps<HTMLElement>) => InferProps<HTMLElement>;\n\t};\n\tref: React.Ref<HTMLElement>;\n\tshouldStartTransition: 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): UsePresenceResult => {\n\tconst { onExitComplete, present: presentProp, variant = \"animation\" } = options;\n\n\tconst stableOnExitComplete = useCallbackRef(onExitComplete);\n\n\tconst [node, setNode] = useState<HTMLElement | null>(null);\n\n\tconst [hasTransitioned, toggleHasTransitioned] = useToggle(false);\n\n\tconst stylesRef = useRef<CSSStyleDeclaration | null>(null);\n\n\tconst prevNodeStateRef = useRef<{\n\t\tprevAnimationName: string;\n\t\tprevPresent: boolean;\n\t}>({\n\t\tprevAnimationName: \"none\",\n\t\tprevPresent: presentProp,\n\t});\n\n\tconst initialState = presentProp ? \"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\n\t\tprevNodeStateRef.current.prevAnimationName = state === \"mounted\" ? currentAnimationName : \"none\";\n\t}, [state]);\n\n\tuseLayoutEffect(() => {\n\t\tconst styles = stylesRef.current;\n\t\tconst wasPresent = prevNodeStateRef.current.prevPresent;\n\t\tconst hasPresentChanged = wasPresent !== presentProp;\n\n\t\tif (!hasPresentChanged) return;\n\n\t\tconst prevAnimationName = prevNodeStateRef.current.prevAnimationName;\n\t\tconst currentAnimationName = getAnimationName(styles);\n\n\t\tswitch (true) {\n\t\t\tcase presentProp: {\n\t\t\t\tsend(\"MOUNT\");\n\n\t\t\t\tif (variant === \"transition\") {\n\t\t\t\t\trequestAnimationFrame(() => toggleHasTransitioned(true));\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tcase Boolean(node) && variant === \"animation\": {\n\t\t\t\tconst hasAnimation = currentAnimationName !== \"none\" && styles?.display !== \"none\";\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 (like the `transitionrun` 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 isAnimationStarted = hasAnimation && prevAnimationName !== currentAnimationName;\n\n\t\t\t\tconst isAnimatingOut = wasPresent && isAnimationStarted;\n\n\t\t\t\tsend(isAnimatingOut ? \"ANIMATION_OUT\" : \"UNMOUNT\");\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\tprevNodeStateRef.current.prevPresent = presentProp;\n\t}, [presentProp, node, send, variant, toggleHasTransitioned]);\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\tconst handleAnimationStart = (event: AnimationEvent) => {\n\t\t\tconst isTargetAnimatingNode = event.target === node;\n\n\t\t\tif (!isTargetAnimatingNode) return;\n\n\t\t\tprevNodeStateRef.current.prevAnimationName = getAnimationName(stylesRef.current);\n\t\t};\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 (!prevNodeStateRef.current.prevPresent) {\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 handleTransitionRun = (event: TransitionEvent) => {\n\t\t\tconst isTargetTransitioningNode = event.target === node;\n\n\t\t\tif (!isTargetTransitioningNode) return;\n\n\t\t\tsend(\"ANIMATION_OUT\");\n\t\t};\n\n\t\tconst handleTransitionEnd = (event: TransitionEvent) => {\n\t\t\tconst isTargetTransitioningNode = event.target === node && !prevNodeStateRef.current.prevPresent;\n\n\t\t\tif (!isTargetTransitioningNode) return;\n\n\t\t\tsend(\"ANIMATION_END\");\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\n\t\tconst onTransitionRunCleanup = on(\"transitionrun\", node, handleTransitionRun);\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\n\t\t\tonTransitionRunCleanup();\n\t\t\tonTransitionEndCleanup();\n\t\t\tonTransitionCancelCleanup();\n\t\t};\n\t}, [node, send]);\n\n\tuseEffect(() => {\n\t\tconst isExitCompleted = state === \"unmounted\" && !presentProp;\n\n\t\tif (isExitCompleted) {\n\t\t\ttoggleHasTransitioned(false);\n\t\t\tstableOnExitComplete?.();\n\t\t}\n\t}, [state, presentProp, stableOnExitComplete, toggleHasTransitioned]);\n\n\tconst ref = useCallbackRef((refNode: HTMLElement | null) => {\n\t\tsetNode(refNode);\n\n\t\tif (refNode) {\n\t\t\tstylesRef.current = getComputedStyle(refNode);\n\t\t}\n\t});\n\n\tconst MOUNTED_STATES = [\"mounted\", \"unmountSuspended\"] satisfies Array<typeof state>;\n\tconst isPresent = MOUNTED_STATES.includes(state);\n\tconst isPresentOrIsTransitionComplete = isPresent || hasTransitioned;\n\tconst shouldStartTransition = presentProp && hasTransitioned;\n\n\tconst getPresenceProps: UsePresenceResult[\"propGetters\"][\"getPresenceProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst transitionState = shouldStartTransition ? \"active\" : \"inactive\";\n\n\t\t\treturn {\n\t\t\t\t\"data-present\": dataAttr(isPresent),\n\t\t\t\t\"data-present-or-transition-complete\": dataAttr(isPresentOrIsTransitionComplete),\n\t\t\t\t\"data-state\": state,\n\t\t\t\t...(variant === \"transition\" && { \"data-transition\": transitionState }),\n\t\t\t\t...innerProps,\n\t\t\t\tclassName: innerProps.className,\n\t\t\t};\n\t\t},\n\t\t[isPresent, isPresentOrIsTransitionComplete, shouldStartTransition, state, variant]\n\t);\n\n\tconst propGetters = useMemo(() => ({ getPresenceProps }), [getPresenceProps]);\n\n\tconst result = useMemo<UsePresenceResult>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tisPresent,\n\t\t\t\tisPresentOrIsTransitionComplete,\n\t\t\t\tpropGetters,\n\t\t\t\tref,\n\t\t\t\tshouldStartTransition,\n\t\t\t}) satisfies UsePresenceResult,\n\t\t[isPresent, isPresentOrIsTransitionComplete, propGetters, ref, shouldStartTransition]\n\t);\n\n\treturn result;\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\";\n\nimport { Slot } from \"../slot\";\nimport { usePresence, type UsePresenceOptions, type UsePresenceResult } from \"./use-presence\";\n\ntype RefProp = { ref?: React.Ref<HTMLElement> };\n\ntype RenderPropContext = Omit<UsePresenceResult, \"propGetters\" | \"ref\">;\n\ntype PresenceProps = UsePresenceOptions & {\n\tchildren?: React.ReactElement<RefProp> | ((props: RenderPropContext) => React.ReactElement<RefProp>);\n\tclassName?: string;\n\tforceMount?: boolean;\n};\n\nfunction Presence(props: PresenceProps) {\n\tconst { children, className, forceMount = false, onExitComplete, present, variant } = props;\n\n\tconst {\n\t\tisPresent,\n\t\tisPresentOrIsTransitionComplete,\n\t\tpropGetters,\n\t\tref: presenceRef,\n\t\tshouldStartTransition,\n\t} = usePresence({ onExitComplete, present, variant });\n\n\tconst context = {\n\t\tisPresent,\n\t\tisPresentOrIsTransitionComplete,\n\t\tshouldStartTransition,\n\t} satisfies RenderPropContext;\n\n\tconst resolvedChild = isFunction(children) ? children(context) : 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(presenceRef, childRef);\n\n\tconst shouldRender =\n\t\tforceMount || (variant === \"transition\" ? isPresentOrIsTransitionComplete : isPresent);\n\n\tif (!shouldRender) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Slot.Root ref={ref} {...propGetters.getPresenceProps({ className })}>\n\t\t\t{resolvedChild}\n\t\t</Slot.Root>\n\t);\n}\n\nexport { Presence };\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"presence-Ctp-Trws.js","names":["timeoutId: number","getPresenceProps: UsePresenceResult[\"propGetters\"][\"getPresenceProps\"]","Slot.Root"],"sources":["../../src/components/common/presence/use-presence.ts","../../src/components/common/presence/presence.tsx"],"sourcesContent":["import { dataAttr, on } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef, useToggle } from \"@zayne-labs/toolkit-react\";\nimport type { InferProps } from \"@zayne-labs/toolkit-react/utils\";\nimport { useCallback, useEffect, useLayoutEffect, useMemo, 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\t/**\n\t * @default \"animation\"\n\t */\n\tvariant?: \"animation\" | \"transition\";\n};\n\nexport type UsePresenceResult = {\n\tisPresent: boolean;\n\tisPresentOrIsTransitionComplete: boolean;\n\tpropGetters: {\n\t\tgetPresenceProps: (innerProps: InferProps<HTMLElement>) => InferProps<HTMLElement>;\n\t};\n\tref: React.Ref<HTMLElement>;\n\tshouldStartTransition: 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): UsePresenceResult => {\n\tconst { onExitComplete, present: presentProp, variant = \"animation\" } = options;\n\n\tconst stableOnExitComplete = useCallbackRef(onExitComplete);\n\n\tconst [node, setNode] = useState<HTMLElement | null>(null);\n\n\tconst [hasTransitioned, toggleHasTransitioned] = useToggle(false);\n\n\tconst stylesRef = useRef<CSSStyleDeclaration | null>(null);\n\n\tconst prevNodeStateRef = useRef<{\n\t\tprevAnimationName: string;\n\t\tprevPresent: boolean;\n\t}>({\n\t\tprevAnimationName: \"none\",\n\t\tprevPresent: presentProp,\n\t});\n\n\tconst initialState = presentProp ? \"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\n\t\tprevNodeStateRef.current.prevAnimationName = state === \"mounted\" ? currentAnimationName : \"none\";\n\t}, [state]);\n\n\tuseLayoutEffect(() => {\n\t\tconst styles = stylesRef.current;\n\t\tconst wasPresent = prevNodeStateRef.current.prevPresent;\n\t\tconst hasPresentChanged = wasPresent !== presentProp;\n\n\t\tif (!hasPresentChanged) return;\n\n\t\tconst prevAnimationName = prevNodeStateRef.current.prevAnimationName;\n\t\tconst currentAnimationName = getAnimationName(styles);\n\n\t\tswitch (true) {\n\t\t\tcase presentProp: {\n\t\t\t\tsend(\"MOUNT\");\n\n\t\t\t\tif (variant === \"transition\") {\n\t\t\t\t\trequestAnimationFrame(() => toggleHasTransitioned(true));\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\tcase Boolean(node) && variant === \"animation\": {\n\t\t\t\tconst hasAnimation = currentAnimationName !== \"none\" && styles?.display !== \"none\";\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 (like the `transitionrun` 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 isAnimationStarted = hasAnimation && prevAnimationName !== currentAnimationName;\n\n\t\t\t\tconst isAnimatingOut = wasPresent && isAnimationStarted;\n\n\t\t\t\tsend(isAnimatingOut ? \"ANIMATION_OUT\" : \"UNMOUNT\");\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\tprevNodeStateRef.current.prevPresent = presentProp;\n\t}, [presentProp, node, send, variant, toggleHasTransitioned]);\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\tconst handleAnimationStart = (event: AnimationEvent) => {\n\t\t\tconst isTargetAnimatingNode = event.target === node;\n\n\t\t\tif (!isTargetAnimatingNode) return;\n\n\t\t\tprevNodeStateRef.current.prevAnimationName = getAnimationName(stylesRef.current);\n\t\t};\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 (!prevNodeStateRef.current.prevPresent) {\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 handleTransitionRun = (event: TransitionEvent) => {\n\t\t\tconst isTargetTransitioningNode = event.target === node;\n\n\t\t\tif (!isTargetTransitioningNode) return;\n\n\t\t\tsend(\"ANIMATION_OUT\");\n\t\t};\n\n\t\tconst handleTransitionEnd = (event: TransitionEvent) => {\n\t\t\tconst isTargetTransitioningNode = event.target === node && !prevNodeStateRef.current.prevPresent;\n\n\t\t\tif (!isTargetTransitioningNode) return;\n\n\t\t\tsend(\"ANIMATION_END\");\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\n\t\tconst onTransitionRunCleanup = on(\"transitionrun\", node, handleTransitionRun);\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\n\t\t\tonTransitionRunCleanup();\n\t\t\tonTransitionEndCleanup();\n\t\t\tonTransitionCancelCleanup();\n\t\t};\n\t}, [node, send]);\n\n\tuseEffect(() => {\n\t\tconst isExitCompleted = state === \"unmounted\" && !presentProp;\n\n\t\tif (isExitCompleted) {\n\t\t\ttoggleHasTransitioned(false);\n\t\t\tstableOnExitComplete?.();\n\t\t}\n\t}, [state, presentProp, stableOnExitComplete, toggleHasTransitioned]);\n\n\tconst ref = useCallbackRef((refNode: HTMLElement | null) => {\n\t\tsetNode(refNode);\n\n\t\tif (refNode) {\n\t\t\tstylesRef.current = getComputedStyle(refNode);\n\t\t}\n\t});\n\n\tconst MOUNTED_STATES = [\"mounted\", \"unmountSuspended\"] satisfies Array<typeof state>;\n\tconst isPresent = MOUNTED_STATES.includes(state);\n\tconst isPresentOrIsTransitionComplete = isPresent || hasTransitioned;\n\tconst shouldStartTransition = presentProp && hasTransitioned;\n\n\tconst getPresenceProps: UsePresenceResult[\"propGetters\"][\"getPresenceProps\"] = useCallback(\n\t\t(innerProps) => {\n\t\t\tconst transitionState = shouldStartTransition ? \"active\" : \"inactive\";\n\n\t\t\treturn {\n\t\t\t\t\"data-present\": dataAttr(isPresent),\n\t\t\t\t\"data-present-or-transition-complete\": dataAttr(isPresentOrIsTransitionComplete),\n\t\t\t\t\"data-state\": state,\n\t\t\t\t...(variant === \"transition\" && { \"data-transition\": transitionState }),\n\t\t\t\t...innerProps,\n\t\t\t\tclassName: innerProps.className,\n\t\t\t};\n\t\t},\n\t\t[isPresent, isPresentOrIsTransitionComplete, shouldStartTransition, state, variant]\n\t);\n\n\tconst propGetters = useMemo(() => ({ getPresenceProps }), [getPresenceProps]);\n\n\tconst result = useMemo<UsePresenceResult>(\n\t\t() =>\n\t\t\t({\n\t\t\t\tisPresent,\n\t\t\t\tisPresentOrIsTransitionComplete,\n\t\t\t\tpropGetters,\n\t\t\t\tref,\n\t\t\t\tshouldStartTransition,\n\t\t\t}) satisfies UsePresenceResult,\n\t\t[isPresent, isPresentOrIsTransitionComplete, propGetters, ref, shouldStartTransition]\n\t);\n\n\treturn result;\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\";\n\nimport { Slot } from \"../slot\";\nimport { usePresence, type UsePresenceOptions, type UsePresenceResult } from \"./use-presence\";\n\ntype RefProp = { ref?: React.Ref<HTMLElement> };\n\ntype RenderPropContext = Omit<UsePresenceResult, \"propGetters\" | \"ref\">;\n\ntype PresenceProps = UsePresenceOptions & {\n\tchildren?: React.ReactElement<RefProp> | ((props: RenderPropContext) => React.ReactElement<RefProp>);\n\tclassName?: string;\n\tforceMount?: boolean;\n};\n\nfunction Presence(props: PresenceProps) {\n\tconst { children, className, forceMount = false, onExitComplete, present, variant } = props;\n\n\tconst {\n\t\tisPresent,\n\t\tisPresentOrIsTransitionComplete,\n\t\tpropGetters,\n\t\tref: presenceRef,\n\t\tshouldStartTransition,\n\t} = usePresence({ onExitComplete, present, variant });\n\n\tconst context = {\n\t\tisPresent,\n\t\tisPresentOrIsTransitionComplete,\n\t\tshouldStartTransition,\n\t} satisfies RenderPropContext;\n\n\tconst resolvedChild = isFunction(children) ? children(context) : 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(presenceRef, childRef);\n\n\tconst shouldRender =\n\t\tforceMount || (variant === \"transition\" ? isPresentOrIsTransitionComplete : isPresent);\n\n\tif (!shouldRender) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Slot.Root ref={ref} {...propGetters.getPresenceProps({ className })}>\n\t\t\t{resolvedChild}\n\t\t</Slot.Root>\n\t);\n}\n\nexport { Presence };\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"show-
|
|
1
|
+
{"version":3,"file":"show-7VInUu_D.js","names":["fallBackSlot"],"sources":["../../src/components/common/show/show.tsx","../../src/components/common/show/show-parts.ts"],"sourcesContent":["\"use client\";\n\nimport { toArray } from \"@zayne-labs/toolkit-core\";\nimport { getMultipleSlots, getSingleSlot } from \"@zayne-labs/toolkit-react/utils\";\nimport { assert, isFunction } from \"@zayne-labs/toolkit-type-helpers\";\n\ntype ShowProps<TWhen> =\n\t| {\n\t\t\tchildren: React.ReactNode;\n\t\t\tcontrol: \"content\";\n\t\t\tfallback?: React.ReactNode;\n\t\t\twhen?: never;\n\t }\n\t| {\n\t\t\tchildren: React.ReactNode | ((value: TWhen) => React.ReactNode);\n\t\t\tcontrol?: \"root\";\n\t\t\tfallback?: React.ReactNode;\n\t\t\twhen: false | TWhen | null | undefined;\n\t };\n\nexport function ShowRoot<TWhen>(props: ShowProps<TWhen>) {\n\tconst { children, control = \"root\", fallback = null, when } = props;\n\n\tif (control === \"content\" && !isFunction(children)) {\n\t\tconst childrenArray = toArray(children) as Array<React.ReactElement<ShowContentProps<TWhen>>>;\n\n\t\tconst foundContentSlot = childrenArray.find((child) => Boolean(child.props.when));\n\n\t\tconst fallBackSlot = getSingleSlot(childrenArray, ShowFallback);\n\n\t\tassert(\n\t\t\t!(fallBackSlot && fallback),\n\t\t\t\"The fallback prop and <Show.Fallback> cannot be used at the same time.\"\n\t\t);\n\n\t\treturn foundContentSlot ?? fallBackSlot ?? fallback;\n\t}\n\n\tconst resolvedChildren = isFunction(children) ? children(when as TWhen) : children;\n\n\tconst {\n\t\tregularChildren,\n\t\tslots: [contentSlot, fallBackSlot],\n\t} = getMultipleSlots(resolvedChildren, [ShowContent, ShowFallback], {\n\t\terrorMessage: [\n\t\t\t\"Only one <Show.Content> component is allowed\",\n\t\t\t\"Only one <Show.Fallback> or <Show.OtherWise> component is allowed\",\n\t\t],\n\t\tthrowOnMultipleSlotMatch: true,\n\t});\n\n\tif (!when) {\n\t\tassert(\n\t\t\t!(fallBackSlot && fallback),\n\t\t\t\"The fallback prop and <Show.Fallback> cannot be used at the same time.\"\n\t\t);\n\n\t\treturn fallBackSlot ?? fallback;\n\t}\n\n\treturn contentSlot ?? regularChildren;\n}\n\ntype ShowContentProps<TWhen> = Pick<ShowProps<TWhen>, \"children\" | \"when\">;\n\nexport function ShowContent<TWhen>(props: ShowContentProps<TWhen>) {\n\tconst { children, when } = props;\n\n\tconst resolvedChildren = isFunction(children) ? children(when as TWhen) : children;\n\n\treturn resolvedChildren;\n}\nShowContent.slotSymbol = Symbol(\"show-content\");\n\nexport function ShowFallback(props: { children: React.ReactNode }) {\n\tconst { children } = props;\n\n\treturn children;\n}\nShowFallback.slotSymbol = Symbol(\"show-fallback\");\n","export {\n\tShowContent as Content,\n\tShowFallback as Fallback,\n\tShowFallback as Otherwise,\n\tShowRoot as Root,\n} from \"./show\";\n"],"mappings":";;;;;;AAoBA,SAAgB,SAAgB,OAAyB;CACxD,MAAM,EAAE,UAAU,UAAU,QAAQ,WAAW,MAAM,SAAS;AAE9D,KAAI,YAAY,aAAa,CAAC,WAAW,SAAS,EAAE;EACnD,MAAM,gBAAgB,QAAQ,SAAS;EAEvC,MAAM,mBAAmB,cAAc,MAAM,UAAU,QAAQ,MAAM,MAAM,KAAK,CAAC;EAEjF,MAAMA,iBAAe,cAAc,eAAe,aAAa;AAE/D,SACC,EAAEA,kBAAgB,WAClB,yEACA;AAED,SAAO,oBAAoBA,kBAAgB;;CAK5C,MAAM,EACL,iBACA,OAAO,CAAC,aAAa,kBAClB,iBALqB,WAAW,SAAS,GAAG,SAAS,KAAc,GAAG,UAKnC,CAAC,aAAa,aAAa,EAAE;EACnE,cAAc,CACb,gDACA,oEACA;EACD,0BAA0B;EAC1B,CAAC;AAEF,KAAI,CAAC,MAAM;AACV,SACC,EAAE,gBAAgB,WAClB,yEACA;AAED,SAAO,gBAAgB;;AAGxB,QAAO,eAAe;;AAKvB,SAAgB,YAAmB,OAAgC;CAClE,MAAM,EAAE,UAAU,SAAS;AAI3B,QAFyB,WAAW,SAAS,GAAG,SAAS,KAAc,GAAG;;AAI3E,YAAY,aAAa,OAAO,eAAe;AAE/C,SAAgB,aAAa,OAAsC;CAClE,MAAM,EAAE,aAAa;AAErB,QAAO;;AAER,aAAa,aAAa,OAAO,gBAAgB"}
|