move config file out of src (#648)

deven-org · Dec 7, 2023 · 235ef24 · 235ef24
1 parent c046fec
commit 235ef24
Show file tree

Hide file tree

Showing 4 changed files with 53 additions and 5 deletions.
diff --git a/packages/ui-library/src/components/actions/buttons/icon-button/index.css.ts b/packages/ui-library/src/components/actions/buttons/icon-button/index.css.ts
@@ -4,7 +4,7 @@ import { componentTokens } from "../../../../foundation/_tokens-generated/__comp
 import { semanticTokens } from "../../../../foundation/_tokens-generated/__semantic-tokens.Light.generated.mjs";
 
 const { IconButton } = componentTokens.Actions;
-const { Global } = semanticTokens;
+const { Global, Action } = semanticTokens;
 
 export const styleCustom = typeSafeNestedCss`
   .focus-layer {
@@ -70,6 +70,30 @@ export const styleCustom = typeSafeNestedCss`
   }
   
   .loading {
+
+   &.blr-icon-button:hover, &.blr-icon-button:focus{
+      cursor: auto;
+      text-decoration: none;
+      &.cta{
+        background-color: ${Action.CTA.SurfaceFill.Loading}
+      }
+      &.primary{
+        background-color: ${Action.Primary.SurfaceFill.Loading}
+      }
+      &.secondary{
+        background-color: ${Action.Secondary.SurfaceFill.Loading}
+      }
+      &.silent{
+        background-color: ${Action.Silent.SurfaceFill.Loading}
+      }
+      &.destructive{
+        background-color: ${Action.Destructive.SurfaceFill.Loading}
+      }
+      &.Encourage{
+        background-color: ${Action.Encourage.SurfaceFill.Loading}
+      }
+    }
+
     & > .icon {
       visibility: hidden;
     }

diff --git a/packages/ui-library/src/components/actions/buttons/icon-button/index.ts b/packages/ui-library/src/components/actions/buttons/icon-button/index.ts
@@ -92,7 +92,7 @@ export class BlrIconButton extends LitElement {
           role="button"
           @keydown=${this.onClick}
         >
-          ${this.focused ? html`<span class="focus-layer"></span>` : nothing}
+          ${this.focused && !this.loading ? html`<span class="focus-layer"></span>` : nothing}
           ${this.loading
             ? BlrLoaderRenderFunction({
                 size: loaderSizeVariant,

diff --git a/packages/ui-library/src/components/actions/buttons/text-button/index.css.ts b/packages/ui-library/src/components/actions/buttons/text-button/index.css.ts
@@ -4,7 +4,7 @@ import { componentTokens } from "../../../../foundation/_tokens-generated/__comp
 import { semanticTokens } from "../../../../foundation/_tokens-generated/__semantic-tokens.Light.generated.mjs";
 
 const { TextButton } = componentTokens.Actions;
-const { Global } = semanticTokens;
+const { Global, Action } = semanticTokens;
 
 export const styleCustom = typeSafeNestedCss`
   .focus-layer {
@@ -75,6 +75,30 @@ export const styleCustom = typeSafeNestedCss`
     & > .flex-container {
       visibility: hidden;
     }
+
+    &.blr-text-button:hover, &.blr-text-button:focus {
+      cursor: auto;
+      text-decoration: none;
+      &.cta{
+        background-color: ${Action.CTA.SurfaceFill.Loading}
+      }
+      &.primary{
+        background-color: ${Action.Primary.SurfaceFill.Loading}
+      }
+      &.secondary{
+        background-color: ${Action.Secondary.SurfaceFill.Loading}
+      }
+      &.silent{
+        background-color: ${Action.Silent.SurfaceFill.Loading}
+      }
+      &.destructive{
+        background-color: ${Action.Destructive.SurfaceFill.Loading}
+      }
+      &.Encourage{
+        background-color: ${Action.Encourage.SurfaceFill.Loading}
+      }
+
+    }
   }
 
   .block {

diff --git a/packages/ui-library/src/components/actions/buttons/text-button/index.ts b/packages/ui-library/src/components/actions/buttons/text-button/index.ts
@@ -83,9 +83,9 @@ export class BlrTextButton extends LitElement {
       const loaderVariant = determineLoaderVariant(this.variant);
 
       const loaderSizeVariant = getComponentConfigToken([
-        'SizeVariant',
         'Action',
         this.size.toUpperCase(),
+        'SizeVariant',
         'Loader',
       ]).toLowerCase() as FormSizesType;
 
@@ -130,7 +130,7 @@ export class BlrTextButton extends LitElement {
           @keydown=${this.onClick}
           id=${this.buttonId || nothing}
         >
-          ${this.focused ? html`<span class="focus-layer"></span>` : nothing}
+          ${this.focused && !this.loading ? html`<span class="focus-layer"></span>` : nothing}
           ${this.loading
             ? html`
                 ${BlrLoaderRenderFunction({