@loadspark/core 0.0.1

package/dist/fields/AlertBox/Component.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { AlertIcon } from './icons/AlertIcon.js';
+import { ErrorIcon } from './icons/ErrorIcon.js';
+import { InfoIcon } from './icons/InfoIcon.js';
+import './styles.css';
+export const AlertBoxComponent = (props)=>{
+    const { field } = props;
+    const { type, className, icon, message } = field.admin.custom;
+    const iconMap = {
+        alert: /*#__PURE__*/ _jsx(AlertIcon, {}),
+        error: /*#__PURE__*/ _jsx(ErrorIcon, {}),
+        info: /*#__PURE__*/ _jsx(InfoIcon, {})
+    };
+    return /*#__PURE__*/ _jsxs("div", {
+        "aria-live": "polite",
+        className: `bfAlertBoxFieldWrapper ${String(type) + 'AlertType'} ${className ?? ''}`,
+        role: "status",
+        children: [
+            icon?.enable && /*#__PURE__*/ _jsx("div", {
+                className: "iconContainer",
+                children: iconMap[type]
+            }),
+            /*#__PURE__*/ _jsx("div", {
+                className: "contentContainer",
+                children: message ?? ''
+            })
+        ]
+    });
+};
+
+//# sourceMappingURL=Component.js.map

package/dist/fields/AlertBox/Component.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/fields/AlertBox/Component.tsx"],"sourcesContent":["import type { UIFieldServerProps } from 'payload'\n\nimport React, { type ReactElement } from 'react'\n\nimport type { BaseConfig, Config } from './index.js'\n\nimport { AlertIcon } from './icons/AlertIcon.js'\nimport { ErrorIcon } from './icons/ErrorIcon.js'\nimport { InfoIcon } from './icons/InfoIcon.js'\nimport './styles.css'\n\ntype Props = {\n  field: {\n    admin: {\n      custom: Config\n    } & UIFieldServerProps['field']['admin']\n  } & UIFieldServerProps['field']\n} & UIFieldServerProps\n\nexport const AlertBoxComponent: React.FC<Props> = (props) => {\n  const { field } = props\n\n  const { type, className, icon, message } = field.admin.custom\n\n  const iconMap: Record<BaseConfig['type'], ReactElement> = {\n    alert: <AlertIcon />,\n    error: <ErrorIcon />,\n    info: <InfoIcon />,\n  }\n\n  return (\n    <div\n      aria-live=\"polite\"\n      className={`bfAlertBoxFieldWrapper ${String(type) + 'AlertType'} ${className ?? ''}`}\n      role=\"status\"\n    >\n      {icon?.enable && <div className=\"iconContainer\">{iconMap[type]}</div>}\n      <div className=\"contentContainer\">{message ?? ''}</div>\n    </div>\n  )\n}\n"],"names":["React","AlertIcon","ErrorIcon","InfoIcon","AlertBoxComponent","props","field","type","className","icon","message","admin","custom","iconMap","alert","error","info","div","aria-live","String","role","enable"],"mappings":";AAEA,OAAOA,WAAkC,QAAO;AAIhD,SAASC,SAAS,QAAQ,uBAAsB;AAChD,SAASC,SAAS,QAAQ,uBAAsB;AAChD,SAASC,QAAQ,QAAQ,sBAAqB;AAC9C,OAAO,eAAc;AAUrB,OAAO,MAAMC,oBAAqC,CAACC;IACjD,MAAM,EAAEC,KAAK,EAAE,GAAGD;IAElB,MAAM,EAAEE,IAAI,EAAEC,SAAS,EAAEC,IAAI,EAAEC,OAAO,EAAE,GAAGJ,MAAMK,KAAK,CAACC,MAAM;IAE7D,MAAMC,UAAoD;QACxDC,qBAAO,KAACb;QACRc,qBAAO,KAACb;QACRc,oBAAM,KAACb;IACT;IAEA,qBACE,MAACc;QACCC,aAAU;QACVV,WAAW,CAAC,uBAAuB,EAAEW,OAAOZ,QAAQ,YAAY,CAAC,EAAEC,aAAa,IAAI;QACpFY,MAAK;;YAEJX,MAAMY,wBAAU,KAACJ;gBAAIT,WAAU;0BAAiBK,OAAO,CAACN,KAAK;;0BAC9D,KAACU;gBAAIT,WAAU;0BAAoBE,WAAW;;;;AAGpD,EAAC"}

package/dist/fields/AlertBox/icons/AlertIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const AlertIcon: () => React.JSX.Element;
+//# sourceMappingURL=AlertIcon.d.ts.map

package/dist/fields/AlertBox/icons/AlertIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlertIcon.d.ts","sourceRoot":"","sources":["../../../../src/fields/AlertBox/icons/AlertIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,eAAO,MAAM,SAAS,yBAiBrB,CAAA"}

package/dist/fields/AlertBox/icons/AlertIcon.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+export const AlertIcon = ()=>/*#__PURE__*/ _jsxs("svg", {
+        className: "lucide lucide-alert-triangle",
+        fill: "none",
+        height: "24",
+        stroke: "currentColor",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: "2",
+        viewBox: "0 0 24 24",
+        width: "24",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [
+            /*#__PURE__*/ _jsx("path", {
+                d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z"
+            }),
+            /*#__PURE__*/ _jsx("path", {
+                d: "M12 9v4"
+            }),
+            /*#__PURE__*/ _jsx("path", {
+                d: "M12 17h.01"
+            })
+        ]
+    });
+
+//# sourceMappingURL=AlertIcon.js.map

