使用VUE重构项目
Some checks failed
build / build (api, amd64, linux) (push) Failing after -51s
build / build (api, arm64, linux) (push) Failing after -52s
build / build (api.exe, amd64, windows) (push) Failing after -51s

This commit is contained in:
2026-04-20 00:19:11 +08:00
parent c080bb8d4a
commit db7f1ba82f
12743 changed files with 1250466 additions and 359982 deletions

21
frontend/admin/node_modules/element-plus/LICENSE generated vendored Normal file
View File

@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2020-PRESENT Element Plus
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

147
frontend/admin/node_modules/element-plus/README.md generated vendored Normal file
View File

@@ -0,0 +1,147 @@
<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://npmx.dev/package/element-plus">
<img src="https://npmx.dev/api/registry/badge/version/element-plus" />
</a>
<a href="https://github.com/element-plus/element-plus">
<img src="https://img.shields.io/badge/node-%20%3E%3D%2020-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, if you're looking to make Element Plus better, keep reading.
For developers using Element Plus to build websites, please visit [Getting Started](https://element-plus.org/).
- 中国大陆[加速镜像站点](https://cn.element-plus.org/zh-CN/)
## Breaking Change List
The first stable release of Element Plus, suitable for production use, was released on February 7, 2022. The API is stable now, and here's a full list on how to upgrade 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 [gogocode 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 out Element Plus with its built-in component playground.
#### Try it with our built-in playground
[Playground](https://element-plus.run/)
#### Try it with CodeSandbox
[![Edit element-plus](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/github/element-plus/element-plus-demo/main)
<p align="center">
<b>Special thanks to our generous sponsors:</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.jnpfsoft.com/index.html?from=elementUI" target="_blank">
<img width="150px" src="https://github.com/element-plus/element-plus/assets/17680888/6a044d82-c393-48ab-90b8-de0d3aad1624">
</a>
</td>
<td align="center" valign="middle">
<a href="http://github.crmeb.net/u/Element?from=element-plus" target="_blank">
<img width="150px" src="https://github.com/user-attachments/assets/18079452-986c-4c6e-84ec-fb6175c26567">
</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://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 has been translated into multiple languages. You can click [here](https://crowdin.com/project/element-plus) to help us update the translations or apply to become a proofreader.
For now, we are only providing English and Chinese versions due to limited resources, but we are looking forward to translating it into more languages. Please visit the link
above and leave a message if you would like to help translate Element Plus into your preferred language.
### How to help translate
See how to help translate 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 make Element Plus better! If you're interested in joining the development team, please
reach out to us -- you're more than welcome to join us! :heart:
We are now looking for experts in `Testing`, `GitHub Actions` and `PM`. If you feel like you can and are willing to help, please don't hesitate to 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://openomy.app/github/element-plus/element-plus" target="_blank" style="display: block; width: 100%;" align="center">
<img src="https://openomy.app/svg?repo=element-plus/element-plus&chart=bubble&latestMonth=3" target="_blank" alt="Contribution Leaderboard" style="display: block; width: 100%;" />
</a>
<hr />
<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,9 @@
//#region \0plugin-vue:export-helper
var _plugin_vue_export_helper_default = (sfc, props) => {
const target = sfc.__vccOpts || sfc;
for (const [key, val] of props) target[key] = val;
return target;
};
//#endregion
export { _plugin_vue_export_helper_default as default };

View File

@@ -0,0 +1,197 @@
import { ElAffix } from "./components/affix/index.mjs";
import { ElIcon } from "./components/icon/index.mjs";
import { ElAlert } from "./components/alert/index.mjs";
import { ElForm, ElFormItem } from "./components/form/index.mjs";
import { ElPopper } from "./components/popper/index.mjs";
import { ElTooltip } from "./components/tooltip/index.mjs";
import { ElInput } from "./components/input/index.mjs";
import { ElScrollbar } from "./components/scrollbar/index.mjs";
import { ElAutocomplete } from "./components/autocomplete/index.mjs";
import { ElAvatar, ElAvatarGroup } 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 { ElConfigProvider } from "./components/config-provider/index.mjs";
import { ElButton, ElButtonGroup } from "./components/button/index.mjs";
import { ElTimePicker } from "./components/time-picker/index.mjs";
import { ElTag } from "./components/tag/index.mjs";
import { ElOption, ElOptionGroup, ElSelect } from "./components/select/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 { ElCheckbox, ElCheckboxButton, ElCheckboxGroup } from "./components/checkbox/index.mjs";
import { ElRadio, ElRadioButton, ElRadioGroup } from "./components/radio/index.mjs";
import { ElCascaderPanel } from "./components/cascader-panel/index.mjs";
import { ElCascader } from "./components/cascader/index.mjs";
import { ElCheckTag } from "./components/check-tag/index.mjs";
import { ElRow } from "./components/row/index.mjs";
import { ElCol } from "./components/col/index.mjs";
import { ElCollapseTransition } from "./components/collapse-transition/index.mjs";
import { ElCollapse, ElCollapseItem } from "./components/collapse/index.mjs";
import { ElColorPickerPanel } from "./components/color-picker-panel/index.mjs";
import { ElColorPicker } from "./components/color-picker/index.mjs";
import { ElAside, ElContainer, ElFooter, ElHeader, ElMain } from "./components/container/index.mjs";
import { ElDatePickerPanel } from "./components/date-picker-panel/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 { ElImageViewer } from "./components/image-viewer/index.mjs";
import { ElImage } from "./components/image/index.mjs";
import { ElInputNumber } from "./components/input-number/index.mjs";
import { ElInputTag } from "./components/input-tag/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 { ElProgress } from "./components/progress/index.mjs";
import { ElRate } from "./components/rate/index.mjs";
import { ElResult } from "./components/result/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 { ElStep, ElSteps } 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 { ElTabPane, ElTabs } from "./components/tabs/index.mjs";
import { ElText } from "./components/text/index.mjs";
import { ElTimeSelect } from "./components/time-select/index.mjs";
import { ElTimeline, ElTimelineItem } from "./components/timeline/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";
import { ElTour, ElTourStep } from "./components/tour/index.mjs";
import { ElAnchor, ElAnchorLink } from "./components/anchor/index.mjs";
import { ElSegmented } from "./components/segmented/index.mjs";
import { ElMention } from "./components/mention/index.mjs";
import { ElSplitter, ElSplitterPanel } from "./components/splitter/index.mjs";
//#region ../../packages/element-plus/component.ts
var component_default = [
ElAffix,
ElAlert,
ElAutocomplete,
ElAutoResizer,
ElAvatar,
ElAvatarGroup,
ElBacktop,
ElBadge,
ElBreadcrumb,
ElBreadcrumbItem,
ElButton,
ElButtonGroup,
ElCalendar,
ElCard,
ElCarousel,
ElCarouselItem,
ElCascader,
ElCascaderPanel,
ElCheckTag,
ElCheckbox,
ElCheckboxButton,
ElCheckboxGroup,
ElCol,
ElCollapse,
ElCollapseItem,
ElCollapseTransition,
ElColorPickerPanel,
ElColorPicker,
ElConfigProvider,
ElContainer,
ElAside,
ElFooter,
ElHeader,
ElMain,
ElDatePicker,
ElDatePickerPanel,
ElDescriptions,
ElDescriptionsItem,
ElDialog,
ElDivider,
ElDrawer,
ElDropdown,
ElDropdownItem,
ElDropdownMenu,
ElEmpty,
ElForm,
ElFormItem,
ElIcon,
ElImage,
ElImageViewer,
ElInput,
ElInputNumber,
ElInputTag,
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,
ElTransfer,
ElTree,
ElTreeSelect,
ElTreeV2,
ElUpload,
ElWatermark,
ElTour,
ElTourStep,
ElAnchor,
ElAnchorLink,
ElSegmented,
ElMention,
ElSplitter,
ElSplitterPanel
];
//#endregion
export { component_default as default };
//# sourceMappingURL=component.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,9 @@
import { SFCWithInstall } from "../../utils/vue/typescript.js";
import "../../utils/index.js";
import { AffixEmits, AffixInstance, AffixProps, AffixPropsPublic, affixEmits, affixProps } from "./src/affix.js";
import { _default } from "./src/affix.vue.js";
//#region ../../packages/components/affix/index.d.ts
declare const ElAffix: SFCWithInstall<typeof _default>;
//#endregion
export { AffixEmits, AffixInstance, AffixProps, AffixPropsPublic, ElAffix, ElAffix as default, affixEmits, affixProps };

View File

@@ -0,0 +1,10 @@
import { withInstall } from "../../utils/vue/install.mjs";
import { affixEmits, affixProps } from "./src/affix.mjs";
import affix_default from "./src/affix2.mjs";
//#region ../../packages/components/affix/index.ts
const ElAffix = withInstall(affix_default);
//#endregion
export { ElAffix, ElAffix as default, affixEmits, affixProps };
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","names":["Affix"],"sources":["../../../../../packages/components/affix/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils'\nimport Affix from './src/affix.vue'\n\nimport type { SFCWithInstall } from '@element-plus/utils'\n\nexport const ElAffix: SFCWithInstall<typeof Affix> = withInstall(Affix)\nexport default ElAffix\n\nexport * from './src/affix'\n"],"mappings":";;;;;AAKA,MAAa,UAAwC,YAAYA,cAAM"}

View File

@@ -0,0 +1,63 @@
import { EpPropFinalized, EpPropMergeType } from "../../../utils/vue/props/types.js";
import { ZIndexType } from "../../../utils/typescript.js";
import "../../../utils/index.js";
import { _default } from "./affix.vue.js";
import { ExtractPublicPropTypes } from "vue";
import * as csstype from "csstype";
//#region ../../packages/components/affix/src/affix.d.ts
interface AffixProps {
/**
* @description affix element zIndex value
* */
zIndex?: ZIndexType;
/**
* @description target container. (CSS selector)
*/
target?: string;
/**
* @description offset distance
* */
offset?: number;
/**
* @description position of affix
* */
position?: 'top' | 'bottom';
/**
* @description whether affix element is teleported, if `true` it will be teleported to where `append-to` sets
* */
teleported?: boolean;
/**
* @description which element the affix element appends to
* */
appendTo?: string | HTMLElement;
}
/**
* @deprecated Removed after 3.0.0, Use `AffixProps` instead.
*/
declare const affixProps: {
readonly zIndex: EpPropFinalized<(new (...args: any[]) => string | number) | (() => csstype.Property.ZIndex | undefined) | (((new (...args: any[]) => string | number) | (() => csstype.Property.ZIndex | undefined)) | null)[], unknown, unknown, 100, boolean>;
readonly target: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly offset: EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
readonly position: EpPropFinalized<StringConstructor, "top" | "bottom", unknown, "top", boolean>;
readonly teleported: BooleanConstructor;
readonly appendTo: EpPropFinalized<(new (...args: any[]) => string | HTMLElement) | (() => EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | (((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement)) | null)[], unknown, unknown>) | (((new (...args: any[]) => string | HTMLElement) | (() => EpPropMergeType<(new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement) | (((new (...args: any[]) => string | HTMLElement) | (() => string | HTMLElement)) | null)[], unknown, unknown>)) | null)[], unknown, unknown, "body", boolean>;
};
/**
* @deprecated Removed after 3.0.0, Use `AffixProps` instead.
*/
type AffixPropsPublic = ExtractPublicPropTypes<typeof affixProps>;
declare const affixEmits: {
scroll: ({
scrollTop,
fixed
}: {
scrollTop: number;
fixed: boolean;
}) => boolean;
change: (fixed: boolean) => boolean;
};
type AffixEmits = typeof affixEmits;
type AffixInstance = InstanceType<typeof _default> & unknown;
//#endregion
export { AffixEmits, AffixInstance, AffixProps, AffixPropsPublic, affixEmits, affixProps };

View File

@@ -0,0 +1,41 @@
import { CHANGE_EVENT } from "../../../constants/event.mjs";
import { isBoolean, isNumber } from "../../../utils/types.mjs";
import { buildProps, definePropType } from "../../../utils/vue/props/runtime.mjs";
import { teleportProps } from "../../teleport/src/teleport.mjs";
//#region ../../packages/components/affix/src/affix.ts
/**
* @deprecated Removed after 3.0.0, Use `AffixProps` instead.
*/
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"
},
teleported: Boolean,
appendTo: {
type: teleportProps.to.type,
default: "body"
}
});
const affixEmits = {
scroll: ({ scrollTop, fixed }) => isNumber(scrollTop) && isBoolean(fixed),
[CHANGE_EVENT]: (fixed) => isBoolean(fixed)
};
//#endregion
export { affixEmits, affixProps };
//# sourceMappingURL=affix.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"affix.mjs","names":[],"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 { teleportProps } from '@element-plus/components/teleport'\n\nimport type { ExtractPublicPropTypes } from 'vue'\nimport type Affix from './affix.vue'\nimport type { ZIndexType } from '@element-plus/utils'\n\nexport interface AffixProps {\n /**\n * @description affix element zIndex value\n * */\n zIndex?: ZIndexType\n /**\n * @description target container. (CSS selector)\n */\n target?: string\n /**\n * @description offset distance\n * */\n offset?: number\n /**\n * @description position of affix\n * */\n position?: 'top' | 'bottom'\n /**\n * @description whether affix element is teleported, if `true` it will be teleported to where `append-to` sets\n * */\n teleported?: boolean\n /**\n * @description which element the affix element appends to\n * */\n appendTo?: string | HTMLElement\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `AffixProps` instead.\n */\nexport const affixProps = buildProps({\n /**\n * @description affix element zIndex value\n * */\n zIndex: {\n type: definePropType<ZIndexType>([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 /**\n * @description whether affix element is teleported, if `true` it will be teleported to where `append-to` sets\n * */\n teleported: Boolean,\n /**\n * @description which element the affix element appends to\n * */\n appendTo: {\n type: teleportProps.to.type,\n default: 'body',\n },\n} as const)\n\n/**\n * @deprecated Removed after 3.0.0, Use `AffixProps` instead.\n */\nexport type AffixPropsPublic = ExtractPublicPropTypes<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> & unknown\n"],"mappings":";;;;;;;;;AA2CA,MAAa,aAAa,WAAW;CAInC,QAAQ;EACN,MAAM,eAA2B,CAAC,QAAQ,OAAO,CAAC;EAClD,SAAS;EACV;CAID,QAAQ;EACN,MAAM;EACN,SAAS;EACV;CAID,QAAQ;EACN,MAAM;EACN,SAAS;EACV;CAID,UAAU;EACR,MAAM;EACN,QAAQ,CAAC,OAAO,SAAS;EACzB,SAAS;EACV;CAID,YAAY;CAIZ,UAAU;EACR,MAAM,cAAc,GAAG;EACvB,SAAS;EACV;CACF,CAAU;AAOX,MAAa,aAAa;CACxB,SAAS,EAAE,WAAW,YACpB,SAAS,UAAU,IAAI,UAAU,MAAM;EACxC,gBAAgB,UAAmB,UAAU,MAAM;CACrD"}

View File

@@ -0,0 +1,40 @@
import { AffixProps } from "./affix.js";
import * as vue from "vue";
import * as csstype from "csstype";
//#region ../../packages/components/affix/src/affix.vue.d.ts
declare var __VLS_7: {};
type __VLS_Slots = {} & {
default?: (props: typeof __VLS_7) => any;
};
declare const __VLS_base: vue.DefineComponent<AffixProps, {
/** @description update affix status */update: () => void; /** @description update rootRect info */
updateRoot: () => Promise<void>;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
scroll: (args_0: {
scrollTop: number;
fixed: boolean;
}) => void;
change: (fixed: boolean) => void;
}, string, vue.PublicProps, Readonly<AffixProps> & Readonly<{
onChange?: ((fixed: boolean) => any) | undefined;
onScroll?: ((args_0: {
scrollTop: number;
fixed: boolean;
}) => any) | undefined;
}>, {
zIndex: csstype.Property.ZIndex;
target: string;
offset: number;
position: "top" | "bottom";
appendTo: string | HTMLElement;
}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
declare const _default: typeof __VLS_export;
type __VLS_WithSlots<T, S> = T & {
new (): {
$slots: S;
};
};
//#endregion
export { _default };

View File

@@ -0,0 +1,131 @@
import { CHANGE_EVENT } from "../../../constants/event.mjs";
import { throwError } from "../../../utils/error.mjs";
import { addUnit } from "../../../utils/dom/style.mjs";
import { getScrollContainer } from "../../../utils/dom/scroll.mjs";
import { ElTeleport } from "../../teleport/index.mjs";
import { affixEmits, affixProps } from "./affix.mjs";
import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
import { useElementBounding, useEventListener, useWindowSize } from "@vueuse/core";
import { computed, createElementBlock, createElementVNode, createVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, onActivated, onDeactivated, onMounted, openBlock, ref, renderSlot, shallowRef, unref, watch, watchEffect, withCtx } from "vue";
//#region ../../packages/components/affix/src/affix.vue?vue&type=script&setup=true&lang.ts
const COMPONENT_NAME = "ElAffix";
var affix_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
name: COMPONENT_NAME,
__name: "affix",
props: affixProps,
emits: affixEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
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, left: rootLeft, update: updateRoot } = useElementBounding(root, { windowScroll: false });
const targetRect = useElementBounding(target);
const fixed = ref(false);
const scrollTop = ref(0);
const transform = ref(0);
const teleportDisabled = computed(() => {
return !props.teleported || !fixed.value;
});
const rootStyle = computed(() => {
return {
display: "flow-root",
height: fixed.value ? `${rootHeight.value}px` : "",
width: fixed.value ? `${rootWidth.value}px` : ""
};
});
const affixStyle = computed(() => {
if (!fixed.value) return {};
const offset = addUnit(props.offset);
return {
height: `${rootHeight.value}px`,
width: `${rootWidth.value}px`,
top: props.position === "top" ? offset : "",
bottom: props.position === "bottom" ? offset : "",
left: props.teleported ? `${rootLeft.value}px` : "",
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;
const { position, target, offset } = props;
const rootHeightOffset = offset + rootHeight.value;
if (position === "top") if (target) {
const difference = targetRect.bottom.value - rootHeightOffset;
fixed.value = offset > rootTop.value && targetRect.bottom.value > 0;
transform.value = difference < 0 ? difference : 0;
} else fixed.value = offset > rootTop.value;
else if (target) {
const difference = windowHeight.value - targetRect.top.value - rootHeightOffset;
fixed.value = windowHeight.value - offset < rootBottom.value && windowHeight.value > targetRect.top.value;
transform.value = difference < 0 ? -difference : 0;
} else fixed.value = windowHeight.value - offset < rootBottom.value;
};
const updateRootRect = async () => {
if (!fixed.value) {
updateRoot();
return;
}
fixed.value = false;
await nextTick();
updateRoot();
fixed.value = true;
};
const handleScroll = async () => {
updateRoot();
await nextTick();
emit("scroll", {
scrollTop: scrollTop.value,
fixed: fixed.value
});
};
watch(fixed, (val) => emit(CHANGE_EVENT, val));
onMounted(() => {
if (props.target) {
target.value = document.querySelector(props.target) ?? void 0;
if (!target.value) throwError(COMPONENT_NAME, `Target does not exist: ${props.target}`);
} else target.value = document.documentElement;
scrollContainer.value = getScrollContainer(root.value, true);
updateRoot();
});
onActivated(() => {
nextTick(updateRootRect);
});
onDeactivated(() => {
fixed.value = false;
});
useEventListener(scrollContainer, "scroll", handleScroll);
watchEffect(update);
__expose({
update,
updateRoot: updateRootRect
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", {
ref_key: "root",
ref: root,
class: normalizeClass(unref(ns).b()),
style: normalizeStyle(rootStyle.value)
}, [createVNode(unref(ElTeleport), {
disabled: teleportDisabled.value,
to: __props.appendTo
}, {
default: withCtx(() => [createElementVNode("div", {
class: normalizeClass({ [unref(ns).m("fixed")]: fixed.value }),
style: normalizeStyle(affixStyle.value)
}, [renderSlot(_ctx.$slots, "default")], 6)]),
_: 3
}, 8, ["disabled", "to"])], 6);
};
}
});
//#endregion
export { affix_vue_vue_type_script_setup_true_lang_default as default };
//# sourceMappingURL=affix.vue_vue_type_script_setup_true_lang.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,8 @@
import affix_vue_vue_type_script_setup_true_lang_default from "./affix.vue_vue_type_script_setup_true_lang.mjs";
//#region ../../packages/components/affix/src/affix.vue
var affix_default = affix_vue_vue_type_script_setup_true_lang_default;
//#endregion
export { affix_default as default };
//# sourceMappingURL=affix2.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"affix2.mjs","names":[],"sources":["../../../../../../packages/components/affix/src/affix.vue"],"sourcesContent":["<template>\n <div ref=\"root\" :class=\"ns.b()\" :style=\"rootStyle\">\n <el-teleport :disabled=\"teleportDisabled\" :to=\"appendTo\">\n <div :class=\"{ [ns.m('fixed')]: fixed }\" :style=\"affixStyle\">\n <slot />\n </div>\n </el-teleport>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n computed,\n nextTick,\n onActivated,\n onDeactivated,\n onMounted,\n ref,\n shallowRef,\n watch,\n watchEffect,\n} from 'vue'\nimport {\n useElementBounding,\n useEventListener,\n useWindowSize,\n} from '@vueuse/core'\nimport ElTeleport from '@element-plus/components/teleport'\nimport { addUnit, getScrollContainer, throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { CHANGE_EVENT } from '@element-plus/constants'\nimport { affixEmits } from './affix'\n\nimport type { CSSProperties } from 'vue'\nimport type { AffixProps } from './affix'\n\nconst COMPONENT_NAME = 'ElAffix'\ndefineOptions({\n name: COMPONENT_NAME,\n})\nconst props = withDefaults(defineProps<AffixProps>(), {\n zIndex: 100,\n target: '',\n offset: 0,\n position: 'top',\n appendTo: 'body',\n})\nconst emit = defineEmits(affixEmits)\n\nconst ns = useNamespace('affix')\n\nconst target = shallowRef<HTMLElement>()\nconst root = shallowRef<HTMLDivElement>()\nconst scrollContainer = shallowRef<HTMLElement | Window>()\nconst { height: windowHeight } = useWindowSize()\nconst {\n height: rootHeight,\n width: rootWidth,\n top: rootTop,\n bottom: rootBottom,\n left: rootLeft,\n update: updateRoot,\n} = useElementBounding(root, { windowScroll: false })\nconst targetRect = useElementBounding(target)\n\nconst fixed = ref(false)\nconst scrollTop = ref(0)\nconst transform = ref(0)\n\nconst teleportDisabled = computed(() => {\n return !props.teleported || !fixed.value\n})\n\nconst rootStyle = computed<CSSProperties>(() => {\n return {\n display: 'flow-root', // https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Display/Formatting_contexts#explicitly_creating_a_bfc_using_display_flow-root\n height: fixed.value ? `${rootHeight.value}px` : '',\n width: fixed.value ? `${rootWidth.value}px` : '',\n }\n})\n\nconst affixStyle = computed<CSSProperties>(() => {\n if (!fixed.value) return {}\n\n const offset = addUnit(props.offset)\n return {\n height: `${rootHeight.value}px`,\n width: `${rootWidth.value}px`,\n top: props.position === 'top' ? offset : '',\n bottom: props.position === 'bottom' ? offset : '',\n left: props.teleported ? `${rootLeft.value}px` : '',\n transform: transform.value ? `translateY(${transform.value}px)` : '',\n zIndex: props.zIndex,\n }\n})\n\nconst update = () => {\n if (!scrollContainer.value) return\n\n scrollTop.value =\n scrollContainer.value instanceof Window\n ? document.documentElement.scrollTop\n : scrollContainer.value.scrollTop || 0\n\n const { position, target, offset } = props\n const rootHeightOffset = offset + rootHeight.value\n\n if (position === 'top') {\n if (target) {\n const difference = targetRect.bottom.value - rootHeightOffset\n fixed.value = offset > rootTop.value && targetRect.bottom.value > 0\n transform.value = difference < 0 ? difference : 0\n } else {\n fixed.value = offset > rootTop.value\n }\n } else if (target) {\n const difference =\n windowHeight.value - targetRect.top.value - rootHeightOffset\n fixed.value =\n windowHeight.value - offset < rootBottom.value &&\n windowHeight.value > targetRect.top.value\n transform.value = difference < 0 ? -difference : 0\n } else {\n fixed.value = windowHeight.value - offset < rootBottom.value\n }\n}\n\nconst updateRootRect = async () => {\n if (!fixed.value) {\n updateRoot()\n return\n }\n\n fixed.value = false\n await nextTick()\n updateRoot()\n fixed.value = true\n}\n\nconst handleScroll = async () => {\n updateRoot()\n await nextTick()\n emit('scroll', {\n scrollTop: scrollTop.value,\n fixed: fixed.value,\n })\n}\n\nwatch(fixed, (val) => emit(CHANGE_EVENT, val))\n\nonMounted(() => {\n if (props.target) {\n target.value =\n document.querySelector<HTMLElement>(props.target) ?? undefined\n if (!target.value)\n throwError(COMPONENT_NAME, `Target does not exist: ${props.target}`)\n } else {\n target.value = document.documentElement\n }\n scrollContainer.value = getScrollContainer(root.value!, true)\n updateRoot()\n})\n\nonActivated(() => {\n nextTick(updateRootRect)\n})\n\nonDeactivated(() => {\n fixed.value = false\n})\n\nuseEventListener(scrollContainer, 'scroll', handleScroll)\nwatchEffect(update)\n\ndefineExpose({\n /** @description update affix status */\n update,\n /** @description update rootRect info */\n updateRoot: updateRootRect,\n})\n</script>\n"],"mappings":""}

