@fuf-stack/uniform 1.10.3 → 1.11.0

package/dist/Checkboxes/index.cjs

@@ -1,19 +1,5 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+Object.defineProperty(exports, '__esModule', { value: true });
+const require_Checkboxes = require('../Checkboxes-Ds6bzl6p.cjs');
 
-
-var _chunkYYR23V5Pcjs = require('../chunk-YYR23V5P.cjs');
-require('../chunk-V3M7HL26.cjs');
-require('../chunk-OE5BOGGX.cjs');
-require('../chunk-NHEZXA4H.cjs');
-require('../chunk-6AWHOBNL.cjs');
-require('../chunk-PCTYJUY7.cjs');
-require('../chunk-56TQOKG7.cjs');
-require('../chunk-FYN7ZWLW.cjs');
-require('../chunk-AQJLKHAE.cjs');
-require('../chunk-OKJWLH7T.cjs');
-require('../chunk-555JRYCS.cjs');
-
-
-
-exports.Checkboxes = _chunkYYR23V5Pcjs.Checkboxes_default; exports.default = _chunkYYR23V5Pcjs.Checkboxes_default2;
-//# sourceMappingURL=index.cjs.map
+exports.Checkboxes = require_Checkboxes.Checkboxes_default$1;
+exports.default = require_Checkboxes.Checkboxes_default;

package/dist/Checkboxes/index.d.cts

@@ -1,11 +1,2 @@
-import { C as Checkboxes } from '../Checkboxes-CBgO9itq.cjs';
-export { b as CheckboxOption, a as CheckboxesProps } from '../Checkboxes-CBgO9itq.cjs';
-import 'react/jsx-runtime';
-import 'tailwind-variants';
-import '@fuf-stack/pixel-utils';
-import 'react';
-import '../hooks/useInputValueTransform/index.cjs';
-
-
-
-export { Checkboxes, Checkboxes as default };
+import { n as Checkboxes, r as CheckboxesProps, t as CheckboxOption } from "../index-CO-l7RmT.cjs";
+export { CheckboxOption, Checkboxes, Checkboxes as default, CheckboxesProps };

package/dist/Checkboxes/index.d.ts

@@ -1,11 +1,2 @@
-import { C as Checkboxes } from '../Checkboxes-CFbsc6zg.js';
-export { b as CheckboxOption, a as CheckboxesProps } from '../Checkboxes-CFbsc6zg.js';
-import 'react/jsx-runtime';
-import 'tailwind-variants';
-import '@fuf-stack/pixel-utils';
-import 'react';
-import '../hooks/useInputValueTransform/index.js';
-
-
-
-export { Checkboxes, Checkboxes as default };
+import { n as Checkboxes, r as CheckboxesProps, t as CheckboxOption } from "../index-DzuP5q-2.js";
+export { CheckboxOption, Checkboxes, Checkboxes as default, CheckboxesProps };

package/dist/Checkboxes/index.js

@@ -1,19 +1,3 @@
-import {
-  Checkboxes_default,
-  Checkboxes_default2
-} from "../chunk-7OMJ26AT.js";
-import "../chunk-GEC75GNL.js";
-import "../chunk-NTDKZW4E.js";
-import "../chunk-ELYGQTXB.js";
-import "../chunk-5MTIQ6WD.js";
-import "../chunk-AHJJIANM.js";
-import "../chunk-CNTOODUQ.js";
-import "../chunk-SJWL6EMI.js";
-import "../chunk-IV45K4WU.js";
-import "../chunk-O2XJNQQK.js";
-import "../chunk-K2V4ULA2.js";
-export {
-  Checkboxes_default as Checkboxes,
-  Checkboxes_default2 as default
-};
-//# sourceMappingURL=index.js.map
+import { n as Checkboxes_default, t as Checkboxes_default$1 } from "../Checkboxes-CGWhnpBp.js";
+
+export { Checkboxes_default as Checkboxes, Checkboxes_default$1 as default };

package/dist/Checkboxes-CGWhnpBp.js

