@bagelink/vue 0.0.951 → 0.0.953

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"FileUpload.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/FileUpload.vue"],"names":[],"mappings":"AA4kBA,OAAO,EAAmC,KAAK,WAAW,EAAkB,MAAM,eAAe,CAAA;AAKjG,KAAK,MAAM,GAAG,MAAM,WAAW,CAAA;AAE/B,KAAK,OAAO,GAAG,MAAM,EAAE,GAAG,MAAM,GAAG,MAAM,CAAA;AA0JzC,iBAAS,MAAM,SAiBd;AA6BD,iBAAS,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;0BA7KZ,MAAM;4BACJ,OAAO;uBACZ,MAAM;2BACF,OAAO;;YAulBS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;0BA1lBpB,MAAM;4BACJ,OAAO;uBACZ,MAAM;2BACF,OAAO;;;YAwlBe,GAAG;;;WASvB,OAAO,IAA6B;EAEjD;AAuBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;YAtpBZ,MAAM;eACH,OAAO;YACV,WAAW,GAAG,WAAW,EAAE;cACzB,MAAM;iBACH,OAAO;YACZ,MAAM;aACL,MAAM,GAAG,MAAM;YAChB,MAAM;WACP,OAAO;WACP,OAAO;YACN,UAAU,GAAG,OAAO;aACnB,MAAM;eACJ,OAAO;;;;;YAZV,MAAM;eACH,OAAO;YACV,WAAW,GAAG,WAAW,EAAE;cACzB,MAAM;iBACH,OAAO;YACZ,MAAM;aACL,MAAM,GAAG,MAAM;YAChB,MAAM;WACP,OAAO;WACP,OAAO;YACN,UAAU,GAAG,OAAO;aACnB,MAAM;eACJ,OAAO;;;;kFAipBjB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAWpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
1
+ {"version":3,"file":"FileUpload.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/FileUpload.vue"],"names":[],"mappings":"AA4lBA,OAAO,EAAmC,KAAK,WAAW,EAAkB,MAAM,eAAe,CAAA;AAKjG,KAAK,MAAM,GAAG,MAAM,WAAW,CAAA;AAE/B,KAAK,OAAO,GAAG,MAAM,EAAE,GAAG,MAAM,GAAG,MAAM,CAAA;AA0JzC,iBAAS,MAAM,SAiBd;AA6BD,iBAAS,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;0BA7KZ,MAAM;4BACJ,OAAO;uBACZ,MAAM;2BACF,OAAO;;YAiqBS,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;0BApqBpB,MAAM;4BACJ,OAAO;uBACZ,MAAM;2BACF,OAAO;;;YAkqBgB,GAAG;;;WASxB,OAAO,IAA6B;EAEjD;AAuBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;YAhuBZ,MAAM;eACH,OAAO;YACV,WAAW,GAAG,WAAW,EAAE;cACzB,MAAM;iBACH,OAAO;YACZ,MAAM;aACL,MAAM,GAAG,MAAM;YAChB,MAAM;WACP,OAAO;WACP,OAAO;YACN,UAAU,GAAG,OAAO;aACnB,MAAM;eACJ,OAAO;;;;;YAZV,MAAM;eACH,OAAO;YACV,WAAW,GAAG,WAAW,EAAE;cACzB,MAAM;iBACH,OAAO;YACZ,MAAM;aACL,MAAM,GAAG,MAAM;YAChB,MAAM;WACP,OAAO;WACP,OAAO;YACN,UAAU,GAAG,OAAO;aACnB,MAAM;eACJ,OAAO;;;;kFA2tBjB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAWpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
package/dist/index.cjs CHANGED
@@ -18658,39 +18658,40 @@ const _hoisted_2$l = {
18658
18658
  required: "",
18659
18659
  class: "pixel"
18660
18660
  };
