bkui-vue 0.0.1-beta.34 → 0.0.1-beta.37

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.
@@ -9263,8 +9263,9 @@ ${$(r2)}`), n2;
9263
9263
  showControl: PropTypes.bool.def(true),
9264
9264
  showClearOnlyHover: PropTypes.bool.def(false),
9265
9265
  precision: PropTypes.number.def(0).validate((val) => val >= 0 && val < 20),
9266
- modelValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
9267
- size: PropTypes.size()
9266
+ modelValue: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).def(""),
9267
+ size: PropTypes.size(),
9268
+ rows: PropTypes.number
9268
9269
  };
9269
9270
  const inputEvents = ["update:modelValue", "focus", "blur", "change", "clear", "input", "keypress", "keydown", "keyup", "enter", "paste"];
9270
9271
  const EventEnum = stringEnum([...inputEvents]);
@@ -9276,7 +9277,8 @@ ${$(r2)}`), n2;
9276
9277
  setup(props, ctx) {
9277
9278
  const isFocused = vue.ref(false);
9278
9279
  const isCNInput = vue.ref(false);
9279
- const inputClsPrefix = "bk-input";
9280
+ const isTextArea = vue.computed(() => props.type === "textarea");
9281
+ const inputClsPrefix = vue.computed(() => isTextArea.value ? "bk-textarea" : "bk-input");
9280
9282
  const _a = ctx.attrs, {
9281
9283
  class: cls,
9282
9284
  style
@@ -9285,13 +9287,13 @@ ${$(r2)}`), n2;
9285
9287
  "style"
9286
9288
  ]);
9287
9289
  const inputCls = vue.computed(() => classes({
9288
- [`${inputClsPrefix}--${props.size}`]: !!props.size,
9290
+ [`${inputClsPrefix.value}--${props.size}`]: !!props.size,
9289
9291
  "is-focused": isFocused.value,
9290
9292
  "is-readonly": props.readonly,
9291
9293
  "is-disabled": props.disabled,
9292
9294
  "is-simplicity": props.behavior === "simplicity",
9293
9295
  [`${cls}`]: !!cls
9294
- }, inputClsPrefix));
9296
+ }, inputClsPrefix.value));
9295
9297
  const suffixIconMap = {
9296
9298
  search: () => vue.createVNode(search, null, null),
9297
9299
  password: () => vue.createVNode(eye, {
@@ -9377,11 +9379,28 @@ ${$(r2)}`), n2;
9377
9379
  ctx.emit(EventEnum["update:modelValue"], newVal);
9378
9380
  }
9379
9381
  function getCls(name) {
9380
- return `${inputClsPrefix}--${name}`;
9382
+ return `${inputClsPrefix.value}--${name}`;
9381
9383
  }
9382
9384
  function handleVisibleChange() {
9383
9385
  pwdVisible.value = !pwdVisible.value;
9384
9386
  }
