@fuf-stack/uniform 0.0.2

package/dist/SubmitButton/index.cjs

@@ -0,0 +1,159 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/SubmitButton/index.ts
+var SubmitButton_exports = {};
+__export(SubmitButton_exports, {
+  default: () => SubmitButton_default2
+});
+module.exports = __toCommonJS(SubmitButton_exports);
+
+// src/SubmitButton/SubmitButton.tsx
+var import_classnames = __toESM(require("classnames"), 1);
+var import_Button = __toESM(require("@fuf-stack/pixels/Button"), 1);
+
+// src/helpers/slugify.ts
+var import_slug = __toESM(require("slug"), 1);
+var slugify_default = (string, options) => {
+  const replacement = options?.replacement || "_";
+  return (0, import_slug.default)(string, {
+    ...import_slug.default.defaults.modes.rfc3986,
+    charmap: {
+      ...import_slug.default.defaults.modes.rfc3986.charmap,
+      // allow dots by default
+      ".": ".",
+      // convert hyphens to underscores (when replacement is not hyphen)
+      ...replacement !== "-" ? { "-": "_" } : {}
+    },
+    replacement,
+    ...options || {}
+  });
+};
+
+// src/hooks/useFormContext/useFormContext.ts
+var import_react2 = require("react");
+var import_react_hook_form2 = require("react-hook-form");
+
+// src/Form/subcomponents/FormContext.tsx
+var import_react = __toESM(require("react"), 1);
+var import_react_hook_form = require("react-hook-form");
+var import_jsx_runtime = require("react/jsx-runtime");
+var ValidationSchemaContext = import_react.default.createContext(void 0);
+
+// src/hooks/useFormContext/useFormContext.ts
+var recursiveSearchInnerType = (schema) => {
+  if (schema?._def?.innerType) {
+    if (schema?._def?.innerType?._def?.typeName === "ZodOptional") {
+      return schema?._def?.innerType?._def?.typeName !== "ZodOptional";
+    }
+    return recursiveSearchInnerType(schema?._def?.innerType);
+  }
+  return true;
+};
+var recursiveFieldKeySearch = (schema, path) => {
+  const [current, ...rest] = path;
+  let currentSchema = schema;
+  if (schema?._def?.typeName === "ZodOptional") {
+    currentSchema = schema.unwrap();
+  } else if (schema?._def?.typeName === "ZodEffects") {
+    return recursiveFieldKeySearch(schema._def?.schema, path);
+  }
+  if (currentSchema?._def?.typeName === "ZodIntersection") {
+    return (currentSchema._def.left?.schema ? recursiveFieldKeySearch(currentSchema._def.left.schema, path) : recursiveFieldKeySearch(currentSchema._def.left, path)) || (currentSchema._def.right?.schema ? recursiveFieldKeySearch(currentSchema._def.right.schema, path) : recursiveFieldKeySearch(currentSchema._def.right, path));
+  }
+  const shape = currentSchema?.shape ?? currentSchema?.element?.shape;
+  if (shape && shape[current]) {
+    if (rest.length === 0) {
+      return shape[current]?._def?.typeName !== "ZodOptional" && recursiveSearchInnerType(shape[current]);
+    }
+    return recursiveFieldKeySearch(shape[current], rest);
+  }
+  return null;
+};
+var useFormContext = () => {
+  const {
+    // https://react-hook-form.com/docs/useform/getfieldstate
+    // for getFieldState a subscription to formState properties is needed!
+    formState,
+    getFieldState: getFieldStateOrig,
+    ...otherMethods
+  } = (0, import_react_hook_form2.useFormContext)();
+  const validation = (0, import_react2.useContext)(ValidationSchemaContext);
+  const getFieldState = (name, testId) => {
+    const fieldPath = typeof name === "string" ? name.replace(/\[\d+\]/g, "").split(".") : name;
+    const required = validation && recursiveFieldKeySearch(validation.schema, fieldPath) || false;
+    const { error, ...rest } = getFieldStateOrig(name, formState);
+    return {
+      ...rest,
+      error,
+      // TODO: change to correct type @Hannes ;)
+      required,
+      testId: slugify_default(testId || name)
+    };
+  };
+  return {
+    ...otherMethods,
+    getFieldState,
+    validation,
+    formState
+  };
+};
+
+// src/SubmitButton/SubmitButton.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var SubmitButton = ({
+  children = "Submit",
+  className = void 0,
+  color = "success",
+  loading = false,
+  onClick = void 0,
+  testId = "form_submit_button"
+}) => {
+  const {
+    formState: { isValid, isSubmitting, isValidating }
+  } = useFormContext();
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_Button.default,
+    {
+      className: (0, import_classnames.default)(className),
+      color,
+      testId: slugify_default(testId),
+      disabled: !isValid || isSubmitting || isValidating,
+      loading,
+      onClick,
+      type: "submit",
+      children
+    }
+  );
+};
+var SubmitButton_default = SubmitButton;
+
+// src/SubmitButton/index.ts
+var SubmitButton_default2 = SubmitButton_default;
+//# sourceMappingURL=index.cjs.map

