@breadstone/mosaik-elements-foundation 0.0.229 → 0.0.230

package/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Joy.js

@@ -34,6 +34,11 @@ export function checkmarkElementJoyStyle() {
   --checkmark-padding-right: 8px;
   --checkmark-padding-top: 4px;
   --checkmark-shadow: var(--joy-elevation-none);
+  --checkmark-shadow-blur: var(--joy-elevation-light-blur-1);
+  --checkmark-shadow-color: var(--joy-elevation-light-color-1);
+  --checkmark-shadow-offset-x: var(--joy-elevation-light-offset-x-1);
+  --checkmark-shadow-offset-y: var(--joy-elevation-light-offset-y-1);
+  --checkmark-shadow-spread: var(--joy-elevation-light-spread-1);
   --checkmark-thickness: 2px;
   --checkmark-transition-duration: var(--joy-duration-short);
   --checkmark-transition-mode: ease;
@@ -113,6 +118,7 @@ export function checkmarkElementJoyStyle() {
   height: calc(var(--checkmark-box-size) / 2 - 6px);
   border-radius: calc((var(--checkmark-box-size) / 2 - 6px) / 2);
   margin-left: calc(var(--checkmark-thickness) * 2 - var(--checkmark-border-width));
+  box-shadow: var(--checkmark-shadow-offset-x) var(--checkmark-shadow-offset-y) var(--checkmark-shadow-blur) var(--checkmark-shadow-spread) var(--checkmark-shadow-color);
   transition: all .3s cubic-bezier(.27, .01, .38, 1.06);
   display: block;
   position: absolute;
@@ -189,7 +195,7 @@ export function checkmarkElementJoyStyle() {
   position: absolute;
   top: 50%;
   left: 50%;
-  transform: scaleX(-1)rotate(135deg)translateZ(0)translate(calc(-50% - 1px), calc(1px - 50%));
+  transform: scaleX(-1) rotate(135deg) translateZ(0) translate(calc(-50% - 1px), calc(1px - 50%));
 }
 
 @keyframes hook {
@@ -230,7 +236,7 @@ export function checkmarkElementJoyStyle() {
   position: absolute;
   top: 25%;
   left: 50%;
-  transform: scaleX(-1)rotate(0)translateZ(0)translate(-50%, -50%);
+  transform: scaleX(-1) rotate(0) translateZ(0) translate(-50%, -50%);
 }
 
 :host([type="hook"][appearance="plain"]) {
@@ -244,6 +250,17 @@ export function checkmarkElementJoyStyle() {
   --checkmark-border-width: 0px;
 }
 
+:host([type="bullet"][appearance="plain"]) {
+  --checkmark-background-color: transparent;
+  --checkmark-border-color: transparent;
+  --checkmark-border-width: 0px;
+}
+
+:host([type="bullet"][appearance="soft"]), :host([type="bullet"][appearance="solid"]) {
+  --checkmark-border-color: transparent;
+  --checkmark-border-width: 0px;
+}
+
 :host([disabled]:not([disabled="false"])) {
   --checkmark-background-color: var(--joy-scheme-disabled);
   --checkmark-border-color: var(--joy-scheme-disabled);
@@ -365,6 +382,19 @@ export function checkmarkElementJoyStyle() {
   --checkmark-background-color: var(--joy-scheme-highlight);
 }
 
+:host([type="bullet"][checked]) [part="checkmark"]:after {
+  background-color: currentColor;
+  border-color: currentColor;
+}
+
+:host([type="bullet"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-border-color: var(--joy-scheme-disabled);
+}
+
+:host([type="bullet"][appearance="solid"]) {
+  --checkmark-background-color: var(--joy-scheme-highlight);
+}
+
 :host([type="bullet"][appearance="outline"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
   --checkmark-foreground-color: var(--joy-color-primary-500);
   --checkmark-border-color: var(--joy-color-primary-500);
@@ -375,6 +405,31 @@ export function checkmarkElementJoyStyle() {
   --checkmark-background-color: var(--joy-color-primary-100);
 }
 
+:host([type="bullet"][appearance="plain"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-primary-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-primary-100);
+  --checkmark-foreground-color: var(--joy-color-primary-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-primary-200);
+}
+
+:host([type="bullet"][appearance="solid"][variant="primary"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-primary-0);
+}
+
+:host([type="bullet"][appearance="solid"][variant="primary"][checked]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-primary-500);
+}
+
+:host([type="bullet"][appearance="solid"][variant="primary"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-primary-600);
+}
+
 :host([type="bullet"][appearance="outline"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
   --checkmark-foreground-color: var(--joy-color-secondary-500);
   --checkmark-border-color: var(--joy-color-secondary-500);
@@ -385,6 +440,31 @@ export function checkmarkElementJoyStyle() {
   --checkmark-background-color: var(--joy-color-secondary-100);
 }
 
+:host([type="bullet"][appearance="plain"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-secondary-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-secondary-100);
+  --checkmark-foreground-color: var(--joy-color-secondary-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-secondary-200);
+}
+
+:host([type="bullet"][appearance="solid"][variant="secondary"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-secondary-0);
+}
+
+:host([type="bullet"][appearance="solid"][variant="secondary"][checked]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-secondary-500);
+}
+
+:host([type="bullet"][appearance="solid"][variant="secondary"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-secondary-600);
+}
+
 :host([type="bullet"][appearance="outline"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
   --checkmark-foreground-color: var(--joy-color-tertiary-500);
   --checkmark-border-color: var(--joy-color-tertiary-500);
@@ -395,6 +475,31 @@ export function checkmarkElementJoyStyle() {
   --checkmark-background-color: var(--joy-color-tertiary-100);
 }
 
+:host([type="bullet"][appearance="plain"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-tertiary-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-tertiary-100);
+  --checkmark-foreground-color: var(--joy-color-tertiary-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-tertiary-200);
+}
+
+:host([type="bullet"][appearance="solid"][variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-tertiary-0);
+}
+
+:host([type="bullet"][appearance="solid"][variant="tertiary"][checked]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-tertiary-500);
+}
+
+:host([type="bullet"][appearance="solid"][variant="tertiary"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-tertiary-600);
+}
+
 :host([type="bullet"][appearance="outline"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
   --checkmark-foreground-color: var(--joy-color-danger-500);
   --checkmark-border-color: var(--joy-color-danger-500);
@@ -405,6 +510,31 @@ export function checkmarkElementJoyStyle() {
   --checkmark-background-color: var(--joy-color-danger-100);
 }
 
+:host([type="bullet"][appearance="plain"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-danger-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-danger-100);
+  --checkmark-foreground-color: var(--joy-color-danger-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-danger-200);
+}
+
+:host([type="bullet"][appearance="solid"][variant="danger"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-danger-0);
+}
+
+:host([type="bullet"][appearance="solid"][variant="danger"][checked]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-danger-500);
+}
+
+:host([type="bullet"][appearance="solid"][variant="danger"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-danger-600);
+}
+
 :host([type="bullet"][appearance="outline"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
   --checkmark-foreground-color: var(--joy-color-warning-500);
   --checkmark-border-color: var(--joy-color-warning-500);
@@ -415,6 +545,31 @@ export function checkmarkElementJoyStyle() {
   --checkmark-background-color: var(--joy-color-warning-100);
 }
 
+:host([type="bullet"][appearance="plain"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-warning-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-warning-100);
+  --checkmark-foreground-color: var(--joy-color-warning-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-warning-200);
+}
+
+:host([type="bullet"][appearance="solid"][variant="warning"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-warning-0);
+}
+
+:host([type="bullet"][appearance="solid"][variant="warning"][checked]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-warning-500);
+}
+
+:host([type="bullet"][appearance="solid"][variant="warning"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-warning-600);
+}
+
 :host([type="bullet"][appearance="outline"][variant="success"]:not([disabled]:not([disabled="false"]))) {
   --checkmark-foreground-color: var(--joy-color-success-500);
   --checkmark-border-color: var(--joy-color-success-500);
@@ -425,6 +580,31 @@ export function checkmarkElementJoyStyle() {
   --checkmark-background-color: var(--joy-color-success-100);
 }
 
+:host([type="bullet"][appearance="plain"][variant="success"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-success-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="success"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-success-100);
+  --checkmark-foreground-color: var(--joy-color-success-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-success-200);
+}
+
+:host([type="bullet"][appearance="solid"][variant="success"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-success-0);
+}
+
+:host([type="bullet"][appearance="solid"][variant="success"][checked]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-success-500);
+}
+
+:host([type="bullet"][appearance="solid"][variant="success"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-success-600);
+}
+
 :host([type="bullet"][appearance="outline"][variant="info"]:not([disabled]:not([disabled="false"]))) {
   --checkmark-foreground-color: var(--joy-color-info-500);
   --checkmark-border-color: var(--joy-color-info-500);
@@ -435,6 +615,31 @@ export function checkmarkElementJoyStyle() {
   --checkmark-background-color: var(--joy-color-info-100);
 }
 
+:host([type="bullet"][appearance="plain"][variant="info"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-info-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="info"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-info-100);
+  --checkmark-foreground-color: var(--joy-color-info-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-info-200);
+}
+
+:host([type="bullet"][appearance="solid"][variant="info"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-info-0);
+}
+
+:host([type="bullet"][appearance="solid"][variant="info"][checked]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-info-500);
+}
+
+:host([type="bullet"][appearance="solid"][variant="info"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-info-600);
+}
+
 :host([type="bullet"][appearance="outline"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
   --checkmark-foreground-color: var(--joy-color-highlight-500);
   --checkmark-border-color: var(--joy-color-highlight-500);
@@ -445,6 +650,31 @@ export function checkmarkElementJoyStyle() {
   --checkmark-background-color: var(--joy-color-highlight-100);
 }
 
+:host([type="bullet"][appearance="plain"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-highlight-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-highlight-100);
+  --checkmark-foreground-color: var(--joy-color-highlight-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-highlight-200);
+}
+
+:host([type="bullet"][appearance="solid"][variant="highlight"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-highlight-0);
+}
+
+:host([type="bullet"][appearance="solid"][variant="highlight"][checked]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-highlight-500);
+}
+
+:host([type="bullet"][appearance="solid"][variant="highlight"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-highlight-600);
+}
+
 :host([type="bullet"][appearance="outline"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
   --checkmark-foreground-color: var(--joy-color-neutral-500);
   --checkmark-border-color: var(--joy-color-neutral-500);
@@ -455,6 +685,35 @@ export function checkmarkElementJoyStyle() {
   --checkmark-background-color: var(--joy-color-neutral-100);
 }
 
+:host([type="bullet"][appearance="plain"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-neutral-500);
+}
+
+:host([type="bullet"][appearance="soft"]) {
+  --checkmark-background-color: var(--joy-color-neutral-50);
+}
+
+:host([type="bullet"][appearance="soft"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-neutral-100);
+  --checkmark-foreground-color: var(--joy-color-neutral-500);
+}
+
+:host([type="bullet"][appearance="soft"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-neutral-200);
+}
+
+:host([type="bullet"][appearance="solid"][variant="neutral"]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-foreground-color: var(--joy-color-neutral-0);
+}
+
+:host([type="bullet"][appearance="solid"][variant="neutral"][checked]:not([disabled]:not([disabled="false"]))) {
+  --checkmark-background-color: var(--joy-color-neutral-500);
+}
+
+:host([type="bullet"][appearance="solid"][variant="neutral"]:not([disabled]:not([disabled="false"])):hover) {
+  --checkmark-background-color: var(--joy-color-neutral-600);
+}
+
 :host([type="hook"]:not([disabled]:not([disabled="false"])):hover) {
   --checkmark-border-color: var(--joy-scheme-disabled);
 }

package/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Joy.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckmarkElement.Joy.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Joy.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,wBAAwB;IACpC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAmwBT,CAAC;AACN,CAAC"}
+{"version":3,"file":"CheckmarkElement.Joy.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Joy.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,wBAAwB;IACpC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAsgCT,CAAC;AACN,CAAC"}

package/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Memphis.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CheckmarkElement.Memphis.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Memphis.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,4BAA4B,IAAI,SAAS,CA2OxD"}
+{"version":3,"file":"CheckmarkElement.Memphis.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Memphis.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,4BAA4B,IAAI,SAAS,CA4PxD"}

package/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Memphis.js

@@ -34,6 +34,11 @@ export function checkmarkElementMemphisStyle() {
   --checkmark-padding-right: calc(var(--memphis-layout-space) / 4);
   --checkmark-padding-top: calc(var(--memphis-layout-space) / 4);
   --checkmark-shadow: var(--memphis-elevation-none);
+  --checkmark-shadow-blur: unset;
+  --checkmark-shadow-color: unset;
+  --checkmark-shadow-offset-x: unset;
+  --checkmark-shadow-offset-y: unset;
+  --checkmark-shadow-spread: unset;
   --checkmark-thickness: var(--memphis-layout-thickness);
   --checkmark-transition-duration: var(--memphis-duration-short);
   --checkmark-transition-mode: ease;
@@ -113,6 +118,7 @@ export function checkmarkElementMemphisStyle() {
   height: calc(var(--checkmark-box-size) / 2 - 6px);
   border-radius: calc((var(--checkmark-box-size) / 2 - 6px) / 2);
   margin-left: calc(var(--checkmark-thickness) * 2 - var(--checkmark-border-width));
+  box-shadow: var(--checkmark-shadow-offset-x) var(--checkmark-shadow-offset-y) var(--checkmark-shadow-blur) var(--checkmark-shadow-spread) var(--checkmark-shadow-color);
   transition: all .3s cubic-bezier(.27, .01, .38, 1.06);
   display: block;
   position: absolute;
@@ -189,7 +195,7 @@ export function checkmarkElementMemphisStyle() {
   position: absolute;
   top: 50%;
   left: 50%;
-  transform: scaleX(-1)rotate(135deg)translateZ(0)translate(calc(-50% - 1px), calc(1px - 50%));
+  transform: scaleX(-1) rotate(135deg) translateZ(0) translate(calc(-50% - 1px), calc(1px - 50%));
 }
 
 @keyframes hook {
@@ -230,7 +236,7 @@ export function checkmarkElementMemphisStyle() {
   position: absolute;
   top: 25%;
   left: 50%;
-  transform: scaleX(-1)rotate(0)translateZ(0)translate(-50%, -50%);
+  transform: scaleX(-1) rotate(0) translateZ(0) translate(-50%, -50%);
 }
 
 :host([type="hook"][appearance="plain"]) {
@@ -244,6 +250,17 @@ export function checkmarkElementMemphisStyle() {
   --checkmark-border-width: 0px;
 }
 
+:host([type="bullet"][appearance="plain"]) {
+  --checkmark-background-color: transparent;
+  --checkmark-border-color: transparent;
+  --checkmark-border-width: 0px;
+}
+
+:host([type="bullet"][appearance="soft"]), :host([type="bullet"][appearance="solid"]) {
+  --checkmark-border-color: transparent;
+  --checkmark-border-width: 0px;
+}
+
     `;
 }
 //# sourceMappingURL=CheckmarkElement.Memphis.js.map

package/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Memphis.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckmarkElement.Memphis.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Memphis.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,4BAA4B;IACxC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAyOT,CAAC;AACN,CAAC"}
+{"version":3,"file":"CheckmarkElement.Memphis.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Checkmark/Themes/CheckmarkElement.Memphis.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,4BAA4B;IACxC,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA0PT,CAAC;AACN,CAAC"}

package/Controls/Components/Primitives/Code/CodeElement.d.ts

@@ -1,6 +1,6 @@
 import { CustomElement } from '../../Abstracts/CustomElement';
 import type { ICodeElementProps } from './ICodeElementProps';
-declare const CodeElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
+declare const CodeElement_base: (abstract new (...args: Array<any>) => import("../../../Behaviors/Themeable").IThemeableProps) & (abstract new (...args: Array<any>) => import("../../../Behaviors/Variantable").IVariantableProps) & typeof CustomElement & import("../../../Behaviors/Themeable").IThemeableCtor;
 /**
  * Code - An inline code display element for rendering code snippets and technical text.
  *
@@ -38,12 +38,6 @@ declare const CodeElement_base: (abstract new (...args: Array<any>) => import(".
  * </script>
  * ```
  *
- * @example
- * Function signature:
- * ```html
- * <p>Call <mosaik-code text="fetch(url, options)"></mosaik-code> to make HTTP requests.</p>
- * ```
- *
  * @public
  */
 export declare class CodeElement extends CodeElement_base implements ICodeElementProps {
@@ -53,8 +47,8 @@ export declare class CodeElement extends CodeElement_base implements ICodeElemen
      */
     constructor();
     /**
-     * Returns the `{@link is}` property.
-     * The `{@link is}` property represents natural name of this element.
+     * Returns the `is` property.
+     * The `is` property represents natural name of this element.
      *
      * @public
      * @static

package/Controls/Components/Primitives/Code/CodeElement.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Code/CodeElement.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;;AAQ7D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,qBAUa,WACT,SAAQ,gBACR,YAAW,iBAAiB;IAI5B,OAAO,CAAC,KAAK,CAAS;IAMtB;;OAEG;;IAWH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;OAKG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IACD,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAK5B;CAIJ;AAED;;GAEG;AACH,yBAAiB,WAAW,CAAC;IACzB,KAAY,KAAK,GAAG,iBAAiB,CAAC;CACzC;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,aAAa,EAAE,WAAW,CAAC;KAC9B;CACJ"}
+{"version":3,"file":"CodeElement.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Code/CodeElement.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAE9D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;;AAM7D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,qBAUa,WACT,SAAQ,gBACR,YAAW,iBAAiB;IAI5B,OAAO,CAAC,KAAK,CAAS;IAMtB;;OAEG;;IAWH;;;;;;;OAOG;IACH,WAAkB,EAAE,IAAI,MAAM,CAE7B;IAED;;;;;OAKG;IACH,IACW,IAAI,IAAI,MAAM,CAExB;IACD,IAAW,IAAI,CAAC,KAAK,EAAE,MAAM,EAK5B;CAIJ;AAED;;GAEG;AACH,yBAAiB,WAAW,CAAC;IACzB,KAAY,KAAK,GAAG,iBAAiB,CAAC;CACzC;AAED;;GAEG;AACH,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,aAAa,EAAE,WAAW,CAAC;KAC9B;CACJ"}

package/Controls/Components/Primitives/Code/CodeElement.js

@@ -8,14 +8,15 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 var __metadata = (this && this.__metadata) || function (k, v) {
     if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
 };
+import { Themeable } from '../../../Behaviors/Themeable';
+import { Variantable } from '../../../Behaviors/Variantable';
 import { Attribute } from '../../../Decorators/AttributeDecorator';
 import { Component } from '../../../Decorators/ComponentDecorator';
 import { CustomElement } from '../../Abstracts/CustomElement';
 import { codeElementTemplate } from './CodeElementTemplate';
+import { codeElementCosmopolitanStyle } from './Themes/CodeElement.Cosmopolitan';
 import { codeElementJoyStyle } from './Themes/CodeElement.Joy';
 import { codeElementMemphisStyle } from './Themes/CodeElement.Memphis';
-import { codeElementCosmopolitanStyle } from './Themes/CodeElement.Cosmopolitan';
-import { Themeable } from '../../../Behaviors/Themeable';
 // #endregion
 /**
  * Code - An inline code display element for rendering code snippets and technical text.
@@ -54,15 +55,9 @@ import { Themeable } from '../../../Behaviors/Themeable';
  * </script>
  * ```
  *
- * @example
- * Function signature:
- * ```html
- * <p>Call <mosaik-code text="fetch(url, options)"></mosaik-code> to make HTTP requests.</p>
- * ```
- *
  * @public
  */
-let CodeElement = class CodeElement extends Themeable(CustomElement) {
+let CodeElement = class CodeElement extends Themeable(Variantable(CustomElement)) {
     // #region Fields
     _text;
     // #endregion
@@ -77,8 +72,8 @@ let CodeElement = class CodeElement extends Themeable(CustomElement) {
     // #endregion
     // #region Properties
     /**
-     * Returns the `{@link is}` property.
-     * The `{@link is}` property represents natural name of this element.
+     * Returns the `is` property.
+     * The `is` property represents natural name of this element.
      *
      * @public
      * @static

package/Controls/Components/Primitives/Code/CodeElement.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Code/CodeElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAC;AACvE,OAAO,EAAE,4BAA4B,EAAE,MAAM,mCAAmC,CAAC;AACjF,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAEzD,aAAa;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AAWI,IAAM,WAAW,GAAjB,MAAM,WACT,SAAQ,SAAS,CAAC,aAAa,CAAC;IAGhC,iBAAiB;IAET,KAAK,CAAS;IAEtB,aAAa;IAEb,eAAe;IAEf;;OAEG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;IACpB,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;;OAOG;IACI,MAAM,KAAK,EAAE;QAChB,OAAO,aAAa,CAAC;IACzB,CAAC;IAED;;;;;OAKG;IACH,IACW,IAAI;QACX,OAAO,IAAI,CAAC,KAAK,CAAC;IACtB,CAAC;IACD,IAAW,IAAI,CAAC,KAAa;QACzB,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE,CAAC;YACvB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;QAC/B,CAAC;IACL,CAAC;CAIJ,CAAA;AAbG;IAAC,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;uCAG3B;AA9CQ,WAAW;IAVvB,SAAS,CAAC;QACP,QAAQ,EAAE,aAAa;QACvB,QAAQ,EAAE,mBAAmB;QAC7B,MAAM,EAAE;YACJ,GAAG,EAAE,mBAAmB;YACxB,OAAO,EAAE,uBAAuB;YAChC,YAAY,EAAE,4BAA4B;SAC7C;QACD,OAAO,EAAE,EAAE;KACd,CAAC;;GACW,WAAW,CAwDvB"}
+{"version":3,"file":"CodeElement.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Code/CodeElement.ts"],"names":[],"mappings":"AAAA,kBAAkB;;;;;;;;;;AAElB,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,SAAS,EAAE,MAAM,wCAAwC,CAAC;AACnE,OAAO,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAC9D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAE5D,OAAO,EAAE,4BAA4B,EAAE,MAAM,mCAAmC,CAAC;AACjF,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAC/D,OAAO,EAAE,uBAAuB,EAAE,MAAM,8BAA8B,CAAC;AACvE,aAAa;AAEb;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AAWI,IAAM,WAAW,GAAjB,MAAM,WACT,SAAQ,SAAS,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC;IAG7C,iBAAiB;IAET,KAAK,CAAS;IAEtB,aAAa;IAEb,eAAe;IAEf;;OAEG;IACH;QACI,KAAK,EAAE,CAAC;QAER,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC;IACpB,CAAC;IAED,aAAa;IAEb,qBAAqB;IAErB;;;;;;;OAOG;IACI,MAAM,KAAK,EAAE;QAChB,OAAO,aAAa,CAAC;IACzB,CAAC;IAED;;;;;OAKG;IACH,IACW,IAAI;QACX,OAAO,IAAI,CAAC,KAAK,CAAC;IACtB,CAAC;IACD,IAAW,IAAI,CAAC,KAAa;QACzB,IAAI,IAAI,CAAC,KAAK,KAAK,KAAK,EAAE,CAAC;YACvB,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;QAC/B,CAAC;IACL,CAAC;CAIJ,CAAA;AAbG;IAAC,SAAS,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;;;uCAG3B;AA9CQ,WAAW;IAVvB,SAAS,CAAC;QACP,QAAQ,EAAE,aAAa;QACvB,QAAQ,EAAE,mBAAmB;QAC7B,MAAM,EAAE;YACJ,GAAG,EAAE,mBAAmB;YACxB,OAAO,EAAE,uBAAuB;YAChC,YAAY,EAAE,4BAA4B;SAC7C;QACD,OAAO,EAAE,EAAE;KACd,CAAC;;GACW,WAAW,CAwDvB"}

package/Controls/Components/Primitives/Code/CodeElementTemplate.d.ts

@@ -1,7 +1,7 @@
 import { type TemplateResult } from '../../../../Dom/Html';
 import type { CodeElement } from './CodeElement';
 /**
- * The template of the {@link CodeElement}.
+ * The template of the `CodeElement`.
  *
  * @public
  */

package/Controls/Components/Primitives/Code/CodeElementTemplate.js

@@ -2,7 +2,7 @@
 import { html } from '../../../../Dom/Html';
 // #endregion
 /**
- * The template of the {@link CodeElement}.
+ * The template of the `CodeElement`.
  *
  * @public
  */

package/Controls/Components/Primitives/Code/ICodeElementProps.d.ts

@@ -1,9 +1,10 @@
+import { IVariantableProps } from '../../../Behaviors/Variantable';
 /**
- * Represents the `{@link ICodeElementProps}` interface.
+ * Represents the `ICodeElementProps` interface.
  *
  * @public
  */
-export interface ICodeElementProps {
+export interface ICodeElementProps extends IVariantableProps {
     text: string;
 }
 //# sourceMappingURL=ICodeElementProps.d.ts.map

package/Controls/Components/Primitives/Code/ICodeElementProps.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ICodeElementProps.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Code/ICodeElementProps.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,MAAM,WAAW,iBAAiB;IAE9B,IAAI,EAAE,MAAM,CAAC;CAEhB"}
+{"version":3,"file":"ICodeElementProps.d.ts","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Code/ICodeElementProps.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AAInE;;;;GAIG;AACH,MAAM,WAAW,iBACb,SAAQ,iBAAiB;IAEzB,IAAI,EAAE,MAAM,CAAC;CAEhB"}

package/Controls/Components/Primitives/Code/ICodeElementProps.js

@@ -1,2 +1,3 @@
+//#region Imports
 export {};
 //# sourceMappingURL=ICodeElementProps.js.map

package/Controls/Components/Primitives/Code/ICodeElementProps.js.map

@@ -1 +1 @@
-{"version":3,"file":"ICodeElementProps.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Code/ICodeElementProps.ts"],"names":[],"mappings":""}
+{"version":3,"file":"ICodeElementProps.js","sourceRoot":"","sources":["../../../../../src/Controls/Components/Primitives/Code/ICodeElementProps.ts"],"names":[],"mappings":"AAAA,iBAAiB"}

package/Controls/Components/Primitives/Code/Themes/CodeElement.Joy.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CodeElement.Joy.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Code/Themes/CodeElement.Joy.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,mBAAmB,IAAI,SAAS,CAqE/C"}
+{"version":3,"file":"CodeElement.Joy.d.ts","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Code/Themes/CodeElement.Joy.ts"],"names":[],"mappings":"AASA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI7D;;GAEG;AACH,wBAAgB,mBAAmB,IAAI,SAAS,CA6G/C"}

package/Controls/Components/Primitives/Code/Themes/CodeElement.Joy.js

@@ -78,6 +78,46 @@ export function codeElementJoyStyle() {
   overflow: hidden;
 }
 
+:host([disabled]:not([disabled="false"])) {
+  --code-foreground-color: var(--joy-scheme-disabled);
+}
+
+:host([variant="primary"]:not([disabled]:not([disabled="false"]))) {
+  --code-foreground-color: var(--joy-color-primary-500);
+}
+
+:host([variant="secondary"]:not([disabled]:not([disabled="false"]))) {
+  --code-foreground-color: var(--joy-color-secondary-500);
+}
+
+:host([variant="tertiary"]:not([disabled]:not([disabled="false"]))) {
+  --code-foreground-color: var(--joy-color-tertiary-500);
+}
+
+:host([variant="danger"]:not([disabled]:not([disabled="false"]))) {
+  --code-foreground-color: var(--joy-color-danger-500);
+}
+
+:host([variant="warning"]:not([disabled]:not([disabled="false"]))) {
+  --code-foreground-color: var(--joy-color-warning-500);
+}
+
+:host([variant="success"]:not([disabled]:not([disabled="false"]))) {
+  --code-foreground-color: var(--joy-color-success-500);
+}
+
+:host([variant="info"]:not([disabled]:not([disabled="false"]))) {
+  --code-foreground-color: var(--joy-color-info-500);
+}
+
+:host([variant="highlight"]:not([disabled]:not([disabled="false"]))) {
+  --code-foreground-color: var(--joy-color-highlight-500);
+}
+
+:host([variant="neutral"]:not([disabled]:not([disabled="false"]))) {
+  --code-foreground-color: var(--joy-color-neutral-500);
+}
+
     `;
 }
 //# sourceMappingURL=CodeElement.Joy.js.map

package/Controls/Components/Primitives/Code/Themes/CodeElement.Joy.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodeElement.Joy.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Code/Themes/CodeElement.Joy.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,mBAAmB;IAC/B,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAmET,CAAC;AACN,CAAC"}
+{"version":3,"file":"CodeElement.Joy.js","sourceRoot":"","sources":["../../../../../../src/Controls/Components/Primitives/Code/Themes/CodeElement.Joy.ts"],"names":[],"mappings":"AAAA,iFAAiF;AACjF,mBAAmB;AACnB,yCAAyC;AACzC,qGAAqG;AACrG,oBAAoB;AACpB,iFAAiF;AAEjF,kBAAkB;AAElB,OAAO,EAAE,GAAG,EAAkB,MAAM,wBAAwB,CAAC;AAE7D,aAAa;AAEb;;GAEG;AACH,MAAM,UAAU,mBAAmB;IAC/B,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA2GT,CAAC;AACN,CAAC"}