9387
+ const bindProps = vue.computed(() => ({
9388
+ value: props.modelValue,
9389
+ maxlength: props.maxlength,
9390
+ placeholder: props.placeholder,
9391
+ readonly: props.readonly,
9392
+ disabled: props.disabled,
9393
+ onInput: handleInput,
9394
+ onFocus: handleFocus,
9395
+ onBlur: handleBlur,
9396
+ onPaste: handlePaste,
9397
+ onChange: handleChange,
9398
+ onKeypress: handleKeyPress,
9399
+ onKeydown: handleKeydown,
9400
+ onKeyup: handleKeyup,
9401
+ onCompositionstart: handleCompositionStart,
9402
+ onCompositionend: handleCompositionEnd
9403
+ }));
9385
9404
  return () => {
9386
9405
  var _a2, _b, _c, _d, _e, _f;
9387
9406
  return vue.createVNode("div", {
@@ -9391,31 +9410,18 @@ ${$(r2)}`), n2;
9391
9410
  "class": getCls("prefix-area")
9392
9411
  }, [vue.createVNode("span", {
9393
9412
  "class": getCls("prefix-area--text")
9394
- }, [props.prefix])]), vue.createVNode("input", vue.mergeProps(inputAttrs, {
9395
- "class": `${inputClsPrefix}--text`,
9396
- "value": props.modelValue,
9413
+ }, [props.prefix])]), isTextArea.value ? vue.createVNode("textarea", vue.mergeProps(inputAttrs, bindProps.value, {
9414
+ "rows": props.rows
9415
+ }), null) : vue.createVNode("input", vue.mergeProps(inputAttrs, {
9416
+ "class": `${inputClsPrefix.value}--text`,
9397
9417
  "type": pwdVisible.value && props.type === "password" ? "text" : props.type,
9398
- "maxlength": props.maxlength,
9399
9418
  "step": props.step,
9400
9419
  "max": props.max,
9401
- "min": props.min,
9402
- "placeholder": props.placeholder,
9403
- "readonly": props.readonly,
9404
- "disabled": props.disabled,
9405
- "onInput": handleInput,
9406
- "onFocus": handleFocus,
9407
- "onBlur": handleBlur,
9408
- "onPaste": handlePaste,
9409
- "onChange": handleChange,
9410
- "onKeypress": handleKeyPress,
9411
- "onKeydown": handleKeydown,
9412
- "onKeyup": handleKeyup,
9413
- "onCompositionstart": handleCompositionStart,
9414
- "onCompositionend": handleCompositionEnd
9415
- }), null), props.clearable && !!props.modelValue && vue.createVNode(close$1, {
9420
+ "min": props.min
9421
+ }, bindProps.value), null), !isTextArea.value && props.clearable && !!props.modelValue && vue.createVNode(close$1, {
9416
9422
  "onClick": clear,
9417
9423
  "class": clearCls.value
9418
- }, null), suffixIcon.value, typeof props.maxlength === "number" && props.showWordLimit && vue.createVNode("p", {
9424
+ }, null), suffixIcon.value, typeof props.maxlength === "number" && (props.showWordLimit || isTextArea.value) && vue.createVNode("p", {
9419
9425
  "class": getCls("max-length")
9420
9426
  }, [props.modelValue.toString().length, vue.createTextVNode("/"), vue.createVNode("span", null, [ceilMaxLength.value])]), isNumberInput.value && props.showControl && vue.createVNode("div", {
9421
9427
  "class": getCls("number-control")
@@ -12490,7 +12496,7 @@ ${$(r2)}`), n2;
12490
12496
  const {
12491
12497
  width
12492
12498
  } = root.getBoundingClientRect() || {};
12493
- let avgWidth = width;
12499
+ let avgWidth = width - 4;
12494
12500
  const avgColIndexList = [];
12495
12501
  const resolveColNumberWidth = (col, numWidth, resetAvgWidth = true) => {
12496
12502
  Object.assign(col, {
@@ -12574,11 +12580,13 @@ ${$(r2)}`), n2;
12574
12580
  };
12575
12581
  class TableRender {
12576
12582
  constructor(props, ctx, reactiveProp, colgroups) {
12583
+ __publicField(this, "getColumnClass", (colIndex) => `${this.uuid}-column-${colIndex}`);
12577
12584
  this.props = props;
12578
12585
  this.context = ctx;
12579
12586
  this.reactiveProp = reactiveProp;
12580
12587
  this.colgroups = colgroups;
12581
12588
  this.plugins = new TablePlugins(props, ctx);
12589
+ this.uuid = random(8);
12582
12590
  }
12583
12591
  get propActiveCols() {
12584
12592
  return this.reactiveProp.activeColumns;
@@ -12660,12 +12668,13 @@ ${$(r2)}`), n2;
12660
12668
  "style": rowStyle,
12661
12669
  "onClick": (e) => this.handleRowClick(e, row, index, rows),
12662
12670
  "onDblclick": (e) => this.handleRowDblClick(e, row, index, rows)
12663
- }, [this.props.columns.map((column) => vue.createVNode("td", {
12671
+ }, [this.props.columns.map((column, index2) => vue.createVNode("td", {
12672
+ "class": this.getColumnClass(index2),
12664
12673
  "colspan": 1,
12665
12674
  "rowspan": 1
12666
12675
  }, [vue.createVNode("div", {
12667
12676
  "class": "cell"
12668
- }, [this.renderCell(row, column, index, rows)])]))]);
12677
+ }, [this.renderCell(row, column, index2, rows)])]))]);
12669
12678
  })]);
