@payfit/unity-components 0.0.0-alpha.11

package/dist/cjs/components/autocomplete/parts/AutocompleteItem.d.cts

@@ -0,0 +1,56 @@
+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/cjs/components/autocomplete/parts/AutocompleteItemGroup.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),p=require("react"),o=require("react-aria-components"),m=require("tailwind-variants"),n=m.tv({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"}}),y=({label:a,children:r,items:t},c)=>{const{base:l,header:i,separator:s}=n();return e.jsxs(o.ListBoxSection,{ref:c,className:l(),id:a,items:t,children:[e.jsx(o.Header,{className:i(),children:a}),t?e.jsxs(e.Fragment,{children:[e.jsx(o.Collection,{items:t,children:r}),e.jsx(o.Separator,{orientation:"horizontal",className:s()})]}):e.jsxs(e.Fragment,{children:[r,e.jsx(o.Separator,{orientation:"horizontal",className:s()})]})]})},u=p.forwardRef(function(r,t){return y(r,t)});u.displayName="AutocompleteItemGroup";exports.AutocompleteItemGroup=u;exports.autocompleteItemGroup=n;

package/dist/cjs/components/autocomplete/parts/AutocompleteItemGroup.d.cts

@@ -0,0 +1,96 @@
+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/cjs/components/autocomplete/parts/AutocompletePanel.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("react-aria-components"),d=require("react-intl"),m=require("tailwind-variants"),p=require("../../icon/Icon.cjs"),r=require("../../text/Text.cjs"),s=m.tv({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"}}),x=()=>e.jsxs("div",{className:"uy-flex uy-flex-col uy-gap-200 uy-items-center uy-justify-center uy-h-[312px]",children:[e.jsx(r.Text,{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:e.jsx(p.Icon,{size:24,src:"MagnifyingGlassOutlined"})}),e.jsx(r.Text,{variant:"bodyLarge",children:e.jsx(d.FormattedMessage,{id:"unity:component:autocomplete:panel:empty:label",defaultMessage:"No results found"})})]}),o=a=>{const{children:u,panelWidth:n,searchRef:l,...i}=a,{base:c,list:y}=s();return e.jsx(t.Popover,{...i,className:c(),offset:1,triggerRef:l,isNonModal:!0,style:{"--trigger-width":n},children:e.jsx(t.ListBox,{className:y(),renderEmptyState:x,children:u})})};o.displayName="AutocompletePanel";exports.AutocompletePanel=o;exports.autocompletePanel=s;

package/dist/cjs/components/autocomplete/parts/AutocompletePanel.d.cts

@@ -0,0 +1,76 @@
+import { RefObject } from 'react';
+import { PopoverProps } from 'react-aria-components';
+import { VariantProps } from 'tailwind-variants';
+import { AutocompleteProps } from '../Autocomplete.cjs';
+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/cjs/components/avatar/Avatar.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),d=require("react"),v=require("@radix-ui/react-avatar"),m=require("tailwind-merge"),f=require("tailwind-variants"),p=require("./Avatar.context.cjs"),y=require("./Avatar.variants.cjs");function n(e){if(e&&typeof e=="object"&&"default"in e)return e;const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const a in e)if(a!=="default"){const r=Object.getOwnPropertyDescriptor(e,a);Object.defineProperty(t,a,r.get?r:{enumerable:!0,get:()=>e[a]})}}return t.default=e,Object.freeze(t)}const b=n(d),o=n(v),g=f.tv({extend:y.avatarBase,base:"uy-inline-block uy-relative uy-shrink-0",defaultVariants:{size:"md",variant:"circle"}}),c=b.forwardRef(({size:e="md",variant:t="circle",className:a,...r},s)=>{const l=g({variant:t,size:e}),u=m.twMerge(l,a);return i.jsx(p.AvatarProvider,{variant:t,size:e,hasPair:!1,children:i.jsx(o.Root,{ref:s,role:"img",className:u,"data-dd-privacy":"allow",...r})})});c.displayName=o.Root.displayName;exports.Avatar=c;

package/dist/cjs/components/avatar/Avatar.context.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),r=require("react"),e=r.createContext({variant:"circle",size:"md",hasPair:!1});function s({variant:t,size:a,hasPair:n,children:o}){return i.jsx(e.Provider,{value:{variant:t,size:a,hasPair:n},children:o})}function u(){const t=r.useContext(e);if(!t)throw new Error("useAvatarContext must be used within an AvatarProvider");return t}exports.AvatarContext=e;exports.AvatarProvider=s;exports.useAvatarContext=u;

