@breadstone/mosaik-elements-foundation 0.0.25 → 0.0.27

package/Controls/Components/Buttons/ToggleButton/Themes/ToggleButtonElement.Joy.js

@@ -307,17 +307,17 @@ export function toggleButtonElementJoyStyle() {
   --focus-ring-outward-offset: 0px;
 }
 
-:host([appearance="outline"]:not([disabled]):not([is-checked])) {
+:host([appearance="outline"]:not([disabled]):not([disabled="false"]):not([is-checked])) {
   --toggle-button-background-color: var(--joy-scheme-background);
   --toggle-button-foreground-color: var(--joy-scheme-foreground);
   --toggle-button-border-color: var(--joy-scheme-highlight);
 }
 
-:host([appearance="outline"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="outline"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-scheme-highlight);
 }
 
-:host([appearance="outline"][variant="primary"]:not([disabled])[is-checked]) {
+:host([appearance="outline"][variant="primary"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-primary-700);
   --toggle-button-border-color: var(--joy-color-primary-700);
 }
@@ -327,11 +327,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-border-color: var(--joy-color-primary-500);
 }
 
-:host([appearance="outline"][variant="primary"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="outline"][variant="primary"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-primary-100);
 }
 
-:host([appearance="outline"][variant="secondary"]:not([disabled])[is-checked]) {
+:host([appearance="outline"][variant="secondary"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-secondary-700);
   --toggle-button-border-color: var(--joy-color-secondary-700);
 }
@@ -341,11 +341,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-border-color: var(--joy-color-secondary-500);
 }
 
-:host([appearance="outline"][variant="secondary"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="outline"][variant="secondary"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-secondary-100);
 }
 
-:host([appearance="outline"][variant="tertiary"]:not([disabled])[is-checked]) {
+:host([appearance="outline"][variant="tertiary"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-tertiary-700);
   --toggle-button-border-color: var(--joy-color-tertiary-700);
 }
@@ -355,11 +355,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-border-color: var(--joy-color-tertiary-500);
 }
 
-:host([appearance="outline"][variant="tertiary"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="outline"][variant="tertiary"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-tertiary-100);
 }
 
-:host([appearance="outline"][variant="danger"]:not([disabled])[is-checked]) {
+:host([appearance="outline"][variant="danger"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-danger-700);
   --toggle-button-border-color: var(--joy-color-danger-700);
 }
@@ -369,11 +369,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-border-color: var(--joy-color-danger-500);
 }
 
-:host([appearance="outline"][variant="danger"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="outline"][variant="danger"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-danger-100);
 }
 
-:host([appearance="outline"][variant="warning"]:not([disabled])[is-checked]) {
+:host([appearance="outline"][variant="warning"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-warning-700);
   --toggle-button-border-color: var(--joy-color-warning-700);
 }
@@ -383,11 +383,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-border-color: var(--joy-color-warning-500);
 }
 
-:host([appearance="outline"][variant="warning"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="outline"][variant="warning"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-warning-100);
 }
 
-:host([appearance="outline"][variant="success"]:not([disabled])[is-checked]) {
+:host([appearance="outline"][variant="success"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-success-700);
   --toggle-button-border-color: var(--joy-color-success-700);
 }
@@ -397,11 +397,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-border-color: var(--joy-color-success-500);
 }
 
-:host([appearance="outline"][variant="success"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="outline"][variant="success"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-success-100);
 }
 
-:host([appearance="outline"][variant="info"]:not([disabled])[is-checked]) {
+:host([appearance="outline"][variant="info"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-info-700);
   --toggle-button-border-color: var(--joy-color-info-700);
 }
@@ -411,11 +411,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-border-color: var(--joy-color-info-500);
 }
 
-:host([appearance="outline"][variant="info"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="outline"][variant="info"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-info-100);
 }
 
-:host([appearance="outline"][variant="highlight"]:not([disabled])[is-checked]) {
+:host([appearance="outline"][variant="highlight"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-highlight-700);
   --toggle-button-border-color: var(--joy-color-highlight-700);
 }
@@ -425,11 +425,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-border-color: var(--joy-color-highlight-500);
 }
 
-:host([appearance="outline"][variant="highlight"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="outline"][variant="highlight"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-highlight-100);
 }
 
-:host([appearance="outline"][variant="neutral"]:not([disabled])[is-checked]) {
+:host([appearance="outline"][variant="neutral"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-neutral-700);
   --toggle-button-border-color: var(--joy-color-neutral-700);
 }
@@ -439,7 +439,7 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-border-color: var(--joy-color-neutral-500);
 }
 
-:host([appearance="outline"][variant="neutral"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="outline"][variant="neutral"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-neutral-100);
 }
 
@@ -448,15 +448,15 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-background-color: var(--joy-scheme-transparent);
 }
 