12670
12679
  }
12671
12680
  handleRowClick(e, row, index, rows) {
@@ -12689,12 +12698,10 @@ ${$(r2)}`), n2;
12689
12698
  const colCls = classes({
12690
12699
  active: this.isColActive(index)
12691
12700
  });
12692
- const colStyle = {
12693
- width: resolveWidth(column.calcWidth)
12694
- };
12701
+ const width = `${resolveWidth(column.calcWidth)}`.replace(/px$/i, "");
12695
12702
  return vue.createVNode("col", {
12696
12703
  "class": colCls,
12697
- "style": colStyle
12704
+ "width": width
12698
12705
  }, null);
12699
12706
  })]);
12700
12707
  }
@@ -20092,6 +20099,125 @@ ${$(r2)}`), n2;
20092
20099
  }
20093
20100
  });
20094
20101
  const BkForm = withInstallProps(Form, { FormItem });
20102
+ var Dropdown = vue.defineComponent({
20103
+ name: "BkDropdown",
20104
+ props: {
20105
+ isShow: PropTypes.bool.def(false),
20106
+ placement: PropTypes.commonType(["auto", "auto-start", "auto-end", "top", "right", "bottom", "left", "top-start", "top-end", "bottom-start", "bottom-end", "right-start", "right-end", "left-start", "left-end"], "placement").def("bottom"),
20107
+ trigger: PropTypes.commonType(["hover", "click", "manual"], "trigger").def("hover"),
20108
+ disabled: PropTypes.bool.def(false),
20109
+ extCls: PropTypes.string
20110
+ },
20111
+ emits: ["showChange"],
20112
+ setup(props, {
20113
+ emit
20114
+ }) {
20115
+ let popoverInstance = /* @__PURE__ */ Object.create(null);
20116
+ const reference2 = vue.ref(null);
20117
+ const refContent = vue.ref(null);
20118
+ vue.onMounted(() => {
20119
+ registerDropdown();
20120
+ });
20121
+ vue.onBeforeUnmount(() => {
20122
+ destoryDropdown();
20123
+ });
20124
+ vue.watch(() => props.isShow, (val) => {
20125
+ vue.nextTick(() => {
20126
+ if (props.trigger === "manual" && popoverInstance && !props.disabled) {
20127
+ val ? popoverInstance.show() : popoverInstance.hide();
20128
+ }
20129
+ });
20130
+ });
20131
+ vue.watch(() => props.disabled, (val) => handleUpdateDisabled(val));
20132
+ const registerDropdown = () => {
20133
+ if (props.disabled)
20134
+ return;
20135
+ popoverInstance = new BKPopover(reference2.value, refContent.value, {
20136
+ placement: props.placement,
20137
+ trigger: props.trigger
20138
+ });
20139
+ props.trigger === "manual" && props.isShow && popoverInstance.show();
20140
+ };
20141
+ const destoryDropdown = () => {
20142
+ if (popoverInstance) {
20143
+ const instance = popoverInstance;
20144
+ instance.isShow && instance.hide();
20145
+ instance.destroy();
20146
+ popoverInstance = null;
20147
+ props.trigger === "manual" && emit("showChange", false);
20148
+ }
20149
+ };
20150
+ const handleUpdateDisabled = (val) => {
20151
+ const instance = popoverInstance;
20152
+ props.trigger === "manual" && !val && emit("showChange", false);
20153
+ instance.updateDisabled(val);
20154
+ };
20155
+ return {
20156
+ reference: reference2,
20157
+ refContent
20158
+ };
20159
+ },
20160
+ render() {
20161
+ var _a, _b, _c, _d;
20162
+ const wrapperClasses = classes({
20163
+ "bk-dropdown": true
20164
+ }, this.$props.extCls);
20165
+ return vue.createVNode("div", {
20166
+ "class": wrapperClasses
20167
+ }, [vue.createVNode("div", {
20168
+ "ref": "reference",
20169
+ "class": "bk-dropdown-reference"
20170
+ }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)]), vue.createVNode("div", {
20171
+ "ref": "refContent",
20172
+ "class": "bk-dropdown-content"
20173
+ }, [(_d = (_c = this.$slots).content) == null ? void 0 : _d.call(_c)])]);
20174
+ }
20175
+ });
20176
+ var DropdownItem = vue.defineComponent({
20177
+ name: "BkDropdownItem",
20178
+ props: {
20179
+ extCls: PropTypes.string
20180
+ },
20181
+ emits: ["click"],
20182
+ setup(props, {
20183
+ emit
20184
+ }) {
20185
+ const handleClick = (evt) => {
20186
+ emit("click", evt);
20187
+ };
20188
+ const wrapperCLasses = vue.computed(() => ["bk-dropdown-item", props.extCls]);
20189
+ return {
20190
+ wrapperCLasses,
20191
+ handleClick
20192
+ };
20193
+ },
20194
+ render() {
20195
+ var _a, _b;
20196
+ return vue.createVNode("li", {
20197
+ "class": this.wrapperCLasses,
20198
+ "onClick": this.handleClick
20199
+ }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)]);
20200
+ }
20201
+ });
20202
+ var DropdownMenu = vue.defineComponent({
20203
+ name: "BkDropdownMenu",
20204
+ props: {
20205
+ extCls: PropTypes.string
20206
+ },
20207
+ setup(props) {
20208
+ const wrapperCLasses = vue.computed(() => ["bk-dropdown-menu", props.extCls]);
20209
+ return {
20210
+ wrapperCLasses
20211
+ };
20212
+ },
20213
+ render() {
20214
+ var _a, _b;
20215
+ return vue.createVNode("ul", {
20216
+ "class": this.wrapperCLasses
20217
+ }, [(_b = (_a = this.$slots).default) == null ? void 0 : _b.call(_a)]);
20218
+ }
20219
+ });
20220
+ const BkDropdown = withInstallProps(Dropdown, { DropdownMenu, DropdownItem });
20095
20221
  var components = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
