@payfit/unity-components 0.0.0-alpha.11

package/dist/cjs/components/dialog/Dialog.d.cts

@@ -0,0 +1,117 @@
+import { PropsWithChildren } from 'react';
+import { VariantProps } from 'tailwind-variants';
+import { DialogTrigger } from 'react-aria-components';
+export declare const dialog: import('tailwind-variants').TVReturnType<{
+    [key: string]: {
+        [key: string]: import('tailwind-merge').ClassNameValue | {
+            content?: import('tailwind-merge').ClassNameValue;
+            overlay?: import('tailwind-merge').ClassNameValue;
+            wrapper?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {
+    [x: string]: {
+        [x: string]: import('tailwind-merge').ClassNameValue | {
+            content?: import('tailwind-merge').ClassNameValue;
+            overlay?: import('tailwind-merge').ClassNameValue;
+            wrapper?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {}, {
+    overlay: string[];
+    wrapper: string[];
+    content: string[];
+}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
+    [key: string]: {
+        [key: string]: import('tailwind-merge').ClassNameValue | {
+            content?: import('tailwind-merge').ClassNameValue;
+            overlay?: import('tailwind-merge').ClassNameValue;
+            wrapper?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {}>, {
+    [key: string]: {
+        [key: string]: import('tailwind-merge').ClassNameValue | {
+            content?: import('tailwind-merge').ClassNameValue;
+            overlay?: import('tailwind-merge').ClassNameValue;
+            wrapper?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {}, {
+    overlay: string[];
+    wrapper: string[];
+    content: string[];
+}, import('tailwind-variants').TVReturnType<unknown, {
+    overlay: string[];
+    wrapper: string[];
+    content: string[];
+}, undefined, import('tailwind-variants/dist/config.js').TVConfig<unknown, {
+    [key: string]: {
+        [key: string]: import('tailwind-merge').ClassNameValue | {
+            content?: import('tailwind-merge').ClassNameValue;
+            overlay?: import('tailwind-merge').ClassNameValue;
+            wrapper?: import('tailwind-merge').ClassNameValue;
+        };
+    };
+} | {}>, unknown, unknown, undefined>>;
+interface DialogProps extends PropsWithChildren<VariantProps<typeof dialog>> {
+    /** aria-label has to be defined if the dialog does not have a visible label*/
+    'aria-label'?: string;
+    /** (optional) modal opened by default or not **If it is set to true, the closing should be handled from outside** /*/
+    isOpen?: boolean;
+    /** it is used for controlled mode (need to be used with isOpen property) */
+    onOpenChange?: (isOpen: boolean) => void;
+    /** if false it does not allow to close the modal when click outside, default: true*/
+    isDismissable?: boolean;
+}
+/**
+ * The Dialog component provides a modal interface for displaying important information and gathering user input
+ * without requiring navigation to a different page. It maintains context and focus while demanding attention.
+ *
+ * Use Dialog when you need to capture user attention, gather critical input, or display important information
+ * that requires acknowledgment before proceeding.
+ *
+ * The Dialog consists of several parts that work together:
+ * - `DialogTitle`: Displays the title of the dialog
+ * - `DialogContent`: Contains the main content of the dialog (required)
+ * - `DialogActions`: Contains action buttons for user interaction
+ * - `DialogButton`: Handles specific actions (close, confirm, or danger)
+ * @param props - The props for the Dialog component
+ * @see {@link DialogProps} for all available props
+ * @example
+ * ```tsx
+ * import {
+ *   Dialog,
+ *   DialogTrigger,
+ *   DialogTitle,
+ *   DialogContent,
+ *   DialogActions,
+ *   DialogButton
+ * } from '@payfit/unity-components'
+ *
+ * function BasicExample() {
+ *   return (
+ *     <DialogTrigger>
+ *       <Button>Open dialog</Button>
+ *       <Dialog>
+ *         <DialogTitle>Important information</DialogTitle>
+ *         <DialogContent>
+ *           This content requires your attention before proceeding.
+ *         </DialogContent>
+ *         <DialogActions>
+ *           <DialogButton variant="close">Cancel</DialogButton>
+ *           <DialogButton variant="confirm">Confirm</DialogButton>
+ *         </DialogActions>
+ *       </Dialog>
+ *     </DialogTrigger>
+ *   )
+ * }
+ * ```
+ * @remarks
+ * [API Docs](https://unity-components.payfit.io/?path=/docs/feedback-dialog--docs) • [Design Docs](https://www.payfit.design/24f360409/p/01f5dc-dialog)
+ */
+export declare function Dialog({ children, isOpen, onOpenChange, isDismissable, ...rest }: DialogProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace Dialog {
+    var displayName: string;
+}
+export { DialogTrigger };

package/dist/cjs/components/dialog/parts/DialogActions/DialogButton.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),g=require("react"),p=require("react-aria-components"),i=require("../../../button/Button.cjs"),c=({children:r,variant:l,onPress:t,isLoading:s,icon:n})=>{const o=g.useContext(p.OverlayTriggerStateContext);switch(l){case"close":const u=t;return a.jsx(i.Button,{prefixIcon:n,variant:"secondary",onPress:e=>{u&&u(e),o==null||o.close()},children:r});case"confirm":return a.jsx(i.Button,{prefixIcon:n,variant:"primary",isLoading:s,onPress:e=>{t&&t(e)},children:r});case"danger":return a.jsx(i.Button,{variant:"primary",color:"danger",isLoading:s,prefixIcon:n??"WarningCircleOutlined",onPress:e=>{t&&t(e)},children:r})}};c.displayName="DialogButton";exports.DialogButton=c;

package/dist/cjs/components/dialog/parts/DialogActions/DialogButton.d.cts

@@ -0,0 +1,22 @@
+import { UnityIcon } from '@payfit/unity-icons';
+import { PropsWithChildren } from 'react';
+import { ButtonProps } from '../../../button/Button.cjs';
+type ButtonVariant = 'close' | 'confirm' | 'danger';
+type OnPressParameters = Parameters<NonNullable<ButtonProps['onPress']>>[0];
+export type DialogButtonProps<T extends ButtonVariant> = {
+    /** the different variants for the button */
+    variant: T;
+    /** the icon, it is a discouraged practice, except for `danger` variant which has a `WarningCircleOutlined` as default */
+    icon?: UnityIcon;
+    isLoading?: T extends 'close' ? never : ButtonProps['isLoading'];
+    onPress?: T extends 'close' ? ButtonProps['onPress'] : ButtonProps['onPress'] | ((e: OnPressParameters) => Promise<OnPressParameters>);
+};
+/**
+ * A `DialogButton` is a button which has to be included into `DialogActions` container
+ *
+ */
+declare const DialogButton: {
+    <T extends ButtonVariant>({ children, variant, onPress, isLoading, icon, }: PropsWithChildren<DialogButtonProps<T>>): import("react/jsx-runtime").JSX.Element | undefined;
+    displayName: string;
+};
+export { DialogButton };

package/dist/cjs/components/dialog/parts/DialogActions.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),t=({children:e})=>s.jsx("div",{className:"uy-flex uy-justify-end uy-items-start uy-gap-100 uy-self-stretch","data-dd-privacy":"allow",children:e});t.displayName="DialogActions";exports.DialogActions=t;

package/dist/cjs/components/dialog/parts/DialogActions.d.cts

@@ -0,0 +1,6 @@
+import { PropsWithChildren } from 'react';
+declare const DialogActions: {
+    ({ children }: PropsWithChildren<object>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { DialogActions };

package/dist/cjs/components/dialog/parts/DialogContent.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),s=require("react"),t=require("react-aria-components"),o=s.forwardRef((e,n)=>{[e]=t.useContextProps(e,n,t.DialogContext);const{children:a,...r}=e;return i.jsx("div",{id:r["aria-describedby"],"data-dd-privacy":"mask",className:"uy-typography-body uy-text-content-neutral",children:a})});o.displayName="DialogContent";exports.DialogContent=o;

package/dist/cjs/components/dialog/parts/DialogContent.d.cts

@@ -0,0 +1,4 @@
+declare const DialogContent: import('react').ForwardRefExoticComponent<object & {
+    children?: import('react').ReactNode | undefined;
+} & import('react').RefAttributes<HTMLElement>>;
+export { DialogContent };

package/dist/cjs/components/dialog/parts/DialogTitle.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),i=require("react-aria-components"),e=({children:t})=>a.jsx(i.Heading,{slot:"title",className:"uy-typography-h2","data-dd-privacy":"allow",children:t});e.displayName="DialogTitle";exports.DialogTitle=e;

package/dist/cjs/components/dialog/parts/DialogTitle.d.cts

@@ -0,0 +1,6 @@
+import { PropsWithChildren } from 'react';
+declare const DialogTitle: {
+    ({ children }: PropsWithChildren<object>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { DialogTitle };

package/dist/cjs/components/fieldset/Fieldset.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),m=require("react"),b=require("react-aria"),x=require("tailwind-variants"),i=x.tv({slots:{base:"uy-p-0 uy-m-0 [&+&]:uy-mt-500 [&:last-of-type]:uy-mb-500",legend:"uy-typography-h3 uy-text-content-neutral",description:"uy-block uy-typography-body uy-mt-100 uy-text-content-neutral",fieldsContainer:"uy-flex uy-flex-col uy-gap-250"},variants:{isLegendHidden:{true:{legend:"uy-sr-only",description:"uy-sr-only",fieldsContainer:"uy-mt-0"},false:{legend:"uy-block",description:"uy-block",fieldsContainer:"uy-mt-300"}}},defaultVariants:{isLegendHidden:!1}}),d=m.forwardRef(({children:n,...l},r)=>{const s=b.useId(),{legend:a,description:t,isLegendHidden:o,...c}=l,{base:y,legend:u,description:p,fieldsContainer:f}=i({isLegendHidden:o}),g=t?`${s}-fieldset-description`:void 0;return e.jsxs("fieldset",{"data-dd-privacy":"allow",...c,ref:r,className:y(),"aria-describedby":g,children:[e.jsx("legend",{className:u(),children:a}),t&&e.jsx("span",{id:`${s}-fieldset-description`,"data-fieldset-slot":"description",className:p(),children:t}),e.jsx("div",{className:f(),children:n})]})});d.displayName="Fieldset";exports.Fieldset=d;exports.fieldset=i;

package/dist/cjs/components/fieldset/Fieldset.d.cts

@@ -0,0 +1,150 @@
+import { PropsWithChildren } from 'react';
+import { VariantProps } from 'tailwind-variants';
+export declare const fieldset: import('tailwind-variants').TVReturnType<{
+    isLegendHidden: {
+        true: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+        false: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+    };
+}, {
+    base: string;
+    legend: string;
+    description: string;
+    fieldsContainer: string;
+}, undefined, import('tailwind-variants/dist/config.js').TVConfig<{
+    isLegendHidden: {
+        true: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+        false: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+    };
+}, {
+    isLegendHidden: {
+        true: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+        false: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+    };
+}>, {
+    isLegendHidden: {
+        true: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+        false: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+    };
+}, {
+    base: string;
+    legend: string;
+    description: string;
+    fieldsContainer: string;
+}, import('tailwind-variants').TVReturnType<{
+    isLegendHidden: {
+        true: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+        false: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+    };
+}, {
+    base: string;
+    legend: string;
+    description: string;
+    fieldsContainer: string;
+}, undefined, import('tailwind-variants/dist/config.js').TVConfig<{
+    isLegendHidden: {
+        true: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+        false: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+    };
+}, {
+    isLegendHidden: {
+        true: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+        false: {
+            legend: string;
+            description: string;
+            fieldsContainer: string;
+        };
+    };
+}>, unknown, unknown, undefined>>;
+export interface FieldsetProps extends PropsWithChildren<VariantProps<typeof fieldset>> {
+    /**
+     * The legend of the fieldset.
+     */
+    legend: string;
+    /**
+     * An optional description of the fieldset.
+     */
+    description?: string;
+    /**
+     * Whether to hide the legend of the fieldset.
+     */
+    isLegendHidden?: boolean;
+}
+/**
+ * The `Fieldset` component groups related form fields together with an accessible structure.
+ * It provides visual organization and semantic HTML for form sections, making forms more understandable and navigable.
+ * @param {FieldsetProps} props - The props for the `Fieldset` component
+ * @see {@link FieldsetProps} for all available props
+ * @example
+ * ```tsx
+ * import { Fieldset } from '@payfit/unity-components'
+ *
+ * function Example() {
+ *   return (
+ *     <Fieldset
+ *       legend="Personal Information"
+ *       description="Please provide your contact details"
+ *       isLegendHidden={false}
+ *     >
+ *       <TextField name="firstName" label="First name" />
+ *       <TextField name="lastName" label="Last name" />
+ *     </Fieldset>
+ *   )
+ * }
+ * ```
+ * @remarks
+ * [API](https://unity-components.payfit.io/?path=/docs/forms-fieldset--docs) • [Design docs](https://www.payfit.design/24f360409/p/1151cf-form-layout)
+ */
+declare const Fieldset: import('react').ForwardRefExoticComponent<FieldsetProps & import('react').RefAttributes<HTMLFieldSetElement>>;
+export { Fieldset };

package/dist/cjs/components/fieldset/parts/FieldGroup.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),d=require("react"),e=d.forwardRef(({children:r,...u},o)=>i.jsx("div",{...u,ref:o,role:"group",className:"uy-grid uy-grid-cols-1 uy-gap-y-250 md:uy-grid-cols-2 md:uy-gap-x-200",children:r}));e.displayName="FieldGroup";exports.FieldGroup=e;

package/dist/cjs/components/fieldset/parts/FieldGroup.d.cts

@@ -0,0 +1,27 @@
+/**
+ * The `FieldGroup` component arranges form fields in a responsive grid layout within a Fieldset.
+ * It optimizes space by displaying fields side-by-side on larger screens while stacking them on mobile devices.
+ * @param {PropsWithChildren<object>} props - The props for the `FieldGroup` component
+ * @example
+ * ```tsx
+ * import { Fieldset, FieldGroup } from '@payfit/unity-components'
+ *
+ * function Example() {
+ *   return (
+ *     <Fieldset legend="Personal Information">
+ *       <FieldGroup>
+ *         <TextField name="firstName" label="First name" />
+ *         <TextField name="lastName" label="Last name" />
+ *       </FieldGroup>
+ *       <TextField name="email" label="Email" />
+ *     </Fieldset>
+ *   )
+ * }
+ * ```
+ * @remarks
+ * [API](https://unity-components.payfit.io/?path=/docs/forms-fieldset-fieldgroup--docs) • [Design docs](https://www.payfit.design/24f360409/p/1151cf-form-layout)
+ */
+declare const FieldGroup: import('react').ForwardRefExoticComponent<object & {
+    children?: import('react').ReactNode | undefined;
+} & import('react').RefAttributes<HTMLDivElement>>;
+export { FieldGroup };

package/dist/cjs/components/flex/Flex.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("react/jsx-runtime"),j=require("react"),q=require("./Flex.variants.cjs"),e=j.forwardRef(({asElement:t="div",children:s,className:r,inline:a,direction:c,isReversed:l,wrap:n,gap:o,gapX:i,gapY:u,justify:x,align:d,alignContent:m,...f},y)=>{const F=q.flex({inline:a,direction:c,isReversed:l,wrap:n,gap:o,gapX:i,gapY:u,justify:x,align:d,alignContent:m,className:r});return S.jsx(t,{ref:y,className:F,...f,children:s})});e.displayName="Flex";const v=e;exports.Flex=e;exports.Stack=v;

package/dist/cjs/components/flex/Flex.d.cts

@@ -0,0 +1,64 @@
+import { VariantProps } from 'tailwind-variants';
+import { flex } from './Flex.variants.cjs';
+export type FlexContainerVariantProps = VariantProps<typeof flex>;
+type ElementType = 'div' | 'span' | 'section' | 'nav' | 'aside' | 'header' | 'footer' | 'main' | 'article';
+export interface FlexProps {
+    /** Render the flex container as a specific HTML element */
+    asElement?: ElementType;
+    /** Create an inline flex container instead of a block-level container */
+    inline?: FlexContainerVariantProps['inline'];
+    /** Set the main axis direction. Use 'row' for horizontal or 'col' for vertical layout */
+    direction?: FlexContainerVariantProps['direction'];
+    /** Reverse the flow of items along the main axis */
+    isReversed?: FlexContainerVariantProps['isReversed'];
+    /** Control how items wrap when they exceed container size. Use 'wrap', 'wrap-reverse', or 'nowrap' */
+    wrap?: FlexContainerVariantProps['wrap'];
+    /** Add equal spacing between items in both directions */
+    gap?: FlexContainerVariantProps['gap'];
+    /** Add horizontal spacing between items */
+    gapX?: FlexContainerVariantProps['gapX'];
+    /** Add vertical spacing between items */
+    gapY?: FlexContainerVariantProps['gapY'];
+    /** Align items along the main axis. Use 'start', 'center', 'end', 'between', 'around', or 'evenly' */
+    justify?: FlexContainerVariantProps['justify'];
+    /** Align items along the cross axis. Use 'start', 'center', 'end', 'baseline', or 'stretch' */
+    align?: FlexContainerVariantProps['align'];
+    /** Align wrapped lines. Use 'start', 'center', 'end', 'between', 'around', or 'evenly' */
+    alignContent?: FlexContainerVariantProps['alignContent'];
+    /** Add custom classes to the flex container */
+    className?: string;
+    /** The content to be laid out using flexbox */
+    children?: React.ReactNode;
+}
+/**
+ * The Flex component provides a powerful and intuitive way to create flexible layouts using CSS Flexbox.
+ * Use it to create rows, columns, and complex layouts with precise control over item alignment and spacing.
+ *
+ * Key features:
+ * - Create row or column layouts with the `direction` prop
+ * - Control spacing with `gap`, `gapX`, and `gapY` props
+ * - Align items with `justify` and `align` props
+ * - Control wrapping behavior with the `wrap` prop
+ * - Reverse item order with `isReversed`
+ *
+ * Use `FlexItem` components inside `Flex` to control individual item behavior.
+ *
+ * > Note: `Flex` and `FlexItem` also export the aliases `Stack` and `StackItem`. We recommend you use `Flex` and `FlexItem` for clarity.
+ * @example
+ * ```tsx
+ * // Create a basic row layout with gap
+ * <Flex gap="100">
+ *   <div>Item 1</div>
+ *   <div>Item 2</div>
+ * </Flex>
+ *
+ * // Create a column layout with items centered
+ * <Flex direction="col" align="center" justify="center">
+ *   <div>Item 1</div>
+ *   <div>Item 2</div>
+ * </Flex>
+ * ```
+ */
+export declare const Flex: import('react').ForwardRefExoticComponent<FlexProps & Omit<import('react').HTMLAttributes<HTMLElement>, keyof FlexProps> & import('react').RefAttributes<HTMLDivElement>>;
+export declare const Stack: import('react').ForwardRefExoticComponent<FlexProps & Omit<import('react').HTMLAttributes<HTMLElement>, keyof FlexProps> & import('react').RefAttributes<HTMLDivElement>>;
+export {};

package/dist/cjs/components/flex/Flex.variants.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("tailwind-variants"),e=s.tv({base:"uy-flex",variants:{inline:{true:"uy-inline-flex",false:"uy-flex"},direction:{row:"uy-flex-row",col:"uy-flex-col"},isReversed:{true:null,false:null},wrap:{wrap:"uy-flex-wrap","wrap-reverse":"uy-flex-wrap-reverse",nowrap:"uy-flex-nowrap"},gap:{0:"uy-gap-0",25:"uy-gap-25",50:"uy-gap-50",75:"uy-gap-75",100:"uy-gap-100",125:"uy-gap-125",150:"uy-gap-150",200:"uy-gap-200",250:"uy-gap-250",300:"uy-gap-300",400:"uy-gap-400",500:"uy-gap-500",600:"uy-gap-600",800:"uy-gap-800",1e3:"uy-gap-1000"},gapX:{0:"uy-gap-x-0",25:"uy-gap-x-25",50:"uy-gap-x-50",75:"uy-gap-x-75",100:"uy-gap-x-100",125:"uy-gap-x-125",150:"uy-gap-x-150",200:"uy-gap-x-200",250:"uy-gap-x-250",300:"uy-gap-x-300",400:"uy-gap-x-400",500:"uy-gap-x-500",600:"uy-gap-x-600",800:"uy-gap-x-800",1e3:"uy-gap-x-1000"},gapY:{0:"uy-gap-y-0",25:"uy-gap-y-25",50:"uy-gap-y-50",75:"uy-gap-y-75",100:"uy-gap-y-100",125:"uy-gap-y-125",150:"uy-gap-y-150",200:"uy-gap-y-200",250:"uy-gap-y-250",300:"uy-gap-y-300",400:"uy-gap-y-400",500:"uy-gap-y-500",600:"uy-gap-y-600",800:"uy-gap-y-800",1e3:"uy-gap-y-1000"},justify:{start:"uy-justify-start",end:"uy-justify-end",center:"uy-justify-center",between:"uy-justify-between",around:"uy-justify-around",evenly:"uy-justify-evenly"},align:{start:"uy-items-start",end:"uy-items-end",center:"uy-items-center",baseline:"uy-items-baseline",stretch:"uy-items-stretch"},alignContent:{start:"uy-content-start",end:"uy-content-end",center:"uy-content-center",between:"uy-content-between",around:"uy-content-around",evenly:"uy-content-evenly"}},defaultVariants:{inline:!1,direction:"row",wrap:"nowrap",justify:"start",align:"stretch",isReversed:!1},compoundVariants:[{isReversed:!0,direction:"row",className:"uy-flex-row-reverse"},{isReversed:!0,direction:void 0,className:"uy-flex-row-reverse"},{isReversed:!0,direction:"col",className:"uy-flex-col-reverse"}]},{responsiveVariants:["sm","md","lg","xl"]}),a=s.tv({variants:{grow:{0:"uy-grow-0",1:"uy-grow"},shrink:{0:"uy-shrink-0",1:"uy-shrink"},basis:{auto:"uy-basis-auto",min:"uy-basis-min",max:"uy-basis-max",fit:"uy-basis-fit",full:"uy-basis-full","1/2":"uy-basis-1/2","1/3":"uy-basis-1/3","2/3":"uy-basis-2/3","1/4":"uy-basis-1/4","2/4":"uy-basis-2/4","3/4":"uy-basis-3/4","1/6":"uy-basis-1/6","2/6":"uy-basis-2/6","3/6":"uy-basis-3/6","4/6":"uy-basis-4/6","5/6":"uy-basis-5/6","1/12":"uy-basis-1/12","2/12":"uy-basis-2/12","3/12":"uy-basis-3/12","4/12":"uy-basis-4/12","5/12":"uy-basis-5/12","6/12":"uy-basis-6/12","7/12":"uy-basis-7/12","8/12":"uy-basis-8/12","9/12":"uy-basis-9/12","10/12":"uy-basis-10/12","11/12":"uy-basis-11/12",0:"uy-basis-0",25:"uy-basis-25",50:"uy-basis-50",75:"uy-basis-75",100:"uy-basis-100",125:"uy-basis-125",150:"uy-basis-150",200:"uy-basis-200",250:"uy-basis-250",300:"uy-basis-300",400:"uy-basis-400",500:"uy-basis-500",600:"uy-basis-600",800:"uy-basis-800",1e3:"uy-basis-1000"},order:{first:"uy-order-first",last:"uy-order-last",none:"uy-order-none"},self:{auto:"uy-self-auto",start:"uy-self-start",end:"uy-self-end",center:"uy-self-center",stretch:"uy-self-stretch",baseline:"uy-self-baseline"}},defaultVariants:{grow:0,shrink:1,order:"none",self:"auto"}},{responsiveVariants:["sm","md","lg","xl"]});exports.flex=e;exports.flexItem=a;