@povio/ui 0.0.9 → 0.0.10

package/dist/components/inputs/shared/TooltipWrapper.js

@@ -0,0 +1,21 @@
+import { jsx } from "react/jsx-runtime";
+import { Tooltip } from "../../overlays/Tooltip/Tooltip.js";
+const TooltipWrapper = (props) => {
+  if (props.as !== "inline") {
+    return props.children;
+  }
+  return /* @__PURE__ */ jsx(
+    Tooltip,
+    {
+      text: props.error || void 0,
+      placement: "bottom",
+      color: "error",
+      hidden: !props.error,
+      isNonInteractiveTrigger: true,
+      children: /* @__PURE__ */ jsx("div", { children: props.children })
+    }
+  );
+};
+export {
+  TooltipWrapper
+};

package/dist/components/inputs/shared/label.cva.js

@@ -1,6 +1,6 @@
 import { cva } from "class-variance-authority";
 import { compoundMapper } from "../../../utils/compoundMapper.js";
-const labelBase = cva([], {
+const labelBase = cva("text-text-default-1", {
   variants: {
     as: {
       default: ["flex items-start gap-1"],

package/dist/components/overlays/Tooltip/Tooltip.d.ts

@@ -7,5 +7,6 @@ export interface TooltipProps extends PropsWithChildren<AriaTooltipProps>, Toolt
     delay?: number;
     closeDelay?: number;
     isNonInteractiveTrigger?: boolean;
+    triggerClassName?: string;
 }
-export declare const Tooltip: ({ children, text, isDisabled, delay, closeDelay, color, isNonInteractiveTrigger, ...tooltipProps }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
+export declare const Tooltip: ({ children, text, isDisabled, delay, closeDelay, color, isNonInteractiveTrigger, triggerClassName, ...tooltipProps }: TooltipProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/overlays/Tooltip/Tooltip.js

@@ -6,7 +6,7 @@ import { PointerHorizontalIcon } from "../../../assets/icons/PointerHorizontal.j
 import { PointerVerticalIcon } from "../../../assets/icons/PointerVertical.js";
 import { tooltipCva, tooltipPointerHorizontalCva, tooltipPointerVerticalCva, tooltipTextCva } from "./tooltip.cva.js";
 import { Typography } from "../../text/Typography/Typography.js";
-const CustomTrigger = ({ children }) => {
+const CustomTrigger = ({ children, className }) => {
   const ref = useRef(null);
   const { focusableProps } = useFocusable({}, ref);
   return /* @__PURE__ */ jsx(
@@ -15,6 +15,7 @@ const CustomTrigger = ({ children }) => {
       ref,
       ...focusableProps,
       tabIndex: 0,
+      className,
       children
     }
   );
@@ -27,6 +28,7 @@ const Tooltip = ({
   closeDelay,
   color,
   isNonInteractiveTrigger,
+  triggerClassName,
   ...tooltipProps
 }) => {
   const Trigger = isNonInteractiveTrigger ? CustomTrigger : Fragment;
@@ -37,7 +39,7 @@ const Tooltip = ({
       closeDelay: closeDelay ?? 0,
       isDisabled,
       children: [
-        /* @__PURE__ */ jsx(Trigger, { children }),
+        /* @__PURE__ */ jsx(Trigger, { className: triggerClassName, children }),
         /* @__PURE__ */ jsxs(
           Tooltip$1,
           {

package/dist/components/table/HeaderText.js

@@ -4,7 +4,7 @@ const HeaderText = ({ children }) => /* @__PURE__ */ jsx(
   Typography,
   {
     variant: "default",
-    size: "label-2",
+    size: "label-1",
     as: "span",
     className: "overflow-hidden text-ellipsis px-table-cell-content-side-m py-table-cell-content-height-m text-text-default-1",
     children

package/dist/components/table/table.cva.js

@@ -20,7 +20,9 @@ const tableRow = cva(
 );
 const tableHeadRow = cva(["h-8 w-full"]);
 const tableHeadData = cva(
-  ["border-b border-b-elevation-outline-default-1 border-solid px-table-header-cell-container-side-default text-left"],
+  [
+    "border-b border-b-elevation-outline-default-1 border-solid px-table-header-cell-container-side-default py-table-header-cell-container-height-default text-left"
+  ],
   {
     variants: {
       hasRightBorder: {
@@ -37,11 +39,9 @@ const tableData = cva(
   [
     "relative h-0-5 overflow-hidden text-ellipsis whitespace-nowrap border-t border-t-transparent px-2 py-2",
     "border-b border-b-elevation-outline-default-1",
-    "has-[input[data-invalid]]:border-b-input-outlined-outline-error!",
-    "has-[input]:hover:border-b-input-outlined-outline-hover",
-    "has-[input]:focus:border-b-input-outlined-outline-active",
-    "has-[input]:invalid:border-b-input-outlined-outline-error",
-    "has-[input]:disabled:hover:border-transparent"
+    "has-[*>[data-hovered]:not([data-disabled])]:hover:border-b-input-outlined-outline-hover",
+    "has-[*>[data-invalid]]:border-b-input-outlined-outline-error!",
+    "has-[*>[data-focused]]:border-b-input-outlined-outline-active"
   ],
   {
     variants: {

package/dist/config/uiConfig.context.d.ts

@@ -16,7 +16,7 @@ export declare namespace UIConfig {
         numberInput: Pick<NumberInputProps, "formatOptions">;
         radioGroup: Pick<RadioGroupProps, "variant" | "hideLabel">;
         checkbox: Pick<CheckboxProps, "variant">;
-        select: Pick<SelectBaseProps, "selectionMode" | "isSearchable" | "selectedTagsType">;
+        select: Pick<SelectBaseProps, "selectionMode" | "isSearchable" | "collapseAfter" | "selectedTagsType">;
         toggle: Pick<ToggleProps, "variant">;
         slider: Pick<SliderProps, "minValue" | "maxValue">;
         dateInput: Pick<DatePickerProps, "todayIcon" | "shouldForceLeadingZeros">;

package/dist/config/uiConfig.context.js

@@ -28,7 +28,8 @@ var UIConfig;
     select: {
       selectionMode: "single",
       isSearchable: false,
-      selectedTagsType: "list"
+      selectedTagsType: "list",
+      collapseAfter: 3
     },
     toggle: {
       variant: "default"

package/dist/hooks/useTableNav.js

@@ -49,9 +49,7 @@ class DataGridNav {
   }
   /** Used as a keyboard listener for key down */
   tableKeyDown(e) {
-    this.debugLog("tableKeyDown", `Key pressed: ${e.key}`);
     if (this.disabled) {
-      this.debugLog("tableKeyDown", "interaction is disabled");
       return;
     }
     if ("ArrowDown" === e.key || "ArrowUp" === e.key || "ArrowLeft" === e.key || "ArrowRight" === e.key) {
@@ -65,14 +63,11 @@ class DataGridNav {
     }
     const cell = e.target.parentElement?.closest(`${this.selectors.Cell},${this.selectors.Row}`);
     if (!cell) {
-      this.debugLog("tableKeyDown", "cell not found");
       return;
     }
     if (cell.matches(this.selectors.Cell)) {
-      this.debugLog("tableKeyDown", "event captured in cell");
       this.cellNavigation(e);
     } else {
-      this.debugLog("tableKeyDown", "event captured in cell");
       this.gridNavigation(e);
     }
   }
@@ -93,7 +88,6 @@ class DataGridNav {
     if (e.key === "ArrowRight" || e.key === "ArrowDown") {
       const cell = e.target.closest(this.selectors.Cell);
       if (!cell) {
-        this.debugLog("cellNavigation", "cell not found");
         return;
       }
       const focusableWidgets = [...cell.querySelectorAll(this.selectors.Focusable)];
@@ -108,7 +102,6 @@ class DataGridNav {
     if (e.key === "ArrowLeft" || e.key === "ArrowUp") {
       const cell = e.target.closest(this.selectors.Cell);
       if (!cell) {
-        this.debugLog("cellNavigation", "cell not found");
         return;
       }
       const focusableWidgets = [...cell.querySelectorAll(this.selectors.Focusable)];
@@ -204,7 +197,6 @@ class DataGridNav {
         const row = e.target.closest(this.selectors.Row);
         const siblings = row.parentElement?.children;
         if (!siblings) {
-          this.debugLog("cellNavigation", "siblings not found");
           return;
         }
         const rowToFocus = secondKey === "Home" ? siblings[0] : siblings[siblings.length - 1];
@@ -225,13 +217,11 @@ class DataGridNav {
     if (row && cell) {
       const position = this.getColumnIndex(cell);
       if (position === void 0) {
-        this.debugLog("cellNavigation", "position not found");
         return;
       }
       const direction = e.key === "PageUp" ? "prev" : "next";
       const siblings = row.parentElement?.children;
       if (!siblings) {
-        this.debugLog("cellNavigation", "siblings not found");
         return;
       }
       let destinationRow;
@@ -270,10 +260,7 @@ class DataGridNav {
     if (row && cell) {
       const cellPosition = this.getColumnIndex(cell);
       const rowPosition = this.getRowIndex(row);
-      this.debugLog("gridNavigation", `Initial row position: ${rowPosition}`);
-      this.debugLog("gridNavigation", `Initial cell position: ${cellPosition}`);
       if (cellPosition === void 0 || rowPosition === void 0) {
-        this.debugLog("verticalCellNavigation", "row or cell position not found");
         return;
       }
       const direction = e.key === "ArrowUp" ? "prev" : "next";
@@ -346,7 +333,6 @@ class DataGridNav {
       position++;
     }
     if (siblings[position] === void 0) {
-      this.debugLog("getColumnIndex", "position finding was not successful");
       return void 0;
     }
     return position;
@@ -365,7 +351,6 @@ class DataGridNav {
       position++;
     }
     if (siblings[position] === void 0) {
-      this.debugLog("getRowIndex", "position finding was not successful");
       return void 0;
     }
     return position;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@povio/ui",
-  "version": "0.0.9",
+  "version": "0.0.10",
   "type": "module",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",