package/dist/fields/AlertBox/icons/AlertIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/fields/AlertBox/icons/AlertIcon.tsx"],"sourcesContent":["import React from 'react'\n\nexport const AlertIcon = () => (\n  <svg\n    className=\"lucide lucide-alert-triangle\"\n    fill=\"none\"\n    height=\"24\"\n    stroke=\"currentColor\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    strokeWidth=\"2\"\n    viewBox=\"0 0 24 24\"\n    width=\"24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <path d=\"m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3Z\" />\n    <path d=\"M12 9v4\" />\n    <path d=\"M12 17h.01\" />\n  </svg>\n)\n"],"names":["React","AlertIcon","svg","className","fill","height","stroke","strokeLinecap","strokeLinejoin","strokeWidth","viewBox","width","xmlns","path","d"],"mappings":";AAAA,OAAOA,WAAW,QAAO;AAEzB,OAAO,MAAMC,YAAY,kBACvB,MAACC;QACCC,WAAU;QACVC,MAAK;QACLC,QAAO;QACPC,QAAO;QACPC,eAAc;QACdC,gBAAe;QACfC,aAAY;QACZC,SAAQ;QACRC,OAAM;QACNC,OAAM;;0BAEN,KAACC;gBAAKC,GAAE;;0BACR,KAACD;gBAAKC,GAAE;;0BACR,KAACD;gBAAKC,GAAE;;;OAEX"}

package/dist/fields/AlertBox/icons/ErrorIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const ErrorIcon: () => React.JSX.Element;
+//# sourceMappingURL=ErrorIcon.d.ts.map

package/dist/fields/AlertBox/icons/ErrorIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ErrorIcon.d.ts","sourceRoot":"","sources":["../../../../src/fields/AlertBox/icons/ErrorIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,eAAO,MAAM,SAAS,yBAiBrB,CAAA"}

package/dist/fields/AlertBox/icons/ErrorIcon.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+export const ErrorIcon = ()=>/*#__PURE__*/ _jsxs("svg", {
+        className: "lucide lucide-alert-circle",
+        fill: "none",
+        height: "24",
+        stroke: "currentColor",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: "2",
+        viewBox: "0 0 24 24",
+        width: "24",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [
+            /*#__PURE__*/ _jsx("circle", {
+                cx: "12",
+                cy: "12",
+                r: "10"
+            }),
+            /*#__PURE__*/ _jsx("line", {
+                x1: "12",
+                x2: "12",
+                y1: "8",
+                y2: "12"
+            }),
+            /*#__PURE__*/ _jsx("line", {
+                x1: "12",
+                x2: "12.01",
+                y1: "16",
+                y2: "16"
+            })
+        ]
+    });
+
+//# sourceMappingURL=ErrorIcon.js.map

package/dist/fields/AlertBox/icons/ErrorIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/fields/AlertBox/icons/ErrorIcon.tsx"],"sourcesContent":["import React from 'react'\n\nexport const ErrorIcon = () => (\n  <svg\n    className=\"lucide lucide-alert-circle\"\n    fill=\"none\"\n    height=\"24\"\n    stroke=\"currentColor\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    strokeWidth=\"2\"\n    viewBox=\"0 0 24 24\"\n    width=\"24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <circle cx=\"12\" cy=\"12\" r=\"10\" />\n    <line x1=\"12\" x2=\"12\" y1=\"8\" y2=\"12\" />\n    <line x1=\"12\" x2=\"12.01\" y1=\"16\" y2=\"16\" />\n  </svg>\n)\n"],"names":["React","ErrorIcon","svg","className","fill","height","stroke","strokeLinecap","strokeLinejoin","strokeWidth","viewBox","width","xmlns","circle","cx","cy","r","line","x1","x2","y1","y2"],"mappings":";AAAA,OAAOA,WAAW,QAAO;AAEzB,OAAO,MAAMC,YAAY,kBACvB,MAACC;QACCC,WAAU;QACVC,MAAK;QACLC,QAAO;QACPC,QAAO;QACPC,eAAc;QACdC,gBAAe;QACfC,aAAY;QACZC,SAAQ;QACRC,OAAM;QACNC,OAAM;;0BAEN,KAACC;gBAAOC,IAAG;gBAAKC,IAAG;gBAAKC,GAAE;;0BAC1B,KAACC;gBAAKC,IAAG;gBAAKC,IAAG;gBAAKC,IAAG;gBAAIC,IAAG;;0BAChC,KAACJ;gBAAKC,IAAG;gBAAKC,IAAG;gBAAQC,IAAG;gBAAKC,IAAG;;;OAEvC"}

package/dist/fields/AlertBox/icons/InfoIcon.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const InfoIcon: () => React.JSX.Element;
+//# sourceMappingURL=InfoIcon.d.ts.map

package/dist/fields/AlertBox/icons/InfoIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InfoIcon.d.ts","sourceRoot":"","sources":["../../../../src/fields/AlertBox/icons/InfoIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,eAAO,MAAM,QAAQ,yBAiBpB,CAAA"}