18661
- const _hoisted_3$h = { class: "ellipsis-1 word-break-all h-20 m-0" };
18662
- const _hoisted_4$b = {
18663
- key: 0,
18661
+ const _hoisted_3$h = { class: "m-05 flex opacity-7 z-99" };
18662
+ const _hoisted_4$b = { class: "ellipsis-1 word-break-all h-20 m-0" };
18663
+ const _hoisted_5$a = {
18664
+ key: 1,
18664
18665
  class: "txt-gray txt-12"
18665
18666
  };
18666
- const _hoisted_5$a = {
18667
+ const _hoisted_6$8 = {
18667
18668
  key: 0,
18668
18669
  class: "bgl-multi-preview"
18669
18670
  };
18670
- const _hoisted_6$8 = ["src"];
18671
- const _hoisted_7$5 = { class: "m-0" };
18672
- const _hoisted_8$3 = ["width", "src"];
18673
- const _hoisted_9$2 = { class: "no-margin multi-preview-txt" };
18674
- const _hoisted_10$2 = {
18671
+ const _hoisted_7$5 = ["src"];
18672
+ const _hoisted_8$3 = { class: "m-0" };
18673
+ const _hoisted_9$2 = ["width", "src"];
18674
+ const _hoisted_10$2 = { class: "no-margin multi-preview-txt" };
18675
+ const _hoisted_11$1 = {
18675
18676
  key: 0,
18676
18677
  class: "progress"
18677
18678
  };
18678
- const _hoisted_11$1 = {
18679
+ const _hoisted_12$1 = {
18679
18680
  key: 1,
18680
18681
  class: "bgl-single-preview"
18681
18682
  };
18682
- const _hoisted_12$1 = { class: "position-start m-05 flex opacity-7 z-99" };
18683
- const _hoisted_13$1 = {
18683
+ const _hoisted_13$1 = { class: "position-start m-05 flex opacity-7 z-99" };
18684
+ const _hoisted_14$1 = {
18684
18685
  key: 0,
18685
18686
  class: "h-100"
18686
18687
  };
18687
- const _hoisted_14$1 = ["src"];
18688
- const _hoisted_15$1 = {
18688
+ const _hoisted_15$1 = ["src"];
18689
+ const _hoisted_16 = {
18689
18690
  key: 0,
18690
18691
  class: "progress"
18691
18692
  };
18692
- const _hoisted_16 = ["src"];
18693
- const _hoisted_17 = { class: "p-1 flex column hover fileUploadPlaceHolder justify-content-center mb-05" };
18693
+ const _hoisted_17 = ["src"];
18694
+ const _hoisted_18 = { class: "p-1 flex column hover fileUploadPlaceHolder justify-content-center mb-05" };
18694
18695
  const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
18695
18696
  __name: "FileUpload",
18696
18697
  props: {
@@ -18762,7 +18763,7 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
18762
18763
  return [a2].flat().every((id) => [b2].flat().includes(id)) && [b2].flat().every((id) => [a2].flat().includes(id));
18763
18764
  }
18764
18765
  vue.watch(() => props2.modelValue, (newVal = []) => {
18765
- console.log(newVal);
18766
+ console.log(newVal, "newVal");
18766
18767
  const isSame = compareLists(file_bindkeys.value, newVal);
18767
18768
  if (!isSame) {
18768
18769
  file_bindkeys.value = newVal;
@@ -18851,8 +18852,8 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
18851
18852
  flushQueue();
18852
18853
  }
18853
18854
  return (_ctx, _cache) => {
18854
- const _directive_lightbox = vue.resolveDirective("lightbox");
18855
18855
  const _directive_tooltip = vue.resolveDirective("tooltip");
18856
+ const _directive_lightbox = vue.resolveDirective("lightbox");
18856
18857
  return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$v, [
18857
18858
  vue.createElementVNode("label", null, vue.toDisplayString(_ctx.label), 1),
18858
18859
  _ctx.required && !storageFiles.value.length ? (vue.openBlock(), vue.createElementBlock("input", _hoisted_2$l)) : vue.createCommentVNode("", true),
@@ -18864,33 +18865,68 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
18864
18865
  onDrop: drop3
18865
18866
  }, {
18866
18867
  default: vue.withCtx(() => [
18867
- vue.createVNode(vue.unref(Btn), {
18868
+ !storageFiles.value.length && !fileQueue.value.length ? (vue.openBlock(), vue.createBlock(vue.unref(Btn), {
18869
+ key: 0,
18868
18870
  class: "px-1-5",
18869
18871
  icon: "upload",
18870
18872
  outline: "",
18871
18873
  onClick: browse
18872
18874
  }, {
18873
- default: vue.withCtx(() => _cache[1] || (_cache[1] = [
18875
+ default: vue.withCtx(() => _cache[2] || (_cache[2] = [
18874
18876
  vue.createTextVNode(" Upload ")
18875
18877
  ])),
18876
18878
  _: 1
18877
- }),
18879
+ })) : vue.createCommentVNode("", true),
18878
18880
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(storageFiles.value, (file) => {
18879
18881
  return vue.openBlock(), vue.createElementBlock("div", {
18880
18882
  key: file.id,
18881
18883
  class: "txt-gray txt-12 flex"
18882
18884
  }, [
18883
- vue.createElementVNode("p", _hoisted_3$h, vue.toDisplayString(file.name), 1),
18884
- vue.createVNode(vue.unref(Btn), {
18885
- thin: "",
18886
- flat: "",
18887
- icon: "delete",
18888
- color: "red",
18889
- onClick: vue.withModifiers(($event) => removeFile(file), ["stop"])
18890
- }, null, 8, ["onClick"])
18885
+ vue.createElementVNode("div", _hoisted_3$h, [
18886
+ vue.withDirectives(vue.createVNode(vue.unref(Btn), {
18887
+ color: "gray",
18888
+ thin: "",
18889
+ icon: "delete",
18890
+ onClick: vue.withModifiers(($event) => removeFile(file), ["stop"])
18891
+ }, null, 8, ["onClick"]), [
18892
+ [_directive_tooltip, "Delete"]
18893
+ ]),
18894
+ vue.withDirectives(vue.createVNode(vue.unref(Btn), {
18895
+ color: "gray",
18896
+ thin: "",
18897
+ icon: "autorenew",
18898
+ onClick: browse
18899
+ }, null, 512), [
18900
+ [_directive_tooltip, "Replace"]
18901
+ ]),
18902
+ vue.withDirectives(vue.createVNode(vue.unref(Btn), {
18903
+ href: file.url,
18904
+ download: file.name,
18905
+ color: "gray",
18906
+ thin: "",
18907
+ icon: "download",
18908
+ target: "_blank",
18909
+ onClick: _cache[0] || (_cache[0] = vue.withModifiers(() => {
18910
+ }, ["stop"]))
18911
+ }, null, 8, ["href", "download"]), [
18912
+ [_directive_tooltip, "Download"]
18913
+ ]),
18914
+ vue.withDirectives((vue.openBlock(), vue.createElementBlock("p", _hoisted_4$b, [
18915
+ vue.createTextVNode(vue.toDisplayString(file.name), 1)
18916
+ ])), [
18917
+ [_directive_lightbox, { src: file.url, download: true }]
18918
+ ]),
18919
+ vue.createVNode(vue.unref(Btn), {
18920
+ thin: "",
18921
+ flat: "",
18922
+ icon: "delete",
18923
+ color: "red",
18924
+ onClick: vue.withModifiers(($event) => removeFile(file), ["stop"])
18925
+ }, null, 8, ["onClick"])
18926
+ ])
18891
18927
  ]);
18892
18928
  }), 128)),
18893
- !storageFiles.value.length && !fileQueue.value.length ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$b, " No file selected ")) : vue.createCommentVNode("", true)
18929
+ !storageFiles.value.length && !fileQueue.value.length ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_5$a, " No file selected ")) : vue.createCommentVNode("", true)
18894
18930
  ]),
18895
18931
  _: 1
18896
18932
  })) : (vue.openBlock(), vue.createElementBlock("div", {
@@ -18910,7 +18946,7 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
18910
18946
  files: storageFiles.value,
18911
18947
  fileQueue: fileQueue.value
18912
18948
  }, () => [
18913
- _ctx.multiple ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_5$a, [
18949
+ _ctx.multiple ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6$8, [
18914
18950
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(storageFiles.value, (file) => {
18915
18951
  return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
18916
18952
  key: file.id,
@@ -18921,12 +18957,12 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
18921
18957
  class: "multi-preview",
18922
18958
  src: file.url,
18923
18959
  alt: ""
18924
- }, null, 8, _hoisted_6$8)) : (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$c), {
18960
+ }, null, 8, _hoisted_7$5)) : (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$c), {
18925
18961
  key: 1,
18926
18962
  icon: "draft",
18927
18963
  class: "multi-preview"
18928
18964
  })),
18929
- vue.createElementVNode("p", _hoisted_7$5, vue.toDisplayString(file.name), 1),
18965
+ vue.createElementVNode("p", _hoisted_8$3, vue.toDisplayString(file.name), 1),
18930
18966
  vue.createVNode(vue.unref(Btn), {
18931
18967
  thin: "",
18932
18968
  flat: "",
@@ -18950,18 +18986,18 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
18950
18986
  class: "multi-preview",
18951
18987
  src: fileToUrl(fileQ.file),
18952
18988
  alt: ""
18953
- }, null, 8, _hoisted_8$3)) : vue.createCommentVNode("", true)
18989
+ }, null, 8, _hoisted_9$2)) : vue.createCommentVNode("", true)
18954
18990
  ], 64)) : (vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$c), {
18955
18991
  key: 1,
18956
18992
  icon: "draft",
18957
18993
  class: "multi-preview"
18958
18994
  })),
