@bagelink/vue 0.0.1031 → 0.0.1035

package/dist/index.mjs

@@ -40,6 +40,9 @@ const bagelFormUtils = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defi
   },
   get txtField() {
     return txtField;
+  },
+  get uploadField() {
+    return uploadField;
   }
 }, Symbol.toStringTag, { value: "Module" }));
 const _sfc_main$15 = /* @__PURE__ */ defineComponent({
@@ -10383,11 +10386,13 @@ const _sfc_main$S = /* @__PURE__ */ defineComponent({
         customAttrs.value.multiline = true;
         return TextInput;
       }
+      if (props2.field.$el === "number") return NumberInput;
       if (props2.field.$el === "array") return FieldArray;
       if (props2.field.$el === "select") return SelectInput;
       if (props2.field.$el === "toggle") return ToggleInput;
       if (props2.field.$el === "check") return CheckInput;
       if (props2.field.$el === "richtext") return RichText;
+      if (props2.field.$el === "upload") return UploadInput;
       if (props2.field.$el === "file") return FileUpload;
       if (props2.field.$el === "date") return DateInput;
       if (props2.field.$el === "tabs") return TabsNav;
@@ -19985,7 +19990,8 @@ const DatePicker = /* @__PURE__ */ _export_sfc(_sfc_main$J, [["render", _sfc_ren
 const _sfc_main$I = /* @__PURE__ */ defineComponent({
   __name: "Image",
   props: {
-    src: { type: String, required: true },
+    src: { type: String, required: false },
+    pathKey: { type: String, required: false },
     alt: { type: String, required: false, default: "" },
     width: { type: [String, Number], required: false },
     height: { type: [String, Number], required: false },
@@ -19994,20 +20000,25 @@ const _sfc_main$I = /* @__PURE__ */ defineComponent({
   setup(__props, { expose: __expose }) {
     __expose();
     let imageSrc = ref(null);
-    async function loadImage(src) {
+    const bagel = useBagel();
+    const fileBaseUrl = computed(() => (bagel.fileBaseUrl || "https://files.bagel.design").replace(/\/$/, ""));
+    const pathToUrl = () => `${fileBaseUrl.value}/${__props.pathKey}`;
+    async function loadImage() {
       var _a2;
-      if (!src) {
+      const url = __props.src || pathToUrl();
+      console.log(url);
+      if (!url) {
         imageSrc.value = null;
         return;
       }
-      const ext = (_a2 = src.split(".").pop()) == null ? void 0 : _a2.toLowerCase().split("?").shift();
+      const ext = (_a2 = url.split(".").pop()) == null ? void 0 : _a2.toLowerCase().split("?").shift();
       if (ext === "heic") {
         if (!("caches" in window)) {
           console.warn("Caching is not available. Proceeding without cache.");
         } else {
           try {
             const imgCache = await window.caches.open("img-cache");
-            const cachedResponse = await imgCache.match(src);
+            const cachedResponse = await imgCache.match(url);
             if (cachedResponse) {
               imageSrc.value = URL.createObjectURL(await cachedResponse.blob());
               return;
@@ -20018,14 +20029,14 @@ const _sfc_main$I = /* @__PURE__ */ defineComponent({
         }
         try {
           await appendScript("https://cdnjs.cloudflare.com/ajax/libs/heic2any/0.0.1/index.min.js");
-          const response = await fetch(src);
+          const response = await fetch(url);
           const blob = await response.blob();
           const convertedBlob = await window.heic2any({ blob });
           imageSrc.value = URL.createObjectURL(convertedBlob);
           if ("caches" in window) {
             try {
               const imgCache = await window.caches.open("img-cache");
-              imgCache.put(src, new Response(convertedBlob));
+              imgCache.put(url, new Response(convertedBlob));
             } catch (cacheError) {
               console.warn("Failed to cache the image:", cacheError);
             }
@@ -20034,15 +20045,15 @@ const _sfc_main$I = /* @__PURE__ */ defineComponent({
           console.error("Error converting HEIC file:", error);
         }
       } else {
-        imageSrc.value = src;
+        imageSrc.value = url;
       }
     }
-    watch(() => __props.src, loadImage, { immediate: true });
+    watch(() => [__props.src, __props.pathKey], loadImage, { immediate: true });
     const __returned__ = { get imageSrc() {
       return imageSrc;
     }, set imageSrc(v) {
       imageSrc = v;
-    }, loadImage, get Skeleton() {
+    }, bagel, fileBaseUrl, pathToUrl, loadImage, get Skeleton() {
       return Skeleton;
     }, get normalizeDimension() {
       return normalizeDimension;
@@ -20727,7 +20738,7 @@ const JSONInput = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["render", _sfc_rend
 const _sfc_main$F = /* @__PURE__ */ defineComponent({
   __name: "NumberInput",
   props: {
-    modelValue: { type: Number, required: true },
+    modelValue: { type: Number, required: false },
     min: { type: Number, required: false },
     max: { type: Number, required: false },
     step: { type: Number, required: false, default: 1 },
@@ -20736,7 +20747,7 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
     icon: { type: null, required: false },
     label: { type: String, required: false },
     placeholder: { type: String, required: false },
-    disabled: { type: Boolean, required: true },
+    disabled: { type: Boolean, required: false },
     required: { type: Boolean, required: false },
     id: { type: String, required: false },
     helptext: { type: String, required: false },
@@ -20747,7 +20758,7 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
   setup(__props, { expose: __expose, emit: __emit }) {
     __expose();
     const emit2 = __emit;
-    let numberValue = ref(0);
+    let numberValue = ref(__props.modelValue || 0);
     const btnLayouts = ["horizontal", "vertical"];
     function increment() {
       if (!__props.max || numberValue.value + __props.step <= __props.max) {
@@ -20777,7 +20788,7 @@ const _sfc_main$F = /* @__PURE__ */ defineComponent({
     }, { immediate: true });
     watch(() => __props.modelValue, (newVal) => {
       if (newVal !== numberValue.value) {
-        numberValue.value = newVal;
+        numberValue.value = newVal || 0;
       }
     }, { immediate: true });
     const __returned__ = { emit: emit2, get numberValue() {
@@ -20829,6 +20840,7 @@ function _sfc_render$F(_ctx, _cache, $props, $setup, $data, $options) {
           [
             $props.layout && $setup.btnLayouts.includes($props.layout) ? (openBlock(), createBlock($setup["Btn"], {
               key: 0,
+              flat: "",
               icon: "add",
               class: normalizeClass(["radius", [{ "bgl-big-ctrl-num-btn": $props.layout === "vertical" }]]),
               onClick: $setup.increment
@@ -20887,6 +20899,7 @@ function _sfc_render$F(_ctx, _cache, $props, $setup, $data, $options) {
             }, null, 8, ["icon"])) : createCommentVNode("v-if", true),
             $props.layout && $setup.btnLayouts.includes($props.layout) ? (openBlock(), createBlock($setup["Btn"], {
               key: 4,
+              flat: "",
               icon: "remove",
               class: normalizeClass(["radius", [{ "bgl-big-ctrl-num-btn": $props.layout === "vertical" }]]),
               onClick: $setup.decrement
@@ -31836,7 +31849,7 @@ const files = {
   }
 };
 const _sfc_main$q = /* @__PURE__ */ defineComponent({
-  __name: "UploadFile",
+  __name: "UploadInput",
   props: {
     label: { type: String, required: false },
     multiple: { type: Boolean, required: false },
@@ -31858,8 +31871,9 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
     const props2 = __props;
     const emit2 = __emit;
     const bagel = useBagel();
-    const fileBaseUrl = computed(() => (props2.baseURL || bagel.fileBaseUrl || "https://files.bagel.design/").replace(/\/$/, ""));
     files.setBaseUrl(bagel.host);
+    const fileBaseUrl = computed(() => (props2.baseURL || bagel.fileBaseUrl || "https://files.bagel.design").replace(/\/$/, ""));
+    const pathToUrl = (path_key) => `${fileBaseUrl.value}/${path_key}`;
     const fileQueue = ref([]);
     let storageFiles = ref([]);
     const pk = ref([props2.modelValue].flat().filter(Boolean));
@@ -31872,7 +31886,6 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
       else emit2("update:modelValue", value[0] || void 0);
     }, { deep: true });
     const isImage = (str) => IMAGE_FORMATS_REGEXP.test(str);
-    const pathToUrl = (path_key) => `${fileBaseUrl.value}/${path_key}`;
     const fileToUrl = (file) => URL.createObjectURL(file);
     let isDragOver = ref(false);
     async function removeFile(path_key) {
@@ -31899,7 +31912,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
           });
           pk.value.push(data2.path_key);
         } catch (error) {
-          console.error(error);
+          console.error("error flushing queue", error);
         }
       }
       fileQueue.value.splice(0, fileQueue.value.length);
@@ -31941,11 +31954,11 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
         files.get(props2.dirPath).then((response) => storageFiles.value.push(...[response.data].flat())).catch(console.error);
       }
     });
-    const __returned__ = { props: props2, emit: emit2, bagel, fileBaseUrl, fileQueue, get storageFiles() {
+    const __returned__ = { props: props2, emit: emit2, bagel, fileBaseUrl, pathToUrl, fileQueue, get storageFiles() {
       return storageFiles;
     }, set storageFiles(v) {
       storageFiles = v;
-    }, pk, pathKeys, isImage, pathToUrl, fileToUrl, get isDragOver() {
+    }, pk, pathKeys, isImage, fileToUrl, get isDragOver() {
       return isDragOver;
     }, set isDragOver(v) {
       isDragOver = v;
@@ -32043,29 +32056,35 @@ function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
               class: "txt-gray txt-12 flex"
             }, [
               createElementVNode("div", _hoisted_4$4, [
-                (openBlock(true), createElementBlock(
-                  Fragment,
+                withDirectives(createVNode($setup["Btn"], {
+                  color: "gray",
+                  thin: "",
+                  icon: "delete",
+                  onClick: ($event) => $setup.removeFile(path_key)
+                }, null, 8, ["onClick"]), [
+                  [_directive_tooltip, "Delete"]
+                ]),
+                withDirectives(createVNode(
+                  $setup["Btn"],
+                  {
+                    color: "gray",
+                    thin: "",
+                    icon: "autorenew",
+                    onClick: $setup.browse
+                  },
                   null,
-                  renderList([
-                    { tooltip: "Delete", icon: "delete", onClick: () => $setup.removeFile(path_key) },
-                    { tooltip: "Replace", icon: "autorenew", onClick: $setup.browse },
-                    { tooltip: "Download", icon: "download", href: $setup.pathToUrl(path_key), download: path_key.split("/").pop() }
-                  ], (action) => {
-                    return withDirectives((openBlock(), createBlock($setup["Btn"], mergeProps({
-                      key: action.tooltip,
-                      color: "gray",
-                      thin: "",
-                      icon: action.icon,
-                      ref_for: true
-                    }, action.href ? { href: action.href, download: action.download, target: "_blank" } : {}, {
-                      onClick: withModifiers(action.onClick, ["stop"])
-                    }), null, 16, ["icon", "onClick"])), [
-                      [_directive_tooltip, action.tooltip]
-                    ]);
-                  }),
-                  128
-                  /* KEYED_FRAGMENT */
-                )),
+                  512
+                  /* NEED_PATCH */
+                ), [
+                  [_directive_tooltip, "Replace"]
+                ]),
+                createVNode($setup["Btn"], {
+                  icon: "download",
+                  flat: "",
+                  thin: "",
+                  href: $setup.pathToUrl(path_key),
+                  download: path_key.split("/").pop()
+                }, null, 8, ["href", "download"]),
                 withDirectives((openBlock(), createElementBlock("p", _hoisted_5$4, [
                   createTextVNode(
                     toDisplayString(path_key.split("/").pop()),
@@ -32119,10 +32138,9 @@ function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
                   [
                     $setup.isImage(path_key) ? (openBlock(), createBlock($setup["Image"], {
                       key: 0,
-                      class: "multi-preview",
-                      src: $setup.pathToUrl(path_key),
-                      alt: ""
-                    }, null, 8, ["src"])) : (openBlock(), createBlock($setup["Icon"], {
+                      pathKey: path_key,
+                      class: "multi-preview"
+                    }, null, 8, ["pathKey"])) : (openBlock(), createBlock($setup["Icon"], {
                       key: 1,
                       icon: "description",
                       class: "multi-preview"
@@ -32139,7 +32157,7 @@ function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
                       flat: "",
                       icon: "delete",
                       color: "red",
-                      onClick: withModifiers(($event) => $setup.removeFile(path_key), ["stop"])
+                      onClick: ($event) => $setup.removeFile(path_key)
                     }, null, 8, ["onClick"])
                   ],
                   2
@@ -32222,38 +32240,44 @@ function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
                   },
                   [
                     createElementVNode("div", _hoisted_12$1, [
-                      (openBlock(true), createElementBlock(
-                        Fragment,
+                      withDirectives(createVNode($setup["Btn"], {
+                        color: "gray",
+                        thin: "",
+                        icon: "delete",
+                        onClick: ($event) => $setup.removeFile(path_key)
+                      }, null, 8, ["onClick"]), [
+                        [_directive_tooltip, "Delete"]
+                      ]),
+                      withDirectives(createVNode(
+                        $setup["Btn"],
+                        {
+                          color: "gray",
+                          thin: "",
+                          icon: "autorenew",
+                          onClick: $setup.browse
+                        },
                         null,
-                        renderList([
-                          { tooltip: "Delete", icon: "delete", onClick: () => $setup.removeFile(path_key) },
-                          { tooltip: "Replace", icon: "autorenew", onClick: $setup.browse },
-                          { tooltip: "Download", icon: "download", href: $setup.pathToUrl(path_key), download: path_key.split("/").pop() }
-                        ], (action) => {
-                          return withDirectives((openBlock(), createBlock($setup["Btn"], mergeProps({
-                            key: action.tooltip,
-                            color: "gray",
-                            thin: "",
-                            icon: action.icon,
-                            ref_for: true
-                          }, action.href ? { href: action.href, download: action.download, target: "_blank" } : {}, {
-                            onClick: withModifiers(action.onClick, ["stop"])
-                          }), null, 16, ["icon", "onClick"])), [
-                            [_directive_tooltip, action.tooltip]
-                          ]);
-                        }),
-                        128
-                        /* KEYED_FRAGMENT */
-                      ))
+                        512
+                        /* NEED_PATCH */
+                      ), [
+                        [_directive_tooltip, "Replace"]
+                      ]),
+                      withDirectives(createVNode($setup["Btn"], {
+                        color: "gray",
+                        thin: "",
+                        icon: "download",
+                        href: $setup.pathToUrl(path_key),
+                        download: path_key.split("/").pop()
+                      }, null, 8, ["href", "download"]), [
+                        [_directive_tooltip, "Download"]
+                      ])
                     ]),
                     $setup.isImage(path_key) ? (openBlock(), createElementBlock("div", _hoisted_13$1, [
-                      withDirectives(createVNode($setup["Image"], {
+                      createVNode($setup["Image"], {
                         class: "single-preview",
-                        src: $setup.pathToUrl(path_key),
+                        pathKey: path_key,
                         alt: ""
-                      }, null, 8, ["src"]), [
-                        [_directive_lightbox, { src: $setup.pathToUrl(path_key), download: true }]
-                      ])
+                      }, null, 8, ["pathKey"])
                     ])) : withDirectives((openBlock(), createBlock(
                       $setup["Icon"],
                       {
@@ -32343,7 +32367,7 @@ function _sfc_render$q(_ctx, _cache, $props, $setup, $data, $options) {
     ))
   ]);
 }
-const UploadFile = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$q], ["__scopeId", "data-v-9254a525"], ["__file", "/Users/natanelyoung/Projects/bagelink/packages/vue/src/components/form/inputs/Upload/UploadFile.vue"]]);
+const UploadInput = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["render", _sfc_render$q], ["__scopeId", "data-v-bec8d254"], ["__file", "/Users/natanelyoung/Projects/bagelink/packages/vue/src/components/form/inputs/Upload/UploadInput.vue"]]);
 const _sfc_main$p = /* @__PURE__ */ defineComponent({
   __name: "IframeVue",
   props: {
@@ -36318,7 +36342,7 @@ function dateField(id, label, options) {
 }
 function numField(id, label, options) {
   return {
-    $el: "text",
+    $el: "number",
     class: options == null ? void 0 : options.class,
     required: options == null ? void 0 : options.required,
     defaultValue: options == null ? void 0 : options.defaultValue,
@@ -36328,12 +36352,9 @@ function numField(id, label, options) {
     placeholder: options == null ? void 0 : options.placeholder,
     helptext: options == null ? void 0 : options.helptext,
     attrs: {
-      type: "number",
-      nativeInputAttrs: {
-        step: options == null ? void 0 : options.step,
-        min: options == null ? void 0 : options.min,
-        max: options == null ? void 0 : options.max
-      }
+      step: options == null ? void 0 : options.step,
+      min: options == null ? void 0 : options.min,
+      max: options == null ? void 0 : options.max
     }
   };
 }
@@ -36344,6 +36365,14 @@ function frmRow(...children2) {
     children: children2
   };
 }
+function uploadField(id, label, options) {
+  return {
+    $el: "upload",
+    id,
+    label,
+    attrs: options
+  };
+}
 function bglForm(idOrField, ...schema) {
   if (typeof idOrField === "string") {
     return {
@@ -37156,7 +37185,7 @@ export {
   ToggleInput,
   ToolBar,
   TopBar,
-  UploadFile as Upload,
+  UploadInput,
   VIDEO_FORMATS,
   VIDEO_FORMATS_REGEXP,
   Zoomer,

package/dist/style.css

@@ -1731,7 +1731,7 @@ line-height: 1.65;
 .bgl-toggle input:checked + label[data-v-905f82b8] {
     color: var(--bgl-primary) !important;
 }
-.fileUploadWrap[data-v-9254a525] {
+.fileUploadWrap[data-v-bec8d254] {
 	outline: 1px solid var(--border-color);
 	border-radius: var(--input-border-radius);
 	text-align: center;
@@ -1743,7 +1743,7 @@ line-height: 1.65;
 	background: var(--input-bg);
 	height: 215px;
 }
-.bagel-input .fileUploadWrap.fileDropZone[data-v-9254a525] {
+.bagel-input .fileUploadWrap.fileDropZone[data-v-bec8d254] {
 	background: var(--input-bg);
 	display: flex;
 	align-items: center;
@@ -1751,14 +1751,14 @@ line-height: 1.65;
 	color: var(--bgl-gray);
 	flex-direction: column;
 }
-.fileUploadWrap.dragover[data-v-9254a525],
-.fileUploadWrap[data-v-9254a525]:hover {
+.fileUploadWrap.dragover[data-v-bec8d254],
+.fileUploadWrap[data-v-bec8d254]:hover {
 	box-shadow: inset 0 0 10px #00000012;
 }
-.fileUploadWrap[style*='height: auto;'][data-v-9254a525] {
+.fileUploadWrap[style*='height: auto;'][data-v-bec8d254] {
 	min-height: 215px;
 }
-.multi-image-item-preview[data-v-9254a525] {
+.multi-image-item-preview[data-v-bec8d254] {
 	border: 1px solid var(--border-color) !important;
 	border-radius: var(--input-border-radius);
 	margin: 0.5rem !important;
@@ -1772,12 +1772,12 @@ line-height: 1.65;
 	gap: 1rem;
 	align-items: center;
 }
-.multi-image-item-preview p[data-v-9254a525] {
+.multi-image-item-preview p[data-v-bec8d254] {
 	overflow: hidden;
 	text-overflow: ellipsis;
 	white-space: nowrap;
 }
-.multi-preview[data-v-9254a525] {
+.multi-preview[data-v-bec8d254] {
 	width: 40px;
 	height: 40px;
 	border-radius: var(--input-border-radius);
@@ -1788,17 +1788,17 @@ line-height: 1.65;
 	align-items: center;
 	display: flex;
 }
-.bgl-single-preview[data-v-9254a525] {
+.bgl-single-preview[data-v-bec8d254] {
 	height: 100%;
 	position: relative;
 }
-.bgl-single-preview + .fileUploadPlaceHolder[data-v-9254a525] {
+.bgl-single-preview + .fileUploadPlaceHolder[data-v-bec8d254] {
 	position: absolute;
 	inset: 0;
 	margin: auto;
 	top: calc(50% - 2rem);
 }
-.single-image-item-preview[data-v-9254a525] {
+.single-image-item-preview[data-v-bec8d254] {
 	height: 100%;
 	min-height: 100%;
 	position: relative;
@@ -1806,13 +1806,13 @@ line-height: 1.65;
 	align-items: center;
 	justify-content: center;
 }
-.fileUploadWrap[style*='height: auto'] .single-image-item-preview[data-v-9254a525] {
+.fileUploadWrap[style*='height: auto'] .single-image-item-preview[data-v-bec8d254] {
 	min-height: 215px;
 }
-.fileUploadWrap[style*='height: auto'] .single-preview[data-v-9254a525] {
+.fileUploadWrap[style*='height: auto'] .single-preview[data-v-bec8d254] {
 	margin: 0rem !important;
 }
-.single-preview[data-v-9254a525] {
+.single-preview[data-v-bec8d254] {
 	border-radius: var(--input-border-radius);
 	margin: 1rem;
 	padding: 0px;
@@ -1822,7 +1822,7 @@ line-height: 1.65;
 	background: var(--bgl-gray-light);
 	width: 90%;
 }
-.single-image-item-preview[data-v-9254a525]:hover::after {
+.single-image-item-preview[data-v-bec8d254]:hover::after {
 	content: 'zoom_in';
 	font-size: 32px;
 	font-family: 'Material Symbols Outlined', serif;
@@ -1832,20 +1832,20 @@ line-height: 1.65;
 	z-index: 9;
 	pointer-events: none;
 }
-.single-image-item-preview:hover img[data-v-9254a525] {
+.single-image-item-preview:hover img[data-v-bec8d254] {
 	filter: brightness(70%);
 }
-.bgl_fill-image.single-image-item-preview[data-v-9254a525] {
+.bgl_fill-image.single-image-item-preview[data-v-bec8d254] {
 	height: 100%;
 }
-.bgl_fill-image.single-image-item-preview .single-preview[data-v-9254a525] {
+.bgl_fill-image.single-image-item-preview .single-preview[data-v-bec8d254] {
 	border-radius: unset;
 	object-fit: cover;
 	box-shadow: unset;
 	width: 100%;
 	height: auto;
 }
-.single-image-item-preview .pie[data-v-9254a525] {
+.single-image-item-preview .pie[data-v-bec8d254] {
 	transform-origin: top;
 	transform: scale(1.4);
 	position: absolute;
@@ -1859,31 +1859,31 @@ line-height: 1.65;
 	border: none !important;
 	padding: 0 !important;
 }
-.bgl_oval-upload[data-v-9254a525] {
+.bgl_oval-upload[data-v-bec8d254] {
 	border-radius: 100% !important;
 	overflow: hidden;
 }
-.bgl_oval-upload p[data-v-9254a525] {
+.bgl_oval-upload p[data-v-bec8d254] {
 	padding: 0.75rem !important;
 	font-size: 12px;
 }
-.bgl_oval-upload .fileUploadPlaceHolder[data-v-9254a525] {
+.bgl_oval-upload .fileUploadPlaceHolder[data-v-bec8d254] {
 	top: 0;
 }
-.bgl_oval-upload .pie[data-v-9254a525] {
+.bgl_oval-upload .pie[data-v-bec8d254] {
 	transform: scale(1);
 }
-.bgl_oval-upload span.bgl_icon-font.color-primary[data-v-9254a525] {
+.bgl_oval-upload span.bgl_icon-font.color-primary[data-v-bec8d254] {
 	transform: scale(0.4) !important;
 }
-.bgl_oval-upload .single-image-item-preview[data-v-9254a525] {
+.bgl_oval-upload .single-image-item-preview[data-v-bec8d254] {
 	height: 100%;
 }
-.bgl_oval-upload .single-preview[data-v-9254a525] {
+.bgl_oval-upload .single-preview[data-v-bec8d254] {
 	margin: 0;
 	height: 100% !important;
 }
-.pie[data-v-9254a525] {
+.pie[data-v-bec8d254] {
 	width: 30px;
 	height: 30px;
 	position: relative;
@@ -1891,7 +1891,7 @@ line-height: 1.65;
 	align-items: center;
 	justify-content: center;
 }
-.pie[data-v-9254a525]:before {
+.pie[data-v-bec8d254]:before {
 	content: '';
 	position: absolute;
 	border-radius: 50%;
@@ -1909,26 +1909,26 @@ line-height: 1.65;
 		#000 calc(100% - var(--b))
 	);
 }
-.pie .success[data-v-9254a525] {
+.pie .success[data-v-bec8d254] {
 	transform: scale(0);
 	opacity: 0;
 	transition: all 0.3s ease-in-out;
 }
-.pie .progress[data-v-9254a525] {
+.pie .progress[data-v-bec8d254] {
 	position: absolute;
 	font-size: 10px;
 }
-.pie.complete .progress[data-v-9254a525] {
+.pie.complete .progress[data-v-bec8d254] {
 	display: none;
 }
-.pie.complete .success[data-v-9254a525] {
+.pie.complete .success[data-v-bec8d254] {
 	transform: scale(1.3);
 	opacity: 1;
 }
-.pie.complete[data-v-9254a525]:before {
+.pie.complete[data-v-bec8d254]:before {
 	background: conic-gradient(var(--bgl-green) calc(var(--p) * 1%), #0000 0);
 }
-.pie.complete[data-v-9254a525] {
+.pie.complete[data-v-bec8d254] {
 	color: var(--bgl-green);
 }
 

package/dist/utils/BagelFormUtils.d.ts

@@ -45,6 +45,15 @@ export declare function frmRow(...children: Field[]): {
     class: string;
     children: Field[];
 };
+interface UploadOptions extends InputOptions {
+    multiple?: boolean;
+}
+export declare function uploadField(id: string, label?: string, options?: UploadOptions): {
+    $el: string;
+    id: string;
+    label: string | undefined;
+    attrs: UploadOptions | undefined;
+};
 export declare function bglForm(idOrField?: string | Field, ...schema: Field[]): {
     $el: import('vue').Raw<{
         new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{

package/dist/utils/BagelFormUtils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BagelFormUtils.d.ts","sourceRoot":"","sources":["../../src/utils/BagelFormUtils.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"BagelFormUtils.d.ts","sourceRoot":"","sources":["../../src/utils/BagelFormUtils.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bagelink/vue",
   "type": "module",
-  "version": "0.0.1031",
+  "version": "0.0.1035",
   "description": "Bagel core sdk packages",
   "author": {
     "name": "Neveh Allon",