package/dist/SubmitButton/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/SubmitButton/index.ts","../../src/SubmitButton/SubmitButton.tsx","../../src/helpers/slugify.ts","../../src/hooks/useFormContext/useFormContext.ts","../../src/Form/subcomponents/FormContext.tsx"],"sourcesContent":["import SubmitButton from './SubmitButton';\n\nexport default SubmitButton;\n","import type { ButtonProps } from '@fuf-stack/pixels/Button';\nimport type { ReactNode } from 'react';\n\nimport cn from 'classnames';\n\nimport Button from '@fuf-stack/pixels/Button';\n\nimport slugify from '../helpers/slugify';\nimport { useFormContext } from '../hooks';\n\ninterface SubmitButtonProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | 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  /** 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  testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n  const {\n    formState: { isValid, isSubmitting, isValidating },\n  } = useFormContext();\n\n  return (\n    <Button\n      className={cn(className)}\n      color={color}\n      testId={slugify(testId)}\n      disabled={!isValid || isSubmitting || isValidating}\n      loading={loading}\n      onClick={onClick}\n      type=\"submit\"\n    >\n      {children}\n    </Button>\n  );\n};\n\nexport default SubmitButton;\n","import type { Options as SlugOptions } from 'slug';\n\nimport slug from 'slug';\n\nexport default (string: string, options?: SlugOptions) => {\n  const replacement = options?.replacement || '_';\n  return slug(string, {\n    ...slug.defaults.modes.rfc3986,\n    charmap: {\n      ...slug.defaults.modes.rfc3986.charmap,\n      // allow dots by default\n      '.': '.',\n      // convert hyphens to underscores (when replacement is not hyphen)\n      ...(replacement !== '-' ? { '-': '_' } : {}),\n    },\n    replacement,\n    ...(options || {}),\n  });\n};\n","import type { VetoSchema } from '@fuf-stack/veto';\nimport type { FieldError } from 'react-hook-form';\n\nimport { useContext } from 'react';\nimport { useFormContext as useHookFormContext } from 'react-hook-form';\n\nimport { ValidationSchemaContext } from '../../Form/subcomponents/FormContext';\nimport slugify from '../../helpers/slugify';\n\n// FIX: This fixes the problem that the innerType is not checked for optionals...\nconst recursiveSearchInnerType = (schema: VetoSchema): boolean => {\n  if (schema?._def?.innerType) {\n    if (schema?._def?.innerType?._def?.typeName === 'ZodOptional') {\n      return schema?._def?.innerType?._def?.typeName !== 'ZodOptional';\n    }\n    return recursiveSearchInnerType(schema?._def?.innerType);\n  }\n  return true;\n};\n\n// TODO: Fix problem \".optional().nullable()\" is required, \".nullable().optional()\" is not required...\nexport const recursiveFieldKeySearch = (\n  schema: VetoSchema,\n  path: string[],\n): boolean | null => {\n  const [current, ...rest] = path;\n  // ignore optionals on the path to the desired field\n\n  let currentSchema = schema;\n\n  if (schema?._def?.typeName === 'ZodOptional') {\n    // @ts-expect-error not sure here\n    currentSchema = schema.unwrap();\n  } else if (schema?._def?.typeName === 'ZodEffects') {\n    // in case of an effect, unwrap the effect and call with schema (clould be optional) and complete path.\n    return recursiveFieldKeySearch(schema._def?.schema, path);\n  }\n\n  // TODO: This needs further investigation. It is nor yet completely clear how to handle intersections!\n  if (currentSchema?._def?.typeName === 'ZodIntersection') {\n    return (\n      (currentSchema._def.left?.schema\n        ? recursiveFieldKeySearch(currentSchema._def.left.schema, path)\n        : recursiveFieldKeySearch(currentSchema._def.left, path)) ||\n      (currentSchema._def.right?.schema\n        ? recursiveFieldKeySearch(currentSchema._def.right.schema, path)\n        : recursiveFieldKeySearch(currentSchema._def.right, path))\n    );\n  }\n\n  // get shape of an object or objects of an array\n  // @ts-expect-error not sure here\n  const shape = currentSchema?.shape ?? currentSchema?.element?.shape; // ??\n\n  if (shape && shape[current]) {\n    // currentSchema?._def.schema.unwrap()?.shape;\n    if (rest.length === 0) {\n      // At the end of the path check if the field is optional or required\n      return (\n        shape[current]?._def?.typeName !== 'ZodOptional' &&\n        recursiveSearchInnerType(shape[current])\n      );\n    }\n    return recursiveFieldKeySearch(shape[current], rest);\n  }\n\n  return null; // field not found\n};\n\n/** TODO: add description */\nexport const useFormContext = () => {\n  const {\n    // https://react-hook-form.com/docs/useform/getfieldstate\n    // for getFieldState a subscription to formState properties is needed!\n    formState,\n    getFieldState: getFieldStateOrig,\n    ...otherMethods\n  } = useHookFormContext();\n  const validation = useContext(ValidationSchemaContext);\n\n  // update getFieldState\n  const getFieldState = (name: string, testId?: string) => {\n    const fieldPath =\n      typeof name === 'string' ? name.replace(/\\[\\d+\\]/g, '').split('.') : name;\n    const required =\n      (validation && recursiveFieldKeySearch(validation.schema, fieldPath)) ||\n      false;\n    const { error, ...rest } = getFieldStateOrig(name, formState);\n    return {\n      ...rest,\n      error: error as FieldError[] | undefined, // TODO: change to correct type @Hannes ;)\n      required,\n      testId: slugify(testId || name),\n    };\n  };\n\n  return {\n    ...otherMethods,\n    getFieldState,\n    validation,\n    formState,\n  };\n};\n","import type { VetoInstance } from '@fuf-stack/veto';\nimport type { FormProviderProps as HookFormProviderProps } from 'react-hook-form';\n\nimport React from 'react';\nimport { FormProvider as HookFormProvider } from 'react-hook-form';\n\nexport const ValidationSchemaContext = React.createContext<\n  VetoInstance | undefined\n>(undefined);\n\ninterface FormProviderProps\n  extends HookFormProviderProps<Record<string, any>, any, undefined> {\n  /** veto validation schema */\n  validation?: VetoInstance;\n}\n\n/** Provides the veto validation context to the form */\nconst FormProvider = ({\n  children,\n  validation = undefined,\n  ...hookFormProps\n}: FormProviderProps) => {\n  return (\n    <ValidationSchemaContext.Provider value={validation}>\n      <HookFormProvider {...hookFormProps}>{children}</HookFormProvider>\n    </ValidationSchemaContext.Provider>\n  );\n};\n\nexport default FormProvider;\n"],"mappings":"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","names":["SubmitButton_default","slug","import_react","import_react_hook_form","React","useHookFormContext","import_jsx_runtime","Button","cn","SubmitButton_default"]}

package/dist/SubmitButton/index.d.cts

@@ -0,0 +1,8 @@
+import SubmitButton from './SubmitButton.cjs';
+import 'react/jsx-runtime';
+import '@fuf-stack/pixels/Button';
+import 'react';
+
+
+
+export { SubmitButton as default };

package/dist/SubmitButton/index.d.ts

@@ -0,0 +1,8 @@
+import SubmitButton from './SubmitButton.js';
+import 'react/jsx-runtime';
+import '@fuf-stack/pixels/Button';
+import 'react';
+
+
+
+export { SubmitButton as default };

package/dist/SubmitButton/index.js

@@ -0,0 +1,14 @@
+import {
+  SubmitButton_default
+} from "../chunk-BJ36HK7L.js";
+import "../chunk-GATZOHQ6.js";
+import "../chunk-PMNBGDEZ.js";
+import "../chunk-IQVKBQ7W.js";
+import "../chunk-WIY7KIHU.js";
+
+// src/SubmitButton/index.ts
+var SubmitButton_default2 = SubmitButton_default;
+export {
+  SubmitButton_default2 as default
+};
+//# sourceMappingURL=index.js.map

package/dist/SubmitButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/SubmitButton/index.ts"],"sourcesContent":["import SubmitButton from './SubmitButton';\n\nexport default SubmitButton;\n"],"mappings":";;;;;;;;;AAEA,IAAOA,wBAAQ;","names":["SubmitButton_default"]}

package/dist/chunk-AV26PIKH.js

@@ -0,0 +1,82 @@
+import {
+  useFormContext
+} from "./chunk-PMNBGDEZ.js";
+
+// src/Form/subcomponents/FormDebugViewer.tsx
+import { useEffect, useState } from "react";
+import { FaTimes } from "react-icons/fa";
+import { FaBug } from "react-icons/fa6";
+import cn from "classnames";
+import Button from "@fuf-stack/pixels/Button";
+import Card from "@fuf-stack/pixels/Card";
+import useLocalStorage from "@fuf-stack/pixels/hooks/useLocalStorage";
+import Json from "@fuf-stack/pixels/Json";
+import { jsx, jsxs } from "react/jsx-runtime";
+var LOCALSTORAGE_DEBUG_KEY = "uniform:form-debug-enabled";
+var FormDebugViewer = ({ className = void 0 }) => {
+  const {
+    watch,
+    formState: { dirtyFields, isValid, isSubmitting },
+    validation
+  } = useFormContext();
+  const [debug, setDebug] = useLocalStorage(LOCALSTORAGE_DEBUG_KEY, false);
+  const [validationErrors, setValidationErrors] = useState(null);
+  const formValues = watch();
+  useEffect(() => {
+    const updateValidationErrors = async () => {
+      if (validation) {
+        const validateResult = await validation?.validateAsync(formValues);
+        setValidationErrors(validateResult?.errors);
+      }
+    };
+    updateValidationErrors();
+  }, [JSON.stringify(formValues)]);
+  if (!debug) {
+    return /* @__PURE__ */ jsx(
+      Button,
+      {
+        ariaLabel: "Enable form debug mode",
+        onClick: () => setDebug(!debug),
+        className: "absolute bottom-2.5 right-2.5 w-5 text-default-400",
+        variant: "light",
+        icon: /* @__PURE__ */ jsx(FaBug, {})
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    Card,
+    {
+      className: cn(className),
+      header: /* @__PURE__ */ jsxs("div", { className: "flex w-full flex-row justify-between", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-lg", children: "Debug Mode" }),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            icon: /* @__PURE__ */ jsx(FaTimes, { className: "text-danger" }),
+            onClick: () => setDebug(false),
+            size: "sm",
+            variant: "flat"
+          }
+        )
+      ] }),
+      children: /* @__PURE__ */ jsx(
+        Json,
+        {
+          value: {
+            values: formValues,
+            errors: validationErrors,
+            dirtyFields,
+            isValid,
+            isSubmitting
+          }
+        }
+      )
+    }
+  );
+};
+var FormDebugViewer_default = FormDebugViewer;
+
+export {
+  FormDebugViewer_default
+};
+//# sourceMappingURL=chunk-AV26PIKH.js.map

package/dist/chunk-AV26PIKH.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Form/subcomponents/FormDebugViewer.tsx"],"sourcesContent":["import type { VetoError } from '@fuf-stack/veto';\n\nimport { useEffect, useState } from 'react';\nimport { FaTimes } from 'react-icons/fa';\nimport { FaBug } from 'react-icons/fa6';\n\nimport cn from 'classnames';\n\nimport Button from '@fuf-stack/pixels/Button';\nimport Card from '@fuf-stack/pixels/Card';\nimport useLocalStorage from '@fuf-stack/pixels/hooks/useLocalStorage';\nimport Json from '@fuf-stack/pixels/Json';\n\nimport { useFormContext } from '../../hooks';\n\ninterface FormDebugViewerProps {\n  /** CSS class name */\n  className?: string;\n}\n\nconst LOCALSTORAGE_DEBUG_KEY = 'uniform:form-debug-enabled';\n\n/** Renders a form debug panel with information about the current form state */\nconst FormDebugViewer = ({ className = undefined }: FormDebugViewerProps) => {\n  const {\n    watch,\n    formState: { dirtyFields, isValid, isSubmitting },\n    validation,\n  } = useFormContext();\n\n  const [debug, setDebug] = useLocalStorage(LOCALSTORAGE_DEBUG_KEY, false);\n\n  const [validationErrors, setValidationErrors] = useState<\n    VetoError['errors'] | null\n  >(null);\n\n  const formValues = watch();\n\n  useEffect(() => {\n    const updateValidationErrors = async () => {\n      if (validation) {\n        const validateResult = await validation?.validateAsync(formValues);\n        setValidationErrors(validateResult?.errors);\n      }\n    };\n    updateValidationErrors();\n  }, [JSON.stringify(formValues)]);\n\n  if (!debug) {\n    return (\n      <Button\n        ariaLabel=\"Enable form debug mode\"\n        onClick={() => setDebug(!debug)}\n        className=\"absolute 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={() => setDebug(false)}\n            size=\"sm\"\n            variant=\"flat\"\n          />\n        </div>\n      }\n    >\n      <Json\n        value={{\n          values: formValues,\n          errors: validationErrors,\n          dirtyFields,\n          isValid,\n          isSubmitting,\n        }}\n      />\n    </Card>\n  );\n};\nexport default FormDebugViewer;\n"],"mappings":";;;;;AAEA,SAAS,WAAW,gBAAgB;AACpC,SAAS,eAAe;AACxB,SAAS,aAAa;AAEtB,OAAO,QAAQ;AAEf,OAAO,YAAY;AACnB,OAAO,UAAU;AACjB,OAAO,qBAAqB;AAC5B,OAAO,UAAU;AA4CH,cASN,YATM;AAnCd,IAAM,yBAAyB;AAG/B,IAAM,kBAAkB,CAAC,EAAE,YAAY,OAAU,MAA4B;AAC3E,QAAM;AAAA,IACJ;AAAA,IACA,WAAW,EAAE,aAAa,SAAS,aAAa;AAAA,IAChD;AAAA,EACF,IAAI,eAAe;AAEnB,QAAM,CAAC,OAAO,QAAQ,IAAI,gBAAgB,wBAAwB,KAAK;AAEvE,QAAM,CAAC,kBAAkB,mBAAmB,IAAI,SAE9C,IAAI;AAEN,QAAM,aAAa,MAAM;AAEzB,YAAU,MAAM;AACd,UAAM,yBAAyB,YAAY;AACzC,UAAI,YAAY;AACd,cAAM,iBAAiB,MAAM,YAAY,cAAc,UAAU;AACjE,4BAAoB,gBAAgB,MAAM;AAAA,MAC5C;AAAA,IACF;AACA,2BAAuB;AAAA,EACzB,GAAG,CAAC,KAAK,UAAU,UAAU,CAAC,CAAC;AAE/B,MAAI,CAAC,OAAO;AACV,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,SAAS,MAAM,SAAS,CAAC,KAAK;AAAA,QAC9B,WAAU;AAAA,QACV,SAAQ;AAAA,QACR,MAAM,oBAAC,SAAM;AAAA;AAAA,IACf;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,SAAS;AAAA,MACvB,QACE,qBAAC,SAAI,WAAU,wCACb;AAAA,4BAAC,UAAK,WAAU,WAAU,wBAAU;AAAA,QACpC;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,oBAAC,WAAQ,WAAU,eAAc;AAAA,YACvC,SAAS,MAAM,SAAS,KAAK;AAAA,YAC7B,MAAK;AAAA,YACL,SAAQ;AAAA;AAAA,QACV;AAAA,SACF;AAAA,MAGF;AAAA,QAAC;AAAA;AAAA,UACC,OAAO;AAAA,YACL,QAAQ;AAAA,YACR,QAAQ;AAAA,YACR;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AACA,IAAO,0BAAQ;","names":[]}

package/dist/chunk-BJ36HK7L.js

@@ -0,0 +1,42 @@
+import {
+  useFormContext
+} from "./chunk-PMNBGDEZ.js";
+import {
+  slugify_default
+} from "./chunk-WIY7KIHU.js";
+
+// src/SubmitButton/SubmitButton.tsx
+import cn from "classnames";
+import Button from "@fuf-stack/pixels/Button";
+import { jsx } from "react/jsx-runtime";
+var SubmitButton = ({
+  children = "Submit",
+  className = void 0,
+  color = "success",
+  loading = false,
+  onClick = void 0,
+  testId = "form_submit_button"
+}) => {
+  const {
+    formState: { isValid, isSubmitting, isValidating }
+  } = useFormContext();
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      className: cn(className),
+      color,
+      testId: slugify_default(testId),
+      disabled: !isValid || isSubmitting || isValidating,
+      loading,
+      onClick,
+      type: "submit",
+      children
+    }
+  );
+};
+var SubmitButton_default = SubmitButton;
+
+export {
+  SubmitButton_default
+};
+//# sourceMappingURL=chunk-BJ36HK7L.js.map

