@vnejs/uis.react.text-controls 0.1.7 → 0.1.9
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/TextControls.d.ts.map +1 -1
- package/dist/TextControls.js +3 -1
- package/dist/TextControls.js.map +1 -1
- package/dist/TextControls.types.d.ts +10 -9
- package/dist/TextControls.types.d.ts.map +1 -1
- package/package.json +7 -5
- package/src/TextControls.stories.tsx +2 -2
- package/src/TextControls.tsx +5 -1
- package/src/TextControls.types.tsx +11 -9
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextControls.d.ts","sourceRoot":"","sources":["../src/TextControls.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TextControls.d.ts","sourceRoot":"","sources":["../src/TextControls.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAEjE,eAAO,MAAM,YAAY,GAAI,yRAuB1B,iBAAiB,4CAgDnB,CAAC"}
|
package/dist/TextControls.js
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { useCallback } from "react";
|
|
3
|
-
import { Text
|
|
3
|
+
import { Text } from "@vnejs/uis.react.text";
|
|
4
|
+
import { Flex } from "@vnejs/uis.react.flex";
|
|
5
|
+
import { Scrollbar } from "@vnejs/uis.react.scrollbar";
|
|
4
6
|
export const TextControls = ({ texts = [], selectedIndex = -1, textProps = {}, flexProps = {}, textSize = 60, textWidth = null, textAlign = null, textMarginTop = null, flexGap = 60, flexGapVertical = 0, flexGapHorizontal = 0, flexDirection = Flex.DIRECTION.ROW, flexAlign = null, flexJustify = null, flexWithWrap = null, wrapWidth = null, wrapHeight = null, wrapClassName, withScrollbar = false, scrollbarWrapRef = null, onClick, value, }) => {
|
|
5
7
|
const renderTexts = useCallback(() => texts.map((textInfo, i) => (_jsx(Text, { size: textSize, width: textWidth, align: textAlign, onClick: onClick, isSelected: selectedIndex === i, isCurrent: value !== undefined && value === textInfo?.value, isHoverable: true, marginTop: i === 0 ? null : textMarginTop, ...textProps, ...textInfo }, i))), [texts, textProps, selectedIndex, onClick, value, textSize, textWidth, textAlign, textMarginTop]);
|
|
6
8
|
return withScrollbar ? (_jsx(Scrollbar, { className: wrapClassName, width: wrapWidth, height: wrapHeight, scrollTo: selectedIndex, wrapRef: scrollbarWrapRef, children: renderTexts() })) : (_jsx(Flex, { className: wrapClassName, gap: flexGap, gapHorizontal: flexGapHorizontal, gapVertical: flexGapVertical, align: flexAlign, justify: flexJustify, direction: flexDirection, withWrap: flexWithWrap, width: wrapWidth, height: wrapHeight, ...flexProps, children: renderTexts() }));
|
package/dist/TextControls.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextControls.js","sourceRoot":"","sources":["../src/TextControls.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEpC,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"TextControls.js","sourceRoot":"","sources":["../src/TextControls.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAEpC,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAE7C,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAE7C,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAC;AAIvD,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,EAC3B,KAAK,GAAG,EAAE,EACV,aAAa,GAAG,CAAC,CAAC,EAClB,SAAS,GAAG,EAAE,EACd,SAAS,GAAG,EAAE,EACd,QAAQ,GAAG,EAAE,EACb,SAAS,GAAG,IAAI,EAChB,SAAS,GAAG,IAAI,EAChB,aAAa,GAAG,IAAI,EACpB,OAAO,GAAG,EAAE,EACZ,eAAe,GAAG,CAAC,EACnB,iBAAiB,GAAG,CAAC,EACrB,aAAa,GAAG,IAAI,CAAC,SAAS,CAAC,GAAG,EAClC,SAAS,GAAG,IAAI,EAChB,WAAW,GAAG,IAAI,EAClB,YAAY,GAAG,IAAI,EACnB,SAAS,GAAG,IAAI,EAChB,UAAU,GAAG,IAAI,EACjB,aAAa,EACb,aAAa,GAAG,KAAK,EACrB,gBAAgB,GAAG,IAAI,EACvB,OAAO,EACP,KAAK,GACa,EAAE,EAAE;IACtB,MAAM,WAAW,GAAG,WAAW,CAC7B,GAAG,EAAE,CACH,KAAK,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,CAAC,EAAE,EAAE,CAAC,CACzB,KAAC,IAAI,IAEH,IAAI,EAAE,QAAQ,EACd,KAAK,EAAE,SAAS,EAChB,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,aAAa,KAAK,CAAC,EAC/B,SAAS,EAAE,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,QAAQ,EAAE,KAAK,EAC3D,WAAW,EAAE,IAAI,EACjB,SAAS,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,aAAa,KACrC,SAAS,KACT,QAAQ,IAVP,CAAC,CAWN,CACH,CAAC,EACJ,CAAC,KAAK,EAAE,SAAS,EAAE,aAAa,EAAE,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,SAAS,EAAE,aAAa,CAAC,CACjG,CAAC;IAEF,OAAO,aAAa,CAAC,CAAC,CAAC,CACrB,KAAC,SAAS,IACR,SAAS,EAAE,aAAa,EACxB,KAAK,EAAE,SAAS,EAChB,MAAM,EAAE,UAAU,EAClB,QAAQ,EAAE,aAAa,EACvB,OAAO,EAAE,gBAAgB,YAExB,WAAW,EAAE,GACJ,CACb,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IACH,SAAS,EAAE,aAAa,EACxB,GAAG,EAAE,OAAO,EACZ,aAAa,EAAE,iBAAiB,EAChC,WAAW,EAAE,eAAe,EAC5B,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,QAAQ,EAAE,YAAY,EACtB,KAAK,EAAE,SAAS,EAChB,MAAM,EAAE,UAAU,KACd,SAAS,YAEZ,WAAW,EAAE,GACT,CACR,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import type { MutableRefObject } from "react";
|
|
2
|
+
import type { CssInsertInnerText, CssInsertValueLength } from "@vnejs/uis.utils";
|
|
2
3
|
export type TextControlItem = {
|
|
3
|
-
text?:
|
|
4
|
+
text?: CssInsertInnerText;
|
|
4
5
|
value?: unknown;
|
|
5
6
|
isNotRender?: boolean;
|
|
6
7
|
} & Record<string, unknown>;
|
|
@@ -9,19 +10,19 @@ export type TextControlsProps<T = unknown> = {
|
|
|
9
10
|
selectedIndex?: number;
|
|
10
11
|
textProps?: Record<string, unknown>;
|
|
11
12
|
flexProps?: Record<string, unknown>;
|
|
12
|
-
textSize?:
|
|
13
|
-
textWidth?:
|
|
13
|
+
textSize?: CssInsertValueLength;
|
|
14
|
+
textWidth?: CssInsertValueLength | null;
|
|
14
15
|
textAlign?: string | null;
|
|
15
|
-
textMarginTop?:
|
|
16
|
-
flexGap?:
|
|
17
|
-
flexGapVertical?:
|
|
18
|
-
flexGapHorizontal?:
|
|
16
|
+
textMarginTop?: CssInsertValueLength | null;
|
|
17
|
+
flexGap?: CssInsertValueLength;
|
|
18
|
+
flexGapVertical?: CssInsertValueLength;
|
|
19
|
+
flexGapHorizontal?: CssInsertValueLength;
|
|
19
20
|
flexDirection?: string;
|
|
20
21
|
flexAlign?: string | null;
|
|
21
22
|
flexJustify?: string | null;
|
|
22
23
|
flexWithWrap?: boolean | null;
|
|
23
|
-
wrapWidth?:
|
|
24
|
-
wrapHeight?:
|
|
24
|
+
wrapWidth?: CssInsertValueLength | null;
|
|
25
|
+
wrapHeight?: CssInsertValueLength | null;
|
|
25
26
|
wrapClassName?: string;
|
|
26
27
|
withScrollbar?: boolean;
|
|
27
28
|
scrollbarWrapRef?: MutableRefObject<HTMLDivElement | null> | null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextControls.types.d.ts","sourceRoot":"","sources":["../src/TextControls.types.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAa,MAAM,OAAO,CAAC;AAEzD,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"TextControls.types.d.ts","sourceRoot":"","sources":["../src/TextControls.types.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAa,MAAM,OAAO,CAAC;AAEzD,OAAO,KAAK,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAEjF,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAE5B,MAAM,MAAM,iBAAiB,CAAC,CAAC,GAAG,OAAO,IAAI;IAC3C,KAAK,CAAC,EAAE,eAAe,EAAE,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACpC,QAAQ,CAAC,EAAE,oBAAoB,CAAC;IAChC,SAAS,CAAC,EAAE,oBAAoB,GAAG,IAAI,CAAC;IACxC,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,aAAa,CAAC,EAAE,oBAAoB,GAAG,IAAI,CAAC;IAC5C,OAAO,CAAC,EAAE,oBAAoB,CAAC;IAC/B,eAAe,CAAC,EAAE,oBAAoB,CAAC;IACvC,iBAAiB,CAAC,EAAE,oBAAoB,CAAC;IACzC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC9B,SAAS,CAAC,EAAE,oBAAoB,GAAG,IAAI,CAAC;IACxC,UAAU,CAAC,EAAE,oBAAoB,GAAG,IAAI,CAAC;IACzC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,cAAc,GAAG,IAAI,CAAC,GAAG,IAAI,CAAC;IAClE,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,IAAI,CAAC;IAC9B,KAAK,CAAC,EAAE,CAAC,CAAC;CACX,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vnejs/uis.react.text-controls",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.9",
|
|
4
4
|
"main": "dist/index.js",
|
|
5
5
|
"types": "dist/index.d.ts",
|
|
6
6
|
"scripts": {
|
|
@@ -15,12 +15,14 @@
|
|
|
15
15
|
"peerDependencies": {
|
|
16
16
|
"@vnejs/uis.utils": "~0.1.0"
|
|
17
17
|
},
|
|
18
|
-
"devDependencies": {
|
|
19
|
-
"@vnejs/uis.react": "~0.1.0"
|
|
20
|
-
},
|
|
21
18
|
"files": [
|
|
22
19
|
"dist",
|
|
23
20
|
"src",
|
|
24
21
|
"tsconfig.json"
|
|
25
|
-
]
|
|
22
|
+
],
|
|
23
|
+
"dependencies": {
|
|
24
|
+
"@vnejs/uis.react.flex": "~0.1.0",
|
|
25
|
+
"@vnejs/uis.react.scrollbar": "~0.1.0",
|
|
26
|
+
"@vnejs/uis.react.text": "~0.1.0"
|
|
27
|
+
}
|
|
26
28
|
}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { useMemo, useState } from "react";
|
|
2
2
|
|
|
3
|
-
import { renderWithVneWrap, VneWrap } from "@vnejs/uis.react";
|
|
3
|
+
import { renderWithVneWrap, VneWrap } from "@vnejs/uis.react.vne-wrap";
|
|
4
4
|
|
|
5
|
-
import { Flex } from "@vnejs/uis.react";
|
|
5
|
+
import { Flex } from "@vnejs/uis.react.flex";
|
|
6
6
|
|
|
7
7
|
import { TextControls } from "./TextControls";
|
|
8
8
|
|
package/src/TextControls.tsx
CHANGED
|
@@ -1,6 +1,10 @@
|
|
|
1
1
|
import { useCallback } from "react";
|
|
2
2
|
|
|
3
|
-
import { Text
|
|
3
|
+
import { Text } from "@vnejs/uis.react.text";
|
|
4
|
+
|
|
5
|
+
import { Flex } from "@vnejs/uis.react.flex";
|
|
6
|
+
|
|
7
|
+
import { Scrollbar } from "@vnejs/uis.react.scrollbar";
|
|
4
8
|
|
|
5
9
|
import { type TextControlsProps } from "./TextControls.types.js";
|
|
6
10
|
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import type { MutableRefObject, ReactNode } from "react";
|
|
2
2
|
|
|
3
|
+
import type { CssInsertInnerText, CssInsertValueLength } from "@vnejs/uis.utils";
|
|
4
|
+
|
|
3
5
|
export type TextControlItem = {
|
|
4
|
-
text?:
|
|
6
|
+
text?: CssInsertInnerText;
|
|
5
7
|
value?: unknown;
|
|
6
8
|
isNotRender?: boolean;
|
|
7
9
|
} & Record<string, unknown>;
|
|
@@ -11,19 +13,19 @@ export type TextControlsProps<T = unknown> = {
|
|
|
11
13
|
selectedIndex?: number;
|
|
12
14
|
textProps?: Record<string, unknown>;
|
|
13
15
|
flexProps?: Record<string, unknown>;
|
|
14
|
-
textSize?:
|
|
15
|
-
textWidth?:
|
|
16
|
+
textSize?: CssInsertValueLength;
|
|
17
|
+
textWidth?: CssInsertValueLength | null;
|
|
16
18
|
textAlign?: string | null;
|
|
17
|
-
textMarginTop?:
|
|
18
|
-
flexGap?:
|
|
19
|
-
flexGapVertical?:
|
|
20
|
-
flexGapHorizontal?:
|
|
19
|
+
textMarginTop?: CssInsertValueLength | null;
|
|
20
|
+
flexGap?: CssInsertValueLength;
|
|
21
|
+
flexGapVertical?: CssInsertValueLength;
|
|
22
|
+
flexGapHorizontal?: CssInsertValueLength;
|
|
21
23
|
flexDirection?: string;
|
|
22
24
|
flexAlign?: string | null;
|
|
23
25
|
flexJustify?: string | null;
|
|
24
26
|
flexWithWrap?: boolean | null;
|
|
25
|
-
wrapWidth?:
|
|
26
|
-
wrapHeight?:
|
|
27
|
+
wrapWidth?: CssInsertValueLength | null;
|
|
28
|
+
wrapHeight?: CssInsertValueLength | null;
|
|
27
29
|
wrapClassName?: string;
|
|
28
30
|
withScrollbar?: boolean;
|
|
29
31
|
scrollbarWrapRef?: MutableRefObject<HTMLDivElement | null> | null;
|