@@ -0,0 +1,115 @@
+import { n as FieldValidationError_default } from "./FieldValidationError-D86DPSOH.js";
+import { t as useUniformField } from "./useUniformField-ClprfrES.js";
+import { Checkbox, CheckboxGroup } from "@heroui/checkbox";
+import { checkbox } from "@heroui/theme";
+import { slugify, tv, variantsToClassNames } from "@fuf-stack/pixel-utils";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/Checkboxes/Checkboxes.tsx
+const checkboxesVariants = tv({
+	slots: {
+		base: "group",
+		errorMessage: "text-tiny",
+		label: "inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger",
+		optionBase: "",
+		optionIcon: "",
+		optionLabel: "",
+		optionLabelSubline: "text-foreground-400 !text-small",
+		optionWrapper: "",
+		wrapper: ""
+	},
+	variants: {
+		color: {
+			info: { wrapper: "text-info-foreground after:bg-info after:text-info-foreground" },
+			...checkbox.variants.color
+		},
+		lineThrough: { true: {
+			optionLabel: [...checkbox.variants.lineThrough.true.label, "relative before:transition-all before:duration-200"],
+			optionLabelSubline: "group-data-[selected=true]:opacity-60"
+		} }
+	}
+});
+/**
+* Checkboxes component based on [HeroUI CheckboxGroup](https://www.heroui.com//docs/components/checkbox-group)
+*/
+const Checkboxes = ({ className = void 0, color = "primary", inline = false, lineThrough = false, options, name, ...uniformFieldProps }) => {
+	const { ariaLabel, disabled, error: _error, field: { onChange, value: fieldValue, ref, onBlur }, invalid, label, required, testId } = useUniformField({
+		name,
+		...uniformFieldProps
+	});
+	const value = Array.isArray(fieldValue) ? fieldValue : [];
+	const errorMessage = /* @__PURE__ */ jsx(FieldValidationError_default, {
+		error: (_error && Object.values(_error).flat()) ?? [],
+		testId
+	});
+	const classNames = variantsToClassNames(checkboxesVariants({ lineThrough }), className, "base");
+	const heroCheckboxGroupClassNames = {
+		base: classNames.base,
+		label: classNames.label,
+		wrapper: classNames.wrapper
+	};
+	const heroCheckboxClassNames = {
+		base: classNames.optionBase,
+		icon: classNames.optionIcon,
+		label: classNames.optionLabel,
+		wrapper: classNames.optionWrapper
+	};
+	return /* @__PURE__ */ jsx(CheckboxGroup, {
+		ref,
+		"aria-label": ariaLabel,
+		classNames: heroCheckboxGroupClassNames,
+		color: color === "info" ? "primary" : color,
+		"data-invalid": invalid,
+		"data-testid": testId,
+		errorMessage,
+		isDisabled: disabled,
+		isInvalid: invalid,
+		isRequired: required,
+		label: label ? /* @__PURE__ */ jsx("legend", { children: label }) : null,
+		name,
+		onBlur,
+		onChange,
+		orientation: inline ? "horizontal" : "vertical",
+		value,
+		children: options?.map((option) => {
+			const optionTestId = slugify(`${testId}_option_${option?.testId ?? option?.value}`, { replaceDots: true });
+			const hasSubline = !!option.labelSubline;
+			let labelContent;
+			let optionClassNames = heroCheckboxClassNames;
+			if (hasSubline) {
+				labelContent = /* @__PURE__ */ jsxs("div", {
+					className: "flex grow flex-col items-start",
+					children: [/* @__PURE__ */ jsx("span", {
+						className: classNames.optionLabel,
+						children: option.label
+					}), /* @__PURE__ */ jsx("span", {
+						className: classNames.optionLabelSubline,
+						children: option.labelSubline
+					})]
+				});
+				optionClassNames = {
+					...optionClassNames,
+					label: ""
+				};
+			} else labelContent = option.label;
+			return /* @__PURE__ */ jsx(Checkbox, {
+				classNames: optionClassNames,
+				"data-invalid": invalid,
+				"data-testid": optionTestId,
+				isDisabled: !!disabled || option.disabled,
+				value: option?.value,
+				"aria-label": typeof option.label === "string" ? option.label : option.value,
+				children: labelContent
+			}, `index_${option.value}`);
+		})
+	});
+};
+var Checkboxes_default = Checkboxes;
+
+//#endregion
+//#region src/Checkboxes/index.ts
+var Checkboxes_default$1 = Checkboxes_default;
+
+//#endregion
+export { Checkboxes_default as n, Checkboxes_default$1 as t };
+//# sourceMappingURL=Checkboxes-CGWhnpBp.js.map