package/dist/chunk-BJ36HK7L.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/SubmitButton/SubmitButton.tsx"],"sourcesContent":["import type { ButtonProps } from '@fuf-stack/pixels/Button';\nimport type { ReactNode } from 'react';\n\nimport cn from 'classnames';\n\nimport Button from '@fuf-stack/pixels/Button';\n\nimport slugify from '../helpers/slugify';\nimport { useFormContext } from '../hooks';\n\ninterface SubmitButtonProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string | 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  /** 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  testId = 'form_submit_button',\n}: SubmitButtonProps) => {\n  const {\n    formState: { isValid, isSubmitting, isValidating },\n  } = useFormContext();\n\n  return (\n    <Button\n      className={cn(className)}\n      color={color}\n      testId={slugify(testId)}\n      disabled={!isValid || isSubmitting || isValidating}\n      loading={loading}\n      onClick={onClick}\n      type=\"submit\"\n    >\n      {children}\n    </Button>\n  );\n};\n\nexport default SubmitButton;\n"],"mappings":";;;;;;;;AAGA,OAAO,QAAQ;AAEf,OAAO,YAAY;AAoCf;AAbJ,IAAM,eAAe,CAAC;AAAA,EACpB,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS;AACX,MAAyB;AACvB,QAAM;AAAA,IACJ,WAAW,EAAE,SAAS,cAAc,aAAa;AAAA,EACnD,IAAI,eAAe;AAEnB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,SAAS;AAAA,MACvB;AAAA,MACA,QAAQ,gBAAQ,MAAM;AAAA,MACtB,UAAU,CAAC,WAAW,gBAAgB;AAAA,MACtC;AAAA,MACA;AAAA,MACA,MAAK;AAAA,MAEJ;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,uBAAQ;","names":[]}

package/dist/chunk-EDUZKOTL.js

@@ -0,0 +1,41 @@
+import {
+  slugify_default
+} from "./chunk-WIY7KIHU.js";
+
+// src/partials/FieldValidationError/FieldValidationError.tsx
+import { jsx } from "react/jsx-runtime";
+var FieldValidationError = ({
+  error,
+  testId = void 0
+}) => {
+  if (!error) {
+    return null;
+  }
+  let tmp_errors = [];
+  if (typeof error === "object" && !(error instanceof Array)) {
+    const error_object = error;
+    Object.keys(error).forEach((key) => {
+      tmp_errors = [...tmp_errors, ...error_object[key]];
+    });
+  }
+  const errorArray = JSON.stringify(tmp_errors) !== "[]" ? tmp_errors : error;
+  const errorStrings = errorArray.map((e) => e.message);
+  const ariaString = `Error: ${errorStrings.join("\n")}`;
+  return /* @__PURE__ */ jsx(
+    "ul",
+    {
+      "data-testid": slugify_default(testId || errorStrings.join()),
+      "aria-label": ariaString,
+      children: errorStrings.map((errorString, i) => (
+        // eslint-disable-next-line react/no-array-index-key
+        /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("div", { children: errorString }) }, `error_${i}`)
+      ))
+    }
+  );
+};
+var FieldValidationError_default = FieldValidationError;
+
+export {
+  FieldValidationError_default
+};
+//# sourceMappingURL=chunk-EDUZKOTL.js.map

