@fuf-stack/uniform 0.14.4 → 0.15.0

package/dist/chunk-QLQR44AD.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-QLQR44AD.cjs","../src/Form/Form.tsx","../src/Form/subcomponents/FormDebugViewer.tsx","../src/Form/index.ts"],"names":["jsx","jsxs","cn","Form_default"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-QLQR44AD.cjs","sourcesContent":[null,"import type { VetoInstance } from '@fuf-stack/veto';\nimport type { ReactNode } from 'react';\nimport type { FieldValues, SubmitHandler } from 'react-hook-form';\nimport type { DebugModeSettings } from './subcomponents/FormContext';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\nimport { slugify } from '../helpers';\nimport FormProvider from './subcomponents/FormContext';\nimport FormDebugViewer from './subcomponents/FormDebugViewer';\n\nconst IS_TEST = process.env.NODE_ENV === 'test';\n\nexport interface FormProps {\n  /** form children */\n  children: ReactNode | ReactNode[];\n  /** CSS class name */\n  className?: string | string[];\n  /** settings for from debug mode */\n  debug?: DebugModeSettings;\n  /** initial form values */\n  initialValues?: FieldValues;\n  /** name of the form */\n  name?: string;\n  /** form submit handler */\n  onSubmit: SubmitHandler<FieldValues>;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** veto validation schema */\n  validation?: VetoInstance;\n  /** when the validation should be triggered */\n  validationTrigger?: 'onChange' | 'onBlur' | 'onSubmit' | 'onTouched' | 'all';\n}\n\n/**\n * Form component that has to wrap every uniform\n */\nconst Form = ({\n  children,\n  className = undefined,\n  debug = undefined,\n  initialValues = undefined,\n  name = undefined,\n  onSubmit,\n  testId = undefined,\n  validation = undefined,\n  validationTrigger = 'all',\n}: FormProps) => {\n  return (\n    <FormProvider\n      debugModeSettings={debug}\n      initialValues={initialValues}\n      onSubmit={onSubmit}\n      validation={validation}\n      validationTrigger={validationTrigger}\n    >\n      {({ handleSubmit }) => (\n        <div className=\"flex w-full flex-row justify-between gap-6\">\n          <form\n            className={cn('flex-grow', className)}\n            data-testid={slugify(testId || name || '')}\n            name={name}\n            onSubmit={handleSubmit}\n          >\n            {children}\n          </form>\n          {/* render debug viewer when not in test environment and debug not disabled */}\n          {!IS_TEST && !debug?.disable && (\n            <FormDebugViewer className=\"w-96 flex-shrink\" />\n          )}\n        </div>\n      )}\n    </FormProvider>\n  );\n};\n\nexport default Form;\n","import type { VetoError } from '@fuf-stack/veto';\n\nimport { useEffect, useState } from 'react';\nimport { FaTimes } from 'react-icons/fa';\nimport { FaBug, FaBullseye } from 'react-icons/fa6';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button, Card, Json } from '@fuf-stack/pixels';\n\nimport { toValidationFormat } from '../../helpers';\nimport { useFormContext } from '../../hooks';\n\ninterface FormDebugViewerProps {\n  /** CSS class name */\n  className?: string;\n}\n\n/** Renders a form debug panel with information about the current form state */\nconst FormDebugViewer = ({ className = undefined }: FormDebugViewerProps) => {\n  const {\n    debugMode,\n    formState: { dirtyFields, isValid, isSubmitting },\n    setDebugMode,\n    validation,\n    watch,\n  } = useFormContext();\n\n  const [validationErrors, setValidationErrors] = useState<\n    VetoError['errors'] | null\n  >(null);\n\n  const validationValues = toValidationFormat(watch());\n  const debugTestIdsEnabled = debugMode === 'debug-testids';\n\n  useEffect(\n    () => {\n      const updateValidationErrors = async () => {\n        if (validation) {\n          const validateResult =\n            await validation?.validateAsync(validationValues);\n          setValidationErrors(validateResult?.errors);\n        }\n      };\n      updateValidationErrors();\n    },\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [JSON.stringify(validationValues)],\n  );\n\n  if (!debugMode || debugMode === 'off') {\n    return (\n      <Button\n        ariaLabel=\"Enable form debug mode\"\n        onClick={() => setDebugMode('debug')}\n        className=\"fixed bottom-2.5 right-2.5 w-5 text-default-400\"\n        variant=\"light\"\n        icon={<FaBug />}\n      />\n    );\n  }\n\n  return (\n    <Card\n      className={cn(className)}\n      header={\n        <div className=\"flex w-full flex-row justify-between\">\n          <span className=\"text-lg\">Debug Mode</span>\n          <Button\n            icon={<FaTimes className=\"text-danger\" />}\n            onClick={() => setDebugMode('off')}\n            size=\"sm\"\n            variant=\"flat\"\n          />\n        </div>\n      }\n    >\n      <Button\n        variant={debugTestIdsEnabled ? 'solid' : 'light'}\n        icon={<FaBullseye />}\n        className=\"mb-4 ml-auto mr-auto\"\n        onClick={() =>\n          setDebugMode(debugMode === 'debug' ? 'debug-testids' : 'debug')\n        }\n      >\n        {debugTestIdsEnabled ? 'Hide CopyButton' : 'Show CopyButton'}\n      </Button>\n      <Json\n        value={{\n          values: validationValues,\n          errors: validationErrors,\n          dirtyFields,\n          isValid,\n          isSubmitting,\n        }}\n      />\n    </Card>\n  );\n};\nexport default FormDebugViewer;\n","import Form from './Form';\n\nexport type { FormProps } from './Form';\n\nexport { Form };\n\nexport default Form;\n"]}

package/dist/{chunk-AQHKELUR.js → chunk-U26GTLKF.js}

@@ -1,15 +1,15 @@
 import {
-  Controller
-} from "./chunk-KOKIM2ND.js";
+  Controller_default
+} from "./chunk-4EJS5FXY.js";
 import {
   FieldCopyTestIdButton_default
 } from "./chunk-2CRY7VDQ.js";
 import {
   FieldValidationError_default
-} from "./chunk-WKM2D7LF.js";
+} from "./chunk-VX76MJAI.js";
 import {
   useFormContext
-} from "./chunk-BZAPTLMC.js";
+} from "./chunk-MRXNKY72.js";
 
 // src/TextArea/TextArea.tsx
 import { Textarea as NextTextArea } from "@nextui-org/input";