View File

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

View File

@@ -0,0 +1,2 @@
import "../../base/style/index.mjs";
import "element-plus/theme-chalk/src/affix.scss";

View File

@@ -0,0 +1,10 @@
import { SFCWithInstall } from "../../utils/vue/typescript.js";
import "../../utils/index.js";
import { AlertEmits, AlertProps, AlertPropsPublic, alertEffects, alertEmits, alertProps } from "./src/alert.js";
import { _default } from "./src/alert.vue.js";
import { AlertInstance } from "./src/instance.js";
//#region ../../packages/components/alert/index.d.ts
declare const ElAlert: SFCWithInstall<typeof _default>;
//#endregion
export { AlertEmits, type AlertInstance, AlertProps, AlertPropsPublic, ElAlert, ElAlert as default, alertEffects, alertEmits, alertProps };

View File

@@ -0,0 +1,10 @@
import { withInstall } from "../../utils/vue/install.mjs";
import { alertEffects, alertEmits, alertProps } from "./src/alert.mjs";
import alert_default from "./src/alert2.mjs";
//#region ../../packages/components/alert/index.ts
const ElAlert = withInstall(alert_default);
//#endregion
export { ElAlert, ElAlert as default, alertEffects, alertEmits, alertProps };
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","names":["Alert"],"sources":["../../../../../packages/components/alert/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils'\nimport Alert from './src/alert.vue'\n\nimport type { SFCWithInstall } from '@element-plus/utils'\n\nexport const ElAlert: SFCWithInstall<typeof Alert> = withInstall(Alert)\nexport default ElAlert\n\nexport * from './src/alert'\nexport type { AlertInstance } from './src/instance'\n"],"mappings":";;;;;AAKA,MAAa,UAAwC,YAAYA,cAAM"}

View File

@@ -0,0 +1,64 @@
import { TypeComponentsMap } from "../../../utils/vue/icon.js";
import { EpPropFinalized } from "../../../utils/vue/props/types.js";
import "../../../utils/index.js";
import { ExtractPublicPropTypes } from "vue";
//#region ../../packages/components/alert/src/alert.d.ts
declare const alertEffects: readonly ["light", "dark"];
interface AlertProps {
/**
* @description alert title.
*/
title?: string;
/**
* @description descriptive text.
*/
description?: string;
/**
* @description alert type.
*/
type?: keyof typeof TypeComponentsMap;
/**
* @description whether alert can be dismissed.
*/
closable?: boolean;
/**
* @description text for replacing x button
*/
closeText?: string;
/**
* @description whether show icon
*/
showIcon?: boolean;
/**
* @description should content be placed in center.
*/
center?: boolean;
/**
* @description theme style
*/
effect?: 'light' | 'dark';
}
/**
* @deprecated Removed after 3.0.0, Use `AlertProps` instead.
*/
declare const alertProps: {
readonly title: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly description: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly type: EpPropFinalized<StringConstructor, "error" | "info" | "primary" | "success" | "warning", unknown, "info", boolean>;
readonly closable: EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
readonly closeText: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly showIcon: BooleanConstructor;
readonly center: BooleanConstructor;
readonly effect: EpPropFinalized<StringConstructor, "light" | "dark", unknown, "light", boolean>;
};
/**
* @deprecated Removed after 3.0.0, Use `AlertProps` instead.
*/
type AlertPropsPublic = ExtractPublicPropTypes<typeof alertProps>;
declare const alertEmits: {
close: (evt: MouseEvent) => boolean;
};
type AlertEmits = typeof alertEmits;
//#endregion
export { AlertEmits, AlertProps, AlertPropsPublic, alertEffects, alertEmits, alertProps };

View File

@@ -0,0 +1,44 @@
import { keysOf } from "../../../utils/objects.mjs";
import { buildProps } from "../../../utils/vue/props/runtime.mjs";
import { TypeComponentsMap } from "../../../utils/vue/icon.mjs";
//#region ../../packages/components/alert/src/alert.ts
const alertEffects = ["light", "dark"];
/**
* @deprecated Removed after 3.0.0, Use `AlertProps` instead.
*/
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 };
//#endregion
export { alertEffects, alertEmits, alertProps };
//# sourceMappingURL=alert.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"alert.mjs","names":[],"sources":["../../../../../../packages/components/alert/src/alert.ts"],"sourcesContent":["import { TypeComponentsMap, buildProps, keysOf } from '@element-plus/utils'\n\nimport type { ExtractPublicPropTypes } from 'vue'\n\nexport const alertEffects = ['light', 'dark'] as const\n\nexport interface AlertProps {\n /**\n * @description alert title.\n */\n title?: string\n /**\n * @description descriptive text.\n */\n description?: string\n /**\n * @description alert type.\n */\n type?: keyof typeof TypeComponentsMap\n /**\n * @description whether alert can be dismissed.\n */\n closable?: boolean\n /**\n * @description text for replacing x button\n */\n closeText?: string\n /**\n * @description whether show icon\n */\n showIcon?: boolean\n /**\n * @description should content be placed in center.\n */\n center?: boolean\n /**\n * @description theme style\n */\n effect?: 'light' | 'dark'\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `AlertProps` instead.\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)\n\n/**\n * @deprecated Removed after 3.0.0, Use `AlertProps` instead.\n */\nexport type AlertPropsPublic = ExtractPublicPropTypes<typeof alertProps>\n\nexport const alertEmits = {\n close: (evt: MouseEvent) => evt instanceof MouseEvent,\n}\nexport type AlertEmits = typeof alertEmits\n"],"mappings":";;;;;AAIA,MAAa,eAAe,CAAC,SAAS,OAAO;;;;AAwC7C,MAAa,aAAa,WAAW;CAInC,OAAO;EACL,MAAM;EACN,SAAS;EACV;CACD,aAAa;EACX,MAAM;EACN,SAAS;EACV;CAID,MAAM;EACJ,MAAM;EACN,QAAQ,OAAO,kBAAkB;EACjC,SAAS;EACV;CAID,UAAU;EACR,MAAM;EACN,SAAS;EACV;CAID,WAAW;EACT,MAAM;EACN,SAAS;EACV;CAID,UAAU;CAIV,QAAQ;CACR,QAAQ;EACN,MAAM;EACN,QAAQ;EACR,SAAS;EACV;CACF,CAAU;AAOX,MAAa,aAAa,EACxB,QAAQ,QAAoB,eAAe,YAC5C"}

View File

