element-ps 1.0.0-alpha.6 → 1.0.1

package/es/packages/components/index.mjs

@@ -0,0 +1,119 @@
+export { PsAffix } from './affix/index.mjs';
+export { PsAlert } from './alert/index.mjs';
+export { PsAutocomplete } from './autocomplete/index.mjs';
+export { PsAvatar } from './avatar/index.mjs';
+export { PsBacktop } from './backtop/index.mjs';
+export { PsBadge } from './badge/index.mjs';
+export { PsBreadcrumb, PsBreadcrumbItem } from './breadcrumb/index.mjs';
+export { PsButton, PsButtonGroup } from './button/index.mjs';
+export { PsCalendar } from './calendar/index.mjs';
+export { PsCard } from './card/index.mjs';
+export { PsCarousel, PsCarouselItem } from './carousel/index.mjs';
+export { PsCascader } from './cascader/index.mjs';
+export { PsCascaderPanel } from './cascader-panel/index.mjs';
+export { PsCheckTag } from './check-tag/index.mjs';
+export { PsCheckbox, PsCheckboxButton, PsCheckboxGroup } from './checkbox/index.mjs';
+export { PsCol } from './col/index.mjs';
+export { PsCollapse, PsCollapseItem } from './collapse/index.mjs';
+export { PsColorPicker } from './color-picker/index.mjs';
+export { PsConfigProvider } from './config-provider/index.mjs';
+export { PsAside, PsContainer, PsFooter, PsHeader, PsMain } from './container/index.mjs';
+export { PsDatePicker } from './date-picker/index.mjs';
+export { PsDescriptions, PsDescriptionsItem } from './descriptions/index.mjs';
+export { PsDialog } from './dialog/index.mjs';
+export { PsDivider } from './divider/index.mjs';
+export { PsDrawer } from './drawer/index.mjs';
+export { PsDropdown, PsDropdownItem, PsDropdownMenu } from './dropdown/index.mjs';
+export { PsEmpty } from './empty/index.mjs';
+export { PsForm, PsFormItem } from './form/index.mjs';
+export { PsIcon } from './icon/index.mjs';
+export { PsImage } from './image/index.mjs';
+export { PsImageViewer } from './image-viewer/index.mjs';
+export { PsInput } from './input/index.mjs';
+export { PsInputNumber } from './input-number/index.mjs';
+export { PsLink } from './link/index.mjs';
+export { PsMenu, PsMenuItem, PsMenuItemGroup, PsSubMenu } from './menu/index.mjs';
+export { PsOverlay } from './overlay/index.mjs';
+export { PsPageHeader } from './page-header/index.mjs';
+export { PsPagination } from './pagination/index.mjs';
+export { PsPopconfirm } from './popconfirm/index.mjs';
+export { PsPopper } from './popper/index.mjs';
+export { PsProgress } from './progress/index.mjs';
+export { PsRadio, PsRadioButton, PsRadioGroup } from './radio/index.mjs';
+export { PsRate } from './rate/index.mjs';
+export { PsResult } from './result/index.mjs';
+export { PsRow } from './row/index.mjs';
+export { PsScrollbar } from './scrollbar/index.mjs';
+export { PsOption, PsOptionGroup, PsSelect } from './select/index.mjs';
+export { PsSelectV2 } from './select-v2/index.mjs';
+export { PsSkeleton, PsSkeletonItem } from './skeleton/index.mjs';
+export { PsSlider } from './slider/index.mjs';
+export { PsSpace } from './space/index.mjs';
+export { PsStep, PsSteps } from './steps/index.mjs';
+export { PsSwitch } from './switch/index.mjs';
+export { PsTable, PsTableColumn } from './table/index.mjs';
+export { PsTabPane, PsTabs } from './tabs/index.mjs';
+export { PsTag } from './tag/index.mjs';
+export { PsText } from './text/index.mjs';
+export { PsTimePicker } from './time-picker/index.mjs';
+export { PsTimeSelect } from './time-select/index.mjs';
+export { PsTimeline, PsTimelineItem } from './timeline/index.mjs';
+export { PsTooltip } from './tooltip/index.mjs';
+export { PsTransfer } from './transfer/index.mjs';
+export { PsTree } from './tree/index.mjs';
+export { PsTreeV2 } from './tree-v2/index.mjs';
+export { PsUpload } from './upload/index.mjs';
+import './virtual-list/index.mjs';
+export { PsPopover, PsPopoverDirective } from './popover/index.mjs';
+export { affixProps } from './affix/src/affix.mjs';
+export { alertProps } from './alert/src/alert2.mjs';
+export { avatarProps } from './avatar/src/avatar.mjs';
+export { backtopProps } from './backtop/src/backtop2.mjs';
+export { badgeProps } from './badge/src/badge.mjs';
+export { breadcrumbProps } from './breadcrumb/src/breadcrumb2.mjs';
+export { breadcrumbItemProps } from './breadcrumb/src/breadcrumb-item.mjs';
+export { buttonEmits, buttonNativeType, buttonProps, buttonSize, buttonType } from './button/src/button2.mjs';
+export { cardProps } from './card/src/card.mjs';
+export { CASCADER_PANEL_INJECTION_KEY, ExpandTrigger } from './cascader-panel/src/types.mjs';
+export { CommonProps, DefaultProps, useCascaderConfig } from './cascader-panel/src/config.mjs';
+export { colProps } from './col/src/col.mjs';
+export { configProviderProps } from './config-provider/src/config-provider.mjs';
+export { useDialog } from './dialog/src/use-dialog.mjs';
+export { dialogProps } from './dialog/src/dialog.mjs';
+export { dividerProps } from './divider/src/divider.mjs';
+export { emptyProps } from './empty/src/empty2.mjs';
+export { iconProps } from './icon/src/icon.mjs';
+export { imageEmits, imageProps } from './image/src/image.mjs';
+export { imageViewerProps } from './image-viewer/src/image-viewer.mjs';
+export { inputProps } from './input/src/input.mjs';
+export { inputNumberProps } from './input-number/src/input-number.mjs';
+export { linkProps } from './link/src/link.mjs';
+export { menuEmits, menuProps } from './menu/src/menu.mjs';
+export { menuItemEmits, menuItemProps } from './menu/src/menu-item.mjs';
+export { menuItemGroupProps } from './menu/src/menu-item-group.mjs';
+export { subMenuProps } from './menu/src/sub-menu.mjs';
+export { overlayEmits, overlayProps } from './overlay/src/overlay.mjs';
+export { pageHeaderProps } from './page-header/src/page-header.mjs';
+export { paginationProps } from './pagination/src/pagination.mjs';
+export { popconfirmProps } from './popconfirm/src/popconfirm.mjs';
+export { Effect, default as popperDefaultProps } from './popper/src/use-popper/defaults.mjs';
+export { default as usePopper } from './popper/src/use-popper/index.mjs';
+export { default as renderPopper } from './popper/src/renderers/popper.mjs';
+export { default as renderTrigger } from './popper/src/renderers/trigger.mjs';
+export { default as renderArrow } from './popper/src/renderers/arrow.mjs';
+export { BAR_MAP, renderThumbStyle } from './scrollbar/src/util.mjs';
+export { selectGroupKey, selectKey } from './select/src/token.mjs';
+export { selectV2InjectionKey } from './select-v2/src/token.mjs';
+export { spaceProps } from './space/src/space.mjs';
+export { useSpace } from './space/src/use-space.mjs';
+export { tagProps } from './tag/src/tag.mjs';
+export { extractDateFormat, extractTimeFormat, rangeArr } from './time-picker/src/common/date-utils.mjs';
+export { DEFAULT_FORMATS_DATE, DEFAULT_FORMATS_DATEPICKER, DEFAULT_FORMATS_TIME } from './time-picker/src/common/constant.mjs';
+export { timePickerDefaultProps } from './time-picker/src/common/props.mjs';
+export { default as CommonPicker } from './time-picker/src/common/picker.vue_vue&type=script&lang.mjs';
+export { default as FixedSizeList } from './virtual-list/src/components/fixed-size-list.mjs';
+export { default as DynamicSizeList } from './virtual-list/src/components/dynamic-size-list.mjs';
+export { default as FixedSizeGrid } from './virtual-list/src/components/fixed-size-grid.mjs';
+export { default as DynamicSizeGrid } from './virtual-list/src/components/dynamic-size-grid.mjs';
+export { virtualizedGridProps, virtualizedListProps, virtualizedProps, virtualizedScrollbarProps } from './virtual-list/src/props.mjs';
+//# sourceMappingURL=index.mjs.map

