@povio/ui 2.2.9-rc.18 → 2.2.9-rc.19

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.
Files changed (6) hide show
  1. package/dist/components/inputs/Selection/Autocomplete/Autocomplete.js +13 -13
  2. package/dist/components/inputs/Selection/Select/Select.js +14 -13
  3. package/dist/components/inputs/Selection/shared/staticSelect.utils.d.ts +21 -0
  4. package/dist/components/inputs/Selection/shared/staticSelect.utils.js +28 -0
  5. package/dist/utils/date-time.utils.js +2 -2
  6. package/package.json +1 -1
package/dist/components/inputs/Selection/Autocomplete/Autocomplete.js CHANGED
@@ -2,9 +2,10 @@ import { ArrowDropDownIcon } from "../../../../assets/icons/ArrowDropDown.js";
2
2
  import { UIConfig } from "../../../../config/uiConfig.context.js";
3
3
  import { StaticInput } from "../../shared/StaticInput.js";
4
4
  import { SelectBase } from "../shared/SelectBase.js";
5
+ import { getStaticSelectValue } from "../shared/staticSelect.utils.js";
5
6
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
6
7
  import { clsx } from "clsx";
7
- import { isValidElement, useEffect, useRef, useState } from "react";
8
+ import { useEffect, useRef, useState } from "react";
8
9
  import { mergeRefs } from "@react-aria/utils";
9
10
  import { Controller, useWatch } from "react-hook-form";
10
11
  //#region src/components/inputs/Selection/Autocomplete/Autocomplete.tsx
@@ -53,20 +54,19 @@ function Autocomplete({ renderStaticInput, ...props }) {
53
54
  setShouldFocus(false);
54
55
  }, [renderInput, shouldFocus]);
