@payfit/unity-components 0.0.0-alpha.11 → 0.0.0-alpha.6

package/dist/esm/components/alert/Alert.d.ts

@@ -1,155 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { VariantProps } from 'tailwind-variants';
-declare const alert: import('tailwind-variants').TVReturnType<{
-    variant: {
-        info: {
-            base: string;
-        };
-        warning: {
-            base: string;
-        };
-        success: {
-            base: string;
-        };
-        danger: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    content: string;
-    icon: string;
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<{
-    variant: {
-        info: {
-            base: string;
-        };
-        warning: {
-            base: string;
-        };
-        success: {
-            base: string;
-        };
-        danger: {
-            base: string;
-        };
-    };
-}, {
-    variant: {
-        info: {
-            base: string;
-        };
-        warning: {
-            base: string;
-        };
-        success: {
-            base: string;
-        };
-        danger: {
-            base: string;
-        };
-    };
-}>, {
-    variant: {
-        info: {
-            base: string;
-        };
-        warning: {
-            base: string;
-        };
-        success: {
-            base: string;
-        };
-        danger: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    content: string;
-    icon: string;
-}, import('tailwind-variants').TVReturnType<{
-    variant: {
-        info: {
-            base: string;
-        };
-        warning: {
-            base: string;
-        };
-        success: {
-            base: string;
-        };
-        danger: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    content: string;
-    icon: string;
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<{
-    variant: {
-        info: {
-            base: string;
-        };
-        warning: {
-            base: string;
-        };
-        success: {
-            base: string;
-        };
-        danger: {
-            base: string;
-        };
-    };
-}, {
-    variant: {
-        info: {
-            base: string;
-        };
-        warning: {
-            base: string;
-        };
-        success: {
-            base: string;
-        };
-        danger: {
-            base: string;
-        };
-    };
-}>, unknown, unknown, undefined>>;
-type BaseAlertProps = PropsWithChildren<{
-    /**
-     * The alert's variant, which determines its visual style.
-     */
-    variant: NonNullable<VariantProps<typeof alert>['variant']>;
-}>;
-type DismissableConfig = {
-    /**
-     * Whether the alert is dismissable by the user, and should render a close button.
-     * @default false
-     */
-    isDismissable?: false;
-    onDismiss?: never;
-    dismissButtonLabel?: never;
-} | {
-    /**
-     * Whether the alert is dismissable by the user, and should render a close button.
-     * @default false
-     */
-    isDismissable: true;
-    /**
-     * Callback function to handle the alert's dismissal behavior.
-     */
-    onDismiss: () => void;
-    /**
-     * Label for the close button.
-     */
-    dismissButtonLabel: string;
-};
-export type AlertProps = BaseAlertProps & DismissableConfig;
-/**
- * Alerts display brief messages for the user without interrupting their use of the app. They can provide feedback, confirmations, warnings, or errors.
- */
-declare const Alert: import('react').ForwardRefExoticComponent<AlertProps & import('react').RefAttributes<HTMLDivElement>>;
-export { Alert };

package/dist/esm/components/alert/Alert.js

@@ -1,78 +0,0 @@
-import { jsxs as f, jsx as r } from "react/jsx-runtime";
-import { forwardRef as b } from "react";
-import { tv as g } from "tailwind-variants";
-import { CircularIconButton as m } from "../icon-button/CircularIconButton.js";
-import { Icon as p } from "../icon/Icon.js";
-const w = g({
-  slots: {
-    base: "uy-p-200 uy-flex uy-gap-200 uy-border uy-border-solid uy-rounded-100",
-    content: "uy-flex uy-flex-col uy-flex-1 uy-gap-200 uy-pt-50 uy-pb-100",
-    icon: "uy-mt-50"
-  },
-  variants: {
-    variant: {
-      info: {
-        base: "uy-bg-surface-info-lowest uy-border-border-info-lowest"
-      },
-      warning: {
-        base: "uy-bg-surface-warning-lowest uy-border-border-warning-lowest"
-      },
-      success: {
-        base: "uy-bg-surface-success-lowest uy-border-border-success-lowest"
-      },
-      danger: {
-        base: "uy-bg-surface-danger-lowest uy-border-border-danger-lowest"
-      }
-    }
-  },
-  defaultVariants: {
-    variant: "info"
-  }
-}), v = {
-  info: { src: "InfoFilled", color: "content.info" },
-  warning: { src: "WarningFilled", color: "content.warning" },
-  success: { src: "CheckCircleFilled", color: "content.success" },
-  danger: { src: "WarningCircleFilled", color: "content.danger" }
-}, x = b(
-  ({
-    children: o,
-    variant: e,
-    isDismissable: s,
-    onDismiss: n,
-    dismissButtonLabel: a,
-    ...t
-  }, c) => {
-    const { base: i, content: l, icon: u } = w({ variant: e }), d = v[e], y = {
-      role: e === "danger" ? "alert" : "status",
-      "aria-live": e === "danger" ? "assertive" : "polite",
-      "aria-atomic": !0,
-      "aria-relevant": "additions removals"
-    };
-    return /* @__PURE__ */ f(
-      "div",
-      {
-        "data-dd-privacy": "mask",
-        ref: c,
-        className: i(),
-        ...y,
-        ...t,
-        children: [
-          /* @__PURE__ */ r("div", { className: u(), children: /* @__PURE__ */ r(p, { size: 24, ...d, alt: `${e} alert` }) }),
-          /* @__PURE__ */ r("section", { className: l(), children: o }),
-          s && /* @__PURE__ */ r(
-            m,
-            {
-              title: a,
-              icon: "CloseOutlined",
-              onPress: n
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-x.displayName = "Alert";
-export {
-  x as Alert
-};

package/dist/esm/components/alert/parts/AlertActions.d.ts

@@ -1,55 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { VariantProps } from 'tailwind-variants';
-declare const alertActions: import('tailwind-variants').TVReturnType<{
-    direction: {
-        row: string;
-        column: string;
-    };
-}, undefined, "uy-flex uy-gap-100", import('tailwind-variants/dist/config.js').TVConfig<{
-    direction: {
-        row: string;
-        column: string;
-    };
-}, {
-    direction: {
-        row: string;
-        column: string;
-    };
-}>, {
-    direction: {
-        row: string;
-        column: string;
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    direction: {
-        row: string;
-        column: string;
-    };
-}, undefined, "uy-flex uy-gap-100", import('tailwind-variants/dist/config.js').TVConfig<{
-    direction: {
-        row: string;
-        column: string;
-    };
-}, {
-    direction: {
-        row: string;
-        column: string;
-    };
-}>, unknown, unknown, undefined>>;
-export type AlertActionsProps = PropsWithChildren<{
-    /**
-     * The direction in which to lay out the child actions.
-     * @default 'column'
-     */
-    direction?: VariantProps<typeof alertActions>['direction'];
-}>;
-declare const AlertActions: import('react').ForwardRefExoticComponent<{
-    /**
-     * The direction in which to lay out the child actions.
-     * @default 'column'
-     */
-    direction?: VariantProps<typeof alertActions>["direction"];
-} & {
-    children?: import('react').ReactNode | undefined;
-} & import('react').RefAttributes<HTMLDivElement>>;
-export { AlertActions };

package/dist/esm/components/alert/parts/AlertContent.js

@@ -1,10 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import { forwardRef as m } from "react";
-import { Text as n } from "../../text/Text.js";
-const a = m(
-  ({ children: r, ...t }, o) => /* @__PURE__ */ e(n, { variant: "body", ref: o, ...t, children: r })
-);
-a.displayName = "AlertContent";
-export {
-  a as AlertContent
-};

package/dist/esm/components/alert/parts/AlertTitle.js

@@ -1,20 +0,0 @@
-import { jsx as r } from "react/jsx-runtime";
-import { forwardRef as i } from "react";
-import { Text as m } from "../../text/Text.js";
-const l = i(
-  ({ children: e, asElement: t = "h3", ...o }, a) => /* @__PURE__ */ r("header", { children: /* @__PURE__ */ r(
-    m,
-    {
-      variant: "h4",
-      asElement: t,
-      ref: a,
-      className: "uy-pt-50",
-      ...o,
-      children: e
-    }
-  ) })
-);
-l.displayName = "AlertTitle";
-export {
-  l as AlertTitle
-};

package/dist/esm/components/anchor/Anchor.d.ts

@@ -1,15 +0,0 @@
-import { ReactElement } from 'react';
-export type AnchorPosition = 'top-right' | 'top-left' | 'bottom-right' | 'bottom-left';
-interface AnchorProps {
-    children: [ReactElement, ReactElement];
-    position?: AnchorPosition;
-    offset?: number | [number, number];
-}
-/**
- * The Anchor component is a primitive used to anchor a small component to a larger one in any of the large component's corners.
- */
-declare const Anchor: {
-    ({ children, position, offset, }: AnchorProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export { Anchor };

package/dist/esm/components/app-layout/AppLayout.d.ts

@@ -1,27 +0,0 @@
-import { PropsWithChildren, ReactNode } from 'react';
-export type AppLayoutProps = PropsWithChildren<{
-    /**
-     * The header component to be displayed at the top of the layout
-     * @default undefined
-     */
-    header?: ReactNode;
-    /**
-     * The menu component to be displayed on the side of the layout
-     */
-    menu: ReactNode;
-    /**
-     * The footer component to be displayed at the bottom of the layout
-     * @default undefined
-     */
-    footer?: ReactNode;
-    /**
-     * Removes the padding top and right for the content
-     * @default: false
-     */
-    withoutContentPadding?: boolean;
-}>;
-/**
- * The `AppLayout` component creates a responsive base structure with a fixed menu sidebar.
- * Use this when you need a complex layout with a persistent navigation menu.
- */
-export declare function AppLayout({ children, menu: MenuElement, header: HeaderElement, footer: FooterElement, withoutContentPadding, }: AppLayoutProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/app-layout/AppLayout.js

@@ -1,77 +0,0 @@
-import { jsxs as t, jsx as e } from "react/jsx-runtime";
-import { useRef as v } from "react";
-import { tv as x } from "tailwind-variants";
-import { useResizeObserver as g } from "usehooks-ts";
-const w = x({
-  slots: {
-    body: "uy-h-screen uy-relative uy-overflow-hidden",
-    header: "uy-fixed uy-top-0 uy-left-0 uy-right-0 uy-z-30",
-    layoutWrapper: [
-      "uy-flex uy-flex-col uy-w-full uy-mt-[--uy-app-layout-header-sticky-offset] uy-h-[--uy-app-layout-menu-height]",
-      "md:uy-flex-row"
-    ],
-    menu: ["uy-w-full", "md:uy-max-w-app-menu"],
-    contentWrapper: [
-      "uy-flex uy-flex-col",
-      "uy-flex-grow uy-overflow-y-auto uy-relative",
-      // Remove padding when it contains a Page component
-      "md:[&:has([data-unity-page])]:uy-pl-0"
-    ],
-    content: [
-      "uy-flex-1",
-      "md:[&:has([data-unity-page])]:uy-pr-0 md:[&:has([data-unity-page])]:uy-pt-0"
-    ],
-    footer: ["uy-hidden", "md:uy-block"]
-  },
-  variants: {
-    withoutContentPadding: {
-      false: {
-        content: ["md:uy-pr-300", "md:uy-pt-250", "&:has()"],
-        contentWrapper: ["md:uy-pl-100"]
-      },
-      true: {
-        content: [],
-        contentWrapper: []
-      }
-    }
-  }
-});
-function R({
-  children: y,
-  menu: l,
-  header: a,
-  footer: r,
-  withoutContentPadding: n = !1
-}) {
-  const u = v(null), { height: o = 0 } = g({
-    ref: u,
-    box: "border-box"
-  }), { body: p, header: s, menu: d, layoutWrapper: i, contentWrapper: c, content: f, footer: h } = w({
-    withoutContentPadding: n
-  }), m = {
-    "--uy-app-layout-menu-height": `calc(100dvh - ${o}px)`,
-    "--uy-app-layout-header-sticky-offset": `${o}px`
-  };
-  return /* @__PURE__ */ t("div", { className: p(), style: m, children: [
-    a && /* @__PURE__ */ e(
-      "div",
-      {
-        ref: u,
-        className: s(),
-        role: "alert",
-        "aria-live": "assertive",
-        children: a
-      }
-    ),
-    /* @__PURE__ */ t("div", { className: i(), children: [
-      /* @__PURE__ */ e("div", { className: d(), children: l }),
-      /* @__PURE__ */ t("div", { className: c(), children: [
-        /* @__PURE__ */ e("div", { className: f(), children: y }),
-        r && /* @__PURE__ */ e("footer", { className: h(), children: r })
-      ] })
-    ] })
-  ] });
-}
-export {
-  R as AppLayout
-};

package/dist/esm/components/app-menu/AppMenu.d.ts

@@ -1,9 +0,0 @@
-import { ReactNode } from 'react';
-export interface AppMenuProps {
-    children: ReactNode;
-}
-declare const AppMenu: {
-    ({ children }: AppMenuProps): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export { AppMenu };

package/dist/esm/components/app-menu/AppMenu.js

@@ -1,14 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import { AppMenuContextProvider as u } from "./parts/AppMenu.context.js";
-const a = ({ children: p }) => /* @__PURE__ */ e(u, { children: /* @__PURE__ */ e(
-  "div",
-  {
-    className: "uy-relative uy-z-[1] uy-flex uy-flex-col uy-p-150 uy-gap-y-300 md:uy-max-w-app-menu md:uy-h-full",
-    "data-dd-privacy": "allow",
-    children: p
-  }
-) });
-a.displayName = "AppMenu";
-export {
-  a as AppMenu
-};

package/dist/esm/components/app-menu/parts/AppMenu.context.d.ts

@@ -1,9 +0,0 @@
-import { PropsWithChildren } from 'react';
-type AppMenuContextValue = {
-    isMobileMenuOpen: boolean;
-    toggleMobileMenu: () => void;
-};
-export declare const AppMenuContext: import('react').Context<AppMenuContextValue>;
-export declare function AppMenuContextProvider({ children, }: PropsWithChildren<object>): import("react/jsx-runtime").JSX.Element;
-export declare function useAppMenuContext(): AppMenuContextValue;
-export {};

package/dist/esm/components/app-menu/parts/AppMenu.context.js

@@ -1,25 +0,0 @@
-import { jsx as M } from "react/jsx-runtime";
-import { createContext as i, useState as l, useContext as r } from "react";
-const e = i({
-  isMobileMenuOpen: !1,
-  toggleMobileMenu: () => null
-});
-function a({
-  children: n
-}) {
-  const [t, o] = l(!1), u = {
-    toggleMobileMenu: () => {
-      o((s) => !s);
-    },
-    isMobileMenuOpen: t
-  };
-  return /* @__PURE__ */ M(e.Provider, { value: u, children: n });
-}
-function f() {
-  return r(e);
-}
-export {
-  e as AppMenuContext,
-  a as AppMenuContextProvider,
-  f as useAppMenuContext
-};

package/dist/esm/components/app-menu/parts/AppMenuFooter.d.ts

@@ -1,31 +0,0 @@
-import { ReactElement, ReactNode } from 'react';
-import { AvatarPairProps } from '../../avatar/parts/AvatarPair.js';
-type CommonProps = {
-    avatar?: string;
-    avatarPair?: ReactElement<AvatarPairProps>;
-    title?: string;
-    description?: ReactNode;
-    badgeLabel?: string;
-    /**
-     * Use this to provide a custom context to the screen reader. Press this button to open the profile menu.
-     */
-    menuTriggerDescription?: string;
-    uploadAvatarCallback?: () => void;
-    /**
-     * Use this to provide a custom context to the screen reader. Default is "Press enter to change profile picture"
-     */
-    uploadAvatarDescription?: string;
-    /**
-     * Use this to provide a custom context to the screen reader. Default is Change profile picture
-     */
-    uploadAvatarLabel?: string;
-};
-export type AppMenuFooterProps = CommonProps & {
-    children?: ReactNode;
-    computeSlot?: ReactNode;
-};
-export type AppMenuFooterHeaderProps = CommonProps & {
-    asMenuHeader?: boolean;
-};
-export declare const AppMenuFooter: ({ avatar, avatarPair, badgeLabel, children, computeSlot, description, title, menuTriggerDescription, uploadAvatarCallback, uploadAvatarLabel, uploadAvatarDescription, }: AppMenuFooterProps) => import("react/jsx-runtime").JSX.Element;
-export {};