fix(ui-library): updating toggle switch selected state, fixing presse…

…d / active state, fixing toggling on / off icons (#352)

packages/ui-library/src/foundation/_tokens-generated/_border-radius.generated.scss

@@ -0,0 +1,14 @@
+/**
+ * Do not edit directly
+ * Generated on Thu, 14 Sep 2023 12:28:27 GMT
+ */
+
+:root {
+  --blr-core-border-radius-base: 4px;
+  --blr-core-border-radius-sm: 2px;
+  --blr-core-border-radius-md: 4px;
+  --blr-core-border-radius-lg: 8px;
+  --blr-core-border-radius-xl: 12px;
+  --blr-core-border-radius-round: 9999px;
+  --blr-core-border-radius-none: 0px;
+}

packages/ui-library/src/foundation/_tokens-generated/_border-width.generated.scss

@@ -0,0 +1,13 @@
+/**
+ * Do not edit directly
+ * Generated on Thu, 14 Sep 2023 12:28:27 GMT
+ */
+
+:root {
+  --blr-core-border-width-base: 1px;
+  --blr-core-border-width-thin: 0.5px;
+  --blr-core-border-width-medium: 1px;
+  --blr-core-border-width-bold: 2px;
+  --blr-core-border-width-heavy: 3px;
+  --blr-core-border-width-none: 0px;
+}

packages/ui-library/src/foundation/_tokens-generated/_font-families.generated.scss

@@ -0,0 +1,9 @@
+/**
+ * Do not edit directly
+ * Generated on Thu, 14 Sep 2023 12:28:27 GMT
+ */
+
+:root {
+  --blr-core-font-families-headlines: 'Source Sans Pro';
+  --blr-core-font-families-text: 'Source Sans Pro';
+}

packages/ui-library/src/foundation/_tokens-generated/_font-sizes.generated.scss

@@ -0,0 +1,20 @@
+/**
+ * Do not edit directly
+ * Generated on Thu, 14 Sep 2023 12:28:27 GMT
+ */
+
+:root {
+  --blr-core-font-sizes-50: 0.03125rem;
+  --blr-core-font-sizes-75: 0.046875rem;
+  --blr-core-font-sizes-87: 0.0546875rem;
+  --blr-core-font-sizes-100: 0.0625rem;
+  --blr-core-font-sizes-125: 0.078125rem;
+  --blr-core-font-sizes-150: 0.09375rem;
+  --blr-core-font-sizes-175: 0.109375rem;
+  --blr-core-font-sizes-200: 0.125rem;
+  --blr-core-font-sizes-250: 0.15625rem;
+  --blr-core-font-sizes-300: 0.1875rem;
+  --blr-core-font-sizes-350: 0.21875rem;
+  --blr-core-font-sizes-400: 0.25rem;
+  --blr-core-font-sizes-450: 0.28125rem;
+}

packages/ui-library/src/foundation/_tokens-generated/_font-weights.generated.scss

@@ -0,0 +1,11 @@
+/**
+ * Do not edit directly
+ * Generated on Thu, 14 Sep 2023 12:28:27 GMT
+ */
+
+:root {
+  --blr-core-font-weights-light: Light;
+  --blr-core-font-weights-regular: Regular;
+  --blr-core-font-weights-semi-bold: SemiBold;
+  --blr-core-font-weights-bold: Bold;
+}

packages/ui-library/src/foundation/_tokens-generated/_letter-spacing.generated.scss

@@ -0,0 +1,12 @@
+/**
+ * Do not edit directly
+ * Generated on Thu, 14 Sep 2023 12:28:27 GMT
+ */
+
+:root {
+  --blr-core-letter-spacing-extra-tight: -1.6%;
+  --blr-core-letter-spacing-tight: -0.8%;
+  --blr-core-letter-spacing-normal: 0%;
+  --blr-core-letter-spacing-loose: 0.8%;
+  --blr-core-letter-spacing-extra-loose: 1.6%;
+}

packages/ui-library/src/foundation/_tokens-generated/_line-heights.generated.scss

@@ -0,0 +1,14 @@
+/**
+ * Do not edit directly
+ * Generated on Thu, 14 Sep 2023 12:28:27 GMT
+ */
+
+:root {
+  --blr-core-line-heights-tight: 110%;
+  --blr-core-line-heights-normal: 150%;
+  --blr-core-line-heights-loose: 160%;
+  --blr-core-line-heights-fix-0-75-rem: 0.75rem;
+  --blr-core-line-heights-fix-1-rem: 1rem;
+  --blr-core-line-heights-fix-1-25-rem: 1.25rem;
+  --blr-core-line-heights-fix-1-5-rem: 1.5rem;
+}

packages/ui-library/src/foundation/_tokens-generated/_pargraph-spacing.generated.scss

@@ -0,0 +1,10 @@
+/**
+ * Do not edit directly
+ * Generated on Thu, 14 Sep 2023 12:28:27 GMT
+ */
+
+:root {
+  --blr-core-pargraph-spacing-50: 0.5rem;
+  --blr-core-pargraph-spacing-100: 1rem;
+  --blr-core-pargraph-spacing-none: 0;
+}

packages/ui-library/src/foundation/_tokens-generated/config-tokens/__component-config.generated.js

@@ -0,0 +1,63 @@
+/**
+ * Do not edit directly
+ * Generated on Thu, 14 Sep 2023 12:28:28 GMT
+ */
+
+export const componentConfig = {
+  Forms: {
+    Checkbox: {
+      SM: { Control: { IconSize: 'SM' } },
+      MD: { Control: { IconSize: 'SM' } },
+      LG: { Control: { IconSize: 'Custom 20px' } },
+    },
+    SM: { CaptionComponent: { IconSize: 'SM' }, InputField: { IconSize: 'MD' } },
+    MD: { CaptionComponent: { IconSize: 'SM' }, InputField: { IconSize: 'MD' } },
+    LG: { CaptionComponent: { IconSize: 'SM' }, InputField: { IconSize: 'MD' } },
+  },
+  Navigation: {
+    TabBar: {
+      Tab: {
+        SM: { Icon: { SizeVariant: 'XS' } },
+        MD: { Icon: { SizeVariant: 'SM' } },
+        LG: { Icon: { SizeVariant: 'SM' } },
+      },
+    },
+  },
+  Action: {
+    Menu: { MenuItem: { IconSize: 'SM' } },
+    TextButton: {
+      XS: { IconSize: 'XXS' },
+      SM: { IconSize: 'XS' },
+      MD: { IconSize: 'XS' },
+      LG: { IconSize: 'SM' },
+      XL: { IconSize: 'SM' },
+    },
+    IconButton: {
+      XS: { IconSize: 'XXS' },
+      SM: { IconSize: 'XS' },
+      MD: { IconSize: 'SM' },
+      LG: { IconSize: 'MD' },
+      XL: { IconSize: 'LG' },
+    },
+    IconDropdown: {
+      XS: { IconSize: 'XXS', ChevronSize: 'XXS' },
+      SM: { IconSize: 'XS', ChevronSize: 'XXS' },
+      MD: { IconSize: 'SM', ChevronSize: 'XS' },
+      LG: { IconSize: 'MD', ChevronSize: 'SM' },
+      XL: { IconSize: 'LG', ChevronSize: 'MD' },
+    },
+    TextDropdown: {
+      XS: { ChevronSize: 'XXS' },
+      SM: { ChevronSize: 'XS' },
+      MD: { ChevronSize: 'XS' },
+      LG: { ChevronSize: 'SM' },
+      XL: { ChevronSize: 'MD' },
+    },
+    StepperButton: { SM: { IconSize: 'SM' }, MD: { IconSize: 'SM' }, LG: { IconSize: 'MD' } },
+    XS: { LoaderSize: 'SM' },
+    SM: { LoaderSize: 'SM' },
+    MD: { LoaderSize: 'MD' },
+    LG: { LoaderSize: 'MD' },
+    XL: { LoaderSize: 'LG' },
+  },
+};

packages/ui-library/src/foundation/component-tokens/toggleSwitch.css.js

@@ -56,7 +56,7 @@ export const { tokenizedLight: toggleSwitchLight, tokenizedDark: toggleSwitchDar
               }
 
               &:active {
-                background-color: ${ToggleSwitch.Control.Background.Unselected.Fill.Hover};
+                background-color: ${ToggleSwitch.Control.Background.Unselected.Fill.Pressed};
               }
 
               &[disabled] {
@@ -76,7 +76,7 @@ export const { tokenizedLight: toggleSwitchLight, tokenizedDark: toggleSwitchDar
               }
 
               &:active {
-                background-color: ${ToggleSwitch.Control.Background.Selected.Fill.Focus};
+                background-color: ${ToggleSwitch.Control.Background.Selected.Fill.Pressed};
               }
 
               &:focus {
@@ -107,14 +107,14 @@ export const { tokenizedLight: toggleSwitchLight, tokenizedDark: toggleSwitchDar
               &::after {
                 content: "";
                 position: absolute;
-                background-color: ${ToggleSwitch.Control.Ay11Icon.Unselected.Fill.Rest};
+                background-color: ${ToggleSwitch.Control.Knob.Surface.Unselected.Fill.Rest};
                 border-radius: 50%;
                 transition: transform 0.2s ease;
               }
             }
 
             & > input:checked + .toggle-switch-slider::after {
-              background-color: ${ToggleSwitch.Control.Foreground.Selected.Fill.Rest};
+              background-color: ${ToggleSwitch.Control.Knob.Surface.Selected.Fill.Rest};
             }
 
             & > .toggle-switch-unselect {