55
56
  if (!renderInput) {
56
- const getItemLabel = (id) => {
57
- const item = props.items.find((innerItem) => innerItem.id === id);
58
- if (!item) return "";
59
- if (props.showSelectionContent && item.content) return isValidElement(item.content) ? item.label : item.content;
60
- return item.label;
61
- };
62
- const mode = props.selectionMode ?? ui.select.selectionMode;
63
- let displayValue = "";
64
- if (mode === "multiple") {
65
- if (Array.isArray(currentValue) && currentValue.length > 0) displayValue = /* @__PURE__ */ jsx(Fragment, { children: currentValue.map((id) => getItemLabel(id)).filter(Boolean).map((item, index) => /* @__PURE__ */ jsxs("span", { children: [item, index < currentValue.length - 1 && ","] }, `${index}`)) });
66
- } else if (currentValue != null) displayValue = getItemLabel(currentValue);
67
57
  const as = props.as ?? ui.input.as;
68
58
  let isDisabled = !!props.isDisabled;
69
59
  if (isFormControlDisabled) isDisabled = true;
60
+ const mode = props.selectionMode ?? ui.select.selectionMode;
61
+ const { displayValue, isEmpty } = getStaticSelectValue({
62
+ items: props.items,
63
+ value: currentValue,
64
+ selectionMode: mode,
65
+ showSelectionContent: props.showSelectionContent,
66
+ isDisabled,
67
+ collapseAfter: props.collapseAfter ?? ui.select.collapseAfter,
68
+ selectedTagsType: props.selectedTagsType ?? ui.select.selectedTagsType
69
+ });
70
70
  const trailingContent = props.trailingContent || !props.hideDropdownIcon ? /* @__PURE__ */ jsxs(Fragment, { children: [props.trailingContent, !props.hideDropdownIcon ? /* @__PURE__ */ jsx(ArrowDropDownIcon, { className: "size-6 shrink-0 text-interactive-text-secondary-idle" }) : void 0] }) : void 0;
71
71
  return /* @__PURE__ */ jsx(StaticInput, {
72
72
  ...props,
@@ -84,7 +84,7 @@ function Autocomplete({ renderStaticInput, ...props }) {
84
84
  inputClassName: clsx(props.className, props.inputClassName),
85
85
  placeholder: as === "floating" ? "" : props.placeholder,
86
86
  displayValue,
87
- isEmpty: !displayValue,
87
+ isEmpty,
88
88
  leadingContent: props.leadingContent,
89
89
  trailingContent
90
90
  });
package/dist/components/inputs/Selection/Select/Select.js CHANGED
@@ -2,9 +2,10 @@ import { ArrowDropDownIcon } from "../../../../assets/icons/ArrowDropDown.js";
2
2
  import { UIConfig } from "../../../../config/uiConfig.context.js";
3
3
  import { StaticInput } from "../../shared/StaticInput.js";
4
4
  import { SelectBase } from "../shared/SelectBase.js";
5
+ import { getStaticSelectValue } from "../shared/staticSelect.utils.js";
5
6
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
6
7
  import { clsx } from "clsx";
7
- import { isValidElement, useEffect, useRef, useState } from "react";
8
+ import { useEffect, useRef, useState } from "react";
8
9
  import { mergeRefs } from "@react-aria/utils";
9
10
  import { Controller, useWatch } from "react-hook-form";
10
11
  //#region src/components/inputs/Selection/Select/Select.tsx
@@ -49,20 +50,19 @@ function Select({ renderStaticInput, ...props }) {
49
50
  setShouldFocus(false);
50
51
  }, [renderInput, shouldFocus]);
51
52
  if (!renderInput) {
52
- const getItemLabel = (id) => {
53
- const item = props.items.find((innerItem) => innerItem.id === id);
54
- if (!item) return "";
55
- if (props.showSelectionContent && item.content) return isValidElement(item.content) ? item.label : item.content;
56
- return item.label;
57
- };
58
- const mode = props.selectionMode ?? ui.select.selectionMode;
59
- let displayValue = "";
60
- if (mode === "multiple") {
61
- if (Array.isArray(currentValue) && currentValue.length > 0) displayValue = /* @__PURE__ */ jsx(Fragment, { children: currentValue.map((id) => getItemLabel(id)).filter(Boolean).map((item, index) => /* @__PURE__ */ jsxs("span", { children: [item, index < currentValue.length - 1 && ","] }, `${index}`)) });
62
- } else if (currentValue != null) displayValue = getItemLabel(currentValue);
63
53
  const as = props.as ?? ui.input.as;
64
54
  let isDisabled = !!props.isDisabled;
65
55
  if (isFormControlDisabled) isDisabled = true;
56
+ const mode = props.selectionMode ?? ui.select.selectionMode;
57
+ const { displayValue, isEmpty } = getStaticSelectValue({
58
+ items: props.items,
59
+ value: currentValue,
60
+ selectionMode: mode,
61
+ showSelectionContent: props.showSelectionContent,
62
+ isDisabled,
63
+ collapseAfter: props.collapseAfter ?? ui.select.collapseAfter,
64
+ selectedTagsType: props.selectedTagsType ?? ui.select.selectedTagsType
65
+ });
66
66
  const trailingContent = props.trailingContent || !props.hideDropdownIcon ? /* @__PURE__ */ jsxs(Fragment, { children: [props.trailingContent, !props.hideDropdownIcon ? /* @__PURE__ */ jsx(ArrowDropDownIcon, { className: `size-6 shrink-0 ${isDisabled ? "text-interactive-text-secondary-disabled" : "text-interactive-text-secondary-idle"}` }) : void 0] }) : void 0;
67
67
  return /* @__PURE__ */ jsx(StaticInput, {
68
68
  ...props,
@@ -73,13 +73,14 @@ function Select({ renderStaticInput, ...props }) {
73
73
  as,
74
74
  size: props.size ?? ui.input.size,
75
75
  variant: props.variant ?? ui.input.variant,
76
+ isHeaderHidden: props.isHeaderHidden || as === "inline" || as === "filter" || as === "floating",
76
77
  hideLabel: props.hideLabel ?? ui.input.hideLabel,
77
78
  isDisabled,
78
79
  className: clsx("w-full", props.containerClassName),
79
80
  inputClassName: clsx(props.className, props.inputClassName),
80
81
  placeholder: as === "floating" ? "" : props.placeholder,
81
82
  displayValue,
82
- isEmpty: !displayValue,
83
+ isEmpty,
83
84
  leadingContent: props.leadingContent,
84
85
  trailingContent
85
86
  });
package/dist/components/inputs/Selection/shared/staticSelect.utils.d.ts ADDED
@@ -0,0 +1,21 @@
1
+ import { ReactNode } from 'react';
2
+ import { Key } from 'react-aria-components';
3
+ import { SelectBaseProps } from './SelectBase';
4
+ import { SelectItem } from './select.types';
5
+ interface GetStaticSelectValueOptions<TKey extends Key = Key> {
6
+ items: SelectItem<TKey>[];
7
+ value: TKey | TKey[] | null | undefined;
8
+ selectionMode: SelectBaseProps<TKey>["selectionMode"];
9
+ showSelectionContent?: boolean;
10
+ isDisabled?: boolean;
11
+ collapseAfter?: SelectBaseProps<TKey>["collapseAfter"];
12
+ selectedTagsType?: SelectBaseProps<TKey>["selectedTagsType"];
13
+ }
14
+ interface StaticSelectValueResult<TKey extends Key = Key> {
15
+ selectedItem: SelectItem<TKey> | null;
16
+ selectedItems: SelectItem<TKey>[];
17
+ displayValue: ReactNode;
18
+ isEmpty: boolean;
19
+ }
20
+ export declare const getStaticSelectValue: <TKey extends Key = Key>({ items, value, selectionMode, showSelectionContent, isDisabled, collapseAfter, selectedTagsType, }: GetStaticSelectValueOptions<TKey>) => StaticSelectValueResult<TKey>;
21
+ export {};
package/dist/components/inputs/Selection/shared/staticSelect.utils.js ADDED
@@ -0,0 +1,28 @@
1
+ import { SelectInputTags } from "./SelectInputTags.js";
2
+ import { jsx } from "react/jsx-runtime";
3
+ //#region src/components/inputs/Selection/shared/staticSelect.utils.tsx
4
+ var getStaticSelectValue = ({ items, value, selectionMode, showSelectionContent, isDisabled, collapseAfter, selectedTagsType }) => {
5
+ const getItem = (id) => items.find((item) => item.id === id) ?? null;
6
+ const selectedItems = Array.isArray(value) ? value.map((id) => getItem(id)).filter((item) => item != null) : [];
7
+ const selectedItem = !Array.isArray(value) && value != null ? getItem(value) : null;
8
+ if (selectionMode === "multiple") return {
9
+ selectedItem,
10
+ selectedItems,
11
+ displayValue: selectedItems.length > 0 ? /* @__PURE__ */ jsx(SelectInputTags, {
12
+ selectedItems,
13
+ isDisabled,
14
+ collapseAfter,
15
+ selectedTagsType,
16
+ onRemove: () => void 0
17
+ }) : "",
18
+ isEmpty: selectedItems.length === 0
19
+ };
20
+ return {
21
+ selectedItem,
22
+ selectedItems,
23
+ displayValue: selectedItem != null ? showSelectionContent && selectedItem.content ? selectedItem.content : selectedItem.label : "",
24
+ isEmpty: selectedItem == null
25
+ };
26
+ };
27
+ //#endregion
28
+ export { getStaticSelectValue };
package/dist/utils/date-time.utils.js CHANGED
@@ -49,8 +49,8 @@ var DateTimeUtils;
49
49
  case "day": return repeatLocalizedFieldLabel(type, 2, locale);
50
50
  case "month": return repeatLocalizedFieldLabel(type, 2, locale);
51
51
  case "year": return repeatLocalizedFieldLabel(type, 4, locale);
52
- case "hour": return repeatLocalizedFieldLabel(type, 2, locale);
53
- case "minute": return repeatLocalizedFieldLabel(type, 2, locale);
52
+ case "hour": return "hh";
53
+ case "minute": return "mm";
54
54
  default: return null;
55
55
  }
56
56
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@povio/ui",
3
- "version": "2.2.9-rc.18",
3
+ "version": "2.2.9-rc.19",
4
4
  "type": "module",
5
5
  "module": "dist/index.js",
6
6
  "types": "dist/index.d.ts",