@bagelink/vue 1.2.119 → 1.2.121

package/dist/components/ImportData.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ImportData.vue.d.ts","sourceRoot":"","sources":["../../src/components/ImportData.vue"],"names":[],"mappings":"AA46DA,OAAO,KAAK,EAAE,cAAc,EAAU,MAAM,eAAe,CAAA;yBAoB1C,CAAC,EACjB,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,eAAe,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EACjE;WAsvFO,mBAAmB,CAAC;;;iBAhtFlB,cAAc,CAAC,CAAC,CAAC;gBAClB,MAAM;mBA+sF+E,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;cA5sFN,eAAe,QAAQ,CAAC,EAAE,KAAG,IAAI;EAgtFlC,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAA;CAAE;AAjwFzE,wBAiwF4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
+{"version":3,"file":"ImportData.vue.d.ts","sourceRoot":"","sources":["../../src/components/ImportData.vue"],"names":[],"mappings":"AA66DA,OAAO,KAAK,EAAE,cAAc,EAAU,MAAM,eAAe,CAAA;yBAoB1C,CAAC,EACjB,aAAa,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,EAC9D,YAAY,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,EAC3G,eAAe,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,EACjE;WAsvFO,mBAAmB,CAAC;;;iBAhtFlB,cAAc,CAAC,CAAC,CAAC;gBAClB,MAAM;mBA+sF+E,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;cA5sFN,eAAe,QAAQ,CAAC,EAAE,KAAG,IAAI;EAgtFlC,KACQ,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAA;CAAE;AAjwFzE,wBAiwF4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}

package/dist/components/Spreadsheet/Index.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Index.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Spreadsheet/Index.vue"],"names":[],"mappings":"AA+xBA,KAAK,YAAY,GAAG,MAAM,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,GAAG,YAAY,GAAG,OAAO,GAAG,SAAS,CAAA;AAEhG,UAAU,YAAY;IACrB,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,YAAY,CAAC,EAAE,GAAG,CAAA;CAClB;AAGD,UAAU,KAAK;IACd,UAAU,EAAE,KAAK,CAAC;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC,CAAA;IACzC,YAAY,CAAC,EAAE,YAAY,EAAE,CAAA;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;CACrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8qCD,wBASG"}
+{"version":3,"file":"Index.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Spreadsheet/Index.vue"],"names":[],"mappings":"AAoyBA,KAAK,YAAY,GAAG,MAAM,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,GAAG,YAAY,GAAG,OAAO,GAAG,SAAS,CAAA;AAEhG,UAAU,YAAY;IACrB,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,YAAY,CAAC,EAAE,GAAG,CAAA;CAClB;AAGD,UAAU,KAAK;IACd,UAAU,EAAE,KAAK,CAAC;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC,CAAA;IACzC,YAAY,CAAC,EAAE,YAAY,EAAE,CAAA;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;CACrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6qCD,wBASG"}