package/es/packages/components/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/packages/components/input/index.mjs

@@ -0,0 +1,9 @@
+import { withInstall } from '../../utils/with-install.mjs';
+import './src/input2.mjs';
+export { inputProps } from './src/input.mjs';
+import script from './src/input.vue_vue&type=script&lang.mjs';
+
+const PsInput = withInstall(script);
+
+export { PsInput, PsInput as default };
+//# sourceMappingURL=index.mjs.map

package/es/packages/components/input/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.mjs","sources":["../../../../../../packages/components/input/index.ts"],"sourcesContent":["import { withInstall } from '@element-ps/utils/with-install'\n\nimport Input from './src/input.vue'\n\nexport const PsInput = withInstall(Input)\nexport default PsInput\n\nexport * from './src/input'\n"],"names":["Input"],"mappings":";;;;;MAIa,UAAU,YAAYA;;;;"}

package/es/packages/components/input/src/calc-textarea-height.mjs

@@ -0,0 +1,78 @@
+import { isNumber } from '../../../utils/util.mjs';
+
+let hiddenTextarea = void 0;
+const HIDDEN_STYLE = `
+  height:0 !important;
+  visibility:hidden !important;
+  overflow:hidden !important;
+  position:absolute !important;
+  z-index:-1000 !important;
+  top:0 !important;
+  right:0 !important;
+`;
+const CONTEXT_STYLE = [
+  "letter-spacing",
+  "line-height",
+  "padding-top",
+  "padding-bottom",
+  "font-family",
+  "font-weight",
+  "font-size",
+  "text-rendering",
+  "text-transform",
+  "width",
+  "text-indent",
+  "padding-left",
+  "padding-right",
+  "border-width",
+  "box-sizing"
+];
+function calculateNodeStyling(targetElement) {
+  const style = window.getComputedStyle(targetElement);
+  const boxSizing = style.getPropertyValue("box-sizing");
+  const paddingSize = parseFloat(style.getPropertyValue("padding-bottom")) + parseFloat(style.getPropertyValue("padding-top"));
+  const borderSize = parseFloat(style.getPropertyValue("border-bottom-width")) + parseFloat(style.getPropertyValue("border-top-width"));
+  const contextStyle = CONTEXT_STYLE.map((name) => `${name}:${style.getPropertyValue(name)}`).join(";");
+  return { contextStyle, paddingSize, borderSize, boxSizing };
+}
+function calcTextareaHeight(targetElement, minRows = 1, maxRows) {
+  var _a;
+  if (!hiddenTextarea) {
+    hiddenTextarea = document.createElement("textarea");
+    document.body.appendChild(hiddenTextarea);
+  }
+  const { paddingSize, borderSize, boxSizing, contextStyle } = calculateNodeStyling(targetElement);
+  hiddenTextarea.setAttribute("style", `${contextStyle};${HIDDEN_STYLE}`);
+  hiddenTextarea.value = targetElement.value || targetElement.placeholder || "";
+  let height = hiddenTextarea.scrollHeight;
+  const result = {};
+  if (boxSizing === "border-box") {
+    height = height + borderSize;
+  } else if (boxSizing === "content-box") {
+    height = height - paddingSize;
+  }
+  hiddenTextarea.value = "";
+  const singleRowHeight = hiddenTextarea.scrollHeight - paddingSize;
+  if (isNumber(minRows)) {
+    let minHeight = singleRowHeight * minRows;
+    if (boxSizing === "border-box") {
+      minHeight = minHeight + paddingSize + borderSize;
+    }
+    height = Math.max(minHeight, height);
+    result.minHeight = `${minHeight}px`;
+  }
+  if (isNumber(maxRows)) {
+    let maxHeight = singleRowHeight * maxRows;
+    if (boxSizing === "border-box") {
+      maxHeight = maxHeight + paddingSize + borderSize;
+    }
+    height = Math.min(maxHeight, height);
+  }
+  result.height = `${height}px`;
+  (_a = hiddenTextarea.parentNode) == null ? void 0 : _a.removeChild(hiddenTextarea);
+  hiddenTextarea = void 0;
+  return result;
+}
+
+export { calcTextareaHeight };
+//# sourceMappingURL=calc-textarea-height.mjs.map