18959
- vue.createElementVNode("p", _hoisted_9$2, vue.toDisplayString(fileQ.name), 1),
18995
+ vue.createElementVNode("p", _hoisted_10$2, vue.toDisplayString(fileQ.name), 1),
18960
18996
  vue.createElementVNode("div", {
18961
18997
  class: vue.normalizeClass(["pie", { complete: fileQ.progress === 100 }]),
18962
18998
  style: vue.normalizeStyle([`--p:${fileQ.progress}`, { "--b": "2px" }])
18963
18999
  }, [
18964
- fileQ.progress < 100 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_10$2, vue.toDisplayString(`${fileQ.progress.toFixed(0)}`), 1)) : vue.createCommentVNode("", true),
19000
+ fileQ.progress < 100 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_11$1, vue.toDisplayString(`${fileQ.progress.toFixed(0)}`), 1)) : vue.createCommentVNode("", true),
18965
19001
  vue.createVNode(vue.unref(_sfc_main$c), {
18966
19002
  class: "success",
18967
19003
  icon: "check"
@@ -18970,13 +19006,13 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
18970
19006
  ]);
18971
19007
  }), 128))
18972
19008
  ])) : vue.createCommentVNode("", true),
18973
- !_ctx.multiple && (storageFiles.value.length > 0 || fileQueue.value.length > 0) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_11$1, [
19009
+ !_ctx.multiple && (storageFiles.value.length > 0 || fileQueue.value.length > 0) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_12$1, [
18974
19010
  (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(storageFiles.value, (file) => {
18975
19011
  return vue.openBlock(), vue.createElementBlock("div", {
18976
19012
  key: file.id,
18977
19013
  class: vue.normalizeClass(["single-image-item-preview", { "bgl_fill-image": _ctx.fill }])
18978
19014
  }, [
18979
- vue.createElementVNode("div", _hoisted_12$1, [
19015
+ vue.createElementVNode("div", _hoisted_13$1, [
18980
19016
  vue.withDirectives(vue.createVNode(vue.unref(Btn), {
18981
19017
  color: "gray",
18982
19018
  thin: "",
@@ -19000,18 +19036,18 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
19000
19036
  thin: "",
19001
19037
  icon: "download",
19002
19038
  target: "_blank",
19003
- onClick: _cache[0] || (_cache[0] = vue.withModifiers(() => {
19039
+ onClick: _cache[1] || (_cache[1] = vue.withModifiers(() => {
19004
19040
  }, ["stop"]))
19005
19041
  }, null, 8, ["href", "download"]), [
19006
19042
  [_directive_tooltip, "Download"]
19007
19043
  ])
19008
19044
  ]),
19009
- isImage(file.extension || file.url) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_13$1, [
19045
+ isImage(file.extension || file.url) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_14$1, [
19010
19046
  vue.withDirectives(vue.createElementVNode("img", {
19011
19047
  class: "single-preview",
19012
19048
  src: file.url,
19013
19049
  alt: ""
19014
- }, null, 8, _hoisted_14$1), [
19050
+ }, null, 8, _hoisted_15$1), [
19015
19051
  [_directive_lightbox, { src: file.url, download: true }]
19016
19052
  ])
19017
19053
  ])) : vue.withDirectives((vue.openBlock(), vue.createBlock(vue.unref(_sfc_main$c), {
@@ -19034,7 +19070,7 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
19034
19070
  class: vue.normalizeClass(["pie", { complete: fileQ.progress === 100 }]),
19035
19071
  style: vue.normalizeStyle([`--p:${fileQ.progress}`, { "--b": "2px" }])
19036
19072
  }, [
19037
- fileQ.progress < 100 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_15$1, vue.toDisplayString(`${fileQ.progress.toFixed(0)}`), 1)) : vue.createCommentVNode("", true),
19073
+ fileQ.progress < 100 ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_16, vue.toDisplayString(`${fileQ.progress.toFixed(0)}`), 1)) : vue.createCommentVNode("", true),
19038
19074
  vue.createVNode(vue.unref(_sfc_main$c), {
19039
19075
  class: "success",
19040
19076
  icon: "check"
@@ -19045,7 +19081,7 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
19045
19081
  class: "single-preview",
19046
19082
  src: fileToUrl(fileQ.file),
19047
19083
  alt: ""
19048
- }, null, 8, _hoisted_16)) : vue.createCommentVNode("", true)
19084
+ }, null, 8, _hoisted_17)) : vue.createCommentVNode("", true)
19049
19085
  ], 2);
19050
19086
  }), 128))
19051
19087
  ])) : vue.createCommentVNode("", true)
