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

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.
@@ -185,8 +185,8 @@ var NumberInput = ({ renderStaticInput, ...props }) => {
185
185
  dataIsFilled: !(`${staticValue}` === "" || staticValue === null || staticValue === void 0),
186
186
  dataIsDirty: props.isDirty,
187
187
  dataIsRequired: props.isRequired,
188
- dataIsDisabled: isDisabled,
189
- dataDisabled: isDisabled,
188
+ dataIsDisabled: props.isDisabled,
189
+ dataDisabled: props.isDisabled,
190
190
  dataInvalid: !!props.error,
191
191
  dataHasSelection: hasValue
192
192
  },
@@ -257,6 +257,7 @@ var NumberRangeInput = ({ renderStaticInput, ...props }) => {
257
257
  const size = props.size ?? ui.input.size;
258
258
  const variant = props.variant ?? ui.input.variant;
259
259
  const hideLabel = props.hideLabel ?? ui.input.hideLabel;
260
+ const isClearable = props.isClearable ?? ui.input.isClearable;
260
261
  const isHeaderHidden = props.isHeaderHidden || as === "inline" || as === "filter" || as === "floating";
261
262
  let isDisabled = !!props.isDisabled;
262
263
  if (isFormControlDisabled) isDisabled = true;
@@ -276,10 +277,8 @@ var NumberRangeInput = ({ renderStaticInput, ...props }) => {
276
277
  className: clsx("group w-full", as === "inline" && "h-full", props.className),
277
278
  inputClassName: props.inputClassName,
278
279
  displayValue,
279
- trailingContent: /* @__PURE__ */ jsx(InputClear, {
280
- show: !hasValue && !props.isDisabled && props.isClearable,
281
- onClear: () => {}
282
- }),
280
+ isEmpty: !hasValue,
281
+ hasClearIcon: !props.isDisabled && isClearable,
283
282
  dataAttributes: {
284
283
  dataIsEmpty: !hasValue,
285
284
  dataIsFilled: hasValue,
@@ -53,6 +53,7 @@ function Select({ renderStaticInput, ...props }) {
53
53
  const as = props.as ?? ui.input.as;
54
54
  let isDisabled = !!props.isDisabled;
55
55
  if (isFormControlDisabled) isDisabled = true;
56
+ const isClearable = props.isClearable ?? ui.input.isClearable;
56
57
  const mode = props.selectionMode ?? ui.select.selectionMode;
57
58
  const { displayValue, isEmpty } = getStaticSelectValue({
58
59
  items: props.items,
@@ -97,6 +98,7 @@ function Select({ renderStaticInput, ...props }) {
97
98
  dataHasSearch: false
98
99
  },
99
100
  leadingContent: props.leadingContent,
101
+ hasClearIcon: isClearable,
100
102
  trailingContent
101
103
  });
102
104
  }
@@ -27,7 +27,10 @@ var getStaticSelectValue = ({ items, value, selectionMode, initialSelection, map
27
27
  return {
28
28
  selectedItem,
29
29
  selectedItems,
30
- displayValue: selectedItem != null ? showSelectionContent && selectedItem.content ? selectedItem.content : selectedItem.label : "",
30
+ displayValue: selectedItem != null ? showSelectionContent && selectedItem.content ? selectedItem.content : /* @__PURE__ */ jsx("div", {
31
+ className: "min-w-0 flex-1 truncate",
32
+ children: selectedItem.label
33
+ }) : "",
31
34
  isEmpty: selectedItem == null
32
35
  };
33
36
  };
@@ -28,10 +28,11 @@ interface StaticInputProps extends FormFieldProps {
28
28
  leadingVisual?: ReactNode;
29
29
  leadingContent?: ReactNode;
30
30
  leadingContentClassName?: string;
31
+ hasClearIcon?: boolean;
31
32
  trailingContent?: ReactNode;
32
33
  contentRowClassName?: string;
33
34
  inputClassName?: string;
34
35
  dataAttributes?: StaticInputDataAttributes;
35
36
  }
36
- export declare const StaticInput: ({ onInteract, as, typographySize, size, variant, applyMinInputWidth, placeholder, showPlacholderIfFilled, displayValue, isEmpty, leadingVisual, leadingContent, leadingContentClassName, trailingContent, contentRowClassName, inputClassName, dataAttributes, className, ...formFieldProps }: StaticInputProps) => import("react/jsx-runtime").JSX.Element;
37
+ export declare const StaticInput: ({ onInteract, as, typographySize, size, variant, applyMinInputWidth, placeholder, showPlacholderIfFilled, displayValue, isEmpty, leadingVisual, leadingContent, leadingContentClassName, hasClearIcon, trailingContent, contentRowClassName, inputClassName, dataAttributes, className, ...formFieldProps }: StaticInputProps) => import("react/jsx-runtime").JSX.Element;
37
38
  export {};
@@ -6,7 +6,7 @@ import { FormField } from "../FormField/FormField.js";
6
6
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
7
7
  import { clsx } from "clsx";
8
8
  //#region src/components/inputs/shared/StaticInput.tsx
9
- var StaticInput = ({ onInteract, as, typographySize, size, variant, applyMinInputWidth, placeholder, showPlacholderIfFilled = false, displayValue, isEmpty, leadingVisual, leadingContent, leadingContentClassName, trailingContent, contentRowClassName, inputClassName, dataAttributes, className, ...formFieldProps }) => {
9
+ var StaticInput = ({ onInteract, as, typographySize, size, variant, applyMinInputWidth, placeholder, showPlacholderIfFilled = false, displayValue, isEmpty, leadingVisual, leadingContent, leadingContentClassName, hasClearIcon, trailingContent, contentRowClassName, inputClassName, dataAttributes, className, ...formFieldProps }) => {
10
10
  const inputBaseCva = UIStyle.useCva("input.baseCva", inputBase);
11
11
  const inputSizeCva = UIStyle.useCva("input.sizeCva", inputSize);
12
12
  const typographyCva = UIStyle.useCva("typography.cva", typography);
@@ -48,42 +48,55 @@ var StaticInput = ({ onInteract, as, typographySize, size, variant, applyMinInpu
48
48
  className: clsx("group/static-input group/input-content group/select-content relative flex items-center gap-input-gap-input-text-to-elements", applyMinInputWidth && "min-w-input-width-min-width", inputBaseCva({
49
49
  as,
50
50
  variant
51
- }), !hasValue && "text-text-default-3", inputClassName),
52
- children: [/* @__PURE__ */ jsxs("div", {
53
- className: clsx("group/input-content flex w-full items-center gap-input-gap-input-text-to-elements pr-0!", inputSizeCva({
54
- size,
55
- as
56
- }), typographySize && typographyCva({ size: typographySize }), contentRowClassName),
57
- children: [
58
- leadingVisual && /* @__PURE__ */ jsx("div", {
59
- className: "pointer-events-none shrink-0",
60
- children: leadingVisual
61
- }),
62
- as && ["filter", "floating"].includes(as) && /* @__PURE__ */ jsx(FormFieldLabel, {
63
- as,
51
+ }), inputClassName),
52
+ children: [
53
+ /* @__PURE__ */ jsxs("div", {
54
+ className: clsx("group/input-content flex min-w-0 w-full items-center gap-input-gap-input-text-to-elements pr-0!", inputSizeCva({
64
55
  size,
65
- label: formFieldProps.label,
66
- isRequired: formFieldProps.isRequired,
67
- isDisabled: formFieldProps.isDisabled
68
- }),
69
- leadingContent && /* @__PURE__ */ jsx("div", {
70
- className: clsx("ml-input-side-default flex shrink-0 items-center", leadingContentClassName),
71
- children: leadingContent
72
- }),
73
- staticDisplayContent,
74
- shouldRenderFloatingLineSpacer && /* @__PURE__ */ jsx(Fragment, { children: "\xA0" }),
75
- shouldRenderPlaceholderAfterValue && /* @__PURE__ */ jsx("div", {
76
- className: "text-text-default-3",
77
- children: placeholder
78
- })
79
- ]
80
- }), trailingContent && /* @__PURE__ */ jsx("div", {
81
- className: clsx(inputSizeCva({
82
- size,
83
- as
84
- }), "pointer-events-none flex items-center gap-input-gap-trailing-elements py-0! pl-0!"),
85
- children: trailingContent
86
- })]
56
+ as
57
+ }), typographySize && typographyCva({ size: typographySize }), contentRowClassName),
58
+ children: [
59
+ leadingVisual && /* @__PURE__ */ jsx("div", {
60
+ className: "pointer-events-none shrink-0",
61
+ children: leadingVisual
62
+ }),
63
+ as && ["filter", "floating"].includes(as) && /* @__PURE__ */ jsx(FormFieldLabel, {
64
+ as,
65
+ size,
66
+ label: formFieldProps.label,
67
+ isRequired: formFieldProps.isRequired,
68
+ isDisabled: formFieldProps.isDisabled
69
+ }),
70
+ leadingContent && /* @__PURE__ */ jsx("div", {
71
+ className: clsx("ml-input-side-default flex shrink-0 items-center", leadingContentClassName),
72
+ children: leadingContent
73
+ }),
74
+ !hasValue ? /* @__PURE__ */ jsx("div", {
75
+ className: "text-text-default-3",
76
+ children: staticDisplayContent
77
+ }) : staticDisplayContent,
78
+ shouldRenderFloatingLineSpacer && /* @__PURE__ */ jsx(Fragment, { children: "\xA0" }),
79
+ shouldRenderPlaceholderAfterValue && /* @__PURE__ */ jsx("div", {
80
+ className: "shrink-0 text-text-default-3",
81
+ children: placeholder
82
+ })
83
+ ]
84
+ }),
85
+ hasClearIcon && /* @__PURE__ */ jsx("div", {
86
+ className: clsx("flex items-center gap-input-gap-trailing-elements py-0! pl-0!", inputSizeCva({
87
+ size,
88
+ as
89
+ })),
90
+ children: /* @__PURE__ */ jsx("div", { className: "size-6 shrink-0" })
91
+ }),
92
+ trailingContent && /* @__PURE__ */ jsx("div", {
93
+ className: clsx(inputSizeCva({
94
+ size,
95
+ as
96
+ }), "pointer-events-none flex items-center gap-input-gap-trailing-elements py-0! pl-0!"),
97
+ children: trailingContent
98
+ })
99
+ ]
87
100
  })
88
101
  });
89
102
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@povio/ui",
3
- "version": "2.2.9-rc.21",
3
+ "version": "2.2.9-rc.22",
4
4
  "type": "module",
5
5
  "module": "dist/index.js",
6
6
  "types": "dist/index.d.ts",