-:host([appearance="plain"]:not([disabled])) [part="focusRing"] {
+:host([appearance="plain"]:not([disabled]):not([disabled="false"])) [part="focusRing"] {
   --focus-ring-outward-offset: 0px;
 }
 
-:host([appearance="plain"]:not([disabled]):hover) {
+:host([appearance="plain"]:not([disabled]):not([disabled="false"]):hover) {
   --toggle-button-background-color: var(--joy-scheme-highlight);
 }
 
-:host([appearance="plain"][variant="primary"]:not([disabled])[is-checked]) {
+:host([appearance="plain"][variant="primary"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-primary-700);
 }
 
@@ -464,12 +464,12 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-primary-500);
 }
 
-:host([appearance="plain"][variant="primary"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="plain"][variant="primary"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-primary-100);
   --toggle-button-foreground-color: var(--joy-color-primary-500);
 }
 
-:host([appearance="plain"][variant="secondary"]:not([disabled])[is-checked]) {
+:host([appearance="plain"][variant="secondary"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-secondary-700);
 }
 
@@ -477,12 +477,12 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-secondary-500);
 }
 
-:host([appearance="plain"][variant="secondary"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="plain"][variant="secondary"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-secondary-100);
   --toggle-button-foreground-color: var(--joy-color-secondary-500);
 }
 
-:host([appearance="plain"][variant="tertiary"]:not([disabled])[is-checked]) {
+:host([appearance="plain"][variant="tertiary"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-tertiary-700);
 }
 
@@ -490,12 +490,12 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-tertiary-500);
 }
 
-:host([appearance="plain"][variant="tertiary"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="plain"][variant="tertiary"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-tertiary-100);
   --toggle-button-foreground-color: var(--joy-color-tertiary-500);
 }
 
-:host([appearance="plain"][variant="danger"]:not([disabled])[is-checked]) {
+:host([appearance="plain"][variant="danger"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-danger-700);
 }
 
@@ -503,12 +503,12 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-danger-500);
 }
 
-:host([appearance="plain"][variant="danger"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="plain"][variant="danger"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-danger-100);
   --toggle-button-foreground-color: var(--joy-color-danger-500);
 }
 
-:host([appearance="plain"][variant="warning"]:not([disabled])[is-checked]) {
+:host([appearance="plain"][variant="warning"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-warning-700);
 }
 
@@ -516,12 +516,12 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-warning-500);
 }
 
-:host([appearance="plain"][variant="warning"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="plain"][variant="warning"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-warning-100);
   --toggle-button-foreground-color: var(--joy-color-warning-500);
 }
 
-:host([appearance="plain"][variant="success"]:not([disabled])[is-checked]) {
+:host([appearance="plain"][variant="success"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-success-700);
 }
 
@@ -529,12 +529,12 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-success-500);
 }
 
-:host([appearance="plain"][variant="success"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="plain"][variant="success"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-success-100);
   --toggle-button-foreground-color: var(--joy-color-success-500);
 }
 
-:host([appearance="plain"][variant="info"]:not([disabled])[is-checked]) {
+:host([appearance="plain"][variant="info"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-info-700);
 }
 
@@ -542,12 +542,12 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-info-500);
 }
 
-:host([appearance="plain"][variant="info"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="plain"][variant="info"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-info-100);
   --toggle-button-foreground-color: var(--joy-color-info-500);
 }
 