@@ -19056,9 +19092,9 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
19056
19092
  fileQueue: fileQueue.value,
19057
19093
  browse
19058
19094
  }, () => [
19059
- vue.createElementVNode("p", _hoisted_17, [
19095
+ vue.createElementVNode("p", _hoisted_18, [
19060
19096
  vue.createVNode(vue.unref(_sfc_main$c), { icon: "upload_2" }),
19061
- _cache[2] || (_cache[2] = vue.createTextVNode(" Drop files here or click to upload "))
19097
+ _cache[3] || (_cache[3] = vue.createTextVNode(" Drop files here or click to upload "))
19062
19098
  ])
19063
19099
  ], true) : vue.createCommentVNode("", true)
19064
19100
  ], 38))
@@ -19066,7 +19102,7 @@ const _sfc_main$D = /* @__PURE__ */ vue.defineComponent({
19066
19102
  };
19067
19103
  }
19068
19104
  });
19069
- const $el = /* @__PURE__ */ _export_sfc(_sfc_main$D, [["__scopeId", "data-v-36f16bdf"]]);
19105
+ const $el = /* @__PURE__ */ _export_sfc(_sfc_main$D, [["__scopeId", "data-v-0dfbee23"]]);
19070
19106
  const _hoisted_1$u = ["title"];
19071
19107
  const _hoisted_2$k = { key: 0 };
19072
19108
  const _hoisted_3$g = ["value", "placeholder"];
package/dist/index.mjs CHANGED
@@ -18656,39 +18656,40 @@ const _hoisted_2$l = {
18656
18656
  required: "",
18657
18657
  class: "pixel"
18658
18658
  };
