@opexa/portal-components 0.0.27 → 0.0.28

package/dist/ui/Field/field.recipe.js

@@ -1 +1,46 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@ark-ui/react"),r=require("tailwind-merge"),o=require("tailwind-variants"),a=require("../../utils/anatomyToRecipeSlots.js");require("../../utils/capitalize.js");require("../../utils/parseDecimal.js");require("../../constants/index.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");const e=r.twMerge("border","bg-bg-primary","border-border-primary","shadow-xs","focus:border-border-brand","focus:shadow-brand-xs","placeholder:text-text-placeholder","disabled:opacity-60","disabled:shadow-none","read-only:opacity-60","read-only:shadow-none"),n=o.tv({slots:a.anatomyToRecipeSlots(t.fieldAnatomy,{input:"block w-full rounded-md outline-none",select:"block w-full rounded-md outline-none",textarea:"block w-full rounded-md outline-none",label:"text-text-secondary-700 mb-sm inline-block text-sm font-medium",errorText:"text-error-400 mt-sm inline-block text-sm",helperText:"text-text-secondary-700 text-sm"}),variants:{size:{md:{input:"h-11 px-3.5",select:"h-11 px-3.5",textarea:"px-3.5 py-2.5"}},variant:{outline:{}},colorScheme:{gray:{}}},compoundVariants:[{variant:"outline",colorScheme:"gray",className:{input:e,select:e,textarea:e}}],defaultVariants:{size:"md",variant:"outline",colorScheme:"gray"}});exports.fieldRecipe=n;
+import { fieldAnatomy } from '@ark-ui/react';
+import { twMerge } from 'tailwind-merge';
+import { tv } from 'tailwind-variants';
+import { anatomyToRecipeSlots } from '../../utils';
+const outlineGrayInputStyle = twMerge('border', 'bg-bg-primary', 'border-border-primary', 'shadow-xs', 'focus:border-border-brand', 'focus:shadow-brand-xs', 'placeholder:text-text-placeholder', 'disabled:opacity-60', 'disabled:shadow-none', 'read-only:opacity-60', 'read-only:shadow-none');
+export const fieldRecipe = tv({
+    slots: anatomyToRecipeSlots(fieldAnatomy, {
+        input: 'block w-full rounded-md outline-none',
+        select: 'block w-full rounded-md outline-none',
+        textarea: 'block w-full rounded-md outline-none',
+        label: 'text-text-secondary-700 mb-sm inline-block text-sm font-medium',
+        errorText: 'text-error-400 mt-sm inline-block text-sm',
+        helperText: 'text-text-secondary-700 text-sm',
+    }),
+    variants: {
+        size: {
+            md: {
+                input: 'h-11 px-3.5',
+                select: 'h-11 px-3.5',
+                textarea: 'px-3.5 py-2.5',
+            },
+        },
+        variant: {
+            outline: {},
+        },
+        colorScheme: {
+            gray: {},
+        },
+    },
+    compoundVariants: [
+        {
+            variant: 'outline',
+            colorScheme: 'gray',
+            className: {
+                input: outlineGrayInputStyle,
+                select: outlineGrayInputStyle,
+                textarea: outlineGrayInputStyle,
+            },
+        },
+    ],
+    defaultVariants: {
+        size: 'md',
+        variant: 'outline',
+        colorScheme: 'gray',
+    },
+});

package/dist/ui/Field/index.js

@@ -0,0 +1 @@
+export * as Field from './Field';

package/dist/ui/IconButton/IconButton.d.ts

@@ -1,6 +1,6 @@
-import { ComponentPropsWithRef } from 'react';
-import { Merge } from 'type-fest';
-import { IconButtonRecipeProps } from './iconButton.recipe';
+import type { ComponentPropsWithRef } from 'react';
+import type { Merge } from 'type-fest';
+import { type IconButtonRecipeProps } from './iconButton.recipe';
 export interface IconButtonProps extends Merge<ComponentPropsWithRef<'button'>, IconButtonRecipeProps> {
     asChild?: boolean;
 }

package/dist/ui/IconButton/IconButton.jsx

