performa 1.0.1 → 1.0.2

package/dist/index.js

@@ -105,48 +105,48 @@ var defaultTheme = {
     required: "text-red-500 ml-1"
   },
   input: {
-    base: "block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring focus:ring-primary focus:border-primary",
+    base: "block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring focus:ring-blue-500 focus:border-blue-500",
     error: "border-red-500 dark:border-red-400",
     disabled: "disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed",
-    focus: "focus:outline-none focus:ring focus:ring-primary focus:border-primary"
+    focus: "focus:outline-none focus:ring focus:ring-blue-500 focus:border-blue-500"
   },
   select: {
-    base: "mt-1 block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 focus:outline-none focus:ring focus:ring-primary focus:border-primary disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed",
+    base: "mt-1 block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 focus:outline-none focus:ring focus:ring-blue-500 focus:border-blue-500 disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed",
     error: "border-red-500 dark:border-red-400",
     disabled: "disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed",
     option: "bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100"
   },
   textarea: {
-    base: "mt-1 block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring focus:ring-primary focus:border-primary disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed",
+    base: "mt-1 block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring focus:ring-blue-500 focus:border-blue-500 disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed",
     error: "border-red-500 dark:border-red-400",
     disabled: "disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed"
   },
   checkbox: {
-    base: "h-4 w-4 text-primary focus:ring-primary border-gray-300 dark:border-gray-600 dark:bg-gray-800 rounded disabled:cursor-not-allowed",
+    base: "h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 dark:border-gray-600 dark:bg-gray-800 rounded disabled:cursor-not-allowed",
     error: "border-red-500 dark:border-red-400",
     label: "ml-2 block text-sm font-medium text-gray-700 dark:text-gray-300"
   },
   toggle: {
-    track: "absolute inset-0 rounded-full transition-colors duration-200 bg-gray-300 dark:bg-gray-600 peer-focus:ring-2 peer-focus:ring-primary peer-focus:ring-offset-2 dark:peer-focus:ring-offset-gray-800",
-    trackActive: "peer-checked:bg-primary peer-checked:dark:bg-primary-light",
+    track: "absolute inset-0 rounded-full transition-colors duration-200 bg-gray-300 dark:bg-gray-600 peer-focus:ring-2 peer-focus:ring-blue-500 peer-focus:ring-offset-2 dark:peer-focus:ring-offset-gray-800",
+    trackActive: "peer-checked:bg-blue-600 peer-checked:dark:bg-blue-500",
     thumb: "absolute left-1 top-1 w-4 h-4 bg-white dark:bg-gray-200 rounded-full transition-transform duration-200 peer-checked:translate-x-5",
     label: "block text-sm font-medium text-gray-700 dark:text-gray-300"
   },
   radio: {
-    base: "h-4 w-4 text-primary focus:ring-primary border-gray-300 dark:border-gray-600 dark:bg-gray-800 disabled:cursor-not-allowed",
+    base: "h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 dark:border-gray-600 dark:bg-gray-800 disabled:cursor-not-allowed",
     label: "ml-2 text-sm text-gray-700 dark:text-gray-300",
     group: "mt-1"
   },
   file: {
-    dropzone: "flex flex-col items-center justify-center w-full p-6 border-2 border-dashed rounded-md cursor-pointer border-gray-300 dark:border-gray-600 hover:border-primary dark:hover:border-primary transition-colors duration-200",
-    dropzoneActive: "border-primary bg-primary-50 dark:bg-primary-900/20",
+    dropzone: "flex flex-col items-center justify-center w-full p-6 border-2 border-dashed rounded-md cursor-pointer border-gray-300 dark:border-gray-600 hover:border-blue-500 dark:hover:border-blue-500 transition-colors duration-200",
+    dropzoneActive: "border-blue-500 bg-blue-50 dark:bg-blue-900/20",
     dropzoneError: "border-red-500 dark:border-red-400 hover:border-red-500 dark:hover:border-red-400",
     icon: "w-8 h-8 text-gray-400 dark:text-gray-500",
     text: "mt-2 text-sm text-gray-500 dark:text-gray-400",
     hint: "mt-1 text-xs text-gray-500 dark:text-gray-400"
   },
   submit: {
-    base: "mt-1 flex items-center justify-center w-full px-4 py-2 border border-transparent rounded-md shadow-sm text-white bg-primary hover:bg-primary-dark dark:bg-primary-light dark:hover:bg-primary focus:outline-none focus:ring-2 focus:ring-offset-2 dark:focus:ring-offset-gray-800 focus:ring-primary transition-colors cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed",
+    base: "mt-1 flex items-center justify-center w-full px-4 py-2 border border-transparent rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-500 focus:outline-none focus:ring-2 focus:ring-offset-2 dark:focus:ring-offset-gray-800 focus:ring-blue-500 transition-colors cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed",
     loading: "opacity-75",
     spinner: "mr-3 -ml-1 size-5 animate-spin text-white"
   },
