@udixio/ui-react 1.6.3 → 2.0.0
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/CHANGELOG.md +41 -0
- package/dist/index.cjs +3 -3
- package/dist/index.js +1710 -1449
- package/dist/lib/config/config.interface.d.ts +4 -0
- package/dist/lib/config/config.interface.d.ts.map +1 -0
- package/dist/lib/config/define-config.d.ts +4 -0
- package/dist/lib/config/define-config.d.ts.map +1 -0
- package/dist/lib/config/index.d.ts +3 -0
- package/dist/lib/config/index.d.ts.map +1 -0
- package/dist/lib/effects/AnimateOnScroll.d.ts +15 -0
- package/dist/lib/effects/AnimateOnScroll.d.ts.map +1 -0
- package/dist/lib/effects/ThemeProvider.d.ts +3 -2
- package/dist/lib/effects/ThemeProvider.d.ts.map +1 -1
- package/dist/lib/effects/block-scroll.effect.d.ts +22 -0
- package/dist/lib/effects/block-scroll.effect.d.ts.map +1 -0
- package/dist/lib/effects/custom-scroll/custom-scroll.effect.d.ts.map +1 -1
- package/dist/lib/effects/index.d.ts +1 -0
- package/dist/lib/effects/index.d.ts.map +1 -1
- package/dist/lib/effects/scrollDriven.d.ts +5 -0
- package/dist/lib/effects/scrollDriven.d.ts.map +1 -0
- package/dist/lib/effects/smooth-scroll.effect.d.ts +5 -5
- package/dist/lib/effects/smooth-scroll.effect.d.ts.map +1 -1
- package/dist/lib/index.d.ts +1 -0
- package/dist/lib/index.d.ts.map +1 -1
- package/dist/lib/styles/fab.style.d.ts.map +1 -1
- package/dist/scrollDriven-AP2yWhzi.js +121 -0
- package/dist/scrollDriven-DWAu7CR0.cjs +1 -0
- package/package.json +5 -3
- package/src/lib/config/config.interface.ts +9 -0
- package/src/lib/config/define-config.ts +16 -0
- package/src/lib/config/index.ts +2 -0
- package/src/lib/effects/AnimateOnScroll.tsx +353 -0
- package/src/lib/effects/ThemeProvider.tsx +78 -52
- package/src/lib/effects/block-scroll.effect.tsx +174 -0
- package/src/lib/effects/custom-scroll/custom-scroll.effect.tsx +16 -5
- package/src/lib/effects/index.ts +1 -0
- package/src/lib/effects/scrollDriven.ts +239 -0
- package/src/lib/effects/smooth-scroll.effect.tsx +105 -72
- package/src/lib/index.ts +1 -0
- package/src/lib/styles/card.style.ts +1 -1
- package/src/lib/styles/fab.style.ts +9 -17
- package/src/lib/styles/slider.style.ts +2 -2
- package/src/lib/styles/tab.style.ts +1 -1
- package/src/lib/styles/tabs.style.ts +3 -3
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { ConfigInterface as ConfigTheme, FontPluginOptions } from '@udixio/theme';
|
|
2
|
+
import { TailwindPluginOptions } from '@udixio/tailwind';
|
|
3
|
+
export type ConfigInterface = Omit<ConfigTheme, 'plugins' | 'isDark'> & TailwindPluginOptions & FontPluginOptions;
|
|
4
|
+
//# sourceMappingURL=config.interface.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"config.interface.d.ts","sourceRoot":"","sources":["../../../src/lib/config/config.interface.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,eAAe,IAAI,WAAW,EAC9B,iBAAiB,EAClB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAC;AAEzD,MAAM,MAAM,eAAe,GAAG,IAAI,CAAC,WAAW,EAAE,SAAS,GAAG,QAAQ,CAAC,GACnE,qBAAqB,GACrB,iBAAiB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"define-config.d.ts","sourceRoot":"","sources":["../../../src/lib/config/define-config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EACL,eAAe,IAAI,WAAW,EAI/B,MAAM,eAAe,CAAC;AAGvB,wBAAgB,YAAY,CAAC,YAAY,EAAE,eAAe,GAAG,WAAW,CAMvE"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/config/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
/**
|
|
3
|
+
* AnimateOnScroll
|
|
4
|
+
*
|
|
5
|
+
* Manages triggers for animations:
|
|
6
|
+
* - ScrollDriven animations: use native CSS if supported; otherwise import JS fallback per element set.
|
|
7
|
+
* - Other entry/exit animations: handled via IntersectionObserver in JS.
|
|
8
|
+
*/
|
|
9
|
+
export type AnimateOnScrollProps = {
|
|
10
|
+
prefix?: string;
|
|
11
|
+
children?: ReactNode;
|
|
12
|
+
once?: boolean;
|
|
13
|
+
};
|
|
14
|
+
export declare const AnimateOnScroll: ({ prefix, children, once, }: AnimateOnScrollProps) => import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
//# sourceMappingURL=AnimateOnScroll.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AnimateOnScroll.d.ts","sourceRoot":"","sources":["../../../src/lib/effects/AnimateOnScroll.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAA8B,MAAM,OAAO,CAAC;AAE9D;;;;;;GAMG;AAEH,MAAM,MAAM,oBAAoB,GAAG;IACjC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAqKF,eAAO,MAAM,eAAe,GAAI,6BAI7B,oBAAoB,4CAyKtB,CAAC"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { API, ConfigInterface } from '@udixio/theme';
|
|
2
|
-
export declare const ThemeProvider: ({ config, throttleDelay, onLoad, }: {
|
|
3
|
-
config: ConfigInterface
|
|
2
|
+
export declare const ThemeProvider: ({ config, throttleDelay, onLoad, loadTheme, }: {
|
|
3
|
+
config: Readonly<ConfigInterface>;
|
|
4
4
|
onLoad?: (api: API) => void;
|
|
5
5
|
throttleDelay?: number;
|
|
6
|
+
loadTheme?: boolean;
|
|
6
7
|
}) => import("react/jsx-runtime").JSX.Element | null;
|
|
7
8
|
//# sourceMappingURL=ThemeProvider.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../../src/lib/effects/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../../src/lib/effects/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,GAAG,EACR,KAAK,eAAe,EAGrB,MAAM,eAAe,CAAC;AASvB,eAAO,MAAM,aAAa,GAAI,+CAK3B;IACD,MAAM,EAAE,QAAQ,CAAC,eAAe,CAAC,CAAC;IAClC,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,GAAG,KAAK,IAAI,CAAC;IAC5B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,mDAuGA,CAAC"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
type ScrollIntent = {
|
|
3
|
+
type: 'intent';
|
|
4
|
+
source: 'wheel' | 'touch' | 'keyboard';
|
|
5
|
+
deltaX: number;
|
|
6
|
+
deltaY: number;
|
|
7
|
+
originalEvent: Event;
|
|
8
|
+
} | {
|
|
9
|
+
type: 'scrollbar';
|
|
10
|
+
scrollTop: number;
|
|
11
|
+
scrollLeft: number;
|
|
12
|
+
maxScrollTop: number;
|
|
13
|
+
maxScrollLeft: number;
|
|
14
|
+
};
|
|
15
|
+
type BlockScrollProps = {
|
|
16
|
+
onScroll?: (evt: ScrollIntent) => void;
|
|
17
|
+
touch?: boolean;
|
|
18
|
+
el: HTMLElement;
|
|
19
|
+
};
|
|
20
|
+
export declare const BlockScroll: React.FC<BlockScrollProps>;
|
|
21
|
+
export {};
|
|
22
|
+
//# sourceMappingURL=block-scroll.effect.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"block-scroll.effect.d.ts","sourceRoot":"","sources":["../../../src/lib/effects/block-scroll.effect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,KAAK,YAAY,GACb;IACE,IAAI,EAAE,QAAQ,CAAC;IACf,MAAM,EAAE,OAAO,GAAG,OAAO,GAAG,UAAU,CAAC;IACvC,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,MAAM,CAAC;IACf,aAAa,EAAE,KAAK,CAAC;CACtB,GACD;IACE,IAAI,EAAE,WAAW,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;CACvB,CAAC;AAEN,KAAK,gBAAgB,GAAG;IACtB,QAAQ,CAAC,EAAE,CAAC,GAAG,EAAE,YAAY,KAAK,IAAI,CAAC;IACvC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,EAAE,EAAE,WAAW,CAAC;CACjB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAqJlD,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"custom-scroll.effect.d.ts","sourceRoot":"","sources":["../../../../src/lib/effects/custom-scroll/custom-scroll.effect.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAElE,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEzC,eAAO,MAAM,YAAY,GAAI,0FAQ1B,UAAU,CAAC,qBAAqB,CAAC,
|
|
1
|
+
{"version":3,"file":"custom-scroll.effect.d.ts","sourceRoot":"","sources":["../../../../src/lib/effects/custom-scroll/custom-scroll.effect.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAElE,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEzC,eAAO,MAAM,YAAY,GAAI,0FAQ1B,UAAU,CAAC,qBAAqB,CAAC,4CA0RnC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/effects/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,iBAAiB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/lib/effects/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,iBAAiB,CAAC;AAChC,cAAc,mBAAmB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"scrollDriven.d.ts","sourceRoot":"","sources":["../../../src/lib/effects/scrollDriven.ts"],"names":[],"mappings":"AAEA,MAAM,MAAM,oBAAoB,GAAG;IACjC,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAqKF,wBAAgB,sBAAsB,CAAC,OAAO,GAAE,oBAAyB,SAlKpD,IAAI,CAuOxB"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { ReactNode } from 'react';
|
|
2
1
|
import { CustomScrollInterface } from './custom-scroll';
|
|
3
2
|
import { ReactProps } from '../utils';
|
|
4
|
-
export declare const SmoothScroll: ({
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
}
|
|
3
|
+
export declare const SmoothScroll: ({ transition, orientation, throttleDuration, }: {
|
|
4
|
+
transition?: {
|
|
5
|
+
duration?: number;
|
|
6
|
+
};
|
|
7
|
+
} & ReactProps<CustomScrollInterface>) => import("react/jsx-runtime").JSX.Element | null;
|
|
8
8
|
//# sourceMappingURL=smooth-scroll.effect.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"smooth-scroll.effect.d.ts","sourceRoot":"","sources":["../../../src/lib/effects/smooth-scroll.effect.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"smooth-scroll.effect.d.ts","sourceRoot":"","sources":["../../../src/lib/effects/smooth-scroll.effect.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,MAAM,iBAAiB,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAItC,eAAO,MAAM,YAAY,GAAI,gDAI1B;IACD,UAAU,CAAC,EAAE;QACX,QAAQ,CAAC,EAAE,MAAM,CAAC;KACnB,CAAC;CACH,GAAG,UAAU,CAAC,qBAAqB,CAAC,mDA6GpC,CAAC"}
|
package/dist/lib/index.d.ts
CHANGED
package/dist/lib/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/lib/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fab.style.d.ts","sourceRoot":"","sources":["../../../src/lib/styles/fab.style.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAE3D,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"fab.style.d.ts","sourceRoot":"","sources":["../../../src/lib/styles/fab.style.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,6BAA6B,CAAC;AAE3D,eAAO,MAAM,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;8DA2CpB,CAAC"}
|
|
@@ -0,0 +1,121 @@
|
|
|
1
|
+
let y = !1, h = null;
|
|
2
|
+
function C() {
|
|
3
|
+
if (typeof window > "u") return !1;
|
|
4
|
+
try {
|
|
5
|
+
if (window.CSS && typeof window.CSS.supports == "function")
|
|
6
|
+
return CSS.supports("animation-timeline: view()") || CSS.supports("animation-timeline: scroll()") || CSS.supports("view-timeline-name: --a");
|
|
7
|
+
} catch {
|
|
8
|
+
}
|
|
9
|
+
return !1;
|
|
10
|
+
}
|
|
11
|
+
function F() {
|
|
12
|
+
return typeof window > "u" || !("matchMedia" in window) ? !1 : window.matchMedia("(prefers-reduced-motion: reduce)").matches;
|
|
13
|
+
}
|
|
14
|
+
function V(n, t) {
|
|
15
|
+
return getComputedStyle(n).getPropertyValue(t).trim() || null;
|
|
16
|
+
}
|
|
17
|
+
function b(n) {
|
|
18
|
+
if (!n) return null;
|
|
19
|
+
const t = n.split(/\s+/), e = t[t.length - 1];
|
|
20
|
+
if (!e) return null;
|
|
21
|
+
if (e.endsWith("%")) {
|
|
22
|
+
const r = parseFloat(e);
|
|
23
|
+
if (!isNaN(r)) return Math.max(0, Math.min(100, r)) / 100;
|
|
24
|
+
}
|
|
25
|
+
return null;
|
|
26
|
+
}
|
|
27
|
+
function L(n) {
|
|
28
|
+
const t = V(n, "--udx-range-start"), e = V(n, "--udx-range-end"), r = b(t) ?? 0.2, a = b(e) ?? 0.5, o = Math.max(0, Math.min(1, r)), l = Math.max(o + 1e-3, Math.min(1, a));
|
|
29
|
+
return { start: o, end: l };
|
|
30
|
+
}
|
|
31
|
+
function i(n, t) {
|
|
32
|
+
if (!n) return null;
|
|
33
|
+
const e = n.trim(), r = parseFloat(e);
|
|
34
|
+
return isNaN(r) ? null : r;
|
|
35
|
+
}
|
|
36
|
+
function p(n, t, e) {
|
|
37
|
+
return n + (t - n) * e;
|
|
38
|
+
}
|
|
39
|
+
function N(n, t, e, r) {
|
|
40
|
+
const a = t.opacity != null ? Number(t.opacity) : 1, o = e.opacity != null ? Number(e.opacity) : 1, l = p(a, o, r);
|
|
41
|
+
n.style.opacity = String(l);
|
|
42
|
+
const v = i(t["--tw-enter-translate-x"]) ?? i(t["--tw-exit-translate-x"]) ?? 0, g = i(t["--tw-enter-translate-y"]) ?? i(t["--tw-exit-translate-y"]) ?? 0, c = i(e["--tw-enter-translate-x"]) ?? i(e["--tw-exit-translate-x"]) ?? 0, u = i(e["--tw-enter-translate-y"]) ?? i(e["--tw-exit-translate-y"]) ?? 0, S = i(t["--tw-enter-scale"]) ?? i(t["--tw-exit-scale"]) ?? 1, M = i(e["--tw-enter-scale"]) ?? i(e["--tw-exit-scale"]) ?? 1, P = i(t["--tw-enter-rotate"]) ?? i(t["--tw-exit-rotate"]) ?? 0, f = i(e["--tw-enter-rotate"]) ?? i(e["--tw-exit-rotate"]) ?? 0, x = p(v, c, r), s = p(g, u, r), d = p(S, M, r), m = p(P, f, r), w = [];
|
|
43
|
+
(x !== 0 || s !== 0) && w.push(`translate3d(${x}px, ${s}px, 0)`), d !== 1 && w.push(`scale(${d})`), m !== 0 && w.push(`rotate(${m}deg)`), n.style.transform = w.length ? w.join(" ") : "none";
|
|
44
|
+
}
|
|
45
|
+
function T(n) {
|
|
46
|
+
const t = n.classList, e = t.contains("animate-in"), r = t.contains("animate-out");
|
|
47
|
+
if (!e && !r) return null;
|
|
48
|
+
const a = getComputedStyle(n), o = {
|
|
49
|
+
opacity: i(a.getPropertyValue("--tw-enter-opacity")) ?? void 0,
|
|
50
|
+
"--tw-enter-translate-x": a.getPropertyValue("--tw-enter-translate-x") || void 0,
|
|
51
|
+
"--tw-enter-translate-y": a.getPropertyValue("--tw-enter-translate-y") || void 0,
|
|
52
|
+
"--tw-enter-scale": a.getPropertyValue("--tw-enter-scale") || void 0,
|
|
53
|
+
"--tw-enter-rotate": a.getPropertyValue("--tw-enter-rotate") || void 0
|
|
54
|
+
}, l = {
|
|
55
|
+
opacity: i(a.getPropertyValue("--tw-exit-opacity")) ?? void 0,
|
|
56
|
+
"--tw-exit-translate-x": a.getPropertyValue("--tw-exit-translate-x") || void 0,
|
|
57
|
+
"--tw-exit-translate-y": a.getPropertyValue("--tw-exit-translate-y") || void 0,
|
|
58
|
+
"--tw-exit-scale": a.getPropertyValue("--tw-exit-scale") || void 0,
|
|
59
|
+
"--tw-exit-rotate": a.getPropertyValue("--tw-exit-rotate") || void 0
|
|
60
|
+
};
|
|
61
|
+
return e ? {
|
|
62
|
+
from: o,
|
|
63
|
+
to: { opacity: 1, "--tw-enter-translate-x": "0", "--tw-enter-translate-y": "0", "--tw-enter-scale": "1", "--tw-enter-rotate": "0" }
|
|
64
|
+
} : r ? {
|
|
65
|
+
from: { opacity: 1, "--tw-exit-translate-x": "0", "--tw-exit-translate-y": "0", "--tw-exit-scale": "1", "--tw-exit-rotate": "0" },
|
|
66
|
+
to: l
|
|
67
|
+
} : null;
|
|
68
|
+
}
|
|
69
|
+
function $() {
|
|
70
|
+
const n = [
|
|
71
|
+
".udx-view",
|
|
72
|
+
".udx-view-x",
|
|
73
|
+
".udx-view-y",
|
|
74
|
+
".udx-view-inline",
|
|
75
|
+
".udx-view-block",
|
|
76
|
+
"[data-udx-view]"
|
|
77
|
+
].map((t) => `${t}.animate-in, ${t}.animate-out`).join(", ");
|
|
78
|
+
return Array.from(document.querySelectorAll(n));
|
|
79
|
+
}
|
|
80
|
+
function k(n = {}) {
|
|
81
|
+
if (y) return h || (() => {
|
|
82
|
+
});
|
|
83
|
+
if (typeof window > "u") return () => {
|
|
84
|
+
};
|
|
85
|
+
if (C() || F())
|
|
86
|
+
return y = !0, () => {
|
|
87
|
+
};
|
|
88
|
+
y = !0;
|
|
89
|
+
const t = n.once ?? !0, e = /* @__PURE__ */ new WeakSet();
|
|
90
|
+
let r = null;
|
|
91
|
+
const a = () => {
|
|
92
|
+
const v = $(), g = window.innerHeight || 0;
|
|
93
|
+
for (const c of v) {
|
|
94
|
+
const u = c.getBoundingClientRect(), S = Math.min(u.bottom, g) - Math.max(u.top, 0), M = Math.max(0, Math.min(S, u.height)), P = u.height > 0 ? M / u.height : 0, { start: f, end: x } = L(c);
|
|
95
|
+
let s = (P - f) / (x - f);
|
|
96
|
+
s = Math.max(0, Math.min(1, s)), t && e.has(c) && s < 1 && (s = 1);
|
|
97
|
+
const d = T(c);
|
|
98
|
+
if (!d) continue;
|
|
99
|
+
const { from: m, to: w } = d;
|
|
100
|
+
N(c, m, w, s), s >= 1 && t && e.add(c);
|
|
101
|
+
}
|
|
102
|
+
}, o = () => {
|
|
103
|
+
r == null && (r = window.requestAnimationFrame(() => {
|
|
104
|
+
r = null, a();
|
|
105
|
+
}));
|
|
106
|
+
};
|
|
107
|
+
a(), window.addEventListener("scroll", o, { passive: !0 }), window.addEventListener("resize", o);
|
|
108
|
+
const l = new MutationObserver(() => {
|
|
109
|
+
o();
|
|
110
|
+
});
|
|
111
|
+
return l.observe(document.documentElement, {
|
|
112
|
+
childList: !0,
|
|
113
|
+
subtree: !0,
|
|
114
|
+
attributes: !0
|
|
115
|
+
}), h = () => {
|
|
116
|
+
window.removeEventListener("scroll", o), window.removeEventListener("resize", o), r != null && cancelAnimationFrame(r), l.disconnect(), y = !1, h = null;
|
|
117
|
+
}, h;
|
|
118
|
+
}
|
|
119
|
+
export {
|
|
120
|
+
k as initScrollViewFallback
|
|
121
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});let m=!1,g=null;function C(){if(typeof window>"u")return!1;try{if(window.CSS&&typeof window.CSS.supports=="function")return CSS.supports("animation-timeline: view()")||CSS.supports("animation-timeline: scroll()")||CSS.supports("view-timeline-name: --a")}catch{}return!1}function F(){return typeof window>"u"||!("matchMedia"in window)?!1:window.matchMedia("(prefers-reduced-motion: reduce)").matches}function P(n,t){return getComputedStyle(n).getPropertyValue(t).trim()||null}function V(n){if(!n)return null;const t=n.split(/\s+/),e=t[t.length-1];if(!e)return null;if(e.endsWith("%")){const r=parseFloat(e);if(!isNaN(r))return Math.max(0,Math.min(100,r))/100}return null}function T(n){const t=P(n,"--udx-range-start"),e=P(n,"--udx-range-end"),r=V(t)??.2,a=V(e)??.5,o=Math.max(0,Math.min(1,r)),l=Math.max(o+.001,Math.min(1,a));return{start:o,end:l}}function i(n,t){if(!n)return null;const e=n.trim(),r=parseFloat(e);return isNaN(r)?null:r}function p(n,t,e){return n+(t-n)*e}function k(n,t,e,r){const a=t.opacity!=null?Number(t.opacity):1,o=e.opacity!=null?Number(e.opacity):1,l=p(a,o,r);n.style.opacity=String(l);const v=i(t["--tw-enter-translate-x"])??i(t["--tw-exit-translate-x"])??0,h=i(t["--tw-enter-translate-y"])??i(t["--tw-exit-translate-y"])??0,c=i(e["--tw-enter-translate-x"])??i(e["--tw-exit-translate-x"])??0,u=i(e["--tw-enter-translate-y"])??i(e["--tw-exit-translate-y"])??0,S=i(t["--tw-enter-scale"])??i(t["--tw-exit-scale"])??1,M=i(e["--tw-enter-scale"])??i(e["--tw-exit-scale"])??1,b=i(t["--tw-enter-rotate"])??i(t["--tw-exit-rotate"])??0,f=i(e["--tw-enter-rotate"])??i(e["--tw-exit-rotate"])??0,x=p(v,c,r),s=p(h,u,r),d=p(S,M,r),y=p(b,f,r),w=[];(x!==0||s!==0)&&w.push(`translate3d(${x}px, ${s}px, 0)`),d!==1&&w.push(`scale(${d})`),y!==0&&w.push(`rotate(${y}deg)`),n.style.transform=w.length?w.join(" "):"none"}function L(n){const t=n.classList,e=t.contains("animate-in"),r=t.contains("animate-out");if(!e&&!r)return null;const a=getComputedStyle(n),o={opacity:i(a.getPropertyValue("--tw-enter-opacity"))??void 0,"--tw-enter-translate-x":a.getPropertyValue("--tw-enter-translate-x")||void 0,"--tw-enter-translate-y":a.getPropertyValue("--tw-enter-translate-y")||void 0,"--tw-enter-scale":a.getPropertyValue("--tw-enter-scale")||void 0,"--tw-enter-rotate":a.getPropertyValue("--tw-enter-rotate")||void 0},l={opacity:i(a.getPropertyValue("--tw-exit-opacity"))??void 0,"--tw-exit-translate-x":a.getPropertyValue("--tw-exit-translate-x")||void 0,"--tw-exit-translate-y":a.getPropertyValue("--tw-exit-translate-y")||void 0,"--tw-exit-scale":a.getPropertyValue("--tw-exit-scale")||void 0,"--tw-exit-rotate":a.getPropertyValue("--tw-exit-rotate")||void 0};return e?{from:o,to:{opacity:1,"--tw-enter-translate-x":"0","--tw-enter-translate-y":"0","--tw-enter-scale":"1","--tw-enter-rotate":"0"}}:r?{from:{opacity:1,"--tw-exit-translate-x":"0","--tw-exit-translate-y":"0","--tw-exit-scale":"1","--tw-exit-rotate":"0"},to:l}:null}function N(){const n=[".udx-view",".udx-view-x",".udx-view-y",".udx-view-inline",".udx-view-block","[data-udx-view]"].map(t=>`${t}.animate-in, ${t}.animate-out`).join(", ");return Array.from(document.querySelectorAll(n))}function $(n={}){if(m)return g||(()=>{});if(typeof window>"u")return()=>{};if(C()||F())return m=!0,()=>{};m=!0;const t=n.once??!0,e=new WeakSet;let r=null;const a=()=>{const v=N(),h=window.innerHeight||0;for(const c of v){const u=c.getBoundingClientRect(),S=Math.min(u.bottom,h)-Math.max(u.top,0),M=Math.max(0,Math.min(S,u.height)),b=u.height>0?M/u.height:0,{start:f,end:x}=T(c);let s=(b-f)/(x-f);s=Math.max(0,Math.min(1,s)),t&&e.has(c)&&s<1&&(s=1);const d=L(c);if(!d)continue;const{from:y,to:w}=d;k(c,y,w,s),s>=1&&t&&e.add(c)}},o=()=>{r==null&&(r=window.requestAnimationFrame(()=>{r=null,a()}))};a(),window.addEventListener("scroll",o,{passive:!0}),window.addEventListener("resize",o);const l=new MutationObserver(()=>{o()});return l.observe(document.documentElement,{childList:!0,subtree:!0,attributes:!0}),g=()=>{window.removeEventListener("scroll",o),window.removeEventListener("resize",o),r!=null&&cancelAnimationFrame(r),l.disconnect(),m=!1,g=null},g}exports.initScrollViewFallback=$;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@udixio/ui-react",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"module": "./dist/index.js",
|
|
@@ -20,6 +20,8 @@
|
|
|
20
20
|
"react-dom": ">19.0.0"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
|
+
"pathe": "^2.0.3",
|
|
24
|
+
"jiti": "^2.5.1",
|
|
23
25
|
"throttle-debounce": "^5.0.2",
|
|
24
26
|
"clsx": "^1.1.1",
|
|
25
27
|
"react-textarea-autosize": "^8.5.9",
|
|
@@ -34,8 +36,8 @@
|
|
|
34
36
|
"devDependencies": {
|
|
35
37
|
"react": "^19.1.1",
|
|
36
38
|
"react-dom": "^19.1.1",
|
|
37
|
-
"@udixio/
|
|
38
|
-
"@udixio/
|
|
39
|
+
"@udixio/tailwind": "2.0.0",
|
|
40
|
+
"@udixio/theme": "2.0.0"
|
|
39
41
|
},
|
|
40
42
|
"repository": {
|
|
41
43
|
"type": "git",
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import {
|
|
2
|
+
ConfigInterface as ConfigTheme,
|
|
3
|
+
FontPluginOptions,
|
|
4
|
+
} from '@udixio/theme';
|
|
5
|
+
import { TailwindPluginOptions } from '@udixio/tailwind';
|
|
6
|
+
|
|
7
|
+
export type ConfigInterface = Omit<ConfigTheme, 'plugins' | 'isDark'> &
|
|
8
|
+
TailwindPluginOptions &
|
|
9
|
+
FontPluginOptions;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { ConfigInterface } from './config.interface';
|
|
2
|
+
import {
|
|
3
|
+
ConfigInterface as ConfigTheme,
|
|
4
|
+
defineConfig as defineConfigTheme,
|
|
5
|
+
FontPlugin,
|
|
6
|
+
Variants,
|
|
7
|
+
} from '@udixio/theme';
|
|
8
|
+
import { TailwindPlugin } from '@udixio/tailwind';
|
|
9
|
+
|
|
10
|
+
export function defineConfig(configObject: ConfigInterface): ConfigTheme {
|
|
11
|
+
return defineConfigTheme({
|
|
12
|
+
variant: Variants.Fidelity,
|
|
13
|
+
...configObject,
|
|
14
|
+
plugins: [new FontPlugin(configObject), new TailwindPlugin(configObject)],
|
|
15
|
+
});
|
|
16
|
+
}
|