@@ -0,0 +1,35 @@
import { TypeComponentsMap } from "../../../utils/vue/icon.js";
import "../../../utils/index.js";
import { AlertProps } from "./alert.js";
import * as vue from "vue";
//#region ../../packages/components/alert/src/alert.vue.d.ts
declare var __VLS_13: {}, __VLS_20: {}, __VLS_22: {};
type __VLS_Slots = {} & {
icon?: (props: typeof __VLS_13) => any;
} & {
title?: (props: typeof __VLS_20) => any;
} & {
default?: (props: typeof __VLS_22) => any;
};
declare const __VLS_base: vue.DefineComponent<AlertProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
close: (evt: MouseEvent) => void;
}, string, vue.PublicProps, Readonly<AlertProps> & Readonly<{
onClose?: ((evt: MouseEvent) => any) | undefined;
}>, {
type: keyof typeof TypeComponentsMap;
title: string;
description: string;
closable: boolean;
closeText: string;
effect: "light" | "dark";
}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
declare const _default: typeof __VLS_export;
type __VLS_WithSlots<T, S> = T & {
new (): {
$slots: S;
};
};
//#endregion
export { _default };

View File

@@ -0,0 +1,81 @@
import { TypeComponents, TypeComponentsMap } from "../../../utils/vue/icon.mjs";
import { flattedChildren, isComment } from "../../../utils/vue/vnode.mjs";
import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
import { alertEmits, alertProps } from "./alert.mjs";
import { ElIcon } from "../../icon/index.mjs";
import { Fragment, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, ref, renderSlot, resolveDynamicComponent, toDisplayString, unref, useSlots, vShow, withCtx, withDirectives } from "vue";
//#region ../../packages/components/alert/src/alert.vue?vue&type=script&setup=true&lang.ts
var alert_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
name: "ElAlert",
__name: "alert",
props: alertProps,
emits: alertEmits,
setup(__props, { emit: __emit }) {
const { Close } = TypeComponents;
const props = __props;
const emit = __emit;
const slots = useSlots();
const ns = useNamespace("alert");
const visible = ref(true);
const iconComponent = computed(() => TypeComponentsMap[props.type]);
const hasDesc = computed(() => {
if (props.description) return true;
const slotContent = slots.default?.();
if (!slotContent) return false;
return flattedChildren(slotContent).some((child) => !isComment(child));
});
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(__props.type),
unref(ns).is("center", __props.center),
unref(ns).is(__props.effect)
]),
role: "alert"
}, [__props.showIcon && (_ctx.$slots.icon || iconComponent.value) ? (openBlock(), createBlock(unref(ElIcon), {
key: 0,
class: normalizeClass([unref(ns).e("icon"), unref(ns).is("big", hasDesc.value)])
}, {
default: withCtx(() => [renderSlot(_ctx.$slots, "icon", {}, () => [(openBlock(), createBlock(resolveDynamicComponent(iconComponent.value)))])]),
_: 3
}, 8, ["class"])) : createCommentVNode("v-if", true), createElementVNode("div", { class: normalizeClass(unref(ns).e("content")) }, [
__props.title || _ctx.$slots.title ? (openBlock(), createElementBlock("span", {
key: 0,
class: normalizeClass([unref(ns).e("title"), { "with-description": hasDesc.value }])
}, [renderSlot(_ctx.$slots, "title", {}, () => [createTextVNode(toDisplayString(__props.title), 1)])], 2)) : createCommentVNode("v-if", true),
hasDesc.value ? (openBlock(), createElementBlock("p", {
key: 1,
class: normalizeClass(unref(ns).e("description"))
}, [renderSlot(_ctx.$slots, "default", {}, () => [createTextVNode(toDisplayString(__props.description), 1)])], 2)) : createCommentVNode("v-if", true),
__props.closable ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [__props.closeText ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass([unref(ns).e("close-btn"), unref(ns).is("customed")]),
onClick: close
}, toDisplayString(__props.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"]);
};
}
});
//#endregion
export { alert_vue_vue_type_script_setup_true_lang_default as default };
//# sourceMappingURL=alert.vue_vue_type_script_setup_true_lang.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"alert.vue_vue_type_script_setup_true_lang.mjs","names":["$slots"],"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\n v-if=\"showIcon && ($slots.icon || iconComponent)\"\n :class=\"[ns.e('icon'), ns.is('big', hasDesc)]\"\n >\n <slot name=\"icon\">\n <component :is=\"iconComponent\" />\n </slot>\n </el-icon>\n\n <div :class=\"ns.e('content')\">\n <span\n v-if=\"title || $slots.title\"\n :class=\"[ns.e('title'), { 'with-description': hasDesc }]\"\n >\n <slot name=\"title\">{{ title }}</slot>\n </span>\n <p v-if=\"hasDesc\" :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\n<script lang=\"ts\" setup>\nimport { computed, ref, useSlots } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport {\n TypeComponents,\n TypeComponentsMap,\n flattedChildren,\n isComment,\n} from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { alertEmits } from './alert'\n\nimport type { AlertProps } from './alert'\n\nconst { Close } = TypeComponents\n\ndefineOptions({\n name: 'ElAlert',\n})\n\nconst props = withDefaults(defineProps<AlertProps>(), {\n title: '',\n description: '',\n type: 'info',\n closable: true,\n closeText: '',\n effect: 'light',\n})\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 hasDesc = computed(() => {\n if (props.description) return true\n const slotContent = slots.default?.()\n if (!slotContent) return false\n\n const children = flattedChildren(slotContent)\n return children.some((child) => !isComment(child))\n})\n\nconst close = (evt: MouseEvent) => {\n visible.value = false\n emit('close', evt)\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;EA2DA,MAAM,EAAE,UAAU;EAMlB,MAAM,QAAQ;EAQd,MAAM,OAAO;EACb,MAAM,QAAQ,UAAS;EAEvB,MAAM,KAAK,aAAa,QAAO;EAE/B,MAAM,UAAU,IAAI,KAAI;EAExB,MAAM,gBAAgB,eAAe,kBAAkB,MAAM,MAAK;EAElE,MAAM,UAAU,eAAe;AAC7B,OAAI,MAAM,YAAa,QAAO;GAC9B,MAAM,cAAc,MAAM,WAAU;AACpC,OAAI,CAAC,YAAa,QAAO;AAGzB,UADiB,gBAAgB,YAAW,CAC5B,MAAM,UAAU,CAAC,UAAU,MAAM,CAAA;IAClD;EAED,MAAM,SAAS,QAAoB;AACjC,WAAQ,QAAQ;AAChB,QAAK,SAAS,IAAG;;;uBA5FjB,YAyCa,YAAA;IAzCA,MAAM,MAAA,GAAE,CAAC,EAAC,OAAA;IAAvB,WAAA;;2BAwCQ,gBAvCN,mBAuCM,OAAA;KArCH,OAAK,eAAA;MAAG,MAAA,GAAE,CAAC,GAAC;MAAI,MAAA,GAAE,CAAC,EAAE,QAAA,KAAI;MAAG,MAAA,GAAE,CAAC,GAAE,UAAW,QAAA,OAAM;MAAG,MAAA,GAAE,CAAC,GAAG,QAAA,OAAM;MAAA,CAAA;KAClE,MAAK;QAGG,QAAA,aAAaA,KAAAA,OAAO,QAAQ,cAAA,uBADpC,YAOU,MAAA,OAAA,EAAA;;KALP,OAAK,eAAA,CAAG,MAAA,GAAE,CAAC,EAAC,OAAA,EAAU,MAAA,GAAE,CAAC,GAAE,OAAQ,QAAA,MAAO,CAAA,CAAA;;4BAIpC,CAFP,WAEO,KAAA,QAAA,QAAA,EAAA,QAAA,eADL,YAAiC,wBAAjB,cAAA,MAAa,CAAA;;0DAIjC,mBAwBM,OAAA,EAxBA,OAAK,eAAE,MAAA,GAAE,CAAC,EAAC,UAAA,CAAA;KAEP,QAAA,SAASA,KAAAA,OAAO,sBADxB,mBAKO,QAAA;;MAHJ,OAAK,eAAA,CAAG,MAAA,GAAE,CAAC,EAAC,QAAA,EAAA,EAAA,oBAAiC,QAAA,OAAO,CAAA,CAAA;SAErD,WAAqC,KAAA,QAAA,SAAA,EAAA,QAAA,iCAAf,QAAA,MAAK,EAAA,EAAA;KAEpB,QAAA,sBAAT,mBAII,KAAA;;MAJe,OAAK,eAAE,MAAA,GAAE,CAAC,EAAC,cAAA,CAAA;SAC5B,WAEO,KAAA,QAAA,WAAA,EAAA,QAAA,iCADF,QAAA,YAAW,EAAA,EAAA;KAGF,QAAA,yBAAhB,mBAWW,UAAA,EAAA,KAAA,GAAA,EAAA,CATD,QAAA,0BADR,mBAMM,OAAA;;MAJH,OAAK,eAAA,CAAG,MAAA,GAAE,CAAC,EAAC,YAAA,EAAe,MAAA,GAAE,CAAC,GAAE,WAAA,CAAA,CAAA;MAChC,SAAO;wBAEL,QAAA,UAAS,EAAA,EAAA,kBAEd,YAEU,MAAA,OAAA,EAAA;;MAFO,OAAK,eAAE,MAAA,GAAE,CAAC,EAAC,YAAA,CAAA;MAAgB,SAAO;;6BACxC,CAAT,YAAS,MAAA,MAAA,CAAA;;;yBAlCP,QAAA,MAAO"}

View File

@@ -0,0 +1,8 @@
import alert_vue_vue_type_script_setup_true_lang_default from "./alert.vue_vue_type_script_setup_true_lang.mjs";
//#region ../../packages/components/alert/src/alert.vue
var alert_default = alert_vue_vue_type_script_setup_true_lang_default;
//#endregion
export { alert_default as default };
//# sourceMappingURL=alert2.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"alert2.mjs","names":[],"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\n v-if=\"showIcon && ($slots.icon || iconComponent)\"\n :class=\"[ns.e('icon'), ns.is('big', hasDesc)]\"\n >\n <slot name=\"icon\">\n <component :is=\"iconComponent\" />\n </slot>\n </el-icon>\n\n <div :class=\"ns.e('content')\">\n <span\n v-if=\"title || $slots.title\"\n :class=\"[ns.e('title'), { 'with-description': hasDesc }]\"\n >\n <slot name=\"title\">{{ title }}</slot>\n </span>\n <p v-if=\"hasDesc\" :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\n<script lang=\"ts\" setup>\nimport { computed, ref, useSlots } from 'vue'\nimport { ElIcon } from '@element-plus/components/icon'\nimport {\n TypeComponents,\n TypeComponentsMap,\n flattedChildren,\n isComment,\n} from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { alertEmits } from './alert'\n\nimport type { AlertProps } from './alert'\n\nconst { Close } = TypeComponents\n\ndefineOptions({\n name: 'ElAlert',\n})\n\nconst props = withDefaults(defineProps<AlertProps>(), {\n title: '',\n description: '',\n type: 'info',\n closable: true,\n closeText: '',\n effect: 'light',\n})\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 hasDesc = computed(() => {\n if (props.description) return true\n const slotContent = slots.default?.()\n if (!slotContent) return false\n\n const children = flattedChildren(slotContent)\n return children.some((child) => !isComment(child))\n})\n\nconst close = (evt: MouseEvent) => {\n visible.value = false\n emit('close', evt)\n}\n</script>\n"],"mappings":""}

View File

@@ -0,0 +1,6 @@
import { _default } from "./alert.vue.js";
//#region ../../packages/components/alert/src/instance.d.ts
type AlertInstance = InstanceType<typeof _default> & unknown;
//#endregion
export { AlertInstance };

View File

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

View File

@@ -0,0 +1,2 @@
import "../../base/style/index.mjs";
import "element-plus/theme-chalk/src/alert.scss";

View File

@@ -0,0 +1,2 @@
import "../../base/style/css.mjs";
import "element-plus/theme-chalk/el-anchor-link.css";

View File

@@ -0,0 +1,2 @@
import "../../base/style/index.mjs";
import "element-plus/theme-chalk/src/anchor-link.scss";

View File

@@ -0,0 +1,13 @@
import { SFCWithInstall } from "../../utils/vue/typescript.js";
import "../../utils/index.js";
import { AnchorEmits, AnchorInstance, AnchorProps, AnchorPropsPublic, anchorEmits, anchorProps } from "./src/anchor.js";
import { _default } from "./src/anchor.vue.js";
import { _default as _default$1 } from "./src/anchor-link.vue.js";
//#region ../../packages/components/anchor/index.d.ts
declare const ElAnchor: SFCWithInstall<typeof _default> & {
AnchorLink: typeof _default$1;
};
declare const ElAnchorLink: SFCWithInstall<typeof _default$1>;
//#endregion
export { AnchorEmits, AnchorInstance, AnchorProps, AnchorPropsPublic, ElAnchor, ElAnchor as default, ElAnchorLink, anchorEmits, anchorProps };

View File

@@ -0,0 +1,12 @@
import { withInstall, withNoopInstall } from "../../utils/vue/install.mjs";
import { anchorEmits, anchorProps } from "./src/anchor.mjs";
import anchor_default from "./src/anchor2.mjs";
import anchor_link_default from "./src/anchor-link2.mjs";
//#region ../../packages/components/anchor/index.ts
const ElAnchor = withInstall(anchor_default, { AnchorLink: anchor_link_default });
const ElAnchorLink = withNoopInstall(anchor_link_default);
//#endregion
export { ElAnchor, ElAnchor as default, ElAnchorLink, anchorEmits, anchorProps };
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","names":["Anchor","AnchorLink"],"sources":["../../../../../packages/components/anchor/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from '@element-plus/utils'\nimport Anchor from './src/anchor.vue'\nimport AnchorLink from './src/anchor-link.vue'\n\nimport type { SFCWithInstall } from '@element-plus/utils'\n\nexport const ElAnchor: SFCWithInstall<typeof Anchor> & {\n AnchorLink: typeof AnchorLink\n} = withInstall(Anchor, {\n AnchorLink,\n})\nexport const ElAnchorLink: SFCWithInstall<typeof AnchorLink> =\n withNoopInstall(AnchorLink)\nexport default ElAnchor\n\nexport * from './src/anchor'\n"],"mappings":";;;;;;AAMA,MAAa,WAET,YAAYA,gBAAQ,EACtB,iCACD,CAAC;AACF,MAAa,eACX,gBAAgBC,oBAAW"}

View File

@@ -0,0 +1,15 @@
import { ExtractPublicPropTypes } from "vue";
//#region ../../packages/components/anchor/src/anchor-link.d.ts
interface AnchorLinkProps {
/**
* @description the text content of the anchor link
*/
title?: string;
/**
* @description The address of the anchor link
*/
href?: string;
}
//#endregion
export { AnchorLinkProps };

View File

@@ -0,0 +1,14 @@
import { buildProps } from "../../../utils/vue/props/runtime.mjs";
//#region ../../packages/components/anchor/src/anchor-link.ts
/**
* @deprecated Removed after 3.0.0, Use `AnchorLinkProps` instead.
*/
const anchorLinkProps = buildProps({
title: String,
href: String
});
//#endregion
export { anchorLinkProps };
//# sourceMappingURL=anchor-link.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"anchor-link.mjs","names":[],"sources":["../../../../../../packages/components/anchor/src/anchor-link.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\n\nimport type { ExtractPublicPropTypes } from 'vue'\n\nexport interface AnchorLinkProps {\n /**\n * @description the text content of the anchor link\n */\n title?: string\n /**\n * @description The address of the anchor link\n */\n href?: string\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `AnchorLinkProps` instead.\n */\nexport const anchorLinkProps = buildProps({\n /**\n * @description the text content of the anchor link\n */\n title: String,\n /**\n * @description The address of the anchor link\n */\n href: String,\n})\n\n/**\n * @deprecated Removed after 3.0.0, Use `AnchorLinkProps` instead.\n */\nexport type AnchorLinkPropsPublic = ExtractPublicPropTypes<\n typeof anchorLinkProps\n>\n"],"mappings":";;;;;;AAkBA,MAAa,kBAAkB,WAAW;CAIxC,OAAO;CAIP,MAAM;CACP,CAAC"}

View File