@@ -0,0 +1,11 @@
+'use client';
+import { ark } from '@ark-ui/react';
+import { createSplitProps, dataAttr } from '../../utils';
+import { iconButtonRecipe, } from './iconButton.recipe';
+export function IconButton(props) {
+    const [recipeProps, localProps] = createSplitProps(iconButtonRecipe.variantKeys)(props);
+    return (<ark.button type="button" {...localProps} className={iconButtonRecipe({
+            ...recipeProps,
+            className: localProps.className,
+        })} data-disabled={dataAttr(localProps.disabled)}/>);
+}

package/dist/ui/IconButton/iconButton.recipe.d.ts

@@ -1,5 +1,5 @@
-import { VariantProps } from 'tailwind-variants';
-export declare const iconButtonRecipe: import('tailwind-variants').TVReturnType<{
+import { type VariantProps } from 'tailwind-variants';
+export declare const iconButtonRecipe: import("tailwind-variants").TVReturnType<{
     size: {
         '2xs': string;
         xs: string;
@@ -24,7 +24,7 @@ export declare const iconButtonRecipe: import('tailwind-variants').TVReturnType<
     fullWidth: {
         true: string;
     };
-}, undefined, import('tailwind-variants').TVReturnType<{
+}, undefined, import("tailwind-variants").TVReturnType<{
     size: {
         xs: string;
         sm: string;
@@ -60,7 +60,7 @@ export declare const iconButtonRecipe: import('tailwind-variants').TVReturnType<
     fullWidth: {
         true: string;
     };
-}, undefined, import('tailwind-variants').TVReturnType<{
+}, undefined, import("tailwind-variants").TVReturnType<{
     size: {
         xs: string;
         sm: string;

package/dist/ui/IconButton/iconButton.recipe.js

@@ -1 +1,19 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("tailwind-variants"),i=require("../Button/button.recipe.js"),t=e.tv({extend:i.buttonRecipe,variants:{size:{"2xs":"icon:size-4 h-8 w-8 px-0",xs:"icon:size-5 h-9 w-9 px-0",sm:"icon:size-5 h-10 w-10 px-0",md:"icon:size-5 h-11 w-11 px-0"}},defaultVariants:{size:"md",variant:"solid",colorScheme:"primary",fullWidth:!1}});exports.iconButtonRecipe=t;
+import { tv } from 'tailwind-variants';
+import { buttonRecipe } from '../Button/button.recipe';
+export const iconButtonRecipe = tv({
+    extend: buttonRecipe,
+    variants: {
+        size: {
+            '2xs': 'icon:size-4 h-8 w-8 px-0',
+            xs: 'icon:size-5 h-9 w-9 px-0',
+            sm: 'icon:size-5 h-10 w-10 px-0',
+            md: 'icon:size-5 h-11 w-11 px-0',
+        },
+    },
+    defaultVariants: {
+        size: 'md',
+        variant: 'solid',
+        colorScheme: 'primary',
+        fullWidth: false,
+    },
+});

package/dist/ui/IconButton/index.js

@@ -0,0 +1 @@
+export * from './IconButton';

package/dist/ui/Menu/Menu.jsx

@@ -0,0 +1,2 @@
+'use client';
+export const Root = () => null;

package/dist/ui/Menu/index.js

@@ -0,0 +1 @@
+export * as Menu from './Menu';

package/dist/ui/Menu/menu.recipe.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/ui/Menu/menu.recipe.js

@@ -0,0 +1 @@
+"use strict";

package/dist/ui/NumberInput/NumberInput.d.ts

@@ -1,5 +1,5 @@
 import { NumberInput } from '@ark-ui/react';
-export declare const Root: import('react').ComponentType<import('@ark-ui/react').Assign<NumberInput.RootProps & import('react').RefAttributes<HTMLDivElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const Root: import("react").ComponentType<import("@ark-ui/react").Assign<NumberInput.RootProps & import("react").RefAttributes<HTMLDivElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -15,7 +15,7 @@ export declare const Root: import('react').ComponentType<import('@ark-ui/react')
             decrementTrigger: string;
         };
     };
-}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -24,7 +24,7 @@ export declare const Root: import('react').ComponentType<import('@ark-ui/react')
         };
     };
 }, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const Control: import('react').ComponentType<import('@ark-ui/react').Assign<NumberInput.ControlProps & import('react').RefAttributes<HTMLDivElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const Control: import("react").ComponentType<import("@ark-ui/react").Assign<NumberInput.ControlProps & import("react").RefAttributes<HTMLDivElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -40,7 +40,7 @@ export declare const Control: import('react').ComponentType<import('@ark-ui/reac
             decrementTrigger: string;
         };
     };