package/es/packages/components/input/src/calc-textarea-height.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"calc-textarea-height.mjs","sources":["../../../../../../../packages/components/input/src/calc-textarea-height.ts"],"sourcesContent":["import { isNumber } from '@element-ps/utils/util'\n\nlet hiddenTextarea: HTMLTextAreaElement | undefined = undefined\n\nconst HIDDEN_STYLE = `\n  height:0 !important;\n  visibility:hidden !important;\n  overflow:hidden !important;\n  position:absolute !important;\n  z-index:-1000 !important;\n  top:0 !important;\n  right:0 !important;\n`\n\nconst CONTEXT_STYLE = [\n  'letter-spacing',\n  'line-height',\n  'padding-top',\n  'padding-bottom',\n  'font-family',\n  'font-weight',\n  'font-size',\n  'text-rendering',\n  'text-transform',\n  'width',\n  'text-indent',\n  'padding-left',\n  'padding-right',\n  'border-width',\n  'box-sizing',\n]\n\ntype NodeStyle = {\n  contextStyle: string\n  boxSizing: string\n  paddingSize: number\n  borderSize: number\n}\n\ntype TextAreaHeight = {\n  height: string\n  minHeight?: string\n}\n\nfunction calculateNodeStyling(targetElement: Element): NodeStyle {\n  const style = window.getComputedStyle(targetElement)\n\n  const boxSizing = style.getPropertyValue('box-sizing')\n\n  const paddingSize =\n    parseFloat(style.getPropertyValue('padding-bottom')) +\n    parseFloat(style.getPropertyValue('padding-top'))\n\n  const borderSize =\n    parseFloat(style.getPropertyValue('border-bottom-width')) +\n    parseFloat(style.getPropertyValue('border-top-width'))\n\n  const contextStyle = CONTEXT_STYLE.map(\n    (name) => `${name}:${style.getPropertyValue(name)}`\n  ).join(';')\n\n  return { contextStyle, paddingSize, borderSize, boxSizing }\n}\n\nexport function calcTextareaHeight(\n  targetElement: HTMLTextAreaElement,\n  minRows = 1,\n  maxRows?: number\n): TextAreaHeight {\n  if (!hiddenTextarea) {\n    hiddenTextarea = document.createElement('textarea')\n    document.body.appendChild(hiddenTextarea)\n  }\n\n  const { paddingSize, borderSize, boxSizing, contextStyle } =\n    calculateNodeStyling(targetElement)\n\n  hiddenTextarea.setAttribute('style', `${contextStyle};${HIDDEN_STYLE}`)\n  hiddenTextarea.value = targetElement.value || targetElement.placeholder || ''\n\n  let height = hiddenTextarea.scrollHeight\n  const result = {} as TextAreaHeight\n\n  if (boxSizing === 'border-box') {\n    height = height + borderSize\n  } else if (boxSizing === 'content-box') {\n    height = height - paddingSize\n  }\n\n  hiddenTextarea.value = ''\n  const singleRowHeight = hiddenTextarea.scrollHeight - paddingSize\n\n  if (isNumber(minRows)) {\n    let minHeight = singleRowHeight * minRows\n    if (boxSizing === 'border-box') {\n      minHeight = minHeight + paddingSize + borderSize\n    }\n    height = Math.max(minHeight, height)\n    result.minHeight = `${minHeight}px`\n  }\n  if (isNumber(maxRows)) {\n    let maxHeight = singleRowHeight * maxRows\n    if (boxSizing === 'border-box') {\n      maxHeight = maxHeight + paddingSize + borderSize\n    }\n    height = Math.min(maxHeight, height)\n  }\n  result.height = `${height}px`\n  hiddenTextarea.parentNode?.removeChild(hiddenTextarea)\n  hiddenTextarea = undefined\n\n  return result\n}\n"],"names":[],"mappings":";;AAEA,IAAI,iBAAkD;AAEtD,MAAM,eAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAUrB,MAAM,gBAAgB;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA;AAeF,8BAA8B,eAAmC;AAC/D,QAAM,QAAQ,OAAO,iBAAiB;AAEtC,QAAM,YAAY,MAAM,iBAAiB;AAEzC,QAAM,cACJ,WAAW,MAAM,iBAAiB,qBAClC,WAAW,MAAM,iBAAiB;AAEpC,QAAM,aACJ,WAAW,MAAM,iBAAiB,0BAClC,WAAW,MAAM,iBAAiB;AAEpC,QAAM,eAAe,cAAc,IACjC,CAAC,SAAS,GAAG,QAAQ,MAAM,iBAAiB,SAC5C,KAAK;AAEP,SAAO,EAAE,cAAc,aAAa,YAAY;AAAA;4BAIhD,eACA,UAAU,GACV,SACgB;AApElB;AAqEE,MAAI,CAAC,gBAAgB;AACnB,qBAAiB,SAAS,cAAc;AACxC,aAAS,KAAK,YAAY;AAAA;AAG5B,QAAM,EAAE,aAAa,YAAY,WAAW,iBAC1C,qBAAqB;AAEvB,iBAAe,aAAa,SAAS,GAAG,gBAAgB;AACxD,iBAAe,QAAQ,cAAc,SAAS,cAAc,eAAe;AAE3E,MAAI,SAAS,eAAe;AAC5B,QAAM,SAAS;AAEf,MAAI,cAAc,cAAc;AAC9B,aAAS,SAAS;AAAA,aACT,cAAc,eAAe;AACtC,aAAS,SAAS;AAAA;AAGpB,iBAAe,QAAQ;AACvB,QAAM,kBAAkB,eAAe,eAAe;AAEtD,MAAI,SAAS,UAAU;AACrB,QAAI,YAAY,kBAAkB;AAClC,QAAI,cAAc,cAAc;AAC9B,kBAAY,YAAY,cAAc;AAAA;AAExC,aAAS,KAAK,IAAI,WAAW;AAC7B,WAAO,YAAY,GAAG;AAAA;AAExB,MAAI,SAAS,UAAU;AACrB,QAAI,YAAY,kBAAkB;AAClC,QAAI,cAAc,cAAc;AAC9B,kBAAY,YAAY,cAAc;AAAA;AAExC,aAAS,KAAK,IAAI,WAAW;AAAA;AAE/B,SAAO,SAAS,GAAG;AACnB,uBAAe,eAAf,mBAA2B,YAAY;AACvC,mBAAiB;AAEjB,SAAO;AAAA;;;;"}