@@ -0,0 +1,20 @@
import { AnchorLinkProps } from "./anchor-link.js";
import * as vue from "vue";
//#region ../../packages/components/anchor/src/anchor-link.vue.d.ts
declare var __VLS_1: {}, __VLS_3: {};
type __VLS_Slots = {} & {
default?: (props: typeof __VLS_1) => any;
} & {
'sub-link'?: (props: typeof __VLS_3) => any;
};
declare const __VLS_base: vue.DefineComponent<AnchorLinkProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<AnchorLinkProps> & Readonly<{}>, {}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
declare const _default: typeof __VLS_export;
type __VLS_WithSlots<T, S> = T & {
new (): {
$slots: S;
};
};
//#endregion
export { _default };

View File

@@ -0,0 +1,56 @@
import { anchorKey } from "./constants.mjs";
import { anchorLinkProps } from "./anchor-link.mjs";
import { computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, inject, nextTick, normalizeClass, onBeforeUnmount, onMounted, openBlock, ref, renderSlot, toDisplayString, unref, watch } from "vue";
//#region ../../packages/components/anchor/src/anchor-link.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1 = ["href"];
var anchor_link_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
name: "ElAnchorLink",
__name: "anchor-link",
props: anchorLinkProps,
setup(__props) {
const props = __props;
const linkRef = ref(null);
const { ns, direction, currentAnchor, addLink, removeLink, handleClick: contextHandleClick } = inject(anchorKey);
const cls = computed(() => [ns.e("link"), ns.is("active", currentAnchor.value === props.href)]);
const handleClick = (e) => {
contextHandleClick(e, props.href);
};
watch(() => props.href, (val, oldVal) => {
nextTick(() => {
if (oldVal) removeLink(oldVal);
if (val) addLink({
href: val,
el: linkRef.value
});
});
});
onMounted(() => {
const { href } = props;
if (href) addLink({
href,
el: linkRef.value
});
});
onBeforeUnmount(() => {
const { href } = props;
if (href) removeLink(href);
});
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", { class: normalizeClass(unref(ns).e("item")) }, [createElementVNode("a", {
ref_key: "linkRef",
ref: linkRef,
class: normalizeClass(cls.value),
href: __props.href,
onClick: handleClick
}, [renderSlot(_ctx.$slots, "default", {}, () => [createTextVNode(toDisplayString(__props.title), 1)])], 10, _hoisted_1), _ctx.$slots["sub-link"] && unref(direction) === "vertical" ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass(unref(ns).e("list"))
}, [renderSlot(_ctx.$slots, "sub-link")], 2)) : createCommentVNode("v-if", true)], 2);
};
}
});
//#endregion
export { anchor_link_vue_vue_type_script_setup_true_lang_default as default };
//# sourceMappingURL=anchor-link.vue_vue_type_script_setup_true_lang.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"anchor-link.vue_vue_type_script_setup_true_lang.mjs","names":["$slots"],"sources":["../../../../../../packages/components/anchor/src/anchor-link.vue"],"sourcesContent":["<template>\n <div :class=\"ns.e('item')\">\n <a ref=\"linkRef\" :class=\"cls\" :href=\"href\" @click=\"handleClick\">\n <slot>{{ title }}</slot>\n </a>\n <div\n v-if=\"$slots['sub-link'] && direction === 'vertical'\"\n :class=\"ns.e('list')\"\n >\n <slot name=\"sub-link\" />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n computed,\n inject,\n nextTick,\n onBeforeUnmount,\n onMounted,\n ref,\n watch,\n} from 'vue'\nimport { anchorKey } from './constants'\n\nimport type { AnchorLinkProps } from './anchor-link'\n\ndefineOptions({\n name: 'ElAnchorLink',\n})\n\nconst props = defineProps<AnchorLinkProps>()\n\nconst linkRef = ref<HTMLElement | null>(null)\n\nconst {\n ns,\n direction,\n currentAnchor,\n addLink,\n removeLink,\n handleClick: contextHandleClick,\n} = inject(anchorKey)!\n\nconst cls = computed(() => [\n ns.e('link'),\n ns.is('active', currentAnchor.value === props.href),\n])\n\nconst handleClick = (e: MouseEvent) => {\n contextHandleClick(e, props.href)\n}\n\nwatch(\n () => props.href,\n (val, oldVal) => {\n nextTick(() => {\n if (oldVal) removeLink(oldVal)\n if (val) {\n addLink({\n href: val,\n el: linkRef.value!,\n })\n }\n })\n }\n)\n\nonMounted(() => {\n const { href } = props\n if (href) {\n addLink({\n href,\n el: linkRef.value!,\n })\n }\n})\n\nonBeforeUnmount(() => {\n const { href } = props\n if (href) {\n removeLink(href)\n }\n})\n</script>\n"],"mappings":";;;;;;;;;;;EAgCA,MAAM,QAAQ;EAEd,MAAM,UAAU,IAAwB,KAAI;EAE5C,MAAM,EACJ,IACA,WACA,eACA,SACA,YACA,aAAa,uBACX,OAAO,UAAU;EAErB,MAAM,MAAM,eAAe,CACzB,GAAG,EAAE,OAAO,EACZ,GAAG,GAAG,UAAU,cAAc,UAAU,MAAM,KAAK,CACpD,CAAA;EAED,MAAM,eAAe,MAAkB;AACrC,sBAAmB,GAAG,MAAM,KAAI;;AAGlC,cACQ,MAAM,OACX,KAAK,WAAW;AACf,kBAAe;AACb,QAAI,OAAQ,YAAW,OAAM;AAC7B,QAAI,IACF,SAAQ;KACN,MAAM;KACN,IAAI,QAAQ;KACb,CAAA;KAEJ;IAEL;AAEA,kBAAgB;GACd,MAAM,EAAE,SAAS;AACjB,OAAI,KACF,SAAQ;IACN;IACA,IAAI,QAAQ;IACb,CAAA;IAEJ;AAED,wBAAsB;GACpB,MAAM,EAAE,SAAS;AACjB,OAAI,KACF,YAAW,KAAI;IAElB;;uBAnFC,mBAUM,OAAA,EAVA,OAAK,eAAE,MAAA,GAAE,CAAC,EAAC,OAAA,CAAA,KACf,mBAEI,KAAA;aAFG;IAAJ,KAAI;IAAW,OAAK,eAAE,IAAA,MAAG;IAAG,MAAM,QAAA;IAAO,SAAO;OACjD,WAAwB,KAAA,QAAA,WAAA,EAAA,QAAA,iCAAf,QAAA,MAAK,EAAA,EAAA,sBAGRA,KAAAA,OAAM,eAAgB,MAAA,UAAS,KAAA,2BADvC,mBAKM,OAAA;;IAHH,OAAK,eAAE,MAAA,GAAE,CAAC,EAAC,OAAA,CAAA;OAEZ,WAAwB,KAAA,QAAA,WAAA"}

View File

@@ -0,0 +1,8 @@
import anchor_link_vue_vue_type_script_setup_true_lang_default from "./anchor-link.vue_vue_type_script_setup_true_lang.mjs";
//#region ../../packages/components/anchor/src/anchor-link.vue
var anchor_link_default = anchor_link_vue_vue_type_script_setup_true_lang_default;
//#endregion
export { anchor_link_default as default };
//# sourceMappingURL=anchor-link2.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"anchor-link2.mjs","names":[],"sources":["../../../../../../packages/components/anchor/src/anchor-link.vue"],"sourcesContent":["<template>\n <div :class=\"ns.e('item')\">\n <a ref=\"linkRef\" :class=\"cls\" :href=\"href\" @click=\"handleClick\">\n <slot>{{ title }}</slot>\n </a>\n <div\n v-if=\"$slots['sub-link'] && direction === 'vertical'\"\n :class=\"ns.e('list')\"\n >\n <slot name=\"sub-link\" />\n </div>\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n computed,\n inject,\n nextTick,\n onBeforeUnmount,\n onMounted,\n ref,\n watch,\n} from 'vue'\nimport { anchorKey } from './constants'\n\nimport type { AnchorLinkProps } from './anchor-link'\n\ndefineOptions({\n name: 'ElAnchorLink',\n})\n\nconst props = defineProps<AnchorLinkProps>()\n\nconst linkRef = ref<HTMLElement | null>(null)\n\nconst {\n ns,\n direction,\n currentAnchor,\n addLink,\n removeLink,\n handleClick: contextHandleClick,\n} = inject(anchorKey)!\n\nconst cls = computed(() => [\n ns.e('link'),\n ns.is('active', currentAnchor.value === props.href),\n])\n\nconst handleClick = (e: MouseEvent) => {\n contextHandleClick(e, props.href)\n}\n\nwatch(\n () => props.href,\n (val, oldVal) => {\n nextTick(() => {\n if (oldVal) removeLink(oldVal)\n if (val) {\n addLink({\n href: val,\n el: linkRef.value!,\n })\n }\n })\n }\n)\n\nonMounted(() => {\n const { href } = props\n if (href) {\n addLink({\n href,\n el: linkRef.value!,\n })\n }\n})\n\nonBeforeUnmount(() => {\n const { href } = props\n if (href) {\n removeLink(href)\n }\n})\n</script>\n"],"mappings":""}

View File

@@ -0,0 +1,71 @@
import { EpPropFinalized, EpPropMergeType } from "../../../utils/vue/props/types.js";
import "../../../utils/index.js";
import { _default } from "./anchor.vue.js";
import * as vue from "vue";
import { ExtractPublicPropTypes } from "vue";
//#region ../../packages/components/anchor/src/anchor.d.ts
interface AnchorProps {
/**
* @description scroll container
*/
container?: string | HTMLElement | Window | null;
/**
* @description Set the offset of the anchor scroll
*/
offset?: number;
/**
* @description The offset of the element starting to trigger the anchor
*/
bound?: number;
/**
* @description Set the scroll duration of the container when the anchor is clicked, in milliseconds
*/
duration?: number;
/**
* @description Whether to show the marker
*/
marker?: boolean;
/**
* @description Set Anchor type
*/
type?: 'default' | 'underline';
/**
* @description Set Anchor direction
*/
direction?: 'vertical' | 'horizontal';
/**
* @description Scroll whether link is selected at the top
*/
selectScrollTop?: boolean;
}
/**
* @deprecated Removed after 3.0.0, Use `AnchorProps` instead.
*/
declare const anchorProps: {
container: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | HTMLElement | Window) | (() => string | HTMLElement | Window | null) | (((new (...args: any[]) => string | HTMLElement | Window) | (() => string | HTMLElement | Window | null)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
offset: EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
bound: EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
duration: EpPropFinalized<NumberConstructor, unknown, unknown, number, boolean>;
marker: EpPropFinalized<BooleanConstructor, unknown, unknown, boolean, boolean>;
type: EpPropFinalized<(new (...args: any[]) => "default" | "underline") | (() => "default" | "underline") | (((new (...args: any[]) => "default" | "underline") | (() => "default" | "underline")) | null)[], unknown, unknown, string, boolean>;
direction: EpPropFinalized<(new (...args: any[]) => "horizontal" | "vertical") | (() => "horizontal" | "vertical") | (((new (...args: any[]) => "horizontal" | "vertical") | (() => "horizontal" | "vertical")) | null)[], unknown, unknown, string, boolean>;
selectScrollTop: BooleanConstructor;
};
/**
* @deprecated Removed after 3.0.0, Use `AnchorProps` instead.
*/
type AnchorPropsPublic = ExtractPublicPropTypes<typeof anchorProps>;
type AnchorInstance = InstanceType<typeof _default> & unknown;
declare const anchorEmits: {
change: (href: string) => boolean;
click: (e: MouseEvent, href?: string) => boolean;
};
type AnchorEmits = typeof anchorEmits;
//#endregion
export { AnchorEmits, AnchorInstance, AnchorProps, AnchorPropsPublic, anchorEmits, anchorProps };

View File

@@ -0,0 +1,43 @@
import { isString, isUndefined } from "../../../utils/types.mjs";
import { buildProps, definePropType } from "../../../utils/vue/props/runtime.mjs";
//#region ../../packages/components/anchor/src/anchor.ts
/**
* @deprecated Removed after 3.0.0, Use `AnchorProps` instead.
*/
const anchorProps = buildProps({
container: { type: definePropType([String, Object]) },
offset: {
type: Number,
default: 0
},
bound: {
type: Number,
default: 15
},
duration: {
type: Number,
default: 300
},
marker: {
type: Boolean,
default: true
},
type: {
type: definePropType(String),
default: "default"
},
direction: {
type: definePropType(String),
default: "vertical"
},
selectScrollTop: Boolean
});
const anchorEmits = {
change: (href) => isString(href),
click: (e, href) => e instanceof MouseEvent && (isString(href) || isUndefined(href))
};
//#endregion
export { anchorEmits, anchorProps };
//# sourceMappingURL=anchor.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"anchor.mjs","names":[],"sources":["../../../../../../packages/components/anchor/src/anchor.ts"],"sourcesContent":["import {\n buildProps,\n definePropType,\n isString,\n isUndefined,\n} from '@element-plus/utils'\n\nimport type { ExtractPublicPropTypes } from 'vue'\nimport type Anchor from './anchor.vue'\n\nexport interface AnchorProps {\n /**\n * @description scroll container\n */\n container?: string | HTMLElement | Window | null\n /**\n * @description Set the offset of the anchor scroll\n */\n offset?: number\n /**\n * @description The offset of the element starting to trigger the anchor\n */\n bound?: number\n /**\n * @description Set the scroll duration of the container when the anchor is clicked, in milliseconds\n */\n duration?: number\n /**\n * @description Whether to show the marker\n */\n marker?: boolean\n /**\n * @description Set Anchor type\n */\n type?: 'default' | 'underline'\n /**\n * @description Set Anchor direction\n */\n direction?: 'vertical' | 'horizontal'\n /**\n * @description Scroll whether link is selected at the top\n */\n selectScrollTop?: boolean\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `AnchorProps` instead.\n */\nexport const anchorProps = buildProps({\n /**\n * @description scroll container\n */\n container: {\n type: definePropType<string | HTMLElement | Window | null>([\n String,\n Object,\n ]),\n },\n /**\n * @description Set the offset of the anchor scroll\n */\n offset: {\n type: Number,\n default: 0,\n },\n /**\n * @description The offset of the element starting to trigger the anchor\n */\n bound: {\n type: Number,\n default: 15,\n },\n /**\n * @description Set the scroll duration of the container when the anchor is clicked, in milliseconds\n */\n duration: {\n type: Number,\n default: 300,\n },\n /**\n * @description Whether to show the marker\n */\n marker: {\n type: Boolean,\n default: true,\n },\n /**\n * @description Set Anchor type\n */\n type: {\n type: definePropType<'default' | 'underline'>(String),\n default: 'default',\n },\n /**\n * @description Set Anchor direction\n */\n direction: {\n type: definePropType<'vertical' | 'horizontal'>(String),\n default: 'vertical',\n },\n /**\n * @description Scroll whether link is selected at the top\n */\n selectScrollTop: Boolean,\n})\n\n/**\n * @deprecated Removed after 3.0.0, Use `AnchorProps` instead.\n */\nexport type AnchorPropsPublic = ExtractPublicPropTypes<typeof anchorProps>\nexport type AnchorInstance = InstanceType<typeof Anchor> & unknown\n\nexport const anchorEmits = {\n change: (href: string) => isString(href),\n click: (e: MouseEvent, href?: string) =>\n e instanceof MouseEvent && (isString(href) || isUndefined(href)),\n}\nexport type AnchorEmits = typeof anchorEmits\n"],"mappings":";;;;;;;AAgDA,MAAa,cAAc,WAAW;CAIpC,WAAW,EACT,MAAM,eAAqD,CACzD,QACA,OACD,CAAC,EACH;CAID,QAAQ;EACN,MAAM;EACN,SAAS;EACV;CAID,OAAO;EACL,MAAM;EACN,SAAS;EACV;CAID,UAAU;EACR,MAAM;EACN,SAAS;EACV;CAID,QAAQ;EACN,MAAM;EACN,SAAS;EACV;CAID,MAAM;EACJ,MAAM,eAAwC,OAAO;EACrD,SAAS;EACV;CAID,WAAW;EACT,MAAM,eAA0C,OAAO;EACvD,SAAS;EACV;CAID,iBAAiB;CAClB,CAAC;AAQF,MAAa,cAAc;CACzB,SAAS,SAAiB,SAAS,KAAK;CACxC,QAAQ,GAAe,SACrB,aAAa,eAAe,SAAS,KAAK,IAAI,YAAY,KAAK;CAClE"}

View File

@@ -0,0 +1,33 @@
import { AnchorProps } from "./anchor.js";
import * as vue from "vue";
//#region ../../packages/components/anchor/src/anchor.vue.d.ts
declare var __VLS_1: {};
type __VLS_Slots = {} & {
default?: (props: typeof __VLS_1) => any;
};
declare const __VLS_base: vue.DefineComponent<AnchorProps, {
scrollTo: (href?: string) => void;
}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
change: (href: string) => void;
click: (e: MouseEvent, href?: string | undefined) => void;
}, string, vue.PublicProps, Readonly<AnchorProps> & Readonly<{
onChange?: ((href: string) => any) | undefined;
onClick?: ((e: MouseEvent, href?: string | undefined) => any) | undefined;
}>, {
offset: number;
type: "default" | "underline";
direction: "vertical" | "horizontal";
marker: boolean;
duration: number;
bound: number;
}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
declare const _default: typeof __VLS_export;
type __VLS_WithSlots<T, S> = T & {
new (): {
$slots: S;
};
};
//#endregion
export { _default };