-}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -49,7 +49,7 @@ export declare const Control: import('react').ComponentType<import('@ark-ui/reac
         };
     };
 }, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const DecrementTrigger: import('react').ComponentType<import('@ark-ui/react').Assign<NumberInput.DecrementTriggerProps & import('react').RefAttributes<HTMLButtonElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const DecrementTrigger: import("react").ComponentType<import("@ark-ui/react").Assign<NumberInput.DecrementTriggerProps & import("react").RefAttributes<HTMLButtonElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -65,7 +65,7 @@ export declare const DecrementTrigger: import('react').ComponentType<import('@ar
             decrementTrigger: string;
         };
     };
-}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -74,7 +74,7 @@ export declare const DecrementTrigger: import('react').ComponentType<import('@ar
         };
     };
 }, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const IncrementTrigger: import('react').ComponentType<import('@ark-ui/react').Assign<NumberInput.IncrementTriggerProps & import('react').RefAttributes<HTMLButtonElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const IncrementTrigger: import("react").ComponentType<import("@ark-ui/react").Assign<NumberInput.IncrementTriggerProps & import("react").RefAttributes<HTMLButtonElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -90,7 +90,7 @@ export declare const IncrementTrigger: import('react').ComponentType<import('@ar
             decrementTrigger: string;
         };
     };
-}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -99,7 +99,7 @@ export declare const IncrementTrigger: import('react').ComponentType<import('@ar
         };
     };
 }, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const Input: import('react').ComponentType<import('@ark-ui/react').Assign<NumberInput.InputProps & import('react').RefAttributes<HTMLInputElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const Input: import("react").ComponentType<import("@ark-ui/react").Assign<NumberInput.InputProps & import("react").RefAttributes<HTMLInputElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -115,7 +115,7 @@ export declare const Input: import('react').ComponentType<import('@ark-ui/react'
             decrementTrigger: string;
         };
     };
-}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -124,7 +124,7 @@ export declare const Input: import('react').ComponentType<import('@ark-ui/react'
         };
     };
 }, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const Label: import('react').ComponentType<import('@ark-ui/react').Assign<NumberInput.LabelProps & import('react').RefAttributes<HTMLLabelElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const Label: import("react").ComponentType<import("@ark-ui/react").Assign<NumberInput.LabelProps & import("react").RefAttributes<HTMLLabelElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -140,7 +140,7 @@ export declare const Label: import('react').ComponentType<import('@ark-ui/react'
             decrementTrigger: string;
         };
     };
-}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -149,7 +149,7 @@ export declare const Label: import('react').ComponentType<import('@ark-ui/react'
         };
     };
 }, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const Scrubber: import('react').ComponentType<import('@ark-ui/react').Assign<NumberInput.ScrubberProps & import('react').RefAttributes<HTMLDivElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const Scrubber: import("react").ComponentType<import("@ark-ui/react").Assign<NumberInput.ScrubberProps & import("react").RefAttributes<HTMLDivElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -165,7 +165,7 @@ export declare const Scrubber: import('react').ComponentType<import('@ark-ui/rea
             decrementTrigger: string;
         };
     };
-}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -174,7 +174,7 @@ export declare const Scrubber: import('react').ComponentType<import('@ark-ui/rea
         };
     };
 }, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const ValueText: import('react').ComponentType<import('@ark-ui/react').Assign<NumberInput.ValueTextProps & import('react').RefAttributes<HTMLSpanElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const ValueText: import("react").ComponentType<import("@ark-ui/react").Assign<NumberInput.ValueTextProps & import("react").RefAttributes<HTMLSpanElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -190,7 +190,7 @@ export declare const ValueText: import('react').ComponentType<import('@ark-ui/re
             decrementTrigger: string;
         };
     };
-}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -199,4 +199,4 @@ export declare const ValueText: import('react').ComponentType<import('@ark-ui/re
         };
     };
 }, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const Context: (props: NumberInput.ContextProps) => import('react').ReactNode;
+export declare const Context: (props: NumberInput.ContextProps) => import("react").ReactNode;

package/dist/ui/NumberInput/NumberInput.jsx