package/es/packages/components/input/src/input.mjs

@@ -0,0 +1,78 @@
+import '../../../hooks/index.mjs';
+import { buildProps, definePropType, mutable } from '../../../utils/props.mjs';
+import { useFormItemProps } from '../../../hooks/use-form-item/index.mjs';
+
+const inputProps = buildProps({
+  ...useFormItemProps,
+  modelValue: {
+    type: definePropType(void 0),
+    default: ""
+  },
+  type: {
+    type: String,
+    default: "text"
+  },
+  resize: {
+    type: String,
+    values: ["none", "both", "horizontal", "vertical"]
+  },
+  autosize: {
+    type: definePropType([Boolean, Object]),
+    default: false
+  },
+  autocomplete: {
+    type: String,
+    default: "off"
+  },
+  placeholder: {
+    type: String
+  },
+  form: {
+    type: String,
+    default: ""
+  },
+  readonly: {
+    type: Boolean,
+    default: false
+  },
+  clearable: {
+    type: Boolean,
+    default: false
+  },
+  showPassword: {
+    type: Boolean,
+    default: false
+  },
+  showWordLimit: {
+    type: Boolean,
+    default: false
+  },
+  suffixIcon: {
+    type: definePropType([String, Object]),
+    default: ""
+  },
+  prefixIcon: {
+    type: definePropType([String, Object]),
+    default: ""
+  },
+  label: {
+    type: String
+  },
+  tabindex: {
+    type: [Number, String]
+  },
+  validateEvent: {
+    type: Boolean,
+    default: true
+  },
+  inputStyle: {
+    type: definePropType([Object, Array, String]),
+    default: () => mutable({})
+  },
+  maxlength: {
+    type: [Number, String]
+  }
+});
+
+export { inputProps };
+//# sourceMappingURL=input.mjs.map

package/es/packages/components/input/src/input.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.mjs","sources":["../../../../../../../packages/components/input/src/input.ts"],"sourcesContent":["import { useFormItemProps } from '@element-ps/hooks'\nimport { buildProps, definePropType, mutable } from '@element-ps/utils/props'\nimport type { StyleValue } from '@element-ps/utils/types'\nimport type { ExtractPropTypes, Component } from 'vue'\n\ntype AutoSize = { minRows?: number; maxRows?: number } | boolean\n\nexport const inputProps = buildProps({\n  ...useFormItemProps,\n  modelValue: {\n    type: definePropType<string | number | null | undefined>(undefined),\n    default: '',\n  },\n  type: {\n    type: String,\n    default: 'text',\n  },\n  resize: {\n    type: String,\n    values: ['none', 'both', 'horizontal', 'vertical'],\n  },\n  autosize: {\n    type: definePropType<AutoSize>([Boolean, Object]),\n    default: false,\n  },\n  autocomplete: {\n    type: String,\n    default: 'off',\n  },\n  placeholder: {\n    type: String,\n  },\n  form: {\n    type: String,\n    default: '',\n  },\n  readonly: {\n    type: Boolean,\n    default: false,\n  },\n  clearable: {\n    type: Boolean,\n    default: false,\n  },\n  showPassword: {\n    type: Boolean,\n    default: false,\n  },\n  showWordLimit: {\n    type: Boolean,\n    default: false,\n  },\n  suffixIcon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: '',\n  },\n  prefixIcon: {\n    type: definePropType<string | Component>([String, Object]),\n    default: '',\n  },\n  label: {\n    type: String,\n  },\n  tabindex: {\n    type: [Number, String],\n  },\n  validateEvent: {\n    type: Boolean,\n    default: true,\n  },\n  inputStyle: {\n    type: definePropType<StyleValue>([Object, Array, String]),\n    default: () => mutable({} as const),\n  },\n  maxlength: {\n    type: [Number, String],\n  },\n} as const)\nexport type InputProps = ExtractPropTypes<typeof inputProps>\n"],"names":[],"mappings":";;;;MAOa,aAAa,WAAW;AAAA,KAChC;AAAA,EACH,YAAY;AAAA,IACV,MAAM,eAAmD;AAAA,IACzD,SAAS;AAAA;AAAA,EAEX,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,QAAQ,CAAC,QAAQ,QAAQ,cAAc;AAAA;AAAA,EAEzC,UAAU;AAAA,IACR,MAAM,eAAyB,CAAC,SAAS;AAAA,IACzC,SAAS;AAAA;AAAA,EAEX,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,aAAa;AAAA,IACX,MAAM;AAAA;AAAA,EAER,MAAM;AAAA,IACJ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,UAAU;AAAA,IACR,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,WAAW;AAAA,IACT,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,eAAe;AAAA,IACb,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,IACV,MAAM,eAAmC,CAAC,QAAQ;AAAA,IAClD,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,IACV,MAAM,eAAmC,CAAC,QAAQ;AAAA,IAClD,SAAS;AAAA;AAAA,EAEX,OAAO;AAAA,IACL,MAAM;AAAA;AAAA,EAER,UAAU;AAAA,IACR,MAAM,CAAC,QAAQ;AAAA;AAAA,EAEjB,eAAe;AAAA,IACb,MAAM;AAAA,IACN,SAAS;AAAA;AAAA,EAEX,YAAY;AAAA,IACV,MAAM,eAA2B,CAAC,QAAQ,OAAO;AAAA,IACjD,SAAS,MAAM,QAAQ;AAAA;AAAA,EAEzB,WAAW;AAAA,IACT,MAAM,CAAC,QAAQ;AAAA;AAAA;;;;"}

package/es/packages/components/input/src/input.vue_vue&type=script&lang.mjs