package/dist/Checkboxes-CGWhnpBp.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkboxes-CGWhnpBp.js","names":["heroCheckboxVariants","FieldValidationError","heroCheckboxGroupClassNames: HeroCheckboxGroupProps['classNames']","heroCheckboxClassNames: HeroCheckboxProps['classNames']","HeroCheckboxGroup","labelContent: ReactNode","HeroCheckbox","Checkboxes"],"sources":["../src/Checkboxes/Checkboxes.tsx","../src/Checkboxes/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type {\n  CheckboxGroupProps as HeroCheckboxGroupProps,\n  CheckboxProps as HeroCheckboxProps,\n} from '@heroui/checkbox';\nimport type { ReactNode } from 'react';\nimport type { FieldError } from 'react-hook-form';\nimport type { InputValueTransform } from '../hooks/useInputValueTransform';\n\nimport {\n  Checkbox as HeroCheckbox,\n  CheckboxGroup as HeroCheckboxGroup,\n} from '@heroui/checkbox';\nimport { checkbox as heroCheckboxVariants } from '@heroui/theme';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const checkboxesVariants = tv({\n  slots: {\n    base: 'group', // Needs group for group-data condition\n    errorMessage: 'text-tiny',\n    // see HeroUI styles for group-data condition,\n    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger',\n    optionBase: '',\n    optionIcon: '',\n    optionLabel: '',\n    optionLabelSubline: 'text-foreground-400 !text-small',\n    optionWrapper: '',\n    wrapper: '',\n  },\n  variants: {\n    // see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/checkbox.ts\n    color: {\n      info: {\n        wrapper:\n          'text-info-foreground after:bg-info after:text-info-foreground',\n      },\n      ...heroCheckboxVariants.variants.color,\n    } as const,\n    lineThrough: {\n      true: {\n        optionLabel: [\n          ...heroCheckboxVariants.variants.lineThrough.true.label,\n          // fix stroke position when used with subline and enable animation\n          'relative before:transition-all before:duration-200',\n        ],\n        optionLabelSubline: 'group-data-[selected=true]:opacity-60',\n      },\n    },\n  },\n});\n\ntype VariantProps = TVProps<typeof checkboxesVariants>;\ntype ClassName = TVClassName<typeof checkboxesVariants>;\n\nexport interface CheckboxOption {\n  /** option label */\n  label?: ReactNode;\n  /** subline displayed below the label */\n  labelSubline?: ReactNode;\n  /** option value */\n  value: string;\n  /** disables the option */\n  disabled?: boolean;\n  /** HTML data-testid attribute of the option */\n  testId?: string;\n}\n\nexport interface CheckboxesProps extends VariantProps {\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** CSS class name */\n  className?: ClassName;\n  /** Color scheme of the checkboxes */\n  color?: VariantProps['color'];\n  /** Sets all checkboxes disabled */\n  disabled?: boolean;\n  /** Orientation of the checkboxes */\n  inline?: boolean;\n  /** Label displayed above the checkboxes */\n  label?: ReactNode;\n  /** Whether the checkboxes label should be crossed out */\n  lineThrough?: boolean;\n  /** Name the Field is registered on the form */\n  name: string;\n  /** Checkboxes that should be displayed. */\n  options: CheckboxOption[];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** allows disentangled display and form values for a field */\n  transform?: InputValueTransform<string[]>;\n}\n\n/**\n * Checkboxes component based on [HeroUI CheckboxGroup](https://www.heroui.com//docs/components/checkbox-group)\n */\nconst Checkboxes = ({\n  className = undefined,\n  color = 'primary',\n  inline = false,\n  lineThrough = false,\n  options,\n  name,\n  ...uniformFieldProps\n}: CheckboxesProps) => {\n  const {\n    ariaLabel,\n    disabled,\n    error: _error,\n    field: { onChange, value: fieldValue, ref, onBlur },\n    invalid,\n    label,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ensure value is always an array (checkboxes need arrays)\n  const value = Array.isArray(fieldValue) ? fieldValue : [];\n\n  // Convert React Hook Form's nested error object structure to a flat array\n  // RHF errors can be nested like: checkboxField.0 (individual checkbox errors)\n  // and checkboxField._error (global field errors) - this flattens all\n  // error values into a single array for rendering with FieldValidationError\n  const errorFlat: FieldError[] =\n    (_error &&\n      Object.values(\n        _error as unknown as Record<string, FieldError[]>,\n      ).flat()) ??\n    [];\n  const errorMessage = (\n    <FieldValidationError error={errorFlat} testId={testId} />\n  );\n\n  // classNames from slots\n  const variants = checkboxesVariants({ lineThrough });\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  // map slots to HeroUI class names\n  const heroCheckboxGroupClassNames: HeroCheckboxGroupProps['classNames'] = {\n    base: classNames.base,\n    label: classNames.label,\n    wrapper: classNames.wrapper,\n  };\n  const heroCheckboxClassNames: HeroCheckboxProps['classNames'] = {\n    base: classNames.optionBase,\n    icon: classNames.optionIcon,\n    label: classNames.optionLabel,\n    wrapper: classNames.optionWrapper,\n  };\n\n  return (\n    <HeroCheckboxGroup\n      ref={ref}\n      aria-label={ariaLabel}\n      classNames={heroCheckboxGroupClassNames}\n      color={color === 'info' ? 'primary' : color}\n      // see HeroUI styles for group-data condition (data-invalid),\n      // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n      data-invalid={invalid}\n      data-testid={testId}\n      errorMessage={errorMessage}\n      isDisabled={disabled}\n      isInvalid={invalid}\n      isRequired={required}\n      label={label ? <legend>{label}</legend> : null}\n      name={name}\n      onBlur={onBlur}\n      onChange={onChange}\n      orientation={inline ? 'horizontal' : 'vertical'}\n      value={value}\n    >\n      {options?.map((option) => {\n        const optionTestId = slugify(\n          `${testId}_option_${option?.testId ?? option?.value}`,\n          { replaceDots: true },\n        );\n\n        // set content and classes depending option has subline\n        const hasSubline = !!option.labelSubline;\n        let labelContent: ReactNode;\n        let optionClassNames = heroCheckboxClassNames;\n        if (hasSubline) {\n          labelContent = (\n            <div className=\"flex grow flex-col items-start\">\n              <span className={classNames.optionLabel}>{option.label}</span>\n              <span className={classNames.optionLabelSubline}>\n                {option.labelSubline}\n              </span>\n            </div>\n          );\n          // remove label classes from outer label when subline is used\n          optionClassNames = { ...optionClassNames, label: '' };\n        } else {\n          labelContent = option.label;\n        }\n\n        return (\n          <HeroCheckbox\n            key={`index_${option.value}`}\n            classNames={optionClassNames}\n            data-invalid={invalid}\n            data-testid={optionTestId}\n            isDisabled={!!disabled || option.disabled}\n            value={option?.value}\n            aria-label={\n              typeof option.label === 'string' ? option.label : option.value\n            }\n          >\n            {labelContent}\n          </HeroCheckbox>\n        );\n      })}\n    </HeroCheckboxGroup>\n  );\n};\n\nexport default Checkboxes;\n","import Checkboxes from './Checkboxes';\n\nexport type { CheckboxesProps, CheckboxOption } from './Checkboxes';\n\nexport { Checkboxes };\n\nexport default Checkboxes;\n"],"mappings":";;;;;;;;AAoBA,MAAa,qBAAqB,GAAG;CACnC,OAAO;EACL,MAAM;EACN,cAAc;EAGd,OACE;EACF,YAAY;EACZ,YAAY;EACZ,aAAa;EACb,oBAAoB;EACpB,eAAe;EACf,SAAS;EACV;CACD,UAAU;EAER,OAAO;GACL,MAAM,EACJ,SACE,iEACH;GACD,GAAGA,SAAqB,SAAS;GAClC;EACD,aAAa,EACX,MAAM;GACJ,aAAa,CACX,GAAGA,SAAqB,SAAS,YAAY,KAAK,OAElD,qDACD;GACD,oBAAoB;GACrB,EACF;EACF;CACF,CAAC;;;;AA8CF,MAAM,cAAc,EAClB,YAAY,QACZ,QAAQ,WACR,SAAS,OACT,cAAc,OACd,SACA,MACA,GAAG,wBACkB;CACrB,MAAM,EACJ,WACA,UACA,OAAO,QACP,OAAO,EAAE,UAAU,OAAO,YAAY,KAAK,UAC3C,SACA,OACA,UACA,WACE,gBAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,QAAQ,MAAM,QAAQ,WAAW,GAAG,aAAa,EAAE;CAYzD,MAAM,eACJ,oBAACC;EAAqB,QANrB,UACC,OAAO,OACL,OACD,CAAC,MAAM,KACV,EAAE;EAE8C;GAAU;CAK5D,MAAM,aAAa,qBADF,mBAAmB,EAAE,aAAa,CAAC,EACF,WAAW,OAAO;CAGpE,MAAMC,8BAAoE;EACxE,MAAM,WAAW;EACjB,OAAO,WAAW;EAClB,SAAS,WAAW;EACrB;CACD,MAAMC,yBAA0D;EAC9D,MAAM,WAAW;EACjB,MAAM,WAAW;EACjB,OAAO,WAAW;EAClB,SAAS,WAAW;EACrB;AAED,QACE,oBAACC;EACM;EACL,cAAY;EACZ,YAAY;EACZ,OAAO,UAAU,SAAS,YAAY;EAGtC,gBAAc;EACd,eAAa;EACC;EACd,YAAY;EACZ,WAAW;EACX,YAAY;EACZ,OAAO,QAAQ,oBAAC,sBAAQ,QAAe,GAAG;EACpC;EACE;EACE;EACV,aAAa,SAAS,eAAe;EAC9B;YAEN,SAAS,KAAK,WAAW;GACxB,MAAM,eAAe,QACnB,GAAG,OAAO,UAAU,QAAQ,UAAU,QAAQ,SAC9C,EAAE,aAAa,MAAM,CACtB;GAGD,MAAM,aAAa,CAAC,CAAC,OAAO;GAC5B,IAAIC;GACJ,IAAI,mBAAmB;AACvB,OAAI,YAAY;AACd,mBACE,qBAAC;KAAI,WAAU;gBACb,oBAAC;MAAK,WAAW,WAAW;gBAAc,OAAO;OAAa,EAC9D,oBAAC;MAAK,WAAW,WAAW;gBACzB,OAAO;OACH;MACH;AAGR,uBAAmB;KAAE,GAAG;KAAkB,OAAO;KAAI;SAErD,gBAAe,OAAO;AAGxB,UACE,oBAACC;IAEC,YAAY;IACZ,gBAAc;IACd,eAAa;IACb,YAAY,CAAC,CAAC,YAAY,OAAO;IACjC,OAAO,QAAQ;IACf,cACE,OAAO,OAAO,UAAU,WAAW,OAAO,QAAQ,OAAO;cAG1D;MAVI,SAAS,OAAO,QAWR;IAEjB;GACgB;;AAIxB,yBAAe;;;;AC1Nf,2BAAeC"}

package/dist/Checkboxes-Ds6bzl6p.cjs

@@ -0,0 +1,127 @@
+const require_FormContext = require('./FormContext-C3GymQOA.cjs');
+const require_FieldValidationError = require('./FieldValidationError-Cq6aI0tE.cjs');
+const require_useUniformField = require('./useUniformField-BMvnRC_r.cjs');
+let __heroui_checkbox = require("@heroui/checkbox");
+let __heroui_theme = require("@heroui/theme");
+let __fuf_stack_pixel_utils = require("@fuf-stack/pixel-utils");
+let react_jsx_runtime = require("react/jsx-runtime");
+
+//#region src/Checkboxes/Checkboxes.tsx
+const checkboxesVariants = (0, __fuf_stack_pixel_utils.tv)({
+	slots: {
+		base: "group",
+		errorMessage: "text-tiny",
+		label: "inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger",
+		optionBase: "",
+		optionIcon: "",
+		optionLabel: "",
+		optionLabelSubline: "text-foreground-400 !text-small",
+		optionWrapper: "",
+		wrapper: ""
+	},
+	variants: {
+		color: {
+			info: { wrapper: "text-info-foreground after:bg-info after:text-info-foreground" },
+			...__heroui_theme.checkbox.variants.color
+		},
+		lineThrough: { true: {
+			optionLabel: [...__heroui_theme.checkbox.variants.lineThrough.true.label, "relative before:transition-all before:duration-200"],
+			optionLabelSubline: "group-data-[selected=true]:opacity-60"
+		} }
+	}
+});
+/**
+* Checkboxes component based on [HeroUI CheckboxGroup](https://www.heroui.com//docs/components/checkbox-group)
+*/
+const Checkboxes = ({ className = void 0, color = "primary", inline = false, lineThrough = false, options, name, ...uniformFieldProps }) => {
+	const { ariaLabel, disabled, error: _error, field: { onChange, value: fieldValue, ref, onBlur }, invalid, label, required, testId } = require_useUniformField.useUniformField({
+		name,
+		...uniformFieldProps
+	});
+	const value = Array.isArray(fieldValue) ? fieldValue : [];
+	const errorMessage = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_FieldValidationError.FieldValidationError_default$1, {
+		error: (_error && Object.values(_error).flat()) ?? [],
+		testId
+	});
+	const classNames = (0, __fuf_stack_pixel_utils.variantsToClassNames)(checkboxesVariants({ lineThrough }), className, "base");
+	const heroCheckboxGroupClassNames = {
+		base: classNames.base,
+		label: classNames.label,
+		wrapper: classNames.wrapper
+	};
+	const heroCheckboxClassNames = {
+		base: classNames.optionBase,
+		icon: classNames.optionIcon,
+		label: classNames.optionLabel,
+		wrapper: classNames.optionWrapper
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__heroui_checkbox.CheckboxGroup, {
+		ref,
+		"aria-label": ariaLabel,
+		classNames: heroCheckboxGroupClassNames,
+		color: color === "info" ? "primary" : color,
+		"data-invalid": invalid,
+		"data-testid": testId,
+		errorMessage,
+		isDisabled: disabled,
+		isInvalid: invalid,
+		isRequired: required,
+		label: label ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("legend", { children: label }) : null,
+		name,
+		onBlur,
+		onChange,
+		orientation: inline ? "horizontal" : "vertical",
+		value,
+		children: options?.map((option) => {
+			const optionTestId = (0, __fuf_stack_pixel_utils.slugify)(`${testId}_option_${option?.testId ?? option?.value}`, { replaceDots: true });
+			const hasSubline = !!option.labelSubline;
+			let labelContent;
+			let optionClassNames = heroCheckboxClassNames;
+			if (hasSubline) {
+				labelContent = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex grow flex-col items-start",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: classNames.optionLabel,
+						children: option.label
+					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: classNames.optionLabelSubline,
+						children: option.labelSubline
+					})]
+				});
+				optionClassNames = {
+					...optionClassNames,
+					label: ""
+				};
+			} else labelContent = option.label;
+			return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__heroui_checkbox.Checkbox, {
+				classNames: optionClassNames,
+				"data-invalid": invalid,
+				"data-testid": optionTestId,
+				isDisabled: !!disabled || option.disabled,
+				value: option?.value,
+				"aria-label": typeof option.label === "string" ? option.label : option.value,
+				children: labelContent
+			}, `index_${option.value}`);
+		})
+	});
+};
+var Checkboxes_default = Checkboxes;
+
+//#endregion
+//#region src/Checkboxes/index.ts
+var Checkboxes_default$1 = Checkboxes_default;
+
+//#endregion
+Object.defineProperty(exports, 'Checkboxes_default', {
+  enumerable: true,
+  get: function () {
+    return Checkboxes_default$1;
+  }
+});
+Object.defineProperty(exports, 'Checkboxes_default$1', {
+  enumerable: true,
+  get: function () {
+    return Checkboxes_default;
+  }
+});
+//# sourceMappingURL=Checkboxes-Ds6bzl6p.cjs.map