@@ -0,0 +1,14 @@
+'use client';
+import { NumberInput } from '@ark-ui/react';
+import { createRecipeContext } from '../../client/utils';
+import { numberInputRecipe } from './numberInput.recipe';
+const { withContext, withProvider } = createRecipeContext(numberInputRecipe);
+export const Root = withProvider(NumberInput.Root, 'root');
+export const Control = withContext(NumberInput.Control, 'control');
+export const DecrementTrigger = withContext(NumberInput.DecrementTrigger, 'decrementTrigger');
+export const IncrementTrigger = withContext(NumberInput.IncrementTrigger, 'incrementTrigger');
+export const Input = withContext(NumberInput.Input, 'input');
+export const Label = withContext(NumberInput.Label, 'label');
+export const Scrubber = withContext(NumberInput.Scrubber, 'scrubber');
+export const ValueText = withContext(NumberInput.ValueText, 'valueText');
+export const Context = NumberInput.Context;

package/dist/ui/NumberInput/index.js

@@ -0,0 +1 @@
+export * as NumberInput from './NumberInput';

package/dist/ui/NumberInput/numberInput.recipe.d.ts

@@ -1,4 +1,4 @@
-export declare const numberInputRecipe: import('tailwind-variants').TVReturnType<{
+export declare const numberInputRecipe: import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;
@@ -14,7 +14,7 @@ export declare const numberInputRecipe: import('tailwind-variants').TVReturnType
             decrementTrigger: string;
         };
     };
-}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             control: string;

package/dist/ui/NumberInput/numberInput.recipe.js

@@ -1 +1,24 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@ark-ui/react"),r=require("tailwind-variants"),i=require("../../utils/anatomyToRecipeSlots.js");require("../../utils/capitalize.js");require("../../utils/parseDecimal.js");require("../../constants/index.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");const o=r.tv({slots:i.anatomyToRecipeSlots(e.numberInputAnatomy,{control:"border-border-primary bg-bg-primary ui-focus:border-border-brand ui-focus:shadow-brand-xs grid grid-cols-[1fr_32px] grid-rows-[1fr_1fr] overflow-hidden rounded-lg border ui-disabled:opacity-60 ui-readonly:cursor-default ui-readonly:opacity-50",input:"placeholder:text-text-placeholder row-[span_2/span_2] w-full border-0 bg-transparent outline-none disabled:cursor-not-allowed",label:"text-gray-600 mb-sm inline-block text-sm font-medium",decrementTrigger:"border-border-primary icon:text-gray-600 inline-flex cursor-pointer items-center justify-center border-l border-t ui-disabled:cursor-not-allowed ui-disabled:opacity-60",incrementTrigger:"border-border-primary icon:text-gray-600 inline-flex cursor-pointer items-center justify-center border-l ui-disabled:cursor-not-allowed ui-disabled:opacity-60"}),variants:{size:{md:{control:"h-11 pl-3.5 text-base",incrementTrigger:"icon:size-5",decrementTrigger:"icon:size-5"}}},defaultVariants:{size:"md"}});exports.numberInputRecipe=o;
+import { numberInputAnatomy } from '@ark-ui/react';
+import { tv } from 'tailwind-variants';
+import { anatomyToRecipeSlots } from '../../utils';
+export const numberInputRecipe = tv({
+    slots: anatomyToRecipeSlots(numberInputAnatomy, {
+        control: 'border-border-primary bg-bg-primary ui-focus:border-border-brand ui-focus:shadow-brand-xs grid grid-cols-[1fr_32px] grid-rows-[1fr_1fr] overflow-hidden rounded-lg border ui-disabled:opacity-60 ui-readonly:cursor-default ui-readonly:opacity-50',
+        input: 'placeholder:text-text-placeholder row-[span_2/span_2] w-full border-0 bg-transparent outline-none disabled:cursor-not-allowed',
+        label: 'text-gray-600 mb-sm inline-block text-sm font-medium',
+        decrementTrigger: 'border-border-primary icon:text-gray-600 inline-flex cursor-pointer items-center justify-center border-l border-t ui-disabled:cursor-not-allowed ui-disabled:opacity-60',
+        incrementTrigger: 'border-border-primary icon:text-gray-600 inline-flex cursor-pointer items-center justify-center border-l ui-disabled:cursor-not-allowed ui-disabled:opacity-60',
+    }),
+    variants: {
+        size: {
+            md: {
+                control: 'h-11 pl-3.5 text-base',
+                incrementTrigger: 'icon:size-5',
+                decrementTrigger: 'icon:size-5',
+            },
+        },
+    },
+    defaultVariants: {
+        size: 'md',
+    },
+});

