@breadstone/mosaik-themes 0.0.77 → 0.0.80

package/Themes/___bootstrap-tokens.css

@@ -77,4 +77,15 @@
   --typography-headline6-text-decoration: none;
   --typography-headline6-text-transform: none;
   --elevation-none: none;
+  --size-tiny: 2px;
+  --size-small: 4px;
+  --size-medium: 8px;
+  --size-large: 16px;
+  --size-giant: 32px;
+  --size-key-tiny: "tiny";
+  --size-key-small: "small";
+  --size-key-medium: "medium";
+  --size-key-large: "large";
+  --size-key-giant: "giant";
+  --size-key: var(--size-key-tiny) var(--size-key-small) var(--size-key-medium) var(--size-key-large) var(--size-key-giant);
 }

package/Themes/___cosmopolitan-tokens.css

@@ -179,6 +179,16 @@
   --elevation-dark-extrabold-spread-1: 0px;
   --elevation-dark-extrabold-color-0: rgba(0, 0, 0, 0.24);
   --elevation-dark-extrabold-color-1: rgba(0, 0, 0, 0.28);
+  --size-tiny: 2px;
+  --size-small: 4px;
+  --size-medium: 8px;
+  --size-large: 16px;
+  --size-giant: 32px;
+  --size-key-tiny: "tiny";
+  --size-key-small: "small";
+  --size-key-medium: "medium";
+  --size-key-large: "large";
+  --size-key-giant: "giant";
   --typography-key-heading: "heading";
   --typography-key-content: "content";
   --typography-key-button: "button";
@@ -191,18 +201,13 @@
   --variant-primary: "primary";
   --variant-secondary: "secondary";
   --variant-tertiary: "tertiary";
-  --size-tiny: "tiny";
-  --size-small: "small";
-  --size-medium: "medium";
-  --size-large: "large";
-  --size-giant: "giant";
   --duration-short: 200ms;
   --duration-medium: 400ms;
   --duration-long: 600ms;
   --typography-heading-font-family: var(--font-family);
   --typography-content-font-family: var(--font-family);
   --typography-button-font-family: var(--font-family);
+  --size-key: var(--size-key-tiny) var(--size-key-small) var(--size-key-medium) var(--size-key-large) var(--size-key-giant);
   --elevation-key: var(--elevation-key-light) var(--elevation-key-semilight) var(--elevation-key-regular) var(--elevation-key-semibold) var(--elevation-key-bold) var(--elevation-key-extrabold);
   --variant: var(--variant-primary);
-  --size: var(--size-tiny) var(--size-small) var(--size-medium) var(--size-large) var(--size-giant);
 }

package/Themes/___fluent-tokens.css

@@ -8,6 +8,16 @@
   --color-light-secondary: #005A9E;
   --color-light-tertiary: #003E6B;
   --elevation-none: none;
+  --size-tiny: 2px;
+  --size-small: 4px;
+  --size-medium: 8px;
+  --size-large: 16px;
+  --size-giant: 32px;
+  --size-key-tiny: "tiny";
+  --size-key-small: "small";
+  --size-key-medium: "medium";
+  --size-key-large: "large";
+  --size-key-giant: "giant";
   --duration-duration-ultra-fast: 50ms;
   --duration-duration-faster: 100ms;
   --duration-duration-fast: 150ms;
@@ -16,4 +26,5 @@
   --duration-duration-slow: 300ms;
   --duration-duration-slower: 400ms;
   --duration-duration-ultra-slow: 500ms;
+  --size-key: var(--size-key-tiny) var(--size-key-small) var(--size-key-medium) var(--size-key-large) var(--size-key-giant);
 }

package/Themes/___joy-tokens.css

@@ -20,7 +20,7 @@
   --scheme-dark-middlelight: #757575;
   --scheme-dark-lowlight: #a3a3a3;
   --scheme-dark-transparent: rgba(255, 255, 255, 0);
