@payfit/unity-components 0.0.0-alpha.9 → 1.0.0

package/dist/cjs/components/payfit-brand/PayFitPreprod.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),o=require("react"),p=require("../../hooks/use-id.js"),m=require("../badge/Badge.js"),h=o.forwardRef(({label:i,description:a,env:t,...d},l)=>{const e=p(),r=`payfit-preprod-title-${e}`,s=`payfit-preprod-desc-${e}`,n={focusable:!1,role:"img","aria-labelledby":r,...a&&{"aria-describedby":s}},v={...d,...n};return c.jsxs("span",{className:"uy-flex uy-gap-200 uy-items-center",children:[c.jsxs("svg",{...v,xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 104 32",fill:"none",ref:l,width:104,height:32,className:"uy-min-w-[104px]",children:[c.jsx("title",{id:r,children:i}),a&&c.jsx("desc",{id:s,children:a}),c.jsx("path",{fillRule:"evenodd",fill:"#F76B15",d:"M16 32C7.164 32 0 24.836 0 16S7.164 0 16 0s16 7.164 16 16-7.164 16-16 16Zm-.218-10.31v-3.18c0-.092.072-.183.163-.183h3.746a4.885 4.885 0 0 0 4.69-5.09 4.893 4.893 0 0 0-4.708-4.692h-9.127c-.2 0-.364.164-.364.364v12.836a2.801 2.801 0 0 0 5.6 0c.018-.036.018-.054 0-.054Zm.182-7.545h3.527a.73.73 0 0 0 .727-.727.73.73 0 0 0-.727-.727h-4.782c-.2 0-.364.163-.364.364v8.672c0 .746-.618 1.364-1.363 1.364a1.374 1.374 0 0 1-1.364-1.364V10.164c0-.091.073-.182.164-.182h7.708c1.91-.037 3.492 1.49 3.51 3.382.036 1.909-1.49 3.49-3.382 3.509h-3.654c-.091 0-.182-.073-.182-.164V14.327c0-.09.072-.163.182-.181Z",clipRule:"evenodd"}),c.jsx("path",{fill:"#1C2024",d:"M76.49 11.945h-1.472c-.163 0-.309.11-.345.255-.073.218-.128.364-.146.455-.582 1.781-1.472 4.472-2.636 8.054-.018.055-.091.255-.237.582-.036.09-.145.127-.236.09a.219.219 0 0 1-.09-.09 7.862 7.862 0 0 1-.237-.582c-1.2-3.69-2.091-6.454-2.673-8.31-.018-.054-.036-.126-.054-.18a.372.372 0 0 0-.346-.255h-1.454a.365.365 0 0 0-.346.472c.018.055.036.091.055.146.909 2.582 2.272 6.436 4.09 11.582 0 .018 0 .018.019.036a.443.443 0 0 1 0 .218c0 .018 0 .018-.018.037-.019.072-.055.163-.073.236a1.805 1.805 0 0 1-1.691 1.2h-1.527c-.2 0-.364.164-.364.364v1.218c0 .2.164.363.364.363H68.6a3.72 3.72 0 0 0 3.418-2.236c.018-.055.037-.11.073-.164.018-.054 1.09-3.09 4.673-13.109.054-.127-.019-.29-.146-.345H76.6c-.055-.018-.073-.037-.11-.037ZM57.11 22.291c.345.109.708.163 1.072.163a4.232 4.232 0 0 0 2.89-1.2 2.949 2.949 0 0 0 .855-2.145v-.945a.163.163 0 0 0-.163-.164h-.037c-.182.018-.272.018-.272.018l-1.146.146-2.273.345c-1.218.2-1.963.69-2.2 1.455a1.923 1.923 0 0 0-.09.563c.018.818.581 1.527 1.363 1.764Zm6.854.8v.727c0 .2-.164.364-.364.364h-1.182a.365.365 0 0 1-.364-.364l-.018-1.2c0-.018-.018-.036-.018-.054a.088.088 0 0 0-.127 0 1.04 1.04 0 0 0-.2.2c-.946.945-2.236 1.418-3.91 1.418-1.2 0-2.181-.327-2.945-.964-.763-.636-1.127-1.527-1.127-2.654A3.316 3.316 0 0 1 54.036 19c.2-.418.491-.764.873-1.018a3.876 3.876 0 0 1 1.055-.546A5.45 5.45 0 0 1 57 17.164c1.764-.255 2.71-.382 2.89-.419.146-.018.728-.09 1.728-.236.073-.018.127-.018.2-.018.091-.018.164-.091.164-.182v-.51c0-.763-.2-1.363-.6-1.78-.4-.42-1.146-.637-2.218-.637-.491 0-.982.054-1.455.2-.364.109-.673.309-.927.6-.164.218-.31.436-.4.69-.018.055-.037.11-.055.183 0 .018 0 .036-.018.054a.371.371 0 0 1-.364.29h-1.363a.378.378 0 0 1-.346-.38v-.074c.019-.145.037-.254.055-.345.09-.345.236-.691.418-1a3.54 3.54 0 0 1 .818-.91c.437-.29.91-.508 1.418-.654a8.41 8.41 0 0 1 2.128-.254c3.29 0 4.89 1.309 4.89 3.963v7.346Zm26.963-10.873v11.564c0 .2.164.363.364.363h1.473c.2 0 .363-.163.363-.363V12.218c0-.2-.163-.364-.363-.364H91.29c-.2 0-.364.164-.364.364Zm0-3.673v1.473c0 .2.164.364.364.364h1.473c.2 0 .363-.164.363-.364V8.545c0-.2-.163-.363-.363-.363H91.29c-.2 0-.364.163-.364.363ZM100 13.782h3.109c.2 0 .364-.164.364-.364V12.2c0-.2-.164-.364-.364-.364H100c-.09 0-.182-.072-.182-.163V8.545c0-.2-.163-.363-.364-.363h-1.472c-.2 0-.364.163-.364.363v3.128c0 .09-.073.181-.163.181H96.09c-.2 0-.364.164-.364.364v1.218c0 .2.164.364.364.364h1.345c.091 0 .182.073.182.164V20.545c.073 2 1.71 3.6 3.709 3.6h1.655c.2 0 .363-.163.363-.363v-1.218c0-.2-.163-.364-.363-.364h-1.655a1.525 1.525 0 0 1-1.527-1.527v-6.71c.018-.108.09-.181.2-.181Zm-47.964-.637a4.96 4.96 0 0 0-4.854-4.963h-7c-.2 0-.364.163-.364.363v15.237c0 .2.164.363.364.363h1.472c.2 0 .364-.163.364-.363v-5.473c0-.09.073-.182.164-.182h5a4.975 4.975 0 0 0 4.854-4.982Zm-1.927 0a3.01 3.01 0 0 1-3.018 3.019h-4.873c-.09 0-.182-.073-.182-.164v-5.691c0-.09.073-.182.164-.182h4.891a3.01 3.01 0 0 1 3.018 3.018Zm31.2 4.928h5.527c.2 0 .364-.164.364-.364v-1.218c0-.2-.164-.364-.364-.364H81.31c-.09 0-.182-.072-.182-.163v-5.655c0-.09.073-.182.164-.182h6.8c.2 0 .364-.163.364-.363V8.545c0-.2-.164-.363-.364-.363h-8.8c-.2 0-.364.163-.364.363v15.237c0 .2.164.363.364.363h1.473c.2 0 .363-.163.363-.363v-5.527c0-.11.073-.182.182-.182Z"})]}),c.jsx(m.Badge,{variant:"warning",children:t})]})});h.displayName="PayFitBrandPreprod";exports.PayFitBrandPreprod=h;

package/dist/cjs/components/pill/Pill.d.ts

@@ -1,143 +0,0 @@
-import { AriaAttributes } from 'react';
-import { VariantProps } from 'tailwind-variants';
-declare const pill: import('tailwind-variants').TVReturnType<{
-    variant: {
-        critical: string;
-        info: string;
-        neutral: string;
-    };
-    shape: {
-        circle: string;
-        pill: string;
-    };
-    isVisible: {
-        true: string;
-        false: string;
-    };
-}, undefined, "uy-min-w-200 uy-max-w-400 uy-inline-flex uy-items-center uy-justify-center uy-text-center uy-typography-body-small", import('tailwind-variants/dist/config').TVConfig<{
-    variant: {
-        critical: string;
-        info: string;
-        neutral: string;
-    };
-    shape: {
-        circle: string;
-        pill: string;
-    };
-    isVisible: {
-        true: string;
-        false: string;
-    };
-}, {
-    variant: {
-        critical: string;
-        info: string;
-        neutral: string;
-    };
-    shape: {
-        circle: string;
-        pill: string;
-    };
-    isVisible: {
-        true: string;
-        false: string;
-    };
-}>, {
-    variant: {
-        critical: string;
-        info: string;
-        neutral: string;
-    };
-    shape: {
-        circle: string;
-        pill: string;
-    };
-    isVisible: {
-        true: string;
-        false: string;
-    };
-}, undefined, import('tailwind-variants').TVReturnType<{
-    variant: {
-        critical: string;
-        info: string;
-        neutral: string;
-    };
-    shape: {
-        circle: string;
-        pill: string;
-    };
-    isVisible: {
-        true: string;
-        false: string;
-    };
-}, undefined, "uy-min-w-200 uy-max-w-400 uy-inline-flex uy-items-center uy-justify-center uy-text-center uy-typography-body-small", import('tailwind-variants/dist/config').TVConfig<{
-    variant: {
-        critical: string;
-        info: string;
-        neutral: string;
-    };
-    shape: {
-        circle: string;
-        pill: string;
-    };
-    isVisible: {
-        true: string;
-        false: string;
-    };
-}, {
-    variant: {
-        critical: string;
-        info: string;
-        neutral: string;
-    };
-    shape: {
-        circle: string;
-        pill: string;
-    };
-    isVisible: {
-        true: string;
-        false: string;
-    };
-}>, unknown, unknown, undefined>>;
-export type PillProps = Partial<Pick<HTMLDivElement, 'id'>> & Required<Pick<AriaAttributes, 'aria-label'>> & Pick<AriaAttributes, 'aria-details' | 'aria-describedby' | 'aria-live'> & {
-    /** The value to be displayed inside the Pill */
-    value: number;
-    /**
-     * The variant of the Pill, determining its color scheme
-     * @default 'critical'
-     */
-    variant?: VariantProps<typeof pill>['variant'];
-    /**
-     * Determines if the Pill is visible or not
-     * @default true
-     */
-    isVisible?: VariantProps<typeof pill>['isVisible'];
-    /**
-     * The maximum number of digits to display. If the value exceeds this limit, it will be truncated and a '+' will be appended
-     * @default 2
-     */
-    maxDigits?: number;
-};
-/**
- * The Pill component displays a count of notifications or other numerical values.
- */
-declare const Pill: import('react').ForwardRefExoticComponent<Partial<Pick<HTMLDivElement, "id">> & Required<Pick<AriaAttributes, "aria-label">> & Pick<AriaAttributes, "aria-describedby" | "aria-details" | "aria-live"> & {
-    /** The value to be displayed inside the Pill */
-    value: number;
-    /**
-     * The variant of the Pill, determining its color scheme
-     * @default 'critical'
-     */
-    variant?: VariantProps<typeof pill>["variant"];
-    /**
-     * Determines if the Pill is visible or not
-     * @default true
-     */
-    isVisible?: VariantProps<typeof pill>["isVisible"];
-    /**
-     * The maximum number of digits to display. If the value exceeds this limit, it will be truncated and a '+' will be appended
-     * @default 2
-     */
-    maxDigits?: number;
-} & import('react').RefAttributes<HTMLSpanElement>>;
-export { Pill };

package/dist/cjs/components/pill/Pill.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("react/jsx-runtime"),o=require("react"),y=require("tailwind-variants"),d=y.tv({base:"uy-min-w-200 uy-max-w-400 uy-inline-flex uy-items-center uy-justify-center uy-text-center uy-typography-body-small",variants:{variant:{critical:"uy-bg-surface-danger uy-text-content-inverted",info:"uy-bg-surface-primary uy-text-content-inverted",neutral:"uy-bg-surface-neutral-lowest uy-text-content-neutral"},shape:{circle:"uy-rounded-circle",pill:"uy-rounded-pill uy-px-50"},isVisible:{true:"uy-visible",false:"uy-invisible"}},defaultVariants:{variant:"critical",shape:"pill",isVisible:!0}}),p=(e,i)=>{const t=10**i-1;return e>t?`${t}+`:e.toString()},r=o.forwardRef(({variant:e="critical",isVisible:i=!0,maxDigits:t=2,value:l,...n},u)=>{const a=p(Math.abs(l),t),s=d({variant:e,isVisible:i,shape:a.length===1?"circle":"pill"});return c.jsx("span",{"data-dd-privacy":"allow",...n,ref:u,role:"status",className:s,"aria-atomic":"true",children:a})});r.displayName="Pill";exports.Pill=r;

package/dist/cjs/components/progress-bar/ProgressBar.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),c=require("react"),m=require("react-aria-components"),f=require("tailwind-variants"),b=f.tv({slots:{base:"uy-rounded-150 uy-bg-surface-neutral-disabled uy-h-150 uy-top-[50%] uy-transform uy-translate-y-[-50%] uy-w-full",meter:"uy-rounded-l-150 uy-absolute uy-h-full uy-top-[50%] uy-transform uy-translate-y-[-50%] uy-rounded-full uy-bg-surface-success"},variants:{isFull:{true:{meter:"uy-rounded-r-150"}}},defaultVariants:{isFull:!1}}),a=c.forwardRef(({value:e,range:t=[0,100],...u},l)=>{const[n,s]=t,o=e>=s,{base:i,meter:d}=b({isFull:o});return r.jsx(m.ProgressBar,{ref:l,value:e,minValue:n,maxValue:s,"aria-label":u["aria-label"],"data-dd-privacy":"allow",children:({percentage:y})=>r.jsx("div",{className:i(),children:r.jsx("div",{className:d(),style:{width:`${y}%`}})})})});a.displayName="ProgressBar";exports.ProgressBar=a;

package/dist/cjs/components/select/Select.d.ts

@@ -1,52 +0,0 @@
-import { ForwardedRef, JSX, ReactNode } from 'react';
-import { SelectProps as AriaSelectProps } from 'react-aria-components';
-export interface SelectProps<T extends object> extends Omit<AriaSelectProps<T>, 'children' | 'label' | 'style' | 'className' | 'selectedKey' | 'onSelectionChange'> {
-    /** In static mode, contains <SelectOption /> and <SelectOptionGroup /> components, in dynamic mode, contains a function to render items passed to the component*/
-    children: ReactNode | ((item: T) => ReactNode);
-    /** In dynamic mode, contains the items to display in the select */
-    items?: Iterable<T>;
-    /** Whether the field is read-only */
-    isReadOnly?: boolean;
-    /** The value of the selected item */
-    value?: AriaSelectProps<T>['selectedKey'];
-    /** Function trigger when a item is selected */
-    onChange?: AriaSelectProps<T>['onSelectionChange'];
-    /** Whether the search input should be displayed or not */
-    isSearchable?: boolean;
-}
-type SelectComponent = (<TItems extends object>(props: SelectProps<TItems> & {
-    ref?: ForwardedRef<HTMLDivElement>;
-}) => JSX.Element) & {
-    displayName?: string;
-};
-/**
- * The `Select` component is used to render a list of options
- * @example
- * ```tsx
- * const schema = z.object({
- *  vegetable: z.string()
- * })
- *
- * function MyForm() {
- *   const { Form, FormField } = useUnityForm(schema)
- *
- *   return (
- *    <Form action={handleSubmit}>
- *      <FormField name="vegetable">
- *        <FormLabel>Vegetables</FormLabel>
- *        <FormHelperText>Select your favorite vegetable</FormHelperText>
- *        <FormControl>
- *          <Select>
- *            <SelectOption id="Cabbage">Cabbage</SelectOption>
- *            <SelectOption id="Broccoli">Broccoli</SelectOption>
- *           <SelectOption id="Carrots">Carrots</SelectOption>
- *          </Select>
- *        </FormControl>
- *      </FormField>
- *    </Form>
- *   )
- * }
- * ```
- */
-declare const Select: SelectComponent;
-export { Select };

package/dist/cjs/components/select/Select.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),a=require("react"),t=require("react-aria-components"),v=require("tailwind-variants"),q=require("./parts/SearchInput.js"),w=require("./parts/SelectButton.js"),N=v.tv({slots:{base:"uy-flex uy-flex-col uy-gap-100 uy-w-full",popover:"uy-rounded-75 uy-border uy-border-solid uy-border-border-neutral uy-w-[var(--trigger-width)] uy-bg-surface-neutral",listbox:"uy-overflow-y-auto uy-max-h-[296px] uy-pt-100 uy-pb-100 uy-pl-100 uy-pr-100"}}),B=({children:r,items:o,placeholder:s,name:p,isDisabled:n,isInvalid:c,isReadOnly:u,value:y,onChange:d,isSearchable:x=!1,...f},S)=>{const[b,m]=a.useState(!1),{contains:g}=t.useFilter({sensitivity:"base"}),{base:h,popover:j,listbox:l}=N();return e.jsxs(t.Select,{onOpenChange:m,...f,ref:S,className:h(),placeholder:n?void 0:s,name:p,isDisabled:n||u,isInvalid:c,selectedKey:y,onSelectionChange:d,children:[e.jsx(w.SelectButton,{isDisabled:n,isInvalid:c,isReadOnly:u,isOpen:b}),e.jsx(t.Popover,{offset:1,containerPadding:8,className:j(),children:x?e.jsxs(t.Autocomplete,{filter:g,children:[e.jsx(q.SearchInput,{}),e.jsx(t.ListBox,{items:o,className:l(),children:r})]}):e.jsx(t.ListBox,{items:o,className:l(),children:r})})]})},i=a.forwardRef(function(o,s){return B(o,s)});i.displayName="Select";exports.Select=i;

package/dist/cjs/components/select/parts/SearchInput.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),c=require("react"),t=require("react-aria-components"),l=require("react-intl"),y=require("tailwind-variants"),d=require("../../icon-button/CircularIconButton.js"),p=require("../../icon/Icon.js"),m=y.tv({slots:{base:"uy-flex uy-gap-100 uy-border uy-border-solid uy-pt-100 uy-pb-100 uy-pl-150 uy-pr-150 uy-rounded-75 uy-border-border-form-active uy-text-content-form-active uy-mt-100 uy-mb-100 uy-ml-100 uy-mr-100 uy-typography-body",input:"uy-flex-grow uy-outline-none [&::-webkit-search-cancel-button]:uy-hidden",button:"uy-text-content-neutral-enabled",separator:"uy-h-[1px] uy-bg-surface-neutral-lowest uy-w-full uy-mt-100"}}),r=c.forwardRef((b,n)=>{const u=l.useIntl(),{base:a,input:s,button:o,separator:i}=m();return e.jsxs(e.Fragment,{children:[e.jsxs(t.SearchField,{className:a(),ref:n,"data-dd-privacy":"mask",children:[e.jsx(p.Icon,{src:"MagnifyingGlassOutlined","aria-hidden":"true"}),e.jsx(t.Input,{className:s()}),e.jsx(d.CircularIconButton,{title:u.formatMessage({id:"unity:component:form-field:form-input:clear:title",defaultMessage:"Clear"}),className:o(),icon:"CloseOutlined"})]}),e.jsx("div",{"aria-hidden":"true",className:i()})]})});r.displayName="SearchInput";exports.SearchInput=r;

package/dist/cjs/components/select/parts/SelectButton.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("react"),o=require("react-aria-components"),m=require("react-intl"),p=require("tailwind-variants"),a=require("../../icon/Icon.js"),v=p.tv({slots:{base:"uy-flex uy-flex-row uy-gap-100 uy-pt-100 uy-pb-100 uy-pl-150 uy-pr-150 uy-rounded-100 uy-border-solid focus-visible:uy-ring-2 focus-visible:uy-ring-utility-focus-ring focus-visible:uy-ring-offset-2 uy-outline-none uy-border",selectValue:"uy-whitespace-nowrap uy-text-ellipsis uy-typography-body uy-flex-grow uy-text-left data-[placeholder]:uy-text-content-neutral-lowest",iconWrapper:"uy-flex uy-gap-50",icon:""},variants:{isDisabled:{true:{base:"uy-border-border-form-disabled uy-bg-surface-form-disabled",selectValue:"uy-text-content-form-disabled"}},isInvalid:{true:{base:"uy-border-border-form-error uy-bg-surface-form-error"}},isReadOnly:{true:{base:"uy-border-border-form-disabled",selectValue:"uy-text-content-form-readonly",icon:"uy-text-content-primary-disabled"}}},compoundVariants:[{isDisabled:!1,isInvalid:!1,isReadOnly:!1,className:{base:"uy-border-border-form-enabled hover:uy-border-border-form-hover uy-bg-surface-form-enabled hover:uy-bg-surface-form-hover active:uy-border-border-form-active",selectValue:"uy-text-content-neutral-enabled hover:uy-text-content-neutral-hover",icon:"uy-text-content-form-enabled hover:uy-text-content-form-hover"}}],defaultVariants:{isDisabled:!1,isInvalid:!1,isReadOnly:!1}}),s=b.forwardRef(({isDisabled:r,isInvalid:t,isReadOnly:n,isOpen:u},l)=>{const i=m.useIntl(),{base:c,selectValue:d,iconWrapper:y,icon:f}=v({isDisabled:r,isInvalid:t,isReadOnly:n});return e.jsxs(o.Button,{"data-dd-privacy":"mask",className:c(),ref:l,isDisabled:r,children:[e.jsx(o.SelectValue,{className:d()}),e.jsxs("div",{className:y(),children:[t&&e.jsx(a.Icon,{src:"WarningCircleOutlined",color:"content.form.invalid",alt:i.formatMessage({id:"unity:component:form-field:form-input:error:alt",defaultMessage:"Error"})}),e.jsx(a.Icon,{className:f(),"aria-hidden":"true",src:u?"CaretUpOutlined":"CaretDownOutlined"})]})]})});s.displayName="SelectButton";exports.SelectButton=s;

package/dist/cjs/components/select/parts/SelectOption.context.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),o=require("react"),t=o.createContext({isDisabled:void 0});function r({children:e,isDisabled:n}){return i.jsx(t.Provider,{value:{isDisabled:n},children:e})}function c(){const e=o.useContext(t);if(!e)throw new Error("useSelectOptionContext must be used within an SelectOptionProvider");return e}exports.SelectOptionContext=t;exports.SelectOptionProvider=r;exports.useSelectOptionContext=c;

package/dist/cjs/components/select/parts/SelectOption.d.ts

@@ -1,6 +0,0 @@
-import { default as React, ReactNode } from 'react';
-import { ListBoxItemProps } from 'react-aria-components';
-declare const SelectOption: React.ForwardRefExoticComponent<Omit<ListBoxItemProps<object>, "children"> & {
-    children: ReactNode;
-} & React.RefAttributes<HTMLDivElement>>;
-export { SelectOption };

package/dist/cjs/components/select/parts/SelectOption.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("react"),f=require("react-aria-components"),p=require("tailwind-variants"),x=require("../../icon/Icon.js"),b=require("./SelectOption.context.js"),m=t=>t&&typeof t=="object"&&"default"in t?t:{default:t},r=m(i),v=p.tv({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",variants:{isFocusVisible:{true:"uy-outline-offset-2 uy-outline-2 uy-outline-utility-focus-ring"},isHovered:{true:"uy-bg-surface-neutral-hover uy-text-content-neutral"},isPressed:{true:"uy-bg-surface-neutral-pressed uy-text-content-neutral-pressed"},isSelected:{true:"uy-bg-surface-neutral-active uy-text-content-neutral-active"},isDisabled:{true:"uy-text-content-neutral-disabled"}},compoundVariants:[{isFocusVisible:!1,isHovered:!1,isPressed:!1,isSelected:!1,isDisabled:!1,class:"uy-bg-surface-neutral-enabled uy-text-content-neutral-enabled"}]}),a=i.forwardRef((t,l)=>{const{children:s,isDisabled:u}=t,o=typeof r.default.Children.toArray(s)[0]=="string"?r.default.Children.toArray(s)[0]:void 0;return e.jsx(f.ListBoxItem,{ref:l,"data-dd-privacy":"mask",...t,textValue:o,className:({isHovered:n,isPressed:c,isFocusVisible:d,isSelected:y})=>v({isHovered:n,isPressed:c,isFocusVisible:d,isSelected:y,isDisabled:u}),children:({isSelected:n})=>e.jsx(b.SelectOptionProvider,{isDisabled:u,children:n?e.jsxs("div",{className:"uy-flex uy-justify-between",children:[e.jsx("div",{className:"uy-flex uy-flex-col",children:e.jsx(e.Fragment,{children:s})}),e.jsx(x.Icon,{src:"CheckOutlined"})]}):e.jsx(e.Fragment,{children:s})})})});a.displayName="SelectOption";exports.SelectOption=a;

package/dist/cjs/components/select/parts/SelectOptionGroup.js

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

package/dist/cjs/components/select/parts/SelectOptionHelper.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),o=require("react"),i=require("tailwind-variants"),l=require("./SelectOption.context.js"),c=i.tv({base:"uy-typography-body",variants:{isDisabled:{true:"uy-text-content-neutral-disabled",false:"uy-text-content-neutral-low"}}}),e=o.forwardRef(({children:t},n)=>{const{isDisabled:s}=l.useSelectOptionContext(),r=c({isDisabled:s});return a.jsx("span",{className:r,ref:n,"data-dd-privacy":"mask",children:t})});e.displayName="SelectOptionHelper";exports.SelectOptionHelper=e;

package/dist/cjs/components/select-field/SelectField.d.ts

@@ -1,50 +0,0 @@
-import { ForwardedRef, JSX, ReactNode } from 'react';
-import { FieldPath, FieldValues } from 'react-hook-form';
-import { infer as ZodInfer } from 'zod/lib/types';
-import { Schema } from '../../hooks/use-form.types.js';
-import { LabelProps } from '../label/Label.js';
-import { SelectProps } from '../select/Select.js';
-interface SelectFieldProps<TItems extends object, TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> extends Pick<LabelProps, 'isRequired' | 'requiredVariant'>, Omit<SelectProps<TItems>, 'name' | 'value'> {
-    /** The name of the field, which should match the form schema. */
-    name: TName;
-    /** The label for the select field. */
-    label: string;
-    /** Helper text to display below the text field. */
-    helperText?: ReactNode;
-    /** Feedback text to display below the text field. */
-    feedbackText?: ReactNode;
-}
-type SelectFieldComponent = (<TItems extends object, TSchema extends Schema>(props: SelectFieldProps<TItems, ZodInfer<TSchema>> & {
-    ref?: ForwardedRef<HTMLDivElement>;
-}) => JSX.Element) & {
-    displayName?: string;
-};
-/**
- * The `SelectField` component renders a list of options to select one, it is fully integrated with the `Form` component.
- * @example
- * ```tsx
- * const schema = z.object({
- *  vegetable: z.string()
- * })
- *
- * function MyForm() {
- *   const { Form } = useUnityForm(schema)
- *
- *   return (
- *    <Form action={handleSubmit}>
- *      <SelectField<typeof schema>
- *        name="vegetable"
- *        label="Vegetables"
- *        >
- *        <SelectOption id="Cabbage">Cabbage</SelectOption>
- *        <SelectOption id="Broccoli">Broccoli</SelectOption>
- *        <SelectOption id="Carrots">Carrots</SelectOption>
- *        </SelectField>
- *    </Form>
- *   )
- * }
- * ```
- * @note The schema type parameter is needed to ensure type safety with the form's schema. If you omit it, the `name` prop will not be type-safe.
- */
-declare const SelectField: SelectFieldComponent;
-export { SelectField };

package/dist/cjs/components/select-field/SelectField.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),b=require("react"),y=require("react-hook-form"),f=require("tailwind-variants"),p=require("../form-field/FormField.js"),h=require("../form-field/parts/FormControl.js"),T=require("../form-field/parts/FormFeedbackText.js"),g=require("../form-field/parts/FormHelperText.js"),k=require("../form-field/parts/FormLabel.js"),C=require("../select/Select.js"),H=f.tv({base:"uy-flex uy-flex-col uy-gap-100"}),R=({children:o,feedbackText:t,helperText:r,isRequired:n,label:i,name:c,requiredVariant:s,isDisabled:F,isInvalid:u,isReadOnly:d,placeholder:m,items:a,...x},q)=>{const{control:S}=y.useFormContext(),j={isRequired:n,isInvalid:u,isDisabled:F,isReadOnly:d};return e.jsxs(p.FormField,{control:S,name:c,className:H(),...j,children:[e.jsx(k.FormLabel,{requiredVariant:s,children:i}),r&&e.jsx(g.FormHelperText,{children:r}),e.jsx(h.FormControl,{children:e.jsx(C.Select,{ref:q,name:c,placeholder:m,items:a,...x,children:o})}),e.jsx(T.FormFeedbackText,{children:t})]})},l=b.forwardRef(function(t,r){return R(t,r)});l.displayName="SelectField";exports.SelectField=l;

package/dist/cjs/components/selectable-button-group/SelectableButtonGroup.context.d.ts

@@ -1,2 +0,0 @@
-import { ToggleGroupState } from 'react-stately';
-export declare const SelectableButtonGroupContext: import('react').Context<ToggleGroupState | null>;

package/dist/cjs/components/selectable-button-group/SelectableButtonGroup.context.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),e=t.createContext(null);exports.SelectableButtonGroupContext=e;

package/dist/cjs/components/selectable-button-group/SelectableButtonGroup.d.ts

@@ -1,59 +0,0 @@
-import { AriaToggleButtonGroupProps } from 'react-aria';
-import { Key } from 'react-stately';
-import { VariantProps } from 'tailwind-variants';
-export declare const selectableButtonGroup: import('tailwind-variants').TVReturnType<{} | {} | {}, undefined, "uy-flex uy-gap-100", import('tailwind-variants/dist/config').TVConfig<unknown, {} | {}>, {} | {}, undefined, import('tailwind-variants').TVReturnType<unknown, undefined, "uy-flex uy-gap-100", import('tailwind-variants/dist/config').TVConfig<unknown, {} | {}>, unknown, unknown, undefined>>;
-export interface SelectableButtonGroupProps extends VariantProps<typeof selectableButtonGroup>, Omit<AriaToggleButtonGroupProps, 'selectedKeys' | 'defaultSelectedKeys' | 'onSelectionChange' | 'className' | 'style'> {
-    /**
-     * The SelectableButton components to render within the group.
-     * Each child must be a SelectableButton component with a unique value prop.
-     */
-    children: React.ReactNode;
-    /**
-     * The currently selected values in controlled mode.
-     * Use this prop along with onChange to control the selection state externally.
-     * The values should match the value props of the SelectableButton children.
-     */
-    value?: AriaToggleButtonGroupProps['selectedKeys'];
-    /**
-     * The initially selected values in uncontrolled mode.
-     * Use this prop to set default selections without controlling the state.
-     * The values should match the value props of the SelectableButton children.
-     */
-    defaultValue?: AriaToggleButtonGroupProps['defaultSelectedKeys'];
-    /**
-     * Callback fired when the selection changes.
-     * Receives an array of the currently selected values.
-     * Required when using the component in controlled mode.
-     */
-    onChange?: (keys: Key[]) => void;
-}
-/**
- * A group component that manages the selection state of multiple SelectableButton components.
- * Supports both single and multiple selection modes with controlled and uncontrolled usage patterns.
- * @component
- * @param {SelectableButtonGroupProps} props - Props for configuring the group's behavior and selection mode
- * @see {@link SelectableButtonGroupProps} for all available props
- * @example
- * ```tsx
- * import { SelectableButtonGroup, SelectableButton } from '@payfit/unity-components'
- *
- * function Example() {
- *   const [selected, setSelected] = useState(['option1'])
- *
- *   return (
- *     <SelectableButtonGroup
- *       selectionMode="multiple"
- *       value={selected}
- *       onChange={keys => setSelected(keys)}
- *     >
- *       <SelectableButton value="option1">First Option</SelectableButton>
- *       <SelectableButton value="option2">Second Option</SelectableButton>
- *     </SelectableButtonGroup>
- *   )
- * }
- * ```
- * @remarks
- * [API](https://master--66fe6715241b661107117e47.chromatic.com/?path=/docs/inputs-selectablebuttongroup--docs) • [Design docs](https://www.payfit.design/24f360409/p/944b5d-selectable-button)
- */
-declare const SelectableButtonGroup: import('react').ForwardRefExoticComponent<SelectableButtonGroupProps & import('react').RefAttributes<HTMLDivElement>>;
-export { SelectableButtonGroup };

package/dist/cjs/components/selectable-button-group/SelectableButtonGroup.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime"),l=require("react"),o=require("react-aria"),S=require("react-stately"),b=require("tailwind-variants"),y=require("./SelectableButtonGroup.context.js"),a=b.tv({base:"uy-flex uy-gap-100"}),c=l.forwardRef((e,s)=>{const t=l.useRef(null),r=S.useToggleGroupState({...e,selectedKeys:e.value,defaultSelectedKeys:e.defaultValue,onSelectionChange:g=>{var n;(n=e.onChange)==null||n.call(e,Array.from(g))}}),{groupProps:i}=o.useToggleButtonGroup(e,r,t),d=a(),{ref:f}=o.mergeProps({ref:t},{ref:s});return u.jsx("div",{...i,className:d,ref:f,"data-dd-privacy":"allow",children:u.jsx(y.SelectableButtonGroupContext.Provider,{value:r,children:e.children})})});c.displayName="SelectableButtonGroup";exports.SelectableButtonGroup=c;exports.selectableButtonGroup=a;

package/dist/cjs/components/selectable-button-group/parts/SelectableButton.d.ts

@@ -1,127 +0,0 @@
-import { AriaToggleButtonProps } from 'react-aria';
-import { UnityIcon } from '@payfit/unity-icons/dist/cjs/generated';
-import { ToggleButtonProps } from 'react-aria-components';
-export declare const selectableButton: import('tailwind-variants').TVReturnType<{
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}, {
-    base: string[];
-    icon: string[];
-    label: string[];
-}, undefined, import('tailwind-variants/dist/config').TVConfig<{
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}, {
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}>, {
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}, {
-    base: string[];
-    icon: string[];
-    label: string[];
-}, import('tailwind-variants').TVReturnType<{
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}, {
-    base: string[];
-    icon: string[];
-    label: string[];
-}, undefined, import('tailwind-variants/dist/config').TVConfig<{
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}, {
-    hasIcon: {
-        true: {
-            base: string;
-        };
-        false: {
-            base: string;
-        };
-    };
-}>, unknown, unknown, undefined>>;
-type IconName<T extends string> = T extends `${infer Base}${'Filled' | 'Outlined'}` ? Base : T;
-export interface SelectableButtonProps extends Omit<AriaToggleButtonProps, 'id' | 'className' | 'style'> {
-    /**
-     * A unique identifier for the button that will be used as its selection value.
-     * This value must be unique within the SelectableButtonGroup.
-     */
-    value: NonNullable<ToggleButtonProps['id']>;
-    /**
-     * Optional icon to display before the button's text content.
-     * The icon will automatically switch between outlined and filled variants based on selection state.
-     * Specify the base name of the icon without the 'Filled' or 'Outlined' suffix.
-     */
-    prefixIcon?: IconName<UnityIcon>;
-    /**
-     * Set to true to show a loading spinner and disable interaction.
-     * Use this when the button's action requires asynchronous processing.
-     * @default false
-     */
-    isLoading?: boolean;
-}
-/**
- * A toggleable button that works as part of a SelectableButtonGroup to create single or multiple choice selections.
- * Provides visual feedback for selection state and supports icons for enhanced visual hierarchy.
- * @component
- * @param {SelectableButtonProps} props - Props for configuring the button's behavior and appearance
- * @see {@link SelectableButtonProps} for all available props
- * @example
- * ```tsx
- * import { SelectableButtonGroup, SelectableButton } from '@payfit/unity-components'
- *
- * function Example() {
- *   return (
- *     <SelectableButtonGroup selectionMode="single" defaultValue={['morning']}>
- *       <SelectableButton value="morning">
- *         Morning
- *       </SelectableButton>
- *       <SelectableButton value="afternoon" prefixIcon="Sun">
- *         Afternoon
- *       </SelectableButton>
- *     </SelectableButtonGroup>
- *   )
- * }
- * ```
- * @remarks
- * [API](mdc:components/selectable-button-group/parts/SelectableButton) • [Design docs](mdc:design/components/selectable-button-group)
- */
-declare const SelectableButton: import('react').ForwardRefExoticComponent<SelectableButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
-export { SelectableButton };

package/dist/cjs/components/selectable-button-group/parts/SelectableButton.js

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("react"),i=require("react-aria"),h=require("tailwind-variants"),S=require("../../icon/Icon.js"),B=require("../../spinner/Spinner.js"),j=require("../SelectableButtonGroup.context.js"),c=h.tv({slots:{base:["uy-group uy-border uy-border-solid uy-rounded-75 uy-py-100 uy-flex uy-gap-50 uy-items-center","uy-border-border-form-enabled uy-bg-surface-form-enabled","hover:uy-bg-surface-form-hover hover:uy-border-border-form-hover","active:uy-bg-surface-form-pressed active:uy-border-border-form-pressed","focus-visible:uy-bg-surface-form-focus focus-visible:uy-border-border-form-focus","focus-visible:uy-outline-2 focus-visible:uy-outline focus-visible:uy-outline-offset-2 focus-visible:uy-outline-utility-focus-ring","data-[pressed=true]:uy-bg-surface-form-pressed data-[pressed=true]:uy-border-border-form-pressed data-[pressed=true]:uy-text-content-form-pressed","data-[selected=true]:uy-bg-surface-form-selected data-[selected=true]:uy-border-border-form-selected data-[selected=true]:uy-text-content-form-selected","disabled:uy-bg-surface-form-disabled disabled:uy-border-border-form-disabled disabled:uy-text-content-form-disabled disabled:uy-cursor-not-allowed","data-[loading=true]:uy-bg-surface-form-disabled data-[loading=true]:uy-border-border-form-disabled data-[loading=true]:uy-text-content-form-disabled data-[loading=true]:uy-cursor-wait"],icon:["uy-p-25","data-[loading=true]:uy-hidden"],label:["uy-typography-action"]},variants:{hasIcon:{true:{base:"uy-pl-100 uy-pr-200"},false:{base:"uy-px-200"}}},defaultVariants:{hasIcon:!1}}),b=o.forwardRef((s,f)=>{const a=o.useRef(null),u=o.useContext(j.SelectableButtonGroupContext);if(!u)throw new Error("SelectableButton must be used within a ToggleButtonGroup component");const{buttonProps:d,isPressed:y,isSelected:l}=i.useToggleButtonGroupItem({id:s.value,...s},u,a),{ref:m}=i.mergeProps({ref:a},{ref:f}),{isDisabled:p=!1,isLoading:r=!1,prefixIcon:t,children:n}=s,{base:g,icon:v,label:x}=c({hasIcon:!!t&&!r});return e.jsxs("button",{"data-dd-privacy":"allow",...d,ref:m,className:g(),disabled:d.disabled||p||r,"data-loading":r?!0:void 0,"data-pressed":y,"data-selected":l,"aria-busy":r,children:[t&&!r&&e.jsx(S.Icon,{src:l?`${t}Filled`:`${t}Outlined`,role:"presentation",className:v(),size:20}),r?e.jsxs(e.Fragment,{children:[e.jsx(B.Spinner,{label:"Loading",size:"small",color:"inherit"}),e.jsx("span",{className:"uy-sr-only",children:n})]}):e.jsx("span",{className:x(),children:n})]})});b.displayName="SelectableButton";exports.SelectableButton=b;exports.selectableButton=c;