@dmsi/wedgekit-react 0.0.1073 → 0.0.1074

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.
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
@@ -1285,8 +1285,13 @@ var Stepper = (_a) => {
1285
1285
  "step",
1286
1286
  "allowDecimals"
1287
1287
  ]);
1288
+ const maxInputCharacters = 15;
1288
1289
  const userInputRef = (0, import_react8.useRef)(false);
1289
1290
  const [displayValue, setDisplayValue] = (0, import_react8.useState)(String(value));
1291
+ const inputCharacterWidth = Math.min(
1292
+ Math.max(displayValue.length, 1),
1293
+ maxInputCharacters
1294
+ );
1290
1295
  const buttonMin = Math.max(step, min != null ? min : step);
1291
1296
  (0, import_react8.useEffect)(() => {
1292
1297
  if (userInputRef.current) {
@@ -1372,7 +1377,8 @@ var Stepper = (_a) => {
1372
1377
  inputMode: allowDecimals ? "decimal" : "numeric",
1373
1378
  pattern: allowDecimals ? "[0-9]*\\.?[0-9]*" : "[0-9]*",
1374
1379
  align: "center",
1375
- maxLength: 15,
1380
+ maxLength: maxInputCharacters,
1381
+ size: inputCharacterWidth,
1376
1382
  value: displayValue,
1377
1383
  onChange: (e) => {
1378
1384
  const rawValue = e.target.value;
@@ -1419,7 +1425,7 @@ var Stepper = (_a) => {
1419
1425
  },
1420
1426
  error,
1421
1427
  disabled,
1422
- className: "!w-auto !min-w-6 !max-w-[5ch] !h-4.5 !px-0 !overflow-x-auto disabled:!text-text-on-action-primary-disabled disabled:!bg-background-action-secondary-disabled disabled:!border-border-primary-normal"
1428
+ className: "!w-auto !min-w-6 !max-w-[15ch] !h-4.5 !px-0 !overflow-x-auto disabled:!text-text-on-action-primary-disabled disabled:!bg-background-action-secondary-disabled disabled:!border-border-primary-normal"
1423
1429
  })
1424
1430
  ) }),
1425
1431
  !hideButtons && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
@@ -64,8 +64,13 @@ var Stepper = (_a) => {
64
64
  "step",
65
65
  "allowDecimals"
66
66
  ]);
67
+ const maxInputCharacters = 15;
67
68
  const userInputRef = useRef(false);
68
69
  const [displayValue, setDisplayValue] = useState(String(value));
70
+ const inputCharacterWidth = Math.min(
71
+ Math.max(displayValue.length, 1),
72
+ maxInputCharacters
73
+ );
69
74
  const buttonMin = Math.max(step, min != null ? min : step);
70
75
  useEffect(() => {
71
76
  if (userInputRef.current) {
@@ -151,7 +156,8 @@ var Stepper = (_a) => {
151
156
  inputMode: allowDecimals ? "decimal" : "numeric",
152
157
  pattern: allowDecimals ? "[0-9]*\\.?[0-9]*" : "[0-9]*",
153
158
  align: "center",
154
- maxLength: 15,
159
+ maxLength: maxInputCharacters,
160
+ size: inputCharacterWidth,
155
161
  value: displayValue,
156
162
  onChange: (e) => {
157
163
  const rawValue = e.target.value;
@@ -198,7 +204,7 @@ var Stepper = (_a) => {
198
204
  },
199
205
  error,
200
206
  disabled,
201
- className: "!w-auto !min-w-6 !max-w-[5ch] !h-4.5 !px-0 !overflow-x-auto disabled:!text-text-on-action-primary-disabled disabled:!bg-background-action-secondary-disabled disabled:!border-border-primary-normal"
207
+ className: "!w-auto !min-w-6 !max-w-[15ch] !h-4.5 !px-0 !overflow-x-auto disabled:!text-text-on-action-primary-disabled disabled:!bg-background-action-secondary-disabled disabled:!border-border-primary-normal"
202
208
  })
203
209
  ) }),
204
210
  !hideButtons && /* @__PURE__ */ jsx(
@@ -927,8 +927,8 @@
927
927
  .w-screen {
928
928
  width: 100vw;
929
929
  }
930
- .\!max-w-\[5ch\] {
931
- max-width: 5ch !important;
930
+ .\!max-w-\[15ch\] {
931
+ max-width: 15ch !important;
932
932
  }
933
933
  .max-w-25 {
934
934
  max-width: calc(var(--spacing) * 25);
package/dist/index.css CHANGED
@@ -905,8 +905,8 @@
905
905
  .w-screen {
906
906
  width: 100vw;
907
907
  }
908
- .\!max-w-\[5ch\] {
909
- max-width: 5ch !important;
908
+ .\!max-w-\[15ch\] {
909
+ max-width: 15ch !important;
910
910
  }
911
911
  .max-w-25 {
912
912
  max-width: calc(var(--spacing) * 25);
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@dmsi/wedgekit-react",
3
3
  "private": false,
4
- "version": "0.0.1073",
4
+ "version": "0.0.1074",
5
5
  "type": "module",
6
6
  "scripts": {
7
7
  "build": "tsup",