-  --scheme-dark-semi-transparent: rgba(0, 0, 0, 0.67);
+  --scheme-dark-semi-transparent: rgba(255, 255, 255, 0.03);
   --scheme-dark-disabled: #474747;
   --scheme-dark-contrast: #000000;
   --scheme-dark-selection: rgba(204, 204, 204, 0.44);
@@ -433,6 +433,16 @@
   --elevation-dark-extrabold-spread-1: 0px;
   --elevation-dark-extrabold-color-0: rgba(0, 0, 0, 0.24);
   --elevation-dark-extrabold-color-1: rgba(0, 0, 0, 0.28);
+  --size-tiny: 2px;
+  --size-small: 4px;
+  --size-medium: 8px;
+  --size-large: 16px;
+  --size-giant: 32px;
+  --size-key-tiny: "tiny";
+  --size-key-small: "small";
+  --size-key-medium: "medium";
+  --size-key-large: "large";
+  --size-key-giant: "giant";
   --typography-key-headline1: "headline1";
   --typography-key-headline2: "headline2";
   --typography-key-headline3: "headline3";
@@ -466,11 +476,6 @@
   --variant-info: "info";
   --variant-highlight: "highlight";
   --variant-neutral: "neutral";
-  --size-tiny: "tiny";
-  --size-small: "small";
-  --size-medium: "medium";
-  --size-large: "large";
-  --size-giant: "giant";
   --duration-short: 200ms;
   --duration-medium: 400ms;
   --duration-long: 600ms;
@@ -487,10 +492,10 @@
   --typography-caption-font-family: var(--font-family);
   --typography-button-font-family: var(--font-family);
   --typography-overline-font-family: var(--font-family);
+  --size-key: var(--size-key-tiny) var(--size-key-small) var(--size-key-medium) var(--size-key-large) var(--size-key-giant);
   --elevation2-light-light: var(--elevation-light-light-offset-x-0) var(--elevation-light-light-offset-y-0) var(--elevation-light-light-blur-0) var(--elevation-light-light-spread-0) var(--elevation-light-light-color-0), var(--elevation-light-light-offset-x-1) var(--elevation-light-light-offset-y-1) var(--elevation-light-light-blur-1) var(--elevation-light-light-spread-1) var(--elevation-light-light-color-1);
   --elevation-key: var(--elevation-key-light) var(--elevation-key-semilight) var(--elevation-key-regular) var(--elevation-key-semibold) var(--elevation-key-bold) var(--elevation-key-extrabold);
   --appearance: var(--appearance-default) var(--appearance-outline) var(--appearance-plain) var(--appearance-soft) var(--appearance-solid);
   --variant: var(--variant-primary) var(--variant-secondary) var(--variant-tertiary) var(--variant-danger) var(--variant-warning) var(--variant-success) var(--variant-info) var(--variant-highlight) var(--variant-neutral);
-  --size: var(--size-tiny) var(--size-small) var(--size-medium) var(--size-large) var(--size-giant);
   --duration: var(--duration-short) var(--duration-medium) var(--duration-long);
 }

package/Themes/___material-tokens.css

@@ -8,4 +8,15 @@
   --color-light-secondary: #3700B3;
   --color-light-tertiary: #03DAC6;
   --elevation-none: none;
+  --size-tiny: 2px;
+  --size-small: 4px;
+  --size-medium: 8px;
+  --size-large: 16px;
+  --size-giant: 32px;
+  --size-key-tiny: "tiny";
+  --size-key-small: "small";
+  --size-key-medium: "medium";
+  --size-key-large: "large";
+  --size-key-giant: "giant";
+  --size-key: var(--size-key-tiny) var(--size-key-small) var(--size-key-medium) var(--size-key-large) var(--size-key-giant);
 }

package/Themes/___retro-tokens.css

@@ -303,6 +303,16 @@
   --elevation-dark-extrabold-offset-y-0: 7px;
   --elevation-dark-extrabold-blur-0: 0px;
   --elevation-dark-extrabold-spread-0: 0px;