package/dist/chunk-EDUZKOTL.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/partials/FieldValidationError/FieldValidationError.tsx"],"sourcesContent":["import type { FieldError } from 'react-hook-form';\n\nimport slugify from '../../helpers/slugify';\n\ninterface FieldValidationErrorProps {\n  error: FieldError[] | Record<string, FieldError[]>;\n  testId?: string;\n}\n\n/**\n * Renders a validation error of a field\n */\nconst FieldValidationError = ({\n  error,\n  testId = undefined,\n}: FieldValidationErrorProps) => {\n  if (!error) {\n    return null;\n  }\n\n  let tmp_errors: FieldError[] = [];\n\n  if (typeof error === 'object' && !(error instanceof Array)) {\n    const error_object = error as Record<string, FieldError[]>;\n    Object.keys(error).forEach((key) => {\n      tmp_errors = [...tmp_errors, ...error_object[key]];\n    });\n  }\n\n  const errorArray: FieldError[] =\n    JSON.stringify(tmp_errors) !== '[]' ? tmp_errors : (error as FieldError[]);\n  const errorStrings: string[] = errorArray.map((e) => e.message) as string[];\n  const ariaString = `Error: ${errorStrings.join('\\n')}`;\n\n  return (\n    <ul\n      data-testid={slugify(testId || errorStrings.join())}\n      aria-label={ariaString} // TODO: ist das richtig @Hannes?\n    >\n      {errorStrings.map((errorString: string, i: number) => (\n        // eslint-disable-next-line react/no-array-index-key\n        <li key={`error_${i}`}>\n          <div>{errorString}</div>\n        </li>\n      ))}\n    </ul>\n  );\n};\n\nexport default FieldValidationError;\n"],"mappings":";;;;;AA0CU;AA9BV,IAAM,uBAAuB,CAAC;AAAA,EAC5B;AAAA,EACA,SAAS;AACX,MAAiC;AAC/B,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,MAAI,aAA2B,CAAC;AAEhC,MAAI,OAAO,UAAU,YAAY,EAAE,iBAAiB,QAAQ;AAC1D,UAAM,eAAe;AACrB,WAAO,KAAK,KAAK,EAAE,QAAQ,CAAC,QAAQ;AAClC,mBAAa,CAAC,GAAG,YAAY,GAAG,aAAa,GAAG,CAAC;AAAA,IACnD,CAAC;AAAA,EACH;AAEA,QAAM,aACJ,KAAK,UAAU,UAAU,MAAM,OAAO,aAAc;AACtD,QAAM,eAAyB,WAAW,IAAI,CAAC,MAAM,EAAE,OAAO;AAC9D,QAAM,aAAa,UAAU,aAAa,KAAK,IAAI,CAAC;AAEpD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,eAAa,gBAAQ,UAAU,aAAa,KAAK,CAAC;AAAA,MAClD,cAAY;AAAA,MAEX,uBAAa,IAAI,CAAC,aAAqB;AAAA;AAAA,QAEtC,oBAAC,QACC,8BAAC,SAAK,uBAAY,KADX,SAAS,CAAC,EAEnB;AAAA,OACD;AAAA;AAAA,EACH;AAEJ;AAEA,IAAO,+BAAQ;","names":[]}

package/dist/chunk-GATZOHQ6.js

@@ -0,0 +1 @@
+//# sourceMappingURL=chunk-GATZOHQ6.js.map

package/dist/chunk-GATZOHQ6.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/chunk-IQVKBQ7W.js

@@ -0,0 +1,19 @@
+// src/Form/subcomponents/FormContext.tsx
+import React from "react";
+import { FormProvider as HookFormProvider } from "react-hook-form";
+import { jsx } from "react/jsx-runtime";
+var ValidationSchemaContext = React.createContext(void 0);
+var FormProvider = ({
+  children,
+  validation = void 0,
+  ...hookFormProps
+}) => {
+  return /* @__PURE__ */ jsx(ValidationSchemaContext.Provider, { value: validation, children: /* @__PURE__ */ jsx(HookFormProvider, { ...hookFormProps, children }) });
+};
+var FormContext_default = FormProvider;
+
+export {
+  ValidationSchemaContext,
+  FormContext_default
+};
+//# sourceMappingURL=chunk-IQVKBQ7W.js.map

package/dist/chunk-IQVKBQ7W.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Form/subcomponents/FormContext.tsx"],"sourcesContent":["import type { VetoInstance } from '@fuf-stack/veto';\nimport type { FormProviderProps as HookFormProviderProps } from 'react-hook-form';\n\nimport React from 'react';\nimport { FormProvider as HookFormProvider } from 'react-hook-form';\n\nexport const ValidationSchemaContext = React.createContext<\n  VetoInstance | undefined\n>(undefined);\n\ninterface FormProviderProps\n  extends HookFormProviderProps<Record<string, any>, any, undefined> {\n  /** veto validation schema */\n  validation?: VetoInstance;\n}\n\n/** Provides the veto validation context to the form */\nconst FormProvider = ({\n  children,\n  validation = undefined,\n  ...hookFormProps\n}: FormProviderProps) => {\n  return (\n    <ValidationSchemaContext.Provider value={validation}>\n      <HookFormProvider {...hookFormProps}>{children}</HookFormProvider>\n    </ValidationSchemaContext.Provider>\n  );\n};\n\nexport default FormProvider;\n"],"mappings":";AAGA,OAAO,WAAW;AAClB,SAAS,gBAAgB,wBAAwB;AAoB3C;AAlBC,IAAM,0BAA0B,MAAM,cAE3C,MAAS;AASX,IAAM,eAAe,CAAC;AAAA,EACpB;AAAA,EACA,aAAa;AAAA,EACb,GAAG;AACL,MAAyB;AACvB,SACE,oBAAC,wBAAwB,UAAxB,EAAiC,OAAO,YACvC,8BAAC,oBAAkB,GAAG,eAAgB,UAAS,GACjD;AAEJ;AAEA,IAAO,sBAAQ;","names":[]}

package/dist/chunk-KY2KCXOO.js

@@ -0,0 +1,16 @@
+// src/Grid/Grid.tsx
+import cn from "classnames";
+import { jsx } from "react/jsx-runtime";
+var Grid = ({
+  children = null,
+  className = void 0,
+  testId = void 0
+}) => {
+  return /* @__PURE__ */ jsx("div", { className: cn("grid gap-6", className), "data-testid": testId, children });
+};
+var Grid_default = Grid;
+
+export {
+  Grid_default
+};
+//# sourceMappingURL=chunk-KY2KCXOO.js.map

package/dist/chunk-KY2KCXOO.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/Grid/Grid.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\n\nimport cn from 'classnames';\n\ninterface GridProps {\n  /** child components */\n  children?: ReactNode;\n  /** CSS class name */\n  className?: string;\n  /** HTML data-testid attribute used in e2e tests */\n  testId?: string;\n}\n\n/**\n * Defines the default grid for form components\n */\nconst Grid = ({\n  children = null,\n  className = undefined,\n  testId = undefined,\n}: GridProps) => {\n  return (\n    <div className={cn('grid gap-6', className)} data-testid={testId}>\n      {children}\n    </div>\n  );\n};\n\nexport default Grid;\n"],"mappings":";AAEA,OAAO,QAAQ;AAoBX;AANJ,IAAM,OAAO,CAAC;AAAA,EACZ,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,SAAS;AACX,MAAiB;AACf,SACE,oBAAC,SAAI,WAAW,GAAG,cAAc,SAAS,GAAG,eAAa,QACvD,UACH;AAEJ;AAEA,IAAO,eAAQ;","names":[]}

package/dist/chunk-PMNBGDEZ.js

@@ -0,0 +1,73 @@
+import {
+  ValidationSchemaContext
+} from "./chunk-IQVKBQ7W.js";
+import {
+  slugify_default
+} from "./chunk-WIY7KIHU.js";
+
+// src/hooks/useFormContext/useFormContext.ts
+import { useContext } from "react";
+import { useFormContext as useHookFormContext } from "react-hook-form";
+var recursiveSearchInnerType = (schema) => {
+  if (schema?._def?.innerType) {
+    if (schema?._def?.innerType?._def?.typeName === "ZodOptional") {
+      return schema?._def?.innerType?._def?.typeName !== "ZodOptional";
+    }
+    return recursiveSearchInnerType(schema?._def?.innerType);
+  }
+  return true;
+};
+var recursiveFieldKeySearch = (schema, path) => {
+  const [current, ...rest] = path;
+  let currentSchema = schema;
+  if (schema?._def?.typeName === "ZodOptional") {
+    currentSchema = schema.unwrap();
+  } else if (schema?._def?.typeName === "ZodEffects") {
+    return recursiveFieldKeySearch(schema._def?.schema, path);
+  }
+  if (currentSchema?._def?.typeName === "ZodIntersection") {
+    return (currentSchema._def.left?.schema ? recursiveFieldKeySearch(currentSchema._def.left.schema, path) : recursiveFieldKeySearch(currentSchema._def.left, path)) || (currentSchema._def.right?.schema ? recursiveFieldKeySearch(currentSchema._def.right.schema, path) : recursiveFieldKeySearch(currentSchema._def.right, path));
+  }
+  const shape = currentSchema?.shape ?? currentSchema?.element?.shape;
+  if (shape && shape[current]) {
+    if (rest.length === 0) {
+      return shape[current]?._def?.typeName !== "ZodOptional" && recursiveSearchInnerType(shape[current]);
+    }
+    return recursiveFieldKeySearch(shape[current], rest);
+  }
+  return null;
+};
+var useFormContext = () => {
+  const {
+    // https://react-hook-form.com/docs/useform/getfieldstate
+    // for getFieldState a subscription to formState properties is needed!
+    formState,
+    getFieldState: getFieldStateOrig,
+    ...otherMethods
+  } = useHookFormContext();
+  const validation = useContext(ValidationSchemaContext);
+  const getFieldState = (name, testId) => {
+    const fieldPath = typeof name === "string" ? name.replace(/\[\d+\]/g, "").split(".") : name;
+    const required = validation && recursiveFieldKeySearch(validation.schema, fieldPath) || false;
+    const { error, ...rest } = getFieldStateOrig(name, formState);
+    return {
+      ...rest,
+      error,
+      // TODO: change to correct type @Hannes ;)
+      required,
+      testId: slugify_default(testId || name)
+    };
+  };
+  return {
+    ...otherMethods,
+    getFieldState,
+    validation,
+    formState
+  };
+};
+
+export {
+  recursiveFieldKeySearch,
+  useFormContext
+};
+//# sourceMappingURL=chunk-PMNBGDEZ.js.map

package/dist/chunk-PMNBGDEZ.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/useFormContext/useFormContext.ts"],"sourcesContent":["import type { VetoSchema } from '@fuf-stack/veto';\nimport type { FieldError } from 'react-hook-form';\n\nimport { useContext } from 'react';\nimport { useFormContext as useHookFormContext } from 'react-hook-form';\n\nimport { ValidationSchemaContext } from '../../Form/subcomponents/FormContext';\nimport slugify from '../../helpers/slugify';\n\n// FIX: This fixes the problem that the innerType is not checked for optionals...\nconst recursiveSearchInnerType = (schema: VetoSchema): boolean => {\n  if (schema?._def?.innerType) {\n    if (schema?._def?.innerType?._def?.typeName === 'ZodOptional') {\n      return schema?._def?.innerType?._def?.typeName !== 'ZodOptional';\n    }\n    return recursiveSearchInnerType(schema?._def?.innerType);\n  }\n  return true;\n};\n\n// TODO: Fix problem \".optional().nullable()\" is required, \".nullable().optional()\" is not required...\nexport const recursiveFieldKeySearch = (\n  schema: VetoSchema,\n  path: string[],\n): boolean | null => {\n  const [current, ...rest] = path;\n  // ignore optionals on the path to the desired field\n\n  let currentSchema = schema;\n\n  if (schema?._def?.typeName === 'ZodOptional') {\n    // @ts-expect-error not sure here\n    currentSchema = schema.unwrap();\n  } else if (schema?._def?.typeName === 'ZodEffects') {\n    // in case of an effect, unwrap the effect and call with schema (clould be optional) and complete path.\n    return recursiveFieldKeySearch(schema._def?.schema, path);\n  }\n\n  // TODO: This needs further investigation. It is nor yet completely clear how to handle intersections!\n  if (currentSchema?._def?.typeName === 'ZodIntersection') {\n    return (\n      (currentSchema._def.left?.schema\n        ? recursiveFieldKeySearch(currentSchema._def.left.schema, path)\n        : recursiveFieldKeySearch(currentSchema._def.left, path)) ||\n      (currentSchema._def.right?.schema\n        ? recursiveFieldKeySearch(currentSchema._def.right.schema, path)\n        : recursiveFieldKeySearch(currentSchema._def.right, path))\n    );\n  }\n\n  // get shape of an object or objects of an array\n  // @ts-expect-error not sure here\n  const shape = currentSchema?.shape ?? currentSchema?.element?.shape; // ??\n\n  if (shape && shape[current]) {\n    // currentSchema?._def.schema.unwrap()?.shape;\n    if (rest.length === 0) {\n      // At the end of the path check if the field is optional or required\n      return (\n        shape[current]?._def?.typeName !== 'ZodOptional' &&\n        recursiveSearchInnerType(shape[current])\n      );\n    }\n    return recursiveFieldKeySearch(shape[current], rest);\n  }\n\n  return null; // field not found\n};\n\n/** TODO: add description */\nexport const useFormContext = () => {\n  const {\n    // https://react-hook-form.com/docs/useform/getfieldstate\n    // for getFieldState a subscription to formState properties is needed!\n    formState,\n    getFieldState: getFieldStateOrig,\n    ...otherMethods\n  } = useHookFormContext();\n  const validation = useContext(ValidationSchemaContext);\n\n  // update getFieldState\n  const getFieldState = (name: string, testId?: string) => {\n    const fieldPath =\n      typeof name === 'string' ? name.replace(/\\[\\d+\\]/g, '').split('.') : name;\n    const required =\n      (validation && recursiveFieldKeySearch(validation.schema, fieldPath)) ||\n      false;\n    const { error, ...rest } = getFieldStateOrig(name, formState);\n    return {\n      ...rest,\n      error: error as FieldError[] | undefined, // TODO: change to correct type @Hannes ;)\n      required,\n      testId: slugify(testId || name),\n    };\n  };\n\n  return {\n    ...otherMethods,\n    getFieldState,\n    validation,\n    formState,\n  };\n};\n"],"mappings":";;;;;;;;AAGA,SAAS,kBAAkB;AAC3B,SAAS,kBAAkB,0BAA0B;AAMrD,IAAM,2BAA2B,CAAC,WAAgC;AAChE,MAAI,QAAQ,MAAM,WAAW;AAC3B,QAAI,QAAQ,MAAM,WAAW,MAAM,aAAa,eAAe;AAC7D,aAAO,QAAQ,MAAM,WAAW,MAAM,aAAa;AAAA,IACrD;AACA,WAAO,yBAAyB,QAAQ,MAAM,SAAS;AAAA,EACzD;AACA,SAAO;AACT;AAGO,IAAM,0BAA0B,CACrC,QACA,SACmB;AACnB,QAAM,CAAC,SAAS,GAAG,IAAI,IAAI;AAG3B,MAAI,gBAAgB;AAEpB,MAAI,QAAQ,MAAM,aAAa,eAAe;AAE5C,oBAAgB,OAAO,OAAO;AAAA,EAChC,WAAW,QAAQ,MAAM,aAAa,cAAc;AAElD,WAAO,wBAAwB,OAAO,MAAM,QAAQ,IAAI;AAAA,EAC1D;AAGA,MAAI,eAAe,MAAM,aAAa,mBAAmB;AACvD,YACG,cAAc,KAAK,MAAM,SACtB,wBAAwB,cAAc,KAAK,KAAK,QAAQ,IAAI,IAC5D,wBAAwB,cAAc,KAAK,MAAM,IAAI,OACxD,cAAc,KAAK,OAAO,SACvB,wBAAwB,cAAc,KAAK,MAAM,QAAQ,IAAI,IAC7D,wBAAwB,cAAc,KAAK,OAAO,IAAI;AAAA,EAE9D;AAIA,QAAM,QAAQ,eAAe,SAAS,eAAe,SAAS;AAE9D,MAAI,SAAS,MAAM,OAAO,GAAG;AAE3B,QAAI,KAAK,WAAW,GAAG;AAErB,aACE,MAAM,OAAO,GAAG,MAAM,aAAa,iBACnC,yBAAyB,MAAM,OAAO,CAAC;AAAA,IAE3C;AACA,WAAO,wBAAwB,MAAM,OAAO,GAAG,IAAI;AAAA,EACrD;AAEA,SAAO;AACT;AAGO,IAAM,iBAAiB,MAAM;AAClC,QAAM;AAAA;AAAA;AAAA,IAGJ;AAAA,IACA,eAAe;AAAA,IACf,GAAG;AAAA,EACL,IAAI,mBAAmB;AACvB,QAAM,aAAa,WAAW,uBAAuB;AAGrD,QAAM,gBAAgB,CAAC,MAAc,WAAoB;AACvD,UAAM,YACJ,OAAO,SAAS,WAAW,KAAK,QAAQ,YAAY,EAAE,EAAE,MAAM,GAAG,IAAI;AACvE,UAAM,WACH,cAAc,wBAAwB,WAAW,QAAQ,SAAS,KACnE;AACF,UAAM,EAAE,OAAO,GAAG,KAAK,IAAI,kBAAkB,MAAM,SAAS;AAC5D,WAAO;AAAA,MACL,GAAG;AAAA,MACH;AAAA;AAAA,MACA;AAAA,MACA,QAAQ,gBAAQ,UAAU,IAAI;AAAA,IAChC;AAAA,EACF;AAEA,SAAO;AAAA,IACL,GAAG;AAAA,IACH;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

package/dist/chunk-UMTFPEVF.js

@@ -0,0 +1,34 @@
+// src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx
+import { FaBullseye } from "react-icons/fa6";
+import cn from "classnames";
+import Button from "@fuf-stack/pixels/Button";
+import useLocalStorage from "@fuf-stack/pixels/hooks/useLocalStorage";
+import { jsx } from "react/jsx-runtime";
+var LOCALSTORAGE_DEBUG_KEY = "uniform:form-debug-enabled";
+var TestIdDebug = ({ className = void 0, testId }) => {
+  const [debug] = useLocalStorage(LOCALSTORAGE_DEBUG_KEY, false);
+  const copyToClipboard = () => {
+    navigator.clipboard.writeText(testId).catch((err) => {
+      console.error("Error copying TestId to clipboard", err);
+    });
+  };
+  if (!debug) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      className: cn(className, "pointer-events-auto"),
+      variant: "light",
+      onClick: copyToClipboard,
+      icon: /* @__PURE__ */ jsx(FaBullseye, {}),
+      size: "sm"
+    }
+  );
+};
+var FieldCopyTestIdButton_default = TestIdDebug;
+
+export {
+  FieldCopyTestIdButton_default
+};
+//# sourceMappingURL=chunk-UMTFPEVF.js.map

