@v-c/textarea 0.0.1 → 0.0.3
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/ResizableTextArea.cjs +5 -2
- package/dist/ResizableTextArea.js +4 -2
- package/dist/TextArea.cjs +18 -15
- package/dist/TextArea.js +18 -15
- package/package.json +8 -8
|
@@ -5,6 +5,8 @@ let vue = require("vue");
|
|
|
5
5
|
let __v_c_resize_observer = require("@v-c/resize-observer");
|
|
6
6
|
__v_c_resize_observer = require_rolldown_runtime.__toESM(__v_c_resize_observer);
|
|
7
7
|
let __v_c_util = require("@v-c/util");
|
|
8
|
+
let __v_c_util_dist_omit = require("@v-c/util/dist/omit");
|
|
9
|
+
__v_c_util_dist_omit = require_rolldown_runtime.__toESM(__v_c_util_dist_omit);
|
|
8
10
|
let __v_c_util_dist_raf = require("@v-c/util/dist/raf");
|
|
9
11
|
__v_c_util_dist_raf = require_rolldown_runtime.__toESM(__v_c_util_dist_raf);
|
|
10
12
|
var RESIZE_START = 0;
|
|
@@ -119,13 +121,14 @@ var ResizableTextArea_default = /* @__PURE__ */ (0, vue.defineComponent)({
|
|
|
119
121
|
overflowY: resizeState.value === RESIZE_START || resizeState.value === RESIZE_MEASURING ? "hidden" : void 0,
|
|
120
122
|
overflowX: resizeState.value === RESIZE_START || resizeState.value === RESIZE_MEASURING ? "hidden" : void 0
|
|
121
123
|
};
|
|
124
|
+
const restAttrs = (0, __v_c_util_dist_omit.default)(attrs, ["class", "style"]);
|
|
122
125
|
return (0, vue.createVNode)(__v_c_resize_observer.default, {
|
|
123
126
|
"onResize": onInternalResize,
|
|
124
127
|
"disabled": !(autoSize || onResize)
|
|
125
|
-
}, { default: () => [(0, vue.createVNode)("textarea", (0, vue.mergeProps)(
|
|
128
|
+
}, { default: () => [(0, vue.createVNode)("textarea", (0, vue.mergeProps)(restAttrs, resetProps, {
|
|
126
129
|
"ref": textareaRef,
|
|
127
130
|
"style": mergedStyle,
|
|
128
|
-
"class": (0, __v_c_util.classNames)(prefixCls, [attrs.
|
|
131
|
+
"class": (0, __v_c_util.classNames)(prefixCls, [attrs.class], { [`${prefixCls}-disabled`]: disabled }),
|
|
129
132
|
"disabled": disabled,
|
|
130
133
|
"value": mergedValue.value,
|
|
131
134
|
"onChange": onInternalChange,
|
|
@@ -2,6 +2,7 @@ import calculateAutoSizeStyle from "./calculateNodeHeight.js";
|
|
|
2
2
|
import { computed, createVNode, defineComponent, mergeProps, onBeforeUnmount, ref, shallowRef, watch } from "vue";
|
|
3
3
|
import ResizeObserver from "@v-c/resize-observer";
|
|
4
4
|
import { classNames } from "@v-c/util";
|
|
5
|
+
import omit from "@v-c/util/dist/omit";
|
|
5
6
|
import raf from "@v-c/util/dist/raf";
|
|
6
7
|
var RESIZE_START = 0;
|
|
7
8
|
var RESIZE_MEASURING = 1;
|
|
@@ -115,13 +116,14 @@ var ResizableTextArea_default = /* @__PURE__ */ defineComponent({
|
|
|
115
116
|
overflowY: resizeState.value === RESIZE_START || resizeState.value === RESIZE_MEASURING ? "hidden" : void 0,
|
|
116
117
|
overflowX: resizeState.value === RESIZE_START || resizeState.value === RESIZE_MEASURING ? "hidden" : void 0
|
|
117
118
|
};
|
|
119
|
+
const restAttrs = omit(attrs, ["class", "style"]);
|
|
118
120
|
return createVNode(ResizeObserver, {
|
|
119
121
|
"onResize": onInternalResize,
|
|
120
122
|
"disabled": !(autoSize || onResize)
|
|
121
|
-
}, { default: () => [createVNode("textarea", mergeProps(
|
|
123
|
+
}, { default: () => [createVNode("textarea", mergeProps(restAttrs, resetProps, {
|
|
122
124
|
"ref": textareaRef,
|
|
123
125
|
"style": mergedStyle,
|
|
124
|
-
"class": classNames(prefixCls, [attrs.
|
|
126
|
+
"class": classNames(prefixCls, [attrs.class], { [`${prefixCls}-disabled`]: disabled }),
|
|
125
127
|
"disabled": disabled,
|
|
126
128
|
"value": mergedValue.value,
|
|
127
129
|
"onChange": onInternalChange,
|
package/dist/TextArea.cjs
CHANGED
|
@@ -3,9 +3,9 @@ const require_rolldown_runtime = require("./_virtual/rolldown_runtime.cjs");
|
|
|
3
3
|
const require_ResizableTextArea = require("./ResizableTextArea.cjs");
|
|
4
4
|
let vue = require("vue");
|
|
5
5
|
let __v_c_util = require("@v-c/util");
|
|
6
|
-
let __v_c_input = require("@v-c/input");
|
|
7
6
|
let __v_c_util_dist_omit = require("@v-c/util/dist/omit");
|
|
8
7
|
__v_c_util_dist_omit = require_rolldown_runtime.__toESM(__v_c_util_dist_omit);
|
|
8
|
+
let __v_c_input = require("@v-c/input");
|
|
9
9
|
var defaults = { prefixCls: "vc-textarea" };
|
|
10
10
|
var TextArea_default = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, expose, slots, emit }) => {
|
|
11
11
|
const stateValue = (0, vue.shallowRef)(props.value ?? props.defaultValue);
|
|
@@ -50,7 +50,6 @@ var TextArea_default = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs,
|
|
|
50
50
|
const valueLength = (0, vue.computed)(() => countConfig.value.strategy(formatValue.value));
|
|
51
51
|
const isOutOfRange = (0, vue.computed)(() => !!mergedMax.value && valueLength.value > mergedMax.value);
|
|
52
52
|
const onChange = (e) => {
|
|
53
|
-
emit("change", e);
|
|
54
53
|
props.onChange?.(e);
|
|
55
54
|
};
|
|
56
55
|
const triggerChange = (e, currentValue) => {
|
|
@@ -69,34 +68,26 @@ var TextArea_default = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs,
|
|
|
69
68
|
};
|
|
70
69
|
const onInternalCompositionStart = (e) => {
|
|
71
70
|
compositionRef.value = true;
|
|
72
|
-
emit("compositionStart", e);
|
|
73
71
|
props.onCompositionStart?.(e);
|
|
74
72
|
};
|
|
75
73
|
const onInternalCompositionEnd = (e) => {
|
|
76
74
|
compositionRef.value = false;
|
|
77
75
|
triggerChange(e, e.target.value);
|
|
78
|
-
emit("compositionEnd", e);
|
|
79
76
|
props.onCompositionEnd?.(e);
|
|
80
77
|
};
|
|
81
78
|
const onInternalChange = (e) => {
|
|
82
79
|
triggerChange(e, e.target.value);
|
|
83
80
|
};
|
|
84
81
|
const handleKeyDown = (e) => {
|
|
85
|
-
if (e.key === "Enter" && props.onPressEnter && !e.isComposing)
|
|
86
|
-
emit("pressEnter", e);
|
|
87
|
-
props.onPressEnter?.(e);
|
|
88
|
-
}
|
|
89
|
-
emit("keydown", e);
|
|
82
|
+
if (e.key === "Enter" && props.onPressEnter && !e.isComposing) props.onPressEnter?.(e);
|
|
90
83
|
props.onKeyDown?.(e);
|
|
91
84
|
};
|
|
92
85
|
const handleFocus = (e) => {
|
|
93
86
|
focused.value = true;
|
|
94
|
-
emit("focus", e);
|
|
95
87
|
props.onFocus?.(e);
|
|
96
88
|
};
|
|
97
89
|
const handleBlur = (e) => {
|
|
98
90
|
focused.value = false;
|
|
99
|
-
emit("blur", e);
|
|
100
91
|
props.onBlur?.(e);
|
|
101
92
|
};
|
|
102
93
|
const handleReset = (e) => {
|
|
@@ -105,7 +96,6 @@ var TextArea_default = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs,
|
|
|
105
96
|
emit("update:value", "");
|
|
106
97
|
};
|
|
107
98
|
const handleResize = (size) => {
|
|
108
|
-
emit("resize", size);
|
|
109
99
|
props.onResize?.(size);
|
|
110
100
|
if (getTextArea()?.style.height) textareaResized.value = true;
|
|
111
101
|
};
|
|
@@ -119,7 +109,7 @@ var TextArea_default = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs,
|
|
|
119
109
|
return props.allowClear;
|
|
120
110
|
});
|
|
121
111
|
return () => {
|
|
122
|
-
const { allowClear, maxLength, prefixCls = defaults.prefixCls, showCount, disabled, hidden, classNames, styles, onClear, readOnly, autoSize, suffix } = props;
|
|
112
|
+
const { allowClear, maxLength, prefixCls = defaults.prefixCls, showCount, disabled, hidden, classNames, styles, onClear, readOnly, autoSize, suffix,...restProps } = props;
|
|
123
113
|
const { class: attrClass, style: attrStyle,...restAttrs } = attrs;
|
|
124
114
|
const mergedClassName = props.className || attrClass;
|
|
125
115
|
const mergedStyle = {
|
|
@@ -158,7 +148,20 @@ var TextArea_default = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs,
|
|
|
158
148
|
"onCompositionend",
|
|
159
149
|
"onKeydown",
|
|
160
150
|
"onKeyup",
|
|
161
|
-
"onInput"
|
|
151
|
+
"onInput",
|
|
152
|
+
"allowClear",
|
|
153
|
+
"maxLength",
|
|
154
|
+
"prefixCls",
|
|
155
|
+
"showCount",
|
|
156
|
+
"disabled",
|
|
157
|
+
"hidden",
|
|
158
|
+
"classNames",
|
|
159
|
+
"styles",
|
|
160
|
+
"onClear",
|
|
161
|
+
"readOnly",
|
|
162
|
+
"autoSize",
|
|
163
|
+
"suffix",
|
|
164
|
+
"onResize"
|
|
162
165
|
]);
|
|
163
166
|
return (0, vue.createVNode)(__v_c_input.BaseInput, {
|
|
164
167
|
"ref": holderRef,
|
|
@@ -179,7 +182,7 @@ var TextArea_default = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs,
|
|
|
179
182
|
"hidden": hidden,
|
|
180
183
|
"readOnly": readOnly,
|
|
181
184
|
"onClear": onClear
|
|
182
|
-
}, { default: () => [(0, vue.createVNode)(require_ResizableTextArea.default, (0, vue.mergeProps)(inputAttrs, {
|
|
185
|
+
}, { default: () => [(0, vue.createVNode)(require_ResizableTextArea.default, (0, vue.mergeProps)(inputAttrs, restProps, {
|
|
183
186
|
"value": stateValue.value,
|
|
184
187
|
"autoSize": autoSize,
|
|
185
188
|
"maxLength": maxLength,
|
package/dist/TextArea.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import ResizableTextArea_default from "./ResizableTextArea.js";
|
|
2
2
|
import { Fragment, computed, createVNode, defineComponent, mergeDefaults, mergeProps, nextTick, shallowRef, watch } from "vue";
|
|
3
3
|
import { classNames } from "@v-c/util";
|
|
4
|
-
import { BaseInput, resolveOnChange, useCount } from "@v-c/input";
|
|
5
4
|
import omit from "@v-c/util/dist/omit";
|
|
5
|
+
import { BaseInput, resolveOnChange, useCount } from "@v-c/input";
|
|
6
6
|
var defaults = { prefixCls: "vc-textarea" };
|
|
7
7
|
var TextArea_default = /* @__PURE__ */ defineComponent((props, { attrs, expose, slots, emit }) => {
|
|
8
8
|
const stateValue = shallowRef(props.value ?? props.defaultValue);
|
|
@@ -47,7 +47,6 @@ var TextArea_default = /* @__PURE__ */ defineComponent((props, { attrs, expose,
|
|
|
47
47
|
const valueLength = computed(() => countConfig.value.strategy(formatValue.value));
|
|
48
48
|
const isOutOfRange = computed(() => !!mergedMax.value && valueLength.value > mergedMax.value);
|
|
49
49
|
const onChange = (e) => {
|
|
50
|
-
emit("change", e);
|
|
51
50
|
props.onChange?.(e);
|
|
52
51
|
};
|
|
53
52
|
const triggerChange = (e, currentValue) => {
|
|
@@ -66,34 +65,26 @@ var TextArea_default = /* @__PURE__ */ defineComponent((props, { attrs, expose,
|
|
|
66
65
|
};
|
|
67
66
|
const onInternalCompositionStart = (e) => {
|
|
68
67
|
compositionRef.value = true;
|
|
69
|
-
emit("compositionStart", e);
|
|
70
68
|
props.onCompositionStart?.(e);
|
|
71
69
|
};
|
|
72
70
|
const onInternalCompositionEnd = (e) => {
|
|
73
71
|
compositionRef.value = false;
|
|
74
72
|
triggerChange(e, e.target.value);
|
|
75
|
-
emit("compositionEnd", e);
|
|
76
73
|
props.onCompositionEnd?.(e);
|
|
77
74
|
};
|
|
78
75
|
const onInternalChange = (e) => {
|
|
79
76
|
triggerChange(e, e.target.value);
|
|
80
77
|
};
|
|
81
78
|
const handleKeyDown = (e) => {
|
|
82
|
-
if (e.key === "Enter" && props.onPressEnter && !e.isComposing)
|
|
83
|
-
emit("pressEnter", e);
|
|
84
|
-
props.onPressEnter?.(e);
|
|
85
|
-
}
|
|
86
|
-
emit("keydown", e);
|
|
79
|
+
if (e.key === "Enter" && props.onPressEnter && !e.isComposing) props.onPressEnter?.(e);
|
|
87
80
|
props.onKeyDown?.(e);
|
|
88
81
|
};
|
|
89
82
|
const handleFocus = (e) => {
|
|
90
83
|
focused.value = true;
|
|
91
|
-
emit("focus", e);
|
|
92
84
|
props.onFocus?.(e);
|
|
93
85
|
};
|
|
94
86
|
const handleBlur = (e) => {
|
|
95
87
|
focused.value = false;
|
|
96
|
-
emit("blur", e);
|
|
97
88
|
props.onBlur?.(e);
|
|
98
89
|
};
|
|
99
90
|
const handleReset = (e) => {
|
|
@@ -102,7 +93,6 @@ var TextArea_default = /* @__PURE__ */ defineComponent((props, { attrs, expose,
|
|
|
102
93
|
emit("update:value", "");
|
|
103
94
|
};
|
|
104
95
|
const handleResize = (size) => {
|
|
105
|
-
emit("resize", size);
|
|
106
96
|
props.onResize?.(size);
|
|
107
97
|
if (getTextArea()?.style.height) textareaResized.value = true;
|
|
108
98
|
};
|
|
@@ -116,7 +106,7 @@ var TextArea_default = /* @__PURE__ */ defineComponent((props, { attrs, expose,
|
|
|
116
106
|
return props.allowClear;
|
|
117
107
|
});
|
|
118
108
|
return () => {
|
|
119
|
-
const { allowClear, maxLength, prefixCls = defaults.prefixCls, showCount, disabled, hidden, classNames: classNames$1, styles, onClear, readOnly, autoSize, suffix } = props;
|
|
109
|
+
const { allowClear, maxLength, prefixCls = defaults.prefixCls, showCount, disabled, hidden, classNames: classNames$1, styles, onClear, readOnly, autoSize, suffix,...restProps } = props;
|
|
120
110
|
const { class: attrClass, style: attrStyle,...restAttrs } = attrs;
|
|
121
111
|
const mergedClassName = props.className || attrClass;
|
|
122
112
|
const mergedStyle = {
|
|
@@ -155,7 +145,20 @@ var TextArea_default = /* @__PURE__ */ defineComponent((props, { attrs, expose,
|
|
|
155
145
|
"onCompositionend",
|
|
156
146
|
"onKeydown",
|
|
157
147
|
"onKeyup",
|
|
158
|
-
"onInput"
|
|
148
|
+
"onInput",
|
|
149
|
+
"allowClear",
|
|
150
|
+
"maxLength",
|
|
151
|
+
"prefixCls",
|
|
152
|
+
"showCount",
|
|
153
|
+
"disabled",
|
|
154
|
+
"hidden",
|
|
155
|
+
"classNames",
|
|
156
|
+
"styles",
|
|
157
|
+
"onClear",
|
|
158
|
+
"readOnly",
|
|
159
|
+
"autoSize",
|
|
160
|
+
"suffix",
|
|
161
|
+
"onResize"
|
|
159
162
|
]);
|
|
160
163
|
return createVNode(BaseInput, {
|
|
161
164
|
"ref": holderRef,
|
|
@@ -176,7 +179,7 @@ var TextArea_default = /* @__PURE__ */ defineComponent((props, { attrs, expose,
|
|
|
176
179
|
"hidden": hidden,
|
|
177
180
|
"readOnly": readOnly,
|
|
178
181
|
"onClear": onClear
|
|
179
|
-
}, { default: () => [createVNode(ResizableTextArea_default, mergeProps(inputAttrs, {
|
|
182
|
+
}, { default: () => [createVNode(ResizableTextArea_default, mergeProps(inputAttrs, restProps, {
|
|
180
183
|
"value": stateValue.value,
|
|
181
184
|
"autoSize": autoSize,
|
|
182
185
|
"maxLength": maxLength,
|
package/package.json
CHANGED
|
@@ -1,14 +1,10 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@v-c/textarea",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "0.0.
|
|
4
|
+
"version": "0.0.3",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
7
7
|
},
|
|
8
|
-
"files": [
|
|
9
|
-
"dist",
|
|
10
|
-
"package.json"
|
|
11
|
-
],
|
|
12
8
|
"exports": {
|
|
13
9
|
".": {
|
|
14
10
|
"types": "./dist/index.d.ts",
|
|
@@ -19,13 +15,17 @@
|
|
|
19
15
|
"./package.json": "./package.json"
|
|
20
16
|
},
|
|
21
17
|
"main": "dist/index.js",
|
|
18
|
+
"files": [
|
|
19
|
+
"dist",
|
|
20
|
+
"package.json"
|
|
21
|
+
],
|
|
22
22
|
"peerDependencies": {
|
|
23
23
|
"vue": "^3.0.0"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@v-c/input": "0.0.
|
|
27
|
-
"@v-c/
|
|
28
|
-
"@v-c/
|
|
26
|
+
"@v-c/input": "^0.0.2",
|
|
27
|
+
"@v-c/util": "^1.0.0",
|
|
28
|
+
"@v-c/resize-observer": "^1.0.0"
|
|
29
29
|
},
|
|
30
30
|
"scripts": {
|
|
31
31
|
"build": "vite build",
|