@hbdlzy/ui-core 0.1.4 → 0.1.6

package/dist/ripple/index.d.ts

@@ -0,0 +1,2 @@
+export declare function installRipple(): () => void;
+export declare function uninstallRipple(): void;

package/dist/style.css

@@ -1 +1 @@
-.base-card[data-v-6bfddf1c]{display:flex;flex-direction:column;min-width:0;min-height:0;padding:var(--base-card-padding);border:1px solid var(--base-card-border-color);background:var(--base-card-background-color);box-shadow:0 0 2px 0 var(--base-card-shadow-color);border-radius:var(--base-card-radius)}.base-card__header[data-v-6bfddf1c]{display:flex;align-items:center;justify-content:space-between;gap:var(--base-card-header-gap);margin-bottom:var(--base-card-header-margin-bottom);min-height:24px;flex-wrap:wrap}.base-card__header-left[data-v-6bfddf1c],.base-card__header-right[data-v-6bfddf1c]{display:flex;align-items:center;min-width:0;flex-wrap:wrap}.base-card__header-left[data-v-6bfddf1c]{flex:1 1 auto;gap:var(--base-card-left-gap)}.base-card__header-right[data-v-6bfddf1c]{flex:0 1 auto;justify-content:flex-end;gap:var(--base-card-right-gap)}.base-card__title-wrap[data-v-6bfddf1c]{display:flex;align-items:center;min-width:0}.base-card__title-marker[data-v-6bfddf1c]{width:var(--base-card-marker-width);height:var(--base-card-marker-height);background:var(--base-card-marker-color);border-radius:var(--base-card-marker-radius);margin-right:var(--base-card-marker-gap);flex:0 0 auto}.base-card__title[data-v-6bfddf1c]{margin:0;min-width:0;color:var(--base-card-title-color);font-size:var(--base-card-title-size);font-weight:var(--base-card-title-weight);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.base-card__meta[data-v-6bfddf1c]{color:var(--base-card-meta-color);font-size:var(--base-card-meta-size);line-height:1.4}.base-card__export[data-v-6bfddf1c]{border:none;background:transparent;padding:0;color:var(--base-card-export-color);cursor:pointer;font-size:var(--base-card-meta-size);line-height:1.4}.base-card__export[data-v-6bfddf1c]:disabled{opacity:.5;cursor:not-allowed}.base-card__body[data-v-6bfddf1c]{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}.base-card__tip[data-v-6bfddf1c]{flex:0 0 auto}.base-card__content[data-v-6bfddf1c]{flex:1 1 auto;min-height:0}.base-search-form[data-v-52b1fbc7]{width:100%}.base-search-form__grid[data-v-52b1fbc7]{display:grid;align-items:start}.base-search-form__item[data-v-52b1fbc7]{min-width:0;margin-bottom:0}.base-search-form__control[data-v-52b1fbc7]{width:var(--base-search-form-field-width, 100%)}.base-search-form__actions[data-v-52b1fbc7]{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0}@media (max-width: 960px){.base-search-form__grid[data-v-52b1fbc7]{grid-template-columns:repeat(2,minmax(0,1fr))!important}}@media (max-width: 640px){.base-search-form__grid[data-v-52b1fbc7]{grid-template-columns:minmax(0,1fr)!important}.base-search-form__actions[data-v-52b1fbc7]{justify-content:flex-start;flex-wrap:wrap}}.base-dialog__body[data-v-37bcb779]{min-width:0}.base-dialog__footer[data-v-37bcb779]{display:flex;align-items:center;justify-content:flex-end;gap:8px}.base-table[data-v-7ae8d382]{display:flex;flex-direction:column;height:100%;min-height:0}.base-table__toolbar[data-v-7ae8d382]{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;min-height:32px;flex-wrap:wrap}.base-table__toolbar-left[data-v-7ae8d382]{flex:1 1 auto;min-width:0}.base-table__toolbar-right[data-v-7ae8d382]{flex:0 1 auto}.base-table__actions[data-v-7ae8d382]{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.base-table__header[data-v-7ae8d382]{display:flex;align-items:center;gap:6px;width:100%;min-width:0}.base-table__header-label[data-v-7ae8d382]{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.base-table__header-actions[data-v-7ae8d382]{display:flex;align-items:center;margin-left:auto;flex-shrink:0}.base-table__header-icon[data-v-7ae8d382]{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;border-radius:999px;background:transparent;color:var(--el-text-color-secondary);cursor:pointer;transition:color .2s ease,background-color .2s ease}.base-table__header-icon[data-v-7ae8d382]:hover,.base-table__header-icon.is-active[data-v-7ae8d382]{color:var(--el-color-primary);background:rgba(64,158,255,.12)}.base-table__header-icon-mark[data-v-7ae8d382]{position:relative;display:inline-block;width:14px;height:14px;box-sizing:border-box;border:2px solid currentColor;border-radius:999px}.base-table__header-icon-mark[data-v-7ae8d382]:after{content:"";position:absolute;right:-6px;bottom:-4px;width:7px;height:2px;border-radius:999px;background:currentColor;transform:rotate(45deg);transform-origin:center}.base-table__header-dropdown[data-v-7ae8d382]{display:inline-flex;align-items:center}.base-table__header-search-panel[data-v-7ae8d382]{display:flex;flex-direction:column;gap:12px;padding:8px}[data-v-7ae8d382] .base-table__header-search-menu{padding:0}[data-v-7ae8d382] .base-table__header-search-dropdown{padding:0;border-radius:12px}.base-table__header-search-footer[data-v-7ae8d382]{display:flex;align-items:center;justify-content:space-between}.base-table__link[data-v-7ae8d382]{padding:0;border:none;background:transparent;color:var(--el-color-primary);cursor:pointer}.base-table__text[data-v-7ae8d382]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.base-table__tags[data-v-7ae8d382]{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.base-table__image[data-v-7ae8d382]{border-radius:4px;overflow:hidden}.base-echart[data-v-51bc4772],.base-echart__inner[data-v-51bc4772]{width:100%;height:100%}.outlined-input[data-v-2bf89ccd]{position:relative}.outlined-input__label[data-v-2bf89ccd]{position:absolute;left:-2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-input__label--floating[data-v-2bf89ccd]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-input__label--placeholder[data-v-2bf89ccd]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-input__label--filled[data-v-2bf89ccd]{color:var(--el-text-color-regular)}.outlined-input__suffix-text[data-v-2bf89ccd]{white-space:nowrap}[data-v-2bf89ccd] .outlined-input--bordered .el-input__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}[data-v-2bf89ccd] .outlined-input--bordered .el-input__wrapper.is-focus{border-bottom-color:var(--el-color-primary)}[data-v-2bf89ccd] .outlined-input--bordered .el-textarea__inner{border-width:0 0 1px;border-radius:0;box-shadow:none}[data-v-2bf89ccd] .outlined-input--bordered .el-textarea__inner:focus{border-bottom-color:var(--el-color-primary)}[data-v-2bf89ccd] .outlined-input--textarea-default .el-textarea__inner{min-height:100px!important;max-height:180px}.outlined-select[data-v-7bd2b5f2]{position:relative}.outlined-select__label[data-v-7bd2b5f2]{position:absolute;left:-2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-select__label--floating[data-v-7bd2b5f2]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-select__label--placeholder[data-v-7bd2b5f2]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-select__label--filled[data-v-7bd2b5f2]{color:var(--el-text-color-regular)}[data-v-7bd2b5f2] .outlined-select__control.el-select{width:100%}[data-v-7bd2b5f2] .outlined-select__control .el-select__wrapper{min-height:inherit;height:inherit}[data-v-7bd2b5f2] .outlined-select__control .el-select__tags{padding-top:4px}[data-v-7bd2b5f2] .outlined-select__control .el-select__selection{min-height:inherit}[data-v-7bd2b5f2] .outlined-select--bordered .el-select__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}[data-v-7bd2b5f2] .outlined-select--bordered .el-select__wrapper.is-focused{border-bottom-color:var(--el-color-primary)}.outlined-date-picker[data-v-c95a293c]{position:relative}.outlined-date-picker__label[data-v-c95a293c]{position:absolute;left:-2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-date-picker__label--floating[data-v-c95a293c]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-date-picker__label--placeholder[data-v-c95a293c]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-date-picker__label--filled[data-v-c95a293c]{color:var(--el-text-color-regular)}[data-v-c95a293c] .outlined-date-picker__control.el-date-editor{width:100%}[data-v-c95a293c] .outlined-date-picker__control .el-input__wrapper{position:relative;min-height:inherit;height:inherit}[data-v-c95a293c] .outlined-date-picker__control .el-input__prefix{position:absolute;right:0}[data-v-c95a293c] .outlined-date-picker__control .el-input__suffix{position:absolute;right:30px}[data-v-c95a293c] .outlined-date-picker--bordered .el-input__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}[data-v-c95a293c] .outlined-date-picker--bordered .el-input__wrapper.is-focus{border-bottom-color:var(--el-color-primary)}.outlined-date-time-picker[data-v-f2fefd22]{display:flex;align-items:center;gap:8px}.outlined-date-time-picker__field[data-v-f2fefd22]{position:relative;flex:1}.outlined-date-time-picker__separator[data-v-f2fefd22]{flex:0 0 auto;color:var(--el-text-color-regular)}.outlined-date-time-picker__label[data-v-f2fefd22]{position:absolute;left:-2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-date-time-picker__label--floating[data-v-f2fefd22]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-date-time-picker__label--placeholder[data-v-f2fefd22]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-date-time-picker__label--filled[data-v-f2fefd22]{color:var(--el-text-color-regular)}[data-v-f2fefd22] .outlined-date-time-picker__control.el-date-editor{width:100%}[data-v-f2fefd22] .outlined-date-time-picker__control .el-input__wrapper{position:relative;min-height:inherit;height:inherit}[data-v-f2fefd22] .outlined-date-time-picker__control .el-input__prefix{position:absolute;right:0}[data-v-f2fefd22] .outlined-date-time-picker__control .el-input__suffix{position:absolute;right:30px}[data-v-f2fefd22] .outlined-date-time-picker__field--bordered .el-input__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}[data-v-f2fefd22] .outlined-date-time-picker__field--bordered .el-input__wrapper.is-focus{border-bottom-color:var(--el-color-primary)}.outlined-time-picker[data-v-6a467b88]{position:relative}.outlined-time-picker__label[data-v-6a467b88]{position:absolute;left:-2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-time-picker__label--floating[data-v-6a467b88]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-time-picker__label--placeholder[data-v-6a467b88]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-time-picker__label--filled[data-v-6a467b88]{color:var(--el-text-color-regular)}[data-v-6a467b88] .outlined-time-picker__control.el-date-editor{width:100%}[data-v-6a467b88] .outlined-time-picker__control .el-input__wrapper{position:relative;min-height:inherit;height:inherit}[data-v-6a467b88] .outlined-time-picker__control .el-input__prefix{position:absolute;right:0}[data-v-6a467b88] .outlined-time-picker__control .el-input__suffix{position:absolute;right:30px}[data-v-6a467b88] .outlined-time-picker--bordered .el-input__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}[data-v-6a467b88] .outlined-time-picker--bordered .el-input__wrapper.is-focus{border-bottom-color:var(--el-color-primary)}.outlined-cascader[data-v-2c93c0e4]{position:relative}.outlined-cascader__label[data-v-2c93c0e4]{position:absolute;left:-2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-cascader__label--floating[data-v-2c93c0e4]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-cascader__label--placeholder[data-v-2c93c0e4]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-cascader__label--filled[data-v-2c93c0e4]{color:var(--el-text-color-regular)}[data-v-2c93c0e4] .outlined-cascader__control .el-input{height:100%}[data-v-2c93c0e4] .outlined-cascader--bordered .el-input__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}[data-v-2c93c0e4] .outlined-cascader--bordered .el-input__wrapper.is-focus{border-bottom-color:var(--el-color-primary)}.outlined-tree-select[data-v-8403e6ea]{position:relative}.outlined-tree-select__label[data-v-8403e6ea]{position:absolute;left:-2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-tree-select__label--floating[data-v-8403e6ea]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-tree-select__label--placeholder[data-v-8403e6ea]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-tree-select__label--filled[data-v-8403e6ea]{color:var(--el-text-color-regular)}[data-v-8403e6ea] .outlined-tree-select__control.el-select{width:100%}[data-v-8403e6ea] .outlined-tree-select__control .el-select__wrapper{min-height:inherit;height:inherit}[data-v-8403e6ea] .outlined-tree-select__control .el-select__selection{min-height:inherit}[data-v-8403e6ea] .outlined-tree-select__control .el-select__tags{padding-top:4px}[data-v-8403e6ea] .outlined-tree-select--bordered .el-select__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}[data-v-8403e6ea] .outlined-tree-select--bordered .el-select__wrapper.is-focused{border-bottom-color:var(--el-color-primary)}
+.base-card[data-v-6bfddf1c]{display:flex;flex-direction:column;min-width:0;min-height:0;padding:var(--base-card-padding);border:1px solid var(--base-card-border-color);background:var(--base-card-background-color);box-shadow:0 0 2px 0 var(--base-card-shadow-color);border-radius:var(--base-card-radius)}.base-card__header[data-v-6bfddf1c]{display:flex;align-items:center;justify-content:space-between;gap:var(--base-card-header-gap);margin-bottom:var(--base-card-header-margin-bottom);min-height:24px;flex-wrap:wrap}.base-card__header-left[data-v-6bfddf1c],.base-card__header-right[data-v-6bfddf1c]{display:flex;align-items:center;min-width:0;flex-wrap:wrap}.base-card__header-left[data-v-6bfddf1c]{flex:1 1 auto;gap:var(--base-card-left-gap)}.base-card__header-right[data-v-6bfddf1c]{flex:0 1 auto;justify-content:flex-end;gap:var(--base-card-right-gap)}.base-card__title-wrap[data-v-6bfddf1c]{display:flex;align-items:center;min-width:0}.base-card__title-marker[data-v-6bfddf1c]{width:var(--base-card-marker-width);height:var(--base-card-marker-height);background:var(--base-card-marker-color);border-radius:var(--base-card-marker-radius);margin-right:var(--base-card-marker-gap);flex:0 0 auto}.base-card__title[data-v-6bfddf1c]{margin:0;min-width:0;color:var(--base-card-title-color);font-size:var(--base-card-title-size);font-weight:var(--base-card-title-weight);line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.base-card__meta[data-v-6bfddf1c]{color:var(--base-card-meta-color);font-size:var(--base-card-meta-size);line-height:1.4}.base-card__export[data-v-6bfddf1c]{border:none;background:transparent;padding:0;color:var(--base-card-export-color);cursor:pointer;font-size:var(--base-card-meta-size);line-height:1.4}.base-card__export[data-v-6bfddf1c]:disabled{opacity:.5;cursor:not-allowed}.base-card__body[data-v-6bfddf1c]{display:flex;flex:1 1 auto;flex-direction:column;min-height:0}.base-card__tip[data-v-6bfddf1c]{flex:0 0 auto}.base-card__content[data-v-6bfddf1c]{flex:1 1 auto;min-height:0}.base-table[data-v-7ae8d382]{display:flex;flex-direction:column;height:100%;min-height:0}.base-table__toolbar[data-v-7ae8d382]{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px;min-height:32px;flex-wrap:wrap}.base-table__toolbar-left[data-v-7ae8d382]{flex:1 1 auto;min-width:0}.base-table__toolbar-right[data-v-7ae8d382]{flex:0 1 auto}.base-table__actions[data-v-7ae8d382]{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.base-table__header[data-v-7ae8d382]{display:flex;align-items:center;gap:6px;width:100%;min-width:0}.base-table__header-label[data-v-7ae8d382]{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.base-table__header-actions[data-v-7ae8d382]{display:flex;align-items:center;margin-left:auto;flex-shrink:0}.base-table__header-icon[data-v-7ae8d382]{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:none;border-radius:999px;background:transparent;color:var(--el-text-color-secondary);cursor:pointer;transition:color .2s ease,background-color .2s ease}.base-table__header-icon[data-v-7ae8d382]:hover,.base-table__header-icon.is-active[data-v-7ae8d382]{color:var(--el-color-primary);background:rgba(64,158,255,.12)}.base-table__header-icon-mark[data-v-7ae8d382]{position:relative;display:inline-block;width:14px;height:14px;box-sizing:border-box;border:2px solid currentColor;border-radius:999px}.base-table__header-icon-mark[data-v-7ae8d382]:after{content:"";position:absolute;right:-6px;bottom:-4px;width:7px;height:2px;border-radius:999px;background:currentColor;transform:rotate(45deg);transform-origin:center}.base-table__header-dropdown[data-v-7ae8d382]{display:inline-flex;align-items:center}.base-table__header-search-panel[data-v-7ae8d382]{display:flex;flex-direction:column;gap:12px;padding:8px}[data-v-7ae8d382] .base-table__header-search-menu{padding:0}[data-v-7ae8d382] .base-table__header-search-dropdown{padding:0;border-radius:12px}.base-table__header-search-footer[data-v-7ae8d382]{display:flex;align-items:center;justify-content:space-between}.base-table__link[data-v-7ae8d382]{padding:0;border:none;background:transparent;color:var(--el-color-primary);cursor:pointer}.base-table__text[data-v-7ae8d382]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.base-table__tags[data-v-7ae8d382]{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.base-table__image[data-v-7ae8d382]{border-radius:4px;overflow:hidden}.base-echart[data-v-51bc4772],.base-echart__inner[data-v-51bc4772]{width:100%;height:100%}.outlined-input[data-v-3c232c9a]{position:relative}.outlined-input__label[data-v-3c232c9a]{position:absolute;left:-2px;display:inline-flex;align-items:center;gap:2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-input__label--floating[data-v-3c232c9a]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-input__label--placeholder[data-v-3c232c9a]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-input__label--filled[data-v-3c232c9a]{color:var(--el-text-color-regular)}.outlined-input--error[data-v-3c232c9a]{--el-input-focus-border-color: var(--el-color-danger);--el-input-hover-border-color: var(--el-color-danger)}.outlined-input__required[data-v-3c232c9a],.outlined-input--error .outlined-input__label[data-v-3c232c9a],.outlined-input__error[data-v-3c232c9a]{color:var(--el-color-danger)}.outlined-input__error[data-v-3c232c9a]{margin:6px 0 0;font-size:12px;line-height:1.2}.outlined-input__suffix-text[data-v-3c232c9a]{white-space:nowrap}.outlined-input--bordered[data-v-3c232c9a] .el-input__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}.outlined-input--bordered[data-v-3c232c9a] .el-input__wrapper.is-focus{border-bottom-color:var(--el-color-primary)}.outlined-input--bordered[data-v-3c232c9a] .el-textarea__inner{border-width:0 0 1px;border-radius:0;box-shadow:none}.outlined-input--bordered[data-v-3c232c9a] .el-textarea__inner:focus{border-bottom-color:var(--el-color-primary)}.outlined-input--textarea-default[data-v-3c232c9a] .el-textarea__inner{min-height:100px!important;max-height:180px}.outlined-input--error[data-v-3c232c9a] .el-input__wrapper,.outlined-input--error[data-v-3c232c9a] .el-input__wrapper.is-focus,.outlined-input--error[data-v-3c232c9a] .el-input__wrapper:hover,.outlined-input--error[data-v-3c232c9a] .el-textarea__inner{box-shadow:0 0 0 1px var(--el-color-danger) inset}.outlined-input--error[data-v-3c232c9a] .el-textarea__inner:focus,.outlined-input--error[data-v-3c232c9a] .el-textarea__inner:hover{box-shadow:0 0 0 1px var(--el-color-danger) inset}.outlined-input--error.outlined-input--bordered[data-v-3c232c9a] .el-input__wrapper,.outlined-input--error.outlined-input--bordered[data-v-3c232c9a] .el-textarea__inner{box-shadow:0 0 0 1px var(--el-color-danger) inset;border-bottom-color:transparent}.outlined-select[data-v-2a354461]{position:relative}.outlined-select__label[data-v-2a354461]{position:absolute;left:-2px;display:inline-flex;align-items:center;gap:2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-select__label--floating[data-v-2a354461]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-select__label--placeholder[data-v-2a354461]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-select__label--filled[data-v-2a354461]{color:var(--el-text-color-regular)}.outlined-select--error[data-v-2a354461]{--el-input-focus-border-color: var(--el-color-danger);--el-input-hover-border-color: var(--el-color-danger)}.outlined-select__required[data-v-2a354461],.outlined-select--error .outlined-select__label[data-v-2a354461],.outlined-select__error[data-v-2a354461]{color:var(--el-color-danger)}.outlined-select__error[data-v-2a354461]{margin:6px 0 0;font-size:12px;line-height:1.2}[data-v-2a354461] .outlined-select__control.el-select{width:100%}[data-v-2a354461] .outlined-select__control .el-select__wrapper{min-height:inherit;height:inherit}[data-v-2a354461] .outlined-select__control .el-select__tags{padding-top:4px}[data-v-2a354461] .outlined-select__control .el-select__selection{min-height:inherit}.outlined-select--bordered[data-v-2a354461] .el-select__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}.outlined-select--bordered[data-v-2a354461] .el-select__wrapper.is-focused{border-bottom-color:var(--el-color-primary)}.outlined-select--error[data-v-2a354461] .el-select__wrapper,.outlined-select--error[data-v-2a354461] .el-select__wrapper.is-focused,.outlined-select--error[data-v-2a354461] .el-select__wrapper.is-focus,.outlined-select--error[data-v-2a354461] .el-select__wrapper:hover{box-shadow:0 0 0 1px var(--el-color-danger) inset}.outlined-select--error.outlined-select--bordered[data-v-2a354461] .el-select__wrapper{box-shadow:0 0 0 1px var(--el-color-danger) inset;border-bottom-color:transparent}.outlined-date-picker[data-v-47219caf]{position:relative}.outlined-date-picker__label[data-v-47219caf]{position:absolute;left:-2px;display:inline-flex;align-items:center;gap:2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-date-picker__label--floating[data-v-47219caf]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-date-picker__label--placeholder[data-v-47219caf]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-date-picker__label--filled[data-v-47219caf]{color:var(--el-text-color-regular)}.outlined-date-picker--error[data-v-47219caf]{--el-input-focus-border-color: var(--el-color-danger);--el-input-hover-border-color: var(--el-color-danger)}.outlined-date-picker__required[data-v-47219caf],.outlined-date-picker--error .outlined-date-picker__label[data-v-47219caf],.outlined-date-picker__error[data-v-47219caf]{color:var(--el-color-danger)}.outlined-date-picker__error[data-v-47219caf]{margin:6px 0 0;font-size:12px;line-height:1.2}[data-v-47219caf] .outlined-date-picker__control.el-date-editor{width:100%}[data-v-47219caf] .outlined-date-picker__control .el-input__wrapper{position:relative;min-height:inherit;height:inherit}[data-v-47219caf] .outlined-date-picker__control .el-input__prefix{position:absolute;right:0}[data-v-47219caf] .outlined-date-picker__control .el-input__suffix{position:absolute;right:30px}.outlined-date-picker--bordered[data-v-47219caf] .el-input__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}.outlined-date-picker--bordered[data-v-47219caf] .el-input__wrapper.is-focus{border-bottom-color:var(--el-color-primary)}.outlined-date-picker--error[data-v-47219caf] .el-input__wrapper,.outlined-date-picker--error[data-v-47219caf] .el-input__wrapper.is-focus,.outlined-date-picker--error[data-v-47219caf] .el-input__wrapper:hover{box-shadow:0 0 0 1px var(--el-color-danger) inset}.outlined-date-picker--error.outlined-date-picker--bordered[data-v-47219caf] .el-input__wrapper{box-shadow:0 0 0 1px var(--el-color-danger) inset;border-bottom-color:transparent}.outlined-date-time-picker[data-v-ee2ef524]{position:relative}.outlined-date-time-picker__inner[data-v-ee2ef524]{display:flex;align-items:center;gap:8px}.outlined-date-time-picker__field[data-v-ee2ef524]{position:relative;flex:1}.outlined-date-time-picker__separator[data-v-ee2ef524]{flex:0 0 auto;color:var(--el-text-color-regular)}.outlined-date-time-picker__label[data-v-ee2ef524]{position:absolute;left:-2px;display:inline-flex;align-items:center;gap:2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-date-time-picker__label--floating[data-v-ee2ef524]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-date-time-picker__label--placeholder[data-v-ee2ef524]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-date-time-picker__label--filled[data-v-ee2ef524]{color:var(--el-text-color-regular)}.outlined-date-time-picker--error[data-v-ee2ef524]{--el-input-focus-border-color: var(--el-color-danger);--el-input-hover-border-color: var(--el-color-danger)}.outlined-date-time-picker__required[data-v-ee2ef524],.outlined-date-time-picker--error .outlined-date-time-picker__label[data-v-ee2ef524],.outlined-date-time-picker__error[data-v-ee2ef524]{color:var(--el-color-danger)}.outlined-date-time-picker__error[data-v-ee2ef524]{margin:6px 0 0;font-size:12px;line-height:1.2}[data-v-ee2ef524] .outlined-date-time-picker__control.el-date-editor{width:100%}[data-v-ee2ef524] .outlined-date-time-picker__control .el-input__wrapper{position:relative;min-height:inherit;height:inherit}[data-v-ee2ef524] .outlined-date-time-picker__control .el-input__prefix{position:absolute;right:0}[data-v-ee2ef524] .outlined-date-time-picker__control .el-input__suffix{position:absolute;right:30px}.outlined-date-time-picker__field--bordered[data-v-ee2ef524] .el-input__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}.outlined-date-time-picker__field--bordered[data-v-ee2ef524] .el-input__wrapper.is-focus{border-bottom-color:var(--el-color-primary)}.outlined-date-time-picker__field--error[data-v-ee2ef524] .el-input__wrapper,.outlined-date-time-picker__field--error[data-v-ee2ef524] .el-input__wrapper.is-focus,.outlined-date-time-picker__field--error[data-v-ee2ef524] .el-input__wrapper:hover{box-shadow:0 0 0 1px var(--el-color-danger) inset}.outlined-date-time-picker__field--error.outlined-date-time-picker__field--bordered[data-v-ee2ef524] .el-input__wrapper{box-shadow:0 0 0 1px var(--el-color-danger) inset;border-bottom-color:transparent}.outlined-time-picker[data-v-0257087e]{position:relative}.outlined-time-picker__label[data-v-0257087e]{position:absolute;left:-2px;display:inline-flex;align-items:center;gap:2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-time-picker__label--floating[data-v-0257087e]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-time-picker__label--placeholder[data-v-0257087e]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-time-picker__label--filled[data-v-0257087e]{color:var(--el-text-color-regular)}.outlined-time-picker--error[data-v-0257087e]{--el-input-focus-border-color: var(--el-color-danger);--el-input-hover-border-color: var(--el-color-danger)}.outlined-time-picker__required[data-v-0257087e],.outlined-time-picker--error .outlined-time-picker__label[data-v-0257087e],.outlined-time-picker__error[data-v-0257087e]{color:var(--el-color-danger)}.outlined-time-picker__error[data-v-0257087e]{margin:6px 0 0;font-size:12px;line-height:1.2}[data-v-0257087e] .outlined-time-picker__control.el-date-editor{width:100%}[data-v-0257087e] .outlined-time-picker__control .el-input__wrapper{position:relative;min-height:inherit;height:inherit}[data-v-0257087e] .outlined-time-picker__control .el-input__prefix{position:absolute;right:0}[data-v-0257087e] .outlined-time-picker__control .el-input__suffix{position:absolute;right:30px}.outlined-time-picker--bordered[data-v-0257087e] .el-input__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}.outlined-time-picker--bordered[data-v-0257087e] .el-input__wrapper.is-focus{border-bottom-color:var(--el-color-primary)}.outlined-time-picker--error[data-v-0257087e] .el-input__wrapper,.outlined-time-picker--error[data-v-0257087e] .el-input__wrapper.is-focus,.outlined-time-picker--error[data-v-0257087e] .el-input__wrapper:hover{box-shadow:0 0 0 1px var(--el-color-danger) inset}.outlined-time-picker--error.outlined-time-picker--bordered[data-v-0257087e] .el-input__wrapper{box-shadow:0 0 0 1px var(--el-color-danger) inset;border-bottom-color:transparent}.outlined-cascader[data-v-033e3fab]{position:relative}.outlined-cascader__label[data-v-033e3fab]{position:absolute;left:-2px;display:inline-flex;align-items:center;gap:2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-cascader__label--floating[data-v-033e3fab]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-cascader__label--placeholder[data-v-033e3fab]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-cascader__label--filled[data-v-033e3fab]{color:var(--el-text-color-regular)}.outlined-cascader--error[data-v-033e3fab]{--el-input-focus-border-color: var(--el-color-danger);--el-input-hover-border-color: var(--el-color-danger)}.outlined-cascader__required[data-v-033e3fab],.outlined-cascader--error .outlined-cascader__label[data-v-033e3fab],.outlined-cascader__error[data-v-033e3fab]{color:var(--el-color-danger)}.outlined-cascader__error[data-v-033e3fab]{margin:6px 0 0;font-size:12px;line-height:1.2}[data-v-033e3fab] .outlined-cascader__control .el-input{height:100%}.outlined-cascader--bordered[data-v-033e3fab] .el-input__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}.outlined-cascader--bordered[data-v-033e3fab] .el-input__wrapper.is-focus{border-bottom-color:var(--el-color-primary)}.outlined-cascader--error[data-v-033e3fab] .el-input__wrapper,.outlined-cascader--error[data-v-033e3fab] .el-input.is-focus .el-input__wrapper,.outlined-cascader--error[data-v-033e3fab] .el-input__wrapper:hover{box-shadow:0 0 0 1px var(--el-color-danger) inset}.outlined-cascader--error.outlined-cascader--bordered[data-v-033e3fab] .el-input__wrapper{box-shadow:0 0 0 1px var(--el-color-danger) inset;border-bottom-color:transparent}.outlined-tree-select[data-v-30d7dee0]{position:relative}.outlined-tree-select__label[data-v-30d7dee0]{position:absolute;left:-2px;display:inline-flex;align-items:center;gap:2px;padding:2px 5px;border-radius:2px;background-color:#fff;font-size:12px;line-height:1;transition:color .2s cubic-bezier(0,0,.2,1),transform .2s cubic-bezier(0,0,.2,1);pointer-events:none}.outlined-tree-select__label--floating[data-v-30d7dee0]{top:18px;z-index:1;opacity:1;transform:translate(14px,-6px) scale(1);color:var(--el-color-primary)}.outlined-tree-select__label--placeholder[data-v-30d7dee0]{top:50%;left:1px;z-index:-1;opacity:0;transform:translate(14px,6px) scale(1)}.outlined-tree-select__label--filled[data-v-30d7dee0]{color:var(--el-text-color-regular)}.outlined-tree-select--error[data-v-30d7dee0]{--el-input-focus-border-color: var(--el-color-danger);--el-input-hover-border-color: var(--el-color-danger)}.outlined-tree-select__required[data-v-30d7dee0],.outlined-tree-select--error .outlined-tree-select__label[data-v-30d7dee0],.outlined-tree-select__error[data-v-30d7dee0]{color:var(--el-color-danger)}.outlined-tree-select__error[data-v-30d7dee0]{margin:6px 0 0;font-size:12px;line-height:1.2}[data-v-30d7dee0] .outlined-tree-select__control.el-select{width:100%}[data-v-30d7dee0] .outlined-tree-select__control .el-select__wrapper{min-height:inherit;height:inherit}[data-v-30d7dee0] .outlined-tree-select__control .el-select__selection{min-height:inherit}[data-v-30d7dee0] .outlined-tree-select__control .el-select__tags{padding-top:4px}.outlined-tree-select--bordered[data-v-30d7dee0] .el-select__wrapper{box-shadow:none;border-radius:0;border-bottom:1px solid #cccccc}.outlined-tree-select--bordered[data-v-30d7dee0] .el-select__wrapper.is-focused{border-bottom-color:var(--el-color-primary)}.outlined-tree-select--error[data-v-30d7dee0] .el-select__wrapper,.outlined-tree-select--error[data-v-30d7dee0] .el-select__wrapper.is-focused,.outlined-tree-select--error[data-v-30d7dee0] .el-select__wrapper.is-focus,.outlined-tree-select--error[data-v-30d7dee0] .el-select__wrapper:hover{box-shadow:0 0 0 1px var(--el-color-danger) inset}.outlined-tree-select--error.outlined-tree-select--bordered[data-v-30d7dee0] .el-select__wrapper{box-shadow:0 0 0 1px var(--el-color-danger) inset;border-bottom-color:transparent}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hbdlzy/ui-core",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "Company shared Vue UI core package.",
   "license": "MIT",
   "repository": {
@@ -22,8 +22,6 @@
   "files": [
     "dist",
     "src",
-    "!src/**/*.test.ts",
-    "!src/**/*.spec.ts",
     "README.md",
     "components.manifest.json"
   ],
@@ -39,7 +37,11 @@
   },
   "sideEffects": [
     "**/*.css",
-    "**/*.vue"
+    "**/*.vue",
+    "dist/index.js",
+    "dist/index.cjs",
+    "src/index.ts",
+    "src/ripple/index.ts"
   ],
   "publishConfig": {
     "access": "public",

package/src/components/BaseExportButton/BaseExportButton.vue

@@ -18,7 +18,7 @@
 import { computed, ref } from 'vue'
 import type { PropType } from 'vue'
 import { ElMessage } from 'element-plus'
-import type { ExcelExportOptions } from '../../excel/exportExcel'
+import { exportExcel, type ExcelExportOptions } from '../../excel/exportExcel'
 import { downloadExportResponse, normalizeExportFileName } from './BaseExportButton.utils'
 import type {
   ExportBeforeHandler,
@@ -140,8 +140,6 @@ async function handleExport() {
 
   try {
     if (exportMode.value === 'excel' && props.excelOptions) {
-      const { exportExcel } = await import('../../excel/exportExcel')
-
       await exportExcel(props.excelOptions)
 
       if (props.autoMessage) {

package/src/components/BaseTable/BaseTable.types.ts

@@ -105,7 +105,7 @@ export interface BaseTableNormalizedResult<Row = Record<string, any>> {
 
 export type BaseTableRequestHandler<Row = Record<string, any>> = (
   params: BaseTableRequestParams
-) => Promise<BaseTableRequestResult<Row> | Row[] | unknown>
+) => Promise<BaseTableRequestResult<Row> | Row[]>
 
 export type BaseTableResultAdapter<Row = Record<string, any>> = (
   result: unknown,

package/src/components/OutlinedCascader/OutlinedCascader.types.ts

@@ -17,6 +17,9 @@ export interface OutlinedCascaderProps {
   levels?: boolean
   marginBottom?: OutlinedCascaderCssValue
   paddingTop?: OutlinedCascaderCssValue
+  required?: boolean
+  error?: boolean
+  errorMessage?: string
 }
 
 export interface OutlinedCascaderExpose {

package/src/components/OutlinedCascader/OutlinedCascader.vue

@@ -12,12 +12,13 @@
       :options="options"
       :props="propsValue"
       :clearable="clearable"
-      :placeholder="placeholder"
+      :placeholder="controlPlaceholder"
       :filterable="filterable"
       :show-all-levels="levels"
       :disabled="disabled"
       :popper-class="popperClass"
       :style="cascaderStyle"
+      :aria-invalid="hasError ? 'true' : undefined"
       @update:model-value="handleModelValueUpdate"
       @focus="handleFocus"
       @blur="handleBlur"
@@ -30,8 +31,19 @@
       class="outlined-cascader__label"
       :class="labelClasses"
     >
-      {{ floatingLabel }}
+      <span
+        v-if="required"
+        class="outlined-cascader__required"
+      >*</span>
+      <span>{{ floatingLabel }}</span>
     </div>
+
+    <p
+      v-if="hasError"
+      class="outlined-cascader__error"
+    >
+      {{ resolvedErrorMessage }}
+    </p>
   </div>
 </template>
 
@@ -63,7 +75,10 @@ const props = withDefaults(defineProps<OutlinedCascaderProps>(), {
   filterable: true,
   levels: true,
   marginBottom: 20,
-  paddingTop: 20
+  paddingTop: 20,
+  required: false,
+  error: false,
+  errorMessage: ''
 })
 
 const emit = defineEmits<{
@@ -99,7 +114,8 @@ const cascaderAttrs = computed(() => {
 })
 
 const containerClasses = computed(() => ({
-  'outlined-cascader--bordered': props.isBorder
+  'outlined-cascader--bordered': props.isBorder,
+  'outlined-cascader--error': hasError.value
 }))
 
 const containerStyle = computed(() => ({
@@ -113,6 +129,9 @@ const cascaderStyle = computed(() => ({
 }))
 
 const floatingLabel = computed(() => props.label || props.placeholder || '')
+const controlPlaceholder = computed(() => addRequiredMark(props.placeholder))
+const hasError = computed(() => Boolean(props.error))
+const resolvedErrorMessage = computed(() => props.errorMessage || createRequiredMessage(floatingLabel.value))
 
 const hasContent = computed(() => cascaderValue.value.length > 0)
 
@@ -178,6 +197,18 @@ function toCssValue(value: OutlinedCascaderCssValue | undefined) {
   return value
 }
 
+function addRequiredMark(value: string) {
+  if (!props.required || !value || value.startsWith('*')) {
+    return value
+  }
+
+  return `*${value}`
+}
+
+function createRequiredMessage(label: string) {
+  return label ? `${label}为必填项` : '该项为必填项'
+}
+
 defineExpose<OutlinedCascaderExpose>({
   focus: () => {
     cascaderRef.value?.togglePopperVisible?.(true)
@@ -205,6 +236,9 @@ defineExpose<OutlinedCascaderExpose>({
 .outlined-cascader__label {
   position: absolute;
   left: -2px;
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
   padding: 2px 5px;
   border-radius: 2px;
   background-color: #ffffff;
@@ -234,17 +268,48 @@ defineExpose<OutlinedCascaderExpose>({
   color: var(--el-text-color-regular);
 }
 
+.outlined-cascader--error {
+  --el-input-focus-border-color: var(--el-color-danger);
+  --el-input-hover-border-color: var(--el-color-danger);
+}
+
+.outlined-cascader__required,
+.outlined-cascader--error .outlined-cascader__label,
+.outlined-cascader__error {
+  color: var(--el-color-danger);
+}
+
+.outlined-cascader__error {
+  margin: 6px 0 0;
+  font-size: 12px;
+  line-height: 1.2;
+}
+
 :deep(.outlined-cascader__control .el-input) {
   height: 100%;
 }
 
-:deep(.outlined-cascader--bordered .el-input__wrapper) {
+.outlined-cascader--bordered :deep(.el-input__wrapper) {
   box-shadow: none;
   border-radius: 0;
   border-bottom: 1px solid #cccccc;
 }
 
-:deep(.outlined-cascader--bordered .el-input__wrapper.is-focus) {
+.outlined-cascader--bordered :deep(.el-input__wrapper.is-focus) {
   border-bottom-color: var(--el-color-primary);
 }
+
+.outlined-cascader--error :deep(.el-input__wrapper) {
+  box-shadow: 0 0 0 1px var(--el-color-danger) inset;
+}
+
+.outlined-cascader--error :deep(.el-input.is-focus .el-input__wrapper),
+.outlined-cascader--error :deep(.el-input__wrapper:hover) {
+  box-shadow: 0 0 0 1px var(--el-color-danger) inset;
+}
+
+.outlined-cascader--error.outlined-cascader--bordered :deep(.el-input__wrapper) {
+  box-shadow: 0 0 0 1px var(--el-color-danger) inset;
+  border-bottom-color: transparent;
+}
 </style>

package/src/components/OutlinedCascader/README.md

@@ -54,6 +54,9 @@ const areaOptions = [
 | `propsValue` | `Record<string, unknown>` | `undefined` | 透传给 `el-cascader` 的 `props` |
 | `placeholder` | `string` | `''` | 占位文案，也会作为浮动标签文案 |
 | `label` | `string` | `''` | 自定义浮动标签文案，优先级高于 `placeholder` |
+| `required` | `boolean` | `false` | 是否显示必填星号 |
+| `error` | `boolean` | `false` | 是否显示错误态，开启后级联框变红并展示错误文案 |
+| `errorMessage` | `string` | `''` | 错误文案，未传时默认使用“字段名为必填项” |
 | `popperClass` | `string` | `''` | 自定义弹层类名 |
 | `disabled` | `boolean` | `false` | 是否禁用 |
 | `inputHeight` | `number` | `40` | 输入框高度 |

package/src/components/OutlinedDatePicker/OutlinedDatePicker.types.ts

@@ -29,6 +29,9 @@ export interface OutlinedDatePickerProps {
   disabledDate?: OutlinedDatePickerDisabledDate
   marginBottom?: OutlinedDatePickerCssValue
   paddingTop?: OutlinedDatePickerCssValue
+  required?: boolean
+  error?: boolean
+  errorMessage?: string
 }
 
 export interface OutlinedDatePickerExpose {

package/src/components/OutlinedDatePicker/OutlinedDatePicker.vue

@@ -12,9 +12,10 @@
       :type="typeDate"
       :format="format"
       :value-format="resolvedValueFormat"
-      :placeholder="placeholder"
+      :placeholder="controlPlaceholder"
       :disabled="disabled"
       :style="pickerStyle"
+      :aria-invalid="hasError ? 'true' : undefined"
       @update:model-value="handleModelValueUpdate"
       @focus="handleFocus"
       @blur="handleBlur"
@@ -27,8 +28,19 @@
       class="outlined-date-picker__label"
       :class="labelClasses"
     >
-      {{ floatingLabel }}
+      <span
+        v-if="required"
+        class="outlined-date-picker__required"
+      >*</span>
+      <span>{{ floatingLabel }}</span>
     </div>
+
+    <p
+      v-if="hasError"
+      class="outlined-date-picker__error"
+    >
+      {{ resolvedErrorMessage }}
+    </p>
   </div>
 </template>
 
@@ -62,7 +74,10 @@ const props = withDefaults(defineProps<OutlinedDatePickerProps>(), {
   isBorder: false,
   disabledDate: undefined,
   marginBottom: 20,
-  paddingTop: 20
+  paddingTop: 20,
+  required: false,
+  error: false,
+  errorMessage: ''
 })
 
 const emit = defineEmits<{
@@ -159,7 +174,8 @@ const pickerAttrs = computed(() => {
 })
 
 const containerClasses = computed(() => ({
-  'outlined-date-picker--bordered': props.isBorder
+  'outlined-date-picker--bordered': props.isBorder,
+  'outlined-date-picker--error': hasError.value
 }))
 
 const containerStyle = computed(() => ({
@@ -172,6 +188,9 @@ const pickerStyle = computed(() => ({
 }))
 
 const floatingLabel = computed(() => props.label || props.placeholder || '')
+const controlPlaceholder = computed(() => addRequiredMark(props.placeholder))
+const hasError = computed(() => Boolean(props.error))
+const resolvedErrorMessage = computed(() => props.errorMessage || createRequiredMessage(floatingLabel.value))
 
 const hasContent = computed(() => hasFilledValue(pickerValue.value))
 
@@ -279,6 +298,18 @@ function toCssValue(value: OutlinedDatePickerCssValue | undefined) {
   return value
 }
 
+function addRequiredMark(value: string) {
+  if (!props.required || !value || value.startsWith('*')) {
+    return value
+  }
+
+  return `*${value}`
+}
+
+function createRequiredMessage(label: string) {
+  return label ? `${label}为必填项` : '该项为必填项'
+}
+
 defineExpose<OutlinedDatePickerExpose>({
   focus: () => {
     pickerRef.value?.focus?.()
@@ -304,6 +335,9 @@ defineExpose<OutlinedDatePickerExpose>({
 .outlined-date-picker__label {
   position: absolute;
   left: -2px;
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
   padding: 2px 5px;
   border-radius: 2px;
   background-color: #ffffff;
@@ -333,6 +367,23 @@ defineExpose<OutlinedDatePickerExpose>({
   color: var(--el-text-color-regular);
 }
 
+.outlined-date-picker--error {
+  --el-input-focus-border-color: var(--el-color-danger);
+  --el-input-hover-border-color: var(--el-color-danger);
+}
+
+.outlined-date-picker__required,
+.outlined-date-picker--error .outlined-date-picker__label,
+.outlined-date-picker__error {
+  color: var(--el-color-danger);
+}
+
+.outlined-date-picker__error {
+  margin: 6px 0 0;
+  font-size: 12px;
+  line-height: 1.2;
+}
+
 :deep(.outlined-date-picker__control.el-date-editor) {
   width: 100%;
 }
@@ -353,13 +404,27 @@ defineExpose<OutlinedDatePickerExpose>({
   right: 30px;
 }
 
-:deep(.outlined-date-picker--bordered .el-input__wrapper) {
+.outlined-date-picker--bordered :deep(.el-input__wrapper) {
   box-shadow: none;
   border-radius: 0;
   border-bottom: 1px solid #cccccc;
 }
 
-:deep(.outlined-date-picker--bordered .el-input__wrapper.is-focus) {
+.outlined-date-picker--bordered :deep(.el-input__wrapper.is-focus) {
   border-bottom-color: var(--el-color-primary);
 }
+
+.outlined-date-picker--error :deep(.el-input__wrapper) {
+  box-shadow: 0 0 0 1px var(--el-color-danger) inset;
+}
+
+.outlined-date-picker--error :deep(.el-input__wrapper.is-focus),
+.outlined-date-picker--error :deep(.el-input__wrapper:hover) {
+  box-shadow: 0 0 0 1px var(--el-color-danger) inset;
+}
+
+.outlined-date-picker--error.outlined-date-picker--bordered :deep(.el-input__wrapper) {
+  box-shadow: 0 0 0 1px var(--el-color-danger) inset;
+  border-bottom-color: transparent;
+}
 </style>

package/src/components/OutlinedDatePicker/README.md

@@ -97,6 +97,9 @@ const form = reactive({
 - `value`: 当前值，推荐通过 `v-model:value` 使用
 - `placeholder`: 占位文案，同时默认作为浮动标签文案
 - `label`: 自定义浮动标签文案，未传时回退到 `placeholder`
+- `required`: 是否显示必填星号，默认 `false`
+- `error`: 是否显示错误态，开启后日期框变红并展示错误文案
+- `errorMessage`: 错误文案，未传时默认使用“字段名为必填项”
 - `disabled`: 是否禁用
 - `timeValue`: 是否按带时间场景处理默认时间
 - `typeDate`: 日期控件类型，默认 `date`

package/src/components/OutlinedDateTimePicker/OutlinedDateTimePicker.types.ts

@@ -20,6 +20,9 @@ export interface OutlinedDateTimePickerProps {
   clearable?: boolean
   marginBottom?: OutlinedDateTimePickerCssValue
   paddingTop?: OutlinedDateTimePickerCssValue
+  required?: boolean
+  error?: boolean
+  errorMessage?: string
 }
 
 export interface OutlinedDateTimePickerExpose {