package/dist/chunk-UMTFPEVF.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/partials/FieldCopyTestIdButton/FieldCopyTestIdButton.tsx"],"sourcesContent":["import { FaBullseye } from 'react-icons/fa6';\n\nimport cn from 'classnames';\n\nimport Button from '@fuf-stack/pixels/Button';\nimport useLocalStorage from '@fuf-stack/pixels/hooks/useLocalStorage';\n\ninterface FormDebugProps {\n  className?: string;\n  testId: string;\n}\n\nconst LOCALSTORAGE_DEBUG_KEY = 'uniform:form-debug-enabled';\n\nconst TestIdDebug = ({ className = undefined, testId }: FormDebugProps) => {\n  const [debug] = useLocalStorage(LOCALSTORAGE_DEBUG_KEY, false);\n\n  const copyToClipboard = () => {\n    navigator.clipboard.writeText(testId).catch((err) => {\n      console.error('Error copying TestId to clipboard', err);\n    });\n  };\n\n  if (!debug) {\n    return null;\n  }\n\n  return (\n    <Button\n      className={cn(className, 'pointer-events-auto')}\n      variant=\"light\"\n      onClick={copyToClipboard}\n      icon={<FaBullseye />}\n      size=\"sm\"\n    />\n  );\n};\nexport default TestIdDebug;\n"],"mappings":";AAAA,SAAS,kBAAkB;AAE3B,OAAO,QAAQ;AAEf,OAAO,YAAY;AACnB,OAAO,qBAAqB;AA2BhB;AApBZ,IAAM,yBAAyB;AAE/B,IAAM,cAAc,CAAC,EAAE,YAAY,QAAW,OAAO,MAAsB;AACzE,QAAM,CAAC,KAAK,IAAI,gBAAgB,wBAAwB,KAAK;AAE7D,QAAM,kBAAkB,MAAM;AAC5B,cAAU,UAAU,UAAU,MAAM,EAAE,MAAM,CAAC,QAAQ;AACnD,cAAQ,MAAM,qCAAqC,GAAG;AAAA,IACxD,CAAC;AAAA,EACH;AAEA,MAAI,CAAC,OAAO;AACV,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,WAAW,qBAAqB;AAAA,MAC9C,SAAQ;AAAA,MACR,SAAS;AAAA,MACT,MAAM,oBAAC,cAAW;AAAA,MAClB,MAAK;AAAA;AAAA,EACP;AAEJ;AACA,IAAO,gCAAQ;","names":[]}

