@povio/ui 2.1.14 → 2.1.15

package/dist/components/inputs/File/shared/FileUploadContentFilled.js

@@ -1,173 +0,0 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import { clsx } from "clsx";
-import { FileTrigger } from "react-aria-components";
-import { useTranslation } from "react-i18next";
-import { CheckCircleIcon } from "../../../../assets/icons/CheckCircle.js";
-import { CloseIcon } from "../../../../assets/icons/Close.js";
-import { Button } from "../../../buttons/Button/Button.js";
-import { InlineIconButton } from "../../../buttons/InlineIconButton/InlineIconButton.js";
-import { TextButton } from "../../../buttons/TextButton/TextButton.js";
-import { Typography } from "../../../text/Typography/Typography.js";
-import { ns } from "../../../../config/i18n.js";
-import { FileUtils } from "../../../../utils/file.utils.js";
-const FileUploadContentFilled = ({
-  variant,
-  as,
-  isDisabled,
-  state,
-  browseText,
-  fileTriggerProps,
-  removeWithIcon = false,
-  singleFile,
-  onRemove
-}) => {
-  const { t } = useTranslation(ns);
-  return /* @__PURE__ */ jsx("div", { className: clsx("flex w-full flex-fill flex-col items-start"), children: /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: clsx("flex w-full items-center", {
-        "flex-row gap-file-upload-content-gap-left-to-right-content": variant === "horizontal",
-        "flex-col": variant === "vertical",
-        "gap-file-upload-content-gap-content-to-button": variant === "vertical" && as === "button",
-        "gap-file-upload-content-gap-text-to-text": variant === "vertical" && as === "link"
-      }),
-      children: [
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: clsx("flex min-w-0 max-w-full grow items-center gap-file-upload-content-gap-icon-to-content", {
-              "flex-col": variant === "vertical",
-              "flex-row": variant === "horizontal",
-              "opacity-50": isDisabled
-            }),
-            children: [
-              /* @__PURE__ */ jsx(CheckCircleIcon, { className: "h-6 w-6 text-text-default-1" }),
-              /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  className: clsx("flex flex-col gap-file-upload-content-gap-text-to-text", {
-                    "max-w-full items-center": variant === "vertical",
-                    "max-w-[calc(100%-32px)]": variant === "horizontal"
-                  }),
-                  children: [
-                    /* @__PURE__ */ jsx(
-                      Typography,
-                      {
-                        variant: "prominent-1",
-                        size: "label-1",
-                        as: "span",
-                        className: "self-stretch truncate text-center text-text-default-1",
-                        children: state.file.name
-                      }
-                    ),
-                    /* @__PURE__ */ jsx(
-                      Typography,
-                      {
-                        variant: "default",
-                        size: singleFile ? "label-2" : "label-3",
-                        as: "span",
-                        className: "text-text-default-2",
-                        children: FileUtils.getCalculatedFileSize(state.file)
-                      }
-                    )
-                  ]
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          "div",
-          {
-            className: clsx("flex flex-none items-center justify-end", {
-              "flex-col": variant === "vertical" && as === "button",
-              "gap-file-upload-content-gap-text-to-text": as === "link" && variant === "vertical",
-              "gap-file-upload-content-gap-content-to-button": as === "button" && variant === "vertical",
-              "gap-file-upload-content-gap-button-to-button": variant === "horizontal"
-            }),
-            children: as === "link" ? /* @__PURE__ */ jsxs(Fragment, { children: [
-              fileTriggerProps && /* @__PURE__ */ jsxs(Fragment, { children: [
-                /* @__PURE__ */ jsx(FileTrigger, { ...fileTriggerProps, children: /* @__PURE__ */ jsx(
-                  TextButton,
-                  {
-                    className: clsx("text-interactive-text-primary-idle", {
-                      "[&>span>span]:font-medium!": variant === "vertical"
-                    }),
-                    children: browseText ?? ""
-                  }
-                ) }),
-                variant === "vertical" && /* @__PURE__ */ jsx(
-                  Typography,
-                  {
-                    variant: "default",
-                    size: "label-2",
-                    as: "span",
-                    className: "text-text-default-2",
-                    children: t(($) => $.ui.fileUpload.or)
-                  }
-                )
-              ] }),
-              removeWithIcon ? /* @__PURE__ */ jsx(
-                InlineIconButton,
-                {
-                  label: "Cancel",
-                  color: "secondary",
-                  onPress: () => {
-                    onRemove(state.id ?? "");
-                  },
-                  icon: CloseIcon
-                }
-              ) : /* @__PURE__ */ jsx(
-                TextButton,
-                {
-                  className: clsx(
-                    variant === "vertical" && "text-interactive-text-primary-idle lowercase [&>span>span]:font-medium!"
-                  ),
-                  color: variant === "horizontal" ? "secondary" : "primary",
-                  onPress: () => {
-                    onRemove(state.id ?? "");
-                  },
-                  children: t(($) => $.ui.fileUpload.removeFile)
-                }
-              )
-            ] }) : /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-file-upload-content-gap-button-to-button self-stretch", children: [
-              fileTriggerProps && /* @__PURE__ */ jsx(FileTrigger, { ...fileTriggerProps, children: /* @__PURE__ */ jsx(
-                Button,
-                {
-                  variant: "outlined",
-                  size: "xs",
-                  width: "hug",
-                  isDisabled,
-                  children: browseText ?? ""
-                }
-              ) }),
-              removeWithIcon ? /* @__PURE__ */ jsx(
-                InlineIconButton,
-                {
-                  label: "Cancel",
-                  color: "secondary",
-                  onPress: () => {
-                    onRemove(state.id ?? "");
-                  },
-                  icon: CloseIcon
-                }
-              ) : /* @__PURE__ */ jsx(
-                TextButton,
-                {
-                  color: "secondary",
-                  onPress: () => {
-                    onRemove(state.id ?? "");
-                  },
-                  children: t(($) => $.ui.fileUpload.removeFile)
-                }
-              )
-            ] })
-          }
-        )
-      ]
-    }
-  ) });
-};
-export {
-  FileUploadContentFilled
-};