@@ -0,0 +1,145 @@
+import { defineComponent, getCurrentInstance, inject, ref, shallowRef, computed, watch, nextTick, onMounted, onUpdated } from 'vue';
+import '../../../tokens/index.mjs';
+import '../../../hooks/index.mjs';
+import { VALIDATE_STATE_MAP } from '../../../utils/constants.mjs';
+import '../../../utils/util.mjs';
+import isServer from '../../../utils/isServer.mjs';
+import { calcTextareaHeight } from './calc-textarea-height.mjs';
+import { inputProps } from './input.mjs';
+import { PsIcon } from '../../icon/index.mjs';
+import { CircleClose, View } from '@element-plus/icons';
+import useAttrs from '../../../hooks/use-attrs/index.mjs';
+import { elFormKey, elFormItemKey } from '../../../tokens/form.mjs';
+import { useFormItem } from '../../../hooks/use-form-item/index.mjs';
+import { isObject } from '@vue/shared';
+
+const PENDANT_MAP = {
+  suffix: "append",
+  prefix: "prepend"
+};
+var script = defineComponent({
+  name: "PsInput",
+  inheritAttrs: false,
+  components: { PsIcon, CircleClose, IconView: View },
+  props: inputProps,
+  setup(props, { slots, attrs: rawAttrs }) {
+    const instance = getCurrentInstance();
+    const attrs = useAttrs();
+    const elForm = inject(elFormKey, void 0);
+    const elFormItem = inject(elFormItemKey, void 0);
+    const { size: inputSize, disabled: inputDisabled } = useFormItem({});
+    const input = ref();
+    const textarea = ref();
+    const focused = ref(false);
+    const hovering = ref(false);
+    const passwordVisible = ref(false);
+    const _textareaCalcStyle = shallowRef(props.inputStyle);
+    const inputOrTextarea = computed(() => input.value || textarea.value);
+    const needStatusIcon = computed(() => {
+      var _a;
+      return (_a = elForm == null ? void 0 : elForm.statusIcon) != null ? _a : false;
+    });
+    const validateState = computed(() => (elFormItem == null ? void 0 : elFormItem.validateState) || "");
+    const validateIcon = computed(() => VALIDATE_STATE_MAP[validateState.value]);
+    const containerStyle = computed(() => rawAttrs.style);
+    const computedTextareaStyle = computed(() => [
+      props.inputStyle,
+      _textareaCalcStyle.value,
+      { resize: props.resize }
+    ]);
+    const nativeInputValue = computed(() => props.modelValue === null || props.modelValue === void 0 ? "" : String(props.modelValue));
+    const showClear = computed(() => props.clearable && !inputDisabled.value && !props.readonly && !!nativeInputValue.value && (focused.value || hovering.value));
+    const showPwdVisible = computed(() => props.showPassword && !inputDisabled.value && !props.readonly && (!!nativeInputValue.value || focused.value));
+    const isWordLimitVisible = computed(() => props.showWordLimit && !!attrs.value.maxlength && (props.type === "text" || props.type === "textarea") && !inputDisabled.value && !props.readonly && !props.showPassword);
+    const textLength = computed(() => Array.from(nativeInputValue.value).length);
+    const inputExceed = computed(() => !!isWordLimitVisible.value && textLength.value > Number(attrs.value.maxlength));
+    const resizeTextarea = () => {
+      const { type, autosize } = props;
+      if (isServer || type !== "textarea")
+        return;
+      if (autosize) {
+        const minRows = isObject(autosize) ? autosize.minRows : void 0;
+        const maxRows = isObject(autosize) ? autosize.maxRows : void 0;
+        _textareaCalcStyle.value = {
+          ...calcTextareaHeight(textarea.value, minRows, maxRows)
+        };
+      } else {
+        _textareaCalcStyle.value = {
+          minHeight: calcTextareaHeight(textarea.value).minHeight
+        };
+      }
+    };
+    const setNativeInputValue = () => {
+      const input2 = inputOrTextarea.value;
+      if (!input2 || input2.value === nativeInputValue.value)
+        return;
+      input2.value = nativeInputValue.value;
+    };
+    const calcIconOffset = (place) => {
+      const { el } = instance.vnode;
+      if (!el)
+        return;
+      const elList = Array.from(el.querySelectorAll(`.el-input__${place}`));
+      const target = elList.find((item) => item.parentNode === el);
+      if (!target)
+        return;
+      const pendant = PENDANT_MAP[place];
+      if (slots[pendant]) {
+        target.style.transform = `translateX(${place === "suffix" ? "-" : ""}${el.querySelector(`.el-input-group__${pendant}`).offsetWidth}px)`;
+      } else {
+        target.removeAttribute("style");
+      }
+    };
+    const updateIconOffset = () => {
+      calcIconOffset("prefix");
+      calcIconOffset("suffix");
+    };
+    const suffixVisible = computed(() => !!slots.suffix || !!props.suffixIcon || showClear.value || props.showPassword || isWordLimitVisible.value || !!validateState.value && needStatusIcon.value);
+    watch(() => props.modelValue, () => {
+      var _a;
+      nextTick(resizeTextarea);
+      if (props.validateEvent) {
+        (_a = elFormItem == null ? void 0 : elFormItem.validate) == null ? void 0 : _a.call(elFormItem, "change");
+      }
+    });
+    watch(nativeInputValue, () => setNativeInputValue());
+    watch(() => props.type, () => {
+      nextTick(() => {
+        setNativeInputValue();
+        resizeTextarea();
+        updateIconOffset();
+      });
+    });
+    onMounted(() => {
+      setNativeInputValue();
+      updateIconOffset();
+      nextTick(resizeTextarea);
+    });
+    onUpdated(() => {
+      nextTick(updateIconOffset);
+    });
+    return {
+      input,
+      textarea,
+      attrs,
+      inputSize,
+      validateState,
+      validateIcon,
+      containerStyle,
+      computedTextareaStyle,
+      inputDisabled,
+      showClear,
+      showPwdVisible,
+      isWordLimitVisible,
+      textLength,
+      hovering,
+      inputExceed,
+      passwordVisible,
+      inputOrTextarea,
+      suffixVisible
+    };
+  }
+});
+
+export { script as default };
+//# sourceMappingURL=input.vue_vue&type=script&lang.mjs.map

