@vsn-ux/gaia-styles 0.4.5 → 0.4.6

package/dist/all-no-reset-10pt.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 :root {
   --ga-color-black: #000000;
@@ -1867,6 +1867,91 @@
       font-weight: 600;
     }
   }
+  .ga-link {
+    display: inline-flex;
+    height: calc(0.4rem * 5);
+    cursor: pointer;
+    align-items: center;
+    justify-content: center;
+    gap: calc(0.4rem * 1);
+    border-radius: var(--ga-radius);
+    padding-inline: calc(0.4rem * 0.5);
+    vertical-align: middle;
+    font-size: calc(
+    var(--ga-text-md-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+    line-height: var(--tw-leading, calc(
+    var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+    letter-spacing: var(--tw-tracking, calc(
+    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+  ));
+    --tw-font-weight: 500;
+    font-weight: 500;
+    white-space: nowrap;
+    color: var(--ga-color-text-action);
+    --tw-numeric-spacing: tabular-nums;
+    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
+    &.ga-link--inline {
+      text-decoration-line: underline;
+      text-decoration-color: var(--ga-color-primary-90);
+      text-decoration-thickness: 1px;
+    }
+    &.ga-link--small {
+      height: calc(0.4rem * 4);
+      font-size: calc(
+    var(--ga-text-sm-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+      line-height: var(--tw-leading, calc(
+    var(--ga-text-sm-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+      letter-spacing: var(--tw-tracking, 0);
+    }
+    &.ga-link--large {
+      height: calc(0.4rem * 6);
+      font-size: calc(
+    var(--ga-text-lg-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+      line-height: var(--tw-leading, calc(
+    var(--ga-text-lg-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+      letter-spacing: var(--tw-tracking, calc(
+    var(--ga-text-lg-tracking) * var(--ga-base-scaling-factor, 1)
+  ));
+    }
+    &.ga-link--disabled {
+      cursor: not-allowed;
+      color: var(--ga-color-text-disabled);
+      .ga-link__icon {
+        color: var(--ga-color-icon-disabled);
+      }
+    }
+    &:not(.ga-link--disabled) {
+      &:visited {
+        color: var(--ga-color-text-link-visited);
+        text-decoration-color: var(--ga-color-text-link-visited);
+      }
+      &:hover {
+        color: var(--ga-color-text-action-hover);
+        text-decoration-line: underline;
+        text-decoration-color: var(--ga-color-primary-90);
+        text-decoration-thickness: 1px;
+      }
+      &:active {
+        color: var(--ga-color-text-action);
+        text-decoration-color: var(--ga-color-text-action);
+      }
+      &:focus-visible {
+        outline-style: var(--tw-outline-style);
+        outline-width: 2px;
+        outline-offset: 2px;
+        outline-color: var(--ga-color-border-focus);
+      }
+    }
+    :not(:visited) .ga-link__icon {
+      color: var(--ga-color-icon-primary);
+    }
+  }
 }
 :root {
   --ga-base-scaling-factor: 1.6;
@@ -1978,6 +2063,26 @@
   syntax: "*";
   inherits: false;
 }
+@property --tw-ordinal {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-slashed-zero {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-figure {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-spacing {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-fraction {
+  syntax: "*";
+  inherits: false;
+}
 @layer properties {
   @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
     *, ::before, ::after, ::backdrop {
@@ -2004,6 +2109,11 @@
       --tw-translate-y: 0;
       --tw-translate-z: 0;
       --tw-duration: initial;
+      --tw-ordinal: initial;
+      --tw-slashed-zero: initial;
+      --tw-numeric-figure: initial;
+      --tw-numeric-spacing: initial;
+      --tw-numeric-fraction: initial;
     }
   }
 }

package/dist/all-no-reset.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 :root {
   --ga-color-black: #000000;
@@ -1867,6 +1867,91 @@
       font-weight: 600;
     }
   }
+  .ga-link {
+    display: inline-flex;
+    height: calc(0.25rem * 5);
+    cursor: pointer;
+    align-items: center;
+    justify-content: center;
+    gap: calc(0.25rem * 1);
+    border-radius: var(--ga-radius);
+    padding-inline: calc(0.25rem * 0.5);
+    vertical-align: middle;
+    font-size: calc(
+    var(--ga-text-md-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+    line-height: var(--tw-leading, calc(
+    var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+    letter-spacing: var(--tw-tracking, calc(
+    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+  ));
+    --tw-font-weight: 500;
+    font-weight: 500;
+    white-space: nowrap;
+    color: var(--ga-color-text-action);
+    --tw-numeric-spacing: tabular-nums;
+    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
+    &.ga-link--inline {
+      text-decoration-line: underline;
+      text-decoration-color: var(--ga-color-primary-90);
+      text-decoration-thickness: 1px;
+    }
+    &.ga-link--small {
+      height: calc(0.25rem * 4);
+      font-size: calc(
+    var(--ga-text-sm-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+      line-height: var(--tw-leading, calc(
+    var(--ga-text-sm-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+      letter-spacing: var(--tw-tracking, 0);
+    }
+    &.ga-link--large {
+      height: calc(0.25rem * 6);
+      font-size: calc(
+    var(--ga-text-lg-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+      line-height: var(--tw-leading, calc(
+    var(--ga-text-lg-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+      letter-spacing: var(--tw-tracking, calc(
+    var(--ga-text-lg-tracking) * var(--ga-base-scaling-factor, 1)
+  ));
+    }
+    &.ga-link--disabled {
+      cursor: not-allowed;
+      color: var(--ga-color-text-disabled);
+      .ga-link__icon {
+        color: var(--ga-color-icon-disabled);
+      }
+    }
+    &:not(.ga-link--disabled) {
+      &:visited {
+        color: var(--ga-color-text-link-visited);
+        text-decoration-color: var(--ga-color-text-link-visited);
+      }
+      &:hover {
+        color: var(--ga-color-text-action-hover);
+        text-decoration-line: underline;
+        text-decoration-color: var(--ga-color-primary-90);
+        text-decoration-thickness: 1px;
+      }
+      &:active {
+        color: var(--ga-color-text-action);
+        text-decoration-color: var(--ga-color-text-action);
+      }
+      &:focus-visible {
+        outline-style: var(--tw-outline-style);
+        outline-width: 2px;
+        outline-offset: 2px;
+        outline-color: var(--ga-color-border-focus);
+      }
+    }
+    :not(:visited) .ga-link__icon {
+      color: var(--ga-color-icon-primary);
+    }
+  }
 }
 @property --tw-border-style {
   syntax: "*";
@@ -1975,6 +2060,26 @@
   syntax: "*";
   inherits: false;
 }
+@property --tw-ordinal {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-slashed-zero {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-figure {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-spacing {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-fraction {
+  syntax: "*";
+  inherits: false;
+}
 @layer properties {
   @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
     *, ::before, ::after, ::backdrop {
@@ -2001,6 +2106,11 @@
       --tw-translate-y: 0;
       --tw-translate-z: 0;
       --tw-duration: initial;
+      --tw-ordinal: initial;
+      --tw-slashed-zero: initial;
+      --tw-numeric-figure: initial;
+      --tw-numeric-spacing: initial;
+      --tw-numeric-fraction: initial;
     }
   }
 }

package/dist/all.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 :root {
   --ga-color-black: #000000;
@@ -2017,6 +2017,91 @@
       font-weight: 600;
     }
   }
+  .ga-link {
+    display: inline-flex;
+    height: calc(0.25rem * 5);
+    cursor: pointer;
+    align-items: center;
+    justify-content: center;
+    gap: calc(0.25rem * 1);
+    border-radius: var(--ga-radius);
+    padding-inline: calc(0.25rem * 0.5);
+    vertical-align: middle;
+    font-size: calc(
+    var(--ga-text-md-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+    line-height: var(--tw-leading, calc(
+    var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+    letter-spacing: var(--tw-tracking, calc(
+    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+  ));
+    --tw-font-weight: 500;
+    font-weight: 500;
+    white-space: nowrap;
+    color: var(--ga-color-text-action);
+    --tw-numeric-spacing: tabular-nums;
+    font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
+    &.ga-link--inline {
+      text-decoration-line: underline;
+      text-decoration-color: var(--ga-color-primary-90);
+      text-decoration-thickness: 1px;
+    }
+    &.ga-link--small {
+      height: calc(0.25rem * 4);
+      font-size: calc(
+    var(--ga-text-sm-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+      line-height: var(--tw-leading, calc(
+    var(--ga-text-sm-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+      letter-spacing: var(--tw-tracking, 0);
+    }
+    &.ga-link--large {
+      height: calc(0.25rem * 6);
+      font-size: calc(
+    var(--ga-text-lg-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+      line-height: var(--tw-leading, calc(
+    var(--ga-text-lg-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+      letter-spacing: var(--tw-tracking, calc(
+    var(--ga-text-lg-tracking) * var(--ga-base-scaling-factor, 1)
+  ));
+    }
+    &.ga-link--disabled {
+      cursor: not-allowed;
+      color: var(--ga-color-text-disabled);
+      .ga-link__icon {
+        color: var(--ga-color-icon-disabled);
+      }
+    }
+    &:not(.ga-link--disabled) {
+      &:visited {
+        color: var(--ga-color-text-link-visited);
+        text-decoration-color: var(--ga-color-text-link-visited);
+      }
+      &:hover {
+        color: var(--ga-color-text-action-hover);
+        text-decoration-line: underline;
+        text-decoration-color: var(--ga-color-primary-90);
+        text-decoration-thickness: 1px;
+      }
+      &:active {
+        color: var(--ga-color-text-action);
+        text-decoration-color: var(--ga-color-text-action);
+      }
+      &:focus-visible {
+        outline-style: var(--tw-outline-style);
+        outline-width: 2px;
+        outline-offset: 2px;
+        outline-color: var(--ga-color-border-focus);
+      }
+    }
+    :not(:visited) .ga-link__icon {
+      color: var(--ga-color-icon-primary);
+    }
+  }
 }
 @property --tw-border-style {
   syntax: "*";
@@ -2125,6 +2210,26 @@
   syntax: "*";
   inherits: false;
 }
+@property --tw-ordinal {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-slashed-zero {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-figure {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-spacing {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-fraction {
+  syntax: "*";
+  inherits: false;
+}
 @layer properties {
   @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
     *, ::before, ::after, ::backdrop {
@@ -2151,6 +2256,11 @@
       --tw-translate-y: 0;
       --tw-translate-z: 0;
       --tw-duration: initial;
+      --tw-ordinal: initial;
+      --tw-slashed-zero: initial;
+      --tw-numeric-figure: initial;
+      --tw-numeric-spacing: initial;
+      --tw-numeric-fraction: initial;
     }
   }
 }

package/dist/base.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 body {
   font-family: Inter, ui-sans-serif, system-ui, sans-serif;
   font-feature-settings: 'liga' 1, 'calt' 1;

package/dist/components/avatar.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-avatar {
   display: inline-flex;

package/dist/components/badge.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-badge {
   display: inline-block;

package/dist/components/button.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-button {
   display: inline-flex;

package/dist/components/card.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-card {
   display: inline-block;

package/dist/components/checkbox.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-checkbox {
   position: relative;

package/dist/components/dropdown.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-dropdown {
   display: flex;

package/dist/components/form-field.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-form-field {
   display: flex;

package/dist/components/input.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-input {
   display: flex;

package/dist/components/link.css

@@ -0,0 +1,129 @@
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
+@layer properties;
+.ga-link {
+  display: inline-flex;
+  height: calc(0.25rem * 5);
+  cursor: pointer;
+  align-items: center;
+  justify-content: center;
+  gap: calc(0.25rem * 1);
+  border-radius: var(--ga-radius);
+  padding-inline: calc(0.25rem * 0.5);
+  vertical-align: middle;
+  font-size: calc(
+    var(--ga-text-md-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+  line-height: var(--tw-leading, calc(
+    var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+  letter-spacing: var(--tw-tracking, calc(
+    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+  ));
+  --tw-font-weight: 500;
+  font-weight: 500;
+  white-space: nowrap;
+  color: var(--ga-color-text-action);
+  --tw-numeric-spacing: tabular-nums;
+  font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
+  &.ga-link--inline {
+    text-decoration-line: underline;
+    text-decoration-color: var(--ga-color-primary-90);
+    text-decoration-thickness: 1px;
+  }
+  &.ga-link--small {
+    height: calc(0.25rem * 4);
+    font-size: calc(
+    var(--ga-text-sm-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+    line-height: var(--tw-leading, calc(
+    var(--ga-text-sm-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+    letter-spacing: var(--tw-tracking, 0);
+  }
+  &.ga-link--large {
+    height: calc(0.25rem * 6);
+    font-size: calc(
+    var(--ga-text-lg-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+    line-height: var(--tw-leading, calc(
+    var(--ga-text-lg-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+    letter-spacing: var(--tw-tracking, calc(
+    var(--ga-text-lg-tracking) * var(--ga-base-scaling-factor, 1)
+  ));
+  }
+  &.ga-link--disabled {
+    cursor: not-allowed;
+    color: var(--ga-color-text-disabled);
+    .ga-link__icon {
+      color: var(--ga-color-icon-disabled);
+    }
+  }
+  &:not(.ga-link--disabled) {
+    &:visited {
+      color: var(--ga-color-text-link-visited);
+      text-decoration-color: var(--ga-color-text-link-visited);
+    }
+    &:hover {
+      color: var(--ga-color-text-action-hover);
+      text-decoration-line: underline;
+      text-decoration-color: var(--ga-color-primary-90);
+      text-decoration-thickness: 1px;
+    }
+    &:active {
+      color: var(--ga-color-text-action);
+      text-decoration-color: var(--ga-color-text-action);
+    }
+    &:focus-visible {
+      outline-style: var(--tw-outline-style);
+      outline-width: 2px;
+      outline-offset: 2px;
+      outline-color: var(--ga-color-border-focus);
+    }
+  }
+  :not(:visited) .ga-link__icon {
+    color: var(--ga-color-icon-primary);
+  }
+}
+@property --tw-font-weight {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ordinal {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-slashed-zero {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-figure {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-spacing {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-fraction {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-outline-style {
+  syntax: "*";
+  inherits: false;
+  initial-value: solid;
+}
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *, ::before, ::after, ::backdrop {
+      --tw-font-weight: initial;
+      --tw-ordinal: initial;
+      --tw-slashed-zero: initial;
+      --tw-numeric-figure: initial;
+      --tw-numeric-spacing: initial;
+      --tw-numeric-fraction: initial;
+      --tw-outline-style: solid;
+    }
+  }
+}

package/dist/components/menu.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-menu {
   display: flex;

package/dist/components/notification.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-notification {
   display: inline-flex;

package/dist/components/radio.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-radio-group {
   display: inline-flex;

package/dist/components/segmented-control.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-segmented-control {
   display: inline-flex;

package/dist/components/select.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-native-select {
   position: relative;

package/dist/components/switch.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-switch {
   position: relative;

package/dist/components/tag.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-tag {
   box-sizing: content-box;

package/dist/components/text-area.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-text-area {
   display: flex;

package/dist/components/tooltip.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-tooltip {
   position: relative;

package/dist/components.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.1.4 | MIT License | https://tailwindcss.com */
 @layer properties;
 .ga-avatar {
   display: inline-flex;
@@ -1638,6 +1638,91 @@
     font-weight: 600;
   }
 }
+.ga-link {
+  display: inline-flex;
+  height: calc(0.25rem * 5);
+  cursor: pointer;
+  align-items: center;
+  justify-content: center;
+  gap: calc(0.25rem * 1);
+  border-radius: var(--ga-radius);
+  padding-inline: calc(0.25rem * 0.5);
+  vertical-align: middle;
+  font-size: calc(
+    var(--ga-text-md-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+  line-height: var(--tw-leading, calc(
+    var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+  letter-spacing: var(--tw-tracking, calc(
+    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+  ));
+  --tw-font-weight: 500;
+  font-weight: 500;
+  white-space: nowrap;
+  color: var(--ga-color-text-action);
+  --tw-numeric-spacing: tabular-nums;
+  font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
+  &.ga-link--inline {
+    text-decoration-line: underline;
+    text-decoration-color: var(--ga-color-primary-90);
+    text-decoration-thickness: 1px;
+  }
+  &.ga-link--small {
+    height: calc(0.25rem * 4);
+    font-size: calc(
+    var(--ga-text-sm-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+    line-height: var(--tw-leading, calc(
+    var(--ga-text-sm-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+    letter-spacing: var(--tw-tracking, 0);
+  }
+  &.ga-link--large {
+    height: calc(0.25rem * 6);
+    font-size: calc(
+    var(--ga-text-lg-font-size) * var(--ga-base-scaling-factor, 1)
+  );
+    line-height: var(--tw-leading, calc(
+    var(--ga-text-lg-line-height) * var(--ga-base-scaling-factor, 1)
+  ));
+    letter-spacing: var(--tw-tracking, calc(
+    var(--ga-text-lg-tracking) * var(--ga-base-scaling-factor, 1)
+  ));
+  }
+  &.ga-link--disabled {
+    cursor: not-allowed;
+    color: var(--ga-color-text-disabled);
+    .ga-link__icon {
+      color: var(--ga-color-icon-disabled);
+    }
+  }
+  &:not(.ga-link--disabled) {
+    &:visited {
+      color: var(--ga-color-text-link-visited);
+      text-decoration-color: var(--ga-color-text-link-visited);
+    }
+    &:hover {
+      color: var(--ga-color-text-action-hover);
+      text-decoration-line: underline;
+      text-decoration-color: var(--ga-color-primary-90);
+      text-decoration-thickness: 1px;
+    }
+    &:active {
+      color: var(--ga-color-text-action);
+      text-decoration-color: var(--ga-color-text-action);
+    }
+    &:focus-visible {
+      outline-style: var(--tw-outline-style);
+      outline-width: 2px;
+      outline-offset: 2px;
+      outline-color: var(--ga-color-border-focus);
+    }
+  }
+  :not(:visited) .ga-link__icon {
+    color: var(--ga-color-icon-primary);
+  }
+}
 @property --tw-border-style {
   syntax: "*";
   inherits: false;
@@ -1745,6 +1830,26 @@
   syntax: "*";
   inherits: false;
 }
+@property --tw-ordinal {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-slashed-zero {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-figure {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-spacing {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-numeric-fraction {
+  syntax: "*";
+  inherits: false;
+}
 @layer properties {
   @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
     *, ::before, ::after, ::backdrop {
@@ -1771,6 +1876,11 @@
       --tw-translate-y: 0;
       --tw-translate-z: 0;
       --tw-duration: initial;
+      --tw-ordinal: initial;
+      --tw-slashed-zero: initial;
+      --tw-numeric-figure: initial;
+      --tw-numeric-spacing: initial;
+      --tw-numeric-fraction: initial;
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vsn-ux/gaia-styles",
-  "version": "0.4.5",
+  "version": "0.4.6",
   "type": "module",
   "scripts": {
     "dev": "storybook dev -p 6006",
@@ -40,6 +40,7 @@
     "@types/react-dom": "^18.3.5",
     "@vitejs/plugin-react": "^4.3.4",
     "chokidar": "^4.0.3",
+    "chromatic": "^11.27.0",
     "glob": "^11.0.1",
     "globals": "^15.15.0",
     "husky": "^9.1.7",
@@ -51,6 +52,7 @@
     "react-dom": "^18.3.1",
     "semantic-release": "^24.2.3",
     "storybook": "^8.6.9",
+    "storybook-addon-pseudo-states": "^4.0.3",
     "tailwindcss": "^4.0.17",
     "typescript": "~5.6.3",
     "typescript-eslint": "^8.28.0",

package/src/styles/components/link.css

@@ -0,0 +1,45 @@
+.ga-link {
+  @apply text-md inline-flex h-5 cursor-pointer items-center justify-center gap-1 rounded px-0.5 align-middle font-medium whitespace-nowrap text-(--ga-color-text-action) tabular-nums;
+
+  &.ga-link--inline {
+    @apply underline decoration-(--ga-color-primary-90) decoration-1;
+  }
+
+  &.ga-link--small {
+    @apply h-4 text-sm;
+  }
+
+  &.ga-link--large {
+    @apply h-6 text-lg;
+  }
+
+  &.ga-link--disabled {
+    @apply cursor-not-allowed text-(--ga-color-text-disabled);
+
+    .ga-link__icon {
+      @apply text-(--ga-color-icon-disabled);
+    }
+  }
+
+  &:not(.ga-link--disabled) {
+    &:visited {
+      @apply text-(--ga-color-text-link-visited) decoration-(--ga-color-text-link-visited);
+    }
+
+    &:hover {
+      @apply text-(--ga-color-text-action-hover) underline decoration-(--ga-color-primary-90) decoration-1;
+    }
+
+    &:active {
+      @apply text-(--ga-color-text-action) decoration-(--ga-color-text-action);
+    }
+
+    &:focus-visible {
+      @apply outline-2 outline-offset-2 outline-(--ga-color-border-focus);
+    }
+  }
+
+  :not(:visited) .ga-link__icon {
+    @apply text-(--ga-color-icon-primary);
+  }
+}

package/src/styles/components.css

@@ -15,3 +15,4 @@
 @import './components/tag.css';
 @import './components/text-area.css';
 @import './components/tooltip.css';
+@import './components/link.css';