@povio/ui 2.2.9-rc.22 → 2.2.9-rc.23

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.
@@ -618,14 +618,6 @@ var DateRangePicker = ({ fullIso = true, minValue, maxValue, renderStaticInput,
618
618
  const showDropdown = !props.disableDropdown || disableManualEntry;
619
619
  const defaultDatePlaceholder = DateTimeUtils.getDatePlaceholder(locale, { shouldForceLeadingZeros });
620
620
  const hasProvidedRangeValue = !!(rawValue?.start || rawValue?.end);
621
- const staticPlaceholder = props.placeholder ?? /* @__PURE__ */ jsxs(Fragment, { children: [
622
- /* @__PURE__ */ jsx("span", { children: defaultDatePlaceholder }),
623
- /* @__PURE__ */ jsx("span", {
624
- className: "pointer-events-none select-none",
625
- children: "–"
626
- }),
627
- /* @__PURE__ */ jsx("span", { children: defaultDatePlaceholder })
628
- ] });
629
621
  const formatStaticDate = (value) => {
630
622
  if (!value) return "";
631
623
  const parsedDate = parseCalendarDate(value);
@@ -634,15 +626,20 @@ var DateRangePicker = ({ fullIso = true, minValue, maxValue, renderStaticInput,
634
626
  };
635
627
  const start = formatStaticDate(rawValue?.start ?? null);
636
628
  const end = formatStaticDate(rawValue?.end ?? null);
637
- const hasRangeValue = !!(start && end);
638
- const displayValue = hasRangeValue ? /* @__PURE__ */ jsxs(Fragment, { children: [
639
- /* @__PURE__ */ jsx("span", { children: start }),
629
+ const displayValue = /* @__PURE__ */ jsxs(Fragment, { children: [
630
+ /* @__PURE__ */ jsx("span", {
631
+ className: rawValue?.start ? "" : "text-text-default-3",
632
+ children: rawValue?.start ? start : defaultDatePlaceholder
633
+ }),
640
634
  /* @__PURE__ */ jsx("span", {
641
635
  className: "pointer-events-none select-none",
642
636
  children: "–"
643
637
  }),
644
- /* @__PURE__ */ jsx("span", { children: end })
645
- ] }) : void 0;
638
+ /* @__PURE__ */ jsx("span", {
639
+ className: rawValue?.end ? "" : "text-text-default-3",
640
+ children: rawValue?.end ? end : defaultDatePlaceholder
641
+ })
642
+ ] });
646
643
  return /* @__PURE__ */ jsx(StaticInput, {
647
644
  ...props,
648
645
  onInteract: (focus) => {
@@ -657,18 +654,16 @@ var DateRangePicker = ({ fullIso = true, minValue, maxValue, renderStaticInput,
657
654
  hideLabel,
658
655
  isHeaderHidden,
659
656
  isDisabled,
660
- placeholder: staticPlaceholder,
661
657
  displayValue,
662
- isEmpty: !hasProvidedRangeValue,
663
658
  dataAttributes: {
664
- dataIsEmpty: !hasRangeValue,
665
- dataIsFilled: hasRangeValue,
659
+ dataIsEmpty: !hasProvidedRangeValue,
660
+ dataIsFilled: hasProvidedRangeValue,
666
661
  dataIsDirty: props.isDirty,
667
662
  dataIsRequired: props.isRequired,
668
663
  dataIsDisabled: isDisabled,
669
664
  dataDisabled: isDisabled,
670
665
  dataInvalid: !!props.error,
671
- dataHasSelection: hasRangeValue
666
+ dataHasSelection: hasProvidedRangeValue
672
667
  },
673
668
  contentRowClassName: datePickerInputContentRowCva({ size }),
674
669
  leadingContent: renderDatePickerTodayIcon(todayIcon, todayIconButtonSize),
@@ -6,6 +6,7 @@ import { FormField } from "../../FormField/FormField.js";
6
6
  import { StaticInput } from "../../shared/StaticInput.js";
7
7
  import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
8
8
  import { InputContent } from "../shared/InputContent.js";
9
+ import { getStaticNumberDisplayValue } from "../shared/numberStatic.utils.js";
9
10
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
10
11
  import { clsx } from "clsx";
11
12
  import { isValidElement, useCallback, useEffect, useRef, useState } from "react";
@@ -145,7 +146,7 @@ var NumberInput = ({ renderStaticInput, ...props }) => {
145
146
  if (!renderInput) {
146
147
  const staticValue = watchedValue ?? props.value ?? props.defaultValue;
147
148
  const formatOptions = props.formatOptions ?? ui.numberInput.formatOptions;
148
- const displayValue = staticValue == null ? "" : new Intl.NumberFormat(locale, formatOptions).format(staticValue);
149
+ const displayValue = getStaticNumberDisplayValue(staticValue, new Intl.NumberFormat(locale, formatOptions)) ?? "";
149
150
  const hasValue = displayValue !== "";
150
151
  const as = props.as ?? ui.input.as;
151
152
  const size = props.size ?? ui.input.size;
@@ -181,8 +182,8 @@ var NumberInput = ({ renderStaticInput, ...props }) => {
181
182
  displayValue,
182
183
  isEmpty: !hasValue,
183
184
  dataAttributes: {
184
- dataIsEmpty: !staticValue,
185
- dataIsFilled: !(`${staticValue}` === "" || staticValue === null || staticValue === void 0),
185
+ dataIsEmpty: !hasValue,
186
+ dataIsFilled: hasValue,
186
187
  dataIsDirty: props.isDirty,
187
188
  dataIsRequired: props.isRequired,
188
189
  dataIsDisabled: props.isDisabled,
@@ -6,6 +6,7 @@ import { inputBase, inputSize } from "../../shared/input.cva.js";
6
6
  import { FormField } from "../../FormField/FormField.js";
7
7
  import { StaticInput } from "../../shared/StaticInput.js";
8
8
  import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
9
+ import { getStaticNumberDisplayValue } from "../shared/numberStatic.utils.js";
9
10
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
10
11
  import { clsx } from "clsx";
11
12
  import { useEffect, useRef, useState } from "react";
@@ -234,13 +235,13 @@ var NumberRangeInput = ({ renderStaticInput, ...props }) => {
234
235
  const staticValue = normalizeRangeValue(watchedValue, props.minValue, props.maxValue);
235
236
  const formatOptions = props.formatOptions ?? ui.numberInput.formatOptions;
236
237
  const formatter = new Intl.NumberFormat(locale, formatOptions);
237
- const minDisplay = staticValue.min == null ? null : formatter.format(staticValue.min);
238
- const maxDisplay = staticValue.max == null ? null : formatter.format(staticValue.max);
239
- const hasValue = minDisplay !== "" || maxDisplay !== "";
238
+ const minDisplay = getStaticNumberDisplayValue(staticValue.min, formatter);
239
+ const maxDisplay = getStaticNumberDisplayValue(staticValue.max, formatter);
240
+ const hasValue = minDisplay !== null || maxDisplay !== null;
240
241
  const displayValue = /* @__PURE__ */ jsxs(Fragment, { children: [
241
242
  /* @__PURE__ */ jsx("span", {
242
243
  className: clsx("w-full bg-transparent outline-none", minDisplay ? props.minInputClassName : "text-text-default-3"),
243
- children: minDisplay ?? props.minPlaceholder
244
+ children: minDisplay ?? props.minPlaceholder ?? "Min"
244
245
  }),
245
246
  /* @__PURE__ */ jsx("span", {
246
247
  className: "pointer-events-none shrink-0 select-none text-label-2 text-text-default-3",
@@ -248,7 +249,7 @@ var NumberRangeInput = ({ renderStaticInput, ...props }) => {
248
249
  }),
249
250
  /* @__PURE__ */ jsx("span", {
250
251
  className: clsx("w-full bg-transparent outline-none", maxDisplay ? props.maxInputClassName : "text-text-default-3"),
251
- children: maxDisplay ?? props.maxPlaceholder
252
+ children: maxDisplay ?? props.maxPlaceholder ?? "Max"
252
253
  })
253
254
  ] });
254
255
  const rangeError = staticValue.min !== null && staticValue.max !== null && staticValue.min > staticValue.max ? props.invalidRangeError ?? "Minimum cannot be greater than maximum" : void 0;
@@ -0,0 +1 @@
1
+ export declare const getStaticNumberDisplayValue: (value: unknown, formatter: Intl.NumberFormat) => string | null;
@@ -0,0 +1,7 @@
1
+ //#region src/components/inputs/Input/shared/numberStatic.utils.ts
2
+ var getStaticNumberDisplayValue = (value, formatter) => {
3
+ if (typeof value !== "number" || !Number.isFinite(value)) return null;
4
+ return formatter.format(value);
5
+ };
6
+ //#endregion
7
+ export { getStaticNumberDisplayValue };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@povio/ui",
3
- "version": "2.2.9-rc.22",
3
+ "version": "2.2.9-rc.23",
4
4
  "type": "module",
5
5
  "module": "dist/index.js",
6
6
  "types": "dist/index.d.ts",