@milaboratories/uikit 2.6.2 → 2.6.4

package/dist/components/PlFileInput/PlFileInput.vue.js

@@ -1,31 +1,31 @@
 (function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.appendChild(document.createTextNode(`.pl-file-input{--contour-color: var(--txt-01);--label-color: var(--txt-01);--text-color: var(--txt-01);--contour-border-width: 1px;--contour-box-shadow: none;--label-offset-left-x: 8px;--label-offset-right-x: 8px;--prefix-color: var(--color-placeholder);--contour-offset: 2px;--icon-color: #000;position:relative;z-index:0;width:100%;height:var(--control-height, 40px);border-radius:var(--border-radius-control);display:flex;flex-direction:row;align-items:center;outline:none;padding:0 8px;gap:8px;cursor:pointer}.pl-file-input__envelope{font-family:var(--font-family-base);display:flex;flex-direction:column;min-width:160px}.pl-file-input .mask-24{display:block;min-width:24px}.pl-file-input .mask-close{cursor:pointer}.pl-file-input__progress{position:absolute;z-index:-1;top:0;bottom:0;left:0;right:0;background:linear-gradient(90deg,#fff,#d8fac8);pointer-events:none;width:0}.pl-file-input__clear{--icon-color: var(--ic-02)}.pl-file-input__filename{width:100%;border:none;font-size:inherit;background-color:transparent;color:var(--text-color);caret-color:var(--border-color-focus);z-index:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:18px}.pl-file-input__filename:empty:before{color:var(--color-placeholder);content:attr(data-placeholder);color:var(--txt-03);font-size:14px;font-weight:500;line-height:20px}.pl-file-input__stats{white-space:nowrap;z-index:1;font-size:11px;font-weight:600;letter-spacing:.44px;text-transform:uppercase;color:var(--txt-03)}.pl-file-input label{display:flex;align-items:center;gap:4px;position:absolute;top:0;transform:translateY(-60%);left:var(--label-offset-left-x);padding:0 4px;max-width:calc(100% - 16px);overflow:hidden;white-space:pre;text-overflow:ellipsis;cursor:inherit;color:var(--label-color);font-size:12px;font-weight:500;border-bottom-right-radius:4px;border-bottom-left-radius:4px;background:var(--bg-elevated-01)}.pl-file-input label>span{overflow:hidden;white-space:pre;text-overflow:ellipsis}.pl-file-input__contour{position:absolute;top:0;left:0;right:0;bottom:0;border-radius:var(--border-radius-control);border-width:var(--contour-border-width);border-color:var(--contour-color);border-style:solid;box-shadow:var(--contour-box-shadow);z-index:0;pointer-events:none}.pl-file-input__prefix{padding-left:12px;white-space:nowrap;margin-right:-12px;color:var(--prefix-color)}.pl-file-input__helper{font-size:12px;color:var(--txt-03);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.pl-file-input__error{font-size:12px;color:var(--txt-error);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.pl-file-input:hover{--contour-color: var(--control-hover-color)}.pl-file-input:focus-within:not(.error){--label-color: var(--txt-focus);--contour-color: var(--border-color-focus);--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--border-color-focus-shadow)}.pl-file-input:focus-within.error{--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--color-error-shadow)}.pl-file-input.dashed .pl-file-input__contour{border-style:dashed}.pl-file-input.nonEmpty{--prefix-color: var(--txt-01)}.pl-file-input.error{--contour-color: var(--txt-error);--label-color: var(--txt-error);--text-color: var(--txt-error);--icon-color: var(--txt-error)}.pl-file-input.error .pl-file-input__progress{display:none}.pl-file-input.disabled{--contour-color: var(--color-dis-01);cursor:not-allowed}.pl-file-input__cell-style{--border-radius-control: 0px;--input-active-color: var(--bg-base-light);--border-color: var(--border-color-div-grey);background-color:var(--input-active-color);padding:4px;height:100%;position:relative}.pl-file-input__cell-style .mask-paper-clip{display:none}.pl-file-input__cell-style .pl-file-input{height:100%!important;position:unset}.pl-file-input__cell-style .pl-file-input .double-contour{top:2px;right:2px;bottom:2px;left:2px}.pl-file-input__cell-style .pl-file-input__contour{border-width:1px;box-shadow:unset!important;border-color:var(--border-color);border-style:dashed}.pl-file-input__cell-style .pl-file-input__filename{text-align:center!important}.pl-file-input__cell-style .pl-file-input__error{margin-top:0;margin-right:8px}.pl-file-input__cell-style:hover{--border-color: var(--border-color-focus);background-color:#d9f8ca}.pl-file-input__cell-style:hover .pl-file-input__filename:before{color:#110529!important}.pl-file-input__cell-style.has-file:hover{background-color:var(--input-active-color)}.pl-file-input__cell-style.has-file{padding-left:0;padding-right:0}.pl-file-input__cell-style.has-file .pl-file-input__contour{border:unset}.pl-file-input__cell-style.has-file .pl-file-input__filename{text-align:left!important}.pl-file-input__cell-style.has-file .mask-paper-clip{display:block}
 .double-contour.top>div{border-bottom-right-radius:0;border-bottom-left-radius:0}.double-contour.bottom>div{border-top-right-radius:0;border-top-left-radius:0}.double-contour.left>div{border-top-right-radius:0;border-bottom-right-radius:0}.double-contour.right>div{border-top-left-radius:0;border-bottom-left-radius:0}.double-contour.top-left>div{border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.double-contour.top-right>div{border-bottom-right-radius:0;border-top-left-radius:0;border-top-right-radius:0}.double-contour.bottom-left>div{border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:0}.double-contour.bottom-right>div{border-top-right-radius:0;border-bottom-left-radius:0;border-top-left-radius:0}.double-contour.middle>div{border-radius:0}`)),document.head.appendChild(o)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
-import { defineComponent as $, reactive as q, useSlots as R, computed as s, watch as U, ref as z, createElementBlock as n, openBlock as l, Fragment as D, createElementVNode as c, createVNode as B, normalizeClass as O, createCommentVNode as p, withModifiers as F, withKeys as H, createBlock as i, normalizeStyle as K, unref as t, toDisplayString as u, withCtx as L, renderSlot as j, createTextVNode as A } from "vue";
+import { defineComponent as I, reactive as $, useSlots as q, computed as s, watch as R, ref as U, createElementBlock as u, openBlock as t, Fragment as x, createElementVNode as f, createVNode as B, normalizeClass as O, createCommentVNode as d, withModifiers as F, withKeys as z, createBlock as a, normalizeStyle as H, unref as r, toDisplayString as c, withCtx as K, renderSlot as L, createTextVNode as j } from "vue";
 
-import { prettyBytes as y } from "@milaboratories/helpers";
-import { getFileNameFromHandle as G, getFilePathFromHandle as J } from "@platforma-sdk/model";
-import { getErrorMessage as Q } from "../../helpers/error.js";
-import W from "../../utils/DoubleContour.vue.js";
+import { prettyBytes as g } from "@milaboratories/helpers";
+import { getFileNameFromHandle as A, getFilePathFromHandle as G } from "@platforma-sdk/model";
+import { getErrorMessage as J } from "../../helpers/error.js";
+import Q from "../../utils/DoubleContour.vue.js";
 
-import { useLabelNotch as X } from "../../utils/useLabelNotch.js";
-import Y from "../PlFileDialog/PlFileDialog.vue.js";
-import f from "../PlIcon24/PlIcon24.vue.js";
-import Z from "../PlTooltip/PlTooltip.vue.js";
-import x from "../../assets/images/required.svg.js";
+import { useLabelNotch as W } from "../../utils/useLabelNotch.js";
+import X from "../PlFileDialog/PlFileDialog.vue.js";
+import m from "../PlIcon24/PlIcon24.vue.js";
+import Y from "../PlTooltip/PlTooltip.vue.js";
+import Z from "../../assets/images/required.svg.js";
 import ee from "../PlSvg/PlSvg.vue.js";
 const le = {
   key: 0,
   ref: "label"
-}, oe = ["data-placeholder"], te = {
+}, te = ["data-placeholder"], oe = {
   key: 5,
   class: "pl-file-input__stats"
 }, re = {
   key: 0,
   class: "pl-file-input__error"
-}, se = {
+}, ie = {
   key: 1,
   class: "pl-file-input__helper"
-}, _e = /* @__PURE__ */ $({
+}, ke = /* @__PURE__ */ I({
   __name: "PlFileInput",
   props: {
     modelValue: {},
@@ -42,112 +42,112 @@ const le = {
     fileDialogCloseOnOutsideClick: { type: Boolean, default: !0 }
   },
   emits: ["update:modelValue"],
-  setup(N, { emit: P }) {
-    const a = q({
+  setup(l, { emit: N }) {
+    const n = $({
       fileDialogOpen: !1,
       error: void 0
-    }), g = R(), v = P, o = N, h = (e, r) => {
+    }), v = q(), h = N, o = l, k = (e, i) => {
       if (e)
         try {
-          return r(e);
-        } catch (d) {
-          return a.error = d instanceof Error ? d.message : String(d), e;
+          return i(e);
+        } catch (p) {
+          return n.error = p instanceof Error ? p.message : String(p), e;
         }
-    }, _ = s(() => h(o.modelValue, G)), k = s(() => h(o.modelValue, J)), E = s(() => o.progress && !o.progress.done), T = s(() => o.progress && o.progress.done), V = s(() => Q(a.error, o.error)), m = s(() => typeof V.value == "string"), S = s(() => {
-      const { status: e, done: r } = o.progress ?? {};
-      return !e || !e.bytesTotal ? "" : e.bytesProcessed && !r ? y(e.bytesProcessed, {}) + " / " + y(e.bytesTotal, {}) : y(e.bytesTotal, {});
-    }), w = s(() => {
-      var r;
+    }, V = s(() => k(o.modelValue, A)), S = s(() => k(o.modelValue, G)), P = s(() => o.progress && !o.progress.done), E = s(() => o.progress && o.progress.done), _ = s(() => J(n.error, o.error)), y = s(() => typeof _.value == "string"), b = s(() => {
+      const { status: e, done: i } = o.progress ?? {};
+      return !e || !e.bytesTotal ? "" : e.bytesProcessed && !i ? g(e.bytesProcessed, {}) + " / " + g(e.bytesTotal, {}) : g(e.bytesTotal, {});
+    }), T = s(() => {
+      var i;
       const { progress: e } = o;
       return e ? {
-        width: e.done ? "100%" : Math.round((((r = e.status) == null ? void 0 : r.progress) ?? 0) * 100) + "%"
+        width: e.done ? "100%" : Math.round((((i = e.status) == null ? void 0 : i.progress) ?? 0) * 100) + "%"
       } : {};
-    }), b = () => {
-      a.fileDialogOpen = !0;
-    }, M = (e) => {
-      e.files.length && v("update:modelValue", e.files[0]);
-    }, I = () => v("update:modelValue", void 0);
-    U(
+    }), C = () => {
+      n.fileDialogOpen = !0;
+    }, w = (e) => {
+      e.files.length && h("update:modelValue", e.files[0]);
+    }, M = () => h("update:modelValue", void 0);
+    R(
       () => o.modelValue,
-      () => a.error = void 0,
+      () => n.error = void 0,
       { immediate: !0 }
     );
-    const C = z();
-    return o.cellStyle || X(C), (e, r) => (l(), n(D, null, [
-      c("div", {
-        class: O([{ "pl-file-input__cell-style": !!e.cellStyle, "has-file": !!_.value }, "pl-file-input__envelope"])
+    const D = U();
+    return o.cellStyle || W(D), (e, i) => (t(), u(x, null, [
+      f("div", {
+        class: O([{ "pl-file-input__cell-style": !!l.cellStyle, "has-file": !!V.value }, "pl-file-input__envelope"])
       }, [
-        c("div", {
+        f("div", {
           ref_key: "rootRef",
-          ref: C,
-          class: O([{ dashed: e.dashed, error: m.value }, "pl-file-input"]),
+          ref: D,
+          class: O([{ dashed: l.dashed, error: y.value }, "pl-file-input"]),
           tabindex: "0",
-          onKeyup: H(b, ["enter"]),
-          onClick: F(b, ["stop"])
+          onKeyup: z(C, ["enter"]),
+          onClick: F(C, ["stop"])
         }, [
-          c("div", {
-            style: K(w.value),
+          f("div", {
+            style: H(T.value),
             class: "pl-file-input__progress"
           }, null, 4),
-          !e.cellStyle && e.label ? (l(), n("label", le, [
-            e.required ? (l(), i(t(ee), {
+          !l.cellStyle && l.label ? (t(), u("label", le, [
+            l.required ? (t(), a(r(ee), {
               key: 0,
-              uri: t(x)
-            }, null, 8, ["uri"])) : p("", !0),
-            c("span", null, u(e.label), 1),
-            t(g).tooltip || k.value ? (l(), i(t(Z), {
+              uri: r(Z)
+            }, null, 8, ["uri"])) : d("", !0),
+            f("span", null, c(l.label), 1),
+            r(v).tooltip || S.value ? (t(), a(r(Y), {
               key: 1,
               class: "info",
               position: "top"
             }, {
-              tooltip: L(() => [
-                t(g).tooltip ? j(e.$slots, "tooltip", { key: 0 }) : (l(), n(D, { key: 1 }, [
-                  A(u(k.value), 1)
+              tooltip: K(() => [
+                r(v).tooltip ? L(e.$slots, "tooltip", { key: 0 }) : (t(), u(x, { key: 1 }, [
+                  j(c(S.value), 1)
                 ], 64))
               ]),
               _: 3
-            })) : p("", !0)
-          ], 512)) : p("", !0),
-          m.value ? (l(), i(t(f), {
+            })) : d("", !0)
+          ], 512)) : d("", !0),
+          y.value ? (t(), a(r(m), {
             key: 1,
             name: "restart"
-          })) : E.value ? (l(), i(t(f), {
+          })) : P.value ? (t(), a(r(m), {
             key: 2,
             name: "cloud-upload"
-          })) : T.value ? (l(), i(t(f), {
+          })) : E.value ? (t(), a(r(m), {
             key: 3,
             name: "success"
-          })) : (l(), i(t(f), {
+          })) : (t(), a(r(m), {
             key: 4,
             name: "paper-clip"
           })),
-          c("div", {
-            "data-placeholder": e.placeholder ?? "Choose file",
+          f("div", {
+            "data-placeholder": l.placeholder ?? "Choose file",
             class: "pl-file-input__filename"
-          }, u(_.value), 9, oe),
-          S.value ? (l(), n("div", te, u(S.value), 1)) : p("", !0),
-          e.modelValue ? (l(), i(t(f), {
+          }, c(V.value), 9, te),
+          b.value ? (t(), u("div", oe, c(b.value), 1)) : d("", !0),
+          l.modelValue ? (t(), a(r(m), {
             key: 6,
             class: "pl-file-input__clear",
             name: "close",
-            onClick: F(I, ["stop"])
-          })) : p("", !0),
-          B(W, { class: "pl-file-input__contour" })
+            onClick: F(M, ["stop"])
+          })) : d("", !0),
+          B(Q, { class: "pl-file-input__contour" })
         ], 34),
-        m.value ? (l(), n("div", re, u(V.value), 1)) : e.helper ? (l(), n("div", se, u(e.helper), 1)) : p("", !0)
+        y.value ? (t(), u("div", re, c(_.value), 1)) : l.helper ? (t(), u("div", ie, c(l.helper), 1)) : d("", !0)
       ], 2),
-      B(t(Y), {
-        modelValue: a.fileDialogOpen,
-        "onUpdate:modelValue": r[0] || (r[0] = (d) => a.fileDialogOpen = d),
-        "close-on-outside-click": e.fileDialogCloseOnOutsideClick,
-        extensions: e.extensions,
-        title: e.fileDialogTitle,
-        "onImport:files": M
+      B(r(X), {
+        modelValue: n.fileDialogOpen,
+        "onUpdate:modelValue": i[0] || (i[0] = (p) => n.fileDialogOpen = p),
+        "close-on-outside-click": l.fileDialogCloseOnOutsideClick,
+        extensions: l.extensions,
+        title: l.fileDialogTitle,
+        "onImport:files": w
       }, null, 8, ["modelValue", "close-on-outside-click", "extensions", "title"])
     ], 64));
   }
 });
 export {
-  _e as default
+  ke as default
 };
 //# sourceMappingURL=PlFileInput.vue.js.map

package/dist/components/PlFileInput/PlFileInput.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlFileInput.vue.js","sources":["../../../src/components/PlFileInput/PlFileInput.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport './pl-file-input.scss';\n\nimport { prettyBytes } from '@milaboratories/helpers';\nimport type { ImportFileHandle, ImportProgress } from '@platforma-sdk/model';\nimport { getFileNameFromHandle, getFilePathFromHandle } from '@platforma-sdk/model';\nimport { computed, reactive, ref, useSlots, watch } from 'vue';\nimport { getErrorMessage } from '../../helpers/error.ts';\nimport type { ImportedFiles } from '../../types';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport { PlFileDialog } from '../PlFileDialog';\nimport { PlMaskIcon24 } from '../PlMaskIcon24';\nimport { PlTooltip } from '../PlTooltip';\n\nimport SvgRequired from '../../assets/images/required.svg?raw';\nimport { PlSvg } from '../PlSvg';\n\nconst data = reactive({\n  fileDialogOpen: false,\n  error: undefined as undefined | string,\n});\n\nconst slots = useSlots();\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: ImportFileHandle | undefined): void;\n}>();\n\nconst props = withDefaults(\n  defineProps<{\n    /**\n     * The current import file handle.\n     */\n    modelValue: ImportFileHandle | undefined;\n    /**\n     * The label to display above the input field.\n     */\n    label?: string;\n    /**\n     * If `true`, the input field is marked as required.\n     */\n    required?: boolean;\n    /**\n     * If `true`, the component border is dashed.\n     */\n    dashed?: boolean;\n    /**\n     * Allowed file extensions (should start with `.`)\n     */\n    extensions?: string[];\n    /**\n     * Placeholder text\n     */\n    placeholder?: string;\n    /**\n     * Import/Upload progress\n     */\n    progress?: ImportProgress;\n    /**\n     * An error message to display below the input field.\n     */\n    error?: unknown;\n    /**\n     * A helper text to display below the input field when there are no errors.\n     */\n    helper?: string;\n    /**\n     * Remove rounded border and change styles\n     */\n    cellStyle?: boolean;\n    /**\n     * File dialog title\n     */\n    fileDialogTitle?: string;\n    /**\n     * If `true`, the file dialog window closes when clicking outside the modal area (default: `true`)\n     */\n    fileDialogCloseOnOutsideClick?: boolean;\n  }>(),\n  {\n    label: undefined,\n    extensions: undefined,\n    fileDialogTitle: undefined,\n    placeholder: undefined,\n    progress: undefined,\n    error: undefined,\n    helper: undefined,\n    cellStyle: false,\n    fileDialogCloseOnOutsideClick: true,\n  },\n);\n\nconst tryValue = <T extends ImportFileHandle>(v: T | undefined, cb: (v: T) => string | undefined) => {\n  if (!v) {\n    return undefined;\n  }\n\n  try {\n    return cb(v);\n  } catch (err) {\n    data.error = err instanceof Error ? err.message : String(err);\n    return v;\n  }\n};\n\nconst fileName = computed(() => tryValue(props.modelValue, getFileNameFromHandle));\n\nconst filePath = computed(() => tryValue(props.modelValue, getFilePathFromHandle));\n\nconst isUploading = computed(() => props.progress && !props.progress.done);\n\nconst isUploaded = computed(() => props.progress && props.progress.done);\n\nconst computedErrorMessage = computed(() => getErrorMessage(data.error, props.error));\n\nconst hasErrors = computed(() => typeof computedErrorMessage.value === 'string');\n\nconst uploadStats = computed(() => {\n  const { status, done } = props.progress ?? {};\n\n  if (!status || !status.bytesTotal) {\n    return '';\n  }\n\n  if (status.bytesProcessed && !done) {\n    return prettyBytes(status.bytesProcessed, {}) + ' / ' + prettyBytes(status.bytesTotal, {});\n  }\n\n  return prettyBytes(status.bytesTotal, {});\n});\n\nconst progressStyle = computed(() => {\n  const { progress } = props;\n\n  if (!progress) {\n    return {};\n  }\n\n  return {\n    width: progress.done ? '100%' : Math.round((progress.status?.progress ?? 0) * 100) + '%',\n  };\n});\n\nconst openFileDialog = () => {\n  data.fileDialogOpen = true;\n};\n\nconst onImport = (v: ImportedFiles) => {\n  if (v.files.length) {\n    emit('update:modelValue', v.files[0]);\n  }\n};\n\nconst clear = () => emit('update:modelValue', undefined);\n\nwatch(\n  () => props.modelValue,\n  () => (data.error = undefined),\n  { immediate: true },\n);\n\nconst rootRef = ref();\n\nif (!props.cellStyle) {\n  useLabelNotch(rootRef);\n}\n</script>\n\n<template>\n  <div :class=\"{ 'pl-file-input__cell-style': !!cellStyle, 'has-file': !!fileName }\" class=\"pl-file-input__envelope\">\n    <div\n      ref=\"rootRef\"\n      :class=\"{ dashed, error: hasErrors }\"\n      class=\"pl-file-input\"\n      tabindex=\"0\"\n      @keyup.enter=\"openFileDialog\"\n      @click.stop=\"openFileDialog\"\n    >\n      <div :style=\"progressStyle\" class=\"pl-file-input__progress\" />\n      <label v-if=\"!cellStyle && label\" ref=\"label\">\n        <PlSvg v-if=\"required\" :uri=\"SvgRequired\" />\n        <span>{{ label }}</span>\n        <PlTooltip v-if=\"slots.tooltip || filePath\" class=\"info\" position=\"top\">\n          <template #tooltip>\n            <slot v-if=\"slots.tooltip\" name=\"tooltip\" />\n            <template v-else>{{ filePath }}</template>\n          </template>\n        </PlTooltip>\n      </label>\n      <PlMaskIcon24 v-if=\"hasErrors\" name=\"restart\" />\n      <PlMaskIcon24 v-else-if=\"isUploading\" name=\"cloud-upload\" />\n      <PlMaskIcon24 v-else-if=\"isUploaded\" name=\"success\" />\n      <PlMaskIcon24 v-else name=\"paper-clip\" />\n      <div :data-placeholder=\"placeholder ?? 'Choose file'\" class=\"pl-file-input__filename\">\n        {{ fileName }}\n      </div>\n      <div v-if=\"uploadStats\" class=\"pl-file-input__stats\">{{ uploadStats }}</div>\n      <PlMaskIcon24 v-if=\"modelValue\" class=\"pl-file-input__clear\" name=\"close\" @click.stop=\"clear\" />\n      <DoubleContour class=\"pl-file-input__contour\" />\n    </div>\n    <div v-if=\"hasErrors\" class=\"pl-file-input__error\">\n      {{ computedErrorMessage }}\n    </div>\n    <div v-else-if=\"helper\" class=\"pl-file-input__helper\">{{ helper }}</div>\n  </div>\n  <PlFileDialog\n    v-model=\"data.fileDialogOpen\"\n    :close-on-outside-click=\"fileDialogCloseOnOutsideClick\"\n    :extensions=\"extensions\"\n    :title=\"fileDialogTitle\"\n    @import:files=\"onImport\"\n  />\n</template>\n"],"names":["data","reactive","slots","useSlots","emit","__emit","props","__props","tryValue","v","cb","err","fileName","computed","getFileNameFromHandle","filePath","getFilePathFromHandle","isUploading","isUploaded","computedErrorMessage","getErrorMessage","hasErrors","uploadStats","status","done","prettyBytes","progressStyle","progress","_a","openFileDialog","onImport","clear","watch","rootRef","ref","useLabelNotch"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,UAAMA,IAAOC,EAAS;AAAA,MACpB,gBAAgB;AAAA,MAChB,OAAO;AAAA,IAAA,CACR,GAEKC,IAAQC,EAAA,GAERC,IAAOC,GAIPC,IAAQC,GAgERC,IAAW,CAA6BC,GAAkBC,MAAqC;AACnG,UAAKD;AAIL,YAAI;AACF,iBAAOC,EAAGD,CAAC;AAAA,QACb,SAASE,GAAK;AACZ,iBAAAX,EAAK,QAAQW,aAAe,QAAQA,EAAI,UAAU,OAAOA,CAAG,GACrDF;AAAA,QACT;AAAA,IACF,GAEMG,IAAWC,EAAS,MAAML,EAASF,EAAM,YAAYQ,CAAqB,CAAC,GAE3EC,IAAWF,EAAS,MAAML,EAASF,EAAM,YAAYU,CAAqB,CAAC,GAE3EC,IAAcJ,EAAS,MAAMP,EAAM,YAAY,CAACA,EAAM,SAAS,IAAI,GAEnEY,IAAaL,EAAS,MAAMP,EAAM,YAAYA,EAAM,SAAS,IAAI,GAEjEa,IAAuBN,EAAS,MAAMO,EAAgBpB,EAAK,OAAOM,EAAM,KAAK,CAAC,GAE9Ee,IAAYR,EAAS,MAAM,OAAOM,EAAqB,SAAU,QAAQ,GAEzEG,IAAcT,EAAS,MAAM;AACjC,YAAM,EAAE,QAAAU,GAAQ,MAAAC,EAAA,IAASlB,EAAM,YAAY,CAAA;AAE3C,aAAI,CAACiB,KAAU,CAACA,EAAO,aACd,KAGLA,EAAO,kBAAkB,CAACC,IACrBC,EAAYF,EAAO,gBAAgB,CAAA,CAAE,IAAI,QAAQE,EAAYF,EAAO,YAAY,EAAE,IAGpFE,EAAYF,EAAO,YAAY,EAAE;AAAA,IAC1C,CAAC,GAEKG,IAAgBb,EAAS,MAAM;;AACnC,YAAM,EAAE,UAAAc,MAAarB;AAErB,aAAKqB,IAIE;AAAA,QACL,OAAOA,EAAS,OAAO,SAAS,KAAK,SAAOC,IAAAD,EAAS,WAAT,gBAAAC,EAAiB,aAAY,KAAK,GAAG,IAAI;AAAA,MAAA,IAJ9E,CAAA;AAAA,IAMX,CAAC,GAEKC,IAAiB,MAAM;AAC3B,MAAA7B,EAAK,iBAAiB;AAAA,IACxB,GAEM8B,IAAW,CAACrB,MAAqB;AACrC,MAAIA,EAAE,MAAM,UACVL,EAAK,qBAAqBK,EAAE,MAAM,CAAC,CAAC;AAAA,IAExC,GAEMsB,IAAQ,MAAM3B,EAAK,qBAAqB,MAAS;AAEvD,IAAA4B;AAAA,MACE,MAAM1B,EAAM;AAAA,MACZ,MAAON,EAAK,QAAQ;AAAA,MACpB,EAAE,WAAW,GAAA;AAAA,IAAK;AAGpB,UAAMiC,IAAUC,EAAA;AAEhB,WAAK5B,EAAM,aACT6B,EAAcF,CAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"PlFileInput.vue.js","sources":["../../../src/components/PlFileInput/PlFileInput.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport './pl-file-input.scss';\n\nimport { prettyBytes } from '@milaboratories/helpers';\nimport type { ImportFileHandle, ImportProgress } from '@platforma-sdk/model';\nimport { getFileNameFromHandle, getFilePathFromHandle } from '@platforma-sdk/model';\nimport { computed, reactive, ref, useSlots, watch } from 'vue';\nimport { getErrorMessage } from '../../helpers/error.ts';\nimport type { ImportedFiles } from '../../types';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport { PlFileDialog } from '../PlFileDialog';\nimport { PlMaskIcon24 } from '../PlMaskIcon24';\nimport { PlTooltip } from '../PlTooltip';\n\nimport SvgRequired from '../../assets/images/required.svg?raw';\nimport { PlSvg } from '../PlSvg';\n\nconst data = reactive({\n  fileDialogOpen: false,\n  error: undefined as undefined | string,\n});\n\nconst slots = useSlots();\n\nconst emit = defineEmits<{\n  (e: 'update:modelValue', value: ImportFileHandle | undefined): void;\n}>();\n\nconst props = withDefaults(\n  defineProps<{\n    /**\n     * The current import file handle.\n     */\n    modelValue: ImportFileHandle | undefined;\n    /**\n     * The label to display above the input field.\n     */\n    label?: string;\n    /**\n     * If `true`, the input field is marked as required.\n     */\n    required?: boolean;\n    /**\n     * If `true`, the component border is dashed.\n     */\n    dashed?: boolean;\n    /**\n     * Allowed file extensions (should start with `.`)\n     */\n    extensions?: string[];\n    /**\n     * Placeholder text\n     */\n    placeholder?: string;\n    /**\n     * Import/Upload progress\n     */\n    progress?: ImportProgress;\n    /**\n     * An error message to display below the input field.\n     */\n    error?: unknown;\n    /**\n     * A helper text to display below the input field when there are no errors.\n     */\n    helper?: string;\n    /**\n     * Remove rounded border and change styles\n     */\n    cellStyle?: boolean;\n    /**\n     * File dialog title\n     */\n    fileDialogTitle?: string;\n    /**\n     * If `true`, the file dialog window closes when clicking outside the modal area (default: `true`)\n     */\n    fileDialogCloseOnOutsideClick?: boolean;\n  }>(),\n  {\n    label: undefined,\n    extensions: undefined,\n    fileDialogTitle: undefined,\n    placeholder: undefined,\n    progress: undefined,\n    error: undefined,\n    helper: undefined,\n    cellStyle: false,\n    fileDialogCloseOnOutsideClick: true,\n  },\n);\n\nconst tryValue = <T extends ImportFileHandle>(v: T | undefined, cb: (v: T) => string | undefined) => {\n  if (!v) {\n    return undefined;\n  }\n\n  try {\n    return cb(v);\n  } catch (err) {\n    data.error = err instanceof Error ? err.message : String(err);\n    return v;\n  }\n};\n\nconst fileName = computed(() => tryValue(props.modelValue, getFileNameFromHandle));\n\nconst filePath = computed(() => tryValue(props.modelValue, getFilePathFromHandle));\n\nconst isUploading = computed(() => props.progress && !props.progress.done);\n\nconst isUploaded = computed(() => props.progress && props.progress.done);\n\nconst computedErrorMessage = computed(() => getErrorMessage(data.error, props.error));\n\nconst hasErrors = computed(() => typeof computedErrorMessage.value === 'string');\n\nconst uploadStats = computed(() => {\n  const { status, done } = props.progress ?? {};\n\n  if (!status || !status.bytesTotal) {\n    return '';\n  }\n\n  if (status.bytesProcessed && !done) {\n    return prettyBytes(status.bytesProcessed, {}) + ' / ' + prettyBytes(status.bytesTotal, {});\n  }\n\n  return prettyBytes(status.bytesTotal, {});\n});\n\nconst progressStyle = computed(() => {\n  const { progress } = props;\n\n  if (!progress) {\n    return {};\n  }\n\n  return {\n    width: progress.done ? '100%' : Math.round((progress.status?.progress ?? 0) * 100) + '%',\n  };\n});\n\nconst openFileDialog = () => {\n  data.fileDialogOpen = true;\n};\n\nconst onImport = (v: ImportedFiles) => {\n  if (v.files.length) {\n    emit('update:modelValue', v.files[0]);\n  }\n};\n\nconst clear = () => emit('update:modelValue', undefined);\n\nwatch(\n  () => props.modelValue,\n  () => (data.error = undefined),\n  { immediate: true },\n);\n\nconst rootRef = ref();\n\nif (!props.cellStyle) {\n  useLabelNotch(rootRef);\n}\n</script>\n\n<template>\n  <div :class=\"{ 'pl-file-input__cell-style': !!cellStyle, 'has-file': !!fileName }\" class=\"pl-file-input__envelope\">\n    <div\n      ref=\"rootRef\"\n      :class=\"{ dashed, error: hasErrors }\"\n      class=\"pl-file-input\"\n      tabindex=\"0\"\n      @keyup.enter=\"openFileDialog\"\n      @click.stop=\"openFileDialog\"\n    >\n      <div :style=\"progressStyle\" class=\"pl-file-input__progress\" />\n      <label v-if=\"!cellStyle && label\" ref=\"label\">\n        <PlSvg v-if=\"required\" :uri=\"SvgRequired\" />\n        <span>{{ label }}</span>\n        <PlTooltip v-if=\"slots.tooltip || filePath\" class=\"info\" position=\"top\">\n          <template #tooltip>\n            <slot v-if=\"slots.tooltip\" name=\"tooltip\" />\n            <template v-else>{{ filePath }}</template>\n          </template>\n        </PlTooltip>\n      </label>\n      <PlMaskIcon24 v-if=\"hasErrors\" name=\"restart\" />\n      <PlMaskIcon24 v-else-if=\"isUploading\" name=\"cloud-upload\" />\n      <PlMaskIcon24 v-else-if=\"isUploaded\" name=\"success\" />\n      <PlMaskIcon24 v-else name=\"paper-clip\" />\n      <div :data-placeholder=\"placeholder ?? 'Choose file'\" class=\"pl-file-input__filename\">\n        {{ fileName }}\n      </div>\n      <div v-if=\"uploadStats\" class=\"pl-file-input__stats\">{{ uploadStats }}</div>\n      <PlMaskIcon24 v-if=\"modelValue\" class=\"pl-file-input__clear\" name=\"close\" @click.stop=\"clear\" />\n      <DoubleContour class=\"pl-file-input__contour\" />\n    </div>\n    <div v-if=\"hasErrors\" class=\"pl-file-input__error\">\n      {{ computedErrorMessage }}\n    </div>\n    <div v-else-if=\"helper\" class=\"pl-file-input__helper\">{{ helper }}</div>\n  </div>\n  <PlFileDialog\n    v-model=\"data.fileDialogOpen\"\n    :close-on-outside-click=\"fileDialogCloseOnOutsideClick\"\n    :extensions=\"extensions\"\n    :title=\"fileDialogTitle\"\n    @import:files=\"onImport\"\n  />\n</template>\n"],"names":["data","reactive","slots","useSlots","emit","__emit","props","__props","tryValue","v","cb","err","fileName","computed","getFileNameFromHandle","filePath","getFilePathFromHandle","isUploading","isUploaded","computedErrorMessage","getErrorMessage","hasErrors","uploadStats","status","done","prettyBytes","progressStyle","progress","_a","openFileDialog","onImport","clear","watch","rootRef","ref","useLabelNotch","_createElementVNode","_normalizeClass","_openBlock","_createElementBlock","_hoisted_1","_createBlock","_unref","PlSvg","SvgRequired","PlTooltip","_renderSlot","_ctx","_Fragment","PlMaskIcon24","_hoisted_2","_hoisted_3","_toDisplayString","_createVNode","DoubleContour","_hoisted_4","_hoisted_5","PlFileDialog","_cache","$event"],"mappings":"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"}

package/dist/components/PlIcon16/PlIcon16.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlIcon16.vue2.js","sources":["../../../src/components/PlIcon16/PlIcon16.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { MaskIconName16, Size } from '../../types';\nimport { PlSvg } from '../PlSvg';\nimport { computed } from 'vue';\n\nconst props = defineProps<{\n  name: MaskIconName16;\n  size?: number | string | Size;\n  color?: string | string[];\n  stroke?: string | string[];\n}>();\n\nconst size = computed(() => {\n  if (typeof props.size === 'string') {\n    if (props.size === 'small') return 12;\n    if (props.size === 'medium') return 16;\n    if (props.size === 'large') return 24;\n  }\n  return props.size ?? 16;\n});\n</script>\n\n<template>\n  <PlSvg\n    :name=\"`16_${props.name}`\"\n    :class=\"[$style.icon, 'icon-16', 'mask-16', `icon-${props.name}`, `mask-${props.name}`]\"\n    :width=\"size\"\n    :height=\"size\"\n    :color=\"props.color\"\n    :stroke=\"props.stroke\"\n  />\n</template>\n\n<style module>\n.icon {\n  /* pass color to svg variable */\n  --svg-fill-0: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-1: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-2: var(--icon-color, var(--mask-icon-bg-color));\n  display: inline-block;\n}\n</style>\n"],"names":["props","__props","size","computed"],"mappings":";;;;;;;;;;;AAKA,UAAMA,IAAQC,GAORC,IAAOC,EAAS,MAAM;AAC1B,UAAI,OAAOH,EAAM,QAAS,UAAU;AAClC,YAAIA,EAAM,SAAS,QAAS,QAAO;AACnC,YAAIA,EAAM,SAAS,SAAU,QAAO;AACpC,YAAIA,EAAM,SAAS,QAAS,QAAO;AAAA,MACrC;AACA,aAAOA,EAAM,QAAQ;AAAA,IACvB,CAAC;;;;;;;;;;;"}
+{"version":3,"file":"PlIcon16.vue2.js","sources":["../../../src/components/PlIcon16/PlIcon16.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { MaskIconName16, Size } from '../../types';\nimport { PlSvg } from '../PlSvg';\nimport { computed } from 'vue';\n\nconst props = defineProps<{\n  name: MaskIconName16;\n  size?: number | string | Size;\n  color?: string | string[];\n  stroke?: string | string[];\n}>();\n\nconst size = computed(() => {\n  if (typeof props.size === 'string') {\n    if (props.size === 'small') return 12;\n    if (props.size === 'medium') return 16;\n    if (props.size === 'large') return 24;\n  }\n  return props.size ?? 16;\n});\n</script>\n\n<template>\n  <PlSvg\n    :name=\"`16_${props.name}`\"\n    :class=\"[$style.icon, 'icon-16', 'mask-16', `icon-${props.name}`, `mask-${props.name}`]\"\n    :width=\"size\"\n    :height=\"size\"\n    :color=\"props.color\"\n    :stroke=\"props.stroke\"\n  />\n</template>\n\n<style module>\n.icon {\n  /* pass color to svg variable */\n  --svg-fill-0: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-1: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-2: var(--icon-color, var(--mask-icon-bg-color));\n  display: inline-block;\n}\n</style>\n"],"names":["props","__props","size","computed","_createBlock","_unref","PlSvg","_normalizeClass","$style"],"mappings":";;;;;;;;;;;AAKA,UAAMA,IAAQC,GAORC,IAAOC,EAAS,MAAM;AAC1B,UAAI,OAAOH,EAAM,QAAS,UAAU;AAClC,YAAIA,EAAM,SAAS,QAAS,QAAO;AACnC,YAAIA,EAAM,SAAS,SAAU,QAAO;AACpC,YAAIA,EAAM,SAAS,QAAS,QAAO;AAAA,MACrC;AACA,aAAOA,EAAM,QAAQ;AAAA,IACvB,CAAC;2BAICI,EAOEC,EAAAC,CAAA,GAAA;AAAA,MANC,MAAI,MAAQN,EAAM,IAAI;AAAA,MACtB,OAAKO,EAAA,CAAGC,EAAAA,OAAO,MAAI,WAAA,WAAA,QAAgCR,EAAM,IAAI,IAAA,QAAYA,EAAM,IAAI,EAAA,CAAA;AAAA,MACnF,OAAOE,EAAA;AAAA,MACP,QAAQA,EAAA;AAAA,MACR,OAAOF,EAAM;AAAA,MACb,QAAQA,EAAM;AAAA,IAAA;;;"}

package/dist/components/PlIcon24/PlIcon24.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlIcon24.vue2.js","sources":["../../../src/components/PlIcon24/PlIcon24.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { MaskIconName24, Size } from '../../types';\nimport { PlSvg } from '../PlSvg';\nimport { computed } from 'vue';\n\nconst props = defineProps<{\n  name: MaskIconName24;\n  size?: number | string | Size;\n  color?: string | string[];\n  stroke?: string | string[];\n}>();\n\nconst size = computed(() => {\n  if (typeof props.size === 'string') {\n    if (props.size === 'small') return 16;\n    if (props.size === 'medium') return 24;\n    if (props.size === 'large') return 32;\n  }\n  return props.size ?? 24;\n});\n</script>\n\n<template>\n  <PlSvg\n    :name=\"`24_${props.name}`\"\n    :class=\"['icon-24', 'mask-24', `icon-${props.name}`, `mask-${props.name}`, $style.icon]\"\n    :width=\"size\"\n    :height=\"size\"\n    :color=\"props.color\"\n    :stroke=\"props.stroke\"\n  />\n</template>\n\n<style module>\n.icon {\n  /* pass color to svg variable */\n  --svg-fill-0: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-1: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-2: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-3: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-4: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-5: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-6: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-0: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-1: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-2: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-3: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-4: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-5: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-6: var(--icon-color, var(--mask-icon-bg-color));\n  display: inline-block;\n}\n</style>\n"],"names":["props","__props","size","computed"],"mappings":";;;;;;;;;;;AAKA,UAAMA,IAAQC,GAORC,IAAOC,EAAS,MAAM;AAC1B,UAAI,OAAOH,EAAM,QAAS,UAAU;AAClC,YAAIA,EAAM,SAAS,QAAS,QAAO;AACnC,YAAIA,EAAM,SAAS,SAAU,QAAO;AACpC,YAAIA,EAAM,SAAS,QAAS,QAAO;AAAA,MACrC;AACA,aAAOA,EAAM,QAAQ;AAAA,IACvB,CAAC;;;;;;;;;;;"}
+{"version":3,"file":"PlIcon24.vue2.js","sources":["../../../src/components/PlIcon24/PlIcon24.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { MaskIconName24, Size } from '../../types';\nimport { PlSvg } from '../PlSvg';\nimport { computed } from 'vue';\n\nconst props = defineProps<{\n  name: MaskIconName24;\n  size?: number | string | Size;\n  color?: string | string[];\n  stroke?: string | string[];\n}>();\n\nconst size = computed(() => {\n  if (typeof props.size === 'string') {\n    if (props.size === 'small') return 16;\n    if (props.size === 'medium') return 24;\n    if (props.size === 'large') return 32;\n  }\n  return props.size ?? 24;\n});\n</script>\n\n<template>\n  <PlSvg\n    :name=\"`24_${props.name}`\"\n    :class=\"['icon-24', 'mask-24', `icon-${props.name}`, `mask-${props.name}`, $style.icon]\"\n    :width=\"size\"\n    :height=\"size\"\n    :color=\"props.color\"\n    :stroke=\"props.stroke\"\n  />\n</template>\n\n<style module>\n.icon {\n  /* pass color to svg variable */\n  --svg-fill-0: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-1: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-2: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-3: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-4: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-5: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-fill-6: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-0: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-1: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-2: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-3: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-4: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-5: var(--icon-color, var(--mask-icon-bg-color));\n  --svg-stroke-6: var(--icon-color, var(--mask-icon-bg-color));\n  display: inline-block;\n}\n</style>\n"],"names":["props","__props","size","computed","_createBlock","_unref","PlSvg","_normalizeClass","$style"],"mappings":";;;;;;;;;;;AAKA,UAAMA,IAAQC,GAORC,IAAOC,EAAS,MAAM;AAC1B,UAAI,OAAOH,EAAM,QAAS,UAAU;AAClC,YAAIA,EAAM,SAAS,QAAS,QAAO;AACnC,YAAIA,EAAM,SAAS,SAAU,QAAO;AACpC,YAAIA,EAAM,SAAS,QAAS,QAAO;AAAA,MACrC;AACA,aAAOA,EAAM,QAAQ;AAAA,IACvB,CAAC;2BAICI,EAOEC,EAAAC,CAAA,GAAA;AAAA,MANC,MAAI,MAAQN,EAAM,IAAI;AAAA,MACtB,OAAKO,EAAA,CAAA,WAAA,WAAA,QAAiCP,EAAM,IAAI,IAAA,QAAYA,EAAM,IAAI,IAAIQ,EAAAA,OAAO,IAAI,CAAA;AAAA,MACrF,OAAON,EAAA;AAAA,MACP,QAAQA,EAAA;AAAA,MACR,OAAOF,EAAM;AAAA,MACb,QAAQA,EAAM;AAAA,IAAA;;;"}

package/dist/components/PlLoaderCircular/PlLoaderCircular.vue.js

@@ -1,22 +1,22 @@
 (function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".pl-loader-circular{position:relative;height:100%;display:flex;align-items:center;justify-content:center}.pl-loader-circular__svg{-webkit-animation:rotate 2s linear infinite;animation:rotate 2s linear infinite;height:100%;width:100%;-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center}.pl-loader-circular__svg-circle{stroke-dasharray:150,200;stroke-dashoffset:-10;-webkit-animation:dash 1.5s ease-in-out infinite,color 6s ease-in-out infinite;animation:dash 1.5s ease-in-out infinite,color 6s ease-in-out infinite;stroke-linecap:round}@keyframes rotate{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:89,200;stroke-dashoffset:-35}to{stroke-dasharray:89,200;stroke-dashoffset:-124}}@keyframes color{0%{stroke:var(--ic-02)}40%{stroke:var(--ic-02)}66%{stroke:var(--ic-02)}80%,90%{stroke:var(--ic-02)}}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
-import { defineComponent as i, createElementBlock as r, openBlock as l, createElementVNode as c, normalizeStyle as o } from "vue";
+import { defineComponent as i, createElementBlock as c, openBlock as r, createElementVNode as l, normalizeStyle as t } from "vue";
 
-const s = { class: "pl-loader-circular" }, a = {
+const a = { class: "pl-loader-circular" }, o = {
   class: "pl-loader-circular__svg",
   viewBox: "25 25 50 50"
-}, t = ["stroke"], m = /* @__PURE__ */ i({
+}, s = ["stroke"], p = /* @__PURE__ */ i({
   __name: "PlLoaderCircular",
   props: {
     size: { default: "16" }
   },
-  setup(n) {
-    return (e, p) => (l(), r("div", s, [
-      c("div", {
-        style: o({ height: `${e.size}px`, width: `${e.size}px`, "--main-color": `${+e.size < 48 ? "var(--ic-01)" : "var(--ic-02)"}` }),
+  setup(e) {
+    return (n, d) => (r(), c("div", a, [
+      l("div", {
+        style: t({ height: `${e.size}px`, width: `${e.size}px`, "--main-color": `${+e.size < 48 ? "var(--ic-01)" : "var(--ic-02)"}` }),
         class: "pl-circle-loader__wrapper"
       }, [
-        (l(), r("svg", a, [
-          c("circle", {
+        (r(), c("svg", o, [
+          l("circle", {
             class: "pl-loader-circular__svg-circle",
             cx: "50",
             cy: "50",
@@ -24,13 +24,13 @@ const s = { class: "pl-loader-circular" }, a = {
             fill: "none",
             stroke: `${+e.size < 48 ? "var(--ic-01)" : "var(--ic-02)"}`,
             "stroke-width": "2"
-          }, null, 8, t)
+          }, null, 8, s)
         ]))
       ], 4)
     ]));
   }
 });
 export {
-  m as default
+  p as default
 };
 //# sourceMappingURL=PlLoaderCircular.vue.js.map

package/dist/components/PlLoaderCircular/PlLoaderCircular.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlLoaderCircular.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"PlLoaderCircular.vue.js","sources":["../../../src/components/PlLoaderCircular/PlLoaderCircular.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport './pl-loader-circular.scss';\n\nwithDefaults(defineProps<{\n  size?: '16' | '24' | '48' | string;\n}>(), { size: '16' });\n</script>\n<template>\n  <div class=\"pl-loader-circular\">\n    <div :style=\"{height: `${size}px`, width: `${size}px`, '--main-color': `${+size < 48 ? 'var(--ic-01)' :'var(--ic-02)' }`}\" class=\"pl-circle-loader__wrapper\">\n      <svg class=\"pl-loader-circular__svg\" viewBox=\"25 25 50 50\">\n        <circle class=\"pl-loader-circular__svg-circle\" cx=\"50\" cy=\"50\" r=\"20\" fill=\"none\" :stroke=\"`${+size < 48 ? 'var(--ic-01)' :'var(--ic-02)' }`\" stroke-width=\"2\" />\n      </svg>\n    </div>\n  </div>\n</template>\n"],"names":["_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_normalizeStyle","__props","_hoisted_2"],"mappings":";;;;;;;;;;;sBAQEA,EAAA,GAAAC,EAMM,OANNC,GAMM;AAAA,MALJC,EAIM,OAAA;AAAA,QAJA,OAAKC,EAAA,EAAA,QAAA,GAAcC,EAAA,IAAI,MAAA,OAAA,GAAgBA,EAAA,IAAI,0BAA0BA,EAAA,OAAI,KAAA,iBAAA,cAAA,IAAA;AAAA,QAA4C,OAAM;AAAA,MAAA;SAC/HL,KAAAC,EAEM,OAFNK,GAEM;AAAA,UADJH,EAAiK,UAAA;AAAA,YAAzJ,OAAM;AAAA,YAAiC,IAAG;AAAA,YAAK,IAAG;AAAA,YAAK,GAAE;AAAA,YAAK,MAAK;AAAA,YAAQ,YAAYE,EAAA,OAAI,KAAA,iBAAA,cAAA;AAAA,YAA2C,gBAAa;AAAA,UAAA;;;;;;"}

package/dist/components/PlLogView/PlLogView.vue.js

@@ -1,21 +1,21 @@
 (function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.appendChild(document.createTextNode(`.pl-log-view{--log-background: var(--bg-base-light);--contour-color: var(--txt-01);--contour-border-width: 1px;--label-offset-left-x: 8px;--label-offset-right-x: 8px;--border-color-log-view: var(--border-color-div-grey);height:100%;max-height:calc(100% - var(--contour-offset));max-width:calc(100% - var(--contour-offset));border-radius:6px;background:var(--log-background);display:flex;position:relative;min-height:44px;padding-right:40px}.pl-log-view__contour{position:absolute;top:0;left:0;right:0;bottom:0;border-radius:var(--border-radius-control);border-width:var(--contour-border-width);border-color:var(--border-color-log-view);border-style:solid;box-shadow:none;z-index:0;pointer-events:none}.pl-log-view label{display:flex;align-items:center;gap:4px;position:absolute;top:0;transform:translateY(-60%);left:var(--label-offset-left-x);padding:0 4px;max-width:calc(100% - 16px);overflow:hidden;white-space:pre;text-overflow:ellipsis;cursor:inherit;color:var(--label-color);font-size:12px;font-weight:500;border-bottom-right-radius:4px;border-bottom-left-radius:4px;background:var(--bg-elevated-01)}.pl-log-view label>span{overflow:hidden;white-space:pre;text-overflow:ellipsis}.pl-log-view.has-error{--log-background: linear-gradient(90deg, #FFEBEB 0%, #FFFFFF 100%);--border-color-log-view: var(--border-color-error)}.pl-log-view__copy{position:absolute;top:12px;right:12px;cursor:pointer;--icon-color: var(--ic-02)}.pl-log-view__copy>*:hover{--icon-color: var(--txt-01)}.pl-log-view__content{margin:12px;max-height:100%;max-width:100%;flex:1;color:var(--txt-01);font-feature-settings:"ss11" on,"ss15" on,"ss17" on;font-family:var(--font-family-monospace);white-space:pre;font-size:14px;font-weight:400;line-height:20px;--thumb-color: var(--ic-02);overflow-y:auto;overflow-x:auto}.pl-log-view__content::-webkit-scrollbar{width:var(--scrollbar-width, 6px);height:5px;background-color:transparent;display:block}.pl-log-view__content::-webkit-scrollbar-thumb{background:var(--thumb-color);border-radius:5px}.pl-log-view__content::-webkit-scrollbar-thumb:hover{--thumb-color: var(--border-color-focus)}.pl-log-view__error{margin:12px;max-height:100%;max-width:100%;flex:1;color:var(--txt-01);font-feature-settings:"ss11" on,"ss15" on,"ss17" on;font-family:var(--font-family-monospace);white-space:pre;font-size:14px;font-weight:400;line-height:20px;--thumb-color: var(--ic-02);overflow-y:auto;overflow-x:auto}.pl-log-view__error::-webkit-scrollbar{width:var(--scrollbar-width, 6px);height:5px;background-color:transparent;display:block}.pl-log-view__error::-webkit-scrollbar-thumb{background:var(--thumb-color);border-radius:5px}.pl-log-view__error::-webkit-scrollbar-thumb:hover{--thumb-color: var(--border-color-focus)}
 .double-contour.top>div{border-bottom-right-radius:0;border-bottom-left-radius:0}.double-contour.bottom>div{border-top-right-radius:0;border-top-left-radius:0}.double-contour.left>div{border-top-right-radius:0;border-bottom-right-radius:0}.double-contour.right>div{border-top-left-radius:0;border-bottom-left-radius:0}.double-contour.top-left>div{border-top-right-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0}.double-contour.top-right>div{border-bottom-right-radius:0;border-top-left-radius:0;border-top-right-radius:0}.double-contour.bottom-left>div{border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:0}.double-contour.bottom-right>div{border-top-right-radius:0;border-bottom-left-radius:0;border-top-left-radius:0}.double-contour.middle>div{border-radius:0}`)),document.head.appendChild(o)}}catch(r){console.error("vite-plugin-css-injected-by-js",r)}})();
-import { defineComponent as F, useSlots as L, ref as s, computed as c, watch as P, createElementBlock as p, openBlock as l, normalizeClass as x, createCommentVNode as f, createVNode as u, createElementVNode as C, createBlock as b, toDisplayString as d, unref as r, withCtx as a, renderSlot as R, createTextVNode as S } from "vue";
-import T from "../PlIcon24/PlIcon24.vue.js";
+import { defineComponent as E, useSlots as F, ref as c, computed as u, watch as L, createElementBlock as p, openBlock as l, normalizeClass as P, createCommentVNode as v, createVNode as d, createElementVNode as b, createBlock as S, toDisplayString as m, unref as r, withCtx as i, renderSlot as R, createTextVNode as T } from "vue";
+import h from "../PlIcon24/PlIcon24.vue.js";
 
 import { okOptional as $, tapIf as I } from "@milaboratories/helpers";
 import { useLogHandle as O } from "./useLogHandle.js";
 import { useLabelNotch as j } from "../../utils/useLabelNotch.js";
 import q from "../../utils/DoubleContour.vue.js";
 
-import v from "../PlTooltip/PlTooltip.vue.js";
+import y from "../PlTooltip/PlTooltip.vue.js";
 import { downloadContent as z } from "../../helpers/downloadContent.js";
 const M = { key: 0 }, G = { class: "pl-log-view__copy" }, J = {
   key: 1,
   class: "pl-log-view__error"
 }, K = {
   name: "PlLogView"
-}, ro = /* @__PURE__ */ F({
+}, ro = /* @__PURE__ */ E({
   ...K,
   props: {
     value: {},
@@ -30,111 +30,111 @@ const M = { key: 0 }, G = { class: "pl-log-view__copy" }, J = {
     disableAutoScroll: { type: Boolean },
     downloadFilename: {}
   },
-  setup(h) {
-    const V = (o) => {
+  setup(n) {
+    const x = (o) => {
       if (o && o.ok === !1)
         return o.errors.join(`
 `);
-    }, N = L(), t = h, y = O(t), _ = s(!0), g = s(), k = s(), m = c(() => {
+    }, V = F(), t = n, g = O(t), k = c(!0), w = c(), _ = c(), f = u(() => {
       var o;
-      return ((o = y.value) == null ? void 0 : o.error) ?? t.error ?? V(t.output);
-    }), n = c(() => {
+      return ((o = g.value) == null ? void 0 : o.error) ?? t.error ?? x(t.output);
+    }), a = u(() => {
       var o;
-      return ((o = y.value) == null ? void 0 : o.lines) ?? t.value ?? $(t.output);
-    }), w = c(() => {
+      return ((o = g.value) == null ? void 0 : o.lines) ?? t.value ?? $(t.output);
+    }), C = u(() => {
       if (t.valueToCopy)
         return t.valueToCopy;
-      if (n.value && typeof n.value == "string")
-        return n.value;
-    }), i = s(!1);
-    j(k);
-    const A = c(() => i.value ? "clipboard-copied" : "clipboard"), H = () => {
-      i.value = !0, setTimeout(() => {
-        i.value = !1;
+      if (a.value && typeof a.value == "string")
+        return a.value;
+    }), s = c(!1);
+    j(_);
+    const N = u(() => s.value ? "clipboard-copied" : "clipboard"), A = () => {
+      s.value = !0, setTimeout(() => {
+        s.value = !1;
       }, 1200);
-      const o = w.value;
+      const o = C.value;
       o !== void 0 && navigator.clipboard.writeText(o);
-    }, B = (o) => {
-      const e = w.value;
+    }, H = (o) => {
+      const e = C.value;
       e !== void 0 && z([e, "text/plain"], o);
-    }, D = () => {
-      t.disableAutoScroll || I(g.value, (o) => {
-        _.value && o.scrollTo(o.scrollLeft, o.scrollHeight);
+    }, B = () => {
+      t.disableAutoScroll || I(w.value, (o) => {
+        k.value && o.scrollTo(o.scrollLeft, o.scrollHeight);
       });
     };
-    P(
-      n,
+    L(
+      a,
       () => {
         requestAnimationFrame(() => {
-          D();
+          B();
         });
       },
       { immediate: !0 }
     );
-    const E = (o) => {
+    const D = (o) => {
       const e = o.target;
-      _.value = e.scrollTop + 20 >= e.scrollHeight - e.offsetHeight;
+      k.value = e.scrollTop + 20 >= e.scrollHeight - e.offsetHeight;
     };
     return (o, e) => (l(), p("div", {
       ref_key: "root",
-      ref: k,
-      class: x(["pl-log-view", { "has-error": m.value }])
+      ref: _,
+      class: P(["pl-log-view", { "has-error": f.value }])
     }, [
-      o.label ? (l(), p("label", M, [
-        C("span", null, d(o.label), 1),
-        r(N).tooltip ? (l(), b(r(v), {
+      n.label ? (l(), p("label", M, [
+        b("span", null, m(n.label), 1),
+        r(V).tooltip ? (l(), S(r(y), {
           key: 0,
           class: "info",
           position: "top"
         }, {
-          tooltip: a(() => [
+          tooltip: i(() => [
             R(o.$slots, "tooltip")
           ]),
           _: 3
-        })) : f("", !0)
-      ])) : f("", !0),
-      u(q, { class: "pl-log-view__contour" }),
-      C("div", G, [
-        u(r(v), {
+        })) : v("", !0)
+      ])) : v("", !0),
+      d(q, { class: "pl-log-view__contour" }),
+      b("div", G, [
+        d(r(y), {
           "close-delay": 800,
           position: "top"
         }, {
-          tooltip: a(() => [
-            S(d(i.value ? "copied" : "copy"), 1)
+          tooltip: i(() => [
+            T(m(s.value ? "copied" : "copy"), 1)
           ]),
-          default: a(() => [
-            u(r(T), {
+          default: i(() => [
+            d(r(h), {
               title: "Copy content",
-              name: A.value,
-              onClick: H
+              name: N.value,
+              onClick: A
             }, null, 8, ["name"])
           ]),
           _: 1
         }),
-        o.downloadFilename ? (l(), b(r(v), {
+        n.downloadFilename ? (l(), S(r(y), {
           key: 0,
           "close-delay": 800,
           position: "top"
         }, {
-          tooltip: a(() => e[1] || (e[1] = [
-            S("download")
-          ])),
-          default: a(() => [
-            u(r(T), {
+          tooltip: i(() => [...e[1] || (e[1] = [
+            T("download", -1)
+          ])]),
+          default: i(() => [
+            d(r(h), {
               name: "download",
-              onClick: e[0] || (e[0] = () => B(o.downloadFilename))
+              onClick: e[0] || (e[0] = () => H(n.downloadFilename))
             })
           ]),
           _: 1
-        })) : f("", !0)
+        })) : v("", !0)
       ]),
-      m.value ? (l(), p("div", J, d(m.value), 1)) : (l(), p("div", {
+      f.value ? (l(), p("div", J, m(f.value), 1)) : (l(), p("div", {
         key: 2,
         ref_key: "contentRef",
-        ref: g,
+        ref: w,
         class: "pl-log-view__content",
-        onScroll: E
-      }, d(n.value), 545))
+        onScroll: D
+      }, m(a.value), 545))
     ], 2));
   }
 });

package/dist/components/PlLogView/PlLogView.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlLogView.vue.js","sources":["../../../src/components/PlLogView/PlLogView.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Log Viewer Component\n */\nexport default {\n  name: 'PlLogView',\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, useSlots, watch } from 'vue';\nimport { PlMaskIcon24 } from '../PlMaskIcon24';\nimport './pl-log-view.scss';\nimport { okOptional, tapIf } from '@milaboratories/helpers';\nimport type { AnyLogHandle, Platforma, ValueOrErrors } from '@platforma-sdk/model';\nimport { useLogHandle } from './useLogHandle';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport { PlTooltip } from '../PlTooltip';\nimport { PlIcon24 } from '../PlIcon24';\nimport { downloadContent } from '../../helpers/dom';\n\nconst getOutputError = <T>(o?: ValueOrErrors<T>) => {\n  if (o && o.ok === false) {\n    return o.errors.join('\\n');\n  }\n};\n\nconst slots = useSlots();\n\nconst props = defineProps<{\n  /**\n   * String contents\n   */\n  value?: string;\n  /**\n   * The content to copy (Note: it takes precedence over value property)\n   */\n  valueToCopy?: string;\n  /**\n   * AnyLogHandle\n   */\n  logHandle?: AnyLogHandle;\n  /**\n   * Custom progress prefix (to filter logHandle results)\n   */\n  progressPrefix?: string;\n  /**\n   * String contents\n   */\n  error?: unknown;\n  /**\n   * Block output (Note: error and value take precedence over output property)\n   */\n  output?: ValueOrErrors<unknown>;\n  /**\n   * Max retries for AnyLogHandle fetch (with the same parameters)\n   */\n  maxRetries?: number;\n  /**\n   * @TODO\n   */\n  mockPlatforma?: Platforma;\n  /**\n   * The label to display above the texarea.\n   */\n  label?: string;\n  /**\n   * Do not scroll to bottom on content change. Default is false (scroll to bottom).\n   */\n  disableAutoScroll?: boolean;\n  /**\n   * If provided, a download icon will be shown and the content will be downloaded when clicked.\n   */\n  downloadFilename?: string;\n}>();\n\nconst logState = useLogHandle(props);\n\nconst isAnchored = ref<boolean>(true);\n\nconst contentRef = ref<HTMLElement>();\n\nconst root = ref<HTMLInputElement>();\n\nconst computedError = computed(() => logState.value?.error ?? props.error ?? getOutputError(props.output));\n\nconst computedValue = computed(() => logState.value?.lines ?? props.value ?? okOptional(props.output));\n\nconst computedValueToCopy = computed(() => {\n  if (props.valueToCopy) {\n    return props.valueToCopy;\n  }\n  if (computedValue.value && typeof computedValue.value === 'string') {\n    return computedValue.value;\n  }\n  return undefined;\n});\n\nconst copyActive = ref(false);\n\nuseLabelNotch(root);\n\nconst iconName = computed(() => (copyActive.value ? 'clipboard-copied' : 'clipboard'));\n\nconst onClickCopy = () => {\n  copyActive.value = true;\n  setTimeout(() => {\n    copyActive.value = false;\n  }, 1200);\n\n  const toCopy = computedValueToCopy.value;\n\n  if (toCopy !== undefined) {\n    navigator.clipboard.writeText(toCopy);\n  }\n};\n\nconst onClickDownload = (filename: string) => {\n  const toDownload = computedValueToCopy.value;\n\n  if (toDownload !== undefined) {\n    downloadContent([toDownload, 'text/plain'], filename);\n  }\n};\n\nconst optionallyScrollDown = () => {\n  if (props.disableAutoScroll) {\n    return;\n  }\n\n  tapIf(contentRef.value, (el) => {\n    if (isAnchored.value) {\n      el.scrollTo(el.scrollLeft, el.scrollHeight);\n    }\n  });\n};\n\nwatch(\n  computedValue,\n  () => {\n    requestAnimationFrame(() => {\n      optionallyScrollDown();\n    });\n  },\n  { immediate: true },\n);\n\nconst onContentScroll = (ev: Event) => {\n  const el = ev.target as HTMLElement;\n  isAnchored.value = el.scrollTop + 20 /* ~ 1 line height */ >= el.scrollHeight - el.offsetHeight;\n};\n</script>\n\n<template>\n  <div ref=\"root\" class=\"pl-log-view\" :class=\"{ 'has-error': computedError }\">\n    <label v-if=\"label\">\n      <span>{{ label }}</span>\n      <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n        <template #tooltip>\n          <slot name=\"tooltip\" />\n        </template>\n      </PlTooltip>\n    </label>\n    <DoubleContour class=\"pl-log-view__contour\" />\n    <div class=\"pl-log-view__copy\">\n      <PlTooltip :close-delay=\"800\" position=\"top\">\n        <PlMaskIcon24 title=\"Copy content\" :name=\"iconName\" @click=\"onClickCopy\" />\n        <template #tooltip>{{ copyActive ? 'copied' : 'copy' }}</template>\n      </PlTooltip>\n      <PlTooltip v-if=\"downloadFilename\" :close-delay=\"800\" position=\"top\">\n        <PlIcon24 name=\"download\" @click=\"() => onClickDownload(downloadFilename!)\" />\n        <template #tooltip>download</template>\n      </PlTooltip>\n    </div>\n    <div v-if=\"computedError\" class=\"pl-log-view__error\">{{ computedError }}</div>\n    <div v-else ref=\"contentRef\" class=\"pl-log-view__content\" @scroll=\"onContentScroll\">{{ computedValue }}</div>\n  </div>\n</template>\n"],"names":["__default__","getOutputError","slots","useSlots","props","__props","logState","useLogHandle","isAnchored","ref","contentRef","root","computedError","computed","_a","computedValue","okOptional","computedValueToCopy","copyActive","useLabelNotch","iconName","onClickCopy","toCopy","onClickDownload","filename","toDownload","downloadContent","optionallyScrollDown","tapIf","el","watch","onContentScroll","ev"],"mappings":";;;;;;;;;;;;;GAIAA,IAAe;AAAA,EACb,MAAM;AACR;;;;;;;;;;;;;;;;AAgBA,UAAMC,IAAiB,CAAI,MAAyB;AAClD,UAAI,KAAK,EAAE,OAAO;AAChB,eAAO,EAAE,OAAO,KAAK;AAAA,CAAI;AAAA,IAE7B,GAEMC,IAAQC,EAAA,GAERC,IAAQC,GA+CRC,IAAWC,EAAaH,CAAK,GAE7BI,IAAaC,EAAa,EAAI,GAE9BC,IAAaD,EAAA,GAEbE,IAAOF,EAAA,GAEPG,IAAgBC,EAAS,MAAA;;AAAM,eAAAC,IAAAR,EAAS,UAAT,gBAAAQ,EAAgB,UAASV,EAAM,SAASH,EAAeG,EAAM,MAAM;AAAA,KAAC,GAEnGW,IAAgBF,EAAS,MAAA;;AAAM,eAAAC,IAAAR,EAAS,UAAT,gBAAAQ,EAAgB,UAASV,EAAM,SAASY,EAAWZ,EAAM,MAAM;AAAA,KAAC,GAE/Fa,IAAsBJ,EAAS,MAAM;AACzC,UAAIT,EAAM;AACR,eAAOA,EAAM;AAEf,UAAIW,EAAc,SAAS,OAAOA,EAAc,SAAU;AACxD,eAAOA,EAAc;AAAA,IAGzB,CAAC,GAEKG,IAAaT,EAAI,EAAK;AAE5B,IAAAU,EAAcR,CAAI;AAElB,UAAMS,IAAWP,EAAS,MAAOK,EAAW,QAAQ,qBAAqB,WAAY,GAE/EG,IAAc,MAAM;AACxB,MAAAH,EAAW,QAAQ,IACnB,WAAW,MAAM;AACf,QAAAA,EAAW,QAAQ;AAAA,MACrB,GAAG,IAAI;AAEP,YAAMI,IAASL,EAAoB;AAEnC,MAAIK,MAAW,UACb,UAAU,UAAU,UAAUA,CAAM;AAAA,IAExC,GAEMC,IAAkB,CAACC,MAAqB;AAC5C,YAAMC,IAAaR,EAAoB;AAEvC,MAAIQ,MAAe,UACjBC,EAAgB,CAACD,GAAY,YAAY,GAAGD,CAAQ;AAAA,IAExD,GAEMG,IAAuB,MAAM;AACjC,MAAIvB,EAAM,qBAIVwB,EAAMlB,EAAW,OAAO,CAACmB,MAAO;AAC9B,QAAIrB,EAAW,SACbqB,EAAG,SAASA,EAAG,YAAYA,EAAG,YAAY;AAAA,MAE9C,CAAC;AAAA,IACH;AAEA,IAAAC;AAAA,MACEf;AAAA,MACA,MAAM;AACJ,8BAAsB,MAAM;AAC1B,UAAAY,EAAA;AAAA,QACF,CAAC;AAAA,MACH;AAAA,MACA,EAAE,WAAW,GAAA;AAAA,IAAK;AAGpB,UAAMI,IAAkB,CAACC,MAAc;AACrC,YAAMH,IAAKG,EAAG;AACd,MAAAxB,EAAW,QAAQqB,EAAG,YAAY,MAA4BA,EAAG,eAAeA,EAAG;AAAA,IACrF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"PlLogView.vue.js","sources":["../../../src/components/PlLogView/PlLogView.vue"],"sourcesContent":["<script lang=\"ts\">\n/**\n * Log Viewer Component\n */\nexport default {\n  name: 'PlLogView',\n};\n</script>\n\n<script lang=\"ts\" setup>\nimport { computed, ref, useSlots, watch } from 'vue';\nimport { PlMaskIcon24 } from '../PlMaskIcon24';\nimport './pl-log-view.scss';\nimport { okOptional, tapIf } from '@milaboratories/helpers';\nimport type { AnyLogHandle, Platforma, ValueOrErrors } from '@platforma-sdk/model';\nimport { useLogHandle } from './useLogHandle';\nimport { useLabelNotch } from '../../utils/useLabelNotch';\nimport DoubleContour from '../../utils/DoubleContour.vue';\nimport { PlTooltip } from '../PlTooltip';\nimport { PlIcon24 } from '../PlIcon24';\nimport { downloadContent } from '../../helpers/dom';\n\nconst getOutputError = <T>(o?: ValueOrErrors<T>) => {\n  if (o && o.ok === false) {\n    return o.errors.join('\\n');\n  }\n};\n\nconst slots = useSlots();\n\nconst props = defineProps<{\n  /**\n   * String contents\n   */\n  value?: string;\n  /**\n   * The content to copy (Note: it takes precedence over value property)\n   */\n  valueToCopy?: string;\n  /**\n   * AnyLogHandle\n   */\n  logHandle?: AnyLogHandle;\n  /**\n   * Custom progress prefix (to filter logHandle results)\n   */\n  progressPrefix?: string;\n  /**\n   * String contents\n   */\n  error?: unknown;\n  /**\n   * Block output (Note: error and value take precedence over output property)\n   */\n  output?: ValueOrErrors<unknown>;\n  /**\n   * Max retries for AnyLogHandle fetch (with the same parameters)\n   */\n  maxRetries?: number;\n  /**\n   * @TODO\n   */\n  mockPlatforma?: Platforma;\n  /**\n   * The label to display above the texarea.\n   */\n  label?: string;\n  /**\n   * Do not scroll to bottom on content change. Default is false (scroll to bottom).\n   */\n  disableAutoScroll?: boolean;\n  /**\n   * If provided, a download icon will be shown and the content will be downloaded when clicked.\n   */\n  downloadFilename?: string;\n}>();\n\nconst logState = useLogHandle(props);\n\nconst isAnchored = ref<boolean>(true);\n\nconst contentRef = ref<HTMLElement>();\n\nconst root = ref<HTMLInputElement>();\n\nconst computedError = computed(() => logState.value?.error ?? props.error ?? getOutputError(props.output));\n\nconst computedValue = computed(() => logState.value?.lines ?? props.value ?? okOptional(props.output));\n\nconst computedValueToCopy = computed(() => {\n  if (props.valueToCopy) {\n    return props.valueToCopy;\n  }\n  if (computedValue.value && typeof computedValue.value === 'string') {\n    return computedValue.value;\n  }\n  return undefined;\n});\n\nconst copyActive = ref(false);\n\nuseLabelNotch(root);\n\nconst iconName = computed(() => (copyActive.value ? 'clipboard-copied' : 'clipboard'));\n\nconst onClickCopy = () => {\n  copyActive.value = true;\n  setTimeout(() => {\n    copyActive.value = false;\n  }, 1200);\n\n  const toCopy = computedValueToCopy.value;\n\n  if (toCopy !== undefined) {\n    navigator.clipboard.writeText(toCopy);\n  }\n};\n\nconst onClickDownload = (filename: string) => {\n  const toDownload = computedValueToCopy.value;\n\n  if (toDownload !== undefined) {\n    downloadContent([toDownload, 'text/plain'], filename);\n  }\n};\n\nconst optionallyScrollDown = () => {\n  if (props.disableAutoScroll) {\n    return;\n  }\n\n  tapIf(contentRef.value, (el) => {\n    if (isAnchored.value) {\n      el.scrollTo(el.scrollLeft, el.scrollHeight);\n    }\n  });\n};\n\nwatch(\n  computedValue,\n  () => {\n    requestAnimationFrame(() => {\n      optionallyScrollDown();\n    });\n  },\n  { immediate: true },\n);\n\nconst onContentScroll = (ev: Event) => {\n  const el = ev.target as HTMLElement;\n  isAnchored.value = el.scrollTop + 20 /* ~ 1 line height */ >= el.scrollHeight - el.offsetHeight;\n};\n</script>\n\n<template>\n  <div ref=\"root\" class=\"pl-log-view\" :class=\"{ 'has-error': computedError }\">\n    <label v-if=\"label\">\n      <span>{{ label }}</span>\n      <PlTooltip v-if=\"slots.tooltip\" class=\"info\" position=\"top\">\n        <template #tooltip>\n          <slot name=\"tooltip\" />\n        </template>\n      </PlTooltip>\n    </label>\n    <DoubleContour class=\"pl-log-view__contour\" />\n    <div class=\"pl-log-view__copy\">\n      <PlTooltip :close-delay=\"800\" position=\"top\">\n        <PlMaskIcon24 title=\"Copy content\" :name=\"iconName\" @click=\"onClickCopy\" />\n        <template #tooltip>{{ copyActive ? 'copied' : 'copy' }}</template>\n      </PlTooltip>\n      <PlTooltip v-if=\"downloadFilename\" :close-delay=\"800\" position=\"top\">\n        <PlIcon24 name=\"download\" @click=\"() => onClickDownload(downloadFilename!)\" />\n        <template #tooltip>download</template>\n      </PlTooltip>\n    </div>\n    <div v-if=\"computedError\" class=\"pl-log-view__error\">{{ computedError }}</div>\n    <div v-else ref=\"contentRef\" class=\"pl-log-view__content\" @scroll=\"onContentScroll\">{{ computedValue }}</div>\n  </div>\n</template>\n"],"names":["__default__","getOutputError","slots","useSlots","props","__props","logState","useLogHandle","isAnchored","ref","contentRef","root","computedError","computed","_a","computedValue","okOptional","computedValueToCopy","copyActive","useLabelNotch","iconName","onClickCopy","toCopy","onClickDownload","filename","toDownload","downloadContent","optionallyScrollDown","tapIf","el","watch","onContentScroll","ev","_createElementBlock","_normalizeClass","_hoisted_1","_createElementVNode","_unref","_createBlock","PlTooltip","_renderSlot","_ctx","_createVNode","DoubleContour","_hoisted_2","PlMaskIcon24","_cache","PlIcon24","_hoisted_3","_toDisplayString"],"mappings":"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"}