bonkers-ui 2.0.8 → 2.0.9

package/components/UiToggle/UiToggle.js

@@ -1,26 +1,26 @@
-import { jsxs as a, jsx as r } from "react/jsx-runtime";
+import { jsxs as _, jsx as r } from "react/jsx-runtime";
 import { useState as U, useEffect as v } from "react";
 import i from "classnames";
 import { EJustify as t } from "../../_types/align.js";
-import '../../assets/UiToggle.css';const w = "_UiToggle__dot_1uov6_1", k = "_UiToggle__dot_checked_1uov6_13", x = "_UiToggle__icon_1uov6_17", N = "_UiToggle__icon_checked_1uov6_26", c = {
+import '../../assets/UiToggle.css';const w = "_UiToggle__dot_1uov6_1", k = "_UiToggle__dot_checked_1uov6_13", x = "_UiToggle__icon_1uov6_17", N = "_UiToggle__icon_checked_1uov6_26", n = {
   UiToggle__dot: w,
   UiToggle__dot_checked: k,
   UiToggle__icon: x,
   UiToggle__icon_checked: N
-}, A = ({
-  children: d,
+}, R = ({
+  children: a,
   disabled: o = !1,
-  invertOrder: u = !1,
-  justify: f = t.START,
+  invertOrder: d = !1,
+  justify: u = t.START,
   checked: s,
-  value: l,
-  className: m,
-  defaultChecked: p,
-  onChange: n,
-  ...T
+  value: c,
+  className: h,
+  defaultChecked: f,
+  onChange: m,
+  ...p
 }) => {
-  const [_, g] = U(p ?? !1), e = l ?? s ?? _, h = () => {
-    l === void 0 && s === void 0 && g(!_), n == null || n(!e);
+  const [l, g] = U(f ?? !1), e = c ?? s ?? l, T = () => {
+    c === void 0 && s === void 0 && g(!l), m?.(!e);
   };
   v(() => {
     s !== void 0 && g(s);
@@ -33,7 +33,7 @@ import '../../assets/UiToggle.css';const w = "_UiToggle__dot_1uov6_1", k = "_UiT
     [t.AROUND]: "justify-around",
     [t.EVENLY]: "justify-evenly"
   };
-  return /* @__PURE__ */ a("label", { className: i(
+  return /* @__PURE__ */ _("label", { className: i(
     "ui-toggle",
     "flex",
     "cursor-pointer",
@@ -44,13 +44,13 @@ import '../../assets/UiToggle.css';const w = "_UiToggle__dot_1uov6_1", k = "_UiT
     "leading-normal",
     "text-md",
     {
-      "flex-row-reverse": u,
+      "flex-row-reverse": d,
       "pointer-events-none opacity-50": o
     },
-    y[f],
-    m
+    y[u],
+    h
   ), children: [
-    /* @__PURE__ */ a("span", { className: i(
+    /* @__PURE__ */ _("span", { className: i(
       "relative",
       "block",
       "h-md"
@@ -66,10 +66,10 @@ import '../../assets/UiToggle.css';const w = "_UiToggle__dot_1uov6_1", k = "_UiT
           ),
           type: "checkbox",
           checked: e,
-          onChange: h,
+          onChange: T,
           disabled: o,
-          value: l,
-          ...T
+          value: c,
+          ...p
         }
       ),
       /* @__PURE__ */ r("span", { className: i(
@@ -90,21 +90,21 @@ import '../../assets/UiToggle.css';const w = "_UiToggle__dot_1uov6_1", k = "_UiT
         "block",
         "rounded-full",
         "bg-white",
-        c.UiToggle__dot,
+        n.UiToggle__dot,
         {
           "hover:shadow-border-secondary": !e && !o,
           "hover:shadow-border-primary": e && !o,
-          [c.UiToggle__dot_checked]: e
+          [n.UiToggle__dot_checked]: e
         }
       ), children: /* @__PURE__ */ r(
         "svg",
         {
           className: i(
-            c.UiToggle__icon,
+            n.UiToggle__icon,
             "absolute",
             o ? "text-primary-300" : "text-primary-600",
             {
-              [c.UiToggle__icon_checked]: e
+              [n.UiToggle__icon_checked]: e
             }
           ),
           width: "16",
@@ -124,10 +124,10 @@ import '../../assets/UiToggle.css';const w = "_UiToggle__dot_1uov6_1", k = "_UiT
         }
       ) })
     ] }),
-    d
+    a
   ] });
 };
 export {
-  A as UiToggle
+  R as UiToggle
 };
 //# sourceMappingURL=UiToggle.js.map

package/components/UiToggle/UiToggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"UiToggle.js","sources":["../../../src/components/UiToggle/UiToggle.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./UiToggle.module.css\";\nimport { EJustify } from \"../../_types/align\";\n\ntype TUiToggleProps = {\n\tchildren?: React.ReactNode\n\tdisabled?: boolean\n\tinvertOrder?: boolean\n\tjustify?: EJustify;\n\tdefaultChecked?: boolean\n\tchecked?: boolean\n\tvalue?: boolean\n\tonChange?: (checked: boolean) => void\n} & Omit<React.InputHTMLAttributes<HTMLInputElement>, \"onChange\">;\n\nexport const UiToggle: React.FC<TUiToggleProps> = ({\n\tchildren,\n\tdisabled = false,\n\tinvertOrder = false,\n\tjustify = EJustify.START,\n\tchecked,\n\tvalue,\n\tclassName,\n\tdefaultChecked,\n\tonChange,\n\t...rest\n}) => {\n\n\tconst [toggled, setIsToggled] = useState<boolean>(defaultChecked ??  false);\n\n\tconst isChecked = value ?? checked ?? toggled;\n\n\tconst handleChange = () => {\n\t\tif (value === undefined && checked === undefined) {\n\t\t\tsetIsToggled(!toggled);\n\t\t}\n\n\t\tonChange?.(!isChecked);\n\t};\n\n\tuseEffect(()=>{\n\t\tif ( checked !== undefined) {\n\t\t\tsetIsToggled(checked);\n\t\t}\n\t}, [checked]);\n\n\tconst justificationClasses = {\n\t\t[EJustify.START]: \"justify-start\",\n\t\t[EJustify.END]: \"justify-end\",\n\t\t[EJustify.CENTER]: \"justify-center\",\n\t\t[EJustify.BETWEEN]: \"justify-between\",\n\t\t[EJustify.AROUND]: \"justify-around\",\n\t\t[EJustify.EVENLY]: \"justify-evenly\"\n\t};\n\n\treturn (\n\t\t<label className={ cx(\n\t\t\t\"ui-toggle\",\n\t\t\t\"flex\",\n\t\t\t\"cursor-pointer\",\n\t\t\t\"gap-sm\",\n\t\t\t\"rounded-full\",\n\t\t\t\"items-center\",\n\t\t\t\"w-full\",\n\t\t\t\"leading-normal\",\n\t\t\t\"text-md\",\n\t\t\t{\n\t\t\t\t\"flex-row-reverse\": invertOrder,\n\t\t\t\t\"pointer-events-none opacity-50\": disabled\n\t\t\t},\n\t\t\tjustificationClasses[justify],\n\t\t\tclassName\n\t\t) }>\n\t\t\t<span className={ cx(\n\t\t\t\t\"relative\",\n\t\t\t\t\"block\",\n\t\t\t\t\"h-md\"\n\t\t\t) }>\n\n\t\t\t\t<input className={ cx(\n\t\t\t\t\t\"absolute\",\n\t\t\t\t\t\"size-0\",\n\t\t\t\t\t\"appearance-none\",\n\t\t\t\t\t\"border-0\"\n\t\t\t\t) }\n\t\t\t\ttype=\"checkbox\"\n\t\t\t\tchecked={ isChecked }\n\t\t\t\tonChange={ handleChange }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tvalue={ value }\n\t\t\t\t{ ...rest }\n\t\t\t\t>\n\t\t\t\t</input>\n\n\t\t\t\t<span className={ cx(\n\t\t\t\t\t\"block\",\n\t\t\t\t\t\"h-md\",\n\t\t\t\t\t\"w-xl\",\n\t\t\t\t\t\"rounded-full\",\n\t\t\t\t\t{\n\t\t\t\t\t\t\"bg-primary-600\": isChecked && !disabled,\n\t\t\t\t\t\t\"bg-secondary-alt-300\": !isChecked && disabled,\n\t\t\t\t\t\t\"bg-secondary-alt-600\": !isChecked && !disabled,\n\t\t\t\t\t\t\"bg-primary-300\": isChecked && disabled\n\n\t\t\t\t\t}\n\t\t\t\t) }/>\n\n\t\t\t\t<span className={ cx(\n\t\t\t\t\t\"absolute\",\n\t\t\t\t\t\"top-[50%]\",\n\t\t\t\t\t\"block\",\n\t\t\t\t\t\"rounded-full\",\n\t\t\t\t\t\"bg-white\",\n\t\t\t\t\tstyles.UiToggle__dot,\n\t\t\t\t\t{\n\t\t\t\t\t\t\"hover:shadow-border-secondary\": !isChecked && !disabled,\n\t\t\t\t\t\t\"hover:shadow-border-primary\": isChecked && !disabled,\n\t\t\t\t\t\t[styles.UiToggle__dot_checked]: isChecked\n\t\t\t\t\t},\n\n\t\t\t\t) }>\n\n\t\t\t\t\t<svg\n\t\t\t\t\t\tclassName={ cx(\n\t\t\t\t\t\t\tstyles.UiToggle__icon,\n\t\t\t\t\t\t\t\"absolute\",\n\t\t\t\t\t\t\tdisabled\n\t\t\t\t\t\t\t\t? \"text-primary-300\"\n\t\t\t\t\t\t\t\t: \"text-primary-600\",\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t[styles.UiToggle__icon_checked]: isChecked ,\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t) }\n\t\t\t\t\t\twidth=\"16\"\n\t\t\t\t\t\theight=\"16\"\n\t\t\t\t\t\tviewBox=\"0 0 16 16\"\n\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\td=\"M1 4.40106L6.60071 10.1135L15.1694 1.71245\"\n\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\tstroke-width=\"1.6\"\n\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</svg>\n\n\t\t\t\t</span>\n\t\t\t</span>\n\n\t\t\t{ children }\n\n\t\t</label>\n\n\t);\n};\n"],"names":["UiToggle","children","disabled","invertOrder","justify","EJustify","checked","value","className","defaultChecked","onChange","rest","toggled","setIsToggled","useState","isChecked","handleChange","useEffect","justificationClasses","jsxs","cx","jsx","styles"],"mappings":"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"}
+{"version":3,"file":"UiToggle.js","sources":["../../../src/components/UiToggle/UiToggle.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport cx from \"classnames\";\nimport styles from \"./UiToggle.module.css\";\nimport { EJustify } from \"../../_types/align\";\n\ntype TUiToggleProps = {\n\tchildren?: React.ReactNode\n\tdisabled?: boolean\n\tinvertOrder?: boolean\n\tjustify?: EJustify;\n\tdefaultChecked?: boolean\n\tchecked?: boolean\n\tvalue?: boolean\n\tonChange?: (checked: boolean) => void\n} & Omit<React.InputHTMLAttributes<HTMLInputElement>, \"onChange\">;\n\nexport const UiToggle: React.FC<TUiToggleProps> = ({\n\tchildren,\n\tdisabled = false,\n\tinvertOrder = false,\n\tjustify = EJustify.START,\n\tchecked,\n\tvalue,\n\tclassName,\n\tdefaultChecked,\n\tonChange,\n\t...rest\n}) => {\n\n\tconst [toggled, setIsToggled] = useState<boolean>(defaultChecked ??  false);\n\n\tconst isChecked = value ?? checked ?? toggled;\n\n\tconst handleChange = () => {\n\t\tif (value === undefined && checked === undefined) {\n\t\t\tsetIsToggled(!toggled);\n\t\t}\n\n\t\tonChange?.(!isChecked);\n\t};\n\n\tuseEffect(()=>{\n\t\tif ( checked !== undefined) {\n\t\t\tsetIsToggled(checked);\n\t\t}\n\t}, [checked]);\n\n\tconst justificationClasses = {\n\t\t[EJustify.START]: \"justify-start\",\n\t\t[EJustify.END]: \"justify-end\",\n\t\t[EJustify.CENTER]: \"justify-center\",\n\t\t[EJustify.BETWEEN]: \"justify-between\",\n\t\t[EJustify.AROUND]: \"justify-around\",\n\t\t[EJustify.EVENLY]: \"justify-evenly\"\n\t};\n\n\treturn (\n\t\t<label className={ cx(\n\t\t\t\"ui-toggle\",\n\t\t\t\"flex\",\n\t\t\t\"cursor-pointer\",\n\t\t\t\"gap-sm\",\n\t\t\t\"rounded-full\",\n\t\t\t\"items-center\",\n\t\t\t\"w-full\",\n\t\t\t\"leading-normal\",\n\t\t\t\"text-md\",\n\t\t\t{\n\t\t\t\t\"flex-row-reverse\": invertOrder,\n\t\t\t\t\"pointer-events-none opacity-50\": disabled\n\t\t\t},\n\t\t\tjustificationClasses[justify],\n\t\t\tclassName\n\t\t) }>\n\t\t\t<span className={ cx(\n\t\t\t\t\"relative\",\n\t\t\t\t\"block\",\n\t\t\t\t\"h-md\"\n\t\t\t) }>\n\n\t\t\t\t<input className={ cx(\n\t\t\t\t\t\"absolute\",\n\t\t\t\t\t\"size-0\",\n\t\t\t\t\t\"appearance-none\",\n\t\t\t\t\t\"border-0\"\n\t\t\t\t) }\n\t\t\t\ttype=\"checkbox\"\n\t\t\t\tchecked={ isChecked }\n\t\t\t\tonChange={ handleChange }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tvalue={ value }\n\t\t\t\t{ ...rest }\n\t\t\t\t>\n\t\t\t\t</input>\n\n\t\t\t\t<span className={ cx(\n\t\t\t\t\t\"block\",\n\t\t\t\t\t\"h-md\",\n\t\t\t\t\t\"w-xl\",\n\t\t\t\t\t\"rounded-full\",\n\t\t\t\t\t{\n\t\t\t\t\t\t\"bg-primary-600\": isChecked && !disabled,\n\t\t\t\t\t\t\"bg-secondary-alt-300\": !isChecked && disabled,\n\t\t\t\t\t\t\"bg-secondary-alt-600\": !isChecked && !disabled,\n\t\t\t\t\t\t\"bg-primary-300\": isChecked && disabled\n\n\t\t\t\t\t}\n\t\t\t\t) }/>\n\n\t\t\t\t<span className={ cx(\n\t\t\t\t\t\"absolute\",\n\t\t\t\t\t\"top-[50%]\",\n\t\t\t\t\t\"block\",\n\t\t\t\t\t\"rounded-full\",\n\t\t\t\t\t\"bg-white\",\n\t\t\t\t\tstyles.UiToggle__dot,\n\t\t\t\t\t{\n\t\t\t\t\t\t\"hover:shadow-border-secondary\": !isChecked && !disabled,\n\t\t\t\t\t\t\"hover:shadow-border-primary\": isChecked && !disabled,\n\t\t\t\t\t\t[styles.UiToggle__dot_checked]: isChecked\n\t\t\t\t\t},\n\n\t\t\t\t) }>\n\n\t\t\t\t\t<svg\n\t\t\t\t\t\tclassName={ cx(\n\t\t\t\t\t\t\tstyles.UiToggle__icon,\n\t\t\t\t\t\t\t\"absolute\",\n\t\t\t\t\t\t\tdisabled\n\t\t\t\t\t\t\t\t? \"text-primary-300\"\n\t\t\t\t\t\t\t\t: \"text-primary-600\",\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t[styles.UiToggle__icon_checked]: isChecked ,\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t) }\n\t\t\t\t\t\twidth=\"16\"\n\t\t\t\t\t\theight=\"16\"\n\t\t\t\t\t\tviewBox=\"0 0 16 16\"\n\t\t\t\t\t\tfill=\"none\"\n\t\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<path\n\t\t\t\t\t\t\td=\"M1 4.40106L6.60071 10.1135L15.1694 1.71245\"\n\t\t\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\t\t\tstroke-width=\"1.6\"\n\t\t\t\t\t\t\tstroke-linecap=\"round\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</svg>\n\n\t\t\t\t</span>\n\t\t\t</span>\n\n\t\t\t{ children }\n\n\t\t</label>\n\n\t);\n};\n"],"names":["UiToggle","children","disabled","invertOrder","justify","EJustify","checked","value","className","defaultChecked","onChange","rest","toggled","setIsToggled","useState","isChecked","handleChange","useEffect","justificationClasses","jsxs","cx","jsx","styles"],"mappings":"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"}

package/eslint.config.mjs

@@ -2,6 +2,7 @@ import react from "eslint-plugin-react";
 import tseslint from "typescript-eslint";
 import stylisticPlugin from "@stylistic/eslint-plugin";
 import storybook from "eslint-plugin-storybook";
+import eslintPluginBetterTailwindcss from "eslint-plugin-better-tailwindcss";
 
 // Not compatible with tailwind v4: https://github.com/francoismassart/eslint-plugin-tailwindcss/issues/325
 // import pluginTailwind from "eslint-plugin-tailwindcss";
@@ -13,6 +14,7 @@ export default [
 		plugins: {
 			react,
 			"@stylistic": stylisticPlugin,
+			"better-tailwindcss": eslintPluginBetterTailwindcss
 		},
 		languageOptions: {
 			parserOptions: {
@@ -21,6 +23,11 @@ export default [
 				},
 			},
 		},
+		settings: {
+			"better-tailwindcss": {
+				entryPoint: "src/main.css",
+			}
+		},
 		rules: {
 			quotes: [
 				"error",
@@ -88,7 +95,32 @@ export default [
 					"varsIgnorePattern": "^_",
 					"caughtErrorsIgnorePattern": "^_"
 				}
-			]
+			],
+			...(eslintPluginBetterTailwindcss.configs["recommended-warn"]).rules,
+			...(eslintPluginBetterTailwindcss.configs["recommended-error"]).rules,
+			"better-tailwindcss/enforce-consistent-line-wrapping": [
+				"error",
+				{
+					indent: "tab",
+					printWidth: 140,
+					classesPerLine: 1,
+					preferSingleLine: true,
+				},
+			],
+			"better-tailwindcss/no-restricted-classes": [
+				"error",
+				{
+					restrict: [
+						{
+							pattern: "^.*!$",
+							message: "No important classes allowed."
+
+						}]
+				}
+			],
+			"better-tailwindcss/no-unregistered-classes": [
+				"warn",
+			],
 		},
 	},
 	...tseslint.configs.recommended,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "bonkers-ui",
-    "version": "v2.0.8",
+    "version": "v2.0.9",
     "type": "module",
     "description": "Bonkers ui library",
     "author": "cc6.magister@gmail.com",
@@ -18,37 +18,38 @@
         "prepare": "husky"
     },
     "dependencies": {
-        "@tailwindcss/vite": "^4.1.10",
+        "@tailwindcss/vite": "^4.1.11",
         "ajv": "^8.17.1",
         "classnames": "^2.5.1",
         "postcss": "^8.5.6",
-        "prettier": "^3.5.3",
-        "react": "^19.1.0",
-        "react-dom": "^19.1.0",
-        "tailwindcss": "^4.1.10",
+        "prettier": "^3.6.2",
+        "react": "^19.1.1",
+        "react-dom": "^19.1.1",
+        "tailwindcss": "^4.1.11",
         "vite-tsconfig-paths": "^5.1.4"
     },
     "devDependencies": {
-        "@chromatic-com/storybook": "^4.0.0",
-        "@storybook/addon-docs": "^9.0.12",
-        "@storybook/addon-onboarding": "^9.0.12",
-        "@storybook/react-vite": "^9.0.12",
-        "@stylistic/eslint-plugin": "^4.4.1",
+        "@chromatic-com/storybook": "^4.0.1",
+        "@storybook/addon-docs": "^9.0.18",
+        "@storybook/addon-onboarding": "^9.0.18",
+        "@storybook/react-vite": "^9.0.18",
+        "@stylistic/eslint-plugin": "^5.2.2",
         "@types/bun": "latest",
-        "@types/react": "^19.1.8",
-        "@types/react-dom": "^19.1.6",
-        "@vitejs/plugin-react": "^4.5.2",
-        "eslint": "^9.29.0",
+        "@types/react": "^19.1.9",
+        "@types/react-dom": "^19.1.7",
+        "@vitejs/plugin-react": "^4.7.0",
+        "eslint": "^9.32.0",
+        "eslint-plugin-better-tailwindcss": "^3.7.3",
         "eslint-plugin-react": "^7.37.5",
-        "eslint-plugin-storybook": "^9.0.12",
-        "eslint-plugin-tailwindcss": "^3.18.0",
+        "eslint-plugin-storybook": "^9.0.18",
+        "eslint-plugin-tailwindcss": "^3.18.2",
         "gh-pages": "^6.3.0",
         "husky": "^9.1.7",
         "lint-staged": "^16.1.2",
-        "storybook": "^9.0.12",
+        "storybook": "^9.0.18",
         "typescript": "^5.8.3",
-        "typescript-eslint": "^8.34.1",
-        "vite": "^6.3.5",
+        "typescript-eslint": "^8.38.0",
+        "vite": "^7.0.6",
         "vite-plugin-dts": "^4.5.4",
         "vite-plugin-lib-inject-css": "^2.2.2"
     },