package/dist/components/Spreadsheet/SpreadsheetTable.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SpreadsheetTable.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Spreadsheet/SpreadsheetTable.vue"],"names":[],"mappings":"AAiVA,UAAU,YAAY;IACrB,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;CACX;AAED,UAAU,YAAY;IACrB,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,GAAG,YAAY,GAAG,OAAO,GAAG,SAAS,CAAA;IACrF,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,YAAY,CAAC,EAAE,GAAG,CAAA;CAClB;AAED,UAAU,KAAK;IACd,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,IAAI,EAAE,KAAK,CAAC;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC,CAAA;IACnC,OAAO,EAAE,OAAO,CAAA;IAChB,cAAc,EAAE,OAAO,CAAA;IACvB,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACjC,UAAU,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,aAAa,EAAE,KAAK,GAAG,MAAM,CAAA;IAC7B,cAAc,EAAE,YAAY,GAAG,IAAI,CAAA;IACnC,YAAY,EAAE,YAAY,GAAG,IAAI,CAAA;IACjC,WAAW,EAAE,YAAY,GAAG,IAAI,CAAA;IAChC,eAAe,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAA;CAClB;;;;;;;;AAwSD,wBAQG"}
+{"version":3,"file":"SpreadsheetTable.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Spreadsheet/SpreadsheetTable.vue"],"names":[],"mappings":"AA2WA,UAAU,YAAY;IACrB,GAAG,EAAE,MAAM,CAAA;IACX,GAAG,EAAE,MAAM,CAAA;CACX;AAED,UAAU,YAAY;IACrB,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,UAAU,GAAG,MAAM,GAAG,YAAY,GAAG,OAAO,GAAG,SAAS,CAAA;IACrF,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,YAAY,CAAC,EAAE,GAAG,CAAA;CAClB;AAED,UAAU,KAAK;IACd,OAAO,EAAE,YAAY,EAAE,CAAA;IACvB,IAAI,EAAE,KAAK,CAAC;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAC,CAAA;IACnC,OAAO,EAAE,OAAO,CAAA;IAChB,cAAc,EAAE,OAAO,CAAA;IACvB,YAAY,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACjC,UAAU,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,aAAa,EAAE,KAAK,GAAG,MAAM,CAAA;IAC7B,cAAc,EAAE,YAAY,GAAG,IAAI,CAAA;IACnC,YAAY,EAAE,YAAY,GAAG,IAAI,CAAA;IACjC,WAAW,EAAE,YAAY,GAAG,IAAI,CAAA;IAChC,eAAe,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAA;CAClB;;;;;;;;AAwSD,wBAQG"}

package/dist/index.cjs