package/dist/components/inputs/File/shared/FileUploadContentLoading.js

@@ -1,128 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { clsx } from "clsx";
-import { useTranslation } from "react-i18next";
-import { CloseIcon } from "../../../../assets/icons/Close.js";
-import { FileIcon } from "../../../../assets/icons/File.js";
-import { Button } from "../../../buttons/Button/Button.js";
-import { InlineIconButton } from "../../../buttons/InlineIconButton/InlineIconButton.js";
-import { Typography } from "../../../text/Typography/Typography.js";
-import { ns } from "../../../../config/i18n.js";
-import { FileUtils } from "../../../../utils/file.utils.js";
-import { ProgressBar } from "./ProgressBar.js";
-const FileUploadContentLoading = ({
-  index,
-  variant,
-  as,
-  state,
-  isDisabled,
-  singleFile,
-  onCancel
-}) => {
-  const { t } = useTranslation(ns);
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: clsx("flex w-full flex-col items-center", {
-        "flex-col": variant === "vertical",
-        "flex-row": variant === "horizontal",
-        "gap-file-upload-content-gap-content-to-button": as === "button"
-      }),
-      children: [
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            className: clsx("flex w-full items-center justify-between", {
-              "flex-col gap-file-upload-content-gap-text-to-progress": variant === "vertical",
-              "flex-row gap-file-upload-content-gap-left-to-right-content": variant === "horizontal",
-              "opacity-50": isDisabled
-            }),
-            children: [
-              /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  className: clsx("flex items-center gap-file-upload-content-gap-icon-to-content", {
-                    "w-full flex-col": variant === "vertical",
-                    "w-1/2": variant === "horizontal"
-                  }),
-                  children: [
-                    /* @__PURE__ */ jsx(FileIcon, { className: "h-6 w-6 text-text-default-1" }),
-                    /* @__PURE__ */ jsxs(
-                      "div",
-                      {
-                        className: clsx("flex flex-col", {
-                          "max-w-full gap-file-upload-content-gap-icon-to-content text-center": variant === "vertical",
-                          "max-w-[calc(100%-32px)] gap-file-upload-content-gap-text-to-text": variant === "horizontal"
-                        }),
-                        children: [
-                          /* @__PURE__ */ jsx(
-                            Typography,
-                            {
-                              variant: "prominent-1",
-                              size: "label-1",
-                              as: "span",
-                              className: "self-stretch truncate text-center text-text-default-1",
-                              children: state.file.name
-                            }
-                          ),
-                          /* @__PURE__ */ jsx(
-                            Typography,
-                            {
-                              variant: "default",
-                              size: singleFile ? "label-2" : "label-3",
-                              as: "span",
-                              className: "text-text-default-2",
-                              children: FileUtils.getCalculatedFileSize(state.file)
-                            }
-                          )
-                        ]
-                      }
-                    )
-                  ]
-                }
-              ),
-              /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  className: clsx("flex items-center gap-1", {
-                    "w-1/2": variant === "horizontal",
-                    "w-full": variant === "vertical"
-                  }),
-                  children: [
-                    /* @__PURE__ */ jsx(ProgressBar, { progress: state.progress }),
-                    (as === "link" || variant === "horizontal") && /* @__PURE__ */ jsx(
-                      InlineIconButton,
-                      {
-                        label: "Cancel",
-                        color: "secondary",
-                        onPress: () => {
-                          onCancel(index);
-                        },
-                        icon: CloseIcon
-                      }
-                    )
-                  ]
-                }
-              )
-            ]
-          }
-        ),
-        as === "button" && variant === "vertical" && /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "outlined",
-            size: "xs",
-            color: "secondary",
-            width: "hug",
-            onPress: () => {
-              onCancel(index);
-            },
-            children: t(($) => $.ui.fileUpload.cancel)
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  FileUploadContentLoading
-};

