@uploadcare/file-uploader 0.50.1 → 1.1.0

package/index.ssr.js

@@ -41,25 +41,38 @@ export const Block = class {
   static is = `sym-1`;
   static bindAttributes = () => {};
 };
+export const BtnUi = class {
+  static observedAttributes = ["text", "icon", "reverse", "theme"];
+  static template = `
+  <button type="button" set="@role:aria-role; @aria-controls: aria-controls">
+    <uc-icon set="className: iconCss; @name: icon; @hidden: !icon"></uc-icon>
+    <div class="uc-text">{{text}}</div>
+  </button>
+`;
+  static reg = () => {};
+  static styleAttrs = [];
+  static is = `sym-1`;
+  static bindAttributes = () => {};
+};
 export const CameraSource = class {
   static template = `
-  <lr-activity-header>
+  <uc-activity-header>
     <button type="button" class="uc-mini-btn" set="onclick: *historyBack">
-      <lr-icon name="back"></lr-icon>
+      <uc-icon name="back"></uc-icon>
     </button>
     <div set="@hidden: !cameraSelectHidden">
-      <lr-icon name="camera"></lr-icon>
+      <uc-icon name="camera"></uc-icon>
       <span l10n="caption-camera"></span>
     </div>
-    <lr-select
+    <uc-select
       class="uc-camera-select"
       set="$.options: cameraSelectOptions; @hidden: cameraSelectHidden; onchange: onCameraSelectChange"
     >
-    </lr-select>
+    </uc-select>
     <button type="button" class="uc-mini-btn uc-close-btn" set="onclick: *closeModal">
-      <lr-icon name="close"></lr-icon>
+      <uc-icon name="close"></uc-icon>
     </button>
-  </lr-activity-header>
+  </uc-activity-header>
   <div class="uc-content">
     <video
       autoplay
@@ -76,7 +89,7 @@ export const CameraSource = class {
       ></button>
     </div>
     <button type="button" class="uc-shot-btn" set="onclick: onShot; @disabled: shotBtnDisabled">
-      <lr-icon name="camera"></lr-icon>
+      <uc-icon name="camera"></uc-icon>
     </button>
   </div>
 `;
@@ -130,32 +143,32 @@ export const CloudImageEditor = class {
   static template = `
   <svg width='0' height='0' style='position:absolute'><symbol viewBox='0 0 20 20' id='uc-icon-brightness' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M15 10a5 5 0 0 1-5 5m5-5a5 5 0 0 0-5-5m5 5h-5m0 5a5 5 0 0 1 0-10m0 10V5m0 15v-3M2.93 2.929 5.05 5.05M0 10h3m-.07 7.071 2.12-2.121M10 0v3m7.07 14.071-2.12-2.121M20 10h-3m.07-7.071L14.95 5.05m-.626 2.45H10m4.324 5H10'/></symbol><symbol fill='currentColor' viewBox='0 0 20 20' id='uc-icon-closeMax' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M8.232 10 3.585 5.353l1.768-1.768L10 8.232l4.648-4.647 1.767 1.768L11.768 10l4.647 4.648-1.767 1.767L10 11.768l-4.647 4.647-1.768-1.767L8.232 10Z' clip-rule='evenodd'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-contrast' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M2 10a8 8 0 1 0 16 0 8 8 0 1 0-16 0m8-8v16m8-8h-8m7.598 2.5H10m6.24 2.5H10m7.6-7.5H10M16.242 5H10'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-crop' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M20 14H7.005C6.45 14 6 13.55 6 12.995V0M0 6h13.067c.515 0 .933.418.933.933V20M14.5.4 13 2l1.5 1.6M13 2h2a3 3 0 0 1 3 3v2M5.5 19.6 7 18l-1.5-1.6M7 18H5a3 3 0 0 1-3-3v-2'/></symbol><symbol fill='currentColor' viewBox='0 0 20 20' id='uc-icon-done' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='m18.057 6.333-9.365 9.125a1.25 1.25 0 0 1-1.768-.023L1.92 10.296l1.791-1.744 4.132 4.243 8.47-8.253 1.744 1.79Z' clip-rule='evenodd'/></symbol><symbol fill='currentColor' viewBox='0 0 25 24' id='uc-icon-edit-file' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M18.558 2.804a.78.78 0 0 0-.557.235l-.008.007-2.472 2.46 3.847 3.848 2.46-2.473.004-.003a.78.78 0 0 0 0-1.108l-.004-.003-2.712-2.728a.78.78 0 0 0-.558-.235Zm-.248 7.613-3.852-3.852-8.93 8.887-1.516 5.41 5.41-1.515 8.888-8.93Zm-.636-8.934a2.28 2.28 0 0 1 2.512.505l2.702 2.717.002.002a2.278 2.278 0 0 1 0 3.234l-.002.002-12.541 12.602a.75.75 0 0 1-.33.193l-6.884 1.928a.75.75 0 0 1-.925-.924l1.928-6.885a.75.75 0 0 1 .193-.33l12.603-12.54a2.28 2.28 0 0 1 .742-.504Z' clip-rule='evenodd'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-enhance' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M19 13h-2m0 0a4 4 0 0 1-4-4m4 4a4 4 0 0 0-4 4m0-8V7m0 2a4 4 0 0 1-4 4m-2 0h2m0 0a4 4 0 0 1 4 4m0 0v2M8 8.5H6.5m0 0a2 2 0 0 1-2-2m2 2a2 2 0 0 0-2 2m0-4V5m0 1.5a2 2 0 0 1-2 2M1 8.5h1.5m0 0a2 2 0 0 1 2 2m0 0V12M12 3h-1m0 0a1 1 0 0 1-1-1m1 1a1 1 0 0 0-1 1m0-2V1m0 1a1 1 0 0 1-1 1M8 3h1m0 0a1 1 0 0 1 1 1m0 0v1'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-exposure' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M10 20v-3M2.93 2.929 5.05 5.05M0 10h3m-.07 7.071 2.12-2.121M10 0v3m7.07 14.071-2.12-2.121M20 10h-3m.07-7.071L14.95 5.05M5 10a5 5 0 1 0 10 0 5 5 0 1 0-10 0'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-filters' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M4.5 6.5a5.5 5.5 0 1 0 11 0 5.5 5.5 0 1 0-11 0m-3.5 6a5.5 5.5 0 1 0 11 0 5.5 5.5 0 1 0-11 0m7 0a5.5 5.5 0 1 0 11 0 5.5 5.5 0 1 0-11 0'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-flip' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M19.6 5 18 3.5 16.4 5m3.2 10L18 16.5 16.4 15M18 3.523v12.954M3.3 8.5h10.654c.301 0 .415-.395.159-.554L3.459 1.286A.3.3 0 0 0 3 1.542V8.2a.3.3 0 0 0 .3.3zm0 3h10.654c.301 0 .415.395.159.554l-10.654 6.66A.3.3 0 0 1 3 18.458v-6.66a.3.3 0 0 1 .3-.3z'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-gamma' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M17 3C9 6 2.5 11.5 2.5 17.5m0 0h1m-1 0v-1m14 1h1m-3 0h1m-3 0h1m-3 0h1m-3 0h1m-3 0h1m-3 0h1m-3-14v-1m0 3v-1m0 3v-1m0 3v-1m0 3v-1m0 3v-1m0 3v-1'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-mirror' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M5 .4 3.5 2 5 3.6M15 .4 16.5 2 15 3.6M3.52 2h12.957M8.5 16.7V6.046c0-.301-.394-.415-.554-.159L1.287 16.541a.3.3 0 0 0 .255.459H8.2a.3.3 0 0 0 .3-.3zm3 0V6.046c0-.301.395-.415.555-.159l6.659 10.654a.3.3 0 0 1-.255.459H11.8a.3.3 0 0 1-.3-.3z'/></symbol><symbol viewBox='0 0 40 40' id='uc-icon-original' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.5' d='M0 40 40 0'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-rotate' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M13.5.4 12 2l1.5 1.6M12.023 2H14.4A3.6 3.6 0 0 1 18 5.6V8M4 17h9a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v9a1 1 0 0 0 1 1z'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-sad' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M2 17c4.418-4 11.582-4 16 0M16.5 5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-11 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0z'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-saturation' xmlns='http://www.w3.org/2000/svg'><defs><linearGradient id='puc-icon-id__a' x1='10.001' y1='1' x2='10.001' y2='19' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient></defs><circle cx='10.001' cy='10' r='9' transform='rotate(90 10 10)' fill='url(#puc-icon-id__a)'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-slider' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M0 10h11m0 0a2 2 0 1 0 4 0m-4 0a2 2 0 1 1 4 0m0 0h5'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-tuning' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M8 10h11M1 10h4M1 4.5h11m3 0h4m-18 11h11m3 0h4m-7-11a1.5 1.5 0 1 0 3 0 1.5 1.5 0 1 0-3 0M5 10a1.5 1.5 0 1 0 3 0 1.5 1.5 0 1 0-3 0m7 5.5a1.5 1.5 0 1 0 3 0 1.5 1.5 0 1 0-3 0'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-vibrance' xmlns='http://www.w3.org/2000/svg'><path d='M2.125 5.64A8.96 8.96 0 0 0 1.001 10a8.96 8.96 0 0 0 1.124 4.36V5.64z' fill='url(#suc-icon-id__a)'/><path d='M2.875 15.499V4.502a9.053 9.053 0 0 1 1.75-1.72v14.437a9.05 9.05 0 0 1-1.75-1.72z' fill='url(#suc-icon-id__b)'/><path d='M5.375 17.722c.548.33 1.134.601 1.75.809V1.469a8.956 8.956 0 0 0-1.75.81v15.443z' fill='url(#suc-icon-id__c)'/><path d='M7.875 1.253v17.495c.564.136 1.15.22 1.75.244V1.008a9 9 0 0 0-1.75.245z' fill='url(#suc-icon-id__d)'/><path d='M10.375 1.008v17.984a9 9 0 0 0 1.75-.244V1.252a9 9 0 0 0-1.75-.244z' fill='url(#suc-icon-id__e)'/><path d='M12.875 1.469V18.53a8.957 8.957 0 0 0 1.75-.808V2.277a8.957 8.957 0 0 0-1.75-.808z' fill='url(#suc-icon-id__f)'/><path d='M15.375 2.78v14.44a9.053 9.053 0 0 0 1.75-1.72v-11a9.054 9.054 0 0 0-1.75-1.72z' fill='url(#suc-icon-id__g)'/><path d='M17.875 5.638v8.724A8.959 8.959 0 0 0 19.001 10a8.96 8.96 0 0 0-1.126-4.362z' fill='url(#suc-icon-id__h)'/><defs><linearGradient id='suc-icon-id__a' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__b' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__c' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__d' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__e' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__f' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__g' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__h' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient></defs></symbol><symbol viewBox='0 0 20 20' id='uc-icon-warmth' xmlns='http://www.w3.org/2000/svg'><path d='m7.5 13.05.429.42.171-.175v-.244h-.6zm5 0h-.6v.245l.172.175.428-.42zM8.1 3.5c0-1.05.85-1.9 1.9-1.9V.4a3.1 3.1 0 0 0-3.1 3.1h1.2zm0 9.55V3.5H6.9v9.55h1.2zm-1 2.45c0-.79.315-1.506.829-2.03l-.858-.84A4.088 4.088 0 0 0 5.9 15.5h1.2zm2.9 2.9a2.9 2.9 0 0 1-2.9-2.9H5.9a4.1 4.1 0 0 0 4.1 4.1v-1.2zm2.9-2.9a2.9 2.9 0 0 1-2.9 2.9v1.2a4.1 4.1 0 0 0 4.1-4.1h-1.2zm-.829-2.03c.514.524.829 1.24.829 2.03h1.2c0-1.117-.447-2.13-1.171-2.87l-.858.84zM11.9 3.5v9.55h1.2V3.5h-1.2zM10 1.6c1.05 0 1.9.85 1.9 1.9h1.2A3.1 3.1 0 0 0 10 .4v1.2z' fill='currentColor'/><path d='M10 14V8' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/><path d='M14 3h3m-3 3h3m-3 3h3m-8 6.5a1 1 0 1 0 2 0 1 1 0 1 0-2 0' stroke='currentColor' stroke-width='1.2'/></symbol></svg>
   <div class="uc-wrapper uc-wrapper_desktop">
-    <lr-presence-toggle class="uc-network_problems_splash" set="visible: presence.networkProblems;">
+    <uc-presence-toggle class="uc-network_problems_splash" set="visible: presence.networkProblems;">
       <div class="uc-network_problems_content">
         <div class="uc-network_problems_icon">
-          <lr-icon name="sad"></lr-icon>
+          <uc-icon name="sad"></uc-icon>
         </div>
         <div class="uc-network_problems_text">Network error</div>
       </div>
       <div class="uc-network_problems_footer">
-        <lr-btn-ui theme="primary" text="Retry" set="onclick: *on.retryNetwork"></lr-btn-ui>
+        <uc-btn-ui theme="primary" text="Retry" set="onclick: *on.retryNetwork"></uc-btn-ui>
       </div>
-    </lr-presence-toggle>
+    </uc-presence-toggle>
     <div class="uc-viewport">
       <div class="uc-file_type_outer">
         <div class="uc-file_type">{{fileType}}</div>
       </div>
       <div class="uc-image_container" ref="img-container-el">
         <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=" class="uc-image uc-image_visible_from_editor" ref="img-el" />
-        <lr-editor-image-cropper ref="cropper-el"></lr-editor-image-cropper>
-        <lr-editor-image-fader ref="fader-el"></lr-editor-image-fader>
+        <uc-editor-image-cropper ref="cropper-el"></uc-editor-image-cropper>
+        <uc-editor-image-fader ref="fader-el"></uc-editor-image-fader>
       </div>
       <div class="uc-info_pan">{{msg}}</div>
     </div>
     <div class="uc-toolbar">
-      <lr-line-loader-ui set="active: showLoader"></lr-line-loader-ui>
+      <uc-line-loader-ui set="active: showLoader"></uc-line-loader-ui>
       <div class="uc-toolbar_content uc-toolbar_content__editor">
-        <lr-editor-toolbar></lr-editor-toolbar>
+        <uc-editor-toolbar></uc-editor-toolbar>
       </div>
     </div>
   </div>
@@ -216,32 +229,32 @@ export const CloudImageEditorBlock = class {
   static template = `
   <svg width='0' height='0' style='position:absolute'><symbol viewBox='0 0 20 20' id='uc-icon-brightness' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M15 10a5 5 0 0 1-5 5m5-5a5 5 0 0 0-5-5m5 5h-5m0 5a5 5 0 0 1 0-10m0 10V5m0 15v-3M2.93 2.929 5.05 5.05M0 10h3m-.07 7.071 2.12-2.121M10 0v3m7.07 14.071-2.12-2.121M20 10h-3m.07-7.071L14.95 5.05m-.626 2.45H10m4.324 5H10'/></symbol><symbol fill='currentColor' viewBox='0 0 20 20' id='uc-icon-closeMax' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M8.232 10 3.585 5.353l1.768-1.768L10 8.232l4.648-4.647 1.767 1.768L11.768 10l4.647 4.648-1.767 1.767L10 11.768l-4.647 4.647-1.768-1.767L8.232 10Z' clip-rule='evenodd'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-contrast' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M2 10a8 8 0 1 0 16 0 8 8 0 1 0-16 0m8-8v16m8-8h-8m7.598 2.5H10m6.24 2.5H10m7.6-7.5H10M16.242 5H10'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-crop' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M20 14H7.005C6.45 14 6 13.55 6 12.995V0M0 6h13.067c.515 0 .933.418.933.933V20M14.5.4 13 2l1.5 1.6M13 2h2a3 3 0 0 1 3 3v2M5.5 19.6 7 18l-1.5-1.6M7 18H5a3 3 0 0 1-3-3v-2'/></symbol><symbol fill='currentColor' viewBox='0 0 20 20' id='uc-icon-done' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='m18.057 6.333-9.365 9.125a1.25 1.25 0 0 1-1.768-.023L1.92 10.296l1.791-1.744 4.132 4.243 8.47-8.253 1.744 1.79Z' clip-rule='evenodd'/></symbol><symbol fill='currentColor' viewBox='0 0 25 24' id='uc-icon-edit-file' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' d='M18.558 2.804a.78.78 0 0 0-.557.235l-.008.007-2.472 2.46 3.847 3.848 2.46-2.473.004-.003a.78.78 0 0 0 0-1.108l-.004-.003-2.712-2.728a.78.78 0 0 0-.558-.235Zm-.248 7.613-3.852-3.852-8.93 8.887-1.516 5.41 5.41-1.515 8.888-8.93Zm-.636-8.934a2.28 2.28 0 0 1 2.512.505l2.702 2.717.002.002a2.278 2.278 0 0 1 0 3.234l-.002.002-12.541 12.602a.75.75 0 0 1-.33.193l-6.884 1.928a.75.75 0 0 1-.925-.924l1.928-6.885a.75.75 0 0 1 .193-.33l12.603-12.54a2.28 2.28 0 0 1 .742-.504Z' clip-rule='evenodd'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-enhance' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M19 13h-2m0 0a4 4 0 0 1-4-4m4 4a4 4 0 0 0-4 4m0-8V7m0 2a4 4 0 0 1-4 4m-2 0h2m0 0a4 4 0 0 1 4 4m0 0v2M8 8.5H6.5m0 0a2 2 0 0 1-2-2m2 2a2 2 0 0 0-2 2m0-4V5m0 1.5a2 2 0 0 1-2 2M1 8.5h1.5m0 0a2 2 0 0 1 2 2m0 0V12M12 3h-1m0 0a1 1 0 0 1-1-1m1 1a1 1 0 0 0-1 1m0-2V1m0 1a1 1 0 0 1-1 1M8 3h1m0 0a1 1 0 0 1 1 1m0 0v1'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-exposure' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M10 20v-3M2.93 2.929 5.05 5.05M0 10h3m-.07 7.071 2.12-2.121M10 0v3m7.07 14.071-2.12-2.121M20 10h-3m.07-7.071L14.95 5.05M5 10a5 5 0 1 0 10 0 5 5 0 1 0-10 0'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-filters' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M4.5 6.5a5.5 5.5 0 1 0 11 0 5.5 5.5 0 1 0-11 0m-3.5 6a5.5 5.5 0 1 0 11 0 5.5 5.5 0 1 0-11 0m7 0a5.5 5.5 0 1 0 11 0 5.5 5.5 0 1 0-11 0'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-flip' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M19.6 5 18 3.5 16.4 5m3.2 10L18 16.5 16.4 15M18 3.523v12.954M3.3 8.5h10.654c.301 0 .415-.395.159-.554L3.459 1.286A.3.3 0 0 0 3 1.542V8.2a.3.3 0 0 0 .3.3zm0 3h10.654c.301 0 .415.395.159.554l-10.654 6.66A.3.3 0 0 1 3 18.458v-6.66a.3.3 0 0 1 .3-.3z'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-gamma' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M17 3C9 6 2.5 11.5 2.5 17.5m0 0h1m-1 0v-1m14 1h1m-3 0h1m-3 0h1m-3 0h1m-3 0h1m-3 0h1m-3 0h1m-3-14v-1m0 3v-1m0 3v-1m0 3v-1m0 3v-1m0 3v-1m0 3v-1'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-mirror' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M5 .4 3.5 2 5 3.6M15 .4 16.5 2 15 3.6M3.52 2h12.957M8.5 16.7V6.046c0-.301-.394-.415-.554-.159L1.287 16.541a.3.3 0 0 0 .255.459H8.2a.3.3 0 0 0 .3-.3zm3 0V6.046c0-.301.395-.415.555-.159l6.659 10.654a.3.3 0 0 1-.255.459H11.8a.3.3 0 0 1-.3-.3z'/></symbol><symbol viewBox='0 0 40 40' id='uc-icon-original' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.5' d='M0 40 40 0'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-rotate' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M13.5.4 12 2l1.5 1.6M12.023 2H14.4A3.6 3.6 0 0 1 18 5.6V8M4 17h9a1 1 0 0 0 1-1V7a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v9a1 1 0 0 0 1 1z'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-sad' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M2 17c4.418-4 11.582-4 16 0M16.5 5a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm-11 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0z'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-saturation' xmlns='http://www.w3.org/2000/svg'><defs><linearGradient id='puc-icon-id__a' x1='10.001' y1='1' x2='10.001' y2='19' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient></defs><circle cx='10.001' cy='10' r='9' transform='rotate(90 10 10)' fill='url(#puc-icon-id__a)'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-slider' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M0 10h11m0 0a2 2 0 1 0 4 0m-4 0a2 2 0 1 1 4 0m0 0h5'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-tuning' xmlns='http://www.w3.org/2000/svg'><path stroke-linejoin='round' fill='none' stroke='currentColor' stroke-width='1.2' d='M8 10h11M1 10h4M1 4.5h11m3 0h4m-18 11h11m3 0h4m-7-11a1.5 1.5 0 1 0 3 0 1.5 1.5 0 1 0-3 0M5 10a1.5 1.5 0 1 0 3 0 1.5 1.5 0 1 0-3 0m7 5.5a1.5 1.5 0 1 0 3 0 1.5 1.5 0 1 0-3 0'/></symbol><symbol viewBox='0 0 20 20' id='uc-icon-vibrance' xmlns='http://www.w3.org/2000/svg'><path d='M2.125 5.64A8.96 8.96 0 0 0 1.001 10a8.96 8.96 0 0 0 1.124 4.36V5.64z' fill='url(#suc-icon-id__a)'/><path d='M2.875 15.499V4.502a9.053 9.053 0 0 1 1.75-1.72v14.437a9.05 9.05 0 0 1-1.75-1.72z' fill='url(#suc-icon-id__b)'/><path d='M5.375 17.722c.548.33 1.134.601 1.75.809V1.469a8.956 8.956 0 0 0-1.75.81v15.443z' fill='url(#suc-icon-id__c)'/><path d='M7.875 1.253v17.495c.564.136 1.15.22 1.75.244V1.008a9 9 0 0 0-1.75.245z' fill='url(#suc-icon-id__d)'/><path d='M10.375 1.008v17.984a9 9 0 0 0 1.75-.244V1.252a9 9 0 0 0-1.75-.244z' fill='url(#suc-icon-id__e)'/><path d='M12.875 1.469V18.53a8.957 8.957 0 0 0 1.75-.808V2.277a8.957 8.957 0 0 0-1.75-.808z' fill='url(#suc-icon-id__f)'/><path d='M15.375 2.78v14.44a9.053 9.053 0 0 0 1.75-1.72v-11a9.054 9.054 0 0 0-1.75-1.72z' fill='url(#suc-icon-id__g)'/><path d='M17.875 5.638v8.724A8.959 8.959 0 0 0 19.001 10a8.96 8.96 0 0 0-1.126-4.362z' fill='url(#suc-icon-id__h)'/><defs><linearGradient id='suc-icon-id__a' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__b' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__c' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__d' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__e' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__f' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__g' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient><linearGradient id='suc-icon-id__h' x1='19.001' y1='10' x2='1.001' y2='10' gradientUnits='userSpaceOnUse'><stop stop-color='#DE15FF'/><stop offset='.203' stop-color='#0029FF'/><stop offset='.479' stop-color='#2AE4F0'/><stop offset='.604' stop-color='#15EF11'/><stop offset='.75' stop-color='#FAE528'/><stop offset='1' stop-color='#EB2A2A'/></linearGradient></defs></symbol><symbol viewBox='0 0 20 20' id='uc-icon-warmth' xmlns='http://www.w3.org/2000/svg'><path d='m7.5 13.05.429.42.171-.175v-.244h-.6zm5 0h-.6v.245l.172.175.428-.42zM8.1 3.5c0-1.05.85-1.9 1.9-1.9V.4a3.1 3.1 0 0 0-3.1 3.1h1.2zm0 9.55V3.5H6.9v9.55h1.2zm-1 2.45c0-.79.315-1.506.829-2.03l-.858-.84A4.088 4.088 0 0 0 5.9 15.5h1.2zm2.9 2.9a2.9 2.9 0 0 1-2.9-2.9H5.9a4.1 4.1 0 0 0 4.1 4.1v-1.2zm2.9-2.9a2.9 2.9 0 0 1-2.9 2.9v1.2a4.1 4.1 0 0 0 4.1-4.1h-1.2zm-.829-2.03c.514.524.829 1.24.829 2.03h1.2c0-1.117-.447-2.13-1.171-2.87l-.858.84zM11.9 3.5v9.55h1.2V3.5h-1.2zM10 1.6c1.05 0 1.9.85 1.9 1.9h1.2A3.1 3.1 0 0 0 10 .4v1.2z' fill='currentColor'/><path d='M10 14V8' stroke='currentColor' stroke-width='1.2' stroke-linecap='round'/><path d='M14 3h3m-3 3h3m-3 3h3m-8 6.5a1 1 0 1 0 2 0 1 1 0 1 0-2 0' stroke='currentColor' stroke-width='1.2'/></symbol></svg>
   <div class="uc-wrapper uc-wrapper_desktop">
-    <lr-presence-toggle class="uc-network_problems_splash" set="visible: presence.networkProblems;">
+    <uc-presence-toggle class="uc-network_problems_splash" set="visible: presence.networkProblems;">
       <div class="uc-network_problems_content">
         <div class="uc-network_problems_icon">
-          <lr-icon name="sad"></lr-icon>
+          <uc-icon name="sad"></uc-icon>
         </div>
         <div class="uc-network_problems_text">Network error</div>
       </div>
       <div class="uc-network_problems_footer">
-        <lr-btn-ui theme="primary" text="Retry" set="onclick: *on.retryNetwork"></lr-btn-ui>
+        <uc-btn-ui theme="primary" text="Retry" set="onclick: *on.retryNetwork"></uc-btn-ui>
       </div>
-    </lr-presence-toggle>
+    </uc-presence-toggle>
     <div class="uc-viewport">
       <div class="uc-file_type_outer">
         <div class="uc-file_type">{{fileType}}</div>
       </div>
       <div class="uc-image_container" ref="img-container-el">
         <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=" class="uc-image uc-image_visible_from_editor" ref="img-el" />
-        <lr-editor-image-cropper ref="cropper-el"></lr-editor-image-cropper>
-        <lr-editor-image-fader ref="fader-el"></lr-editor-image-fader>
+        <uc-editor-image-cropper ref="cropper-el"></uc-editor-image-cropper>
+        <uc-editor-image-fader ref="fader-el"></uc-editor-image-fader>
       </div>
       <div class="uc-info_pan">{{msg}}</div>
     </div>
     <div class="uc-toolbar">
-      <lr-line-loader-ui set="active: showLoader"></lr-line-loader-ui>
+      <uc-line-loader-ui set="active: showLoader"></uc-line-loader-ui>
       <div class="uc-toolbar_content uc-toolbar_content__editor">
-        <lr-editor-toolbar></lr-editor-toolbar>
+        <uc-editor-toolbar></uc-editor-toolbar>
       </div>
     </div>
   </div>
@@ -386,8 +399,8 @@ export const DropArea = class {
     <div data-default-slot hidden></div>
     <div ref="content-wrapper" class="uc-content-wrapper" set="@hidden: !isVisible">
       <div class="uc-icon-container" set="@hidden: !withIcon">
-        <lr-icon name="default"></lr-icon>
-        <lr-icon name="arrow-down"></lr-icon>
+        <uc-icon name="default"></uc-icon>
+        <uc-icon name="arrow-down"></uc-icon>
       </div>
       <span class="uc-text">{{text}}</span>
     </div>
@@ -447,7 +460,7 @@ export const DropArea = class {
 export const EditorCropButtonControl = class {
   static template = `
   <button type="button" role="option">
-    <lr-icon set="@name: icon;"></lr-icon>
+    <uc-icon set="@name: icon;"></uc-icon>
     <div class="uc-title" ref="title-el">{{title}}</div>
   </button>
 `;
@@ -459,7 +472,7 @@ export const EditorCropButtonControl = class {
 export const EditorFilterControl = class {
   static template = `
   <button type="button" role="option">
-    <lr-icon set="@name: icon;"></lr-icon>
+    <uc-icon set="@name: icon;"></uc-icon>
     <div class="uc-title" ref="title-el">{{title}}</div>
   </button>
 `;
@@ -471,7 +484,7 @@ export const EditorFilterControl = class {
 export const EditorImageCropper = class {
   static template = `
   <canvas class="uc-canvas" ref="canvas-el"></canvas>
-  <lr-crop-frame ref="frame-el"></lr-crop-frame>
+  <uc-crop-frame ref="frame-el"></uc-crop-frame>
 `;
   static reg = () => {};
   static styleAttrs = [];
@@ -487,7 +500,7 @@ export const EditorImageFader = class {
 export const EditorOperationControl = class {
   static template = `
   <button type="button" role="option">
-    <lr-icon set="@name: icon;"></lr-icon>
+    <uc-icon set="@name: icon;"></uc-icon>
     <div class="uc-title" ref="title-el">{{title}}</div>
   </button>
 `;
@@ -505,10 +518,10 @@ export const EditorScroller = class {
 };
 export const EditorSlider = class {
   static template = `
-  <lr-slider-ui
+  <uc-slider-ui
     ref="slider-el"
     set="disabled: disabled; min: min; max: max; defaultValue: defaultValue; zero: zero; onInput: on.input;"
-  ></lr-slider-ui>
+  ></uc-slider-ui>
 `;
   static reg = () => {};
   static styleAttrs = [];
@@ -517,25 +530,25 @@ export const EditorSlider = class {
 };
 export const EditorToolbar = class {
   static template = `
-  <lr-line-loader-ui set="active: showLoader"></lr-line-loader-ui>
+  <uc-line-loader-ui set="active: showLoader"></uc-line-loader-ui>
   <div class="uc-info-tooltip_container">
     <div class="uc-info-tooltip_wrapper">
       <div ref="tooltip-el" class="uc-info-tooltip uc-info-tooltip_hidden">{{*operationTooltip}}</div>
     </div>
   </div>
   <div class="uc-toolbar-container">
-    <lr-presence-toggle
+    <uc-presence-toggle
       role="tablist"
       class="uc-sub-toolbar"
       set="visible: presence.mainToolbar; styles: presence.subTopToolbarStyles"
     >
       <div class="uc-tab-content-row">
-    <lr-presence-toggle
+    <uc-presence-toggle
       id="tab_crop"
       class="uc-tab-content"
       set="visible: presence.tabContent.crop; styles: presence.tabContentStyles"
     >
-      <lr-editor-scroller hidden-scrollbar>
+      <uc-editor-scroller hidden-scrollbar>
         <div class="uc-controls-list_align">
           <div
             role="listbox"
@@ -544,15 +557,15 @@ export const EditorToolbar = class {
             ref="controls-list-crop"
           ></div>
         </div>
-      </lr-editor-scroller>
-    </lr-presence-toggle>
+      </uc-editor-scroller>
+    </uc-presence-toggle>
   
-    <lr-presence-toggle
+    <uc-presence-toggle
       id="tab_tuning"
       class="uc-tab-content"
       set="visible: presence.tabContent.tuning; styles: presence.tabContentStyles"
     >
-      <lr-editor-scroller hidden-scrollbar>
+      <uc-editor-scroller hidden-scrollbar>
         <div class="uc-controls-list_align">
           <div
             role="listbox"
@@ -561,15 +574,15 @@ export const EditorToolbar = class {
             ref="controls-list-tuning"
           ></div>
         </div>
-      </lr-editor-scroller>
-    </lr-presence-toggle>
+      </uc-editor-scroller>
+    </uc-presence-toggle>
   
-    <lr-presence-toggle
+    <uc-presence-toggle
       id="tab_filters"
       class="uc-tab-content"
       set="visible: presence.tabContent.filters; styles: presence.tabContentStyles"
     >
-      <lr-editor-scroller hidden-scrollbar>
+      <uc-editor-scroller hidden-scrollbar>
         <div class="uc-controls-list_align">
           <div
             role="listbox"
@@ -578,75 +591,75 @@ export const EditorToolbar = class {
             ref="controls-list-filters"
           ></div>
         </div>
-      </lr-editor-scroller>
-    </lr-presence-toggle>
+      </uc-editor-scroller>
+    </uc-presence-toggle>
   </div>
       <div class="uc-controls-row">
-        <lr-presence-toggle
+        <uc-presence-toggle
           class="uc-tab-toggles"
           set="visible: presence.tabToggles; styles: presence.tabTogglesStyles"
         >
           <div ref="tabs-indicator" class="uc-tab-toggles_indicator"></div>
           
-    <lr-presence-toggle
+    <uc-presence-toggle
       class="uc-tab-toggle"
       set="visible: presence.tabToggle.crop; styles: presence.tabToggleStyles;"
     >
-      <lr-btn-ui
+      <uc-btn-ui
         theme="tab"
         ref="tab-toggle-crop"
         data-id="crop"
         icon="crop"
         set="onclick: on.clickTab; aria-role:tab_role; aria-controls:tab_crop"
       >
-      </lr-btn-ui>
-    </lr-presence-toggle>
+      </uc-btn-ui>
+    </uc-presence-toggle>
   
-    <lr-presence-toggle
+    <uc-presence-toggle
       class="uc-tab-toggle"
       set="visible: presence.tabToggle.tuning; styles: presence.tabToggleStyles;"
     >
-      <lr-btn-ui
+      <uc-btn-ui
         theme="tab"
         ref="tab-toggle-tuning"
         data-id="tuning"
         icon="tuning"
         set="onclick: on.clickTab; aria-role:tab_role; aria-controls:tab_tuning"
       >
-      </lr-btn-ui>
-    </lr-presence-toggle>
+      </uc-btn-ui>
+    </uc-presence-toggle>
   
-    <lr-presence-toggle
+    <uc-presence-toggle
       class="uc-tab-toggle"
       set="visible: presence.tabToggle.filters; styles: presence.tabToggleStyles;"
     >
-      <lr-btn-ui
+      <uc-btn-ui
         theme="tab"
         ref="tab-toggle-filters"
         data-id="filters"
         icon="filters"
         set="onclick: on.clickTab; aria-role:tab_role; aria-controls:tab_filters"
       >
-      </lr-btn-ui>
-    </lr-presence-toggle>
+      </uc-btn-ui>
+    </uc-presence-toggle>
   
-        </lr-presence-toggle>
-        <lr-btn-ui style="order: -1" theme="secondary-icon" icon="closeMax" set="onclick: on.cancel"> </lr-btn-ui>
-        <lr-btn-ui theme="primary-icon" icon="done" set="onclick: on.apply"> </lr-btn-ui>
+        </uc-presence-toggle>
+        <uc-btn-ui style="order: -1" theme="secondary-icon" icon="closeMax" set="onclick: on.cancel"> </uc-btn-ui>
+        <uc-btn-ui theme="primary-icon" icon="done" set="onclick: on.apply"> </uc-btn-ui>
       </div>
-    </lr-presence-toggle>
-    <lr-presence-toggle
+    </uc-presence-toggle>
+    <uc-presence-toggle
       class="uc-sub-toolbar"
       set="visible: presence.subToolbar; styles: presence.subBottomToolbarStyles"
     >
       <div class="uc-slider">
-        <lr-editor-slider ref="slider-el"></lr-editor-slider>
+        <uc-editor-slider ref="slider-el"></uc-editor-slider>
       </div>
       <div class="uc-controls-row">
-        <lr-btn-ui theme="secondary" set="onclick: on.cancelSlider;" l10n="@text:cancel"> </lr-btn-ui>
-        <lr-btn-ui theme="primary" set="onclick: on.applySlider;" l10n="@text:apply"> </lr-btn-ui>
+        <uc-btn-ui theme="secondary" set="onclick: on.cancelSlider;" l10n="@text:cancel"> </uc-btn-ui>
+        <uc-btn-ui theme="primary" set="onclick: on.applySlider;" l10n="@text:apply"> </uc-btn-ui>
       </div>
-    </lr-presence-toggle>
+    </uc-presence-toggle>
   </div>
 `;
   static reg = () => {};
@@ -656,18 +669,18 @@ export const EditorToolbar = class {
 };
 export const ExternalSource = class {
   static template = `
-  <lr-activity-header>
+  <uc-activity-header>
     <button type="button" class="uc-mini-btn" set="onclick: *historyBack">
-      <lr-icon name="back"></lr-icon>
+      <uc-icon name="back"></uc-icon>
     </button>
     <div>
-      <lr-icon set="@name: activityIcon"></lr-icon>
+      <uc-icon set="@name: activityIcon"></uc-icon>
       <span>{{activityCaption}}</span>
     </div>
     <button type="button" class="uc-mini-btn uc-close-btn" set="onclick: *historyBack">
-      <lr-icon name="close"></lr-icon>
+      <uc-icon name="close"></uc-icon>
     </button>
-  </lr-activity-header>
+  </uc-activity-header>
   <div class="uc-content">
     <div ref="iframeWrapper" class="uc-iframe-wrapper"></div>
     <div class="uc-toolbar">
@@ -733,7 +746,7 @@ export const FileItem = class {
   <div class="uc-inner" set="@finished: isFinished; @uploading: isUploading; @failed: isFailed; @focused: isFocused">
     <div class="uc-thumb" set="style.backgroundImage: thumbUrl">
       <div class="uc-badge">
-        <lr-icon set="@name: badgeIcon"></lr-icon>
+        <uc-icon set="@name: badgeIcon"></uc-icon>
       </div>
     </div>
     <div class="uc-file-name-wrapper">
@@ -747,7 +760,7 @@ export const FileItem = class {
         class="uc-edit-btn uc-mini-btn"
         set="onclick: onEdit; @hidden: !isEditable"
       >
-        <lr-icon name="edit-file"></lr-icon>
+        <uc-icon name="edit-file"></uc-icon>
       </button>
       <button
         type="button"
@@ -755,13 +768,13 @@ export const FileItem = class {
         class="uc-remove-btn uc-mini-btn"
         set="onclick: onRemove;"
       >
-        <lr-icon name="remove-file"></lr-icon>
+        <uc-icon name="remove-file"></uc-icon>
       </button>
       <button type="button" class="uc-upload-btn uc-mini-btn" set="onclick: onUpload;">
-        <lr-icon name="upload"></lr-icon>
+        <uc-icon name="upload"></uc-icon>
       </button>
     </div>
-    <lr-progress-bar class="uc-progress-bar" set="value: progressValue; visible: progressVisible;"> </lr-progress-bar>
+    <uc-progress-bar class="uc-progress-bar" set="value: progressValue; visible: progressVisible;"> </uc-progress-bar>
   </div>
 `;
   static activeInstances = {};
@@ -924,19 +937,6 @@ export const LineLoaderUi = class {
   static is = `sym-1`;
   static bindAttributes = () => {};
 };
-export const LrBtnUi = class {
-  static observedAttributes = ["text", "icon", "reverse", "theme"];
-  static template = `
-  <button type="button" set="@role:aria-role; @aria-controls: aria-controls">
-    <lr-icon set="className: iconCss; @name: icon; @hidden: !icon"></lr-icon>
-    <div class="uc-text">{{text}}</div>
-  </button>
-`;
-  static reg = () => {};
-  static styleAttrs = [];
-  static is = `sym-1`;
-  static bindAttributes = () => {};
-};
 export const Modal = class {
   static styleAttrs = [];
   static StateConsumerScope = `modal`;
@@ -950,7 +950,7 @@ export const Modal = class {
   static bindAttributes = () => {};
 };
 export const PACKAGE_NAME = `blocks`;
-export const PACKAGE_VERSION = `0.50.1`;
+export const PACKAGE_VERSION = `1.1.0`;
 export const PresenceToggle = class {
   static template = `<slot></slot> `;
   static reg = () => {};
@@ -966,7 +966,7 @@ export const ProgressBar = class {
   static bindAttributes = () => {};
 };
 export const ProgressBarCommon = class {
-  static template = ` <lr-progress-bar set="visible: visible; value: value"></lr-progress-bar> `;
+  static template = ` <uc-progress-bar set="visible: visible; value: value"></uc-progress-bar> `;
   static extSrcList = {
     FACEBOOK: "facebook",
     DROPBOX: "dropbox",
@@ -1022,14 +1022,14 @@ export const Select = class {
 export const SimpleBtn = class {
   static styleAttrs = [];
   static template = `
-  <lr-drop-area set="@disabled: !withDropZone">
+  <uc-drop-area set="@disabled: !withDropZone">
     <button type="button" set="onclick: onClick">
-      <lr-icon name="upload"></lr-icon>
+      <uc-icon name="upload"></uc-icon>
       <span l10n="button-text"></span>
       <slot></slot>
       <div class="uc-visual-drop-area" l10n="drop-files-here"></div>
     </button>
-  </lr-drop-area>
+  </uc-drop-area>
 `;
   static observedAttributes = ["dropzone"];
   static extSrcList = {
@@ -1101,7 +1101,7 @@ export const SolutionBlock = class {
 export const SourceBtn = class {
   static template = `
   <button type="button">
-    <lr-icon set="@name: iconName"></lr-icon>
+    <uc-icon set="@name: iconName"></uc-icon>
     <div class="uc-txt" l10n="src-type"></div>
   </button>
 `;
@@ -1254,18 +1254,18 @@ export const UploadCtxProvider = class {
 };
 export const UploadList = class {
   static template = `
-  <lr-activity-header>
+  <uc-activity-header>
     <span class="uc-header-text">{{headerText}}</span>
     <button type="button" class="uc-mini-btn uc-close-btn" set="onclick: *closeModal">
-      <lr-icon name="close"></lr-icon>
+      <uc-icon name="close"></uc-icon>
     </button>
-  </lr-activity-header>
+  </uc-activity-header>
 
   <div class="uc-no-files" set="@hidden: hasFiles">
     <slot name="empty"><span l10n="no-files"></span></slot>
   </div>
 
-  <div class="uc-files" repeat="*uploadList" repeat-item-tag="lr-file-item"></div>
+  <div class="uc-files" repeat="*uploadList" repeat-item-tag="uc-file-item"></div>
 
   <div class="uc-common-error" set="@hidden: !commonErrorMessage; textContent: commonErrorMessage;"></div>
 
@@ -1277,7 +1277,7 @@ export const UploadList = class {
       class="uc-add-more-btn uc-secondary-btn"
       set="onclick: onAdd; @disabled: !addMoreBtnEnabled; @hidden: !addMoreBtnVisible"
     >
-      <lr-icon name="add"></lr-icon><span l10n="add-more"></span>
+      <uc-icon name="add"></uc-icon><span l10n="add-more"></span>
     </button>
     <button
       type="button"
@@ -1293,7 +1293,7 @@ export const UploadList = class {
     ></button>
   </div>
 
-  <lr-drop-area ghost></lr-drop-area>
+  <uc-drop-area ghost></uc-drop-area>
 `;
   static extSrcList = {
     FACEBOOK: "facebook",
@@ -1388,18 +1388,18 @@ export const UploaderBlock = class {
 };
 export const UrlSource = class {
   static template = `
-  <lr-activity-header>
+  <uc-activity-header>
     <button type="button" class="uc-mini-btn" set="onclick: *historyBack">
-      <lr-icon name="back"></lr-icon>
+      <uc-icon name="back"></uc-icon>
     </button>
     <div>
-      <lr-icon name="url"></lr-icon>
+      <uc-icon name="url"></uc-icon>
       <span l10n="caption-from-url"></span>
     </div>
     <button type="button" class="uc-mini-btn uc-close-btn" set="onclick: *closeModal">
-      <lr-icon name="close"></lr-icon>
+      <uc-icon name="close"></uc-icon>
     </button>
-  </lr-activity-header>
+  </uc-activity-header>
   <form class="uc-content">
     <input placeholder="https://" class="uc-url-input" type="text" ref="input" set="oninput: onInput" />
     <button

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uploadcare/file-uploader",
-  "version": "0.50.1",
+  "version": "1.1.0",
   "description": "Building blocks for Uploadcare products integration",
   "keywords": [
     "web components",

package/solutions/adaptive-image/index.js

@@ -1,5 +1,5 @@
 import { Img } from '../../blocks/Img/Img.js';
 
-Img.reg('lr-img');
+Img.reg('uc-img');
 
 export { Img };

package/solutions/cloud-image-editor/CloudImageEditor.js

@@ -2,7 +2,7 @@
 import { CloudImageEditorBlock } from '../../blocks/CloudImageEditor/src/CloudImageEditorBlock.js';
 
 export class CloudImageEditor extends CloudImageEditorBlock {
-  static styleAttrs = [...super.styleAttrs, 'lr-wgt-common'];
+  static styleAttrs = [...super.styleAttrs, 'uc-wgt-common'];
 
   initCallback() {
     super.initCallback();