package/dist/cjs/components/avatar/Avatar.context.d.cts

@@ -0,0 +1,11 @@
+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/cjs/components/avatar/Avatar.d.cts

@@ -0,0 +1,206 @@
+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/cjs/components/avatar/Avatar.variants.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("tailwind-variants"),e=a.tv({variants:{size:{xs:"uy-size-200",sm:"uy-size-300",md:"uy-size-400",lg:"uy-size-500",xl:"uy-size-1000"},variant:{circle:"uy-rounded-circle",square:""}},compoundVariants:[{size:"xs",variant:"square",className:"uy-rounded-50"},{size:"sm",variant:"square",className:"uy-rounded-50"},{size:"md",variant:"square",className:"uy-rounded-75"},{size:"lg",variant:"square",className:"uy-rounded-100"},{size:"xl",variant:"square",className:"uy-rounded-200"}]});exports.avatarBase=e;

package/dist/cjs/components/avatar/Avatar.variants.d.cts

@@ -0,0 +1,85 @@
+export declare const avatarBase: 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>>;

package/dist/cjs/components/avatar/parts/AvatarFallback.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),v=require("react"),m=require("@radix-ui/react-avatar"),h=require("tailwind-merge"),s=require("tailwind-variants"),w=require("../Avatar.context.cjs"),u=require("../Avatar.variants.cjs"),x=require("../utils.cjs");function i(e){if(e&&typeof e=="object"&&"default"in e)return e;const a=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const r=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(a,t,r.get?r:{enumerable:!0,get:()=>e[t]})}}return a.default=e,Object.freeze(a)}const j=i(v),c=i(m),k=s.tv({extend:u.avatarBase,slots:{base:"uy-absolute uy-overflow-hidden",background:"",foreground:""},variants:{color:{blue:{background:"uy-bg-blue-L7",foreground:"uy-fill-blue-L5"},sunglow:{background:"uy-bg-sunglow-L3",foreground:"uy-fill-sunglow-L2"},peach:{background:"uy-bg-peach-L3",foreground:"uy-fill-peach-L2"}}}}),q=s.tv({extend:u.avatarBase,base:"uy-absolute uy-flex uy-h-full uy-w-full uy-items-center uy-justify-center uy-text-content-neutral uy-bg-surface-neutral-lowest",variants:{size:{xs:"uy-typography-body-small-strong",sm:"uy-typography-body-small-strong",md:"uy-typography-body-small-strong",lg:"uy-typography-body-strong",xl:"uy-typography-h2"}}}),y=j.forwardRef(({variant:e,color:a,children:t,...r},d)=>{const g=w.useAvatarContext(),{size:o,variant:l}=g;if(e==="placeholder"){const{base:b,background:f,foreground:p}=k({color:a,size:o,variant:l});return n.jsx("svg",{role:"img","aria-hidden":!0,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 16 16",className:h.twMerge(b(),f()),...r,children:n.jsx("path",{className:p(),fillRule:"evenodd",d:"M0 8.322c.245.06.49.117.732.17 2.113.455 3.727.487 4.79.12.478-.166.824-.405 1.09-.732.276-.336.567-.888.737-1.82.4-2.19.02-3.485-.47-4.283C6.407 1.012 5.665.432 4.732 0h6.861c.904 1.906 1.173 4.227.674 6.959-.29 1.587-.871 2.97-1.784 4.086-.921 1.126-2.08 1.86-3.328 2.292-2.283.789-4.872.574-7.156.11V8.322Z",clipRule:"evenodd"})})}return n.jsx(c.Fallback,{ref:d,role:"presentation",className:q({size:o,variant:l}),...r,children:x.getInitials(t)})});y.displayName=c.Fallback.displayName;exports.AvatarFallback=y;