20096
20222
  __proto__: null,
20097
20223
  Alert: BkAlert,
@@ -20141,7 +20267,11 @@ ${$(r2)}`), n2;
20141
20267
  Tree: BkTree,
20142
20268
  VirtualRender: BkVirtualRender,
20143
20269
  Form: BkForm,
20144
- FormItem
20270
+ FormItem,
20271
+ Pagination: BkPagination,
20272
+ Dropdown: BkDropdown,
20273
+ DropdownMenu,
20274
+ DropdownItem
20145
20275
  }, Symbol.toStringTag, { value: "Module" }));
20146
20276
  const createInstall = (prefix = "Bk") => (app) => {
20147
20277
  const pre = app.config.globalProperties.bkUIPrefix || prefix;
@@ -20176,6 +20306,9 @@ ${$(r2)}`), n2;
20176
20306
  exports2.DatePicker = BkDatePicker;
20177
20307
  exports2.Dialog = BkDialog;
20178
20308
  exports2.Divider = BkDivider;
20309
+ exports2.Dropdown = BkDropdown;
20310
+ exports2.DropdownItem = DropdownItem;
20311
+ exports2.DropdownMenu = DropdownMenu;
20179
20312
  exports2.Exception = BkException;
20180
20313
  exports2.FixedNavbar = BkFixedNavbar;
20181
20314
  exports2.Form = BkForm;
