@sprawlify/react 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/index.cjs +0 -0
- package/dist/components/index.d.cts +1 -0
- package/dist/components/index.d.mts +1 -0
- package/dist/components/index.mjs +1 -0
- package/dist/index-BbV54I7I.d.mts +15 -0
- package/dist/index-D-QxCLG0.d.cts +15 -0
- package/dist/index.cjs +160 -6
- package/dist/index.d.cts +57 -3
- package/dist/index.d.mts +57 -3
- package/dist/index.mjs +156 -6
- package/dist/utils/index.cjs +11 -0
- package/dist/utils/index.d.cts +2 -0
- package/dist/utils/index.d.mts +2 -0
- package/dist/utils/index.mjs +3 -0
- package/dist/utils-CVmRc1p7.mjs +31 -0
- package/dist/utils-DQoI5AQQ.cjs +37 -0
- package/package.json +2 -2
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { };
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { mergeProps as mergeProps$1 } from "@sprawlify/primitives/core";
|
|
2
|
+
|
|
3
|
+
//#region src/utils/create-context.d.ts
|
|
4
|
+
interface CreateContextOptions<T> {
|
|
5
|
+
strict?: boolean | undefined;
|
|
6
|
+
hookName?: string | undefined;
|
|
7
|
+
providerName?: string | undefined;
|
|
8
|
+
errorMessage?: string | undefined;
|
|
9
|
+
name?: string | undefined;
|
|
10
|
+
defaultValue?: T | undefined;
|
|
11
|
+
}
|
|
12
|
+
type CreateContextReturn<T> = [React.Provider<T>, () => T, React.Context<T>];
|
|
13
|
+
declare function createContext<T>(options?: CreateContextOptions<T>): CreateContextReturn<T>;
|
|
14
|
+
//#endregion
|
|
15
|
+
export { createContext as n, mergeProps$1 as t };
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { mergeProps } from "@sprawlify/primitives/core";
|
|
2
|
+
|
|
3
|
+
//#region src/utils/create-context.d.ts
|
|
4
|
+
interface CreateContextOptions<T> {
|
|
5
|
+
strict?: boolean | undefined;
|
|
6
|
+
hookName?: string | undefined;
|
|
7
|
+
providerName?: string | undefined;
|
|
8
|
+
errorMessage?: string | undefined;
|
|
9
|
+
name?: string | undefined;
|
|
10
|
+
defaultValue?: T | undefined;
|
|
11
|
+
}
|
|
12
|
+
type CreateContextReturn<T> = [React.Provider<T>, () => T, React.Context<T>];
|
|
13
|
+
declare function createContext<T>(options?: CreateContextOptions<T>): CreateContextReturn<T>;
|
|
14
|
+
//#endregion
|
|
15
|
+
export { createContext as n, mergeProps as t };
|
package/dist/index.cjs
CHANGED
|
@@ -25,6 +25,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
25
25
|
}) : target, mod));
|
|
26
26
|
|
|
27
27
|
//#endregion
|
|
28
|
+
const require_utils = require('./utils-DQoI5AQQ.cjs');
|
|
28
29
|
let __sprawlify_primitives_core = require("@sprawlify/primitives/core");
|
|
29
30
|
let __sprawlify_primitives_utils = require("@sprawlify/primitives/utils");
|
|
30
31
|
let react = require("react");
|
|
@@ -32,6 +33,8 @@ react = __toESM(react);
|
|
|
32
33
|
let react_dom = require("react-dom");
|
|
33
34
|
let __sprawlify_primitives_types = require("@sprawlify/primitives/types");
|
|
34
35
|
let react_jsx_runtime = require("react/jsx-runtime");
|
|
36
|
+
let __sprawlify_primitives_dom_query = require("@sprawlify/primitives/dom-query");
|
|
37
|
+
let __sprawlify_primitives_i18n_utils = require("@sprawlify/primitives/i18n-utils");
|
|
35
38
|
|
|
36
39
|
//#region src/core/use-layout-effect.ts
|
|
37
40
|
const useSafeLayoutEffect = typeof globalThis.document !== "undefined" ? react.useLayoutEffect : react.useEffect;
|
|
@@ -373,12 +376,163 @@ const Portal = (props) => {
|
|
|
373
376
|
};
|
|
374
377
|
|
|
375
378
|
//#endregion
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
379
|
+
//#region src/utils/run-if-fn.ts
|
|
380
|
+
const isFunction = (value) => typeof value === "function";
|
|
381
|
+
const runIfFn = (valueOrFn, ...args) => isFunction(valueOrFn) ? valueOrFn(...args) : valueOrFn;
|
|
382
|
+
|
|
383
|
+
//#endregion
|
|
384
|
+
//#region src/providers/environment/use-environment-context.ts
|
|
385
|
+
const [EnvironmentContextProvider, useEnvironmentContext] = require_utils.createContext({
|
|
386
|
+
name: "EnvironmentContext",
|
|
387
|
+
hookName: "useEnvironmentContext",
|
|
388
|
+
providerName: "<EnvironmentProvider />",
|
|
389
|
+
strict: false,
|
|
390
|
+
defaultValue: {
|
|
391
|
+
getRootNode: () => document,
|
|
392
|
+
getDocument: () => document,
|
|
393
|
+
getWindow: () => window
|
|
394
|
+
}
|
|
382
395
|
});
|
|
396
|
+
|
|
397
|
+
//#endregion
|
|
398
|
+
//#region src/providers/environment/environment-provider.tsx
|
|
399
|
+
const EnvironmentProvider = (props) => {
|
|
400
|
+
const { value, children } = props;
|
|
401
|
+
const [spanRef, setSpanRef] = (0, react.useState)();
|
|
402
|
+
const getRootNode = (0, react.useMemo)(() => {
|
|
403
|
+
return () => runIfFn(value) ?? spanRef?.getRootNode() ?? document;
|
|
404
|
+
}, [value, spanRef]);
|
|
405
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(EnvironmentContextProvider, {
|
|
406
|
+
value: (0, react.useMemo)(() => ({
|
|
407
|
+
getRootNode,
|
|
408
|
+
getWindow: () => (0, __sprawlify_primitives_dom_query.getWindow)(getRootNode()),
|
|
409
|
+
getDocument: () => (0, __sprawlify_primitives_dom_query.getDocument)(getRootNode())
|
|
410
|
+
}), [getRootNode]),
|
|
411
|
+
children: [children, !value && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
|
|
412
|
+
hidden: true,
|
|
413
|
+
ref: setSpanRef
|
|
414
|
+
})]
|
|
415
|
+
});
|
|
416
|
+
};
|
|
417
|
+
|
|
418
|
+
//#endregion
|
|
419
|
+
//#region src/providers/locale/use-locale-context.ts
|
|
420
|
+
const [LocaleContextProvider, useLocaleContext] = require_utils.createContext({
|
|
421
|
+
name: "LocaleContext",
|
|
422
|
+
hookName: "useLocaleContext",
|
|
423
|
+
providerName: "<LocaleProvider />",
|
|
424
|
+
strict: false,
|
|
425
|
+
defaultValue: {
|
|
426
|
+
dir: "ltr",
|
|
427
|
+
locale: "en-US"
|
|
428
|
+
}
|
|
429
|
+
});
|
|
430
|
+
|
|
431
|
+
//#endregion
|
|
432
|
+
//#region src/providers/locale/locale-provider.tsx
|
|
433
|
+
const LocaleProvider = (props) => {
|
|
434
|
+
const { children, locale } = props;
|
|
435
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(LocaleContextProvider, {
|
|
436
|
+
value: {
|
|
437
|
+
locale,
|
|
438
|
+
dir: (0, __sprawlify_primitives_i18n_utils.isRTL)(locale) ? "rtl" : "ltr"
|
|
439
|
+
},
|
|
440
|
+
children
|
|
441
|
+
});
|
|
442
|
+
};
|
|
443
|
+
|
|
444
|
+
//#endregion
|
|
445
|
+
//#region src/providers/locale/use-collator.ts
|
|
446
|
+
function useCollator(props = {}) {
|
|
447
|
+
const env = useLocaleContext();
|
|
448
|
+
const locale = props.locale ?? env.locale;
|
|
449
|
+
return (0, react.useMemo)(() => {
|
|
450
|
+
const { locale: _, ...options } = props;
|
|
451
|
+
return (0, __sprawlify_primitives_i18n_utils.createCollator)(locale, options);
|
|
452
|
+
}, [locale, props]);
|
|
453
|
+
}
|
|
454
|
+
|
|
455
|
+
//#endregion
|
|
456
|
+
//#region src/providers/locale/use-filter.ts
|
|
457
|
+
function useFilter(props) {
|
|
458
|
+
const env = useLocaleContext();
|
|
459
|
+
const locale = props.locale ?? env.locale;
|
|
460
|
+
return (0, react.useMemo)(() => (0, __sprawlify_primitives_i18n_utils.createFilter)({
|
|
461
|
+
...props,
|
|
462
|
+
locale
|
|
463
|
+
}), [locale, props]);
|
|
464
|
+
}
|
|
465
|
+
|
|
466
|
+
//#endregion
|
|
467
|
+
//#region src/utils/compose-refs.ts
|
|
468
|
+
function composeRefs(...refs) {
|
|
469
|
+
return (node) => {
|
|
470
|
+
const cleanUps = [];
|
|
471
|
+
for (const ref of refs) if (typeof ref === "function") {
|
|
472
|
+
const cb = ref(node);
|
|
473
|
+
if (typeof cb === "function") cleanUps.push(cb);
|
|
474
|
+
} else if (ref) ref.current = node;
|
|
475
|
+
if (cleanUps.length) return () => {
|
|
476
|
+
for (const cleanUp of cleanUps) cleanUp();
|
|
477
|
+
};
|
|
478
|
+
};
|
|
479
|
+
}
|
|
480
|
+
|
|
481
|
+
//#endregion
|
|
482
|
+
//#region src/components/factory.ts
|
|
483
|
+
function getRef(element) {
|
|
484
|
+
let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get;
|
|
485
|
+
let mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
|
|
486
|
+
if (mayWarn) return element.ref;
|
|
487
|
+
getter = Object.getOwnPropertyDescriptor(element, "ref")?.get;
|
|
488
|
+
mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
|
|
489
|
+
if (mayWarn) return element.props.ref;
|
|
490
|
+
return element.props.ref || element.ref;
|
|
491
|
+
}
|
|
492
|
+
const withAsChild = (Component) => {
|
|
493
|
+
const Comp = (0, react.memo)((0, react.forwardRef)((props, ref) => {
|
|
494
|
+
const { asChild, children, ...restProps } = props;
|
|
495
|
+
if (!asChild) return (0, react.createElement)(Component, {
|
|
496
|
+
...restProps,
|
|
497
|
+
ref
|
|
498
|
+
}, children);
|
|
499
|
+
if (!(0, react.isValidElement)(children)) return null;
|
|
500
|
+
const onlyChild = react.Children.only(children);
|
|
501
|
+
const childRef = getRef(onlyChild);
|
|
502
|
+
return (0, react.cloneElement)(onlyChild, {
|
|
503
|
+
...(0, __sprawlify_primitives_core.mergeProps)(restProps, onlyChild.props),
|
|
504
|
+
ref: ref ? composeRefs(ref, childRef) : childRef
|
|
505
|
+
});
|
|
506
|
+
}));
|
|
507
|
+
Comp.displayName = typeof Component === "string" ? Component : Component.displayName || Component.name;
|
|
508
|
+
return Comp;
|
|
509
|
+
};
|
|
510
|
+
const jsxFactory = () => {
|
|
511
|
+
const cache = /* @__PURE__ */ new Map();
|
|
512
|
+
return new Proxy(withAsChild, {
|
|
513
|
+
apply(_target, _thisArg, argArray) {
|
|
514
|
+
return withAsChild(argArray[0]);
|
|
515
|
+
},
|
|
516
|
+
get(_, element) {
|
|
517
|
+
const asElement = element;
|
|
518
|
+
if (!cache.has(asElement)) cache.set(asElement, withAsChild(asElement));
|
|
519
|
+
return cache.get(asElement);
|
|
520
|
+
}
|
|
521
|
+
});
|
|
522
|
+
};
|
|
523
|
+
const sprawlify = jsxFactory();
|
|
524
|
+
|
|
525
|
+
//#endregion
|
|
526
|
+
exports.EnvironmentProvider = EnvironmentProvider;
|
|
527
|
+
exports.LocaleProvider = LocaleProvider;
|
|
528
|
+
exports.Portal = Portal;
|
|
529
|
+
exports.__toESM = __toESM;
|
|
530
|
+
exports.createContext = require_utils.createContext;
|
|
531
|
+
exports.jsxFactory = jsxFactory;
|
|
383
532
|
exports.normalizeProps = normalizeProps;
|
|
533
|
+
exports.sprawlify = sprawlify;
|
|
534
|
+
exports.useCollator = useCollator;
|
|
535
|
+
exports.useEnvironmentContext = useEnvironmentContext;
|
|
536
|
+
exports.useFilter = useFilter;
|
|
537
|
+
exports.useLocaleContext = useLocaleContext;
|
|
384
538
|
exports.useMachine = useMachine;
|
package/dist/index.d.cts
CHANGED
|
@@ -1,6 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { n as createContext } from "./index-D-QxCLG0.cjs";
|
|
2
|
+
import { Machine, MachineSchema, Service } from "@sprawlify/primitives/core";
|
|
2
3
|
import * as _sprawlify_primitives_types0 from "@sprawlify/primitives/types";
|
|
3
|
-
import { CSSProperties, HTMLAttributes, JSX, PropsWithChildren, RefObject } from "react";
|
|
4
|
+
import React, { CSSProperties, ComponentPropsWithoutRef, HTMLAttributes, JSX, PropsWithChildren, ReactNode, RefObject } from "react";
|
|
5
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
6
|
+
import { FilterOptions, FilterReturn, Locale } from "@sprawlify/primitives/i18n-utils";
|
|
4
7
|
|
|
5
8
|
//#region src/core/machine.d.ts
|
|
6
9
|
declare function useMachine<T extends MachineSchema>(machine: Machine<T>, userProps?: Partial<T["props"]>): Service<T>;
|
|
@@ -22,4 +25,55 @@ interface PortalProps {
|
|
|
22
25
|
}
|
|
23
26
|
declare const Portal: (props: PropsWithChildren<PortalProps>) => JSX.Element;
|
|
24
27
|
//#endregion
|
|
25
|
-
|
|
28
|
+
//#region src/providers/environment/use-environment-context.d.ts
|
|
29
|
+
type RootNode = ShadowRoot | Document | Node;
|
|
30
|
+
interface UseEnvironmentContext {
|
|
31
|
+
getRootNode(): RootNode;
|
|
32
|
+
getDocument(): Document;
|
|
33
|
+
getWindow(): Window & typeof globalThis;
|
|
34
|
+
}
|
|
35
|
+
//#endregion
|
|
36
|
+
//#region src/providers/environment/environment-provider.d.ts
|
|
37
|
+
interface EnvironmentProviderProps {
|
|
38
|
+
children?: ReactNode | undefined;
|
|
39
|
+
value?: RootNode | (() => RootNode) | undefined;
|
|
40
|
+
}
|
|
41
|
+
declare const EnvironmentProvider: (props: EnvironmentProviderProps) => react_jsx_runtime0.JSX.Element;
|
|
42
|
+
//#endregion
|
|
43
|
+
//#region src/providers/locale/locale-provider.d.ts
|
|
44
|
+
interface LocaleProviderProps extends PropsWithChildren {
|
|
45
|
+
locale: string;
|
|
46
|
+
}
|
|
47
|
+
declare const LocaleProvider: (props: LocaleProviderProps) => react_jsx_runtime0.JSX.Element;
|
|
48
|
+
//#endregion
|
|
49
|
+
//#region src/providers/locale/use-collator.d.ts
|
|
50
|
+
interface UseCollatorProps extends Intl.CollatorOptions {
|
|
51
|
+
locale?: string;
|
|
52
|
+
}
|
|
53
|
+
declare function useCollator(props?: UseCollatorProps): Intl.Collator;
|
|
54
|
+
//#endregion
|
|
55
|
+
//#region src/providers/locale/use-filter.d.ts
|
|
56
|
+
interface UseFilterProps extends FilterOptions {}
|
|
57
|
+
declare function useFilter(props: UseFilterProps): UseFilterReturn;
|
|
58
|
+
interface UseFilterReturn extends FilterReturn {}
|
|
59
|
+
//#endregion
|
|
60
|
+
//#region src/providers/locale/use-locale-context.d.ts
|
|
61
|
+
interface UseLocaleContext extends Locale {}
|
|
62
|
+
//#endregion
|
|
63
|
+
//#region src/types.d.ts
|
|
64
|
+
type Assign<T, U> = Omit<T, keyof U> & U;
|
|
65
|
+
type Optional<T, K$1 extends keyof T> = Pick<Partial<T>, K$1> & Omit<T, K$1>;
|
|
66
|
+
//#endregion
|
|
67
|
+
//#region src/components/factory.d.ts
|
|
68
|
+
interface PolymorphicProps {
|
|
69
|
+
asChild?: boolean | undefined;
|
|
70
|
+
}
|
|
71
|
+
type JsxElements = { [E in keyof JSX.IntrinsicElements]: SprawlifyForwardRefComponent<E> };
|
|
72
|
+
type SprawlifyForwardRefComponent<E$1 extends React.ElementType> = React.ForwardRefExoticComponent<SprawlifyPropsWithRef<E$1>>;
|
|
73
|
+
type SprawlifyPropsWithRef<E$1 extends React.ElementType> = React.ComponentPropsWithRef<E$1> & PolymorphicProps;
|
|
74
|
+
type HTMLProps<T extends keyof JSX.IntrinsicElements> = ComponentPropsWithoutRef<T>;
|
|
75
|
+
type HTMLSprawlifyProps<T extends keyof JSX.IntrinsicElements> = HTMLProps<T> & PolymorphicProps;
|
|
76
|
+
declare const jsxFactory: () => JsxElements;
|
|
77
|
+
declare const sprawlify: JsxElements;
|
|
78
|
+
//#endregion
|
|
79
|
+
export { type Assign, EnvironmentProvider, EnvironmentProviderProps, HTMLProps, HTMLSprawlifyProps, LocaleProvider, LocaleProviderProps, type Optional, PolymorphicProps, Portal, PortalProps, PropTypes, RootNode, UseCollatorProps, UseEnvironmentContext, UseFilterProps, UseFilterReturn, UseLocaleContext, createContext, jsxFactory, normalizeProps, sprawlify, useCollator, useEnvironmentContext, useFilter, useLocaleContext, useMachine };
|
package/dist/index.d.mts
CHANGED
|
@@ -1,6 +1,9 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { n as createContext } from "./index-BbV54I7I.mjs";
|
|
2
|
+
import { Machine, MachineSchema, Service } from "@sprawlify/primitives/core";
|
|
3
|
+
import React, { CSSProperties, ComponentPropsWithoutRef, HTMLAttributes, JSX, PropsWithChildren, ReactNode, RefObject } from "react";
|
|
3
4
|
import * as _sprawlify_primitives_types0 from "@sprawlify/primitives/types";
|
|
5
|
+
import * as react_jsx_runtime0 from "react/jsx-runtime";
|
|
6
|
+
import { FilterOptions, FilterReturn, Locale } from "@sprawlify/primitives/i18n-utils";
|
|
4
7
|
|
|
5
8
|
//#region src/core/machine.d.ts
|
|
6
9
|
declare function useMachine<T extends MachineSchema>(machine: Machine<T>, userProps?: Partial<T["props"]>): Service<T>;
|
|
@@ -22,4 +25,55 @@ interface PortalProps {
|
|
|
22
25
|
}
|
|
23
26
|
declare const Portal: (props: PropsWithChildren<PortalProps>) => JSX.Element;
|
|
24
27
|
//#endregion
|
|
25
|
-
|
|
28
|
+
//#region src/providers/environment/use-environment-context.d.ts
|
|
29
|
+
type RootNode = ShadowRoot | Document | Node;
|
|
30
|
+
interface UseEnvironmentContext {
|
|
31
|
+
getRootNode(): RootNode;
|
|
32
|
+
getDocument(): Document;
|
|
33
|
+
getWindow(): Window & typeof globalThis;
|
|
34
|
+
}
|
|
35
|
+
//#endregion
|
|
36
|
+
//#region src/providers/environment/environment-provider.d.ts
|
|
37
|
+
interface EnvironmentProviderProps {
|
|
38
|
+
children?: ReactNode | undefined;
|
|
39
|
+
value?: RootNode | (() => RootNode) | undefined;
|
|
40
|
+
}
|
|
41
|
+
declare const EnvironmentProvider: (props: EnvironmentProviderProps) => react_jsx_runtime0.JSX.Element;
|
|
42
|
+
//#endregion
|
|
43
|
+
//#region src/providers/locale/locale-provider.d.ts
|
|
44
|
+
interface LocaleProviderProps extends PropsWithChildren {
|
|
45
|
+
locale: string;
|
|
46
|
+
}
|
|
47
|
+
declare const LocaleProvider: (props: LocaleProviderProps) => react_jsx_runtime0.JSX.Element;
|
|
48
|
+
//#endregion
|
|
49
|
+
//#region src/providers/locale/use-collator.d.ts
|
|
50
|
+
interface UseCollatorProps extends Intl.CollatorOptions {
|
|
51
|
+
locale?: string;
|
|
52
|
+
}
|
|
53
|
+
declare function useCollator(props?: UseCollatorProps): Intl.Collator;
|
|
54
|
+
//#endregion
|
|
55
|
+
//#region src/providers/locale/use-filter.d.ts
|
|
56
|
+
interface UseFilterProps extends FilterOptions {}
|
|
57
|
+
declare function useFilter(props: UseFilterProps): UseFilterReturn;
|
|
58
|
+
interface UseFilterReturn extends FilterReturn {}
|
|
59
|
+
//#endregion
|
|
60
|
+
//#region src/providers/locale/use-locale-context.d.ts
|
|
61
|
+
interface UseLocaleContext extends Locale {}
|
|
62
|
+
//#endregion
|
|
63
|
+
//#region src/types.d.ts
|
|
64
|
+
type Assign<T, U> = Omit<T, keyof U> & U;
|
|
65
|
+
type Optional<T, K$1 extends keyof T> = Pick<Partial<T>, K$1> & Omit<T, K$1>;
|
|
66
|
+
//#endregion
|
|
67
|
+
//#region src/components/factory.d.ts
|
|
68
|
+
interface PolymorphicProps {
|
|
69
|
+
asChild?: boolean | undefined;
|
|
70
|
+
}
|
|
71
|
+
type JsxElements = { [E in keyof JSX.IntrinsicElements]: SprawlifyForwardRefComponent<E> };
|
|
72
|
+
type SprawlifyForwardRefComponent<E$1 extends React.ElementType> = React.ForwardRefExoticComponent<SprawlifyPropsWithRef<E$1>>;
|
|
73
|
+
type SprawlifyPropsWithRef<E$1 extends React.ElementType> = React.ComponentPropsWithRef<E$1> & PolymorphicProps;
|
|
74
|
+
type HTMLProps<T extends keyof JSX.IntrinsicElements> = ComponentPropsWithoutRef<T>;
|
|
75
|
+
type HTMLSprawlifyProps<T extends keyof JSX.IntrinsicElements> = HTMLProps<T> & PolymorphicProps;
|
|
76
|
+
declare const jsxFactory: () => JsxElements;
|
|
77
|
+
declare const sprawlify: JsxElements;
|
|
78
|
+
//#endregion
|
|
79
|
+
export { type Assign, EnvironmentProvider, type EnvironmentProviderProps, HTMLProps, HTMLSprawlifyProps, LocaleProvider, type LocaleProviderProps, type Optional, PolymorphicProps, Portal, PortalProps, PropTypes, type RootNode, type UseCollatorProps, type UseEnvironmentContext, type UseFilterProps, type UseFilterReturn, type UseLocaleContext, createContext, jsxFactory, normalizeProps, sprawlify, useCollator, useEnvironmentContext, useFilter, useLocaleContext, useMachine };
|
package/dist/index.mjs
CHANGED
|
@@ -1,10 +1,13 @@
|
|
|
1
|
+
import { n as createContext } from "./utils-CVmRc1p7.mjs";
|
|
1
2
|
import { INIT_STATE, MachineStatus, createScope, mergeProps } from "@sprawlify/primitives/core";
|
|
2
3
|
import { compact, ensure, identity, isFunction, isString, toArray, warn } from "@sprawlify/primitives/utils";
|
|
3
|
-
import * as React from "react";
|
|
4
|
-
import { useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
|
|
4
|
+
import * as React$1 from "react";
|
|
5
|
+
import { Children, cloneElement, createElement, forwardRef, isValidElement, memo, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
|
|
5
6
|
import { createPortal, flushSync } from "react-dom";
|
|
6
7
|
import { createNormalizer } from "@sprawlify/primitives/types";
|
|
7
|
-
import { jsx } from "react/jsx-runtime";
|
|
8
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
9
|
+
import { getDocument, getWindow } from "@sprawlify/primitives/dom-query";
|
|
10
|
+
import { createCollator, createFilter, isRTL } from "@sprawlify/primitives/i18n-utils";
|
|
8
11
|
|
|
9
12
|
//#region src/core/use-layout-effect.ts
|
|
10
13
|
const useSafeLayoutEffect = typeof globalThis.document !== "undefined" ? useLayoutEffect : useEffect;
|
|
@@ -339,11 +342,158 @@ const normalizeProps = createNormalizer((v) => v);
|
|
|
339
342
|
//#region src/core/portal.tsx
|
|
340
343
|
const Portal = (props) => {
|
|
341
344
|
const { children, container, disabled, getRootNode } = props;
|
|
342
|
-
if (typeof window === "undefined" || disabled) return /* @__PURE__ */ jsx(React.Fragment, { children });
|
|
345
|
+
if (typeof window === "undefined" || disabled) return /* @__PURE__ */ jsx(React$1.Fragment, { children });
|
|
343
346
|
const doc = getRootNode?.().ownerDocument ?? document;
|
|
344
347
|
const mountNode = container?.current ?? doc.body;
|
|
345
|
-
return /* @__PURE__ */ jsx(React.Fragment, { children: React.Children.map(children, (child) => createPortal(child, mountNode)) });
|
|
348
|
+
return /* @__PURE__ */ jsx(React$1.Fragment, { children: React$1.Children.map(children, (child) => createPortal(child, mountNode)) });
|
|
346
349
|
};
|
|
347
350
|
|
|
348
351
|
//#endregion
|
|
349
|
-
|
|
352
|
+
//#region src/utils/run-if-fn.ts
|
|
353
|
+
const isFunction$1 = (value) => typeof value === "function";
|
|
354
|
+
const runIfFn = (valueOrFn, ...args) => isFunction$1(valueOrFn) ? valueOrFn(...args) : valueOrFn;
|
|
355
|
+
|
|
356
|
+
//#endregion
|
|
357
|
+
//#region src/providers/environment/use-environment-context.ts
|
|
358
|
+
const [EnvironmentContextProvider, useEnvironmentContext] = createContext({
|
|
359
|
+
name: "EnvironmentContext",
|
|
360
|
+
hookName: "useEnvironmentContext",
|
|
361
|
+
providerName: "<EnvironmentProvider />",
|
|
362
|
+
strict: false,
|
|
363
|
+
defaultValue: {
|
|
364
|
+
getRootNode: () => document,
|
|
365
|
+
getDocument: () => document,
|
|
366
|
+
getWindow: () => window
|
|
367
|
+
}
|
|
368
|
+
});
|
|
369
|
+
|
|
370
|
+
//#endregion
|
|
371
|
+
//#region src/providers/environment/environment-provider.tsx
|
|
372
|
+
const EnvironmentProvider = (props) => {
|
|
373
|
+
const { value, children } = props;
|
|
374
|
+
const [spanRef, setSpanRef] = useState();
|
|
375
|
+
const getRootNode = useMemo(() => {
|
|
376
|
+
return () => runIfFn(value) ?? spanRef?.getRootNode() ?? document;
|
|
377
|
+
}, [value, spanRef]);
|
|
378
|
+
return /* @__PURE__ */ jsxs(EnvironmentContextProvider, {
|
|
379
|
+
value: useMemo(() => ({
|
|
380
|
+
getRootNode,
|
|
381
|
+
getWindow: () => getWindow(getRootNode()),
|
|
382
|
+
getDocument: () => getDocument(getRootNode())
|
|
383
|
+
}), [getRootNode]),
|
|
384
|
+
children: [children, !value && /* @__PURE__ */ jsx("span", {
|
|
385
|
+
hidden: true,
|
|
386
|
+
ref: setSpanRef
|
|
387
|
+
})]
|
|
388
|
+
});
|
|
389
|
+
};
|
|
390
|
+
|
|
391
|
+
//#endregion
|
|
392
|
+
//#region src/providers/locale/use-locale-context.ts
|
|
393
|
+
const [LocaleContextProvider, useLocaleContext] = createContext({
|
|
394
|
+
name: "LocaleContext",
|
|
395
|
+
hookName: "useLocaleContext",
|
|
396
|
+
providerName: "<LocaleProvider />",
|
|
397
|
+
strict: false,
|
|
398
|
+
defaultValue: {
|
|
399
|
+
dir: "ltr",
|
|
400
|
+
locale: "en-US"
|
|
401
|
+
}
|
|
402
|
+
});
|
|
403
|
+
|
|
404
|
+
//#endregion
|
|
405
|
+
//#region src/providers/locale/locale-provider.tsx
|
|
406
|
+
const LocaleProvider = (props) => {
|
|
407
|
+
const { children, locale } = props;
|
|
408
|
+
return /* @__PURE__ */ jsx(LocaleContextProvider, {
|
|
409
|
+
value: {
|
|
410
|
+
locale,
|
|
411
|
+
dir: isRTL(locale) ? "rtl" : "ltr"
|
|
412
|
+
},
|
|
413
|
+
children
|
|
414
|
+
});
|
|
415
|
+
};
|
|
416
|
+
|
|
417
|
+
//#endregion
|
|
418
|
+
//#region src/providers/locale/use-collator.ts
|
|
419
|
+
function useCollator(props = {}) {
|
|
420
|
+
const env = useLocaleContext();
|
|
421
|
+
const locale = props.locale ?? env.locale;
|
|
422
|
+
return useMemo(() => {
|
|
423
|
+
const { locale: _, ...options } = props;
|
|
424
|
+
return createCollator(locale, options);
|
|
425
|
+
}, [locale, props]);
|
|
426
|
+
}
|
|
427
|
+
|
|
428
|
+
//#endregion
|
|
429
|
+
//#region src/providers/locale/use-filter.ts
|
|
430
|
+
function useFilter(props) {
|
|
431
|
+
const env = useLocaleContext();
|
|
432
|
+
const locale = props.locale ?? env.locale;
|
|
433
|
+
return useMemo(() => createFilter({
|
|
434
|
+
...props,
|
|
435
|
+
locale
|
|
436
|
+
}), [locale, props]);
|
|
437
|
+
}
|
|
438
|
+
|
|
439
|
+
//#endregion
|
|
440
|
+
//#region src/utils/compose-refs.ts
|
|
441
|
+
function composeRefs(...refs) {
|
|
442
|
+
return (node) => {
|
|
443
|
+
const cleanUps = [];
|
|
444
|
+
for (const ref of refs) if (typeof ref === "function") {
|
|
445
|
+
const cb = ref(node);
|
|
446
|
+
if (typeof cb === "function") cleanUps.push(cb);
|
|
447
|
+
} else if (ref) ref.current = node;
|
|
448
|
+
if (cleanUps.length) return () => {
|
|
449
|
+
for (const cleanUp of cleanUps) cleanUp();
|
|
450
|
+
};
|
|
451
|
+
};
|
|
452
|
+
}
|
|
453
|
+
|
|
454
|
+
//#endregion
|
|
455
|
+
//#region src/components/factory.ts
|
|
456
|
+
function getRef(element) {
|
|
457
|
+
let getter = Object.getOwnPropertyDescriptor(element.props, "ref")?.get;
|
|
458
|
+
let mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
|
|
459
|
+
if (mayWarn) return element.ref;
|
|
460
|
+
getter = Object.getOwnPropertyDescriptor(element, "ref")?.get;
|
|
461
|
+
mayWarn = getter && "isReactWarning" in getter && getter.isReactWarning;
|
|
462
|
+
if (mayWarn) return element.props.ref;
|
|
463
|
+
return element.props.ref || element.ref;
|
|
464
|
+
}
|
|
465
|
+
const withAsChild = (Component) => {
|
|
466
|
+
const Comp = memo(forwardRef((props, ref) => {
|
|
467
|
+
const { asChild, children, ...restProps } = props;
|
|
468
|
+
if (!asChild) return createElement(Component, {
|
|
469
|
+
...restProps,
|
|
470
|
+
ref
|
|
471
|
+
}, children);
|
|
472
|
+
if (!isValidElement(children)) return null;
|
|
473
|
+
const onlyChild = Children.only(children);
|
|
474
|
+
const childRef = getRef(onlyChild);
|
|
475
|
+
return cloneElement(onlyChild, {
|
|
476
|
+
...mergeProps(restProps, onlyChild.props),
|
|
477
|
+
ref: ref ? composeRefs(ref, childRef) : childRef
|
|
478
|
+
});
|
|
479
|
+
}));
|
|
480
|
+
Comp.displayName = typeof Component === "string" ? Component : Component.displayName || Component.name;
|
|
481
|
+
return Comp;
|
|
482
|
+
};
|
|
483
|
+
const jsxFactory = () => {
|
|
484
|
+
const cache = /* @__PURE__ */ new Map();
|
|
485
|
+
return new Proxy(withAsChild, {
|
|
486
|
+
apply(_target, _thisArg, argArray) {
|
|
487
|
+
return withAsChild(argArray[0]);
|
|
488
|
+
},
|
|
489
|
+
get(_, element) {
|
|
490
|
+
const asElement = element;
|
|
491
|
+
if (!cache.has(asElement)) cache.set(asElement, withAsChild(asElement));
|
|
492
|
+
return cache.get(asElement);
|
|
493
|
+
}
|
|
494
|
+
});
|
|
495
|
+
};
|
|
496
|
+
const sprawlify = jsxFactory();
|
|
497
|
+
|
|
498
|
+
//#endregion
|
|
499
|
+
export { EnvironmentProvider, LocaleProvider, Portal, createContext, jsxFactory, normalizeProps, sprawlify, useCollator, useEnvironmentContext, useFilter, useLocaleContext, useMachine };
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
const require_utils = require('../utils-DQoI5AQQ.cjs');
|
|
2
|
+
const require_index = require('../index.cjs');
|
|
3
|
+
let __sprawlify_primitives_core = require("@sprawlify/primitives/core");
|
|
4
|
+
|
|
5
|
+
exports.createContext = require_utils.createContext;
|
|
6
|
+
Object.defineProperty(exports, 'mergeProps', {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return __sprawlify_primitives_core.mergeProps;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
import { mergeProps as mergeProps$1 } from "@sprawlify/primitives/core";
|
|
2
|
+
import { hasProp, isFunction } from "@sprawlify/primitives/utils";
|
|
3
|
+
import { createContext, useContext } from "react";
|
|
4
|
+
|
|
5
|
+
//#region src/utils/create-context.ts
|
|
6
|
+
function getErrorMessage(hook, provider) {
|
|
7
|
+
return `${hook} returned \`undefined\`. Seems you forgot to wrap component within ${provider}`;
|
|
8
|
+
}
|
|
9
|
+
function createContext$1(options = {}) {
|
|
10
|
+
const { name, strict = true, hookName = "useContext", providerName = "Provider", errorMessage, defaultValue } = options;
|
|
11
|
+
const Context = createContext(defaultValue);
|
|
12
|
+
Context.displayName = name;
|
|
13
|
+
function useContext$1() {
|
|
14
|
+
const context = useContext(Context);
|
|
15
|
+
if (!context && strict) {
|
|
16
|
+
const error = new Error(errorMessage ?? getErrorMessage(hookName, providerName));
|
|
17
|
+
error.name = "ContextError";
|
|
18
|
+
if (hasProp(Error, "captureStackTrace") && isFunction(Error.captureStackTrace)) Error.captureStackTrace(error, useContext$1);
|
|
19
|
+
throw error;
|
|
20
|
+
}
|
|
21
|
+
return context;
|
|
22
|
+
}
|
|
23
|
+
return [
|
|
24
|
+
Context.Provider,
|
|
25
|
+
useContext$1,
|
|
26
|
+
Context
|
|
27
|
+
];
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
//#endregion
|
|
31
|
+
export { createContext$1 as n, mergeProps$1 as t };
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
const require_index = require('./index.cjs');
|
|
2
|
+
let __sprawlify_primitives_core = require("@sprawlify/primitives/core");
|
|
3
|
+
let __sprawlify_primitives_utils = require("@sprawlify/primitives/utils");
|
|
4
|
+
let react = require("react");
|
|
5
|
+
|
|
6
|
+
//#region src/utils/create-context.ts
|
|
7
|
+
function getErrorMessage(hook, provider) {
|
|
8
|
+
return `${hook} returned \`undefined\`. Seems you forgot to wrap component within ${provider}`;
|
|
9
|
+
}
|
|
10
|
+
function createContext(options = {}) {
|
|
11
|
+
const { name, strict = true, hookName = "useContext", providerName = "Provider", errorMessage, defaultValue } = options;
|
|
12
|
+
const Context = (0, react.createContext)(defaultValue);
|
|
13
|
+
Context.displayName = name;
|
|
14
|
+
function useContext() {
|
|
15
|
+
const context = (0, react.useContext)(Context);
|
|
16
|
+
if (!context && strict) {
|
|
17
|
+
const error = new Error(errorMessage ?? getErrorMessage(hookName, providerName));
|
|
18
|
+
error.name = "ContextError";
|
|
19
|
+
if ((0, __sprawlify_primitives_utils.hasProp)(Error, "captureStackTrace") && (0, __sprawlify_primitives_utils.isFunction)(Error.captureStackTrace)) Error.captureStackTrace(error, useContext);
|
|
20
|
+
throw error;
|
|
21
|
+
}
|
|
22
|
+
return context;
|
|
23
|
+
}
|
|
24
|
+
return [
|
|
25
|
+
Context.Provider,
|
|
26
|
+
useContext,
|
|
27
|
+
Context
|
|
28
|
+
];
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
//#endregion
|
|
32
|
+
Object.defineProperty(exports, 'createContext', {
|
|
33
|
+
enumerable: true,
|
|
34
|
+
get: function () {
|
|
35
|
+
return createContext;
|
|
36
|
+
}
|
|
37
|
+
});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sprawlify/react",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.2",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "React wrapper for primitives.",
|
|
6
6
|
"author": "sprawlify <npm@sprawlify.com>",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"access": "public"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@sprawlify/primitives": "0.0.
|
|
29
|
+
"@sprawlify/primitives": "0.0.2"
|
|
30
30
|
},
|
|
31
31
|
"peerDependencies": {
|
|
32
32
|
"react": ">=19.0.0",
|