package/dist/components/inputs/File/shared/InputUploadContent.js

@@ -1,73 +0,0 @@
-import { jsx, jsxs } from "react/jsx-runtime";
-import { clsx } from "clsx";
-import { FileTrigger, DropZone } from "react-aria-components";
-import { useTranslation } from "react-i18next";
-import { UploadIcon } from "../../../../assets/icons/Upload.js";
-import { Button } from "../../../buttons/Button/Button.js";
-import { TextButton } from "../../../buttons/TextButton/TextButton.js";
-import { inputSize } from "../../shared/input.cva.js";
-import { Typography } from "../../../text/Typography/Typography.js";
-import { ns } from "../../../../config/i18n.js";
-import { UIStyle } from "../../../../config/uiStyle.context.js";
-import { inputUploadButton, inputUploadDropZone } from "./inputUploadButton.cva.js";
-const InputUploadContent = (props) => {
-  const { variant, isDisabled, error, ...rest } = props;
-  const { t } = useTranslation(ns);
-  const uiStyle = UIStyle.useConfig();
-  const inputSizeCva = uiStyle?.input?.sizeCva ?? inputSize;
-  return /* @__PURE__ */ jsx(FileTrigger, { ...rest, children: /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "data-rac": "",
-      "data-disabled": isDisabled || void 0,
-      "data-invalid": !!error || void 0,
-      className: inputUploadButton({
-        variant,
-        className: "group/input-upload"
-      }),
-      children: [
-        /* @__PURE__ */ jsxs(
-          DropZone,
-          {
-            ...rest,
-            isDisabled,
-            className: clsx(inputUploadDropZone({ variant }), inputSizeCva({ size: "default" })),
-            children: [
-              /* @__PURE__ */ jsx(
-                Typography,
-                {
-                  variant: "default",
-                  size: "label-1",
-                  as: "span",
-                  className: "min-w-0 flex-fill select-none truncate text-text-default-3",
-                  children: t(($) => $.ui.fileUpload.emptyText)
-                }
-              ),
-              variant === "nested" && /* @__PURE__ */ jsx(
-                TextButton,
-                {
-                  isDisabled,
-                  icon: UploadIcon,
-                  children: t(($) => $.ui.fileUpload.upload)
-                }
-              )
-            ]
-          }
-        ),
-        variant !== "nested" && /* @__PURE__ */ jsx(
-          Button,
-          {
-            size: "s",
-            width: "hug",
-            isDisabled,
-            className: "truncate",
-            children: t(($) => $.ui.fileUpload.uploadFile)
-          }
-        )
-      ]
-    }
-  ) });
-};
-export {
-  InputUploadContent
-};

package/dist/components/inputs/File/shared/InputUploadFilled.js

