x-next 1.6.0 → 1.7.0

package/dist/style/image.css

@@ -1 +1 @@
-.x-image{position:relative;display:inline-block;border-radius:8px}.x-image--img{max-width:100%;vertical-align:middle;border-radius:inherit}.x-image--overlay{position:absolute;top:0;left:0;width:100%;height:100%}.x-image--footer{display:flex;width:100%;max-width:100%}.x-image--footer--caption{flex:1 1 auto}.x-image--footer--caption-title{font-weight:600;font-size:18px;line-height:var(--x-line-height-base)}.x-image--footer--caption-description{font-size:14px;line-height:var(--x-line-height-base)}.x-image--footer--extra{flex:0 0 auto;padding-left:12px}.x-image--with-footer-inner .x-image--footer{position:absolute;bottom:0;left:0;align-items:center;box-sizing:border-box;padding:10px 12px;color:var(--x-image-color-footer-inner-text);background:var(--x-image-color-footer-inner-bg);border-bottom-right-radius:8px;border-bottom-left-radius:8px;pointer-events:none}.x-image--with-footer-inner .x-image--footer--extra{pointer-events:auto}.x-image--with-footer-inner .x-image--footer--caption-title{color:var(--x-image-color-title-footer-inner-text)}.x-image--with-footer-inner .x-image--footer--caption-description{color:var(--x-image-color-description-footer-inner-text)}.x-image--with-footer-outer .x-image--footer{margin-top:20px;color:var(--x-image-color-footer-outer-text)}.x-image--with-footer-outer .x-image--footer--caption-title{color:var(--x-image-color-title-footer-outer-text)}.x-image--with-footer-outer .x-image--footer--caption-description{color:var(--x-image-color-description-footer-outer-text)}.x-image--error{display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:100%;color:var(--x-image-color-error-text);background-color:var(--x-image-color-error-bg)}.x-image--error-icon{width:24px;max-width:100%;height:24px;max-height:100%}.x-image--error-icon>svg{width:100%;height:100%}.x-image--error-alt{padding:8px 16px;font-size:12px;line-height:1.5;text-align:center}.x-image--loader{position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--x-image-color-loader-bg)}.x-image--loader-spin{position:absolute;top:50%;left:50%;color:var(--x-image-color-loader-spin-text);font-size:16px;text-align:center;transform:translate(-50%, -50%)}.x-image--loader-spin-text{color:var(--x-image-color-loader-spin-text);font-size:12px}.x-image--simple.x-image--with-footer-inner .x-image--footer{padding:12px 16px}.x-image--loading .x-image--img,.x-image--loading-error .x-image--img{visibility:hidden}.x-image-preview{position:fixed;top:0;left:0;z-index:1000;width:100%;height:100%}.x-image-preview-hide{display:none}.x-image-preview .x-image-preview--mask,.x-image-preview .x-image-preview--wrapper{position:absolute;top:0;left:0;width:100%;height:100%}.x-image-preview--mask{background-color:var(--x-image-preview-color-mask-bg)}.x-image-preview--img-container{width:100%;height:100%;text-align:center}.x-image-preview--img-container::before{display:inline-block;width:0;height:100%;vertical-align:middle;content:""}.x-image-preview--img-container .x-image-preview--img{display:inline-block;max-width:100%;max-height:100%;vertical-align:middle;cursor:grab;user-select:none}.x-image-preview--img-container .x-image-preview--img.x-image-preview-img-moving{cursor:grabbing}.x-image-preview--scale-value{box-sizing:border-box;padding:10px 12px;color:var(--x-image-preview-color-scale-value-text);font-size:14px;line-height:initial;background-color:var(--x-image-preview-color-scale-value-bg);position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.x-image-preview--toolbar{position:absolute;bottom:46px;left:50%;display:flex;align-items:flex-start;padding:4px 16px;background-color:var(--x-image-preview-color-toolbar-bg);border-radius:5px;transform:translateX(-50%)}.x-image-preview .x-image-preview--toolbar-action{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:40px;height:40px;padding:0;color:var(--x-image-preview-color-action-text);font-size:14px;appearance:none;background-color:var(--x-color-transparent);border:0;border-radius:2px;cursor:pointer}.x-image-preview .x-image-preview--toolbar-action:not(:last-of-type){margin-right:10px}.x-image-preview .x-image-preview--toolbar-action:hover,.x-image-preview .x-image-preview--toolbar-action:focus-visible{color:var(--x-image-preview-color-action-hover-text);background-color:var(--x-image-preview-color-action-hover-bg)}.x-image-preview .x-image-preview--toolbar-action-disabled,.x-image-preview .x-image-preview--toolbar-action-disabled:hover,.x-image-preview .x-image-preview--toolbar-action-disabled:focus-visible{color:var(--x-image-preview-color-action-disabled-text);background-color:var(--x-image-preview-color-action-disabled-bg);cursor:not-allowed}.x-image-preview .x-image-preview--toolbar-action--name{padding-right:8px;font-size:12px}.x-image-preview .x-image-preview--toolbar-action--content{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:100%;padding:0;line-height:1}.x-image-preview .x-image-preview--toolbar-action--content>svg{width:1em;height:1em}.x-image-preview--loading{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:40px;height:40px;padding:8px;color:var(--x-image-preview-color-loading-text);font-size:16px;background-color:var(--x-image-preview-color-loading-bg);border-radius:8px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.x-image-preview--close-btn{position:absolute;top:10px;right:10px;display:flex;align-items:center;justify-content:center;width:30px;height:30px;color:var(--x-image-preview-color-close-btn-text);font-size:18px;line-height:30px;text-align:center;appearance:none;background:var(--x-image-preview-color-close-btn-bg);border:0;border-radius:50%;cursor:pointer}.x-image-preview--arrow--left{position:absolute;top:50%;left:15px;z-index:2;display:flex;align-items:center;justify-content:center;width:30px;height:30px;color:var(--x-image-preview-arrow-color-icon);appearance:none;background-color:var(--x-image-preview-arrow-color-bg);border:0;border-radius:50%;cursor:pointer;transform:translateY(-50%)}.x-image-preview--arrow--left>svg{color:var(--x-image-preview-arrow-color-icon);font-size:20px}.x-image-preview--arrow--left:hover{background-color:var(--x-image-preview-arrow-color-bg-hover)}.x-image-preview--arrow--right{position:absolute;top:50%;right:15px;z-index:2;display:flex;align-items:center;justify-content:center;width:30px;height:30px;color:var(--x-image-preview-arrow-color-icon);appearance:none;background-color:var(--x-image-preview-arrow-color-bg);border:0;border-radius:50%;cursor:pointer;transform:translateY(-50%)}.x-image-preview--arrow--right>svg{color:var(--x-image-preview-arrow-color-icon);font-size:20px}.x-image-preview--arrow--right:hover{background-color:var(--x-image-preview-arrow-color-bg-hover)}.x-image-preview--arrow-disabled,.x-image-preview--arrow-disabled:hover{color:var(--x-image-preview-arrow-color-icon-disabled);background-color:var(--x-image-preview-arrow-color-bg-disabled);cursor:not-allowed}.x-image-preview--arrow-disabled>svg{color:var(--x-image-preview-arrow-color-icon-disabled)}.image-fade-enter-from,.image-fade-leave-to{opacity:0}.image-fade-enter-to,.image-fade-leave-from{opacity:1}.image-fade-enter-active{transition:opacity .4s cubic-bezier(0.3, 1.3, 0.3, 1)}.image-fade-leave-active{transition:opacity .4s cubic-bezier(0.3, 1.3, 0.3, 1)}
+.x-image{position:relative;display:inline-block;max-width:100%;border-radius:8px}.x-image--img{display:block;max-width:100%;vertical-align:middle;border-radius:inherit}.x-image--img[role=button]{cursor:zoom-in}.x-image--img:focus-visible{outline:2px solid var(--x-color-border-focus);outline-offset:3px}.x-image--overlay{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;border-radius:inherit}.x-image--footer{display:flex;width:100%;max-width:100%}.x-image--footer--caption{flex:1 1 auto;min-width:0}.x-image--footer--caption-title{font-weight:400;font-size:13px;line-height:var(--x-line-height-base);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.x-image--footer--caption-description{font-size:12px;line-height:var(--x-line-height-base)}.x-image--footer--extra{flex:0 0 auto;padding-left:12px}.x-image--with-footer-inner .x-image--footer{position:absolute;bottom:0;left:0;align-items:center;box-sizing:border-box;padding:10px 12px;color:var(--x-image-color-footer-inner-text);background:var(--x-image-color-footer-inner-bg);border-bottom-right-radius:8px;border-bottom-left-radius:8px;pointer-events:none}.x-image--with-footer-inner .x-image--footer--extra{pointer-events:auto}.x-image--with-footer-inner .x-image--footer--caption-title{color:var(--x-image-color-title-footer-inner-text)}.x-image--with-footer-inner .x-image--footer--caption-description{color:var(--x-image-color-description-footer-inner-text)}.x-image--with-footer-outer .x-image--footer{margin-top:8px;color:var(--x-image-color-footer-outer-text)}.x-image--with-footer-outer .x-image--footer--caption-title{color:var(--x-image-color-title-footer-outer-text)}.x-image--with-footer-outer .x-image--footer--caption-description{color:var(--x-image-color-description-footer-outer-text)}.x-image--error{display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:100%;color:var(--x-image-color-error-text);background-color:var(--x-image-color-error-bg);border-radius:inherit}.x-image--error-icon{width:24px;max-width:100%;height:24px;max-height:100%}.x-image--error-icon>svg{width:100%;height:100%}.x-image--error-alt{padding:8px 16px;font-size:12px;line-height:1.5;text-align:center}.x-image--loader{position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--x-image-color-loader-bg);border-radius:inherit}.x-image--loader-spin{position:absolute;top:50%;left:50%;color:var(--x-image-color-loader-spin-text);font-size:16px;text-align:center;transform:translate(-50%, -50%)}.x-image--loader-spin-text{color:var(--x-image-color-loader-spin-text);font-size:12px}.x-image--loading-error.x-image--with-footer-inner .x-image--error,.x-image--loading.x-image--with-footer-inner .x-image--loader{padding-bottom:40px}.x-image--simple.x-image--with-footer-inner .x-image--footer{padding:12px 16px}.x-image--loading .x-image--img,.x-image--loading-error .x-image--img{visibility:hidden}.x-image-preview{position:fixed;top:0;left:0;z-index:1000;width:100%;height:100%}.x-image-preview-hide{display:none}.x-image-preview .x-image-preview--mask,.x-image-preview .x-image-preview--wrapper{position:absolute;top:0;left:0;width:100%;height:100%}.x-image-preview--mask{background-color:var(--x-image-preview-color-mask-bg)}.x-image-preview--img-container{width:100%;height:100%;text-align:center}.x-image-preview--img-container::before{display:inline-block;width:0;height:100%;vertical-align:middle;content:""}.x-image-preview--img-container .x-image-preview--img{display:inline-block;max-width:100%;max-height:100%;vertical-align:middle;cursor:grab;user-select:none}.x-image-preview--img-container .x-image-preview--img.x-image-preview-img-moving{cursor:grabbing}.x-image-preview--scale-value{box-sizing:border-box;padding:10px 12px;color:var(--x-image-preview-color-scale-value-text);font-size:14px;line-height:initial;background-color:var(--x-image-preview-color-scale-value-bg);position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.x-image-preview--toolbar{position:absolute;bottom:46px;left:50%;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:4px;box-sizing:border-box;width:max-content;max-width:calc(100% - 32px);padding:4px 16px;background-color:var(--x-image-preview-color-toolbar-bg);border-radius:5px;transform:translateX(-50%);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.x-image-preview .x-image-preview--toolbar-action{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:40px;height:40px;padding:0;color:var(--x-image-preview-color-action-text);font-size:14px;appearance:none;background-color:var(--x-color-transparent);border:0;border-radius:2px;cursor:pointer;flex:none}.x-image-preview .x-image-preview--toolbar-action:hover,.x-image-preview .x-image-preview--toolbar-action:focus-visible{color:var(--x-image-preview-color-action-hover-text);background-color:var(--x-image-preview-color-action-hover-bg)}.x-image-preview .x-image-preview--toolbar-action:focus-visible{outline:2px solid var(--x-color-white);outline-offset:2px}.x-image-preview .x-image-preview--toolbar-action-disabled,.x-image-preview .x-image-preview--toolbar-action-disabled:hover,.x-image-preview .x-image-preview--toolbar-action-disabled:focus-visible{color:var(--x-image-preview-color-action-disabled-text);background-color:var(--x-image-preview-color-action-disabled-bg);cursor:not-allowed}.x-image-preview .x-image-preview--toolbar-action--name{padding-right:8px;font-size:12px}.x-image-preview .x-image-preview--toolbar-action--content{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;width:100%;height:100%;padding:0;line-height:1}.x-image-preview .x-image-preview--toolbar-action--content>svg{width:1em;height:1em}.x-image-preview--loading{display:flex;align-items:center;justify-content:center;box-sizing:border-box;width:40px;height:40px;padding:8px;color:var(--x-image-preview-color-loading-text);font-size:16px;background-color:var(--x-image-preview-color-loading-bg);border-radius:8px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}.x-image-preview--error{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);display:flex;flex-direction:column;align-items:center;gap:12px;max-width:calc(100% - 64px);padding:24px;color:var(--x-image-preview-color-action-text);font-size:14px;text-align:center;background:var(--x-image-preview-color-toolbar-bg);border-radius:8px}.x-image-preview--close-btn{position:absolute;top:10px;right:10px;display:flex;align-items:center;justify-content:center;width:30px;height:30px;color:var(--x-image-preview-color-close-btn-text);font-size:18px;line-height:30px;text-align:center;appearance:none;background:var(--x-image-preview-color-close-btn-bg);border:0;border-radius:50%;cursor:pointer}.x-image-preview--close-btn:focus-visible{outline:2px solid var(--x-color-white);outline-offset:3px}.x-image-preview--arrow--left{position:absolute;top:50%;left:15px;z-index:2;display:flex;align-items:center;justify-content:center;width:30px;height:30px;color:var(--x-image-preview-arrow-color-icon);appearance:none;background-color:var(--x-image-preview-arrow-color-bg);border:0;border-radius:50%;cursor:pointer;transform:translateY(-50%)}.x-image-preview--arrow--left:focus-visible{outline:2px solid var(--x-color-white);outline-offset:3px}.x-image-preview--arrow--left>svg{color:var(--x-image-preview-arrow-color-icon);font-size:20px}.x-image-preview--arrow--left:hover{background-color:var(--x-image-preview-arrow-color-bg-hover)}.x-image-preview--arrow--right{position:absolute;top:50%;right:15px;z-index:2;display:flex;align-items:center;justify-content:center;width:30px;height:30px;color:var(--x-image-preview-arrow-color-icon);appearance:none;background-color:var(--x-image-preview-arrow-color-bg);border:0;border-radius:50%;cursor:pointer;transform:translateY(-50%)}.x-image-preview--arrow--right:focus-visible{outline:2px solid var(--x-color-white);outline-offset:3px}.x-image-preview--arrow--right>svg{color:var(--x-image-preview-arrow-color-icon);font-size:20px}.x-image-preview--arrow--right:hover{background-color:var(--x-image-preview-arrow-color-bg-hover)}.x-image-preview--arrow-disabled,.x-image-preview--arrow-disabled:hover{color:var(--x-image-preview-arrow-color-icon-disabled);background-color:var(--x-image-preview-arrow-color-bg-disabled);cursor:not-allowed}.x-image-preview--arrow-disabled>svg{color:var(--x-image-preview-arrow-color-icon-disabled)}.image-fade-enter-from,.image-fade-leave-to{opacity:0}.image-fade-enter-to,.image-fade-leave-from{opacity:1}.image-fade-enter-active{transition:opacity .4s cubic-bezier(0.3, 1.3, 0.3, 1)}.image-fade-leave-active{transition:opacity .4s cubic-bezier(0.3, 1.3, 0.3, 1)}

package/dist/style/upload.css

@@ -0,0 +1 @@
+:root{--x-upload-color-text: var(--x-color-text-primary);--x-upload-color-icon: var(--x-color-text-tertiary);--x-upload-color-tip-text: var(--x-color-text-tertiary);--x-upload-color-bg: var(--x-color-fill-1);--x-upload-color-bg-hover: var(--x-color-fill-2);--x-upload-color-border: var(--x-color-border-default);--x-upload-color-border-hover: var(--x-color-primary);--x-upload-color-thumbnail-bg: var(--x-color-fill-2);--x-upload-color-picture-overlay-bg: var(--x-color-overlay-mask);--x-upload-color-picture-overlay-content: var(--x-color-white);--x-upload-border-width: var(--x-border-1);--x-upload-border-radius: var(--x-border-radius-medium);--x-upload-border-radius-small: var(--x-border-radius-small);--x-upload-size-font-size: var(--x-font-size-body-3);--x-upload-size-tip-font-size: var(--x-font-size-caption);--x-upload-size-line-height: 1.5;--x-upload-spacing-icon-text: var(--x-spacing-2);--x-upload-spacing-operations: var(--x-spacing-1);--x-upload-spacing-list: var(--x-spacing-2);--x-upload-spacing-tip: var(--x-spacing-1);--x-upload-spacing-card: var(--x-spacing-3);--x-upload-size-thumbnail: var(--x-size-10);--x-upload-size-picture-card: var(--x-size-25);--x-upload-size-operation-icon: var(--x-size-4);--x-upload-size-picture-operation-icon: var(--x-size-5);--x-upload-size-progress-width: var(--x-size-25);--x-upload-size-item-padding-vertical: var(--x-spacing-1);--x-upload-size-item-padding-horizontal: var(--x-spacing-2);--x-upload-size-picture-name-padding: var(--x-spacing-1);--x-upload-size-dragger-padding-vertical: var(--x-spacing-12);--x-upload-size-dragger-padding-horizontal: var(--x-spacing-6);--x-upload-size-focus-outline: 2px;--x-upload-size-focus-outline-offset: 1px}.x-upload{position:relative;display:block;color:var(--x-upload-color-text)}.x-upload--list{display:block}.x-upload--entry{display:inline-block}.x-upload--dragger{display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;width:100%;padding:var(--x-upload-size-dragger-padding-vertical) var(--x-upload-size-dragger-padding-horizontal);color:var(--x-upload-color-text);text-align:center;background-color:var(--x-upload-color-bg);border:var(--x-upload-border-width) dashed var(--x-upload-color-border);border-radius:var(--x-upload-border-radius);cursor:pointer;transition:background-color var(--x-transition-duration-2) var(--x-transition-timing-function-standard),border-color var(--x-transition-duration-2) var(--x-transition-timing-function-standard)}.x-upload--dragger:hover{background-color:var(--x-upload-color-bg-hover);border-color:var(--x-upload-color-border-hover)}.x-upload--trigger{display:inline-flex;align-items:center;gap:var(--x-upload-spacing-icon-text);color:var(--x-upload-color-text);cursor:pointer;transition:color var(--x-transition-duration-2) var(--x-transition-timing-function-standard)}.x-upload--trigger:focus-visible{outline:var(--x-upload-size-focus-outline) solid var(--x-color-border-focus);outline-offset:var(--x-upload-size-focus-outline-offset);border-radius:var(--x-upload-border-radius)}.x-upload--trigger-icon{display:inline-flex;align-items:center;color:var(--x-upload-color-icon)}.x-upload--trigger-text{font-size:var(--x-upload-size-font-size);line-height:var(--x-upload-size-line-height)}.x-upload--tip{margin-top:var(--x-upload-spacing-tip);color:var(--x-upload-color-tip-text);font-size:var(--x-upload-size-tip-font-size);line-height:var(--x-upload-size-line-height)}.x-upload--input{display:none}.x-upload--items{margin-top:var(--x-upload-spacing-list)}.x-upload--item-wrapper{display:block}.x-upload--item{display:flex;align-items:center;box-sizing:border-box;min-width:0;flex-wrap:wrap;gap:var(--x-upload-spacing-icon-text);padding:var(--x-upload-size-item-padding-vertical) var(--x-upload-size-item-padding-horizontal);color:var(--x-upload-color-text);font-size:var(--x-upload-size-font-size);line-height:var(--x-upload-size-line-height);border-radius:var(--x-upload-border-radius)}.x-upload--item:hover{background-color:var(--x-upload-color-bg)}.x-upload--item-file-icon{display:inline-flex;flex:none;align-items:center;color:var(--x-upload-color-icon)}.x-upload--item-thumbnail{display:inline-flex;flex:none;align-items:center;justify-content:center;box-sizing:border-box;width:var(--x-upload-size-thumbnail);height:var(--x-upload-size-thumbnail);overflow:hidden;color:var(--x-upload-color-icon);background-color:var(--x-upload-color-thumbnail-bg);border-radius:var(--x-upload-border-radius-small)}.x-upload--item-thumbnail img{width:100%;height:100%;object-fit:cover}.x-upload--item-name{flex:1;flex-basis:var(--x-upload-size-thumbnail);min-width:0;overflow:hidden;color:var(--x-upload-color-text);text-overflow:ellipsis;white-space:nowrap}.x-upload--item-name:focus-visible{outline:var(--x-upload-size-focus-outline) solid var(--x-color-border-focus);outline-offset:var(--x-upload-size-focus-outline-offset);border-radius:var(--x-upload-border-radius-small)}.x-upload--item-name-link{color:var(--x-color-primary-text);text-decoration:none}.x-upload--item-name-link:hover{color:var(--x-color-primary);text-decoration:underline}.x-upload--item-error-icon{display:inline-flex;flex:none;align-items:center;color:var(--x-color-danger)}.x-upload--item-progress{flex:none;width:var(--x-upload-size-progress-width)}.x-upload--item-operations{display:inline-flex;flex:none;align-items:center;gap:var(--x-upload-spacing-operations);color:var(--x-upload-color-icon)}.x-upload--item-operations .x-icon-hover{font-size:var(--x-upload-size-operation-icon)}.x-upload--item-error .x-upload--item-name{color:var(--x-color-danger)}.x-upload--list-picture-card{display:flex;flex-wrap:wrap;align-items:flex-start;gap:var(--x-upload-spacing-card)}.x-upload--picture-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--x-upload-spacing-tip);height:100%;padding:var(--x-upload-size-item-padding-horizontal);box-sizing:border-box;color:var(--x-upload-color-icon)}.x-upload--picture-placeholder span{max-width:100%;overflow:hidden;font-size:var(--x-upload-size-tip-font-size);text-overflow:ellipsis;white-space:nowrap}.x-upload--picture-entry{display:inline-flex;flex-direction:column;align-items:center;gap:var(--x-upload-spacing-tip)}.x-upload--picture-entry-tip{max-width:var(--x-upload-size-picture-card);color:var(--x-upload-color-tip-text);font-size:var(--x-upload-size-tip-font-size);line-height:var(--x-upload-size-line-height);text-align:center}.x-upload--picture-trigger{justify-content:center;box-sizing:border-box;width:var(--x-upload-size-picture-card);height:var(--x-upload-size-picture-card);color:var(--x-upload-color-icon);background-color:var(--x-upload-color-bg);border:var(--x-upload-border-width) dashed var(--x-upload-color-border);border-radius:var(--x-upload-border-radius)}.x-upload--picture-trigger .x-upload--trigger-text{display:none}.x-upload--picture-trigger:hover{background-color:var(--x-upload-color-bg-hover);border-color:var(--x-upload-color-border-hover)}.x-upload--picture-item{position:relative;box-sizing:border-box;width:var(--x-upload-size-picture-card);height:var(--x-upload-size-picture-card);overflow:hidden;background-color:var(--x-upload-color-thumbnail-bg);border:var(--x-upload-border-width) solid var(--x-upload-color-border);border-radius:var(--x-upload-border-radius)}.x-upload--picture-image{display:block;width:100%;height:100%;object-fit:cover}.x-upload--picture-name{position:absolute;right:0;bottom:0;left:0;padding:var(--x-upload-size-picture-name-padding);overflow:hidden;color:var(--x-upload-color-picture-overlay-content);font-size:var(--x-upload-size-tip-font-size);line-height:var(--x-upload-size-line-height);text-overflow:ellipsis;white-space:nowrap;background-color:var(--x-upload-color-picture-overlay-bg)}.x-upload--picture-mask{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--x-upload-spacing-tip);padding:var(--x-upload-size-item-padding-horizontal);color:var(--x-upload-color-picture-overlay-content);background-color:var(--x-upload-color-picture-overlay-bg);opacity:0;transition:opacity var(--x-transition-duration-2) var(--x-transition-timing-function-standard)}.x-upload--picture-item:hover .x-upload--picture-mask,.x-upload--picture-item:focus-within .x-upload--picture-mask{opacity:1}.x-upload--picture-operations{display:inline-flex;align-items:center;gap:var(--x-upload-spacing-operations);font-size:var(--x-upload-size-picture-operation-icon)}.x-upload--picture-operations .x-icon-hover{color:var(--x-upload-color-picture-overlay-content)}.x-upload--picture-uploading{display:flex;align-items:center;justify-content:center;width:100%;height:100%}.x-upload--picture-error{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:var(--x-upload-spacing-tip);width:100%;height:100%;color:var(--x-color-danger)}.x-upload--picture-error-tip{display:-webkit-box;overflow:hidden;color:var(--x-upload-color-picture-overlay-content);font-size:var(--x-upload-size-tip-font-size);line-height:var(--x-upload-size-line-height);text-align:center;-webkit-box-orient:vertical;-webkit-line-clamp:2}.x-upload--empty{display:flex;align-items:center;gap:var(--x-upload-spacing-icon-text);padding:var(--x-upload-size-item-padding-vertical) var(--x-upload-size-item-padding-horizontal);color:var(--x-upload-color-tip-text);font-size:var(--x-upload-size-font-size)}.x-upload-is-entry-block{display:block;width:100%}.x-upload-is-dragging{color:var(--x-upload-color-text);background-color:var(--x-upload-color-bg-hover);border-color:var(--x-upload-color-border-hover)}.x-upload-is-disabled{color:var(--x-color-text-disabled);cursor:not-allowed}.x-upload-is-disabled.x-upload--trigger .x-upload--trigger-icon,.x-upload-is-disabled.x-upload--trigger .x-upload--trigger-text{color:inherit}.x-upload-is-disabled.x-upload--trigger:hover{background-color:var(--x-upload-color-bg);border-color:var(--x-color-border-subtle)}.x-upload.x-upload--dragger.x-upload-is-disabled{background-color:var(--x-upload-color-bg);border-color:var(--x-color-border-subtle)}.x-upload.x-upload--picture-trigger.x-upload-is-disabled{border-color:var(--x-color-border-subtle)}.x-upload-is-error{opacity:1}.x-upload-is-uploading{border-style:dashed}.x-upload--announcement{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;white-space:nowrap;border:0;clip-path:inset(50%)}

package/dist/style/upload.js

@@ -0,0 +1,2 @@
+import './base.css';
+import './upload.css';