+  --size-tiny: 2px;
+  --size-small: 4px;
+  --size-medium: 8px;
+  --size-large: 16px;
+  --size-giant: 32px;
+  --size-key-tiny: "tiny";
+  --size-key-small: "small";
+  --size-key-medium: "medium";
+  --size-key-large: "large";
+  --size-key-giant: "giant";
   --typography-key-headline1: "headline1";
   --typography-key-headline2: "headline2";
   --typography-key-headline3: "headline3";
@@ -334,11 +344,6 @@
   --variant-danger: "danger";
   --variant-success: "success";
   --variant-neutral: "neutral";
-  --size-tiny: "tiny";
-  --size-small: "small";
-  --size-medium: "medium";
-  --size-large: "large";
-  --size-giant: "giant";
   --duration-short: 200ms;
   --duration-medium: 400ms;
   --duration-long: 600ms;
@@ -379,8 +384,8 @@
   --elevation-dark-bold-color-0: var(--scheme-dark-contrast);
   --elevation-dark-extrabold: 7px 7px 0px 0px var(--scheme-dark-contrast);
   --elevation-dark-extrabold-color-0: var(--scheme-dark-contrast);
+  --size-key: var(--size-key-tiny) var(--size-key-small) var(--size-key-medium) var(--size-key-large) var(--size-key-giant);
   --elevation-key: var(--elevation-key-light) var(--elevation-key-semilight) var(--elevation-key-regular) var(--elevation-key-semibold) var(--elevation-key-bold) var(--elevation-key-extrabold);
   --appearance: var(--appearance-default) var(--appearance-outline) var(--appearance-plain) var(--appearance-soft) var(--appearance-solid);
   --variant: var(--variant-primary) var(--variant-secondary) var(--variant-info) var(--variant-warning) var(--variant-danger) var(--variant-success) var(--variant-neutral);
-  --size: var(--size-tiny) var(--size-small) var(--size-medium) var(--size-large) var(--size-giant);
 }

package/Themes/bootstrap-tokens.scss

@@ -76,3 +76,14 @@ $typography-headline6-letter-spacing: 0;
 $typography-headline6-text-decoration: none;
 $typography-headline6-text-transform: none;
 $elevation-none: none;
+$size-tiny: 2px;
+$size-small: 4px;
+$size-medium: 8px;
+$size-large: 16px;
+$size-giant: 32px;
+$size-key-tiny: "tiny";
+$size-key-small: "small";
+$size-key-medium: "medium";
+$size-key-large: "large";
+$size-key-giant: "giant";
+$size-key: $size-key-tiny $size-key-small $size-key-medium $size-key-large $size-key-giant;

package/Themes/bootstrap.scss

@@ -147,6 +147,17 @@ $typography-headline6-letter-spacing: 0;
 $typography-headline6-text-decoration: none;
 $typography-headline6-text-transform: none;
 $elevation-none: none;
+$size-tiny: 2px;
+$size-small: 4px;
+$size-medium: 8px;
+$size-large: 16px;
+$size-giant: 32px;
+$size-key-tiny: "tiny";
+$size-key-small: "small";
+$size-key-medium: "medium";
+$size-key-large: "large";
+$size-key-giant: "giant";
+$size-key: $size-key-tiny $size-key-small $size-key-medium $size-key-large $size-key-giant;
 @mixin bootstrap-style($radius: $layout-radius, $thickness: $layout-thickness, $space: $layout-space) {
     $theme: 'bootstrap';
 }

package/Themes/cosmopolitan-tokens.scss

@@ -178,6 +178,16 @@ $elevation-dark-extrabold-spread-0: 0px;
 $elevation-dark-extrabold-spread-1: 0px;
 $elevation-dark-extrabold-color-0: rgba(0, 0, 0, 0.24);
 $elevation-dark-extrabold-color-1: rgba(0, 0, 0, 0.28);