@@ -1,45 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { clsx } from "clsx";
-import { CloseIcon } from "../../../../assets/icons/Close.js";
-import { InlineIconButton } from "../../../buttons/InlineIconButton/InlineIconButton.js";
-import { inputSize } from "../../shared/input.cva.js";
-import { Typography } from "../../../text/Typography/Typography.js";
-import { UIStyle } from "../../../../config/uiStyle.context.js";
-const InputUploadFilled = ({ files, onRemove, isDisabled }) => {
-  const uiStyle = UIStyle.useConfig();
-  const inputSizeCva = uiStyle?.input?.sizeCva ?? inputSize;
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: clsx(
-        "flex items-center rounded-input-rounding-default border border-input-outlined-outline-idle border-solid bg-input-outlined-idle",
-        inputSizeCva({ size: "default" })
-      ),
-      children: [
-        /* @__PURE__ */ jsx(
-          Typography,
-          {
-            variant: "default",
-            size: "label-1",
-            as: "span",
-            className: "flex-fill select-none truncate text-ellipsis text-text-default-1",
-            children: files.map((file) => file.name).join(", ")
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          InlineIconButton,
-          {
-            label: "Remove files",
-            color: "secondary",
-            icon: CloseIcon,
-            isDisabled,
-            onPress: onRemove
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  InputUploadFilled
-};

package/dist/components/inputs/File/shared/ProgressBar.js

@@ -1,42 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import clsx from "clsx";
-import { Typography } from "../../../text/Typography/Typography.js";
-const ProgressBar = ({ progress = 0, valueLabel = "trailing" }) => {
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: clsx(
-        "flex w-full items-center justify-center gap-file-upload-content-gap-progress-actions",
-        valueLabel === "leading" && "flex-row-reverse"
-      ),
-      children: [
-        /* @__PURE__ */ jsx("div", { className: "flex flex-fill flex-col items-start gap-2 py-progress-height-height", children: /* @__PURE__ */ jsxs("div", { className: "relative h-1 w-full", children: [
-          /* @__PURE__ */ jsx("div", { className: "h-1 w-full shrink-0 rounded-xs bg-input-filled-idle" }),
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              className: "absolute top-0 left-0 h-1 shrink-0 rounded-xs bg-interactive-contained-primary-idle transition-all duration-300",
-              style: { width: `${progress}%` }
-            }
-          )
-        ] }) }),
-        valueLabel !== "none" && /* @__PURE__ */ jsxs(
-          Typography,
-          {
-            variant: "default",
-            size: "label-2",
-            as: "span",
-            className: "text-center text-text-default-3",
-            children: [
-              progress,
-              "%"
-            ]
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  ProgressBar
-};

package/dist/components/inputs/File/shared/fileUpload.cva.js

@@ -1,58 +0,0 @@
-import { cva } from "class-variance-authority";
-import { clsx } from "clsx";
-const fileUploadDropZoneBase = cva(["relative w-full rounded-input-rounding-default"], {
-  variants: {
-    variant: {
-      vertical: ["flex-col justify-center"],
-      horizontal: ["flex-row justify-between"]
-    },
-    isContainer: {
-      true: [
-        "data-[drop-target]:before:content-['']",
-        "data-[drop-target]:before:absolute",
-        "data-[drop-target]:before:z-40",
-        "data-[drop-target]:before:width-full",
-        "data-[drop-target]:before:height-full",
-        "data-[drop-target]:before:top-0",
-        "data-[drop-target]:before:left-0",
-        "data-[drop-target]:border data-[drop-target]:border-dashed",
-        "data-[drop-target]:border-elevation-outline-default-2",
-        "data-[drop-target]:before:pointer-events-none data-[drop-target]:before:inset-0",
-        "data-[drop-target]:before:bg-elevation-fill-default-2"
-      ],
-      false: [
-        "flex items-center",
-        "py-file-upload-container-height-top-bottom",
-        "px-file-upload-container-side-default",
-        "gap-gap-file-upload-content-gap-icon-to-content",
-        "border border-input-outlined-outline-idle border-dashed bg-input-outlined-idle",
-        "hover:border-elevation-outline-default-2 hover:bg-elevation-fill-default-2",
-        "invalid:border invalid:border-input-outlined-outline-error",
-        "data-[drop-target]:border-elevation-outline-default-2 data-[drop-target]:bg-elevation-fill-default-2",
-        "data-[has-files]:border-solid"
-      ]
-    }
-  },
-  defaultVariants: {
-    variant: "vertical"
-  }
-});
-const fileUploadDropZone = (props) => {
-  const { className, ...rest } = props;
-  return clsx(fileUploadDropZoneBase(rest), className);
-};
-cva(["flex gap-3"], {
-  variants: {
-    variant: {
-      vertical: ["flex-col"],
-      horizontal: ["flex-row flex-wrap"]
-    }
-  },
-  defaultVariants: {
-    variant: "vertical"
-  }
-});
-export {
-  fileUploadDropZone,
-  fileUploadDropZoneBase
-};

package/dist/components/inputs/File/shared/inputUploadButton.cva.js

@@ -1,49 +0,0 @@
-import { cva } from "class-variance-authority";
-import { clsx } from "clsx";
-const inputUploadButtonBase = cva(
-  ["flex w-full items-center justify-between gap-input-gap-input-to-button-gap"],
-  {
-    variants: {
-      variant: {
-        default: [],
-        nested: []
-      }
-    },
-    defaultVariants: {
-      variant: "default"
-    }
-  }
-);
-const inputUploadButton = (props) => {
-  const { className, ...rest } = props;
-  return clsx(inputUploadButtonBase(rest), className);
-};
-const inputUploadDropZone = cva(
-  [
-    "min-w-0 flex-1",
-    "flex items-center",
-    "group-invalid/input-upload:border group-invalid/input-upload:border-input-outlined-outline-error",
-    "data-[drop-target]:border-input-outlined-outline-hover",
-    "hover:border-input-outlined-outline-hover"
-  ],
-  {
-    variants: {
-      variant: {
-        default: [
-          "rounded-input-rounding-default border border-input-outlined-outline-idle border-solid bg-input-outlined-idle"
-        ],
-        nested: [
-          "rounded-input-rounding-default border border-input-outlined-outline-idle border-solid bg-input-outlined-idle"
-        ]
-      }
-    },
-    defaultVariants: {
-      variant: "default"
-    }
-  }
-);
-export {
-  inputUploadButton,
-  inputUploadButtonBase,
-  inputUploadDropZone
-};

package/dist/components/inputs/FormField/FormField.js

@@ -1,54 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { FormFieldError } from "./FormFieldError.js";
-import { FormFieldHeader } from "./FormFieldHeader.js";
-const FormField = ({
-  ref,
-  as,
-  label,
-  tooltipText,
-  helperText,
-  isRequired,
-  rightContent,
-  isDisabled,
-  error,
-  hideLabel,
-  headerClassName,
-  errorClassName,
-  children,
-  className,
-  labelProps,
-  isHeaderHidden
-}) => {
-  const headerProps = {
-    label,
-    tooltipText,
-    helperText,
-    isRequired,
-    rightContent,
-    isHeaderHidden: hideLabel || isHeaderHidden,
-    isDisabled,
-    className: headerClassName,
-    labelProps
-  };
-  const errorProps = {
-    error,
-    isDisabled,
-    isHidden: isHeaderHidden,
-    className: errorClassName
-  };
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref,
-      className,
-      children: [
-        !["filter", "floating"].includes(as ?? "") && /* @__PURE__ */ jsx(FormFieldHeader, { ...headerProps }),
-        children,
-        /* @__PURE__ */ jsx(FormFieldError, { ...errorProps })
-      ]
-    }
-  );
-};
-export {
-  FormField
-};

package/dist/components/inputs/FormField/FormFieldError.js

@@ -1,16 +0,0 @@
-import { jsx } from "react/jsx-runtime";
-import { clsx } from "clsx";
-import { Typography } from "../../text/Typography/Typography.js";
-const FormFieldError = ({ error, isDisabled, isHidden, className }) => {
-  return /* @__PURE__ */ jsx(
-    Typography,
-    {
-      className: clsx("text-text-error-1", !error || isDisabled || isHidden ? "sr-only" : "mt-1-5", className),
-      size: "label-3",
-      children: error
-    }
-  );
-};
-export {
-  FormFieldError
-};