package/dist/ui/PasswordInput/PasswordInput.d.ts

@@ -1,5 +1,5 @@
 import { PasswordInput } from '@ark-ui/react';
-export declare const Root: import('react').ComponentType<import('@ark-ui/react').Assign<PasswordInput.RootProps & import('react').RefAttributes<HTMLDivElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const Root: import("react").ComponentType<import("@ark-ui/react").Assign<PasswordInput.RootProps & import("react").RefAttributes<HTMLDivElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -25,7 +25,7 @@ export declare const Root: import('react').ComponentType<import('@ark-ui/react')
     colorScheme: {
         gray: {};
     };
-}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -39,7 +39,7 @@ export declare const Root: import('react').ComponentType<import('@ark-ui/react')
         gray: {};
     };
 }, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const Control: import('react').ComponentType<import('@ark-ui/react').Assign<PasswordInput.ControlProps & import('react').RefAttributes<HTMLDivElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const Control: import("react").ComponentType<import("@ark-ui/react").Assign<PasswordInput.ControlProps & import("react").RefAttributes<HTMLDivElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -65,7 +65,7 @@ export declare const Control: import('react').ComponentType<import('@ark-ui/reac
     colorScheme: {
         gray: {};
     };
-}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -79,7 +79,7 @@ export declare const Control: import('react').ComponentType<import('@ark-ui/reac
         gray: {};
     };
 }, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const Indicator: import('react').ComponentType<import('@ark-ui/react').Assign<PasswordInput.IndicatorProps & import('react').RefAttributes<HTMLSpanElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const Indicator: import("react").ComponentType<import("@ark-ui/react").Assign<PasswordInput.IndicatorProps & import("react").RefAttributes<HTMLSpanElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -105,7 +105,7 @@ export declare const Indicator: import('react').ComponentType<import('@ark-ui/re
     colorScheme: {
         gray: {};
     };
-}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -119,7 +119,7 @@ export declare const Indicator: import('react').ComponentType<import('@ark-ui/re
         gray: {};
     };
 }, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const Input: import('react').ComponentType<import('@ark-ui/react').Assign<PasswordInput.InputProps & import('react').RefAttributes<HTMLInputElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const Input: import("react").ComponentType<import("@ark-ui/react").Assign<PasswordInput.InputProps & import("react").RefAttributes<HTMLInputElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -145,7 +145,7 @@ export declare const Input: import('react').ComponentType<import('@ark-ui/react'
     colorScheme: {
         gray: {};
     };
-}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -159,7 +159,7 @@ export declare const Input: import('react').ComponentType<import('@ark-ui/react'
         gray: {};
     };
 }, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const Label: import('react').ComponentType<import('@ark-ui/react').Assign<PasswordInput.LabelProps & import('react').RefAttributes<HTMLLabelElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const Label: import("react").ComponentType<import("@ark-ui/react").Assign<PasswordInput.LabelProps & import("react").RefAttributes<HTMLLabelElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -185,7 +185,7 @@ export declare const Label: import('react').ComponentType<import('@ark-ui/react'
     colorScheme: {
         gray: {};
     };
-}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -199,7 +199,7 @@ export declare const Label: import('react').ComponentType<import('@ark-ui/react'
         gray: {};
     };
 }, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const VisibilityTrigger: import('react').ComponentType<import('@ark-ui/react').Assign<PasswordInput.VisibilityTriggerProps & import('react').RefAttributes<HTMLButtonElement>, import('tailwind-variants').VariantProps<import('tailwind-variants').TVReturnType<{
+export declare const VisibilityTrigger: import("react").ComponentType<import("@ark-ui/react").Assign<PasswordInput.VisibilityTriggerProps & import("react").RefAttributes<HTMLButtonElement>, import("tailwind-variants").VariantProps<import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -225,7 +225,7 @@ export declare const VisibilityTrigger: import('react').ComponentType<import('@a
     colorScheme: {
         gray: {};
     };
-}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -239,4 +239,4 @@ export declare const VisibilityTrigger: import('react').ComponentType<import('@a
         gray: {};
     };
 }, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, undefined, unknown, unknown, undefined>>>>>;
-export declare const Context: (props: PasswordInput.ContextProps) => import('react').ReactNode;
+export declare const Context: (props: PasswordInput.ContextProps) => import("react").ReactNode;

