This commit is contained in:
gyq
2024-02-26 16:13:48 +08:00
parent eeac3e3541
commit 1f59f300d0
10000 changed files with 1689285 additions and 1 deletions

View File

@@ -0,0 +1,152 @@
<p align="center">
<img width="300px" src="https://user-images.githubusercontent.com/10731096/95823103-9ce15780-0d5f-11eb-8010-1bd1b5910d4f.png">
</p>
<p align="center">
<a href="https://www.npmjs.org/package/element-plus">
<img src="https://img.shields.io/npm/v/element-plus.svg" />
</a>
<a href="https://github.com/element-plus/element-plus">
<img src="https://img.shields.io/badge/node-%20%3E%3D%2016-47c219" />
</a>
<a href="https://npmcharts.com/compare/element-plus?minimal=true">
<img src="https://img.shields.io/npm/dm/element-plus.svg" />
</a>
<a href="https://codecov.io/gh/element-plus/element-plus">
<img src="https://codecov.io/gh/element-plus/element-plus/branch/dev/graph/badge.svg?token=BKSBO2GLZI"/>
</a>
<br>
</p>
<p align="center">Element Plus - A Vue.js 3 UI library</p>
- 💪 Vue 3 Composition API
- 🔥 Written in TypeScript
## Getting Started
Alright, for you to get started if you are looking for making Element Plus better you should keep reading.
For developers that uses Element Plus to develop your website you should go ahead visit [Getting Started](https://element-plus.org/).
- 中国大陆[加速镜像站点](https://element-plus.gitee.io/)
## Breaking change list
The first stable release of Element Plus suitable for use in production was released on February 07, 2022. The APIs is stable right now, and here's also a full list about how to get upgraded from [Element UI](https://element.eleme.io) to Element Plus.
You can find the breaking change list here: [Breaking Change List](https://github.com/element-plus/element-plus/discussions/5658).
### Migration Tool :hammer_and_wrench:
We have made a migration tool for you to migrate your project from [Element UI](https://element.eleme.io) to Element Plus.
You can find the [gogo code migration tool](https://github.com/thx/gogocode/tree/main/packages/gogocode-plugin-element) here.
We have tested this on [Vue Element Admin](https://github.com/PanJiaChen/vue-element-admin). You can find the transpiled code [here](https://github.com/gogocodeio/vue-element-admin).
### Playground
You can also try Element Plus out with the components built-in playground.
#### Try it with our built-in playground
[Playground](https://element-plus.run/)
#### Try it with code sandbox
[![Edit element-plus](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/element-plus-demo-dxtcr)
<p align="center">
<b>Special thanks to the generous sponsorship by:</b>
</p>
<br/>
<p align="center">
<b>Platinum Sponsors</b>
</p>
<table align="center" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td align="center" valign="middle">
<a href="https://www.vform666.com/" target="_blank">
<img width="150px" src="https://user-images.githubusercontent.com/17680888/156870588-b25a42d5-888b-4943-8b1b-5239dfd8f4d2.png">
</a>
</td>
<td align="center" valign="middle">
<a href="https://js.design?source=element-plus" target="_blank">
<img width="150px" src="https://user-images.githubusercontent.com/17680888/160634485-df0d00af-8633-4ab8-9a72-aac2b65d1d36.png">
</a>
</td>
<td align="center" valign="middle">
<a href="https://www.misboot.com/?from=element-plus" target="_blank">
<img width="150px" src="https://github-production-user-asset-6210df.s3.amazonaws.com/82012629/250157573-b8ab8d68-ff6b-496f-beb1-9863a545d2af.png">
</a>
</td>
</tr>
</tbody>
</table>
<p align="center">
<b>Gold Sponsors</b>
</p>
<table align="center" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td align="center" valign="middle">
<a href="https://wonderful-code.gitee.io/?from=element-plus" target="_blank">
<img width="130px" src="https://user-images.githubusercontent.com/17680888/173179536-30e35fd1-cd5a-482a-bc41-9d5f0aa66fd4.png">
</a>
</td>
<td align="center" valign="middle">
<a href="https://bit.dev/?from=element-ui" target="_blank">
<img width="130px" src="https://user-images.githubusercontent.com/10095631/41342907-e44e7196-6f2f-11e8-92f2-47702dc8f059.png">
</a>
</td>
</tr>
</tbody>
</table>
---
## Translations
Element Plus is translated to multiple languages, you can click the badge to help up update the translation or apply to become
a proofreader [![Crowdin](https://badges.crowdin.net/element-plus/localized.svg)](https://crowdin.com/project/element-plus)
For now we are only showing English and Chinese for resource reasons, but we are looking forward to translate it into more languages, please go to the link
above and leave a message if you want to help translating Element Plus into your desired language.
### How to help translating
See how to help translating in [Translating Element Plus](https://element-plus.org/en-US/guide/translation.html).
## Stay tuned :eyes:
Join our [Discord](https://discord.com/invite/gXK9XNzW3X) to start communicating with everybody.
## This thing is broken, I should help improve it!
Awesommmmmmee. Everything you need is down below. You can also refer to
[CONTRIBUTING](https://github.com/element-plus/element-plus/blob/dev/CONTRIBUTING.md) and
[Code of Conduct](https://github.com/element-plus/element-plus/blob/dev/CODE_OF_CONDUCT.md)
where you'll find the same information listed below.
## I would like to become a part of the development team!
Welcome :star_struck:! We are looking for talented developers to join us and making Element Plus better! If you care to join the development team, please
reach out to us, you are more than welcomed to join us! :heart:
We are now lacking of experts of `Testing`, `GitHub Actions`, `PM`, if you do feel like you can and willing to help us, please do reach out to us. :pray:
## Contributors
This project exists thanks to all the people who contribute.
And thank you to all our backers! 🙏
<a href="https://github.com/element-plus/element-plus/graphs/contributors">
<img src="https://contrib.rocks/image?repo=element-plus/element-plus" />
</a>
## License
Element Plus is open source software licensed as
[MIT](https://github.com/element-plus/element-plus/blob/master/LICENSE).

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,10 @@
var _export_sfc = (sfc, props) => {
const target = sfc.__vccOpts || sfc;
for (const [key, val] of props) {
target[key] = val;
}
return target;
};
export { _export_sfc as default };
//# sourceMappingURL=plugin-vue_export-helper.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"plugin-vue_export-helper.mjs","sources":["../../../../internal/build/plugin-vue:export-helper"],"sourcesContent":["\nexport default (sfc, props) => {\n const target = sfc.__vccOpts || sfc;\n for (const [key, val] of props) {\n target[key] = val;\n }\n return target;\n}\n"],"names":[],"mappings":"AACA,kBAAe,CAAC,GAAG,EAAE,KAAK,KAAK;AAC/B,EAAE,MAAM,MAAM,GAAG,GAAG,CAAC,SAAS,IAAI,GAAG,CAAC;AACtC,EAAE,KAAK,MAAM,CAAC,GAAG,EAAE,GAAG,CAAC,IAAI,KAAK,EAAE;AAClC,IAAI,MAAM,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC;AACtB,GAAG;AACH,EAAE,OAAO,MAAM,CAAC;AAChB;;;;"}

View File

@@ -0,0 +1,3 @@
import type { Plugin } from 'vue';
declare const _default: Plugin[];
export default _default;

View File

@@ -0,0 +1,177 @@
import { ElAffix } from './components/affix/index.mjs';
import { ElAlert } from './components/alert/index.mjs';
import { ElAutocomplete } from './components/autocomplete/index.mjs';
import { ElAvatar } from './components/avatar/index.mjs';
import { ElBacktop } from './components/backtop/index.mjs';
import { ElBadge } from './components/badge/index.mjs';
import { ElBreadcrumb, ElBreadcrumbItem } from './components/breadcrumb/index.mjs';
import { ElButton, ElButtonGroup } from './components/button/index.mjs';
import { ElCalendar } from './components/calendar/index.mjs';
import { ElCard } from './components/card/index.mjs';
import { ElCarousel, ElCarouselItem } from './components/carousel/index.mjs';
import { ElCascader } from './components/cascader/index.mjs';
import { ElCascaderPanel } from './components/cascader-panel/index.mjs';
import { ElCheckTag } from './components/check-tag/index.mjs';
import { ElCheckbox, ElCheckboxButton, ElCheckboxGroup } from './components/checkbox/index.mjs';
import { ElCol } from './components/col/index.mjs';
import { ElCollapse, ElCollapseItem } from './components/collapse/index.mjs';
import { ElCollapseTransition } from './components/collapse-transition/index.mjs';
import { ElColorPicker } from './components/color-picker/index.mjs';
import { ElConfigProvider } from './components/config-provider/index.mjs';
import { ElContainer, ElAside, ElFooter, ElHeader, ElMain } from './components/container/index.mjs';
import { ElDatePicker } from './components/date-picker/index.mjs';
import { ElDescriptions, ElDescriptionsItem } from './components/descriptions/index.mjs';
import { ElDialog } from './components/dialog/index.mjs';
import { ElDivider } from './components/divider/index.mjs';
import { ElDrawer } from './components/drawer/index.mjs';
import { ElDropdown, ElDropdownItem, ElDropdownMenu } from './components/dropdown/index.mjs';
import { ElEmpty } from './components/empty/index.mjs';
import { ElForm, ElFormItem } from './components/form/index.mjs';
import { ElIcon } from './components/icon/index.mjs';
import { ElImage } from './components/image/index.mjs';
import { ElImageViewer } from './components/image-viewer/index.mjs';
import { ElInput } from './components/input/index.mjs';
import { ElInputNumber } from './components/input-number/index.mjs';
import { ElLink } from './components/link/index.mjs';
import { ElMenu, ElMenuItem, ElMenuItemGroup, ElSubMenu } from './components/menu/index.mjs';
import { ElPageHeader } from './components/page-header/index.mjs';
import { ElPagination } from './components/pagination/index.mjs';
import { ElPopconfirm } from './components/popconfirm/index.mjs';
import { ElPopover } from './components/popover/index.mjs';
import { ElPopper } from './components/popper/index.mjs';
import { ElProgress } from './components/progress/index.mjs';
import { ElRadio, ElRadioButton, ElRadioGroup } from './components/radio/index.mjs';
import { ElRate } from './components/rate/index.mjs';
import { ElResult } from './components/result/index.mjs';
import { ElRow } from './components/row/index.mjs';
import { ElScrollbar } from './components/scrollbar/index.mjs';
import { ElSelect, ElOption, ElOptionGroup } from './components/select/index.mjs';
import { ElSelectV2 } from './components/select-v2/index.mjs';
import { ElSkeleton, ElSkeletonItem } from './components/skeleton/index.mjs';
import { ElSlider } from './components/slider/index.mjs';
import { ElSpace } from './components/space/index.mjs';
import { ElStatistic } from './components/statistic/index.mjs';
import { ElCountdown } from './components/countdown/index.mjs';
import { ElSteps, ElStep } from './components/steps/index.mjs';
import { ElSwitch } from './components/switch/index.mjs';
import { ElTable, ElTableColumn } from './components/table/index.mjs';
import { ElAutoResizer, ElTableV2 } from './components/table-v2/index.mjs';
import { ElTabs, ElTabPane } from './components/tabs/index.mjs';
import { ElTag } from './components/tag/index.mjs';
import { ElText } from './components/text/index.mjs';
import { ElTimePicker } from './components/time-picker/index.mjs';
import { ElTimeSelect } from './components/time-select/index.mjs';
import { ElTimeline, ElTimelineItem } from './components/timeline/index.mjs';
import { ElTooltip } from './components/tooltip/index.mjs';
import { ElTooltipV2 } from './components/tooltip-v2/index.mjs';
import { ElTransfer } from './components/transfer/index.mjs';
import { ElTree } from './components/tree/index.mjs';
import { ElTreeSelect } from './components/tree-select/index.mjs';
import { ElTreeV2 } from './components/tree-v2/index.mjs';
import { ElUpload } from './components/upload/index.mjs';
import { ElWatermark } from './components/watermark/index.mjs';
var Components = [
ElAffix,
ElAlert,
ElAutocomplete,
ElAutoResizer,
ElAvatar,
ElBacktop,
ElBadge,
ElBreadcrumb,
ElBreadcrumbItem,
ElButton,
ElButtonGroup,
ElCalendar,
ElCard,
ElCarousel,
ElCarouselItem,
ElCascader,
ElCascaderPanel,
ElCheckTag,
ElCheckbox,
ElCheckboxButton,
ElCheckboxGroup,
ElCol,
ElCollapse,
ElCollapseItem,
ElCollapseTransition,
ElColorPicker,
ElConfigProvider,
ElContainer,
ElAside,
ElFooter,
ElHeader,
ElMain,
ElDatePicker,
ElDescriptions,
ElDescriptionsItem,
ElDialog,
ElDivider,
ElDrawer,
ElDropdown,
ElDropdownItem,
ElDropdownMenu,
ElEmpty,
ElForm,
ElFormItem,
ElIcon,
ElImage,
ElImageViewer,
ElInput,
ElInputNumber,
ElLink,
ElMenu,
ElMenuItem,
ElMenuItemGroup,
ElSubMenu,
ElPageHeader,
ElPagination,
ElPopconfirm,
ElPopover,
ElPopper,
ElProgress,
ElRadio,
ElRadioButton,
ElRadioGroup,
ElRate,
ElResult,
ElRow,
ElScrollbar,
ElSelect,
ElOption,
ElOptionGroup,
ElSelectV2,
ElSkeleton,
ElSkeletonItem,
ElSlider,
ElSpace,
ElStatistic,
ElCountdown,
ElSteps,
ElStep,
ElSwitch,
ElTable,
ElTableColumn,
ElTableV2,
ElTabs,
ElTabPane,
ElTag,
ElText,
ElTimePicker,
ElTimeSelect,
ElTimeline,
ElTimelineItem,
ElTooltip,
ElTooltipV2,
ElTransfer,
ElTree,
ElTreeSelect,
ElTreeV2,
ElUpload,
ElWatermark
];
export { Components as default };
//# sourceMappingURL=component.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,93 @@
export declare const ElAffix: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
readonly zIndex: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty) | ((new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty))[], unknown, unknown, 100, boolean>;
readonly target: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
readonly position: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom", unknown, "top", boolean>;
}, {
COMPONENT_NAME: string;
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly zIndex: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty) | ((new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty))[], unknown, unknown, 100, boolean>;
readonly target: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
readonly position: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom", unknown, "top", boolean>;
}>> & {
onChange?: ((fixed: boolean) => any) | undefined;
onScroll?: ((args_0: {
scrollTop: number;
fixed: boolean;
}) => any) | undefined;
}>>;
emit: ((event: "change", fixed: boolean) => void) & ((event: "scroll", args_0: {
scrollTop: number;
fixed: boolean;
}) => void);
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
target: import("vue").ShallowRef<HTMLElement | undefined>;
root: import("vue").ShallowRef<HTMLDivElement | undefined>;
scrollContainer: import("vue").ShallowRef<Window | HTMLElement | undefined>;
windowHeight: import("vue").Ref<number>;
rootHeight: import("vue").Ref<number>;
rootWidth: import("vue").Ref<number>;
rootTop: import("vue").Ref<number>;
rootBottom: import("vue").Ref<number>;
updateRoot: () => void;
targetRect: {
height: import("vue").Ref<number>;
bottom: import("vue").Ref<number>;
left: import("vue").Ref<number>;
right: import("vue").Ref<number>;
top: import("vue").Ref<number>;
width: import("vue").Ref<number>;
x: import("vue").Ref<number>;
y: import("vue").Ref<number>;
update: () => void;
};
fixed: import("vue").Ref<boolean>;
scrollTop: import("vue").Ref<number>;
transform: import("vue").Ref<number>;
rootStyle: import("vue").ComputedRef<import("vue").CSSProperties>;
affixStyle: import("vue").ComputedRef<import("vue").CSSProperties>;
update: () => void;
handleScroll: () => void;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
scroll: ({ scrollTop, fixed }: {
scrollTop: number;
fixed: boolean;
}) => boolean;
change: (fixed: boolean) => boolean;
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly zIndex: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty) | ((new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty))[], unknown, unknown, 100, boolean>;
readonly target: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
readonly position: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom", unknown, "top", boolean>;
}>> & {
onChange?: ((fixed: boolean) => any) | undefined;
onScroll?: ((args_0: {
scrollTop: number;
fixed: boolean;
}) => any) | undefined;
}, {
readonly zIndex: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty) | ((new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty))[], unknown, unknown>;
readonly target: string;
readonly offset: number;
readonly position: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "top" | "bottom", unknown>;
}>> & Record<string, any>;
export default ElAffix;
export * from './src/affix';

View File

@@ -0,0 +1,9 @@
import '../../utils/index.mjs';
import Affix from './src/affix2.mjs';
export { affixEmits, affixProps } from './src/affix.mjs';
import { withInstall } from '../../utils/vue/install.mjs';
const ElAffix = withInstall(Affix);
export { ElAffix, ElAffix as default };
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","sources":["../../../../../packages/components/affix/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils'\n\nimport Affix from './src/affix.vue'\n\nexport const ElAffix = withInstall(Affix)\nexport default ElAffix\n\nexport * from './src/affix'\n"],"names":[],"mappings":";;;;;AAEY,MAAC,OAAO,GAAG,WAAW,CAAC,KAAK;;;;"}

View File

@@ -0,0 +1,19 @@
import type { ExtractPropTypes } from 'vue';
import type { ZIndexProperty } from 'csstype';
import type Affix from './affix.vue';
export declare const affixProps: {
readonly zIndex: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => ZIndexProperty & {}) | (() => ZIndexProperty) | ((new (...args: any[]) => ZIndexProperty & {}) | (() => ZIndexProperty))[], unknown, unknown, 100, boolean>;
readonly target: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
readonly position: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom", unknown, "top", boolean>;
};
export declare type AffixProps = ExtractPropTypes<typeof affixProps>;
export declare const affixEmits: {
scroll: ({ scrollTop, fixed }: {
scrollTop: number;
fixed: boolean;
}) => boolean;
change: (fixed: boolean) => boolean;
};
export declare type AffixEmits = typeof affixEmits;
export declare type AffixInstance = InstanceType<typeof Affix>;

View File

@@ -0,0 +1,32 @@
import '../../../utils/index.mjs';
import '../../../constants/index.mjs';
import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
import { isNumber, isBoolean } from '../../../utils/types.mjs';
import { CHANGE_EVENT } from '../../../constants/event.mjs';
const affixProps = buildProps({
zIndex: {
type: definePropType([Number, String]),
default: 100
},
target: {
type: String,
default: ""
},
offset: {
type: Number,
default: 0
},
position: {
type: String,
values: ["top", "bottom"],
default: "top"
}
});
const affixEmits = {
scroll: ({ scrollTop, fixed }) => isNumber(scrollTop) && isBoolean(fixed),
[CHANGE_EVENT]: (fixed) => isBoolean(fixed)
};
export { affixEmits, affixProps };
//# sourceMappingURL=affix.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"affix.mjs","sources":["../../../../../../packages/components/affix/src/affix.ts"],"sourcesContent":["import {\n buildProps,\n definePropType,\n isBoolean,\n isNumber,\n} from '@element-plus/utils'\nimport { CHANGE_EVENT } from '@element-plus/constants'\nimport type { ExtractPropTypes } from 'vue'\nimport type { ZIndexProperty } from 'csstype'\nimport type Affix from './affix.vue'\n\nexport const affixProps = buildProps({\n /**\n * @description affix element zIndex value\n * */\n zIndex: {\n type: definePropType<ZIndexProperty>([Number, String]),\n default: 100,\n },\n /**\n * @description target container. (CSS selector)\n */\n target: {\n type: String,\n default: '',\n },\n /**\n * @description offset distance\n * */\n offset: {\n type: Number,\n default: 0,\n },\n /**\n * @description position of affix\n * */\n position: {\n type: String,\n values: ['top', 'bottom'],\n default: 'top',\n },\n} as const)\nexport type AffixProps = ExtractPropTypes<typeof affixProps>\n\nexport const affixEmits = {\n scroll: ({ scrollTop, fixed }: { scrollTop: number; fixed: boolean }) =>\n isNumber(scrollTop) && isBoolean(fixed),\n [CHANGE_EVENT]: (fixed: boolean) => isBoolean(fixed),\n}\nexport type AffixEmits = typeof affixEmits\n\nexport type AffixInstance = InstanceType<typeof Affix>\n"],"names":[],"mappings":";;;;;;AAOY,MAAC,UAAU,GAAG,UAAU,CAAC;AACrC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC;AAC7B,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,UAAU,GAAG;AAC1B,EAAE,MAAM,EAAE,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,KAAK,QAAQ,CAAC,SAAS,CAAC,IAAI,SAAS,CAAC,KAAK,CAAC;AAC3E,EAAE,CAAC,YAAY,GAAG,CAAC,KAAK,KAAK,SAAS,CAAC,KAAK,CAAC;AAC7C;;;;"}

View File

@@ -0,0 +1,93 @@
import type { CSSProperties } from 'vue';
declare const _default: import("vue").DefineComponent<{
readonly zIndex: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty) | ((new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty))[], unknown, unknown, 100, boolean>;
readonly target: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
readonly position: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom", unknown, "top", boolean>;
}, {
COMPONENT_NAME: string;
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly zIndex: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty) | ((new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty))[], unknown, unknown, 100, boolean>;
readonly target: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
readonly position: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom", unknown, "top", boolean>;
}>> & {
onChange?: ((fixed: boolean) => any) | undefined;
onScroll?: ((args_0: {
scrollTop: number;
fixed: boolean;
}) => any) | undefined;
}>>;
emit: ((event: "change", fixed: boolean) => void) & ((event: "scroll", args_0: {
scrollTop: number;
fixed: boolean;
}) => void);
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
target: import("vue").ShallowRef<HTMLElement | undefined>;
root: import("vue").ShallowRef<HTMLDivElement | undefined>;
scrollContainer: import("vue").ShallowRef<Window | HTMLElement | undefined>;
windowHeight: import("vue").Ref<number>;
rootHeight: import("vue").Ref<number>;
rootWidth: import("vue").Ref<number>;
rootTop: import("vue").Ref<number>;
rootBottom: import("vue").Ref<number>;
updateRoot: () => void;
targetRect: {
height: import("vue").Ref<number>;
bottom: import("vue").Ref<number>;
left: import("vue").Ref<number>;
right: import("vue").Ref<number>;
top: import("vue").Ref<number>;
width: import("vue").Ref<number>;
x: import("vue").Ref<number>;
y: import("vue").Ref<number>;
update: () => void;
};
fixed: import("vue").Ref<boolean>;
scrollTop: import("vue").Ref<number>;
transform: import("vue").Ref<number>;
rootStyle: import("vue").ComputedRef<CSSProperties>;
affixStyle: import("vue").ComputedRef<CSSProperties>;
update: () => void;
handleScroll: () => void;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
scroll: ({ scrollTop, fixed }: {
scrollTop: number;
fixed: boolean;
}) => boolean;
change: (fixed: boolean) => boolean;
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly zIndex: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty) | ((new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty))[], unknown, unknown, 100, boolean>;
readonly target: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly offset: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
readonly position: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "top" | "bottom", unknown, "top", boolean>;
}>> & {
onChange?: ((fixed: boolean) => any) | undefined;
onScroll?: ((args_0: {
scrollTop: number;
fixed: boolean;
}) => any) | undefined;
}, {
readonly zIndex: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty) | ((new (...args: any[]) => import("csstype").ZIndexProperty & {}) | (() => import("csstype").ZIndexProperty))[], unknown, unknown>;
readonly target: string;
readonly offset: number;
readonly position: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "top" | "bottom", unknown>;
}>;
export default _default;

View File

@@ -0,0 +1,123 @@
import { defineComponent, shallowRef, ref, computed, watch, onMounted, watchEffect, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, createElementVNode, renderSlot } from 'vue';
import { useWindowSize, useElementBounding, useEventListener } from '@vueuse/core';
import '../../../utils/index.mjs';
import '../../../hooks/index.mjs';
import { affixProps, affixEmits } from './affix.mjs';
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
import { addUnit } from '../../../utils/dom/style.mjs';
import { throwError } from '../../../utils/error.mjs';
import { getScrollContainer } from '../../../utils/dom/scroll.mjs';
const COMPONENT_NAME = "ElAffix";
const __default__ = defineComponent({
name: COMPONENT_NAME
});
const _sfc_main = /* @__PURE__ */ defineComponent({
...__default__,
props: affixProps,
emits: affixEmits,
setup(__props, { expose, emit }) {
const props = __props;
const ns = useNamespace("affix");
const target = shallowRef();
const root = shallowRef();
const scrollContainer = shallowRef();
const { height: windowHeight } = useWindowSize();
const {
height: rootHeight,
width: rootWidth,
top: rootTop,
bottom: rootBottom,
update: updateRoot
} = useElementBounding(root, { windowScroll: false });
const targetRect = useElementBounding(target);
const fixed = ref(false);
const scrollTop = ref(0);
const transform = ref(0);
const rootStyle = computed(() => {
return {
height: fixed.value ? `${rootHeight.value}px` : "",
width: fixed.value ? `${rootWidth.value}px` : ""
};
});
const affixStyle = computed(() => {
if (!fixed.value)
return {};
const offset = props.offset ? addUnit(props.offset) : 0;
return {
height: `${rootHeight.value}px`,
width: `${rootWidth.value}px`,
top: props.position === "top" ? offset : "",
bottom: props.position === "bottom" ? offset : "",
transform: transform.value ? `translateY(${transform.value}px)` : "",
zIndex: props.zIndex
};
});
const update = () => {
if (!scrollContainer.value)
return;
scrollTop.value = scrollContainer.value instanceof Window ? document.documentElement.scrollTop : scrollContainer.value.scrollTop || 0;
if (props.position === "top") {
if (props.target) {
const difference = targetRect.bottom.value - props.offset - rootHeight.value;
fixed.value = props.offset > rootTop.value && targetRect.bottom.value > 0;
transform.value = difference < 0 ? difference : 0;
} else {
fixed.value = props.offset > rootTop.value;
}
} else if (props.target) {
const difference = windowHeight.value - targetRect.top.value - props.offset - rootHeight.value;
fixed.value = windowHeight.value - props.offset < rootBottom.value && windowHeight.value > targetRect.top.value;
transform.value = difference < 0 ? -difference : 0;
} else {
fixed.value = windowHeight.value - props.offset < rootBottom.value;
}
};
const handleScroll = () => {
updateRoot();
emit("scroll", {
scrollTop: scrollTop.value,
fixed: fixed.value
});
};
watch(fixed, (val) => emit("change", val));
onMounted(() => {
var _a;
if (props.target) {
target.value = (_a = document.querySelector(props.target)) != null ? _a : void 0;
if (!target.value)
throwError(COMPONENT_NAME, `Target is not existed: ${props.target}`);
} else {
target.value = document.documentElement;
}
scrollContainer.value = getScrollContainer(root.value, true);
updateRoot();
});
useEventListener(scrollContainer, "scroll", handleScroll);
watchEffect(update);
expose({
update,
updateRoot
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", {
ref_key: "root",
ref: root,
class: normalizeClass(unref(ns).b()),
style: normalizeStyle(unref(rootStyle))
}, [
createElementVNode("div", {
class: normalizeClass({ [unref(ns).m("fixed")]: fixed.value }),
style: normalizeStyle(unref(affixStyle))
}, [
renderSlot(_ctx.$slots, "default")
], 6)
], 6);
};
}
});
var Affix = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/affix/src/affix.vue"]]);
export { Affix as default };
//# sourceMappingURL=affix2.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,2 @@
import 'element-plus/es/components/base/style/css';
import 'element-plus/theme-chalk/el-affix.css';

View File

@@ -0,0 +1,3 @@
import '../../base/style/css.mjs';
import 'element-plus/theme-chalk/el-affix.css';
//# sourceMappingURL=css.mjs.map

View File

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

View File

@@ -0,0 +1,2 @@
import 'element-plus/es/components/base/style';
import 'element-plus/theme-chalk/src/affix.scss';

View File

@@ -0,0 +1,3 @@
import '../../base/style/index.mjs';
import 'element-plus/theme-chalk/src/affix.scss';
//# sourceMappingURL=index.mjs.map

View File

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

View File

@@ -0,0 +1,143 @@
export declare const ElAlert: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
readonly title: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly description: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly type: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "error" | "success" | "warning" | "info", unknown, "info", boolean>;
readonly closable: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly closeText: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly showIcon: BooleanConstructor;
readonly center: BooleanConstructor;
readonly effect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "light" | "dark", unknown, "light", boolean>;
}, {
Close: any;
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly title: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly description: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly type: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "error" | "success" | "warning" | "info", unknown, "info", boolean>;
readonly closable: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly closeText: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly showIcon: BooleanConstructor;
readonly center: BooleanConstructor;
readonly effect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "light" | "dark", unknown, "light", boolean>;
}>> & {
onClose?: ((evt: MouseEvent) => any) | undefined;
}>>;
emit: (event: "close", evt: MouseEvent) => void;
slots: Readonly<{
[name: string]: import("vue").Slot | undefined;
}>;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
visible: import("vue").Ref<boolean>;
iconComponent: import("vue").ComputedRef<any>;
iconClass: import("vue").ComputedRef<(string | {
[x: string]: boolean;
})[]>;
isBoldTitle: import("vue").ComputedRef<{
[x: string]: string | import("vue").Slot | undefined;
}>;
close: (evt: MouseEvent) => void;
ElIcon: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}, {
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>> & {
[x: string & `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
}>>;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
style: import("vue").ComputedRef<import("vue").CSSProperties>;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>>, {}>> & Record<string, any>;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
close: (evt: MouseEvent) => boolean;
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly title: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly description: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly type: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "error" | "success" | "warning" | "info", unknown, "info", boolean>;
readonly closable: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly closeText: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly showIcon: BooleanConstructor;
readonly center: BooleanConstructor;
readonly effect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "light" | "dark", unknown, "light", boolean>;
}>> & {
onClose?: ((evt: MouseEvent) => any) | undefined;
}, {
readonly type: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "error" | "success" | "warning" | "info", unknown>;
readonly title: string;
readonly description: string;
readonly closable: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly closeText: string;
readonly effect: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "light" | "dark", unknown>;
readonly showIcon: boolean;
readonly center: boolean;
}>> & Record<string, any>;
export default ElAlert;
export * from './src/alert';
export type { AlertInstance } from './src/instance';

View File

@@ -0,0 +1,9 @@
import '../../utils/index.mjs';
import Alert from './src/alert2.mjs';
export { alertEffects, alertEmits, alertProps } from './src/alert.mjs';
import { withInstall } from '../../utils/vue/install.mjs';
const ElAlert = withInstall(Alert);
export { ElAlert, ElAlert as default };
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","sources":["../../../../../packages/components/alert/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils'\n\nimport Alert from './src/alert.vue'\n\nexport const ElAlert = withInstall(Alert)\nexport default ElAlert\n\nexport * from './src/alert'\nexport type { AlertInstance } from './src/instance'\n"],"names":[],"mappings":";;;;;AAEY,MAAC,OAAO,GAAG,WAAW,CAAC,KAAK;;;;"}

View File

@@ -0,0 +1,17 @@
import type { ExtractPropTypes } from 'vue';
export declare const alertEffects: readonly ["light", "dark"];
export declare const alertProps: {
readonly title: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly description: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly type: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "error" | "success" | "warning" | "info", unknown, "info", boolean>;
readonly closable: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly closeText: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly showIcon: BooleanConstructor;
readonly center: BooleanConstructor;
readonly effect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "light" | "dark", unknown, "light", boolean>;
};
export declare type AlertProps = ExtractPropTypes<typeof alertProps>;
export declare const alertEmits: {
close: (evt: MouseEvent) => boolean;
};
export declare type AlertEmits = typeof alertEmits;

View File

@@ -0,0 +1,42 @@
import '../../../utils/index.mjs';
import { buildProps } from '../../../utils/vue/props/runtime.mjs';
import { keysOf } from '../../../utils/objects.mjs';
import { TypeComponentsMap } from '../../../utils/vue/icon.mjs';
const alertEffects = ["light", "dark"];
const alertProps = buildProps({
title: {
type: String,
default: ""
},
description: {
type: String,
default: ""
},
type: {
type: String,
values: keysOf(TypeComponentsMap),
default: "info"
},
closable: {
type: Boolean,
default: true
},
closeText: {
type: String,
default: ""
},
showIcon: Boolean,
center: Boolean,
effect: {
type: String,
values: alertEffects,
default: "light"
}
});
const alertEmits = {
close: (evt) => evt instanceof MouseEvent
};
export { alertEffects, alertEmits, alertProps };
//# sourceMappingURL=alert.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"alert.mjs","sources":["../../../../../../packages/components/alert/src/alert.ts"],"sourcesContent":["import { TypeComponentsMap, buildProps, keysOf } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\n\nexport const alertEffects = ['light', 'dark'] as const\n\nexport const alertProps = buildProps({\n /**\n * @description alert title.\n */\n title: {\n type: String,\n default: '',\n },\n description: {\n type: String,\n default: '',\n },\n /**\n * @description alert type.\n */\n type: {\n type: String,\n values: keysOf(TypeComponentsMap),\n default: 'info',\n },\n /**\n * @description whether alert can be dismissed.\n */\n closable: {\n type: Boolean,\n default: true,\n },\n /**\n * @description text for replacing x button\n */\n closeText: {\n type: String,\n default: '',\n },\n /**\n * @description whether show icon\n */\n showIcon: Boolean,\n /**\n * @description should content be placed in center.\n */\n center: Boolean,\n effect: {\n type: String,\n values: alertEffects,\n default: 'light',\n },\n} as const)\nexport type AlertProps = ExtractPropTypes<typeof alertProps>\n\nexport const alertEmits = {\n close: (evt: MouseEvent) => evt instanceof MouseEvent,\n}\nexport type AlertEmits = typeof alertEmits\n"],"names":[],"mappings":";;;;;AACY,MAAC,YAAY,GAAG,CAAC,OAAO,EAAE,MAAM,EAAE;AAClC,MAAC,UAAU,GAAG,UAAU,CAAC;AACrC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,MAAM,CAAC,iBAAiB,CAAC;AACrC,IAAI,OAAO,EAAE,MAAM;AACnB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,MAAM,EAAE,OAAO;AACjB,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,YAAY;AACxB,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,UAAU,GAAG;AAC1B,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,UAAU;AAC3C;;;;"}

View File

@@ -0,0 +1,141 @@
declare const _default: import("vue").DefineComponent<{
readonly title: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly description: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly type: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "error" | "success" | "warning" | "info", unknown, "info", boolean>;
readonly closable: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly closeText: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly showIcon: BooleanConstructor;
readonly center: BooleanConstructor;
readonly effect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "light" | "dark", unknown, "light", boolean>;
}, {
Close: any;
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly title: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly description: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly type: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "error" | "success" | "warning" | "info", unknown, "info", boolean>;
readonly closable: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly closeText: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly showIcon: BooleanConstructor;
readonly center: BooleanConstructor;
readonly effect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "light" | "dark", unknown, "light", boolean>;
}>> & {
onClose?: ((evt: MouseEvent) => any) | undefined;
}>>;
emit: (event: "close", evt: MouseEvent) => void;
slots: Readonly<{
[name: string]: import("vue").Slot | undefined;
}>;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
visible: import("vue").Ref<boolean>;
iconComponent: import("vue").ComputedRef<any>;
iconClass: import("vue").ComputedRef<(string | {
[x: string]: boolean;
})[]>;
isBoldTitle: import("vue").ComputedRef<{
[x: string]: string | import("vue").Slot | undefined;
}>;
close: (evt: MouseEvent) => void;
ElIcon: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}, {
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>> & {
[x: string & `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
}>>;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
style: import("vue").ComputedRef<import("vue").CSSProperties>;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>>, {}>> & Record<string, any>;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
close: (evt: MouseEvent) => boolean;
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly title: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly description: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly type: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "error" | "success" | "warning" | "info", unknown, "info", boolean>;
readonly closable: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly closeText: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly showIcon: BooleanConstructor;
readonly center: BooleanConstructor;
readonly effect: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "light" | "dark", unknown, "light", boolean>;
}>> & {
onClose?: ((evt: MouseEvent) => any) | undefined;
}, {
readonly type: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "error" | "success" | "warning" | "info", unknown>;
readonly title: string;
readonly description: string;
readonly closable: import("element-plus/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
readonly closeText: string;
readonly effect: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "light" | "dark", unknown>;
readonly showIcon: boolean;
readonly center: boolean;
}>;
export default _default;

View File

@@ -0,0 +1,102 @@
import { defineComponent, useSlots, ref, computed, openBlock, createBlock, Transition, unref, withCtx, withDirectives, createElementVNode, normalizeClass, resolveDynamicComponent, createCommentVNode, createElementBlock, renderSlot, createTextVNode, toDisplayString, Fragment, createVNode, vShow } from 'vue';
import { ElIcon } from '../../icon/index.mjs';
import '../../../utils/index.mjs';
import '../../../hooks/index.mjs';
import { alertProps, alertEmits } from './alert.mjs';
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
import { TypeComponents, TypeComponentsMap } from '../../../utils/vue/icon.mjs';
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
const __default__ = defineComponent({
name: "ElAlert"
});
const _sfc_main = /* @__PURE__ */ defineComponent({
...__default__,
props: alertProps,
emits: alertEmits,
setup(__props, { emit }) {
const props = __props;
const { Close } = TypeComponents;
const slots = useSlots();
const ns = useNamespace("alert");
const visible = ref(true);
const iconComponent = computed(() => TypeComponentsMap[props.type]);
const iconClass = computed(() => [
ns.e("icon"),
{ [ns.is("big")]: !!props.description || !!slots.default }
]);
const isBoldTitle = computed(() => {
return { [ns.is("bold")]: props.description || slots.default };
});
const close = (evt) => {
visible.value = false;
emit("close", evt);
};
return (_ctx, _cache) => {
return openBlock(), createBlock(Transition, {
name: unref(ns).b("fade"),
persisted: ""
}, {
default: withCtx(() => [
withDirectives(createElementVNode("div", {
class: normalizeClass([unref(ns).b(), unref(ns).m(_ctx.type), unref(ns).is("center", _ctx.center), unref(ns).is(_ctx.effect)]),
role: "alert"
}, [
_ctx.showIcon && unref(iconComponent) ? (openBlock(), createBlock(unref(ElIcon), {
key: 0,
class: normalizeClass(unref(iconClass))
}, {
default: withCtx(() => [
(openBlock(), createBlock(resolveDynamicComponent(unref(iconComponent))))
]),
_: 1
}, 8, ["class"])) : createCommentVNode("v-if", true),
createElementVNode("div", {
class: normalizeClass(unref(ns).e("content"))
}, [
_ctx.title || _ctx.$slots.title ? (openBlock(), createElementBlock("span", {
key: 0,
class: normalizeClass([unref(ns).e("title"), unref(isBoldTitle)])
}, [
renderSlot(_ctx.$slots, "title", {}, () => [
createTextVNode(toDisplayString(_ctx.title), 1)
])
], 2)) : createCommentVNode("v-if", true),
_ctx.$slots.default || _ctx.description ? (openBlock(), createElementBlock("p", {
key: 1,
class: normalizeClass(unref(ns).e("description"))
}, [
renderSlot(_ctx.$slots, "default", {}, () => [
createTextVNode(toDisplayString(_ctx.description), 1)
])
], 2)) : createCommentVNode("v-if", true),
_ctx.closable ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [
_ctx.closeText ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass([unref(ns).e("close-btn"), unref(ns).is("customed")]),
onClick: close
}, toDisplayString(_ctx.closeText), 3)) : (openBlock(), createBlock(unref(ElIcon), {
key: 1,
class: normalizeClass(unref(ns).e("close-btn")),
onClick: close
}, {
default: withCtx(() => [
createVNode(unref(Close))
]),
_: 1
}, 8, ["class"]))
], 64)) : createCommentVNode("v-if", true)
], 2)
], 2), [
[vShow, visible.value]
])
]),
_: 3
}, 8, ["name"]);
};
}
});
var Alert = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/alert/src/alert.vue"]]);
export { Alert as default };
//# sourceMappingURL=alert2.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"alert2.mjs","sources":["../../../../../../packages/components/alert/src/alert.vue"],"sourcesContent":["<template>\n <transition :name=\"ns.b('fade')\">\n <div\n v-show=\"visible\"\n :class=\"[ns.b(), ns.m(type), ns.is('center', center), ns.is(effect)]\"\n role=\"alert\"\n >\n <el-icon v-if=\"showIcon && iconComponent\" :class=\"iconClass\">\n <component :is=\"iconComponent\" />\n </el-icon>\n\n <div :class=\"ns.e('content')\">\n <span\n v-if=\"title || $slots.title\"\n :class=\"[ns.e('title'), isBoldTitle]\"\n >\n <slot name=\"title\">{{ title }}</slot>\n </span>\n <p v-if=\"$slots.default || description\" :class=\"ns.e('description')\">\n <slot>\n {{ description }}\n </slot>\n </p>\n <template v-if=\"closable\">\n <div\n v-if=\"closeText\"\n :class=\"[ns.e('close-btn'), ns.is('customed')]\"\n @click=\"close\"\n >\n {{ closeText }}\n </div>\n <el-icon v-else :class=\"ns.e('close-btn')\" @click=\"close\">\n <Close />\n </el-icon>\n </template>\n </div>\n </div>\n </transition>\n</template>\n<script lang=\"ts\" setup>\nimport { computed, ref, useSlots } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { TypeComponents, TypeComponentsMap } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { alertEmits, alertProps } from './alert'\n\nconst { Close } = TypeComponents\n\ndefineOptions({\n name: 'ElAlert',\n})\n\nconst props = defineProps(alertProps)\nconst emit = defineEmits(alertEmits)\nconst slots = useSlots()\n\nconst ns = useNamespace('alert')\n\nconst visible = ref(true)\n\nconst iconComponent = computed(() => TypeComponentsMap[props.type])\n\nconst iconClass = computed(() => [\n ns.e('icon'),\n { [ns.is('big')]: !!props.description || !!slots.default },\n])\n\nconst isBoldTitle = computed(() => {\n return { [ns.is('bold')]: props.description || slots.default }\n})\n\nconst close = (evt: MouseEvent) => {\n visible.value = false\n emit('close', evt)\n}\n</script>\n"],"names":[],"mappings":";;;;;;;;;mCAgDc,CAAA;AAAA,EACZ,IAAM,EAAA,SAAA;AACR,CAAA,CAAA,CAAA;;;;;;;AAJA,IAAA,MAAM,EAAE,KAAU,EAAA,GAAA,cAAA,CAAA;AAQlB,IAAA,MAAM,QAAQ,QAAS,EAAA,CAAA;AAEvB,IAAM,MAAA,EAAA,GAAK,aAAa,OAAO,CAAA,CAAA;AAE/B,IAAM,MAAA,OAAA,GAAU,IAAI,IAAI,CAAA,CAAA;AAExB,IAAA,MAAM,aAAgB,GAAA,QAAA,CAAS,MAAM,iBAAA,CAAkB,MAAM,IAAK,CAAA,CAAA,CAAA;AAElE,IAAM,MAAA,SAAA,GAAY,SAAS,MAAM;AAAA,MAC/B,EAAA,CAAG,EAAE,MAAM,CAAA;AAAA,MACX,EAAE,CAAC,EAAG,CAAA,EAAA,CAAG,KAAK,CAAA,GAAI,CAAC,CAAC,KAAM,CAAA,WAAA,IAAe,CAAC,CAAC,MAAM,OAAQ,EAAA;AAAA,KAC1D,CAAA,CAAA;AAED,IAAM,MAAA,WAAA,GAAc,SAAS,MAAM;AACjC,MAAO,OAAA,EAAE,CAAC,EAAG,CAAA,EAAA,CAAG,MAAM,CAAI,GAAA,KAAA,CAAM,WAAe,IAAA,KAAA,CAAM,OAAQ,EAAA,CAAA;AAAA,KAC9D,CAAA,CAAA;AAED,IAAM,MAAA,KAAA,GAAQ,CAAC,GAAoB,KAAA;AACjC,MAAA,OAAA,CAAQ,KAAQ,GAAA,KAAA,CAAA;AAChB,MAAA,IAAA,CAAK,SAAS,GAAG,CAAA,CAAA;AAAA,KACnB,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

