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

package/dist/esm/components/autocomplete/parts/AutocompleteClearButton.js

@@ -1,35 +0,0 @@
-import { jsx as l } from "react/jsx-runtime";
-import { useContext as u } from "react";
-import { ComboBoxStateContext as m } from "react-aria-components";
-import { useIntl as a } from "react-intl";
-import { twMerge as i } from "tailwind-merge";
-import { CircularIconButton as s } from "../../icon-button/CircularIconButton.js";
-const c = ({
-  className: e,
-  isReadOnly: o,
-  isDisabled: n
-}) => {
-  const t = u(m), r = a();
-  return !(t != null && t.inputValue) || o || n ? null : /* @__PURE__ */ l(
-    s,
-    {
-      slot: null,
-      title: r.formatMessage({
-        id: "unity:component:common:clear:title",
-        defaultMessage: "Clear"
-      }),
-      className: i(
-        e,
-        "uy-text-content-neutral-enabled group-data-[empty=true]:uy-hidden"
-      ),
-      icon: "CloseOutlined",
-      onPress: () => {
-        t.setSelectedKey(null);
-      }
-    }
-  );
-};
-c.displayName = "ClearButton";
-export {
-  c as AutocompleteClearButton
-};

package/dist/esm/components/autocomplete/parts/AutocompleteItem.d.ts

