@eightshift/ui-components 5.0.1 → 5.0.3

package/dist/assets/wp-font-enhancements.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.5 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.8 | MIT License | https://tailwindcss.com */
 .edit-post-header, .components-popover, .edit-post-sidebar, .wp-block-post-title, .components-select-control__input, .components-base-control__field, .components-base-control__label, .components-combobox-control__suggestions-container, .components-input-control__label, .components-input-control__input, .components-checkbox-control__label, .components-menu-group__label, .components-menu-item__button, .components-notice .components-notice__content, .components-tooltip, .components-modal__header, .preferences-modal__section-title, .preferences-modal__section-description, .block-editor-inserter__tabs, .editor-list-view-sidebar, .edit-post-layout__footer, .components-snackbar, .components-text-control__input {
   font-family: var(--es-font-sans, "Geist Variable", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
 }

package/dist/assets/wp-ui-enhancements.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.5 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.8 | MIT License | https://tailwindcss.com */
 @layer properties {
   @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
     *, :before, :after, ::backdrop {
@@ -84,6 +84,15 @@
 .block-editor-block-list__block-crash-warning {
   border-radius: var(--es-radius-lg, .5rem) !important;
   border-color: var(--es-color-red-700, oklch(50.5% .213 27.518)) !important;
+}
+
+@supports (color: color-mix(in lab, red, red)) {
+  .block-editor-block-list__block-crash-warning {
+    border-color: color-mix(in oklab, var(--es-color-red-700, oklch(50.5% .213 27.518)) 15%, transparent) !important;
+  }
+}
+
+.block-editor-block-list__block-crash-warning {
   --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a) !important;
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
   --tw-shadow-color: var(--es-color-red-700, oklch(50.5% .213 27.518)) !important;
@@ -91,7 +100,6 @@
 
 @supports (color: color-mix(in lab, red, red)) {
   .block-editor-block-list__block-crash-warning {
-    border-color: color-mix(in oklab, var(--es-color-red-700, oklch(50.5% .213 27.518)) 15%, transparent) !important;
     --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--es-color-red-700, oklch(50.5% .213 27.518)) 10%, transparent) var(--tw-shadow-alpha), transparent) !important;
   }
 }
@@ -104,6 +112,15 @@
   border-radius: var(--es-radius-lg, .5rem) !important;
   border-color: var(--es-color-zinc-300, oklch(87.1% .006 286.286)) !important;
   background-color: var(--es-color-zinc-50, oklch(98.5% 0 0)) !important;