+$size-tiny: 2px;
+$size-small: 4px;
+$size-medium: 8px;
+$size-large: 16px;
+$size-giant: 32px;
+$size-key-tiny: "tiny";
+$size-key-small: "small";
+$size-key-medium: "medium";
+$size-key-large: "large";
+$size-key-giant: "giant";
 $typography-key-heading: "heading";
 $typography-key-content: "content";
 $typography-key-button: "button";
@@ -190,17 +200,12 @@ $elevation-key-extrabold: "extrabold";
 $variant-primary: "primary";
 $variant-secondary: "secondary";
 $variant-tertiary: "tertiary";
-$size-tiny: "tiny";
-$size-small: "small";
-$size-medium: "medium";
-$size-large: "large";
-$size-giant: "giant";
 $duration-short: 200ms;
 $duration-medium: 400ms;
 $duration-long: 600ms;
 $typography-heading-font-family: $font-family;
 $typography-content-font-family: $font-family;
 $typography-button-font-family: $font-family;
+$size-key: $size-key-tiny $size-key-small $size-key-medium $size-key-large $size-key-giant;
 $elevation-key: $elevation-key-light $elevation-key-semilight $elevation-key-regular $elevation-key-semibold $elevation-key-bold $elevation-key-extrabold;
 $variant: $variant-primary;
-$size: $size-tiny $size-small $size-medium $size-large $size-giant;

package/Themes/cosmopolitan.scss

@@ -250,6 +250,16 @@ $elevation-dark-extrabold-spread-0: 0px;
 $elevation-dark-extrabold-spread-1: 0px;
 $elevation-dark-extrabold-color-0: rgba(0, 0, 0, 0.24);
 $elevation-dark-extrabold-color-1: rgba(0, 0, 0, 0.28);
+$size-tiny: 2px;
+$size-small: 4px;
+$size-medium: 8px;
+$size-large: 16px;
+$size-giant: 32px;
+$size-key-tiny: "tiny";
+$size-key-small: "small";
+$size-key-medium: "medium";
+$size-key-large: "large";
+$size-key-giant: "giant";
 $typography-key-heading: "heading";
 $typography-key-content: "content";
 $typography-key-button: "button";
@@ -262,20 +272,15 @@ $elevation-key-extrabold: "extrabold";
 $variant-primary: "primary";
 $variant-secondary: "secondary";
 $variant-tertiary: "tertiary";
-$size-tiny: "tiny";
-$size-small: "small";
-$size-medium: "medium";
-$size-large: "large";
-$size-giant: "giant";
 $duration-short: 200ms;
 $duration-medium: 400ms;
 $duration-long: 600ms;
 $typography-heading-font-family: $font-family;
 $typography-content-font-family: $font-family;
 $typography-button-font-family: $font-family;
+$size-key: $size-key-tiny $size-key-small $size-key-medium $size-key-large $size-key-giant;
 $elevation-key: $elevation-key-light $elevation-key-semilight $elevation-key-regular $elevation-key-semibold $elevation-key-bold $elevation-key-extrabold;
 $variant: $variant-primary;