View File

@@ -0,0 +1,2 @@
import type Alert from './alert.vue';
export declare type AlertInstance = InstanceType<typeof Alert>;

View File

@@ -0,0 +1,2 @@
//# sourceMappingURL=instance.mjs.map

View File

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

View File

@@ -0,0 +1,2 @@
import 'element-plus/es/components/base/style/css';
import 'element-plus/theme-chalk/el-alert.css';

View File

@@ -0,0 +1,3 @@
import '../../base/style/css.mjs';
import 'element-plus/theme-chalk/el-alert.css';
//# sourceMappingURL=css.mjs.map

View File

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

View File

@@ -0,0 +1,2 @@
import 'element-plus/es/components/base/style';
import 'element-plus/theme-chalk/src/alert.scss';

View File

@@ -0,0 +1,3 @@
import '../../base/style/index.mjs';
import 'element-plus/theme-chalk/src/alert.scss';
//# sourceMappingURL=index.mjs.map

View File

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

View File

@@ -0,0 +1,2 @@
import 'element-plus/es/components/base/style/css';
import 'element-plus/theme-chalk/el-aside.css';

View File

@@ -0,0 +1,3 @@
import '../../base/style/css.mjs';
import 'element-plus/theme-chalk/el-aside.css';
//# sourceMappingURL=css.mjs.map

