@fuf-stack/uniform 0.14.4 → 0.15.0

package/dist/chunk-K43U2JVG.cjs

@@ -0,0 +1,248 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var _chunkV5HTEMWZcjs = require('./chunk-V5HTEMWZ.cjs');
+
+
+var _chunkJU5RT22Ycjs = require('./chunk-JU5RT22Y.cjs');
+
+
+var _chunkC4RM2JSDcjs = require('./chunk-C4RM2JSD.cjs');
+
+
+var _chunk2NSCPLAAcjs = require('./chunk-2NSCPLAA.cjs');
+
+
+var _chunk4AXNPSXGcjs = require('./chunk-4AXNPSXG.cjs');
+
+
+
+var _chunk4DAZAO6Ycjs = require('./chunk-4DAZAO6Y.cjs');
+
+// src/Select/Select.tsx
+var _react = require('react');
+var _reactselect = require('react-select'); var _reactselect2 = _interopRequireDefault(_reactselect);
+var _select = require('@nextui-org/select');
+var _pixelutils = require('@fuf-stack/pixel-utils');
+var _jsxruntime = require('react/jsx-runtime');
+var selectVariants = _pixelutils.tv.call(void 0, {
+  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__ */ _jsxruntime.jsx.call(void 0, _reactselect.components.Input, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, { "data-testid": testId }, props));
+};
+var ControlComponent = (props) => {
+  const testId = `${props.selectProps["data-testid"]}_select`;
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { "data-testid": testId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactselect.components.Control, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, props)) });
+};
+var OptionComponent = (props) => {
+  var _a, _b, _c;
+  const testId = `${props.selectProps["data-testid"]}_select_option_${_chunk4AXNPSXGcjs.slugify.call(void 0, (_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__ */ _jsxruntime.jsx.call(void 0, "div", { "data-testid": testId, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactselect.components.Option, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, props)) });
+};
+var DropdownIndicatorComponent = (props) => {
+  const testId = props == null ? void 0 : props.selectProps["data-testid"];
+  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { "data-testid": `${testId}_select_dropdown`, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactselect.components.DropdownIndicator, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, 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 } = _chunk2NSCPLAAcjs.useFormContext.call(void 0, );
+  const { error, invalid, required, testId } = getFieldState(name, _testId);
+  const [isFocused, setIsFocused] = _react.useState.call(void 0, false);
+  const variants = selectVariants();
+  const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "base");
+  const {
+    getBaseProps,
+    getErrorMessageProps,
+    getHelperWrapperProps,
+    getLabelProps,
+    getTriggerProps,
+    getValueProps,
+    label
+  } = _select.useSelect.call(void 0, {
+    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__ */ _jsxruntime.jsx.call(void 0, 
+    _chunkV5HTEMWZcjs.Controller_default,
+    {
+      control,
+      name,
+      render: ({
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        field: { onChange, value, ref, onBlur }
+      }) => {
+        var _a;
+        return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+          "div",
+          _chunk4DAZAO6Ycjs.__spreadProps.call(void 0, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, getBaseProps()), {
+            className: _pixelutils.cn.call(void 0, classNames.base),
+            "data-testid": `${testId}_wrapper`,
+            "data-required": required,
+            children: [
+              showLabel && /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
+                "label",
+                {
+                  className: classNames.label,
+                  "data-slot": "label",
+                  htmlFor: `react-select-${name}-input`,
+                  id: getLabelProps().id,
+                  children: [
+                    label,
+                    showTestIdCopyButton && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkJU5RT22Ycjs.FieldCopyTestIdButton_default, { testId })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
+                _reactselect2.default,
+                {
+                  "aria-errormessage": "",
+                  "aria-labelledby": (_a = getTriggerProps()["aria-labelledby"]) == null ? void 0 : _a.split(" ")[1],
+                  "aria-invalid": invalid,
+                  classNames: {
+                    control: () => _pixelutils.cn.call(void 0, 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: () => _pixelutils.cn.call(void 0, classNames.multiValueLabel, `${getValueProps().className}`),
+                    multiValueRemove: () => classNames.multiValueRemove,
+                    noOptionsMessage: () => classNames.noOptionsMessage,
+                    option: ({
+                      isFocused: optionIsFocused,
+                      isSelected: optionIsSelected
+                    }) => _pixelutils.cn.call(void 0, classNames.option, {
+                      [classNames.option_focused]: optionIsFocused,
+                      [classNames.option_selected]: optionIsSelected
+                    }),
+                    placeholder: () => classNames.placeholder,
+                    singleValue: () => _pixelutils.cn.call(void 0, 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__ */ _jsxruntime.jsx.call(void 0, "div", _chunk4DAZAO6Ycjs.__spreadProps.call(void 0, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, getHelperWrapperProps()), { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", _chunk4DAZAO6Ycjs.__spreadProps.call(void 0, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, getErrorMessageProps()), { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkC4RM2JSDcjs.FieldValidationError_default, { error }) })) }))
+            ]
+          })
+        );
+      }
+    }
+  );
+};
+var Select_default = Select;
+
+// src/Select/index.ts
+var Select_default2 = Select_default;
+
+
+
+
+exports.Select_default = Select_default; exports.Select_default2 = Select_default2;
+//# sourceMappingURL=chunk-K43U2JVG.cjs.map

package/dist/chunk-K43U2JVG.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-K43U2JVG.cjs","../src/Select/Select.tsx","../src/Select/index.ts"],"names":["Select_default"],"mappings":"AAAA;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACF,wDAA6B;AAC7B;AACE;AACA;AACF,wDAA6B;AAC7B;AACA;ACjBA,8BAAyB;AACzB,qGAAwC;AAExC,4CAA0B;AAE1B,oDAA6C;AAmGpC,+CAAA;AA3FF,IAAM,eAAA,EAAiB,4BAAA;AAAG,EAC/B,KAAA,EAAO;AAAA,IACL,IAAA,EAAM,sBAAA;AAAA,IACN,cAAA,EACE,wGAAA;AAAA,IACF,OAAA,EACE,yNAAA;AAAA,IACF,eAAA,EAAiB,cAAA;AAAA,IACjB,SAAA,EAAW,EAAA;AAAA,IACX,WAAA,EAAa,EAAA;AAAA,IACb,iBAAA,EACE,+FAAA;AAAA,IACF,KAAA,EAAO,EAAA;AAAA,IACP,YAAA,EAAc,4CAAA;AAAA,IACd,mBAAA,EAAqB,WAAA;AAAA,IACrB,kBAAA,EAAoB,gBAAA;AAAA,IACpB,KAAA,EAAO,aAAA;AAAA;AAAA,IAEP,KAAA,EACE,yPAAA;AAAA,IACF,gBAAA,EAAkB,EAAA;AAAA,IAClB,cAAA,EAAgB,EAAA;AAAA,IAChB,IAAA,EAAM,qEAAA;AAAA,IACN,QAAA,EAAU,EAAA;AAAA;AAAA;AAAA,IAGV,UAAA,EAAY,OAAA;AAAA,IACZ,UAAA,EAAY,8DAAA;AAAA,IACZ,mBAAA,EAAqB,EAAA;AAAA,IACrB,eAAA,EAAiB,kBAAA;AAAA,IACjB,gBAAA,EACE,+FAAA;AAAA,IACF,gBAAA,EAAkB,oCAAA;AAAA,IAClB,cAAA,EAAgB,sCAAA;AAAA,IAChB,eAAA,EAAiB,gBAAA;AAAA,IACjB,MAAA,EAAQ,wCAAA;AAAA,IACR,WAAA,EAAa,8CAAA;AAAA,IACb,eAAA,EAAiB,EAAA;AAAA,IACjB,WAAA,EAAa,kBAAA;AAAA,IACb,cAAA,EAAgB;AAAA,EAClB;AACF,CAAC,CAAA;AA6CD,IAAM,eAAA,EAA0C,CAAC,KAAA,EAAA,GAAU;AAGzD,EAAA,MAAM,OAAA,EAAS,CAAA,EAAA;AAER,EAAA;AACT;AAEM;AAGW,EAAA;AAEb,EAAA;AAKJ;AAEM;AA1HN,EAAA;AA6HiB,EAAA;AAEb,EAAA;AAKJ;AAEM;AAKW,EAAA;AAEb,EAAA;AAKJ;AAGgB;AACF,EAAA;AACA,EAAA;AACD,EAAA;AACI,EAAA;AACf,EAAA;AACa,EAAA;AACG,EAAA;AACN,EAAA;AACI,EAAA;AACd,EAAA;AACgB,EAAA;AAChB,EAAA;AACc,EAAA;AACN,EAAA;AACS;AACT,EAAA;AACO,EAAA;AAER,EAAA;AAED,EAAA;AACA,EAAA;AAEA,EAAA;AACJ,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACA,IAAA;AACY,EAAA;AACD,IAAA;AACX,IAAA;AACc,IAAA;AACF,IAAA;AACD,IAAA;AACA,IAAA;AACC,IAAA;AACL,IAAA;AACP,IAAA;AACa,IAAA;AACd,EAAA;AAEK,EAAA;AACA,EAAA;AAGJ,EAAA;AAAC,IAAA;AAAA,IAAA;AACC,MAAA;AACA,MAAA;AACS,MAAA;AAAA;AAEE,QAAA;AACR,MAAA;AA5MT,QAAA;AA6MQ,QAAA;AAAC,UAAA;AAAA,UAAA;AAGC,YAAA;AACA,YAAA;AAEA,YAAA;AAEC,YAAA;AAAA,cAAA;AACE,gBAAA;AAAA,gBAAA;AACC,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AAEC,kBAAA;AAAA,oBAAA;AAAA,oBAAA;AAEwC,kBAAA;AAAA,gBAAA;AAE3C,cAAA;AAEF,8BAAA;AAAC,gBAAA;AAAA,gBAAA;AACC,kBAAA;AACA,kBAAA;AAGA,kBAAA;AACA,kBAAA;AAAY,oBAAA;AAEe,sBAAA;AACuB,oBAAA;AAC7C,oBAAA;AAC8B,oBAAA;AACG,oBAAA;AACL,oBAAA;AACO,oBAAA;AACD,oBAAA;AACb,oBAAA;AACD,oBAAA;AACI,oBAAA;AACE,oBAAA;AACA,oBAAA;AAEkC,oBAAA;AAC5B,oBAAA;AACA,oBAAA;AAC1B,sBAAA;AACI,sBAAA;AACC,oBAAA;AAEU,sBAAA;AACS,sBAAA;AACC,oBAAA;AAC/B,oBAAA;AAC2B,oBAAA;AAE6B,oBAAA;AAE7D,kBAAA;AACA,kBAAA;AAAY,oBAAA;AACH,oBAAA;AACC,oBAAA;AACW,oBAAA;AAErB,kBAAA;AAEA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AAIA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACA,kBAAA;AACE,oBAAA;AACA,oBAAA;AACF,kBAAA;AACA,kBAAA;AACE,oBAAA;AACE,sBAAA;AAAA,wBAAA;AACuD,sBAAA;AACvD,oBAAA;AAEA,sBAAA;AAAwC,oBAAA;AAE5C,kBAAA;AACA,kBAAA;AACE,oBAAA;AACF,kBAAA;AACA,kBAAA;AACA,kBAAA;AAEA,kBAAA;AACA,kBAAA;AAAQ,gBAAA;AACV,cAAA;AACC,cAAA;AAEC,8BAAA;AAKA,YAAA;AAAA,UAAA;AAEJ,QAAA;AAAA,MAAA;AAAA,IAAA;AAEJ,EAAA;AAEJ;AAEO;ADtFW;AACA;AE1OXA;AF4OW;AACA;AACA;AACA;AACA","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-K43U2JVG.cjs","sourcesContent":[null,"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"]}

package/dist/{chunk-XJZAS7NG.cjs → chunk-MF4JB3YT.cjs}

@@ -1,18 +1,23 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _chunkVQWKXSHWcjs = require('./chunk-VQWKXSHW.cjs');
+var _chunkV5HTEMWZcjs = require('./chunk-V5HTEMWZ.cjs');
 
 
 var _chunkJU5RT22Ycjs = require('./chunk-JU5RT22Y.cjs');
 
 
-var _chunkOHJYXA6Rcjs = require('./chunk-OHJYXA6R.cjs');
+var _chunkC4RM2JSDcjs = require('./chunk-C4RM2JSD.cjs');
 
 
-var _chunkXJWEUCV3cjs = require('./chunk-XJWEUCV3.cjs');
+var _chunk2NSCPLAAcjs = require('./chunk-2NSCPLAA.cjs');
 
 
-var _chunkBBB4FEY6cjs = require('./chunk-BBB4FEY6.cjs');
+var _chunk4AXNPSXGcjs = require('./chunk-4AXNPSXG.cjs');
+
+
+
+
+var _chunk4DAZAO6Ycjs = require('./chunk-4DAZAO6Y.cjs');
 
 // src/RadioGroup/RadioGroup.tsx
 var _radio = require('@nextui-org/radio');
@@ -25,7 +30,8 @@ var _Tabs = require('@fuf-stack/pixels/Tabs'); var _Tabs2 = _interopRequireDefau
 var _visuallyhidden = require('@react-aria/visually-hidden');
 
 var _jsxruntime = require('react/jsx-runtime');
-var RadioBox = ({ icon = void 0, ...props }) => {
+var RadioBox = (_a) => {
+  var _b = _a, { icon = void 0 } = _b, props = _chunk4DAZAO6Ycjs.__objRest.call(void 0, _b, ["icon"]);
   const {
     children,
     Component,
@@ -40,8 +46,7 @@ var RadioBox = ({ icon = void 0, ...props }) => {
   } = _radio.useRadio.call(void 0, props);
   return /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
     Component,
-    {
-      ...getBaseProps(),
+    _chunk4DAZAO6Ycjs.__spreadProps.call(void 0, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, getBaseProps()), {
       className: _pixelutils.cn.call(void 0, 
         "group inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 border-default p-4 hover:bg-content2 data-[selected=true]:border-focus",
         {
@@ -50,22 +55,21 @@ var RadioBox = ({ icon = void 0, ...props }) => {
         }
       ),
       children: [
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _visuallyhidden.VisuallyHidden, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "input", { ...getInputProps() }) }),
-        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { ...getWrapperProps(), children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { ...getControlProps() }) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _visuallyhidden.VisuallyHidden, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "input", _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, getInputProps())) }),
+        /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", _chunk4DAZAO6Ycjs.__spreadProps.call(void 0, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, getWrapperProps()), { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, getControlProps())) })),
         icon,
         /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, 
           "div",
-          {
-            ...getLabelWrapperProps(),
+          _chunk4DAZAO6Ycjs.__spreadProps.call(void 0, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, getLabelWrapperProps()), {
             className: _pixelutils.cn.call(void 0, getLabelWrapperProps().className, "grow"),
             children: [
-              children && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { ...getLabelProps(), children }),
+              children && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", _chunk4DAZAO6Ycjs.__spreadProps.call(void 0, _chunk4DAZAO6Ycjs.__spreadValues.call(void 0, {}, getLabelProps()), { children })),
               description && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "span", { className: "text-small text-foreground opacity-70", children: description })
             ]
-          }
+          })
         )
       ]
-    }
+    })
   );
 };
 
@@ -134,14 +138,14 @@ var RadioGroup = ({
   testId: _testId = void 0,
   variant = "default"
 }) => {
-  const { control, debugMode, getFieldState, getValues } = _chunkXJWEUCV3cjs.useFormContext.call(void 0, );
+  const { control, debugMode, getFieldState, getValues } = _chunk2NSCPLAAcjs.useFormContext.call(void 0, );
   const { error, invalid, required, testId } = getFieldState(name, _testId);
   const showTestIdCopyButton = debugMode === "debug-testids";
   const showLabel = label || showTestIdCopyButton;
   const variants = radioGroupVariants();
   const classNames = _pixelutils.variantsToClassNames.call(void 0, variants, className, "base");
   return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, 
-    _chunkVQWKXSHWcjs.Controller,
+    _chunkV5HTEMWZcjs.Controller_default,
     {
       control,
       disabled,
@@ -169,7 +173,7 @@ var RadioGroup = ({
                   RadioBox,
                   {
                     classNames: itemClassNames,
-                    "data-testid": _chunkBBB4FEY6cjs.slugify.call(void 0, 
+                    "data-testid": _chunk4AXNPSXGcjs.slugify.call(void 0, 
                       `${testId}_option_${option.testId || option.value}`
                     ),
                     description: option.description,
@@ -195,7 +199,7 @@ var RadioGroup = ({
                       [classNames.itemBaseActive]: getValues()[name] !== option.value
                     }),
                     isDisabled: isDisabled || option.disabled,
-                    testID: _chunkBBB4FEY6cjs.slugify.call(void 0, 
+                    testID: _chunk4AXNPSXGcjs.slugify.call(void 0, 
                       `${testId}_option_${option.testId || option.value}`
                     ),
                     onChange,
@@ -225,7 +229,7 @@ var RadioGroup = ({
                   _radio.Radio,
                   {
                     classNames: itemClassNames,
-                    "data-testid": _chunkBBB4FEY6cjs.slugify.call(void 0, 
+                    "data-testid": _chunk4AXNPSXGcjs.slugify.call(void 0, 
                       `${testId}_option_${option.testId || option.value}`
                     ),
                     isDisabled: isDisabled || option.disabled,
@@ -246,7 +250,7 @@ var RadioGroup = ({
             "data-invalid": invalid,
             "data-required": required,
             "data-testid": testId,
-            errorMessage: error && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkOHJYXA6Rcjs.FieldValidationError_default, { error }),
+            errorMessage: error && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkC4RM2JSDcjs.FieldValidationError_default, { error }),
             isDisabled,
             isInvalid: invalid,
             isRequired: required,
@@ -276,4 +280,4 @@ var RadioGroup_default2 = RadioGroup_default;
 
 
 exports.RadioGroup_default = RadioGroup_default; exports.RadioGroup_default2 = RadioGroup_default2;
-//# sourceMappingURL=chunk-XJZAS7NG.cjs.map
+//# sourceMappingURL=chunk-MF4JB3YT.cjs.map

package/dist/chunk-MF4JB3YT.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-MF4JB3YT.cjs","../src/RadioGroup/RadioGroup.tsx","../src/RadioGroup/Variants/RadioBox.tsx","../src/RadioGroup/Variants/RadioButton.tsx","../src/RadioGroup/index.ts"],"names":["jsx","cn"],"mappings":"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","file":"/home/runner/work/pixels/pixels/packages/uniform/dist/chunk-MF4JB3YT.cjs","sourcesContent":[null,"import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type { TabProps } from '@fuf-stack/pixels/Tabs';\nimport type { ReactElement, ReactNode } from 'react';\n\nimport { RadioGroup as NextRadioGroup, Radio } from '@nextui-org/radio';\n\nimport { cn, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\nimport { ButtonGroup } from '@fuf-stack/pixels';\nimport Tabs from '@fuf-stack/pixels/Tabs';\n\nimport { Controller } from '../Controller';\nimport { slugify } from '../helpers';\nimport { useFormContext } from '../hooks';\nimport { FieldCopyTestIdButton } from '../partials/FieldCopyTestIdButton';\nimport { FieldValidationError } from '../partials/FieldValidationError';\nimport { RadioBox } from './Variants/RadioBox';\nimport { RadioButton } from './Variants/RadioButton';\n\nexport const radioGroupVariants = tv({\n  slots: {\n    base: 'group', // Needs group for group-data condition\n    buttonGroup:\n      'rounded-xl group-data-[invalid=true]:border group-data-[invalid=true]:border-danger', // optional if a button group is used\n    itemBase: '',\n    itemBaseActive: 'bg-opacity-50', // optional if a button group is used\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 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      'text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:text-danger',\n    wrapper: '',\n    // Tabs\n    tabList: '',\n    tab: '',\n    tabContent: '',\n    cursor: '',\n    panel: '',\n  },\n});\n\ntype VariantProps = TVProps<typeof radioGroupVariants>;\ntype ClassName = TVClassName<typeof radioGroupVariants>;\n\nexport interface RadioGroupOption {\n  /** Description of the value. Works with variant radioBox. */\n  description?: React.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 RadioGroupProps<\n  V extends 'default' | 'radioBox' | 'radioButton' | 'tabs',\n> 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: V extends 'default' | 'radioBox' | 'radioButton'\n    ? RadioGroupOption[]\n    : TabProps[];\n  /** Id to grab element in internal tests. */\n  testId?: string;\n  /** How the RadioGroup should look like. */\n  variant?: V;\n}\n\n/**\n * RadioGroup component based on [NextUI RadioGroup](https://nextui.org/docs/components/radio-group)\n */\nconst RadioGroup = ({\n  className = undefined,\n  disabled = false,\n  inline = false,\n  label = undefined,\n  name,\n  options,\n  testId: _testId = undefined,\n  variant = 'default',\n}: RadioGroupProps<\n  'default' | 'radioBox' | 'radioButton' | 'tabs'\n>): ReactElement => {\n  const { control, debugMode, getFieldState, getValues } = useFormContext();\n\n  const { error, invalid, required, testId } = getFieldState(name, _testId);\n\n  const showTestIdCopyButton = debugMode === 'debug-testids';\n  const showLabel = label || showTestIdCopyButton;\n\n  const variants = radioGroupVariants();\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  return (\n    <Controller\n      control={control}\n      disabled={disabled}\n      name={name}\n      render={({ field: { onChange, disabled: isDisabled, onBlur, ref } }) => {\n        let RadioComponents: ReactNode;\n\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          tabList: classNames.tabList,\n          tab: classNames.tab,\n          tabContent: classNames.tabContent,\n          cursor: classNames.cursor,\n          panel: classNames.panel,\n        };\n\n        switch (variant) {\n          case 'radioBox':\n            RadioComponents = options.map((option) => {\n              if ('value' in option) {\n                return (\n                  <RadioBox\n                    classNames={itemClassNames}\n                    data-testid={slugify(\n                      `${testId}_option_${option.testId || option.value}`,\n                    )}\n                    description={option.description}\n                    icon={option.icon}\n                    isDisabled={isDisabled || option.disabled}\n                    key={option.value}\n                    onChange={onChange}\n                    value={option.value}\n                  >\n                    {option.label ? option.label : option.value}\n                  </RadioBox>\n                );\n              }\n              return null;\n            });\n            break;\n          case 'radioButton':\n            RadioComponents = options.map((option) => {\n              if ('value' in option) {\n                return (\n                  <RadioButton\n                    className={cn(classNames.itemBase, {\n                      [classNames.itemBaseActive]:\n                        getValues()[name] !== option.value,\n                    })}\n                    isDisabled={isDisabled || option.disabled}\n                    key={option.value}\n                    testID={slugify(\n                      `${testId}_option_${option.testId || option.value}`,\n                    )}\n                    onChange={onChange}\n                    value={option.value}\n                    // TODO: how to do the classNames properly (make selected option darker with same color)\n                  >\n                    {option.label ? option.label : option.value}\n                  </RadioButton>\n                );\n              }\n              return null;\n            });\n            break;\n\n          case 'tabs':\n            RadioComponents = (\n              <Tabs\n                fullWidth={false}\n                tabs={options as TabProps[]}\n                onSelectionChange={onChange}\n              />\n            );\n            break;\n          default:\n            RadioComponents = options.map((option) => {\n              if ('value' in option) {\n                return (\n                  <Radio\n                    classNames={itemClassNames}\n                    data-testid={slugify(\n                      `${testId}_option_${option.testId || option.value}`,\n                    )}\n                    isDisabled={isDisabled || option.disabled}\n                    key={option.value}\n                    onChange={onChange}\n                    value={option.value}\n                  >\n                    {option.label ? option.label : option.value}\n                  </Radio>\n                );\n              }\n              return null;\n            });\n        }\n\n        return (\n          <NextRadioGroup\n            classNames={classNames}\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-invalid={invalid}\n            data-required={required}\n            data-testid={testId}\n            errorMessage={error && <FieldValidationError error={error} />}\n            isDisabled={isDisabled}\n            isInvalid={invalid}\n            isRequired={required}\n            label={\n              showLabel && (\n                // eslint-disable-next-line jsx-a11y/label-has-associated-control\n                <label>\n                  {label}\n                  {showTestIdCopyButton && (\n                    <FieldCopyTestIdButton testId={testId} />\n                  )}\n                </label>\n              )\n            }\n            name={name}\n            orientation={inline ? 'horizontal' : 'vertical'}\n            onBlur={onBlur}\n            onChange={onChange}\n            ref={ref}\n          >\n            {variant === 'radioButton' ? (\n              <ButtonGroup className={classNames.buttonGroup}>\n                {RadioComponents}\n              </ButtonGroup>\n            ) : (\n              RadioComponents\n            )}\n          </NextRadioGroup>\n        );\n      }}\n    />\n  );\n};\n\nexport default RadioGroup;\n","import type { RadioProps as NextRadioProps } from '@nextui-org/radio';\nimport type { ReactNode } from 'react';\n\nimport { useRadio } from '@nextui-org/radio';\nimport { VisuallyHidden } from '@react-aria/visually-hidden';\n\nimport { cn } from '@fuf-stack/pixel-utils';\n\ninterface RadioProps extends NextRadioProps {\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      // eslint-disable-next-line react/jsx-props-no-spreading\n      {...getBaseProps()}\n      className={cn(\n        'group inline-flex flex-auto cursor-pointer items-center justify-between gap-4 rounded-lg border-2 border-default p-4 hover:bg-content2 data-[selected=true]:border-focus',\n        {\n          // disabled styles\n          'pointer-events-none opacity-disabled': isDisabled,\n        },\n      )}\n    >\n      <VisuallyHidden>\n        {/* eslint-disable-next-line react/jsx-props-no-spreading  */}\n        <input {...getInputProps()} />\n      </VisuallyHidden>\n      {/* eslint-disable-next-line react/jsx-props-no-spreading  */}\n      <span {...getWrapperProps()}>\n        {/* eslint-disable-next-line react/jsx-props-no-spreading  */}\n        <span {...getControlProps()} />\n      </span>\n      {icon}\n      <div\n        // eslint-disable-next-line react/jsx-props-no-spreading\n        {...getLabelWrapperProps()}\n        className={cn(getLabelWrapperProps().className, 'grow')}\n      >\n        {/* eslint-disable-next-line react/jsx-props-no-spreading  */}\n        {children && <span {...getLabelProps()}>{children}</span>}\n        {description && (\n          <span className=\"text-small text-foreground opacity-70\">\n            {description}\n          </span>\n        )}\n      </div>\n    </Component>\n  );\n};\n\nexport default RadioBox;\n","import { cn } from '@fuf-stack/pixel-utils';\nimport { Button } from '@fuf-stack/pixels';\n\ninterface RadioButtonProps {\n  /** label of the value. */\n  children: React.ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** disables the option */\n  isDisabled?: boolean;\n  /** HTML data-testid attribute of the option */\n  testID?: string;\n  /** Callback function. Executed if the option is clicked. */\n  onChange: (...event: unknown[]) => void;\n  /** value of the option. */\n  value: string;\n}\n\nexport const RadioButton = ({\n  children,\n  className = undefined,\n  isDisabled = false,\n  onChange,\n  testID = undefined,\n  value,\n}: RadioButtonProps) => {\n  return (\n    <Button\n      className={cn(className)}\n      testId={testID}\n      disabled={isDisabled}\n      key={`index_${value}`}\n      onClick={() => {\n        return onChange(value);\n      }}\n    >\n      {children}\n    </Button>\n  );\n};\n\nexport default RadioButton;\n","import RadioGroup from './RadioGroup';\n\nexport type { RadioGroupProps } from './RadioGroup';\n\nexport { RadioGroup };\n\nexport default RadioGroup;\n"]}

package/dist/{chunk-BZAPTLMC.js → chunk-MRXNKY72.js}

@@ -1,6 +1,13 @@
 import {
-  slugify
-} from "./chunk-V46BHM2U.js";
+  slugify,
+  toValidationFormat
+} from "./chunk-IEF2GJ22.js";
+import {
+  __async,
+  __objRest,
+  __spreadProps,
+  __spreadValues
+} from "./chunk-CRTRMMJ7.js";
 
 // src/hooks/useFieldArray/useFieldArray.ts
 import { useFieldArray } from "react-hook-form";
@@ -14,13 +21,6 @@ import React, { useMemo, useState } from "react";
 import { FormProvider as HookFormProvider, useForm } from "react-hook-form";
 import { useLocalStorage } from "@fuf-stack/pixels";
 import { jsx } from "react/jsx-runtime";
-var removeNullishFields = (obj) => {
-  return JSON.parse(
-    JSON.stringify(obj, (_key, value) => {
-      return value === "" || value === null ? void 0 : value;
-    })
-  );
-};
 var DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT = "uniform:debug-mode";
 var UniformContext = React.createContext({
   debugMode: "off",
@@ -38,14 +38,14 @@ var FormProvider = ({
 }) => {
   const [preventSubmit, setPreventSubmit] = useState(false);
   const [debugMode, setDebugMode] = useLocalStorage(
-    debugModeSettings?.localStorageKey || DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT,
+    (debugModeSettings == null ? void 0 : debugModeSettings.localStorageKey) || DEBUG_MODE_LOCAL_STORAGE_KEY_DEFAULT,
     "off"
   );
   const contextValue = useMemo(
     () => ({
       // set debugMode to disabled when debugModeSettings.disable is true
       // otherwise use current debug mode from localStorage
-      debugMode: debugModeSettings?.disable ? "disabled" : debugMode,
+      debugMode: (debugModeSettings == null ? void 0 : debugModeSettings.disable) ? "disabled" : debugMode,
       preventSubmit: (prevent) => {
         setPreventSubmit(prevent);
       },
@@ -53,41 +53,39 @@ var FormProvider = ({
       validation
     }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [debugMode, debugModeSettings?.disable]
+    [debugMode, debugModeSettings == null ? void 0 : debugModeSettings.disable]
   );
-  const methods = useForm({
-    defaultValues: initialValues,
-    // add validation config when validation schema provided
-    ...validation ? {
-      // set rhf mode
-      // see: https://react-hook-form.com/docs/useform#mode
-      mode: validationTrigger,
-      resolver: async (values) => {
-        const { data, errors, ...rest } = await validation.validateAsync(
-          removeNullishFields(values)
-        );
-        return { values: data || {}, errors: errors || {}, ...rest };
-      }
-    } : {}
-  });
-  const handleSubmit = async (e) => {
+  const methods = useForm(__spreadValues({
+    defaultValues: initialValues
+  }, validation ? {
+    // set rhf mode
+    // see: https://react-hook-form.com/docs/useform#mode
+    mode: validationTrigger,
+    resolver: (values) => __async(void 0, null, function* () {
+      const _a = yield validation.validateAsync(
+        toValidationFormat(values)
+      ), { data, errors } = _a, rest = __objRest(_a, ["data", "errors"]);
+      return __spreadValues({ values: data || {}, errors: errors || {} }, rest);
+    })
+  } : {}));
+  const handleSubmit = (e) => __async(void 0, null, function* () {
     if (methods.formState.isValid && preventSubmit) {
       console.warn(
         "[FormProvider] form submit was prevented because preventSubmit is true..."
       );
-      e?.preventDefault();
+      e == null ? void 0 : e.preventDefault();
       return Promise.resolve();
     }
-    await methods.handleSubmit(onSubmit)(e);
-  };
-  return /* @__PURE__ */ jsx(UniformContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(HookFormProvider, { ...methods, children: children({ handleSubmit }) }) });
+    yield methods.handleSubmit(onSubmit)(e);
+  });
+  return /* @__PURE__ */ jsx(UniformContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx(HookFormProvider, __spreadProps(__spreadValues({}, methods), { children: children({ handleSubmit }) })) });
 };
 var FormContext_default = FormProvider;
 
 // src/hooks/useFormContext/useFormContext.ts
 var checkFieldIsRequired = (validation, path) => {
   const checkRequired = (schema) => {
-    if (schema.type === "array" && schema?.minLength) {
+    if (schema.type === "array" && (schema == null ? void 0 : schema.minLength)) {
       return true;
     }
     return !schema.isOptional && !schema.isNullable;
@@ -95,39 +93,41 @@ var checkFieldIsRequired = (validation, path) => {
   return validation.checkSchemaPath(checkRequired, path);
 };
 var useFormContext = () => {
-  const {
+  const _a = useHookFormContext(), {
     formState,
+    getFieldState: getFieldStateOrig
+  } = _a, otherMethods = __objRest(_a, [
+    "formState",
     // https://react-hook-form.com/docs/useform/getfieldstate
     // for getFieldState a subscription to formState properties is needed!
-    getFieldState: getFieldStateOrig,
-    ...otherMethods
-  } = useHookFormContext();
+    "getFieldState"
+  ]);
   const uniformContext = useContext(UniformContext);
   const getFieldState = (name, testId) => {
     const fieldPath = typeof name === "string" ? name.replace(/\[\d+\]/g, "").split(".") : name;
-    const required = uniformContext?.validation ? checkFieldIsRequired(uniformContext.validation, fieldPath) : false;
-    const { error, ...rest } = getFieldStateOrig(name, formState);
-    return {
-      ...rest,
+    const required = (uniformContext == null ? void 0 : uniformContext.validation) ? checkFieldIsRequired(uniformContext.validation, fieldPath) : false;
+    const _a2 = getFieldStateOrig(name, formState), { error } = _a2, rest = __objRest(_a2, ["error"]);
+    return __spreadProps(__spreadValues({}, rest), {
       error,
       // Ensure correct type for error
       required,
       testId: slugify(testId || name)
-    };
+    });
   };
-  return {
-    ...otherMethods,
-    ...uniformContext,
+  return __spreadProps(__spreadValues(__spreadValues({}, otherMethods), uniformContext), {
     getFieldState,
     formState
-  };
+  });
 };
 
+// src/hooks/useInput/useInput.ts
+import { useInput } from "@nextui-org/input";
+
 export {
   useFieldArray,
-  removeNullishFields,
   FormContext_default,
   checkFieldIsRequired,
-  useFormContext
+  useFormContext,
+  useInput
 };
-//# sourceMappingURL=chunk-BZAPTLMC.js.map
+//# sourceMappingURL=chunk-MRXNKY72.js.map