+}
+
+@supports (color: color-mix(in lab, red, red)) {
+  .wp-block-missing div.block-editor-warning {
+    background-color: color-mix(in oklab, var(--es-color-zinc-50, oklch(98.5% 0 0)) 75%, transparent) !important;
+  }
+}
+
+.wp-block-missing div.block-editor-warning {
   --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a), 0 1px 2px -1px var(--tw-shadow-color, #0000001a) !important;
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
   --tw-shadow-color: var(--es-color-zinc-700, oklch(37% .013 285.805)) !important;
@@ -111,7 +128,6 @@
 
 @supports (color: color-mix(in lab, red, red)) {
   .wp-block-missing div.block-editor-warning {
-    background-color: color-mix(in oklab, var(--es-color-zinc-50, oklch(98.5% 0 0)) 75%, transparent) !important;
     --tw-shadow-color: color-mix(in oklab, color-mix(in oklab, var(--es-color-zinc-700, oklch(37% .013 285.805)) 20%, transparent) var(--tw-shadow-alpha), transparent) !important;
   }
 }
@@ -178,6 +194,16 @@
   border-width: 1px;
   border-color: var(--es-color-gray-800, oklch(27.8% .033 256.848));
   background-color: var(--es-color-gray-950, oklch(13% .028 261.692));
+  border-radius: var(--es-radius-md, .375rem) !important;
+}
+
+@supports (color: color-mix(in lab, red, red)) {
+  .components-tooltip {
+    background-color: color-mix(in oklab, var(--es-color-gray-950, oklch(13% .028 261.692)) 70%, transparent);
+  }
+}
+
+.components-tooltip {
   padding-inline: calc(var(--es-spacing, .25rem) * 1);
   padding-block: calc(var(--es-spacing, .25rem) * .5);
   color: var(--es-color-white, #fff);
@@ -188,13 +214,6 @@
   backdrop-filter: var(--tw-backdrop-blur, ) var(--tw-backdrop-brightness, ) var(--tw-backdrop-contrast, ) var(--tw-backdrop-grayscale, ) var(--tw-backdrop-hue-rotate, ) var(--tw-backdrop-invert, ) var(--tw-backdrop-opacity, ) var(--tw-backdrop-saturate, ) var(--tw-backdrop-sepia, );
   --tw-backdrop-brightness: brightness(105%);
   --tw-backdrop-saturate: saturate(150%);
-  border-radius: var(--es-radius-md, .375rem) !important;
-}
-
-@supports (color: color-mix(in lab, red, red)) {
-  .components-tooltip {
-    background-color: color-mix(in oklab, var(--es-color-gray-950, oklch(13% .028 261.692)) 70%, transparent);
-  }
 }
 
 .components-tooltip:has( > :first-child) {

package/dist/components/base-control/base-control.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { $ as $514c0188e459b4c0$export$5f1af8db9871e1d6 } from "../../Text-DRpwWot2.js";
+import { $ as $514c0188e459b4c0$export$5f1af8db9871e1d6 } from "../../Text-BuJgePCv.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { RichLabel } from "../rich-label/rich-label.js";
 /**

package/dist/components/button/button.js

@@ -1,12 +1,12 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-wERNNG0T.js";
-import { k as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, a as $64fa3d84918910a7$export$29f1550f4b0d4415, b as $64fa3d84918910a7$export$4d86445c2cf5e3, d as $3ef42575df84b30b$export$9d1611c77c2fe928, l as $df56164dff5785e2$export$4338b53315abf666 } from "../../utils-B94NDG0v.js";
-import { $ as $9bf71ea28793e738$export$c5251b9e124bf29 } from "../../FocusScope-C-plSxbS.js";
+import { $ as $d2b4bc8c273e7be6$export$353f5b6fc5456de1 } from "../../Button-BpwTmkAe.js";
+import { k as $f0a04ccd8dbdd83b$export$e5c5a5f917a5871c, a as $64fa3d84918910a7$export$29f1550f4b0d4415, b as $64fa3d84918910a7$export$4d86445c2cf5e3, d as $3ef42575df84b30b$export$9d1611c77c2fe928, l as $df56164dff5785e2$export$4338b53315abf666 } from "../../utils-CZt7LCbO.js";
+import { $ as $9bf71ea28793e738$export$c5251b9e124bf29 } from "../../FocusScope-BEPI2m7u.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-EDDcM64A.js";
 import React__default, { useState, useRef, forwardRef, createContext } from "react";
-import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-BYWrbm1z.js";
+import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-BbYZoHvX.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
-import { c as cva } from "../../index-wl5606BX.js";
+import { c as cva } from "../../index-BljRBEr_.js";
 import { Tooltip } from "../tooltip/tooltip.js";
 import { _ as __ } from "../../default-i18n-CT_oS1Fy.js";
 function $2680b1829e803644$export$fa142eb1681c520(props, ref) {
@@ -150,7 +150,7 @@ const Button = (props) => {
       "es:btn-group-mid:rounded-none",
       "es:btn-group-h-start:rounded-r-none es:btn-group-v-start:rounded-b-none",
       "es:btn-group-h-end:rounded-l-none es:btn-group-v-end:rounded-t-none",
-      "es:not-disabled:cursor-pointer",
+      "es:enabled:cursor-pointer",
       "es:shrink-0",
       icon && children ? "es:justify-start" : "es:justify-center",
       className
@@ -158,18 +158,18 @@ const Button = (props) => {
     {
       variants: {
         size: {
-          small: "es:icon:size-4.5 es:rounded-md",
-          default: "es:icon:size-5.5 es:rounded-lg",
-          large: "es:icon:size-6 es:rounded-lg"
+          small: "es:icon:size-4.5 es:rounded-7",
+          default: "es:icon:size-5.5 es:rounded-10",
+          large: "es:icon:size-6 es:rounded-xl"
         },
         type: {
           default: "es:bg-radial-[at_50%_125%] es:inset-ring es:inset-shadow-xs",
           selected: "es:bg-radial-[at_50%_125%] es:inset-ring es:inset-shadow-xs",
           danger: "es:bg-radial-[at_50%_125%] es:inset-ring es:inset-shadow-xs",
-          ghost: "es:border-transparent es:text-secondary-700 es:not-disabled:hover:bg-secondary-100 es:disabled:border-transparent!",
+          ghost: "es:border-transparent es:text-secondary-700 es:enabled:hover:bg-secondary-100 es:enabled:active:bg-accent-50 es:enabled:pressed:bg-accent-50 es:enabled:active:text-accent-950 es:enabled:pressed:text-accent-950 es:disabled:border-transparent!",
           dangerGhost: [
-            "es:border-transparent es:text-red-600",
-            "es:not-disabled:hover:bg-red-500/5",
+            "es:border-transparent es:text-red-700",
+            "es:enabled:hover:bg-red-500/5 es:enabled:active:bg-red-500/10 es:enabled:pressed:bg-red-500/10",
             "es:focus-visible:text-red-700",
             "es:focus-visible:ring-red-500/30 es:focus-visible:border-red-600 es:focus-visible:inset-ring-red-100",
             "es:disabled:border-transparent!"
@@ -187,8 +187,8 @@ const Button = (props) => {
             "es:border-secondary-300",
             "es:inset-ring-secondary-100",
             "es:inset-shadow-secondary-100/50",
-            "es:shadow-xs",
-            "es:hover:inset-shadow-secondary-100 es:hover:to-secondary-100 es:hover:inset-ring-secondary-100",
+            "es:shadow-sm",
+            "es:enabled:hover:shadow-md es:enabled:active:shadow-sm es:enabled:pressed:shadow-sm es:hover:inset-shadow-secondary-100 es:hover:to-secondary-100 es:hover:inset-ring-secondary-100",
             "es:hover:text-accent-950",
             "es:focus-visible:text-accent-950"
           ]
@@ -205,22 +205,22 @@ const Button = (props) => {
             "es:focus-visible:border-accent-700",
             "es:focus-visible:inset-ring es:focus-visible:inset-ring-accent-600",
             "es:focus-visible:inset-shadow-xs es:focus-visible:inset-shadow-accent-400",
-            "es:shadow es:shadow-accent-600/30"
+            "es:shadow es:shadow-accent-600/30 es:enabled:hover:shadow-md es:enabled:active:shadow-sm es:enabled:pressed:shadow-sm"
           ]
         },
         {
           type: "danger",
           disabled: false,
           class: [
-            "es:text-red-800",
+            "es:text-red-700",
             "es:from-red-50/75 es:to-white",
-            "es:border-red-600/50",
+            "es:border-red-700/50",
             "es:inset-ring-red-100",
             "es:inset-shadow-red-50",
             "es:hover:inset-shadow-red-100 es:hover:inset-ring-red-100 es:hover:text-red-800 es:hover:border-red-600",
             "es:focus-visible:text-red-900",
             "es:focus-visible:ring-red-500/30 es:focus-visible:border-red-600 es:focus-visible:inset-ring-red-100",
-            "es:shadow"
+            "es:shadow es:shadow-red-700/20 es:enabled:hover:shadow-md es:enabled:active:shadow-sm es:enabled:pressed:shadow-sm"
           ]
         },
         {

package/dist/components/checkbox/checkbox.js

@@ -1,17 +1,17 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { a as $4e85f108e88277b8$export$b085522c77523c51 } from "../../RSPContexts-2lR5GG9p.js";
-import { d as $3ef42575df84b30b$export$9d1611c77c2fe928, a as $64fa3d84918910a7$export$29f1550f4b0d4415, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, l as $df56164dff5785e2$export$4338b53315abf666, m as $5dc95899b306f630$export$c9058316764c140e, h as $64fa3d84918910a7$export$ef03459518577ad4, b as $64fa3d84918910a7$export$4d86445c2cf5e3 } from "../../utils-B94NDG0v.js";
+import { d as $3ef42575df84b30b$export$9d1611c77c2fe928, a as $64fa3d84918910a7$export$29f1550f4b0d4415, $ as $64fa3d84918910a7$export$fabf2dc03a41866e, l as $df56164dff5785e2$export$4338b53315abf666, m as $5dc95899b306f630$export$c9058316764c140e, h as $64fa3d84918910a7$export$ef03459518577ad4, b as $64fa3d84918910a7$export$4d86445c2cf5e3 } from "../../utils-CZt7LCbO.js";
 import { $ as $d3e0e05bdfcf66bd$export$c24727297075ec6a } from "../../Form-Cq3fu75_.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-EDDcM64A.js";
-import React__default, { useEffect, useRef, forwardRef, useContext, createContext } from "react";
-import { $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10, a as $e93e671b31057976$export$b8473d3665f3a75a, b as $e5be200c675c3b3a$export$a763b9476acd3eb, c as $e5be200c675c3b3a$export$dad6ae84456c676a } from "../../useFormValidation-D0_aaK-e.js";
-import { $ as $f6c31cce2adf654f$export$45712eceda6fad21 } from "../../usePress-DjNo5790.js";
-import { $ as $d2c8e2b0480f3f34$export$cbe85ee05b554577 } from "../../useToggle-CQaXLe-O.js";
-import { $ as $3017fa7ffdddec74$export$8042c6c013fd5226 } from "../../useToggleState-C3DLdez5.js";
-import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-nMG2uzxS.js";
-import { $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-VO5tcIli.js";
-import { $ as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../../VisuallyHidden-DsKYcRQ_.js";
-import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-Fp6AwSRn.js";
+import React__default, { useEffect, useRef, forwardRef, useContext, createContext, useMemo } from "react";
+import { $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10, a as $e93e671b31057976$export$b8473d3665f3a75a, b as $e5be200c675c3b3a$export$a763b9476acd3eb, c as $e5be200c675c3b3a$export$dad6ae84456c676a } from "../../useFormValidation-Dy0PXJg5.js";
+import { $ as $f6c31cce2adf654f$export$45712eceda6fad21 } from "../../usePress-BrJylgPR.js";
+import { $ as $d2c8e2b0480f3f34$export$cbe85ee05b554577 } from "../../useToggle-CDa3YAZI.js";
+import { $ as $3017fa7ffdddec74$export$8042c6c013fd5226 } from "../../useToggleState-ibcBUHnB.js";
+import { $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-Bv0UJQl8.js";
+import { $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-C2SkI1Fn.js";
+import { $ as $5c3e21d68f1c4674$export$439d29a4e110a164 } from "../../VisuallyHidden-BYi0pekx.js";
+import { $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-JS_ob-kh.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { AnimatedVisibility } from "../animated-visibility/animated-visibility.js";
 import { icons } from "../../icons/icons.js";
@@ -123,7 +123,10 @@ const $bc237834342dbd75$export$48513f6b9f8ce62d = /* @__PURE__ */ forwardRef(fun
   var _props_validationBehavior, _ref;
   let validationBehavior = (_ref = (_props_validationBehavior = props.validationBehavior) !== null && _props_validationBehavior !== void 0 ? _props_validationBehavior : formValidationBehavior) !== null && _ref !== void 0 ? _ref : "native";
   let groupState = useContext($bc237834342dbd75$export$139c5b8563afc1fc);
-  let inputRef = $df56164dff5785e2$export$4338b53315abf666($5dc95899b306f630$export$c9058316764c140e(userProvidedInputRef, props.inputRef !== void 0 ? props.inputRef : null));
+  let inputRef = $df56164dff5785e2$export$4338b53315abf666(useMemo(() => $5dc95899b306f630$export$c9058316764c140e(userProvidedInputRef, props.inputRef !== void 0 ? props.inputRef : null), [
+    userProvidedInputRef,
+    props.inputRef
+  ]));
   let { labelProps, inputProps, isSelected, isDisabled, isReadOnly, isPressed, isInvalid } = groupState ? $fba3e38d5ca8983f$export$353b32fc6898d37d({
     ...$64fa3d84918910a7$export$ef03459518577ad4(props),
     // Value is optional for standalone checkboxes, but required for CheckboxGroup items;
@@ -262,10 +265,10 @@ const Checkbox2 = (props) => {
           "div",
           {
             className: clsx(
-              "es:size-5 es:flex es:items-center es:justify-center",
+              "es:size-5 es:grid es:place-items-center es:grid-cols-1 es:grid-rows-1 es:*:row-start-1 es:*:col-start-1",
               "es:transition es:cursor-pointer",
               "es:bg-radial es:border es:rounded-md",
-              "es:shadow-xs es:inset-ring es:inset-shadow-xs",
+              "es:shadow-sm es:inset-ring es:inset-shadow-xs",
               "es:any-focus:outline-hidden es:group-focus-visible:ring-2 es:group-focus-visible:ring-accent-500/50",
               !selectedOrIntermediate && "es:group-focus-visible:border-accent-500",
               !selectedOrIntermediate && "es:border-secondary-300 es:inset-ring-secondary-100 es:inset-shadow-secondary-100/50",
@@ -280,7 +283,7 @@ const Checkbox2 = (props) => {
               /* @__PURE__ */ jsx(
                 AnimatedVisibility,
                 {
-                  transition: "scaleFade",
+                  transition: "scaleRotateFade",
                   visible: indeterminate,
                   className: "es:transition-none",
                   children: /* @__PURE__ */ jsx("div", { className: "es:h-0.5 es:w-3 es:rounded es:bg-white" })

package/dist/components/color-pickers/color-swatch.js

@@ -1,8 +1,8 @@
 import { jsx } from "react/jsx-runtime";
-import { $ as $251c695a52d94a8d$export$cae13e90592f246a } from "../../ColorSwatch-Bcn6oRSg.js";
+import { $ as $251c695a52d94a8d$export$cae13e90592f246a } from "../../ColorSwatch-DntWEAC3.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { _ as __ } from "../../default-i18n-CT_oS1Fy.js";
-import { $ as $799cddbef784668f$export$6e865ea70d7724f } from "../../Color-BhgbJF5x.js";
+import { $ as $799cddbef784668f$export$6e865ea70d7724f } from "../../Color-lVhk8V_G.js";
 /**
  * A simple color/gradient swatch.
  *
@@ -47,10 +47,10 @@ const ColorSwatch = (props) => {
       style: {
         background: (color || gradient) && backgroundGradient
       },
-      className: () => clsx("es:size-6 es:rounded es:border es:border-secondary-300 es:shadow-xs", !color && !gradient && !customGradient && "es:bg-white", className),
+      className: () => clsx("es:size-6 es:rounded-md es:border es:border-secondary-300 es:shadow-sm", !color && !gradient && !customGradient && "es:bg-white", className),
       colorName: !color && !gradient && !customGradient ? __("No color", "eightshift-ui-components") : colorName,
       color,
-      children: !color && !gradient && !customGradient && /* @__PURE__ */ jsx("div", { className: "es:m-auto es:h-full es:w-px es:rotate-45 es:rounded es:bg-red-500" })
+      children: !color && !gradient && !customGradient && /* @__PURE__ */ jsx("div", { className: "es:m-auto es:h-full es:w-px es:rotate-45 es:rounded-md es:bg-red-500" })
     }
   );
 };

package/dist/components/color-pickers/gradient-editor.js

@@ -6,7 +6,7 @@ import { icons } from "../../icons/icons.js";
 import { SolidColorPicker } from "./solid-color-picker.js";
 import { Slider } from "../slider/slider.js";
 import { NumberPicker } from "../number-picker/number-picker.js";
-import { $ as $251c695a52d94a8d$export$cae13e90592f246a } from "../../ColorSwatch-Bcn6oRSg.js";
+import { $ as $251c695a52d94a8d$export$cae13e90592f246a } from "../../ColorSwatch-DntWEAC3.js";
 import { Menu, MenuItem } from "../menu/menu.js";
 import { MatrixAlign } from "../matrix-align/matrix-align.js";
 import { Spacer } from "../spacer/spacer.js";
@@ -134,12 +134,12 @@ const gradientTypes = [
   {
     label: __("Radial"),
     value: "radial",
-    icon: /* @__PURE__ */ jsx("div", { className: "es:transparent es:size-4 es:rounded-full es:bg-[radial-gradient(var(--tw-gradient-stops))] es:from-current" })
+    icon: /* @__PURE__ */ jsx("div", { className: "es:transparent es:size-4 es:rounded-full es:bg-radial es:from-current/75 es:to-current/10" })
   },
   {
     label: __("Conic"),
     value: "conic",
-    icon: /* @__PURE__ */ jsx("div", { className: "es:transparent es:size-4 es:rounded-full es:bg-[conic-gradient(var(--tw-gradient-stops))] es:from-current" })
+    icon: /* @__PURE__ */ jsx("div", { className: "es:transparent es:size-4 es:rounded-full es:bg-conic es:from-current" })
   }
 ];
 const linearDirections = [

package/dist/components/color-pickers/solid-color-picker.js

@@ -1,24 +1,24 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import React__default, { useMemo, useRef, useState, useCallback, forwardRef, createContext, useContext } from "react";
 import { b as $4e85f108e88277b8$export$ebe63fadcdce34ed, c as $4e85f108e88277b8$export$44644b8a16031b5b, d as $4e85f108e88277b8$export$717b2c0a523a0b53 } from "../../RSPContexts-2lR5GG9p.js";
-import { d as $3ef42575df84b30b$export$9d1611c77c2fe928, e as $bdb11010cef70236$export$f680877a34711e37, b as $64fa3d84918910a7$export$4d86445c2cf5e3, a as $64fa3d84918910a7$export$29f1550f4b0d4415, i as $64fa3d84918910a7$export$2881499e37b75b9a, g as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, h as $64fa3d84918910a7$export$ef03459518577ad4 } from "../../utils-B94NDG0v.js";
+import { d as $3ef42575df84b30b$export$9d1611c77c2fe928, e as $bdb11010cef70236$export$f680877a34711e37, b as $64fa3d84918910a7$export$4d86445c2cf5e3, a as $64fa3d84918910a7$export$29f1550f4b0d4415, i as $64fa3d84918910a7$export$2881499e37b75b9a, g as $64fa3d84918910a7$export$9d4c57ee4c6ffdd8, h as $64fa3d84918910a7$export$ef03459518577ad4 } from "../../utils-CZt7LCbO.js";
 import { $ as $65484d02dcb7eb3e$export$457c3d6518dd4c6f } from "../../filterDOMProps-EDDcM64A.js";
-import { a as $9ab94262bd0047c7$export$420e68273165f4ec, $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-nMG2uzxS.js";
-import { b as $458b0a5536c1a7cf$export$40bfa8c7b0832715, g as $03deb23ff14920c4$export$4eaf04e54aa8eed6, z as $7215afc6de606d6b$export$de79e2c695e052f3, A as $46d819fcbaf35654$export$8f71654801c2f7cd, p as $a1ea59d68270f0dd$export$f8168d8dd8fd66e6, c as $c87311424ea30a05$export$fedb369cb70207f1, v as $c87311424ea30a05$export$a11b0059900ceec8, $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-VO5tcIli.js";
-import { $ as $799cddbef784668f$export$6e865ea70d7724f, b as $799cddbef784668f$export$4cde5df63f53f473, a as $3493a52097159720$exports } from "../../Color-BhgbJF5x.js";
+import { a as $9ab94262bd0047c7$export$420e68273165f4ec, $ as $f7dceffc5ad7768b$export$4e328f61c538687f } from "../../useFocusRing-Bv0UJQl8.js";
+import { b as $458b0a5536c1a7cf$export$40bfa8c7b0832715, g as $03deb23ff14920c4$export$4eaf04e54aa8eed6, z as $7215afc6de606d6b$export$de79e2c695e052f3, A as $46d819fcbaf35654$export$8f71654801c2f7cd, p as $a1ea59d68270f0dd$export$f8168d8dd8fd66e6, c as $c87311424ea30a05$export$fedb369cb70207f1, v as $c87311424ea30a05$export$a11b0059900ceec8, $ as $6179b936705e76d3$export$ae780daf29e6d456 } from "../../useHover-C2SkI1Fn.js";
+import { $ as $799cddbef784668f$export$6e865ea70d7724f, b as $799cddbef784668f$export$4cde5df63f53f473, a as $3493a52097159720$exports } from "../../Color-lVhk8V_G.js";
 import { $ as $9446cca9a3875146$export$cb6e0bb50bc19463, a as $9446cca9a3875146$export$7d15b64cf5a3a4c4 } from "../../number-GajL10e1.js";
-import { $ as $313b98861ee5dd6c$export$d6875122194c7b44 } from "../../useLabels-ntF3rFY0.js";
-import { $ as $99facab73266f662$export$5add1d006293d136 } from "../../useFormReset-DlmRL87g.js";
-import { e as $28f99e3e86e6ec45$export$e5fda3247f5d67f9, f as $e8a7022cf87cba2a$export$36da96379f79f245, g as $bcca50147b47f54d$export$56b2c08e277f365, h as $47b897dc8cdb026b$export$8d15029008292ae, d as $6f909507e6374d18$export$1e7083018727fa60, i as $6f909507e6374d18$export$f1fce0420cc6d8ee, j as $6f909507e6374d18$export$6189c2744041d8f8, a as $6f909507e6374d18$export$105594979f116971 } from "../../Slider-CyJzC1bp.js";
-import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-BYWrbm1z.js";
-import { $ as $fca6afa0e843324b$export$f12b703ca79dfbb1 } from "../../useLocalizedStringFormatter-CGzwx1a0.js";
-import { a as $5c3e21d68f1c4674$export$a966af930f325cab } from "../../VisuallyHidden-DsKYcRQ_.js";
-import { $ as $ee014567cb39d3f0$export$ff05c3ac10437e03 } from "../../FieldError-DeUh5Wkw.js";
-import { a as $3985021b0ad6602f$export$37fb8590cf2c088c, $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input--mF4XVE1.js";
-import { a as $01b77f81d0f07f68$export$75b6ee27786ba447, $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-Fp6AwSRn.js";
-import { a as $514c0188e459b4c0$export$9afb8bc826b033ea } from "../../Text-DRpwWot2.js";
-import { $ as $de67e98908f0c6ee$export$7f629e9dc1ecf37c, b as $d2e8511e6f209edf$export$e908e06f4b8e3402, c as $7d0a636d7a4dcefd$export$2123ff2b87c81ca, d as $d841c8010a73d545$export$4f384c9210e583c3, a as $81397a9303501bda$export$23f548e970bdf099 } from "../../useNumberField-C9dmERhP.js";
-import { $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10, b as $e5be200c675c3b3a$export$a763b9476acd3eb } from "../../useFormValidation-D0_aaK-e.js";
+import { $ as $313b98861ee5dd6c$export$d6875122194c7b44 } from "../../useLabels-B7-lUnAF.js";
+import { $ as $99facab73266f662$export$5add1d006293d136 } from "../../useFormReset-D2YaWRIA.js";
+import { e as $28f99e3e86e6ec45$export$e5fda3247f5d67f9, f as $e8a7022cf87cba2a$export$36da96379f79f245, g as $bcca50147b47f54d$export$56b2c08e277f365, h as $47b897dc8cdb026b$export$8d15029008292ae, d as $6f909507e6374d18$export$1e7083018727fa60, i as $6f909507e6374d18$export$f1fce0420cc6d8ee, j as $6f909507e6374d18$export$6189c2744041d8f8, a as $6f909507e6374d18$export$105594979f116971 } from "../../Slider-C-S1oEH9.js";
+import { $ as $18f2051aff69b9bf$export$43bb16f9c6d9e3f7 } from "../../context-BbYZoHvX.js";
+import { $ as $fca6afa0e843324b$export$f12b703ca79dfbb1 } from "../../useLocalizedStringFormatter-C9GO0IDB.js";
+import { a as $5c3e21d68f1c4674$export$a966af930f325cab } from "../../VisuallyHidden-BYi0pekx.js";
+import { $ as $ee014567cb39d3f0$export$ff05c3ac10437e03 } from "../../FieldError-DHrSdE_Q.js";
+import { a as $3985021b0ad6602f$export$37fb8590cf2c088c, $ as $3985021b0ad6602f$export$f5b8910cec6cf069 } from "../../Input-BmDS8Juy.js";
+import { a as $01b77f81d0f07f68$export$75b6ee27786ba447, $ as $01b77f81d0f07f68$export$b04be29aa201d4f5 } from "../../Label-JS_ob-kh.js";
+import { a as $514c0188e459b4c0$export$9afb8bc826b033ea } from "../../Text-BuJgePCv.js";
+import { $ as $de67e98908f0c6ee$export$7f629e9dc1ecf37c, b as $d2e8511e6f209edf$export$e908e06f4b8e3402, c as $7d0a636d7a4dcefd$export$2123ff2b87c81ca, d as $d841c8010a73d545$export$4f384c9210e583c3, a as $81397a9303501bda$export$23f548e970bdf099 } from "../../useNumberField-CU1_u8ze.js";
+import { $ as $e5be200c675c3b3a$export$fc1a364ae1f3ff10, b as $e5be200c675c3b3a$export$a763b9476acd3eb } from "../../useFormValidation-Dy0PXJg5.js";
 import { c as clsx } from "../../lite-DVmmD_-j.js";
 import { BaseControl } from "../base-control/base-control.js";
 import { _ as __ } from "../../default-i18n-CT_oS1Fy.js";
@@ -1290,7 +1290,7 @@ const SolidColorPicker = (props) => {
   const valueInputClassName = clsx(
     "es:h-8 es:w-12",
     "es:tabular-nums es:font-mono",
-    "es:border es:rounded-lg es:border-secondary-300 es:p-2 es:text-sm es:shadow-xs es:transition es:selection:bg-accent-500/20 es:selection:text-accent-950",
+    "es:border es:rounded-lg es:border-secondary-300 es:p-2 es:text-sm es:shadow-sm es:transition es:selection:bg-accent-500/20 es:selection:text-accent-950",
     "es:any-focus:outline-hidden",
     "es:focus-visible:ring-2 es:focus-visible:ring-accent-500/50 es:focus-visible:z-10",
     "es:focus-visible:border-accent-500",
@@ -1304,7 +1304,7 @@ const SolidColorPicker = (props) => {
         xChannel: "saturation",
         yChannel: "lightness",
         className: clsx(
-          "es:size-48 es:rounded-md es:border es:border-secondary-300 es:shadow-sm es:transition",
+          "es:size-48 es:rounded-xl es:border es:border-secondary-300 es:shadow-sm es:transition",
           'es:[&:has(>_[data-focus-visible="true"])]:ring-2 es:[&:has(>_[data-focus-visible="true"])]:ring-accent-500/50',
           "es:disabled:bg-linear-to-r! es:disabled:from-white es:disabled:to-secondary-100"
         ),
@@ -1325,7 +1325,7 @@ const SolidColorPicker = (props) => {
           $6f909507e6374d18$export$105594979f116971,
           {
             className: clsx(
-              "es:h-7 es:w-48 es:rounded-md es:border es:border-secondary-300 es:shadow-sm",
+              "es:h-7 es:w-48 es:rounded-10 es:border es:border-secondary-300 es:shadow-sm",
               'es:[&:has(>_[data-focus-visible="true"])]:ring-2 es:[&:has(>_[data-focus-visible="true"])]:ring-accent-500/50',
               "es:disabled:bg-linear-to-r! es:disabled:from-white es:disabled:to-secondary-100"
             ),
@@ -1345,7 +1345,7 @@ const SolidColorPicker = (props) => {
           $6f909507e6374d18$export$105594979f116971,
           {
             className: clsx(
-              "es:h-7 es:w-48 es:rounded-md es:border es:border-secondary-300 es:shadow-sm",
+              "es:h-7 es:w-48 es:rounded-10 es:border es:border-secondary-300 es:shadow-sm",
               'es:[&:has(>_[data-focus-visible="true"])]:ring-2 es:[&:has(>_[data-focus-visible="true"])]:ring-accent-500/50',
               "es:disabled:bg-linear-to-r! es:disabled:from-white es:disabled:to-secondary-100"
             ),
@@ -1375,7 +1375,7 @@ const SolidColorPicker = (props) => {
               className: clsx(
                 "es:h-9 es:w-20",
                 "es:tabular-nums es:font-mono",
-                "es:border es:border-secondary-300 es:p-2 es:text-sm es:shadow-xs es:transition es:selection:bg-accent-500/20 es:selection:text-accent-950",
+                "es:border es:border-secondary-300 es:p-2 es:text-sm es:shadow-sm es:transition es:selection:bg-accent-500/20 es:selection:text-accent-950",
                 "es:any-focus:outline-hidden",
                 "es:focus-visible:ring-2 es:focus-visible:ring-accent-500/50 es:focus-visible:z-10",
                 "es:focus-visible:border-accent-500",

package/dist/components/component-toggle/component-toggle.js

@@ -23,7 +23,6 @@ import { AnimatedVisibility } from "../animated-visibility/animated-visibility.j
  * @param {boolean} [props.noUseToggle] - If `true`, the toggle is not displayed.
  * @param {boolean} [props.noExpandButton] - If `true`, the expand button is not shown.
  * @param {boolean} [props.noLabel] - If `true`, the label is not shown.
- * @param {boolean} [props.noUseToggle] - If `true`, the toggle is not displayed.
  * @param {boolean} [props.expandButtonDisabled] - If `true`, the expand button is disabled.
  * @param {boolean} [props.controlOnly] - If `true`, only the control is displayed.
  * @param {boolean} [props.hideUseToggleOnExpand] - If `true`, and the component is display in a variant where it can be expanded, the use toggle will hide when the component is expanded.