package/dist/chunk-WIY7KIHU.js

@@ -0,0 +1,22 @@
+// src/helpers/slugify.ts
+import slug from "slug";
+var slugify_default = (string, options) => {
+  const replacement = options?.replacement || "_";
+  return slug(string, {
+    ...slug.defaults.modes.rfc3986,
+    charmap: {
+      ...slug.defaults.modes.rfc3986.charmap,
+      // allow dots by default
+      ".": ".",
+      // convert hyphens to underscores (when replacement is not hyphen)
+      ...replacement !== "-" ? { "-": "_" } : {}
+    },
+    replacement,
+    ...options || {}
+  });
+};
+
+export {
+  slugify_default
+};
+//# sourceMappingURL=chunk-WIY7KIHU.js.map

package/dist/chunk-WIY7KIHU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/helpers/slugify.ts"],"sourcesContent":["import type { Options as SlugOptions } from 'slug';\n\nimport slug from 'slug';\n\nexport default (string: string, options?: SlugOptions) => {\n  const replacement = options?.replacement || '_';\n  return slug(string, {\n    ...slug.defaults.modes.rfc3986,\n    charmap: {\n      ...slug.defaults.modes.rfc3986.charmap,\n      // allow dots by default\n      '.': '.',\n      // convert hyphens to underscores (when replacement is not hyphen)\n      ...(replacement !== '-' ? { '-': '_' } : {}),\n    },\n    replacement,\n    ...(options || {}),\n  });\n};\n"],"mappings":";AAEA,OAAO,UAAU;AAEjB,IAAO,kBAAQ,CAAC,QAAgB,YAA0B;AACxD,QAAM,cAAc,SAAS,eAAe;AAC5C,SAAO,KAAK,QAAQ;AAAA,IAClB,GAAG,KAAK,SAAS,MAAM;AAAA,IACvB,SAAS;AAAA,MACP,GAAG,KAAK,SAAS,MAAM,QAAQ;AAAA;AAAA,MAE/B,KAAK;AAAA;AAAA,MAEL,GAAI,gBAAgB,MAAM,EAAE,KAAK,IAAI,IAAI,CAAC;AAAA,IAC5C;AAAA,IACA;AAAA,IACA,GAAI,WAAW,CAAC;AAAA,EAClB,CAAC;AACH;","names":[]}