-$size: $size-tiny $size-small $size-medium $size-large $size-giant;
 $_color-light: (
     primary: (
         0: $color-light-primary-0,
@@ -944,6 +949,9 @@ $anchor-props: (
 );
 $app-props: (
   'background-color': var(--cosmopolitan-scheme-background),
+  'border-radius': unset,
+  'drawer-height': 100%,
+  'drawer-width': 320px,
   'font-family': var(--cosmopolitan-typography-body1-font-family),
   'font-letter-spacing': var(--cosmopolitan-typography-body1-letter-spacing),
   'font-line-height': var(--cosmopolitan-typography-body1-line-height),
@@ -1315,6 +1323,10 @@ $button-props: (
   'foreground-color': var(--cosmopolitan-scheme-foreground),
   'gap': var(--cosmopolitan-layout-space),
   'height': auto,
+  'icon-min-width': 36px,
+  'icon-min-height': 36px,
+  'min-height': calc(calc(var(--joy-layout-space) * 5) - calc(var(--joy-layout-space) / 2)),
+  'min-width': 64px,
   'padding-bottom': var(--cosmopolitan-layout-space),
   'padding-left': var(--cosmopolitan-layout-space),
   'padding-right': var(--cosmopolitan-layout-space),
@@ -2371,6 +2383,10 @@ $color-thumb-props: (
   'translate': unset
 );
 $combo-props: (
+  'focus-ring-active-width': 8px,
+  'focus-ring-color': unset,
+  'focus-ring-inward-offset': 2px,
+  'focus-ring-outward-offset': 2px,
   'font-family': unset,
   'font-letter-spacing': unset,
   'font-line-height': unset,
@@ -2459,6 +2475,10 @@ $compound-button-props: (
   'foreground-color': var(--cosmopolitan-scheme-foreground),
   'gap': var(--cosmopolitan-layout-space),
   'height': auto,
+  'icon-min-width': 36px,
+  'icon-min-height': 36px,
+  'min-height': calc(calc(var(--joy-layout-space) * 5) - calc(var(--joy-layout-space) / 2)),
+  'min-width': 64px,
   'padding-bottom': var(--cosmopolitan-layout-space),
   'padding-left': var(--cosmopolitan-layout-space),
   'padding-right': var(--cosmopolitan-layout-space),
@@ -2776,6 +2796,24 @@ $disclosure-props: (
   'transition-property': unset,
   'translate': unset
 );
+$dismiss-props: (
+  'font-family': unset,
+  'font-letter-spacing': unset,
+  'font-line-height': unset,
+  'font-size': unset,
+  'font-text-decoration': unset,
+  'font-text-transform': unset,
+  'font-weight': unset,
+  'gap': unset,
+  'padding-bottom': unset,
+  'padding-left': unset,
+  'padding-right': unset,
+  'padding-top': unset,
+  'transition-duration': unset,
+  'transition-mode': unset,
+  'transition-property': unset,
+  'translate': unset
+);
 $divider-props: (
   'background-color': unset,
   'border-color': unset,
@@ -2910,7 +2948,11 @@ $drop-down-button-props: (
   'font-weight': var(--cosmopolitan-typography-button-font-weight),
   'foreground-color': var(--cosmopolitan-scheme-foreground),
   'gap': var(--cosmopolitan-layout-space),
+  'icon-min-width': 36px,
+  'icon-min-height': 36px,
   'line-height': calc(var(--dropdown-button-font-line-height)  - 4px),
+  'min-height': calc(calc(var(--joy-layout-space) * 5) - calc(var(--joy-layout-space) / 2)),
+  'min-width': 64px,
   'padding-bottom': var(--cosmopolitan-layout-space),
   'padding-left': var(--cosmopolitan-layout-space),
   'padding-right': var(--cosmopolitan-layout-space),
@@ -3023,6 +3065,148 @@ $empty-state-props: (
   'transition-property': unset,
   'translate': unset
 );
+$epg-props: (
+  'background-color': var(--cosmopolitan-scheme-background),
+  'border-color': var(--cosmopolitan-scheme-highlight),
+  'border-radius': 0,
+  'border-style': none,
+  'border-width': var(--cosmopolitan-layout-thickness),
+  'font-family': unset,
+  'font-letter-spacing': unset,
+  'font-line-height': unset,
+  'font-size': unset,
+  'font-text-decoration': unset,
+  'font-text-transform': unset,
+  'font-weight': unset,
+  'foreground-color': var(--cosmopolitan-scheme-foreground),
+  'gap': unset,
+  'padding-bottom': var(--cosmopolitan-layout-space),
+  'padding-left': calc(var(--cosmopolitan-layout-space) * 2),
+  'padding-right': calc(var(--cosmopolitan-layout-space) * 2),
+  'padding-top': var(--cosmopolitan-layout-space),
+  'transition-duration': unset,
+  'transition-mode': unset,
+  'transition-property': unset,
+  'translate': unset
+);
+$epg-channel-props: (
+  'background-color': var(--cosmopolitan-scheme-background),
+  'border-color': var(--cosmopolitan-scheme-highlight),
+  'border-radius': 0,
+  'border-style': none,
+  'border-width': var(--cosmopolitan-layout-thickness),
+  'font-family': unset,
+  'font-letter-spacing': unset,
+  'font-line-height': unset,
+  'font-size': unset,
+  'font-text-decoration': unset,
+  'font-text-transform': unset,
+  'font-weight': unset,
+  'foreground-color': var(--cosmopolitan-scheme-foreground),
+  'gap': unset,
+  'padding-bottom': var(--cosmopolitan-layout-space),
+  'padding-left': calc(var(--cosmopolitan-layout-space) * 2),
+  'padding-right': calc(var(--cosmopolitan-layout-space) * 2),
+  'padding-top': var(--cosmopolitan-layout-space),
+  'transition-duration': unset,
+  'transition-mode': unset,
+  'transition-property': unset,
+  'translate': unset
+);
+$epg-minimap-props: (
+  'background-color': var(--cosmopolitan-scheme-background),
+  'border-color': var(--cosmopolitan-scheme-highlight),
+  'border-radius': 0,
+  'border-style': none,
+  'border-width': var(--cosmopolitan-layout-thickness),
+  'font-family': unset,
+  'font-letter-spacing': unset,
+  'font-line-height': unset,
+  'font-size': unset,
+  'font-text-decoration': unset,
+  'font-text-transform': unset,
+  'font-weight': unset,
+  'foreground-color': var(--cosmopolitan-scheme-foreground),
+  'gap': unset,
+  'padding-bottom': var(--cosmopolitan-layout-space),
+  'padding-left': calc(var(--cosmopolitan-layout-space) * 2),
+  'padding-right': calc(var(--cosmopolitan-layout-space) * 2),
+  'padding-top': var(--cosmopolitan-layout-space),
+  'transition-duration': unset,
+  'transition-mode': unset,
+  'transition-property': unset,
+  'translate': unset
+);
+$epg-now-line-props: (
+  'border-color': var(--cosmopolitan-scheme-highlight),
+  'border-radius': var(--cosmopolitan-layout-radius),
+  'border-style': solid,
+  'border-width': var(--cosmopolitan-layout-thickness),
+  'font-family': unset,
+  'font-letter-spacing': unset,
+  'font-line-height': unset,
+  'font-size': unset,
+  'font-text-decoration': unset,
+  'font-text-transform': unset,
+  'font-weight': unset,
+  'gap': unset,
+  'padding-bottom': unset,
+  'padding-left': unset,
+  'padding-right': unset,
+  'padding-top': unset,
+  'transition-duration': unset,
+  'transition-mode': unset,
+  'transition-property': unset,
+  'translate': unset
+);
+$epg-program-props: (
+  'background-color': var(--cosmopolitan-scheme-background),
+  'border-color': var(--cosmopolitan-scheme-highlight),
+  'border-radius': var(--cosmopolitan-layout-radius),
+  'border-style': solid,
+  'border-width': var(--cosmopolitan-layout-thickness),
+  'font-family': unset,
+  'font-letter-spacing': unset,
+  'font-line-height': unset,
+  'font-size': unset,
+  'font-text-decoration': unset,
+  'font-text-transform': unset,
+  'font-weight': unset,
+  'foreground-color': var(--cosmopolitan-scheme-foreground),
+  'gap': unset,
+  'padding-bottom': var(--cosmopolitan-layout-space),
+  'padding-left': calc(var(--cosmopolitan-layout-space) * 2),
+  'padding-right': calc(var(--cosmopolitan-layout-space) * 2),
+  'padding-top': var(--cosmopolitan-layout-space),
+  'transition-duration': unset,
+  'transition-mode': unset,
+  'transition-property': unset,
+  'translate': unset
+);
+$epg-timeline-props: (
+  'background-color': var(--cosmopolitan-scheme-background),
+  'border-color': var(--cosmopolitan-scheme-highlight),
+  'border-radius': var(--cosmopolitan-layout-radius),
+  'border-style': solid,
+  'border-width': var(--cosmopolitan-layout-thickness),
+  'font-family': unset,
+  'font-letter-spacing': unset,
+  'font-line-height': unset,
+  'font-size': unset,
+  'font-text-decoration': unset,
+  'font-text-transform': unset,
+  'font-weight': unset,
+  'foreground-color': var(--cosmopolitan-scheme-foreground),
+  'gap': unset,
+  'padding-bottom': var(--cosmopolitan-layout-space),
+  'padding-left': calc(var(--cosmopolitan-layout-space) * 2),
+  'padding-right': calc(var(--cosmopolitan-layout-space) * 2),
+  'padding-top': var(--cosmopolitan-layout-space),
+  'transition-duration': unset,
+  'transition-mode': unset,
+  'transition-property': unset,
+  'translate': unset
+);
 $error-props: (
   'background-color': unset,
   'border-color': unset,
@@ -3327,6 +3511,10 @@ $floating-action-button-props: (
   'font-text-transform': unset,
   'font-weight': unset,
   'gap': unset,
+  'icon-min-width': 36px,
+  'icon-min-height': 36px,
+  'min-height': calc(calc(var(--joy-layout-space) * 5) - calc(var(--joy-layout-space) / 2)),
+  'min-width': 64px,
   'padding-bottom': unset,
   'padding-left': unset,
   'padding-right': unset,
@@ -4461,6 +4649,24 @@ $portal-props: (
   'transition-property': unset,
   'translate': unset
 );
+$portal-host-props: (
+  'font-family': unset,
+  'font-letter-spacing': unset,
+  'font-line-height': unset,
+  'font-size': unset,
+  'font-text-decoration': unset,
+  'font-text-transform': unset,
+  'font-weight': unset,
+  'gap': unset,
+  'padding-bottom': unset,
+  'padding-left': unset,
+  'padding-right': unset,
+  'padding-top': unset,
+  'transition-duration': unset,
+  'transition-mode': unset,
+  'transition-property': unset,
+  'translate': unset
+);
 $portal-projection-props: (
   'font-family': unset,
   'font-letter-spacing': unset,
@@ -4637,7 +4843,11 @@ $repeat-button-props: (
   'font-weight': unset,
   'foreground-color': unset,
   'gap': unset,
+  'icon-min-width': 36px,
+  'icon-min-height': 36px,
   'line-height': unset,
+  'min-height': calc(calc(var(--joy-layout-space) * 5) - calc(var(--joy-layout-space) / 2)),
+  'min-width': 64px,
   'padding-bottom': unset,
   'padding-left': unset,
   'padding-right': unset,
@@ -4974,6 +5184,10 @@ $select-props: (
   'border-radius': unset,
   'border-style': unset,
   'border-width': unset,
+  'focus-ring-active-width': 8px,
+  'focus-ring-color': unset,
+  'focus-ring-inward-offset': 2px,
+  'focus-ring-outward-offset': 2px,
   'font-family': unset,
   'font-letter-spacing': unset,
   'font-line-height': unset,
@@ -5261,7 +5475,11 @@ $split-button-props: (
   'font-weight': unset,
   'foreground-color': unset,
   'gap': unset,
+  'icon-min-width': 36px,
+  'icon-min-height': 36px,
   'line-height': unset,
+  'min-height': calc(calc(var(--joy-layout-space) * 5) - calc(var(--joy-layout-space) / 2)),
+  'min-width': 64px,
   'padding-bottom': unset,
   'padding-left': unset,
   'padding-right': unset,
@@ -5700,7 +5918,9 @@ $text-box-props: (
   'padding-left': unset,
   'padding-right': unset,
   'padding-top': unset,
+  'prefix-icon-size': 20px,
   'shadow': unset,
+  'suffix-icon-size': 20px,
   'transition-duration': unset,
   'transition-mode': unset,
   'transition-property': unset,
@@ -5907,7 +6127,11 @@ $toggle-button-props: (
   'foreground-color': var(--cosmopolitan-scheme-foreground),
   'gap': var(--cosmopolitan-layout-space),
   'height': auto,
+  'icon-min-width': 36px,
+  'icon-min-height': 36px,
   'line-height': calc(var(--toggle-button-font-line-height)  - 4px),
+  'min-height': calc(calc(var(--joy-layout-space) * 5) - calc(var(--joy-layout-space) / 2)),
+  'min-width': 64px,
   'padding-bottom': var(--cosmopolitan-layout-space),
   'padding-left': var(--cosmopolitan-layout-space),
   'padding-right': var(--cosmopolitan-layout-space),

package/Themes/fluent-tokens.scss

@@ -7,6 +7,16 @@ $color-light-primary: #0078D4;
 $color-light-secondary: #005A9E;
 $color-light-tertiary: #003E6B;
 $elevation-none: none;
+$size-tiny: 2px;
+$size-small: 4px;
+$size-medium: 8px;
+$size-large: 16px;
+$size-giant: 32px;
+$size-key-tiny: "tiny";
+$size-key-small: "small";
+$size-key-medium: "medium";
+$size-key-large: "large";
+$size-key-giant: "giant";
 $duration-duration-ultra-fast: 50ms;
 $duration-duration-faster: 100ms;
 $duration-duration-fast: 150ms;
@@ -15,3 +25,4 @@ $duration-duration-gentle: 250ms;
 $duration-duration-slow: 300ms;
 $duration-duration-slower: 400ms;
 $duration-duration-ultra-slow: 500ms;
+$size-key: $size-key-tiny $size-key-small $size-key-medium $size-key-large $size-key-giant;

package/Themes/fluent.scss

@@ -78,6 +78,16 @@ $color-light-primary: #0078D4;
 $color-light-secondary: #005A9E;
 $color-light-tertiary: #003E6B;
 $elevation-none: none;
+$size-tiny: 2px;
+$size-small: 4px;
+$size-medium: 8px;
+$size-large: 16px;
+$size-giant: 32px;
+$size-key-tiny: "tiny";
+$size-key-small: "small";
+$size-key-medium: "medium";
+$size-key-large: "large";
+$size-key-giant: "giant";
 $duration-duration-ultra-fast: 50ms;
 $duration-duration-faster: 100ms;
 $duration-duration-fast: 150ms;
@@ -86,6 +96,7 @@ $duration-duration-gentle: 250ms;
 $duration-duration-slow: 300ms;
 $duration-duration-slower: 400ms;
 $duration-duration-ultra-slow: 500ms;
+$size-key: $size-key-tiny $size-key-small $size-key-medium $size-key-large $size-key-giant;
 $_light-colors-map: (
     colorNeutralForeground1: var(--fluent-grey-14-color),
     colorNeutralForeground1Hover: var(--fluent-grey-14-color),
@@ -1534,6 +1545,10 @@ $button-props: (
   'foreground-color': var(--unknown),
   'gap': var(--unknown),
   'height': var(--unknown),
+  'icon-min-width': 36px,
+  'icon-min-height': 36px,
+  'min-height': calc(calc(var(--joy-layout-space) * 5) - calc(var(--joy-layout-space) / 2)),
+  'min-width': 64px,
   'padding-bottom': var(--unknown),
   'padding-left': var(--unknown),
   'padding-right': var(--unknown),
@@ -1566,7 +1581,9 @@ $text-box-props: (
   'padding-left': 12px,
   'padding-right': 12px,
   'padding-top': 8px,
+  'prefix-icon-size': 20px,
   'shadow': var(--theme-elevation-none),
+  'suffix-icon-size': 20px,
   'transition-duration': .2s,
   'transition-mode': ease,
   'transition-property': (background-color, color, border-color, opacity, box-shadow),