@clyrex-digital/clyrex-controls-dev 0.8.1-dev.20260909105958 → 0.8.1-dev.20260914095913

package/dist/{DataBindingControls-4HUO25DS.mjs → DataBindingControls-SKC472JJ.mjs}

@@ -9,7 +9,7 @@ import { useRouter } from "next/navigation";
 
 // src/components/controls/edit/InputControl.tsx
 import dynamic from "next/dynamic";
-var InputControl = dynamic(() => import("./InputControlClient-NHZU2L64.mjs"), {
+var InputControl = dynamic(() => import("./InputControlClient-BZPWT7KE.mjs"), {
   ssr: false
 });
 var InputControl_default = InputControl;

package/dist/{DataBindingControls-RT6LHELH.mjs → DataBindingControls-TF7XLJ5C.mjs}

@@ -3,7 +3,7 @@
 "use client";
 import {
   InputControl_default
-} from "./chunk-7JWVEYJY.mjs";
+} from "./chunk-YRNDRPUE.mjs";
 import {
   InputControlType_default
 } from "./chunk-DTWPZPSX.mjs";

package/dist/{InputControlClient-5NX4CEZB.mjs → InputControlClient-BC66BGHI.mjs}

@@ -18,11 +18,11 @@ import {
   SelectWithSearchInput_default,
   Select_default,
   TimeInput_default
-} from "./chunk-5VGTT4A5.mjs";
+} from "./chunk-BF4G3ZGG.mjs";
 import {
   Button_default,
   ClientButton_default
-} from "./chunk-23WJE3YB.mjs";
+} from "./chunk-LSKD5U3S.mjs";
 import {
   Hyperlink,
   Icon_default

package/dist/{InputControlClient-NHZU2L64.mjs → InputControlClient-BZPWT7KE.mjs}

@@ -11,7 +11,7 @@ import {
 import {
   Button_default,
   ClientButton_default
-} from "./chunk-RHVNJMS4.mjs";
+} from "./chunk-4WMSS6CE.mjs";
 import "./chunk-56HSDML5.mjs";
 import {
   AssetUtility_default
@@ -670,7 +670,19 @@ var ColorInput = (props) => {
         value: color,
         onChange: handleColorChange,
         required: props?.attributes?.required,
-        className: `w-[78px] h-12 block cursor-pointer`
+        className: `block cursor-pointer`,
+        style: {
+          width: "78px",
+          height: "33px",
+          padding: 0,
+          margin: 0,
+          border: "none",
+          borderRadius: "5px",
+          overflow: "hidden",
+          backgroundColor: "transparent",
+          appearance: "none"
+          // WebkitAppearance: "none",
+        }
       }
     ),
     props?.attributes?.errorMessage && /* @__PURE__ */ jsx11("p", { className: "mt-1 bg-error-weak text-sm", children: props.attributes.errorMessage })

package/dist/{LinkNodeButton-X75YEE2O.mjs → LinkNodeButton-EZFQLUKA.mjs}

@@ -7,7 +7,7 @@ import {
 import {
   Button_default,
   ToastService_default
-} from "./chunk-23WJE3YB.mjs";
+} from "./chunk-LSKD5U3S.mjs";
 import "./chunk-IMNQO57B.mjs";
 
 // src/components/pageRenderingEngine/nodes/LinkNodeButton.tsx
@@ -191,13 +191,16 @@ var LinkNodeButton = (props) => {
     return node.title || "Button";
   };
   const fontSize = node.children?.[0]?.style?.match(/font-size:\s*([^;]+)/)?.[1];
+  const isCustomButton = Boolean(node.customButtonClass);
+  const buttonClass = isCustomButton ? node.customButtonClass ?? "" : ["w-full", node.customButtonClass].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsx("div", { className: "link-button-wrapper", children: /* @__PURE__ */ jsx(
     Button_default,
     {
       ButtonType: linkType,
       onClick,
       disabled: isLoading || !!successMessage,
-      className: "w-full",
+      className: buttonClass,
+      isCustomButton,
       children: successMessage ? /* @__PURE__ */ jsxs(
         "span",
         {

package/dist/{LinkNodeButton-MUX27SFO.mjs → LinkNodeButton-WXAW3ZD6.mjs}

@@ -2,7 +2,7 @@
 import {
   Button_default,
   ToastService_default
-} from "./chunk-RHVNJMS4.mjs";
+} from "./chunk-4WMSS6CE.mjs";
 import {
   ServiceClient_default
 } from "./chunk-WXZMRMRS.mjs";
@@ -189,13 +189,16 @@ var LinkNodeButton = (props) => {
     return node.title || "Button";
   };
   const fontSize = node.children?.[0]?.style?.match(/font-size:\s*([^;]+)/)?.[1];
+  const isCustomButton = Boolean(node.customButtonClass);
+  const buttonClass = isCustomButton ? node.customButtonClass ?? "" : ["w-full", node.customButtonClass].filter(Boolean).join(" ");
   return /* @__PURE__ */ jsx("div", { className: "link-button-wrapper", children: /* @__PURE__ */ jsx(
     Button_default,
     {
       ButtonType: linkType,
       onClick,
       disabled: isLoading || !!successMessage,
-      className: "w-full",
+      className: buttonClass,
+      isCustomButton,
       children: successMessage ? /* @__PURE__ */ jsxs(
         "span",
         {

package/dist/{chunk-RHVNJMS4.mjs → chunk-4WMSS6CE.mjs}

@@ -192,7 +192,7 @@ var Button = (props) => {
       );
     });
   };
-  let buttonClass = props.ButtonType ? buttonClasses.get(props.ButtonType) : buttonClasses.get("Primary" /* Solid */);
+  let buttonClass = props.isCustomButton ? props.ButtonType ? buttonClasses.get(props.ButtonType) ?? "" : "" : props.ButtonType ? buttonClasses.get(props.ButtonType) : buttonClasses.get("Primary" /* Solid */);
   let progressClass = props.ButtonType ? progressClasses.get(props.ButtonType) : progressClasses.get("Primary" /* Solid */);
   const isDisabled = inProgress || isActionPerformed && props.oneTimeAction;
   return /* @__PURE__ */ jsxs2(React3.Fragment, { children: [
@@ -203,7 +203,7 @@ var Button = (props) => {
         onClick: execute,
         disabled: props.disabled,
         title: isDisabled ? "The button is disabled to prevent any action" : "",
-        className: `${buttonClass} relative inline-flex items-center justify-center gap-2 ${props.className ?? ""}`,
+        className: props.isCustomButton ? `${buttonClass ? buttonClass + " " : ""}${props.className ?? ""}`.trim() : `${buttonClass} relative inline-flex items-center justify-center gap-2 ${props.className ?? ""}`.trim(),
         children: [
           isActionPerformed && props.oneTimeAction && responseMessage ? responseMessage : props.children,
           inProgress && /* @__PURE__ */ jsx3(Fragment2, { children: props.hideProgressIndicator ? /* @__PURE__ */ jsx3("div", { className: "absolute bottom-0 left-0 h-0.5 bg-gray-400 rounded animate-progress" }) : /* @__PURE__ */ jsxs2(

package/dist/{chunk-5VGTT4A5.mjs → chunk-BF4G3ZGG.mjs}

@@ -654,7 +654,19 @@ var ColorInput = (props) => {
         value: color,
         onChange: handleColorChange,
         required: props?.attributes?.required,
-        className: `w-[78px] h-12 block cursor-pointer`
+        className: `block cursor-pointer`,
+        style: {
+          width: "78px",
+          height: "33px",
+          padding: 0,
+          margin: 0,
+          border: "none",
+          borderRadius: "5px",
+          overflow: "hidden",
+          backgroundColor: "transparent",
+          appearance: "none"
+          // WebkitAppearance: "none",
+        }
       }
     ),
     props?.attributes?.errorMessage && /* @__PURE__ */ jsx11("p", { className: "mt-1 bg-error-weak text-sm", children: props.attributes.errorMessage })

package/dist/{chunk-23WJE3YB.mjs → chunk-LSKD5U3S.mjs}

@@ -194,7 +194,7 @@ var Button = (props) => {
       );
     });
   };
-  let buttonClass = props.ButtonType ? buttonClasses.get(props.ButtonType) : buttonClasses.get("Primary" /* Solid */);
+  let buttonClass = props.isCustomButton ? props.ButtonType ? buttonClasses.get(props.ButtonType) ?? "" : "" : props.ButtonType ? buttonClasses.get(props.ButtonType) : buttonClasses.get("Primary" /* Solid */);
   let progressClass = props.ButtonType ? progressClasses.get(props.ButtonType) : progressClasses.get("Primary" /* Solid */);
   const isDisabled = inProgress || isActionPerformed && props.oneTimeAction;
   return /* @__PURE__ */ jsxs2(React3.Fragment, { children: [
@@ -205,7 +205,7 @@ var Button = (props) => {
         onClick: execute,
         disabled: props.disabled,
         title: isDisabled ? "The button is disabled to prevent any action" : "",
-        className: `${buttonClass} relative inline-flex items-center justify-center gap-2 ${props.className ?? ""}`,
+        className: props.isCustomButton ? `${buttonClass ? buttonClass + " " : ""}${props.className ?? ""}`.trim() : `${buttonClass} relative inline-flex items-center justify-center gap-2 ${props.className ?? ""}`.trim(),
         children: [
           isActionPerformed && props.oneTimeAction && responseMessage ? responseMessage : props.children,
           inProgress && /* @__PURE__ */ jsx3(Fragment2, { children: props.hideProgressIndicator ? /* @__PURE__ */ jsx3("div", { className: "absolute bottom-0 left-0 h-0.5 bg-gray-400 rounded animate-progress" }) : /* @__PURE__ */ jsxs2(

package/dist/{chunk-7JWVEYJY.mjs → chunk-YRNDRPUE.mjs}

@@ -3,7 +3,7 @@
 
 // src/components/controls/edit/InputControl.tsx
 import dynamic from "next/dynamic";
-var InputControl = dynamic(() => import("./InputControlClient-5NX4CEZB.mjs"), {
+var InputControl = dynamic(() => import("./InputControlClient-BC66BGHI.mjs"), {
   ssr: false
 });
 var InputControl_default = InputControl;

package/dist/index.d.mts

@@ -250,6 +250,7 @@ interface ButtonProps<T> {
     confirm?: boolean;
     confirmationMessage?: string;
     disabled?: boolean;
+    isCustomButton?: boolean;
 }
 declare const Button: React__default.FC<ButtonProps<any>>;
 

package/dist/index.d.ts

@@ -250,6 +250,7 @@ interface ButtonProps<T> {
     confirm?: boolean;
     confirmationMessage?: string;
     disabled?: boolean;
+    isCustomButton?: boolean;
 }
 declare const Button: React__default.FC<ButtonProps<any>>;
 

package/dist/index.js

@@ -2930,7 +2930,19 @@ var init_ColorInput = __esm({
             value: color,
             onChange: handleColorChange,
             required: props?.attributes?.required,
-            className: `w-[78px] h-12 block cursor-pointer`
+            className: `block cursor-pointer`,
+            style: {
+              width: "78px",
+              height: "33px",
+              padding: 0,
+              margin: 0,
+              border: "none",
+              borderRadius: "5px",
+              overflow: "hidden",
+              backgroundColor: "transparent",
+              appearance: "none"
+              // WebkitAppearance: "none",
+            }
           }
         ),
         props?.attributes?.errorMessage && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "mt-1 bg-error-weak text-sm", children: props.attributes.errorMessage })
@@ -3370,7 +3382,7 @@ var init_Button = __esm({
           );
         });
       };
-      let buttonClass = props.ButtonType ? buttonClasses.get(props.ButtonType) : buttonClasses.get("Primary" /* Solid */);
+      let buttonClass = props.isCustomButton ? props.ButtonType ? buttonClasses.get(props.ButtonType) ?? "" : "" : props.ButtonType ? buttonClasses.get(props.ButtonType) : buttonClasses.get("Primary" /* Solid */);
       let progressClass = props.ButtonType ? progressClasses.get(props.ButtonType) : progressClasses.get("Primary" /* Solid */);
       const isDisabled = inProgress || isActionPerformed && props.oneTimeAction;
       return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(import_react37.default.Fragment, { children: [
@@ -3381,7 +3393,7 @@ var init_Button = __esm({
             onClick: execute,
             disabled: props.disabled,
             title: isDisabled ? "The button is disabled to prevent any action" : "",
-            className: `${buttonClass} relative inline-flex items-center justify-center gap-2 ${props.className ?? ""}`,
+            className: props.isCustomButton ? `${buttonClass ? buttonClass + " " : ""}${props.className ?? ""}`.trim() : `${buttonClass} relative inline-flex items-center justify-center gap-2 ${props.className ?? ""}`.trim(),
             children: [
               isActionPerformed && props.oneTimeAction && responseMessage ? responseMessage : props.children,
               inProgress && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_jsx_runtime44.Fragment, { children: props.hideProgressIndicator ? /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "absolute bottom-0 left-0 h-0.5 bg-gray-400 rounded animate-progress" }) : /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
@@ -4948,13 +4960,16 @@ var init_LinkNodeButton = __esm({
         return node.title || "Button";
       };
       const fontSize = node.children?.[0]?.style?.match(/font-size:\s*([^;]+)/)?.[1];
+      const isCustomButton = Boolean(node.customButtonClass);
+      const buttonClass = isCustomButton ? node.customButtonClass ?? "" : ["w-full", node.customButtonClass].filter(Boolean).join(" ");
       return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "link-button-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
         Button_default,
         {
           ButtonType: linkType,
           onClick,
           disabled: isLoading || !!successMessage,
-          className: "w-full",
+          className: buttonClass,
+          isCustomButton,
           children: successMessage ? /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
             "span",
             {
@@ -6939,6 +6954,7 @@ var LinkNode = (props) => {
     {
       href: linkUrl || "#",
       linkType,
+      className: node.customButtonClass,
       alt: linkText || node.title || "",
       children: [
         renderChildren2(),

package/dist/index.mjs

@@ -8,7 +8,7 @@ import {
 } from "./chunk-RG3CISAA.mjs";
 import {
   InputControl_default
-} from "./chunk-7JWVEYJY.mjs";
+} from "./chunk-YRNDRPUE.mjs";
 import "./chunk-JDX47MFV.mjs";
 import {
   CheckboxInput_default,
@@ -27,12 +27,12 @@ import {
   SelectWithSearchInput_default,
   Select_default,
   TimeInput_default
-} from "./chunk-5VGTT4A5.mjs";
+} from "./chunk-BF4G3ZGG.mjs";
 import {
   Button_default,
   ClientButton_default,
   ToastService_default
-} from "./chunk-23WJE3YB.mjs";
+} from "./chunk-LSKD5U3S.mjs";
 import {
   Hyperlink,
   Icon_default
@@ -658,7 +658,7 @@ var ImageNode_default = ImageNode;
 // src/components/pageRenderingEngine/nodes/LinkNode.tsx
 import dynamic8 from "next/dynamic";
 import { Fragment, jsx as jsx19, jsxs as jsxs7 } from "react/jsx-runtime";
-var LinkNodeButton = dynamic8(() => import("./LinkNodeButton-X75YEE2O.mjs"), {
+var LinkNodeButton = dynamic8(() => import("./LinkNodeButton-EZFQLUKA.mjs"), {
   ssr: false
 });
 function getNestedValue2(obj, path) {
@@ -760,6 +760,7 @@ var LinkNode = (props) => {
     {
       href: linkUrl || "#",
       linkType,
+      className: node.customButtonClass,
       alt: linkText || node.title || "",
       children: [
         renderChildren(),
@@ -2348,7 +2349,7 @@ var GoogleMapNode_default = GoogleMapNode;
 // src/components/pageRenderingEngine/nodes/DivContainer.tsx
 import { jsx as jsx36, jsxs as jsxs14 } from "react/jsx-runtime";
 var Pagination = dynamic13(() => import("./Pagination-CQKMBXXJ.mjs"), { ssr: true });
-var DataBindingControls = dynamic13(() => import("./DataBindingControls-RT6LHELH.mjs"), {
+var DataBindingControls = dynamic13(() => import("./DataBindingControls-TF7XLJ5C.mjs"), {
   ssr: true
 });
 var Slider = dynamic13(() => import("./Slider-IVPJBPE5.mjs"), {

package/dist/server.js

@@ -945,7 +945,7 @@ var init_Button = __esm({
           );
         });
       };
-      let buttonClass = props.ButtonType ? buttonClasses.get(props.ButtonType) : buttonClasses.get("Primary" /* Solid */);
+      let buttonClass = props.isCustomButton ? props.ButtonType ? buttonClasses.get(props.ButtonType) ?? "" : "" : props.ButtonType ? buttonClasses.get(props.ButtonType) : buttonClasses.get("Primary" /* Solid */);
       let progressClass = props.ButtonType ? progressClasses.get(props.ButtonType) : progressClasses.get("Primary" /* Solid */);
       const isDisabled = inProgress || isActionPerformed && props.oneTimeAction;
       return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_react4.default.Fragment, { children: [
@@ -956,7 +956,7 @@ var init_Button = __esm({
             onClick: execute,
             disabled: props.disabled,
             title: isDisabled ? "The button is disabled to prevent any action" : "",
-            className: `${buttonClass} relative inline-flex items-center justify-center gap-2 ${props.className ?? ""}`,
+            className: props.isCustomButton ? `${buttonClass ? buttonClass + " " : ""}${props.className ?? ""}`.trim() : `${buttonClass} relative inline-flex items-center justify-center gap-2 ${props.className ?? ""}`.trim(),
             children: [
               isActionPerformed && props.oneTimeAction && responseMessage ? responseMessage : props.children,
               inProgress && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, { children: props.hideProgressIndicator ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "absolute bottom-0 left-0 h-0.5 bg-gray-400 rounded animate-progress" }) : /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
@@ -1422,13 +1422,16 @@ var init_LinkNodeButton = __esm({
         return node.title || "Button";
       };
       const fontSize = node.children?.[0]?.style?.match(/font-size:\s*([^;]+)/)?.[1];
+      const isCustomButton = Boolean(node.customButtonClass);
+      const buttonClass = isCustomButton ? node.customButtonClass ?? "" : ["w-full", node.customButtonClass].filter(Boolean).join(" ");
       return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("div", { className: "link-button-wrapper", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
         Button_default,
         {
           ButtonType: linkType,
           onClick,
           disabled: isLoading || !!successMessage,
-          className: "w-full",
+          className: buttonClass,
+          isCustomButton,
           children: successMessage ? /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
             "span",
             {
@@ -4406,7 +4409,19 @@ var init_ColorInput = __esm({
             value: color,
             onChange: handleColorChange,
             required: props?.attributes?.required,
-            className: `w-[78px] h-12 block cursor-pointer`
+            className: `block cursor-pointer`,
+            style: {
+              width: "78px",
+              height: "33px",
+              padding: 0,
+              margin: 0,
+              border: "none",
+              borderRadius: "5px",
+              overflow: "hidden",
+              backgroundColor: "transparent",
+              appearance: "none"
+              // WebkitAppearance: "none",
+            }
           }
         ),
         props?.attributes?.errorMessage && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("p", { className: "mt-1 bg-error-weak text-sm", children: props.attributes.errorMessage })
@@ -6572,6 +6587,7 @@ var LinkNode = (props) => {
     {
       href: linkUrl || "#",
       linkType,
+      className: node.customButtonClass,
       alt: linkText || node.title || "",
       children: [
         renderChildren2(),

package/dist/server.mjs

@@ -291,7 +291,7 @@ var ImageNode_default = ImageNode;
 // src/components/pageRenderingEngine/nodes/LinkNode.tsx
 import dynamic3 from "next/dynamic";
 import { Fragment, jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
-var LinkNodeButton = dynamic3(() => import("./LinkNodeButton-MUX27SFO.mjs"), {
+var LinkNodeButton = dynamic3(() => import("./LinkNodeButton-WXAW3ZD6.mjs"), {
   ssr: false
 });
 function getNestedValue2(obj, path) {
@@ -393,6 +393,7 @@ var LinkNode = (props) => {
     {
       href: linkUrl || "#",
       linkType,
+      className: node.customButtonClass,
       alt: linkText || node.title || "",
       children: [
         renderChildren(),
@@ -2316,7 +2317,7 @@ var GoogleMapNode_default = GoogleMapNode;
 // src/components/pageRenderingEngine/nodes/DivContainer.tsx
 import { jsx as jsx36, jsxs as jsxs14 } from "react/jsx-runtime";
 var Pagination = dynamic13(() => import("./Pagination-M3VZKKXY.mjs"), { ssr: true });
-var DataBindingControls = dynamic13(() => import("./DataBindingControls-4HUO25DS.mjs"), {
+var DataBindingControls = dynamic13(() => import("./DataBindingControls-SKC472JJ.mjs"), {
   ssr: true
 });
 var Slider = dynamic13(() => import("./Slider-QIGKP6AE.mjs"), {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clyrex-digital/clyrex-controls-dev",
-  "version": "0.8.1-dev.20260909105958",
+  "version": "0.8.1-dev.20260914095913",
   "description": "Reusable React components",
   "main": "dist/index.js",
   "module": "dist/index.mjs",