@@ -159,18 +159,18 @@ var defaultTheme = {
     info: "bg-blue-50 dark:bg-blue-900/20 text-blue-800 dark:text-blue-200 border-blue-200 dark:border-blue-800"
   },
   datetime: {
-    input: "block w-full px-3 py-2 pr-10 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring focus:ring-primary focus:border-primary disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed cursor-pointer",
+    input: "block w-full px-3 py-2 pr-10 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm bg-white dark:bg-gray-800 text-gray-900 dark:text-gray-100 placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring focus:ring-blue-500 focus:border-blue-500 disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed cursor-pointer",
     dropdown: "absolute z-50 mt-2 p-4 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-lg shadow-lg w-80",
     picker: "absolute z-50 mt-2 p-4 bg-white dark:bg-gray-800 border border-gray-300 dark:border-gray-600 rounded-lg shadow-lg w-80",
     calendar: "grid grid-cols-7 gap-1 mb-4",
-    day: "p-2 text-sm rounded hover:bg-primary hover:text-white transition-colors text-gray-700 dark:text-gray-300",
-    daySelected: "bg-primary text-white",
-    dayButton: "p-2 text-sm rounded hover:bg-primary hover:text-white transition-colors text-gray-700 dark:text-gray-300",
-    dayButtonSelected: "bg-primary text-white",
+    day: "p-2 text-sm rounded hover:bg-blue-600 hover:text-white transition-colors text-gray-700 dark:text-gray-300",
+    daySelected: "bg-blue-600 text-white",
+    dayButton: "p-2 text-sm rounded hover:bg-blue-600 hover:text-white transition-colors text-gray-700 dark:text-gray-300",
+    dayButtonSelected: "bg-blue-600 text-white",
     timeInput: "w-14 px-2 py-1 text-center border border-gray-300 dark:border-gray-600 rounded bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100",
     timeLabel: "text-xs font-medium text-gray-700 dark:text-gray-300",
     periodButton: "px-3 py-1 text-xs rounded bg-gray-100 dark:bg-gray-700 text-gray-700 dark:text-gray-300",
-    periodButtonActive: "bg-primary text-white",
+    periodButtonActive: "bg-blue-600 text-white",
     iconButton: "absolute right-2 top-1/2 -translate-y-1/2 text-gray-500 dark:text-gray-400",
     navButton: "p-1 hover:bg-gray-100 dark:hover:bg-gray-700 rounded text-gray-700 dark:text-white",
     monthYear: "text-sm font-medium text-gray-900 dark:text-gray-100",
@@ -178,7 +178,7 @@ var defaultTheme = {
     formatButton: "px-2 py-1 text-xs bg-gray-100 dark:bg-gray-700 text-gray-700 dark:text-gray-300 rounded hover:bg-gray-200 dark:hover:bg-gray-600"
   },
   button: {
-    primary: "flex-1 px-3 py-2 text-sm bg-primary text-white rounded hover:bg-primary-dark focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2",
+    primary: "flex-1 px-3 py-2 text-sm bg-blue-600 text-white rounded hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2",
     secondary: "flex-1 px-3 py-2 text-sm border border-gray-300 dark:border-gray-600 rounded hover:bg-gray-50 dark:hover:bg-gray-700 text-gray-700 dark:text-gray-300"
   },
   readonly: "mt-1 block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm bg-gray-100 dark:bg-gray-700 text-gray-900 dark:text-gray-100",
@@ -198,48 +198,48 @@ var lightOnlyTheme = {
     required: "text-red-500 ml-1"
   },
   input: {
-    base: "block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm bg-white text-gray-900 placeholder-gray-400 focus:outline-none focus:ring focus:ring-primary focus:border-primary",
+    base: "block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm bg-white text-gray-900 placeholder-gray-400 focus:outline-none focus:ring focus:ring-blue-500 focus:border-blue-500",
     error: "border-red-500",
     disabled: "disabled:bg-gray-100 disabled:cursor-not-allowed",
-    focus: "focus:outline-none focus:ring focus:ring-primary focus:border-primary"
+    focus: "focus:outline-none focus:ring focus:ring-blue-500 focus:border-blue-500"
   },
   select: {
-    base: "mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm bg-white text-gray-900 focus:outline-none focus:ring focus:ring-primary focus:border-primary disabled:bg-gray-100 disabled:cursor-not-allowed",
+    base: "mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm bg-white text-gray-900 focus:outline-none focus:ring focus:ring-blue-500 focus:border-blue-500 disabled:bg-gray-100 disabled:cursor-not-allowed",
     error: "border-red-500",
     disabled: "disabled:bg-gray-100 disabled:cursor-not-allowed",
     option: "bg-white text-gray-900"
   },
   textarea: {
-    base: "mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm bg-white text-gray-900 placeholder-gray-400 focus:outline-none focus:ring focus:ring-primary focus:border-primary disabled:bg-gray-100 disabled:cursor-not-allowed",
+    base: "mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm bg-white text-gray-900 placeholder-gray-400 focus:outline-none focus:ring focus:ring-blue-500 focus:border-blue-500 disabled:bg-gray-100 disabled:cursor-not-allowed",
     error: "border-red-500",
     disabled: "disabled:bg-gray-100 disabled:cursor-not-allowed"
   },
   checkbox: {
-    base: "h-4 w-4 text-primary focus:ring-primary border-gray-300 rounded disabled:cursor-not-allowed",
+    base: "h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded disabled:cursor-not-allowed",
     error: "border-red-500",
     label: "ml-2 block text-sm font-medium text-gray-700"
   },
   toggle: {
-    track: "absolute inset-0 rounded-full transition-colors duration-200 bg-gray-300 peer-focus:ring-2 peer-focus:ring-primary peer-focus:ring-offset-2",
-    trackActive: "peer-checked:bg-primary",
+    track: "absolute inset-0 rounded-full transition-colors duration-200 bg-gray-300 peer-focus:ring-2 peer-focus:ring-blue-500 peer-focus:ring-offset-2",
+    trackActive: "peer-checked:bg-blue-600",
     thumb: "absolute left-1 top-1 w-4 h-4 bg-white rounded-full transition-transform duration-200 peer-checked:translate-x-5",
     label: "block text-sm font-medium text-gray-700"
   },
   radio: {
-    base: "h-4 w-4 text-primary focus:ring-primary border-gray-300 disabled:cursor-not-allowed",
+    base: "h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 disabled:cursor-not-allowed",
     label: "ml-2 text-sm text-gray-700",
     group: "mt-1"
   },
   file: {
-    dropzone: "flex flex-col items-center justify-center w-full p-6 border-2 border-dashed rounded-md cursor-pointer border-gray-300 hover:border-primary transition-colors duration-200",
-    dropzoneActive: "border-primary bg-primary-50",
+    dropzone: "flex flex-col items-center justify-center w-full p-6 border-2 border-dashed rounded-md cursor-pointer border-gray-300 hover:border-blue-500 transition-colors duration-200",
+    dropzoneActive: "border-blue-500 bg-blue-50",
     dropzoneError: "border-red-500 hover:border-red-500",
     icon: "w-8 h-8 text-gray-400",
     text: "mt-2 text-sm text-gray-500",
     hint: "mt-1 text-xs text-gray-500"
   },
   submit: {
-    base: "mt-1 flex items-center justify-center w-full px-4 py-2 border border-transparent rounded-md shadow-sm text-white bg-primary hover:bg-primary-dark focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary transition-colors cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed",
+    base: "mt-1 flex items-center justify-center w-full px-4 py-2 border border-transparent rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 transition-colors cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed",
     loading: "opacity-75",
     spinner: "mr-3 -ml-1 size-5 animate-spin text-white"
   },
@@ -252,18 +252,18 @@ var lightOnlyTheme = {
     info: "bg-blue-50 text-blue-800 border-blue-200"
   },
   datetime: {
-    input: "block w-full px-3 py-2 pr-10 border border-gray-300 rounded-md shadow-sm bg-white text-gray-900 placeholder-gray-400 focus:outline-none focus:ring focus:ring-primary focus:border-primary disabled:bg-gray-100 disabled:cursor-not-allowed cursor-pointer",
+    input: "block w-full px-3 py-2 pr-10 border border-gray-300 rounded-md shadow-sm bg-white text-gray-900 placeholder-gray-400 focus:outline-none focus:ring focus:ring-blue-500 focus:border-blue-500 disabled:bg-gray-100 disabled:cursor-not-allowed cursor-pointer",
     dropdown: "absolute z-50 mt-2 p-4 bg-white border border-gray-300 rounded-lg shadow-lg w-80",
     picker: "absolute z-50 mt-2 p-4 bg-white border border-gray-300 rounded-lg shadow-lg w-80",
     calendar: "grid grid-cols-7 gap-1 mb-4",
-    day: "p-2 text-sm rounded hover:bg-primary hover:text-white transition-colors text-gray-700",
-    daySelected: "bg-primary text-white",
-    dayButton: "p-2 text-sm rounded hover:bg-primary hover:text-white transition-colors text-gray-700",
-    dayButtonSelected: "bg-primary text-white",
+    day: "p-2 text-sm rounded hover:bg-blue-600 hover:text-white transition-colors text-gray-700",
+    daySelected: "bg-blue-600 text-white",
+    dayButton: "p-2 text-sm rounded hover:bg-blue-600 hover:text-white transition-colors text-gray-700",
+    dayButtonSelected: "bg-blue-600 text-white",
     timeInput: "w-14 px-2 py-1 text-center border border-gray-300 rounded bg-white text-gray-900",
     timeLabel: "text-xs font-medium text-gray-700",
     periodButton: "px-3 py-1 text-xs rounded bg-gray-100 text-gray-700",
-    periodButtonActive: "bg-primary text-white",
+    periodButtonActive: "bg-blue-600 text-white",
     iconButton: "absolute right-2 top-1/2 -translate-y-1/2 text-gray-500",
     navButton: "p-1 hover:bg-gray-100 rounded text-gray-700",
     monthYear: "text-sm font-medium text-gray-900",
@@ -271,7 +271,7 @@ var lightOnlyTheme = {
     formatButton: "px-2 py-1 text-xs bg-gray-100 text-gray-700 rounded hover:bg-gray-200"
   },
   button: {
-    primary: "flex-1 px-3 py-2 text-sm bg-primary text-white rounded hover:bg-primary-dark focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2",
+    primary: "flex-1 px-3 py-2 text-sm bg-blue-600 text-white rounded hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2",
     secondary: "flex-1 px-3 py-2 text-sm border border-gray-300 rounded hover:bg-gray-50 text-gray-700"
   },
   readonly: "mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm bg-gray-100 text-gray-900",
@@ -1171,7 +1171,7 @@ function FileInput({
                 )
               }
             ),
-            /* @__PURE__ */ jsx("p", { className: theme.file?.text, children: fileName ? /* @__PURE__ */ jsx("span", { className: "font-medium text-primary", children: fileName }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx("p", { className: theme.file?.text, children: fileName ? /* @__PURE__ */ jsx("span", { className: "font-medium text-blue-600 dark:text-blue-400", children: fileName }) : /* @__PURE__ */ jsxs(Fragment, { children: [
               /* @__PURE__ */ jsx("span", { className: "font-medium", children: labels.fileUpload?.clickToUpload }),
               " ",
               labels.fileUpload?.dragAndDrop
@@ -1208,7 +1208,7 @@ function FileInput({
             href: fileUrl,
             target: "_blank",
             rel: "noopener noreferrer",
-            className: "mt-2 inline-flex items-center text-xs text-primary hover:underline dark:text-gray-50",
+            className: "mt-2 inline-flex items-center text-xs text-blue-600 hover:underline dark:text-blue-400",
             children: [
               "View Current ",
               label,