vira 25.15.0 → 26.0.1

package/dist/elements/define-vira-element.js

@@ -5,16 +5,15 @@ import { wrapDefineElement } from 'element-vir';
  * @category Internal
  */
 export const ViraTagNamePrefix = `vira-`;
-const { defineElement } = wrapDefineElement({
+/**
+ * Define a vira element with custom requirements (like the `vira-` element tag prefix).
+ *
+ * @category Internal
+ */
+export const defineViraElement = wrapDefineElement({
     assertInputs: (inputs) => {
         if (!inputs.tagName.startsWith(ViraTagNamePrefix)) {
             throw new Error(`Tag name should start with '${ViraTagNamePrefix}' but got '${inputs.tagName}'`);
         }
     },
 });
-/**
- * Define a vira element with custom requirements (like the `vira-` element tag prefix).
- *
- * @category Internal
- */
-export const defineViraElement = defineElement;

package/dist/elements/vira-button.element.d.ts

@@ -16,9 +16,8 @@ export declare enum ViraButtonStyle {
  * @category Elements
  * @see https://electrovir.github.io/element-vir/vira/book/elements/vira-button
  */
-export declare const ViraButton: import("element-vir").DeclarativeElementDefinition<"vira-button", {
+export declare const ViraButton: import("element-vir").DeclarativeElementDefinition<"vira-button", PartialWithUndefined<{
     text: string;
-} & PartialWithUndefined<{
     icon: Pick<ViraIconSvg, "svgTemplate">;
     disabled: boolean;
     buttonStyle: ViraButtonStyle;

package/dist/elements/vira-button.element.js

@@ -99,6 +99,10 @@ export const ViraButton = defineViraElement()({
                 border-color ${viraAnimationDurations['vira-interaction-animation-duration'].value};
         }
 
+        .empty-text {
+            width: 0;
+        }
+
         ${createFocusStyles({
         selector: 'button:focus:focus-visible:not(:active):not([disabled])',
         elementBorderSize: 2,
@@ -128,7 +132,9 @@ export const ViraButton = defineViraElement()({
             ? html `
                   <span class="text-template">${inputs.text}</span>
               `
-            : nothing;
+            : html `
+                  <span class="empty-text">&nbsp;</span>
+              `;
         return html `
             <button ?disabled=${inputs.disabled}>${iconTemplate} ${textTemplate}</button>
         `;

package/dist/elements/vira-link.element.d.ts

@@ -1,4 +1,5 @@
 import { type PartialWithUndefined } from '@augment-vir/common';
+import { type AttributeValues, type CSSResult } from 'element-vir';
 import { type SpaRoute, type SpaRouter } from 'spa-router-vir';
 /**
  * The route properties required for using {@link ViraLink} with a route.
@@ -33,11 +34,12 @@ export declare const ViraLink: import("element-vir").DeclarativeElementDefinitio
      */
     route: ViraLinkRoute;
 }, "link" | "route"> & PartialWithUndefined<{
-    aria?: {
-        /**
-         * This label will be attached to the inner `<a>` element's `aria-label` attribute.
-         * If none is provided, no `aria-label` attribute will be generated.
-         */
-        label: string;
-    };
+    /** Styles that will be applied directly to the inner elements. */
+    stylePassthrough: Readonly<PartialWithUndefined<{
+        a: CSSResult;
+    }>>;
+    /** Attributes that will be applied directly to the inner elements. */
+    attributePassthrough: Readonly<PartialWithUndefined<{
+        a: AttributeValues;
+    }>>;
 }>, {}, {}, "vira-link-", "vira-link-hover-color", readonly []>;

package/dist/elements/vira-link.element.js

@@ -1,4 +1,4 @@
-import { css, html, ifDefined, listen } from 'element-vir';
+import { attributes, css, html, ifDefined, listen, nothing, } from 'element-vir';
 import { defineViraElement } from './define-vira-element.js';
 /**
  * A hyperlink wrapper element that can be configured to emit route change events rather than just
@@ -57,7 +57,10 @@ export const ViraLink = defineViraElement()({
                     href=${inputs.link.url}
                     target="_blank"
                     rel="noopener noreferrer"
-                    aria-label=${ifDefined(inputs.aria?.label || undefined)}
+                    ${inputs.attributePassthrough?.a
+                ? attributes(inputs.attributePassthrough.a)
+                : nothing}
+                    style=${ifDefined(inputs.stylePassthrough?.a)}
                 >
                     <slot></slot>
                 </a>
@@ -72,7 +75,10 @@ export const ViraLink = defineViraElement()({
                 <a
                     href=${linkUrl}
                     rel="noopener noreferrer"
-                    aria-label=${ifDefined(inputs.aria?.label || undefined)}
+                    ${inputs.attributePassthrough?.a
+                ? attributes(inputs.attributePassthrough.a)
+                : nothing}
+                    style=${ifDefined(inputs.stylePassthrough?.a)}
                     ${listen('click', clickCallback)}
                 >
                     <slot></slot>

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "vira",
-    "version": "25.15.0",
+    "version": "26.0.1",
     "description": "A simple and highly versatile design system using element-vir.",
     "keywords": [
         "design",
@@ -67,7 +67,7 @@
         "vite-tsconfig-paths": "^5.1.4"
     },
     "peerDependencies": {
-        "element-vir": "^25.15.0"
+        "element-vir": "^26.0.1"
     },
     "engines": {
         "node": ">=22"