View File

@@ -0,0 +1,178 @@
import { CHANGE_EVENT } from "../../../constants/event.mjs";
import { getOffsetTopDistance } from "../../../utils/dom/position.mjs";
import { isUndefined, isWindow } from "../../../utils/types.mjs";
import { animateScrollTo, getScrollElement, getScrollTop } from "../../../utils/dom/scroll.mjs";
import { getElement } from "../../../utils/dom/element.mjs";
import { throttleByRaf } from "../../../utils/throttleByRaf.mjs";
import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
import { anchorEmits, anchorProps } from "./anchor.mjs";
import { anchorKey } from "./constants.mjs";
import { useEventListener } from "@vueuse/core";
import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, onMounted, openBlock, provide, ref, renderSlot, unref, useSlots, watch } from "vue";
//#region ../../packages/components/anchor/src/anchor.vue?vue&type=script&setup=true&lang.ts
var anchor_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
name: "ElAnchor",
__name: "anchor",
props: anchorProps,
emits: anchorEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const slots = useSlots();
const currentAnchor = ref("");
const markerStyle = ref({});
const anchorRef = ref(null);
const markerRef = ref(null);
const containerEl = ref();
const links = {};
let isScrolling = false;
let currentScrollTop = 0;
const ns = useNamespace("anchor");
const cls = computed(() => [
ns.b(),
props.type === "underline" ? ns.m("underline") : "",
ns.m(props.direction)
]);
const addLink = (state) => {
links[state.href] = state.el;
};
const removeLink = (href) => {
delete links[href];
};
const setCurrentAnchor = (href) => {
if (currentAnchor.value !== href) {
currentAnchor.value = href;
emit(CHANGE_EVENT, href);
}
};
let clearAnimate = null;
let currentTargetHref = "";
const scrollToAnchor = (href) => {
if (!containerEl.value) return;
const target = getElement(href);
if (!target) return;
if (clearAnimate) {
if (currentTargetHref === href) return;
clearAnimate();
}
currentTargetHref = href;
isScrolling = true;
const scrollEle = getScrollElement(target, containerEl.value);
const distance = getOffsetTopDistance(target, scrollEle);
const max = scrollEle.scrollHeight - scrollEle.clientHeight;
const to = Math.min(distance - props.offset, max);
clearAnimate = animateScrollTo(containerEl.value, currentScrollTop, to, props.duration, () => {
setTimeout(() => {
isScrolling = false;
currentTargetHref = "";
}, 20);
});
};
const scrollTo = (href) => {
if (href) {
setCurrentAnchor(href);
scrollToAnchor(href);
}
};
const handleClick = (e, href) => {
emit("click", e, href);
scrollTo(href);
};
const handleScroll = throttleByRaf(() => {
if (containerEl.value) currentScrollTop = getScrollTop(containerEl.value);
const currentHref = getCurrentHref();
if (isScrolling || isUndefined(currentHref)) return;
setCurrentAnchor(currentHref);
});
const getCurrentHref = () => {
if (!containerEl.value) return;
const scrollTop = getScrollTop(containerEl.value);
const anchorTopList = [];
for (const href of Object.keys(links)) {
const target = getElement(href);
if (!target) continue;
const distance = getOffsetTopDistance(target, getScrollElement(target, containerEl.value));
anchorTopList.push({
top: distance - props.offset - props.bound,
href
});
}
anchorTopList.sort((prev, next) => prev.top - next.top);
for (let i = 0; i < anchorTopList.length; i++) {
const item = anchorTopList[i];
const next = anchorTopList[i + 1];
if (i === 0 && scrollTop === 0) return props.selectScrollTop ? item.href : "";
if (item.top <= scrollTop && (!next || next.top > scrollTop)) return item.href;
}
};
const getContainer = () => {
const el = getElement(props.container);
if (!el || isWindow(el)) containerEl.value = window;
else containerEl.value = el;
};
useEventListener(containerEl, "scroll", handleScroll);
const updateMarkerStyle = () => {
nextTick(() => {
if (!anchorRef.value || !markerRef.value || !currentAnchor.value) {
markerStyle.value = {};
return;
}
const currentLinkEl = links[currentAnchor.value];
if (!currentLinkEl) {
markerStyle.value = {};
return;
}
const anchorRect = anchorRef.value.getBoundingClientRect();
const markerRect = markerRef.value.getBoundingClientRect();
const linkRect = currentLinkEl.getBoundingClientRect();
if (props.direction === "horizontal") markerStyle.value = {
left: `${linkRect.left - anchorRect.left}px`,
width: `${linkRect.width}px`,
opacity: 1
};
else markerStyle.value = {
top: `${linkRect.top - anchorRect.top + (linkRect.height - markerRect.height) / 2}px`,
opacity: 1
};
});
};
watch(currentAnchor, updateMarkerStyle);
watch(() => slots.default?.(), updateMarkerStyle);
onMounted(() => {
getContainer();
const hash = decodeURIComponent(window.location.hash);
if (getElement(hash)) scrollTo(hash);
else handleScroll();
});
watch(() => props.container, () => {
getContainer();
});
provide(anchorKey, {
ns,
direction: props.direction,
currentAnchor,
addLink,
removeLink,
handleClick
});
__expose({ scrollTo });
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", {
ref_key: "anchorRef",
ref: anchorRef,
class: normalizeClass(cls.value)
}, [__props.marker ? (openBlock(), createElementBlock("div", {
key: 0,
ref_key: "markerRef",
ref: markerRef,
class: normalizeClass(unref(ns).e("marker")),
style: normalizeStyle(markerStyle.value)
}, null, 6)) : createCommentVNode("v-if", true), createElementVNode("div", { class: normalizeClass(unref(ns).e("list")) }, [renderSlot(_ctx.$slots, "default")], 2)], 2);
};
}
});
//#endregion
export { anchor_vue_vue_type_script_setup_true_lang_default as default };
//# sourceMappingURL=anchor.vue_vue_type_script_setup_true_lang.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,8 @@
import anchor_vue_vue_type_script_setup_true_lang_default from "./anchor.vue_vue_type_script_setup_true_lang.mjs";
//#region ../../packages/components/anchor/src/anchor.vue
var anchor_default = anchor_vue_vue_type_script_setup_true_lang_default;
//#endregion
export { anchor_default as default };
//# sourceMappingURL=anchor2.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,6 @@
//#region ../../packages/components/anchor/src/constants.ts
const anchorKey = Symbol("anchor");
//#endregion
export { anchorKey };
//# sourceMappingURL=constants.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"constants.mjs","names":[],"sources":["../../../../../../packages/components/anchor/src/constants.ts"],"sourcesContent":["import type { InjectionKey, Ref } from 'vue'\nimport type { UseNamespaceReturn } from '@element-plus/hooks'\n\nexport interface AnchorLinkState {\n el: HTMLElement\n href: string\n}\n\nexport interface AnchorContext {\n ns: UseNamespaceReturn\n direction: string\n currentAnchor: Ref<string>\n addLink(state: AnchorLinkState): void\n removeLink(href: string): void\n handleClick(e: MouseEvent, href?: string): void\n}\n\nexport const anchorKey: InjectionKey<AnchorContext> = Symbol('anchor')\n"],"mappings":";AAiBA,MAAa,YAAyC,OAAO,SAAS"}

View File

@@ -0,0 +1,2 @@
import "../../base/style/css.mjs";
import "element-plus/theme-chalk/el-anchor.css";

View File

@@ -0,0 +1,2 @@
import "../../base/style/index.mjs";
import "element-plus/theme-chalk/src/anchor.scss";

View File

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

View File

@@ -0,0 +1,2 @@
import "../../base/style/index.mjs";
import "element-plus/theme-chalk/src/aside.scss";

View File

@@ -0,0 +1,9 @@
import { SFCWithInstall } from "../../utils/vue/typescript.js";
import "../../utils/index.js";
import { AutocompleteData, AutocompleteDataItem, AutocompleteEmits, AutocompleteFetchSuggestions, AutocompleteFetchSuggestionsCallback, AutocompleteInstance, AutocompletePlacement, AutocompleteProps, AutocompletePropsPublic, autocompleteEmits, autocompleteProps } from "./src/autocomplete.js";
import { _default } from "./src/autocomplete.vue.js";
//#region ../../packages/components/autocomplete/index.d.ts
declare const ElAutocomplete: SFCWithInstall<typeof _default>;
//#endregion
export { AutocompleteData, AutocompleteDataItem, AutocompleteEmits, AutocompleteFetchSuggestions, AutocompleteFetchSuggestionsCallback, AutocompleteInstance, AutocompletePlacement, AutocompleteProps, AutocompletePropsPublic, ElAutocomplete, ElAutocomplete as default, autocompleteEmits, autocompleteProps };

View File

@@ -0,0 +1,10 @@
import { withInstall } from "../../utils/vue/install.mjs";
import { autocompleteEmits, autocompleteProps } from "./src/autocomplete.mjs";
import autocomplete_default from "./src/autocomplete2.mjs";
//#region ../../packages/components/autocomplete/index.ts
const ElAutocomplete = withInstall(autocomplete_default);
//#endregion
export { ElAutocomplete, ElAutocomplete as default, autocompleteEmits, autocompleteProps };
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","names":["Autocomplete"],"sources":["../../../../../packages/components/autocomplete/index.ts"],"sourcesContent":["import { withInstall } from '@element-plus/utils'\nimport Autocomplete from './src/autocomplete.vue'\n\nimport type { SFCWithInstall } from '@element-plus/utils'\n\nexport const ElAutocomplete: SFCWithInstall<typeof Autocomplete> =\n withInstall(Autocomplete)\n\nexport default ElAutocomplete\n\nexport * from './src/autocomplete'\n"],"mappings":";;;;;AAKA,MAAa,iBACX,YAAYA,qBAAa"}

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,71 @@
import { CHANGE_EVENT, INPUT_EVENT, UPDATE_MODEL_EVENT } from "../../../constants/event.mjs";
import { isNumber, isObject, isString } from "../../../utils/types.mjs";
import { buildProps, definePropType } from "../../../utils/vue/props/runtime.mjs";
import { NOOP } from "../../../utils/functions.mjs";
import { useTooltipContentProps } from "../../tooltip/src/content.mjs";
import { inputProps } from "../../input/src/input.mjs";
//#region ../../packages/components/autocomplete/src/autocomplete.ts
/**
* @deprecated Removed after 3.0.0, Use `AutocompleteProps` instead.
*/
const autocompleteProps = buildProps({
...inputProps,
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: useTooltipContentProps.popperClass,
popperStyle: useTooltipContentProps.popperStyle,
triggerOnFocus: {
type: Boolean,
default: true
},
selectWhenUnmatched: Boolean,
hideLoading: Boolean,
teleported: useTooltipContentProps.teleported,
appendTo: useTooltipContentProps.appendTo,
highlightFirstItem: Boolean,
fitInputWidth: Boolean,
loopNavigation: {
type: Boolean,
default: true
}
});
const autocompleteEmits = {
[UPDATE_MODEL_EVENT]: (value) => isString(value) || isNumber(value),
[INPUT_EVENT]: (value) => isString(value) || isNumber(value),
[CHANGE_EVENT]: (value) => isString(value) || isNumber(value),
focus: (evt) => evt instanceof FocusEvent,
blur: (evt) => evt instanceof FocusEvent,
clear: () => true,
select: (item) => isObject(item)
};
//#endregion
export { autocompleteEmits, autocompleteProps };
//# sourceMappingURL=autocomplete.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,66 @@
import { InputInstance } from "../../input/src/instance.js";
import "../../input/index.js";
import { TooltipInstance } from "../../tooltip/src/tooltip.js";
import "../../tooltip/index.js";
import { AutocompleteData, AutocompleteDataItem, AutocompleteProps } from "./autocomplete.js";
import * as vue from "vue";
import { Ref } from "vue";
//#region ../../packages/components/autocomplete/src/autocomplete.vue.d.ts
declare const __VLS_export: <T extends AutocompleteDataItem = AutocompleteDataItem>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
props: vue.PublicProps & __VLS_PrettifyLocal<AutocompleteProps<T> & {
onBlur?: ((evt: FocusEvent) => any) | undefined;
onChange?: ((value: string | number) => any) | undefined;
onFocus?: ((evt: FocusEvent) => any) | undefined;
onInput?: ((value: string | number) => any) | undefined;
onSelect?: ((item: Record<string, any>) => any) | undefined;
"onUpdate:modelValue"?: ((value: string | number) => any) | undefined;
onClear?: (() => any) | undefined;
}> & (typeof globalThis extends {
__VLS_PROPS_FALLBACK: infer P;
} ? P : {});
expose: (exposed: vue.ShallowUnwrapRef<{
/** @description the index of the currently highlighted item */highlightedIndex: Ref<number, number>; /** @description autocomplete whether activated */
activated: Ref<boolean, boolean>; /** @description remote search loading status */
loading: Ref<boolean, boolean>; /** @description el-input component instance */
inputRef: Ref<InputInstance | undefined, InputInstance | undefined>; /** @description el-tooltip component instance */
popperRef: Ref<TooltipInstance | undefined, TooltipInstance | undefined>; /** @description fetch suggestions result */
suggestions: Ref<AutocompleteData<T>, AutocompleteData<T>>; /** @description triggers when a suggestion is clicked */
handleSelect: (item: T) => Promise<void>; /** @description handle keyboard enter event */
handleKeyEnter: () => Promise<void>; /** @description focus the input element */
focus: () => void; /** @description blur the input element */
blur: () => void; /** @description close suggestion */
close: () => void; /** @description highlight an item in a suggestion */
highlight: (index: number) => void; /** @description loading suggestion list */
getData: (queryString: string) => Promise<void>;
}>) => void;
attrs: any;
slots: {
prepend?: (props: {}) => any;
} & {
append?: (props: {}) => any;
} & {
prefix?: (props: {}) => any;
} & {
suffix?: (props: {}) => any;
} & {
header?: (props: {}) => any;
} & {
loading?: (props: {}) => any;
} & {
default?: (props: {
item: T;
}) => any;
} & {
footer?: (props: {}) => any;
};
emit: ((event: "blur", evt: FocusEvent) => void) & ((event: "focus", evt: FocusEvent) => void) & ((event: "select", item: Record<string, any>) => void) & ((event: "change", value: string | number) => void) & ((event: "update:modelValue", value: string | number) => void) & ((event: "input", value: string | number) => void) & ((event: "clear") => void);
}>) => vue.VNode<vue.RendererNode, vue.RendererElement, {
[key: string]: any;
}> & {
__ctx?: Awaited<typeof __VLS_setup>;
};
declare const _default: typeof __VLS_export;
type __VLS_PrettifyLocal<T> = (T extends any ? { [K in keyof T]: T[K] } : { [K in keyof T as K]: T[K] }) & {};
//#endregion
export { _default };

View File