@@ -29,14 +29,16 @@ var TextArea = ({
   const showTestIdCopyButton = debugMode === "debug-testids";
   const showLabel = label || showTestIdCopyButton;
   return /* @__PURE__ */ jsx(
-    Controller,
+    Controller_default,
     {
       control,
       name,
       disabled,
       render: ({
-        field: { disabled: isDisabled, onChange, onBlur, value, ref }
+        field: { disabled: isDisabled, onChange, onBlur, value = "", ref }
       }) => {
+        var _a;
+        const displayValue = (_a = value == null ? void 0 : value.toString()) != null ? _a : "";
         return /* @__PURE__ */ jsx(
           NextTextArea,
           {
@@ -56,7 +58,7 @@ var TextArea = ({
             labelPlacement: "outside",
             placeholder,
             name,
-            value,
+            value: displayValue,
             onChange,
             onBlur,
             ref,
@@ -77,4 +79,4 @@ export {
   TextArea_default,
   TextArea_default2
 };
-//# sourceMappingURL=chunk-AQHKELUR.js.map
+//# sourceMappingURL=chunk-U26GTLKF.js.map

package/dist/chunk-U26GTLKF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/TextArea/TextArea.tsx","../src/TextArea/index.ts"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport { Textarea as NextTextArea } from '@nextui-org/input';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from '../Controller';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport interface TextAreaProps {\n  /** Child components. The content of the textarea. */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** Determines if the TextArea is disabled or not. */\n  disabled?: boolean;\n  /** Label displayed above the TextArea. */\n  label?: ReactNode;\n  /** Name the TextArea is registered at in HTML forms (react-hook-form). */\n  name: string;\n  /** placeholder for the textArea content. */\n  placeholder?: string;\n  /** Id to grab element in internal tests. */\n  testId?: string;\n}\n\n/**\n * TextArea component based on [NextUI TextArea](https://nextui.org/docs/components/textarea)\n */\nconst TextArea = ({\n  children = null,\n  className = undefined,\n  disabled = false,\n  label = undefined,\n  name,\n  placeholder = ' ',\n  testId: _testId = undefined,\n}: TextAreaProps) => {\n  const { control, debugMode, getFieldState } = useFormContext();\n  const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const showLabel = label || showTestIdCopyButton;\n\n  return (\n    <Controller\n      control={control}\n      name={name}\n      disabled={disabled}\n      render={({\n        field: { disabled: isDisabled, onChange, onBlur, value = '', ref },\n      }) => {\n        /**\n         * Ensures the textarea always has a defined string value to prevent uncontrolled to\n         * controlled component warnings:\n         *\n         * 1. Warning Prevention:\n         *    - Sets default value to '' in field destructuring\n         *    - Guarantees the value prop is never undefined/null\n         *    - Prevents React warning: \"A component is changing from uncontrolled to controlled\"\n         *\n         * 2. Value Handling:\n         *    - Converts undefined/null to empty string\n         *    - Converts non-string values to strings\n         *    - Maintains existing string values\n         *\n         * Examples:\n         * - undefined → \"\" (prevents uncontrolled warning)\n         * - null → \"\" (prevents uncontrolled warning)\n         * - \"hello\" → \"hello\" (maintains string value)\n         * - 123 → \"123\" (converts to string)\n         *\n         * Without this handling, the textarea could switch between controlled/uncontrolled\n         * states when the form value changes from undefined to defined, causing React warnings\n         * and potential rendering issues.\n         */\n        const displayValue = value?.toString() ?? '';\n\n        return (\n          <NextTextArea\n            className={cn(className)}\n            classNames={{\n              inputWrapper: 'group-data-[focus=true]:border-focus',\n            }}\n            data-testid={testId}\n            errorMessage={error && <FieldValidationError error={error} />}\n            isDisabled={isDisabled}\n            isRequired={required}\n            isInvalid={invalid}\n            label={\n              showLabel && (\n                <>\n                  {label}\n                  {showTestIdCopyButton && (\n                    <FieldCopyTestIdButton testId={testId} />\n                  )}\n                </>\n              )\n            }\n            labelPlacement=\"outside\"\n            placeholder={placeholder}\n            name={name}\n            value={displayValue}\n            onChange={onChange}\n            onBlur={onBlur}\n            ref={ref}\n            variant=\"bordered\"\n          >\n            {children}\n          </NextTextArea>\n        );\n      }}\n    />\n  );\n};\n\nexport default TextArea;\n","import TextArea from './TextArea';\n\nexport type { TextAreaProps } from './TextArea';\n\nexport { TextArea };\n\nexport default TextArea;\n"],"mappings":";;;;;;;;;;;;;;AAEA,SAAS,YAAY,oBAAoB;AAEzC,SAAS,UAAU;AAmFgB,SAMnB,UANmB,KAMnB,YANmB;AAxDnC,IAAM,WAAW,CAAC;AAAA,EAChB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,QAAQ;AAAA,EACR;AAAA,EACA,cAAc;AAAA,EACd,QAAQ,UAAU;AACpB,MAAqB;AACnB,QAAM,EAAE,SAAS,WAAW,cAAc,IAAI,eAAe;AAC7D,QAAM,EAAE,OAAO,SAAS,UAAU,OAAO,IAAI,cAAc,MAAM,OAAO;AAExE,QAAM,uBAAuB,cAAc;AAC3C,QAAM,YAAY,SAAS;AAE3B,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA,QAAQ,CAAC;AAAA,QACP,OAAO,EAAE,UAAU,YAAY,UAAU,QAAQ,QAAQ,IAAI,IAAI;AAAA,MACnE,MAAM;AArDZ;AA8EQ,cAAM,gBAAe,oCAAO,eAAP,YAAqB;AAE1C,eACE;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,GAAG,SAAS;AAAA,YACvB,YAAY;AAAA,cACV,cAAc;AAAA,YAChB;AAAA,YACA,eAAa;AAAA,YACb,cAAc,SAAS,oBAAC,gCAAqB,OAAc;AAAA,YAC3D;AAAA,YACA,YAAY;AAAA,YACZ,WAAW;AAAA,YACX,OACE,aACE,iCACG;AAAA;AAAA,cACA,wBACC,oBAAC,iCAAsB,QAAgB;AAAA,eAE3C;AAAA,YAGJ,gBAAe;AAAA,YACf;AAAA,YACA;AAAA,YACA,OAAO;AAAA,YACP;AAAA,YACA;AAAA,YACA;AAAA,YACA,SAAQ;AAAA,YAEP;AAAA;AAAA,QACH;AAAA,MAEJ;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,mBAAQ;;;AChHf,IAAOA,oBAAQ;","names":["TextArea_default"]}

package/dist/{chunk-GN5NJ6ZU.js → chunk-UJYXA5AD.js}

@@ -1,9 +1,9 @@
 import {
   useFormContext
-} from "./chunk-BZAPTLMC.js";
+} from "./chunk-MRXNKY72.js";
 import {
   slugify
-} from "./chunk-V46BHM2U.js";
+} from "./chunk-IEF2GJ22.js";
 
 // src/SubmitButton/SubmitButton.tsx
 import { cn } from "@fuf-stack/pixel-utils";
@@ -45,4 +45,4 @@ export {
   SubmitButton_default,
   SubmitButton_default2
 };
-//# sourceMappingURL=chunk-GN5NJ6ZU.js.map
+//# sourceMappingURL=chunk-UJYXA5AD.js.map

package/dist/chunk-V5HTEMWZ.cjs

@@ -0,0 +1,51 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+var _chunk4AXNPSXGcjs = require('./chunk-4AXNPSXG.cjs');
+
+
+
+
+var _chunk4DAZAO6Ycjs = require('./chunk-4DAZAO6Y.cjs');
+
+// src/Controller/Controller.tsx
+var _reacthookform = require('react-hook-form');
+var _jsxruntime = require('react/jsx-runtime');
+var Controller = (_a) => {
+  var _b = _a, {
+    render
+  } = _b, props = _chunk4DAZAO6Ycjs.__objRest.call(void 0, _b, [
+    "render"
+  ]);
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+    _reacthookform.Controller,
+    _chunk4DAZAO6Ycjs.__spreadProps.call(void 0, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, props), {
+      render: (_a2) => {
+        var _b2 = _a2, { field } = _b2, rest = _chunk4DAZAO6Ycjs.__objRest.call(void 0, _b2, ["field"]);
+        return render(_chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {
+          field: _chunk4DAZAO6Ycjs.__spreadProps.call(void 0, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, field), {
+            // Handles both direct values (onChange("value")) and events (onChange(event))
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            onChange: (...event) => {
+              var _a3, _b3, _c;
+              const value = (_c = (_b3 = (_a3 = event[0]) == null ? void 0 : _a3.target) == null ? void 0 : _b3.value) != null ? _c : event[0];
+              field.onChange(_chunk4AXNPSXGcjs.toNullishString.call(void 0, value));
+            },
+            // Convert null/undefined to empty string for UI display
+            value: _chunk4AXNPSXGcjs.fromNullishString.call(void 0, field.value)
+          })
+        }, rest));
+      }
+    })
+  );
+};
+var Controller_default = Controller;
+
+// src/Controller/index.ts
+var Controller_default2 = Controller_default;
+
+
+
+
+exports.Controller_default = Controller_default; exports.Controller_default2 = Controller_default2;
+//# sourceMappingURL=chunk-V5HTEMWZ.cjs.map

package/dist/chunk-V5HTEMWZ.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-V5HTEMWZ.cjs","../src/Controller/Controller.tsx","../src/Controller/index.ts"],"names":["_a","_b","Controller_default"],"mappings":"AAAA;AACE;AACA;AACF,wDAA6B;AAC7B;AACE;AACA;AACA;AACF,wDAA6B;AAC7B;AACA;ACHA,gDAA4C;AA8CxC,+CAAA;AALJ,IAAM,WAAA,EAAa,CAAuC,EAAA,EAAA,GAGrB;AAHqB,EAAA,IAAA,GAAA,EAAA,EAAA,EACxD;AAAA,IAAA;AAAA,EAjDF,EAAA,EAgD0D,EAAA,EAErD,MAAA,EAAA,yCAAA,EAFqD,EAErD;AAAA,IADH;AAAA,EAAA,CAAA,CAAA;AAGA,EAAA,uBACE,6BAAA;AAAA,IAAC,yBAAA;AAAA,IAAA,6CAAA,8CAAA,CAAA,CAAA,EAEK,KAAA,CAAA,EAFL;AAAA,MAGC,MAAA,EAAQ,CAACA,GAAAA,EAAAA,GAAuB;AAAvB,QAAA,IAAAC,IAAAA,EAAAD,GAAAA,EAAE,EAAA,MAxDjB,EAAA,EAwDeC,GAAAA,EAAY,KAAA,EAAA,yCAAA,GAAZA,EAAY,CAAV,OAAA,CAAA,CAAA;AACT,QAAA,OAAO,MAAA,CAAO,8CAAA;AAAA,UACZ,KAAA,EAAO,6CAAA,8CAAA,CAAA,CAAA,EACF,KAAA,CAAA,EADE;AAAA;AAAA;AAAA,YAIL,QAAA,EAAU,CAAA,GAAI,KAAA,EAAA,GAAiB;AA9D3C,cAAA,IAAAD,GAAAA,EAAAC,GAAAA,EAAA,EAAA;AA+Dc,cAAA,MAAM,MAAA,EAAA,CAAQ,GAAA,EAAA,CAAAA,IAAAA,EAAAA,CAAAD,IAAAA,EAAA,KAAA,CAAM,CAAC,CAAA,EAAA,GAAP,KAAA,EAAA,KAAA,EAAA,EAAAA,GAAAA,CAAU,MAAA,EAAA,GAAV,KAAA,EAAA,KAAA,EAAA,EAAAC,GAAAA,CAAkB,KAAA,EAAA,GAAlB,KAAA,EAAA,GAAA,EAA2B,KAAA,CAAM,CAAC,CAAA;AAChD,cAAA,KAAA,CAAM,QAAA,CAAS,+CAAA,KAAqB,CAAC,CAAA;AAAA,YACvC,CAAA;AAAA;AAAA,YAEA,KAAA,EAAO,iDAAA,KAAkB,CAAM,KAAK;AAAA,UACtC,CAAA;AAAA,QAAA,CAAA,EACG,IAAA,CACJ,CAAA;AAAA,MACH;AAAA,IAAA,CAAA;AAAA,EACF,CAAA;AAEJ,CAAA;AAEA,IAAO,mBAAA,EAAQ,UAAA;ADlCf;AACA;AErCA,IAAOC,oBAAAA,EAAQ,kBAAA;AFuCf;AACA;AACE;AACA;AACF,mGAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-V5HTEMWZ.cjs","sourcesContent":[null,"import type {\n  ControllerFieldState,\n  ControllerRenderProps,\n  ControllerProps as RHFControllerProps,\n  UseFormStateReturn,\n} from 'react-hook-form';\n\nimport { Controller as RHFController } from 'react-hook-form';\n\nimport { fromNullishString, toNullishString } from '../helpers';\n\nexport type ControllerProps<TFieldValues extends object = object> = Omit<\n  RHFControllerProps<TFieldValues>,\n  'render'\n> & {\n  /**\n   * Render prop that receives the form control props with nullish string handling.\n   * The field object contains all the properties needed to control an input:\n   * - onChange: Handles both direct value changes and event objects\n   * - value: Always provides a string value, converting null/undefined to empty string\n   * - name, ref, etc: Other standard field properties from react-hook-form\n   */\n  render: (props: {\n    field: Omit<ControllerRenderProps<TFieldValues>, 'onChange' | 'value'> & {\n      // Using any[] to support both direct value changes and React synthetic events\n      // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      onChange: (...event: any[]) => void;\n      value: string;\n    };\n    formState: UseFormStateReturn<TFieldValues>;\n    fieldState: ControllerFieldState;\n  }) => React.ReactElement;\n};\n\n/**\n * A wrapper around react-hook-form's Controller that transparently handles nullish string conversions.\n *\n * Key features:\n * 1. Empty strings ('') in the UI are stored as null in form state\n * 2. Null/undefined values in form state are displayed as empty strings in the UI\n * 3. Handles both direct value changes and React synthetic events\n * 4. Maintains the same API as react-hook-form's Controller\n *\n * This enables consistent handling of empty/null values while keeping a clean API\n * for form inputs that expect string values.\n *\n * @see https://react-hook-form.com/docs/usecontroller/controller\n */\nconst Controller = <TFieldValues extends object = object>({\n  render,\n  ...props\n}: ControllerProps<TFieldValues>) => {\n  return (\n    <RHFController<TFieldValues>\n      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...props}\n      render={({ field, ...rest }) => {\n        return render({\n          field: {\n            ...field,\n            // Handles both direct values (onChange(\"value\")) and events (onChange(event))\n            // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            onChange: (...event: any[]) => {\n              const value = event[0]?.target?.value ?? event[0];\n              field.onChange(toNullishString(value));\n            },\n            // Convert null/undefined to empty string for UI display\n            value: fromNullishString(field.value) as string,\n          },\n          ...rest,\n        });\n      }}\n    />\n  );\n};\n\nexport default Controller;\n","import Controller from './Controller';\n\nexport type { ControllerProps } from './Controller';\n\nexport { Controller };\n\nexport default Controller;\n"]}

package/dist/{chunk-VZ5MMFIF.cjs → chunk-V7LRZ5GK.cjs}

@@ -1,9 +1,9 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkXJWEUCV3cjs = require('./chunk-XJWEUCV3.cjs');
+var _chunk2NSCPLAAcjs = require('./chunk-2NSCPLAA.cjs');
 
 
-var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
+var _chunk4AXNPSXGcjs = require('./chunk-4AXNPSXG.cjs');
 
 // src/SubmitButton/SubmitButton.tsx
 var _pixelutils = require('@fuf-stack/pixel-utils');
@@ -20,13 +20,13 @@ var SubmitButton = ({
 }) => {
   const {
     formState: { isSubmitting, isValidating }
-  } = _chunkXJWEUCV3cjs.useFormContext.call(void 0, );
+  } = _chunk2NSCPLAAcjs.useFormContext.call(void 0, );
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
     _pixels.Button,
     {
       className: _pixelutils.cn.call(void 0, className),
       color,
-      testId: _chunkBBB4FEY6cjs.slugify.call(void 0, testId),
+      testId: _chunk4AXNPSXGcjs.slugify.call(void 0, testId),
       disabled: isSubmitting || isValidating,
       loading,
       onClick,
@@ -45,4 +45,4 @@ var SubmitButton_default2 = SubmitButton_default;
 
 
 exports.SubmitButton_default = SubmitButton_default; exports.SubmitButton_default2 = SubmitButton_default2;
-//# sourceMappingURL=chunk-VZ5MMFIF.cjs.map
+//# sourceMappingURL=chunk-V7LRZ5GK.cjs.map

package/dist/{chunk-VZ5MMFIF.cjs.map → chunk-V7LRZ5GK.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-VZ5MMFIF.cjs","../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"names":["SubmitButton_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACJA,oDAAmB;AACnB,2CAAuB;AAsCnB,+CAAA;AAbJ,IAAM,aAAA,EAAe,CAAC;AAAA,EACpB,SAAA,EAAW,QAAA;AAAA,EACX,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,MAAA,EAAQ,SAAA;AAAA,EACR,QAAA,EAAU,KAAA;AAAA,EACV,QAAA,EAAU,KAAA,CAAA;AAAA,EACV,KAAA,EAAO,IAAA;AAAA,EACP,OAAA,EAAS;AACX,CAAA,EAAA,GAAyB;AACvB,EAAA,MAAM;AAAA,IACJ,SAAA,EAAW,EAAE,YAAA,EAAc,aAAa;AAAA,EAC1C,EAAA,EAAI,8CAAA,CAAe;AACnB,EAAA,uBACE,6BAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,4BAAA,SAAY,CAAA;AAAA,MACvB,KAAA;AAAA,MACA,MAAA,EAAQ,uCAAA,MAAc,CAAA;AAAA,MACtB,QAAA,EAAU,aAAA,GAAgB,YAAA;AAAA,MAC1B,OAAA;AAAA,MACA,OAAA;AAAA,MACA,IAAA;AAAA,MACA,IAAA,EAAK,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EACH,CAAA;AAEJ,CAAA;AAEA,IAAO,qBAAA,EAAQ,YAAA;ADlBf;AACA;AElCA,IAAOA,sBAAAA,EAAQ,oBAAA;AFoCf;AACA;AACE;AACA;AACF,2GAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-VZ5MMFIF.cjs","sourcesContent":[null,"import type { ButtonProps } from '@fuf-stack/pixels';\nimport type { ReactNode } from 'react';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\n\nexport interface SubmitButtonProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** color of the button */\n  color?: ButtonProps['color'];\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** function called when the button is pressed. */\n  onClick?: ButtonProps['onClick'];\n  /** size of the 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  children = 'Submit',\n  className = undefined,\n  color = 'success',\n  loading = false,\n  onClick = undefined,\n  size = 'md',\n  testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n  const {\n    formState: { isSubmitting, isValidating },\n  } = useFormContext();\n  return (\n    <Button\n      className={cn(className)}\n      color={color}\n      testId={slugify(testId)}\n      disabled={isSubmitting || isValidating}\n      loading={loading}\n      onClick={onClick}\n      size={size}\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-V7LRZ5GK.cjs","../src/SubmitButton/SubmitButton.tsx","../src/SubmitButton/index.ts"],"names":["SubmitButton_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACA;ACJA,oDAAmB;AACnB,2CAAuB;AAsCnB,+CAAA;AAbJ,IAAM,aAAA,EAAe,CAAC;AAAA,EACpB,SAAA,EAAW,QAAA;AAAA,EACX,UAAA,EAAY,KAAA,CAAA;AAAA,EACZ,MAAA,EAAQ,SAAA;AAAA,EACR,QAAA,EAAU,KAAA;AAAA,EACV,QAAA,EAAU,KAAA,CAAA;AAAA,EACV,KAAA,EAAO,IAAA;AAAA,EACP,OAAA,EAAS;AACX,CAAA,EAAA,GAAyB;AACvB,EAAA,MAAM;AAAA,IACJ,SAAA,EAAW,EAAE,YAAA,EAAc,aAAa;AAAA,EAC1C,EAAA,EAAI,8CAAA,CAAe;AACnB,EAAA,uBACE,6BAAA;AAAA,IAAC,cAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,4BAAA,SAAY,CAAA;AAAA,MACvB,KAAA;AAAA,MACA,MAAA,EAAQ,uCAAA,MAAc,CAAA;AAAA,MACtB,QAAA,EAAU,aAAA,GAAgB,YAAA;AAAA,MAC1B,OAAA;AAAA,MACA,OAAA;AAAA,MACA,IAAA;AAAA,MACA,IAAA,EAAK,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EACH,CAAA;AAEJ,CAAA;AAEA,IAAO,qBAAA,EAAQ,YAAA;ADlBf;AACA;AElCA,IAAOA,sBAAAA,EAAQ,oBAAA;AFoCf;AACA;AACE;AACA;AACF,2GAAC","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-V7LRZ5GK.cjs","sourcesContent":[null,"import type { ButtonProps } from '@fuf-stack/pixels';\nimport type { ReactNode } from 'react';\n\nimport { cn } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\n\nexport interface SubmitButtonProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** color of the button */\n  color?: ButtonProps['color'];\n  /** If set loading animation is shown */\n  loading?: boolean;\n  /** function called when the button is pressed. */\n  onClick?: ButtonProps['onClick'];\n  /** size of the 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  children = 'Submit',\n  className = undefined,\n  color = 'success',\n  loading = false,\n  onClick = undefined,\n  size = 'md',\n  testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n  const {\n    formState: { isSubmitting, isValidating },\n  } = useFormContext();\n  return (\n    <Button\n      className={cn(className)}\n      color={color}\n      testId={slugify(testId)}\n      disabled={isSubmitting || isValidating}\n      loading={loading}\n      onClick={onClick}\n      size={size}\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"]}

package/dist/{chunk-WKM2D7LF.js → chunk-VX76MJAI.js}

@@ -1,6 +1,6 @@
 import {
   slugify
-} from "./chunk-V46BHM2U.js";
+} from "./chunk-IEF2GJ22.js";
 
 // src/partials/FieldValidationError/FieldValidationError.tsx
 import { jsx } from "react/jsx-runtime";
@@ -44,4 +44,4 @@ export {
   FieldValidationError_default,
   FieldValidationError_default2
 };
-//# sourceMappingURL=chunk-WKM2D7LF.js.map
+//# sourceMappingURL=chunk-VX76MJAI.js.map

package/dist/chunk-W66BVPTB.js

@@ -0,0 +1,248 @@
+import {
+  Controller_default
+} from "./chunk-4EJS5FXY.js";
+import {
+  FieldCopyTestIdButton_default
+} from "./chunk-2CRY7VDQ.js";
+import {
+  FieldValidationError_default
+} from "./chunk-VX76MJAI.js";
+import {
+  useFormContext
+} from "./chunk-MRXNKY72.js";
+import {
+  slugify
+} from "./chunk-IEF2GJ22.js";
+import {
+  __spreadProps,
+  __spreadValues
+} from "./chunk-CRTRMMJ7.js";
+
+// src/Select/Select.tsx
+import { useState } from "react";
+import ReactSelect, { components } from "react-select";
+import { useSelect } from "@nextui-org/select";
+import { cn, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
+import { jsx, jsxs } from "react/jsx-runtime";
+var selectVariants = tv({
+  slots: {
+    base: "group leading-normal",
+    clearIndicator: "rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-foreground-800",
+    control: "rounded-lg border-2 border-default-200 !duration-150 transition-background hover:border-default-400 group-data-[invalid=true]:border-danger group-data-[invalid=true]:hover:border-danger motion-reduce:transition-none",
+    control_focused: "border-focus",
+    crossIcon: "",
+    downChevron: "",
+    dropdownIndicator: "rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-black",
+    group: "",
+    groupHeading: "mb-1 ml-3 mt-2 text-sm text-foreground-500",
+    indicatorsContainer: "gap-1 p-1",
+    indicatorSeparator: "bg-default-300",
+    input: "py-0.5 pl-1",
+    // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts
+    label: 'pointer-events-auto relative bottom-1.5 ml-1 text-small subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-["*"]',
+    loadingIndicator: "",
+    loadingMessage: "",
+    menu: "mt-2 rounded-xl border border-default-200 bg-content1 p-1 shadow-lg",
+    menuList: "",
+    // ensure menu has same z-index as modal so it is visible when rendered in modal
+    // see: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)
+    menuPortal: "!z-50",
+    multiValue: "items-center gap-1.5 rounded bg-default-100 py-0.5 pl-2 pr-1",
+    multiValueContainer: "",
+    multiValueLabel: "py-0.5 leading-6",
+    multiValueRemove: "rounded text-default-500 hover:cursor-pointer hover:border-default-300 hover:text-default-800",
+    noOptionsMessage: "rounded-sm p-2 text-foreground-500",
+    option_focused: "bg-default-100 active:bg-default-200",
+    option_selected: "bg-default-300",
+    option: "rounded px-3 py-2 hover:cursor-pointer",
+    placeholder: "ml-1 py-0.5 pl-1 text-sm text-foreground-500",
+    selectContainer: "",
+    singleValue: "!ml-1 !leading-7",
+    valueContainer: "gap-1 p-1"
+  }
+});
+var InputComponent = (props) => {
+  const testId = `${props.selectProps["data-testid"]}`;
+  return /* @__PURE__ */ jsx(components.Input, __spreadValues({ "data-testid": testId }, props));
+};
+var ControlComponent = (props) => {
+  const testId = `${props.selectProps["data-testid"]}_select`;
+  return /* @__PURE__ */ jsx("div", { "data-testid": testId, children: /* @__PURE__ */ jsx(components.Control, __spreadValues({}, props)) });
+};
+var OptionComponent = (props) => {
+  var _a, _b, _c;
+  const testId = `${props.selectProps["data-testid"]}_select_option_${slugify((_c = (_a = props == null ? void 0 : props.data) == null ? void 0 : _a.testId) != null ? _c : (_b = props == null ? void 0 : props.data) == null ? void 0 : _b.value)}`;
+  return /* @__PURE__ */ jsx("div", { "data-testid": testId, children: /* @__PURE__ */ jsx(components.Option, __spreadValues({}, props)) });
+};
+var DropdownIndicatorComponent = (props) => {
+  const testId = props == null ? void 0 : props.selectProps["data-testid"];
+  return /* @__PURE__ */ jsx("div", { "data-testid": `${testId}_select_dropdown`, children: /* @__PURE__ */ jsx(components.DropdownIndicator, __spreadValues({}, props)) });
+};
+var Select = ({
+  className = void 0,
+  clearable = true,
+  disabled = false,
+  filterOption = void 0,
+  renderOptionLabel = void 0,
+  inputValue = void 0,
+  label: _label = void 0,
+  loading = false,
+  multiSelect = false,
+  name,
+  onInputChange = void 0,
+  options,
+  placeholder = void 0,
+  testId: _testId = void 0
+}) => {
+  const { control, debugMode, getFieldState } = useFormContext();
+  const { error, invalid, required, testId } = getFieldState(name, _testId);
+  const [isFocused, setIsFocused] = useState(false);
+  const variants = selectVariants();
+  const classNames = variantsToClassNames(variants, className, "base");
+  const {
+    getBaseProps,
+    getErrorMessageProps,
+    getHelperWrapperProps,
+    getLabelProps,
+    getTriggerProps,
+    getValueProps,
+    label
+  } = useSelect({
+    children: [],
+    classNames,
+    errorMessage: JSON.stringify(error),
+    isDisabled: disabled,
+    isInvalid: invalid,
+    isLoading: loading,
+    isRequired: required,
+    label: _label,
+    labelPlacement: "outside",
+    placeholder: " "
+  });
+  const showTestIdCopyButton = debugMode === "debug-testids";
+  const showLabel = label || showTestIdCopyButton;
+  return /* @__PURE__ */ jsx(
+    Controller_default,
+    {
+      control,
+      name,
+      render: ({
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        field: { onChange, value, ref, onBlur }
+      }) => {
+        var _a;
+        return /* @__PURE__ */ jsxs(
+          "div",
+          __spreadProps(__spreadValues({}, getBaseProps()), {
+            className: cn(classNames.base),
+            "data-testid": `${testId}_wrapper`,
+            "data-required": required,
+            children: [
+              showLabel && /* @__PURE__ */ jsxs(
+                "label",
+                {
+                  className: classNames.label,
+                  "data-slot": "label",
+                  htmlFor: `react-select-${name}-input`,
+                  id: getLabelProps().id,
+                  children: [
+                    label,
+                    showTestIdCopyButton && /* @__PURE__ */ jsx(FieldCopyTestIdButton_default, { testId })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                ReactSelect,
+                {
+                  "aria-errormessage": "",
+                  "aria-labelledby": (_a = getTriggerProps()["aria-labelledby"]) == null ? void 0 : _a.split(" ")[1],
+                  "aria-invalid": invalid,
+                  classNames: {
+                    control: () => cn(classNames.control, {
+                      [classNames.control_focused]: isFocused && !invalid
+                    }),
+                    clearIndicator: () => classNames.clearIndicator,
+                    dropdownIndicator: () => classNames.dropdownIndicator,
+                    groupHeading: () => classNames.groupHeading,
+                    indicatorsContainer: () => classNames.indicatorsContainer,
+                    indicatorSeparator: () => classNames.indicatorSeparator,
+                    input: () => classNames.input,
+                    menu: () => classNames.menu,
+                    menuList: () => classNames.menuList,
+                    menuPortal: () => classNames.menuPortal,
+                    multiValue: () => classNames.multiValue,
+                    multiValueLabel: () => cn(classNames.multiValueLabel, `${getValueProps().className}`),
+                    multiValueRemove: () => classNames.multiValueRemove,
+                    noOptionsMessage: () => classNames.noOptionsMessage,
+                    option: ({
+                      isFocused: optionIsFocused,
+                      isSelected: optionIsSelected
+                    }) => cn(classNames.option, {
+                      [classNames.option_focused]: optionIsFocused,
+                      [classNames.option_selected]: optionIsSelected
+                    }),
+                    placeholder: () => classNames.placeholder,
+                    singleValue: () => cn(classNames.singleValue, `${getValueProps().className}`),
+                    valueContainer: () => classNames.valueContainer
+                  },
+                  components: {
+                    Input: InputComponent,
+                    Option: OptionComponent,
+                    DropdownIndicator: DropdownIndicatorComponent,
+                    Control: ControlComponent
+                  },
+                  "data-testid": testId,
+                  filterOption,
+                  formatOptionLabel: renderOptionLabel,
+                  inputValue,
+                  instanceId: name,
+                  isClearable: clearable,
+                  isDisabled: disabled,
+                  isLoading: loading,
+                  isMulti: multiSelect,
+                  name,
+                  menuPosition: "fixed",
+                  menuShouldBlockScroll: true,
+                  options,
+                  placeholder,
+                  onBlur: (_e) => {
+                    setIsFocused(false);
+                    return onBlur();
+                  },
+                  onChange: (option) => {
+                    if (multiSelect) {
+                      onChange(
+                        option == null ? void 0 : option.map((_option) => _option.value)
+                      );
+                    } else {
+                      onChange(option == null ? void 0 : option.value);
+                    }
+                  },
+                  onFocus: (_e) => {
+                    setIsFocused(true);
+                  },
+                  onInputChange,
+                  ref,
+                  value: options.find((option) => option.value === value),
+                  unstyled: true
+                }
+              ),
+              error && // eslint-disable-next-line react/jsx-props-no-spreading
+              /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({}, getHelperWrapperProps()), { children: /* @__PURE__ */ jsx("div", __spreadProps(__spreadValues({}, getErrorMessageProps()), { children: /* @__PURE__ */ jsx(FieldValidationError_default, { error }) })) }))
+            ]
+          })
+        );
+      }
+    }
+  );
+};
+var Select_default = Select;
+
+// src/Select/index.ts
+var Select_default2 = Select_default;
+
+export {
+  Select_default,
+  Select_default2
+};
+//# sourceMappingURL=chunk-W66BVPTB.js.map

package/dist/{chunk-IUNDGVMC.js.map → chunk-W66BVPTB.js.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/Select/Select.tsx","../src/Select/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { Props } from 'react-select';\n\nimport { useState } from 'react';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@nextui-org/select';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from '../Controller';\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const selectVariants = tv({\n  slots: {\n    base: 'group leading-normal',\n    clearIndicator:\n      'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-foreground-800',\n    control:\n      'rounded-lg border-2 border-default-200 !duration-150 transition-background hover:border-default-400 group-data-[invalid=true]:border-danger group-data-[invalid=true]:hover:border-danger motion-reduce:transition-none',\n    control_focused: 'border-focus',\n    crossIcon: '',\n    downChevron: '',\n    dropdownIndicator:\n      'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-black',\n    group: '',\n    groupHeading: 'mb-1 ml-3 mt-2 text-sm text-foreground-500',\n    indicatorsContainer: 'gap-1 p-1',\n    indicatorSeparator: 'bg-default-300',\n    input: 'py-0.5 pl-1',\n    // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'pointer-events-auto relative bottom-1.5 ml-1 text-small subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    loadingIndicator: '',\n    loadingMessage: '',\n    menu: 'mt-2 rounded-xl border border-default-200 bg-content1 p-1 shadow-lg',\n    menuList: '',\n    // ensure menu has same z-index as modal so it is visible when rendered in modal\n    // see: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n    menuPortal: '!z-50',\n    multiValue: 'items-center gap-1.5 rounded bg-default-100 py-0.5 pl-2 pr-1',\n    multiValueContainer: '',\n    multiValueLabel: 'py-0.5 leading-6',\n    multiValueRemove:\n      'rounded text-default-500 hover:cursor-pointer hover:border-default-300 hover:text-default-800',\n    noOptionsMessage: 'rounded-sm p-2 text-foreground-500',\n    option_focused: 'bg-default-100 active:bg-default-200',\n    option_selected: 'bg-default-300',\n    option: 'rounded px-3 py-2 hover:cursor-pointer',\n    placeholder: 'ml-1 py-0.5 pl-1 text-sm text-foreground-500',\n    selectContainer: '',\n    singleValue: '!ml-1 !leading-7',\n    valueContainer: 'gap-1 p-1',\n  },\n});\n\ntype SelectOption = {\n  /** option label */\n  label?: React.ReactNode;\n  /** option value */\n  value: string;\n};\n\ntype VariantProps = TVProps<typeof selectVariants>;\ntype ClassName = TVClassName<typeof selectVariants>;\n\nexport interface SelectProps extends VariantProps {\n  /** CSS class name */\n  className?: ClassName; // string;\n  /** Determine if the  */\n  clearable?: boolean;\n  /** Set the select to disabled state. */\n  disabled?: boolean;\n  /** Filter Select Options */\n  filterOption?:\n    | undefined\n    | ((option?: SelectOption, inputValue?: string) => boolean);\n  /** Format the label of the option */\n  renderOptionLabel?: undefined | Props['formatOptionLabel'];\n  /** The value of the search input */\n  inputValue?: string;\n  /** Label that should be associated with the select. */\n  label?: React.ReactNode;\n  /** Set the select to a loading state. */\n  loading?: boolean;\n  /** switch between single and multi select mode. */\n  multiSelect?: boolean;\n  /** The name for the Select component, used by react-hook-form */\n  name: string;\n  /** Placeholder that is displayed when nothing is selected */\n  placeholder?: string;\n  /** The options for the Select component */\n  options: SelectOption[];\n  /** Handle change events on the input */\n  onInputChange?: Props['onInputChange'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n  // @ts-expect-error data-testid is not a default prop\n  // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}`;\n  // eslint-disable-next-line react/jsx-props-no-spreading\n  return <components.Input data-testid={testId} {...props} />;\n};\n\nconst ControlComponent: typeof components.Control = (props) => {\n  // @ts-expect-error data-testid is not a default prop\n  // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}_select`;\n  return (\n    <div data-testid={testId}>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n      <components.Control {...props} />\n    </div>\n  );\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n  // @ts-expect-error data-testid is not a default prop\n  // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}_select_option_${slugify(props?.data?.testId ?? props?.data?.value)}`;\n  return (\n    <div data-testid={testId}>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n      <components.Option {...props} />\n    </div>\n  );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n  props,\n) => {\n  // @ts-expect-error data-testid is not a default prop\n  // eslint-disable-next-line react/prop-types\n  const testId = props?.selectProps['data-testid'] as string;\n  return (\n    <div data-testid={`${testId}_select_dropdown`}>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n      <components.DropdownIndicator {...props} />\n    </div>\n  );\n};\n\n/** Select component based on [NextUI Select](https://nextui.org/docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n  className = undefined,\n  clearable = true,\n  disabled = false,\n  filterOption = undefined,\n  renderOptionLabel = undefined,\n  inputValue = undefined,\n  label: _label = undefined,\n  loading = false,\n  multiSelect = false,\n  name,\n  onInputChange = undefined,\n  options,\n  placeholder = undefined,\n  testId: _testId = undefined,\n}: SelectProps) => {\n  const { control, debugMode, getFieldState } = useFormContext();\n  const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n  const [isFocused, setIsFocused] = useState(false);\n\n  const variants = selectVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  const {\n    getBaseProps,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    getLabelProps,\n    getTriggerProps,\n    getValueProps,\n    label,\n  } = useSelect({\n    children: [],\n    classNames,\n    errorMessage: JSON.stringify(error),\n    isDisabled: disabled,\n    isInvalid: invalid,\n    isLoading: loading,\n    isRequired: required,\n    label: _label,\n    labelPlacement: 'outside',\n    placeholder: ' ',\n  });\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const showLabel = label || showTestIdCopyButton;\n\n  return (\n    <Controller\n      control={control}\n      name={name}\n      render={({\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        field: { onChange, value, ref, onBlur },\n      }) => (\n        <div\n          // eslint-disable-next-line react/jsx-props-no-spreading\n          {...getBaseProps()}\n          className={cn(classNames.base)}\n          data-testid={`${testId}_wrapper`}\n          // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n          data-required={required}\n        >\n          {showLabel && (\n            <label\n              className={classNames.label}\n              data-slot=\"label\"\n              htmlFor={`react-select-${name}-input`}\n              id={getLabelProps().id}\n            >\n              {label}\n              {showTestIdCopyButton && (\n                <FieldCopyTestIdButton testId={testId} />\n              )}\n            </label>\n          )}\n          <ReactSelect\n            aria-errormessage=\"\"\n            aria-labelledby={\n              getTriggerProps()['aria-labelledby']?.split(' ')[1]\n            }\n            aria-invalid={invalid}\n            classNames={{\n              control: () =>\n                cn(classNames.control, {\n                  [classNames.control_focused]: isFocused && !invalid,\n                }),\n              clearIndicator: () => classNames.clearIndicator,\n              dropdownIndicator: () => classNames.dropdownIndicator,\n              groupHeading: () => classNames.groupHeading,\n              indicatorsContainer: () => classNames.indicatorsContainer,\n              indicatorSeparator: () => classNames.indicatorSeparator,\n              input: () => classNames.input,\n              menu: () => classNames.menu,\n              menuList: () => classNames.menuList,\n              menuPortal: () => classNames.menuPortal,\n              multiValue: () => classNames.multiValue,\n              multiValueLabel: () =>\n                cn(classNames.multiValueLabel, `${getValueProps().className}`),\n              multiValueRemove: () => classNames.multiValueRemove,\n              noOptionsMessage: () => classNames.noOptionsMessage,\n              option: ({\n                isFocused: optionIsFocused,\n                isSelected: optionIsSelected,\n              }) =>\n                cn(classNames.option, {\n                  [classNames.option_focused]: optionIsFocused,\n                  [classNames.option_selected]: optionIsSelected,\n                }),\n              placeholder: () => classNames.placeholder,\n              singleValue: () =>\n                cn(classNames.singleValue, `${getValueProps().className}`),\n              valueContainer: () => classNames.valueContainer,\n            }}\n            components={{\n              Input: InputComponent,\n              Option: OptionComponent,\n              DropdownIndicator: DropdownIndicatorComponent,\n              Control: ControlComponent,\n            }}\n            // Does not affect the testId of the select, but is needed to pass it to sub-components\n            data-testid={testId}\n            filterOption={filterOption}\n            formatOptionLabel={renderOptionLabel}\n            inputValue={inputValue}\n            instanceId={name}\n            isClearable={clearable}\n            isDisabled={disabled}\n            isLoading={loading}\n            isMulti={multiSelect}\n            name={name}\n            // set menuPosition to fixed so that menu can be rendered\n            // inside Card / Modal components, menuShouldBlockScroll\n            // prevents container scroll when menu is open\n            menuPosition=\"fixed\"\n            menuShouldBlockScroll\n            options={options}\n            placeholder={placeholder}\n            onBlur={(_e) => {\n              setIsFocused(false);\n              return onBlur();\n            }}\n            onChange={(option) => {\n              if (multiSelect) {\n                onChange(\n                  (option as SelectOption[])?.map((_option) => _option.value),\n                );\n              } else {\n                onChange((option as SelectOption)?.value);\n              }\n            }}\n            onFocus={(_e) => {\n              setIsFocused(true);\n            }}\n            onInputChange={onInputChange}\n            ref={ref}\n            // set complete option as value by current field value\n            value={options.find((option) => option.value === value)}\n            unstyled\n          />\n          {error && (\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            <div {...getHelperWrapperProps()}>\n              {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n              <div {...getErrorMessageProps()}>\n                <FieldValidationError error={error} />\n              </div>\n            </div>\n          )}\n        </div>\n      )}\n    />\n  );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"],"mappings":"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","names":["Select_default"]}
+{"version":3,"sources":["../src/Select/Select.tsx","../src/Select/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { Props } from 'react-select';\n\nimport { useState } from 'react';\nimport ReactSelect, { components } from 'react-select';\n\nimport { useSelect } from '@nextui-org/select';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { Controller } from '../Controller';\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const selectVariants = tv({\n  slots: {\n    base: 'group leading-normal',\n    clearIndicator:\n      'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-foreground-800',\n    control:\n      'rounded-lg border-2 border-default-200 !duration-150 transition-background hover:border-default-400 group-data-[invalid=true]:border-danger group-data-[invalid=true]:hover:border-danger motion-reduce:transition-none',\n    control_focused: 'border-focus',\n    crossIcon: '',\n    downChevron: '',\n    dropdownIndicator:\n      'rounded-md p-1 text-foreground-500 hover:cursor-pointer hover:bg-default-200 hover:text-black',\n    group: '',\n    groupHeading: 'mb-1 ml-3 mt-2 text-sm text-foreground-500',\n    indicatorsContainer: 'gap-1 p-1',\n    indicatorSeparator: 'bg-default-300',\n    input: 'py-0.5 pl-1',\n    // See NextUI styles for group-data condition, e.g.: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'pointer-events-auto relative bottom-1.5 ml-1 text-small subpixel-antialiased group-data-[invalid=true]:!text-danger group-data-[required=true]:after:ml-0.5 group-data-[required=true]:after:text-danger group-data-[required=true]:after:content-[\"*\"]',\n    loadingIndicator: '',\n    loadingMessage: '',\n    menu: 'mt-2 rounded-xl border border-default-200 bg-content1 p-1 shadow-lg',\n    menuList: '',\n    // ensure menu has same z-index as modal so it is visible when rendered in modal\n    // see: https://github.com/nextui-org/nextui/blob/main/packages/core/theme/src/components/modal.ts (see z-50)\n    menuPortal: '!z-50',\n    multiValue: 'items-center gap-1.5 rounded bg-default-100 py-0.5 pl-2 pr-1',\n    multiValueContainer: '',\n    multiValueLabel: 'py-0.5 leading-6',\n    multiValueRemove:\n      'rounded text-default-500 hover:cursor-pointer hover:border-default-300 hover:text-default-800',\n    noOptionsMessage: 'rounded-sm p-2 text-foreground-500',\n    option_focused: 'bg-default-100 active:bg-default-200',\n    option_selected: 'bg-default-300',\n    option: 'rounded px-3 py-2 hover:cursor-pointer',\n    placeholder: 'ml-1 py-0.5 pl-1 text-sm text-foreground-500',\n    selectContainer: '',\n    singleValue: '!ml-1 !leading-7',\n    valueContainer: 'gap-1 p-1',\n  },\n});\n\ntype SelectOption = {\n  /** option label */\n  label?: React.ReactNode;\n  /** option value */\n  value: string;\n};\n\ntype VariantProps = TVProps<typeof selectVariants>;\ntype ClassName = TVClassName<typeof selectVariants>;\n\nexport interface SelectProps extends VariantProps {\n  /** CSS class name */\n  className?: ClassName; // string;\n  /** Determine if the  */\n  clearable?: boolean;\n  /** Set the select to disabled state. */\n  disabled?: boolean;\n  /** Filter Select Options */\n  filterOption?:\n    | undefined\n    | ((option?: SelectOption, inputValue?: string) => boolean);\n  /** Format the label of the option */\n  renderOptionLabel?: undefined | Props['formatOptionLabel'];\n  /** The value of the search input */\n  inputValue?: string;\n  /** Label that should be associated with the select. */\n  label?: React.ReactNode;\n  /** Set the select to a loading state. */\n  loading?: boolean;\n  /** switch between single and multi select mode. */\n  multiSelect?: boolean;\n  /** The name for the Select component, used by react-hook-form */\n  name: string;\n  /** Placeholder that is displayed when nothing is selected */\n  placeholder?: string;\n  /** The options for the Select component */\n  options: SelectOption[];\n  /** Handle change events on the input */\n  onInputChange?: Props['onInputChange'];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\nconst InputComponent: typeof components.Input = (props) => {\n  // @ts-expect-error data-testid is not a default prop\n  // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}`;\n  // eslint-disable-next-line react/jsx-props-no-spreading\n  return <components.Input data-testid={testId} {...props} />;\n};\n\nconst ControlComponent: typeof components.Control = (props) => {\n  // @ts-expect-error data-testid is not a default prop\n  // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}_select`;\n  return (\n    <div data-testid={testId}>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n      <components.Control {...props} />\n    </div>\n  );\n};\n\nconst OptionComponent: typeof components.Option = (props) => {\n  // @ts-expect-error data-testid is not a default prop\n  // eslint-disable-next-line react/prop-types, react/destructuring-assignment\n  const testId = `${props.selectProps['data-testid']}_select_option_${slugify(props?.data?.testId ?? props?.data?.value)}`;\n  return (\n    <div data-testid={testId}>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n      <components.Option {...props} />\n    </div>\n  );\n};\n\nconst DropdownIndicatorComponent: typeof components.DropdownIndicator = (\n  props,\n) => {\n  // @ts-expect-error data-testid is not a default prop\n  // eslint-disable-next-line react/prop-types\n  const testId = props?.selectProps['data-testid'] as string;\n  return (\n    <div data-testid={`${testId}_select_dropdown`}>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n      <components.DropdownIndicator {...props} />\n    </div>\n  );\n};\n\n/** Select component based on [NextUI Select](https://nextui.org/docs/components/select) and [React-Select](https://react-select.com/home) */\nconst Select = ({\n  className = undefined,\n  clearable = true,\n  disabled = false,\n  filterOption = undefined,\n  renderOptionLabel = undefined,\n  inputValue = undefined,\n  label: _label = undefined,\n  loading = false,\n  multiSelect = false,\n  name,\n  onInputChange = undefined,\n  options,\n  placeholder = undefined,\n  testId: _testId = undefined,\n}: SelectProps) => {\n  const { control, debugMode, getFieldState } = useFormContext();\n  const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n  const [isFocused, setIsFocused] = useState(false);\n\n  const variants = selectVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  const {\n    getBaseProps,\n    getErrorMessageProps,\n    getHelperWrapperProps,\n    getLabelProps,\n    getTriggerProps,\n    getValueProps,\n    label,\n  } = useSelect({\n    children: [],\n    classNames,\n    errorMessage: JSON.stringify(error),\n    isDisabled: disabled,\n    isInvalid: invalid,\n    isLoading: loading,\n    isRequired: required,\n    label: _label,\n    labelPlacement: 'outside',\n    placeholder: ' ',\n  });\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const showLabel = label || showTestIdCopyButton;\n\n  return (\n    <Controller\n      control={control}\n      name={name}\n      render={({\n        // eslint-disable-next-line @typescript-eslint/no-unused-vars\n        field: { onChange, value, ref, onBlur },\n      }) => (\n        <div\n          // eslint-disable-next-line react/jsx-props-no-spreading\n          {...getBaseProps()}\n          className={cn(classNames.base)}\n          data-testid={`${testId}_wrapper`}\n          // See NextUI styles for group-data condition (data-invalid), e.g.: https://github.com/nextui-org/nextui/blob/main/packages/components/select/src/use-select.ts\n          data-required={required}\n        >\n          {showLabel && (\n            <label\n              className={classNames.label}\n              data-slot=\"label\"\n              htmlFor={`react-select-${name}-input`}\n              id={getLabelProps().id}\n            >\n              {label}\n              {showTestIdCopyButton && (\n                <FieldCopyTestIdButton testId={testId} />\n              )}\n            </label>\n          )}\n          <ReactSelect\n            aria-errormessage=\"\"\n            aria-labelledby={\n              getTriggerProps()['aria-labelledby']?.split(' ')[1]\n            }\n            aria-invalid={invalid}\n            classNames={{\n              control: () =>\n                cn(classNames.control, {\n                  [classNames.control_focused]: isFocused && !invalid,\n                }),\n              clearIndicator: () => classNames.clearIndicator,\n              dropdownIndicator: () => classNames.dropdownIndicator,\n              groupHeading: () => classNames.groupHeading,\n              indicatorsContainer: () => classNames.indicatorsContainer,\n              indicatorSeparator: () => classNames.indicatorSeparator,\n              input: () => classNames.input,\n              menu: () => classNames.menu,\n              menuList: () => classNames.menuList,\n              menuPortal: () => classNames.menuPortal,\n              multiValue: () => classNames.multiValue,\n              multiValueLabel: () =>\n                cn(classNames.multiValueLabel, `${getValueProps().className}`),\n              multiValueRemove: () => classNames.multiValueRemove,\n              noOptionsMessage: () => classNames.noOptionsMessage,\n              option: ({\n                isFocused: optionIsFocused,\n                isSelected: optionIsSelected,\n              }) =>\n                cn(classNames.option, {\n                  [classNames.option_focused]: optionIsFocused,\n                  [classNames.option_selected]: optionIsSelected,\n                }),\n              placeholder: () => classNames.placeholder,\n              singleValue: () =>\n                cn(classNames.singleValue, `${getValueProps().className}`),\n              valueContainer: () => classNames.valueContainer,\n            }}\n            components={{\n              Input: InputComponent,\n              Option: OptionComponent,\n              DropdownIndicator: DropdownIndicatorComponent,\n              Control: ControlComponent,\n            }}\n            // Does not affect the testId of the select, but is needed to pass it to sub-components\n            data-testid={testId}\n            filterOption={filterOption}\n            formatOptionLabel={renderOptionLabel}\n            inputValue={inputValue}\n            instanceId={name}\n            isClearable={clearable}\n            isDisabled={disabled}\n            isLoading={loading}\n            isMulti={multiSelect}\n            name={name}\n            // set menuPosition to fixed so that menu can be rendered\n            // inside Card / Modal components, menuShouldBlockScroll\n            // prevents container scroll when menu is open\n            menuPosition=\"fixed\"\n            menuShouldBlockScroll\n            options={options}\n            placeholder={placeholder}\n            onBlur={(_e) => {\n              setIsFocused(false);\n              return onBlur();\n            }}\n            onChange={(option) => {\n              if (multiSelect) {\n                onChange(\n                  (option as SelectOption[])?.map((_option) => _option.value),\n                );\n              } else {\n                onChange((option as SelectOption)?.value);\n              }\n            }}\n            onFocus={(_e) => {\n              setIsFocused(true);\n            }}\n            onInputChange={onInputChange}\n            ref={ref}\n            // set complete option as value by current field value\n            value={options.find((option) => option.value === value)}\n            unstyled\n          />\n          {error && (\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            <div {...getHelperWrapperProps()}>\n              {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n              <div {...getErrorMessageProps()}>\n                <FieldValidationError error={error} />\n              </div>\n            </div>\n          )}\n        </div>\n      )}\n    />\n  );\n};\n\nexport default Select;\n","import Select from './Select';\n\nexport type { SelectProps } from './Select';\n\nexport { Select };\n\nexport default Select;\n"],"mappings":"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","names":["Select_default"]}

package/dist/{chunk-BS52M4SZ.js → chunk-WAXJ64P7.js}

@@ -1,18 +1,22 @@
 import {
-  Controller
-} from "./chunk-KOKIM2ND.js";
+  Controller_default
+} from "./chunk-4EJS5FXY.js";
 import {
   FieldCopyTestIdButton_default
 } from "./chunk-2CRY7VDQ.js";
 import {
   FieldValidationError_default
-} from "./chunk-WKM2D7LF.js";
+} from "./chunk-VX76MJAI.js";
 import {
-  useFormContext
-} from "./chunk-BZAPTLMC.js";
+  useFormContext,
+  useInput
+} from "./chunk-MRXNKY72.js";
+import {
+  __spreadProps,
+  __spreadValues
+} from "./chunk-CRTRMMJ7.js";
 
 // src/Switch/Switch.tsx
-import { useInput } from "@nextui-org/input";
 import { Switch as NextSwitch } from "@nextui-org/switch";
 import { tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -51,7 +55,7 @@ var Switch = ({
   const classNames = variantsToClassNames(variants, className, "outerWrapper");
   const showTestIdCopyButton = debugMode === "debug-testids";
   return /* @__PURE__ */ jsx(
-    Controller,
+    Controller_default,
     {
       name,
       control,
@@ -83,10 +87,9 @@ var Switch = ({
         ),
         error && /* @__PURE__ */ jsx("div", { className: classNames.errorMessage, children: /* @__PURE__ */ jsx(
           "div",
-          {
-            ...getErrorMessageProps(),
+          __spreadProps(__spreadValues({}, getErrorMessageProps()), {
             children: /* @__PURE__ */ jsx(FieldValidationError_default, { error })
-          }
+          })
         ) })
       ] })
     }
@@ -101,4 +104,4 @@ export {
   Switch_default,
   Switch_default2
 };
-//# sourceMappingURL=chunk-BS52M4SZ.js.map
+//# sourceMappingURL=chunk-WAXJ64P7.js.map