@@ -34355,7 +34355,7 @@ ${unmatchedValues.length} values could not be automatically matched.`);
           }, {
             default: vue.withCtx(() => [
               vue.createElementVNode("div", null, [
-                vue.createVNode(vue.unref(Spreadsheet), {
+                vue.createVNode(vue.unref(_sfc_main$5), {
                   modelValue: previewData.value,
                   "onUpdate:modelValue": _cache[18] || (_cache[18] = ($event) => previewData.value = $event),
                   class: "popupPreviewSpreadsheet",
@@ -34553,7 +34553,7 @@ const BottomMenu = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["__scopeId", "data
 const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
   __name: "Layout",
   props: {
-    gap: { default: 1 },
+    gap: { default: 0.5 },
     h100: { type: Boolean, default: false },
     columns: { default: () => [] },
     mColumns: { default: () => [] },
@@ -34563,12 +34563,12 @@ const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
   },
   setup(__props) {
     vue.useCssVars((_ctx) => ({
-      "ff4aa016": gapSize.value,
-      "3683119b": gridTemplateRows.value,
-      "f6f04e4a": gridTemplateColumns.value,
-      "fa53dae8": mGapSize.value,
-      "0307a8e4": mGridTemplateRows.value,
-      "7e4910f2": mGridTemplateColumns.value
+      "3438906a": gapSize.value,
+      "32967a85": gridTemplateRows.value,
+      "4974609e": gridTemplateColumns.value,
+      "6323f514": mGapSize.value,
+      "ed3d458c": mGridTemplateRows.value,
+      "016c1648": mGridTemplateColumns.value
     }));
     const props2 = __props;
     const gridTemplateRows = vue.computed(() => props2.rows.length > 0 ? props2.rows.join(" ") : "auto");
@@ -34594,7 +34594,7 @@ const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const Layout = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__scopeId", "data-v-a0f4895c"]]);
+const Layout = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__scopeId", "data-v-7835674f"]]);
 const _hoisted_1$k = { key: 0 };
 const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
   __name: "SidebarMenu",
@@ -36866,7 +36866,7 @@ const _sfc_main$6 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const SpreadsheetTable = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-857ccb8b"]]);
+const SpreadsheetTable = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-72033517"]]);
 const _hoisted_1$3 = { class: "flex gap-05 py-05 justify-content-end m_flex-wrap" };
 const _hoisted_2$1 = {
   key: 0,
@@ -37516,7 +37516,6 @@ const _sfc_main$5 = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const Spreadsheet = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-81050b79"]]);
 const _sfc_main$4 = /* @__PURE__ */ vue.defineComponent({
   __name: "Title",
   props: {
@@ -38894,13 +38893,13 @@ function bindingToItem(binding, el) {
 const youtubeRegex = /youtube\.com|youtu\.be/;
 const vimeoRegex = /vimeo\.com/;
 function urlToName(url) {
-  if (!url) return "";
+  if (!url || typeof url !== "string") return "";
   const name = url.split("/").pop() || "";
   return name.replace(/\.[^/.]+$/, "");
 }
 function determineFileType(url) {
   var _a;
-  if (!url) return "unknown";
+  if (typeof url !== "string" || !url) return "unknown";
   const extension = (url.split(".").pop() || "").toLowerCase();
   const altExtension = ((_a = url.split("?")[0].split(".").pop()) == null ? void 0 : _a.toLowerCase()) || "";
   if (IMAGE_FORMATS_REGEXP.test(extension) || IMAGE_FORMATS_REGEXP.test(altExtension)) return "image";
@@ -40049,7 +40048,7 @@ exports.SidebarMenu = SidebarMenu;
 exports.SignaturePad = _sfc_main$B;
 exports.Skeleton = Skeleton;
 exports.Slider = Slider;
-exports.Spreadsheet = Spreadsheet;
+exports.Spreadsheet = _sfc_main$5;
 exports.TabbedLayout = TabbedLayout;
 exports.TableField = TableField;
 exports.TableSchema = DataTable;

package/dist/index.mjs

@@ -34353,7 +34353,7 @@ ${unmatchedValues.length} values could not be automatically matched.`);
           }, {
             default: withCtx(() => [
               createElementVNode("div", null, [
-                createVNode(unref(Spreadsheet), {
+                createVNode(unref(_sfc_main$5), {
                   modelValue: previewData.value,
                   "onUpdate:modelValue": _cache[18] || (_cache[18] = ($event) => previewData.value = $event),
                   class: "popupPreviewSpreadsheet",
@@ -34551,7 +34551,7 @@ const BottomMenu = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["__scopeId", "data
 const _sfc_main$q = /* @__PURE__ */ defineComponent({
   __name: "Layout",
   props: {
-    gap: { default: 1 },
+    gap: { default: 0.5 },
     h100: { type: Boolean, default: false },
     columns: { default: () => [] },
     mColumns: { default: () => [] },
@@ -34561,12 +34561,12 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     useCssVars((_ctx) => ({
-      "ff4aa016": gapSize.value,
-      "3683119b": gridTemplateRows.value,
-      "f6f04e4a": gridTemplateColumns.value,
-      "fa53dae8": mGapSize.value,
-      "0307a8e4": mGridTemplateRows.value,
-      "7e4910f2": mGridTemplateColumns.value
+      "3438906a": gapSize.value,
+      "32967a85": gridTemplateRows.value,
+      "4974609e": gridTemplateColumns.value,
+      "6323f514": mGapSize.value,
+      "ed3d458c": mGridTemplateRows.value,
+      "016c1648": mGridTemplateColumns.value
     }));
     const props2 = __props;
     const gridTemplateRows = computed(() => props2.rows.length > 0 ? props2.rows.join(" ") : "auto");
@@ -34592,7 +34592,7 @@ const _sfc_main$q = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Layout = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__scopeId", "data-v-a0f4895c"]]);
+const Layout = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__scopeId", "data-v-7835674f"]]);
 const _hoisted_1$k = { key: 0 };
 const _sfc_main$p = /* @__PURE__ */ defineComponent({
   __name: "SidebarMenu",
@@ -36864,7 +36864,7 @@ const _sfc_main$6 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const SpreadsheetTable = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-857ccb8b"]]);
+const SpreadsheetTable = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-72033517"]]);
 const _hoisted_1$3 = { class: "flex gap-05 py-05 justify-content-end m_flex-wrap" };
 const _hoisted_2$1 = {
   key: 0,
@@ -37514,7 +37514,6 @@ const _sfc_main$5 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const Spreadsheet = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-81050b79"]]);
 const _sfc_main$4 = /* @__PURE__ */ defineComponent({
   __name: "Title",
   props: {
@@ -38892,13 +38891,13 @@ function bindingToItem(binding, el) {
 const youtubeRegex = /youtube\.com|youtu\.be/;
 const vimeoRegex = /vimeo\.com/;
 function urlToName(url) {
-  if (!url) return "";
+  if (!url || typeof url !== "string") return "";
   const name = url.split("/").pop() || "";
   return name.replace(/\.[^/.]+$/, "");
 }
 function determineFileType(url) {
   var _a;
-  if (!url) return "unknown";
+  if (typeof url !== "string" || !url) return "unknown";
   const extension = (url.split(".").pop() || "").toLowerCase();
   const altExtension = ((_a = url.split("?")[0].split(".").pop()) == null ? void 0 : _a.toLowerCase()) || "";
   if (IMAGE_FORMATS_REGEXP.test(extension) || IMAGE_FORMATS_REGEXP.test(altExtension)) return "image";
@@ -40048,7 +40047,7 @@ export {
   _sfc_main$B as SignaturePad,
   Skeleton,
   Slider,
-  Spreadsheet,
+  _sfc_main$5 as Spreadsheet,
   TabbedLayout,
   TableField,
   DataTable as TableSchema,

package/dist/style.css

@@ -2832,6 +2832,7 @@ input[type="range"][data-v-46e22f3e]:active::-webkit-slider-thumb {
 .popupPreviewSpreadsheet .spreadsheet{
 	width: 100%;
 	overflow: auto;
+	height: calc(100vh - 300px);
 }
 
 .bgl_bottombar .bgl_btn-flex{
@@ -2863,18 +2864,18 @@ input[type="range"][data-v-46e22f3e]:active::-webkit-slider-thumb {
   color: var(--bgl-primary) !important;
 }
 
-.layout[data-v-a0f4895c] {
+.layout[data-v-7835674f] {
   min-height: 100px;
   display: grid;
-  gap: var(--ff4aa016);
-  grid-template-rows: var(--3683119b);
-  grid-template-columns: var(--f6f04e4a);
+  gap: var(--3438906a);
+  grid-template-rows: var(--32967a85);
+  grid-template-columns: var(--4974609e);
 }
 @media screen and (max-width: 910px) {
-.layout[data-v-a0f4895c] {
-	gap: var(--fa53dae8);
-    grid-template-rows: var(--0307a8e4);
-    grid-template-columns: var(--7e4910f2);
+.layout[data-v-7835674f] {
+	gap: var(--6323f514);
+    grid-template-rows: var(--ed3d458c);
+    grid-template-columns: var(--016c1648);
 }
 }
 
@@ -4535,53 +4536,74 @@ body:has(.bg-dark.is-active) {
   width: 26px;
 }
 
-.stickyTop[data-v-857ccb8b]{
+.row-number[data-v-72033517]{
 	position: sticky;
-	top: -0.125rem;
+	inset-inline-start: 0;
+	background: var(--bgl-gray-80);
 	z-index: 1;
 }
-.fixed-columns[data-v-857ccb8b] {
+.row-number[data-v-72033517]:before{
+	content: '';
+	position: absolute;
+	inset: -1px;
+	border: 1px solid var(--border-color);
+}
+.stickyTop[data-v-72033517]{
+	position: sticky;
+	top: 0px;
+	z-index: 2;
+}
+.stickyTop[data-v-72033517]:before{
+	content: '1';
+	position: absolute;
+	display: block;
+	inset: 0;
+	border-bottom: 1px solid var(--border-color);
+}
+.fixed-columns[data-v-72033517] {
 	border-right: 2px solid var(--border-color);
 }
-table[data-v-857ccb8b] {
+table[data-v-72033517] {
 	border-collapse: collapse;
 }
-th[data-v-857ccb8b], td[data-v-857ccb8b] {
-	border: 1px solid var(--border-color);
+th[data-v-72033517], td[data-v-72033517] {
 	padding: 0.1rem 0.5rem;
 	min-width: 80px;
 	background: var(--bgl-white);
 	user-select: none;
 }
-th[data-v-857ccb8b] {
+th[data-v-72033517] {
 	background: var(--input-bg);
 	white-space: nowrap;
 	position: relative;
 	padding: 0.25rem 0.5rem;
 	font-weight: 500;
 	text-align: start;
+	border-bottom: 1px solid var(--border-color);
+	border-inline-start: 1px solid var(--border-color);
 }
-th .bgl_icon-font[data-v-857ccb8b]{
+th .bgl_icon-font[data-v-72033517]{
 	vertical-align: middle;
 }
-td.selected[data-v-857ccb8b] {
+td.selected[data-v-72033517] {
 	background: var(--bgl-primary-light);
 }
-td.locked[data-v-857ccb8b] {
+td.locked[data-v-72033517] {
 	background: var(--bgl-gray-light);
 	cursor: default;
 }
-td.locked.selected[data-v-857ccb8b] {
+td.locked.selected[data-v-72033517] {
 	background: var(--bgl-primary-light);
 }
-td[data-v-857ccb8b] {
+td[data-v-72033517] {
+	border: 1px solid var(--border-color);
 	height: 40px;
 	vertical-align: middle;
 }
-td[data-v-857ccb8b]:has(img){
+td[data-v-72033517]:has(img){
 	padding: 0;
 }
-td span[data-v-857ccb8b]{
+td span[data-v-72033517]{
 	display: block;
     display: -webkit-box;
     max-width: 100%;
@@ -4591,16 +4613,16 @@ td span[data-v-857ccb8b]{
     -webkit-line-clamp: 1;
 	word-break: break-all;
 }
-td.wrap-text[data-v-857ccb8b] {
+td.wrap-text[data-v-72033517] {
 	height: auto;
 	min-height: 40px;
 }
-td.wrap-text span[data-v-857ccb8b] {
+td.wrap-text span[data-v-72033517] {
 	white-space: normal;
 	-webkit-line-clamp: unset;
 	word-break: break-word;
 }
-input[data-v-857ccb8b] {
+input[data-v-72033517] {
 	width: 100%;
 	border: none;
 	background: transparent;
@@ -4609,45 +4631,45 @@ input[data-v-857ccb8b] {
 	min-height: 0;
 	min-width: 0;
 }
-input[data-v-857ccb8b]:focus {
+input[data-v-72033517]:focus {
 	outline: 2px solid var(--bgl-primary);
 	outline-offset: 6px;
 }
-th.sortable[data-v-857ccb8b] {
+th.sortable[data-v-72033517] {
 	cursor: pointer;
 }
-.row-number-header[data-v-857ccb8b], .row-number[data-v-857ccb8b] {
+.row-number-header[data-v-72033517], .row-number[data-v-72033517] {
 	width: fit-content;
 	min-width: fit-content !important;
 	padding: 0.1rem 0.7rem !important;
 }
-td .bgl-checkbox[data-v-857ccb8b]{
+td .bgl-checkbox[data-v-72033517]{
 	margin: 0;
 	text-align: center;
 	justify-content: center;
 }
-td[data-v-857ccb8b]:has(.bgl-checkbox){
+td[data-v-72033517]:has(.bgl-checkbox){
 	text-align: center;
 	background: var(--input-bg);
 }
-td[data-v-857ccb8b]:has(:checked){
+td[data-v-72033517]:has(:checked){
 	background: var(--bgl-primary-light);
 }
-.spreadsheetCellPlaceHolder[data-v-857ccb8b]{
+.spreadsheetCellPlaceHolder[data-v-72033517]{
 	height: 0px;
 	overflow: hidden;
 	opacity: 0;
 	pointer-events: none;
 	user-select: none;
 }
-.th-content[data-v-857ccb8b] {
+.th-content[data-v-72033517] {
 	position: relative;
 	display: flex;
 	align-items: center;
 	width: 100%;
 	height: 100%;
 }
-.resize-handle[data-v-857ccb8b] {
+.resize-handle[data-v-72033517] {
 	position: absolute;
 	right: -8px;
 	top: 0;
@@ -4658,13 +4680,17 @@ td[data-v-857ccb8b]:has(:checked){
 	background: transparent;
 	transition: background 0.2s;
 }
-.resize-handle[data-v-857ccb8b]:hover {
+.resize-handle[data-v-72033517]:hover {
 	background: var(--bgl-primary);
 }
 
 /* Spreadsheet container styles */
-.spreadsheet[data-v-81050b79] {
+.spreadsheet {
 	user-select: none;
+	outline: 1px solid var(--border-color);
+}
+body>div:has(.spreadsheet) ::-webkit-scrollbar-track {
+	background: var(--input-bg) !important;
 }
 
 .zoomer-debug[data-v-379819e1] {

package/package.json

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

package/src/components/ImportData.vue

@@ -1958,5 +1958,6 @@ function getRelatedFieldWithDefaults(parentId: string, field: any) {
 .popupPreviewSpreadsheet .spreadsheet{
 	width: 100%;
 	overflow: auto;
+	height: calc(100vh - 300px);
 }
 </style>

package/src/components/Spreadsheet/Index.vue

@@ -784,9 +784,14 @@ const columnOptions = computed(() => {
 	</div>
 </template>
 
-<style scoped>
+<style>
 /* Spreadsheet container styles */
 .spreadsheet {
 	user-select: none;
+	outline: 1px solid var(--border-color);
+}
+
+body>div:has(.spreadsheet) ::-webkit-scrollbar-track {
+	background: var(--input-bg) !important;
 }
 </style>

package/src/components/Spreadsheet/SpreadsheetTable.vue

@@ -199,11 +199,33 @@ function formatCellValue(value: any, format?: ColumnConfig['format']): string {
 </template>
 
 <style scoped>
-.stickyTop{
+.row-number{
 	position: sticky;
-	top: -0.125rem;
+	inset-inline-start: 0;
+	background: var(--bgl-gray-80);
 	z-index: 1;
 }
+.row-number:before{
+	content: '';
+	position: absolute;
+	inset: -1px;
+	border: 1px solid var(--border-color);
+}
+
+.stickyTop{
+	position: sticky;
+	top: 0px;
+	z-index: 2;
+
+}
+.stickyTop:before{
+	content: '1';
+	position: absolute;
+	display: block;
+	inset: 0;
+	border-bottom: 1px solid var(--border-color);
+}
+
 .fixed-columns {
 	border-right: 2px solid var(--border-color);
 }
@@ -211,12 +233,12 @@ table {
 	border-collapse: collapse;
 }
 th, td {
-	border: 1px solid var(--border-color);
 	padding: 0.1rem 0.5rem;
 	min-width: 80px;
 	background: var(--bgl-white);
 	user-select: none;
 }
+
 th {
 	background: var(--input-bg);
 	white-space: nowrap;
@@ -224,6 +246,9 @@ th {
 	padding: 0.25rem 0.5rem;
 	font-weight: 500;
 	text-align: start;
+	border-bottom: 1px solid var(--border-color);
+	border-inline-start: 1px solid var(--border-color);
+
 }
 th .bgl_icon-font{
 	vertical-align: middle;
@@ -239,6 +264,7 @@ td.locked.selected {
 	background: var(--bgl-primary-light);
 }
 td {
+	border: 1px solid var(--border-color);
 	height: 40px;
 	vertical-align: middle;
 }

package/src/components/layout/Layout.vue

@@ -10,7 +10,7 @@ interface LayoutProrps {
 }
 
 const props = withDefaults(defineProps<LayoutProrps>(), {
-	gap: 1,
+	gap: 0.5,
 	h100: false,
 	columns: () => ([]),
 	rows: () => ([]),

package/src/components/lightbox/index.ts

@@ -60,13 +60,13 @@ const youtubeRegex = /youtube\.com|youtu\.be/
 const vimeoRegex = /vimeo\.com/
 
 function urlToName(url: string): string {
-	if (!url) return ''
+	if (!url || typeof url !== 'string') return ''
 	const name = url.split('/').pop() || ''
 	return name.replace(/\.[^/.]+$/, '')
 }
 
-function determineFileType(url: string): string {
-	if (!url) return 'unknown'
+function determineFileType(url: any): string {
+	if (typeof url !== 'string' || !url) return 'unknown'
 	const extension = (url.split('.').pop() || '').toLowerCase()
 	const altExtension = url.split('?')[0].split('.').pop()?.toLowerCase() || ''
 	if (IMAGE_FORMATS_REGEXP.test(extension) || IMAGE_FORMATS_REGEXP.test(altExtension)) return 'image'