@@ -0,0 +1,409 @@
import { EVENT_CODE } from "../../../constants/aria.mjs";
import { CHANGE_EVENT, INPUT_EVENT, UPDATE_MODEL_EVENT } from "../../../constants/event.mjs";
import { getEventCode } from "../../../utils/dom/event.mjs";
import { isArray } from "../../../utils/types.mjs";
import { throwError } from "../../../utils/error.mjs";
import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
import { useId } from "../../../hooks/use-id/index.mjs";
import { ElIcon } from "../../icon/index.mjs";
import { useFormDisabled } from "../../form/src/hooks/use-form-common-props.mjs";
import { ElTooltip } from "../../tooltip/index.mjs";
import { ElInput } from "../../input/index.mjs";
import { autocompleteEmits, autocompleteProps } from "./autocomplete.mjs";
import { ElScrollbar } from "../../scrollbar/index.mjs";
import { onClickOutside, useDebounceFn } from "@vueuse/core";
import { pick } from "lodash-unified";
import { Loading } from "@element-plus/icons-vue";
import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, mergeProps, normalizeClass, normalizeStyle, onBeforeUnmount, onMounted, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useAttrs, withCtx, withModifiers } from "vue";
//#region ../../packages/components/autocomplete/src/autocomplete.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1 = ["aria-expanded", "aria-owns"];
const _hoisted_2 = { key: 0 };
const _hoisted_3 = [
"id",
"aria-selected",
"onClick"
];
const COMPONENT_NAME = "ElAutocomplete";
var autocomplete_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
name: COMPONENT_NAME,
inheritAttrs: false,
__name: "autocomplete",
props: autocompleteProps,
emits: autocompleteEmits,
setup(__props, { expose: __expose, emit: __emit }) {
const props = __props;
const emit = __emit;
const passInputProps = computed(() => {
const inputProps = ElInput.props ?? [];
return pick(props, isArray(inputProps) ? inputProps : Object.keys(inputProps));
});
const rawAttrs = useAttrs();
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 = useId();
const styles = computed(() => rawAttrs.style);
const suggestionVisible = computed(() => {
return (suggestions.value.length > 0 || 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 = useDebounceFn(getData, computed(() => props.debounce));
const handleInput = (value) => {
const valuePresented = !!value;
emit(INPUT_EVENT, value);
emit(UPDATE_MODEL_EVENT, value);
suggestionDisabled.value = false;
activated.value ||= valuePresented;
if (!props.triggerOnFocus && !value) {
suggestionDisabled.value = true;
suggestions.value = [];
return;
}
debouncedGetData(value);
};
const handleMouseDown = (event) => {
if (disabled.value) return;
if (event.target?.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);
const queryString = props.modelValue ?? "";
if (props.triggerOnFocus && !readonly) debouncedGetData(String(queryString));
} else ignoreFocusEvent = false;
};
const handleBlur = (evt) => {
setTimeout(() => {
if (popperRef.value?.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 (inputRef.value?.isComposing) return;
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;
}
activated.value = true;
debouncedGetData(String(props.modelValue));
}
};
const handleKeyEscape = (evt) => {
if (suggestionVisible.value) {
evt.preventDefault();
evt.stopPropagation();
close();
}
};
const close = () => {
activated.value = false;
};
const focus = () => {
inputRef.value?.focus();
};
const blur = () => {
inputRef.value?.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) {
if (!props.loopNavigation) {
highlightedIndex.value = -1;
return;
}
index = suggestions.value.length - 1;
}
if (index >= suggestions.value.length) index = props.loopNavigation ? 0 : suggestions.value.length - 1;
const [suggestion, suggestionList] = getSuggestionContext();
const highlightItem = suggestionList[index];
const scrollTop = suggestion.scrollTop;
const { offsetTop, scrollHeight } = highlightItem;
if (offsetTop + scrollHeight > scrollTop + suggestion.clientHeight) suggestion.scrollTop = offsetTop + scrollHeight - suggestion.clientHeight;
if (offsetTop < scrollTop) suggestion.scrollTop = offsetTop;
highlightedIndex.value = index;
inputRef.value?.ref?.setAttribute("aria-activedescendant", `${listboxId.value}-item-${highlightedIndex.value}`);
};
const getSuggestionContext = () => {
const suggestion = regionRef.value.querySelector(`.${ns.be("suggestion", "wrap")}`);
return [suggestion, suggestion.querySelectorAll(`.${ns.be("suggestion", "list")} li`)];
};
const stopHandle = onClickOutside(listboxRef, (event) => {
if (popperRef.value?.isFocusInsideContent()) return;
const hadIgnoredFocus = ignoreFocusEvent;
ignoreFocusEvent = false;
if (!suggestionVisible.value) return;
if (hadIgnoredFocus) handleBlur(new FocusEvent("blur", event));
else close();
});
const handleKeydown = (e) => {
switch (getEventCode(e)) {
case EVENT_CODE.up:
e.preventDefault();
highlight(highlightedIndex.value - 1);
break;
case EVENT_CODE.down:
e.preventDefault();
highlight(highlightedIndex.value + 1);
break;
case EVENT_CODE.enter:
case EVENT_CODE.numpadEnter:
e.preventDefault();
handleKeyEnter();
break;
case EVENT_CODE.tab:
close();
break;
case EVENT_CODE.esc:
handleKeyEscape(e);
break;
case EVENT_CODE.home:
e.preventDefault();
highlight(0);
break;
case EVENT_CODE.end:
e.preventDefault();
highlight(suggestions.value.length - 1);
break;
case EVENT_CODE.pageUp:
e.preventDefault();
highlight(Math.max(0, highlightedIndex.value - 10));
break;
case EVENT_CODE.pageDown:
e.preventDefault();
highlight(Math.min(suggestions.value.length - 1, highlightedIndex.value + 10));
break;
}
};
onBeforeUnmount(() => {
stopHandle?.();
});
onMounted(() => {
const inputElement = inputRef.value?.ref;
if (!inputElement) return;
[
{
key: "role",
value: "textbox"
},
{
key: "aria-autocomplete",
value: "list"
},
{
key: "aria-controls",
value: listboxId.value
},
{
key: "aria-activedescendant",
value: `${listboxId.value}-item-${highlightedIndex.value}`
}
].forEach(({ key, value }) => inputElement.setAttribute(key, value));
readonly = inputElement.hasAttribute("readonly");
});
__expose({
highlightedIndex,
activated,
loading,
inputRef,
popperRef,
suggestions,
handleSelect,
handleKeyEnter,
focus,
blur,
close,
highlight,
getData
});
return (_ctx, _cache) => {
return openBlock(), createBlock(unref(ElTooltip), {
ref_key: "popperRef",
ref: popperRef,
visible: suggestionVisible.value,
placement: __props.placement,
"fallback-placements": ["bottom-start", "top-start"],
"popper-class": [unref(ns).e("popper"), __props.popperClass],
"popper-style": __props.popperStyle,
teleported: __props.teleported,
"append-to": __props.appendTo,
"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", suggestionLoading.value)]),
style: normalizeStyle({
[__props.fitInputWidth ? "width" : "minWidth"]: dropdownWidth.value,
outline: "none"
}),
role: "region"
}, [
_ctx.$slots.header ? (openBlock(), createElementBlock("div", {
key: 0,
class: normalizeClass(unref(ns).be("suggestion", "header")),
onClick: _cache[0] || (_cache[0] = withModifiers(() => {}, ["stop"]))
}, [renderSlot(_ctx.$slots, "header")], 2)) : createCommentVNode("v-if", true),
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(() => [suggestionLoading.value ? (openBlock(), createElementBlock("li", _hoisted_2, [renderSlot(_ctx.$slots, "loading", {}, () => [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[__props.valueKey]), 1)])], 10, _hoisted_3);
}), 128))]),
_: 3
}, 8, [
"id",
"wrap-class",
"view-class"
]),
_ctx.$slots.footer ? (openBlock(), createElementBlock("div", {
key: 1,
class: normalizeClass(unref(ns).be("suggestion", "footer")),
onClick: _cache[1] || (_cache[1] = withModifiers(() => {}, ["stop"]))
}, [renderSlot(_ctx.$slots, "footer")], 2)) : createCommentVNode("v-if", true)
], 6)]),
default: withCtx(() => [createElementVNode("div", {
ref_key: "listboxRef",
ref: listboxRef,
class: normalizeClass([unref(ns).b(), _ctx.$attrs.class]),
style: normalizeStyle(styles.value),
role: "combobox",
"aria-haspopup": "listbox",
"aria-expanded": suggestionVisible.value,
"aria-owns": unref(listboxId)
}, [createVNode(unref(ElInput), mergeProps({
ref_key: "inputRef",
ref: inputRef
}, mergeProps(passInputProps.value, _ctx.$attrs), {
"model-value": __props.modelValue,
disabled: unref(disabled),
onInput: handleInput,
onChange: handleChange,
onFocus: handleFocus,
onBlur: handleBlur,
onClear: handleClear,
onKeydown: handleKeydown,
onMousedown: handleMouseDown
}), createSlots({ _: 2 }, [
_ctx.$slots.prepend ? {
name: "prepend",
fn: withCtx(() => [renderSlot(_ctx.$slots, "prepend")]),
key: "0"
} : void 0,
_ctx.$slots.append ? {
name: "append",
fn: withCtx(() => [renderSlot(_ctx.$slots, "append")]),
key: "1"
} : void 0,
_ctx.$slots.prefix ? {
name: "prefix",
fn: withCtx(() => [renderSlot(_ctx.$slots, "prefix")]),
key: "2"
} : void 0,
_ctx.$slots.suffix ? {
name: "suffix",
fn: withCtx(() => [renderSlot(_ctx.$slots, "suffix")]),
key: "3"
} : void 0
]), 1040, ["model-value", "disabled"])], 14, _hoisted_1)]),
_: 3
}, 8, [
"visible",
"placement",
"popper-class",
"popper-style",
"teleported",
"append-to",
"transition"
]);
};
}
});
//#endregion
export { autocomplete_vue_vue_type_script_setup_true_lang_default as default };
//# sourceMappingURL=autocomplete.vue_vue_type_script_setup_true_lang.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,8 @@
import autocomplete_vue_vue_type_script_setup_true_lang_default from "./autocomplete.vue_vue_type_script_setup_true_lang.mjs";
//#region ../../packages/components/autocomplete/src/autocomplete.vue
var autocomplete_default = autocomplete_vue_vue_type_script_setup_true_lang_default;
//#endregion
export { autocomplete_default as default };
//# sourceMappingURL=autocomplete2.mjs.map

File diff suppressed because one or more lines are too long

View File

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

View File

@@ -0,0 +1,5 @@
import "../../base/style/index.mjs";
import "../../input/style/index.mjs";
import "../../scrollbar/style/index.mjs";
import "../../popper/style/index.mjs";
import "element-plus/theme-chalk/src/autocomplete.scss";

View File

@@ -0,0 +1,3 @@
import "../../base/style/css.mjs";
import "../../tooltip/style/css.mjs";
import "element-plus/theme-chalk/el-avatar-group.css";

View File

@@ -0,0 +1,3 @@
import "../../base/style/index.mjs";
import "../../tooltip/style/index.mjs";
import "element-plus/theme-chalk/src/avatar-group.scss";

View File

@@ -0,0 +1,16 @@
import { SFCWithInstall } from "../../utils/vue/typescript.js";
import "../../utils/index.js";
import { AvatarEmits, AvatarProps, AvatarPropsPublic, avatarEmits, avatarProps } from "./src/avatar.js";
import { _default } from "./src/avatar.vue.js";
import { _default as _default$1 } from "./src/avatar-group.js";
import { AvatarGroupContext, avatarGroupContextKey } from "./src/constants.js";
import { AvatarGroupProps, AvatarGroupPropsPublic, avatarGroupProps } from "./src/avatar-group-props.js";
import { AvatarGroupInstance, AvatarInstance } from "./src/instance.js";
//#region ../../packages/components/avatar/index.d.ts
declare const ElAvatar: SFCWithInstall<typeof _default> & {
AvatarGroup: typeof _default$1;
};
declare const ElAvatarGroup: SFCWithInstall<typeof _default$1>;
//#endregion
export { AvatarEmits, AvatarGroupContext, type AvatarGroupInstance, AvatarGroupProps, AvatarGroupPropsPublic, type AvatarInstance, AvatarProps, AvatarPropsPublic, ElAvatar, ElAvatar as default, ElAvatarGroup, avatarEmits, avatarGroupContextKey, avatarGroupProps, avatarProps };

View File

@@ -0,0 +1,14 @@
import { withInstall, withNoopInstall } from "../../utils/vue/install.mjs";
import { avatarEmits, avatarProps } from "./src/avatar.mjs";
import { avatarGroupContextKey } from "./src/constants.mjs";
import avatar_default from "./src/avatar2.mjs";
import { avatarGroupProps } from "./src/avatar-group-props.mjs";
import avatar_group_default from "./src/avatar-group.mjs";
//#region ../../packages/components/avatar/index.ts
const ElAvatar = withInstall(avatar_default, { AvatarGroup: avatar_group_default });
const ElAvatarGroup = withNoopInstall(avatar_group_default);
//#endregion
export { ElAvatar, ElAvatar as default, ElAvatarGroup, avatarEmits, avatarGroupContextKey, avatarGroupProps, avatarProps };
//# sourceMappingURL=index.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"index.mjs","names":["Avatar","AvatarGroup"],"sources":["../../../../../packages/components/avatar/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from '@element-plus/utils'\nimport Avatar from './src/avatar.vue'\nimport AvatarGroup from './src/avatar-group'\n\nimport type { SFCWithInstall } from '@element-plus/utils'\n\nexport const ElAvatar: SFCWithInstall<typeof Avatar> & {\n AvatarGroup: typeof AvatarGroup\n} = withInstall(Avatar, {\n AvatarGroup,\n})\nexport const ElAvatarGroup: SFCWithInstall<typeof AvatarGroup> =\n withNoopInstall(AvatarGroup)\nexport default ElAvatar\n\nexport * from './src/avatar'\nexport * from './src/constants'\nexport * from './src/avatar-group-props'\nexport type { AvatarInstance, AvatarGroupInstance } from './src/instance'\n"],"mappings":";;;;;;;;AAMA,MAAa,WAET,YAAYA,gBAAQ,EACtB,mCACD,CAAC;AACF,MAAa,gBACX,gBAAgBC,qBAAY"}

View File