View File

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

View File

@@ -0,0 +1,2 @@
import 'element-plus/es/components/base/style';
import 'element-plus/theme-chalk/src/aside.scss';

View File

@@ -0,0 +1,3 @@
import '../../base/style/index.mjs';
import 'element-plus/theme-chalk/src/aside.scss';
//# sourceMappingURL=index.mjs.map

View File

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

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,9 @@
import '../../utils/index.mjs';
import Autocomplete from './src/autocomplete2.mjs';
export { autocompleteEmits, autocompleteProps } from './src/autocomplete.mjs';
import { withInstall } from '../../utils/vue/install.mjs';
const ElAutocomplete = withInstall(Autocomplete);
export { ElAutocomplete, ElAutocomplete as default };
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","sources":["../../../../../packages/components/autocomplete/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils'\nimport Autocomplete from './src/autocomplete.vue'\n\nexport const ElAutocomplete = withInstall(Autocomplete)\n\nexport default ElAutocomplete\n\nexport * from './src/autocomplete'\n"],"names":[],"mappings":";;;;;AAEY,MAAC,cAAc,GAAG,WAAW,CAAC,YAAY;;;;"}

View File

@@ -0,0 +1,42 @@
import type { ExtractPropTypes } from 'vue';
import type Autocomplete from './autocomplete.vue';
import type { Placement } from 'element-plus/es/components/popper';
import type { Awaitable } from 'element-plus/es/utils';
export declare type AutocompleteData = Record<string, any>[];
export declare type AutocompleteFetchSuggestionsCallback = (data: AutocompleteData) => void;
export declare type AutocompleteFetchSuggestions = ((queryString: string, cb: AutocompleteFetchSuggestionsCallback) => Awaitable<AutocompleteData> | void) | AutocompleteData;
export declare const autocompleteProps: {
readonly valueKey: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "value", boolean>;
readonly modelValue: import("element-plus/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, "", boolean>;
readonly debounce: import("element-plus/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 300, boolean>;
readonly placement: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => Placement & {}) | (() => Placement) | ((new (...args: any[]) => Placement & {}) | (() => Placement))[], "top" | "bottom" | "top-start" | "top-end" | "bottom-start" | "bottom-end", unknown, "bottom-start", boolean>;
readonly fetchSuggestions: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => ((queryString: string, cb: AutocompleteFetchSuggestionsCallback) => Awaitable<AutocompleteData> | void) | AutocompleteData) | (() => AutocompleteFetchSuggestions) | ((new (...args: any[]) => ((queryString: string, cb: AutocompleteFetchSuggestionsCallback) => Awaitable<AutocompleteData> | void) | AutocompleteData) | (() => AutocompleteFetchSuggestions))[], unknown, unknown, () => void, boolean>;
readonly popperClass: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly triggerOnFocus: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly selectWhenUnmatched: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
readonly hideLoading: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
readonly label: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly teleported: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly highlightFirstItem: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
readonly fitInputWidth: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
readonly clearable: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
readonly disabled: import("element-plus/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
readonly name: StringConstructor;
};
export declare type AutocompleteProps = ExtractPropTypes<typeof autocompleteProps>;
export declare const autocompleteEmits: {
"update:modelValue": (value: string) => boolean;
input: (value: string) => boolean;
change: (value: string) => boolean;
focus: (evt: FocusEvent) => boolean;
blur: (evt: FocusEvent) => boolean;
clear: () => boolean;
select: (item: Record<string, any>) => boolean;
};
export declare type AutocompleteEmits = typeof autocompleteEmits;
export declare type AutocompleteInstance = InstanceType<typeof Autocomplete>;

View File

@@ -0,0 +1,87 @@
import { NOOP, isString, isObject } from '@vue/shared';
import '../../../utils/index.mjs';
import '../../tooltip/index.mjs';
import '../../../constants/index.mjs';
import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
import { useTooltipContentProps } from '../../tooltip/src/content.mjs';
import { UPDATE_MODEL_EVENT, INPUT_EVENT, CHANGE_EVENT } from '../../../constants/event.mjs';
const autocompleteProps = buildProps({
valueKey: {
type: String,
default: "value"
},
modelValue: {
type: [String, Number],
default: ""
},
debounce: {
type: Number,
default: 300
},
placement: {
type: definePropType(String),
values: [
"top",
"top-start",
"top-end",
"bottom",
"bottom-start",
"bottom-end"
],
default: "bottom-start"
},
fetchSuggestions: {
type: definePropType([Function, Array]),
default: NOOP
},
popperClass: {
type: String,
default: ""
},
triggerOnFocus: {
type: Boolean,
default: true
},
selectWhenUnmatched: {
type: Boolean,
default: false
},
hideLoading: {
type: Boolean,
default: false
},
label: {
type: String
},
teleported: useTooltipContentProps.teleported,
highlightFirstItem: {
type: Boolean,
default: false
},
fitInputWidth: {
type: Boolean,
default: false
},
clearable: {
type: Boolean,
default: false
},
disabled: {
type: Boolean,
default: false
},
name: String
});
const autocompleteEmits = {
[UPDATE_MODEL_EVENT]: (value) => isString(value),
[INPUT_EVENT]: (value) => isString(value),
[CHANGE_EVENT]: (value) => isString(value),
focus: (evt) => evt instanceof FocusEvent,
blur: (evt) => evt instanceof FocusEvent,
clear: () => true,
select: (item) => isObject(item)
};
export { autocompleteEmits, autocompleteProps };
//# sourceMappingURL=autocomplete.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,367 @@
import { defineComponent, useAttrs as useAttrs$1, ref, computed, onMounted, openBlock, createBlock, unref, withCtx, createElementVNode, normalizeClass, normalizeStyle, createVNode, createElementBlock, Fragment, renderList, renderSlot, createTextVNode, toDisplayString, mergeProps, withKeys, withModifiers, createSlots } from 'vue';
import { debounce } from 'lodash-unified';
import { onClickOutside } from '@vueuse/core';
import { Loading } from '@element-plus/icons-vue';
import '../../../hooks/index.mjs';
import '../../../utils/index.mjs';
import '../../../constants/index.mjs';
import { ElInput } from '../../input/index.mjs';
import { ElScrollbar } from '../../scrollbar/index.mjs';
import { ElTooltip } from '../../tooltip/index.mjs';
import { ElIcon } from '../../icon/index.mjs';
import '../../form/index.mjs';
import { autocompleteProps, autocompleteEmits } from './autocomplete.mjs';
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
import { useAttrs } from '../../../hooks/use-attrs/index.mjs';
import { useFormDisabled } from '../../form/src/hooks/use-form-common-props.mjs';
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
import { generateId } from '../../../utils/rand.mjs';
import { isArray } from '@vue/shared';
import { throwError } from '../../../utils/error.mjs';
import { INPUT_EVENT, UPDATE_MODEL_EVENT, CHANGE_EVENT } from '../../../constants/event.mjs';
const _hoisted_1 = ["aria-expanded", "aria-owns"];
const _hoisted_2 = { key: 0 };
const _hoisted_3 = ["id", "aria-selected", "onClick"];
const COMPONENT_NAME = "ElAutocomplete";
const __default__ = defineComponent({
name: COMPONENT_NAME,
inheritAttrs: false
});
const _sfc_main = /* @__PURE__ */ defineComponent({
...__default__,
props: autocompleteProps,
emits: autocompleteEmits,
setup(__props, { expose, emit }) {
const props = __props;
const attrs = useAttrs();
const rawAttrs = useAttrs$1();
const disabled = useFormDisabled();
const ns = useNamespace("autocomplete");
const inputRef = ref();
const regionRef = ref();
const popperRef = ref();
const listboxRef = ref();
let readonly = false;
let ignoreFocusEvent = false;
const suggestions = ref([]);
const highlightedIndex = ref(-1);
const dropdownWidth = ref("");
const activated = ref(false);
const suggestionDisabled = ref(false);
const loading = ref(false);
const listboxId = computed(() => ns.b(String(generateId())));
const styles = computed(() => rawAttrs.style);
const suggestionVisible = computed(() => {
const isValidData = suggestions.value.length > 0;
return (isValidData || loading.value) && activated.value;
});
const suggestionLoading = computed(() => !props.hideLoading && loading.value);
const refInput = computed(() => {
if (inputRef.value) {
return Array.from(inputRef.value.$el.querySelectorAll("input"));
}
return [];
});
const onSuggestionShow = () => {
if (suggestionVisible.value) {
dropdownWidth.value = `${inputRef.value.$el.offsetWidth}px`;
}
};
const onHide = () => {
highlightedIndex.value = -1;
};
const getData = async (queryString) => {
if (suggestionDisabled.value)
return;
const cb = (suggestionList) => {
loading.value = false;
if (suggestionDisabled.value)
return;
if (isArray(suggestionList)) {
suggestions.value = suggestionList;
highlightedIndex.value = props.highlightFirstItem ? 0 : -1;
} else {
throwError(COMPONENT_NAME, "autocomplete suggestions must be an array");
}
};
loading.value = true;
if (isArray(props.fetchSuggestions)) {
cb(props.fetchSuggestions);
} else {
const result = await props.fetchSuggestions(queryString, cb);
if (isArray(result))
cb(result);
}
};
const debouncedGetData = debounce(getData, props.debounce);
const handleInput = (value) => {
const valuePresented = !!value;
emit(INPUT_EVENT, value);
emit(UPDATE_MODEL_EVENT, value);
suggestionDisabled.value = false;
activated.value || (activated.value = valuePresented);
if (!props.triggerOnFocus && !value) {
suggestionDisabled.value = true;
suggestions.value = [];
return;
}
debouncedGetData(value);
};
const handleMouseDown = (event) => {
var _a;
if (disabled.value)
return;
if (((_a = event.target) == null ? void 0 : _a.tagName) !== "INPUT" || refInput.value.includes(document.activeElement)) {
activated.value = true;
}
};
const handleChange = (value) => {
emit(CHANGE_EVENT, value);
};
const handleFocus = (evt) => {
if (!ignoreFocusEvent) {
activated.value = true;
emit("focus", evt);
if (props.triggerOnFocus && !readonly) {
debouncedGetData(String(props.modelValue));
}
} else {
ignoreFocusEvent = false;
}
};
const handleBlur = (evt) => {
setTimeout(() => {
var _a;
if ((_a = popperRef.value) == null ? void 0 : _a.isFocusInsideContent()) {
ignoreFocusEvent = true;
return;
}
activated.value && close();
emit("blur", evt);
});
};
const handleClear = () => {
activated.value = false;
emit(UPDATE_MODEL_EVENT, "");
emit("clear");
};
const handleKeyEnter = async () => {
if (suggestionVisible.value && highlightedIndex.value >= 0 && highlightedIndex.value < suggestions.value.length) {
handleSelect(suggestions.value[highlightedIndex.value]);
} else if (props.selectWhenUnmatched) {
emit("select", { value: props.modelValue });
suggestions.value = [];
highlightedIndex.value = -1;
}
};
const handleKeyEscape = (evt) => {
if (suggestionVisible.value) {
evt.preventDefault();
evt.stopPropagation();
close();
}
};
const close = () => {
activated.value = false;
};
const focus = () => {
var _a;
(_a = inputRef.value) == null ? void 0 : _a.focus();
};
const blur = () => {
var _a;
(_a = inputRef.value) == null ? void 0 : _a.blur();
};
const handleSelect = async (item) => {
emit(INPUT_EVENT, item[props.valueKey]);
emit(UPDATE_MODEL_EVENT, item[props.valueKey]);
emit("select", item);
suggestions.value = [];
highlightedIndex.value = -1;
};
const highlight = (index) => {
if (!suggestionVisible.value || loading.value)
return;
if (index < 0) {
highlightedIndex.value = -1;
return;
}
if (index >= suggestions.value.length) {
index = suggestions.value.length - 1;
}
const suggestion = regionRef.value.querySelector(`.${ns.be("suggestion", "wrap")}`);
const suggestionList = suggestion.querySelectorAll(`.${ns.be("suggestion", "list")} li`);
const highlightItem = suggestionList[index];
const scrollTop = suggestion.scrollTop;
const { offsetTop, scrollHeight } = highlightItem;
if (offsetTop + scrollHeight > scrollTop + suggestion.clientHeight) {
suggestion.scrollTop += scrollHeight;
}
if (offsetTop < scrollTop) {
suggestion.scrollTop -= scrollHeight;
}
highlightedIndex.value = index;
inputRef.value.ref.setAttribute("aria-activedescendant", `${listboxId.value}-item-${highlightedIndex.value}`);
};
onClickOutside(listboxRef, () => {
suggestionVisible.value && close();
});
onMounted(() => {
;
inputRef.value.ref.setAttribute("role", "textbox");
inputRef.value.ref.setAttribute("aria-autocomplete", "list");
inputRef.value.ref.setAttribute("aria-controls", "id");
inputRef.value.ref.setAttribute("aria-activedescendant", `${listboxId.value}-item-${highlightedIndex.value}`);
readonly = inputRef.value.ref.hasAttribute("readonly");
});
expose({
highlightedIndex,
activated,
loading,
inputRef,
popperRef,
suggestions,
handleSelect,
handleKeyEnter,
focus,
blur,
close,
highlight
});
return (_ctx, _cache) => {
return openBlock(), createBlock(unref(ElTooltip), {
ref_key: "popperRef",
ref: popperRef,
visible: unref(suggestionVisible),
placement: _ctx.placement,
"fallback-placements": ["bottom-start", "top-start"],
"popper-class": [unref(ns).e("popper"), _ctx.popperClass],
teleported: _ctx.teleported,
"gpu-acceleration": false,
pure: "",
"manual-mode": "",
effect: "light",
trigger: "click",
transition: `${unref(ns).namespace.value}-zoom-in-top`,
persistent: "",
role: "listbox",
onBeforeShow: onSuggestionShow,
onHide
}, {
content: withCtx(() => [
createElementVNode("div", {
ref_key: "regionRef",
ref: regionRef,
class: normalizeClass([unref(ns).b("suggestion"), unref(ns).is("loading", unref(suggestionLoading))]),
style: normalizeStyle({
[_ctx.fitInputWidth ? "width" : "minWidth"]: dropdownWidth.value,
outline: "none"
}),
role: "region"
}, [
createVNode(unref(ElScrollbar), {
id: unref(listboxId),
tag: "ul",
"wrap-class": unref(ns).be("suggestion", "wrap"),
"view-class": unref(ns).be("suggestion", "list"),
role: "listbox"
}, {
default: withCtx(() => [
unref(suggestionLoading) ? (openBlock(), createElementBlock("li", _hoisted_2, [
createVNode(unref(ElIcon), {
class: normalizeClass(unref(ns).is("loading"))
}, {
default: withCtx(() => [
createVNode(unref(Loading))
]),
_: 1
}, 8, ["class"])
])) : (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(suggestions.value, (item, index) => {
return openBlock(), createElementBlock("li", {
id: `${unref(listboxId)}-item-${index}`,
key: index,
class: normalizeClass({ highlighted: highlightedIndex.value === index }),
role: "option",
"aria-selected": highlightedIndex.value === index,
onClick: ($event) => handleSelect(item)
}, [
renderSlot(_ctx.$slots, "default", { item }, () => [
createTextVNode(toDisplayString(item[_ctx.valueKey]), 1)
])
], 10, _hoisted_3);
}), 128))
]),
_: 3
}, 8, ["id", "wrap-class", "view-class"])
], 6)
]),
default: withCtx(() => [
createElementVNode("div", {
ref_key: "listboxRef",
ref: listboxRef,
class: normalizeClass([unref(ns).b(), _ctx.$attrs.class]),
style: normalizeStyle(unref(styles)),
role: "combobox",
"aria-haspopup": "listbox",
"aria-expanded": unref(suggestionVisible),
"aria-owns": unref(listboxId)
}, [
createVNode(unref(ElInput), mergeProps({
ref_key: "inputRef",
ref: inputRef
}, unref(attrs), {
clearable: _ctx.clearable,
disabled: unref(disabled),
name: _ctx.name,
"model-value": _ctx.modelValue,
onInput: handleInput,
onChange: handleChange,
onFocus: handleFocus,
onBlur: handleBlur,
onClear: handleClear,
onKeydown: [
_cache[0] || (_cache[0] = withKeys(withModifiers(($event) => highlight(highlightedIndex.value - 1), ["prevent"]), ["up"])),
_cache[1] || (_cache[1] = withKeys(withModifiers(($event) => highlight(highlightedIndex.value + 1), ["prevent"]), ["down"])),
withKeys(handleKeyEnter, ["enter"]),
withKeys(close, ["tab"]),
withKeys(handleKeyEscape, ["esc"])
],
onMousedown: handleMouseDown
}), createSlots({ _: 2 }, [
_ctx.$slots.prepend ? {
name: "prepend",
fn: withCtx(() => [
renderSlot(_ctx.$slots, "prepend")
])
} : void 0,
_ctx.$slots.append ? {
name: "append",
fn: withCtx(() => [
renderSlot(_ctx.$slots, "append")
])
} : void 0,
_ctx.$slots.prefix ? {
name: "prefix",
fn: withCtx(() => [
renderSlot(_ctx.$slots, "prefix")
])
} : void 0,
_ctx.$slots.suffix ? {
name: "suffix",
fn: withCtx(() => [
renderSlot(_ctx.$slots, "suffix")
])
} : void 0
]), 1040, ["clearable", "disabled", "name", "model-value", "onKeydown"])
], 14, _hoisted_1)
]),
_: 3
}, 8, ["visible", "placement", "popper-class", "teleported", "transition"]);
};
}
});
var Autocomplete = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/autocomplete/src/autocomplete.vue"]]);
export { Autocomplete as default };
//# sourceMappingURL=autocomplete2.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,5 @@
import 'element-plus/es/components/base/style/css';
import 'element-plus/theme-chalk/el-autocomplete.css';
import 'element-plus/es/components/input/style/css';
import 'element-plus/es/components/scrollbar/style/css';
import 'element-plus/es/components/popper/style/css';