18659
- const _hoisted_3$h = { class: "ellipsis-1 word-break-all h-20 m-0" };
18660
- const _hoisted_4$b = {
18661
- key: 0,
18659
+ const _hoisted_3$h = { class: "m-05 flex opacity-7 z-99" };
18660
+ const _hoisted_4$b = { class: "ellipsis-1 word-break-all h-20 m-0" };
18661
+ const _hoisted_5$a = {
18662
+ key: 1,
18662
18663
  class: "txt-gray txt-12"
18663
18664
  };
18664
- const _hoisted_5$a = {
18665
+ const _hoisted_6$8 = {
18665
18666
  key: 0,
18666
18667
  class: "bgl-multi-preview"
18667
18668
  };
18668
- const _hoisted_6$8 = ["src"];
18669
- const _hoisted_7$5 = { class: "m-0" };
18670
- const _hoisted_8$3 = ["width", "src"];
18671
- const _hoisted_9$2 = { class: "no-margin multi-preview-txt" };
18672
- const _hoisted_10$2 = {
18669
+ const _hoisted_7$5 = ["src"];
18670
+ const _hoisted_8$3 = { class: "m-0" };
18671
+ const _hoisted_9$2 = ["width", "src"];
18672
+ const _hoisted_10$2 = { class: "no-margin multi-preview-txt" };
18673
+ const _hoisted_11$1 = {
18673
18674
  key: 0,
18674
18675
  class: "progress"
18675
18676
  };
18676
- const _hoisted_11$1 = {
18677
+ const _hoisted_12$1 = {
18677
18678
  key: 1,
18678
18679
  class: "bgl-single-preview"
18679
18680
  };
18680
- const _hoisted_12$1 = { class: "position-start m-05 flex opacity-7 z-99" };
18681
- const _hoisted_13$1 = {
18681
+ const _hoisted_13$1 = { class: "position-start m-05 flex opacity-7 z-99" };
18682
+ const _hoisted_14$1 = {
18682
18683
  key: 0,
18683
18684
  class: "h-100"
18684
18685
  };
18685
- const _hoisted_14$1 = ["src"];
18686
- const _hoisted_15$1 = {
18686
+ const _hoisted_15$1 = ["src"];
18687
+ const _hoisted_16 = {
18687
18688
  key: 0,
18688
18689
  class: "progress"
18689
18690
  };
18690
- const _hoisted_16 = ["src"];
18691
- const _hoisted_17 = { class: "p-1 flex column hover fileUploadPlaceHolder justify-content-center mb-05" };
18691
+ const _hoisted_17 = ["src"];
18692
+ const _hoisted_18 = { class: "p-1 flex column hover fileUploadPlaceHolder justify-content-center mb-05" };
18692
18693
  const _sfc_main$D = /* @__PURE__ */ defineComponent({
18693
18694
  __name: "FileUpload",
18694
18695
  props: {
@@ -18760,7 +18761,7 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
18760
18761
  return [a2].flat().every((id) => [b2].flat().includes(id)) && [b2].flat().every((id) => [a2].flat().includes(id));
18761
18762
  }
18762
18763
  watch(() => props2.modelValue, (newVal = []) => {
18763
- console.log(newVal);
18764
+ console.log(newVal, "newVal");
18764
18765
  const isSame = compareLists(file_bindkeys.value, newVal);
18765
18766
  if (!isSame) {
18766
18767
  file_bindkeys.value = newVal;
@@ -18849,8 +18850,8 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
18849
18850
  flushQueue();
18850
18851
  }
18851
18852
  return (_ctx, _cache) => {
18852
- const _directive_lightbox = resolveDirective("lightbox");
18853
18853
  const _directive_tooltip = resolveDirective("tooltip");
18854
+ const _directive_lightbox = resolveDirective("lightbox");
18854
18855
  return openBlock(), createElementBlock("div", _hoisted_1$v, [
18855
18856
  createElementVNode("label", null, toDisplayString(_ctx.label), 1),
18856
18857
  _ctx.required && !storageFiles.value.length ? (openBlock(), createElementBlock("input", _hoisted_2$l)) : createCommentVNode("", true),
@@ -18862,33 +18863,68 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
18862
18863
  onDrop: drop3
18863
18864
  }, {
18864
18865
  default: withCtx(() => [
18865
- createVNode(unref(Btn), {
18866
+ !storageFiles.value.length && !fileQueue.value.length ? (openBlock(), createBlock(unref(Btn), {
18867
+ key: 0,
18866
18868
  class: "px-1-5",
18867
18869
  icon: "upload",
18868
18870
  outline: "",
18869
18871
  onClick: browse
18870
18872
  }, {
18871
- default: withCtx(() => _cache[1] || (_cache[1] = [
18873
+ default: withCtx(() => _cache[2] || (_cache[2] = [
18872
18874
  createTextVNode(" Upload ")
18873
18875
  ])),
18874
18876
  _: 1
18875
- }),
18877
+ })) : createCommentVNode("", true),
18876
18878
  (openBlock(true), createElementBlock(Fragment$1, null, renderList(storageFiles.value, (file) => {
18877
18879
  return openBlock(), createElementBlock("div", {
18878
18880
  key: file.id,
18879
18881
  class: "txt-gray txt-12 flex"
18880
18882
  }, [
18881
- createElementVNode("p", _hoisted_3$h, toDisplayString(file.name), 1),
18882
- createVNode(unref(Btn), {
18883
- thin: "",
18884
- flat: "",
18885
- icon: "delete",
18886
- color: "red",
18887
- onClick: withModifiers(($event) => removeFile(file), ["stop"])
18888
- }, null, 8, ["onClick"])
18883
+ createElementVNode("div", _hoisted_3$h, [
18884
+ withDirectives(createVNode(unref(Btn), {
18885
+ color: "gray",
18886
+ thin: "",
18887
+ icon: "delete",
18888
+ onClick: withModifiers(($event) => removeFile(file), ["stop"])
18889
+ }, null, 8, ["onClick"]), [
18890
+ [_directive_tooltip, "Delete"]
18891
+ ]),
18892
+ withDirectives(createVNode(unref(Btn), {
18893
+ color: "gray",
18894
+ thin: "",
18895
+ icon: "autorenew",
18896
+ onClick: browse
18897
+ }, null, 512), [
18898
+ [_directive_tooltip, "Replace"]
18899
+ ]),
18900
+ withDirectives(createVNode(unref(Btn), {
18901
+ href: file.url,
18902
+ download: file.name,
18903
+ color: "gray",
18904
+ thin: "",
18905
+ icon: "download",
18906
+ target: "_blank",
18907
+ onClick: _cache[0] || (_cache[0] = withModifiers(() => {
18908
+ }, ["stop"]))
18909
+ }, null, 8, ["href", "download"]), [
18910
+ [_directive_tooltip, "Download"]
18911
+ ]),
18912
+ withDirectives((openBlock(), createElementBlock("p", _hoisted_4$b, [
18913
+ createTextVNode(toDisplayString(file.name), 1)
18914
+ ])), [
18915
+ [_directive_lightbox, { src: file.url, download: true }]
18916
+ ]),
18917
+ createVNode(unref(Btn), {
18918
+ thin: "",
18919
+ flat: "",
18920
+ icon: "delete",
18921
+ color: "red",
18922
+ onClick: withModifiers(($event) => removeFile(file), ["stop"])
18923
+ }, null, 8, ["onClick"])
18924
+ ])
18889
18925
  ]);
18890
18926
  }), 128)),
18891
- !storageFiles.value.length && !fileQueue.value.length ? (openBlock(), createElementBlock("span", _hoisted_4$b, " No file selected ")) : createCommentVNode("", true)
18927
+ !storageFiles.value.length && !fileQueue.value.length ? (openBlock(), createElementBlock("span", _hoisted_5$a, " No file selected ")) : createCommentVNode("", true)
18892
18928
  ]),
18893
18929
  _: 1
18894
18930
  })) : (openBlock(), createElementBlock("div", {
@@ -18908,7 +18944,7 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
18908
18944
  files: storageFiles.value,
18909
18945
  fileQueue: fileQueue.value
18910
18946
  }, () => [
18911
- _ctx.multiple ? (openBlock(), createElementBlock("div", _hoisted_5$a, [
18947
+ _ctx.multiple ? (openBlock(), createElementBlock("div", _hoisted_6$8, [
18912
18948
  (openBlock(true), createElementBlock(Fragment$1, null, renderList(storageFiles.value, (file) => {
18913
18949
  return withDirectives((openBlock(), createElementBlock("div", {
18914
18950
  key: file.id,
@@ -18919,12 +18955,12 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
18919
18955
  class: "multi-preview",
18920
18956
  src: file.url,
18921
18957
  alt: ""
18922
- }, null, 8, _hoisted_6$8)) : (openBlock(), createBlock(unref(_sfc_main$c), {
18958
+ }, null, 8, _hoisted_7$5)) : (openBlock(), createBlock(unref(_sfc_main$c), {
18923
18959
  key: 1,
18924
18960
  icon: "draft",
18925
18961
  class: "multi-preview"
18926
18962
  })),
18927
- createElementVNode("p", _hoisted_7$5, toDisplayString(file.name), 1),
18963
+ createElementVNode("p", _hoisted_8$3, toDisplayString(file.name), 1),
18928
18964
  createVNode(unref(Btn), {
18929
18965
  thin: "",
18930
18966
  flat: "",
@@ -18948,18 +18984,18 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
18948
18984
  class: "multi-preview",
18949
18985
  src: fileToUrl(fileQ.file),
18950
18986
  alt: ""
18951
- }, null, 8, _hoisted_8$3)) : createCommentVNode("", true)
18987
+ }, null, 8, _hoisted_9$2)) : createCommentVNode("", true)
18952
18988
  ], 64)) : (openBlock(), createBlock(unref(_sfc_main$c), {
18953
18989
  key: 1,
18954
18990
  icon: "draft",
18955
18991
  class: "multi-preview"
18956
18992
  })),
18957
- createElementVNode("p", _hoisted_9$2, toDisplayString(fileQ.name), 1),
18993
+ createElementVNode("p", _hoisted_10$2, toDisplayString(fileQ.name), 1),
18958
18994
  createElementVNode("div", {
18959
18995
  class: normalizeClass(["pie", { complete: fileQ.progress === 100 }]),
18960
18996
  style: normalizeStyle([`--p:${fileQ.progress}`, { "--b": "2px" }])
18961
18997
  }, [
18962
- fileQ.progress < 100 ? (openBlock(), createElementBlock("span", _hoisted_10$2, toDisplayString(`${fileQ.progress.toFixed(0)}`), 1)) : createCommentVNode("", true),
18998
+ fileQ.progress < 100 ? (openBlock(), createElementBlock("span", _hoisted_11$1, toDisplayString(`${fileQ.progress.toFixed(0)}`), 1)) : createCommentVNode("", true),
18963
18999
  createVNode(unref(_sfc_main$c), {
18964
19000
  class: "success",
18965
19001
  icon: "check"
@@ -18968,13 +19004,13 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
18968
19004
  ]);
18969
19005
  }), 128))
18970
19006
  ])) : createCommentVNode("", true),
18971
- !_ctx.multiple && (storageFiles.value.length > 0 || fileQueue.value.length > 0) ? (openBlock(), createElementBlock("div", _hoisted_11$1, [
19007
+ !_ctx.multiple && (storageFiles.value.length > 0 || fileQueue.value.length > 0) ? (openBlock(), createElementBlock("div", _hoisted_12$1, [
18972
19008
  (openBlock(true), createElementBlock(Fragment$1, null, renderList(storageFiles.value, (file) => {
18973
19009
  return openBlock(), createElementBlock("div", {
18974
19010
  key: file.id,
18975
19011
  class: normalizeClass(["single-image-item-preview", { "bgl_fill-image": _ctx.fill }])
18976
19012
  }, [
18977
- createElementVNode("div", _hoisted_12$1, [
19013
+ createElementVNode("div", _hoisted_13$1, [
18978
19014
  withDirectives(createVNode(unref(Btn), {
18979
19015
  color: "gray",
18980
19016
  thin: "",
@@ -18998,18 +19034,18 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
18998
19034
  thin: "",
18999
19035
  icon: "download",
19000
19036
  target: "_blank",
19001
- onClick: _cache[0] || (_cache[0] = withModifiers(() => {
19037
+ onClick: _cache[1] || (_cache[1] = withModifiers(() => {
19002
19038
  }, ["stop"]))
19003
19039
  }, null, 8, ["href", "download"]), [
19004
19040
  [_directive_tooltip, "Download"]
19005
19041
  ])
19006
19042
  ]),
19007
- isImage(file.extension || file.url) ? (openBlock(), createElementBlock("div", _hoisted_13$1, [
19043
+ isImage(file.extension || file.url) ? (openBlock(), createElementBlock("div", _hoisted_14$1, [
19008
19044
  withDirectives(createElementVNode("img", {
19009
19045
  class: "single-preview",
19010
19046
  src: file.url,
19011
19047
  alt: ""
19012
- }, null, 8, _hoisted_14$1), [
19048
+ }, null, 8, _hoisted_15$1), [
19013
19049
  [_directive_lightbox, { src: file.url, download: true }]
19014
19050
  ])
19015
19051
  ])) : withDirectives((openBlock(), createBlock(unref(_sfc_main$c), {
@@ -19032,7 +19068,7 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
19032
19068
  class: normalizeClass(["pie", { complete: fileQ.progress === 100 }]),
19033
19069
  style: normalizeStyle([`--p:${fileQ.progress}`, { "--b": "2px" }])
19034
19070
  }, [
19035
- fileQ.progress < 100 ? (openBlock(), createElementBlock("span", _hoisted_15$1, toDisplayString(`${fileQ.progress.toFixed(0)}`), 1)) : createCommentVNode("", true),
19071
+ fileQ.progress < 100 ? (openBlock(), createElementBlock("span", _hoisted_16, toDisplayString(`${fileQ.progress.toFixed(0)}`), 1)) : createCommentVNode("", true),
19036
19072
  createVNode(unref(_sfc_main$c), {
19037
19073
  class: "success",
19038
19074
  icon: "check"
@@ -19043,7 +19079,7 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
19043
19079
  class: "single-preview",
19044
19080
  src: fileToUrl(fileQ.file),
19045
19081
  alt: ""
19046
- }, null, 8, _hoisted_16)) : createCommentVNode("", true)
19082
+ }, null, 8, _hoisted_17)) : createCommentVNode("", true)
19047
19083
  ], 2);
19048
19084
  }), 128))
19049
19085
  ])) : createCommentVNode("", true)
@@ -19054,9 +19090,9 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
19054
19090
  fileQueue: fileQueue.value,
19055
19091
  browse
19056
19092
  }, () => [
19057
- createElementVNode("p", _hoisted_17, [
19093
+ createElementVNode("p", _hoisted_18, [
19058
19094
  createVNode(unref(_sfc_main$c), { icon: "upload_2" }),
19059
- _cache[2] || (_cache[2] = createTextVNode(" Drop files here or click to upload "))
19095
+ _cache[3] || (_cache[3] = createTextVNode(" Drop files here or click to upload "))
19060
19096
  ])
19061
19097
  ], true) : createCommentVNode("", true)
19062
19098
  ], 38))
@@ -19064,7 +19100,7 @@ const _sfc_main$D = /* @__PURE__ */ defineComponent({
19064
19100
  };
19065
19101
  }
19066
19102
  });
19067
- const $el = /* @__PURE__ */ _export_sfc(_sfc_main$D, [["__scopeId", "data-v-36f16bdf"]]);
19103
+ const $el = /* @__PURE__ */ _export_sfc(_sfc_main$D, [["__scopeId", "data-v-0dfbee23"]]);
19068
19104
  const _hoisted_1$u = ["title"];
19069
19105
  const _hoisted_2$k = { key: 0 };
19070
19106
  const _hoisted_3$g = ["value", "placeholder"];
package/dist/style.css CHANGED
@@ -707,7 +707,7 @@ data[data-v-6c27f163] {
707
707
  }
708
708
  }
709
709
 
710
- .fileUploadWrap[data-v-36f16bdf] {
710
+ .fileUploadWrap[data-v-0dfbee23] {
711
711
  outline: 1px solid var(--border-color);
712
712
  border-radius: var(--input-border-radius);
713
713
  text-align: center;
@@ -719,7 +719,7 @@ data[data-v-6c27f163] {
719
719
  background: var(--input-bg);
720
720
  height: 215px;
721
721
  }
722
- .bagel-input .fileUploadWrap.fileDropZone[data-v-36f16bdf] {
722
+ .bagel-input .fileUploadWrap.fileDropZone[data-v-0dfbee23] {
723
723
  background: var(--input-bg);
724
724
  display: flex;
725
725
  align-items: center;
@@ -727,14 +727,14 @@ data[data-v-6c27f163] {
727
727
  color: var(--bgl-gray);
728
728
  flex-direction: column;
729
729
  }
730
- .fileUploadWrap.dragover[data-v-36f16bdf],
731
- .fileUploadWrap[data-v-36f16bdf]:hover {
730
+ .fileUploadWrap.dragover[data-v-0dfbee23],
731
+ .fileUploadWrap[data-v-0dfbee23]:hover {
732
732
  box-shadow: inset 0 0 10px #00000012;
733
733
  }
734
- .fileUploadWrap[style*="height: auto;"][data-v-36f16bdf] {
734
+ .fileUploadWrap[style*="height: auto;"][data-v-0dfbee23] {
735
735
  min-height: 215px;
736
736
  }
737
- .multi-image-item-preview[data-v-36f16bdf] {
737
+ .multi-image-item-preview[data-v-0dfbee23] {
738
738
  border: 1px solid var(--border-color) !important;
739
739
  border-radius: var(--input-border-radius);
740
740
  margin: 0.5rem !important;
@@ -748,12 +748,12 @@ data[data-v-6c27f163] {
748
748
  gap: 1rem;
749
749
  align-items: center;
750
750
  }
751
- .multi-image-item-preview p[data-v-36f16bdf] {
751
+ .multi-image-item-preview p[data-v-0dfbee23] {
752
752
  overflow: hidden;
753
753
  text-overflow: ellipsis;
754
754
  white-space: nowrap;
755
755
  }
756
- .multi-preview[data-v-36f16bdf]{
756
+ .multi-preview[data-v-0dfbee23]{
757
757
  width: 40px;
758
758
  height: 40px;
759
759
  border-radius: var(--input-border-radius);
@@ -764,17 +764,17 @@ data[data-v-6c27f163] {
764
764
  align-items: center;
765
765
  display: flex;
766
766
  }
767
- .bgl-single-preview[data-v-36f16bdf]{
767
+ .bgl-single-preview[data-v-0dfbee23]{
768
768
  height: 100%;
769
769
  position: relative;
770
770
  }
771
- .bgl-single-preview + .fileUploadPlaceHolder[data-v-36f16bdf]{
771
+ .bgl-single-preview + .fileUploadPlaceHolder[data-v-0dfbee23]{
772
772
  position: absolute;
773
773
  inset: 0;
774
774
  margin: auto;
775
775
  top: calc(50% - 2rem);
776
776
  }
777
- .single-image-item-preview[data-v-36f16bdf] {
777
+ .single-image-item-preview[data-v-0dfbee23] {
778
778
  height: 100%;
779
779
  min-height: 100%;
780
780
  position: relative;
@@ -782,13 +782,13 @@ data[data-v-6c27f163] {
782
782
  align-items: center;
783
783
  justify-content: center;
784
784
  }
785
- .fileUploadWrap[style*="height: auto"] .single-image-item-preview[data-v-36f16bdf] {
785
+ .fileUploadWrap[style*="height: auto"] .single-image-item-preview[data-v-0dfbee23] {
786
786
  min-height: 215px;
787
787
  }
788
- .fileUploadWrap[style*="height: auto"] .single-preview[data-v-36f16bdf] {
788
+ .fileUploadWrap[style*="height: auto"] .single-preview[data-v-0dfbee23] {
789
789
  margin: 0rem !important;
790
790
  }
791
- .single-preview[data-v-36f16bdf]{
791
+ .single-preview[data-v-0dfbee23]{
792
792
  border-radius: var(--input-border-radius);
793
793
  margin: 1rem;
794
794
  padding: 0px;
@@ -797,7 +797,7 @@ data[data-v-6c27f163] {
797
797
  object-fit: cover;
798
798
  background: var(--bgl-gray-light);
799
799
  }
800
- .single-image-item-preview[data-v-36f16bdf]:hover::after{
800
+ .single-image-item-preview[data-v-0dfbee23]:hover::after{
801
801
  content: "zoom_in";
802
802
  font-size: 32px;
803
803
  font-family: "Material Symbols Outlined", serif;
@@ -807,20 +807,20 @@ data[data-v-6c27f163] {
807
807
  z-index: 9;
808
808
  pointer-events: none;
809
809
  }
810
- .single-image-item-preview:hover img[data-v-36f16bdf]{
810
+ .single-image-item-preview:hover img[data-v-0dfbee23]{
811
811
  filter: brightness(70%);
812
812
  }
813
- .bgl_fill-image.single-image-item-preview[data-v-36f16bdf] {
813
+ .bgl_fill-image.single-image-item-preview[data-v-0dfbee23] {
814
814
  height: 100%;
815
815
  }
816
- .bgl_fill-image.single-image-item-preview .single-preview[data-v-36f16bdf]{
816
+ .bgl_fill-image.single-image-item-preview .single-preview[data-v-0dfbee23]{
817
817
  border-radius: unset;
818
818
  object-fit: cover;
819
819
  box-shadow: unset;
820
820
  width: 100%;
821
821
  height: auto;
822
822
  }
823
- .single-image-item-preview .pie[data-v-36f16bdf] {
823
+ .single-image-item-preview .pie[data-v-0dfbee23] {
824
824
  transform-origin: top;
825
825
  transform: scale(1.4);
826
826
  position: absolute;
@@ -834,31 +834,31 @@ data[data-v-6c27f163] {
834
834
  border: none !important;
835
835
  padding: 0 !important;
836
836
  }
837
- .bgl_oval-upload[data-v-36f16bdf] {
837
+ .bgl_oval-upload[data-v-0dfbee23] {
838
838
  border-radius: 100% !important;
839
839
  overflow: hidden;
840
840
  }
841
- .bgl_oval-upload p[data-v-36f16bdf] {
841
+ .bgl_oval-upload p[data-v-0dfbee23] {
842
842
  padding: 0.75rem !important;
843
843
  font-size: 12px
844
844
  }
845
- .bgl_oval-upload .fileUploadPlaceHolder[data-v-36f16bdf]{
845
+ .bgl_oval-upload .fileUploadPlaceHolder[data-v-0dfbee23]{
846
846
  top: 0;
847
847
  }
848
- .bgl_oval-upload .pie[data-v-36f16bdf] {
848
+ .bgl_oval-upload .pie[data-v-0dfbee23] {
849
849
  transform: scale(1);
850
850
  }
851
- .bgl_oval-upload span.bgl_icon-font.color-primary[data-v-36f16bdf] {
851
+ .bgl_oval-upload span.bgl_icon-font.color-primary[data-v-0dfbee23] {
852
852
  transform: scale(0.4) !important;
853
853
  }
854
- .bgl_oval-upload .single-image-item-preview[data-v-36f16bdf]{
854
+ .bgl_oval-upload .single-image-item-preview[data-v-0dfbee23]{
855
855
  height: 100%;
856
856
  }
857
- .bgl_oval-upload .single-preview[data-v-36f16bdf] {
857
+ .bgl_oval-upload .single-preview[data-v-0dfbee23] {
858
858
  margin: 0;
859
859
  height: 100% !important;
860
860
  }
861
- .pie[data-v-36f16bdf] {
861
+ .pie[data-v-0dfbee23] {
862
862
  width: 30px;
863
863
  height: 30px;
864
864
  position: relative;
@@ -866,7 +866,7 @@ data[data-v-6c27f163] {
866
866
  align-items: center;
867
867
  justify-content: center;
868
868
  }
869
- .pie[data-v-36f16bdf]:before {
869
+ .pie[data-v-0dfbee23]:before {
870
870
  content: '';
871
871
  position: absolute;
872
872
  border-radius: 50%;
@@ -884,26 +884,26 @@ data[data-v-6c27f163] {
884
884
  #000 calc(100% - var(--b))
885
885
  );
886
886
  }
887
- .pie .success[data-v-36f16bdf] {
887
+ .pie .success[data-v-0dfbee23] {
888
888
  transform: scale(0);
889
889
  opacity: 0;
890
890
  transition: all 0.3s ease-in-out;
891
891
  }
892
- .pie .progress[data-v-36f16bdf] {
892
+ .pie .progress[data-v-0dfbee23] {
893
893
  position: absolute;
894
894
  font-size: 10px;
895
895
  }
896
- .pie.complete .progress[data-v-36f16bdf] {
896
+ .pie.complete .progress[data-v-0dfbee23] {
897
897
  display: none;
898
898
  }
899
- .pie.complete .success[data-v-36f16bdf] {
899
+ .pie.complete .success[data-v-0dfbee23] {
900
900
  transform: scale(1.3);
901
901
  opacity: 1;
902
902
  }
903
- .pie.complete[data-v-36f16bdf]:before {
903
+ .pie.complete[data-v-0dfbee23]:before {
904
904
  background: conic-gradient(var(--bgl-green) calc(var(--p) * 1%), #0000 0);
905
905
  }
906
- .pie.complete[data-v-36f16bdf] {
906
+ .pie.complete[data-v-0dfbee23] {
907
907
  color: var(--bgl-green);
908
908
  }
909
909
 
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bagelink/vue",
3
3
  "type": "module",
4
- "version": "0.0.951",
4
+ "version": "0.0.953",
5
5
  "description": "Bagel core sdk packages",
6
6
  "author": {
7
7
  "name": "Neveh Allon",
@@ -101,7 +101,7 @@ function compareLists(a: any, b: any) {
101
101
  }
102
102
 
103
103
  watch(() => props.modelValue, (newVal: FSValue = []) => {
104
- console.log(newVal)
104
+ console.log(newVal, 'newVal')
105
105
  const isSame = compareLists(file_bindkeys, newVal)
106
106
  if (!isSame) {
107
107
  file_bindkeys = newVal
@@ -210,6 +210,7 @@ function drop(e: DragEvent) {
210
210
  @drop="drop"
211
211
  >
212
212
  <Btn
213
+ v-if="!storageFiles.length && !fileQueue.length"
213
214
  class="px-1-5"
214
215
  icon="upload"
215
216
  outline
@@ -217,17 +218,32 @@ function drop(e: DragEvent) {
217
218
  >
218
219
  Upload
219
220
  </Btn>
221
+
220
222
  <div v-for="file in storageFiles" :key="file.id" class="txt-gray txt-12 flex">
221
- <p class="ellipsis-1 word-break-all h-20 m-0">
222
- {{ file.name }}
223
- </p>
224
- <Btn
225
- thin
226
- flat
227
- icon="delete"
228
- color="red"
229
- @click.stop="removeFile(file)"
230
- />
223
+ <div class="m-05 flex opacity-7 z-99">
224
+ <Btn v-tooltip="'Delete'" color="gray" thin icon="delete" @click.stop="removeFile(file)" />
225
+ <Btn
226
+ v-tooltip="'Replace'" color="gray" thin icon="autorenew"
227
+ @click="browse"
228
+ />
229
+ <Btn
230
+ v-tooltip="'Download'"
231
+ :href="file.url" :download="file.name"
232
+ color="gray" thin icon="download"
233
+ target="_blank"
234
+ @click.stop
235
+ />
236
+ <p v-lightbox="{ src: file.url, download: true }" class="ellipsis-1 word-break-all h-20 m-0">
237
+ {{ file.name }}
238
+ </p>
239
+ <Btn
240
+ thin
241
+ flat
242
+ icon="delete"
243
+ color="red"
244
+ @click.stop="removeFile(file)"
245
+ />
246
+ </div>
231
247
  </div>
232
248
  <span v-if="!storageFiles.length && !fileQueue.length" class="txt-gray txt-12">
233
249
  No file selected