@zayne-labs/ui-react 0.9.8 → 0.9.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/await-parts-BJ6C-y1f.d.ts +36 -0
- package/dist/esm/chunk-BIFY3R2A.js +627 -0
- package/dist/esm/chunk-BIFY3R2A.js.map +1 -0
- package/dist/esm/chunk-CLGH26AQ.js +337 -0
- package/dist/esm/chunk-CLGH26AQ.js.map +1 -0
- package/dist/esm/chunk-CWUEUCR5.js +3 -0
- package/dist/esm/chunk-CWUEUCR5.js.map +1 -0
- package/dist/esm/chunk-EYWTW54R.js +42 -0
- package/dist/esm/chunk-EYWTW54R.js.map +1 -0
- package/dist/esm/chunk-G5BNZM66.js +32 -0
- package/dist/esm/chunk-G5BNZM66.js.map +1 -0
- package/dist/esm/{chunk-IREUBYDK.js → chunk-JC52CA2O.js} +26 -23
- package/dist/esm/chunk-JC52CA2O.js.map +1 -0
- package/dist/esm/chunk-KLEJZWKY.js +45 -0
- package/dist/esm/chunk-KLEJZWKY.js.map +1 -0
- package/dist/esm/{chunk-V5DSTESN.js → chunk-M7YXNGT6.js} +3 -3
- package/dist/esm/{chunk-V5DSTESN.js.map → chunk-M7YXNGT6.js.map} +1 -1
- package/dist/esm/chunk-MT2MQDK2.js +13 -0
- package/dist/esm/chunk-MT2MQDK2.js.map +1 -0
- package/dist/esm/{chunk-XZRSR3EM.js → chunk-N4274N5K.js} +6 -2
- package/dist/esm/chunk-N4274N5K.js.map +1 -0
- package/dist/esm/chunk-V5ZPMMIH.js +121 -0
- package/dist/esm/chunk-V5ZPMMIH.js.map +1 -0
- package/dist/esm/{chunk-2P3P5AXH.js → chunk-Y5VBSXZS.js} +14 -7
- package/dist/esm/chunk-Y5VBSXZS.js.map +1 -0
- package/dist/esm/{chunk-IUEPHHGO.js → chunk-YO5LJ7ZJ.js} +2 -2
- package/dist/esm/{chunk-IUEPHHGO.js.map → chunk-YO5LJ7ZJ.js.map} +1 -1
- package/dist/esm/chunk-Z6JJE4G6.js +68 -0
- package/dist/esm/chunk-Z6JJE4G6.js.map +1 -0
- package/dist/esm/chunk-ZSDYJOYB.js +274 -0
- package/dist/esm/chunk-ZSDYJOYB.js.map +1 -0
- package/dist/esm/components/common/await/index.d.ts +10 -12
- package/dist/esm/components/common/await/index.js +5 -24
- package/dist/esm/components/common/await/index.js.map +1 -1
- package/dist/esm/components/common/error-boundary/index.d.ts +6 -30
- package/dist/esm/components/common/error-boundary/index.js +1 -2
- package/dist/esm/components/common/for/index.d.ts +6 -20
- package/dist/esm/components/common/index.d.ts +13 -0
- package/dist/esm/components/common/index.js +14 -0
- package/dist/esm/components/common/show/index.js +2 -2
- package/dist/esm/components/common/slot/index.d.ts +7 -3
- package/dist/esm/components/common/slot/index.js +1 -1
- package/dist/esm/components/common/suspense-with-boundary/index.d.ts +3 -3
- package/dist/esm/components/common/suspense-with-boundary/index.js +2 -12
- package/dist/esm/components/common/suspense-with-boundary/index.js.map +1 -1
- package/dist/esm/components/common/switch/index.js +3 -40
- package/dist/esm/components/common/switch/index.js.map +1 -1
- package/dist/esm/components/common/teleport/index.js +1 -29
- package/dist/esm/components/common/teleport/index.js.map +1 -1
- package/dist/esm/components/ui/card/index.js +4 -43
- package/dist/esm/components/ui/card/index.js.map +1 -1
- package/dist/esm/components/ui/carousel/index.js +14 -273
- package/dist/esm/components/ui/carousel/index.js.map +1 -1
- package/dist/esm/components/ui/drag-scroll/index.js +2 -119
- package/dist/esm/components/ui/drag-scroll/index.js.map +1 -1
- package/dist/esm/components/ui/drop-zone/index.d.ts +8 -181
- package/dist/esm/components/ui/drop-zone/index.js +15 -327
- package/dist/esm/components/ui/drop-zone/index.js.map +1 -1
- package/dist/esm/components/ui/form/index.js +7 -625
- package/dist/esm/components/ui/form/index.js.map +1 -1
- package/dist/esm/components/ui/index.d.ts +11 -0
- package/dist/esm/components/ui/index.js +21 -0
- package/dist/esm/drop-zone-parts-CvseSoXA.d.ts +186 -0
- package/dist/esm/error-boundary-BD0X61Sg.d.ts +28 -0
- package/dist/esm/for-8C6fFbN6.d.ts +21 -0
- package/dist/esm/{lib/utils/getSlotMap/index.d.ts → getSlotMap-DTkxtGhd.d.ts} +10 -8
- package/dist/esm/lib/utils/{getSlot/index.d.ts → index.d.ts} +1 -0
- package/dist/esm/lib/utils/index.js +5 -0
- package/dist/esm/lib/utils/index.js.map +1 -0
- package/dist/esm/{types-CeWumkhm.d.ts → types-mdfDDNrr.d.ts} +9 -6
- package/dist/style.css +1 -1
- package/package.json +17 -16
- package/dist/esm/chunk-2P3P5AXH.js.map +0 -1
- package/dist/esm/chunk-IREUBYDK.js.map +0 -1
- package/dist/esm/chunk-XZRSR3EM.js.map +0 -1
- package/dist/esm/lib/utils/getSlot/index.js +0 -4
- package/dist/esm/lib/utils/getSlotMap/index.js +0 -4
- /package/dist/esm/{lib/utils/getSlot → components/common}/index.js.map +0 -0
- /package/dist/esm/{lib/utils/getSlotMap → components/ui}/index.js.map +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/common/teleport/teleport.tsx"],"names":[],"mappings":";;;;;AAgBA,SAAS,SAAS,KAAoB,EAAA;AACrC,EAAA,MAAM,EAAE,QAAA,EAAU,cAAgB,EAAA,EAAA,EAAO,GAAA,KAAA;AAEzC,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,GAAI,SAA6B,IAAI,CAAA;AAI/E,EAAA,SAAA,CAAU,MAAM;AACf,IAAA,IAAI,CAAC,EAAI,EAAA;AAET,IAAA,IAAI,cAAgB,EAAA;AAEpB,IAAA,MAAM,cAAc,QAAS,CAAA,EAAE,IAAI,QAAS,CAAA,aAAA,CAA2B,EAAE,CAAI,GAAA,EAAA;AAE7E,IAAA,WAAA,IAAe,mBAAmB,WAAW,CAAA;AAAA,GAC3C,EAAA,CAAC,EAAI,EAAA,cAAc,CAAC,CAAA;AAEvB,EAAA,SAAA,CAAU,MAAM;AACf,IAAA,IAAI,CAAC,EAAI,EAAA;AAET,IAAA,IAAI,CAAC,cAAgB,EAAA;AAErB,IAAA,MAAM,cAAc,QAAS,CAAA,EAAE,IAAI,QAAS,CAAA,aAAA,CAA2B,EAAE,CAAI,GAAA,EAAA;AAE7E,IAAM,MAAA,WAAA,GAAc,QAAS,CAAA,aAAA,CAAc,KAAK,CAAA;AAChD,IAAA,WAAA,CAAY,MAAM,OAAU,GAAA,UAAA;AAE5B,IAAa,WAAA,EAAA,qBAAA,CAAsB,gBAAgB,WAAW,CAAA;AAE9D,IAAA,kBAAA,CAAmB,WAAW,CAAA;AAE9B,IAAA,OAAO,MAAM;AACZ,MAAA,WAAA,CAAY,MAAO,EAAA;AAAA,KACpB;AAAA,GACE,EAAA,CAAC,EAAI,EAAA,cAAc,CAAC,CAAA;AAIvB,EAAO,OAAA,eAAA,IAAmB,YAAa,CAAA,QAAA,EAAU,eAAe,CAAA;AACjE","file":"chunk-G5BNZM66.js","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\nimport { type AnyString, isString } from \"@zayne-labs/toolkit-type-helpers\";\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"]}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import { getSingleSlot } from './chunk-IUEPHHGO.js';
|
|
2
1
|
import { createCustomContext, useCallbackRef } from '@zayne-labs/toolkit-react';
|
|
3
2
|
import * as React from 'react';
|
|
4
3
|
import { useState, Component } from 'react';
|
|
5
4
|
import { isFunction } from '@zayne-labs/toolkit-type-helpers';
|
|
6
5
|
|
|
7
|
-
|
|
6
|
+
// src/components/common/error-boundary/error-boundary-context.ts
|
|
7
|
+
var [ErrorBoundaryContext, useErrorBoundaryContext] = createCustomContext({
|
|
8
8
|
hookName: "useErrorBoundaryContext",
|
|
9
9
|
name: "ErrorBoundaryContext",
|
|
10
10
|
providerName: "ErrorBoundaryContextProvider"
|
|
@@ -37,8 +37,8 @@ var initialState = {
|
|
|
37
37
|
error: null,
|
|
38
38
|
hasError: false
|
|
39
39
|
};
|
|
40
|
-
var hasArrayChanged = (
|
|
41
|
-
return
|
|
40
|
+
var hasArrayChanged = (arrayOne = [], arrayTwo = []) => {
|
|
41
|
+
return arrayOne.length !== arrayTwo.length || arrayOne.some((item, index) => !Object.is(item, arrayTwo[index]));
|
|
42
42
|
};
|
|
43
43
|
var ErrorBoundary = class extends Component {
|
|
44
44
|
constructor(props) {
|
|
@@ -49,13 +49,20 @@ var ErrorBoundary = class extends Component {
|
|
|
49
49
|
return { error, hasError: true };
|
|
50
50
|
}
|
|
51
51
|
componentDidCatch(error, info) {
|
|
52
|
-
this.props.onError?.(
|
|
52
|
+
this.props.onError?.({
|
|
53
|
+
error,
|
|
54
|
+
info
|
|
55
|
+
});
|
|
53
56
|
}
|
|
54
57
|
componentDidUpdate(prevProps, prevState) {
|
|
55
58
|
const { hasError } = this.state;
|
|
56
59
|
const { resetKeys } = this.props;
|
|
57
60
|
if (hasError && prevState.error !== null && hasArrayChanged(prevProps.resetKeys, resetKeys)) {
|
|
58
|
-
this.props.onReset?.({
|
|
61
|
+
this.props.onReset?.({
|
|
62
|
+
next: resetKeys,
|
|
63
|
+
prev: prevProps.resetKeys,
|
|
64
|
+
reason: "keys"
|
|
65
|
+
});
|
|
59
66
|
this.setState(initialState);
|
|
60
67
|
}
|
|
61
68
|
}
|
|
@@ -63,19 +70,18 @@ var ErrorBoundary = class extends Component {
|
|
|
63
70
|
const { children, fallback } = this.props;
|
|
64
71
|
const { error, hasError } = this.state;
|
|
65
72
|
let childToRender = children;
|
|
66
|
-
const fallBackSlot = getSingleSlot(children, ErrorBoundaryFallBack);
|
|
67
73
|
if (hasError) {
|
|
68
74
|
switch (true) {
|
|
69
|
-
case
|
|
70
|
-
childToRender = fallBackSlot;
|
|
71
|
-
break;
|
|
72
|
-
}
|
|
73
|
-
case Boolean(fallback): {
|
|
75
|
+
case isFunction(fallback): {
|
|
74
76
|
const fallbackRenderProps = {
|
|
75
77
|
error,
|
|
76
78
|
resetErrorBoundary: this.#resetErrorBoundary
|
|
77
79
|
};
|
|
78
|
-
childToRender =
|
|
80
|
+
childToRender = fallback(fallbackRenderProps);
|
|
81
|
+
break;
|
|
82
|
+
}
|
|
83
|
+
case Boolean(fallback): {
|
|
84
|
+
childToRender = fallback;
|
|
79
85
|
break;
|
|
80
86
|
}
|
|
81
87
|
default: {
|
|
@@ -88,23 +94,20 @@ var ErrorBoundary = class extends Component {
|
|
|
88
94
|
hasError,
|
|
89
95
|
resetErrorBoundary: this.#resetErrorBoundary
|
|
90
96
|
};
|
|
91
|
-
return /* @__PURE__ */ React.createElement(
|
|
97
|
+
return /* @__PURE__ */ React.createElement(ErrorBoundaryContext, { value: contextValue }, childToRender);
|
|
92
98
|
}
|
|
93
99
|
#resetErrorBoundary = (...parameters) => {
|
|
94
100
|
const { error } = this.state;
|
|
95
101
|
if (error !== null) {
|
|
96
|
-
this.props.onReset?.({
|
|
102
|
+
this.props.onReset?.({
|
|
103
|
+
args: parameters,
|
|
104
|
+
reason: "imperative-api"
|
|
105
|
+
});
|
|
97
106
|
this.setState(initialState);
|
|
98
107
|
}
|
|
99
108
|
};
|
|
100
109
|
};
|
|
101
|
-
function ErrorBoundaryFallBack(props) {
|
|
102
|
-
const { children } = props;
|
|
103
|
-
const { error, resetErrorBoundary } = useErrorBoundaryContext();
|
|
104
|
-
const fallbackRenderProps = { error, resetErrorBoundary };
|
|
105
|
-
return isFunction(children) ? children(fallbackRenderProps) : children;
|
|
106
|
-
}
|
|
107
110
|
|
|
108
111
|
export { ErrorBoundary, useErrorBoundary, useErrorBoundaryContext };
|
|
109
|
-
//# sourceMappingURL=chunk-
|
|
110
|
-
//# sourceMappingURL=chunk-
|
|
112
|
+
//# sourceMappingURL=chunk-JC52CA2O.js.map
|
|
113
|
+
//# sourceMappingURL=chunk-JC52CA2O.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/common/error-boundary/error-boundary-context.ts","../../src/components/common/error-boundary/useErrorBoundary.ts","../../src/components/common/error-boundary/error-boundary.tsx"],"names":[],"mappings":"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","file":"chunk-JC52CA2O.js","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\nexport const [ErrorBoundaryContext, useErrorBoundaryContext] =\n\tcreateCustomContext<ErrorBoundaryContextType>({\n\t\thookName: \"useErrorBoundaryContext\",\n\t\tname: \"ErrorBoundaryContext\",\n\t\tproviderName: \"ErrorBoundaryContextProvider\",\n\t});\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","import { isFunction } from \"@zayne-labs/toolkit-type-helpers\";\nimport * as React from \"react\";\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?.({\n\t\t\terror,\n\t\t\tinfo,\n\t\t});\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"]}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
import { cnMerge } from './chunk-OHG7GB7O.js';
|
|
2
|
+
import { slot_parts_exports } from './chunk-Y5VBSXZS.js';
|
|
3
|
+
import { __export } from './chunk-PZ5AY32C.js';
|
|
4
|
+
import * as React from 'react';
|
|
5
|
+
|
|
6
|
+
function CardRoot(props) {
|
|
7
|
+
const { as: Element = "article", ...restOfProps } = props;
|
|
8
|
+
return /* @__PURE__ */ React.createElement(Element, { ...restOfProps });
|
|
9
|
+
}
|
|
10
|
+
function CardHeader(props) {
|
|
11
|
+
const { as: Element = "header", ...restOfProps } = props;
|
|
12
|
+
return /* @__PURE__ */ React.createElement(Element, { ...restOfProps });
|
|
13
|
+
}
|
|
14
|
+
function CardTitle(props) {
|
|
15
|
+
const { as: Element = "h3", className, ...restOfProps } = props;
|
|
16
|
+
return /* @__PURE__ */ React.createElement(Element, { className: cnMerge("font-semibold", className), ...restOfProps });
|
|
17
|
+
}
|
|
18
|
+
function CardDescription(props) {
|
|
19
|
+
const { as: Element = "p", className, ...restOfProps } = props;
|
|
20
|
+
return /* @__PURE__ */ React.createElement(Element, { className: cnMerge("text-shadcn-muted-foreground text-sm", className), ...restOfProps });
|
|
21
|
+
}
|
|
22
|
+
function CardContent(props) {
|
|
23
|
+
const { as: Element = "div", ...restOfProps } = props;
|
|
24
|
+
return /* @__PURE__ */ React.createElement(Element, { ...restOfProps });
|
|
25
|
+
}
|
|
26
|
+
function CardFooter(props) {
|
|
27
|
+
const { as: Element = "footer", asChild, ...restOfProps } = props;
|
|
28
|
+
const Component = asChild ? slot_parts_exports.Root : Element;
|
|
29
|
+
return /* @__PURE__ */ React.createElement(Component, { ...restOfProps });
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
// src/components/ui/card/card-parts.ts
|
|
33
|
+
var card_parts_exports = {};
|
|
34
|
+
__export(card_parts_exports, {
|
|
35
|
+
Content: () => CardContent,
|
|
36
|
+
Description: () => CardDescription,
|
|
37
|
+
Footer: () => CardFooter,
|
|
38
|
+
Header: () => CardHeader,
|
|
39
|
+
Root: () => CardRoot,
|
|
40
|
+
Title: () => CardTitle
|
|
41
|
+
});
|
|
42
|
+
|
|
43
|
+
export { CardContent, CardDescription, CardFooter, CardHeader, CardRoot, CardTitle, card_parts_exports };
|
|
44
|
+
//# sourceMappingURL=chunk-KLEJZWKY.js.map
|
|
45
|
+
//# sourceMappingURL=chunk-KLEJZWKY.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/ui/card/card.tsx","../../src/components/ui/card/card-parts.ts"],"names":[],"mappings":";;;;;AAMO,SAAS,SACf,KACC,EAAA;AACD,EAAA,MAAM,EAAE,EAAI,EAAA,OAAA,GAAU,SAAW,EAAA,GAAG,aAAgB,GAAA,KAAA;AAEpD,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAS,EAAA,EAAA,GAAG,WAAa,EAAA,CAAA;AAClC;AAEO,SAAS,WACf,KACC,EAAA;AACD,EAAA,MAAM,EAAE,EAAI,EAAA,OAAA,GAAU,QAAU,EAAA,GAAG,aAAgB,GAAA,KAAA;AAEnD,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAS,EAAA,EAAA,GAAG,WAAa,EAAA,CAAA;AAClC;AAEO,SAAS,UAAqD,KAAmC,EAAA;AACvG,EAAA,MAAM,EAAE,EAAI,EAAA,OAAA,GAAU,MAAM,SAAW,EAAA,GAAG,aAAgB,GAAA,KAAA;AAE1D,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,WAAQ,SAAW,EAAA,OAAA,CAAQ,iBAAiB,SAAS,CAAA,EAAI,GAAG,WAAa,EAAA,CAAA;AAClF;AAEO,SAAS,gBACf,KACC,EAAA;AACD,EAAA,MAAM,EAAE,EAAI,EAAA,OAAA,GAAU,KAAK,SAAW,EAAA,GAAG,aAAgB,GAAA,KAAA;AAEzD,EACC,uBAAA,KAAA,CAAA,aAAA,CAAC,WAAQ,SAAW,EAAA,OAAA,CAAQ,wCAAwC,SAAS,CAAA,EAAI,GAAG,WAAa,EAAA,CAAA;AAEnG;AAEO,SAAS,YACf,KACC,EAAA;AACD,EAAA,MAAM,EAAE,EAAI,EAAA,OAAA,GAAU,KAAO,EAAA,GAAG,aAAgB,GAAA,KAAA;AAEhD,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,OAAS,EAAA,EAAA,GAAG,WAAa,EAAA,CAAA;AAClC;AAEO,SAAS,WACf,KACC,EAAA;AACD,EAAA,MAAM,EAAE,EAAI,EAAA,OAAA,GAAU,UAAU,OAAS,EAAA,GAAG,aAAgB,GAAA,KAAA;AAE5D,EAAM,MAAA,SAAA,GAAY,OAAU,GAAA,kBAAA,CAAK,IAAO,GAAA,OAAA;AAExC,EAAO,uBAAA,KAAA,CAAA,aAAA,CAAC,SAAW,EAAA,EAAA,GAAG,WAAa,EAAA,CAAA;AACpC;;;ACtDA,IAAA,kBAAA,GAAA;AAAA,QAAA,CAAA,kBAAA,EAAA;AAAA,EAAA,OAAA,EAAA,MAAA,WAAA;AAAA,EAAA,WAAA,EAAA,MAAA,eAAA;AAAA,EAAA,MAAA,EAAA,MAAA,UAAA;AAAA,EAAA,MAAA,EAAA,MAAA,UAAA;AAAA,EAAA,IAAA,EAAA,MAAA,QAAA;AAAA,EAAA,KAAA,EAAA,MAAA;AAAA,CAAA,CAAA","file":"chunk-KLEJZWKY.js","sourcesContent":["import * as React from \"react\";\n\nimport { Slot } from \"@/components/common/slot\";\nimport { cnMerge } from \"@/lib/utils/cn\";\nimport type { PolymorphicProps } from \"@zayne-labs/toolkit-react/utils\";\n\nexport function CardRoot<TElement extends React.ElementType = \"article\">(\n\tprops: PolymorphicProps<TElement>\n) {\n\tconst { as: Element = \"article\", ...restOfProps } = props;\n\n\treturn <Element {...restOfProps} />;\n}\n\nexport function CardHeader<TElement extends React.ElementType = \"header\">(\n\tprops: PolymorphicProps<TElement>\n) {\n\tconst { as: Element = \"header\", ...restOfProps } = props;\n\n\treturn <Element {...restOfProps} />;\n}\n\nexport function CardTitle<TElement extends React.ElementType = \"h3\">(props: PolymorphicProps<TElement>) {\n\tconst { as: Element = \"h3\", className, ...restOfProps } = props;\n\n\treturn <Element className={cnMerge(\"font-semibold\", className)} {...restOfProps} />;\n}\n\nexport function CardDescription<TElement extends React.ElementType = \"p\">(\n\tprops: PolymorphicProps<TElement>\n) {\n\tconst { as: Element = \"p\", className, ...restOfProps } = props;\n\n\treturn (\n\t\t<Element className={cnMerge(\"text-shadcn-muted-foreground text-sm\", className)} {...restOfProps} />\n\t);\n}\n\nexport function CardContent<TElement extends React.ElementType = \"div\">(\n\tprops: PolymorphicProps<TElement>\n) {\n\tconst { as: Element = \"div\", ...restOfProps } = props;\n\n\treturn <Element {...restOfProps} />;\n}\n\nexport function CardFooter<TElement extends React.ElementType = \"footer\">(\n\tprops: PolymorphicProps<TElement, { asChild?: boolean }>\n) {\n\tconst { as: Element = \"footer\", asChild, ...restOfProps } = props;\n\n\tconst Component = asChild ? Slot.Root : Element;\n\n\treturn <Component {...restOfProps} />;\n}\n","export {\n\tCardContent as Content,\n\tCardDescription as Description,\n\tCardFooter as Footer,\n\tCardHeader as Header,\n\tCardRoot as Root,\n\tCardTitle as Title,\n} from \"./card\";\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { getMultipleSlots } from './chunk-
|
|
1
|
+
import { getMultipleSlots } from './chunk-YO5LJ7ZJ.js';
|
|
2
2
|
import { __export } from './chunk-PZ5AY32C.js';
|
|
3
3
|
import 'react';
|
|
4
4
|
import { isFunction, assert } from '@zayne-labs/toolkit-type-helpers';
|
|
@@ -44,5 +44,5 @@ __export(show_parts_exports, {
|
|
|
44
44
|
});
|
|
45
45
|
|
|
46
46
|
export { ShowContent, ShowFallback, ShowRoot, show_parts_exports };
|
|
47
|
-
//# sourceMappingURL=chunk-
|
|
48
|
-
//# sourceMappingURL=chunk-
|
|
47
|
+
//# sourceMappingURL=chunk-M7YXNGT6.js.map
|
|
48
|
+
//# sourceMappingURL=chunk-M7YXNGT6.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/common/show/show.tsx","../../src/components/common/show/show-parts.ts"],"names":[],"mappings":";;;;;AAaO,SAAS,SAAgB,KAAyB,EAAA;AACxD,EAAA,MAAM,EAAE,QAAA,EAAU,QAAU,EAAA,IAAA,EAAS,GAAA,KAAA;AAErC,EAAA,MAAM,mBAAmB,UAAW,CAAA,QAAQ,CAAI,GAAA,QAAA,CAAS,IAAa,CAAI,GAAA,QAAA;AAE1E,EAAM,MAAA;AAAA,IACL,eAAA;AAAA,IACA,KAAA,EAAO,CAAC,WAAA,EAAa,YAAY;AAAA,MAC9B,gBAAiB,CAAA,gBAAA,EAAkB,CAAC,WAAA,EAAa,YAAY,CAAG,EAAA;AAAA,IACnE,YAAc,EAAA;AAAA,MACb,8CAAA;AAAA,MACA;AAAA,KACD;AAAA,IACA,wBAA0B,EAAA;AAAA,GAC1B,CAAA;AAED,EAAA,IAAI,CAAC,IAAM,EAAA;AACV,IAAA,MAAA;AAAA,MACC,EAAE,YAAgB,IAAA,QAAA,CAAA;AAAA,MAClB;AAAA,KACD;AAEA,IAAA,OAAO,YAAgB,IAAA,QAAA;AAAA;AAGxB,EAAA,OAAO,WAAe,IAAA,eAAA;AACvB;AAEO,SAAS,WAAA,CAAY,EAAE,QAAA,EAA2C,EAAA;AACxE,EAAO,OAAA,QAAA;AACR;AACA,WAAY,CAAA,UAAA,GAAa,OAAO,cAAc,CAAA;AAEvC,SAAS,YAAA,CAAa,EAAE,QAAA,EAA2C,EAAA;AACzE,EAAO,OAAA,QAAA;AACR;AACA,YAAa,CAAA,UAAA,GAAa,OAAO,eAAe,CAAA;;;ACjDhD,IAAA,kBAAA,GAAA;AAAA,QAAA,CAAA,kBAAA,EAAA;AAAA,EAAA,OAAA,EAAA,MAAA,WAAA;AAAA,EAAA,QAAA,EAAA,MAAA,YAAA;AAAA,EAAA,SAAA,EAAA,MAAA,YAAA;AAAA,EAAA,IAAA,EAAA,MAAA;AAAA,CAAA,CAAA","file":"chunk-
|
|
1
|
+
{"version":3,"sources":["../../src/components/common/show/show.tsx","../../src/components/common/show/show-parts.ts"],"names":[],"mappings":";;;;;AAaO,SAAS,SAAgB,KAAyB,EAAA;AACxD,EAAA,MAAM,EAAE,QAAA,EAAU,QAAU,EAAA,IAAA,EAAS,GAAA,KAAA;AAErC,EAAA,MAAM,mBAAmB,UAAW,CAAA,QAAQ,CAAI,GAAA,QAAA,CAAS,IAAa,CAAI,GAAA,QAAA;AAE1E,EAAM,MAAA;AAAA,IACL,eAAA;AAAA,IACA,KAAA,EAAO,CAAC,WAAA,EAAa,YAAY;AAAA,MAC9B,gBAAiB,CAAA,gBAAA,EAAkB,CAAC,WAAA,EAAa,YAAY,CAAG,EAAA;AAAA,IACnE,YAAc,EAAA;AAAA,MACb,8CAAA;AAAA,MACA;AAAA,KACD;AAAA,IACA,wBAA0B,EAAA;AAAA,GAC1B,CAAA;AAED,EAAA,IAAI,CAAC,IAAM,EAAA;AACV,IAAA,MAAA;AAAA,MACC,EAAE,YAAgB,IAAA,QAAA,CAAA;AAAA,MAClB;AAAA,KACD;AAEA,IAAA,OAAO,YAAgB,IAAA,QAAA;AAAA;AAGxB,EAAA,OAAO,WAAe,IAAA,eAAA;AACvB;AAEO,SAAS,WAAA,CAAY,EAAE,QAAA,EAA2C,EAAA;AACxE,EAAO,OAAA,QAAA;AACR;AACA,WAAY,CAAA,UAAA,GAAa,OAAO,cAAc,CAAA;AAEvC,SAAS,YAAA,CAAa,EAAE,QAAA,EAA2C,EAAA;AACzE,EAAO,OAAA,QAAA;AACR;AACA,YAAa,CAAA,UAAA,GAAa,OAAO,eAAe,CAAA;;;ACjDhD,IAAA,kBAAA,GAAA;AAAA,QAAA,CAAA,kBAAA,EAAA;AAAA,EAAA,OAAA,EAAA,MAAA,WAAA;AAAA,EAAA,QAAA,EAAA,MAAA,YAAA;AAAA,EAAA,SAAA,EAAA,MAAA,YAAA;AAAA,EAAA,IAAA,EAAA,MAAA;AAAA,CAAA,CAAA","file":"chunk-M7YXNGT6.js","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\n\nimport { getMultipleSlots } from \"@/lib/utils/getSlot\";\nimport { assert, isFunction } from \"@zayne-labs/toolkit-type-helpers\";\n\ntype ShowProps<TWhen> = {\n\tchildren: React.ReactNode | ((value: TWhen) => React.ReactNode);\n\tfallback?: React.ReactNode;\n\twhen: false | TWhen | null | undefined;\n};\n\nexport function ShowRoot<TWhen>(props: ShowProps<TWhen>) {\n\tconst { children, fallback, when } = props;\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\nexport function ShowContent({ children }: { children: React.ReactNode }) {\n\treturn children;\n}\nShowContent.slotSymbol = Symbol(\"show-content\");\n\nexport function ShowFallback({ children }: { children: React.ReactNode }) {\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"]}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { ErrorBoundary } from './chunk-JC52CA2O.js';
|
|
2
|
+
import { Suspense } from 'react';
|
|
3
|
+
|
|
4
|
+
function SuspenseWithBoundary(props) {
|
|
5
|
+
const { children, errorFallback, fallback } = props;
|
|
6
|
+
const errorBoundaryProps = Boolean(errorFallback) && { fallback: errorFallback };
|
|
7
|
+
const suspenseProps = Boolean(fallback) && { fallback };
|
|
8
|
+
return /* @__PURE__ */ React.createElement(ErrorBoundary, { ...errorBoundaryProps }, /* @__PURE__ */ React.createElement(Suspense, { ...suspenseProps }, children));
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
export { SuspenseWithBoundary };
|
|
12
|
+
//# sourceMappingURL=chunk-MT2MQDK2.js.map
|
|
13
|
+
//# sourceMappingURL=chunk-MT2MQDK2.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/common/suspense-with-boundary/suspense-with-boundary.tsx"],"names":[],"mappings":";;;AASO,SAAS,qBAAqB,KAAkC,EAAA;AACtE,EAAA,MAAM,EAAE,QAAA,EAAU,aAAe,EAAA,QAAA,EAAa,GAAA,KAAA;AAE9C,EAAA,MAAM,qBAAqB,OAAQ,CAAA,aAAa,CAAK,IAAA,EAAE,UAAU,aAAc,EAAA;AAC/E,EAAA,MAAM,aAAgB,GAAA,OAAA,CAAQ,QAAQ,CAAA,IAAK,EAAE,QAAS,EAAA;AAEtD,EACC,uBAAA,KAAA,CAAA,aAAA,CAAC,iBAAe,GAAG,kBAAA,EAAA,sCACjB,QAAU,EAAA,EAAA,GAAG,aAAgB,EAAA,EAAA,QAAS,CACxC,CAAA;AAEF","file":"chunk-MT2MQDK2.js","sourcesContent":["import { 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"]}
|
|
@@ -23,6 +23,10 @@ var getSlotMap = (children) => {
|
|
|
23
23
|
continue;
|
|
24
24
|
}
|
|
25
25
|
const slotName = childType.slotName ?? child.props.name;
|
|
26
|
+
if (slotName === "default") {
|
|
27
|
+
slots.default.push(child);
|
|
28
|
+
continue;
|
|
29
|
+
}
|
|
26
30
|
slots[slotName] = child;
|
|
27
31
|
}
|
|
28
32
|
return slots;
|
|
@@ -42,5 +46,5 @@ var withSlotNameAndSymbol = (name, SlotComponent = DefaultSlotComponent) => {
|
|
|
42
46
|
};
|
|
43
47
|
|
|
44
48
|
export { createSlotComponent, getSlotMap, slotComponentSymbol, withSlotNameAndSymbol };
|
|
45
|
-
//# sourceMappingURL=chunk-
|
|
46
|
-
//# sourceMappingURL=chunk-
|
|
49
|
+
//# sourceMappingURL=chunk-N4274N5K.js.map
|
|
50
|
+
//# sourceMappingURL=chunk-N4274N5K.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils/getSlotMap/getSlotMap.ts"],"names":["ReactFragment"],"mappings":";;;;;AAqCa,IAAA,mBAAA,GAAsB,OAAO,gBAAgB;AAkC7C,IAAA,UAAA,GAAa,CACzB,QACqD,KAAA;AACrD,EAAA,MAAM,KAA0F,GAAA;AAAA,IAC/F,SAAS;AAAC,GACX;AAEA,EAAA,MAAM,UAAa,GAAA,cAAA,CAAwC,QAAQ,CAAA,IAAK,SAAS,IAAS,KAAAA,QAAA;AAE1F,EAAA,MAAM,cAAiB,GAAA,UAAA,GAAa,QAAS,CAAA,KAAA,CAAM,QAAW,GAAA,QAAA;AAE9D,EAAM,MAAA,aAAA,GAAgB,QAAyB,cAAc,CAAA;AAE7D,EAAA,KAAA,MAAW,SAAS,aAAe,EAAA;AAClC,IAAI,IAAA,CAAC,eAAoC,KAAK,CAAA,IAAK,CAAC,UAAW,CAAA,KAAA,CAAM,IAAI,CAAG,EAAA;AAC3E,MAAM,KAAA,CAAA,OAAA,CAAQ,KAAK,KAAK,CAAA;AACxB,MAAA;AAAA;AAGD,IAAA,MAAM,YAAY,KAAM,CAAA,IAAA;AAExB,IAAM,MAAA,aAAA,GACL,UAAU,UAAe,KAAA,mBAAA,IAAuB,QAAQ,SAAU,CAAA,QAAA,IAAY,KAAM,CAAA,KAAA,CAAM,IAAI,CAAA;AAE/F,IAAA,IAAI,CAAC,aAAe,EAAA;AACnB,MAAM,KAAA,CAAA,OAAA,CAAQ,KAAK,KAAK,CAAA;AACxB,MAAA;AAAA;AAGD,IAAA,MAAM,QAAW,GAAA,SAAA,CAAU,QAAY,IAAA,KAAA,CAAM,KAAM,CAAA,IAAA;AAEnD,IAAA,IAAI,aAAa,SAAW,EAAA;AAC3B,MAAM,KAAA,CAAA,OAAA,CAAQ,KAAK,KAAK,CAAA;AACxB,MAAA;AAAA;AAGD,IAAA,KAAA,CAAM,QAAQ,CAAI,GAAA,KAAA;AAAA;AAGnB,EAAO,OAAA,KAAA;AACR;AA8BO,IAAM,sBAAsB,MAAyD;AAC3F,EAAM,MAAA,aAAA,GAAgB,CAAC,KAAA,KAA+B,KAAM,CAAA,QAAA;AAE5D,EAAA,aAAA,CAAc,UAAa,GAAA,mBAAA;AAE3B,EAAO,OAAA,aAAA;AACR;AAWA,SAAS,qBAAqB,KAAiE,EAAA;AAC9F,EAAA,OAAO,KAAM,CAAA,QAAA;AACd;AAKO,IAAM,qBAAwB,GAAA,CAIpC,IACA,EAAA,aAAA,GAAyE,oBACrE,KAAA;AAGJ,EAAA,aAAA,CAAc,UAAa,GAAA,mBAAA;AAE3B,EAAA,aAAA,CAAc,QAAW,GAAA,IAAA;AAIzB,EAAO,OAAA,aAAA;AACR","file":"chunk-N4274N5K.js","sourcesContent":["import { toArray } from \"@zayne-labs/toolkit-core\";\nimport type { InferProps } from \"@zayne-labs/toolkit-react/utils\";\nimport {\n\ttype CallbackFn,\n\ttype EmptyObject,\n\ttype Prettify,\n\ttype UnionToIntersection,\n\ttype UnknownObject,\n\tisFunction,\n} from \"@zayne-labs/toolkit-type-helpers\";\nimport { Fragment as ReactFragment, isValidElement } from \"react\";\n\ntype GetSlotName<TSlotComponentProps extends GetSlotComponentProps> =\n\tstring extends TSlotComponentProps[\"name\"]\n\t\t? never\n\t\t: \"default\" extends TSlotComponentProps[\"name\"]\n\t\t\t? never\n\t\t\t: TSlotComponentProps[\"name\"];\n\ntype GetSpecificSlotsType<TSlotComponentProps extends GetSlotComponentProps> = {\n\t// This conditional before the remapping will prevent an Indexed Record type from showing up if the props are not passed, enhancing type safety\n\t[TName in keyof TSlotComponentProps as GetSlotName<TSlotComponentProps>]: Extract<\n\t\tTSlotComponentProps[\"children\"],\n\t\tReact.ReactNode\n\t>;\n};\n\n/**\n * Maps slot names to their corresponding children types\n */\nexport type GetSlotMapResult<TSlotComponentProps extends GetSlotComponentProps> = UnionToIntersection<\n\tGetSpecificSlotsType<TSlotComponentProps>\n> & { default: React.ReactNode[] };\n\n/**\n * Symbol used to identify SlotComponent instances\n */\nexport const slotComponentSymbol = Symbol(\"slot-component\");\n\n/**\n * @description Creates a map of named slots from React children. Returns an object mapping slot names to their children,\n * with a default slot for unmatched children.\n *\n * @example\n * ```tsx\n * import { type GetSlotComponentProps, SlotComponent } from \"@zayne-labs/toolkit-react/utils\"\n *\n * type SlotProps = GetSlotComponentProps<\"header\" | \"footer\">;\n *\n * function Parent({ children }: { children: React.ReactNode }) {\n * const slots = getSlotMap<SlotProps>(children);\n *\n * return (\n * <div>\n * <header>{slots.header}</header>\n * <main>{slots.default}</main>\n * <footer>{slots.footer}</footer>\n * </div>\n * );\n * }\n * ```\n *\n * Usage:\n * ```tsx\n * <Parent>\n * <SlotComponent name=\"header\">Header Content</SlotComponent>\n * <div>Random stuff</div>\n * <SlotComponent name=\"footer\">Footer Content</SlotComponent>\n * </Parent>\n * ```\n */\nexport const getSlotMap = <TSlotComponentProps extends GetSlotComponentProps>(\n\tchildren: React.ReactNode\n): Prettify<GetSlotMapResult<TSlotComponentProps>> => {\n\tconst slots: Record<string, TSlotComponentProps[\"children\"]> & { default: React.ReactNode[] } = {\n\t\tdefault: [],\n\t};\n\n\tconst isFragment = isValidElement<InferProps<HTMLElement>>(children) && children.type === ReactFragment;\n\n\tconst actualChildren = isFragment ? children.props.children : children;\n\n\tconst childrenArray = toArray<React.ReactNode>(actualChildren);\n\n\tfor (const child of childrenArray) {\n\t\tif (!isValidElement<TSlotComponentProps>(child) || !isFunction(child.type)) {\n\t\t\tslots.default.push(child);\n\t\t\tcontinue;\n\t\t}\n\n\t\tconst childType = child.type as SlotWithNameAndSymbol;\n\n\t\tconst isSlotElement =\n\t\t\tchildType.slotSymbol === slotComponentSymbol && Boolean(childType.slotName ?? child.props.name);\n\n\t\tif (!isSlotElement) {\n\t\t\tslots.default.push(child);\n\t\t\tcontinue;\n\t\t}\n\n\t\tconst slotName = childType.slotName ?? child.props.name;\n\n\t\tif (slotName === \"default\") {\n\t\t\tslots.default.push(child);\n\t\t\tcontinue;\n\t\t}\n\n\t\tslots[slotName] = child;\n\t}\n\n\treturn slots as GetSlotMapResult<TSlotComponentProps>;\n};\n\n/**\n * @description Produce props for the SlotComponent\n *\n * @example\n * ```ts\n * // Pattern One (slot or slots have same children type, which is just React.ReactNode by default)\n * type SlotProps = GetSlotComponentProps<\"header\" | \"content\" | \"footer\">;\n *\n * // Pattern Two (some slots can have different children type)\n * type SlotProps = GetSlotComponentProps<\"header\", React.ReactNode> | GetSlotComponentProps<\"header\", (renderProp: RenderProp) => React.ReactNode>;\n * ```\n */\nexport type GetSlotComponentProps<\n\tTName extends string = string,\n\tTChildren extends CallbackFn<never, React.ReactNode> | React.ReactNode =\n\t\t| CallbackFn<never, React.ReactNode>\n\t\t| React.ReactNode,\n> = {\n\tchildren: TChildren;\n\t/**\n\t * Name of the slot where content should be rendered\n\t */\n\tname: TName;\n};\n\n/**\n * @description Creates a slot component\n */\nexport const createSlotComponent = <TSlotComponentProps extends GetSlotComponentProps>() => {\n\tconst SlotComponent = (props: TSlotComponentProps) => props.children as React.ReactNode;\n\n\tSlotComponent.slotSymbol = slotComponentSymbol;\n\n\treturn SlotComponent;\n};\n\ntype SlotWithNameAndSymbol<\n\tTSlotComponentProps extends GetSlotComponentProps = GetSlotComponentProps,\n\tTOtherProps extends UnknownObject = EmptyObject,\n> = {\n\t(props: Pick<TSlotComponentProps, \"children\"> & TOtherProps): React.ReactNode;\n\treadonly slotName?: TSlotComponentProps[\"name\"];\n\treadonly slotSymbol?: symbol;\n};\n\nfunction DefaultSlotComponent(props: Pick<GetSlotComponentProps, \"children\">): React.ReactNode {\n\treturn props.children as React.ReactNode;\n}\n\n/**\n * @description Adds a slot symbol and name to a slot component passed in\n */\nexport const withSlotNameAndSymbol = <\n\tTSlotComponentProps extends GetSlotComponentProps,\n\tTOtherProps extends UnknownObject = EmptyObject,\n>(\n\tname: TSlotComponentProps[\"name\"],\n\tSlotComponent: SlotWithNameAndSymbol<TSlotComponentProps, TOtherProps> = DefaultSlotComponent\n) => {\n\t/* eslint-disable no-param-reassign -- This is necessary */\n\t// @ts-expect-error -- This is necessary for the time being, to prevent type errors and accidental overrides on consumer side\n\tSlotComponent.slotSymbol = slotComponentSymbol;\n\t// @ts-expect-error -- This is necessary for the time being, to prevent type errors and accidental overrides on consumer side\n\tSlotComponent.slotName = name;\n\n\t/* eslint-enable no-param-reassign -- This is necessary */\n\n\treturn SlotComponent;\n};\n"]}
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
import { cnMerge } from './chunk-OHG7GB7O.js';
|
|
2
|
+
import { off, on, checkIsDeviceMobile } from '@zayne-labs/toolkit-core';
|
|
3
|
+
import { useCallbackRef } from '@zayne-labs/toolkit-react';
|
|
4
|
+
import { mergeTwoProps, composeRefs } from '@zayne-labs/toolkit-react/utils';
|
|
5
|
+
import { useRef } from 'react';
|
|
6
|
+
|
|
7
|
+
var updateCursor = (element) => {
|
|
8
|
+
element.style.cursor = "grabbing";
|
|
9
|
+
element.style.userSelect = "none";
|
|
10
|
+
};
|
|
11
|
+
var onScrollSnap = (action, element) => {
|
|
12
|
+
if (action === "remove") {
|
|
13
|
+
element.style.scrollSnapType = "none";
|
|
14
|
+
return;
|
|
15
|
+
}
|
|
16
|
+
element.style.scrollSnapType = "";
|
|
17
|
+
};
|
|
18
|
+
var resetCursor = (element) => {
|
|
19
|
+
element.style.cursor = "";
|
|
20
|
+
element.style.userSelect = "";
|
|
21
|
+
};
|
|
22
|
+
var handleScrollSnap = (dragContainer) => {
|
|
23
|
+
const isMobile = checkIsDeviceMobile();
|
|
24
|
+
if (!isMobile) {
|
|
25
|
+
onScrollSnap("remove", dragContainer);
|
|
26
|
+
} else {
|
|
27
|
+
onScrollSnap("reset", dragContainer);
|
|
28
|
+
}
|
|
29
|
+
};
|
|
30
|
+
|
|
31
|
+
// src/components/ui/drag-scroll/use-drag-scroll.ts
|
|
32
|
+
var useDragScroll = (props) => {
|
|
33
|
+
const {
|
|
34
|
+
classNames,
|
|
35
|
+
extraItemProps,
|
|
36
|
+
extraRootProps,
|
|
37
|
+
orientation = "horizontal",
|
|
38
|
+
usage = "allScreens"
|
|
39
|
+
} = props ?? {};
|
|
40
|
+
const dragContainerRef = useRef(null);
|
|
41
|
+
const positionRef = useRef({ left: 0, top: 0, x: 0, y: 0 });
|
|
42
|
+
const handleMouseMove = useCallbackRef((event) => {
|
|
43
|
+
if (!dragContainerRef.current) return;
|
|
44
|
+
if (orientation === "horizontal" || orientation === "both") {
|
|
45
|
+
const dx = event.clientX - positionRef.current.x;
|
|
46
|
+
dragContainerRef.current.scrollLeft = positionRef.current.left - dx;
|
|
47
|
+
}
|
|
48
|
+
if (orientation === "vertical" || orientation === "both") {
|
|
49
|
+
const dy = event.clientY - positionRef.current.y;
|
|
50
|
+
dragContainerRef.current.scrollTop = positionRef.current.top - dy;
|
|
51
|
+
}
|
|
52
|
+
});
|
|
53
|
+
const handleMouseUpOrLeave = useCallbackRef(() => {
|
|
54
|
+
if (!dragContainerRef.current) return;
|
|
55
|
+
off("mousemove", dragContainerRef.current, handleMouseMove);
|
|
56
|
+
off("mouseup", dragContainerRef.current, handleMouseUpOrLeave);
|
|
57
|
+
off("mouseleave", dragContainerRef.current, handleMouseUpOrLeave);
|
|
58
|
+
resetCursor(dragContainerRef.current);
|
|
59
|
+
});
|
|
60
|
+
const handleMouseDown = useCallbackRef((event) => {
|
|
61
|
+
if (usage === "mobileAndTabletOnly" && window.innerWidth >= 768) return;
|
|
62
|
+
if (usage === "desktopOnly" && window.innerWidth < 768) return;
|
|
63
|
+
if (!dragContainerRef.current) return;
|
|
64
|
+
if (orientation === "horizontal" || orientation === "both") {
|
|
65
|
+
positionRef.current.x = event.clientX;
|
|
66
|
+
positionRef.current.left = dragContainerRef.current.scrollLeft;
|
|
67
|
+
}
|
|
68
|
+
if (orientation === "vertical" || orientation === "both") {
|
|
69
|
+
positionRef.current.y = event.clientY;
|
|
70
|
+
positionRef.current.top = dragContainerRef.current.scrollTop;
|
|
71
|
+
}
|
|
72
|
+
updateCursor(dragContainerRef.current);
|
|
73
|
+
on("mousemove", dragContainerRef.current, handleMouseMove);
|
|
74
|
+
on("mouseup", dragContainerRef.current, handleMouseUpOrLeave);
|
|
75
|
+
on("mouseleave", dragContainerRef.current, handleMouseUpOrLeave);
|
|
76
|
+
});
|
|
77
|
+
const refCallBack = useCallbackRef((node) => {
|
|
78
|
+
dragContainerRef.current = node;
|
|
79
|
+
node && handleScrollSnap(node);
|
|
80
|
+
const cleanup = on("mousedown", dragContainerRef.current, handleMouseDown);
|
|
81
|
+
return cleanup;
|
|
82
|
+
});
|
|
83
|
+
const getRootProps = (rootProps) => {
|
|
84
|
+
const mergedRootProps = mergeTwoProps(extraRootProps, rootProps);
|
|
85
|
+
return {
|
|
86
|
+
...mergedRootProps,
|
|
87
|
+
className: cnMerge(
|
|
88
|
+
`scrollbar-hidden flex w-full cursor-grab snap-x snap-mandatory overflow-y-hidden
|
|
89
|
+
overflow-x-scroll`,
|
|
90
|
+
orientation === "horizontal" && "flex-row",
|
|
91
|
+
orientation === "vertical" && "flex-col",
|
|
92
|
+
usage === "mobileAndTabletOnly" && "md:cursor-default md:flex-col",
|
|
93
|
+
usage === "desktopOnly" && "max-md:cursor-default max-md:flex-col",
|
|
94
|
+
classNames?.base,
|
|
95
|
+
mergedRootProps.className
|
|
96
|
+
),
|
|
97
|
+
"data-part": "root",
|
|
98
|
+
"data-scope": "drag-scroll",
|
|
99
|
+
"data-slot": "drag-scroll-root",
|
|
100
|
+
ref: composeRefs(
|
|
101
|
+
refCallBack,
|
|
102
|
+
mergedRootProps?.ref
|
|
103
|
+
)
|
|
104
|
+
};
|
|
105
|
+
};
|
|
106
|
+
const getItemProps = (itemProps) => {
|
|
107
|
+
const mergedItemProps = mergeTwoProps(extraItemProps, itemProps);
|
|
108
|
+
return {
|
|
109
|
+
...mergedItemProps,
|
|
110
|
+
className: cnMerge("snap-center snap-always", classNames?.item, mergedItemProps.className),
|
|
111
|
+
"data-part": "item",
|
|
112
|
+
"data-scope": "drag-scroll",
|
|
113
|
+
"data-slot": "drag-scroll-item"
|
|
114
|
+
};
|
|
115
|
+
};
|
|
116
|
+
return { getItemProps, getRootProps };
|
|
117
|
+
};
|
|
118
|
+
|
|
119
|
+
export { useDragScroll };
|
|
120
|
+
//# sourceMappingURL=chunk-V5ZPMMIH.js.map
|
|
121
|
+
//# sourceMappingURL=chunk-V5ZPMMIH.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/ui/drag-scroll/utils.ts","../../src/components/ui/drag-scroll/use-drag-scroll.ts"],"names":[],"mappings":"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","file":"chunk-V5ZPMMIH.js","sourcesContent":["import { checkIsDeviceMobile } from \"@zayne-labs/toolkit-core\";\n\n/* eslint-disable no-param-reassign -- Mutation is needed here since it's an element */\nexport const updateCursor = <TElement extends HTMLElement>(element: TElement) => {\n\telement.style.cursor = \"grabbing\";\n\telement.style.userSelect = \"none\";\n};\n\nexport const onScrollSnap = <TElement extends HTMLElement>(\n\taction: \"remove\" | \"reset\",\n\telement: TElement\n) => {\n\tif (action === \"remove\") {\n\t\telement.style.scrollSnapType = \"none\";\n\t\treturn;\n\t}\n\n\telement.style.scrollSnapType = \"\";\n};\n\nexport const resetCursor = <TElement extends HTMLElement>(element: TElement) => {\n\telement.style.cursor = \"\";\n\telement.style.userSelect = \"\";\n};\n/* eslint-enable no-param-reassign -- Mutation is needed here since it's an element */\n\nexport const handleScrollSnap = (dragContainer: HTMLElement) => {\n\tconst isMobile = checkIsDeviceMobile();\n\n\tif (!isMobile) {\n\t\tonScrollSnap(\"remove\", dragContainer);\n\t} else {\n\t\tonScrollSnap(\"reset\", dragContainer);\n\t}\n};\n","import { cnMerge } from \"@/lib/utils/cn\";\nimport { off, on } from \"@zayne-labs/toolkit-core\";\nimport { useCallbackRef } from \"@zayne-labs/toolkit-react\";\nimport { type InferProps, composeRefs, mergeTwoProps } from \"@zayne-labs/toolkit-react/utils\";\nimport { type RefCallback, useRef } from \"react\";\nimport { handleScrollSnap, resetCursor, updateCursor } from \"./utils\";\n\ntype ItemProps<TItemElement extends HTMLElement> = Omit<InferProps<TItemElement>, \"children\">;\n\ntype RootProps<TElement extends HTMLElement> = Omit<InferProps<TElement>, \"children\">;\n\ntype DragScrollProps<TElement extends HTMLElement, TItemElement extends HTMLElement> = {\n\tclassNames?: { base?: string; item?: string };\n\textraItemProps?: ItemProps<TItemElement>;\n\textraRootProps?: InferProps<TElement>;\n\torientation?: \"both\" | \"horizontal\" | \"vertical\";\n\tusage?: \"allScreens\" | \"desktopOnly\" | \"mobileAndTabletOnly\";\n};\n\ntype DragScrollResult<TElement extends HTMLElement, TItemElement extends HTMLElement> = {\n\tgetItemProps: (itemProps?: ItemProps<TItemElement>) => ItemProps<TItemElement>;\n\tgetRootProps: (rootProps?: RootProps<TElement>) => RootProps<TElement>;\n};\n\nconst useDragScroll = <TElement extends HTMLElement, TItemElement extends HTMLElement = HTMLElement>(\n\tprops?: DragScrollProps<TElement, TItemElement>\n): DragScrollResult<TElement, TItemElement> => {\n\tconst {\n\t\tclassNames,\n\t\textraItemProps,\n\t\textraRootProps,\n\t\torientation = \"horizontal\",\n\t\tusage = \"allScreens\",\n\t} = props ?? {};\n\n\tconst dragContainerRef = useRef<TElement>(null);\n\n\tconst positionRef = useRef({ left: 0, top: 0, x: 0, y: 0 });\n\n\tconst handleMouseMove = useCallbackRef((event: MouseEvent) => {\n\t\tif (!dragContainerRef.current) return;\n\n\t\tif (orientation === \"horizontal\" || orientation === \"both\") {\n\t\t\t// == calculate the current change in the horizontal scroll position based on the difference between the previous mouse position and the new mouse position\n\t\t\tconst dx = event.clientX - positionRef.current.x;\n\n\t\t\t// == Assign the scrollLeft of the container to the difference between its previous horizontal scroll position and the change in the mouse position\n\t\t\tdragContainerRef.current.scrollLeft = positionRef.current.left - dx;\n\t\t}\n\n\t\tif (orientation === \"vertical\" || orientation === \"both\") {\n\t\t\t// == calculate the current change in the vertical scroll position based on the difference between the previous mouse position and the new mouse position\n\t\t\tconst dy = event.clientY - positionRef.current.y;\n\n\t\t\t// == Assign the scrollTop of the container to the difference between its previous vertical scroll position and the change in the mouse position\n\t\t\tdragContainerRef.current.scrollTop = positionRef.current.top - dy;\n\t\t}\n\t});\n\n\tconst handleMouseUpOrLeave = useCallbackRef(() => {\n\t\tif (!dragContainerRef.current) return;\n\n\t\toff(\"mousemove\", dragContainerRef.current, handleMouseMove);\n\t\toff(\"mouseup\", dragContainerRef.current, handleMouseUpOrLeave);\n\t\toff(\"mouseleave\", dragContainerRef.current, handleMouseUpOrLeave);\n\n\t\tresetCursor(dragContainerRef.current);\n\t});\n\n\tconst handleMouseDown = useCallbackRef((event: MouseEvent) => {\n\t\tif (usage === \"mobileAndTabletOnly\" && window.innerWidth >= 768) return;\n\t\tif (usage === \"desktopOnly\" && window.innerWidth < 768) return;\n\n\t\tif (!dragContainerRef.current) return;\n\n\t\t// == Update all initial position properties stored in the positionRef\n\t\tif (orientation === \"horizontal\" || orientation === \"both\") {\n\t\t\tpositionRef.current.x = event.clientX;\n\t\t\tpositionRef.current.left = dragContainerRef.current.scrollLeft;\n\t\t}\n\n\t\tif (orientation === \"vertical\" || orientation === \"both\") {\n\t\t\tpositionRef.current.y = event.clientY;\n\t\t\tpositionRef.current.top = dragContainerRef.current.scrollTop;\n\t\t}\n\n\t\tupdateCursor(dragContainerRef.current);\n\n\t\ton(\"mousemove\", dragContainerRef.current, handleMouseMove);\n\t\ton(\"mouseup\", dragContainerRef.current, handleMouseUpOrLeave);\n\t\ton(\"mouseleave\", dragContainerRef.current, handleMouseUpOrLeave);\n\t});\n\n\tconst refCallBack: RefCallback<TElement> = useCallbackRef((node) => {\n\t\tdragContainerRef.current = node;\n\n\t\tnode && handleScrollSnap(node);\n\n\t\tconst cleanup = on(\"mousedown\", dragContainerRef.current, handleMouseDown);\n\n\t\treturn cleanup;\n\t});\n\n\tconst getRootProps: DragScrollResult<TElement, TItemElement>[\"getRootProps\"] = (rootProps) => {\n\t\tconst mergedRootProps = mergeTwoProps(extraRootProps, rootProps);\n\n\t\treturn {\n\t\t\t...mergedRootProps,\n\t\t\tclassName: cnMerge(\n\t\t\t\t`scrollbar-hidden flex w-full cursor-grab snap-x snap-mandatory overflow-y-hidden\n\t\t\t\toverflow-x-scroll`,\n\t\t\t\torientation === \"horizontal\" && \"flex-row\",\n\t\t\t\torientation === \"vertical\" && \"flex-col\",\n\t\t\t\tusage === \"mobileAndTabletOnly\" && \"md:cursor-default md:flex-col\",\n\t\t\t\tusage === \"desktopOnly\" && \"max-md:cursor-default max-md:flex-col\",\n\t\t\t\tclassNames?.base,\n\t\t\t\tmergedRootProps.className\n\t\t\t),\n\t\t\t\"data-part\": \"root\",\n\t\t\t\"data-scope\": \"drag-scroll\",\n\t\t\t\"data-slot\": \"drag-scroll-root\",\n\t\t\tref: composeRefs(\n\t\t\t\trefCallBack,\n\t\t\t\t(mergedRootProps as { ref?: React.Ref<TElement> } | undefined)?.ref\n\t\t\t),\n\t\t};\n\t};\n\n\tconst getItemProps: DragScrollResult<TElement, TItemElement>[\"getItemProps\"] = (itemProps) => {\n\t\tconst mergedItemProps = mergeTwoProps(extraItemProps, itemProps);\n\n\t\treturn {\n\t\t\t...mergedItemProps,\n\t\t\tclassName: cnMerge(\"snap-center snap-always\", classNames?.item, mergedItemProps.className),\n\t\t\t\"data-part\": \"item\",\n\t\t\t\"data-scope\": \"drag-scroll\",\n\t\t\t\"data-slot\": \"drag-scroll-item\",\n\t\t};\n\t};\n\n\treturn { getItemProps, getRootProps };\n};\n\nexport { useDragScroll };\n"]}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
+
import { __export } from './chunk-PZ5AY32C.js';
|
|
1
2
|
import * as React from 'react';
|
|
2
3
|
import { Children, isValidElement, cloneElement, Fragment } from 'react';
|
|
3
4
|
import { composeRefs, mergeProps } from '@zayne-labs/toolkit-react/utils';
|
|
4
5
|
import { isArray } from '@zayne-labs/toolkit-type-helpers';
|
|
5
6
|
|
|
6
|
-
|
|
7
|
-
function Slottable({ children }) {
|
|
7
|
+
function SlotSlottable({ children }) {
|
|
8
8
|
return children;
|
|
9
9
|
}
|
|
10
10
|
var isSlottable = (child) => {
|
|
11
|
-
return isValidElement(child) && child.type ===
|
|
11
|
+
return isValidElement(child) && child.type === SlotSlottable;
|
|
12
12
|
};
|
|
13
|
-
function
|
|
13
|
+
function SlotRoot(props) {
|
|
14
14
|
const { children, ...restOfSlotProps } = props;
|
|
15
15
|
const childrenArray = isArray(children) ? children : [children];
|
|
16
16
|
const slottable = childrenArray.find((element) => isSlottable(element));
|
|
@@ -43,6 +43,13 @@ function SlotClone(props) {
|
|
|
43
43
|
return cloneElement(children, clonedProps);
|
|
44
44
|
}
|
|
45
45
|
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
46
|
+
// src/components/common/slot/slot-parts.ts
|
|
47
|
+
var slot_parts_exports = {};
|
|
48
|
+
__export(slot_parts_exports, {
|
|
49
|
+
Root: () => SlotRoot,
|
|
50
|
+
Slottable: () => SlotSlottable
|
|
51
|
+
});
|
|
52
|
+
|
|
53
|
+
export { SlotRoot, SlotSlottable, slot_parts_exports };
|
|
54
|
+
//# sourceMappingURL=chunk-Y5VBSXZS.js.map
|
|
55
|
+
//# sourceMappingURL=chunk-Y5VBSXZS.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/components/common/slot/slot.tsx","../../src/components/common/slot/slot-parts.ts"],"names":["ReactFragment"],"mappings":";;;;;;AAYO,SAAS,aAAA,CAAc,EAAE,QAAA,EAAyC,EAAA;AACxE,EAAO,OAAA,QAAA;AACR;AAEA,IAAM,WAAA,GAAc,CAAC,KAAwD,KAAA;AAC5E,EAAA,OAAO,cAAe,CAAA,KAAK,CAAK,IAAA,KAAA,CAAM,IAAS,KAAA,aAAA;AAChD,CAAA;AAMO,SAAS,SAAS,KAAkB,EAAA;AAC1C,EAAA,MAAM,EAAE,QAAA,EAAU,GAAG,eAAA,EAAoB,GAAA,KAAA;AAEzC,EAAA,MAAM,gBAAgB,OAAyB,CAAA,QAAQ,CAAI,GAAA,QAAA,GAAW,CAAC,QAAQ,CAAA;AAC/E,EAAA,MAAM,YAAY,aAAc,CAAA,IAAA,CAAK,CAAC,OAAY,KAAA,WAAA,CAAY,OAAO,CAAC,CAAA;AAEtE,EAAA,IAAI,SAAW,EAAA;AAEd,IAAM,MAAA,UAAA,GAAc,UAAU,KAAoB,CAAA,QAAA;AAElD,IAAA,IAAI,QAAS,CAAA,KAAA,CAAM,UAAU,CAAA,GAAI,CAAG,EAAA;AACnC,MAAO,OAAA,QAAA,CAAS,KAAK,IAAI,CAAA;AAAA;AAG1B,IAAA,MAAM,kBAAqB,GAAA,aAAA,CAAc,GAAI,CAAA,CAAC,KAAU,KAAA;AACvD,MAAA,IAAI,UAAU,SAAW,EAAA;AAExB,QAAA,OAAO,cAA0B,CAAA,UAAU,CAAK,IAAA,UAAA,CAAW,KAAM,CAAA,QAAA;AAAA;AAGlE,MAAO,OAAA,KAAA;AAAA,KACP,CAAA;AAED,IACC,uBAAA,KAAA,CAAA,aAAA,CAAC,SAAW,EAAA,EAAA,GAAG,eACb,EAAA,EAAA,cAAA,CAAe,UAAU,CAAA,IAAK,YAAa,CAAA,UAAA,EAAY,MAAW,EAAA,kBAAkB,CACtF,CAAA;AAAA;AAIF,EAAA,uBAAQ,KAAA,CAAA,aAAA,CAAA,SAAA,EAAA,EAAW,GAAG,eAAA,EAAA,EAAkB,QAAS,CAAA;AAClD;AASA,SAAS,UAAU,KAAuB,EAAA;AACzC,EAAA,MAAM,EAAE,QAAU,EAAA,GAAA,EAAK,YAAc,EAAA,GAAG,iBAAoB,GAAA,KAAA;AAE5D,EAAI,IAAA,CAAC,cAA6B,CAAA,QAAQ,CAAG,EAAA;AAC5C,IAAO,OAAA,QAAA,CAAS,MAAM,QAAQ,CAAA,GAAI,IAAI,QAAS,CAAA,IAAA,CAAK,IAAI,CAAI,GAAA,IAAA;AAAA;AAG7D,EAAA,MAAM,QAAY,GAAA,QAAA,CAAS,KAAM,CAAA,GAAA,IAC5B,QAAqC,CAAA,GAAA;AAE1C,EAAA,MAAM,SAAY,GAAA,YAAA,GAAe,WAAY,CAAA,YAAA,EAAc,QAAQ,CAAI,GAAA,QAAA;AAEvE,EAAA,MAAM,WAAc,GAAA;AAAA,IACnB,GAAG,UAAA,CAAW,eAAiB,EAAA,QAAA,CAAS,KAAK,CAAA;AAAA,IAC7C,GAAI,QAAS,CAAA,IAAA,KAASA,QAAiB,IAAA,EAAE,KAAK,SAAU;AAAA,GACzD;AAEA,EAAO,OAAA,YAAA,CAAa,UAAU,WAAW,CAAA;AAC1C;;;AClFA,IAAA,kBAAA,GAAA;AAAA,QAAA,CAAA,kBAAA,EAAA;AAAA,EAAA,IAAA,EAAA,MAAA,QAAA;AAAA,EAAA,SAAA,EAAA,MAAA;AAAA,CAAA,CAAA","file":"chunk-Y5VBSXZS.js","sourcesContent":["import * as React from \"react\";\n\nimport { type InferProps, composeRefs, mergeProps } from \"@zayne-labs/toolkit-react/utils\";\nimport { isArray } from \"@zayne-labs/toolkit-type-helpers\";\nimport { Children, Fragment as ReactFragment, cloneElement, isValidElement } from \"react\";\n\ntype SlotProps = InferProps<HTMLElement>;\n\n/* -------------------------------------------------------------------------------------------------\n * Slottable\n * ----------------------------------------------------------------------------------------------- */\n\nexport function SlotSlottable({ children }: Pick<SlotProps, \"children\">) {\n\treturn children;\n}\n\nconst isSlottable = (child: React.ReactNode): child is React.ReactElement => {\n\treturn isValidElement(child) && child.type === SlotSlottable;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Slot\n * ----------------------------------------------------------------------------------------------- */\n\nexport function SlotRoot(props: SlotProps) {\n\tconst { children, ...restOfSlotProps } = props;\n\n\tconst childrenArray = isArray<React.ReactNode>(children) ? children : [children];\n\tconst slottable = childrenArray.find((element) => isSlottable(element));\n\n\tif (slottable) {\n\t\t// == The new element to render is the one passed as a child of `Slottable`\n\t\tconst newElement = (slottable.props as SlotProps).children;\n\n\t\tif (Children.count(newElement) > 1) {\n\t\t\treturn Children.only(null);\n\t\t}\n\n\t\tconst newElementChildren = childrenArray.map((child) => {\n\t\t\tif (child === slottable) {\n\t\t\t\t// == Because the new element will be the one rendered, we are only interested in grabbing its children (`newElement.props.children`)\n\t\t\t\treturn isValidElement<SlotProps>(newElement) && newElement.props.children;\n\t\t\t}\n\n\t\t\treturn child;\n\t\t});\n\n\t\treturn (\n\t\t\t<SlotClone {...restOfSlotProps}>\n\t\t\t\t{isValidElement(newElement) && cloneElement(newElement, undefined, newElementChildren)}\n\t\t\t</SlotClone>\n\t\t);\n\t}\n\n\treturn <SlotClone {...restOfSlotProps}>{children}</SlotClone>;\n}\n\ntype SlotCloneProps = {\n\tchildren: React.ReactNode;\n\tref?: React.RefObject<HTMLElement>;\n};\n\ntype UnknownProps = Record<string, unknown>;\n\nfunction SlotClone(props: SlotCloneProps) {\n\tconst { children, ref: forwardedRef, ...restOfSlotProps } = props;\n\n\tif (!isValidElement<UnknownProps>(children)) {\n\t\treturn Children.count(children) > 1 ? Children.only(null) : null;\n\t}\n\n\tconst childRef = (children.props.ref\n\t\t?? (children as unknown as UnknownProps).ref) as React.Ref<HTMLElement>;\n\n\tconst mergedRef = forwardedRef ? composeRefs(forwardedRef, childRef) : childRef;\n\n\tconst clonedProps = {\n\t\t...mergeProps(restOfSlotProps, children.props),\n\t\t...(children.type !== ReactFragment && { ref: mergedRef }),\n\t};\n\n\treturn cloneElement(children, clonedProps);\n}\n","export { SlotRoot as Root, SlotSlottable as Slottable } from \"./slot\";\n"]}
|
|
@@ -70,5 +70,5 @@ var getRegularChildren = (children, SlotComponentOrComponents) => {
|
|
|
70
70
|
};
|
|
71
71
|
|
|
72
72
|
export { getMultipleSlots, getRegularChildren, getSingleSlot, matchesAnySlotComponent, matchesSlotComponent };
|
|
73
|
-
//# sourceMappingURL=chunk-
|
|
74
|
-
//# sourceMappingURL=chunk-
|
|
73
|
+
//# sourceMappingURL=chunk-YO5LJ7ZJ.js.map
|
|
74
|
+
//# sourceMappingURL=chunk-YO5LJ7ZJ.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/lib/utils/getSlot/getSlot.ts"],"names":["ReactFragment"],"mappings":";;;;;AAcA,IAAM,gBAAA,GAAmB,CACxB,SAC4D,KAAA;AAC5D,EAAA,OAAO,YAAgB,IAAA,SAAA,IAAa,OAAQ,CAAA,SAAA,CAAU,UAAU,CAAA;AACjE,CAAA;AAEA,IAAM,mBAAA,GAAsB,CAC3B,SAC+D,KAAA;AAC/D,EAAA,OAAO,eAAmB,IAAA,SAAA,IAAa,OAAQ,CAAA,SAAA,CAAU,aAAa,CAAA;AACvE,CAAA;AAOa,IAAA,oBAAA,GAAuB,CAAC,KAAA,EAAwB,aAAuC,KAAA;AACnG,EAAI,IAAA,CAAC,eAAe,KAAK,CAAA,IAAK,CAAC,UAAW,CAAA,KAAA,CAAM,IAAI,CAAG,EAAA;AACtD,IAAO,OAAA,KAAA;AAAA;AAGR,EAAM,MAAA,iBAAA,GAAoB,oBAAoB,KAAM,CAAA,IAAI,IACpD,KAAM,CAAA,IAAA,CAAK,gBACZ,KAAM,CAAA,IAAA;AAET,EAAM,MAAA,qBAAA,GACL,iBAAiB,iBAAiB,CAAA,IAC/B,iBAAiB,aAAa,CAAA,IAC9B,iBAAkB,CAAA,UAAA,KAAe,aAAc,CAAA,UAAA;AAEnD,EAAA,IAAI,qBAAuB,EAAA;AAC1B,IAAO,OAAA,IAAA;AAAA;AAGR,EAAA,IAAI,KAAM,CAAA,IAAA,CAAK,IAAS,KAAA,aAAA,CAAc,IAAM,EAAA;AAC3C,IAAO,OAAA,IAAA;AAAA;AAGR,EAAO,OAAA,KAAA;AACR;AAKa,IAAA,uBAAA,GAA0B,CAAC,KAAA,EAAwB,cAA0C,KAAA;AACzG,EAAM,MAAA,WAAA,GAAc,eAAe,IAAK,CAAA,CAAC,kBAAkB,oBAAqB,CAAA,KAAA,EAAO,aAAa,CAAC,CAAA;AAErG,EAAO,OAAA,WAAA;AACR;AAiBA,IAAM,wBAAA,GAA2B,CAChC,aAAA,EACA,aACI,KAAA;AACJ,EAAA,IAAI,KAAQ,GAAA,CAAA;AAEZ,EAAA,KAAA,MAAW,SAAS,aAAe,EAAA;AAClC,IAAA,IAAI,CAAC,oBAAA,CAAqB,KAAO,EAAA,aAAa,CAAG,EAAA;AAEjD,IAAS,KAAA,IAAA,CAAA;AAAA;AAGV,EAAO,OAAA,KAAA;AACR,CAAA;AAOO,IAAM,gBAAgB,CAC5B,QAAA,EACA,aACA,EAAA,OAAA,GAAuB,EACnB,KAAA;AACJ,EAAM,MAAA;AAAA,IACL,YAAe,GAAA,mDAAA;AAAA,IACf,wBAA2B,GAAA;AAAA,GACxB,GAAA,OAAA;AAEJ,EAAM,MAAA,cAAA,GACL,eAAiD,QAAQ,CAAA,IAAK,SAAS,IAAS,KAAAA,QAAA,GAC7E,QAAS,CAAA,KAAA,CAAM,QACf,GAAA,QAAA;AAEJ,EAAM,MAAA,aAAA,GAAgB,QAAyB,cAAc,CAAA;AAE7D,EAAA,MAAM,WACL,GAAA,wBAAA,IAA4B,wBAAyB,CAAA,aAAA,EAAe,aAAa,CAAI,GAAA,CAAA;AAEtF,EAAA,IAAI,WAAa,EAAA;AAChB,IAAM,MAAA,IAAI,eAAe,YAAY,CAAA;AAAA;AAGtC,EAAM,MAAA,WAAA,GAAc,cAAc,IAAK,CAAA,CAAC,UAAU,oBAAqB,CAAA,KAAA,EAAO,aAAa,CAAC,CAAA;AAE5F,EAAO,OAAA,WAAA;AACR;AA2BO,IAAM,gBAAmB,GAAA,CAC/B,QACA,EAAA,cAAA,EACA,OACuD,KAAA;AACvD,EAAA,MAAM,EAAE,YAAA,EAAc,wBAAyB,EAAA,GAAI,WAAW,EAAC;AAE/D,EAAA,MAAM,QAAQ,cAAe,CAAA,GAAA;AAAA,IAAI,CAAC,aAAA,EAAe,KAChD,KAAA,aAAA,CAAc,UAAU,aAAe,EAAA;AAAA,MACtC,cAAc,OAAQ,CAAA,YAAY,CAAI,GAAA,YAAA,CAAa,KAAK,CAAI,GAAA,YAAA;AAAA,MAC5D,0BAA0B,OAAQ,CAAA,wBAAwB,CACvD,GAAA,wBAAA,CAAyB,KAAK,CAC9B,GAAA;AAAA,KACH;AAAA,GACF;AAEA,EAAM,MAAA,eAAA,GAAkB,kBAAmB,CAAA,QAAA,EAAU,cAAc,CAAA;AAEnE,EAAO,OAAA,EAAE,iBAAiB,KAAM,EAAA;AACjC;AAKa,IAAA,kBAAA,GAAqB,CACjC,QAAA,EACA,yBACI,KAAA;AACJ,EAAM,MAAA,cAAA,GACL,eAAiD,QAAQ,CAAA,IAAK,SAAS,IAAS,KAAAA,QAAA,GAC7E,QAAS,CAAA,KAAA,CAAM,QACf,GAAA,QAAA;AAEJ,EAAM,MAAA,aAAA,GAAgB,QAAyB,cAAc,CAAA;AAE7D,EAAA,MAAM,kBAAkB,aAAc,CAAA,MAAA;AAAA,IACrC,CAAC,KAAU,KAAA,CAAC,wBAAwB,KAAO,EAAA,OAAA,CAAQ,yBAAyB,CAAC;AAAA,GAC9E;AAEA,EAAO,OAAA,eAAA;AACR","file":"chunk-
|
|
1
|
+
{"version":3,"sources":["../../src/lib/utils/getSlot/getSlot.ts"],"names":["ReactFragment"],"mappings":"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","file":"chunk-YO5LJ7ZJ.js","sourcesContent":["import { toArray } from \"@zayne-labs/toolkit-core\";\nimport type { InferProps } from \"@zayne-labs/toolkit-react/utils\";\nimport {\n\ttype AnyFunction,\n\tAssertionError,\n\ttype Prettify,\n\ttype UnknownObject,\n\tisArray,\n\tisFunction,\n} from \"@zayne-labs/toolkit-type-helpers\";\nimport { Fragment as ReactFragment, isValidElement } from \"react\";\n\nexport type FunctionalComponent<TProps extends UnknownObject = never> = React.FunctionComponent<TProps>;\n\nconst isWithSlotSymbol = <TFunction extends AnyFunction>(\n\tcomponent: TFunction\n): component is Record<\"slotSymbol\", unknown> & TFunction => {\n\treturn \"slotSymbol\" in component && Boolean(component.slotSymbol);\n};\n\nconst isWithSlotReference = <TFunction extends AnyFunction>(\n\tcomponent: TFunction\n): component is Record<\"slotReference\", unknown> & TFunction => {\n\treturn \"slotReference\" in component && Boolean(component.slotReference);\n};\n/**\n * @description Checks if a react child (within the children array) matches the provided SlotComponent using multiple matching strategies:\n * 1. Matches by slot symbol property\n * 2. Matches by component name\n */\n\nexport const matchesSlotComponent = (child: React.ReactNode, SlotComponent: FunctionalComponent) => {\n\tif (!isValidElement(child) || !isFunction(child.type)) {\n\t\treturn false;\n\t}\n\n\tconst resolvedChildType = isWithSlotReference(child.type)\n\t\t? (child.type.slotReference as FunctionalComponent)\n\t\t: child.type;\n\n\tconst hasMatchingSlotSymbol =\n\t\tisWithSlotSymbol(resolvedChildType)\n\t\t&& isWithSlotSymbol(SlotComponent)\n\t\t&& resolvedChildType.slotSymbol === SlotComponent.slotSymbol;\n\n\tif (hasMatchingSlotSymbol) {\n\t\treturn true;\n\t}\n\n\tif (child.type.name === SlotComponent.name) {\n\t\treturn true;\n\t}\n\n\treturn false;\n};\n\n/**\n * @description Checks if a react child (within the children array) matches any of the provided SlotComponents.\n */\nexport const matchesAnySlotComponent = (child: React.ReactNode, SlotComponents: FunctionalComponent[]) => {\n\tconst matchesSlot = SlotComponents.some((SlotComponent) => matchesSlotComponent(child, SlotComponent));\n\n\treturn matchesSlot;\n};\n\ntype SlotOptions = {\n\t/**\n\t * @description The error message to throw when multiple slots are found for a given slot component\n\t */\n\terrorMessage?: string;\n\t/**\n\t * @description When true, an AssertionError will be thrown if multiple slots are found for a given slot component\n\t */\n\tthrowOnMultipleSlotMatch?: boolean;\n};\n\n/**\n * @description Counts how many times a given slot component appears in an array of children\n * @internal\n */\nconst calculateSlotOccurrences = (\n\tchildrenArray: React.ReactNode[],\n\tSlotComponent: FunctionalComponent\n) => {\n\tlet count = 0;\n\n\tfor (const child of childrenArray) {\n\t\tif (!matchesSlotComponent(child, SlotComponent)) continue;\n\n\t\tcount += 1;\n\t}\n\n\treturn count;\n};\n\n/**\n * @description Retrieves a single slot element from a collection of React children that matches the provided SlotComponent component.\n *\n * @throws { AssertionError } when throwOnMultipleSlotMatch is true and multiple slots are found\n */\nexport const getSingleSlot = (\n\tchildren: React.ReactNode,\n\tSlotComponent: FunctionalComponent,\n\toptions: SlotOptions = {}\n) => {\n\tconst {\n\t\terrorMessage = \"Only one instance of the SlotComponent is allowed\",\n\t\tthrowOnMultipleSlotMatch = false,\n\t} = options;\n\n\tconst actualChildren =\n\t\tisValidElement<InferProps<typeof ReactFragment>>(children) && children.type === ReactFragment\n\t\t\t? children.props.children\n\t\t\t: children;\n\n\tconst childrenArray = toArray<React.ReactNode>(actualChildren);\n\n\tconst shouldThrow =\n\t\tthrowOnMultipleSlotMatch && calculateSlotOccurrences(childrenArray, SlotComponent) > 1;\n\n\tif (shouldThrow) {\n\t\tthrow new AssertionError(errorMessage);\n\t}\n\n\tconst slotElement = childrenArray.find((child) => matchesSlotComponent(child, SlotComponent));\n\n\treturn slotElement;\n};\n\n// NOTE - You can imitate const type parameter by extending readonly[] | []\n\ntype MultipleSlotsOptions = {\n\t/**\n\t * @description The error message to throw when multiple slots are found for a given slot component\n\t * If a string is provided, the same message will be used for all slot components\n\t * If an array is provided, each string in the array will be used as the errorMessage for the corresponding slot component\n\t */\n\terrorMessage?: string | string[];\n\t/**\n\t * @description When true, an AssertionError will be thrown if multiple slots are found for a given slot component\n\t * If a boolean is provided, the same value will be used for all slot components\n\t * If an array is provided, each boolean in the array will be used as the throwOnMultipleSlotMatch value for the corresponding slot component\n\t */\n\tthrowOnMultipleSlotMatch?: boolean | boolean[];\n};\n\ntype GetMultipleSlotsResult<TSlotComponents extends FunctionalComponent[]> = {\n\tregularChildren: React.ReactNode[];\n\tslots: { [Key in keyof TSlotComponents]: ReturnType<TSlotComponents[Key]> };\n};\n\n/**\n * @description The same as getSingleSlot, but for multiple slot components\n */\nexport const getMultipleSlots = <const TSlotComponents extends FunctionalComponent[]>(\n\tchildren: React.ReactNode,\n\tSlotComponents: TSlotComponents,\n\toptions?: MultipleSlotsOptions\n): Prettify<GetMultipleSlotsResult<TSlotComponents>> => {\n\tconst { errorMessage, throwOnMultipleSlotMatch } = options ?? {};\n\n\tconst slots = SlotComponents.map((SlotComponent, index) =>\n\t\tgetSingleSlot(children, SlotComponent, {\n\t\t\terrorMessage: isArray(errorMessage) ? errorMessage[index] : errorMessage,\n\t\t\tthrowOnMultipleSlotMatch: isArray(throwOnMultipleSlotMatch)\n\t\t\t\t? throwOnMultipleSlotMatch[index]\n\t\t\t\t: throwOnMultipleSlotMatch,\n\t\t})\n\t);\n\n\tconst regularChildren = getRegularChildren(children, SlotComponents);\n\n\treturn { regularChildren, slots } as GetMultipleSlotsResult<TSlotComponents>;\n};\n\n/**\n * @description Returns all children that are not slot elements (i.e., don't match any of the provided slot components)\n */\nexport const getRegularChildren = (\n\tchildren: React.ReactNode,\n\tSlotComponentOrComponents: FunctionalComponent | FunctionalComponent[]\n) => {\n\tconst actualChildren =\n\t\tisValidElement<InferProps<typeof ReactFragment>>(children) && children.type === ReactFragment\n\t\t\t? children.props.children\n\t\t\t: children;\n\n\tconst childrenArray = toArray<React.ReactNode>(actualChildren);\n\n\tconst regularChildren = childrenArray.filter(\n\t\t(child) => !matchesAnySlotComponent(child, toArray(SlotComponentOrComponents))\n\t);\n\n\treturn regularChildren;\n};\n"]}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
import { withSlotNameAndSymbol, getSlotMap } from './chunk-N4274N5K.js';
|
|
2
|
+
import { useErrorBoundaryContext, ErrorBoundary } from './chunk-JC52CA2O.js';
|
|
3
|
+
import { slot_parts_exports } from './chunk-Y5VBSXZS.js';
|
|
4
|
+
import { __export } from './chunk-PZ5AY32C.js';
|
|
5
|
+
import * as React from 'react';
|
|
6
|
+
import { Fragment, Suspense, use, useMemo } from 'react';
|
|
7
|
+
import { isFunction } from '@zayne-labs/toolkit-type-helpers';
|
|
8
|
+
import { createCustomContext } from '@zayne-labs/toolkit-react';
|
|
9
|
+
|
|
10
|
+
var [AwaitContextProvider, useAwaitContextImpl] = createCustomContext({
|
|
11
|
+
hookName: "useAwaitContext",
|
|
12
|
+
name: "AwaitContext",
|
|
13
|
+
providerName: "AwaitInner"
|
|
14
|
+
});
|
|
15
|
+
var useAwaitContext = () => useAwaitContextImpl();
|
|
16
|
+
|
|
17
|
+
// src/components/common/await/await.tsx
|
|
18
|
+
function AwaitRoot(props) {
|
|
19
|
+
const { children, errorFallback, fallback, wrapperVariant = "all", ...restOfProps } = props;
|
|
20
|
+
const withErrorBoundary = wrapperVariant === "all" || wrapperVariant === "only-errorBoundary";
|
|
21
|
+
const withSuspense = wrapperVariant === "all" || wrapperVariant === "only-suspense";
|
|
22
|
+
const WithErrorBoundary = withErrorBoundary ? ErrorBoundary : Fragment;
|
|
23
|
+
const WithSuspense = withSuspense ? Suspense : Fragment;
|
|
24
|
+
const slots = !isFunction(children) ? getSlotMap(children) : { default: children };
|
|
25
|
+
const selectedPendingFallback = slots.pending ?? fallback;
|
|
26
|
+
const selectedErrorFallback = slots.error ?? errorFallback;
|
|
27
|
+
return /* @__PURE__ */ React.createElement(WithErrorBoundary, { ...Boolean(selectedErrorFallback) && { fallback: selectedErrorFallback } }, /* @__PURE__ */ React.createElement(WithSuspense, { ...Boolean(selectedPendingFallback) && { fallback: selectedPendingFallback } }, /* @__PURE__ */ React.createElement(AwaitRootInner, { ...restOfProps }, slots.default)));
|
|
28
|
+
}
|
|
29
|
+
function AwaitRootInner(props) {
|
|
30
|
+
const { asChild, children, promise } = props;
|
|
31
|
+
const result = use(promise);
|
|
32
|
+
const resolvedChildren = isFunction(children) ? children(result) : children;
|
|
33
|
+
const Component = asChild ? slot_parts_exports.Root : Fragment;
|
|
34
|
+
const contextValue = useMemo(() => ({ promise, result }), [promise, result]);
|
|
35
|
+
return /* @__PURE__ */ React.createElement(AwaitContextProvider, { value: contextValue }, /* @__PURE__ */ React.createElement(Component, { ...asChild && contextValue }, resolvedChildren));
|
|
36
|
+
}
|
|
37
|
+
function AwaitSuccess(props) {
|
|
38
|
+
if (isFunction(props.children)) {
|
|
39
|
+
const { result } = useAwaitContext();
|
|
40
|
+
return props.children(result);
|
|
41
|
+
}
|
|
42
|
+
return props.children;
|
|
43
|
+
}
|
|
44
|
+
Object.assign(AwaitSuccess, withSlotNameAndSymbol("default"));
|
|
45
|
+
var AwaitPending = withSlotNameAndSymbol("pending");
|
|
46
|
+
var AwaitError = withSlotNameAndSymbol(
|
|
47
|
+
"error",
|
|
48
|
+
(props) => {
|
|
49
|
+
const { asChild, children } = props;
|
|
50
|
+
const errorBoundaryContext = useErrorBoundaryContext();
|
|
51
|
+
const Component = asChild ? slot_parts_exports.Root : Fragment;
|
|
52
|
+
const resolvedChildren = isFunction(children) ? children(errorBoundaryContext) : children;
|
|
53
|
+
return /* @__PURE__ */ React.createElement(Component, { ...asChild && errorBoundaryContext }, resolvedChildren);
|
|
54
|
+
}
|
|
55
|
+
);
|
|
56
|
+
|
|
57
|
+
// src/components/common/await/await-parts.ts
|
|
58
|
+
var await_parts_exports = {};
|
|
59
|
+
__export(await_parts_exports, {
|
|
60
|
+
Error: () => AwaitError,
|
|
61
|
+
Pending: () => AwaitPending,
|
|
62
|
+
Root: () => AwaitRoot,
|
|
63
|
+
Success: () => AwaitSuccess
|
|
64
|
+
});
|
|
65
|
+
|
|
66
|
+
export { AwaitError, AwaitPending, AwaitRoot, AwaitSuccess, await_parts_exports, useAwaitContext };
|
|
67
|
+
//# sourceMappingURL=chunk-Z6JJE4G6.js.map
|
|
68
|
+
//# sourceMappingURL=chunk-Z6JJE4G6.js.map
|