package/dist/fields/AlertBox/icons/InfoIcon.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+export const InfoIcon = ()=>/*#__PURE__*/ _jsxs("svg", {
+        className: "lucide lucide-info",
+        fill: "none",
+        height: "24",
+        stroke: "currentColor",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        strokeWidth: "2",
+        viewBox: "0 0 24 24",
+        width: "24",
+        xmlns: "http://www.w3.org/2000/svg",
+        children: [
+            /*#__PURE__*/ _jsx("circle", {
+                cx: "12",
+                cy: "12",
+                r: "10"
+            }),
+            /*#__PURE__*/ _jsx("path", {
+                d: "M12 16v-4"
+            }),
+            /*#__PURE__*/ _jsx("path", {
+                d: "M12 8h.01"
+            })
+        ]
+    });
+
+//# sourceMappingURL=InfoIcon.js.map

package/dist/fields/AlertBox/icons/InfoIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/fields/AlertBox/icons/InfoIcon.tsx"],"sourcesContent":["import React from 'react'\n\nexport const InfoIcon = () => (\n  <svg\n    className=\"lucide lucide-info\"\n    fill=\"none\"\n    height=\"24\"\n    stroke=\"currentColor\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n    strokeWidth=\"2\"\n    viewBox=\"0 0 24 24\"\n    width=\"24\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n  >\n    <circle cx=\"12\" cy=\"12\" r=\"10\" />\n    <path d=\"M12 16v-4\" />\n    <path d=\"M12 8h.01\" />\n  </svg>\n)\n"],"names":["React","InfoIcon","svg","className","fill","height","stroke","strokeLinecap","strokeLinejoin","strokeWidth","viewBox","width","xmlns","circle","cx","cy","r","path","d"],"mappings":";AAAA,OAAOA,WAAW,QAAO;AAEzB,OAAO,MAAMC,WAAW,kBACtB,MAACC;QACCC,WAAU;QACVC,MAAK;QACLC,QAAO;QACPC,QAAO;QACPC,eAAc;QACdC,gBAAe;QACfC,aAAY;QACZC,SAAQ;QACRC,OAAM;QACNC,OAAM;;0BAEN,KAACC;gBAAOC,IAAG;gBAAKC,IAAG;gBAAKC,GAAE;;0BAC1B,KAACC;gBAAKC,GAAE;;0BACR,KAACD;gBAAKC,GAAE;;;OAEX"}

package/dist/fields/AlertBox/index.d.ts

@@ -0,0 +1,76 @@
+import type { Field, UIField } from 'payload';
+export type BaseConfig = {
+    message: string;
+    type: 'alert' | 'error' | 'info';
+};
+export type Config = {
+    className?: string;
+    icon?: {
+        enable?: boolean;
+    };
+} & BaseConfig;
+interface BetterUIField extends Omit<UIField, 'admin' | 'type'> {
+    admin?: UIField['admin'];
+}
+/**
+ * Factory function type for creating an AlertBox field.
+ *
+ * @param overrides - Configuration object
+ * @param overrides.config - Alert box specific configuration
+ * @param overrides.config.message - The message text to display
+ * @param overrides.config.type - Alert type: 'alert' | 'error' | 'info' (defaults to 'info')
+ * @param overrides.config.icon - Icon configuration
+ * @param overrides.config.icon.enable - Show leading icon (defaults to true)
+ * @param overrides.config.className - Additional CSS class for the wrapper
+ * @param overrides.overrides - Any Payload UIField properties to override (name, admin.condition, etc.)
+ *
+ * @returns A Payload Field configuration
+ */
+export type AlertBox = (overrides: {
+    /**
+     * Config for the alert box.
+     * Type defaults to 'info'
+     */
+    config: Config;
+    /**
+     * Field overrides
+     */
+    overrides: BetterUIField;
+}) => Field;
+/**
+ * Creates an AlertBox field for displaying styled alerts in the admin UI.
+ *
+ * This field displays an accessible alert message with customizable type (info, error, alert),
+ * optional icon, and full styling control. It's useful for displaying warnings, information,
+ * or error messages to content editors.
+ *
+ * @param config - Alert box configuration
+ * @param config.message - The message text to display
+ * @param config.type - Alert type: 'alert' | 'error' | 'info' (defaults to 'info')
+ * @param config.icon - Icon configuration
+ * @param config.icon.enable - Show leading icon (defaults to true)
+ * @param config.className - Additional CSS class for the wrapper
+ * @param overrides - Any Payload UIField properties to override
+ *
+ * @returns A Payload Field configuration
+ *
+ * @example
+ * ```ts
+ * AlertBoxField({
+ *   config: {
+ *     type: 'info',
+ *     message: 'Please be aware that the title is required for the mobile app.',
+ *     icon: { enable: true }
+ *   },
+ *   overrides: {
+ *     name: 'titleRequiredUI',
+ *     admin: {
+ *       condition: (data, siblingData) => !siblingData.title
+ *     }
+ *   }
+ * })
+ * ```
+ */
+export declare const AlertBoxField: AlertBox;
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/fields/AlertBox/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/AlertBox/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,SAAS,CAAA;AAI7C,MAAM,MAAM,UAAU,GAAG;IACvB,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,OAAO,GAAG,OAAO,GAAG,MAAM,CAAA;CACjC,CAAA;AAED,MAAM,MAAM,MAAM,GAAG;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,CAAC,EAAE;QACL,MAAM,CAAC,EAAE,OAAO,CAAA;KACjB,CAAA;CACF,GAAG,UAAU,CAAA;AAEd,UAAU,aAAc,SAAQ,IAAI,CAAC,OAAO,EAAE,OAAO,GAAG,MAAM,CAAC;IAC7D,KAAK,CAAC,EAAE,OAAO,CAAC,OAAO,CAAC,CAAA;CACzB;AAED;;;;;;;;;;;;;GAaG;AACH,MAAM,MAAM,QAAQ,GAAG,CAAC,SAAS,EAAE;IACjC;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAA;IACd;;OAEG;IACH,SAAS,EAAE,aAAa,CAAA;CACzB,KAAK,KAAK,CAAA;AAEX;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,eAAO,MAAM,aAAa,EAAE,QA+B3B,CAAA"}

