@fuf-stack/uniform 1.4.2 → 1.5.0

package/dist/{chunk-C52NGPIF.js → chunk-4WRUHOGY.js}

@@ -1,25 +1,22 @@
 import {
-  FieldCopyTestIdButton_default
-} from "./chunk-NTDKZW4E.js";
+  useUniformField
+} from "./chunk-CJD3DW4J.js";
 import {
-  FieldValidationError_default
-} from "./chunk-CQWA2DFV.js";
-import {
-  useController,
-  useFormContext
-} from "./chunk-IYDCKENI.js";
+  __objRest,
+  __spreadValues
+} from "./chunk-K2V4ULA2.js";
 
 // src/RadioTabs/RadioTabs.tsx
 import { RadioGroup as HeroRadioGroup } from "@heroui/radio";
 import { slugify, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
 import Tabs from "@fuf-stack/pixels/Tabs";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 var radioTabsVariants = tv({
   slots: {
-    base: "group",
+    base: "group gap-0",
     // Needs group for group-data condition
     cursor: "",
-    label: "text-foreground group-data-[invalid=true]:text-danger text-sm subpixel-antialiased",
+    label: "text-foreground group-data-[invalid=true]:text-danger mb-2 inline-flex text-sm subpixel-antialiased",
     tab: "",
     tabBase: "",
     tabContent: "",
@@ -48,36 +45,42 @@ var radioTabsVariants = tv({
     }
   }
 });
-var RadioTabs = ({
-  className = void 0,
-  disabled = false,
-  fullWidth = false,
-  inline = false,
-  label = void 0,
-  name,
-  options,
-  testId: _testId = void 0,
-  variant = void 0
-}) => {
-  const { control, debugMode, getFieldState } = useFormContext();
-  const { error, invalid, required, testId } = getFieldState(name, _testId);
-  const { field } = useController({ control, disabled, name });
-  const { disabled: isDisabled, onBlur, onChange, ref, value } = field;
-  const showTestIdCopyButton = debugMode === "debug-testids";
-  const showLabel = label != null ? label : showTestIdCopyButton;
-  const hasContent = options.some((option) => {
-    return option.content;
-  });
-  const variants = radioTabsVariants({ hasContent, fullWidth });
-  const classNames = variantsToClassNames(variants, className, "base");
+var RadioTabs = (_a) => {
+  var _b = _a, {
+    className = void 0,
+    fullWidth = false,
+    inline = false,
+    name,
+    options,
+    variant = void 0
+  } = _b, uniformFieldProps = __objRest(_b, [
+    "className",
+    "fullWidth",
+    "inline",
+    "name",
+    "options",
+    "variant"
+  ]);
+  const {
+    disabled,
+    errorMessage,
+    field: { onBlur, onChange, ref, value },
+    invalid,
+    label,
+    required,
+    testId
+  } = useUniformField(__spreadValues({
+    name,
+    showInvalidWhen: "immediate"
+  }, uniformFieldProps));
   const tabOptions = options.map((option) => {
-    var _a, _b;
+    var _a2, _b2;
     return {
       content: option == null ? void 0 : option.content,
       disabled: option == null ? void 0 : option.disabled,
       key: option.value,
-      label: (_a = option == null ? void 0 : option.label) != null ? _a : option == null ? void 0 : option.value,
-      testId: slugify(`option_${(_b = option == null ? void 0 : option.testId) != null ? _b : option == null ? void 0 : option.value}`, {
+      label: (_a2 = option == null ? void 0 : option.label) != null ? _a2 : option == null ? void 0 : option.value,
+      testId: slugify(`option_${(_b2 = option == null ? void 0 : option.testId) != null ? _b2 : option == null ? void 0 : option.value}`, {
         replaceDots: true
       })
     };
@@ -85,6 +88,11 @@ var RadioTabs = ({
   const disabledAllKeys = tabOptions == null ? void 0 : tabOptions.map((option) => {
     return option.key;
   });
+  const hasContent = options.some((option) => {
+    return option.content;
+  });
+  const variants = radioTabsVariants({ hasContent, fullWidth });
+  const classNames = variantsToClassNames(variants, className, "base");
   return /* @__PURE__ */ jsx(
     HeroRadioGroup,
     {
@@ -92,9 +100,11 @@ var RadioTabs = ({
       "data-invalid": invalid,
       "data-required": required,
       "data-testid": testId,
-      isDisabled,
+      errorMessage,
+      isDisabled: disabled,
       isInvalid: invalid,
       isRequired: required,
+      label: label ? /* @__PURE__ */ jsx("legend", { children: label }) : null,
       name,
       onBlur,
       orientation: inline ? "horizontal" : "vertical",
@@ -103,14 +113,6 @@ var RadioTabs = ({
         label: classNames.label,
         wrapper: classNames.wrapper
       },
-      errorMessage: error ? /* @__PURE__ */ jsx(FieldValidationError_default, { error, testId }) : void 0,
-      label: showLabel ? (
-        // eslint-disable-next-line jsx-a11y/label-has-associated-control
-        /* @__PURE__ */ jsxs("label", { children: [
-          label,
-          showTestIdCopyButton ? /* @__PURE__ */ jsx(FieldCopyTestIdButton_default, { testId }) : null
-        ] })
-      ) : void 0,
       children: /* @__PURE__ */ jsx(
         Tabs,
         {
@@ -143,4 +145,4 @@ export {
   RadioTabs_default,
   RadioTabs_default2
 };
-//# sourceMappingURL=chunk-C52NGPIF.js.map
+//# sourceMappingURL=chunk-4WRUHOGY.js.map

package/dist/chunk-4WRUHOGY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/RadioTabs/RadioTabs.tsx","../src/RadioTabs/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { TabsProps } from '@fuf-stack/pixels';\nimport type { TabProps } from '@fuf-stack/pixels/Tabs';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\nimport Tabs from '@fuf-stack/pixels/Tabs';\n\nimport { useUniformField } from '../hooks';\n\nexport const radioTabsVariants = tv({\n  slots: {\n    base: 'group gap-0', // Needs group for group-data condition\n    cursor: '',\n    label:\n      'text-foreground group-data-[invalid=true]:text-danger mb-2 inline-flex text-sm subpixel-antialiased',\n    tab: '',\n    tabBase: '',\n    tabContent: '',\n    tabList: '',\n    tabPanel: 'p-3',\n    tabWrapper: '',\n    wrapper: '',\n  },\n  variants: {\n    hasContent: {\n      true: {\n        base: '',\n        tabBase: 'p-1 pb-0',\n        tabWrapper: [\n          // border style\n          'border-divider rounded-medium border',\n          // full width\n          'w-full',\n        ],\n      },\n    },\n    fullWidth: {\n      true: {\n        tabWrapper: 'w-full',\n      },\n    },\n  },\n});\n\ntype VariantProps = TVProps<typeof radioTabsVariants>;\ntype ClassName = TVClassName<typeof radioTabsVariants>;\n\nexport interface RadioTabsOption {\n  /** Optional content inside of the tab */\n  content?: ReactNode;\n  /** disables the option */\n  disabled?: boolean;\n  /** option label */\n  label?: React.ReactNode;\n  /** option icon */\n  icon?: ReactNode;\n  /** HTML data-testid attribute of the option */\n  testId?: string;\n  /** option value */\n  value: string;\n}\n\nexport interface RadioTabsProps extends Omit<VariantProps, 'hasContent'> {\n  /** CSS class name */\n  className?: ClassName;\n  /** Determines if the Buttons are disabled or not. */\n  disabled?: boolean;\n  /** Whether tabs should take up full container width */\n  fullWidth?: boolean;\n  /** determines orientation of the Buttons. */\n  inline?: boolean;\n  /** Label displayed next to the RadioButton. */\n  label?: ReactNode;\n  /** Name the RadioButtons are registered at in HTML forms (react-hook-form). */\n  name: string;\n  /** Radio button configuration. */\n  options: RadioTabsOption[];\n  /** Id to grab element in internal tests. */\n  testId?: string;\n  /** How the RadioTabs should look like. */\n  variant?: TabsProps['variant'];\n}\n\n/**\n * RadioTabs component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n * and [HeroUI Tabs](https://www.heroui.com//docs/components/tabs)\n */\nconst RadioTabs = ({\n  className = undefined,\n  fullWidth = false,\n  inline = false,\n  name,\n  options,\n  variant = undefined,\n  ...uniformFieldProps\n}: RadioTabsProps): ReactElement => {\n  const {\n    disabled,\n    errorMessage,\n    field: { onBlur, onChange, ref, value },\n    invalid,\n    label,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    showInvalidWhen: 'immediate',\n    ...uniformFieldProps,\n  });\n\n  const tabOptions = options.map<TabProps>((option) => {\n    return {\n      content: option?.content,\n      disabled: option?.disabled,\n      key: option.value,\n      label: option?.label ?? option?.value,\n      testId: slugify(`option_${option?.testId ?? option?.value}`, {\n        replaceDots: true,\n      }),\n    };\n  });\n\n  const disabledAllKeys: string[] | undefined = tabOptions?.map((option) => {\n    return option.key as string;\n  });\n\n  // check if any option has content\n  // eslint-disable-next-line @typescript-eslint/no-misused-promises, @typescript-eslint/promise-function-async\n  const hasContent = options.some((option) => {\n    return option.content;\n  });\n\n  // classNames from slots\n  const variants = radioTabsVariants({ hasContent, fullWidth });\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  return (\n    <HeroRadioGroup\n      ref={ref}\n      // see HeroUI styles for group-data condition (data-invalid),\n      // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n      data-invalid={invalid}\n      data-required={required}\n      data-testid={testId}\n      errorMessage={errorMessage}\n      isDisabled={disabled}\n      isInvalid={invalid}\n      isRequired={required}\n      label={label ? <legend>{label}</legend> : null}\n      name={name}\n      onBlur={onBlur}\n      orientation={inline ? 'horizontal' : 'vertical'}\n      classNames={{\n        base: classNames.base,\n        label: classNames.label,\n        wrapper: classNames.wrapper,\n      }}\n    >\n      <Tabs\n        disabledKeys={disabled ? disabledAllKeys : undefined}\n        onSelectionChange={onChange}\n        // make sure component is controlled\n        selectedKey={value ?? ''}\n        tabs={tabOptions}\n        testId={testId}\n        variant={variant}\n        className={{\n          base: classNames.tabBase,\n          cursor: classNames.cursor,\n          panel: classNames.tabPanel,\n          tab: classNames.tab,\n          tabContent: classNames.tabContent,\n          tabList: classNames.tabList,\n          tabWrapper: classNames.tabWrapper,\n        }}\n      />\n    </HeroRadioGroup>\n  );\n};\n\nexport default RadioTabs;\n","import RadioTabs from './RadioTabs';\n\nexport type { RadioTabsProps } from './RadioTabs';\n\nexport { RadioTabs };\n\nexport default RadioTabs;\n"],"mappings":"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","names":["_a","_b","RadioTabs_default"]}

package/dist/{chunk-KG4XCEPW.js → chunk-53XSXUNE.js}

@@ -1,13 +1,6 @@
 import {
-  FieldCopyTestIdButton_default
-} from "./chunk-NTDKZW4E.js";
-import {
-  FieldValidationError_default
-} from "./chunk-CQWA2DFV.js";
-import {
-  useController,
-  useFormContext
-} from "./chunk-IYDCKENI.js";
+  useUniformField
+} from "./chunk-CJD3DW4J.js";
 import {
   __objRest,
   __spreadProps,
@@ -67,10 +60,10 @@ var RadioBox = (_a) => {
 };
 
 // src/RadioBoxes/RadioBoxes.tsx
-import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx2 } from "react/jsx-runtime";
 var radioBoxesVariants = tv({
   slots: {
-    base: "group",
+    base: "group gap-0",
     // Needs group for group-data condition
     itemBase: "",
     itemControl: "bg-focus group-data-[invalid=true]:bg-danger",
@@ -81,25 +74,37 @@ var radioBoxesVariants = tv({
     // TODO: get rid of !.
     // see HeroUI styles for group-data condition,
     // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts
-    label: "text-foreground group-data-[invalid=true]:text-danger text-sm subpixel-antialiased",
+    label: "text-foreground group-data-[invalid=true]:text-danger mb-2 inline-flex text-sm subpixel-antialiased",
     wrapper: ""
   }
 });
-var RadioBoxes = ({
-  className = void 0,
-  disabled = false,
-  inline = false,
-  label = void 0,
-  name,
-  options,
-  testId: _testId = void 0
-}) => {
-  const { control, debugMode, getFieldState, getValues } = useFormContext();
-  const { error, invalid, required, testId } = getFieldState(name, _testId);
-  const { field } = useController({ control, disabled, name });
-  const { onChange, disabled: isDisabled, onBlur, ref } = field;
-  const showTestIdCopyButton = debugMode === "debug-testids";
-  const showLabel = label || showTestIdCopyButton;
+var RadioBoxes = (_a) => {
+  var _b = _a, {
+    className = void 0,
+    inline = false,
+    name,
+    options
+  } = _b, uniformFieldProps = __objRest(_b, [
+    "className",
+    "inline",
+    "name",
+    "options"
+  ]);
+  const {
+    defaultValue,
+    errorMessage,
+    invalid,
+    disabled,
+    label,
+    onBlur,
+    onChange,
+    ref,
+    required,
+    testId
+  } = useUniformField(__spreadValues({
+    name,
+    showInvalidWhen: "immediate"
+  }, uniformFieldProps));
   const variants = radioBoxesVariants();
   const classNames = variantsToClassNames(variants, className, "base");
   const itemClassNames = {
@@ -113,28 +118,25 @@ var RadioBoxes = ({
   return /* @__PURE__ */ jsx2(
     HeroRadioGroup,
     {
-      classNames,
       ref,
+      classNames,
       "data-invalid": invalid,
       "data-required": required,
       "data-testid": testId,
-      defaultValue: getValues()[name],
-      isDisabled,
+      defaultValue,
+      errorMessage,
+      isDisabled: disabled,
       isInvalid: invalid,
       isRequired: required,
+      label: label ? /* @__PURE__ */ jsx2("legend", { children: label }) : null,
       name,
       onBlur,
       orientation: inline ? "horizontal" : "vertical",
-      errorMessage: error && /* @__PURE__ */ jsx2(FieldValidationError_default, { error, testId }),
-      label: showLabel && // eslint-disable-next-line jsx-a11y/label-has-associated-control
-      /* @__PURE__ */ jsxs2("label", { children: [
-        label,
-        showTestIdCopyButton && /* @__PURE__ */ jsx2(FieldCopyTestIdButton_default, { testId })
-      ] }),
       children: options.map((option) => {
+        var _a2, _b2;
         if ("value" in option) {
           const optionTestId = slugify(
-            `${testId}_option_${option.testId || option.value}`,
+            `${testId}_option_${(_a2 = option.testId) != null ? _a2 : option.value}`,
             { replaceDots: true }
           );
           return /* @__PURE__ */ jsx2(
@@ -144,10 +146,10 @@ var RadioBoxes = ({
               "data-testid": optionTestId,
               description: option.description,
               icon: option.icon,
-              isDisabled: isDisabled || option.disabled,
+              isDisabled: !!disabled || option.disabled,
               onChange,
               value: option.value,
-              children: option.label ? option.label : option.value
+              children: (_b2 = option.label) != null ? _b2 : option.value
             },
             option.value
           );
@@ -166,4 +168,4 @@ export {
   RadioBoxes_default,
   RadioBoxes_default2
 };
-//# sourceMappingURL=chunk-KG4XCEPW.js.map
+//# sourceMappingURL=chunk-53XSXUNE.js.map

package/dist/chunk-53XSXUNE.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/RadioBoxes/RadioBoxes.tsx","../src/RadioBoxes/RadioBox.tsx","../src/RadioBoxes/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { ReactNode } from 'react';\n\nimport { RadioGroup as HeroRadioGroup } from '@heroui/radio';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks';\n//\nimport { RadioBox } from './RadioBox';\n\nexport const radioBoxesVariants = tv({\n  slots: {\n    base: 'group gap-0', // Needs group for group-data condition\n    itemBase: '',\n    itemControl: 'bg-focus group-data-[invalid=true]:bg-danger',\n    itemDescription: '',\n    itemLabel: 'text-sm',\n    itemLabelWrapper: '',\n    itemWrapper:\n      'group-data-[invalid=true]:!border-danger [&:not(group-data-[invalid=\"true\"]):not(group-data-[selected=\"false\"])]:border-focus', // TODO: get rid of !.\n    // see HeroUI styles for group-data condition,\n    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'text-foreground group-data-[invalid=true]:text-danger mb-2 inline-flex text-sm subpixel-antialiased',\n    wrapper: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof radioBoxesVariants>;\ntype ClassName = TVClassName<typeof radioBoxesVariants>;\n\nexport interface RadioBoxesOption {\n  /** Description of the value. Works with variant radioBox. */\n  description?: ReactNode;\n  /** disables the option */\n  disabled?: boolean;\n  /** option label */\n  label?: ReactNode;\n  /** option icon */\n  icon?: ReactNode;\n  /** HTML data-testid attribute of the option */\n  testId?: string;\n  /** option value */\n  value: string;\n}\n\nexport interface RadioBoxesProps extends VariantProps {\n  /** CSS class name */\n  className?: ClassName;\n  /** Determines if the Buttons are disabled or not. */\n  disabled?: boolean;\n  /** determines orientation of the Buttons. */\n  inline?: boolean;\n  /** Label displayed next to the RadioButton. */\n  label?: ReactNode;\n  /** Name the RadioButtons are registered at in HTML forms (react-hook-form). */\n  name: string;\n  /** Radio button configuration. */\n  options: RadioBoxesOption[];\n  /** Id to grab element in internal tests. */\n  testId?: string;\n}\n\n/**\n * RadioBoxes component based on [HeroUI RadioGroup](https://www.heroui.com//docs/components/radio-group)\n */\nconst RadioBoxes = ({\n  className = undefined,\n  inline = false,\n  name,\n  options,\n  ...uniformFieldProps\n}: RadioBoxesProps) => {\n  const {\n    defaultValue,\n    errorMessage,\n    invalid,\n    disabled,\n    label,\n    onBlur,\n    onChange,\n    ref,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    showInvalidWhen: 'immediate',\n    ...uniformFieldProps,\n  });\n\n  // classNames from slots\n  const variants = radioBoxesVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n  const itemClassNames = {\n    base: classNames.itemBase,\n    control: classNames.itemControl,\n    description: classNames.itemDescription,\n    label: classNames.itemLabel,\n    labelWrapper: classNames.itemLabelWrapper,\n    wrapper: classNames.itemWrapper,\n  };\n\n  return (\n    <HeroRadioGroup\n      ref={ref}\n      classNames={classNames}\n      // see HeroUI styles for group-data condition (data-invalid),\n      // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n      data-invalid={invalid}\n      data-required={required}\n      data-testid={testId}\n      defaultValue={defaultValue as string}\n      errorMessage={errorMessage}\n      isDisabled={disabled}\n      isInvalid={invalid}\n      isRequired={required}\n      label={label ? <legend>{label}</legend> : null}\n      name={name}\n      onBlur={onBlur}\n      orientation={inline ? 'horizontal' : 'vertical'}\n    >\n      {options.map((option) => {\n        if ('value' in option) {\n          const optionTestId = slugify(\n            `${testId}_option_${option.testId ?? option.value}`,\n            { replaceDots: true },\n          );\n          return (\n            <RadioBox\n              key={option.value}\n              classNames={itemClassNames}\n              data-testid={optionTestId}\n              description={option.description}\n              icon={option.icon}\n              isDisabled={!!disabled || option.disabled}\n              onChange={onChange}\n              value={option.value}\n            >\n              {option.label ?? option.value}\n            </RadioBox>\n          );\n        }\n        return null;\n      })}\n    </HeroRadioGroup>\n  );\n};\n\nexport default RadioBoxes;\n","import type { RadioProps as HeroRadioProps } from '@heroui/radio';\nimport type { ReactNode } from 'react';\n\nimport { useRadio } from '@heroui/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\ninterface RadioProps extends HeroRadioProps {\n  /** icon for the option */\n  icon?: ReactNode;\n}\n\nexport const RadioBox = ({ icon = undefined, ...props }: RadioProps) => {\n  const {\n    children,\n    Component,\n    description,\n    getBaseProps,\n    getControlProps,\n    getInputProps,\n    getLabelProps,\n    getLabelWrapperProps,\n    getWrapperProps,\n    isDisabled,\n  } = useRadio(props);\n\n  return (\n    <Component\n      {...getBaseProps()}\n      className={cn(\n        'group border-default hover:bg-content2 data-[selected=true]:border-focus inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 p-4',\n        {\n          // disabled styles\n          'opacity-disabled pointer-events-none': isDisabled,\n        },\n      )}\n    >\n      <VisuallyHidden>\n        <input {...getInputProps()} />\n      </VisuallyHidden>\n      <span {...getWrapperProps()}>\n        <span {...getControlProps()} />\n      </span>\n      {icon}\n      <div\n        {...getLabelWrapperProps()}\n        className={cn(getLabelWrapperProps().className, 'grow')}\n      >\n        {children ? <span {...getLabelProps()}>{children}</span> : null}\n        {description ? (\n          <span className=\"text-small text-foreground opacity-70\">\n            {description}\n          </span>\n        ) : null}\n      </div>\n    </Component>\n  );\n};\n\nexport default RadioBox;\n","import RadioBoxes from './RadioBoxes';\n\nexport type { RadioBoxesProps } from './RadioBoxes';\n\nexport { RadioBoxes };\n\nexport default RadioBoxes;\n"],"mappings":"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","names":["jsx","_a","_b","RadioBoxes_default"]}

package/dist/{chunk-77C6VN4L.cjs → chunk-5LWD6VRV.cjs}

@@ -1,18 +1,12 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkOE5BOGGXcjs = require('./chunk-OE5BOGGX.cjs');
-
-
-var _chunkY3AB4GV6cjs = require('./chunk-Y3AB4GV6.cjs');
-
-
-
-var _chunk2GYFDVXXcjs = require('./chunk-2GYFDVXX.cjs');
+var _chunkC5GIWGQRcjs = require('./chunk-C5GIWGQR.cjs');
 
 
 var _chunkFLK6OPFYcjs = require('./chunk-FLK6OPFY.cjs');
 
 
+
 var _chunk555JRYCScjs = require('./chunk-555JRYCS.cjs');
 
 // src/Input/Input.tsx
@@ -31,36 +25,47 @@ var inputVariants = _pixelutils.tv.call(void 0, {
     inputWrapper: "bg-content1 group-data-[focus=true]:border-focus"
   }
 });
-var Input = ({
-  className: _className = void 0,
-  clearable = false,
-  debounceDelay = 300,
-  disabled = false,
-  endContent = void 0,
-  label = void 0,
-  name,
-  onClear = void 0,
-  placeholder = " ",
-  size = void 0,
-  startContent = void 0,
-  testId: _testId = void 0,
-  transform = void 0,
-  type = void 0
-}) => {
-  const { control, debugMode, getFieldState, resetField } = _chunk2GYFDVXXcjs.useFormContext.call(void 0, );
-  const { error, invalid, required, testId } = getFieldState(name, _testId);
-  const { field } = _chunk2GYFDVXXcjs.useController.call(void 0, {
-    control,
-    disabled,
-    name
-  });
+var Input = (_a) => {
+  var _b = _a, {
+    className: _className = void 0,
+    clearable = false,
+    debounceDelay = 300,
+    endContent = void 0,
+    name,
+    onClear = void 0,
+    placeholder = " ",
+    size = void 0,
+    startContent = void 0,
+    transform = void 0,
+    type = void 0
+  } = _b, uniformFieldProps = _chunk555JRYCScjs.__objRest.call(void 0, _b, [
+    "className",
+    "clearable",
+    "debounceDelay",
+    "endContent",
+    "name",
+    "onClear",
+    "placeholder",
+    "size",
+    "startContent",
+    "transform",
+    "type"
+  ]);
   const {
-    disabled: isDisabled,
-    onChange: fieldOnChange,
-    onBlur: fieldOnBlur,
-    value: fieldValue,
-    ref
-  } = field;
+    disabled,
+    field: {
+      onChange: fieldOnChange,
+      onBlur: fieldOnBlur,
+      value: fieldValue,
+      ref
+    },
+    errorMessage,
+    invalid,
+    label,
+    required,
+    testId,
+    resetField
+  } = _chunkC5GIWGQRcjs.useUniformField.call(void 0, _chunk555JRYCScjs.__spreadValues.call(void 0, { name }, uniformFieldProps));
   const { onChange, onBlur, value } = _chunkFLK6OPFYcjs.useInputValueDebounce.call(void 0, {
     debounceDelay,
     onBlur: fieldOnBlur,
@@ -78,8 +83,6 @@ var Input = ({
       }
     }
   } : {};
-  const showTestIdCopyButton = debugMode === "debug-testids";
-  const showLabel = label != null ? label : showTestIdCopyButton;
   const variants = inputVariants();
   const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, _className, "base");
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
@@ -88,9 +91,12 @@ var Input = ({
       ref,
       "data-testid": testId,
       endContent,
-      isDisabled,
+      errorMessage,
+      id: testId,
+      isDisabled: disabled,
       isInvalid: invalid,
       isRequired: required,
+      label,
       labelPlacement: "outside",
       name,
       onBlur,
@@ -105,14 +111,11 @@ var Input = ({
       classNames: {
         base: classNames.base,
         clearButton: classNames.clearButton,
+        // set padding to 0 for error message exit animation
+        helperWrapper: "p-0",
         input: classNames.input,
         inputWrapper: classNames.inputWrapper
-      },
-      errorMessage: error ? /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkY3AB4GV6cjs.FieldValidationError_default, { error, testId }) : null,
-      label: showLabel ? /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _jsxruntime.Fragment, { children: [
-        label,
-        showTestIdCopyButton != null ? showTestIdCopyButton : /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkOE5BOGGXcjs.FieldCopyTestIdButton_default, { testId })
-      ] }) : null
+      }
     }, clearableProps)
   );
 };
@@ -125,4 +128,4 @@ var Input_default2 = Input_default;
 
 
 exports.Input_default = Input_default; exports.Input_default2 = Input_default2;
-//# sourceMappingURL=chunk-77C6VN4L.cjs.map
+//# sourceMappingURL=chunk-5LWD6VRV.cjs.map

package/dist/chunk-5LWD6VRV.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-5LWD6VRV.cjs","../src/Input/Input.tsx","../src/Input/index.ts"],"names":["Input_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-5LWD6VRV.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { InputProps as HeroInputProps } from '@heroui/input';\nimport type { ReactNode } from 'react';\nimport type { InputValueTransform } from '../hooks';\n\nimport { Input as HeroInput } from '@heroui/input';\n\nimport { tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useInputValueDebounce, useUniformField } from '../hooks';\n\n// input variants\nexport const inputVariants = tv({\n  slots: {\n    /** wrapper around the whole input */\n    base: '',\n    /** clear button */\n    clearButton: '',\n    /** actual input element */\n    input: '',\n    /** inner wrapper (HeroUI inputWrapper slot) */\n    inputWrapper: 'bg-content1 group-data-[focus=true]:border-focus',\n  },\n});\n\ntype VariantProps = TVProps<typeof inputVariants>;\ntype ClassName = TVClassName<typeof inputVariants>;\n\nexport interface InputProps extends VariantProps {\n  /** CSS class name */\n  className?: ClassName;\n  /** shows clear button when input has value */\n  clearable?: boolean;\n  /** debounce delay in milliseconds for form state updates (default: 300ms) */\n  debounceDelay?: number;\n  /** input field is disabled */\n  disabled?: boolean;\n  /** added content to the end of the input Field. */\n  endContent?: ReactNode;\n  /** form field label (set to false to disable label) */\n  label?: string | false;\n  /** form field name */\n  name: string;\n  /** callback that is fired when the value is cleared */\n  onClear?: () => void;\n  /** form field placeholder */\n  placeholder?: string;\n  /** size of the input */\n  size?: 'sm' | 'md' | 'lg';\n  /** content added to the start of the input field */\n  startContent?: ReactNode;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** allows disentangled display and form values for a field */\n  transform?: InputValueTransform;\n  /** input type */\n  type?: 'number' | 'password';\n}\n\n/**\n * Input component based on [HeroUI Input](https://www.heroui.com//docs/components/input)\n */\nconst Input = ({\n  className: _className = undefined,\n  clearable = false,\n  debounceDelay = 300,\n  endContent = undefined,\n  name,\n  onClear = undefined,\n  placeholder = ' ',\n  size = undefined,\n  startContent = undefined,\n  transform = undefined,\n  type = undefined,\n  ...uniformFieldProps\n}: InputProps) => {\n  const {\n    disabled,\n    field: {\n      onChange: fieldOnChange,\n      onBlur: fieldOnBlur,\n      value: fieldValue,\n      ref,\n    },\n    errorMessage,\n    invalid,\n    label,\n    required,\n    testId,\n    resetField,\n  } = useUniformField({ name, ...uniformFieldProps });\n\n  // Use hook that provides debounced onChange and enhanced blur handling\n  const { onChange, onBlur, value } = useInputValueDebounce({\n    debounceDelay,\n    onBlur: fieldOnBlur,\n    onChange: fieldOnChange,\n    transform,\n    type,\n    value: fieldValue,\n  });\n\n  // If input is clearable add props for clearing input value\n  const clearableProps: Pick<HeroInputProps, 'isClearable' | 'onClear'> =\n    clearable\n      ? {\n          isClearable: true,\n          onClear: () => {\n            // if field had initial value we do not reset it\n            // to that value, but clear it instead\n            resetField(name, { defaultValue: null });\n            // if onClear cb provided we call it\n            if (onClear) {\n              onClear();\n            }\n          },\n        }\n      : {};\n\n  // classNames from slots\n  const variants = inputVariants();\n  const classNames = variantsToClassNames(variants, _className, 'base');\n\n  return (\n    <HeroInput\n      ref={ref}\n      data-testid={testId}\n      endContent={endContent}\n      errorMessage={errorMessage}\n      id={testId}\n      isDisabled={disabled}\n      isInvalid={invalid}\n      isRequired={required}\n      label={label}\n      labelPlacement=\"outside\"\n      name={name}\n      onBlur={onBlur}\n      onChange={onChange}\n      placeholder={placeholder}\n      radius=\"sm\"\n      size={size}\n      startContent={startContent}\n      type={type}\n      // @ts-expect-error can be number for input type number\n      value={value}\n      variant=\"bordered\"\n      classNames={{\n        base: classNames.base,\n        clearButton: classNames.clearButton,\n        // set padding to 0 for error message exit animation\n        helperWrapper: 'p-0',\n        input: classNames.input,\n        inputWrapper: classNames.inputWrapper,\n      }}\n      {...clearableProps}\n    />\n  );\n};\n\nexport default Input;\n","import Input from './Input';\n\nexport type { InputProps } from './Input';\n\nexport { Input };\n\nexport default Input;\n"]}

package/dist/{chunk-C64RKQEW.cjs → chunk-62AYJT2H.cjs}

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunk2GYFDVXXcjs = require('./chunk-2GYFDVXX.cjs');
+var _chunkC5GIWGQRcjs = require('./chunk-C5GIWGQR.cjs');
 
 // src/SubmitButton/SubmitButton.tsx
 var _pixelutils = require('@fuf-stack/pixel-utils');
@@ -19,7 +19,7 @@ var SubmitButton = ({
   const {
     formState: { isSubmitting },
     triggerSubmit
-  } = _chunk2GYFDVXXcjs.useFormContext.call(void 0, );
+  } = _chunkC5GIWGQRcjs.useFormContext.call(void 0, );
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     _pixels.Button,
     {
@@ -46,4 +46,4 @@ var SubmitButton_default2 = SubmitButton_default;
 
 
 exports.SubmitButton_default = SubmitButton_default; exports.SubmitButton_default2 = SubmitButton_default2;
-//# sourceMappingURL=chunk-C64RKQEW.cjs.map
+//# sourceMappingURL=chunk-62AYJT2H.cjs.map

package/dist/{chunk-C64RKQEW.cjs.map → chunk-62AYJT2H.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-C64RKQEW.cjs","../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"names":["SubmitButton_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACA;ACDA,oDAA4B;AAC5B,2CAAuB;AA0CnB,+CAAA;AAhBJ,IAAM,aAAA,EAAe,CAAC;AAAA,EACpB,UAAA,EAAY,aAAA;AAAA,EACZ,SAAA,EAAW,QAAA;AAAA,EACX,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,MAAA,EAAQ,SAAA;AAAA,EACR,KAAA,EAAO,KAAA,CAAA;AAAA,EACP,QAAA,EAAU,KAAA;AAAA,EACV,KAAA,EAAO,IAAA;AAAA,EACP,OAAA,EAAS;AACX,CAAA,EAAA,GAAyB;AACvB,EAAA,MAAM;AAAA,IACJ,SAAA,EAAW,EAAE,aAAa,CAAA;AAAA,IAC1B;AAAA,EACF,EAAA,EAAI,8CAAA,CAAe;AAEnB,EAAA,uBACE,6BAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACA,SAAA,EAAW,4BAAA,SAAY,CAAA;AAAA,MACvB,KAAA;AAAA,MACA,QAAA,EAAU,YAAA;AAAA,MACV,IAAA;AAAA,MACA,OAAA,EAAS,QAAA,GAAW,YAAA;AAAA,MAIpB,OAAA,EAAS,aAAA;AAAA,MACT,IAAA;AAAA,MACA,MAAA,EAAQ,iCAAA,MAAQ,EAAQ,EAAE,WAAA,EAAa,KAAK,CAAC,CAAA;AAAA,MAC7C,IAAA,EAAK,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EACH,CAAA;AAEJ,CAAA;AAEA,IAAO,qBAAA,EAAQ,YAAA;AD1Bf;AACA;AEnCA,IAAOA,sBAAAA,EAAQ,oBAAA;AFqCf;AACA;AACE;AACA;AACF,2GAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-C64RKQEW.cjs","sourcesContent":[null,"import type { ButtonProps } from '@fuf-stack/pixels';\nimport type { ReactNode } from 'react';\n\nimport { cn, slugify } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../hooks';\n\nexport interface SubmitButtonProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** color of the submit button */\n  color?: ButtonProps['color'];\n  /** icon of the submit button */\n  icon?: ButtonProps['icon'];\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** size of the submit button */\n  size?: ButtonProps['size'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n  ariaLabel = 'Submit form',\n  children = 'Submit',\n  className = undefined,\n  color = 'success',\n  icon = undefined,\n  loading = false,\n  size = 'md',\n  testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n  const {\n    formState: { isSubmitting },\n    triggerSubmit,\n  } = useFormContext();\n\n  return (\n    <Button\n      ariaLabel={ariaLabel}\n      className={cn(className)}\n      color={color}\n      disabled={isSubmitting}\n      icon={icon}\n      loading={loading || isSubmitting}\n      // @ts-expect-error we use form context triggerSubmit\n      // here so that submit button also works in special\n      // scenarios (e.g. when used in modal)\n      onClick={triggerSubmit}\n      size={size}\n      testId={slugify(testId, { replaceDots: true })}\n      type=\"submit\"\n    >\n      {children}\n    </Button>\n  );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport type { SubmitButtonProps } from './SubmitButton';\n\nexport { SubmitButton };\n\nexport default SubmitButton;\n"]}
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-62AYJT2H.cjs","../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"names":["SubmitButton_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACA;ACDA,oDAA4B;AAC5B,2CAAuB;AA0CnB,+CAAA;AAhBJ,IAAM,aAAA,EAAe,CAAC;AAAA,EACpB,UAAA,EAAY,aAAA;AAAA,EACZ,SAAA,EAAW,QAAA;AAAA,EACX,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,MAAA,EAAQ,SAAA;AAAA,EACR,KAAA,EAAO,KAAA,CAAA;AAAA,EACP,QAAA,EAAU,KAAA;AAAA,EACV,KAAA,EAAO,IAAA;AAAA,EACP,OAAA,EAAS;AACX,CAAA,EAAA,GAAyB;AACvB,EAAA,MAAM;AAAA,IACJ,SAAA,EAAW,EAAE,aAAa,CAAA;AAAA,IAC1B;AAAA,EACF,EAAA,EAAI,8CAAA,CAAe;AAEnB,EAAA,uBACE,6BAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,SAAA;AAAA,MACA,SAAA,EAAW,4BAAA,SAAY,CAAA;AAAA,MACvB,KAAA;AAAA,MACA,QAAA,EAAU,YAAA;AAAA,MACV,IAAA;AAAA,MACA,OAAA,EAAS,QAAA,GAAW,YAAA;AAAA,MAIpB,OAAA,EAAS,aAAA;AAAA,MACT,IAAA;AAAA,MACA,MAAA,EAAQ,iCAAA,MAAQ,EAAQ,EAAE,WAAA,EAAa,KAAK,CAAC,CAAA;AAAA,MAC7C,IAAA,EAAK,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EACH,CAAA;AAEJ,CAAA;AAEA,IAAO,qBAAA,EAAQ,YAAA;AD1Bf;AACA;AEnCA,IAAOA,sBAAAA,EAAQ,oBAAA;AFqCf;AACA;AACE;AACA;AACF,2GAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-62AYJT2H.cjs","sourcesContent":[null,"import type { ButtonProps } from '@fuf-stack/pixels';\nimport type { ReactNode } from 'react';\n\nimport { cn, slugify } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nimport { useFormContext } from '../hooks';\n\nexport interface SubmitButtonProps {\n  /** sets HTML aria-label attribute */\n  ariaLabel?: string;\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** color of the submit button */\n  color?: ButtonProps['color'];\n  /** icon of the submit button */\n  icon?: ButtonProps['icon'];\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** size of the submit button */\n  size?: ButtonProps['size'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * From SubmitButton\n */\nconst SubmitButton = ({\n  ariaLabel = 'Submit form',\n  children = 'Submit',\n  className = undefined,\n  color = 'success',\n  icon = undefined,\n  loading = false,\n  size = 'md',\n  testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n  const {\n    formState: { isSubmitting },\n    triggerSubmit,\n  } = useFormContext();\n\n  return (\n    <Button\n      ariaLabel={ariaLabel}\n      className={cn(className)}\n      color={color}\n      disabled={isSubmitting}\n      icon={icon}\n      loading={loading || isSubmitting}\n      // @ts-expect-error we use form context triggerSubmit\n      // here so that submit button also works in special\n      // scenarios (e.g. when used in modal)\n      onClick={triggerSubmit}\n      size={size}\n      testId={slugify(testId, { replaceDots: true })}\n      type=\"submit\"\n    >\n      {children}\n    </Button>\n  );\n};\n\nexport default SubmitButton;\n","import SubmitButton from './SubmitButton';\n\nexport type { SubmitButtonProps } from './SubmitButton';\n\nexport { SubmitButton };\n\nexport default SubmitButton;\n"]}