@bagelink/vue 1.0.1 → 1.0.3

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

@@ -18,6 +18,7 @@ interface NumberInputProps {
     layout?: NumberLayout;
     center?: boolean;
     padZero?: number;
+    useGrouping?: boolean;
 }
 declare const _default: import('vue').DefineComponent<NumberInputProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:modelValue": (...args: any[]) => void;

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":"AAuOA,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,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,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;;;;;;AA6VD,wBAQG"}
+{"version":3,"file":"NumberInput.vue.d.ts","sourceRoot":"","sources":["../../../../src/components/form/inputs/NumberInput.vue"],"names":[],"mappings":"AAyOA,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,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,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;IAChB,WAAW,CAAC,EAAE,OAAO,CAAA;CACrB;;;;;;AA8VD,wBAQG"}

package/dist/index.cjs

@@ -17329,7 +17329,8 @@ const _sfc_main$H = /* @__PURE__ */ vue.defineComponent({
     helptext: {},
     layout: {},
     center: { type: Boolean },
-    padZero: { default: 1 }
+    padZero: { default: 1 },
+    useGrouping: { type: Boolean, default: true }
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
@@ -17371,7 +17372,7 @@ const _sfc_main$H = /* @__PURE__ */ vue.defineComponent({
       const formatter = new Intl.NumberFormat("en-US", {
         minimumFractionDigits: 0,
         maximumFractionDigits: 20,
-        useGrouping: true
+        useGrouping: __props.useGrouping
       });
       const formattedNum = formatter.format(num);
       const [integerPart, decimalPart] = formattedNum.split(".");
@@ -17434,7 +17435,7 @@ const _sfc_main$H = /* @__PURE__ */ vue.defineComponent({
               readonly: _ctx.disabled,
               inputmode: "decimal",
               autocomplete: "off",
-              pattern: "^-?\\d*\\.?\\d*$",
+              pattern: "^-?\\d{1,3}(,\\d{3})*(\\.\\d+)?$",
               autocorrect: "off",
               spellcheck: "false",
               onInput: inputHandler,
@@ -17500,7 +17501,7 @@ const _sfc_main$H = /* @__PURE__ */ vue.defineComponent({
     };
   }
 });
-const NumberInput = /* @__PURE__ */ _export_sfc(_sfc_main$H, [["__scopeId", "data-v-8f9331b5"]]);
+const NumberInput = /* @__PURE__ */ _export_sfc(_sfc_main$H, [["__scopeId", "data-v-a3a46563"]]);
 const _hoisted_1$z = ["value", "autofocus", "onKeydown", "onPaste"];
 const _sfc_main$G = /* @__PURE__ */ vue.defineComponent({
   __name: "OTP",

package/dist/index.mjs

@@ -17327,7 +17327,8 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
     helptext: {},
     layout: {},
     center: { type: Boolean },
-    padZero: { default: 1 }
+    padZero: { default: 1 },
+    useGrouping: { type: Boolean, default: true }
   },
   emits: ["update:modelValue"],
   setup(__props, { emit: __emit }) {
@@ -17369,7 +17370,7 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
       const formatter = new Intl.NumberFormat("en-US", {
         minimumFractionDigits: 0,
         maximumFractionDigits: 20,
-        useGrouping: true
+        useGrouping: __props.useGrouping
       });
       const formattedNum = formatter.format(num);
       const [integerPart, decimalPart] = formattedNum.split(".");
@@ -17432,7 +17433,7 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
               readonly: _ctx.disabled,
               inputmode: "decimal",
               autocomplete: "off",
-              pattern: "^-?\\d*\\.?\\d*$",
+              pattern: "^-?\\d{1,3}(,\\d{3})*(\\.\\d+)?$",
               autocorrect: "off",
               spellcheck: "false",
               onInput: inputHandler,
@@ -17498,7 +17499,7 @@ const _sfc_main$H = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const NumberInput = /* @__PURE__ */ _export_sfc(_sfc_main$H, [["__scopeId", "data-v-8f9331b5"]]);
+const NumberInput = /* @__PURE__ */ _export_sfc(_sfc_main$H, [["__scopeId", "data-v-a3a46563"]]);
 const _hoisted_1$z = ["value", "autofocus", "onKeydown", "onPaste"];
 const _sfc_main$G = /* @__PURE__ */ defineComponent({
   __name: "OTP",

package/dist/style.css

@@ -1847,14 +1847,14 @@ pre code.hljs{
 	direction: ltr;
 }
 
-.txtInputIconStart .iconStart[data-v-8f9331b5] {
+.txtInputIconStart .iconStart[data-v-a3a46563] {
 	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-8f9331b5] {
+.textInputSpinnerWrap .spinner[data-v-a3a46563] {
 	color: var(--input-color);
 	position: absolute;
 	inset-inline-end: 0;
@@ -1864,18 +1864,18 @@ pre code.hljs{
 	flex-direction: column;
 	gap: 0;
 }
-.top-bgl-ctrl-num-btn[data-v-8f9331b5]{
+.top-bgl-ctrl-num-btn[data-v-a3a46563]{
 	margin-top: calc(var(--input-height) / 10) !important;
 }
-.bgl-ctrl-num-btn[data-v-8f9331b5]{
+.bgl-ctrl-num-btn[data-v-a3a46563]{
 	height: calc(var(--input-height) / 2.5) !important;
 	isolation: isolate;
 }
-.bgl-big-ctrl-num-btn[data-v-8f9331b5]{
+.bgl-big-ctrl-num-btn[data-v-a3a46563]{
 	width: 100% !important;
 	isolation: isolate;
 }
-.bgl-number-input[data-v-8f9331b5]{
+.bgl-number-input[data-v-a3a46563]{
 	padding-inline-end: 1.75rem !important;
 }
 

package/package.json

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

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

@@ -23,6 +23,7 @@ interface NumberInputProps {
 	layout?: NumberLayout
 	center?: boolean
 	padZero?: number
+	useGrouping?: boolean
 }
 
 const {
@@ -41,7 +42,8 @@ const {
 	layout,
 	id,
 	padZero = 1,
-	defaultValue
+	defaultValue,
+	useGrouping = true
 } = defineProps<NumberInputProps>()
 
 const emit = defineEmits(['update:modelValue'])
@@ -90,7 +92,7 @@ function formatNumber(num: number) {
 	const formatter = new Intl.NumberFormat('en-US', {
 		minimumFractionDigits: 0,
 		maximumFractionDigits: 20,
-		useGrouping: true
+		useGrouping
 	})
 
 	const formattedNum = formatter.format(num)
@@ -161,7 +163,7 @@ watch(() => modelValue, (newVal) => {
 					:readonly="disabled"
 					inputmode="decimal"
 					autocomplete="off"
-					pattern="^-?\d*\.?\d*$"
+					pattern="^-?\d{1,3}(,\d{3})*(\.\d+)?$"
 					autocorrect="off"
 					spellcheck="false"
 					@input="inputHandler"