package/dist/fields/AlertBox/index.js

@@ -0,0 +1,64 @@
+import { deepMerge } from 'payload';
+/**
+ * Creates an AlertBox field for displaying styled alerts in the admin UI.
+ *
+ * This field displays an accessible alert message with customizable type (info, error, alert),
+ * optional icon, and full styling control. It's useful for displaying warnings, information,
+ * or error messages to content editors.
+ *
+ * @param config - Alert box configuration
+ * @param config.message - The message text to display
+ * @param config.type - Alert type: 'alert' | 'error' | 'info' (defaults to 'info')
+ * @param config.icon - Icon configuration
+ * @param config.icon.enable - Show leading icon (defaults to true)
+ * @param config.className - Additional CSS class for the wrapper
+ * @param overrides - Any Payload UIField properties to override
+ *
+ * @returns A Payload Field configuration
+ *
+ * @example
+ * ```ts
+ * AlertBoxField({
+ *   config: {
+ *     type: 'info',
+ *     message: 'Please be aware that the title is required for the mobile app.',
+ *     icon: { enable: true }
+ *   },
+ *   overrides: {
+ *     name: 'titleRequiredUI',
+ *     admin: {
+ *       condition: (data, siblingData) => !siblingData.title
+ *     }
+ *   }
+ * })
+ * ```
+ */ export const AlertBoxField = ({ config, overrides })=>{
+    const alertBoxField = deepMerge({
+        name: 'AlertBox',
+        type: 'ui',
+        admin: {
+            components: {
+                Field: {
+                    clientProps: {
+                        ...config,
+                        icon: {
+                            enable: true,
+                            ...config.icon
+                        }
+                    },
+                    path: '@loadspark/core/fields/AlertBox/client#AlertBoxComponent'
+                }
+            },
+            custom: {
+                ...config,
+                icon: {
+                    enable: true,
+                    ...config.icon
+                }
+            }
+        }
+    }, overrides);
+    return alertBoxField;
+};
+
+//# sourceMappingURL=index.js.map

package/dist/fields/AlertBox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/fields/AlertBox/index.ts"],"sourcesContent":["import type { Field, UIField } from 'payload'\n\nimport { deepMerge } from 'payload'\n\nexport type BaseConfig = {\n  message: string\n  type: 'alert' | 'error' | 'info'\n}\n\nexport type Config = {\n  className?: string\n  icon?: {\n    enable?: boolean\n  }\n} & BaseConfig\n\ninterface BetterUIField extends Omit<UIField, 'admin' | 'type'> {\n  admin?: UIField['admin']\n}\n\n/**\n * Factory function type for creating an AlertBox field.\n *\n * @param overrides - Configuration object\n * @param overrides.config - Alert box specific configuration\n * @param overrides.config.message - The message text to display\n * @param overrides.config.type - Alert type: 'alert' | 'error' | 'info' (defaults to 'info')\n * @param overrides.config.icon - Icon configuration\n * @param overrides.config.icon.enable - Show leading icon (defaults to true)\n * @param overrides.config.className - Additional CSS class for the wrapper\n * @param overrides.overrides - Any Payload UIField properties to override (name, admin.condition, etc.)\n *\n * @returns A Payload Field configuration\n */\nexport type AlertBox = (overrides: {\n  /**\n   * Config for the alert box.\n   * Type defaults to 'info'\n   */\n  config: Config\n  /**\n   * Field overrides\n   */\n  overrides: BetterUIField\n}) => Field\n\n/**\n * Creates an AlertBox field for displaying styled alerts in the admin UI.\n *\n * This field displays an accessible alert message with customizable type (info, error, alert),\n * optional icon, and full styling control. It's useful for displaying warnings, information,\n * or error messages to content editors.\n *\n * @param config - Alert box configuration\n * @param config.message - The message text to display\n * @param config.type - Alert type: 'alert' | 'error' | 'info' (defaults to 'info')\n * @param config.icon - Icon configuration\n * @param config.icon.enable - Show leading icon (defaults to true)\n * @param config.className - Additional CSS class for the wrapper\n * @param overrides - Any Payload UIField properties to override\n *\n * @returns A Payload Field configuration\n *\n * @example\n * ```ts\n * AlertBoxField({\n *   config: {\n *     type: 'info',\n *     message: 'Please be aware that the title is required for the mobile app.',\n *     icon: { enable: true }\n *   },\n *   overrides: {\n *     name: 'titleRequiredUI',\n *     admin: {\n *       condition: (data, siblingData) => !siblingData.title\n *     }\n *   }\n * })\n * ```\n */\nexport const AlertBoxField: AlertBox = ({ config, overrides }) => {\n  const alertBoxField = deepMerge<UIField, Partial<UIField>>(\n    {\n      name: 'AlertBox',\n      type: 'ui',\n      admin: {\n        components: {\n          Field: {\n            clientProps: {\n              ...config,\n              icon: {\n                enable: true,\n                ...config.icon,\n              },\n            },\n            path: '@loadspark/core/fields/AlertBox/client#AlertBoxComponent',\n          },\n        },\n        custom: {\n          ...config,\n          icon: {\n            enable: true,\n            ...config.icon,\n          },\n        },\n      },\n    },\n    overrides,\n  )\n\n  return alertBoxField\n}\n"],"names":["deepMerge","AlertBoxField","config","overrides","alertBoxField","name","type","admin","components","Field","clientProps","icon","enable","path","custom"],"mappings":"AAEA,SAASA,SAAS,QAAQ,UAAS;AA4CnC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiCC,GACD,OAAO,MAAMC,gBAA0B,CAAC,EAAEC,MAAM,EAAEC,SAAS,EAAE;IAC3D,MAAMC,gBAAgBJ,UACpB;QACEK,MAAM;QACNC,MAAM;QACNC,OAAO;YACLC,YAAY;gBACVC,OAAO;oBACLC,aAAa;wBACX,GAAGR,MAAM;wBACTS,MAAM;4BACJC,QAAQ;4BACR,GAAGV,OAAOS,IAAI;wBAChB;oBACF;oBACAE,MAAM;gBACR;YACF;YACAC,QAAQ;gBACN,GAAGZ,MAAM;gBACTS,MAAM;oBACJC,QAAQ;oBACR,GAAGV,OAAOS,IAAI;gBAChB;YACF;QACF;IACF,GACAR;IAGF,OAAOC;AACT,EAAC"}