View File

@@ -0,0 +1,6 @@
import '../../base/style/css.mjs';
import 'element-plus/theme-chalk/el-autocomplete.css';
import '../../input/style/css.mjs';
import '../../scrollbar/style/css.mjs';
import '../../popper/style/css.mjs';
//# sourceMappingURL=css.mjs.map

View File

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

View File

@@ -0,0 +1,5 @@
import 'element-plus/es/components/base/style';
import 'element-plus/theme-chalk/src/autocomplete.scss';
import 'element-plus/es/components/input/style';
import 'element-plus/es/components/scrollbar/style';
import 'element-plus/es/components/popper/style';

View File

@@ -0,0 +1,6 @@
import '../../base/style/index.mjs';
import 'element-plus/theme-chalk/src/autocomplete.scss';
import '../../input/style/index.mjs';
import '../../scrollbar/style/index.mjs';
import '../../popper/style/index.mjs';
//# sourceMappingURL=index.mjs.map

View File

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

View File

@@ -0,0 +1,143 @@
export declare const ElAvatar: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
readonly size: import("element-plus/es/utils").EpPropFinalized<readonly [NumberConstructor, StringConstructor], "" | "default" | "small" | "large", number, "", boolean>;
readonly shape: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "circle" | "square", unknown, "circle", boolean>;
readonly icon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly src: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly alt: StringConstructor;
readonly srcSet: StringConstructor;
readonly fit: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty) | ((new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty))[], unknown, unknown, "cover", boolean>;
}, {
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly size: import("element-plus/es/utils").EpPropFinalized<readonly [NumberConstructor, StringConstructor], "" | "default" | "small" | "large", number, "", boolean>;
readonly shape: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "circle" | "square", unknown, "circle", boolean>;
readonly icon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly src: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly alt: StringConstructor;
readonly srcSet: StringConstructor;
readonly fit: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty) | ((new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty))[], unknown, unknown, "cover", boolean>;
}>> & {
onError?: ((evt: Event) => any) | undefined;
}>>;
emit: (event: "error", evt: Event) => void;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
hasLoadError: import("vue").Ref<boolean>;
avatarClass: import("vue").ComputedRef<string[]>;
sizeStyle: import("vue").ComputedRef<import("vue").CSSProperties | undefined>;
fitStyle: import("vue").ComputedRef<import("vue").CSSProperties>;
handleError: (e: Event) => void;
ElIcon: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}, {
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>> & {
[x: string & `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
}>>;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
style: import("vue").ComputedRef<import("vue").CSSProperties>;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>>, {}>> & Record<string, any>;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
error: (evt: Event) => boolean;
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly size: import("element-plus/es/utils").EpPropFinalized<readonly [NumberConstructor, StringConstructor], "" | "default" | "small" | "large", number, "", boolean>;
readonly shape: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "circle" | "square", unknown, "circle", boolean>;
readonly icon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly src: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly alt: StringConstructor;
readonly srcSet: StringConstructor;
readonly fit: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty) | ((new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty))[], unknown, unknown, "cover", boolean>;
}>> & {
onError?: ((evt: Event) => any) | undefined;
}, {
readonly size: import("element-plus/es/utils").EpPropMergeType<readonly [NumberConstructor, StringConstructor], "" | "default" | "small" | "large", number>;
readonly shape: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "circle" | "square", unknown>;
readonly src: string;
readonly fit: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty) | ((new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty))[], unknown, unknown>;
}>> & Record<string, any>;
export default ElAvatar;
export * from './src/avatar';
export type { AvatarInstance } from './src/instance';

View File

@@ -0,0 +1,9 @@
import '../../utils/index.mjs';
import Avatar from './src/avatar2.mjs';
export { avatarEmits, avatarProps } from './src/avatar.mjs';
import { withInstall } from '../../utils/vue/install.mjs';
const ElAvatar = withInstall(Avatar);
export { ElAvatar, ElAvatar as default };
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","sources":["../../../../../packages/components/avatar/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils'\nimport Avatar from './src/avatar.vue'\n\nexport const ElAvatar = withInstall(Avatar)\nexport default ElAvatar\n\nexport * from './src/avatar'\nexport type { AvatarInstance } from './src/instance'\n"],"names":[],"mappings":";;;;;AAEY,MAAC,QAAQ,GAAG,WAAW,CAAC,MAAM;;;;"}

View File

@@ -0,0 +1,21 @@
import type { ExtractPropTypes } from 'vue';
import type { ObjectFitProperty } from 'csstype';
export declare const avatarProps: {
readonly size: import("element-plus/es/utils").EpPropFinalized<readonly [NumberConstructor, StringConstructor], "" | "default" | "small" | "large", number, "", boolean>;
readonly shape: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "circle" | "square", unknown, "circle", boolean>;
readonly icon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly src: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly alt: StringConstructor;
readonly srcSet: StringConstructor;
readonly fit: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => ObjectFitProperty & {}) | (() => ObjectFitProperty) | ((new (...args: any[]) => ObjectFitProperty & {}) | (() => ObjectFitProperty))[], unknown, unknown, "cover", boolean>;
};
export declare type AvatarProps = ExtractPropTypes<typeof avatarProps>;
export declare const avatarEmits: {
error: (evt: Event) => boolean;
};
export declare type AvatarEmits = typeof avatarEmits;

View File

@@ -0,0 +1,39 @@
import '../../../utils/index.mjs';
import '../../../constants/index.mjs';
import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
import { componentSizes } from '../../../constants/size.mjs';
import { isNumber } from '../../../utils/types.mjs';
import { iconPropType } from '../../../utils/vue/icon.mjs';
const avatarProps = buildProps({
size: {
type: [Number, String],
values: componentSizes,
default: "",
validator: (val) => isNumber(val)
},
shape: {
type: String,
values: ["circle", "square"],
default: "circle"
},
icon: {
type: iconPropType
},
src: {
type: String,
default: ""
},
alt: String,
srcSet: String,
fit: {
type: definePropType(String),
default: "cover"
}
});
const avatarEmits = {
error: (evt) => evt instanceof Event
};
export { avatarEmits, avatarProps };
//# sourceMappingURL=avatar.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"avatar.mjs","sources":["../../../../../../packages/components/avatar/src/avatar.ts"],"sourcesContent":["import {\n buildProps,\n definePropType,\n iconPropType,\n isNumber,\n} from '@element-plus/utils'\nimport { componentSizes } from '@element-plus/constants'\nimport type { ExtractPropTypes } from 'vue'\nimport type { ObjectFitProperty } from 'csstype'\n\nexport const avatarProps = buildProps({\n /**\n * @description avatar size.\n */\n size: {\n type: [Number, String],\n values: componentSizes,\n default: '',\n validator: (val: unknown): val is number => isNumber(val),\n },\n /**\n * @description avatar shape.\n */\n shape: {\n type: String,\n values: ['circle', 'square'],\n default: 'circle',\n },\n /**\n * @description representation type to icon, more info on icon component.\n */\n icon: {\n type: iconPropType,\n },\n /**\n * @description the source of the image for an image avatar.\n */\n src: {\n type: String,\n default: '',\n },\n /**\n * @description native attribute `alt` of image avatar.\n */\n alt: String,\n /**\n * @description native attribute srcset of image avatar.\n */\n srcSet: String,\n /**\n * @description set how the image fit its container for an image avatar.\n */\n fit: {\n type: definePropType<ObjectFitProperty>(String),\n default: 'cover',\n },\n} as const)\nexport type AvatarProps = ExtractPropTypes<typeof avatarProps>\n\nexport const avatarEmits = {\n error: (evt: Event) => evt instanceof Event,\n}\nexport type AvatarEmits = typeof avatarEmits\n"],"names":[],"mappings":";;;;;;;AAOY,MAAC,WAAW,GAAG,UAAU,CAAC;AACtC,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,MAAM,EAAE,cAAc;AAC1B,IAAI,OAAO,EAAE,EAAE;AACf,IAAI,SAAS,EAAE,CAAC,GAAG,KAAK,QAAQ,CAAC,GAAG,CAAC;AACrC,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,QAAQ,EAAE,QAAQ,CAAC;AAChC,IAAI,OAAO,EAAE,QAAQ;AACrB,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,YAAY;AACtB,GAAG;AACH,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,GAAG,EAAE,MAAM;AACb,EAAE,MAAM,EAAE,MAAM;AAChB,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,WAAW,GAAG;AAC3B,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,KAAK;AACtC;;;;"}

View File

@@ -0,0 +1,142 @@
import type { CSSProperties } from 'vue';
declare const _default: import("vue").DefineComponent<{
readonly size: import("element-plus/es/utils").EpPropFinalized<readonly [NumberConstructor, StringConstructor], "" | "default" | "small" | "large", number, "", boolean>;
readonly shape: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "circle" | "square", unknown, "circle", boolean>;
readonly icon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly src: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly alt: StringConstructor;
readonly srcSet: StringConstructor;
readonly fit: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty) | ((new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty))[], unknown, unknown, "cover", boolean>;
}, {
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly size: import("element-plus/es/utils").EpPropFinalized<readonly [NumberConstructor, StringConstructor], "" | "default" | "small" | "large", number, "", boolean>;
readonly shape: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "circle" | "square", unknown, "circle", boolean>;
readonly icon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly src: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly alt: StringConstructor;
readonly srcSet: StringConstructor;
readonly fit: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty) | ((new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty))[], unknown, unknown, "cover", boolean>;
}>> & {
onError?: ((evt: Event) => any) | undefined;
}>>;
emit: (event: "error", evt: Event) => void;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
hasLoadError: import("vue").Ref<boolean>;
avatarClass: import("vue").ComputedRef<string[]>;
sizeStyle: import("vue").ComputedRef<CSSProperties | undefined>;
fitStyle: import("vue").ComputedRef<CSSProperties>;
handleError: (e: Event) => void;
ElIcon: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}, {
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>> & {
[x: string & `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
}>>;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
style: import("vue").ComputedRef<CSSProperties>;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>>, {}>> & Record<string, any>;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
error: (evt: Event) => boolean;
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly size: import("element-plus/es/utils").EpPropFinalized<readonly [NumberConstructor, StringConstructor], "" | "default" | "small" | "large", number, "", boolean>;
readonly shape: import("element-plus/es/utils").EpPropFinalized<StringConstructor, "circle" | "square", unknown, "circle", boolean>;
readonly icon: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) | ((new (...args: any[]) => (string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>) & {}) | (() => string | import("vue").Component<any, any, any, import("vue").ComputedOptions, import("vue").MethodOptions>))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly src: import("element-plus/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly alt: StringConstructor;
readonly srcSet: StringConstructor;
readonly fit: import("element-plus/es/utils").EpPropFinalized<(new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty) | ((new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty))[], unknown, unknown, "cover", boolean>;
}>> & {
onError?: ((evt: Event) => any) | undefined;
}, {
readonly size: import("element-plus/es/utils").EpPropMergeType<readonly [NumberConstructor, StringConstructor], "" | "default" | "small" | "large", number>;
readonly shape: import("element-plus/es/utils").EpPropMergeType<StringConstructor, "circle" | "square", unknown>;
readonly src: string;
readonly fit: import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty) | ((new (...args: any[]) => import("csstype").ObjectFitProperty & {}) | (() => import("csstype").ObjectFitProperty))[], unknown, unknown>;
}>;
export default _default;