@@ -0,0 +1,183 @@
import { EpPropMergeType } from "../../../utils/vue/props/types.js";
import "../../../utils/index.js";
import { PopperEffect } from "../../popper/src/popper.js";
import { Placement } from "../../popper/index.js";
import * as vue from "vue";
import { ExtractPropTypes, ExtractPublicPropTypes, StyleValue } from "vue";
//#region ../../packages/components/avatar/src/avatar-group-props.d.ts
declare const avatarGroupProps: {
/**
* @description control the size of avatars in this avatar-group
*/
readonly size: {
readonly type: vue.PropType<number | "" | "default" | "small" | "large" | undefined>;
readonly values: readonly ["", "default", "small", "large"];
readonly validator: (val: unknown) => val is number;
};
/**
* @description control the shape of avatars in this avatar-group
*/
readonly shape: {
readonly type: vue.PropType<"square" | "circle" | undefined>;
readonly values: readonly ["circle", "square"];
};
/**
* @description whether to collapse avatars
*/
readonly collapseAvatars: BooleanConstructor;
/**
* @description whether show all collapsed avatars when mouse hover text of the collapse-avatar. To use this, `collapse-avatars` must be true
*/
readonly collapseAvatarsTooltip: BooleanConstructor;
/**
* @description the max avatars number to be shown. To use this, `collapse-avatars` must be true
*/
readonly maxCollapseAvatars: {
readonly type: NumberConstructor;
readonly default: 1;
};
/**
* @description tooltip theme, built-in theme: `dark` / `light`
*/
readonly effect: {
readonly type: vue.PropType<PopperEffect>;
readonly default: "light";
};
/**
* @description placement of tooltip
*/
readonly placement: {
readonly type: vue.PropType<Placement>;
readonly values: Placement[];
readonly default: "top";
};
/**
* @description custom class name for tooltip
*/
readonly popperClass: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (((new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[])) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
/**
* @description custom style for tooltip
*/
readonly popperStyle: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | false | vue.CSSProperties | StyleValue[]) | (() => StyleValue) | (((new (...args: any[]) => string | false | vue.CSSProperties | StyleValue[]) | (() => StyleValue)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
/**
* @description custom class name for the collapse-avatar
*/
readonly collapseClass: StringConstructor;
/**
* @description custom style for the collapse-avatar
*/
readonly collapseStyle: {
readonly type: vue.PropType<StyleValue>;
};
};
type AvatarGroupProps = ExtractPropTypes<typeof avatarGroupProps>;
type AvatarGroupPropsPublic = ExtractPublicPropTypes<typeof avatarGroupProps>;
//#endregion
export { AvatarGroupProps, AvatarGroupPropsPublic, avatarGroupProps };

View File

@@ -0,0 +1,45 @@
import { componentSizes } from "../../../constants/size.mjs";
import { isNumber } from "../../../utils/types.mjs";
import { definePropType } from "../../../utils/vue/props/runtime.mjs";
import { useTooltipContentProps } from "../../tooltip/src/content.mjs";
import { placements } from "@popperjs/core";
//#region ../../packages/components/avatar/src/avatar-group-props.ts
const avatarGroupProps = {
size: {
type: definePropType([Number, String]),
values: componentSizes,
validator: (val) => isNumber(val)
},
shape: {
type: definePropType(String),
values: ["circle", "square"]
},
collapseAvatars: Boolean,
collapseAvatarsTooltip: Boolean,
maxCollapseAvatars: {
type: Number,
default: 1
},
effect: {
type: definePropType(String),
default: "light"
},
placement: {
type: definePropType(String),
values: placements,
default: "top"
},
popperClass: useTooltipContentProps.popperClass,
popperStyle: useTooltipContentProps.popperStyle,
collapseClass: String,
collapseStyle: { type: definePropType([
String,
Array,
Object
]) }
};
//#endregion
export { avatarGroupProps };
//# sourceMappingURL=avatar-group-props.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"avatar-group-props.mjs","names":[],"sources":["../../../../../../packages/components/avatar/src/avatar-group-props.ts"],"sourcesContent":["import { placements } from '@popperjs/core'\nimport { useTooltipContentProps } from '@element-plus/components/tooltip'\nimport { definePropType, isNumber } from '@element-plus/utils'\nimport { componentSizes } from '@element-plus/constants'\n\nimport type { AvatarProps } from './avatar'\nimport type { ExtractPropTypes, ExtractPublicPropTypes, StyleValue } from 'vue'\nimport type { Placement, PopperEffect } from '@element-plus/components/popper'\n\nexport const avatarGroupProps = {\n /**\n * @description control the size of avatars in this avatar-group\n */\n size: {\n type: definePropType<AvatarProps['size']>([Number, String]),\n values: componentSizes,\n validator: (val: unknown): val is number => isNumber(val),\n },\n /**\n * @description control the shape of avatars in this avatar-group\n */\n shape: {\n type: definePropType<AvatarProps['shape']>(String),\n values: ['circle', 'square'] as const,\n },\n /**\n * @description whether to collapse avatars\n */\n collapseAvatars: Boolean,\n /**\n * @description whether show all collapsed avatars when mouse hover text of the collapse-avatar. To use this, `collapse-avatars` must be true\n */\n collapseAvatarsTooltip: Boolean,\n /**\n * @description the max avatars number to be shown. To use this, `collapse-avatars` must be true\n */\n maxCollapseAvatars: {\n type: Number,\n default: 1,\n },\n /**\n * @description tooltip theme, built-in theme: `dark` / `light`\n */\n effect: {\n type: definePropType<PopperEffect>(String),\n default: 'light',\n },\n /**\n * @description placement of tooltip\n */\n placement: {\n type: definePropType<Placement>(String),\n values: placements,\n default: 'top',\n },\n /**\n * @description custom class name for tooltip\n */\n popperClass: useTooltipContentProps.popperClass,\n /**\n * @description custom style for tooltip\n */\n popperStyle: useTooltipContentProps.popperStyle,\n /**\n * @description custom class name for the collapse-avatar\n */\n collapseClass: String,\n /**\n * @description custom style for the collapse-avatar\n */\n collapseStyle: {\n type: definePropType<StyleValue>([String, Array, Object]),\n },\n} as const\nexport type AvatarGroupProps = ExtractPropTypes<typeof avatarGroupProps>\nexport type AvatarGroupPropsPublic = ExtractPublicPropTypes<\n typeof avatarGroupProps\n>\n"],"mappings":";;;;;;;AASA,MAAa,mBAAmB;CAI9B,MAAM;EACJ,MAAM,eAAoC,CAAC,QAAQ,OAAO,CAAC;EAC3D,QAAQ;EACR,YAAY,QAAgC,SAAS,IAAI;EAC1D;CAID,OAAO;EACL,MAAM,eAAqC,OAAO;EAClD,QAAQ,CAAC,UAAU,SAAS;EAC7B;CAID,iBAAiB;CAIjB,wBAAwB;CAIxB,oBAAoB;EAClB,MAAM;EACN,SAAS;EACV;CAID,QAAQ;EACN,MAAM,eAA6B,OAAO;EAC1C,SAAS;EACV;CAID,WAAW;EACT,MAAM,eAA0B,OAAO;EACvC,QAAQ;EACR,SAAS;EACV;CAID,aAAa,uBAAuB;CAIpC,aAAa,uBAAuB;CAIpC,eAAe;CAIf,eAAe,EACb,MAAM,eAA2B;EAAC;EAAQ;EAAO;EAAO,CAAC,EAC1D;CACF"}

View File

@@ -0,0 +1,292 @@
import { EpPropMergeType } from "../../../utils/vue/props/types.js";
import "../../../utils/index.js";
import { PopperEffect } from "../../popper/src/popper.js";
import "../../../index.js";
import { Placement } from "../../popper/index.js";
import * as vue from "vue";
import * as vue_jsx_runtime0 from "vue/jsx-runtime";
//#region ../../packages/components/avatar/src/avatar-group.d.ts
declare const _default: vue.DefineComponent<vue.ExtractPropTypes<{
readonly size: {
readonly type: vue.PropType<number | "" | "default" | "small" | "large" | undefined>;
readonly values: readonly ["", "default", "small", "large"];
readonly validator: (val: unknown) => val is number;
};
readonly shape: {
readonly type: vue.PropType<"square" | "circle" | undefined>;
readonly values: readonly ["circle", "square"];
};
readonly collapseAvatars: BooleanConstructor;
readonly collapseAvatarsTooltip: BooleanConstructor;
readonly maxCollapseAvatars: {
readonly type: NumberConstructor;
readonly default: 1;
};
readonly effect: {
readonly type: vue.PropType<PopperEffect>;
readonly default: "light";
};
readonly placement: {
readonly type: vue.PropType<Placement>;
readonly values: Placement[];
readonly default: "top";
};
readonly popperClass: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (((new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[])) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly popperStyle: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | false | vue.CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue) | (((new (...args: any[]) => string | false | vue.CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly collapseClass: StringConstructor;
readonly collapseStyle: {
readonly type: vue.PropType<vue.StyleValue>;
};
}>, () => vue_jsx_runtime0.JSX.Element, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<vue.ExtractPropTypes<{
readonly size: {
readonly type: vue.PropType<number | "" | "default" | "small" | "large" | undefined>;
readonly values: readonly ["", "default", "small", "large"];
readonly validator: (val: unknown) => val is number;
};
readonly shape: {
readonly type: vue.PropType<"square" | "circle" | undefined>;
readonly values: readonly ["circle", "square"];
};
readonly collapseAvatars: BooleanConstructor;
readonly collapseAvatarsTooltip: BooleanConstructor;
readonly maxCollapseAvatars: {
readonly type: NumberConstructor;
readonly default: 1;
};
readonly effect: {
readonly type: vue.PropType<PopperEffect>;
readonly default: "light";
};
readonly placement: {
readonly type: vue.PropType<Placement>;
readonly values: Placement[];
readonly default: "top";
};
readonly popperClass: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (((new (...args: any[]) => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[]) | (() => string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | (string | {
[x: string]: boolean;
} | any)[])[])[])[])[])[])[])[])[])[])[])) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly popperStyle: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => string | false | vue.CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue) | (((new (...args: any[]) => string | false | vue.CSSProperties | vue.StyleValue[]) | (() => vue.StyleValue)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly collapseClass: StringConstructor;
readonly collapseStyle: {
readonly type: vue.PropType<vue.StyleValue>;
};
}>> & Readonly<{}>, {
readonly effect: PopperEffect;
readonly placement: Placement;
readonly collapseAvatars: boolean;
readonly collapseAvatarsTooltip: boolean;
readonly maxCollapseAvatars: number;
}, {}, {}, {}, string, vue.ComponentProvideOptions, true, {}, any>;
//#endregion
export { _default };

View File

@@ -0,0 +1,48 @@
import { flattedChildren } from "../../../utils/vue/vnode.mjs";
import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
import { ElTooltip } from "../../tooltip/index.mjs";
import { avatarGroupContextKey } from "./constants.mjs";
import avatar_default from "./avatar2.mjs";
import { avatarGroupProps } from "./avatar-group-props.mjs";
import { cloneVNode, createTextVNode, createVNode, defineComponent, isVNode, provide, reactive, toRef } from "vue";
//#region ../../packages/components/avatar/src/avatar-group.tsx
var avatar_group_default = /* @__PURE__ */ defineComponent({
name: "ElAvatarGroup",
props: avatarGroupProps,
setup(props, { slots }) {
const ns = useNamespace("avatar-group");
provide(avatarGroupContextKey, reactive({
size: toRef(props, "size"),
shape: toRef(props, "shape")
}));
return () => {
const avatars = flattedChildren(slots.default?.() ?? []);
let visibleAvatars = avatars;
if (props.collapseAvatars && avatars.length > props.maxCollapseAvatars) {
visibleAvatars = avatars.slice(0, props.maxCollapseAvatars);
const hiddenAvatars = avatars.slice(props.maxCollapseAvatars);
visibleAvatars.push(createVNode(ElTooltip, {
"popperClass": props.popperClass,
"popperStyle": props.popperStyle,
"placement": props.placement,
"effect": props.effect,
"disabled": !props.collapseAvatarsTooltip
}, {
default: () => createVNode(avatar_default, {
"size": props.size,
"shape": props.shape,
"class": props.collapseClass,
"style": props.collapseStyle
}, { default: () => [createTextVNode("+ "), hiddenAvatars.length] }),
content: () => createVNode("div", { "class": ns.e("collapse-avatars") }, [hiddenAvatars.map((node, idx) => isVNode(node) ? cloneVNode(node, { key: node.key ?? idx }) : node)])
}));
}
return createVNode("div", { "class": ns.b() }, [visibleAvatars]);
};
}
});
//#endregion
export { avatar_group_default as default };
//# sourceMappingURL=avatar-group.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"avatar-group.mjs","names":["cloneVNode","defineComponent","isVNode","provide","reactive","toRef","createTextVNode","_createTextVNode","createVNode","_createVNode","flattedChildren","ElTooltip","useNamespace","ElAvatar","avatarGroupContextKey","avatarGroupProps","name","props","setup","slots","ns","size","shape","avatars","default","visibleAvatars","showCollapseAvatar","collapseAvatars","length","maxCollapseAvatars","slice","hiddenAvatars","push","popperClass","popperStyle","placement","effect","collapseAvatarsTooltip","collapseClass","collapseStyle","content","e","map","node","idx","key","b"],"sources":["../../../../../../packages/components/avatar/src/avatar-group.tsx"],"sourcesContent":["import {\n cloneVNode,\n defineComponent,\n isVNode,\n provide,\n reactive,\n toRef,\n} from 'vue'\nimport { flattedChildren } from '@element-plus/utils'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport { useNamespace } from '@element-plus/hooks'\nimport ElAvatar from './avatar.vue'\nimport { avatarGroupContextKey } from './constants'\nimport { avatarGroupProps } from './avatar-group-props'\n\nexport default defineComponent({\n name: 'ElAvatarGroup',\n props: avatarGroupProps,\n setup(props, { slots }) {\n const ns = useNamespace('avatar-group')\n\n provide(\n avatarGroupContextKey,\n reactive({\n size: toRef(props, 'size'),\n shape: toRef(props, 'shape'),\n })\n )\n\n return () => {\n const avatars = flattedChildren(slots.default?.() ?? [])\n let visibleAvatars = avatars\n\n const showCollapseAvatar =\n props.collapseAvatars && avatars.length > props.maxCollapseAvatars\n\n if (showCollapseAvatar) {\n visibleAvatars = avatars.slice(0, props.maxCollapseAvatars)\n const hiddenAvatars = avatars.slice(props.maxCollapseAvatars)\n\n visibleAvatars.push(\n <ElTooltip\n popperClass={props.popperClass}\n popperStyle={props.popperStyle}\n placement={props.placement}\n effect={props.effect}\n disabled={!props.collapseAvatarsTooltip}\n >\n {{\n default: () => (\n <ElAvatar\n size={props.size}\n shape={props.shape}\n class={props.collapseClass}\n style={props.collapseStyle}\n >\n + {hiddenAvatars.length}\n </ElAvatar>\n ),\n content: () => (\n <div class={ns.e('collapse-avatars')}>\n {hiddenAvatars.map((node, idx) =>\n isVNode(node)\n ? cloneVNode(node, { key: node.key ?? idx })\n : node\n )}\n </div>\n ),\n }}\n </ElTooltip>\n )\n }\n\n return <div class={ns.b()}>{visibleAvatars}</div>\n }\n },\n})\n"],"mappings":";;;;;;;;;AAeA,2BAAeC,gCAAgB;CAC7Be,MAAM;CACNC,OAAOF;CACPG,MAAMD,OAAO,EAAEE,SAAS;EACtB,MAAMC,KAAKR,aAAa,eAAe;AAEvCT,UACEW,uBACAV,SAAS;GACPiB,MAAMhB,MAAMY,OAAO,OAAO;GAC1BK,OAAOjB,MAAMY,OAAO,QAAO;GAC5B,CACH,CAAC;AAED,eAAa;GACX,MAAMM,UAAUb,gBAAgBS,MAAMK,WAAW,IAAI,EAAE,CAAC;GACxD,IAAIC,iBAAiBF;AAKrB,OAFEN,MAAMU,mBAAmBJ,QAAQK,SAASX,MAAMY,oBAE1B;AACtBJ,qBAAiBF,QAAQO,MAAM,GAAGb,MAAMY,mBAAmB;IAC3D,MAAME,gBAAgBR,QAAQO,MAAMb,MAAMY,mBAAmB;AAE7DJ,mBAAeO,KAAIvB,YAAAE,WAAA;KAAA,eAEFM,MAAMgB;KAAW,eACjBhB,MAAMiB;KAAW,aACnBjB,MAAMkB;KAAS,UAClBlB,MAAMmB;KAAM,YACV,CAACnB,MAAMoB;KAAsB,EAAA;KAGrCb,eAASf,YAAAI,gBAAA;MAAA,QAECI,MAAMI;MAAI,SACTJ,MAAMK;MAAK,SACXL,MAAMqB;MAAa,SACnBrB,MAAMsB;MAAa,EAAA,EAAAf,eAAA,CAAAjB,gBAAA,KAAA,EAEvBwB,cAAcH,OAAM,EAAA,CAE1B;KACDY,eAAS/B,YAAA,OAAA,EAAA,SACKW,GAAGqB,EAAE,mBAAkB,EAAC,EAAA,CACjCV,cAAcW,KAAKC,MAAMC,QACxB1C,QAAQyC,KAAK,GACT3C,WAAW2C,MAAM,EAAEE,KAAKF,KAAKE,OAAOD,KAAK,CAAC,GAC1CD,KACL,CAAA,CAAA;KAEJ,CAGP,CAAC;;AAGH,UAAAlC,YAAA,OAAA,EAAA,SAAmBW,GAAG0B,GAAE,EAAC,EAAA,CAAGrB,eAAc,CAAA;;;CAG/C,CAAC"}

View File

@@ -0,0 +1,77 @@
import { IconPropType } from "../../../utils/vue/icon.js";
import { EpPropFinalized, EpPropMergeType } from "../../../utils/vue/props/types.js";
import { ComponentSize } from "../../../constants/size.js";
import { ObjectFit } from "../../../utils/typescript.js";
import "../../../utils/index.js";
import * as vue from "vue";
import { ExtractPublicPropTypes } from "vue";
import * as csstype from "csstype";
//#region ../../packages/components/avatar/src/avatar.d.ts
interface AvatarProps {
/**
* @description avatar size.
*/
size?: number | ComponentSize;
/**
* @description avatar shape.
*/
shape?: 'circle' | 'square';
/**
* @description representation type to icon, more info on icon component.
*/
icon?: IconPropType;
/**
* @description the source of the image for an image avatar.
*/
src?: string;
/**
* @description native attribute `alt` of image avatar.
*/
alt?: string;
/**
* @description native attribute srcset of image avatar.
*/
srcSet?: string;
/**
* @description set how the image fit its container for an image avatar.
*/
fit?: ObjectFit;
}
/**
* @deprecated Removed after 3.0.0, Use `AvatarProps` instead.
*/
declare const avatarProps: {
readonly size: {
readonly type: vue.PropType<EpPropMergeType<readonly [NumberConstructor, StringConstructor], "" | "default" | "small" | "large", number>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly shape: {
readonly type: vue.PropType<EpPropMergeType<StringConstructor, "square" | "circle", unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly icon: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component) | (((new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly src: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly alt: StringConstructor;
readonly srcSet: StringConstructor;
readonly fit: EpPropFinalized<(new (...args: any[]) => "fill" | "-moz-initial" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "none" | "contain" | "cover" | "scale-down") | (() => csstype.Property.ObjectFit | undefined) | (((new (...args: any[]) => "fill" | "-moz-initial" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | "none" | "contain" | "cover" | "scale-down") | (() => csstype.Property.ObjectFit | undefined)) | null)[], unknown, unknown, "cover", boolean>;
};
/**
* @deprecated Removed after 3.0.0, Use `AvatarProps` instead.
*/
type AvatarPropsPublic = ExtractPublicPropTypes<typeof avatarProps>;
declare const avatarEmits: {
error: (evt: Event) => boolean;
};
type AvatarEmits = typeof avatarEmits;
//#endregion
export { AvatarEmits, AvatarProps, AvatarPropsPublic, avatarEmits, avatarProps };

View File

@@ -0,0 +1,36 @@
import { componentSizes } from "../../../constants/size.mjs";
import { isNumber } from "../../../utils/types.mjs";
import { buildProps, definePropType } from "../../../utils/vue/props/runtime.mjs";
import { iconPropType } from "../../../utils/vue/icon.mjs";
//#region ../../packages/components/avatar/src/avatar.ts
/**
* @deprecated Removed after 3.0.0, Use `AvatarProps` instead.
*/
const avatarProps = buildProps({
size: {
type: [Number, String],
values: componentSizes,
validator: (val) => isNumber(val)
},
shape: {
type: String,
values: ["circle", "square"]
},
icon: { type: iconPropType },
src: {
type: String,
default: ""
},
alt: String,
srcSet: String,
fit: {
type: definePropType(String),
default: "cover"
}
});
const avatarEmits = { error: (evt) => evt instanceof Event };
//#endregion
export { avatarEmits, avatarProps };
//# sourceMappingURL=avatar.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"avatar.mjs","names":[],"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'\n\nimport type { ExtractPublicPropTypes } from 'vue'\nimport type { ComponentSize } from '@element-plus/constants'\nimport type { IconPropType, ObjectFit } from '@element-plus/utils'\n\nexport interface AvatarProps {\n /**\n * @description avatar size.\n */\n size?: number | ComponentSize\n /**\n * @description avatar shape.\n */\n shape?: 'circle' | 'square'\n /**\n * @description representation type to icon, more info on icon component.\n */\n icon?: IconPropType\n /**\n * @description the source of the image for an image avatar.\n */\n src?: string\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?: ObjectFit\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `AvatarProps` instead.\n */\nexport const avatarProps = buildProps({\n /**\n * @description avatar size.\n */\n size: {\n type: [Number, String],\n values: componentSizes,\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 },\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<ObjectFit>(String),\n default: 'cover',\n },\n} as const)\n\n/**\n * @deprecated Removed after 3.0.0, Use `AvatarProps` instead.\n */\nexport type AvatarPropsPublic = ExtractPublicPropTypes<typeof avatarProps>\n\nexport const avatarEmits = {\n error: (evt: Event) => evt instanceof Event,\n}\nexport type AvatarEmits = typeof avatarEmits\n"],"mappings":";;;;;;;;;AA8CA,MAAa,cAAc,WAAW;CAIpC,MAAM;EACJ,MAAM,CAAC,QAAQ,OAAO;EACtB,QAAQ;EACR,YAAY,QAAgC,SAAS,IAAI;EAC1D;CAID,OAAO;EACL,MAAM;EACN,QAAQ,CAAC,UAAU,SAAS;EAC7B;CAID,MAAM,EACJ,MAAM,cACP;CAID,KAAK;EACH,MAAM;EACN,SAAS;EACV;CAID,KAAK;CAIL,QAAQ;CAIR,KAAK;EACH,MAAM,eAA0B,OAAO;EACvC,SAAS;EACV;CACF,CAAU;AAOX,MAAa,cAAc,EACzB,QAAQ,QAAe,eAAe,OACvC"}

View File

@@ -0,0 +1,26 @@
import { AvatarProps } from "./avatar.js";
import * as vue from "vue";
import * as csstype from "csstype";
//#region ../../packages/components/avatar/src/avatar.vue.d.ts
declare var __VLS_12: {};
type __VLS_Slots = {} & {
default?: (props: typeof __VLS_12) => any;
};
declare const __VLS_base: vue.DefineComponent<AvatarProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
error: (evt: Event) => void;
}, string, vue.PublicProps, Readonly<AvatarProps> & Readonly<{
onError?: ((evt: Event) => any) | undefined;
}>, {
src: string;
fit: csstype.Property.ObjectFit;
}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
declare const _default: typeof __VLS_export;
type __VLS_WithSlots<T, S> = T & {
new (): {
$slots: S;
};
};
//#endregion
export { _default };

View File

@@ -0,0 +1,66 @@
import { isNumber, isString } from "../../../utils/types.mjs";
import { addUnit } from "../../../utils/dom/style.mjs";
import { useNamespace } from "../../../hooks/use-namespace/index.mjs";
import { ElIcon } from "../../icon/index.mjs";
import { avatarEmits, avatarProps } from "./avatar.mjs";
import { avatarGroupContextKey } from "./constants.mjs";
import { computed, createBlock, createElementBlock, defineComponent, inject, normalizeClass, normalizeStyle, openBlock, ref, renderSlot, resolveDynamicComponent, unref, watch, withCtx } from "vue";
//#region ../../packages/components/avatar/src/avatar.vue?vue&type=script&setup=true&lang.ts
const _hoisted_1 = [
"src",
"alt",
"srcset"
];
var avatar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
name: "ElAvatar",
__name: "avatar",
props: avatarProps,
emits: avatarEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const avatarGroupContext = inject(avatarGroupContextKey, void 0);
const ns = useNamespace("avatar");
const hasLoadError = ref(false);
const size = computed(() => props.size ?? avatarGroupContext?.size);
const shape = computed(() => props.shape ?? avatarGroupContext?.shape ?? "circle");
const avatarClass = computed(() => {
const { icon } = props;
const classList = [ns.b()];
if (isString(size.value)) classList.push(ns.m(size.value));
if (icon) classList.push(ns.m("icon"));
if (shape.value) classList.push(ns.m(shape.value));
return classList;
});
const sizeStyle = computed(() => {
return isNumber(size.value) ? ns.cssVarBlock({ size: addUnit(size.value) }) : void 0;
});
const fitStyle = computed(() => ({ objectFit: props.fit }));
watch(() => [props.src, props.srcSet], () => hasLoadError.value = false);
function handleError(e) {
hasLoadError.value = true;
emit("error", e);
}
return (_ctx, _cache) => {
return openBlock(), createElementBlock("span", {
class: normalizeClass(avatarClass.value),
style: normalizeStyle(sizeStyle.value)
}, [(__props.src || __props.srcSet) && !hasLoadError.value ? (openBlock(), createElementBlock("img", {
key: 0,
src: __props.src,
alt: __props.alt,
srcset: __props.srcSet,
style: normalizeStyle(fitStyle.value),
onError: handleError
}, null, 44, _hoisted_1)) : __props.icon ? (openBlock(), createBlock(unref(ElIcon), { key: 1 }, {
default: withCtx(() => [(openBlock(), createBlock(resolveDynamicComponent(__props.icon)))]),
_: 1
})) : renderSlot(_ctx.$slots, "default", { key: 2 })], 6);
};
}
});
//#endregion
export { avatar_vue_vue_type_script_setup_true_lang_default as default };
//# sourceMappingURL=avatar.vue_vue_type_script_setup_true_lang.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"avatar.vue_vue_type_script_setup_true_lang.mjs","names":[],"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, inject, 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 } from './avatar'\nimport { avatarGroupContextKey } from './constants'\n\nimport type { AvatarProps } from './avatar'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n name: 'ElAvatar',\n})\n\nconst props = withDefaults(defineProps<AvatarProps>(), {\n src: '',\n fit: 'cover',\n})\n\nconst emit = defineEmits(avatarEmits)\n\nconst avatarGroupContext = inject(avatarGroupContextKey, undefined)\n\nconst ns = useNamespace('avatar')\n\nconst hasLoadError = ref(false)\n\nconst size = computed(() => props.size ?? avatarGroupContext?.size)\nconst shape = computed(\n () => props.shape ?? avatarGroupContext?.shape ?? 'circle'\n)\n\nconst avatarClass = computed(() => {\n const { icon } = props\n const classList = [ns.b()]\n if (isString(size.value)) classList.push(ns.m(size.value))\n if (icon) classList.push(ns.m('icon'))\n if (shape.value) classList.push(ns.m(shape.value))\n return classList\n})\n\nconst sizeStyle = computed(() => {\n return isNumber(size.value)\n ? (ns.cssVarBlock({\n size: addUnit(size.value)!,\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, props.srcSet],\n () => (hasLoadError.value = false)\n)\n\nfunction handleError(e: Event) {\n hasLoadError.value = true\n emit('error', e)\n}\n</script>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;EAgCA,MAAM,QAAQ;EAKd,MAAM,OAAO;EAEb,MAAM,qBAAqB,OAAO,uBAAuB,OAAS;EAElE,MAAM,KAAK,aAAa,SAAQ;EAEhC,MAAM,eAAe,IAAI,MAAK;EAE9B,MAAM,OAAO,eAAe,MAAM,QAAQ,oBAAoB,KAAI;EAClE,MAAM,QAAQ,eACN,MAAM,SAAS,oBAAoB,SAAS,SACpD;EAEA,MAAM,cAAc,eAAe;GACjC,MAAM,EAAE,SAAS;GACjB,MAAM,YAAY,CAAC,GAAG,GAAG,CAAA;AACzB,OAAI,SAAS,KAAK,MAAM,CAAE,WAAU,KAAK,GAAG,EAAE,KAAK,MAAM,CAAA;AACzD,OAAI,KAAM,WAAU,KAAK,GAAG,EAAE,OAAO,CAAA;AACrC,OAAI,MAAM,MAAO,WAAU,KAAK,GAAG,EAAE,MAAM,MAAM,CAAA;AACjD,UAAO;IACR;EAED,MAAM,YAAY,eAAe;AAC/B,UAAO,SAAS,KAAK,MAAK,GACrB,GAAG,YAAY,EACd,MAAM,QAAQ,KAAK,MAAM,EAC1B,CAAC,GACF;IACL;EAED,MAAM,WAAW,gBAA+B,EAC9C,WAAW,MAAM,KAClB,EAAC;AAGF,cACQ,CAAC,MAAM,KAAK,MAAM,OAAO,QACxB,aAAa,QAAQ,MAC9B;EAEA,SAAS,YAAY,GAAU;AAC7B,gBAAa,QAAQ;AACrB,QAAK,SAAS,EAAC;;;uBA9Ef,mBAaO,QAAA;IAbA,OAAK,eAAE,YAAA,MAAW;IAAG,OAAK,eAAE,UAAA,MAAS;QAEjC,QAAA,OAAO,QAAA,WAAM,CAAM,aAAA,sBAD5B,mBAOE,OAAA;;IALC,KAAK,QAAA;IACL,KAAK,QAAA;IACL,QAAQ,QAAA;IACR,OAAK,eAAE,SAAA,MAAQ;IACf,SAAO;+BAEU,QAAA,qBAApB,YAEU,MAAA,OAAA,EAAA,EAAA,KAAA,GAAA,EAAA;2BADgB,eAAxB,YAAwB,wBAAR,QAAA,KAAI,CAAA;;SAEtB,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA"}

View File

@@ -0,0 +1,8 @@
import avatar_vue_vue_type_script_setup_true_lang_default from "./avatar.vue_vue_type_script_setup_true_lang.mjs";
//#region ../../packages/components/avatar/src/avatar.vue
var avatar_default = avatar_vue_vue_type_script_setup_true_lang_default;
//#endregion
export { avatar_default as default };
//# sourceMappingURL=avatar2.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"avatar2.mjs","names":[],"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, inject, 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 } from './avatar'\nimport { avatarGroupContextKey } from './constants'\n\nimport type { AvatarProps } from './avatar'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n name: 'ElAvatar',\n})\n\nconst props = withDefaults(defineProps<AvatarProps>(), {\n src: '',\n fit: 'cover',\n})\n\nconst emit = defineEmits(avatarEmits)\n\nconst avatarGroupContext = inject(avatarGroupContextKey, undefined)\n\nconst ns = useNamespace('avatar')\n\nconst hasLoadError = ref(false)\n\nconst size = computed(() => props.size ?? avatarGroupContext?.size)\nconst shape = computed(\n () => props.shape ?? avatarGroupContext?.shape ?? 'circle'\n)\n\nconst avatarClass = computed(() => {\n const { icon } = props\n const classList = [ns.b()]\n if (isString(size.value)) classList.push(ns.m(size.value))\n if (icon) classList.push(ns.m('icon'))\n if (shape.value) classList.push(ns.m(shape.value))\n return classList\n})\n\nconst sizeStyle = computed(() => {\n return isNumber(size.value)\n ? (ns.cssVarBlock({\n size: addUnit(size.value)!,\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, props.srcSet],\n () => (hasLoadError.value = false)\n)\n\nfunction handleError(e: Event) {\n hasLoadError.value = true\n emit('error', e)\n}\n</script>\n"],"mappings":""}

View File

@@ -0,0 +1,11 @@
import { AvatarProps } from "./avatar.js";
import { InjectionKey } from "vue";
//#region ../../packages/components/avatar/src/constants.d.ts
interface AvatarGroupContext {
size?: AvatarProps['size'];
shape?: AvatarProps['shape'];
}
declare const avatarGroupContextKey: InjectionKey<AvatarGroupContext>;
//#endregion
export { AvatarGroupContext, avatarGroupContextKey };

View File

@@ -0,0 +1,6 @@
//#region ../../packages/components/avatar/src/constants.ts
const avatarGroupContextKey = Symbol("avatarGroupContextKey");
//#endregion
export { avatarGroupContextKey };
//# sourceMappingURL=constants.mjs.map

View File

@@ -0,0 +1 @@
{"version":3,"file":"constants.mjs","names":[],"sources":["../../../../../../packages/components/avatar/src/constants.ts"],"sourcesContent":["import type { InjectionKey } from 'vue'\nimport type { AvatarProps } from './avatar'\n\nexport interface AvatarGroupContext {\n size?: AvatarProps['size']\n shape?: AvatarProps['shape']\n}\n\nexport const avatarGroupContextKey: InjectionKey<AvatarGroupContext> = Symbol(\n 'avatarGroupContextKey'\n)\n"],"mappings":";AAQA,MAAa,wBAA0D,OACrE,wBACD"}

View File

@@ -0,0 +1,8 @@
import { _default } from "./avatar.vue.js";
import { _default as _default$1 } from "./avatar-group.js";
//#region ../../packages/components/avatar/src/instance.d.ts
type AvatarInstance = InstanceType<typeof _default> & unknown;
type AvatarGroupInstance = InstanceType<typeof _default$1> & unknown;
//#endregion
export { AvatarGroupInstance, AvatarInstance };

View File

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

View File

@@ -0,0 +1,2 @@
import "../../base/style/index.mjs";
import "element-plus/theme-chalk/src/avatar.scss";

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