package/dist/fields/AlertBox/styles.css

@@ -0,0 +1,42 @@
+.bfAlertBoxFieldWrapper {
+  --border-colour: var(--theme-elevation-350);
+  --icon-colour: var(--theme-elevation-800);
+
+  border: 1px solid var(--border-colour);
+  border-radius: var(--style-radius-s);
+  margin-top: 2.5rem;
+  margin-bottom: 2.5rem;
+  padding: 0.75rem 1rem;
+  display: flex;
+  gap: 1rem;
+
+  &.alertAlertType {
+    --border-colour: var(--theme-warning-350);
+    --icon-colour: var(--theme-warning-350);
+  }
+
+  &.errorAlertType {
+    --border-colour: var(--theme-error-350);
+    --icon-colour: var(--theme-error-350);
+  }
+}
+
+.iconContainer {
+  color: var(--icon-colour);
+}
+
+/* .iconContainer {
+  .errorAlertType & {
+    --icon-colour: var(--theme-error-350);
+  }
+}
+
+.iconContainer {
+  .alertAlertType & {
+    --icon-colour: var(--theme-warning-350);
+  }
+} */
+
+.contentContainer {
+  font-size: 1.25rem;
+}

package/dist/fields/ColourText/Component.d.ts

@@ -0,0 +1,8 @@
+import type { TextFieldClientProps } from 'payload';
+import React from 'react';
+import type { Config } from './index.js';
+import './styles.css';
+type Props = Config & TextFieldClientProps;
+export declare const ColourTextComponent: React.FC<Props>;
+export {};
+//# sourceMappingURL=Component.d.ts.map

package/dist/fields/ColourText/Component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Component.d.ts","sourceRoot":"","sources":["../../../src/fields/ColourText/Component.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAUnD,OAAO,KAA+B,MAAM,OAAO,CAAA;AAEnD,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAExC,OAAO,cAAc,CAAA;AAErB,KAAK,KAAK,GAAG,MAAM,GAAG,oBAAoB,CAAA;AAE1C,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAyG/C,CAAA"}

package/dist/fields/ColourText/Component.js