View File

@@ -0,0 +1,74 @@
import { defineComponent, ref, computed, watch, openBlock, createElementBlock, normalizeClass, unref, normalizeStyle, createBlock, withCtx, resolveDynamicComponent, renderSlot } from 'vue';
import { ElIcon } from '../../icon/index.mjs';
import '../../../hooks/index.mjs';
import '../../../utils/index.mjs';
import { avatarProps, avatarEmits } from './avatar.mjs';
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
import { isString } from '@vue/shared';
import { isNumber } from '../../../utils/types.mjs';
import { addUnit } from '../../../utils/dom/style.mjs';
const _hoisted_1 = ["src", "alt", "srcset"];
const __default__ = defineComponent({
name: "ElAvatar"
});
const _sfc_main = /* @__PURE__ */ defineComponent({
...__default__,
props: avatarProps,
emits: avatarEmits,
setup(__props, { emit }) {
const props = __props;
const ns = useNamespace("avatar");
const hasLoadError = ref(false);
const avatarClass = computed(() => {
const { size, icon, shape } = props;
const classList = [ns.b()];
if (isString(size))
classList.push(ns.m(size));
if (icon)
classList.push(ns.m("icon"));
if (shape)
classList.push(ns.m(shape));
return classList;
});
const sizeStyle = computed(() => {
const { size } = props;
return isNumber(size) ? ns.cssVarBlock({
size: addUnit(size) || ""
}) : void 0;
});
const fitStyle = computed(() => ({
objectFit: props.fit
}));
watch(() => props.src, () => hasLoadError.value = false);
function handleError(e) {
hasLoadError.value = true;
emit("error", e);
}
return (_ctx, _cache) => {
return openBlock(), createElementBlock("span", {
class: normalizeClass(unref(avatarClass)),
style: normalizeStyle(unref(sizeStyle))
}, [
(_ctx.src || _ctx.srcSet) && !hasLoadError.value ? (openBlock(), createElementBlock("img", {
key: 0,
src: _ctx.src,
alt: _ctx.alt,
srcset: _ctx.srcSet,
style: normalizeStyle(unref(fitStyle)),
onError: handleError
}, null, 44, _hoisted_1)) : _ctx.icon ? (openBlock(), createBlock(unref(ElIcon), { key: 1 }, {
default: withCtx(() => [
(openBlock(), createBlock(resolveDynamicComponent(_ctx.icon)))
]),
_: 1
})) : renderSlot(_ctx.$slots, "default", { key: 2 })
], 6);
};
}
});
var Avatar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/avatar/src/avatar.vue"]]);
export { Avatar as default };
//# sourceMappingURL=avatar2.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"avatar2.mjs","sources":["../../../../../../packages/components/avatar/src/avatar.vue"],"sourcesContent":["<template>\n <span :class=\"avatarClass\" :style=\"sizeStyle\">\n <img\n v-if=\"(src || srcSet) && !hasLoadError\"\n :src=\"src\"\n :alt=\"alt\"\n :srcset=\"srcSet\"\n :style=\"fitStyle\"\n @error=\"handleError\"\n />\n <el-icon v-else-if=\"icon\">\n <component :is=\"icon\" />\n </el-icon>\n <slot v-else />\n </span>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, watch } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { useNamespace } from '@element-plus/hooks'\nimport { addUnit, isNumber, isString } from '@element-plus/utils'\nimport { avatarEmits, avatarProps } from './avatar'\n\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n name: 'ElAvatar',\n})\n\nconst props = defineProps(avatarProps)\nconst emit = defineEmits(avatarEmits)\n\nconst ns = useNamespace('avatar')\n\nconst hasLoadError = ref(false)\n\nconst avatarClass = computed(() => {\n const { size, icon, shape } = props\n const classList = [ns.b()]\n if (isString(size)) classList.push(ns.m(size))\n if (icon) classList.push(ns.m('icon'))\n if (shape) classList.push(ns.m(shape))\n return classList\n})\n\nconst sizeStyle = computed(() => {\n const { size } = props\n return isNumber(size)\n ? (ns.cssVarBlock({\n size: addUnit(size) || '',\n }) as CSSProperties)\n : undefined\n})\n\nconst fitStyle = computed<CSSProperties>(() => ({\n objectFit: props.fit,\n}))\n\n// need reset hasLoadError to false if src changed\nwatch(\n () => props.src,\n () => (hasLoadError.value = false)\n)\n\nfunction handleError(e: Event) {\n hasLoadError.value = true\n emit('error', e)\n}\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;mCA0Bc,CAAA;AAAA,EACZ,IAAM,EAAA,UAAA;AACR,CAAA,CAAA,CAAA;;;;;;;AAKA,IAAM,MAAA,EAAA,GAAK,aAAa,QAAQ,CAAA,CAAA;AAEhC,IAAM,MAAA,YAAA,GAAe,IAAI,KAAK,CAAA,CAAA;AAE9B,IAAM,MAAA,WAAA,GAAc,SAAS,MAAM;AACjC,MAAM,MAAA,EAAE,IAAM,EAAA,IAAA,EAAM,KAAU,EAAA,GAAA,KAAA,CAAA;AAC9B,MAAA,MAAM,SAAY,GAAA,CAAC,EAAG,CAAA,CAAA,EAAG,CAAA,CAAA;AACzB,MAAA,IAAI,SAAS,IAAI,CAAA;AAAG,QAAA,SAAA,CAAU,IAAK,CAAA,EAAA,CAAG,CAAE,CAAA,IAAI,CAAC,CAAA,CAAA;AAC7C,MAAI,IAAA,IAAA;AAAM,QAAA,SAAA,CAAU,IAAK,CAAA,EAAA,CAAG,CAAE,CAAA,MAAM,CAAC,CAAA,CAAA;AACrC,MAAI,IAAA,KAAA;AAAO,QAAA,SAAA,CAAU,IAAK,CAAA,EAAA,CAAG,CAAE,CAAA,KAAK,CAAC,CAAA,CAAA;AACrC,MAAO,OAAA,SAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,SAAA,GAAY,SAAS,MAAM;AAC/B,MAAA,MAAM,EAAE,IAAS,EAAA,GAAA,KAAA,CAAA;AACjB,MAAA,OAAO,QAAS,CAAA,IAAI,CACf,GAAA,EAAA,CAAG,WAAY,CAAA;AAAA,QACd,IAAA,EAAM,OAAQ,CAAA,IAAI,CAAK,IAAA,EAAA;AAAA,OACxB,CACD,GAAA,KAAA,CAAA,CAAA;AAAA,KACL,CAAA,CAAA;AAED,IAAM,MAAA,QAAA,GAAW,SAAwB,OAAO;AAAA,MAC9C,WAAW,KAAM,CAAA,GAAA;AAAA,KACjB,CAAA,CAAA,CAAA;AAGF,IAAA,KAAA,CACE,MAAM,KAAM,CAAA,GAAA,EACZ,MAAO,YAAA,CAAa,QAAQ,KAC9B,CAAA,CAAA;AAEA,IAAA,SAAA,WAAA,CAAqB,CAAU,EAAA;AAC7B,MAAA,YAAA,CAAa,KAAQ,GAAA,IAAA,CAAA;AACrB,MAAA,IAAA,CAAK,SAAS,CAAC,CAAA,CAAA;AAAA,KACjB;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

