@warp-ds/elements 2.3.0-next.9 → 2.3.1

package/dist/packages/link/link.stories.d.ts

@@ -13,8 +13,10 @@ export declare const Negative: Story;
 export declare const NegativeQuiet: Story;
 export declare const Utility: Story;
 export declare const UtilityQuiet: Story;
-export declare const Link: Story;
-export declare const Pill: Story;
-export declare const Small: Story;
 export declare const Quiet: Story;
+export declare const Overlay: Story;
+export declare const OverlayInverted: Story;
+export declare const OverlayQuiet: Story;
+export declare const OverlayInvertedQuiet: Story;
+export declare const Small: Story;
 export declare const FullWidth: Story;

package/dist/packages/link/link.stories.js

@@ -60,35 +60,45 @@ export const UtilityQuiet = {
         target: '_new',
     },
 };
-export const Link = {
+export const Quiet = {
     args: {
-        variant: 'link',
+        variant: 'quiet',
         href: 'http://developer.mozilla.org',
         target: '_new',
     },
 };
-export const Pill = {
+export const Overlay = {
     args: {
-        variant: 'pill',
+        variant: 'overlay',
         href: 'http://developer.mozilla.org',
         target: '_new',
     },
-    render(args) {
-        return html `<w-link ${spread(prespread(args))}>💙</w-link>`;
+};
+export const OverlayInverted = {
+    args: {
+        variant: 'overlayInverted',
+        href: 'http://developer.mozilla.org',
+        target: '_new',
     },
 };
-export const Small = {
+export const OverlayQuiet = {
     args: {
-        variant: 'primary',
-        small: true,
+        variant: 'overlayQuiet',
         href: 'http://developer.mozilla.org',
         target: '_new',
     },
 };
-export const Quiet = {
+export const OverlayInvertedQuiet = {
     args: {
-        variant: 'secondary',
-        quiet: true,
+        variant: 'overlayInvertedQuiet',
+        href: 'http://developer.mozilla.org',
+        target: '_new',
+    },
+};
+export const Small = {
+    args: {
+        variant: 'primary',
+        small: true,
         href: 'http://developer.mozilla.org',
         target: '_new',
     },

package/dist/packages/link/styles.js

@@ -91,6 +91,10 @@ export const styles = css `.w-button,
         --color: var(--w-s-color-text);
         --border-width: 0px;
     }
+    .w-button--quiet {
+        --background: transparent;
+        --border-width: 0px;
+    }
     .w-button--overlay {
         --background: var(--w-color-background);
         --background-hover: var(--w-color-background-hover);
@@ -132,6 +136,38 @@ export const styles = css `.w-button,
         --font-weight: normal;
         display: inline;
     }
+    .w-button--overlay {
+        --background: var(--w-color-background);
+        --background-hover: var(--w-color-background-hover);
+        --background-active: var(--w-color-background-active);
+        --color: var(--w-s-color-text);
+        --border-radius: 9999px;
+        --border-width: 0px;
+    }
+    .w-button--overlay-quiet {
+        --background: transparent;
+        --background-hover: var(--w-s-color-background-hover);
+        --background-active: var(--w-s-color-background-active);
+        --color: var(--w-s-color-text);
+        --border-radius: 9999px;
+        --border-width: 0px;
+    }
+    .w-button--overlay-inverted {
+        --background: var(--w-s-color-background-inverted);
+        --background-hover: var(--w-s-color-background-inverted-hover);
+        --background-active: var(--w-s-color-background-inverted-active);
+        --color: var(--w-s-color-text-inverted);
+        --border-radius: 9999px;
+        --border-width: 0px;
+    }
+    .w-button--overlay-inverted-quiet {
+        --background: transparent;
+        --background-hover: var(--w-s-color-background-inverted-hover);
+        --background-active: var(--w-s-color-background-inverted-active);
+        --color: var(--w-s-color-text-inverted);
+        --border-radius: 9999px;
+        --border-width: 0px;
+    }
 
     /* States config,  selects --loading as well since loading is always supposed to be disabled */
     .w-button:disabled,