forstok-ui-lib 8.7.0 → 8.7.1
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.
- package/dist/index.js +23 -41
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +23 -41
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/assets/stylesheets/bases.styles.ts +40 -41
- package/src/components/upload/drag.drop.tsx +1 -1
- package/src/components/upload/styles.tsx +0 -17
package/dist/index.mjs
CHANGED
|
@@ -71,22 +71,31 @@ function I(e,t){if(!1===e||null==e)throw new Error(t)}function j(e,t){if(!e){"un
|
|
|
71
71
|
text-transform: capitalize;
|
|
72
72
|
`,lt=n`
|
|
73
73
|
border: none;
|
|
74
|
-
border-radius: .5rem;
|
|
75
|
-
box-shadow:
|
|
74
|
+
border-radius: 0.5rem;
|
|
75
|
+
box-shadow:
|
|
76
|
+
0rem -0.0625rem 0rem 0rem #b5b5b5 inset,
|
|
77
|
+
0rem 0rem 0rem 0.0625rem rgba(0, 0, 0, 0.1) inset,
|
|
78
|
+
0rem 0.03125rem 0rem 0.09375rem #fff inset;
|
|
76
79
|
color: rgba(74, 74, 74, 1);
|
|
77
80
|
cursor: pointer;
|
|
78
81
|
user-select: none;
|
|
79
82
|
touch-action: manipulation;
|
|
80
|
-
background-color: #ffffff;
|
|
83
|
+
background-color: #ffffff;
|
|
81
84
|
`,dt=n`
|
|
82
85
|
color: rgba(48, 48, 48, 1);
|
|
83
86
|
background-color: rgba(250, 250, 250, 1);
|
|
84
87
|
`,Ct=n`
|
|
85
88
|
color: rgba(48, 48, 48, 1);
|
|
86
89
|
background: rgba(247, 247, 247, 1);
|
|
87
|
-
box-shadow:
|
|
90
|
+
box-shadow:
|
|
91
|
+
-0.0625rem 0rem 0.0625rem 0rem rgba(26, 26, 26, 0.122) inset,
|
|
92
|
+
0.0625rem 0rem 0.0625rem 0rem rgba(26, 26, 26, 0.122) inset,
|
|
93
|
+
0rem 0.125rem 0.0625rem 0rem rgba(26, 26, 26, 0.2) inset;
|
|
88
94
|
`,ct=n`
|
|
89
|
-
box-shadow:
|
|
95
|
+
box-shadow:
|
|
96
|
+
-0.0625rem 0rem 0.0625rem 0rem rgba(26, 26, 26, 0.122) inset,
|
|
97
|
+
0.0625rem 0rem 0.0625rem 0rem rgba(26, 26, 26, 0.122) inset,
|
|
98
|
+
0rem 0.125rem 0.0625rem 0rem rgba(26, 26, 26, 0.2) inset;
|
|
90
99
|
`,st=n`
|
|
91
100
|
.table-image-figure {
|
|
92
101
|
display: block;
|
|
@@ -98,7 +107,9 @@ function I(e,t){if(!1===e||null==e)throw new Error(t)}function j(e,t){if(!e){"un
|
|
|
98
107
|
border: 1px solid var(--pri-clr-ln);
|
|
99
108
|
background-color: var(--pri-clr-bg);
|
|
100
109
|
border-radius: var(--ter-rd);
|
|
101
|
-
&.edit,
|
|
110
|
+
&.edit,
|
|
111
|
+
&.add,
|
|
112
|
+
&.loading {
|
|
102
113
|
width: 70px;
|
|
103
114
|
height: 70px;
|
|
104
115
|
cursor: pointer;
|
|
@@ -122,10 +133,10 @@ function I(e,t){if(!1===e||null==e)throw new Error(t)}function j(e,t){if(!e){"un
|
|
|
122
133
|
}
|
|
123
134
|
}
|
|
124
135
|
&.edit {
|
|
125
|
-
border: 1px solid rgba(0, 0, 0, .04);
|
|
136
|
+
border: 1px solid rgba(0, 0, 0, 0.04);
|
|
126
137
|
&:hover {
|
|
127
138
|
position: relative;
|
|
128
|
-
span {
|
|
139
|
+
span {
|
|
129
140
|
width: 100%;
|
|
130
141
|
height: 100%;
|
|
131
142
|
position: absolute;
|
|
@@ -134,7 +145,7 @@ function I(e,t){if(!1===e||null==e)throw new Error(t)}function j(e,t){if(!e){"un
|
|
|
134
145
|
z-index: 1;
|
|
135
146
|
background-color: var(--ov-clr-bg);
|
|
136
147
|
}
|
|
137
|
-
&::after {
|
|
148
|
+
&::after {
|
|
138
149
|
content: url(${"data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22utf-8%22%3F%3E%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%20129%20129%22%20enable-background%3D%22new%200%200%20129%20129%22%20fill%3D%22%23ffffff%22%3E%20%20%3Cpath%20d%3D%22m119.2%2C114.3h-109.4c-2.3%2C0-4.1%2C1.9-4.1%2C4.1s1.9%2C4.1%204.1%2C4.1h109.5c2.3%2C0%204.1-1.9%204.1-4.1s-1.9-4.1-4.2-4.1z%22%2F%3E%20%20%3Cpath%20d%3D%22m5.7%2C78l-.1%2C19.5c0%2C1.1%200.4%2C2.2%201.2%2C3%200.8%2C0.8%201.8%2C1.2%202.9%2C1.2l19.4-.1c1.1%2C0%202.1-0.4%202.9-1.2l67-67c1.6-1.6%201.6-4.2%200-5.9l-19.2-19.4c-1.6-1.6-4.2-1.6-5.9-1.77636e-15l-13.4%2C13.5-53.6%2C53.5c-0.7%2C0.8-1.2%2C1.8-1.2%2C2.9zm71.2-61.1l13.5%2C13.5-7.6%2C7.6-13.5-13.5%207.6-7.6zm-62.9%2C62.9l49.4-49.4%2013.5%2C13.5-49.4%2C49.3-13.6%2C.1%20.1-13.5z%22%2F%3E%3C%2Fsvg%3E"});
|
|
139
150
|
height: 14px;
|
|
140
151
|
width: 14px;
|
|
@@ -149,9 +160,9 @@ function I(e,t){if(!1===e||null==e)throw new Error(t)}function j(e,t){if(!e){"un
|
|
|
149
160
|
}
|
|
150
161
|
}
|
|
151
162
|
&.loading {
|
|
152
|
-
border: 1px solid rgba(0, 0, 0, .04);
|
|
163
|
+
border: 1px solid rgba(0, 0, 0, 0.04);
|
|
153
164
|
cursor: default;
|
|
154
|
-
&::after {
|
|
165
|
+
&::after {
|
|
155
166
|
content: url(${"data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20100%20100%22%20preserveAspectRatio%3D%22xMidYMid%22%20class%3D%22uil-default%22%3E%20%20%20%20%3Crect%20x%3D%220%22%20y%3D%220%22%20width%3D%22100%22%20height%3D%22100%22%20fill%3D%22none%22%20class%3D%22bk%22%3E%3C%2Frect%3E%20%20%20%20%3Crect%20x%3D%5Ci46.5%5Ci%20y%3D%5Ci40%5Ci%20width%3D%5Ci7%5Ci%20height%3D%5Ci20%5Ci%20rx%3D%5Ci5%5Ci%20ry%3D%5Ci5%5Ci%20fill%3D%5Ci%23FF585C%5Ci%20transform%3D%5Cirotate%280%2050%2050%29%20translate%280%20-30%29%5Ci%3E%20%20%20%20%20%20%20%20%3Canimate%20attributeName%3D%5Ciopacity%5Ci%20from%3D%5Ci1%5Ci%20to%3D%5Ci0%5Ci%20dur%3D%5Ci1s%5Ci%20begin%3D%5Ci0s%5Ci%20repeatCount%3D%5Ciindefinite%5Ci%2F%3E%3C%2Frect%3E%20%20%20%20%3Crect%20x%3D%5Ci46.5%5Ci%20y%3D%5Ci40%5Ci%20width%3D%5Ci7%5Ci%20height%3D%5Ci20%5Ci%20rx%3D%5Ci5%5Ci%20ry%3D%5Ci5%5Ci%20fill%3D%5Ci%23FF585C%5Ci%20transform%3D%5Cirotate%2830%2050%2050%29%20translate%280%20-30%29%5Ci%3E%20%20%20%20%20%20%20%20%3Canimate%20attributeName%3D%5Ciopacity%5Ci%20from%3D%5Ci1%5Ci%20to%3D%5Ci0%5Ci%20dur%3D%5Ci1s%5Ci%20begin%3D%5Ci0.08333333333333333s%5Ci%20repeatCount%3D%5Ciindefinite%5Ci%2F%3E%3C%2Frect%3E%20%20%20%20%3Crect%20x%3D%5Ci46.5%5Ci%20y%3D%5Ci40%5Ci%20width%3D%5Ci7%5Ci%20height%3D%5Ci20%5Ci%20rx%3D%5Ci5%5Ci%20ry%3D%5Ci5%5Ci%20fill%3D%5Ci%23FF585C%5Ci%20transform%3D%5Cirotate%2860%2050%2050%29%20translate%280%20-30%29%5Ci%3E%20%20%20%20%20%20%20%20%3Canimate%20attributeName%3D%5Ciopacity%5Ci%20from%3D%5Ci1%5Ci%20to%3D%5Ci0%5Ci%20dur%3D%5Ci1s%5Ci%20begin%3D%5Ci0.16666666666666666s%5Ci%20repeatCount%3D%5Ciindefinite%5Ci%2F%3E%3C%2Frect%3E%20%20%20%20%3Crect%20x%3D%5Ci46.5%5Ci%20y%3D%5Ci40%5Ci%20width%3D%5Ci7%5Ci%20height%3D%5Ci20%5Ci%20rx%3D%5Ci5%5Ci%20ry%3D%5Ci5%5Ci%20fill%3D%5Ci%23FF585C%5Ci%20transform%3D%5Cirotate%2890%2050%2050%29%20translate%280%20-30%29%5Ci%3E%20%20%20%20%20%20%20%20%3Canimate%20attributeName%3D%5Ciopacity%5Ci%20from%3D%5Ci1%5Ci%20to%3D%5Ci0%5Ci%20dur%3D%5Ci1s%5Ci%20begin%3D%5Ci0.25s%5Ci%20repeatCount%3D%5Ciindefinite%5Ci%2F%3E%3C%2Frect%3E%20%20%20%20%3Crect%20x%3D%5Ci46.5%5Ci%20y%3D%5Ci40%5Ci%20width%3D%5Ci7%5Ci%20height%3D%5Ci20%5Ci%20rx%3D%5Ci5%5Ci%20ry%3D%5Ci5%5Ci%20fill%3D%5Ci%23FF585C%5Ci%20transform%3D%5Cirotate%28120%2050%2050%29%20translate%280%20-30%29%5Ci%3E%20%20%20%20%20%20%20%20%3Canimate%20attributeName%3D%5Ciopacity%5Ci%20from%3D%5Ci1%5Ci%20to%3D%5Ci0%5Ci%20dur%3D%5Ci1s%5Ci%20begin%3D%5Ci0.3333333333333333s%5Ci%20repeatCount%3D%5Ciindefinite%5Ci%2F%3E%3C%2Frect%3E%20%20%20%20%3Crect%20x%3D%5Ci46.5%5Ci%20y%3D%5Ci40%5Ci%20width%3D%5Ci7%5Ci%20height%3D%5Ci20%5Ci%20rx%3D%5Ci5%5Ci%20ry%3D%5Ci5%5Ci%20fill%3D%5Ci%23FF585C%5Ci%20transform%3D%5Cirotate%28150%2050%2050%29%20translate%280%20-30%29%5Ci%3E%20%20%20%20%20%20%20%20%3Canimate%20attributeName%3D%5Ciopacity%5Ci%20from%3D%5Ci1%5Ci%20to%3D%5Ci0%5Ci%20dur%3D%5Ci1s%5Ci%20begin%3D%5Ci0.4166666666666667s%5Ci%20repeatCount%3D%5Ciindefinite%5Ci%2F%3E%3C%2Frect%3E%20%20%20%20%3Crect%20x%3D%5Ci46.5%5Ci%20y%3D%5Ci40%5Ci%20width%3D%5Ci7%5Ci%20height%3D%5Ci20%5Ci%20rx%3D%5Ci5%5Ci%20ry%3D%5Ci5%5Ci%20fill%3D%5Ci%23FF585C%5Ci%20transform%3D%5Cirotate%28180%2050%2050%29%20translate%280%20-30%29%5Ci%3E%20%20%20%20%20%20%20%20%3Canimate%20attributeName%3D%5Ciopacity%5Ci%20from%3D%5Ci1%5Ci%20to%3D%5Ci0%5Ci%20dur%3D%5Ci1s%5Ci%20begin%3D%5Ci0.5s%5Ci%20repeatCount%3D%5Ciindefinite%5Ci%2F%3E%3C%2Frect%3E%20%20%20%20%3Crect%20x%3D%5Ci46.5%5Ci%20y%3D%5Ci40%5Ci%20width%3D%5Ci7%5Ci%20height%3D%5Ci20%5Ci%20rx%3D%5Ci5%5Ci%20ry%3D%5Ci5%5Ci%20fill%3D%5Ci%23FF585C%5Ci%20transform%3D%5Cirotate%28210%2050%2050%29%20translate%280%20-30%29%5Ci%3E%20%20%20%20%20%20%20%20%3Canimate%20attributeName%3D%5Ciopacity%5Ci%20from%3D%5Ci1%5Ci%20to%3D%5Ci0%5Ci%20dur%3D%5Ci1s%5Ci%20begin%3D%5Ci0.5833333333333334s%5Ci%20repeatCount%3D%5Ciindefinite%5Ci%2F%3E%3C%2Frect%3E%20%20%20%20%3Crect%20x%3D%5Ci46.5%5Ci%20y%3D%5Ci40%5Ci%20width%3D%5Ci7%5Ci%20height%3D%5Ci20%5Ci%20rx%3D%5Ci5%5Ci%20ry%3D%5Ci5%5Ci%20fill%3D%5Ci%23FF585C%5Ci%20transform%3D%5Cirotate%28240%2050%2050%29%20translate%280%20-30%29%5Ci%3E%20%20%20%20%20%20%20%20%3Canimate%20attributeName%3D%5Ciopacity%5Ci%20from%3D%5Ci1%5Ci%20to%3D%5Ci0%5Ci%20dur%3D%5Ci1s%5Ci%20begin%3D%5Ci0.6666666666666666s%5Ci%20repeatCount%3D%5Ciindefinite%5Ci%2F%3E%3C%2Frect%3E%20%20%20%20%3Crect%20x%3D%5Ci46.5%5Ci%20y%3D%5Ci40%5Ci%20width%3D%5Ci7%5Ci%20height%3D%5Ci20%5Ci%20rx%3D%5Ci5%5Ci%20ry%3D%5Ci5%5Ci%20fill%3D%5Ci%23FF585C%5Ci%20transform%3D%5Cirotate%28270%2050%2050%29%20translate%280%20-30%29%5Ci%3E%20%20%20%20%20%20%20%20%3Canimate%20attributeName%3D%5Ciopacity%5Ci%20from%3D%5Ci1%5Ci%20to%3D%5Ci0%5Ci%20dur%3D%5Ci1s%5Ci%20begin%3D%5Ci0.75s%5Ci%20repeatCount%3D%5Ciindefinite%5Ci%2F%3E%3C%2Frect%3E%20%20%20%20%3Crect%20x%3D%5Ci46.5%5Ci%20y%3D%5Ci40%5Ci%20width%3D%5Ci7%5Ci%20height%3D%5Ci20%5Ci%20rx%3D%5Ci5%5Ci%20ry%3D%5Ci5%5Ci%20fill%3D%5Ci%23FF585C%5Ci%20transform%3D%5Cirotate%28300%2050%2050%29%20translate%280%20-30%29%5Ci%3E%20%20%20%20%20%20%20%20%3Canimate%20attributeName%3D%5Ciopacity%5Ci%20from%3D%5Ci1%5Ci%20to%3D%5Ci0%5Ci%20dur%3D%5Ci1s%5Ci%20begin%3D%5Ci0.8333333333333334s%5Ci%20repeatCount%3D%5Ciindefinite%5Ci%2F%3E%3C%2Frect%3E%20%20%20%20%3Crect%20x%3D%5Ci46.5%5Ci%20y%3D%5Ci40%5Ci%20width%3D%5Ci7%5Ci%20height%3D%5Ci20%5Ci%20rx%3D%5Ci5%5Ci%20ry%3D%5Ci5%5Ci%20fill%3D%5Ci%23FF585C%5Ci%20transform%3D%5Cirotate%28330%2050%2050%29%20translate%280%20-30%29%5Ci%3E%20%20%20%20%20%20%20%20%3Canimate%20attributeName%3D%5Ciopacity%5Ci%20from%3D%5Ci1%5Ci%20to%3D%5Ci0%5Ci%20dur%3D%5Ci1s%5Ci%20begin%3D%5Ci0.9166666666666666s%5Ci%20repeatCount%3D%5Ciindefinite%5Ci%2F%3E%3C%2Frect%3E%3C%2Fsvg%3E"});
|
|
156
167
|
height: 14px;
|
|
157
168
|
width: 14px;
|
|
@@ -172,20 +183,8 @@ function I(e,t){if(!1===e||null==e)throw new Error(t)}function j(e,t){if(!e){"un
|
|
|
172
183
|
}
|
|
173
184
|
}
|
|
174
185
|
.remove {
|
|
175
|
-
font-style: normal;
|
|
176
|
-
position: absolute;
|
|
177
186
|
top: -6px;
|
|
178
187
|
right: -6px;
|
|
179
|
-
background: #000;
|
|
180
|
-
color: var(--sec-clr);
|
|
181
|
-
border-radius: 50%;
|
|
182
|
-
width: 14px;
|
|
183
|
-
height: 14px;
|
|
184
|
-
padding: 3px 5px;
|
|
185
|
-
font-weight: 600;
|
|
186
|
-
font-size: 7px;
|
|
187
|
-
z-index: 1;
|
|
188
|
-
cursor: pointer;
|
|
189
188
|
}
|
|
190
189
|
`,pt=n`
|
|
191
190
|
position: relative;
|
|
@@ -4333,23 +4332,6 @@ function I(e,t){if(!1===e||null==e)throw new Error(t)}function j(e,t){if(!e){"un
|
|
|
4333
4332
|
object-fit: cover;
|
|
4334
4333
|
border-radius: 4px;
|
|
4335
4334
|
}
|
|
4336
|
-
.remove {
|
|
4337
|
-
font-style: normal;
|
|
4338
|
-
position: absolute;
|
|
4339
|
-
top: 8px;
|
|
4340
|
-
right: 10px;
|
|
4341
|
-
background: #444;
|
|
4342
|
-
color: var(--sec-clr);
|
|
4343
|
-
border-radius: 50%;
|
|
4344
|
-
width: 15px;
|
|
4345
|
-
height: 15px;
|
|
4346
|
-
padding: 3px 5px;
|
|
4347
|
-
font-weight: 700;
|
|
4348
|
-
font-size: 8px;
|
|
4349
|
-
z-index: 1;
|
|
4350
|
-
cursor: pointer;
|
|
4351
|
-
line-height: 9px;
|
|
4352
|
-
}
|
|
4353
4335
|
`,oo=r.div`
|
|
4354
4336
|
height: calc(150px - 2em);
|
|
4355
4337
|
border-radius: 4px;
|
|
@@ -4415,7 +4397,7 @@ function I(e,t){if(!1===e||null==e)throw new Error(t)}function j(e,t){if(!e){"un
|
|
|
4415
4397
|
width: 14px;
|
|
4416
4398
|
${Ra}
|
|
4417
4399
|
}
|
|
4418
|
-
`,so=r=>{var{children:n,mode:a}=r,o=B(r,["children","mode"]);const{id:l,width:d}=o;return"image"===a?t(i,{children:[n,e(eo,Object.assign({},"data-idx"in o&&{"data-idx":o["data-idx"]},o["data-detail"]&&{"data-detail":o["data-detail"]},o))]}):t(Ka,{$width:d,children:[t(Ja,{htmlFor:l,children:[e(_a,{}),e($a,{children:n})]}),e(eo,Object.assign({},"data-idx"in o&&{"data-idx":o["data-idx"]},o["data-detail"]&&{"data-detail":o["data-detail"]},o))]})},po=r=>{var{children:n,id:a,name:d,evChange:c,evCreateMessage:s,label:p,subLabel:h,type:g,defaultValue:m,isValidFile:x=!0,evRemove:u}=r,v=B(r,["children","id","name","evChange","evCreateMessage","label","subLabel","type","defaultValue","isValidFile","evRemove"]);const{accept:w}=v,F=C(null),[f,y]=o(),[A,D]=o(!1),[b,E]=o({fileSrc:"",fileType:"",previewKind:"file",fileLabel:""}),k=e=>{e.preventDefault(),e.stopPropagation(),"dragenter"===e.type||"dragover"===e.type?D(!0):"dragleave"===e.type&&D(!1)};l((()=>{let e="",t=!0;return(async()=>{let i={fileSrc:"",fileType:"",previewKind:"file",fileLabel:""};if(x){if(f&&f.length){const t=f[0],n=ui(t)||"document";if(i={fileSrc:t.name,fileType:n,previewKind:"file",fileLabel:t.name},"image"===n)e=URL.createObjectURL(t),i={fileSrc:e,fileType:n,previewKind:"image",fileLabel:t.name};else if("video"===n)try{i={fileSrc:await(r=t,new Promise(((t,i)=>{const n=document.createElement("video"),a=document.createElement("source"),o=URL.createObjectURL(r);a.src=o,a.type=r.type,e=o,n.appendChild(a),n.muted=!0,n.playsInline=!0,n.preload="metadata",n.onloadedmetadata=()=>{const e=document.createElement("canvas");e.width=n.videoWidth||720,e.height=n.videoHeight||122,n.currentTime=Math.min(.1,n.duration||0),n.onseeked=()=>{const r=e.getContext("2d");r?(r.drawImage(n,0,0,e.width,e.height),t(e.toDataURL("image/jpeg"))):i(new Error("Canvas context is not available"))}},n.onerror=()=>{i(new Error("Failed to load video"))},n.load()}))),fileType:n,previewKind:"image",fileLabel:t.name}}catch(e){i={fileSrc:t.name,fileType:n,previewKind:"file",fileLabel:t.name}}}else m&&(i={fileSrc:m,fileType:null!=g?g:"image",previewKind:"image"===(null!=g?g:"image")?"image":"file",fileLabel:m.split("/").pop()||m});var r;t&&E(i)}else t&&E(i)})(),()=>{t=!1,e&&URL.revokeObjectURL(e)}}),[m,x,g,f]);const{fileSrc:z,fileType:O,previewKind:M,fileLabel:L}=b;return t(to,{onDragEnter:k,className:A?"drag-active":"",children:[e(eo,Object.assign({ref:F,id:a,name:d,onChange:e=>{e.preventDefault();const t=e.target;t.files&&t.files[0]&&(c&&c(t.files),y(t.files))}},v)),e(io,{id:"label-file-dragdrop-upload",htmlFor:a,children:e(no,{children:z?t(ao,{children:[t(oo,{$backgroundSrc:"image"===M?z:void 0,children:[e("span",{className:"file-type",children:O||"document"}),e("span",{className:"file-name",children:L})]}),void 0!==u&&e("i",{className:"remove",onClick:e=>{e.preventDefault(),y(void 0),E({fileSrc:"",fileType:"",previewKind:"file",fileLabel:""}),F.current&&(F.current.value=""),null==u||u(e)},title:"Remove File",children:"X"})]}):n?t(Co,{children:[e(co,{}),e("span",{children:n})]}):t(lo,{children:[t("span",{children:[null!=p?p:"Drag & Drop file here to upload, or ",e("aside",{children:"browse"})]}),h&&t(i,{children:[e("br",{}),e("span",{className:"_refSubLabel",children:h})]})]})})}),A&&e(ro,{onDragEnter:k,onDragLeave:k,onDragOver:k,onDrop:e=>{if(e.preventDefault(),e.stopPropagation(),D(!1),e.dataTransfer.files[0]){const t=w?w.split(",").map((e=>e.trim().replace(".",""))):null;for(let i=0;i<e.dataTransfer.files.length;i++){const r=e.dataTransfer.files[i].name.split(".").pop();if((null==t?void 0:t.length)&&r&&!t.includes(r)){const e=Xt("failed","File type is not allowed. Please check again");return s&&s(e),!1}}c&&c(e.dataTransfer.files)}}})]})};function ho({children:t,wrapperId:r="popup-portal"}){const[n,a]=o();return p((()=>{let e=document.getElementById(r),t=!1;return e||(t=!0,e=function(e){const t=document.createElement("div");return t.setAttribute("id",e),document.body.appendChild(t),t}(r)),a(e),()=>{t&&e&&e.parentNode&&e.parentNode.removeChild(e)}}),[r]),void 0===n?e(i,{}):D(t,n)}const go=r.section`
|
|
4400
|
+
`,so=r=>{var{children:n,mode:a}=r,o=B(r,["children","mode"]);const{id:l,width:d}=o;return"image"===a?t(i,{children:[n,e(eo,Object.assign({},"data-idx"in o&&{"data-idx":o["data-idx"]},o["data-detail"]&&{"data-detail":o["data-detail"]},o))]}):t(Ka,{$width:d,children:[t(Ja,{htmlFor:l,children:[e(_a,{}),e($a,{children:n})]}),e(eo,Object.assign({},"data-idx"in o&&{"data-idx":o["data-idx"]},o["data-detail"]&&{"data-detail":o["data-detail"]},o))]})},po=r=>{var{children:n,id:a,name:d,evChange:c,evCreateMessage:s,label:p,subLabel:h,type:g,defaultValue:m,isValidFile:x=!0,evRemove:u}=r,v=B(r,["children","id","name","evChange","evCreateMessage","label","subLabel","type","defaultValue","isValidFile","evRemove"]);const{accept:w}=v,F=C(null),[f,y]=o(),[A,D]=o(!1),[b,E]=o({fileSrc:"",fileType:"",previewKind:"file",fileLabel:""}),k=e=>{e.preventDefault(),e.stopPropagation(),"dragenter"===e.type||"dragover"===e.type?D(!0):"dragleave"===e.type&&D(!1)};l((()=>{let e="",t=!0;return(async()=>{let i={fileSrc:"",fileType:"",previewKind:"file",fileLabel:""};if(x){if(f&&f.length){const t=f[0],n=ui(t)||"document";if(i={fileSrc:t.name,fileType:n,previewKind:"file",fileLabel:t.name},"image"===n)e=URL.createObjectURL(t),i={fileSrc:e,fileType:n,previewKind:"image",fileLabel:t.name};else if("video"===n)try{i={fileSrc:await(r=t,new Promise(((t,i)=>{const n=document.createElement("video"),a=document.createElement("source"),o=URL.createObjectURL(r);a.src=o,a.type=r.type,e=o,n.appendChild(a),n.muted=!0,n.playsInline=!0,n.preload="metadata",n.onloadedmetadata=()=>{const e=document.createElement("canvas");e.width=n.videoWidth||720,e.height=n.videoHeight||122,n.currentTime=Math.min(.1,n.duration||0),n.onseeked=()=>{const r=e.getContext("2d");r?(r.drawImage(n,0,0,e.width,e.height),t(e.toDataURL("image/jpeg"))):i(new Error("Canvas context is not available"))}},n.onerror=()=>{i(new Error("Failed to load video"))},n.load()}))),fileType:n,previewKind:"image",fileLabel:t.name}}catch(e){i={fileSrc:t.name,fileType:n,previewKind:"file",fileLabel:t.name}}}else m&&(i={fileSrc:m,fileType:null!=g?g:"image",previewKind:"image"===(null!=g?g:"image")?"image":"file",fileLabel:m.split("/").pop()||m});var r;t&&E(i)}else t&&E(i)})(),()=>{t=!1,e&&URL.revokeObjectURL(e)}}),[m,x,g,f]);const{fileSrc:z,fileType:O,previewKind:M,fileLabel:L}=b;return t(to,{onDragEnter:k,className:A?"drag-active":"",children:[e(eo,Object.assign({ref:F,id:a,name:d,onChange:e=>{e.preventDefault();const t=e.target;t.files&&t.files[0]&&(c&&c(t.files),y(t.files))}},v)),e(io,{id:"label-file-dragdrop-upload",htmlFor:a,children:e(no,{children:z?t(ao,{children:[t(oo,{$backgroundSrc:"image"===M?z:void 0,children:[e("span",{className:"file-type",children:O||"document"}),e("span",{className:"file-name",children:L})]}),void 0!==u&&e("i",{className:"remove-button remove",onClick:e=>{e.preventDefault(),y(void 0),E({fileSrc:"",fileType:"",previewKind:"file",fileLabel:""}),F.current&&(F.current.value=""),null==u||u(e)},title:"Remove File",children:"X"})]}):n?t(Co,{children:[e(co,{}),e("span",{children:n})]}):t(lo,{children:[t("span",{children:[null!=p?p:"Drag & Drop file here to upload, or ",e("aside",{children:"browse"})]}),h&&t(i,{children:[e("br",{}),e("span",{className:"_refSubLabel",children:h})]})]})})}),A&&e(ro,{onDragEnter:k,onDragLeave:k,onDragOver:k,onDrop:e=>{if(e.preventDefault(),e.stopPropagation(),D(!1),e.dataTransfer.files[0]){const t=w?w.split(",").map((e=>e.trim().replace(".",""))):null;for(let i=0;i<e.dataTransfer.files.length;i++){const r=e.dataTransfer.files[i].name.split(".").pop();if((null==t?void 0:t.length)&&r&&!t.includes(r)){const e=Xt("failed","File type is not allowed. Please check again");return s&&s(e),!1}}c&&c(e.dataTransfer.files)}}})]})};function ho({children:t,wrapperId:r="popup-portal"}){const[n,a]=o();return p((()=>{let e=document.getElementById(r),t=!1;return e||(t=!0,e=function(e){const t=document.createElement("div");return t.setAttribute("id",e),document.body.appendChild(t),t}(r)),a(e),()=>{t&&e&&e.parentNode&&e.parentNode.removeChild(e)}}),[r]),void 0===n?e(i,{}):D(t,n)}const go=r.section`
|
|
4419
4401
|
background-color: var(--pri-clr-bg);
|
|
4420
4402
|
border: 1px solid var(--sec-clr-ln);
|
|
4421
4403
|
position: fixed;
|