package/es/packages/components/input/src/input.vue_vue&type=script&lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"input.vue_vue&type=script&lang.mjs","sources":["../../../../../../../packages/components/input/src/input.vue"],"sourcesContent":["<template>\n  <div\n    v-show=\"type !== 'hidden'\"\n    :class=\"[\n      type === 'textarea' ? 'el-textarea' : 'el-input',\n      inputSize ? 'el-input--' + inputSize : '',\n      {\n        'is-disabled': inputDisabled,\n        'is-exceed': inputExceed,\n        'el-input-group': $slots.prepend || $slots.append,\n        'el-input-group--append': $slots.append,\n        'el-input-group--prepend': $slots.prepend,\n        'el-input--prefix': $slots.prefix || prefixIcon,\n        'el-input--suffix':\n          $slots.suffix || suffixIcon || clearable || showPassword,\n        'el-input--suffix--password-clear': clearable && showPassword,\n      },\n      $attrs.class,\n    ]\"\n    :style=\"containerStyle\"\n  >\n    <!-- input -->\n    <template v-if=\"type !== 'textarea'\">\n      <!-- prepend slot -->\n      <div v-if=\"$slots.prepend\" class=\"el-input-group__prepend\">\n        <slot name=\"prepend\" />\n      </div>\n\n      <input\n        ref=\"input\"\n        class=\"el-input__inner\"\n        v-bind=\"attrs\"\n        :type=\"showPassword ? (passwordVisible ? 'text' : 'password') : type\"\n        :disabled=\"inputDisabled\"\n        :readonly=\"readonly\"\n        :autocomplete=\"autocomplete\"\n        :tabindex=\"tabindex\"\n        :aria-label=\"label\"\n        :placeholder=\"placeholder\"\n        :style=\"inputStyle\"\n      />\n\n      <!-- prefix slot -->\n      <span v-if=\"$slots.prefix || prefixIcon\" class=\"el-input__prefix\">\n        <span class=\"el-input__prefix-inner\">\n          <slot name=\"prefix\"></slot>\n          <ps-icon v-if=\"prefixIcon\" class=\"el-input__icon\">\n            <component :is=\"prefixIcon\" />\n          </ps-icon>\n        </span>\n      </span>\n\n      <!-- suffix slot -->\n      <span v-if=\"suffixVisible\" class=\"el-input__suffix\">\n        <span class=\"el-input__suffix-inner\">\n          <template v-if=\"!showClear || !showPwdVisible || !isWordLimitVisible\">\n            <slot name=\"suffix\"></slot>\n            <ps-icon v-if=\"suffixIcon\" class=\"el-input__icon\">\n              <component :is=\"suffixIcon\" />\n            </ps-icon>\n          </template>\n          <ps-icon\n            v-if=\"showClear\"\n            class=\"el-input__icon el-input__clear\"\n          >\n            <circle-close />\n          </ps-icon>\n          <ps-icon\n            v-if=\"showPwdVisible\"\n            class=\"el-input__icon el-input__clear\"\n          >\n            <icon-view />\n          </ps-icon>\n          <span v-if=\"isWordLimitVisible\" class=\"el-input__count\">\n            <span class=\"el-input__count-inner\">\n              {{ textLength }} / {{ attrs.maxlength }}\n            </span>\n          </span>\n        </span>\n        <ps-icon\n          v-if=\"validateState && validateIcon\"\n          class=\"el-input__icon el-input__validateIcon\"\n        >\n          <component :is=\"validateIcon\" />\n        </ps-icon>\n      </span>\n\n      <!-- append slot -->\n      <div v-if=\"$slots.append\" class=\"el-input-group__append\">\n        <slot name=\"append\" />\n      </div>\n    </template>\n\n    <!-- textarea -->\n    <template v-else>\n      <textarea\n        ref=\"textarea\"\n        class=\"el-textarea__inner\"\n        v-bind=\"attrs\"\n        :tabindex=\"tabindex\"\n        :disabled=\"inputDisabled\"\n        :readonly=\"readonly\"\n        :autocomplete=\"autocomplete\"\n        :style=\"computedTextareaStyle\"\n        :aria-label=\"label\"\n        :placeholder=\"placeholder\"\n      />\n      <span v-if=\"isWordLimitVisible\" class=\"el-input__count\">\n        {{ textLength }} / {{ attrs.maxlength }}\n      </span>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  inject,\n  computed,\n  watch,\n  nextTick,\n  getCurrentInstance,\n  ref,\n  shallowRef,\n  onMounted,\n  onUpdated,\n} from 'vue'\nimport { elFormKey, elFormItemKey } from '@element-ps/tokens'\nimport { useAttrs, useFormItem } from '@element-ps/hooks'\nimport { VALIDATE_STATE_MAP } from '@element-ps/utils/constants'\nimport { isObject } from '@element-ps/utils/util'\nimport isServer from '@element-ps/utils/isServer'\nimport { calcTextareaHeight } from './calc-textarea-height'\nimport { inputProps } from './input'\nimport type { StyleValue } from '@element-ps/utils/types'\nimport { PsIcon } from '@element-ps/components/icon'\nimport { CircleClose, View as IconView } from '@element-plus/icons'\n\nconst PENDANT_MAP = {\n  suffix: 'append',\n  prefix: 'prepend',\n} as const\n\nexport default defineComponent({\n  name: 'PsInput',\n  inheritAttrs: false,\n  components: { PsIcon, CircleClose, IconView },\n  props: inputProps,\n\n  setup(props, { slots, attrs: rawAttrs }) {\n    const instance = getCurrentInstance()!\n    const attrs = useAttrs()\n\n    const elForm = inject(elFormKey, undefined)\n    const elFormItem = inject(elFormItemKey, undefined)\n\n    const { size: inputSize, disabled: inputDisabled } = useFormItem({})\n\n    const input = ref<HTMLInputElement>()\n    const textarea = ref<HTMLTextAreaElement>()\n    const focused = ref(false)\n    const hovering = ref(false)\n    const passwordVisible = ref(false)\n    const _textareaCalcStyle = shallowRef(props.inputStyle)\n\n    const inputOrTextarea = computed(() => input.value || textarea.value)\n    const needStatusIcon = computed(() => elForm?.statusIcon ?? false)\n    const validateState = computed(() => elFormItem?.validateState || '')\n    const validateIcon = computed(() => VALIDATE_STATE_MAP[validateState.value])\n    const containerStyle = computed(() => rawAttrs.style as StyleValue)\n    const computedTextareaStyle = computed<StyleValue>(() => [\n      props.inputStyle,\n      _textareaCalcStyle.value,\n      { resize: props.resize },\n    ])\n    const nativeInputValue = computed(() =>\n      props.modelValue === null || props.modelValue === undefined\n        ? ''\n        : String(props.modelValue)\n    )\n    const showClear = computed(\n      () =>\n        props.clearable &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        !!nativeInputValue.value &&\n        (focused.value || hovering.value)\n    )\n    const showPwdVisible = computed(\n      () =>\n        props.showPassword &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        (!!nativeInputValue.value || focused.value)\n    )\n    const isWordLimitVisible = computed(\n      () =>\n        props.showWordLimit &&\n        !!attrs.value.maxlength &&\n        (props.type === 'text' || props.type === 'textarea') &&\n        !inputDisabled.value &&\n        !props.readonly &&\n        !props.showPassword\n    )\n    const textLength = computed(() => Array.from(nativeInputValue.value).length)\n    const inputExceed = computed(\n      () =>\n        // show exceed style if length of initial value greater then maxlength\n        !!isWordLimitVisible.value &&\n        textLength.value > Number(attrs.value.maxlength)\n    )\n\n    const resizeTextarea = () => {\n      const { type, autosize } = props\n\n      if (isServer || type !== 'textarea') return\n\n      if (autosize) {\n        const minRows = isObject(autosize) ? autosize.minRows : undefined\n        const maxRows = isObject(autosize) ? autosize.maxRows : undefined\n        _textareaCalcStyle.value = {\n          ...calcTextareaHeight(textarea.value!, minRows, maxRows),\n        }\n      } else {\n        _textareaCalcStyle.value = {\n          minHeight: calcTextareaHeight(textarea.value!).minHeight,\n        }\n      }\n    }\n\n    const setNativeInputValue = () => {\n      const input = inputOrTextarea.value\n      if (!input || input.value === nativeInputValue.value) return\n      input.value = nativeInputValue.value\n    }\n\n    const calcIconOffset = (place: 'prefix' | 'suffix') => {\n      const { el } = instance.vnode\n      if (!el) return\n      const elList: HTMLSpanElement[] = Array.from(\n        el.querySelectorAll(`.el-input__${place}`)\n      )\n      const target = elList.find((item) => item.parentNode === el)\n\n      if (!target) return\n\n      const pendant = PENDANT_MAP[place]\n\n      if (slots[pendant]) {\n        target.style.transform = `translateX(${place === 'suffix' ? '-' : ''}${\n          el.querySelector(`.el-input-group__${pendant}`).offsetWidth\n        }px)`\n      } else {\n        target.removeAttribute('style')\n      }\n    }\n\n    const updateIconOffset = () => {\n      calcIconOffset('prefix')\n      calcIconOffset('suffix')\n    }\n\n    const suffixVisible = computed(\n      () =>\n        !!slots.suffix ||\n        !!props.suffixIcon ||\n        showClear.value ||\n        props.showPassword ||\n        isWordLimitVisible.value ||\n        (!!validateState.value && needStatusIcon.value)\n    )\n\n    watch(\n      () => props.modelValue,\n      () => {\n        nextTick(resizeTextarea)\n        if (props.validateEvent) {\n          elFormItem?.validate?.('change')\n        }\n      }\n    )\n\n    // native input value is set explicitly\n    // do not use v-model / :value in template\n    // see: https://github.com/ElemeFE/element/issues/14521\n    watch(nativeInputValue, () => setNativeInputValue())\n\n    // when change between <input> and <textarea>,\n    // update DOM dependent value and styles\n    // https://github.com/ElemeFE/element/issues/14857\n    watch(\n      () => props.type,\n      () => {\n        nextTick(() => {\n          setNativeInputValue()\n          resizeTextarea()\n          updateIconOffset()\n        })\n      }\n    )\n\n    onMounted(() => {\n      setNativeInputValue()\n      updateIconOffset()\n      nextTick(resizeTextarea)\n    })\n\n    onUpdated(() => {\n      nextTick(updateIconOffset)\n    })\n\n    return {\n      input,\n      textarea,\n      attrs,\n      inputSize,\n      validateState,\n      validateIcon,\n      containerStyle,\n      computedTextareaStyle,\n      inputDisabled,\n      showClear,\n      showPwdVisible,\n      isWordLimitVisible,\n      textLength,\n      hovering,\n      inputExceed,\n      passwordVisible,\n      inputOrTextarea,\n      suffixVisible,\n    }\n  },\n})\n</script>\n"],"names":["IconView"],"mappings":"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"}