@@ -1,56 +0,0 @@
-import { ListBoxItemProps } from 'react-aria-components';
-import { VariantProps } from 'tailwind-variants';
-export declare const autocompleteItem: import('tailwind-variants').TVReturnType<{
-    isDisabled: {
-        false: string;
-        true: string;
-    };
-}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<{
-    isDisabled: {
-        false: string;
-        true: string;
-    };
-}, {
-    isDisabled: {
-        false: string;
-        true: string;
-    };
-}>, {
-    isDisabled: {
-        false: string;
-        true: string;
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    isDisabled: {
-        false: string;
-        true: string;
-    };
-}, undefined, string[], import('tailwind-variants/dist/config.js').TVConfig<{
-    isDisabled: {
-        false: string;
-        true: string;
-    };
-}, {
-    isDisabled: {
-        false: string;
-        true: string;
-    };
-}>, unknown, unknown, undefined>>;
-export interface AutocompleteItemProps extends VariantProps<typeof autocompleteItem>, Omit<ListBoxItemProps, 'className' | 'style' | 'routerOptions' | 'referrerPolicy' | 'ping' | 'target' | 'hrefLang' | 'download' | 'ref' | 'rel' | 'aria-label'> {
-}
-/**
- * The `AutocompleteItem` component is used within the Autocomplete component to render individual items in the autocomplete results list.
- * It provides styling and accessibility features for autocomplete result items.
- * @example
- * ```tsx
- * <Autocomplete name="fruits" items={fruits}>
- *   {item => (
- *     <AutocompleteItem id={item.id} textValue={item.name} isDisabled={item.disabled}>
- *       {item.name}
- *     </AutocompleteItem>
- *   )}
- * </Autocomplete>
- * ```
- */
-declare const AutocompleteItem: import('react').ForwardRefExoticComponent<AutocompleteItemProps & import('react').RefAttributes<HTMLDivElement>>;
-export { AutocompleteItem };

package/dist/esm/components/autocomplete/parts/AutocompleteItem.js

@@ -1,36 +0,0 @@
-import { jsx as l } from "react/jsx-runtime";
-import { forwardRef as r } from "react";
-import { ListBoxItem as n } from "react-aria-components";
-import { tv as d } from "tailwind-variants";
-const i = d({
-  base: [
-    "uy-flex uy-flex-col uy-typography-body uy-rounded-50 uy-pt-100 uy-pb-100 uy-pl-150 uy-pr-150 uy-outline-none uy-bg-surface-neutral-enabled enabled:uy-text-content-neutral-enabled",
-    "enabled:uy-bg-surface-neutral-enabled enabled:uy-text-content-neutral-enabled",
-    "data-[pressed]:uy-bg-surface-neutral-pressed data-[pressed]:uy-text-content-neutral-pressed",
-    "data-[focus-visible]:uy-outline-offset-2 data-[focus-visible]:uy-outline-2 data-[focus-visible]:uy-outline-utility-focus-ring data-[focus-visible]:uy-bg-surface-neutral-focus data-[focus-visible]:uy-text-content-neutral-focus",
-    "data-[disabled]:uy-text-content-neutral-disabled"
-  ],
-  variants: {
-    isDisabled: {
-      false: "hover:uy-bg-surface-neutral-hover",
-      true: "uy-cursor-not-allowed"
-    }
-  }
-}), y = r(
-  ({ children: e, isDisabled: t, textValue: u, ...a }, o) => /* @__PURE__ */ l(
-    n,
-    {
-      ...a,
-      isDisabled: t,
-      textValue: u,
-      ref: o,
-      className: ({ isDisabled: s }) => i({ isDisabled: s }),
-      children: e
-    }
-  )
-);
-y.displayName = "AutocompleteItem";
-export {
-  y as AutocompleteItem,
-  i as autocompleteItem
-};

package/dist/esm/components/autocomplete/parts/AutocompleteItemGroup.d.ts

@@ -1,96 +0,0 @@
-import { ForwardedRef } from 'react';
-import { ListBoxSectionProps } from 'react-aria-components';
-import { VariantProps } from 'tailwind-variants';
-export declare const autocompleteItemGroup: import('tailwind-variants').TVReturnType<{
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            separator?: import('tailwind-merge').ClassNameValue;
-            base?: import('tailwind-merge').ClassNameValue;
-            header?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {
-    [x: string]: {
-        [x: string]: import('tailwind-merge').ClassNameValue | {
-            separator?: import('tailwind-merge').ClassNameValue;
-            base?: import('tailwind-merge').ClassNameValue;
-            header?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}, {
-    base: string;
-    header: string;
-    separator: string;
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            separator?: import('tailwind-merge').ClassNameValue;
-            base?: import('tailwind-merge').ClassNameValue;
-            header?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}>, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            separator?: import('tailwind-merge').ClassNameValue;
-            base?: import('tailwind-merge').ClassNameValue;
-            header?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}, {
-    base: string;
-    header: string;
-    separator: string;
-}, import('tailwind-variants').TVReturnType<unknown, {
-    base: string;
-    header: string;
-    separator: string;
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            separator?: import('tailwind-merge').ClassNameValue;
-            base?: import('tailwind-merge').ClassNameValue;
-            header?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}>, unknown, unknown, undefined>>;
-export interface AutocompleteItemGroupProps<T> extends VariantProps<typeof autocompleteItemGroup>, ListBoxSectionProps<T> {
-    /**
-     * The label text displayed at the top of the group
-     */
-    label: string;
-}
-type AutocompleteItemGroupComponent = (<TItems extends object>(props: AutocompleteItemGroupProps<TItems> & {
-    ref?: ForwardedRef<HTMLDivElement>;
-}) => JSX.Element) & {
-    displayName?: string;
-};
-/**
- * Groups related options within an `Autocomplete` component.
- *
- * This component provides two APIs for grouping options:
- * 1. Static API - Directly nest AutocompleteItem components
- * 2. Dynamic API - Provide an array of items and a render function for dynamic items
- * @example
- * ```tsx
- * // Static API
- * <AutocompleteItemGroup label="Fruits">
- *   <AutocompleteItem id="apple">Apple</AutocompleteItem>
- *   <AutocompleteItem id="banana">Banana</AutocompleteItem>
- * </AutocompleteItemGroup>
- *
- * // Dynamic API
- * <AutocompleteItemGroup
- *   label="Fruits"
- *   items={fruits}
- * >
- *   {fruit => (
- *     <AutocompleteItem id={fruit.id}>
- *       {fruit.name}
- *     </AutocompleteItem>
- *   )}
- * </AutocompleteItemGroup>
- * ```
- */
-declare const AutocompleteItemGroup: AutocompleteItemGroupComponent;
-export { AutocompleteItemGroup };

package/dist/esm/components/autocomplete/parts/AutocompleteItemGroup.js

@@ -1,30 +0,0 @@
-import { jsxs as a, jsx as e, Fragment as u } from "react/jsx-runtime";
-import { forwardRef as c } from "react";
-import { ListBoxSection as i, Header as y, Collection as d, Separator as p } from "react-aria-components";
-import { tv as h } from "tailwind-variants";
-const f = h({
-  slots: {
-    base: "",
-    header: "uy-text-content-neutral-enabled uy-typography-body-strong uy-pt-100 uy-pb-100 uy-pl-150 uy-pr-150",
-    separator: "uy-h-[1px] uy-bg-surface-neutral-lowest uy-w-full uy-mb-100 uy-mt-100 [section:last-child_&]:uy-hidden"
-  }
-}), b = ({ label: r, children: o, items: t }, l) => {
-  const { base: s, header: m, separator: n } = f();
-  return /* @__PURE__ */ a(i, { ref: l, className: s(), id: r, items: t, children: [
-    /* @__PURE__ */ e(y, { className: m(), children: r }),
-    t ? /* @__PURE__ */ a(u, { children: [
-      /* @__PURE__ */ e(d, { items: t, children: o }),
-      /* @__PURE__ */ e(p, { orientation: "horizontal", className: n() })
-    ] }) : /* @__PURE__ */ a(u, { children: [
-      o,
-      /* @__PURE__ */ e(p, { orientation: "horizontal", className: n() })
-    ] })
-  ] });
-}, x = c(function(o, t) {
-  return b(o, t);
-});
-x.displayName = "AutocompleteItemGroup";
-export {
-  x as AutocompleteItemGroup,
-  f as autocompleteItemGroup
-};

package/dist/esm/components/autocomplete/parts/AutocompletePanel.d.ts

@@ -1,76 +0,0 @@
-import { RefObject } from 'react';
-import { PopoverProps } from 'react-aria-components';
-import { VariantProps } from 'tailwind-variants';
-import { AutocompleteProps } from '../Autocomplete.js';
-export declare const autocompletePanel: import('tailwind-variants').TVReturnType<{
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            list?: import('tailwind-merge').ClassNameValue;
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {
-    [x: string]: {
-        [x: string]: import('tailwind-merge').ClassNameValue | {
-            list?: import('tailwind-merge').ClassNameValue;
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}, {
-    base: string;
-    list: string;
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            list?: import('tailwind-merge').ClassNameValue;
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}>, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            list?: import('tailwind-merge').ClassNameValue;
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}, {
-    base: string;
-    list: string;
-}, import('tailwind-variants').TVReturnType<unknown, {
-    base: string;
-    list: string;
-}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
-    [key: string]: {
-        [key: string]: import('tailwind-merge').ClassNameValue | {
-            list?: import('tailwind-merge').ClassNameValue;
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-} | {}>, unknown, unknown, undefined>>;
-export interface AutocompletePanelProps<T extends object> extends VariantProps<typeof autocompletePanel>, Omit<PopoverProps, 'children'> {
-    /** Width of the panel, used to match the width of the search input */
-    panelWidth: string | null;
-    /** Reference to the search input element */
-    searchRef: RefObject<HTMLDivElement>;
-    /** The content to render inside the panel */
-    children: AutocompleteProps<T>['children'];
-}
-/**
- * The `AutocompletePanel` component is used within the Autocomplete component to display the dropdown panel containing autocomplete results.
- * It handles both the loading state and the empty state when no results are found.
- * @example
- * ```tsx
- * <AutocompletePanel
- *   panelWidth={searchWidth}
- *   searchRef={searchRef}
- *   isLoading={isLoading}
- * >
- *   {children}
- * </AutocompletePanel>
- * ```
- */
-declare const AutocompletePanel: {
-    <T extends object>(props: AutocompletePanelProps<T>): import("react/jsx-runtime").JSX.Element;
-    displayName: string;
-};
-export { AutocompletePanel };

package/dist/esm/components/autocomplete/parts/AutocompletePanel.js

@@ -1,47 +0,0 @@
-import { jsx as e, jsxs as i } from "react/jsx-runtime";
-import { Popover as y, ListBox as m } from "react-aria-components";
-import { FormattedMessage as c } from "react-intl";
-import { tv as d } from "tailwind-variants";
-import { Icon as p } from "../../icon/Icon.js";
-import { Text as t } from "../../text/Text.js";
-const f = d({
-  slots: {
-    base: "uy-rounded-75 uy-border uy-border-solid uy-border-border-neutral uy-w-[var(--trigger-width)] uy-bg-surface-neutral uy-max-h-[312px] uy-shadow-floating",
-    list: "uy-overflow-y-auto uy-max-h-[296px] uy-p-100"
-  }
-}), g = () => /* @__PURE__ */ i("div", { className: "uy-flex uy-flex-col uy-gap-200 uy-items-center uy-justify-center uy-h-[312px]", children: [
-  /* @__PURE__ */ e(
-    t,
-    {
-      variant: "body",
-      className: "uy-w-500 uy-h-500 uy-bg-surface-neutral-lowest uy-flex uy-items-center uy-justify-center uy-rounded-75",
-      children: /* @__PURE__ */ e(p, { size: 24, src: "MagnifyingGlassOutlined" })
-    }
-  ),
-  /* @__PURE__ */ e(t, { variant: "bodyLarge", children: /* @__PURE__ */ e(
-    c,
-    {
-      id: "unity:component:autocomplete:panel:empty:label",
-      defaultMessage: "No results found"
-    }
-  ) })
-] }), h = (r) => {
-  const { children: o, panelWidth: s, searchRef: a, ...u } = r, { base: l, list: n } = f();
-  return /* @__PURE__ */ e(
-    y,
-    {
-      ...u,
-      className: l(),
-      offset: 1,
-      triggerRef: a,
-      isNonModal: !0,
-      style: { "--trigger-width": s },
-      children: /* @__PURE__ */ e(m, { className: n(), renderEmptyState: g, children: o })
-    }
-  );
-};
-h.displayName = "AutocompletePanel";
-export {
-  h as AutocompletePanel,
-  f as autocompletePanel
-};

package/dist/esm/components/avatar/Avatar.context.d.ts

@@ -1,11 +0,0 @@
-type AvatarContextValue = {
-    variant: 'circle' | 'square';
-    size: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
-    hasPair: boolean;
-};
-export declare const AvatarContext: import('react').Context<AvatarContextValue>;
-export declare function AvatarProvider({ variant, size, hasPair, children, }: AvatarContextValue & {
-    children: React.ReactNode;
-}): import("react/jsx-runtime").JSX.Element;
-export declare function useAvatarContext(): AvatarContextValue;
-export {};

package/dist/esm/components/avatar/Avatar.d.ts

@@ -1,206 +0,0 @@
-import { PropsWithChildren } from 'react';
-import { VariantProps } from 'tailwind-variants';
-import * as React from 'react';
-declare const avatarRoot: import('tailwind-variants').TVReturnType<{} | {
-    size: {
-        xs: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-        sm: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-        md: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-        lg: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-        xl: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-    variant: {
-        circle: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-        square: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-}, undefined, "uy-inline-block uy-relative uy-shrink-0", import('tailwind-variants/dist/config.js').TVConfig<{} | {
-    size: {
-        xs: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-        sm: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-        md: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-        lg: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-        xl: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-    variant: {
-        circle: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-        square: import('tailwind-merge').ClassNameValue | {
-            base?: import('tailwind-merge').ClassNameValue;
-        };
-    };
-}, {
-    size: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-    };
-    variant: {
-        circle: string;
-        square: string;
-    };
-}>, {
-    size: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-    };
-    variant: {
-        circle: string;
-        square: string;
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    size: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-    };
-    variant: {
-        circle: string;
-        square: string;
-    };
-}, undefined, undefined, import('tailwind-variants/dist/config.js').TVConfig<{
-    size: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-    };
-    variant: {
-        circle: string;
-        square: string;
-    };
-}, {
-    size: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-    };
-    variant: {
-        circle: string;
-        square: string;
-    };
-}>, {
-    size: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-    };
-    variant: {
-        circle: string;
-        square: string;
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    size: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-    };
-    variant: {
-        circle: string;
-        square: string;
-    };
-}, undefined, undefined, import('tailwind-variants/dist/config.js').TVConfig<{
-    size: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-    };
-    variant: {
-        circle: string;
-        square: string;
-    };
-}, {
-    size: {
-        xs: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-    };
-    variant: {
-        circle: string;
-        square: string;
-    };
-}>, unknown, unknown, undefined>>>;
-export type AvatarProps = PropsWithChildren<{
-    /** Additional class names to apply to the avatar */
-    className?: string;
-    /** The avatar's variant. One of: circle or square */
-    variant?: VariantProps<typeof avatarRoot>['variant'];
-    /** Size of the avatar. One of: xs, sm, md, lg, xl */
-    size?: VariantProps<typeof avatarRoot>['size'];
-    /** Accessible label for the avatar */
-    'aria-label': string;
-    /** ID of the element that labels the avatar */
-    'aria-labelledby'?: string;
-    /** ID of the element that describes the avatar */
-    'aria-describedby'?: string;
-    /** Additional details for the avatar */
-    'aria-details'?: string;
-    /** Indicates if the avatar is hidden from assistive technologies */
-    'aria-hidden'?: boolean;
-}>;
-/**
- * The Avatar component displays visual or text content for representing people or entities.
- */
-declare const Avatar: React.ForwardRefExoticComponent<{
-    /** Additional class names to apply to the avatar */
-    className?: string;
-    /** The avatar's variant. One of: circle or square */
-    variant?: VariantProps<typeof avatarRoot>["variant"];
-    /** Size of the avatar. One of: xs, sm, md, lg, xl */
-    size?: VariantProps<typeof avatarRoot>["size"];
-    /** Accessible label for the avatar */
-    'aria-label': string;
-    /** ID of the element that labels the avatar */
-    'aria-labelledby'?: string;
-    /** ID of the element that describes the avatar */
-    'aria-describedby'?: string;
-    /** Additional details for the avatar */
-    'aria-details'?: string;
-    /** Indicates if the avatar is hidden from assistive technologies */
-    'aria-hidden'?: boolean;
-} & {
-    children?: React.ReactNode | undefined;
-} & React.RefAttributes<HTMLSpanElement>>;
-export { Avatar };

package/dist/esm/components/avatar/Avatar.js

@@ -1,33 +0,0 @@
-import { jsx as t } from "react/jsx-runtime";
-import * as c from "react";
-import * as o from "@radix-ui/react-avatar";
-import { twMerge as d } from "tailwind-merge";
-import { tv as f } from "tailwind-variants";
-import { AvatarProvider as n } from "./Avatar.context.js";
-import { avatarBase as p } from "./Avatar.variants.js";
-const v = f({
-  extend: p,
-  base: "uy-inline-block uy-relative uy-shrink-0",
-  defaultVariants: {
-    size: "md",
-    variant: "circle"
-  }
-}), y = c.forwardRef(
-  ({ size: a = "md", variant: r = "circle", className: e, ...i }, m) => {
-    const s = v({ variant: r, size: a }), l = d(s, e);
-    return /* @__PURE__ */ t(n, { variant: r, size: a, hasPair: !1, children: /* @__PURE__ */ t(
-      o.Root,
-      {
-        ref: m,
-        role: "img",
-        className: l,
-        "data-dd-privacy": "allow",
-        ...i
-      }
-    ) });
-  }
-);
-y.displayName = o.Root.displayName;
-export {
-  y as Avatar
-};