light-chain-open-ui 1.0.0 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,1101 +0,0 @@
1
- require(`./react.cjs`);let e=require(`lit`);var t=e=>(t,n)=>{n===void 0?customElements.define(e,t):n.addInitializer(()=>{customElements.define(e,t)})},n=globalThis,r=n.ShadowRoot&&(n.ShadyCSS===void 0||n.ShadyCSS.nativeShadow)&&`adoptedStyleSheets`in Document.prototype&&`replace`in CSSStyleSheet.prototype,i=Symbol(),a=new WeakMap,o=class{constructor(e,t,n){if(this._$cssResult$=!0,n!==i)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=e,this.t=t}get styleSheet(){let e=this.o,t=this.t;if(r&&e===void 0){let n=t!==void 0&&t.length===1;n&&(e=a.get(t)),e===void 0&&((this.o=e=new CSSStyleSheet).replaceSync(this.cssText),n&&a.set(t,e))}return e}toString(){return this.cssText}},s=e=>new o(typeof e==`string`?e:e+``,void 0,i),c=(e,t)=>{if(r)e.adoptedStyleSheets=t.map(e=>e instanceof CSSStyleSheet?e:e.styleSheet);else for(let r of t){let t=document.createElement(`style`),i=n.litNonce;i!==void 0&&t.setAttribute(`nonce`,i),t.textContent=r.cssText,e.appendChild(t)}},l=r?e=>e:e=>e instanceof CSSStyleSheet?(e=>{let t=``;for(let n of e.cssRules)t+=n.cssText;return s(t)})(e):e,{is:u,defineProperty:ee,getOwnPropertyDescriptor:te,getOwnPropertyNames:ne,getOwnPropertySymbols:re,getPrototypeOf:ie}=Object,d=globalThis,ae=d.trustedTypes,oe=ae?ae.emptyScript:``,se=d.reactiveElementPolyfillSupport,f=(e,t)=>e,p={toAttribute(e,t){switch(t){case Boolean:e=e?oe:null;break;case Object:case Array:e=e==null?e:JSON.stringify(e)}return e},fromAttribute(e,t){let n=e;switch(t){case Boolean:n=e!==null;break;case Number:n=e===null?null:Number(e);break;case Object:case Array:try{n=JSON.parse(e)}catch{n=null}}return n}},ce=(e,t)=>!u(e,t),le={attribute:!0,type:String,converter:p,reflect:!1,useDefault:!1,hasChanged:ce};Symbol.metadata??=Symbol(`metadata`),d.litPropertyMetadata??=new WeakMap;var m=class extends HTMLElement{static addInitializer(e){this._$Ei(),(this.l??=[]).push(e)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(e,t=le){if(t.state&&(t.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(e)&&((t=Object.create(t)).wrapped=!0),this.elementProperties.set(e,t),!t.noAccessor){let n=Symbol(),r=this.getPropertyDescriptor(e,n,t);r!==void 0&&ee(this.prototype,e,r)}}static getPropertyDescriptor(e,t,n){let{get:r,set:i}=te(this.prototype,e)??{get(){return this[t]},set(e){this[t]=e}};return{get:r,set(t){let a=r?.call(this);i?.call(this,t),this.requestUpdate(e,a,n)},configurable:!0,enumerable:!0}}static getPropertyOptions(e){return this.elementProperties.get(e)??le}static _$Ei(){if(this.hasOwnProperty(f(`elementProperties`)))return;let e=ie(this);e.finalize(),e.l!==void 0&&(this.l=[...e.l]),this.elementProperties=new Map(e.elementProperties)}static finalize(){if(this.hasOwnProperty(f(`finalized`)))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(f(`properties`))){let e=this.properties,t=[...ne(e),...re(e)];for(let n of t)this.createProperty(n,e[n])}let e=this[Symbol.metadata];if(e!==null){let t=litPropertyMetadata.get(e);if(t!==void 0)for(let[e,n]of t)this.elementProperties.set(e,n)}this._$Eh=new Map;for(let[e,t]of this.elementProperties){let n=this._$Eu(e,t);n!==void 0&&this._$Eh.set(n,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(e){let t=[];if(Array.isArray(e)){let n=new Set(e.flat(1/0).reverse());for(let e of n)t.unshift(l(e))}else e!==void 0&&t.push(l(e));return t}static _$Eu(e,t){let n=t.attribute;return!1===n?void 0:typeof n==`string`?n:typeof e==`string`?e.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise(e=>this.enableUpdating=e),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach(e=>e(this))}addController(e){(this._$EO??=new Set).add(e),this.renderRoot!==void 0&&this.isConnected&&e.hostConnected?.()}removeController(e){this._$EO?.delete(e)}_$E_(){let e=new Map,t=this.constructor.elementProperties;for(let n of t.keys())this.hasOwnProperty(n)&&(e.set(n,this[n]),delete this[n]);e.size>0&&(this._$Ep=e)}createRenderRoot(){let e=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return c(e,this.constructor.elementStyles),e}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach(e=>e.hostConnected?.())}enableUpdating(e){}disconnectedCallback(){this._$EO?.forEach(e=>e.hostDisconnected?.())}attributeChangedCallback(e,t,n){this._$AK(e,n)}_$ET(e,t){let n=this.constructor.elementProperties.get(e),r=this.constructor._$Eu(e,n);if(r!==void 0&&!0===n.reflect){let i=(n.converter?.toAttribute===void 0?p:n.converter).toAttribute(t,n.type);this._$Em=e,i==null?this.removeAttribute(r):this.setAttribute(r,i),this._$Em=null}}_$AK(e,t){let n=this.constructor,r=n._$Eh.get(e);if(r!==void 0&&this._$Em!==r){let e=n.getPropertyOptions(r),i=typeof e.converter==`function`?{fromAttribute:e.converter}:e.converter?.fromAttribute===void 0?p:e.converter;this._$Em=r;let a=i.fromAttribute(t,e.type);this[r]=a??this._$Ej?.get(r)??a,this._$Em=null}}requestUpdate(e,t,n,r=!1,i){if(e!==void 0){let a=this.constructor;if(!1===r&&(i=this[e]),n??=a.getPropertyOptions(e),!((n.hasChanged??ce)(i,t)||n.useDefault&&n.reflect&&i===this._$Ej?.get(e)&&!this.hasAttribute(a._$Eu(e,n))))return;this.C(e,t,n)}!1===this.isUpdatePending&&(this._$ES=this._$EP())}C(e,t,{useDefault:n,reflect:r,wrapped:i},a){n&&!(this._$Ej??=new Map).has(e)&&(this._$Ej.set(e,a??t??this[e]),!0!==i||a!==void 0)||(this._$AL.has(e)||(this.hasUpdated||n||(t=void 0),this._$AL.set(e,t)),!0===r&&this._$Em!==e&&(this._$Eq??=new Set).add(e))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(e){Promise.reject(e)}let e=this.scheduleUpdate();return e!=null&&await e,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(let[e,t]of this._$Ep)this[e]=t;this._$Ep=void 0}let e=this.constructor.elementProperties;if(e.size>0)for(let[t,n]of e){let{wrapped:e}=n,r=this[t];!0!==e||this._$AL.has(t)||r===void 0||this.C(t,void 0,n,r)}}let e=!1,t=this._$AL;try{e=this.shouldUpdate(t),e?(this.willUpdate(t),this._$EO?.forEach(e=>e.hostUpdate?.()),this.update(t)):this._$EM()}catch(t){throw e=!1,this._$EM(),t}e&&this._$AE(t)}willUpdate(e){}_$AE(e){this._$EO?.forEach(e=>e.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(e)),this.updated(e)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(e){return!0}update(e){this._$Eq&&=this._$Eq.forEach(e=>this._$ET(e,this[e])),this._$EM()}updated(e){}firstUpdated(e){}};m.elementStyles=[],m.shadowRootOptions={mode:`open`},m[f(`elementProperties`)]=new Map,m[f(`finalized`)]=new Map,se?.({ReactiveElement:m}),(d.reactiveElementVersions??=[]).push(`2.1.2`);var ue={attribute:!0,type:String,converter:p,reflect:!1,hasChanged:ce},de=(e=ue,t,n)=>{let{kind:r,metadata:i}=n,a=globalThis.litPropertyMetadata.get(i);if(a===void 0&&globalThis.litPropertyMetadata.set(i,a=new Map),r===`setter`&&((e=Object.create(e)).wrapped=!0),a.set(n.name,e),r===`accessor`){let{name:r}=n;return{set(n){let i=t.get.call(this);t.set.call(this,n),this.requestUpdate(r,i,e,!0,n)},init(t){return t!==void 0&&this.C(r,void 0,e,t),t}}}if(r===`setter`){let{name:r}=n;return function(n){let i=this[r];t.call(this,n),this.requestUpdate(r,i,e,!0,n)}}throw Error(`Unsupported decorator location: `+r)};function h(e){return(t,n)=>typeof n==`object`?de(e,t,n):((e,t,n)=>{let r=t.hasOwnProperty(n);return t.constructor.createProperty(n,e),r?Object.getOwnPropertyDescriptor(t,n):void 0})(e,t,n)}function g(e){return h({...e,state:!0,attribute:!1})}var fe=(e,t,n)=>(n.configurable=!0,n.enumerable=!0,Reflect.decorate&&typeof t!=`object`&&Object.defineProperty(e,t,n),n);function pe(e,t){return(n,r,i)=>{let a=t=>t.renderRoot?.querySelector(e)??null;if(t){let{get:e,set:t}=typeof r==`object`?n:i??(()=>{let e=Symbol();return{get(){return this[e]},set(t){this[e]=t}}})();return fe(n,r,{get(){let n=e.call(this);return n===void 0&&(n=a(this),(n!==null||this.hasUpdated)&&t.call(this,n)),n}})}return fe(n,r,{get(){return a(this)}})}}var me={RUNNING:`running`,DONE:`done`},he={DONE:`done`,EXCEPTION:`exception`},_={MAX_SIZE_MB:10,MAX_WIDTH:2048,MAX_HEIGHT:2048,ASPECT_RATIO_MIN:1/3,ASPECT_RATIO_MAX:3},ge=[`1:1`,`2:3`,`3:4`,`3:2`,`4:3`,`9:16`,`16:9`];function _e(e){let t=[];e.size>_.MAX_SIZE_MB*1024*1024&&t.push(`图片大小不能超过10MB`),(e.width>_.MAX_WIDTH||e.height>_.MAX_HEIGHT)&&t.push(`图片分辨率不能超过2048x2048`);let n=e.width/e.height;return(n<_.ASPECT_RATIO_MIN||n>_.ASPECT_RATIO_MAX)&&t.push(`宽高比必须在1:3到3:1之间`),{valid:t.length===0,errors:t}}function ve(e,t){let n=[];return(e.width!==t.width||e.height!==t.height)&&n.push(`蒙版尺寸必须与原图尺寸相同`),{valid:n.length===0,errors:n}}async function ye(e){let t=e.size<=_.MAX_SIZE_MB*1024*1024;return new Promise(n=>{let r=new Image,i=URL.createObjectURL(e);r.onload=()=>{URL.revokeObjectURL(i);let e=[];(r.width>_.MAX_WIDTH||r.height>_.MAX_HEIGHT)&&e.push(`图片分辨率不能超过2048x2048`);let a=r.width/r.height;(a<_.ASPECT_RATIO_MIN||a>_.ASPECT_RATIO_MAX)&&e.push(`宽高比必须在1:3到3:1之间`),t||e.push(`图片大小不能超过10MB`),n({valid:e.length===0,errors:e})},r.onerror=()=>{URL.revokeObjectURL(i),n({valid:!1,errors:[`无法加载图片`]})},r.src=i})}var be=`https://api.lightchainai.com`,xe=`client-secret`,Se=`/task/progress`,Ce=`/task/submit`,we={BAD_REQUEST:400,UNAUTHORIZED:401,RATE_LIMIT:429,SERVER_ERROR:500},Te={GENERATE_PRINTING:`GeneratePrinting`,VIRTUAL_FITTING:`VirtualFitting`,FIX_FACE:`FixFace`,CHANGE_FACE:`ChangeFace`,MULTI_PERSPECTIVE:`MultiPerspective`,PRINTING_TILING:`PrintingTiling`,CHANGE_DESIGN_POINT:`ChangeDesignPoint`,CHANGE_COLOR:`ChangeColor`,CHANGE_FABRIC:`ChangeFabric`,SR:`Sr`,VECTOR_CONVERT:`VectorConvert`,CHANGE_MODEL:`ChangeModel`,GENERATE_SKETCH:`GenerateSketch`,MODEL_GENERATE_SKETCH:`ModelGenerateSketch`,ELIMINATE:`Eliminate`,EXPAND_IMAGE:`ExpandImage`,CLOTHING_DESIGN:`ClothingDesign`,CHANGE_PATTERN:`ChangePattern`,GENERATE_MODEL:`GenerateModel`,MODIFY_PRINTING:`ModifyPrinting`,CUT_OUT:`CutOut`,LINE_ART_TO_REAL:`LineArtToReal`,FIX_PARTIAL:`FixPartial`,DETAIL_COMPENSATION:`DetailCompensation`,CHANGE_CLOTHES_BY_IMG:`ChangeClothesByImg`,CHANGE_ACCESSORIES_BY_IMG:`ChangeAccessoriesByImg`,VIRTUAL_FITTING_REFERENCE:`VirtualFittingReference`,VIRTUAL_FITTING_TEMPLATE:`VirtualFittingTemplate`,FIX_DEFORMITIES:`FixDeformities`,INTELLIGENT_CROPPING:`IntelligentCropping`,MODEL_TO_FLAT:`ModelToFlat`,GENERATE_SHORT_VIDEO:`GenerateShortVideo`,ONE_CLICK_MODIFY_PRINTING:`OneClickModifyPrinting`,ORIENTATION_DESIGN:`OrientationDesign`,DIRECTIONAL_INTEGRATION:`DirectionalIntegration`,ONE_CLICK_INTEGRATION:`OneClickIntegration`,CHANGE_FABRIC_V2:`ChangeFabricV2`,VIRTUAL_FITTING_REFERENCE_V2:`VirtualFittingReferenceV2`,FLOWER_SHAPED_DESIGN:`FlowerShapedDesign`,FLOWER_SHAPED_VIRTUAL_PRINTING:`FlowerShapedVirtualPrinting`,ONE_CLICK_CHANGE_COLOR:`OneClickChangeColor`,FITTING_MODEL_WITH_LABELS:`FittingModelWithLabels`,FITTING_MODEL_CUSTOM:`FittingModelCustom`,FITTING_MODEL_CHANGE_FACE:`FittingModelChangeFace`,FITTING_MODEL_CHANGE_MODEL:`FittingModelChangeModel`,FITTING_MODEL_CHANGE_BODY_SHAPE:`FittingModelChangeBodyShape`,FITTING_MODEL_CHANGE_CLOTHING_SIZE:`FittingModelChangeClothingSize`,FITTING_MODEL_CHANGE_POSTURE:`FittingModelChangePosture`,FITTING_MODEL_CHANGE_BACKGROUND:`FittingModelChangeBackground`,FITTING_MODEL_CHANGE_PERSPECTIVE:`FittingModelChangePerspective`,TRAIN_CLOTHING_MODEL:`TrainClothingModel`},Ee={IMAGE:`image`,MASK:`mask`,IMAGES:`images`,TEXT:`text`,ENUM:`enum`,MULTI_ENUM:`multiEnum`,ASPECT_RATIO:`aspectRatio`,COLOR:`color`,STRENGTH:`strength`,NUMBER:`number`},v={IDLE:`idle`,SUBMITTING:`submitting`,POLLING:`polling`,SUCCESS:`success`,ERROR:`error`},y={POLL_INTERVAL:1e3,MAX_POLL_ATTEMPTS:120,POLL_ENDPOINT:`/task/progress`},b={CHANGE:`change`,SUBMIT:`submit`,POLL:`poll`,SUCCESS:`success`,ERROR:`error`,IMAGE_CLICK:`image-click`,COMPARE:`compare`},x={MISSING_ENDPOINT:`未指定提交端点或任务类型`,POLL_TIMEOUT:e=>`轮询超时: ${e}`,POLL_FAILED:`轮询失败`,TASK_NOT_FOUND:e=>`未找到任务: ${e}`,SUBMIT_FAILED:`提交失败`,FIELD_REQUIRED:e=>`${e}为必填项`,FIELD_STRING:e=>`${e}必须为字符串`,FIELD_ARRAY:e=>`${e}必须为非空数组`,FIELD_ARRAY_ELEMENTS:e=>`${e}数组元素必须为非空字符串`,FIELD_MAX_LENGTH:(e,t)=>`${e}不能超过${t}个字符`,FIELD_ENUM_INVALID:e=>`${e}值不在可选项中`,FIELD_COLOR_FORMAT:e=>`${e}必须为#RRGGBB格式`,FIELD_NUMBER:e=>`${e}必须为数字`},De={IMAGE:[`image/jpeg`,`image/png`,`image/webp`]},Oe={MAX_IMAGE_SIZE:10*1024*1024},ke=[{label:`1:1`,value:`1:1`},{label:`2:3`,value:`2:3`},{label:`3:4`,value:`3:4`},{label:`3:2`,value:`3:2`},{label:`4:3`,value:`4:3`},{label:`9:16`,value:`9:16`},{label:`16:9`,value:`16:9`}],Ae=[{label:`正面`,value:`front`},{label:`背面`,value:`back`},{label:`左侧`,value:`left`},{label:`右侧`,value:`right`}],je=[{label:`2倍`,value:`2`},{label:`3倍`,value:`3`},{label:`4倍`,value:`4`}],Me=[{label:`线稿`,value:`line`},{label:`印花`,value:`printing`}],S=[{label:`女`,value:`female`},{label:`男`,value:`male`}],Ne=[{label:`青年`,value:`young`},{label:`中年`,value:`middle`}],Pe=[{label:`亚洲`,value:`asian`},{label:`欧洲`,value:`european`},{label:`非洲`,value:`african`}],Fe=[{label:`上装`,value:`upper`},{label:`下装`,value:`lower`},{label:`连身装`,value:`dress`}],Ie=[{label:`袖型`,value:`sleeve`},{label:`领型`,value:`collar`},{label:`裤型`,value:`pants`},{label:`裙型`,value:`skirt`}],Le=[{label:`全身`,value:`full`},{label:`半身`,value:`half`},{label:`服装`,value:`clothing`}],Re=[{label:`黑白线稿`,value:`bw`},{label:`彩色线稿`,value:`color`}],ze=[{label:`背包`,value:`bag`},{label:`鞋子`,value:`shoes`},{label:`首饰`,value:`jewelry`},{label:`腰带`,value:`belt`},{label:`帽子`,value:`hat`}],Be=[{label:`棚内瑜伽`,value:`yoga`},{label:`极简棚拍`,value:`minimal`}],Ve=[{label:`自定义像素`,value:`1`},{label:`比例裁剪`,value:`2`}],He=[{label:`3秒`,value:`3`},{label:`5秒`,value:`5`}],Ue=[{label:`是`,value:`true`},{label:`否`,value:`false`}],We=[{label:`中国`,value:`china`},{label:`美国`,value:`usa`},{label:`英国`,value:`uk`},{label:`法国`,value:`france`},{label:`德国`,value:`germany`},{label:`意大利`,value:`italy`},{label:`西班牙`,value:`spain`},{label:`俄罗斯`,value:`russia`},{label:`日本`,value:`japan`},{label:`韩国`,value:`korea`},{label:`泰国`,value:`thailand`},{label:`印度`,value:`india`},{label:`越南`,value:`vietnam`},{label:`其他`,value:`other`}],Ge=[{label:`白皙`,value:`fair`},{label:`中等`,value:`medium`},{label:`小麦色`,value:`wheatish`},{label:`深色`,value:`dark`},{label:`其他`,value:`other`}],Ke=[{label:`偏瘦`,value:`slim`},{label:`标准`,value:`standard`},{label:`微胖`,value:`chubby`},{label:`肥胖`,value:`fat`}],C=[{label:`一致`,value:`same`},{label:`相似`,value:`similar`}],qe=[{label:`偏小`,value:`smaller`},{label:`偏大`,value:`larger`}];function w(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}var T=class extends e.LitElement{constructor(...e){super(...e),this.name=``,this.label=``,this.hint=``,this.value=``,this.file=null,this.disabled=!1,this.showMaskHint=!1,this._previewUrl=``,this._errorMessage=``,this._isDragOver=!1}static{this.styles=e.css`
2
- :host {
3
- display: block;
4
- --lc-uploader-border-color: var(--lc-color-border);
5
- --lc-uploader-border-style: dashed;
6
- --lc-uploader-border-width: 2px;
7
- --lc-uploader-border-radius: var(--lc-radius-component);
8
- --lc-uploader-bg: var(--lc-color-bg);
9
- --lc-uploader-bg-hover: var(--lc-color-primary-light);
10
- --lc-uploader-padding: var(--lc-spacing-6);
11
- --lc-uploader-icon-size: 48px;
12
- --lc-uploader-icon-color: var(--lc-color-text-secondary);
13
- --lc-uploader-placeholder-color: var(--lc-color-text-placeholder);
14
- --lc-uploader-error-color: var(--lc-color-error);
15
- }
16
-
17
- :host([disabled]) {
18
- opacity: 0.5;
19
- pointer-events: none;
20
- }
21
-
22
- .container {
23
- display: flex;
24
- flex-direction: column;
25
- gap: var(--lc-spacing-2);
26
- }
27
-
28
- .label {
29
- color: var(--lc-color-text);
30
- font-size: var(--lc-font-size-sm);
31
- font-weight: 500;
32
- }
33
-
34
- .dropzone {
35
- display: flex;
36
- flex-direction: column;
37
- align-items: center;
38
- justify-content: center;
39
- gap: var(--lc-spacing-2);
40
- border: var(--lc-uploader-border-width) var(--lc-uploader-border-style)
41
- var(--lc-uploader-border-color);
42
- border-radius: var(--lc-uploader-border-radius);
43
- background: var(--lc-uploader-bg);
44
- padding: var(--lc-uploader-padding);
45
- cursor: pointer;
46
- transition: background var(--lc-transition-fast),
47
- border-color var(--lc-transition-fast);
48
- min-height: 160px;
49
- }
50
-
51
- .dropzone:hover {
52
- background: var(--lc-uploader-bg-hover);
53
- border-color: var(--lc-color-primary);
54
- }
55
-
56
- .dropzone.dragover {
57
- background: var(--lc-uploader-bg-hover);
58
- border-color: var(--lc-color-primary);
59
- }
60
-
61
- .dropzone-icon {
62
- width: var(--lc-uploader-icon-size);
63
- height: var(--lc-uploader-icon-size);
64
- color: var(--lc-uploader-icon-color);
65
- }
66
-
67
- .dropzone-text {
68
- font-size: var(--lc-font-size-sm);
69
- color: var(--lc-uploader-placeholder-color);
70
- }
71
-
72
- .hidden-input {
73
- display: none;
74
- }
75
-
76
- .preview {
77
- position: relative;
78
- border-radius: var(--lc-uploader-border-radius);
79
- overflow: hidden;
80
- border: var(--lc-uploader-border-width) solid var(--lc-color-border);
81
- }
82
-
83
- .preview img {
84
- display: block;
85
- max-width: 100%;
86
- max-height: 300px;
87
- object-fit: contain;
88
- }
89
-
90
- .preview-remove {
91
- position: absolute;
92
- top: var(--lc-spacing-1);
93
- right: var(--lc-spacing-1);
94
- width: 28px;
95
- height: 28px;
96
- border: none;
97
- border-radius: var(--lc-radius-full);
98
- background: rgba(0, 0, 0, 0.5);
99
- color: #fff;
100
- font-size: var(--lc-font-size-base);
101
- line-height: 1;
102
- cursor: pointer;
103
- display: flex;
104
- align-items: center;
105
- justify-content: center;
106
- transition: background var(--lc-transition-fast);
107
- }
108
-
109
- .preview-remove:hover {
110
- background: rgba(0, 0, 0, 0.7);
111
- }
112
-
113
- .hint {
114
- font-size: var(--lc-font-size-xs);
115
- color: var(--lc-color-text-secondary);
116
- }
117
-
118
- .error {
119
- font-size: var(--lc-font-size-xs);
120
- color: var(--lc-uploader-error-color);
121
- }
122
-
123
- .mask-hint {
124
- font-size: var(--lc-font-size-xs);
125
- color: var(--lc-color-text-secondary);
126
- margin-top: var(--lc-spacing-1);
127
- }
128
- `}disconnectedCallback(){super.disconnectedCallback(),this._cleanupPreview()}_cleanupPreview(){this._previewUrl&&URL.revokeObjectURL(this._previewUrl)}_handleClick(){this._fileInput?.click()}_handleDragOver(e){e.preventDefault(),this._isDragOver=!0}_handleDragLeave(){this._isDragOver=!1}_handleDrop(e){e.preventDefault(),this._isDragOver=!1;let t=e.dataTransfer?.files[0];t&&this._processFile(t)}_handleFileChange(e){let t=e.target,n=t.files?.[0];n&&this._processFile(n),t.value=``}async _processFile(e){this._errorMessage=``;let t=await ye(e);if(!t.valid){this._errorMessage=t.errors.join(`; `),this.value=``,this.file=null,this._dispatchChange(null);return}let n=URL.createObjectURL(e);this._cleanupPreview(),this._previewUrl=n,this.file=e,this.value=n,this._dispatchChange(e)}_handleRemove(e){e.stopPropagation(),this._cleanupPreview(),this._previewUrl=``,this.value=``,this.file=null,this._errorMessage=``,this._dispatchChange(null)}_dispatchChange(e){this.dispatchEvent(new CustomEvent(b.CHANGE,{detail:{value:this.value,file:e},bubbles:!0,composed:!0}))}render(){let t=this._previewUrl||this.value;return e.html`
129
- <div class="container" part="container">
130
- ${this.label?e.html`<label class="label" part="label">${this.label}</label>`:e.nothing}
131
- ${t?this._renderPreview():this._renderDropzone()}
132
- ${this._errorMessage?e.html`<div class="error">${this._errorMessage}</div>`:e.nothing}
133
- ${this.hint&&!this.showMaskHint?e.html`<div class="hint" part="hint">${this.hint}</div>`:e.nothing}
134
- ${this.showMaskHint?this._renderMaskHint():e.nothing}
135
- </div>
136
- `}_renderDropzone(){return e.html`
137
- <div
138
- class="${this._isDragOver?`dropzone dragover`:`dropzone`}"
139
- part="dropzone"
140
- @click=${this._handleClick}
141
- @dragover=${this._handleDragOver}
142
- @dragleave=${this._handleDragLeave}
143
- @drop=${this._handleDrop}
144
- >
145
- <svg
146
- class="dropzone-icon"
147
- viewBox="0 0 48 48"
148
- fill="none"
149
- xmlns="http://www.w3.org/2000/svg"
150
- >
151
- <path
152
- d="M24 6v24M24 6l-7 7M24 6l7 7"
153
- stroke="currentColor"
154
- stroke-width="3"
155
- stroke-linecap="round"
156
- stroke-linejoin="round"
157
- />
158
- <path
159
- d="M8 30v8a4 4 0 004 4h24a4 4 0 004-4v-8"
160
- stroke="currentColor"
161
- stroke-width="3"
162
- stroke-linecap="round"
163
- stroke-linejoin="round"
164
- />
165
- </svg>
166
- <span class="dropzone-text">点击或拖拽图片到此处</span>
167
- <input
168
- class="hidden-input"
169
- type="file"
170
- accept="image/*"
171
- ?disabled=${this.disabled}
172
- @change=${this._handleFileChange}
173
- />
174
- </div>
175
- `}_renderPreview(){return e.html`
176
- <div class="preview" part="preview">
177
- <img src="${this._previewUrl||this.value}" alt="预览" />
178
- <button
179
- class="preview-remove"
180
- @click=${this._handleRemove}
181
- aria-label="删除图片"
182
- >
183
- &times;
184
- </button>
185
- </div>
186
- `}_renderMaskHint(){return e.html`<div class="mask-hint" part="hint">${this.hint||`Mask hint: white keeps the area, black removes the area`}</div>`}};w([h({type:String})],T.prototype,`name`,void 0),w([h({type:String})],T.prototype,`label`,void 0),w([h({type:String})],T.prototype,`hint`,void 0),w([h({type:String})],T.prototype,`value`,void 0),w([h({attribute:!1})],T.prototype,`file`,void 0),w([h({type:Boolean})],T.prototype,`disabled`,void 0),w([h({type:Boolean})],T.prototype,`showMaskHint`,void 0),w([g()],T.prototype,`_previewUrl`,void 0),w([g()],T.prototype,`_errorMessage`,void 0),w([g()],T.prototype,`_isDragOver`,void 0),w([pe(`input[type="file"]`)],T.prototype,`_fileInput`,void 0),T=w([t(`lc-image-uploader`)],T);var E=class extends e.LitElement{constructor(...e){super(...e),this.label=`涂抹蒙版`,this.name=``,this.hint=``,this.required=!1,this.value=``,this.source=``,this.disabled=!1,this.brushSize=28,this._mode=`paint`,this._isDrawing=!1,this._errorMessage=``,this._aspectRatio=`1 / 1`,this._canUndo=!1,this._canRedo=!1,this._zoom=1,this._isSpacePressed=!1,this._isPanning=!1,this._panX=0,this._panY=0,this._lastPoint=null,this._lastPanPoint=null,this._history=[],this._historyIndex=-1,this._sourceWidth=0,this._sourceHeight=0}static{this.styles=e.css`
187
- :host {
188
- display: block;
189
- --lc-mask-border-color: var(--lc-color-border);
190
- --lc-mask-border-radius: var(--lc-radius-component);
191
- --lc-mask-bg: var(--lc-color-bg);
192
- --lc-mask-bg-muted: var(--lc-color-bg-secondary, #f5f5f5);
193
- --lc-mask-padding: var(--lc-spacing-4);
194
- --lc-mask-error-color: var(--lc-color-error);
195
- }
196
-
197
- :host([disabled]) {
198
- opacity: 0.5;
199
- pointer-events: none;
200
- }
201
-
202
- .container {
203
- display: flex;
204
- flex-direction: column;
205
- gap: var(--lc-spacing-2);
206
- }
207
-
208
- .label {
209
- font-size: var(--lc-font-size-sm);
210
- color: var(--lc-color-text);
211
- font-weight: 500;
212
- }
213
-
214
- .required {
215
- color: var(--lc-color-error);
216
- margin-left: 2px;
217
- }
218
-
219
- .empty {
220
- min-height: 160px;
221
- display: flex;
222
- align-items: center;
223
- justify-content: center;
224
- padding: var(--lc-mask-padding);
225
- border: 1px dashed var(--lc-mask-border-color);
226
- border-radius: var(--lc-mask-border-radius);
227
- background: var(--lc-mask-bg-muted);
228
- color: var(--lc-color-text-secondary);
229
- font-size: var(--lc-font-size-sm);
230
- text-align: center;
231
- }
232
-
233
- .editor {
234
- border: 1px solid var(--lc-mask-border-color);
235
- border-radius: var(--lc-mask-border-radius);
236
- overflow: hidden;
237
- background: var(--lc-mask-bg);
238
- }
239
-
240
- .stage {
241
- position: relative;
242
- width: 100%;
243
- aspect-ratio: var(--lc-mask-aspect-ratio, 1 / 1);
244
- max-height: 420px;
245
- background: var(--lc-mask-bg-muted);
246
- touch-action: none;
247
- overflow: hidden;
248
- }
249
-
250
- .stage img,
251
- .stage canvas {
252
- position: absolute;
253
- inset: 0;
254
- width: 100%;
255
- height: 100%;
256
- display: block;
257
- transform: translate(var(--lc-mask-pan-x, 0px), var(--lc-mask-pan-y, 0px)) scale(var(--lc-mask-zoom, 1));
258
- transform-origin: 0 0;
259
- }
260
-
261
- .stage:focus {
262
- outline: none;
263
- }
264
-
265
- .stage img {
266
- object-fit: contain;
267
- user-select: none;
268
- pointer-events: none;
269
- }
270
-
271
- canvas {
272
- cursor: crosshair;
273
- }
274
-
275
- canvas.panning {
276
- cursor: grab;
277
- }
278
-
279
- canvas.dragging {
280
- cursor: grabbing;
281
- }
282
-
283
- .toolbar {
284
- display: flex;
285
- align-items: center;
286
- gap: var(--lc-spacing-2);
287
- padding: var(--lc-spacing-2);
288
- border-top: 1px solid var(--lc-mask-border-color);
289
- background: var(--lc-mask-bg);
290
- }
291
-
292
- .toolbar button {
293
- min-height: 30px;
294
- padding: 0 var(--lc-spacing-3);
295
- border: 1px solid var(--lc-color-border);
296
- border-radius: var(--lc-radius-sm);
297
- background: var(--lc-color-bg);
298
- color: var(--lc-color-text);
299
- cursor: pointer;
300
- }
301
-
302
- .toolbar button.active {
303
- border-color: var(--lc-color-primary);
304
- color: var(--lc-color-primary);
305
- background: var(--lc-color-primary-light);
306
- }
307
-
308
- .toolbar button:disabled {
309
- opacity: 0.45;
310
- cursor: not-allowed;
311
- }
312
-
313
- .toolbar input {
314
- width: 96px;
315
- }
316
-
317
- .zoom-value {
318
- min-width: 44px;
319
- font-size: var(--lc-font-size-xs);
320
- color: var(--lc-color-text-secondary);
321
- text-align: right;
322
- }
323
-
324
- .hint,
325
- .mask-hint {
326
- font-size: var(--lc-font-size-xs);
327
- color: var(--lc-color-text-secondary);
328
- }
329
-
330
- .error {
331
- font-size: var(--lc-font-size-xs);
332
- color: var(--lc-mask-error-color);
333
- }
334
- `}firstUpdated(){this._setupCanvas()}updated(e){e.has(`source`)&&this._loadSource()}disconnectedCallback(){this._resizeObserver?.disconnect(),super.disconnectedCallback()}_setupCanvas(){if(this._ctx=this._canvas?.getContext(`2d`)??void 0,typeof ResizeObserver<`u`){this._resizeObserver=new ResizeObserver(()=>this._resizeCanvas());let e=this.renderRoot.querySelector(`.stage`);e&&this._resizeObserver.observe(e)}this._resizeCanvas()}async _loadSource(){if(this._errorMessage=``,this.value=``,await this.updateComplete,this._setupCanvas(),!this.source){this._clearCanvas(!1),this._resetHistory();return}let e=new Image;e.onload=()=>{this._sourceWidth=e.naturalWidth,this._sourceHeight=e.naturalHeight,this._aspectRatio=`${e.naturalWidth} / ${e.naturalHeight}`,this.style.setProperty(`--lc-mask-aspect-ratio`,this._aspectRatio),this._setZoom(1),this._setPan(0,0),this._clearCanvas(!1),this._resetHistory()},e.onerror=()=>{this._errorMessage=`无法加载原图,请重新上传图片`},e.src=this.source}_resizeCanvas(){let e=this._canvas;if(!e)return;let t=e.getBoundingClientRect(),n=Math.max(1,Math.round(t.width)),r=Math.max(1,Math.round(t.height));if(e.width===n&&e.height===r)return;let i=e.width&&e.height?e.toDataURL(`image/png`):``;if(e.width=n,e.height=r,this._ctx=e.getContext(`2d`)??void 0,i){let e=new Image;e.onload=()=>{this._ctx?.drawImage(e,0,0,n,r),this._syncValue()},e.src=i}}_clearCanvas(e=!0){let t=this._canvas;!t||!this._ctx||(this._ctx.clearRect(0,0,t.width,t.height),this._syncValue(),e&&this._commitHistory())}_handlePointerDown(e){if(!this.source||this.disabled)return;if(this._focusStage(e),this._isSpacePressed){this._isPanning=!0,this._lastPanPoint={x:e.clientX,y:e.clientY},this._canvas?.setPointerCapture(e.pointerId);return}this._isDrawing=!0,this._canvas?.setPointerCapture(e.pointerId);let t=this._getCanvasPoint(e);if(!this._isPointInCanvas(t)){this._isDrawing=!1,this._lastPoint=null;return}this._lastPoint=t,this._drawPoint(t)}_handleWheel(e){if(!this.source||this.disabled)return;e.preventDefault();let t=e.deltaY<0?1.12:.88;this._setZoomAt(this._zoom*t,e)}_handlePointerMove(e){if(this._isPanning){this._pan(e);return}this._isDrawing&&(typeof e.getCoalescedEvents==`function`?e.getCoalescedEvents():[e]).forEach(e=>{let t=this._getCanvasPoint(e);if(!this._isPointInCanvas(t)){this._lastPoint=null;return}this._drawLineTo(t)})}_handlePointerUp(e){if(this._isPanning){this._isPanning=!1,this._lastPanPoint=null,this._canvas?.releasePointerCapture(e.pointerId);return}if(!this._isDrawing)return;let t=this._getCanvasPoint(e);this._isPointInCanvas(t)&&this._drawLineTo(t),this._isDrawing=!1,this._lastPoint=null,this._canvas?.releasePointerCapture(e.pointerId),this._syncValue(),this._commitHistory()}_focusStage(e){(e.currentTarget?.closest(`.stage`))?.focus({preventScroll:!0})}_handleKeyDown(e){e.code===`Space`&&(e.preventDefault(),this._isSpacePressed=!0)}_handleKeyUp(e){e.code===`Space`&&(e.preventDefault(),this._isSpacePressed=!1,this._isPanning=!1,this._lastPanPoint=null)}_handleBlur(){this._isSpacePressed=!1,this._isPanning=!1,this._lastPanPoint=null}_pan(e){if(!this._lastPanPoint){this._lastPanPoint={x:e.clientX,y:e.clientY};return}let t=e.clientX-this._lastPanPoint.x,n=e.clientY-this._lastPanPoint.y;this._lastPanPoint={x:e.clientX,y:e.clientY},this._setPan(this._panX+t,this._panY+n)}_getCanvasPoint(e){let t=this._canvas;if(!t)return{x:0,y:0};let n=t.getBoundingClientRect(),r=n.width?t.width/n.width:1,i=n.height?t.height/n.height:1;return{x:(e.clientX-n.left)*r,y:(e.clientY-n.top)*i}}_getStagePoint(e){let t=this.renderRoot.querySelector(`.stage`);if(!t)return{x:0,y:0};let n=t.getBoundingClientRect();return{x:e.clientX-n.left,y:e.clientY-n.top}}_isPointInCanvas(e){let t=this._getImageCanvasRect();if(t)return e.x>=t.x&&e.x<=t.x+t.width&&e.y>=t.y&&e.y<=t.y+t.height;let n=this._canvas;return n?e.x>=0&&e.x<=n.width&&e.y>=0&&e.y<=n.height:!1}_getImageCanvasRect(){let e=this._canvas;if(!e||!this._sourceWidth||!this._sourceHeight)return null;let t=this._sourceWidth/this._sourceHeight,n=e.width/e.height,r=e.width,i=e.height,a=0,o=0;return n>t?(r=i*t,a=(e.width-r)/2):n<t&&(i=r/t,o=(e.height-i)/2),{x:a,y:o,width:r,height:i}}_drawPoint(e){let t=this._ctx;t&&this._isPointInCanvas(e)&&(t.save(),this._clipToImage(t),t.globalCompositeOperation=this._mode===`paint`?`source-over`:`destination-out`,t.fillStyle=`rgba(255, 255, 255, 0.68)`,t.beginPath(),t.arc(e.x,e.y,this.brushSize/2,0,Math.PI*2),t.fill(),t.restore())}_drawLineTo(e){let t=this._ctx;if(t){if(!this._isPointInCanvas(e)){this._lastPoint=null;return}if(!this._lastPoint){this._lastPoint=e,this._drawPoint(e);return}t.save(),this._clipToImage(t),t.globalCompositeOperation=this._mode===`paint`?`source-over`:`destination-out`,t.strokeStyle=`rgba(255, 255, 255, 0.68)`,t.lineWidth=this.brushSize,t.lineCap=`round`,t.lineJoin=`round`,t.beginPath(),t.moveTo(this._lastPoint.x,this._lastPoint.y),t.lineTo(e.x,e.y),t.stroke(),t.restore(),this._lastPoint=e}}_clipToImage(e){let t=this._getImageCanvasRect();t&&(e.beginPath(),e.rect(t.x,t.y,t.width,t.height),e.clip())}_syncValue(){let e=this._canvas;this.value=this.source&&e?e.toDataURL(`image/png`):``,this.dispatchEvent(new CustomEvent(b.CHANGE,{detail:{value:this.value},bubbles:!0,composed:!0}))}_setZoom(e){this._zoom=Math.min(5,Math.max(1,Number(e.toFixed(2)))),this.style.setProperty(`--lc-mask-zoom`,String(this._zoom)),this._zoom===1&&this._setPan(0,0)}_setZoomAt(e,t){let n=this._zoom,r=Math.min(5,Math.max(1,Number(e.toFixed(2))));if(r===n)return;let i=this._getStagePoint(t),a={x:(i.x-this._panX)/n,y:(i.y-this._panY)/n};if(this._zoom=r,this.style.setProperty(`--lc-mask-zoom`,String(this._zoom)),this._zoom===1){this._setPan(0,0);return}this._setPan(i.x-a.x*this._zoom,i.y-a.y*this._zoom)}_setPan(e,t){this._zoom===1?(this._panX=0,this._panY=0):(this._panX=e,this._panY=t),this.style.setProperty(`--lc-mask-pan-x`,`${this._panX}px`),this.style.setProperty(`--lc-mask-pan-y`,`${this._panY}px`)}_resetView(){this._setZoom(1),this._setPan(0,0)}_resetHistory(){this._history=[this.value],this._historyIndex=0,this._updateHistoryState()}_commitHistory(){if(!this.source)return;let e=this.value;this._history[this._historyIndex]!==e&&(this._history=this._history.slice(0,this._historyIndex+1),this._history.push(e),this._history.length>50&&this._history.shift(),this._historyIndex=this._history.length-1,this._updateHistoryState())}_updateHistoryState(){this._canUndo=this._historyIndex>0,this._canRedo=this._historyIndex>=0&&this._historyIndex<this._history.length-1}_undo(){this._canUndo&&(--this._historyIndex,this._restoreHistory())}_redo(){this._canRedo&&(this._historyIndex+=1,this._restoreHistory())}_restoreHistory(){let e=this._history[this._historyIndex]??``;this._restoreSnapshot(e),this._updateHistoryState()}_restoreSnapshot(e){let t=this._canvas,n=this._ctx;if(!t||!n)return;if(n.clearRect(0,0,t.width,t.height),!e){this._syncValue();return}let r=new Image;r.onload=()=>{n.clearRect(0,0,t.width,t.height),n.drawImage(r,0,0,t.width,t.height),this._syncValue()},r.src=e}render(){return e.html`
335
- <div class="container" part="container">
336
- ${this._renderLabel()}
337
- ${this.source?this._renderEditor():this._renderEmpty()}
338
- ${this._errorMessage?e.html`<div class="error">${this._errorMessage}</div>`:e.nothing}
339
- ${this.hint?e.html`<div class="hint" part="hint">${this.hint}</div>`:e.nothing}
340
- <div class="mask-hint">先上传原图,再在图片上涂抹需要处理的区域。</div>
341
- </div>
342
- `}_renderLabel(){return e.html`
343
- <label class="label" part="label">
344
- ${this.label}${this.required?e.html`<span class="required">*</span>`:e.nothing}
345
- </label>
346
- `}_renderEmpty(){return e.html`
347
- <div class="empty" part="editor">
348
- 请先上传原图,随后在这里涂抹生成蒙版
349
- </div>
350
- `}_renderEditor(){return e.html`
351
- <div class="editor" part="editor">
352
- <div
353
- class="stage"
354
- tabindex="0"
355
- @wheel=${this._handleWheel}
356
- @keydown=${this._handleKeyDown}
357
- @keyup=${this._handleKeyUp}
358
- @blur=${this._handleBlur}
359
- @pointerenter=${this._focusStage}
360
- >
361
- <img src=${this.source} alt="原图" />
362
- <canvas
363
- class=${this._isPanning?`dragging`:this._isSpacePressed?`panning`:``}
364
- part="canvas"
365
- @pointerdown=${this._handlePointerDown}
366
- @pointermove=${this._handlePointerMove}
367
- @pointerup=${this._handlePointerUp}
368
- @pointercancel=${this._handlePointerUp}
369
- ></canvas>
370
- </div>
371
- <div class="toolbar">
372
- <button
373
- type="button"
374
- class=${this._mode===`paint`?`active`:``}
375
- @click=${()=>{this._mode=`paint`}}
376
- >涂抹</button>
377
- <button
378
- type="button"
379
- class=${this._mode===`erase`?`active`:``}
380
- @click=${()=>{this._mode=`erase`}}
381
- >擦除</button>
382
- <button type="button" ?disabled=${!this._canUndo} @click=${this._undo}>撤销</button>
383
- <button type="button" ?disabled=${!this._canRedo} @click=${this._redo}>重做</button>
384
- <input
385
- type="range"
386
- min="8"
387
- max="80"
388
- .value=${String(this.brushSize)}
389
- @input=${e=>{this.brushSize=Number(e.target.value)}}
390
- />
391
- <span class="zoom-value">${Math.round(this._zoom*100)}%</span>
392
- <button type="button" @click=${()=>this._resetView()}>重置视图</button>
393
- <button type="button" @click=${()=>this._clearCanvas()}>清空</button>
394
- </div>
395
- </div>
396
- `}};w([h({type:String})],E.prototype,`label`,void 0),w([h({type:String})],E.prototype,`name`,void 0),w([h({type:String})],E.prototype,`hint`,void 0),w([h({type:Boolean})],E.prototype,`required`,void 0),w([h({type:String})],E.prototype,`value`,void 0),w([h({type:String})],E.prototype,`source`,void 0),w([h({type:Boolean})],E.prototype,`disabled`,void 0),w([h({type:Number})],E.prototype,`brushSize`,void 0),w([g()],E.prototype,`_mode`,void 0),w([g()],E.prototype,`_isDrawing`,void 0),w([g()],E.prototype,`_errorMessage`,void 0),w([g()],E.prototype,`_aspectRatio`,void 0),w([g()],E.prototype,`_canUndo`,void 0),w([g()],E.prototype,`_canRedo`,void 0),w([g()],E.prototype,`_zoom`,void 0),w([g()],E.prototype,`_isSpacePressed`,void 0),w([g()],E.prototype,`_isPanning`,void 0),w([g()],E.prototype,`_panX`,void 0),w([g()],E.prototype,`_panY`,void 0),w([pe(`canvas`)],E.prototype,`_canvas`,void 0),E=w([t(`lc-mask-editor`)],E);var D=class extends e.LitElement{constructor(...e){super(...e),this.label=``,this.name=``,this.value=``,this.mode=`button`,this.multiple=!1,this.required=!1,this.disabled=!1,this.showIcon=!1,this.options=`[]`}static{this.styles=e.css`
397
- :host {
398
- display: block;
399
- font-family: var(--lc-font-family);
400
- }
401
-
402
- .label {
403
- display: block;
404
- font-size: var(--lc-font-size-sm);
405
- color: var(--lc-color-text);
406
- margin-bottom: var(--lc-spacing-2);
407
- }
408
-
409
- .label .required {
410
- color: var(--lc-color-error);
411
- margin-left: 2px;
412
- }
413
-
414
- .button-group {
415
- display: flex;
416
- flex-wrap: wrap;
417
- gap: var(--lc-spacing-2);
418
- }
419
-
420
- .button-group.with-icon {
421
- gap: var(--lc-spacing-3);
422
- }
423
-
424
- .btn {
425
- display: inline-flex;
426
- align-items: center;
427
- justify-content: center;
428
- gap: var(--lc-spacing-1);
429
- padding: var(--lc-spacing-1) var(--lc-spacing-3);
430
- border: 1px solid var(--lc-color-border);
431
- border-radius: var(--lc-radius-sm);
432
- background: var(--lc-color-bg);
433
- color: var(--lc-color-text);
434
- cursor: pointer;
435
- font-size: var(--lc-font-size-sm);
436
- font-family: var(--lc-font-family);
437
- transition: all var(--lc-transition-fast);
438
- }
439
-
440
- .btn.with-icon {
441
- min-width: 64px;
442
- min-height: 64px;
443
- flex-direction: column;
444
- padding: var(--lc-spacing-2);
445
- }
446
-
447
- .btn:hover:not(.active):not(:disabled) {
448
- border-color: var(--lc-color-primary);
449
- }
450
-
451
- .btn.active {
452
- background: var(--lc-color-primary);
453
- color: white;
454
- border-color: var(--lc-color-primary);
455
- }
456
-
457
- .btn:disabled {
458
- opacity: 0.5;
459
- cursor: not-allowed;
460
- }
461
-
462
- .radio-group {
463
- display: flex;
464
- flex-direction: column;
465
- gap: var(--lc-spacing-2);
466
- }
467
-
468
- .radio-item {
469
- display: flex;
470
- align-items: center;
471
- gap: var(--lc-spacing-2);
472
- cursor: pointer;
473
- font-size: var(--lc-font-size-sm);
474
- color: var(--lc-color-text);
475
- }
476
-
477
- .radio-item input {
478
- accent-color: var(--lc-color-primary);
479
- }
480
-
481
- .radio-item.disabled {
482
- opacity: 0.5;
483
- cursor: not-allowed;
484
- }
485
-
486
- .option-icon {
487
- display: inline-flex;
488
- align-items: center;
489
- justify-content: center;
490
- color: var(--lc-color-text-secondary);
491
- line-height: 1;
492
- }
493
-
494
- .btn.active .option-icon {
495
- color: white;
496
- }
497
-
498
- .ratio-box {
499
- border: 2px solid currentColor;
500
- border-radius: 2px;
501
- background: var(--lc-color-bg-secondary);
502
- box-sizing: border-box;
503
- }
504
-
505
- .select-input {
506
- width: 100%;
507
- padding: var(--lc-spacing-1) var(--lc-spacing-2);
508
- border: 1px solid var(--lc-color-border);
509
- border-radius: var(--lc-radius-sm);
510
- font-size: var(--lc-font-size-sm);
511
- font-family: var(--lc-font-family);
512
- color: var(--lc-color-text);
513
- background: var(--lc-color-bg);
514
- }
515
-
516
- .select-input:focus {
517
- outline: none;
518
- border-color: var(--lc-color-primary);
519
- }
520
- `}get parsedOptions(){try{return JSON.parse(this.options)}catch{return[]}}get selectedValues(){if(Array.isArray(this.value))return this.value;if(this.multiple&&typeof this.value==`string`&&this.value)try{let e=JSON.parse(this.value);if(Array.isArray(e))return e.map(String)}catch{return this.value.split(`,`).map(e=>e.trim()).filter(Boolean)}return typeof this.value==`string`&&this.value?[this.value]:[]}isSelected(e){return this.selectedValues.includes(e)}emitChange(e){this.dispatchEvent(new CustomEvent(b.CHANGE,{detail:{value:e},bubbles:!0,composed:!0}))}getRatioBoxDimensions(e){let[t,n]=e.split(`:`).map(Number),r=32/Math.max(t,n);return{width:Math.round(t*r),height:Math.round(n*r)}}isRatioValue(e){return/^\d+(?:\.\d+)?:\d+(?:\.\d+)?$/.test(e)}renderOptionIcon(t){if(!this.showIcon)return e.nothing;if(t.icon)return e.html`<span class="option-icon" aria-hidden="true">${t.icon}</span>`;if(this.isRatioValue(t.value)){let n=this.getRatioBoxDimensions(t.value);return e.html`
521
- <span class="option-icon" aria-hidden="true">
522
- <span class="ratio-box" style="width: ${n.width}px; height: ${n.height}px;"></span>
523
- </span>
524
- `}return e.nothing}handleSelect(e){let t=e.target;this.value=this.multiple?Array.from(t.selectedOptions).map(e=>e.value):t.value,this.emitChange(this.value)}handleRadioChange(e){let t=e.target;this.value=t.value,this.emitChange(this.value)}handleCheckboxChange(e){let t=e.target,n=new Set(this.selectedValues);t.checked?n.add(t.value):n.delete(t.value),this.value=Array.from(n),this.emitChange(this.value)}handleButtonClick(e){if(!this.multiple){this.value=e,this.emitChange(e);return}let t=new Set(this.selectedValues);t.has(e)?t.delete(e):t.add(e),this.value=Array.from(t),this.emitChange(this.value)}render(){let t=this.parsedOptions;return e.html`
525
- ${this.label?e.html`<label class="label">
526
- ${this.label}${this.required?e.html`<span class="required">*</span>`:e.nothing}
527
- </label>`:e.nothing}
528
- ${this.mode===`button`?this.renderButtonGroup(t):this.mode===`radio`?this.renderRadioGroup(t):this.renderSelect(t)}
529
- `}renderButtonGroup(t){return e.html`
530
- <div class="button-group ${this.showIcon?`with-icon`:``}">
531
- ${t.map(t=>e.html`
532
- <button
533
- type="button"
534
- class="btn ${this.showIcon?`with-icon`:``} ${this.isSelected(t.value)?`active`:``}"
535
- ?disabled=${this.disabled}
536
- aria-pressed=${this.isSelected(t.value)}
537
- @click=${()=>this.handleButtonClick(t.value)}
538
- >
539
- ${this.renderOptionIcon(t)}
540
- ${t.label}
541
- </button>
542
- `)}
543
- </div>
544
- `}renderRadioGroup(t){return e.html`
545
- <div class="radio-group">
546
- ${t.map(t=>e.html`
547
- <label class="radio-item ${this.disabled?`disabled`:``}">
548
- <input
549
- type=${this.multiple?`checkbox`:`radio`}
550
- name="enum-radio"
551
- .value=${t.value}
552
- .checked=${this.isSelected(t.value)}
553
- ?disabled=${this.disabled}
554
- @change=${e=>{this.multiple?this.handleCheckboxChange(e):this.handleRadioChange(e)}}
555
- />
556
- ${this.renderOptionIcon(t)}
557
- ${t.label}
558
- </label>
559
- `)}
560
- </div>
561
- `}renderSelect(t){return e.html`
562
- <select
563
- class="select-input"
564
- .value=${this.multiple?``:String(this.value)}
565
- ?multiple=${this.multiple}
566
- ?disabled=${this.disabled}
567
- @change=${this.handleSelect}
568
- >
569
- ${t.map(t=>e.html`<option value=${t.value} ?selected=${this.isSelected(t.value)}>
570
- ${t.label}
571
- </option>`)}
572
- </select>
573
- `}};w([h({type:String})],D.prototype,`label`,void 0),w([h({type:String})],D.prototype,`name`,void 0),w([h()],D.prototype,`value`,void 0),w([h({type:String})],D.prototype,`mode`,void 0),w([h({type:Boolean})],D.prototype,`multiple`,void 0),w([h({type:Boolean})],D.prototype,`required`,void 0),w([h({type:Boolean})],D.prototype,`disabled`,void 0),w([h({type:Boolean,attribute:`show-icon`})],D.prototype,`showIcon`,void 0),w([h({type:String})],D.prototype,`options`,void 0),D=w([t(`lc-enum-selector`)],D);var O=class extends e.LitElement{constructor(...e){super(...e),this.value=``,this.name=``,this.label=``,this.placeholder=``,this.maxLength=500,this.required=!1,this.disabled=!1}static{this.styles=e.css`
574
- :host {
575
- display: block;
576
- font-family: var(--lc-font-family);
577
- }
578
-
579
- .label {
580
- display: block;
581
- font-size: var(--lc-font-size-sm);
582
- color: var(--lc-color-text);
583
- margin-bottom: var(--lc-spacing-2);
584
- }
585
-
586
- .label .required {
587
- color: var(--lc-color-error);
588
- margin-left: 2px;
589
- }
590
-
591
- .wrapper {
592
- position: relative;
593
- }
594
-
595
- textarea {
596
- width: 100%;
597
- min-height: 80px;
598
- padding: var(--lc-spacing-3);
599
- border: 1px solid var(--lc-color-border);
600
- border-radius: var(--lc-radius-component);
601
- font-family: var(--lc-font-family);
602
- font-size: var(--lc-font-size-sm);
603
- color: var(--lc-color-text);
604
- resize: vertical;
605
- outline: none;
606
- transition: border-color var(--lc-transition-fast);
607
- box-sizing: border-box;
608
- }
609
-
610
- textarea:focus {
611
- border-color: var(--lc-color-primary);
612
- }
613
-
614
- textarea::placeholder {
615
- color: var(--lc-color-text-placeholder);
616
- }
617
-
618
- textarea:disabled {
619
- opacity: 0.5;
620
- cursor: not-allowed;
621
- }
622
-
623
- .counter {
624
- text-align: right;
625
- font-size: var(--lc-font-size-xs);
626
- color: var(--lc-color-text-secondary);
627
- margin-top: var(--lc-spacing-1);
628
- }
629
-
630
- .counter.over {
631
- color: var(--lc-color-error);
632
- }
633
- `}emitChange(e){this.dispatchEvent(new CustomEvent(b.CHANGE,{detail:{value:e},bubbles:!0,composed:!0}))}handleInput(e){let t=e.target;this.value=t.value,this.emitChange(this.value)}render(){let t=this.value.length>this.maxLength;return e.html`
634
- ${this.label?e.html`<label class="label">
635
- ${this.label}${this.required?e.html`<span class="required">*</span>`:e.nothing}
636
- </label>`:e.nothing}
637
- <div class="wrapper">
638
- <textarea
639
- .value=${this.value}
640
- .placeholder=${this.placeholder}
641
- ?disabled=${this.disabled}
642
- .maxLength=${this.maxLength}
643
- @input=${this.handleInput}
644
- ></textarea>
645
- </div>
646
- <div class="counter ${t?`over`:``}">
647
- ${this.value.length}/${this.maxLength}
648
- </div>
649
- `}};w([h({type:String})],O.prototype,`value`,void 0),w([h({type:String})],O.prototype,`name`,void 0),w([h({type:String})],O.prototype,`label`,void 0),w([h({type:String})],O.prototype,`placeholder`,void 0),w([h({type:Number})],O.prototype,`maxLength`,void 0),w([h({type:Boolean})],O.prototype,`required`,void 0),w([h({type:Boolean})],O.prototype,`disabled`,void 0),O=w([t(`lc-prompt-input`)],O);var Je=globalThis,Ye=e=>e,k=Je.trustedTypes,Xe=k?k.createPolicy(`lit-html`,{createHTML:e=>e}):void 0,Ze=`$lit$`,A=`lit$${Math.random().toFixed(9).slice(2)}$`,Qe=`?`+A,$e=`<${Qe}>`,j=document,M=()=>j.createComment(``),N=e=>e===null||typeof e!=`object`&&typeof e!=`function`,et=Array.isArray,tt=e=>et(e)||typeof e?.[Symbol.iterator]==`function`,P=`[
650
- \f\r]`,F=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,nt=/-->/g,rt=/>/g,I=RegExp(`>|${P}(?:([^\\s"'>=/]+)(${P}*=${P}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,`g`),it=/'/g,at=/"/g,ot=/^(?:script|style|textarea|title)$/i,L=Symbol.for(`lit-noChange`),R=Symbol.for(`lit-nothing`),st=new WeakMap,z=j.createTreeWalker(j,129);function ct(e,t){if(!et(e)||!e.hasOwnProperty(`raw`))throw Error(`invalid template strings array`);return Xe===void 0?t:Xe.createHTML(t)}var lt=(e,t)=>{let n=e.length-1,r=[],i,a=t===2?`<svg>`:t===3?`<math>`:``,o=F;for(let t=0;t<n;t++){let n=e[t],s,c,l=-1,u=0;for(;u<n.length&&(o.lastIndex=u,c=o.exec(n),c!==null);)u=o.lastIndex,o===F?c[1]===`!--`?o=nt:c[1]===void 0?c[2]===void 0?c[3]!==void 0&&(o=I):(ot.test(c[2])&&(i=RegExp(`</`+c[2],`g`)),o=I):o=rt:o===I?c[0]===`>`?(o=i??F,l=-1):c[1]===void 0?l=-2:(l=o.lastIndex-c[2].length,s=c[1],o=c[3]===void 0?I:c[3]===`"`?at:it):o===at||o===it?o=I:o===nt||o===rt?o=F:(o=I,i=void 0);let ee=o===I&&e[t+1].startsWith(`/>`)?` `:``;a+=o===F?n+$e:l>=0?(r.push(s),n.slice(0,l)+Ze+n.slice(l)+A+ee):n+A+(l===-2?t:ee)}return[ct(e,a+(e[n]||`<?>`)+(t===2?`</svg>`:t===3?`</math>`:``)),r]},ut=class e{constructor({strings:t,_$litType$:n},r){let i;this.parts=[];let a=0,o=0,s=t.length-1,c=this.parts,[l,u]=lt(t,n);if(this.el=e.createElement(l,r),z.currentNode=this.el.content,n===2||n===3){let e=this.el.content.firstChild;e.replaceWith(...e.childNodes)}for(;(i=z.nextNode())!==null&&c.length<s;){if(i.nodeType===1){if(i.hasAttributes())for(let e of i.getAttributeNames())if(e.endsWith(Ze)){let t=u[o++],n=i.getAttribute(e).split(A),r=/([.?@])?(.*)/.exec(t);c.push({type:1,index:a,name:r[2],strings:n,ctor:r[1]===`.`?pt:r[1]===`?`?mt:r[1]===`@`?ht:V}),i.removeAttribute(e)}else e.startsWith(A)&&(c.push({type:6,index:a}),i.removeAttribute(e));if(ot.test(i.tagName)){let e=i.textContent.split(A),t=e.length-1;if(t>0){i.textContent=k?k.emptyScript:``;for(let n=0;n<t;n++)i.append(e[n],M()),z.nextNode(),c.push({type:2,index:++a});i.append(e[t],M())}}}else if(i.nodeType===8)if(i.data===Qe)c.push({type:2,index:a});else{let e=-1;for(;(e=i.data.indexOf(A,e+1))!==-1;)c.push({type:7,index:a}),e+=A.length-1}a++}}static createElement(e,t){let n=j.createElement(`template`);return n.innerHTML=e,n}};function B(e,t,n=e,r){if(t===L)return t;let i=r===void 0?n._$Cl:n._$Co?.[r],a=N(t)?void 0:t._$litDirective$;return i?.constructor!==a&&(i?._$AO?.(!1),a===void 0?i=void 0:(i=new a(e),i._$AT(e,n,r)),r===void 0?n._$Cl=i:(n._$Co??=[])[r]=i),i!==void 0&&(t=B(e,i._$AS(e,t.values),i,r)),t}var dt=class{constructor(e,t){this._$AV=[],this._$AN=void 0,this._$AD=e,this._$AM=t}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(e){let{el:{content:t},parts:n}=this._$AD,r=(e?.creationScope??j).importNode(t,!0);z.currentNode=r;let i=z.nextNode(),a=0,o=0,s=n[0];for(;s!==void 0;){if(a===s.index){let t;s.type===2?t=new ft(i,i.nextSibling,this,e):s.type===1?t=new s.ctor(i,s.name,s.strings,this,e):s.type===6&&(t=new gt(i,this,e)),this._$AV.push(t),s=n[++o]}a!==s?.index&&(i=z.nextNode(),a++)}return z.currentNode=j,r}p(e){let t=0;for(let n of this._$AV)n!==void 0&&(n.strings===void 0?n._$AI(e[t]):(n._$AI(e,n,t),t+=n.strings.length-2)),t++}},ft=class e{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(e,t,n,r){this.type=2,this._$AH=R,this._$AN=void 0,this._$AA=e,this._$AB=t,this._$AM=n,this.options=r,this._$Cv=r?.isConnected??!0}get parentNode(){let e=this._$AA.parentNode,t=this._$AM;return t!==void 0&&e?.nodeType===11&&(e=t.parentNode),e}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(e,t=this){e=B(this,e,t),N(e)?e===R||e==null||e===``?(this._$AH!==R&&this._$AR(),this._$AH=R):e!==this._$AH&&e!==L&&this._(e):e._$litType$===void 0?e.nodeType===void 0?tt(e)?this.k(e):this._(e):this.T(e):this.$(e)}O(e){return this._$AA.parentNode.insertBefore(e,this._$AB)}T(e){this._$AH!==e&&(this._$AR(),this._$AH=this.O(e))}_(e){this._$AH!==R&&N(this._$AH)?this._$AA.nextSibling.data=e:this.T(j.createTextNode(e)),this._$AH=e}$(e){let{values:t,_$litType$:n}=e,r=typeof n==`number`?this._$AC(e):(n.el===void 0&&(n.el=ut.createElement(ct(n.h,n.h[0]),this.options)),n);if(this._$AH?._$AD===r)this._$AH.p(t);else{let e=new dt(r,this),n=e.u(this.options);e.p(t),this.T(n),this._$AH=e}}_$AC(e){let t=st.get(e.strings);return t===void 0&&st.set(e.strings,t=new ut(e)),t}k(t){et(this._$AH)||(this._$AH=[],this._$AR());let n=this._$AH,r,i=0;for(let a of t)i===n.length?n.push(r=new e(this.O(M()),this.O(M()),this,this.options)):r=n[i],r._$AI(a),i++;i<n.length&&(this._$AR(r&&r._$AB.nextSibling,i),n.length=i)}_$AR(e=this._$AA.nextSibling,t){for(this._$AP?.(!1,!0,t);e!==this._$AB;){let t=Ye(e).nextSibling;Ye(e).remove(),e=t}}setConnected(e){this._$AM===void 0&&(this._$Cv=e,this._$AP?.(e))}},V=class{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(e,t,n,r,i){this.type=1,this._$AH=R,this._$AN=void 0,this.element=e,this.name=t,this._$AM=r,this.options=i,n.length>2||n[0]!==``||n[1]!==``?(this._$AH=Array(n.length-1).fill(new String),this.strings=n):this._$AH=R}_$AI(e,t=this,n,r){let i=this.strings,a=!1;if(i===void 0)e=B(this,e,t,0),a=!N(e)||e!==this._$AH&&e!==L,a&&(this._$AH=e);else{let r=e,o,s;for(e=i[0],o=0;o<i.length-1;o++)s=B(this,r[n+o],t,o),s===L&&(s=this._$AH[o]),a||=!N(s)||s!==this._$AH[o],s===R?e=R:e!==R&&(e+=(s??``)+i[o+1]),this._$AH[o]=s}a&&!r&&this.j(e)}j(e){e===R?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,e??``)}},pt=class extends V{constructor(){super(...arguments),this.type=3}j(e){this.element[this.name]=e===R?void 0:e}},mt=class extends V{constructor(){super(...arguments),this.type=4}j(e){this.element.toggleAttribute(this.name,!!e&&e!==R)}},ht=class extends V{constructor(e,t,n,r,i){super(e,t,n,r,i),this.type=5}_$AI(e,t=this){if((e=B(this,e,t,0)??R)===L)return;let n=this._$AH,r=e===R&&n!==R||e.capture!==n.capture||e.once!==n.once||e.passive!==n.passive,i=e!==R&&(n===R||r);r&&this.element.removeEventListener(this.name,this,n),i&&this.element.addEventListener(this.name,this,e),this._$AH=e}handleEvent(e){typeof this._$AH==`function`?this._$AH.call(this.options?.host??this.element,e):this._$AH.handleEvent(e)}},gt=class{constructor(e,t,n){this.element=e,this.type=6,this._$AN=void 0,this._$AM=t,this.options=n}get _$AU(){return this._$AM._$AU}_$AI(e){B(this,e)}},_t={M:Ze,P:A,A:Qe,C:1,L:lt,R:dt,D:tt,V:B,I:ft,H:V,N:mt,U:ht,B:pt,F:gt},vt=Je.litHtmlPolyfillSupport;vt?.(ut,ft),(Je.litHtmlVersions??=[]).push(`3.3.3`);var{I:yt}=_t,bt=e=>e.strings===void 0,xt={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4,EVENT:5,ELEMENT:6},St=e=>(...t)=>({_$litDirective$:e,values:t}),Ct=class{constructor(e){}get _$AU(){return this._$AM._$AU}_$AT(e,t,n){this._$Ct=e,this._$AM=t,this._$Ci=n}_$AS(e,t){return this.update(e,t)}update(e,t){return this.render(...t)}},H=(e,t)=>{let n=e._$AN;if(n===void 0)return!1;for(let e of n)e._$AO?.(t,!1),H(e,t);return!0},U=e=>{let t,n;do{if((t=e._$AM)===void 0)break;n=t._$AN,n.delete(e),e=t}while(n?.size===0)},wt=e=>{for(let t;t=e._$AM;e=t){let n=t._$AN;if(n===void 0)t._$AN=n=new Set;else if(n.has(e))break;n.add(e),Dt(t)}};function Tt(e){this._$AN===void 0?this._$AM=e:(U(this),this._$AM=e,wt(this))}function Et(e,t=!1,n=0){let r=this._$AH,i=this._$AN;if(i!==void 0&&i.size!==0)if(t)if(Array.isArray(r))for(let e=n;e<r.length;e++)H(r[e],!1),U(r[e]);else r!=null&&(H(r,!1),U(r));else H(this,e)}var Dt=e=>{e.type==xt.CHILD&&(e._$AP??=Et,e._$AQ??=Tt)},Ot=class extends Ct{constructor(){super(...arguments),this._$AN=void 0}_$AT(e,t,n){super._$AT(e,t,n),wt(this),this.isConnected=e._$AU}_$AO(e,t=!0){e!==this.isConnected&&(this.isConnected=e,e?this.reconnected?.():this.disconnected?.()),t&&(H(this,e),U(this))}setValue(e){if(bt(this._$Ct))this._$Ct._$AI(e,this);else{let t=[...this._$Ct._$AH];t[this._$Ci]=e,this._$Ct._$AI(t,this,0)}}disconnected(){}reconnected(){}},kt=()=>new At,At=class{},jt=new WeakMap,Mt=St(class extends Ot{render(e){return R}update(e,[t]){let n=t!==this.G;return n&&this.rt(void 0),(n||this.lt!==this.ct)&&(this.G=t,this.ht=e.options?.host,this.rt(this.ct=e.element)),R}rt(e){if(this.G!==void 0)if(this.isConnected||(e=void 0),typeof this.G==`function`){let t=this.ht??globalThis,n=jt.get(t);n===void 0&&(n=new WeakMap,jt.set(t,n)),n.get(this.G)!==void 0&&this.G.call(this.ht,void 0),n.set(this.G,e),e!==void 0&&this.G.call(this.ht,e)}else this.G.value=e}get lt(){return typeof this.G==`function`?jt.get(this.ht??globalThis)?.get(this.G):this.G?.value}disconnected(){this.lt===this.ct&&this.rt(void 0)}reconnected(){this.rt(this.ct)}}),W=class extends e.LitElement{constructor(...e){super(...e),this.value=``,this.name=``,this.label=``,this.disabled=!1,this.colorInputRef=kt()}static{this.styles=e.css`
651
- :host {
652
- display: block;
653
- font-family: var(--lc-font-family);
654
- }
655
-
656
- .label {
657
- display: block;
658
- font-size: var(--lc-font-size-sm);
659
- color: var(--lc-color-text);
660
- margin-bottom: var(--lc-spacing-2);
661
- }
662
-
663
- .container {
664
- display: flex;
665
- align-items: center;
666
- gap: var(--lc-spacing-3);
667
- }
668
-
669
- .preview {
670
- width: 40px;
671
- height: 40px;
672
- border-radius: var(--lc-radius-sm);
673
- border: 1px solid var(--lc-color-border);
674
- cursor: pointer;
675
- flex-shrink: 0;
676
- transition: border-color var(--lc-transition-fast);
677
- }
678
-
679
- .preview:hover {
680
- border-color: var(--lc-color-primary);
681
- }
682
-
683
- .preview.disabled {
684
- opacity: 0.5;
685
- cursor: not-allowed;
686
- }
687
-
688
- .hex-input {
689
- padding: var(--lc-spacing-1) var(--lc-spacing-2);
690
- border: 1px solid var(--lc-color-border);
691
- border-radius: var(--lc-radius-sm);
692
- font-size: var(--lc-font-size-sm);
693
- font-family: var(--lc-font-family);
694
- width: 100px;
695
- color: var(--lc-color-text);
696
- outline: none;
697
- transition: border-color var(--lc-transition-fast);
698
- }
699
-
700
- .hex-input:focus {
701
- border-color: var(--lc-color-primary);
702
- }
703
-
704
- .hex-input:disabled {
705
- opacity: 0.5;
706
- cursor: not-allowed;
707
- }
708
-
709
- .hidden {
710
- position: absolute;
711
- opacity: 0;
712
- width: 0;
713
- height: 0;
714
- pointer-events: none;
715
- }
716
- `}emitChange(e){this.dispatchEvent(new CustomEvent(b.CHANGE,{detail:{value:e},bubbles:!0,composed:!0}))}handleHexInput(e){let t=e.target.value.trim();t&&!t.startsWith(`#`)&&(t=`#`+t),this.value=t,this.emitChange(this.value)}handleColorInput(e){let t=e.target;this.value=t.value,this.emitChange(this.value)}openPicker(){!this.disabled&&this.colorInputRef.value&&this.colorInputRef.value.click()}render(){let t=this.value||`#000000`;return e.html`
717
- ${this.label?e.html`<label class="label">${this.label}</label>`:e.nothing}
718
- <div class="container">
719
- <input
720
- class="hidden"
721
- type="color"
722
- .value=${t}
723
- ?disabled=${this.disabled}
724
- @input=${this.handleColorInput}
725
- ${Mt(this.colorInputRef)}
726
- />
727
- <div
728
- class="preview ${this.disabled?`disabled`:``}"
729
- style="background-color: ${t};"
730
- @click=${this.openPicker}
731
- ></div>
732
- <input
733
- class="hex-input"
734
- type="text"
735
- .value=${this.value}
736
- ?disabled=${this.disabled}
737
- placeholder="#000000"
738
- @input=${this.handleHexInput}
739
- />
740
- </div>
741
- `}};w([h({type:String})],W.prototype,`value`,void 0),w([h({type:String})],W.prototype,`name`,void 0),w([h({type:String})],W.prototype,`label`,void 0),w([h({type:Boolean})],W.prototype,`disabled`,void 0),W=w([t(`lc-color-picker`)],W);var G=class extends e.LitElement{constructor(...e){super(...e),this.value=.5,this.min=0,this.max=1,this.step=.1,this.name=``,this.label=``,this.disabled=!1}static{this.styles=e.css`
742
- :host {
743
- display: block;
744
- font-family: var(--lc-font-family);
745
- }
746
-
747
- .label {
748
- display: block;
749
- font-size: var(--lc-font-size-sm);
750
- color: var(--lc-color-text);
751
- margin-bottom: var(--lc-spacing-2);
752
- }
753
-
754
- .container {
755
- display: flex;
756
- align-items: center;
757
- gap: var(--lc-spacing-3);
758
- }
759
-
760
- input[type='range'] {
761
- flex: 1;
762
- accent-color: var(--lc-color-primary);
763
- }
764
-
765
- input[type='range']:disabled {
766
- opacity: 0.5;
767
- }
768
-
769
- .value-display {
770
- min-width: 32px;
771
- text-align: center;
772
- font-size: var(--lc-font-size-sm);
773
- color: var(--lc-color-text);
774
- }
775
- `}emitChange(e){this.dispatchEvent(new CustomEvent(b.CHANGE,{detail:{value:e},bubbles:!0,composed:!0}))}handleInput(e){let t=e.target;this.value=parseFloat(t.value),this.emitChange(this.value)}render(){return e.html`
776
- ${this.label?e.html`<label class="label">${this.label}</label>`:e.nothing}
777
- <div class="container">
778
- <input
779
- type="range"
780
- .min=${String(this.min)}
781
- .max=${String(this.max)}
782
- .step=${String(this.step)}
783
- .value=${String(this.value)}
784
- ?disabled=${this.disabled}
785
- @input=${this.handleInput}
786
- />
787
- <span class="value-display">${this.value}</span>
788
- </div>
789
- `}};w([h({type:Number})],G.prototype,`value`,void 0),w([h({type:Number})],G.prototype,`min`,void 0),w([h({type:Number})],G.prototype,`max`,void 0),w([h({type:Number})],G.prototype,`step`,void 0),w([h({type:String})],G.prototype,`name`,void 0),w([h({type:String})],G.prototype,`label`,void 0),w([h({type:Boolean})],G.prototype,`disabled`,void 0),G=w([t(`lc-strength-slider`)],G);var Nt={pending:`等待中`,running:`运行中`,done:`已完成`,exception:`异常`},K=class extends e.LitElement{constructor(...e){super(...e),this.taskId=``,this.status=`pending`,this.progress=0,this.queuePos=-1,this.errorMessage=``,this.submittedAt=0}static{this.styles=e.css`
790
- :host {
791
- display: block;
792
- --lc-progress-height: 8px;
793
- --lc-progress-bg: var(--lc-color-gray-100);
794
- --lc-progress-fill: var(--lc-color-primary);
795
- --lc-progress-radius: var(--lc-radius-full);
796
- --lc-card-padding: var(--lc-spacing-4);
797
- --lc-card-bg: var(--lc-color-bg);
798
- --lc-card-border: 1px solid var(--lc-color-border);
799
- --lc-card-radius: var(--lc-radius-lg);
800
- }
801
-
802
- .card {
803
- padding: var(--lc-card-padding);
804
- background: var(--lc-card-bg);
805
- border: var(--lc-card-border);
806
- border-radius: var(--lc-card-radius);
807
- font-family: var(--lc-font-family);
808
- }
809
-
810
- .title {
811
- font-size: var(--lc-font-size-sm);
812
- font-weight: 500;
813
- color: var(--lc-color-text);
814
- margin-bottom: var(--lc-spacing-3);
815
- }
816
-
817
- .progress-track {
818
- height: var(--lc-progress-height);
819
- background: var(--lc-progress-bg);
820
- border-radius: var(--lc-progress-radius);
821
- overflow: hidden;
822
- margin-bottom: var(--lc-spacing-3);
823
- }
824
-
825
- .progress-fill {
826
- height: 100%;
827
- background: var(--lc-progress-fill);
828
- border-radius: var(--lc-progress-radius);
829
- transition: width var(--lc-transition-normal);
830
- }
831
-
832
- .progress-text {
833
- font-size: var(--lc-font-size-xs);
834
- color: var(--lc-color-text-secondary);
835
- margin-bottom: var(--lc-spacing-2);
836
- text-align: right;
837
- }
838
-
839
- .meta {
840
- display: flex;
841
- align-items: center;
842
- gap: var(--lc-spacing-2);
843
- font-size: var(--lc-font-size-xs);
844
- color: var(--lc-color-text-secondary);
845
- }
846
-
847
- .status-dot {
848
- display: inline-block;
849
- width: 8px;
850
- height: 8px;
851
- border-radius: 50%;
852
- }
853
-
854
- .separator {
855
- color: var(--lc-color-gray-300);
856
- }
857
-
858
- .error-message {
859
- margin-top: var(--lc-spacing-2);
860
- font-size: var(--lc-font-size-xs);
861
- color: var(--lc-color-error);
862
- }
863
- `}getStatusColor(){switch(this.status){case`pending`:return`var(--lc-color-gray-300)`;case`running`:return`var(--lc-color-primary)`;case`done`:return`var(--lc-color-success)`;case`exception`:return`var(--lc-color-error)`}}formatTime(e){return e?new Date(e).toLocaleString(`zh-CN`):``}render(){let t=Math.max(0,Math.min(1,this.progress)),n=`width: ${t*100}%`,r=`background: ${this.getStatusColor()}`;return e.html`
864
- <div class="card" part="card">
865
- <div class="title">任务 #${this.taskId}</div>
866
- <div class="progress-text">${Math.round(t*100)}%</div>
867
- <div class="progress-track" part="progress-bar">
868
- <div class="progress-fill" style=${n} part="progress-fill"></div>
869
- </div>
870
- <div class="meta">
871
- <span class="status-dot" style=${r}></span>
872
- <span part="status">${Nt[this.status]}</span>
873
- ${this.queuePos>=0?e.html`<span class="separator">·</span><span>队列位置: ${this.queuePos}</span>`:null}
874
- </div>
875
- ${this.submittedAt?e.html`<div class="meta" style="margin-top: var(--lc-spacing-1)">
876
- 提交时间: ${this.formatTime(this.submittedAt)}
877
- </div>`:null}
878
- ${this.status===`exception`&&this.errorMessage?e.html`<div class="error-message">${this.errorMessage}</div>`:null}
879
- </div>
880
- `}};w([h({type:String})],K.prototype,`taskId`,void 0),w([h({type:String})],K.prototype,`status`,void 0),w([h({type:Number})],K.prototype,`progress`,void 0),w([h({type:Number})],K.prototype,`queuePos`,void 0),w([h({type:String})],K.prototype,`errorMessage`,void 0),w([h({type:Number})],K.prototype,`submittedAt`,void 0),K=w([t(`lc-task-progress-card`)],K);var q=class extends e.LitElement{constructor(...e){super(...e),this.images=`[]`,this.originalUrl=``,this.showDownload=!0}static{this.styles=e.css`
881
- :host {
882
- display: block;
883
- --lc-gallery-gap: var(--lc-spacing-3);
884
- --lc-gallery-item-radius: var(--lc-radius-md);
885
- --lc-gallery-overlay-bg: rgba(0, 0, 0, 0.6);
886
- }
887
-
888
- .gallery {
889
- display: grid;
890
- grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
891
- gap: var(--lc-gallery-gap);
892
- }
893
-
894
- .image-item {
895
- position: relative;
896
- border-radius: var(--lc-gallery-item-radius);
897
- overflow: hidden;
898
- cursor: pointer;
899
- }
900
-
901
- .image-item img {
902
- display: block;
903
- width: 100%;
904
- height: auto;
905
- border-radius: var(--lc-gallery-item-radius);
906
- }
907
-
908
- .overlay {
909
- position: absolute;
910
- inset: 0;
911
- display: flex;
912
- align-items: center;
913
- justify-content: center;
914
- gap: var(--lc-spacing-2);
915
- background: var(--lc-gallery-overlay-bg);
916
- opacity: 0;
917
- transition: opacity var(--lc-transition-fast);
918
- }
919
-
920
- .image-item:hover .overlay {
921
- opacity: 1;
922
- }
923
-
924
- .action-btn {
925
- display: flex;
926
- align-items: center;
927
- justify-content: center;
928
- width: 36px;
929
- height: 36px;
930
- border-radius: var(--lc-radius-sm);
931
- background: rgba(255, 255, 255, 0.9);
932
- color: var(--lc-color-gray-900);
933
- font-size: var(--lc-font-size-base);
934
- text-decoration: none;
935
- border: none;
936
- cursor: pointer;
937
- }
938
-
939
- .action-btn:hover {
940
- background: white;
941
- }
942
- `}getParsedImages(){try{let e=JSON.parse(this.images);return Array.isArray(e)?e:[]}catch{return[]}}_onImageClick(e){this.dispatchEvent(new CustomEvent(b.IMAGE_CLICK,{detail:{index:e.index,url:e.url},bubbles:!0,composed:!0}))}_onCompare(e){this.dispatchEvent(new CustomEvent(b.COMPARE,{detail:{originalUrl:this.originalUrl,resultUrl:e},bubbles:!0,composed:!0}))}renderImageItem(t){return e.html`
943
- <div class="image-item" @click=${()=>this._onImageClick(t)}>
944
- <img src="${t.url}" alt="结果 ${t.index+1}">
945
- <div class="overlay">
946
- ${this.showDownload?e.html`<a class="action-btn" href="${t.url}" download title="下载">&#11015;</a>`:e.nothing}
947
- ${this.originalUrl?e.html`<button class="action-btn" @click=${e=>{e.stopPropagation(),this._onCompare(t.url)}} title="对比">&#8801;</button>`:e.nothing}
948
- </div>
949
- </div>
950
- `}render(){return e.html`
951
- <div class="gallery">
952
- ${this.getParsedImages().map(e=>this.renderImageItem(e))}
953
- </div>
954
- `}};w([h({type:String})],q.prototype,`images`,void 0),w([h({type:String})],q.prototype,`originalUrl`,void 0),w([h({type:Boolean})],q.prototype,`showDownload`,void 0),q=w([t(`lc-result-gallery`)],q);var J=class extends e.LitElement{constructor(...e){super(...e),this.beforeSrc=``,this.afterSrc=``,this.beforeLabel=`原图`,this.afterLabel=`结果`,this._position=50}static{this.styles=e.css`
955
- :host {
956
- display: block;
957
- --lc-compare-width: 100%;
958
- --lc-compare-max-height: 500px;
959
- --lc-slider-width: 2px;
960
- --lc-slider-color: white;
961
- --lc-handle-size: 40px;
962
- --lc-handle-color: white;
963
- --lc-handle-shadow: var(--lc-shadow-md);
964
- }
965
-
966
- .compare-container {
967
- position: relative;
968
- width: var(--lc-compare-width);
969
- max-height: var(--lc-compare-max-height);
970
- overflow: hidden;
971
- user-select: none;
972
- }
973
-
974
- .compare-container img {
975
- display: block;
976
- width: 100%;
977
- height: auto;
978
- }
979
-
980
- .after-wrapper {
981
- position: relative;
982
- }
983
-
984
- .before-image {
985
- position: absolute;
986
- top: 0;
987
- left: 0;
988
- width: 100%;
989
- height: 100%;
990
- object-fit: cover;
991
- }
992
-
993
- .slider-handle {
994
- position: absolute;
995
- top: 0;
996
- bottom: 0;
997
- width: var(--lc-slider-width);
998
- background: var(--lc-slider-color);
999
- cursor: ew-resize;
1000
- z-index: 2;
1001
- transform: translateX(-50%);
1002
- }
1003
-
1004
- .slider-handle::after {
1005
- content: '\\27F7';
1006
- position: absolute;
1007
- top: 50%;
1008
- left: 50%;
1009
- transform: translate(-50%, -50%);
1010
- width: var(--lc-handle-size);
1011
- height: var(--lc-handle-size);
1012
- border-radius: 50%;
1013
- background: var(--lc-handle-color);
1014
- box-shadow: var(--lc-handle-shadow);
1015
- display: flex;
1016
- align-items: center;
1017
- justify-content: center;
1018
- font-size: 14px;
1019
- }
1020
-
1021
- .label {
1022
- position: absolute;
1023
- bottom: 8px;
1024
- padding: 2px 8px;
1025
- border-radius: var(--lc-radius-sm);
1026
- background: rgba(0, 0, 0, 0.5);
1027
- color: white;
1028
- font-size: var(--lc-font-size-xs);
1029
- z-index: 3;
1030
- }
1031
-
1032
- .label-before { left: 8px; }
1033
- .label-after { right: 8px; }
1034
- `}_onPointerDown(e){e.currentTarget.setPointerCapture(e.pointerId)}_onPointerMove(e){let t=this.shadowRoot?.querySelector(`.compare-container`);if(!t)return;let n=t.getBoundingClientRect(),r=e.clientX-n.left;this._position=Math.max(0,Math.min(100,r/n.width*100))}render(){let t=`clip-path: inset(0 0 0 ${this._position}%)`,n=`left: ${this._position}%`;return e.html`
1035
- <div class="compare-container" part="container">
1036
- <div class="after-wrapper">
1037
- <img src="${this.afterSrc}" alt="${this.afterLabel}">
1038
- </div>
1039
- <img class="before-image" src="${this.beforeSrc}" alt="${this.beforeLabel}" style=${t}>
1040
- <div
1041
- class="slider-handle"
1042
- part="slider"
1043
- style=${n}
1044
- @pointerdown=${this._onPointerDown}
1045
- @pointermove=${this._onPointerMove}
1046
- ></div>
1047
- <span class="label label-before">${this.beforeLabel}</span>
1048
- <span class="label label-after">${this.afterLabel}</span>
1049
- </div>
1050
- `}};w([h({type:String})],J.prototype,`beforeSrc`,void 0),w([h({type:String})],J.prototype,`afterSrc`,void 0),w([h({type:String})],J.prototype,`beforeLabel`,void 0),w([h({type:String})],J.prototype,`afterLabel`,void 0),w([g()],J.prototype,`_position`,void 0),J=w([t(`lc-image-compare-slider`)],J);var Pt={GeneratePrinting:{key:`GeneratePrinting`,title:`图案设计`,description:`上传1-2张灵感素材图进行融合发散设计`,fields:[{name:`imgUrlList`,label:`灵感素材图`,type:`images`,required:!0,hint:`上传1-2张灵感素材图`},{name:`prompt`,label:`图案风格`,type:`text`,required:!0,placeholder:`描述想要的图案风格`},{name:`aspectRatio`,label:`比例`,type:`aspectRatio`}]},VirtualFitting:{key:`VirtualFitting`,title:`AI试衣`,description:`上传服装图片生成模特上身效果图`,fields:[{name:`imgUrl`,label:`上装图片`,type:`image`,required:!0,hint:`挂拍图/人台图/平铺图`},{name:`lowerImgUrl`,label:`下装图片`,type:`image`},{name:`prompt`,label:`试衣需求`,type:`text`,placeholder:`描述试衣需求`},{name:`aspectRatio`,label:`比例`,type:`aspectRatio`}]},FixFace:{key:`FixFace`,title:`面部优化`,description:`智能修复模特脸部畸形`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0}]},ChangeFace:{key:`ChangeFace`,title:`面部替换`,description:`上传指定面部图片替换模特面容`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0},{name:`refImgUrl`,label:`参考面部图`,type:`image`,required:!0}]},MultiPerspective:{key:`MultiPerspective`,title:`多视角`,description:`生成不同角度的展示效果图`,fields:[{name:`imgUrl`,label:`图片`,type:`image`,required:!0},{name:`perspective`,label:`视角`,type:`enum`,required:!0,options:Ae}]},PrintingTiling:{key:`PrintingTiling`,title:`图案印染上身`,description:`将指定图案虚拟印染到款式图上`,fields:[{name:`imgUrl`,label:`款式图`,type:`image`,required:!0},{name:`maskUrl`,label:`蒙版`,type:`mask`},{name:`printingImgUrl`,label:`印花图案`,type:`image`,required:!0},{name:`prompt`,label:`印染需求`,type:`text`,placeholder:`描述印染需求`}]},ChangeDesignPoint:{key:`ChangeDesignPoint`,title:`设计点修改`,description:`通过参考图实现设计点修改或融合`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`maskUrl`,label:`蒙版`,type:`mask`},{name:`refImgUrl`,label:`参考图`,type:`image`},{name:`prompt`,label:`修改需求`,type:`text`,placeholder:`描述修改需求`}]},ChangeColor:{key:`ChangeColor`,title:`服装改色`,description:`自定义区域一键换色`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`maskUrl`,label:`改色区域蒙版`,type:`mask`,required:!0},{name:`hexCode`,label:`目标颜色`,type:`color`,required:!0}]},ChangeFabric:{key:`ChangeFabric`,title:`面料上身`,description:`将指定面料一键上身到款式图`,fields:[{name:`imgUrl`,label:`款式图/模特图`,type:`image`,required:!0},{name:`maskUrl`,label:`蒙版`,type:`mask`,required:!0},{name:`fabricImgUrl`,label:`面料图`,type:`image`,required:!0}]},Sr:{key:`Sr`,title:`高清放大`,description:`无损高清放大与细节强化`,fields:[{name:`imgUrl`,label:`图片`,type:`image`,required:!0},{name:`scale`,label:`放大倍数`,type:`enum`,required:!0,options:je}]},VectorConvert:{key:`VectorConvert`,title:`矢量图转换`,description:`生成可编辑的矢量格式文件`,fields:[{name:`imgUrl`,label:`图片`,type:`image`,required:!0},{name:`patternType`,label:`图案类型`,type:`enum`,required:!0,options:Me}]},ChangeModel:{key:`ChangeModel`,title:`模特更换`,description:`一键更换模特并支持自定义选择`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0},{name:`gender`,label:`性别`,type:`enum`,options:S},{name:`age`,label:`年龄`,type:`enum`,options:Ne},{name:`race`,label:`人种`,type:`enum`,options:Pe}]},GenerateSketch:{key:`GenerateSketch`,title:`平铺图转线稿`,description:`上传平铺图生成线稿`,fields:[{name:`imgUrl`,label:`平铺图`,type:`image`,required:!0}]},ModelGenerateSketch:{key:`ModelGenerateSketch`,title:`模特图转线稿`,description:`上传模特图生成线稿`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0},{name:`position`,label:`服装位置`,type:`enum`,options:Fe}]},Eliminate:{key:`Eliminate`,title:`AI消除`,description:`一键消除指定元素`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`maskUrl`,label:`消除区域蒙版`,type:`mask`,required:!0}]},ExpandImage:{key:`ExpandImage`,title:`AI扩图`,description:`一键扩充人物或背景`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`maskUrl`,label:`扩图区域蒙版`,type:`mask`,required:!0}]},ClothingDesign:{key:`ClothingDesign`,title:`AI创款`,description:`根据灵感图快速创款`,fields:[{name:`imgUrlList`,label:`灵感款式图`,type:`images`,hint:`上传1-3张灵感图`},{name:`fabricImgUrl`,label:`面料图`,type:`image`,hint:`上传面料图进行面料创款`},{name:`words`,label:`创款需求`,type:`text`,placeholder:`描述创款需求`},{name:`aspectRatio`,label:`比例`,type:`aspectRatio`}]},ChangePattern:{key:`ChangePattern`,title:`服装改版`,description:`通过选择部位和版型修改服装版型`,fields:[{name:`imgUrl`,label:`服装图`,type:`image`,required:!0},{name:`detailList`,label:`改版部位`,type:`multiEnum`,required:!0,options:Ie}]},GenerateModel:{key:`GenerateModel`,title:`定制模特`,description:`生成符合需求的虚拟模特`,fields:[{name:`imgUrlList`,label:`参考图片`,type:`images`,required:!0,hint:`上传1-10张带面容的图片`},{name:`gender`,label:`性别`,type:`enum`,required:!0,options:S},{name:`race`,label:`人种`,type:`enum`,options:Pe}]},ModifyPrinting:{key:`ModifyPrinting`,title:`图案修改`,description:`上传图案和参考图AI修改`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`refImgUrl`,label:`参考图`,type:`image`},{name:`maskUrl`,label:`蒙版`,type:`mask`},{name:`prompt`,label:`修改需求`,type:`text`,placeholder:`描述修改需求`}]},CutOut:{key:`CutOut`,title:`智能抠图`,description:`一键抠图修边`,fields:[{name:`imgUrl`,label:`图片`,type:`image`,required:!0},{name:`recognitionType`,label:`识别类型`,type:`enum`,required:!0,options:Le}]},LineArtToReal:{key:`LineArtToReal`,title:`线稿转实物`,description:`线稿图生成实物效果平铺图`,fields:[{name:`imgUrl`,label:`线稿图`,type:`image`,required:!0},{name:`imageType`,label:`图片类型`,type:`enum`,required:!0,options:Re},{name:`prompt`,label:`款式特征`,type:`text`,placeholder:`描述款式特征`}]},FixPartial:{key:`FixPartial`,title:`局部修复`,description:`修复或重新创造指定区域`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`maskUrl`,label:`修复区域蒙版`,type:`mask`,required:!0},{name:`prompt`,label:`修复需求`,type:`text`,placeholder:`描述修复需求`}]},DetailCompensation:{key:`DetailCompensation`,title:`细节补偿`,description:`精准还原服装细节`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`maskUrl`,label:`蒙版`,type:`mask`},{name:`refImgUrl`,label:`参考图`,type:`image`}]},ChangeClothesByImg:{key:`ChangeClothesByImg`,title:`服装穿搭调整`,description:`上下装搭配调整`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`changeImgUrl`,label:`搭配服装图`,type:`image`,required:!0}]}},Ft={ChangeAccessoriesByImg:{key:`ChangeAccessoriesByImg`,title:`配饰穿搭调整`,description:`背包鞋子首饰等搭配调整`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`changeImgUrl`,label:`搭配物品图`,type:`image`,required:!0},{name:`accessoryType`,label:`配件类型`,type:`enum`,required:!0,options:ze}]},VirtualFittingReference:{key:`VirtualFittingReference`,title:`AI试衣参考图模式`,description:`上传模特参考图生成试衣效果`,fields:[{name:`imgUrl`,label:`服装图片`,type:`image`,required:!0},{name:`refImgUrl`,label:`模特参考图`,type:`image`,required:!0}]},VirtualFittingTemplate:{key:`VirtualFittingTemplate`,title:`AI试衣模板模式`,description:`选择试衣场景模板`,fields:[{name:`imgUrl`,label:`服装图片`,type:`image`,required:!0},{name:`templateId`,label:`试衣模板`,type:`enum`,required:!0,options:Be}]},FixDeformities:{key:`FixDeformities`,title:`畸形修复`,description:`修复手部脚部脸部畸形`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0},{name:`maskUrl`,label:`修复区域蒙版`,type:`mask`,required:!0}]},IntelligentCropping:{key:`IntelligentCropping`,title:`AI智能裁图`,description:`自定义像素或比例裁图`,fields:[{name:`imgUrl`,label:`图片`,type:`image`,required:!0},{name:`mode`,label:`裁剪模式`,type:`enum`,required:!0,options:Ve},{name:`x`,label:`X坐标`,type:`number`},{name:`y`,label:`Y坐标`,type:`number`},{name:`width`,label:`宽度`,type:`number`},{name:`height`,label:`高度`,type:`number`},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},ModelToFlat:{key:`ModelToFlat`,title:`模特转平铺`,description:`模特图生成平铺图效果`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0},{name:`position`,label:`服装位置`,type:`enum`,required:!0,options:Fe}]},GenerateShortVideo:{key:`GenerateShortVideo`,title:`短视频生成`,description:`上传图片生成短视频`,fields:[{name:`imgUrl`,label:`首帧图片`,type:`image`,required:!0},{name:`tailImgUrl`,label:`尾帧图片`,type:`image`},{name:`prompt`,label:`文本指令`,type:`text`,placeholder:`描述视频内容`},{name:`duration`,label:`时长`,type:`enum`,required:!0,options:He}]},OneClickModifyPrinting:{key:`OneClickModifyPrinting`,title:`一键改图案`,description:`通过文本或参考图一键更改图案`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`refImgUrl`,label:`参考图`,type:`image`},{name:`prompt`,label:`文本指令`,type:`text`,placeholder:`描述图案修改需求`},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},OrientationDesign:{key:`OrientationDesign`,title:`服装定向设计`,description:`通过设计点对服装进行定向设计`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`maskUrl`,label:`蒙版1`,type:`mask`},{name:`refImgUrl`,label:`参考图1`,type:`image`},{name:`prompt`,label:`文本指令1`,type:`text`,placeholder:`描述设计需求`}]},DirectionalIntegration:{key:`DirectionalIntegration`,title:`定向融合`,description:`通过融合设计点对服装进行融合设计`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`maskUrl`,label:`蒙版1`,type:`mask`},{name:`refImgUrl`,label:`参考图1`,type:`image`,required:!0}]},OneClickIntegration:{key:`OneClickIntegration`,title:`一键融合`,description:`通过参考图和文本指令一键融合`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`refImgUrl`,label:`参考图`,type:`image`,required:!0},{name:`prompt`,label:`文本指令`,type:`text`,placeholder:`描述融合需求`},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},ChangeFabricV2:{key:`ChangeFabricV2`,title:`面料上身2.0`,description:`支持文本指令的面料上身`,fields:[{name:`imgUrl`,label:`款式图`,type:`image`,required:!0},{name:`maskUrl`,label:`蒙版`,type:`mask`,required:!0},{name:`fabricImgUrl`,label:`面料图`,type:`image`,required:!0},{name:`prompt`,label:`文本指令`,type:`text`,placeholder:`描述调整需求`},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},VirtualFittingReferenceV2:{key:`VirtualFittingReferenceV2`,title:`AI试衣参考图2.0`,description:`支持姿势和背景的试衣`,fields:[{name:`imgUrl`,label:`服装图片`,type:`image`,required:!0},{name:`refImgUrl`,label:`模特参考图`,type:`image`,required:!0},{name:`poseImgUrl`,label:`姿势图`,type:`image`},{name:`bgImgUrl`,label:`背景图`,type:`image`},{name:`prompt`,label:`文本指令`,type:`text`,placeholder:`描述试衣需求`},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},FlowerShapedDesign:{key:`FlowerShapedDesign`,title:`花型创款`,description:`将印花上身到指定款式效果图`,fields:[{name:`imgUrl`,label:`印花图案`,type:`image`,required:!0},{name:`prompt`,label:`文本指令`,type:`text`,required:!0,placeholder:`描述上身效果需求`},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},FlowerShapedVirtualPrinting:{key:`FlowerShapedVirtualPrinting`,title:`花型上身`,description:`将图案上身到款式图指定区域`,fields:[{name:`imgUrl`,label:`印花图案`,type:`image`,required:!0},{name:`bodyImgUrl`,label:`上身图`,type:`image`,required:!0},{name:`bodyMaskImgUrl`,label:`目标区域蒙版`,type:`mask`,required:!0},{name:`removePattern`,label:`是否去除参考图印花`,type:`enum`,options:Ue}]},OneClickChangeColor:{key:`OneClickChangeColor`,title:`一键改色`,description:`整合智能识别与自定义改色`,fields:[{name:`imgUrl`,label:`原图`,type:`image`,required:!0},{name:`hexCode`,label:`目标颜色`,type:`color`},{name:`hexImgUrl`,label:`颜色参考图`,type:`image`},{name:`changeColorArea`,label:`改色区域`,type:`text`,placeholder:`如:上衣`},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},FittingModelWithLabels:{key:`FittingModelWithLabels`,title:`模特定制标签模式`,description:`通过标签选择生成虚拟模特`,fields:[{name:`gender`,label:`性别`,type:`enum`,required:!0,options:S},{name:`age`,label:`年龄`,type:`enum`,options:Ne},{name:`nationality`,label:`国籍`,type:`enum`,options:We},{name:`skinColor`,label:`肤色`,type:`enum`,options:Ge},{name:`bodyShape`,label:`身材`,type:`enum`,options:Ke}]},FittingModelCustom:{key:`FittingModelCustom`,title:`模特定制自定义模式`,description:`根据参考图生成虚拟模特`,fields:[{name:`gender`,label:`性别`,type:`enum`,required:!0,options:S},{name:`faceRefImgUrl`,label:`脸部参考图`,type:`image`,required:!0},{name:`similarity`,label:`相似度`,type:`enum`,options:C},{name:`bodyShapeRefImgUrl`,label:`身材参考图`,type:`image`},{name:`additionalDescription`,label:`附加描述`,type:`text`,placeholder:`附加描述`}]},FittingModelChangeFace:{key:`FittingModelChangeFace`,title:`模特换脸`,description:`对模特图换脸操作`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0},{name:`refImgUrl`,label:`参考面部图`,type:`image`,required:!0},{name:`similarity`,label:`相似度`,type:`enum`,options:C},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},FittingModelChangeModel:{key:`FittingModelChangeModel`,title:`模特替换`,description:`随机或指定模特替换`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0},{name:`gender`,label:`性别`,type:`enum`,options:S},{name:`similarity`,label:`相似度`,type:`enum`,options:C},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},FittingModelChangeBodyShape:{key:`FittingModelChangeBodyShape`,title:`模特身材调整`,description:`通过标签或参考图调整身材`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0},{name:`bodyShapeRefImgUrl`,label:`身材参考图`,type:`image`},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},FittingModelChangeClothingSize:{key:`FittingModelChangeClothingSize`,title:`模特尺码调整`,description:`调整模特服装尺码`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0},{name:`size`,label:`尺码`,type:`enum`,required:!0,options:qe},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},FittingModelChangePosture:{key:`FittingModelChangePosture`,title:`模特姿势调整`,description:`调整模特姿势`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0},{name:`poseImgUrl`,label:`姿势参考图`,type:`image`,required:!0},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},FittingModelChangeBackground:{key:`FittingModelChangeBackground`,title:`模特换背景`,description:`替换模特背景`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0},{name:`bgImgUrl`,label:`背景参考图`,type:`image`},{name:`prompt`,label:`文本指令`,type:`text`,placeholder:`描述背景需求`},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},FittingModelChangePerspective:{key:`FittingModelChangePerspective`,title:`模特视角调整`,description:`调整模特视角`,fields:[{name:`imgUrl`,label:`模特图`,type:`image`,required:!0},{name:`perspective`,label:`视角`,type:`enum`,required:!0,options:Ae},{name:`aspectRatio`,label:`宽高比`,type:`aspectRatio`}]},TrainClothingModel:{key:`TrainClothingModel`,title:`服装风格模型训练`,description:`训练自定义服装风格模型`,fields:[{name:`imgUrlList`,label:`训练图片`,type:`images`,required:!0,hint:`建议上传30-50张正面/斜侧面模特图`},{name:`clothingModelName`,label:`模型名称`,type:`text`,required:!0},{name:`enhanceWordList`,label:`加强词`,type:`text`}]}},Y={...Pt,...Ft};function It(e){return Y[e]}function Lt(){return Object.values(Y)}function Rt(e,t){let n=[];for(let r of t){let t=e[r.name],i=zt(r,t);i&&n.push(i)}return{valid:n.length===0,errors:n}}function zt(e,t){let n=t==null||t===``;if(e.required&&n)return{field:e.name,label:e.label,message:x.FIELD_REQUIRED(e.label)};if(t==null)return null;let r=t=>({field:e.name,label:e.label,message:t(e.label)});switch(e.type){case`image`:case`mask`:if(typeof t!=`string`&&!Bt(t))return r(x.FIELD_STRING);break;case`images`:if(!Array.isArray(t)||t.length===0)return r(x.FIELD_ARRAY);if(t.some(e=>(typeof e!=`string`||e===``)&&!Bt(e)))return r(x.FIELD_ARRAY_ELEMENTS);break;case`text`:if(typeof t!=`string`)return r(x.FIELD_STRING);if(e.maxLength&&t.length>e.maxLength)return r(t=>x.FIELD_MAX_LENGTH(t,e.maxLength));break;case`enum`:if(typeof t!=`string`)return r(x.FIELD_STRING);if(e.options&&!e.options.some(e=>e.value===t))return r(x.FIELD_ENUM_INVALID);break;case`multiEnum`:if(!Array.isArray(t)||t.length===0)return r(x.FIELD_ARRAY);if(t.some(e=>typeof e!=`string`||e===``))return r(x.FIELD_ARRAY_ELEMENTS);if(e.options&&t.some(t=>!e.options?.some(e=>e.value===t)))return r(x.FIELD_ENUM_INVALID);break;case`color`:if(typeof t!=`string`||!/^#[0-9A-Fa-f]{6}$/.test(t))return r(x.FIELD_COLOR_FORMAT);break;case`number`:if(typeof t!=`number`||Number.isNaN(t))return r(x.FIELD_NUMBER);break;case`aspectRatio`:case`strength`:break}return null}function Bt(e){return typeof File<`u`&&e instanceof File}var Vt=class{constructor(e={}){this.type=``,this.submitEndpoint=`/task/submit`,this.submitEndpointMode=`prefix`,this.pollEndpoint=`/task/progress`,this.pollInterval=1e3,this.maxPollAttempts=120,this.phase=v.IDLE,this.taskId=``,this.progress=0,this.result=null,this.error=``,this.activeTasks=new Map,this.pollTimer=null,this.isPollingBatch=!1,this.configure(e)}configure(e){e.type!==void 0&&(this.type=e.type),e.submitEndpoint!==void 0&&(this.submitEndpoint=e.submitEndpoint),e.submitEndpointMode!==void 0&&(this.submitEndpointMode=e.submitEndpointMode),e.pollEndpoint!==void 0&&(this.pollEndpoint=e.pollEndpoint),e.pollInterval!==void 0&&(this.pollInterval=e.pollInterval),e.maxPollAttempts!==void 0&&(this.maxPollAttempts=e.maxPollAttempts),e.customRequest!==void 0&&(this.customRequest=e.customRequest),e.customUploadRequest!==void 0&&(this.customUploadRequest=e.customUploadRequest),e.customUploadRequert!==void 0&&(this.customUploadRequest=e.customUploadRequert),e.onSubmit!==void 0&&(this.onSubmit=e.onSubmit),e.onPoll!==void 0&&(this.onPoll=e.onPoll),e.onSuccess!==void 0&&(this.onSuccess=e.onSuccess),e.onError!==void 0&&(this.onError=e.onError)}get typeDef(){let e=this.resolvedTaskTypeKey;return e?It(e):void 0}get taskFields(){return this.typeDef?.fields??[]}async submit(e,t){let n=this.createRequestUri(e);if(!n){this.fail(x.MISSING_ENDPOINT,v.IDLE);return}let r=this.getTaskFields(e);if(r.length>0){let e=Rt(t,r);if(!e.valid){this.fail(e.errors.map(e=>e.message).join(`; `),v.IDLE);return}}this.phase=v.SUBMITTING,this.error=``,this.progress=0,this.result=null;try{let e=await this.resolveUploads(t,r),i=(await this.request(n,{method:`POST`,body:JSON.stringify(e),headers:{"Content-Type":`application/json`}})).data.taskId;this.taskId=i;let a={taskId:i,endpoint:n,formData:e};this.onSubmit?.(a),await this.trackTask(i)}catch(e){this.fail(e instanceof Error?e.message:x.SUBMIT_FAILED,this.phase)}}reset(){this.phase=v.IDLE,this.taskId=``,this.progress=0,this.result=null,this.error=``,this.activeTasks.clear(),this.pollTimer&&=(clearTimeout(this.pollTimer),null)}createRequestUri(e=this.type){return this.submitEndpointMode===`full`?this.submitEndpoint:e?`${this.submitEndpoint}/${e}`:this.submitEndpoint}get resolvedTaskTypeKey(){return Ht(this.type)}getTaskFields(e){let t=Ht(e);return t?It(t)?.fields??[]:[]}async resolveUploads(e,t){let n=t.length>0?t.filter(e=>e.type===`image`||e.type===`mask`||e.type===`images`):Object.keys(e).map(e=>({name:e,type:`image`}));if(!n.length)return e;let r={...e};for(let e of n){let t=r[e.name];Array.isArray(t)?r[e.name]=await Promise.all(t.map(t=>this.resolveUploadValue(t,e))):r[e.name]=await this.resolveUploadValue(t,e)}return r}async resolveUploadValue(e,t){if(!Ut(e))return e;if(!this.customUploadRequest)throw Error(`customUploadRequest is required to upload ${t.name}`);let n=new FormData;return n.append(t.name||`file`,e),Wt(await this.customUploadRequest({file:e,name:t.name,formData:n,field:t}))}trackTask(e){this.phase=v.POLLING;let t=new Promise(t=>{this.activeTasks.set(e,{taskId:e,attempts:0,resolve:t})});return this.ensurePolling(0),t}ensurePolling(e=this.pollInterval){this.pollTimer||this.isPollingBatch||!this.activeTasks.size||(this.pollTimer=setTimeout(()=>{this.pollTimer=null,this.pollActiveTasks()},this.pollInterval))}async pollActiveTasks(){if(!this.activeTasks.size)return;this.isPollingBatch=!0;let e=[...this.activeTasks.keys()];try{let t=`${this.pollEndpoint}?taskIds=${e.map(encodeURIComponent).join(`,`)}`,n=await this.request(t,{method:`GET`}),r=new Map(n.data.map(e=>[e.aiTaskId,e]));e.forEach(e=>{let t=this.activeTasks.get(e);if(!t)return;t.attempts+=1;let n=r.get(e);if(!n){this.failTask(t,x.TASK_NOT_FOUND(e));return}this.taskId=e,this.progress=n.taskProgress;let i={taskId:e,progress:n.taskProgress,status:n.aiTaskStatus,queuePos:n.queuePos};if(this.onPoll?.(i),n.aiTaskStatus===`done`){this.result=n;let r={taskId:e,images:n.imgInfo?[{index:0,url:n.imgInfo}]:[],result:n};this.onSuccess?.(r),this.completeTask(t);return}t.attempts>=this.maxPollAttempts&&this.failTask(t,x.POLL_TIMEOUT(e))})}catch(e){let t=e instanceof Error?e.message:x.POLL_FAILED;[...this.activeTasks.values()].forEach(e=>this.failTask(e,t))}finally{this.isPollingBatch=!1,this.activeTasks.size?(this.phase=v.POLLING,this.ensurePolling(this.pollInterval)):this.phase===v.POLLING&&(this.phase=this.error?v.ERROR:v.SUCCESS)}}completeTask(e){this.activeTasks.delete(e.taskId),e.resolve()}failTask(e,t){this.activeTasks.delete(e.taskId),this.fail(t,v.POLLING,e.taskId),e.resolve()}async request(e,t){let n=await(this.customRequest??fetch)(e,t);return n&&typeof n.json==`function`?n.json():n}fail(e,t,n){this.phase=v.ERROR,this.error=e;let r={message:e,phase:t,taskId:n};this.onError?.(r)}};function Ht(e){if(!e)return``;if(Y[e])return e;let t=e.replace(/([a-z0-9])([A-Z])/g,`$1_$2`).replace(/[-\s]+/g,`_`).toUpperCase();return Y[t]?t:``}function Ut(e){return typeof File<`u`&&e instanceof File}async function Wt(e){return e?typeof e==`string`?e:e instanceof Response?Wt(await e.json()):typeof e.data==`string`?e.data:e.data?e.data.value||e.data.url||``:e.value||e.url||``:``}var X=v,Z=b,Q=class extends e.LitElement{constructor(...e){super(...e),this.type=``,this.submitEndpoint=``,this.pollEndpoint=y.POLL_ENDPOINT,this.pollInterval=y.POLL_INTERVAL,this.maxPollAttempts=y.MAX_POLL_ATTEMPTS,this.phase=X.IDLE,this.taskId=``,this.progress=0,this.result=null,this.error=``,this._defaultClient=new Vt}get typeDef(){return this._syncClientConfig(),this._activeClient.typeDef}get taskFields(){return this.typeDef?.fields??[]}async submit(e){this.phase===X.SUBMITTING||this.phase===X.POLLING||(this._syncClientConfig(),this.phase=X.SUBMITTING,this.error=``,this.progress=0,this.result=null,await this._activeClient.submit(this.type||this._activeClient.type,e),this._syncStateFromClient())}reset(){this._activeClient.reset(),this._syncStateFromClient()}async _handleFormSubmit(e){e.preventDefault(),await this.submit(this.collectFormData())}_handleClick(e){e.composedPath().find(e=>e instanceof HTMLElement?(e.type||e.getAttribute(`type`))===`submit`:!1)&&(e.preventDefault(),this.submit(this.collectFormData()))}_handleChildChange(e){let t=e.target;if(!(t instanceof HTMLElement))return;let n=Gt(t);if(!n)return;let r=Jt(e)??Kt(t);r!==void 0&&(t.value=r,this._syncMaskSources(n,r))}_syncMaskSources(e,t){this.taskFields.find(t=>t.name===e)?.type===`image`&&(typeof t!=`string`||!t||this.querySelectorAll(`lc-mask-editor`).forEach(e=>{let n=e;n.source||=t}))}collectFormData(){let e={},t=this.querySelectorAll(`*`),n=new Map(this.taskFields.map(e=>[e.name,e]));return t.forEach(t=>{let r=Gt(t);if(!r)return;let i=qt(t);n.get(r)?.type===`images`&&typeof i==`string`&&i&&(i=[i]),n.get(r)?.type===`multiEnum`&&typeof i==`string`&&i&&(i=Yt(i)),i!==void 0&&(e[r]=i)}),e}get _activeClient(){return this.client??this._defaultClient}_syncClientConfig(){let e={customRequest:this.customRequest,customUploadRequest:this.customUploadRequest,onSubmit:e=>{this._syncStateFromClient(),this.dispatchEvent(new CustomEvent(Z.SUBMIT,{detail:e,bubbles:!0,composed:!0}))},onPoll:e=>{this._syncStateFromClient(),this.dispatchEvent(new CustomEvent(Z.POLL,{detail:e,bubbles:!0,composed:!0}))},onSuccess:e=>{this._syncStateFromClient(),this.dispatchEvent(new CustomEvent(Z.SUCCESS,{detail:e,bubbles:!0,composed:!0}))},onError:e=>this._fail(e.message,e.phase)};this.client?(this.type&&(e.type=this.type),this.submitEndpoint&&(e.submitEndpoint=this.submitEndpoint),this.pollEndpoint!==y.POLL_ENDPOINT&&(e.pollEndpoint=this.pollEndpoint),this.pollInterval!==y.POLL_INTERVAL&&(e.pollInterval=this.pollInterval),this.maxPollAttempts!==y.MAX_POLL_ATTEMPTS&&(e.maxPollAttempts=this.maxPollAttempts)):(e.type=this.type,this.submitEndpoint&&(e.submitEndpoint=this.submitEndpoint),e.pollEndpoint=this.pollEndpoint,e.pollInterval=this.pollInterval,e.maxPollAttempts=this.maxPollAttempts),this._activeClient.configure(e)}_syncStateFromClient(){let e=this._activeClient;this.phase=e.phase,this.taskId=e.taskId,this.progress=e.progress,this.result=e.result,this.error=e.error}_fail(e,t){this.phase=X.ERROR,this.error=e,this.dispatchEvent(new CustomEvent(Z.ERROR,{detail:{message:e,phase:t},bubbles:!0,composed:!0}))}render(){return e.html`
1051
- <form @submit=${this._handleFormSubmit} @click=${this._handleClick} @change=${this._handleChildChange}>
1052
- <slot></slot>
1053
- </form>
1054
- `}};w([h({type:String})],Q.prototype,`type`,void 0),w([h({type:String,attribute:`submit-endpoint`})],Q.prototype,`submitEndpoint`,void 0),w([h({type:String,attribute:`poll-endpoint`})],Q.prototype,`pollEndpoint`,void 0),w([h({type:Number})],Q.prototype,`pollInterval`,void 0),w([h({type:Number})],Q.prototype,`maxPollAttempts`,void 0),w([h({attribute:!1})],Q.prototype,`client`,void 0),w([h({attribute:!1})],Q.prototype,`customRequest`,void 0),w([h({attribute:!1})],Q.prototype,`customUploadRequest`,void 0),w([g()],Q.prototype,`phase`,void 0),w([g()],Q.prototype,`taskId`,void 0),w([g()],Q.prototype,`progress`,void 0),w([g()],Q.prototype,`result`,void 0),w([g()],Q.prototype,`error`,void 0),Q=w([t(`lc-task-workflow`)],Q);function Gt(e){return e.name||e.getAttribute(`name`)||``}function Kt(e){let t=e.value;if(t!==void 0)return t;if(e.hasAttribute(`value`))return e.getAttribute(`value`)??``}function qt(e){return e.file||Kt(e)}function Jt(e){let t=e.detail;if(t){if(`value`in t)return t.value;if(`file`in t)return t.file}}function Yt(e){try{let t=JSON.parse(e);if(Array.isArray(t))return t.map(String)}catch{}return e.split(`,`).map(e=>e.trim()).filter(Boolean)}var $=class extends e.LitElement{constructor(...e){super(...e),this.type=`button`,this.variant=`primary`,this.disabled=!1}static{this.styles=e.css`
1055
- :host {
1056
- display: inline-block;
1057
- --lc-button-bg: var(--lc-color-primary);
1058
- --lc-button-bg-hover: var(--lc-color-primary-hover);
1059
- --lc-button-color: #fff;
1060
- --lc-button-border: 1px solid var(--lc-color-primary);
1061
- --lc-button-radius: var(--lc-radius-component);
1062
- --lc-button-padding: var(--lc-spacing-2) var(--lc-spacing-4);
1063
- }
1064
-
1065
- button {
1066
- display: inline-flex;
1067
- align-items: center;
1068
- justify-content: center;
1069
- gap: var(--lc-spacing-2);
1070
- min-height: 36px;
1071
- padding: var(--lc-button-padding);
1072
- border: var(--lc-button-border);
1073
- border-radius: var(--lc-button-radius);
1074
- background: var(--lc-button-bg);
1075
- color: var(--lc-button-color);
1076
- font: inherit;
1077
- font-family: var(--lc-font-family);
1078
- cursor: pointer;
1079
- transition: background var(--lc-transition-fast), border-color var(--lc-transition-fast), opacity var(--lc-transition-fast);
1080
- }
1081
-
1082
- button:hover:not(:disabled) {
1083
- background: var(--lc-button-bg-hover);
1084
- }
1085
-
1086
- button:disabled {
1087
- opacity: 0.5;
1088
- cursor: not-allowed;
1089
- }
1090
-
1091
- :host([variant='secondary']) {
1092
- --lc-button-bg: var(--lc-color-bg);
1093
- --lc-button-bg-hover: var(--lc-color-bg-secondary);
1094
- --lc-button-color: var(--lc-color-text);
1095
- --lc-button-border: 1px solid var(--lc-color-border);
1096
- }
1097
- `}handleClick(e){e.stopPropagation(),!this.disabled&&this.dispatchEvent(new MouseEvent(`click`,{bubbles:!0,composed:!0,cancelable:!0}))}render(){return e.html`
1098
- <button type=${this.type} ?disabled=${this.disabled} part="button" @click=${this.handleClick}>
1099
- <slot></slot>
1100
- </button>
1101
- `}};w([h({type:String})],$.prototype,`type`,void 0),w([h({type:String,reflect:!0})],$.prototype,`variant`,void 0),w([h({type:Boolean})],$.prototype,`disabled`,void 0),$=w([t(`lc-button`)],$),Object.defineProperty(exports,`$`,{enumerable:!0,get:function(){return _e}}),Object.defineProperty(exports,`A`,{enumerable:!0,get:function(){return Ke}}),Object.defineProperty(exports,`B`,{enumerable:!0,get:function(){return Pe}}),Object.defineProperty(exports,`C`,{enumerable:!0,get:function(){return x}}),Object.defineProperty(exports,`D`,{enumerable:!0,get:function(){return ze}}),Object.defineProperty(exports,`E`,{enumerable:!0,get:function(){return Oe}}),Object.defineProperty(exports,`F`,{enumerable:!0,get:function(){return Re}}),Object.defineProperty(exports,`G`,{enumerable:!0,get:function(){return qe}}),Object.defineProperty(exports,`H`,{enumerable:!0,get:function(){return Ue}}),Object.defineProperty(exports,`I`,{enumerable:!0,get:function(){return We}}),Object.defineProperty(exports,`J`,{enumerable:!0,get:function(){return Se}}),Object.defineProperty(exports,`K`,{enumerable:!0,get:function(){return Ge}}),Object.defineProperty(exports,`L`,{enumerable:!0,get:function(){return Me}}),Object.defineProperty(exports,`M`,{enumerable:!0,get:function(){return Ie}}),Object.defineProperty(exports,`N`,{enumerable:!0,get:function(){return He}}),Object.defineProperty(exports,`O`,{enumerable:!0,get:function(){return Ne}}),Object.defineProperty(exports,`P`,{enumerable:!0,get:function(){return S}}),Object.defineProperty(exports,`Q`,{enumerable:!0,get:function(){return v}}),Object.defineProperty(exports,`R`,{enumerable:!0,get:function(){return Ae}}),Object.defineProperty(exports,`S`,{enumerable:!0,get:function(){return we}}),Object.defineProperty(exports,`T`,{enumerable:!0,get:function(){return Ee}}),Object.defineProperty(exports,`U`,{enumerable:!0,get:function(){return je}}),Object.defineProperty(exports,`V`,{enumerable:!0,get:function(){return Le}}),Object.defineProperty(exports,`W`,{enumerable:!0,get:function(){return C}}),Object.defineProperty(exports,`X`,{enumerable:!0,get:function(){return Te}}),Object.defineProperty(exports,`Y`,{enumerable:!0,get:function(){return Ce}}),Object.defineProperty(exports,`Z`,{enumerable:!0,get:function(){return y}}),Object.defineProperty(exports,`_`,{enumerable:!0,get:function(){return E}}),Object.defineProperty(exports,`a`,{enumerable:!0,get:function(){return Y}}),Object.defineProperty(exports,`at`,{enumerable:!0,get:function(){return me}}),Object.defineProperty(exports,`b`,{enumerable:!0,get:function(){return be}}),Object.defineProperty(exports,`c`,{enumerable:!0,get:function(){return Ft}}),Object.defineProperty(exports,`d`,{enumerable:!0,get:function(){return q}}),Object.defineProperty(exports,`et`,{enumerable:!0,get:function(){return ye}}),Object.defineProperty(exports,`f`,{enumerable:!0,get:function(){return K}}),Object.defineProperty(exports,`g`,{enumerable:!0,get:function(){return D}}),Object.defineProperty(exports,`h`,{enumerable:!0,get:function(){return O}}),Object.defineProperty(exports,`i`,{enumerable:!0,get:function(){return Rt}}),Object.defineProperty(exports,`it`,{enumerable:!0,get:function(){return _}}),Object.defineProperty(exports,`j`,{enumerable:!0,get:function(){return Ve}}),Object.defineProperty(exports,`k`,{enumerable:!0,get:function(){return ke}}),Object.defineProperty(exports,`l`,{enumerable:!0,get:function(){return Pt}}),Object.defineProperty(exports,`m`,{enumerable:!0,get:function(){return W}}),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return Q}}),Object.defineProperty(exports,`nt`,{enumerable:!0,get:function(){return ge}}),Object.defineProperty(exports,`o`,{enumerable:!0,get:function(){return Lt}}),Object.defineProperty(exports,`p`,{enumerable:!0,get:function(){return G}}),Object.defineProperty(exports,`q`,{enumerable:!0,get:function(){return Be}}),Object.defineProperty(exports,`r`,{enumerable:!0,get:function(){return Vt}}),Object.defineProperty(exports,`rt`,{enumerable:!0,get:function(){return he}}),Object.defineProperty(exports,`s`,{enumerable:!0,get:function(){return It}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return $}}),Object.defineProperty(exports,`tt`,{enumerable:!0,get:function(){return ve}}),Object.defineProperty(exports,`u`,{enumerable:!0,get:function(){return J}}),Object.defineProperty(exports,`v`,{enumerable:!0,get:function(){return T}}),Object.defineProperty(exports,`w`,{enumerable:!0,get:function(){return b}}),Object.defineProperty(exports,`x`,{enumerable:!0,get:function(){return xe}}),Object.defineProperty(exports,`y`,{enumerable:!0,get:function(){return De}}),Object.defineProperty(exports,`z`,{enumerable:!0,get:function(){return Fe}});