@sustaina/shared-ui 1.61.0 → 1.62.0

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.
package/dist/index.js CHANGED
@@ -5694,7 +5694,7 @@ function MonthCal({
5694
5694
  setMenuYear(year);
5695
5695
  }
5696
5696
  }
5697
- }, [selectedMonthDate, menuYear]);
5697
+ }, [selectedMonthDate]);
5698
5698
  React__namespace.useEffect(() => {
5699
5699
  if (typeof minYear === "number" && menuYear < minYear) {
5700
5700
  setMenuYear(minYear);
@@ -17168,60 +17168,11 @@ var Input2 = React__namespace.forwardRef(
17168
17168
  }
17169
17169
  );
17170
17170
  Input2.displayName = "Input";
17171
- function useFillDecimalOnBlur({
17172
- enabled,
17173
- decimalScale,
17174
- value,
17175
- defaultValue
17176
- }) {
17177
- const blurScale = enabled ? decimalScale ?? 2 : void 0;
17178
- const isUserEditingRef = React__namespace.useRef(false);
17179
- const [formattedValue, setFormattedValue] = React__namespace.useState(() => {
17180
- if (!enabled) return void 0;
17181
- const scale = decimalScale ?? 2;
17182
- const initial = parseToNumber(value) ?? parseToNumber(defaultValue);
17183
- if (initial !== void 0) return truncateToFixed(initial, scale);
17184
- return void 0;
17185
- });
17186
- React__namespace.useEffect(() => {
17187
- if (!enabled) return;
17188
- const parsed = parseToNumber(value);
17189
- if (parsed !== void 0) {
17190
- if (blurScale !== void 0 && !isUserEditingRef.current) {
17191
- setFormattedValue(truncateToFixed(parsed, blurScale));
17192
- }
17193
- } else if (value === null || value === "") {
17194
- setFormattedValue(void 0);
17195
- }
17196
- }, [value, enabled, blurScale]);
17197
- const onEdit = React__namespace.useCallback(
17198
- (values, sourceInfo) => {
17199
- if (!enabled || sourceInfo.source !== "event") return;
17200
- isUserEditingRef.current = true;
17201
- setFormattedValue(values.value || void 0);
17202
- },
17203
- [enabled]
17204
- );
17205
- const onBlur = React__namespace.useCallback(
17206
- (truncatedStr) => {
17207
- isUserEditingRef.current = false;
17208
- if (!enabled || blurScale === void 0) return;
17209
- setFormattedValue(truncatedStr);
17210
- },
17211
- [enabled, blurScale]
17212
- );
17213
- const resetEditing = React__namespace.useCallback(() => {
17214
- isUserEditingRef.current = false;
17215
- }, []);
17216
- return { formattedValue, blurScale, onEdit, onBlur, resetEditing, setFormattedValue };
17217
- }
17218
17171
  function useStepper({ value, step, min, max, disabled, onStep }) {
17219
- const [changed, setChanged] = React__namespace.useState(false);
17220
17172
  const changeValue = React__namespace.useCallback(
17221
17173
  (delta) => {
17222
17174
  const current = value ?? 0;
17223
17175
  const clamped = clamp(current + delta, min, max);
17224
- setChanged(true);
17225
17176
  onStep(clamped);
17226
17177
  },
17227
17178
  [value, max, min, onStep]
@@ -17230,7 +17181,7 @@ function useStepper({ value, step, min, max, disabled, onStep }) {
17230
17181
  const decrement = React__namespace.useCallback(() => changeValue(-step), [changeValue, step]);
17231
17182
  const isIncrementDisabled = disabled || max !== void 0 && (value ?? 0) >= max;
17232
17183
  const isDecrementDisabled = disabled || min !== void 0 && (value ?? 0) <= min;
17233
- return { changed, increment, decrement, isIncrementDisabled, isDecrementDisabled };
17184
+ return { increment, decrement, isIncrementDisabled, isDecrementDisabled };
17234
17185
  }
17235
17186
  var InputNumber = ({
17236
17187
  customInputProps,
@@ -17254,26 +17205,37 @@ var InputNumber = ({
17254
17205
  ...props
17255
17206
  }) => {
17256
17207
  const blurFormatEnabled = fillDecimalOnBlur || truncateDecimalOnBlur;
17257
- const [internalValue, setInternalValue] = React__namespace.useState(
17208
+ const blurScale = blurFormatEnabled ? decimalScaleProp ?? 2 : void 0;
17209
+ const [displayOverride, setDisplayOverride] = React__namespace.useState(() => {
17210
+ if (!blurFormatEnabled) return void 0;
17211
+ const scale = decimalScaleProp ?? 2;
17212
+ const initial = parseToNumber(value) ?? parseToNumber(defaultValue);
17213
+ if (initial !== void 0) return truncateToFixed(initial, scale);
17214
+ return void 0;
17215
+ });
17216
+ const [numericValue, setNumericValue] = React__namespace.useState(
17258
17217
  () => parseToNumber(value) ?? parseToNumber(defaultValue)
17259
17218
  );
17260
- const internalValueRef = React__namespace.useRef(internalValue);
17261
- const rawValueRef = React__namespace.useRef("");
17262
- const isBlurClampedRef = React__namespace.useRef(false);
17263
- React__namespace.useEffect(() => {
17264
- const parsed = parseToNumber(value);
17265
- if (parsed !== void 0) {
17266
- internalValueRef.current = parsed;
17267
- setInternalValue(parsed);
17268
- }
17269
- isBlurClampedRef.current = false;
17270
- }, [value]);
17271
- const autoFormat = useFillDecimalOnBlur({
17272
- enabled: blurFormatEnabled,
17273
- decimalScale: decimalScaleProp,
17274
- value,
17275
- defaultValue
17276
- });
17219
+ const isEditingRef = React__namespace.useRef(false);
17220
+ const rawRef = React__namespace.useRef("");
17221
+ const prevValueRef = React__namespace.useRef(value);
17222
+ if (value !== prevValueRef.current) {
17223
+ prevValueRef.current = value;
17224
+ if (value === "" || value === null) {
17225
+ if (displayOverride !== void 0) setDisplayOverride(void 0);
17226
+ if (numericValue !== void 0) setNumericValue(void 0);
17227
+ isEditingRef.current = false;
17228
+ } else if (!isEditingRef.current) {
17229
+ const num = parseToNumber(value);
17230
+ if (num !== numericValue) setNumericValue(num);
17231
+ if (blurFormatEnabled && num !== void 0) {
17232
+ const formatted = truncateToFixed(num, blurScale);
17233
+ if (formatted !== displayOverride) setDisplayOverride(formatted);
17234
+ } else {
17235
+ if (displayOverride !== void 0) setDisplayOverride(void 0);
17236
+ }
17237
+ }
17238
+ }
17277
17239
  const isAllowed = React__namespace.useMemo(() => {
17278
17240
  if (maxIntegerDigits === void 0 && !isAllowedProp) return void 0;
17279
17241
  return (values) => {
@@ -17286,80 +17248,73 @@ var InputNumber = ({
17286
17248
  return isAllowedProp ? isAllowedProp(values) : true;
17287
17249
  };
17288
17250
  }, [maxIntegerDigits, isAllowedProp]);
17289
- const notifyChange = React__namespace.useCallback(
17290
- (newValue, event) => {
17291
- internalValueRef.current = newValue;
17292
- setInternalValue(newValue);
17293
- onStepChange?.(newValue);
17294
- onValueChange?.(
17295
- { floatValue: newValue, formattedValue: String(newValue), value: String(newValue) },
17296
- createSourceInfo(event)
17297
- );
17298
- },
17299
- [onStepChange, onValueChange]
17300
- );
17301
17251
  const stepper = useStepper({
17302
- value: internalValue,
17252
+ value: numericValue,
17303
17253
  step,
17304
17254
  min,
17305
17255
  max,
17306
17256
  disabled,
17307
17257
  onStep: React__namespace.useCallback(
17308
17258
  (clamped) => {
17309
- setInternalValue(clamped);
17310
- if (autoFormat.blurScale !== void 0) {
17311
- autoFormat.setFormattedValue(truncateToFixed(clamped, autoFormat.blurScale));
17312
- }
17313
- notifyChange(clamped);
17259
+ setNumericValue(clamped);
17260
+ const formatted = blurScale !== void 0 ? truncateToFixed(clamped, blurScale) : String(clamped);
17261
+ setDisplayOverride(formatted);
17262
+ rawRef.current = String(clamped);
17263
+ onStepChange?.(clamped);
17264
+ onValueChange?.(
17265
+ { floatValue: clamped, formattedValue: formatted, value: String(clamped) },
17266
+ createSourceInfo()
17267
+ );
17314
17268
  },
17315
- [autoFormat, notifyChange]
17269
+ [blurScale, onStepChange, onValueChange]
17316
17270
  )
17317
17271
  });
17318
17272
  const handleValueChange = React__namespace.useCallback(
17319
17273
  (values, sourceInfo) => {
17320
- internalValueRef.current = values.floatValue;
17321
- rawValueRef.current = values.value;
17322
- setInternalValue(values.floatValue);
17323
17274
  if (sourceInfo.source === "event") {
17324
- isBlurClampedRef.current = false;
17275
+ isEditingRef.current = true;
17276
+ setDisplayOverride(values.value);
17325
17277
  }
17278
+ setNumericValue(values.floatValue);
17279
+ rawRef.current = values.value;
17326
17280
  onValueChange?.(values, sourceInfo);
17327
17281
  if (values.floatValue !== void 0) onStepChange?.(values.floatValue);
17328
- autoFormat.onEdit(values, sourceInfo);
17329
17282
  },
17330
- [onValueChange, onStepChange, autoFormat]
17283
+ [onValueChange, onStepChange]
17331
17284
  );
17332
17285
  const handleBlur = React__namespace.useCallback(
17333
17286
  (event) => {
17287
+ isEditingRef.current = false;
17334
17288
  onBlur?.(event);
17335
- const latestValue = internalValueRef.current;
17336
- if (latestValue === void 0) {
17337
- autoFormat.resetEditing();
17289
+ const currentNumeric = numericValue;
17290
+ if (currentNumeric === void 0) {
17291
+ setDisplayOverride("");
17338
17292
  return;
17339
17293
  }
17340
- const clamped = clamp(latestValue, min, max);
17341
- const wasClamped = clamped !== latestValue;
17294
+ const clamped = clamp(currentNumeric, min, max);
17295
+ const wasClamped = clamped !== currentNumeric;
17342
17296
  if (wasClamped) {
17343
- isBlurClampedRef.current = true;
17344
- internalValueRef.current = clamped;
17345
- rawValueRef.current = String(clamped);
17346
- setInternalValue(clamped);
17297
+ setNumericValue(clamped);
17298
+ rawRef.current = String(clamped);
17347
17299
  onValueChange?.(
17348
17300
  { floatValue: clamped, formattedValue: String(clamped), value: String(clamped) },
17349
17301
  createSourceInfo()
17350
17302
  );
17351
17303
  onStepChange?.(clamped);
17352
17304
  }
17353
- if (blurFormatEnabled && autoFormat.blurScale !== void 0) {
17354
- const rawStr = wasClamped ? String(clamped) : rawValueRef.current || String(clamped);
17355
- autoFormat.onBlur(truncateStringToFixed(rawStr, autoFormat.blurScale));
17305
+ if (blurFormatEnabled && blurScale !== void 0) {
17306
+ const rawStr = wasClamped ? String(clamped) : rawRef.current || String(clamped);
17307
+ setDisplayOverride(truncateStringToFixed(rawStr, blurScale));
17308
+ } else if (wasClamped) {
17309
+ setDisplayOverride(String(clamped));
17356
17310
  } else {
17357
- autoFormat.resetEditing();
17311
+ setDisplayOverride(void 0);
17358
17312
  }
17359
17313
  },
17360
- [onBlur, blurFormatEnabled, autoFormat, min, max, onValueChange, onStepChange]
17314
+ [onBlur, blurFormatEnabled, blurScale, numericValue, min, max, onValueChange, onStepChange]
17361
17315
  );
17362
- const effectiveValue = autoFormat.formattedValue !== void 0 ? autoFormat.formattedValue : isBlurClampedRef.current || stepper.changed || blurFormatEnabled ? internalValue : value;
17316
+ const isValueExplicitlyEmpty = value === "" || value === null;
17317
+ const effectiveValue = isValueExplicitlyEmpty ? "" : displayOverride !== void 0 ? displayOverride : value;
17363
17318
  const buttonClass = cn(
17364
17319
  "flex items-center justify-center h-3 w-5 transition-colors outline-none",
17365
17320
  "text-neutral-400 hover:text-neutral-600 active:text-neutral-900",
@@ -17375,7 +17330,7 @@ var InputNumber = ({
17375
17330
  onBlur: handleBlur,
17376
17331
  ...isAllowed && { isAllowed },
17377
17332
  ...truncateDecimalOnBlur ? {} : fillDecimalOnBlur ? { decimalScale: decimalScaleProp } : { decimalScale: decimalScaleProp, fixedDecimalScale: fixedDecimalScaleProp },
17378
- ...autoFormat.formattedValue !== void 0 && { valueIsNumericString: true },
17333
+ ...displayOverride !== void 0 && { valueIsNumericString: true },
17379
17334
  ...props,
17380
17335
  disabled,
17381
17336
  invalid,