package/dist/ui/PasswordInput/PasswordInput.jsx

@@ -0,0 +1,12 @@
+'use client';
+import { PasswordInput } from '@ark-ui/react';
+import { createRecipeContext } from '../../client/utils';
+import { passwordInputRecipe } from './passwordInput.recipe';
+const { withContext, withProvider } = createRecipeContext(passwordInputRecipe);
+export const Root = withProvider(PasswordInput.Root, 'root');
+export const Control = withContext(PasswordInput.Control, 'control');
+export const Indicator = withContext(PasswordInput.Indicator, 'indicator');
+export const Input = withContext(PasswordInput.Input, 'input');
+export const Label = withContext(PasswordInput.Label, 'label');
+export const VisibilityTrigger = withContext(PasswordInput.VisibilityTrigger, 'visibilityTrigger');
+export const Context = PasswordInput.Context;

package/dist/ui/PasswordInput/index.js

@@ -0,0 +1 @@
+export * as PasswordInput from './PasswordInput';

package/dist/ui/PasswordInput/passwordInput.recipe.d.ts

@@ -1,4 +1,4 @@
-export declare const passwordInputRecipe: import('tailwind-variants').TVReturnType<{
+export declare const passwordInputRecipe: import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;
@@ -24,7 +24,7 @@ export declare const passwordInputRecipe: import('tailwind-variants').TVReturnTy
     colorScheme: {
         gray: {};
     };
-}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import('tailwind-variants').TVReturnType<{
+}, Record<"input" | "label" | "root" | "indicator" | "control" | "visibilityTrigger", string | string[]>, import("tailwind-variants").TVReturnType<{
     size: {
         md: {
             input: string;

package/dist/ui/PasswordInput/passwordInput.recipe.js

@@ -1 +1,39 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@ark-ui/react"),r=require("tailwind-variants"),i=require("../../utils/anatomyToRecipeSlots.js");require("../../utils/capitalize.js");require("../../utils/parseDecimal.js");require("../../constants/index.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");const o=r.tv({slots:i.anatomyToRecipeSlots(e.passwordInputAnatomy,{input:"placeholder:text-text-placeholder w-full grow outline-none",control:"flex rounded-md border ui-disabled:opacity-60 ui-readonly:opacity-60",label:"text-text-secondary-700 mb-sm inline-block text-sm font-medium",visibilityTrigger:"flex shrink-0 items-center justify-center"}),variants:{size:{md:{input:"h-11 px-3.5",visibilityTrigger:"icon:size-5 size-11"}},variant:{outline:{}},colorScheme:{gray:{}}},compoundVariants:[{variant:"outline",colorScheme:"gray",className:{control:"bg-bg-primary border-border-primary focus-within:border-border-brand focus-within:shadow-brand-xs ui-disabled:shadow-none ui-readonly:shadow-none"}}],defaultVariants:{size:"md",variant:"outline",colorScheme:"gray"}});exports.passwordInputRecipe=o;
+import { passwordInputAnatomy } from '@ark-ui/react';
+import { tv } from 'tailwind-variants';
+import { anatomyToRecipeSlots } from '../../utils';
+export const passwordInputRecipe = tv({
+    slots: anatomyToRecipeSlots(passwordInputAnatomy, {
+        input: 'placeholder:text-text-placeholder w-full grow outline-none',
+        control: 'flex rounded-md border ui-disabled:opacity-60 ui-readonly:opacity-60',
+        label: 'text-text-secondary-700 mb-sm inline-block text-sm font-medium',
+        visibilityTrigger: 'flex shrink-0 items-center justify-center',
+    }),
+    variants: {
+        size: {
+            md: {
+                input: 'h-11 px-3.5',
+                visibilityTrigger: 'icon:size-5 size-11',
+            },
+        },
+        variant: {
+            outline: {},
+        },
+        colorScheme: {
+            gray: {},
+        },
+    },
+    compoundVariants: [
+        {
+            variant: 'outline',
+            colorScheme: 'gray',
+            className: {
+                control: 'bg-bg-primary border-border-primary focus-within:border-border-brand focus-within:shadow-brand-xs ui-disabled:shadow-none ui-readonly:shadow-none',
+            },
+        },
+    ],
+    defaultVariants: {
+        size: 'md',
+        variant: 'outline',
+        colorScheme: 'gray',
+    },
+});