@@ -0,0 +1,102 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { FieldDescription, FieldError, FieldLabel, RenderCustomComponent, TextInput as TextInputField, useField } from '@payloadcms/ui';
+import React, { useCallback, useMemo } from 'react';
+import './styles.css';
+export const ColourTextComponent = (props)=>{
+    const { field, path, readOnly, validate } = props;
+    const { admin: { className, description, style } = {}, label, required } = field;
+    const memoizedValidate = useCallback(// eslint-disable-next-line @typescript-eslint/no-explicit-any
+    (value, options)=>{
+        if (typeof validate === 'function') {
+            return validate(value, {
+                ...options,
+                required
+            });
+        }
+    }, [
+        validate,
+        required
+    ]);
+    const isReadonly = Boolean(readOnly);
+    const { customComponents: { AfterInput, BeforeInput, Description, Label } = {}, errorMessage, setValue, showError, value } = useField({
+        path,
+        // @ts-expect-error - memoizedValidate is not typed
+        validate: memoizedValidate
+    });
+    const classes = [
+        'field-type',
+        'text',
+        className,
+        showError && 'error',
+        isReadonly && 'read-only',
+        'container'
+    ].filter(Boolean).join(' ');
+    const colour = useMemo(()=>{
+        const gradient = 'linear-gradient(45deg, var(--theme-elevation-900) 0%, var(--theme-elevation-900) 45%, var(--theme-error-500) 50%, var(--theme-elevation-900) 55%, var(--theme-elevation-900) 100%)';
+        if (typeof value !== 'string' || value.trim() === '') {
+            return gradient;
+        }
+        // Allow basic CSS color strings. Browser will ignore invalid ones; we mirror server validate as best-effort.
+        const testEl = document.createElement('div');
+        testEl.style.color = '';
+        testEl.style.color = value;
+        const isValid = testEl.style.color !== '';
+        return isValid ? value : gradient;
+    }, [
+        value
+    ]);
+    return /*#__PURE__*/ _jsxs("div", {
+        className: `bfColourTextFieldWrapper field-type`,
+        children: [
+            /*#__PURE__*/ _jsx(RenderCustomComponent, {
+                CustomComponent: Label,
+                Fallback: /*#__PURE__*/ _jsx(FieldLabel, {
+                    label: label,
+                    path: path,
+                    required: required
+                })
+            }),
+            BeforeInput,
+            /*#__PURE__*/ _jsxs("div", {
+                className: classes,
+                children: [
+                    /*#__PURE__*/ _jsx(TextInputField, {
+                        className: 'colourTextInput',
+                        Error: /*#__PURE__*/ _jsx(FieldError, {
+                            message: errorMessage
+                        }),
+                        label: undefined,
+                        onChange: (e)=>{
+                            setValue(e.target.value);
+                        },
+                        path: path,
+                        readOnly: isReadonly,
+                        required: required,
+                        showError: showError,
+                        style: style,
+                        value: value
+                    }),
+                    /*#__PURE__*/ _jsx("div", {
+                        "aria-hidden": true,
+                        className: "colourBox",
+                        style: {
+                            background: colour
+                        }
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsx(RenderCustomComponent, {
+                CustomComponent: Description,
+                Fallback: /*#__PURE__*/ _jsx(FieldDescription, {
+                    className: `field-description-${path.replace(/\./g, '__')}`,
+                    description: description ?? '',
+                    path: path
+                })
+            }),
+            AfterInput
+        ]
+    });
+};
+
+//# sourceMappingURL=Component.js.map

package/dist/fields/ColourText/Component.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/fields/ColourText/Component.tsx"],"sourcesContent":["'use client'\n\nimport type { TextFieldClientProps } from 'payload'\n\nimport {\n  FieldDescription,\n  FieldError,\n  FieldLabel,\n  RenderCustomComponent,\n  TextInput as TextInputField,\n  useField,\n} from '@payloadcms/ui'\nimport React, { useCallback, useMemo } from 'react'\n\nimport type { Config } from './index.js'\n\nimport './styles.css'\n\ntype Props = Config & TextFieldClientProps\n\nexport const ColourTextComponent: React.FC<Props> = (props) => {\n  const { field, path, readOnly, validate } = props\n\n  const { admin: { className, description, style } = {}, label, required } = field\n\n  const memoizedValidate = useCallback(\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (value: string, options: any) => {\n      if (typeof validate === 'function') {\n        return validate(value, { ...options, required })\n      }\n    },\n    [validate, required],\n  )\n\n  const isReadonly = Boolean(readOnly)\n\n  const {\n    customComponents: { AfterInput, BeforeInput, Description, Label } = {},\n    errorMessage,\n    setValue,\n    showError,\n    value,\n  } = useField<string>({\n    path,\n    // @ts-expect-error - memoizedValidate is not typed\n    validate: memoizedValidate,\n  })\n\n  const classes = [\n    'field-type',\n    'text',\n    className,\n    showError && 'error',\n    isReadonly && 'read-only',\n    'container',\n  ]\n    .filter(Boolean)\n    .join(' ')\n\n  const colour = useMemo(() => {\n    const gradient =\n      'linear-gradient(45deg, var(--theme-elevation-900) 0%, var(--theme-elevation-900) 45%, var(--theme-error-500) 50%, var(--theme-elevation-900) 55%, var(--theme-elevation-900) 100%)'\n\n    if (typeof value !== 'string' || value.trim() === '') {\n      return gradient\n    }\n\n    // Allow basic CSS color strings. Browser will ignore invalid ones; we mirror server validate as best-effort.\n    const testEl = document.createElement('div')\n    testEl.style.color = ''\n    testEl.style.color = value\n    const isValid = testEl.style.color !== ''\n\n    return isValid ? value : gradient\n  }, [value])\n\n  return (\n    <div className={`bfColourTextFieldWrapper field-type`}>\n      <RenderCustomComponent\n        CustomComponent={Label}\n        Fallback={<FieldLabel label={label} path={path} required={required} />}\n      />\n\n      {BeforeInput}\n\n      <div className={classes}>\n        <TextInputField\n          className={'colourTextInput'}\n          Error={<FieldError message={errorMessage} />}\n          label={undefined}\n          onChange={(e: React.ChangeEvent<HTMLInputElement>) => {\n            setValue(e.target.value)\n          }}\n          path={path}\n          readOnly={isReadonly}\n          required={required}\n          showError={showError}\n          style={style}\n          value={value}\n        />\n\n        <div\n          aria-hidden={true}\n          className=\"colourBox\"\n          style={{\n            background: colour,\n          }}\n        />\n      </div>\n\n      <RenderCustomComponent\n        CustomComponent={Description}\n        Fallback={\n          <FieldDescription\n            className={`field-description-${path.replace(/\\./g, '__')}`}\n            description={description ?? ''}\n            path={path}\n          />\n        }\n      />\n\n      {AfterInput}\n    </div>\n  )\n}\n"],"names":["FieldDescription","FieldError","FieldLabel","RenderCustomComponent","TextInput","TextInputField","useField","React","useCallback","useMemo","ColourTextComponent","props","field","path","readOnly","validate","admin","className","description","style","label","required","memoizedValidate","value","options","isReadonly","Boolean","customComponents","AfterInput","BeforeInput","Description","Label","errorMessage","setValue","showError","classes","filter","join","colour","gradient","trim","testEl","document","createElement","color","isValid","div","CustomComponent","Fallback","Error","message","undefined","onChange","e","target","aria-hidden","background","replace"],"mappings":"AAAA;;AAIA,SACEA,gBAAgB,EAChBC,UAAU,EACVC,UAAU,EACVC,qBAAqB,EACrBC,aAAaC,cAAc,EAC3BC,QAAQ,QACH,iBAAgB;AACvB,OAAOC,SAASC,WAAW,EAAEC,OAAO,QAAQ,QAAO;AAInD,OAAO,eAAc;AAIrB,OAAO,MAAMC,sBAAuC,CAACC;IACnD,MAAM,EAAEC,KAAK,EAAEC,IAAI,EAAEC,QAAQ,EAAEC,QAAQ,EAAE,GAAGJ;IAE5C,MAAM,EAAEK,OAAO,EAAEC,SAAS,EAAEC,WAAW,EAAEC,KAAK,EAAE,GAAG,CAAC,CAAC,EAAEC,KAAK,EAAEC,QAAQ,EAAE,GAAGT;IAE3E,MAAMU,mBAAmBd,YACvB,8DAA8D;IAC9D,CAACe,OAAeC;QACd,IAAI,OAAOT,aAAa,YAAY;YAClC,OAAOA,SAASQ,OAAO;gBAAE,GAAGC,OAAO;gBAAEH;YAAS;QAChD;IACF,GACA;QAACN;QAAUM;KAAS;IAGtB,MAAMI,aAAaC,QAAQZ;IAE3B,MAAM,EACJa,kBAAkB,EAAEC,UAAU,EAAEC,WAAW,EAAEC,WAAW,EAAEC,KAAK,EAAE,GAAG,CAAC,CAAC,EACtEC,YAAY,EACZC,QAAQ,EACRC,SAAS,EACTX,KAAK,EACN,GAAGjB,SAAiB;QACnBO;QACA,mDAAmD;QACnDE,UAAUO;IACZ;IAEA,MAAMa,UAAU;QACd;QACA;QACAlB;QACAiB,aAAa;QACbT,cAAc;QACd;KACD,CACEW,MAAM,CAACV,SACPW,IAAI,CAAC;IAER,MAAMC,SAAS7B,QAAQ;QACrB,MAAM8B,WACJ;QAEF,IAAI,OAAOhB,UAAU,YAAYA,MAAMiB,IAAI,OAAO,IAAI;YACpD,OAAOD;QACT;QAEA,6GAA6G;QAC7G,MAAME,SAASC,SAASC,aAAa,CAAC;QACtCF,OAAOtB,KAAK,CAACyB,KAAK,GAAG;QACrBH,OAAOtB,KAAK,CAACyB,KAAK,GAAGrB;QACrB,MAAMsB,UAAUJ,OAAOtB,KAAK,CAACyB,KAAK,KAAK;QAEvC,OAAOC,UAAUtB,QAAQgB;IAC3B,GAAG;QAAChB;KAAM;IAEV,qBACE,MAACuB;QAAI7B,WAAW,CAAC,mCAAmC,CAAC;;0BACnD,KAACd;gBACC4C,iBAAiBhB;gBACjBiB,wBAAU,KAAC9C;oBAAWkB,OAAOA;oBAAOP,MAAMA;oBAAMQ,UAAUA;;;YAG3DQ;0BAED,MAACiB;gBAAI7B,WAAWkB;;kCACd,KAAC9B;wBACCY,WAAW;wBACXgC,qBAAO,KAAChD;4BAAWiD,SAASlB;;wBAC5BZ,OAAO+B;wBACPC,UAAU,CAACC;4BACTpB,SAASoB,EAAEC,MAAM,CAAC/B,KAAK;wBACzB;wBACAV,MAAMA;wBACNC,UAAUW;wBACVJ,UAAUA;wBACVa,WAAWA;wBACXf,OAAOA;wBACPI,OAAOA;;kCAGT,KAACuB;wBACCS,eAAa;wBACbtC,WAAU;wBACVE,OAAO;4BACLqC,YAAYlB;wBACd;;;;0BAIJ,KAACnC;gBACC4C,iBAAiBjB;gBACjBkB,wBACE,KAAChD;oBACCiB,WAAW,CAAC,kBAAkB,EAAEJ,KAAK4C,OAAO,CAAC,OAAO,OAAO;oBAC3DvC,aAAaA,eAAe;oBAC5BL,MAAMA;;;YAKXe;;;AAGP,EAAC"}

package/dist/fields/ColourText/index.d.ts

@@ -0,0 +1,35 @@
+import type { Field, TextField } from 'payload';
+export type Config = object;
+/**
+ * Factory function type for creating a ColourText field.
+ *
+ * @param overrides - Any Payload TextField properties to override (except type)
+ *
+ * @returns A Payload Field configuration
+ */
+export type ColourText = (
+/**
+ * Field overrides
+ */
+overrides: Omit<TextField, 'type'>) => Field;
+/**
+ * Creates a ColourText field for text input with color-specific options.
+ *
+ * This field provides a text input with enhanced color handling capabilities.
+ * The exact behavior depends on the custom component implementation.
+ *
+ * @param overrides - Any Payload TextField properties to override (name, label, required, validate, etc.)
+ *
+ * @returns A Payload Field configuration
+ *
+ * @example
+ * ```ts
+ * ColourTextField({
+ *   name: 'colorCode',
+ *   label: { en: 'Color Code', de: 'Farbcode' },
+ *   required: true
+ * })
+ * ```
+ */
+export declare const ColourTextField: ColourText;
+//# sourceMappingURL=index.d.ts.map

package/dist/fields/ColourText/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/fields/ColourText/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAM/C,MAAM,MAAM,MAAM,GAAG,MAAM,CAAA;AAE3B;;;;;;GAMG;AACH,MAAM,MAAM,UAAU,GAAG;AACvB;;GAEG;AACH,SAAS,EAAE,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,KAC/B,KAAK,CAAA;AAEV;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,eAAe,EAAE,UAsB7B,CAAA"}

package/dist/fields/ColourText/index.js

@@ -0,0 +1,41 @@
+import { deepMerge } from 'payload';
+import { validate } from './validate.js';
+/**
+ * Creates a ColourText field for text input with color-specific options.
+ *
+ * This field provides a text input with enhanced color handling capabilities.
+ * The exact behavior depends on the custom component implementation.
+ *
+ * @param overrides - Any Payload TextField properties to override (name, label, required, validate, etc.)
+ *
+ * @returns A Payload Field configuration
+ *
+ * @example
+ * ```ts
+ * ColourTextField({
+ *   name: 'colorCode',
+ *   label: { en: 'Color Code', de: 'Farbcode' },
+ *   required: true
+ * })
+ * ```
+ */ export const ColourTextField = (overrides)=>{
+    const colourTextField = deepMerge({
+        name: 'ColourText',
+        type: 'text',
+        admin: {
+            components: {
+                Field: {
+                    path: '@loadspark/core/fields/ColourText/client#ColourTextComponent'
+                }
+            }
+        },
+        label: {
+            de: 'Farbe',
+            en: 'Colour'
+        },
+        validate: validate(overrides.required)
+    }, overrides);
+    return colourTextField;
+};
+
+//# sourceMappingURL=index.js.map

package/dist/fields/ColourText/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/fields/ColourText/index.ts"],"sourcesContent":["import type { Field, TextField } from 'payload'\n\nimport { deepMerge } from 'payload'\n\nimport { validate } from './validate.js'\n\nexport type Config = object\n\n/**\n * Factory function type for creating a ColourText field.\n *\n * @param overrides - Any Payload TextField properties to override (except type)\n *\n * @returns A Payload Field configuration\n */\nexport type ColourText = (\n  /**\n   * Field overrides\n   */\n  overrides: Omit<TextField, 'type'>,\n) => Field\n\n/**\n * Creates a ColourText field for text input with color-specific options.\n *\n * This field provides a text input with enhanced color handling capabilities.\n * The exact behavior depends on the custom component implementation.\n *\n * @param overrides - Any Payload TextField properties to override (name, label, required, validate, etc.)\n *\n * @returns A Payload Field configuration\n *\n * @example\n * ```ts\n * ColourTextField({\n *   name: 'colorCode',\n *   label: { en: 'Color Code', de: 'Farbcode' },\n *   required: true\n * })\n * ```\n */\nexport const ColourTextField: ColourText = (overrides) => {\n  const colourTextField = deepMerge<TextField, Omit<TextField, 'type'>>(\n    {\n      name: 'ColourText',\n      type: 'text',\n      admin: {\n        components: {\n          Field: {\n            path: '@loadspark/core/fields/ColourText/client#ColourTextComponent',\n          },\n        },\n      },\n      label: {\n        de: 'Farbe',\n        en: 'Colour',\n      },\n      validate: validate(overrides.required),\n    },\n    overrides,\n  )\n\n  return colourTextField\n}\n"],"names":["deepMerge","validate","ColourTextField","overrides","colourTextField","name","type","admin","components","Field","path","label","de","en","required"],"mappings":"AAEA,SAASA,SAAS,QAAQ,UAAS;AAEnC,SAASC,QAAQ,QAAQ,gBAAe;AAkBxC;;;;;;;;;;;;;;;;;;CAkBC,GACD,OAAO,MAAMC,kBAA8B,CAACC;IAC1C,MAAMC,kBAAkBJ,UACtB;QACEK,MAAM;QACNC,MAAM;QACNC,OAAO;YACLC,YAAY;gBACVC,OAAO;oBACLC,MAAM;gBACR;YACF;QACF;QACAC,OAAO;YACLC,IAAI;YACJC,IAAI;QACN;QACAZ,UAAUA,SAASE,UAAUW,QAAQ;IACvC,GACAX;IAGF,OAAOC;AACT,EAAC"}

package/dist/fields/ColourText/styles.css

@@ -0,0 +1,21 @@
+.bfColourTextFieldWrapper {
+  .container {
+    position: relative;
+
+    .field-type input {
+      padding-left: 4rem;
+    }
+  }
+
+  .colourBox {
+    position: absolute;
+    left: 0.75rem;
+    top: calc(50% - 1.25rem);
+    display: flex;
+    width: 2.5rem;
+    border-radius: 5px;
+    height: 2.5rem;
+    pointer-events: none;
+    border: 1px solid var(--theme-elevation-150);
+  }
+}

package/dist/fields/ColourText/validate.d.ts

@@ -0,0 +1,3 @@
+import type { Validate } from 'payload';
+export declare const validate: (required?: boolean) => Validate;
+//# sourceMappingURL=validate.d.ts.map

package/dist/fields/ColourText/validate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"validate.d.ts","sourceRoot":"","sources":["../../../src/fields/ColourText/validate.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAsBvC,eAAO,MAAM,QAAQ,cACP,OAAO,KAAG,QAerB,CAAA"}