-:host([appearance="plain"][variant="highlight"]:not([disabled])[is-checked]) {
+:host([appearance="plain"][variant="highlight"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-highlight-700);
 }
 
@@ -555,12 +555,12 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-highlight-500);
 }
 
-:host([appearance="plain"][variant="highlight"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="plain"][variant="highlight"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-highlight-100);
   --toggle-button-foreground-color: var(--joy-color-highlight-500);
 }
 
-:host([appearance="plain"][variant="neutral"]:not([disabled])[is-checked]) {
+:host([appearance="plain"][variant="neutral"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-foreground-color: var(--joy-color-neutral-700);
 }
 
@@ -568,7 +568,7 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-neutral-500);
 }
 
-:host([appearance="plain"][variant="neutral"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="plain"][variant="neutral"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-neutral-100);
   --toggle-button-foreground-color: var(--joy-color-neutral-500);
 }
@@ -581,134 +581,134 @@ export function toggleButtonElementJoyStyle() {
   --focus-ring-outward-offset: 0px;
 }
 
-:host([appearance="soft"]:not([disabled])) {
+:host([appearance="soft"]:not([disabled]):not([disabled="false"])) {
   --toggle-button-background-color: var(--joy-scheme-highlight);
   --toggle-button-foreground-color: var(--joy-scheme-foreground);
 }
 
-:host([appearance="soft"][variant="primary"]:not([disabled])[is-checked]) {
+:host([appearance="soft"][variant="primary"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-primary-300);
   --toggle-button-foreground-color: var(--joy-color-primary-500);
 }
 
-:host([appearance="soft"][variant="primary"]:not([disabled]):not([is-checked])) {
+:host([appearance="soft"][variant="primary"]:not([disabled]):not([disabled="false"]):not([is-checked])) {
   --toggle-button-background-color: var(--joy-color-primary-100);
   --toggle-button-foreground-color: var(--joy-color-primary-500);
 }
 
-:host([appearance="soft"][variant="primary"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="soft"][variant="primary"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-primary-200);
 }
 
-:host([appearance="soft"][variant="secondary"]:not([disabled])[is-checked]) {
+:host([appearance="soft"][variant="secondary"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-secondary-300);
   --toggle-button-foreground-color: var(--joy-color-secondary-500);
 }
 
-:host([appearance="soft"][variant="secondary"]:not([disabled]):not([is-checked])) {
+:host([appearance="soft"][variant="secondary"]:not([disabled]):not([disabled="false"]):not([is-checked])) {
   --toggle-button-background-color: var(--joy-color-secondary-100);
   --toggle-button-foreground-color: var(--joy-color-secondary-500);
 }
 
-:host([appearance="soft"][variant="secondary"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="soft"][variant="secondary"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-secondary-200);
 }
 
-:host([appearance="soft"][variant="tertiary"]:not([disabled])[is-checked]) {
+:host([appearance="soft"][variant="tertiary"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-tertiary-300);
   --toggle-button-foreground-color: var(--joy-color-tertiary-500);
 }
 
-:host([appearance="soft"][variant="tertiary"]:not([disabled]):not([is-checked])) {
+:host([appearance="soft"][variant="tertiary"]:not([disabled]):not([disabled="false"]):not([is-checked])) {
   --toggle-button-background-color: var(--joy-color-tertiary-100);
   --toggle-button-foreground-color: var(--joy-color-tertiary-500);
 }
 
-:host([appearance="soft"][variant="tertiary"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="soft"][variant="tertiary"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-tertiary-200);
 }
 
-:host([appearance="soft"][variant="danger"]:not([disabled])[is-checked]) {
+:host([appearance="soft"][variant="danger"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-danger-300);
   --toggle-button-foreground-color: var(--joy-color-danger-500);
 }
 
-:host([appearance="soft"][variant="danger"]:not([disabled]):not([is-checked])) {
+:host([appearance="soft"][variant="danger"]:not([disabled]):not([disabled="false"]):not([is-checked])) {
   --toggle-button-background-color: var(--joy-color-danger-100);
   --toggle-button-foreground-color: var(--joy-color-danger-500);
 }
 
-:host([appearance="soft"][variant="danger"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="soft"][variant="danger"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-danger-200);
 }
 
-:host([appearance="soft"][variant="warning"]:not([disabled])[is-checked]) {
+:host([appearance="soft"][variant="warning"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-warning-300);
   --toggle-button-foreground-color: var(--joy-color-warning-500);
 }
 
-:host([appearance="soft"][variant="warning"]:not([disabled]):not([is-checked])) {
+:host([appearance="soft"][variant="warning"]:not([disabled]):not([disabled="false"]):not([is-checked])) {
   --toggle-button-background-color: var(--joy-color-warning-100);
   --toggle-button-foreground-color: var(--joy-color-warning-500);
 }
 
-:host([appearance="soft"][variant="warning"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="soft"][variant="warning"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-warning-200);
 }
 
-:host([appearance="soft"][variant="success"]:not([disabled])[is-checked]) {
+:host([appearance="soft"][variant="success"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-success-300);
   --toggle-button-foreground-color: var(--joy-color-success-500);
 }
 
-:host([appearance="soft"][variant="success"]:not([disabled]):not([is-checked])) {
+:host([appearance="soft"][variant="success"]:not([disabled]):not([disabled="false"]):not([is-checked])) {
   --toggle-button-background-color: var(--joy-color-success-100);
   --toggle-button-foreground-color: var(--joy-color-success-500);
 }
 
-:host([appearance="soft"][variant="success"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="soft"][variant="success"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-success-200);
 }
 
-:host([appearance="soft"][variant="info"]:not([disabled])[is-checked]) {
+:host([appearance="soft"][variant="info"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-info-300);
   --toggle-button-foreground-color: var(--joy-color-info-500);
 }
 
-:host([appearance="soft"][variant="info"]:not([disabled]):not([is-checked])) {
+:host([appearance="soft"][variant="info"]:not([disabled]):not([disabled="false"]):not([is-checked])) {
   --toggle-button-background-color: var(--joy-color-info-100);
   --toggle-button-foreground-color: var(--joy-color-info-500);
 }
 
-:host([appearance="soft"][variant="info"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="soft"][variant="info"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-info-200);
 }
 
-:host([appearance="soft"][variant="highlight"]:not([disabled])[is-checked]) {
+:host([appearance="soft"][variant="highlight"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-highlight-300);
   --toggle-button-foreground-color: var(--joy-color-highlight-500);
 }
 
-:host([appearance="soft"][variant="highlight"]:not([disabled]):not([is-checked])) {
+:host([appearance="soft"][variant="highlight"]:not([disabled]):not([disabled="false"]):not([is-checked])) {
   --toggle-button-background-color: var(--joy-color-highlight-100);
   --toggle-button-foreground-color: var(--joy-color-highlight-500);
 }
 
-:host([appearance="soft"][variant="highlight"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="soft"][variant="highlight"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-highlight-200);
 }
 
-:host([appearance="soft"][variant="neutral"]:not([disabled])[is-checked]) {
+:host([appearance="soft"][variant="neutral"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-neutral-300);
   --toggle-button-foreground-color: var(--joy-color-neutral-500);
 }
 
-:host([appearance="soft"][variant="neutral"]:not([disabled]):not([is-checked])) {
+:host([appearance="soft"][variant="neutral"]:not([disabled]):not([disabled="false"]):not([is-checked])) {
   --toggle-button-background-color: var(--joy-color-neutral-100);
   --toggle-button-foreground-color: var(--joy-color-neutral-500);
 }
 
-:host([appearance="soft"][variant="neutral"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="soft"][variant="neutral"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-neutral-200);
 }
 
@@ -720,12 +720,12 @@ export function toggleButtonElementJoyStyle() {
   --focus-ring-outward-offset: 0px;
 }
 
-:host([appearance="solid"]:not([disabled])) {
+:host([appearance="solid"]:not([disabled]):not([disabled="false"])) {
   --toggle-button-background-color: var(--joy-scheme-disabled);
   --toggle-button-foreground-color: var(--joy-scheme-highlight);
 }
 
-:host([appearance="solid"][variant="primary"]:not([disabled])[is-checked]) {
+:host([appearance="solid"][variant="primary"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-primary-700);
   --toggle-button-foreground-color: var(--joy-color-primary-0);
 }
@@ -735,11 +735,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-primary-0);
 }
 
-:host([appearance="solid"][variant="primary"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="solid"][variant="primary"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-primary-600);
 }
 
-:host([appearance="solid"][variant="secondary"]:not([disabled])[is-checked]) {
+:host([appearance="solid"][variant="secondary"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-secondary-700);
   --toggle-button-foreground-color: var(--joy-color-secondary-0);
 }
@@ -749,11 +749,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-secondary-0);
 }
 
-:host([appearance="solid"][variant="secondary"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="solid"][variant="secondary"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-secondary-600);
 }
 
-:host([appearance="solid"][variant="tertiary"]:not([disabled])[is-checked]) {
+:host([appearance="solid"][variant="tertiary"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-tertiary-700);
   --toggle-button-foreground-color: var(--joy-color-tertiary-0);
 }
@@ -763,11 +763,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-tertiary-0);
 }
 
-:host([appearance="solid"][variant="tertiary"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="solid"][variant="tertiary"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-tertiary-600);
 }
 
-:host([appearance="solid"][variant="danger"]:not([disabled])[is-checked]) {
+:host([appearance="solid"][variant="danger"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-danger-700);
   --toggle-button-foreground-color: var(--joy-color-danger-0);
 }
@@ -777,11 +777,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-danger-0);
 }
 
-:host([appearance="solid"][variant="danger"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="solid"][variant="danger"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-danger-600);
 }
 
-:host([appearance="solid"][variant="warning"]:not([disabled])[is-checked]) {
+:host([appearance="solid"][variant="warning"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-warning-700);
   --toggle-button-foreground-color: var(--joy-color-warning-0);
 }
@@ -791,11 +791,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-warning-0);
 }
 
-:host([appearance="solid"][variant="warning"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="solid"][variant="warning"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-warning-600);
 }
 
-:host([appearance="solid"][variant="success"]:not([disabled])[is-checked]) {
+:host([appearance="solid"][variant="success"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-success-700);
   --toggle-button-foreground-color: var(--joy-color-success-0);
 }
@@ -805,11 +805,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-success-0);
 }
 
-:host([appearance="solid"][variant="success"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="solid"][variant="success"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-success-600);
 }
 
-:host([appearance="solid"][variant="info"]:not([disabled])[is-checked]) {
+:host([appearance="solid"][variant="info"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-info-700);
   --toggle-button-foreground-color: var(--joy-color-info-0);
 }
@@ -819,11 +819,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-info-0);
 }
 
-:host([appearance="solid"][variant="info"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="solid"][variant="info"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-info-600);
 }
 
-:host([appearance="solid"][variant="highlight"]:not([disabled])[is-checked]) {
+:host([appearance="solid"][variant="highlight"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-highlight-700);
   --toggle-button-foreground-color: var(--joy-color-highlight-0);
 }
@@ -833,11 +833,11 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-highlight-0);
 }
 
-:host([appearance="solid"][variant="highlight"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="solid"][variant="highlight"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-highlight-600);
 }
 
-:host([appearance="solid"][variant="neutral"]:not([disabled])[is-checked]) {
+:host([appearance="solid"][variant="neutral"]:not([disabled]):not([disabled="false"])[is-checked]) {
   --toggle-button-background-color: var(--joy-color-neutral-700);
   --toggle-button-foreground-color: var(--joy-color-neutral-0);
 }
@@ -847,7 +847,7 @@ export function toggleButtonElementJoyStyle() {
   --toggle-button-foreground-color: var(--joy-color-neutral-0);
 }
 
-:host([appearance="solid"][variant="neutral"]:not([disabled]):not([is-checked]):hover) {
+:host([appearance="solid"][variant="neutral"]:not([disabled]):not([disabled="false"]):not([is-checked]):hover) {
   --toggle-button-background-color: var(--joy-color-neutral-600);
 }