View File

@@ -0,0 +1,2 @@
import type Avatar from './avatar.vue';
export declare type AvatarInstance = InstanceType<typeof Avatar>;

View File

@@ -0,0 +1,2 @@
//# sourceMappingURL=instance.mjs.map

View File

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

View File

@@ -0,0 +1,2 @@
import 'element-plus/es/components/base/style/css';
import 'element-plus/theme-chalk/el-avatar.css';

View File

@@ -0,0 +1,3 @@
import '../../base/style/css.mjs';
import 'element-plus/theme-chalk/el-avatar.css';
//# sourceMappingURL=css.mjs.map

View File

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

View File

@@ -0,0 +1,2 @@
import 'element-plus/es/components/base/style';
import 'element-plus/theme-chalk/src/avatar.scss';

View File

@@ -0,0 +1,3 @@
import '../../base/style/index.mjs';
import 'element-plus/theme-chalk/src/avatar.scss';
//# sourceMappingURL=index.mjs.map

View File

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

View File

@@ -0,0 +1,158 @@
export declare const ElBacktop: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
readonly visibilityHeight: {
readonly type: NumberConstructor;
readonly default: 200;
};
readonly target: {
readonly type: StringConstructor;
readonly default: "";
};
readonly right: {
readonly type: NumberConstructor;
readonly default: 40;
};
readonly bottom: {
readonly type: NumberConstructor;
readonly default: 40;
};
}, {
COMPONENT_NAME: string;
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly visibilityHeight: {
readonly type: NumberConstructor;
readonly default: 200;
};
readonly target: {
readonly type: StringConstructor;
readonly default: "";
};
readonly right: {
readonly type: NumberConstructor;
readonly default: 40;
};
readonly bottom: {
readonly type: NumberConstructor;
readonly default: 40;
};
}>> & {
onClick?: ((evt: MouseEvent) => any) | undefined;
}>>;
emit: (event: "click", evt: MouseEvent) => void;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
handleClick: (event: MouseEvent) => void;
visible: import("vue").Ref<boolean>;
backTopStyle: import("vue").ComputedRef<{
right: string;
bottom: string;
}>;
ElIcon: import("element-plus/es/utils").SFCWithInstall<import("vue").DefineComponent<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}, {
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>> & {
[x: string & `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
}>>;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
style: import("vue").ComputedRef<import("vue").CSSProperties>;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly size: {
readonly type: import("vue").PropType<import("element-plus/es/utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>>, {}>> & Record<string, any>;
CaretTop: any;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
click: (evt: MouseEvent) => boolean;
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly visibilityHeight: {
readonly type: NumberConstructor;
readonly default: 200;
};
readonly target: {
readonly type: StringConstructor;
readonly default: "";
};
readonly right: {
readonly type: NumberConstructor;
readonly default: 40;
};
readonly bottom: {
readonly type: NumberConstructor;
readonly default: 40;
};
}>> & {
onClick?: ((evt: MouseEvent) => any) | undefined;
}, {
readonly target: string;
readonly bottom: number;
readonly right: number;
readonly visibilityHeight: number;
}>> & Record<string, any>;
export default ElBacktop;
export * from './src/backtop';
export type { BacktopInstance } from './src/instance';

View File

@@ -0,0 +1,9 @@
import '../../utils/index.mjs';
import Backtop from './src/backtop2.mjs';
export { backtopEmits, backtopProps } from './src/backtop.mjs';
import { withInstall } from '../../utils/vue/install.mjs';
const ElBacktop = withInstall(Backtop);
export { ElBacktop, ElBacktop as default };
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","sources":["../../../../../packages/components/backtop/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils'\n\nimport Backtop from './src/backtop.vue'\n\nexport const ElBacktop = withInstall(Backtop)\nexport default ElBacktop\n\nexport * from './src/backtop'\nexport type { BacktopInstance } from './src/instance'\n"],"names":[],"mappings":";;;;;AAEY,MAAC,SAAS,GAAG,WAAW,CAAC,OAAO;;;;"}

View File

@@ -0,0 +1,36 @@
import type { ExtractPropTypes } from 'vue';
export declare const backtopProps: {
/**
* @description the button will not show until the scroll height reaches this value.
*/
readonly visibilityHeight: {
readonly type: NumberConstructor;
readonly default: 200;
};
/**
* @description the target to trigger scroll.
*/
readonly target: {
readonly type: StringConstructor;
readonly default: "";
};
/**
* @description right distance.
*/
readonly right: {
readonly type: NumberConstructor;
readonly default: 40;
};
/**
* @description bottom distance.
*/
readonly bottom: {
readonly type: NumberConstructor;
readonly default: 40;
};
};
export declare type BacktopProps = ExtractPropTypes<typeof backtopProps>;
export declare const backtopEmits: {
click: (evt: MouseEvent) => boolean;
};
export declare type BacktopEmits = typeof backtopEmits;

View File

@@ -0,0 +1,24 @@
const backtopProps = {
visibilityHeight: {
type: Number,
default: 200
},
target: {
type: String,
default: ""
},
right: {
type: Number,
default: 40
},
bottom: {
type: Number,
default: 40
}
};
const backtopEmits = {
click: (evt) => evt instanceof MouseEvent
};
export { backtopEmits, backtopProps };
//# sourceMappingURL=backtop.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"backtop.mjs","sources":["../../../../../../packages/components/backtop/src/backtop.ts"],"sourcesContent":["import type { ExtractPropTypes } from 'vue'\n\nexport const backtopProps = {\n /**\n * @description the button will not show until the scroll height reaches this value.\n */\n visibilityHeight: {\n type: Number,\n default: 200,\n },\n /**\n * @description the target to trigger scroll.\n */\n target: {\n type: String,\n default: '',\n },\n /**\n * @description right distance.\n */\n right: {\n type: Number,\n default: 40,\n },\n /**\n * @description bottom distance.\n */\n bottom: {\n type: Number,\n default: 40,\n },\n} as const\nexport type BacktopProps = ExtractPropTypes<typeof backtopProps>\n\nexport const backtopEmits = {\n click: (evt: MouseEvent) => evt instanceof MouseEvent,\n}\nexport type BacktopEmits = typeof backtopEmits\n"],"names":[],"mappings":"AAAY,MAAC,YAAY,GAAG;AAC5B,EAAE,gBAAgB,EAAE;AACpB,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE;AACU,MAAC,YAAY,GAAG;AAC5B,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,UAAU;AAC3C;;;;"}

View File

@@ -0,0 +1,156 @@
declare const _default: import("vue").DefineComponent<{
readonly visibilityHeight: {
readonly type: NumberConstructor;
readonly default: 200;
};
readonly target: {
readonly type: StringConstructor;
readonly default: "";
};
readonly right: {
readonly type: NumberConstructor;
readonly default: 40;
};
readonly bottom: {
readonly type: NumberConstructor;
readonly default: 40;
};
}, {
COMPONENT_NAME: string;
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly visibilityHeight: {
readonly type: NumberConstructor;
readonly default: 200;
};
readonly target: {
readonly type: StringConstructor;
readonly default: "";
};
readonly right: {
readonly type: NumberConstructor;
readonly default: 40;
};
readonly bottom: {
readonly type: NumberConstructor;
readonly default: 40;
};
}>> & {
onClick?: ((evt: MouseEvent) => any) | undefined;
}>>;
emit: (event: "click", evt: MouseEvent) => void;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
handleClick: (event: MouseEvent) => void;
visible: import("vue").Ref<boolean>;
backTopStyle: import("vue").ComputedRef<{
right: string;
bottom: string;
}>;
ElIcon: import("../../../utils").SFCWithInstall<import("vue").DefineComponent<{
readonly size: {
readonly type: import("vue").PropType<import("../../../utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}, {
props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
readonly size: {
readonly type: import("vue").PropType<import("../../../utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>> & {
[x: string & `on${string}`]: ((...args: any[]) => any) | ((...args: unknown[]) => any) | undefined;
}>>;
ns: {
namespace: import("vue").ComputedRef<string>;
b: (blockSuffix?: string) => string;
e: (element?: string | undefined) => string;
m: (modifier?: string | undefined) => string;
be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
em: (element?: string | undefined, modifier?: string | undefined) => string;
bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
is: {
(name: string, state: boolean | undefined): string;
(name: string): string;
};
cssVar: (object: Record<string, string>) => Record<string, string>;
cssVarName: (name: string) => string;
cssVarBlock: (object: Record<string, string>) => Record<string, string>;
cssVarBlockName: (name: string) => string;
};
style: import("vue").ComputedRef<import("vue").CSSProperties>;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly size: {
readonly type: import("vue").PropType<import("../../../utils").EpPropMergeType<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly color: {
readonly type: import("vue").PropType<string>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
}>>, {}>> & Record<string, any>;
CaretTop: any;
}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
click: (evt: MouseEvent) => boolean;
}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
readonly visibilityHeight: {
readonly type: NumberConstructor;
readonly default: 200;
};
readonly target: {
readonly type: StringConstructor;
readonly default: "";
};
readonly right: {
readonly type: NumberConstructor;
readonly default: 40;
};
readonly bottom: {
readonly type: NumberConstructor;
readonly default: 40;
};
}>> & {
onClick?: ((evt: MouseEvent) => any) | undefined;
}, {
readonly target: string;
readonly bottom: number;
readonly right: number;
readonly visibilityHeight: number;
}>;
export default _default;

View File

@@ -0,0 +1,57 @@
import { defineComponent, computed, openBlock, createBlock, Transition, unref, withCtx, createElementBlock, normalizeStyle, normalizeClass, withModifiers, renderSlot, createVNode, createCommentVNode } from 'vue';
import { ElIcon } from '../../icon/index.mjs';
import { CaretTop } from '@element-plus/icons-vue';
import '../../../hooks/index.mjs';
import { backtopProps, backtopEmits } from './backtop.mjs';
import { useBackTop } from './use-backtop.mjs';
import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
const COMPONENT_NAME = "ElBacktop";
const __default__ = defineComponent({
name: COMPONENT_NAME
});
const _sfc_main = /* @__PURE__ */ defineComponent({
...__default__,
props: backtopProps,
emits: backtopEmits,
setup(__props, { emit }) {
const props = __props;
const ns = useNamespace("backtop");
const { handleClick, visible } = useBackTop(props, emit, COMPONENT_NAME);
const backTopStyle = computed(() => ({
right: `${props.right}px`,
bottom: `${props.bottom}px`
}));
return (_ctx, _cache) => {
return openBlock(), createBlock(Transition, {
name: `${unref(ns).namespace.value}-fade-in`
}, {
default: withCtx(() => [
unref(visible) ? (openBlock(), createElementBlock("div", {
key: 0,
style: normalizeStyle(unref(backTopStyle)),
class: normalizeClass(unref(ns).b()),
onClick: _cache[0] || (_cache[0] = withModifiers((...args) => unref(handleClick) && unref(handleClick)(...args), ["stop"]))
}, [
renderSlot(_ctx.$slots, "default", {}, () => [
createVNode(unref(ElIcon), {
class: normalizeClass(unref(ns).e("icon"))
}, {
default: withCtx(() => [
createVNode(unref(CaretTop))
]),
_: 1
}, 8, ["class"])
])
], 6)) : createCommentVNode("v-if", true)
]),
_: 3
}, 8, ["name"]);
};
}
});
var Backtop = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/backtop/src/backtop.vue"]]);
export { Backtop as default };
//# sourceMappingURL=backtop2.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"backtop2.mjs","sources":["../../../../../../packages/components/backtop/src/backtop.vue"],"sourcesContent":["<template>\n <transition :name=\"`${ns.namespace.value}-fade-in`\">\n <div\n v-if=\"visible\"\n :style=\"backTopStyle\"\n :class=\"ns.b()\"\n @click.stop=\"handleClick\"\n >\n <slot>\n <el-icon :class=\"ns.e('icon')\"><caret-top /></el-icon>\n </slot>\n </div>\n </transition>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { CaretTop } from '@element-plus/icons-vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { backtopEmits, backtopProps } from './backtop'\nimport { useBackTop } from './use-backtop'\n\nconst COMPONENT_NAME = 'ElBacktop'\n\ndefineOptions({\n name: COMPONENT_NAME,\n})\n\nconst props = defineProps(backtopProps)\nconst emit = defineEmits(backtopEmits)\n\nconst ns = useNamespace('backtop')\n\nconst { handleClick, visible } = useBackTop(props, emit, COMPONENT_NAME)\n\nconst backTopStyle = computed(() => ({\n right: `${props.right}px`,\n bottom: `${props.bottom}px`,\n}))\n</script>\n"],"names":[],"mappings":";;;;;;;;;;mCAyBc,CAAA;AAAA,EACZ,IAAM,EAAA,cAAA;AACR;;;;;;;AAKA,IAAM,MAAA,EAAA,GAAK,aAAa,SAAS,CAAA,CAAA;AAEjC,IAAA,MAAM,EAAE,WAAa,EAAA,OAAA,EAAA,GAAY,UAAW,CAAA,KAAA,EAAO,MAAM,cAAc,CAAA,CAAA;AAEvE,IAAM,MAAA,YAAA,GAAe,SAAS,OAAO;AAAA,MACnC,KAAA,EAAO,GAAG,KAAM,CAAA,KAAA,CAAA,EAAA,CAAA;AAAA,MAChB,MAAA,EAAQ,GAAG,KAAM,CAAA,MAAA,CAAA,EAAA,CAAA;AAAA,KACjB,CAAA,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

View File

@@ -0,0 +1,2 @@
import type Backtop from './backtop.vue';
export declare type BacktopInstance = InstanceType<typeof Backtop>;

View File

@@ -0,0 +1,2 @@
//# sourceMappingURL=instance.mjs.map

View File

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

View File

@@ -0,0 +1,6 @@
import type { SetupContext } from 'vue';
import type { BacktopEmits, BacktopProps } from './backtop';
export declare const useBackTop: (props: BacktopProps, emit: SetupContext<BacktopEmits>['emit'], componentName: string) => {
visible: import("vue").Ref<boolean>;
handleClick: (event: MouseEvent) => void;
};

View File

@@ -0,0 +1,41 @@
import { shallowRef, ref, onMounted } from 'vue';
import { useThrottleFn, useEventListener } from '@vueuse/core';
import '../../../utils/index.mjs';
import { throwError } from '../../../utils/error.mjs';
const useBackTop = (props, emit, componentName) => {
const el = shallowRef();
const container = shallowRef();
const visible = ref(false);
const handleScroll = () => {
if (el.value)
visible.value = el.value.scrollTop >= props.visibilityHeight;
};
const handleClick = (event) => {
var _a;
(_a = el.value) == null ? void 0 : _a.scrollTo({ top: 0, behavior: "smooth" });
emit("click", event);
};
const handleScrollThrottled = useThrottleFn(handleScroll, 300, true);
useEventListener(container, "scroll", handleScrollThrottled);
onMounted(() => {
var _a;
container.value = document;
el.value = document.documentElement;
if (props.target) {
el.value = (_a = document.querySelector(props.target)) != null ? _a : void 0;
if (!el.value) {
throwError(componentName, `target does not exist: ${props.target}`);
}
container.value = el.value;
}
handleScroll();
});
return {
visible,
handleClick
};
};
export { useBackTop };
//# sourceMappingURL=use-backtop.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"use-backtop.mjs","sources":["../../../../../../packages/components/backtop/src/use-backtop.ts"],"sourcesContent":["import { onMounted, ref, shallowRef } from 'vue'\nimport { useEventListener, useThrottleFn } from '@vueuse/core'\nimport { throwError } from '@element-plus/utils'\nimport type { SetupContext } from 'vue'\nimport type { BacktopEmits, BacktopProps } from './backtop'\n\nexport const useBackTop = (\n props: BacktopProps,\n emit: SetupContext<BacktopEmits>['emit'],\n componentName: string\n) => {\n const el = shallowRef<HTMLElement>()\n const container = shallowRef<Document | HTMLElement>()\n const visible = ref(false)\n\n const handleScroll = () => {\n if (el.value) visible.value = el.value.scrollTop >= props.visibilityHeight\n }\n\n const handleClick = (event: MouseEvent) => {\n el.value?.scrollTo({ top: 0, behavior: 'smooth' })\n emit('click', event)\n }\n\n const handleScrollThrottled = useThrottleFn(handleScroll, 300, true)\n\n useEventListener(container, 'scroll', handleScrollThrottled)\n onMounted(() => {\n container.value = document\n el.value = document.documentElement\n\n if (props.target) {\n el.value = document.querySelector<HTMLElement>(props.target) ?? undefined\n if (!el.value) {\n throwError(componentName, `target does not exist: ${props.target}`)\n }\n container.value = el.value\n }\n // Give visible an initial value, fix #13066\n handleScroll()\n })\n\n return {\n visible,\n handleClick,\n }\n}\n"],"names":[],"mappings":";;;;;AAGY,MAAC,UAAU,GAAG,CAAC,KAAK,EAAE,IAAI,EAAE,aAAa,KAAK;AAC1D,EAAE,MAAM,EAAE,GAAG,UAAU,EAAE,CAAC;AAC1B,EAAE,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC;AACjC,EAAE,MAAM,OAAO,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC;AAC7B,EAAE,MAAM,YAAY,GAAG,MAAM;AAC7B,IAAI,IAAI,EAAE,CAAC,KAAK;AAChB,MAAM,OAAO,CAAC,KAAK,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,IAAI,KAAK,CAAC,gBAAgB,CAAC;AACnE,GAAG,CAAC;AACJ,EAAE,MAAM,WAAW,GAAG,CAAC,KAAK,KAAK;AACjC,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,CAAC,EAAE,GAAG,EAAE,CAAC,KAAK,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC;AACnF,IAAI,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;AACzB,GAAG,CAAC;AACJ,EAAE,MAAM,qBAAqB,GAAG,aAAa,CAAC,YAAY,EAAE,GAAG,EAAE,IAAI,CAAC,CAAC;AACvE,EAAE,gBAAgB,CAAC,SAAS,EAAE,QAAQ,EAAE,qBAAqB,CAAC,CAAC;AAC/D,EAAE,SAAS,CAAC,MAAM;AAClB,IAAI,IAAI,EAAE,CAAC;AACX,IAAI,SAAS,CAAC,KAAK,GAAG,QAAQ,CAAC;AAC/B,IAAI,EAAE,CAAC,KAAK,GAAG,QAAQ,CAAC,eAAe,CAAC;AACxC,IAAI,IAAI,KAAK,CAAC,MAAM,EAAE;AACtB,MAAM,EAAE,CAAC,KAAK,GAAG,CAAC,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,IAAI,GAAG,EAAE,GAAG,KAAK,CAAC,CAAC;AACnF,MAAM,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE;AACrB,QAAQ,UAAU,CAAC,aAAa,EAAE,CAAC,uBAAuB,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;AAC5E,OAAO;AACP,MAAM,SAAS,CAAC,KAAK,GAAG,EAAE,CAAC,KAAK,CAAC;AACjC,KAAK;AACL,IAAI,YAAY,EAAE,CAAC;AACnB,GAAG,CAAC,CAAC;AACL,EAAE,OAAO;AACT,IAAI,OAAO;AACX,IAAI,WAAW;AACf,GAAG,CAAC;AACJ;;;;"}

View File

@@ -0,0 +1,2 @@
import 'element-plus/es/components/base/style/css';
import 'element-plus/theme-chalk/el-backtop.css';

View File

@@ -0,0 +1,3 @@
import '../../base/style/css.mjs';
import 'element-plus/theme-chalk/el-backtop.css';
//# sourceMappingURL=css.mjs.map

View File

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

View File

@@ -0,0 +1,2 @@
import 'element-plus/es/components/base/style';
import 'element-plus/theme-chalk/src/backtop.scss';

View File

@@ -0,0 +1,3 @@
import '../../base/style/index.mjs';
import 'element-plus/theme-chalk/src/backtop.scss';
//# sourceMappingURL=index.mjs.map

View File

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

Some files were not shown because too many files have changed in this diff Show More