@@ -20188,6 +20321,7 @@ ${$(r2)}`), n2;
20188
20321
  exports2.Modal = BkModal;
20189
20322
  exports2.Navigation = Navigation;
20190
20323
  exports2.Notify = Notify;
20324
+ exports2.Pagination = BkPagination;
20191
20325
  exports2.Popover = BkPopover;
20192
20326
  exports2.Progress = BkProgress;
20193
20327
  exports2.Radio = BkRadio;
package/dist/style.css CHANGED
@@ -789,7 +789,10 @@ optgroup {
789
789
  border-color: #dcdee5;
790
790
  }
791
791
  .bk-button.is-text {
792
+ height: auto;
792
793
  font-size: 14px;
794
+ font-size: inherit;
795
+ line-height: 1;
793
796
  color: #63656e;
794
797
  text-decoration: none;
795
798
  cursor: pointer;
@@ -1159,6 +1162,35 @@ optgroup {
1159
1162
  .bk-fade-transtion .bk-fade-leave-to {
1160
1163
  opacity: 0;
1161
1164
  }
1165
+ .bk-textarea {
1166
+ width: 100%;
1167
+ min-height: 70px;
1168
+ font-size: 12px;
1169
+ line-height: 20px;
1170
+ background-color: white;
1171
+ border: 1px solid #c4c6cc;
1172
+ border-radius: 2px;
1173
+ box-sizing: border-box;
1174
+ transition: all 0.3s;
1175
+ }
1176
+ .bk-textarea > textarea {
1177
+ width: 100%;
1178
+ padding: 5px 10px;
1179
+ line-height: 1.5;
1180
+ text-align: left;
1181
+ vertical-align: middle;
1182
+ border: 0;
1183
+ outline: none;
1184
+ resize: none;
1185
+ }
1186
+ .bk-textarea--max-length {
1187
+ align-self: center;
1188
+ padding-right: 10px;
1189
+ margin: 0;
1190
+ }
1191
+ .bk-textarea--max-length span {
1192
+ color: #979ba5;
1193
+ }
1162
1194
  .bk-input {
1163
1195
  display: flex;
1164
1196
  align-items: stretch;
@@ -1188,12 +1220,24 @@ optgroup {
1188
1220
  }
1189
1221
  .bk-input--large {
1190
1222
  height: 38px;
1223
+ font-size: 14px;
1224
+ }
1225
+ .bk-input--large--max-length {
1191
1226
  font-size: 16px;
1192
1227
  }
1193
1228
  .bk-input--small {
1194
1229
  height: 26px;
1195
1230
  font-size: 12px;
1196
1231
  }
1232
+ .bk-input--small--max-length {
1233
+ font-size: 12px;
1234
+ }
1235
+ .bk-input--default {
1236
+ font-size: 12px;
1237
+ }
1238
+ .bk-input--default--max-length {
1239
+ font-size: 12px;
1240
+ }
1197
1241
  .bk-input.is-focused:not(.is-readonly) {
1198
1242
  border-color: #3a84ff;
1199
1243
  outline: 0;
@@ -1231,7 +1275,6 @@ optgroup {
1231
1275
  }
1232
1276
  .bk-input--text {
1233
1277
  padding: 0 10px;
1234
- font-size: 12px;
1235
1278
  line-height: 1;
1236
1279
  color: #63656e;
1237
1280
  background-color: white;
@@ -2763,6 +2806,7 @@ optgroup {
2763
2806
  .bk-table .bk-table-body table {
2764
2807
  width: 100%;
2765
2808
  border-collapse: collapse;
2809
+ table-layout: fixed;
2766
2810
  }
2767
2811
  .bk-table .bk-table-head table th,
2768
2812
  .bk-table .bk-table-body table th,
@@ -2774,7 +2818,6 @@ optgroup {
2774
2818
  .bk-table .bk-table-body table th .cell,
2775
2819
  .bk-table .bk-table-head table td .cell,
2776
2820
  .bk-table .bk-table-body table td .cell {
2777
- height: var(--row-height);
2778
2821
  padding: 0 15px;
2779
2822
  overflow: hidden;
2780
2823
  line-height: var(--row-height);
@@ -2804,23 +2847,24 @@ optgroup {
2804
2847
  .bk-table .bk-table-footer {
2805
2848
  line-height: 40px;
2806
2849
  }
2807
- .bk-table.bordered-row .cell {
2850
+ .bk-table.bordered-row td,
2851
+ .bk-table.bordered-row th {
2808
2852
  border-bottom: 1px solid #dcdee5;
2809
2853
  }
2810
2854
  .bk-table.bordered-outer {
2811
2855
  border-right: 1px solid #dcdee5;
2812
2856
  border-left: 1px solid #dcdee5;
2813
2857
  }
2814
- .bk-table.bordered-col th .cell,
2815
- .bk-table.bordered-col td .cell {
2858
+ .bk-table.bordered-col th,
2859
+ .bk-table.bordered-col td {
2816
2860
  border-right: 1px solid #dcdee5;
2817
2861
  }
2818
- .bk-table.bordered-col th:last-child .cell,
2819
- .bk-table.bordered-col td:last-child .cell {
2862
+ .bk-table.bordered-col th:last-child,
2863
+ .bk-table.bordered-col td:last-child {
2820
2864
  border-right: none;
2821
2865
  }
2822
- .bk-table.bordered-none th .cell,
2823
- .bk-table.bordered-none td .cell {
2866
+ .bk-table.bordered-none th,
2867
+ .bk-table.bordered-none td {
2824
2868
  border-top: none;
2825
2869
  border-right: none;
2826
2870
  border-bottom: none;
@@ -4689,23 +4733,16 @@ span.bk-date-picker-cells-cell-disabled.bk-date-picker-cells-cell-selected em {
4689
4733
  scrollbar-width: thin;
4690
4734
  }
4691
4735
  .bk-virtual-render.bk-scroll-x::-webkit-scrollbar {
4692
- height: 8px;
4693
- background-color: transparent;
4694
- }
4695
- .bk-virtual-render.bk-scroll-x::-webkit-scrollbar-thumb {
4696
- background-color: #a0a0a0;
4697
- border-radius: 8px;
4736
+ height: 6px;
4698
4737
  }
4699
4738
  .bk-virtual-render.bk-scroll-y {
4700
4739
  overflow-y: auto;
4701
4740
  }
4702
4741
  .bk-virtual-render.bk-scroll-y::-webkit-scrollbar {
4703
- width: 6px;
4704
- background-color: transparent;
4742
+ width: 4px;
4705
4743
  }
4706
4744
  .bk-virtual-render.bk-scroll-y::-webkit-scrollbar-thumb {
4707
- background-color: #dcdee5;
4708
- border-radius: 6px;
4745
+ border-radius: 4px;
4709
4746
  }
4710
4747
  /* 边框色 */
4711
4748
  /* 按钮、表单边框颜色、禁用时文本颜色 */
@@ -210,7 +210,10 @@
210
210
  border-color: #dcdee5;
211
211
  }
212
212
  .bk-button.is-text {
213
+ height: auto;
213
214
  font-size: 14px;
215
+ font-size: inherit;
216
+ line-height: 1;
214
217
  color: #63656e;
215
218
  text-decoration: none;
216
219
  cursor: pointer;
@@ -127,7 +127,10 @@
127
127
  }
128
128
 
129
129
  &.is-text {
130
+ height: auto;
130
131
  font-size: @font-size-medium;
132
+ font-size: inherit;
133
+ line-height: 1;
131
134
  color: @default-color;
132
135
  text-decoration: none;
133
136
  cursor: pointer;
@@ -303,7 +303,10 @@
303
303
  border-color: var(--disable-color);
304
304
  }
305
305
  .bk-button.is-text {
306
+ height: auto;
306
307
  font-size: var(--font-size-medium);
308
+ font-size: inherit;
309
+ line-height: 1;
307
310
  color: var(--default-color);
308
311
  text-decoration: none;
309
312
  cursor: pointer;
@@ -37,3 +37,5 @@ export { default as Transfer } from './transfer';
37
37
  export { default as Tree } from './tree';
38
38
  export { default as VirtualRender } from './virtual-render';
39
39
  export { default as Form, BkFormItem as FormItem } from './form';
40
+ export { default as Pagination } from './pagination';
41
+ export { default as Dropdown, BkDropdownMenu as DropdownMenu, BkDropdownItem as DropdownItem } from './dropdown';
@@ -8,6 +8,7 @@ declare const BkInput: {
8
8
  prefix: string;
9
9
  step: number;
10
10
  disabled: boolean;
11
+ modelValue: string | number;
11
12
  readonly: boolean;
12
13
  clearable: boolean;
13
14
  behavior: string;
@@ -21,6 +22,7 @@ declare const BkInput: {
21
22
  showControl: boolean;
22
23
  showClearOnlyHover: boolean;
23
24
  precision: number;
25
+ rows: number;
24
26
  }> & Omit<Readonly<import("vue").ExtractPropTypes<{
25
27
  type: import("vue-types").VueTypeValidableDef<string> & {
26
28
  default: string;
@@ -86,8 +88,13 @@ declare const BkInput: {
86
88
  } & {
87
89
  validator: import("vue-types/dist/types").ValidatorFunction<unknown>;
88
90
  };
89
- modelValue: import("vue-types").VueTypeDef<string | number>;
91
+ modelValue: import("vue-types").VueTypeDef<string | number> & {
92
+ default: string | number;
93
+ };
90
94
  size: import("vue-types").VueTypeDef<string>;
95
+ rows: import("vue-types").VueTypeValidableDef<number> & {
96
+ default: number;
97
+ };
91
98
  }>> & {
92
99
  onPaste?: (...args: any[]) => any;
93
100
  onFocus?: (...args: any[]) => any;
@@ -100,7 +107,7 @@ declare const BkInput: {
100
107
  "onUpdate:modelValue"?: (...args: any[]) => any;
101
108
  onClear?: (...args: any[]) => any;
102
109
  onEnter?: (...args: any[]) => any;
103
- } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "type" | "placeholder" | "prefix" | "step" | "disabled" | "readonly" | "clearable" | "behavior" | "max" | "min" | "maxlength" | "prefixIcon" | "suffixIcon" | "suffix" | "showWordLimit" | "showControl" | "showClearOnlyHover" | "precision">;
110
+ } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "type" | "placeholder" | "prefix" | "step" | "disabled" | "modelValue" | "readonly" | "clearable" | "behavior" | "max" | "min" | "maxlength" | "prefixIcon" | "suffixIcon" | "suffix" | "showWordLimit" | "showControl" | "showClearOnlyHover" | "precision" | "rows">;
104
111
  $attrs: {
105
112
  [x: string]: unknown;
106
113
  };
@@ -179,8 +186,13 @@ declare const BkInput: {
179
186
  } & {
180
187
  validator: import("vue-types/dist/types").ValidatorFunction<unknown>;
181
188
  };
182
- modelValue: import("vue-types").VueTypeDef<string | number>;
189
+ modelValue: import("vue-types").VueTypeDef<string | number> & {
190
+ default: string | number;
191
+ };
183
192
  size: import("vue-types").VueTypeDef<string>;
193
+ rows: import("vue-types").VueTypeValidableDef<number> & {
194
+ default: number;
195
+ };
184
196
  }>> & {
185
197
  onPaste?: (...args: any[]) => any;
186
198
  onFocus?: (...args: any[]) => any;
@@ -199,6 +211,7 @@ declare const BkInput: {
199
211
  prefix: string;
200
212
  step: number;
201
213
  disabled: boolean;
214
+ modelValue: string | number;
202
215
  readonly: boolean;
203
216
  clearable: boolean;
204
217
  behavior: string;
@@ -212,6 +225,7 @@ declare const BkInput: {
212
225
  showControl: boolean;
213
226
  showClearOnlyHover: boolean;
214
227
  precision: number;
228
+ rows: number;
215
229
  }> & {
216
230
  beforeCreate?: (() => void) | (() => void)[];
217
231
  created?: (() => void) | (() => void)[];
@@ -297,8 +311,13 @@ declare const BkInput: {
297
311
  } & {
298
312
  validator: import("vue-types/dist/types").ValidatorFunction<unknown>;
299
313
  };
300
- modelValue: import("vue-types").VueTypeDef<string | number>;
314
+ modelValue: import("vue-types").VueTypeDef<string | number> & {
315
+ default: string | number;
316
+ };
301
317
  size: import("vue-types").VueTypeDef<string>;
318
+ rows: import("vue-types").VueTypeValidableDef<number> & {
319
+ default: number;
320
+ };
302
321
  }>> & {
303
322
  onPaste?: (...args: any[]) => any;
304
323
  onFocus?: (...args: any[]) => any;
@@ -380,8 +399,13 @@ declare const BkInput: {
380
399
  } & {
381
400
  validator: import("vue-types/dist/types").ValidatorFunction<unknown>;
382
401
  };
383
- modelValue: import("vue-types").VueTypeDef<string | number>;
402
+ modelValue: import("vue-types").VueTypeDef<string | number> & {
403
+ default: string | number;
404
+ };
384
405
  size: import("vue-types").VueTypeDef<string>;
406
+ rows: import("vue-types").VueTypeValidableDef<number> & {
407
+ default: number;
408
+ };
385
409
  }>> & {
386
410
  onPaste?: (...args: any[]) => any;
387
411
  onFocus?: (...args: any[]) => any;
@@ -400,6 +424,7 @@ declare const BkInput: {
400
424
  prefix: string;
401
425
  step: number;
402
426
  disabled: boolean;
427
+ modelValue: string | number;
403
428
  readonly: boolean;
404
429
  clearable: boolean;
405
430
  behavior: string;
@@ -413,5 +438,6 @@ declare const BkInput: {
413
438
  showControl: boolean;
414
439
  showClearOnlyHover: boolean;
415
440
  precision: number;
441
+ rows: number;
416
442
  }> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & import("@vue/runtime-core").Plugin;
417
443
  export default BkInput;
@@ -19,6 +19,35 @@
19
19
  .bk-fade-transtion .bk-fade-leave-to {
20
20
  opacity: 0;
21
21
  }
22
+ .bk-textarea {
23
+ width: 100%;
24
+ min-height: 70px;
25
+ font-size: 12px;
26
+ line-height: 20px;
27
+ background-color: white;
28
+ border: 1px solid #c4c6cc;
29
+ border-radius: 2px;
30
+ box-sizing: border-box;
31
+ transition: all 0.3s;
32
+ }
33
+ .bk-textarea > textarea {
34
+ width: 100%;
35
+ padding: 5px 10px;
36
+ line-height: 1.5;
37
+ text-align: left;
38
+ vertical-align: middle;
39
+ border: 0;
40
+ outline: none;
41
+ resize: none;
42
+ }
43
+ .bk-textarea--max-length {
44
+ align-self: center;
45
+ padding-right: 10px;
46
+ margin: 0;
47
+ }
48
+ .bk-textarea--max-length span {
49
+ color: #979ba5;
50
+ }
22
51
  .bk-input {
23
52
  display: flex;
24
53
  align-items: stretch;
@@ -48,12 +77,24 @@
48
77
  }
49
78
  .bk-input--large {
50
79
  height: 38px;
80
+ font-size: 14px;
81
+ }
82
+ .bk-input--large--max-length {
51
83
  font-size: 16px;
52
84
  }
53
85
  .bk-input--small {
54
86
  height: 26px;
55
87
  font-size: 12px;
56
88
  }
89
+ .bk-input--small--max-length {
90
+ font-size: 12px;
91
+ }
92
+ .bk-input--default {
93
+ font-size: 12px;
94
+ }
95
+ .bk-input--default--max-length {
96
+ font-size: 12px;
97
+ }
57
98
  .bk-input.is-focused:not(.is-readonly) {
58
99
  border-color: #3a84ff;
59
100
  outline: 0;
@@ -91,7 +132,6 @@
91
132
  }
92
133
  .bk-input--text {
93
134
  padding: 0 10px;
94
- font-size: 12px;
95
135
  line-height: 1;
96
136
  color: #63656e;
97
137
  background-color: white;