@bagelink/vue 0.0.1206 → 0.0.1216

package/dist/components/DataPreview.vue.d.ts

@@ -1,6 +1,7 @@
 import { TableSchemaProps } from '../types/TableSchema';
 declare const _default: <T extends Record<string, any>>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
-    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, never> & (TableSchemaProps<T> & {
+    props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{} & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps, never>, never> & (Omit<TableSchemaProps<T>, "data"> & {
+        data: T;
         includeUnset?: boolean;
     }) & Partial<{}>> & import('vue').PublicProps;
     expose(exposed: import('vue').ShallowUnwrapRef<{}>): void;

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

@@ -1 +1 @@
-{"version":3,"file":"DataPreview.vue.d.ts","sourceRoot":"","sources":["../../src/components/DataPreview.vue"],"names":[],"mappings":"AAoEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;yBAK3C,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,eAChC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,cAClD,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,iBAC5F,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;WAqF1D,mBAAmB,CAAC;uBAnF8B,OAAO;oBAmF6B,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;UAEJ,EAAE;OAGG,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAA;CAAE;AA/FzE,wBA+F4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
+{"version":3,"file":"DataPreview.vue.d.ts","sourceRoot":"","sources":["../../src/components/DataPreview.vue"],"names":[],"mappings":"AAoEA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;yBAK3C,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,eAChC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,cAClD,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,iBAC5F,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;WAqF1D,mBAAmB,CAAC;cAnFmC,CAAC;uBAAiB,OAAO;oBAmFM,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;UAEJ,EAAE;OAGG,OAAO,KAAK,EAAE,KAAK,GAAG;IAAE,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,WAAW,CAAC,CAAA;CAAE;AA/FzE,wBA+F4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}

package/dist/components/dialog/index.d.ts

@@ -1,19 +1,2 @@
-import { Component, Plugin } from 'vue';
-export interface DialogOptions {
-    title?: string;
-    content?: string | Component;
-    dismissable?: boolean;
-    width?: string;
-    actions?: Array<{
-        label: string;
-        onClick: () => void;
-        variant?: 'primary' | 'secondary' | 'danger';
-    }>;
-}
-export interface DialogApi {
-    show: (options: DialogOptions) => void;
-    hide: () => void;
-}
-export declare function useDialog(): DialogApi;
-export declare const DialogPlugin: Plugin;
+export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/dialog/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/dialog/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAO,SAAS,EAAgB,MAAM,EAAY,MAAM,KAAK,CAAA;AAGzE,MAAM,WAAW,aAAa;IAC7B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,KAAK,CAAC;QACf,KAAK,EAAE,MAAM,CAAA;QACb,OAAO,EAAE,MAAM,IAAI,CAAA;QACnB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,QAAQ,CAAA;KAC5C,CAAC,CAAA;CACF;AAED,MAAM,WAAW,SAAS;IACzB,IAAI,EAAE,CAAC,OAAO,EAAE,aAAa,KAAK,IAAI,CAAA;IACtC,IAAI,EAAE,MAAM,IAAI,CAAA;CAChB;AAID,wBAAgB,SAAS,IAAI,SAAS,CAIrC;AAkDD,eAAO,MAAM,YAAY,EAAE,MAkC1B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Dialog/index.ts"],"names":[],"mappings":""}

package/dist/components/form/inputs/NumberInput.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NumberInput.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/NumberInput.vue"],"names":[],"mappings":"AAkMA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAI7C,KAAK,YAAY,GAAG,SAAS,GAAG,UAAU,GAAG,YAAY,CAAA;AAEzD,UAAU,gBAAgB;IACzB,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC5B,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,QAAQ,CAAA;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;CAChB;;;;;;AAuTD,wBAQG"}
+{"version":3,"file":"NumberInput.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/NumberInput.vue"],"names":[],"mappings":"AA6NA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AAI7C,KAAK,YAAY,GAAG,SAAS,GAAG,UAAU,GAAG,YAAY,CAAA;AAEzD,UAAU,gBAAgB;IACzB,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAC5B,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,QAAQ,CAAA;IACpB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,EAAE,CAAC,EAAE,MAAM,CAAA;IACX,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,MAAM,CAAC,EAAE,YAAY,CAAA;IACrB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;CAChB;;;;;;AAmVD,wBAQG"}

package/dist/index.cjs

@@ -7506,12 +7506,12 @@ const _hoisted_1$M = { class: "data-preview" };
 const _sfc_main$X = /* @__PURE__ */ vue.defineComponent({
   __name: "DataPreview",
   props: {
-    data: {},
     schema: { type: Function },
     showFields: {},
     useServerSort: { type: Boolean },
     selectable: { type: Boolean },
     onLastItemVisible: { type: Function },
+    data: {},
     includeUnset: { type: Boolean }
   },
   setup(__props) {
@@ -7544,7 +7544,7 @@ const _sfc_main$X = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const DataPreview = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["__scopeId", "data-v-ff265953"]]);
+const DataPreview = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["__scopeId", "data-v-550fe546"]]);
 function useTableSelection(options) {
   const allSelectorEl = vue.ref();
   const computedSelectedItems = vue.computed(() => options.selectedItems.value);
@@ -21677,38 +21677,58 @@ const _sfc_main$G = /* @__PURE__ */ vue.defineComponent({
     helptext: {},
     layout: {},
     center: { type: Boolean },
-    padZero: {}
+    padZero: { default: 1 }
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
     const emit2 = __emit;
     let numberValue = vue.ref(Number.parseFloat(`${__props.modelValue}`) || void 0);
     const btnLayouts = ["horizontal", "vertical"];
-    const canAdd = vue.computed(() => !(__props.max !== void 0 && (numberValue.value || 0) + __props.step > __props.max));
-    const canDecrement = vue.computed(() => !(__props.min !== void 0 && (numberValue.value || 0 - __props.step) < __props.min));
+    function add2(...numbers) {
+      var _a2;
+      const numArr = numbers.map((n2) => n2 || 0);
+      const precision = ((_a2 = __props.step.toString().split(".")[1]) == null ? void 0 : _a2.length) || 0;
+      return Number.parseFloat(numArr.reduce((acc, curr) => acc + curr, 0).toFixed(precision));
+    }
+    function subtract(...numbers) {
+      var _a2;
+      const numArr = numbers.map((n2) => n2 || 0);
+      const firstNum = numArr.shift() || 0;
+      const precision = ((_a2 = __props.step.toString().split(".")[1]) == null ? void 0 : _a2.length) || 0;
+      return Number.parseFloat(numArr.reduce((acc, curr) => acc - curr, firstNum).toFixed(precision));
+    }
+    const canAdd = vue.computed(() => !(__props.max !== void 0 && add2(numberValue.value, __props.step) <= __props.max));
+    const canDecrement = vue.computed(() => __props.min === void 0 || subtract(numberValue.value, __props.step) >= __props.min);
     function increment() {
       if (!canAdd.value) return;
-      numberValue.value = (numberValue.value || 0) + __props.step;
+      numberValue.value = add2(numberValue.value || 0, __props.step);
       emit2("update:modelValue", numberValue.value);
     }
     function decrement() {
       if (!canDecrement.value) return;
-      numberValue.value = (numberValue.value || 0) - __props.step;
+      numberValue.value = subtract(numberValue.value || 0, __props.step);
       emit2("update:modelValue", numberValue.value);
     }
     function formatNumber2(num) {
-      let formatted = num.toString();
-      if (__props.padZero && __props.padZero > 0) {
-        formatted = formatted.padStart(__props.padZero, "0");
-      }
-      return formatted.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+      if (Number.isNaN(num)) return "";
+      const formatter = new Intl.NumberFormat("en-US", {
+        minimumFractionDigits: 0,
+        maximumFractionDigits: 20,
+        useGrouping: true
+      });
+      const formattedNum = formatter.format(num);
+      const [integerPart, decimalPart] = formattedNum.split(".");
+      const padding = __props.padZero && __props.padZero > integerPart.replace(/,/g, "").length ? "0".repeat(__props.padZero - integerPart.replace(/,/g, "").length) : "";
+      return decimalPart ? `${padding}${integerPart}.${decimalPart}` : `${padding}${integerPart}`;
     }
     let formattedValue = vue.ref("");
     function inputHandler() {
-      const numeric = formattedValue.value.replace(/[^\d.-]/g, "");
-      if (numeric === "" || numeric === "-" || numeric === "." || numeric === "-." || numeric.endsWith(".")) return;
+      let numeric = formattedValue.value.replace(/[^\d.-]/g, "");
+      if (numeric === "-." || numeric.endsWith(".")) return;
+      const emptyValue = ["", "-", "."].includes(numeric);
+      if (emptyValue) numeric = `${__props.min}`;
       numberValue.value = Number.parseFloat(numeric);
-      formattedValue.value = formatNumber2(numberValue.value);
+      formattedValue.value = emptyValue ? "" : formatNumber2(numberValue.value);
       emit2("update:modelValue", numberValue.value);
     }
     vue.watch(() => numberValue.value, () => {
@@ -21820,7 +21840,7 @@ const _sfc_main$G = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const NumberInput = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["__scopeId", "data-v-e3916f73"]]);
+const NumberInput = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["__scopeId", "data-v-d8856711"]]);
 const _hoisted_1$y = ["value", "autofocus", "onKeydown", "onPaste"];
 const _sfc_main$F = /* @__PURE__ */ vue.defineComponent({
   __name: "OTP",

package/dist/index.mjs

@@ -7504,12 +7504,12 @@ const _hoisted_1$M = { class: "data-preview" };
 const _sfc_main$X = /* @__PURE__ */ defineComponent({
   __name: "DataPreview",
   props: {
-    data: {},
     schema: { type: Function },
     showFields: {},
     useServerSort: { type: Boolean },
     selectable: { type: Boolean },
     onLastItemVisible: { type: Function },
+    data: {},
     includeUnset: { type: Boolean }
   },
   setup(__props) {
@@ -7542,7 +7542,7 @@ const _sfc_main$X = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const DataPreview = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["__scopeId", "data-v-ff265953"]]);
+const DataPreview = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["__scopeId", "data-v-550fe546"]]);
 function useTableSelection(options) {
   const allSelectorEl = ref();
   const computedSelectedItems = computed(() => options.selectedItems.value);
@@ -21675,38 +21675,58 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
     helptext: {},
     layout: {},
     center: { type: Boolean },
-    padZero: {}
+    padZero: { default: 1 }
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
     const emit2 = __emit;
     let numberValue = ref(Number.parseFloat(`${__props.modelValue}`) || void 0);
     const btnLayouts = ["horizontal", "vertical"];
-    const canAdd = computed(() => !(__props.max !== void 0 && (numberValue.value || 0) + __props.step > __props.max));
-    const canDecrement = computed(() => !(__props.min !== void 0 && (numberValue.value || 0 - __props.step) < __props.min));
+    function add2(...numbers) {
+      var _a2;
+      const numArr = numbers.map((n2) => n2 || 0);
+      const precision = ((_a2 = __props.step.toString().split(".")[1]) == null ? void 0 : _a2.length) || 0;
+      return Number.parseFloat(numArr.reduce((acc, curr) => acc + curr, 0).toFixed(precision));
+    }
+    function subtract(...numbers) {
+      var _a2;
+      const numArr = numbers.map((n2) => n2 || 0);
+      const firstNum = numArr.shift() || 0;
+      const precision = ((_a2 = __props.step.toString().split(".")[1]) == null ? void 0 : _a2.length) || 0;
+      return Number.parseFloat(numArr.reduce((acc, curr) => acc - curr, firstNum).toFixed(precision));
+    }
+    const canAdd = computed(() => !(__props.max !== void 0 && add2(numberValue.value, __props.step) <= __props.max));
+    const canDecrement = computed(() => __props.min === void 0 || subtract(numberValue.value, __props.step) >= __props.min);
     function increment() {
       if (!canAdd.value) return;
-      numberValue.value = (numberValue.value || 0) + __props.step;
+      numberValue.value = add2(numberValue.value || 0, __props.step);
       emit2("update:modelValue", numberValue.value);
     }
     function decrement() {
       if (!canDecrement.value) return;
-      numberValue.value = (numberValue.value || 0) - __props.step;
+      numberValue.value = subtract(numberValue.value || 0, __props.step);
       emit2("update:modelValue", numberValue.value);
     }
     function formatNumber2(num) {
-      let formatted = num.toString();
-      if (__props.padZero && __props.padZero > 0) {
-        formatted = formatted.padStart(__props.padZero, "0");
-      }
-      return formatted.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+      if (Number.isNaN(num)) return "";
+      const formatter = new Intl.NumberFormat("en-US", {
+        minimumFractionDigits: 0,
+        maximumFractionDigits: 20,
+        useGrouping: true
+      });
+      const formattedNum = formatter.format(num);
+      const [integerPart, decimalPart] = formattedNum.split(".");
+      const padding = __props.padZero && __props.padZero > integerPart.replace(/,/g, "").length ? "0".repeat(__props.padZero - integerPart.replace(/,/g, "").length) : "";
+      return decimalPart ? `${padding}${integerPart}.${decimalPart}` : `${padding}${integerPart}`;
     }
     let formattedValue = ref("");
     function inputHandler() {
-      const numeric = formattedValue.value.replace(/[^\d.-]/g, "");
-      if (numeric === "" || numeric === "-" || numeric === "." || numeric === "-." || numeric.endsWith(".")) return;
+      let numeric = formattedValue.value.replace(/[^\d.-]/g, "");
+      if (numeric === "-." || numeric.endsWith(".")) return;
+      const emptyValue = ["", "-", "."].includes(numeric);
+      if (emptyValue) numeric = `${__props.min}`;
       numberValue.value = Number.parseFloat(numeric);
-      formattedValue.value = formatNumber2(numberValue.value);
+      formattedValue.value = emptyValue ? "" : formatNumber2(numberValue.value);
       emit2("update:modelValue", numberValue.value);
     }
     watch(() => numberValue.value, () => {
@@ -21818,7 +21838,7 @@ const _sfc_main$G = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const NumberInput = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["__scopeId", "data-v-e3916f73"]]);
+const NumberInput = /* @__PURE__ */ _export_sfc(_sfc_main$G, [["__scopeId", "data-v-d8856711"]]);
 const _hoisted_1$y = ["value", "autofocus", "onKeydown", "onPaste"];
 const _sfc_main$F = /* @__PURE__ */ defineComponent({
   __name: "OTP",

package/dist/style.css

@@ -453,23 +453,23 @@ display: block;
 }
 }
 
-.data-preview[data-v-ff265953] {
+.data-preview[data-v-550fe546] {
 	display: flex;
 	flex-direction: column;
 	gap: 0.5rem;
 }
-.preview-field[data-v-ff265953] {
+.preview-field[data-v-550fe546] {
 	display: flex;
 	flex-direction: row;
 	align-items: center;
 	gap: 0.5rem;
 }
-.field-label[data-v-ff265953] {
+.field-label[data-v-550fe546] {
 	font-size: 0.8rem;
 	color: var(--bgl-black-tint);
 	font-weight: 500;
 }
-.field-value[data-v-ff265953] {
+.field-value[data-v-550fe546] {
 	font-size: 0.95rem;
 }
 
@@ -1241,14 +1241,14 @@ pre code.hljs{
 	direction: ltr;
 }
 
-.txtInputIconStart .iconStart[data-v-e3916f73] {
+.txtInputIconStart .iconStart[data-v-d8856711] {
 	color: var(--input-color);
 	position: absolute;
     inset-inline-start:calc(var(--input-height) / 3 - 0.25rem);
 	margin-top: calc(var(--input-height) / 2 );
 	line-height: 0;
 }
-.textInputSpinnerWrap .spinner[data-v-e3916f73] {
+.textInputSpinnerWrap .spinner[data-v-d8856711] {
 	color: var(--input-color);
 	position: absolute;
 	inset-inline-end: 0;
@@ -1258,18 +1258,18 @@ pre code.hljs{
 	flex-direction: column;
 	gap: 0;
 }
-.top-bgl-ctrl-num-btn[data-v-e3916f73]{
+.top-bgl-ctrl-num-btn[data-v-d8856711]{
 	margin-top: calc(var(--input-height) / 10) !important;
 }
-.bgl-ctrl-num-btn[data-v-e3916f73]{
+.bgl-ctrl-num-btn[data-v-d8856711]{
 	height: calc(var(--input-height) / 2.5) !important;
 	isolation: isolate;
 }
-.bgl-big-ctrl-num-btn[data-v-e3916f73]{
+.bgl-big-ctrl-num-btn[data-v-d8856711]{
 	width: 100% !important;
 	isolation: isolate;
 }
-.bgl-number-input[data-v-e3916f73]{
+.bgl-number-input[data-v-d8856711]{
 	padding-inline-end: 1.75rem !important;
 }
 
@@ -5809,6 +5809,10 @@ to {
 }.w-auto,
 .w-a {
     width: auto !important;
+}.max-width-none {
+    max-width: none !important;
+}.max-height-none {
+    max-height: none !important;
 }.h-auto,
 .h-a {
     height: auto !important;
@@ -9523,6 +9527,14 @@ to {
         width: auto !important;
     }
 
+    .m_max-width-none {
+        max-width: none !important;
+    }
+
+    .m_max-height-none {
+        max-height: none !important;
+    }
+
     .m_h-auto,
     .m_h-a {
         height: auto !important;

package/package.json

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

package/src/components/DataPreview.vue

@@ -6,7 +6,7 @@ import { computed, useSlots } from 'vue'
 import { useSchemaField } from '../composables/useSchemaField'
 import { useTableData } from './DataTable/useTableData'
 
-const props = defineProps<TableSchemaProps<T> & { includeUnset?: boolean }>()
+const props = defineProps<Omit<TableSchemaProps<T>, 'data'> & { data: T, includeUnset?: boolean }>()
 const slots = useSlots() as Slots & Record<string, (props: { row: T, field: BaseBagelField<T> }) => any>
 
 const data = computed(() => Array.isArray(props.data) ? props.data : [props.data])

package/src/components/Dialog/index.ts

@@ -0,0 +1,192 @@
+// import type { App, Component, InjectionKey, Plugin, PropType } from 'vue'
+// import { createApp, defineComponent, h, inject } from 'vue'
+
+// export interface DialogOptions {
+// 	title?: string
+// 	content?: string | Component
+// 	dismissable?: boolean
+// 	width?: string
+// 	actions?: Array<{
+// 		label: string
+// 		onClick: () => void
+// 		variant?: 'primary' | 'secondary' | 'danger'
+// 	}>
+// }
+
+// export interface DialogApi {
+// 	show: (options: DialogOptions) => void
+// 	hide: () => void
+// }
+
+// const DialogSymbol: InjectionKey<DialogApi> = Symbol('dialog')
+
+// export function useDialog(): DialogApi {
+// 	const api = inject(DialogSymbol)
+// 	if (!api) throw new Error('Dialog plugin not installed')
+// 	return api
+// }
+
+// const Dialog = defineComponent({
+// 	props: {
+// 		options: {
+// 			type: Object as () => DialogOptions,
+// 			required: true
+// 		},
+// 		onClose: {
+// 			type: Function as PropType<(event?: MouseEvent) => void>,
+// 			required: true
+// 		}
+// 	},
+// 	setup(props) {
+// 		return () => h('div', {
+// 			class: 'dialog-overlay',
+// 			onClick: (e: MouseEvent) => {
+// 				if (props.options.dismissable && e.target === e.currentTarget) {
+// 					props.onClose()
+// 				}
+// 			}
+// 		}, [
+// 			h('div', {
+// 				class: ['dialog', props.options.width ? `w-${props.options.width}` : 'w-96']
+// 			}, [
+// 				h('div', { class: 'dialog-header' }, [
+// 					h('h3', { class: 'dialog-title' }, props.options.title),
+// 					props.options.dismissable && h('button', {
+// 						class: 'dialog-close',
+// 						onClick: props.onClose
+// 					}, '×')
+// 				]),
+// 				h('div', { class: 'dialog-content' }, [
+// 					typeof props.options.content === 'string'
+// 						? props.options.content
+// 						: h(props.options.content as any)
+// 				]),
+// 				props.options.actions && h('div', { class: 'dialog-actions' }, props.options.actions.map(action => h('button', {
+// 					class: ['dialog-btn', action.variant],
+// 					onClick: () => {
+// 						action.onClick()
+// 						props.onClose()
+// 					}
+// 				}, action.label)
+// 				))
+// 			])
+// 		])
+// 	}
+// })
+
+// export const DialogPlugin: Plugin = {
+// 	install: (app: App) => {
+// 		// Create a div to mount our dialog
+// 		const dialogContainer = document.createElement('div')
+// 		document.body.appendChild(dialogContainer)
+
+// 		let currentDialog: any = null
+
+// 		const api: DialogApi = {
+// 			show: (options: DialogOptions) => {
+// 				// Remove existing dialog if any
+// 				if (currentDialog) {
+// 					currentDialog.unmount()
+// 				}
+
+// 				// Create new dialog instance
+// 				const dialogApp = createApp(Dialog, {
+// 					options,
+// 					onClose: () => { api.hide() }
+// 				})
+
+// 				// Mount it
+// 				currentDialog = dialogApp.mount(dialogContainer)
+// 			},
+// 			hide: () => {
+// 				if (currentDialog) {
+// 					currentDialog.unmount()
+// 					currentDialog = null
+// 				}
+// 			}
+// 		}
+
+// 		app.provide(DialogSymbol, api)
+// 	}
+// }
+
+// // Add some basic styles
+// const style = document.createElement('style')
+// style.textContent = `
+// .dialog-overlay {
+//   position: fixed;
+//   top: 0;
+//   left: 0;
+//   right: 0;
+//   bottom: 0;
+//   background: rgba(0, 0, 0, 0.5);
+//   display: flex;
+//   align-items: center;
+//   justify-content: center;
+//   z-index: 1000;
+// }
+
+// .dialog {
+//   background: white;
+//   border-radius: 0.5rem;
+//   box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+//   max-width: 90vw;
+//   max-height: 90vh;
+//   overflow: auto;
+// }
+
+// .dialog-header {
+//   padding: 1rem;
+//   border-bottom: 1px solid #e5e7eb;
+//   display: flex;
+//   justify-content: space-between;
+//   align-items: center;
+// }
+
+// .dialog-title {
+//   margin: 0;
+//   font-size: 1.25rem;
+//   font-weight: 600;
+// }
+
+// .dialog-close {
+//   background: none;
+//   border: none;
+//   font-size: 1.5rem;
+//   cursor: pointer;
+//   padding: 0.25rem;
+// }
+
+// .dialog-content {
+//   padding: 1rem;
+// }
+
+// .dialog-actions {
+//   padding: 1rem;
+//   border-top: 1px solid #e5e7eb;
+//   display: flex;
+//   justify-content: flex-end;
+//   gap: 0.5rem;
+// }
+
+// .dialog-btn {
+//   padding: 0.5rem 1rem;
+//   border-radius: 0.375rem;
+//   border: 1px solid #e5e7eb;
+//   background: white;
+//   cursor: pointer;
+// }
+
+// .dialog-btn.primary {
+//   background: #3b82f6;
+//   color: white;
+//   border-color: #3b82f6;
+// }
+
+// .dialog-btn.danger {
+//   background: #ef4444;
+//   color: white;
+//   border-color: #ef4444;
+// }
+// `
+// document.head.appendChild(style)

package/src/components/form/inputs/NumberInput.vue

@@ -39,7 +39,7 @@ const {
 	helptext,
 	layout,
 	id,
-	padZero,
+	padZero = 1,
 } = defineProps<NumberInputProps>()
 
 const emit = defineEmits(['update:modelValue'])
@@ -48,38 +48,66 @@ let numberValue = $ref(Number.parseFloat(`${modelValue}`) || undefined)
 
 const btnLayouts: NumberLayout[] = ['horizontal', 'vertical']
 
-const canAdd = $computed(() => !(max !== undefined && ((numberValue || 0) + step) > max))
-const canDecrement = $computed(() => !(min !== undefined && (numberValue || 0 - step) < min))
+function add(...numbers: (number | undefined)[]) {
+	const numArr: number[] = numbers.map(n => n || 0)
+	const precision = step.toString().split('.')[1]?.length || 0
+	return Number.parseFloat(numArr.reduce((acc, curr) => acc + curr, 0).toFixed(precision))
+}
+
+function subtract(...numbers: (number | undefined)[]) {
+	const numArr: number[] = numbers.map(n => n || 0)
+	const firstNum = numArr.shift() || 0
+	const precision = step.toString().split('.')[1]?.length || 0
+	return Number.parseFloat(numArr.reduce((acc, curr) => acc - curr, firstNum).toFixed(precision))
+}
+
+const canAdd = $computed(() => !(max !== undefined && add(numberValue, step) <= max))
+const canDecrement = $computed(() => min === undefined || subtract(numberValue, step) >= min)
 
 // Methods
 function increment() {
 	if (!canAdd) return
-	numberValue = (numberValue || 0) + step
+	numberValue = add(numberValue || 0, step)
 	emit('update:modelValue', numberValue)
 }
 
 function decrement() {
 	if (!canDecrement) return
-	numberValue = (numberValue || 0) - step
+	numberValue = subtract(numberValue || 0, step)
 	emit('update:modelValue', numberValue)
 }
 
 function formatNumber(num: number) {
-	let formatted = num.toString()
-	if (padZero && padZero > 0) {
-		formatted = formatted.padStart(padZero, '0')
-	}
-	// eslint-disable-next-line regexp/no-unused-capturing-group
-	return formatted.replace(/\B(?=(\d{3})+(?!\d))/g, ',')
+	if (Number.isNaN(num)) return ''
+	const formatter = new Intl.NumberFormat('en-US', {
+		minimumFractionDigits: 0,
+		maximumFractionDigits: 20,
+		useGrouping: true
+	})
+
+	const formattedNum = formatter.format(num)
+	const [integerPart, decimalPart] = formattedNum.split('.')
+
+	// Add padding zeros if needed
+	const padding = padZero && padZero > integerPart.replace(/,/g, '').length
+		? '0'.repeat(padZero - integerPart.replace(/,/g, '').length)
+		: ''
+
+	return decimalPart
+		? `${padding}${integerPart}.${decimalPart}`
+		: `${padding}${integerPart}`
 }
 
 let formattedValue = $ref('')
-
 function inputHandler() {
-	const numeric = formattedValue.replace(/[^\d.-]/g, '')
-	if (numeric === '' || numeric === '-' || numeric === '.' || numeric === '-.' || numeric.endsWith('.')) return
+	let numeric = formattedValue.replace(/[^\d.-]/g, '')
+	if (numeric === '-.' || numeric.endsWith('.')) return
+	const emptyValue = ['', '-', '.'].includes(numeric)
+
+	if (emptyValue) numeric = `${min}`
+
 	numberValue = Number.parseFloat(numeric)
-	formattedValue = formatNumber(numberValue)
+	formattedValue = emptyValue ? '' : formatNumber(numberValue)
 	emit('update:modelValue', numberValue)
 }
 
@@ -108,7 +136,6 @@ watch(() => modelValue, (newVal) => {
 			</label>
 			<div class="gap-025" :class="{ 'column flex': layout === 'vertical', 'flex': layout === 'horizontal' }">
 				<Btn v-if="layout && btnLayouts.includes(layout)" flat icon="add" class="radius" :class="[{ 'bgl-big-ctrl-num-btn': layout === 'vertical' }]" tabindex="-1" @click="increment" />
-
 				<input
 					:id
 					v-model.trim="formattedValue"

package/src/styles/layout.css

@@ -2860,6 +2860,14 @@
     width: auto !important;
 }
 
+.max-width-none {
+    max-width: none !important;
+}
+
+.max-height-none {
+    max-height: none !important;
+}
+
 .h-auto,
 .h-a {
     height: auto !important;

package/src/styles/mobilLayout.css

@@ -2151,6 +2151,14 @@
         width: auto !important;
     }
 
+    .m_max-width-none {
+        max-width: none !important;
+    }
+
+    .m_max-height-none {
+        max-height: none !important;
+    }
+
     .m_h-auto,
     .m_h-a {
         height: auto !important;

package/src/components/dialog/index.ts

@@ -1,192 +0,0 @@
-import type { App, Component, InjectionKey, Plugin, PropType } from 'vue'
-import { createApp, defineComponent, h, inject } from 'vue'
-
-export interface DialogOptions {
-	title?: string
-	content?: string | Component
-	dismissable?: boolean
-	width?: string
-	actions?: Array<{
-		label: string
-		onClick: () => void
-		variant?: 'primary' | 'secondary' | 'danger'
-	}>
-}
-
-export interface DialogApi {
-	show: (options: DialogOptions) => void
-	hide: () => void
-}
-
-const DialogSymbol: InjectionKey<DialogApi> = Symbol('dialog')
-
-export function useDialog(): DialogApi {
-	const api = inject(DialogSymbol)
-	if (!api) throw new Error('Dialog plugin not installed')
-	return api
-}
-
-const Dialog = defineComponent({
-	props: {
-		options: {
-			type: Object as () => DialogOptions,
-			required: true
-		},
-		onClose: {
-			type: Function as PropType<(event?: MouseEvent) => void>,
-			required: true
-		}
-	},
-	setup(props) {
-		return () => h('div', {
-			class: 'dialog-overlay',
-			onClick: (e: MouseEvent) => {
-				if (props.options.dismissable && e.target === e.currentTarget) {
-					props.onClose()
-				}
-			}
-		}, [
-			h('div', {
-				class: ['dialog', props.options.width ? `w-${props.options.width}` : 'w-96']
-			}, [
-				h('div', { class: 'dialog-header' }, [
-					h('h3', { class: 'dialog-title' }, props.options.title),
-					props.options.dismissable && h('button', {
-						class: 'dialog-close',
-						onClick: props.onClose
-					}, '×')
-				]),
-				h('div', { class: 'dialog-content' }, [
-					typeof props.options.content === 'string'
-						? props.options.content
-						: h(props.options.content as any)
-				]),
-				props.options.actions && h('div', { class: 'dialog-actions' }, props.options.actions.map(action => h('button', {
-					class: ['dialog-btn', action.variant],
-					onClick: () => {
-						action.onClick()
-						props.onClose()
-					}
-				}, action.label)
-				))
-			])
-		])
-	}
-})
-
-export const DialogPlugin: Plugin = {
-	install: (app: App) => {
-		// Create a div to mount our dialog
-		const dialogContainer = document.createElement('div')
-		document.body.appendChild(dialogContainer)
-
-		let currentDialog: any = null
-
-		const api: DialogApi = {
-			show: (options: DialogOptions) => {
-				// Remove existing dialog if any
-				if (currentDialog) {
-					currentDialog.unmount()
-				}
-
-				// Create new dialog instance
-				const dialogApp = createApp(Dialog, {
-					options,
-					onClose: () => { api.hide() }
-				})
-
-				// Mount it
-				currentDialog = dialogApp.mount(dialogContainer)
-			},
-			hide: () => {
-				if (currentDialog) {
-					currentDialog.unmount()
-					currentDialog = null
-				}
-			}
-		}
-
-		app.provide(DialogSymbol, api)
-	}
-}
-
-// Add some basic styles
-const style = document.createElement('style')
-style.textContent = `
-.dialog-overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0, 0, 0, 0.5);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 1000;
-}
-
-.dialog {
-  background: white;
-  border-radius: 0.5rem;
-  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
-  max-width: 90vw;
-  max-height: 90vh;
-  overflow: auto;
-}
-
-.dialog-header {
-  padding: 1rem;
-  border-bottom: 1px solid #e5e7eb;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.dialog-title {
-  margin: 0;
-  font-size: 1.25rem;
-  font-weight: 600;
-}
-
-.dialog-close {
-  background: none;
-  border: none;
-  font-size: 1.5rem;
-  cursor: pointer;
-  padding: 0.25rem;
-}
-
-.dialog-content {
-  padding: 1rem;
-}
-
-.dialog-actions {
-  padding: 1rem;
-  border-top: 1px solid #e5e7eb;
-  display: flex;
-  justify-content: flex-end;
-  gap: 0.5rem;
-}
-
-.dialog-btn {
-  padding: 0.5rem 1rem;
-  border-radius: 0.375rem;
-  border: 1px solid #e5e7eb;
-  background: white;
-  cursor: pointer;
-}
-
-.dialog-btn.primary {
-  background: #3b82f6;
-  color: white;
-  border-color: #3b82f6;
-}
-
-.dialog-btn.danger {
-  background: #ef4444;
-  color: white;
-  border-color: #ef4444;
-}
-`
-document.head.appendChild(style)