@ds-gn/ui 0.12.0 → 0.12.2

package/dist/components/Background/src/Background.js

@@ -354,12 +354,16 @@ var styles2 = css2`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.co
 @layer properties;
 @layer theme {
   :root, :host {
+    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
     --color-brand-subtle: inherit;
     --color-page: inherit;
     --color-text-primary: inherit;
   }
 }
 @layer utilities {
+  .visible {
+    visibility: visible;
+  }
   .relative {
     position: relative;
   }
@@ -396,6 +400,10 @@ var styles2 = css2`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.co
   .text-text-primary {
     color: var(--color-text-primary);
   }
+  .ease-in-out {
+    --tw-ease: var(--ease-in-out);
+    transition-timing-function: var(--ease-in-out);
+  }
 }
 @property --dsgn-border-sweep-angle {
   syntax: '<angle>';
@@ -444,6 +452,10 @@ var styles2 = css2`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.co
   inherits: false;
   initial-value: 100%;
 }
+@property --tw-ease {
+  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 {
@@ -456,6 +468,7 @@ var styles2 = css2`/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.co
       --tw-gradient-from-position: 0%;
       --tw-gradient-via-position: 50%;
       --tw-gradient-to-position: 100%;
+      --tw-ease: initial;
       --dsgn-border-sweep-angle: 0deg;
     }
   }
@@ -504,6 +517,27 @@ function clsx() {
 var clsx_default = clsx;
 
 // components/Background/src/Background.styles.ts
+import { css as css3 } from "lit";
+var meshStyles = css3`
+  .aurora-mesh {
+    animation: aurora-entrance 1600ms ease-in-out both;
+  }
+
+  @keyframes aurora-entrance {
+    from {
+      opacity: 0;
+    }
+    to {
+      opacity: 1;
+    }
+  }
+
+  @media (prefers-reduced-motion: reduce) {
+    .aurora-mesh {
+      animation: none;
+    }
+  }
+`;
 var variantClasses = {
   solid: "bg-page",
   gradient: ["bg-linear-to-b", "from-brand-subtle", "to-page"]
@@ -517,7 +551,7 @@ var contentClassNames = () => {
 
 // components/Background/src/Background.ts
 class Background extends Base {
-  static styles = [Base.styles, Background_default];
+  static styles = [Base.styles, Background_default, meshStyles];
   constructor() {
     super();
     this._inView = new IntersectionController(this, {

package/dist/components/Background/src/Background.styles.d.ts

@@ -1,3 +1,4 @@
 import type { BackgroundVariantType } from './Background.props.js';
+export declare const meshStyles: import("lit").CSSResult;
 export declare const wrapperClassNames: (variant: BackgroundVariantType) => string;
 export declare const contentClassNames: () => string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ds-gn/ui",
-  "version": "0.12.0",
+  "version": "0.12.2",
   "description": "UI components for the DS-GN Design System",
   "type": "module",
   "exports": {
@@ -397,7 +397,7 @@
   },
   "dependencies": {
     "@ds-gn/motion": "0.11.2",
-    "@ds-gn/tokens": "0.11.2",
+    "@ds-gn/tokens": "0.12.1",
     "@lit-labs/observers": "^2.0.5",
     "@lit/react": "^1.0.7",
     "clsx": "^2.1.1"