package/es/packages/components/input/src/input.vue_vue&type=template&id=3290dcb6&lang.mjs

@@ -0,0 +1,161 @@
+import { resolveComponent, withDirectives, openBlock, createElementBlock, normalizeClass, normalizeStyle, createCommentVNode, Fragment, renderSlot, createElementVNode, mergeProps, createBlock, withCtx, resolveDynamicComponent, createVNode, toDisplayString, vShow } from 'vue';
+
+const _hoisted_1 = {
+  key: 0,
+  class: "el-input-group__prepend"
+};
+const _hoisted_2 = ["type", "disabled", "readonly", "autocomplete", "tabindex", "aria-label", "placeholder"];
+const _hoisted_3 = {
+  key: 1,
+  class: "el-input__prefix"
+};
+const _hoisted_4 = { class: "el-input__prefix-inner" };
+const _hoisted_5 = {
+  key: 2,
+  class: "el-input__suffix"
+};
+const _hoisted_6 = { class: "el-input__suffix-inner" };
+const _hoisted_7 = {
+  key: 3,
+  class: "el-input__count"
+};
+const _hoisted_8 = { class: "el-input__count-inner" };
+const _hoisted_9 = {
+  key: 3,
+  class: "el-input-group__append"
+};
+const _hoisted_10 = ["tabindex", "disabled", "readonly", "autocomplete", "aria-label", "placeholder"];
+const _hoisted_11 = {
+  key: 0,
+  class: "el-input__count"
+};
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_ps_icon = resolveComponent("ps-icon");
+  const _component_circle_close = resolveComponent("circle-close");
+  const _component_icon_view = resolveComponent("icon-view");
+  return withDirectives((openBlock(), createElementBlock("div", {
+    class: normalizeClass([
+      _ctx.type === "textarea" ? "el-textarea" : "el-input",
+      _ctx.inputSize ? "el-input--" + _ctx.inputSize : "",
+      {
+        "is-disabled": _ctx.inputDisabled,
+        "is-exceed": _ctx.inputExceed,
+        "el-input-group": _ctx.$slots.prepend || _ctx.$slots.append,
+        "el-input-group--append": _ctx.$slots.append,
+        "el-input-group--prepend": _ctx.$slots.prepend,
+        "el-input--prefix": _ctx.$slots.prefix || _ctx.prefixIcon,
+        "el-input--suffix": _ctx.$slots.suffix || _ctx.suffixIcon || _ctx.clearable || _ctx.showPassword,
+        "el-input--suffix--password-clear": _ctx.clearable && _ctx.showPassword
+      },
+      _ctx.$attrs.class
+    ]),
+    style: normalizeStyle(_ctx.containerStyle)
+  }, [
+    createCommentVNode(" input "),
+    _ctx.type !== "textarea" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+      createCommentVNode(" prepend slot "),
+      _ctx.$slots.prepend ? (openBlock(), createElementBlock("div", _hoisted_1, [
+        renderSlot(_ctx.$slots, "prepend")
+      ])) : createCommentVNode("v-if", true),
+      createElementVNode("input", mergeProps({
+        ref: "input",
+        class: "el-input__inner"
+      }, _ctx.attrs, {
+        type: _ctx.showPassword ? _ctx.passwordVisible ? "text" : "password" : _ctx.type,
+        disabled: _ctx.inputDisabled,
+        readonly: _ctx.readonly,
+        autocomplete: _ctx.autocomplete,
+        tabindex: _ctx.tabindex,
+        "aria-label": _ctx.label,
+        placeholder: _ctx.placeholder,
+        style: _ctx.inputStyle
+      }), null, 16, _hoisted_2),
+      createCommentVNode(" prefix slot "),
+      _ctx.$slots.prefix || _ctx.prefixIcon ? (openBlock(), createElementBlock("span", _hoisted_3, [
+        createElementVNode("span", _hoisted_4, [
+          renderSlot(_ctx.$slots, "prefix"),
+          _ctx.prefixIcon ? (openBlock(), createBlock(_component_ps_icon, {
+            key: 0,
+            class: "el-input__icon"
+          }, {
+            default: withCtx(() => [
+              (openBlock(), createBlock(resolveDynamicComponent(_ctx.prefixIcon)))
+            ]),
+            _: 1
+          })) : createCommentVNode("v-if", true)
+        ])
+      ])) : createCommentVNode("v-if", true),
+      createCommentVNode(" suffix slot "),
+      _ctx.suffixVisible ? (openBlock(), createElementBlock("span", _hoisted_5, [
+        createElementVNode("span", _hoisted_6, [
+          !_ctx.showClear || !_ctx.showPwdVisible || !_ctx.isWordLimitVisible ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+            renderSlot(_ctx.$slots, "suffix"),
+            _ctx.suffixIcon ? (openBlock(), createBlock(_component_ps_icon, {
+              key: 0,
+              class: "el-input__icon"
+            }, {
+              default: withCtx(() => [
+                (openBlock(), createBlock(resolveDynamicComponent(_ctx.suffixIcon)))
+              ]),
+              _: 1
+            })) : createCommentVNode("v-if", true)
+          ], 64)) : createCommentVNode("v-if", true),
+          _ctx.showClear ? (openBlock(), createBlock(_component_ps_icon, {
+            key: 1,
+            class: "el-input__icon el-input__clear"
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_circle_close)
+            ]),
+            _: 1
+          })) : createCommentVNode("v-if", true),
+          _ctx.showPwdVisible ? (openBlock(), createBlock(_component_ps_icon, {
+            key: 2,
+            class: "el-input__icon el-input__clear"
+          }, {
+            default: withCtx(() => [
+              createVNode(_component_icon_view)
+            ]),
+            _: 1
+          })) : createCommentVNode("v-if", true),
+          _ctx.isWordLimitVisible ? (openBlock(), createElementBlock("span", _hoisted_7, [
+            createElementVNode("span", _hoisted_8, toDisplayString(_ctx.textLength) + " / " + toDisplayString(_ctx.attrs.maxlength), 1)
+          ])) : createCommentVNode("v-if", true)
+        ]),
+        _ctx.validateState && _ctx.validateIcon ? (openBlock(), createBlock(_component_ps_icon, {
+          key: 0,
+          class: "el-input__icon el-input__validateIcon"
+        }, {
+          default: withCtx(() => [
+            (openBlock(), createBlock(resolveDynamicComponent(_ctx.validateIcon)))
+          ]),
+          _: 1
+        })) : createCommentVNode("v-if", true)
+      ])) : createCommentVNode("v-if", true),
+      createCommentVNode(" append slot "),
+      _ctx.$slots.append ? (openBlock(), createElementBlock("div", _hoisted_9, [
+        renderSlot(_ctx.$slots, "append")
+      ])) : createCommentVNode("v-if", true)
+    ], 64)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+      createCommentVNode(" textarea "),
+      createElementVNode("textarea", mergeProps({
+        ref: "textarea",
+        class: "el-textarea__inner"
+      }, _ctx.attrs, {
+        tabindex: _ctx.tabindex,
+        disabled: _ctx.inputDisabled,
+        readonly: _ctx.readonly,
+        autocomplete: _ctx.autocomplete,
+        style: _ctx.computedTextareaStyle,
+        "aria-label": _ctx.label,
+        placeholder: _ctx.placeholder
+      }), null, 16, _hoisted_10),
+      _ctx.isWordLimitVisible ? (openBlock(), createElementBlock("span", _hoisted_11, toDisplayString(_ctx.textLength) + " / " + toDisplayString(_ctx.attrs.maxlength), 1)) : createCommentVNode("v-if", true)
+    ], 64))
+  ], 6)), [
+    [vShow, _ctx.type !== "hidden"]
+  ]);
+}
+
+export { render };
+//# sourceMappingURL=input.vue_vue&type=template&id=3290dcb6&lang.mjs.map