@berenjena/react-dev-panel 2.4.2 → 2.5.0

package/dist/utils/deepEqual/deepEqual.js

@@ -0,0 +1,22 @@
+"use client";
+function u(e, t) {
+  if (Object.is(e, t)) return !0;
+  if (typeof e != "object" || e === null || typeof t != "object" || t === null)
+    return !1;
+  const s = Array.isArray(e), f = Array.isArray(t);
+  if (s !== f) return !1;
+  if (s && f) {
+    if (e.length !== t.length) return !1;
+    for (let r = 0; r < e.length; r++)
+      if (!u(e[r], t[r])) return !1;
+    return !0;
+  }
+  const l = e, n = t, o = Object.keys(l), c = Object.keys(n);
+  if (o.length !== c.length) return !1;
+  for (const r of o)
+    if (!Object.prototype.hasOwnProperty.call(n, r) || !u(l[r], n[r])) return !1;
+  return !0;
+}
+export {
+  u as deepEqual
+};

package/dist/utils/formatHotkey/formatHotkey.js

@@ -1,3 +1,4 @@
+"use client";
 import { isMacOS as p } from "../isMacOS/isMacOS.js";
 function a(e) {
   const t = [], s = p();

package/dist/utils/formatHotkey/index.js

@@ -1,3 +1,4 @@
+"use client";
 import { formatHotkey as t } from "./formatHotkey.js";
 export {
   t as formatHotkey

package/dist/utils/getConstrainedPosition/getConstrainedPosition.js

@@ -1,10 +1,11 @@
-function m(t, i) {
-  const n = i.getBoundingClientRect(), e = window.innerWidth, o = window.innerHeight, h = 0, c = 0, a = e - n.width, r = o - n.height;
+"use client";
+function s(t, i) {
+  const n = i.getBoundingClientRect(), e = window.innerWidth, o = window.innerHeight, c = 0, h = 0, a = e - n.width, r = o - n.height;
   return {
-    x: Math.max(h, Math.min(a, t.x)),
-    y: Math.max(c, Math.min(r, t.y))
+    x: Math.max(c, Math.min(a, t.x)),
+    y: Math.max(h, Math.min(r, t.y))
   };
 }
 export {
-  m as getConstrainedPosition
+  s as getConstrainedPosition
 };

package/dist/utils/getConstrainedPosition/index.js

@@ -1,4 +1,5 @@
-import { getConstrainedPosition as e } from "./getConstrainedPosition.js";
+"use client";
+import { getConstrainedPosition as t } from "./getConstrainedPosition.js";
 export {
-  e as getConstrainedPosition
+  t as getConstrainedPosition
 };

package/dist/utils/getCurrentElementPosition/getCurrentElementPosition.js

@@ -1,3 +1,4 @@
+"use client";
 function n(e) {
   const t = e.getBoundingClientRect();
   return {

package/dist/utils/getCurrentElementPosition/index.js

@@ -1,4 +1,5 @@
-import { getCurrentElementPosition as o } from "./getCurrentElementPosition.js";
+"use client";
+import { getCurrentElementPosition as n } from "./getCurrentElementPosition.js";
 export {
-  o as getCurrentElementPosition
+  n as getCurrentElementPosition
 };

package/dist/utils/getPositionAdjustment/getPositionAdjustment.js

@@ -1,13 +1,14 @@
-import { getConstrainedPosition as r } from "../getConstrainedPosition/getConstrainedPosition.js";
+"use client";
+import { getConstrainedPosition as e } from "../getConstrainedPosition/getConstrainedPosition.js";
 import { getCurrentElementPosition as s } from "../getCurrentElementPosition/getCurrentElementPosition.js";
-function m(n) {
-  const t = s(n), o = r(t, n), i = o.x !== t.x || o.y !== t.y;
+function u(o) {
+  const t = s(o), n = e(t, o), i = n.x !== t.x || n.y !== t.y;
   return {
     currentPosition: t,
-    constrainedPosition: o,
+    constrainedPosition: n,
     needsAdjustment: i
   };
 }
 export {
-  m as getPositionAdjustment
+  u as getPositionAdjustment
 };

package/dist/utils/getPositionAdjustment/index.js

@@ -1,4 +1,5 @@
-import { getPositionAdjustment as e } from "./getPositionAdjustment.js";
+"use client";
+import { getPositionAdjustment as o } from "./getPositionAdjustment.js";
 export {
-  e as getPositionAdjustment
+  o as getPositionAdjustment
 };

package/dist/utils/getStringPreview/getStringPreview.js

@@ -1,5 +1,6 @@
-function i(r, e = 100) {
-  return r.length <= e ? r : r.slice(0, e) + "...";
+"use client";
+function i(e, r = 100) {
+  return e.length <= r ? e : e.slice(0, r) + "...";
 }
 export {
   i as getStringPreview

package/dist/utils/getStringPreview/index.js

@@ -1,3 +1,4 @@
+"use client";
 import { getStringPreview as t } from "./getStringPreview.js";
 export {
   t as getStringPreview

package/dist/utils/hasControlChanged/hasControlChanged.js

@@ -1,14 +1,16 @@
-function a(n, r) {
+"use client";
+import { deepEqual as l } from "../deepEqual/deepEqual.js";
+function p(n, r) {
   if (!r) return !0;
-  const i = Object.keys(n), s = Object.keys(r);
-  if (i.length !== s.length) return !0;
+  const i = Object.keys(n), a = Object.keys(r);
+  if (i.length !== a.length) return !0;
   for (const u of i) {
     const t = n[u], e = r[u];
-    if (!e || t.type !== e.type || t.label !== e.label || t.disabled !== e.disabled || "value" in t && "value" in e && t.value !== e.value || t.type === "number" && e.type === "number" && (t.min !== e.min || t.max !== e.max || t.step !== e.step) || t.type === "range" && e.type === "range" && (t.min !== e.min || t.max !== e.max || t.step !== e.step) || t.type === "date" && e.type === "date" && (t.min !== e.min || t.max !== e.max) || t.type === "select" && e.type === "select" && JSON.stringify(t.options) !== JSON.stringify(e.options) || t.type === "text" && e.type === "text" && t.placeholder !== e.placeholder)
+    if (!e || t.type !== e.type || t.label !== e.label || t.disabled !== e.disabled || "value" in t && "value" in e && t.value !== e.value || t.type === "number" && e.type === "number" && (t.min !== e.min || t.max !== e.max || t.step !== e.step) || t.type === "range" && e.type === "range" && (t.min !== e.min || t.max !== e.max || t.step !== e.step) || t.type === "date" && e.type === "date" && (t.min !== e.min || t.max !== e.max) || t.type === "select" && e.type === "select" && !l(t.options, e.options) || t.type === "text" && e.type === "text" && t.placeholder !== e.placeholder)
       return !0;
   }
   return !1;
 }
 export {
-  a as hasControlsChanged
+  p as hasControlsChanged
 };

package/dist/utils/hasControlChanged/index.js

@@ -1,4 +1,5 @@
-import { hasControlsChanged as a } from "./hasControlChanged.js";
+"use client";
+import { hasControlsChanged as n } from "./hasControlChanged.js";
 export {
-  a as hasControlsChanged
+  n as hasControlsChanged
 };

package/dist/utils/isMacOS/index.js

@@ -1,4 +1,5 @@
-import { isMacOS as a } from "./isMacOS.js";
+"use client";
+import { isMacOS as i } from "./isMacOS.js";
 export {
-  a as isMacOS
+  i as isMacOS
 };

package/dist/utils/isMacOS/isMacOS.js

@@ -1,6 +1,7 @@
-function e() {
+"use client";
+function a() {
   return typeof navigator < "u" && "userAgentData" in navigator ? navigator.userAgentData?.platform === "macOS" : typeof navigator < "u" && navigator.userAgent ? /Mac|iPhone|iPad|iPod/i.test(navigator.userAgent) : typeof navigator < "u" && navigator.platform?.toLowerCase().includes("mac") || !1;
 }
 export {
-  e as isMacOS
+  a as isMacOS
 };

package/dist/utils/isValidPersistedValue/isValidPersistedValue.d.ts

@@ -0,0 +1,13 @@
+import { Control, ControlsNames } from '../../components/ControlRenderer/controls/types';
+/**
+ * Validates that a value restored from localStorage matches the runtime type
+ * expected by a given control before it is fed back into the consumer's
+ * `onChange`. Persisted data can be corrupt, stale (control type changed
+ * between releases), or tampered with (same-origin/XSS, another tab), so an
+ * unchecked value could inject the wrong type into the consumer's state.
+ *
+ * @param control - The control the value would be applied to
+ * @param value - The raw value read from persistence (`unknown`)
+ * @returns `true` if the value is safe to apply for this control type
+ */
+export declare function isValidPersistedValue(control: Control<ControlsNames>, value: unknown): boolean;

package/dist/utils/isValidPersistedValue/isValidPersistedValue.js

@@ -0,0 +1,22 @@
+"use client";
+function s(t, e) {
+  switch (t.type) {
+    case "boolean":
+      return typeof e == "boolean";
+    case "number":
+    case "range":
+      return typeof e == "number" && Number.isFinite(e);
+    case "text":
+    case "select":
+    case "color":
+    case "date":
+      return typeof e == "string";
+    case "multiselect":
+      return Array.isArray(e) && e.every((r) => typeof r == "string");
+    default:
+      return !1;
+  }
+}
+export {
+  s as isValidPersistedValue
+};

package/dist/utils/prettifyJson/index.js

@@ -1,4 +1,5 @@
-import { prettifyJson as t } from "./prettifyJson.js";
+"use client";
+import { prettifyJson as o } from "./prettifyJson.js";
 export {
-  t as prettifyJson
+  o as prettifyJson
 };

package/dist/utils/prettifyJson/prettifyJson.js

@@ -1,9 +1,10 @@
-function n(r) {
+"use client";
+function n(t) {
   try {
-    const t = JSON.parse(r);
-    return JSON.stringify(t, null, 2);
+    const r = JSON.parse(t);
+    return JSON.stringify(r, null, 2);
   } catch {
-    return r;
+    return t;
   }
 }
 export {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"private": false,
-	"version": "2.4.2",
+	"version": "2.5.0",
 	"license": "MIT",
 	"name": "@berenjena/react-dev-panel",
 	"description": "A React development panel with various tools and utilities.",
@@ -23,8 +23,12 @@
 	"module": "./dist/index.js",
 	"exports": {
 		".": {
-			"import": "./dist/index.js",
-			"types": "./dist/index.d.ts"
+			"types": "./dist/index.d.ts",
+			"import": "./dist/index.js"
+		},
+		"./*": {
+			"types": "./dist/*.d.ts",
+			"import": "./dist/*.js"
 		}
 	},
 	"sideEffects": [

package/dist/assets/index16.css

@@ -1 +0,0 @@
-:root{--dev-panel-font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;--dev-panel-font-weight-normal: 400;--dev-panel-font-weight-medium: 500;--dev-panel-font-weight-semibold: 600;--dev-panel-font-weight-bold: 700;--dev-panel-font-size-xs: 10px;--dev-panel-font-size-sm: 12px;--dev-panel-font-size-md: 14px;--dev-panel-font-size-lg: 16px;--dev-panel-font-size-xl: 18px;--dev-panel-line-height-tight: 1.25;--dev-panel-line-height-normal: 1.5;--dev-panel-line-height-relaxed: 1.75;--dev-panel-accent-color: #2563eb;--dev-panel-accent-color-hover: #1d4ed8;--dev-panel-accent-color-active: #1e40af;--dev-panel-accent-color-disabled: #2563eb30;--dev-panel-primary-color: #2563eb;--dev-panel-primary-color-hover: #1d4ed8;--dev-panel-primary-color-active: #1e40af;--dev-panel-primary-color-disabled: #2563eb30;--dev-panel-secondary-color: #64748b;--dev-panel-secondary-color-hover: #475569;--dev-panel-secondary-color-active: #334155;--dev-panel-success-color: #10b981;--dev-panel-success-color-hover: #059669;--dev-panel-success-color-active: #047857;--dev-panel-warning-color: #f59e0b;--dev-panel-warning-color-hover: #d97706;--dev-panel-warning-color-active: #b45309;--dev-panel-error-color: #ef4444;--dev-panel-error-color-hover: #dc2626;--dev-panel-error-color-active: #b91c1c;--dev-panel-info-color: #06b6d4;--dev-panel-info-color-hover: #0891b2;--dev-panel-info-color-active: #0e7490;--dev-panel-background-color: #1e293b;--dev-panel-background-color-secondary: #334155;--dev-panel-background-color-tertiary: #475569;--dev-panel-foreground-color: #0f172a;--dev-panel-surface-color: #334155;--dev-panel-surface-color-hover: #475569;--dev-panel-surface-color-active: #64748b;--dev-panel-text-color: #f1f5f9;--dev-panel-text-color-secondary: #cbd5e1;--dev-panel-text-color-muted: #94a3b8;--dev-panel-text-color-disabled: #64748b;--dev-panel-text-color-on-accent: #ffffff;--dev-panel-text-color-on-surface: #f1f5f9;--dev-panel-border-color: #475569;--dev-panel-border-color-light: #64748b;--dev-panel-border-color-strong: #334155;--dev-panel-border-color-accent: #2563eb;--dev-panel-input-background-color: #0f172a;--dev-panel-input-background-color-hover: #1e293b;--dev-panel-input-background-color-focus: #1e293b;--dev-panel-input-border-color: #475569;--dev-panel-input-border-color-hover: #64748b;--dev-panel-input-border-color-focus: #2563eb;--dev-panel-input-text-color: #f1f5f9;--dev-panel-input-placeholder-color: #64748b;--dev-panel-input-border-width: 1px;--dev-panel-spacing-base: 4px;--dev-panel-spacing-xs: calc(var(--dev-panel-spacing-base) * .5);--dev-panel-spacing-sm: var(--dev-panel-spacing-base);--dev-panel-spacing-md: calc(var(--dev-panel-spacing-base) * 2);--dev-panel-spacing-lg: calc(var(--dev-panel-spacing-base) * 3);--dev-panel-spacing-xl: calc(var(--dev-panel-spacing-base) * 4);--dev-panel-spacing-2xl: calc(var(--dev-panel-spacing-base) * 5);--dev-panel-spacing-3xl: calc(var(--dev-panel-spacing-base) * 6);--dev-panel-spacing-4xl: calc(var(--dev-panel-spacing-base) * 8);--dev-panel-spacing: var(--dev-panel-spacing-lg);--dev-panel-shadow-xs: 0 1px 2px 0 rgb(0 0 0 / .05);--dev-panel-shadow-sm: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--dev-panel-shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--dev-panel-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--dev-panel-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--dev-panel-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / .25);--dev-panel-shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / .05);--dev-panel-shadow: var(--dev-panel-shadow-xl);--dev-panel-border-radius-none: 0;--dev-panel-border-radius-sm: 2px;--dev-panel-border-radius-md: 4px;--dev-panel-border-radius-lg: 6px;--dev-panel-border-radius-xl: 8px;--dev-panel-border-radius-2xl: 12px;--dev-panel-border-radius-full: 9999px;--dev-panel-border-radius: var(--dev-panel-border-radius-lg);--dev-panel-max-width: 400px;--dev-panel-min-width: 280px;--dev-panel-max-height: 600px;--dev-panel-min-height: auto;--dev-panel-header-height: auto;--dev-panel-inputs-height: 32px;--dev-panel-inputs-height-sm: 28px;--dev-panel-inputs-height-lg: 36px;--dev-panel-button-height: 32px;--dev-panel-button-height-sm: 28px;--dev-panel-button-height-lg: 36px;--dev-panel-transition-fast: all .15s cubic-bezier(.4, 0, .2, 1);--dev-panel-transition-normal: all .2s cubic-bezier(.4, 0, .2, 1);--dev-panel-transition-slow: all .3s cubic-bezier(.4, 0, .2, 1);--dev-panel-transition: var(--dev-panel-transition-normal);--dev-panel-z-index-dropdown: 1000;--dev-panel-z-index-sticky: 1020;--dev-panel-z-index-fixed: 1030;--dev-panel-z-index-modal-backdrop: 1040;--dev-panel-z-index-modal: 1050;--dev-panel-z-index-popover: 1060;--dev-panel-z-index-tooltip: 1070;--dev-panel-z-index-toast: 1080;--dev-panel-z-index: var(--dev-panel-z-index-modal);--dev-panel-opacity-0: 0;--dev-panel-opacity-5: .05;--dev-panel-opacity-10: .1;--dev-panel-opacity-20: .2;--dev-panel-opacity-25: .25;--dev-panel-opacity-30: .3;--dev-panel-opacity-40: .4;--dev-panel-opacity-50: .5;--dev-panel-opacity-60: .6;--dev-panel-opacity-70: .7;--dev-panel-opacity-75: .75;--dev-panel-opacity-80: .8;--dev-panel-opacity-90: .9;--dev-panel-opacity-95: .95;--dev-panel-opacity-100: 1;--dev-panel-scrollbar-width: 6px;--dev-panel-scrollbar-track-color: var(--dev-panel-background-color-secondary);--dev-panel-scrollbar-thumb-color: var(--dev-panel-border-color);--dev-panel-scrollbar-thumb-hover-color: var(--dev-panel-border-color-light)}@media (prefers-color-scheme: light){:root{color-scheme:light;--dev-panel-background-color: #f8fafc;--dev-panel-background-color-secondary: #f1f5f9;--dev-panel-background-color-tertiary: #e2e8f0;--dev-panel-foreground-color: #ffffff;--dev-panel-surface-color: #ffffff;--dev-panel-surface-color-hover: #e2e8f0;--dev-panel-surface-color-active: #e2e8f0;--dev-panel-text-color: #0f172a;--dev-panel-text-color-secondary: #334155;--dev-panel-text-color-muted: #64748b;--dev-panel-text-color-disabled: #94a3b8;--dev-panel-text-color-on-accent: #ffffff;--dev-panel-text-color-on-surface: #0f172a;--dev-panel-border-color: #e2e8f0;--dev-panel-border-color-light: #cbd5e1;--dev-panel-border-color-strong: #94a3b8;--dev-panel-border-color-accent: #2563eb;--dev-panel-input-background-color: #ffffff;--dev-panel-input-background-color-hover: #ffcccc;--dev-panel-input-background-color-focus: #ffffff;--dev-panel-input-border-color: #e2e8f0;--dev-panel-input-border-color-hover: #cbd5e1;--dev-panel-input-border-color-focus: #2563eb;--dev-panel-input-text-color: #0f172a;--dev-panel-input-placeholder-color: #64748b;--dev-panel-shadow-xs: 0 1px 2px 0 rgb(0 0 0 / .03);--dev-panel-shadow-sm: 0 1px 3px 0 rgb(0 0 0 / .08), 0 1px 2px -1px rgb(0 0 0 / .08);--dev-panel-shadow-md: 0 4px 6px -1px rgb(0 0 0 / .08), 0 2px 4px -2px rgb(0 0 0 / .08);--dev-panel-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .08), 0 4px 6px -4px rgb(0 0 0 / .08);--dev-panel-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .08), 0 8px 10px -6px rgb(0 0 0 / .08);--dev-panel-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / .15);--dev-panel-shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / .03);--dev-panel-shadow: var(--dev-panel-shadow-xl);--dev-panel-scrollbar-thumb-color: var(--dev-panel-border-color-light);--dev-panel-scrollbar-thumb-hover-color: var(--dev-panel-border-color-strong)}}:root[data-dev-panel-theme=dark]{color-scheme:dark}:root[data-dev-panel-theme=light]{--dev-panel-background-color: #f8fafc;--dev-panel-background-color-secondary: #f1f5f9;--dev-panel-background-color-tertiary: #e2e8f0;--dev-panel-foreground-color: #ffffff;--dev-panel-surface-color: #ffffff;--dev-panel-surface-color-hover: #e2e8f0;--dev-panel-surface-color-active: #e2e8f0;--dev-panel-text-color: #0f172a;--dev-panel-text-color-secondary: #334155;--dev-panel-text-color-muted: #64748b;--dev-panel-text-color-disabled: #94a3b8;--dev-panel-text-color-on-accent: #ffffff;--dev-panel-text-color-on-surface: #0f172a;--dev-panel-border-color: #e2e8f0;--dev-panel-border-color-light: #cbd5e1;--dev-panel-border-color-strong: #94a3b8;--dev-panel-border-color-accent: #2563eb;--dev-panel-input-background-color: #ffffff;--dev-panel-input-background-color-hover: #ffcccc;--dev-panel-input-background-color-focus: #ffffff;--dev-panel-input-border-color: #e2e8f0;--dev-panel-input-border-color-hover: #cbd5e1;--dev-panel-input-border-color-focus: #2563eb;--dev-panel-input-text-color: #0f172a;--dev-panel-input-placeholder-color: #64748b;--dev-panel-shadow-xs: 0 1px 2px 0 rgb(0 0 0 / .03);--dev-panel-shadow-sm: 0 1px 3px 0 rgb(0 0 0 / .08), 0 1px 2px -1px rgb(0 0 0 / .08);--dev-panel-shadow-md: 0 4px 6px -1px rgb(0 0 0 / .08), 0 2px 4px -2px rgb(0 0 0 / .08);--dev-panel-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .08), 0 4px 6px -4px rgb(0 0 0 / .08);--dev-panel-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .08), 0 8px 10px -6px rgb(0 0 0 / .08);--dev-panel-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / .15);--dev-panel-shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / .03);--dev-panel-shadow: var(--dev-panel-shadow-xl);--dev-panel-scrollbar-thumb-color: var(--dev-panel-border-color-light);--dev-panel-scrollbar-thumb-hover-color: var(--dev-panel-border-color-strong);color-scheme:light}._switch_1rjjb_217{--switch-width: 44px;--switch-height: 24px;--thumb-size: 20px;--thumb-margin: 1px;position:relative;display:inline-block;width:var(--switch-width);height:var(--switch-height)}._switch_1rjjb_217 input{position:absolute;opacity:0;width:0;height:0;margin:0;pointer-events:none}._switch_1rjjb_217 input:checked+._slider_1rjjb_235{background-color:var(--dev-panel-accent-color, #6366f1);border-color:var(--dev-panel-accent-color, #6366f1)}._switch_1rjjb_217 input:checked+._slider_1rjjb_235:before{left:calc(100% - var(--thumb-size) - var(--thumb-margin));background-color:var(--dev-panel-text-color-on-accent, #ffffff)}._switch_1rjjb_217 input:focus+._slider_1rjjb_235{box-shadow:0 0 0 3px #6366f133}._switch_1rjjb_217 input:focus:not(:focus-visible)+._slider_1rjjb_235{box-shadow:none}._switch_1rjjb_217 input:disabled+._slider_1rjjb_235{opacity:var(--dev-panel-opacity-50, .5);cursor:not-allowed}._switch_1rjjb_217 input:disabled+._slider_1rjjb_235:before{opacity:var(--dev-panel-opacity-70, .7)}._switch_1rjjb_217 ._slider_1rjjb_235{position:absolute;inset:0;background-color:var(--dev-panel-input-background-color, #0f172a);border:1px solid var(--dev-panel-input-border-color, #475569);border-radius:var(--dev-panel-border-radius-full, 9999px);transition:var(--dev-panel-transition, all .2s cubic-bezier(.4, 0, .2, 1));cursor:pointer}._switch_1rjjb_217 ._slider_1rjjb_235:before{content:"";position:absolute;top:var(--thumb-margin);left:var(--thumb-margin);width:var(--thumb-size);height:var(--thumb-size);background-color:var(--dev-panel-text-color-muted, #94a3b8);border-radius:var(--dev-panel-border-radius-full, 9999px);transition:var(--dev-panel-transition, all .2s cubic-bezier(.4, 0, .2, 1));box-shadow:var(--dev-panel-shadow-sm, 0 1px 3px rgba(0, 0, 0, .1))}._switch_1rjjb_217 ._slider_1rjjb_235:hover{border-color:var(--dev-panel-input-border-color-hover, #64748b)}._switch_1rjjb_217 ._slider_1rjjb_235:hover:before{box-shadow:var(--dev-panel-shadow-md, 0 4px 6px rgba(0, 0, 0, .1))}._switch_1rjjb_217 input:disabled+._slider_1rjjb_235:hover{border-color:var(--dev-panel-input-border-color, #475569)}._switch_1rjjb_217 input:disabled+._slider_1rjjb_235:hover:before{box-shadow:var(--dev-panel-shadow-sm, 0 1px 3px rgba(0, 0, 0, .1))}