@vnejs/uis.react.smooth-text 0.1.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.
@@ -0,0 +1,20 @@
1
+ import "./SmoothText.styl";
2
+ export declare const SmoothText: ({ tokens, color, size, className, width, height, opacity, font, transition, charDelay, tokensVisibleForce, isForce, isCentered, isNotRender, isNoScrollBar, scrollBarTextSize, }: {
3
+ tokens?: any[];
4
+ color?: string;
5
+ size?: number;
6
+ className?: string;
7
+ width?: number;
8
+ height?: number;
9
+ opacity?: any;
10
+ font?: string;
11
+ transition?: any;
12
+ charDelay?: number;
13
+ tokensVisibleForce?: any;
14
+ isForce?: boolean;
15
+ isCentered?: boolean;
16
+ isNotRender?: boolean;
17
+ isNoScrollBar?: boolean;
18
+ scrollBarTextSize?: any;
19
+ }) => import("react/jsx-runtime").JSX.Element;
20
+ //# sourceMappingURL=SmoothText.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SmoothText.d.ts","sourceRoot":"","sources":["../src/SmoothText.tsx"],"names":[],"mappings":"AAQA,OAAO,mBAAmB,CAAC;AAM3B,eAAO,MAAM,UAAU,GAAI;;;;;;;;;;;;;;;;;CAiB1B,4CAgEA,CAAC"}
@@ -0,0 +1,35 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ import { useCallback, useMemo } from "react";
3
+ import { cn, getVneLength } from "@vnejs/uis.utils";
4
+ import { Char, Scrollbar } from "@vnejs/uis.react";
5
+ import { useSmoothTextCharsVisibleHook } from "./hooks/chars.hook";
6
+ import "./SmoothText.styl";
7
+ const b = cn("SmoothText");
8
+ const EMPTY_ARRAY = [];
9
+ export const SmoothText = ({ tokens = [], color = "", size = 60, className = "", width = 0, height = 0, opacity = null, font = "", transition = null, charDelay = 20, tokensVisibleForce = null, isForce = false, isCentered = false, isNotRender = false, isNoScrollBar = false, scrollBarTextSize = null, }) => {
10
+ const style = useMemo(() => {
11
+ const result = {};
12
+ if (font)
13
+ result.fontFamily = font;
14
+ if (color)
15
+ result.color = color;
16
+ if (size) {
17
+ result.fontSize = `round(down, calc(${getVneLength(size)} * var(--vne-text-size-multiplicator, 1)), 1px)`;
18
+ result.lineHeight = `round(down, calc(${getVneLength(1.25 * size)} * var(--vne-text-size-multiplicator, 1)), 1px)`;
19
+ }
20
+ if (transition !== null)
21
+ result.transition = transition && !isForce ? `${transition}ms` : "none";
22
+ if (opacity)
23
+ result.opacity = opacity;
24
+ return result;
25
+ }, [font, color, size, transition, opacity, isForce]);
26
+ const tokensVisible = useSmoothTextCharsVisibleHook(tokens, charDelay, tokensVisibleForce);
27
+ const renderChar = useCallback((tokenInfo, i) => (_jsx(Char, { token: tokenInfo.token, marks: tokenInfo.marks, isVisible: i < tokensVisible, isForce: isForce || tokensVisible === 0 }, `${tokenInfo.token}:${i}`)), [tokensVisible]);
28
+ if (isNotRender)
29
+ return null;
30
+ if (isNoScrollBar) {
31
+ return (_jsx("div", { className: b({ isNoScrollBar: true }, [className]), children: _jsx("div", { className: b("chars"), style: style, children: tokens.map(renderChar) }) }));
32
+ }
33
+ return (_jsx(Scrollbar, { className: b({ isCentered }, [className]), width: width, height: height, textSize: scrollBarTextSize, children: _jsx("div", { className: b("chars"), style: style, children: tokens.map(renderChar) }) }));
34
+ };
35
+ //# sourceMappingURL=SmoothText.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SmoothText.js","sourceRoot":"","sources":["../src/SmoothText.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,10 @@
1
+ .SmoothText
2
+ &-chars
3
+ width: 100%
4
+ height: 100%
5
+
6
+ &_isCentered &-chars
7
+ text-align: center
8
+
9
+ &_isNoScrollBar
10
+ display: inline-block
@@ -0,0 +1,2 @@
1
+ export declare const useSmoothTextCharsVisibleHook: (tokens: any, charDelay: any, tokensVisibleForce: any) => number;
2
+ //# sourceMappingURL=chars.hook.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"chars.hook.d.ts","sourceRoot":"","sources":["../../src/hooks/chars.hook.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,6BAA6B,GAAI,WAAM,EAAE,cAAS,EAAE,uBAAkB,WAoBlF,CAAC"}
@@ -0,0 +1,20 @@
1
+ import { useEffect, useState } from "react";
2
+ export const useSmoothTextCharsVisibleHook = (tokens, charDelay, tokensVisibleForce) => {
3
+ const [tokensVisible, setTokensVisible] = useState(0);
4
+ useEffect(() => {
5
+ if (tokensVisibleForce === null)
6
+ setTokensVisible(0);
7
+ }, [tokens, charDelay]);
8
+ useEffect(() => {
9
+ if (tokensVisibleForce !== null)
10
+ setTokensVisible(tokensVisibleForce);
11
+ }, [tokensVisibleForce]);
12
+ useEffect(() => {
13
+ if (tokensVisibleForce !== null || tokensVisible >= tokens.length)
14
+ return;
15
+ const tm = setTimeout(() => setTokensVisible(tokensVisible + 1), charDelay);
16
+ return () => clearTimeout(tm);
17
+ }, [tokens, tokensVisible, charDelay, tokensVisibleForce]);
18
+ return tokensVisible;
19
+ };
20
+ //# sourceMappingURL=chars.hook.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"chars.hook.js","sourceRoot":"","sources":["../../src/hooks/chars.hook.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,MAAM,CAAC,MAAM,6BAA6B,GAAG,CAAC,MAAM,EAAE,SAAS,EAAE,kBAAkB,EAAE,EAAE;IACrF,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAEtD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,kBAAkB,KAAK,IAAI;YAAE,gBAAgB,CAAC,CAAC,CAAC,CAAC;IACvD,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC;IAExB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,kBAAkB,KAAK,IAAI;YAAE,gBAAgB,CAAC,kBAAkB,CAAC,CAAC;IACxE,CAAC,EAAE,CAAC,kBAAkB,CAAC,CAAC,CAAC;IAEzB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,kBAAkB,KAAK,IAAI,IAAI,aAAa,IAAI,MAAM,CAAC,MAAM;YAAE,OAAO;QAE1E,MAAM,EAAE,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,gBAAgB,CAAC,aAAa,GAAG,CAAC,CAAC,EAAE,SAAS,CAAC,CAAC;QAE5E,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;IAChC,CAAC,EAAE,CAAC,MAAM,EAAE,aAAa,EAAE,SAAS,EAAE,kBAAkB,CAAC,CAAC,CAAC;IAE3D,OAAO,aAAa,CAAC;AACvB,CAAC,CAAC"}
@@ -0,0 +1,2 @@
1
+ export * from "./SmoothText";
2
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}
package/dist/index.js ADDED
@@ -0,0 +1,2 @@
1
+ export * from "./SmoothText";
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}
package/package.json ADDED
@@ -0,0 +1,32 @@
1
+ {
2
+ "name": "@vnejs/uis.react.smooth-text",
3
+ "version": "0.1.2",
4
+ "main": "dist/index.js",
5
+ "types": "dist/index.d.ts",
6
+ "scripts": {
7
+ "build": "node ../../scripts/build-package.mjs",
8
+ "publish:major:plugin": "npm run publish:major",
9
+ "publish:minor:plugin": "npm run publish:minor",
10
+ "publish:patch:plugin": "npm run publish:patch",
11
+ "publish:major": "npm run build && npm version major && npm publish --access public",
12
+ "publish:minor": "npm run build && npm version minor && npm publish --access public",
13
+ "publish:patch": "npm run build && npm version patch && npm publish --access public"
14
+ },
15
+ "peerDependencies": {
16
+ "@bem-react/classname": "1.5.12",
17
+ "@vnejs/uis.utils": "~0.1.0",
18
+ "react": "19.2.4",
19
+ "react-dom": "19.2.4",
20
+ "@vnejs/uis.react": "~0.1.0"
21
+ },
22
+ "devDependencies": {
23
+ "@vnejs/uis.react": "~0.1.0",
24
+ "typescript": "^5.7.3",
25
+ "@types/react": "^19.0.10",
26
+ "@types/react-dom": "^19.0.4"
27
+ },
28
+ "files": [
29
+ "dist",
30
+ "package.json"
31
+ ]
32
+ }