@versini/ui-toggle 7.0.3 → 8.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import { JSX } from 'react/jsx-runtime';
2
2
 
3
- export declare const Toggle: ({ checked, onChange, label, labelHidden, name, mode, labelMode, className, noBorder, narrow, noHaptic, labelPosition, subLabel, splitBackground, }: ToggleProps) => JSX.Element;
3
+ export declare const Toggle: ({ checked, onChange, label, labelHidden, name, mode, labelMode, className, noBorder, narrow, noHaptic, labelPosition, subLabel, flat, }: ToggleProps) => JSX.Element;
4
4
 
5
5
  export declare const TOGGLE_CLASSNAME = "av-toggle";
6
6
 
@@ -66,11 +66,11 @@ declare type ToggleProps = {
66
66
  */
67
67
  labelPosition?: "left" | "right";
68
68
  /**
69
- * Whether or not to render the toggle track with a split background
70
- * gradient overlay (aqua-style).
69
+ * Whether to render the Toggle with a flat solid background
70
+ * instead of the default Aqua-style gradient overlay.
71
71
  * @default false
72
72
  */
73
- splitBackground?: boolean;
73
+ flat?: boolean;
74
74
  };
75
75
 
76
76
  export { }
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- @versini/ui-toggle v7.0.3
2
+ @versini/ui-toggle v8.0.0
3
3
  © 2026 gizmette.com
4
4
  */
5
5
 
@@ -24,13 +24,13 @@ const getToggleBaseClasses = ({ narrow })=>{
24
24
  const getToggleKnobFocusClasses = ()=>{
25
25
  return clsx("peer-focus:outline", "peer-focus:outline-2", "peer-focus:outline-offset-2", "peer-focus:outline-focus-dark");
26
26
  };
27
- const getToggleKnobOnClasses = ({ narrow, splitBackground })=>{
27
+ const getToggleKnobOnClasses = ({ narrow, flat })=>{
28
28
  return clsx({
29
29
  "peer-checked:after:translate-x-full": !narrow,
30
30
  "peer-checked:after:translate-x-4": narrow
31
31
  }, // background color when checked
32
32
  "peer-checked:bg-action-light", // split background overlay on the knob (both states)
33
- splitBackground && "after:av-bg-split-overlay", // knob circle and border color when checked
33
+ !flat && "after:av-bg-split-overlay", // knob circle and border color when checked
34
34
  "peer-checked:after:bg-white", "peer-checked:after:border-white");
35
35
  };
36
36
  const getToggleKnobOffClasses = ({ narrow })=>{
@@ -75,7 +75,7 @@ const getWrapperClasses = ({ className })=>{
75
75
  const getToggleWrapperClasses = ()=>{
76
76
  return "relative inline-block";
77
77
  };
78
- const getToggleClasses = ({ mode, labelHidden, className, noBorder, narrow, labelMode, labelPosition = "right", subLabel, splitBackground })=>{
78
+ const getToggleClasses = ({ mode, labelHidden, className, noBorder, narrow, labelMode, labelPosition = "right", subLabel, flat })=>{
79
79
  return {
80
80
  toggle: clsx(getToggleBaseClasses({
81
81
  narrow
@@ -86,7 +86,7 @@ const getToggleClasses = ({ mode, labelHidden, className, noBorder, narrow, labe
86
86
  narrow
87
87
  }), getToggleKnobOnClasses({
88
88
  narrow,
89
- splitBackground
89
+ flat
90
90
  })),
91
91
  label: getLabelClasses({
92
92
  labelHidden,
@@ -112,7 +112,7 @@ const getToggleClasses = ({ mode, labelHidden, className, noBorder, narrow, labe
112
112
 
113
113
 
114
114
 
115
- const Toggle = ({ checked = false, onChange, label, labelHidden = false, name, mode = "system", labelMode, className, noBorder = false, narrow = false, noHaptic = false, labelPosition = "right", subLabel, splitBackground = false })=>{
115
+ const Toggle = ({ checked = false, onChange, label, labelHidden = false, name, mode = "system", labelMode, className, noBorder = false, narrow = false, noHaptic = false, labelPosition = "right", subLabel, flat = false })=>{
116
116
  const { haptic } = useHaptic();
117
117
  const toggleClasses = getToggleClasses({
118
118
  mode,
@@ -123,7 +123,7 @@ const Toggle = ({ checked = false, onChange, label, labelHidden = false, name, m
123
123
  labelMode,
124
124
  labelPosition,
125
125
  subLabel: !!subLabel,
126
- splitBackground
126
+ flat
127
127
  });
128
128
  const handleChange = (e)=>{
129
129
  if (!noHaptic) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@versini/ui-toggle",
3
- "version": "7.0.3",
3
+ "version": "8.0.0",
4
4
  "license": "MIT",
5
5
  "author": "Arno Versini",
6
6
  "publishConfig": {
@@ -41,7 +41,7 @@
41
41
  "test:visual:ui": "playwright test -c playwright-ct.config.ts --ui"
42
42
  },
43
43
  "devDependencies": {
44
- "@versini/ui-types": "9.1.0"
44
+ "@versini/ui-types": "10.0.0"
45
45
  },
46
46
  "dependencies": {
47
47
  "@versini/ui-hooks": "6.1.1",
@@ -51,5 +51,5 @@
51
51
  "sideEffects": [
52
52
  "**/*.css"
53
53
  ],
54
- "gitHead": "738b2918169bc39087fc7dc4b04752970b06087e"
54
+ "gitHead": "0c985a7fdf2ab23b36c43b42663d9625d0ccb4c5"
55
55
  }