package/dist/Checkboxes-Ds6bzl6p.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkboxes-Ds6bzl6p.cjs","names":["heroCheckboxVariants","useUniformField","FieldValidationError","heroCheckboxGroupClassNames: HeroCheckboxGroupProps['classNames']","heroCheckboxClassNames: HeroCheckboxProps['classNames']","HeroCheckboxGroup","labelContent: ReactNode","HeroCheckbox","Checkboxes"],"sources":["../src/Checkboxes/Checkboxes.tsx","../src/Checkboxes/index.ts"],"sourcesContent":["import type { TVClassName, TVProps } from '@fuf-stack/pixel-utils';\nimport type {\n  CheckboxGroupProps as HeroCheckboxGroupProps,\n  CheckboxProps as HeroCheckboxProps,\n} from '@heroui/checkbox';\nimport type { ReactNode } from 'react';\nimport type { FieldError } from 'react-hook-form';\nimport type { InputValueTransform } from '../hooks/useInputValueTransform';\n\nimport {\n  Checkbox as HeroCheckbox,\n  CheckboxGroup as HeroCheckboxGroup,\n} from '@heroui/checkbox';\nimport { checkbox as heroCheckboxVariants } from '@heroui/theme';\n\nimport { slugify, tv, variantsToClassNames } from '@fuf-stack/pixel-utils';\n\nimport { useUniformField } from '../hooks/useUniformField';\nimport { FieldValidationError } from '../partials/FieldValidationError';\n\nexport const checkboxesVariants = tv({\n  slots: {\n    base: 'group', // Needs group for group-data condition\n    errorMessage: 'text-tiny',\n    // see HeroUI styles for group-data condition,\n    // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/core/theme/src/components/select.ts\n    label:\n      'inline-flex text-sm text-foreground subpixel-antialiased group-data-[invalid=true]:!text-danger',\n    optionBase: '',\n    optionIcon: '',\n    optionLabel: '',\n    optionLabelSubline: 'text-foreground-400 !text-small',\n    optionWrapper: '',\n    wrapper: '',\n  },\n  variants: {\n    // see: https://github.com/heroui-inc/heroui/blob/canary/packages/core/theme/src/components/checkbox.ts\n    color: {\n      info: {\n        wrapper:\n          'text-info-foreground after:bg-info after:text-info-foreground',\n      },\n      ...heroCheckboxVariants.variants.color,\n    } as const,\n    lineThrough: {\n      true: {\n        optionLabel: [\n          ...heroCheckboxVariants.variants.lineThrough.true.label,\n          // fix stroke position when used with subline and enable animation\n          'relative before:transition-all before:duration-200',\n        ],\n        optionLabelSubline: 'group-data-[selected=true]:opacity-60',\n      },\n    },\n  },\n});\n\ntype VariantProps = TVProps<typeof checkboxesVariants>;\ntype ClassName = TVClassName<typeof checkboxesVariants>;\n\nexport interface CheckboxOption {\n  /** option label */\n  label?: ReactNode;\n  /** subline displayed below the label */\n  labelSubline?: ReactNode;\n  /** option value */\n  value: string;\n  /** disables the option */\n  disabled?: boolean;\n  /** HTML data-testid attribute of the option */\n  testId?: string;\n}\n\nexport interface CheckboxesProps extends VariantProps {\n  /** Custom aria-label for accessibility. If not provided, falls back to field name when no visible label exists */\n  ariaLabel?: string;\n  /** CSS class name */\n  className?: ClassName;\n  /** Color scheme of the checkboxes */\n  color?: VariantProps['color'];\n  /** Sets all checkboxes disabled */\n  disabled?: boolean;\n  /** Orientation of the checkboxes */\n  inline?: boolean;\n  /** Label displayed above the checkboxes */\n  label?: ReactNode;\n  /** Whether the checkboxes label should be crossed out */\n  lineThrough?: boolean;\n  /** Name the Field is registered on the form */\n  name: string;\n  /** Checkboxes that should be displayed. */\n  options: CheckboxOption[];\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n  /** allows disentangled display and form values for a field */\n  transform?: InputValueTransform<string[]>;\n}\n\n/**\n * Checkboxes component based on [HeroUI CheckboxGroup](https://www.heroui.com//docs/components/checkbox-group)\n */\nconst Checkboxes = ({\n  className = undefined,\n  color = 'primary',\n  inline = false,\n  lineThrough = false,\n  options,\n  name,\n  ...uniformFieldProps\n}: CheckboxesProps) => {\n  const {\n    ariaLabel,\n    disabled,\n    error: _error,\n    field: { onChange, value: fieldValue, ref, onBlur },\n    invalid,\n    label,\n    required,\n    testId,\n  } = useUniformField({\n    name,\n    ...uniformFieldProps,\n  });\n\n  // Ensure value is always an array (checkboxes need arrays)\n  const value = Array.isArray(fieldValue) ? fieldValue : [];\n\n  // Convert React Hook Form's nested error object structure to a flat array\n  // RHF errors can be nested like: checkboxField.0 (individual checkbox errors)\n  // and checkboxField._error (global field errors) - this flattens all\n  // error values into a single array for rendering with FieldValidationError\n  const errorFlat: FieldError[] =\n    (_error &&\n      Object.values(\n        _error as unknown as Record<string, FieldError[]>,\n      ).flat()) ??\n    [];\n  const errorMessage = (\n    <FieldValidationError error={errorFlat} testId={testId} />\n  );\n\n  // classNames from slots\n  const variants = checkboxesVariants({ lineThrough });\n  const classNames = variantsToClassNames(variants, className, 'base');\n\n  // map slots to HeroUI class names\n  const heroCheckboxGroupClassNames: HeroCheckboxGroupProps['classNames'] = {\n    base: classNames.base,\n    label: classNames.label,\n    wrapper: classNames.wrapper,\n  };\n  const heroCheckboxClassNames: HeroCheckboxProps['classNames'] = {\n    base: classNames.optionBase,\n    icon: classNames.optionIcon,\n    label: classNames.optionLabel,\n    wrapper: classNames.optionWrapper,\n  };\n\n  return (\n    <HeroCheckboxGroup\n      ref={ref}\n      aria-label={ariaLabel}\n      classNames={heroCheckboxGroupClassNames}\n      color={color === 'info' ? 'primary' : color}\n      // see HeroUI styles for group-data condition (data-invalid),\n      // e.g.: https://github.com/heroui-inc/heroui/blob/main/packages/components/select/src/use-select.ts\n      data-invalid={invalid}\n      data-testid={testId}\n      errorMessage={errorMessage}\n      isDisabled={disabled}\n      isInvalid={invalid}\n      isRequired={required}\n      label={label ? <legend>{label}</legend> : null}\n      name={name}\n      onBlur={onBlur}\n      onChange={onChange}\n      orientation={inline ? 'horizontal' : 'vertical'}\n      value={value}\n    >\n      {options?.map((option) => {\n        const optionTestId = slugify(\n          `${testId}_option_${option?.testId ?? option?.value}`,\n          { replaceDots: true },\n        );\n\n        // set content and classes depending option has subline\n        const hasSubline = !!option.labelSubline;\n        let labelContent: ReactNode;\n        let optionClassNames = heroCheckboxClassNames;\n        if (hasSubline) {\n          labelContent = (\n            <div className=\"flex grow flex-col items-start\">\n              <span className={classNames.optionLabel}>{option.label}</span>\n              <span className={classNames.optionLabelSubline}>\n                {option.labelSubline}\n              </span>\n            </div>\n          );\n          // remove label classes from outer label when subline is used\n          optionClassNames = { ...optionClassNames, label: '' };\n        } else {\n          labelContent = option.label;\n        }\n\n        return (\n          <HeroCheckbox\n            key={`index_${option.value}`}\n            classNames={optionClassNames}\n            data-invalid={invalid}\n            data-testid={optionTestId}\n            isDisabled={!!disabled || option.disabled}\n            value={option?.value}\n            aria-label={\n              typeof option.label === 'string' ? option.label : option.value\n            }\n          >\n            {labelContent}\n          </HeroCheckbox>\n        );\n      })}\n    </HeroCheckboxGroup>\n  );\n};\n\nexport default Checkboxes;\n","import Checkboxes from './Checkboxes';\n\nexport type { CheckboxesProps, CheckboxOption } from './Checkboxes';\n\nexport { Checkboxes };\n\nexport default Checkboxes;\n"],"mappings":";;;;;;;;;AAoBA,MAAa,qDAAwB;CACnC,OAAO;EACL,MAAM;EACN,cAAc;EAGd,OACE;EACF,YAAY;EACZ,YAAY;EACZ,aAAa;EACb,oBAAoB;EACpB,eAAe;EACf,SAAS;EACV;CACD,UAAU;EAER,OAAO;GACL,MAAM,EACJ,SACE,iEACH;GACD,GAAGA,wBAAqB,SAAS;GAClC;EACD,aAAa,EACX,MAAM;GACJ,aAAa,CACX,GAAGA,wBAAqB,SAAS,YAAY,KAAK,OAElD,qDACD;GACD,oBAAoB;GACrB,EACF;EACF;CACF,CAAC;;;;AA8CF,MAAM,cAAc,EAClB,YAAY,QACZ,QAAQ,WACR,SAAS,OACT,cAAc,OACd,SACA,MACA,GAAG,wBACkB;CACrB,MAAM,EACJ,WACA,UACA,OAAO,QACP,OAAO,EAAE,UAAU,OAAO,YAAY,KAAK,UAC3C,SACA,OACA,UACA,WACEC,wCAAgB;EAClB;EACA,GAAG;EACJ,CAAC;CAGF,MAAM,QAAQ,MAAM,QAAQ,WAAW,GAAG,aAAa,EAAE;CAYzD,MAAM,eACJ,2CAACC;EAAqB,QANrB,UACC,OAAO,OACL,OACD,CAAC,MAAM,KACV,EAAE;EAE8C;GAAU;CAK5D,MAAM,+DADW,mBAAmB,EAAE,aAAa,CAAC,EACF,WAAW,OAAO;CAGpE,MAAMC,8BAAoE;EACxE,MAAM,WAAW;EACjB,OAAO,WAAW;EAClB,SAAS,WAAW;EACrB;CACD,MAAMC,yBAA0D;EAC9D,MAAM,WAAW;EACjB,MAAM,WAAW;EACjB,OAAO,WAAW;EAClB,SAAS,WAAW;EACrB;AAED,QACE,2CAACC;EACM;EACL,cAAY;EACZ,YAAY;EACZ,OAAO,UAAU,SAAS,YAAY;EAGtC,gBAAc;EACd,eAAa;EACC;EACd,YAAY;EACZ,WAAW;EACX,YAAY;EACZ,OAAO,QAAQ,2CAAC,sBAAQ,QAAe,GAAG;EACpC;EACE;EACE;EACV,aAAa,SAAS,eAAe;EAC9B;YAEN,SAAS,KAAK,WAAW;GACxB,MAAM,oDACJ,GAAG,OAAO,UAAU,QAAQ,UAAU,QAAQ,SAC9C,EAAE,aAAa,MAAM,CACtB;GAGD,MAAM,aAAa,CAAC,CAAC,OAAO;GAC5B,IAAIC;GACJ,IAAI,mBAAmB;AACvB,OAAI,YAAY;AACd,mBACE,4CAAC;KAAI,WAAU;gBACb,2CAAC;MAAK,WAAW,WAAW;gBAAc,OAAO;OAAa,EAC9D,2CAAC;MAAK,WAAW,WAAW;gBACzB,OAAO;OACH;MACH;AAGR,uBAAmB;KAAE,GAAG;KAAkB,OAAO;KAAI;SAErD,gBAAe,OAAO;AAGxB,UACE,2CAACC;IAEC,YAAY;IACZ,gBAAc;IACd,eAAa;IACb,YAAY,CAAC,CAAC,YAAY,OAAO;IACjC,OAAO,QAAQ;IACf,cACE,OAAO,OAAO,UAAU,WAAW,OAAO,QAAQ,OAAO;cAG1D;MAVI,SAAS,OAAO,QAWR;IAEjB;GACgB;;AAIxB,yBAAe;;;;AC1Nf,2BAAeC"}

package/dist/FieldArray/index.cjs

@@ -1,22 +1,5 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+Object.defineProperty(exports, '__esModule', { value: true });
+const require_FieldArray = require('../FieldArray-BexXN9bO.cjs');
 
-
-var _chunkZ6QACVK7cjs = require('../chunk-Z6QACVK7.cjs');
-require('../chunk-7ZE7IZ5R.cjs');
-require('../chunk-3JAVQAL5.cjs');
-require('../chunk-TTD3KL6E.cjs');
-require('../chunk-V3M7HL26.cjs');
-require('../chunk-OE5BOGGX.cjs');
-require('../chunk-NHEZXA4H.cjs');
-require('../chunk-6AWHOBNL.cjs');
-require('../chunk-PCTYJUY7.cjs');
-require('../chunk-56TQOKG7.cjs');
-require('../chunk-FYN7ZWLW.cjs');
-require('../chunk-AQJLKHAE.cjs');
-require('../chunk-OKJWLH7T.cjs');
-require('../chunk-555JRYCS.cjs');
-
-
-
-exports.FieldArray = _chunkZ6QACVK7cjs.FieldArray_default; exports.default = _chunkZ6QACVK7cjs.FieldArray_default2;
-//# sourceMappingURL=index.cjs.map
+exports.FieldArray = require_FieldArray.FieldArray_default$1;
+exports.default = require_FieldArray.FieldArray_default;

package/dist/FieldArray/index.d.cts

@@ -1,10 +1,2 @@
-import { F as FieldArray } from '../FieldArray-72vn2MG9.cjs';
-export { a as FieldArrayChildrenRenderFn, b as FieldArrayFeatures, c as FieldArrayProps } from '../FieldArray-72vn2MG9.cjs';
-import 'react/jsx-runtime';
-import 'tailwind-variants';
-import '@fuf-stack/pixel-utils';
-import 'react';
-
-
-
-export { FieldArray, FieldArray as default };
+import { i as FieldArrayProps, n as FieldArrayChildrenRenderFn, r as FieldArrayFeatures, t as FieldArray } from "../index-BaBZGCqS.cjs";
+export { FieldArray, FieldArray as default, FieldArrayChildrenRenderFn, FieldArrayFeatures, FieldArrayProps };

package/dist/FieldArray/index.d.ts

@@ -1,10 +1,2 @@
-import { F as FieldArray } from '../FieldArray-72vn2MG9.js';
-export { a as FieldArrayChildrenRenderFn, b as FieldArrayFeatures, c as FieldArrayProps } from '../FieldArray-72vn2MG9.js';
-import 'react/jsx-runtime';
-import 'tailwind-variants';
-import '@fuf-stack/pixel-utils';
-import 'react';
-
-
-
-export { FieldArray, FieldArray as default };
+import { i as FieldArrayProps, n as FieldArrayChildrenRenderFn, r as FieldArrayFeatures, t as FieldArray } from "../index-CvA5yKx9.js";
+export { FieldArray, FieldArray as default, FieldArrayChildrenRenderFn, FieldArrayFeatures, FieldArrayProps };

package/dist/FieldArray/index.js

@@ -1,22 +1,3 @@
-import {
-  FieldArray_default,
-  FieldArray_default2
-} from "../chunk-NG3CJ3UE.js";
-import "../chunk-7MOAXLQZ.js";
-import "../chunk-36LBVB45.js";
-import "../chunk-B62HKKMS.js";
-import "../chunk-GEC75GNL.js";
-import "../chunk-NTDKZW4E.js";
-import "../chunk-ELYGQTXB.js";
-import "../chunk-5MTIQ6WD.js";
-import "../chunk-AHJJIANM.js";
-import "../chunk-CNTOODUQ.js";
-import "../chunk-SJWL6EMI.js";
-import "../chunk-IV45K4WU.js";
-import "../chunk-O2XJNQQK.js";
-import "../chunk-K2V4ULA2.js";
-export {
-  FieldArray_default as FieldArray,
-  FieldArray_default2 as default
-};
-//# sourceMappingURL=index.js.map
+import { n as FieldArray_default, t as FieldArray_default$1 } from "../FieldArray-D3iUaRLo.js";
+
+export { FieldArray_default as FieldArray, FieldArray_default$1 as default };