@aotearoan/neon 9.3.4 → 9.3.6

package/dist/components/navigation/link/NeonLink.cjs.js

@@ -1,2 +1,2 @@
-"use strict";var r=require("./NeonLink.ts_vue_type_script_src_5a48e750_lang.cjs.js"),n=require("vue"),s=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const a={class:"neon-link__label"},k=["href"],p={class:"neon-link__label"},u={class:"neon-link__label"};function d(e,o,c,C,v,w){const i=n.resolveComponent("router-link"),t=n.resolveComponent("neon-icon");return e.routerUrl?(n.openBlock(),n.createBlock(i,n.mergeProps({key:0,class:[[{"neon-link--no-style":e.noStyle,"neon-link--active":e.activeRoute,"neon-link--exact-active":e.exactRoute},`neon-link--outline-${e.outlineStyle}`],"neon-link neon-link--router-link"],to:e.routerUrl,tabindex:"0"},e.sanitizedAttributes,{onClick:e.onClick,onKeydown:[n.withKeys(e.onClick,["enter"]),n.withKeys(n.withModifiers(e.onClick,["stop","prevent"]),["space"])]}),{default:n.withCtx(()=>[n.createElementVNode("span",a,[n.renderSlot(e.$slots,"default")])]),_:3},16,["class","to","onClick","onKeydown"])):e.href?(n.openBlock(),n.createElementBlock("a",n.mergeProps({key:1,class:[[{"neon-link--no-style":e.noStyle,"neon-link--with-external-indicator":e.externalIndicator,"neon-link--active":e.activeRoute,"neon-link--exact-active":e.exactRoute},`neon-link--outline-${e.outlineStyle}`],"neon-link neon-link--external-link"],href:e.href,rel:"noopener",tabindex:"0"},e.sanitizedAttributes,{onClick:o[0]||(o[0]=(...l)=>e.onClick&&e.onClick(...l)),onKeydown:[o[1]||(o[1]=n.withKeys((...l)=>e.onClick&&e.onClick(...l),["enter"])),o[2]||(o[2]=n.withKeys(n.withModifiers((...l)=>e.onClick&&e.onClick(...l),["stop","prevent"]),["space"]))]}),[n.createElementVNode("span",p,[n.renderSlot(e.$slots,"default"),e.externalIndicator?(n.openBlock(),n.createBlock(t,{key:0,class:"neon-link__external-indicator",color:"low-contrast",name:"link-external"})):n.createCommentVNode("",!0)])],16,k)):(n.openBlock(),n.createElementBlock("a",n.mergeProps({key:2,class:[[{"neon-link--no-style":e.noStyle},`neon-link--outline-${e.outlineStyle}`],"neon-link"],tabindex:"0"},e.sanitizedAttributes,{onClick:o[3]||(o[3]=(...l)=>e.onClick&&e.onClick(...l)),onKeydown:[o[4]||(o[4]=n.withKeys((...l)=>e.onClick&&e.onClick(...l),["enter"])),o[5]||(o[5]=n.withKeys(n.withModifiers((...l)=>e.onClick&&e.onClick(...l),["stop","prevent"]),["space"]))]}),[n.createElementVNode("span",u,[n.renderSlot(e.$slots,"default")])],16))}var y=s(r,[["render",d]]);module.exports=y;
+"use strict";var r=require("./NeonLink.ts_vue_type_script_src_9100b0e0_lang.cjs.js"),n=require("vue"),s=require("../../../_virtual/plugin-vue_export-helper.cjs.js");const a={class:"neon-link__label"},k=["href"],p={class:"neon-link__label"},u={class:"neon-link__label"};function d(e,o,c,v,C,w){const i=n.resolveComponent("router-link"),t=n.resolveComponent("neon-icon");return e.routerUrl?(n.openBlock(),n.createBlock(i,n.mergeProps({key:0,class:[[{"neon-link--no-style":e.noStyle,"neon-link--active":e.activeRoute,"neon-link--exact-active":e.exactRoute},`neon-link--outline-${e.outlineStyle}`],"neon-link neon-link--router-link"],to:e.routerUrl,tabindex:"0"},e.sanitizedAttributes,{onClick:e.onClick,onKeydown:[n.withKeys(e.onClick,["enter"]),n.withKeys(n.withModifiers(e.onSpace,["prevent"]),["space"])]}),{default:n.withCtx(()=>[n.createElementVNode("span",a,[n.renderSlot(e.$slots,"default")])]),_:3},16,["class","to","onClick","onKeydown"])):e.href?(n.openBlock(),n.createElementBlock("a",n.mergeProps({key:1,class:[[{"neon-link--no-style":e.noStyle,"neon-link--with-external-indicator":e.externalIndicator,"neon-link--active":e.activeRoute,"neon-link--exact-active":e.exactRoute},`neon-link--outline-${e.outlineStyle}`],"neon-link neon-link--external-link"],href:e.href,rel:"noopener",tabindex:"0"},e.sanitizedAttributes,{onClick:o[0]||(o[0]=(...l)=>e.onClick&&e.onClick(...l)),onKeydown:[o[1]||(o[1]=n.withKeys((...l)=>e.onClick&&e.onClick(...l),["enter"])),o[2]||(o[2]=n.withKeys(n.withModifiers((...l)=>e.onSpace&&e.onSpace(...l),["prevent"]),["space"]))]}),[n.createElementVNode("span",p,[n.renderSlot(e.$slots,"default"),e.externalIndicator?(n.openBlock(),n.createBlock(t,{key:0,class:"neon-link__external-indicator",color:"low-contrast",name:"link-external"})):n.createCommentVNode("",!0)])],16,k)):(n.openBlock(),n.createElementBlock("a",n.mergeProps({key:2,class:[[{"neon-link--no-style":e.noStyle},`neon-link--outline-${e.outlineStyle}`],"neon-link"],tabindex:"0"},e.sanitizedAttributes,{onClick:o[3]||(o[3]=(...l)=>e.onClick&&e.onClick(...l)),onKeydown:[o[4]||(o[4]=n.withKeys((...l)=>e.onClick&&e.onClick(...l),["enter"])),o[5]||(o[5]=n.withKeys(n.withModifiers((...l)=>e.onSpace&&e.onSpace(...l),["prevent"]),["space"]))]}),[n.createElementVNode("span",u,[n.renderSlot(e.$slots,"default")])],16))}var y=s(r,[["render",d]]);module.exports=y;
 //# sourceMappingURL=NeonLink.cjs.js.map

package/dist/components/navigation/link/NeonLink.es.js

@@ -1,4 +1,4 @@
-import _sfc_main from "./NeonLink.ts_vue_type_script_src_5a48e750_lang.es.js";
+import _sfc_main from "./NeonLink.ts_vue_type_script_src_9100b0e0_lang.es.js";
 import { resolveComponent, openBlock, createBlock, mergeProps, withKeys, withModifiers, withCtx, createElementVNode, renderSlot, createElementBlock, createCommentVNode } from "vue";
 import _export_sfc from "../../../_virtual/plugin-vue_export-helper.es.js";
 const _hoisted_1 = { class: "neon-link__label" };
@@ -20,7 +20,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     onClick: _ctx.onClick,
     onKeydown: [
       withKeys(_ctx.onClick, ["enter"]),
-      withKeys(withModifiers(_ctx.onClick, ["stop", "prevent"]), ["space"])
+      withKeys(withModifiers(_ctx.onSpace, ["prevent"]), ["space"])
     ]
   }), {
     default: withCtx(() => [
@@ -47,7 +47,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     onClick: _cache[0] || (_cache[0] = (...args) => _ctx.onClick && _ctx.onClick(...args)),
     onKeydown: [
       _cache[1] || (_cache[1] = withKeys((...args) => _ctx.onClick && _ctx.onClick(...args), ["enter"])),
-      _cache[2] || (_cache[2] = withKeys(withModifiers((...args) => _ctx.onClick && _ctx.onClick(...args), ["stop", "prevent"]), ["space"]))
+      _cache[2] || (_cache[2] = withKeys(withModifiers((...args) => _ctx.onSpace && _ctx.onSpace(...args), ["prevent"]), ["space"]))
     ]
   }), [
     createElementVNode("span", _hoisted_3, [
@@ -67,7 +67,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     onClick: _cache[3] || (_cache[3] = (...args) => _ctx.onClick && _ctx.onClick(...args)),
     onKeydown: [
       _cache[4] || (_cache[4] = withKeys((...args) => _ctx.onClick && _ctx.onClick(...args), ["enter"])),
-      _cache[5] || (_cache[5] = withKeys(withModifiers((...args) => _ctx.onClick && _ctx.onClick(...args), ["stop", "prevent"]), ["space"]))
+      _cache[5] || (_cache[5] = withKeys(withModifiers((...args) => _ctx.onSpace && _ctx.onSpace(...args), ["prevent"]), ["space"]))
     ]
   }), [
     createElementVNode("span", _hoisted_4, [

package/dist/components/navigation/link/NeonLink.ts_vue_type_script_src_9100b0e0_lang.cjs.js

@@ -0,0 +1,2 @@
+"use strict";var t=require("vue"),h=require("../../../common/enums/NeonOutlineStyle.cjs.js"),m=require("../../presentation/icon/NeonIcon.cjs.js"),i=require("vue-router"),y=t.defineComponent({name:"NeonLink",components:{NeonIcon:m},props:{href:{type:String,default:null},noStyle:{type:Boolean,default:!1},outlineStyle:{type:String,default:h.NeonOutlineStyle.Text},externalIndicator:{type:Boolean,default:!1}},emits:["click"],setup(e,{emit:l}){const a=t.useAttrs(),s=i.useRouter(),o=i.useRoute(),u=t.computed(()=>{var n;return((n=e.href)==null?void 0:n.indexOf("//"))===-1?e.href:void 0}),r=t.computed(()=>e.href&&e.href.indexOf(o.fullPath)===0),f=t.computed(()=>r.value&&e.href===o.fullPath),d=t.computed(()=>{const{onClick:n,...v}=a;return v}),c=()=>{l("click")};return{routerUrl:u,sanitizedAttributes:d,activeRoute:r,exactRoute:f,onClick:c,onSpace:async()=>{c(),u.value?await s.push(e.href):e.href&&window.location.replace(e.href)}}}});module.exports=y;
+//# sourceMappingURL=NeonLink.ts_vue_type_script_src_9100b0e0_lang.cjs.js.map

package/dist/components/navigation/link/NeonLink.ts_vue_type_script_src_9100b0e0_lang.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NeonLink.ts_vue_type_script_src_9100b0e0_lang.cjs.js","sources":["../../../../src/components/navigation/link/NeonLink.ts?vue&type=script&src=9100b0e0&lang.ts"],"sourcesContent":["import { computed, defineComponent, useAttrs } from 'vue';\nimport { NeonOutlineStyle } from '@/common/enums/NeonOutlineStyle';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { useRoute, useRouter } from 'vue-router';\n\n/**\n * An HTML anchor component which handles VueRouter links (internal), href links (external) and clickable links (no href).\n */\nexport default defineComponent({\n  name: 'NeonLink',\n  components: {\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The href of the link, this can be an internal (relative or absolute) or an external link.\n     */\n    href: { type: String, default: null },\n    /**\n     * set to true if you would like a completely unstyled link. This is useful for creating a complex component which may use NeonLink.\n     */\n    noStyle: { type: Boolean, default: false },\n    /**\n     * Style of the outline to use when the link has focus, use <em>text</em> for wrapping text content and\n     * <em>border</em> for tooltips wrapping \"block\" elements, e.g. buttons.\n     */\n    outlineStyle: { type: String as () => NeonOutlineStyle, default: NeonOutlineStyle.Text },\n    /**\n     * Display an external link icon to the right of the link indicating clicking it will take the user to another site.\n     */\n    externalIndicator: { type: Boolean, default: false },\n  },\n  emits: [\n    /**\n     * Emitted when the user triggers the link by clicking on it or hitting Enter or Space when the link has focus.\n     * @type {void}\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const router = useRouter();\n    const route = useRoute();\n    const routerUrl = computed(() => (props.href?.indexOf('//') === -1 ? props.href : undefined));\n\n    const activeRoute = computed(() => props.href && props.href.indexOf(route.fullPath) === 0);\n    const exactRoute = computed(() => activeRoute.value && props.href === route.fullPath);\n\n    const sanitizedAttributes = computed(() => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { onClick, ...sanitized } = attrs;\n      return sanitized;\n    });\n\n    const onClick = () => {\n      emit('click');\n    };\n\n    const onSpace = async () => {\n      onClick();\n\n      if (routerUrl.value) {\n        await router.push(props.href);\n      } else if (props.href) {\n        window.location.replace(props.href);\n      }\n    };\n\n    return {\n      routerUrl,\n      sanitizedAttributes,\n      activeRoute,\n      exactRoute,\n      onClick,\n      onSpace,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonOutlineStyle","props","emit","attrs","useAttrs","router","useRouter","route","useRoute","routerUrl","computed","_a","activeRoute","exactRoute","sanitizedAttributes","onClick","sanitized"],"mappings":"0KAQAA,EAAeC,kBAAgB,CAC7B,KAAM,WACN,WAAY,CACV,SAAAC,CACF,EACA,MAAO,CAIL,KAAM,CAAE,KAAM,OAAQ,QAAS,IAAK,EAIpC,QAAS,CAAE,KAAM,QAAS,QAAS,EAAM,EAKzC,aAAc,CAAE,KAAM,OAAkC,QAASC,EAAAA,iBAAiB,IAAK,EAIvF,kBAAmB,CAAE,KAAM,QAAS,QAAS,EAAM,CACrD,EACA,MAAO,CAKL,OACF,EACA,MAAMC,EAAO,CAAE,KAAAC,GAAQ,CACrB,MAAMC,EAAQC,EAAAA,WACRC,EAASC,EAAAA,YACTC,EAAQC,EAAAA,WACRC,EAAYC,EAAS,SAAA,WAAO,QAAAC,EAAAV,EAAM,OAAN,YAAAU,EAAY,QAAQ,SAAU,GAAKV,EAAM,KAAO,OAAU,EAEtFW,EAAcF,EAAAA,SAAS,IAAMT,EAAM,MAAQA,EAAM,KAAK,QAAQM,EAAM,QAAQ,IAAM,CAAC,EACnFM,EAAaH,WAAS,IAAME,EAAY,OAASX,EAAM,OAASM,EAAM,QAAQ,EAE9EO,EAAsBJ,EAAAA,SAAS,IAAM,CAEzC,KAAM,CAAE,QAAAK,KAAYC,CAAA,EAAcb,EAC3B,OAAAa,CAAA,CACR,EAEKD,EAAU,IAAM,CACpBb,EAAK,OAAO,CAAA,EAaP,MAAA,CACL,UAAAO,EACA,oBAAAK,EACA,YAAAF,EACA,WAAAC,EACA,QAAAE,EACA,QAhBc,SAAY,CAClBA,IAEJN,EAAU,MACN,MAAAJ,EAAO,KAAKJ,EAAM,IAAI,EACnBA,EAAM,MACR,OAAA,SAAS,QAAQA,EAAM,IAAI,CACpC,CASA,CAEJ,CACF,CAAC"}

package/dist/components/navigation/link/{NeonLink.ts_vue_type_script_src_5a48e750_lang.es.js → NeonLink.ts_vue_type_script_src_9100b0e0_lang.es.js}

@@ -1,7 +1,7 @@
 import { defineComponent, useAttrs, computed } from "vue";
 import { NeonOutlineStyle } from "../../../common/enums/NeonOutlineStyle.es.js";
 import NeonIcon from "../../presentation/icon/NeonIcon.es.js";
-import { useRoute } from "vue-router";
+import { useRouter, useRoute } from "vue-router";
 var _sfc_main = defineComponent({
   name: "NeonLink",
   components: {
@@ -18,6 +18,7 @@ var _sfc_main = defineComponent({
   ],
   setup(props, { emit }) {
     const attrs = useAttrs();
+    const router = useRouter();
     const route = useRoute();
     const routerUrl = computed(() => {
       var _a;
@@ -32,14 +33,23 @@ var _sfc_main = defineComponent({
     const onClick = () => {
       emit("click");
     };
+    const onSpace = async () => {
+      onClick();
+      if (routerUrl.value) {
+        await router.push(props.href);
+      } else if (props.href) {
+        window.location.replace(props.href);
+      }
+    };
     return {
       routerUrl,
       sanitizedAttributes,
       activeRoute,
       exactRoute,
-      onClick
+      onClick,
+      onSpace
     };
   }
 });
 export { _sfc_main as default };
-//# sourceMappingURL=NeonLink.ts_vue_type_script_src_5a48e750_lang.es.js.map
+//# sourceMappingURL=NeonLink.ts_vue_type_script_src_9100b0e0_lang.es.js.map

package/dist/components/navigation/link/NeonLink.ts_vue_type_script_src_9100b0e0_lang.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NeonLink.ts_vue_type_script_src_9100b0e0_lang.es.js","sources":["../../../../src/components/navigation/link/NeonLink.ts?vue&type=script&src=9100b0e0&lang.ts"],"sourcesContent":["import { computed, defineComponent, useAttrs } from 'vue';\nimport { NeonOutlineStyle } from '@/common/enums/NeonOutlineStyle';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { useRoute, useRouter } from 'vue-router';\n\n/**\n * An HTML anchor component which handles VueRouter links (internal), href links (external) and clickable links (no href).\n */\nexport default defineComponent({\n  name: 'NeonLink',\n  components: {\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The href of the link, this can be an internal (relative or absolute) or an external link.\n     */\n    href: { type: String, default: null },\n    /**\n     * set to true if you would like a completely unstyled link. This is useful for creating a complex component which may use NeonLink.\n     */\n    noStyle: { type: Boolean, default: false },\n    /**\n     * Style of the outline to use when the link has focus, use <em>text</em> for wrapping text content and\n     * <em>border</em> for tooltips wrapping \"block\" elements, e.g. buttons.\n     */\n    outlineStyle: { type: String as () => NeonOutlineStyle, default: NeonOutlineStyle.Text },\n    /**\n     * Display an external link icon to the right of the link indicating clicking it will take the user to another site.\n     */\n    externalIndicator: { type: Boolean, default: false },\n  },\n  emits: [\n    /**\n     * Emitted when the user triggers the link by clicking on it or hitting Enter or Space when the link has focus.\n     * @type {void}\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const router = useRouter();\n    const route = useRoute();\n    const routerUrl = computed(() => (props.href?.indexOf('//') === -1 ? props.href : undefined));\n\n    const activeRoute = computed(() => props.href && props.href.indexOf(route.fullPath) === 0);\n    const exactRoute = computed(() => activeRoute.value && props.href === route.fullPath);\n\n    const sanitizedAttributes = computed(() => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { onClick, ...sanitized } = attrs;\n      return sanitized;\n    });\n\n    const onClick = () => {\n      emit('click');\n    };\n\n    const onSpace = async () => {\n      onClick();\n\n      if (routerUrl.value) {\n        await router.push(props.href);\n      } else if (props.href) {\n        window.location.replace(props.href);\n      }\n    };\n\n    return {\n      routerUrl,\n      sanitizedAttributes,\n      activeRoute,\n      exactRoute,\n      onClick,\n      onSpace,\n    };\n  },\n});\n"],"names":["onClick"],"mappings":";;;;AAQA,IAAA,YAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IAIL,MAAM,EAAE,MAAM,QAAQ,SAAS,KAAK;AAAA,IAIpC,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM;AAAA,IAKzC,cAAc,EAAE,MAAM,QAAkC,SAAS,iBAAiB,KAAK;AAAA,IAIvF,mBAAmB,EAAE,MAAM,SAAS,SAAS,MAAM;AAAA,EACrD;AAAA,EACA,OAAO;AAAA,IAKL;AAAA,EACF;AAAA,EACA,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,QAAQ;AACd,UAAM,SAAS;AACf,UAAM,QAAQ;AACR,UAAA,YAAY,SAAS;;AAAO,0BAAM,SAAN,mBAAY,QAAQ,WAAU,KAAK,MAAM,OAAO;AAAA,KAAU;AAEtF,UAAA,cAAc,SAAS,MAAM,MAAM,QAAQ,MAAM,KAAK,QAAQ,MAAM,QAAQ,MAAM,CAAC;AACnF,UAAA,aAAa,SAAS,MAAM,YAAY,SAAS,MAAM,SAAS,MAAM,QAAQ;AAE9E,UAAA,sBAAsB,SAAS,MAAM;AAEzC,YAAM,EAAE,SAAAA,aAAY,UAAA,IAAc;AAC3B,aAAA;AAAA,IAAA,CACR;AAED,UAAM,UAAU,MAAM;AACpB,WAAK,OAAO;AAAA,IAAA;AAGd,UAAM,UAAU,YAAY;AAClB;AAER,UAAI,UAAU,OAAO;AACb,cAAA,OAAO,KAAK,MAAM,IAAI;AAAA,MAAA,WACnB,MAAM,MAAM;AACd,eAAA,SAAS,QAAQ,MAAM,IAAI;AAAA,MACpC;AAAA,IAAA;AAGK,WAAA;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;;"}

package/dist/src/components/navigation/link/NeonLink.d.ts

@@ -40,6 +40,7 @@ declare const _default: import("vue").DefineComponent<{
     activeRoute: import("vue").ComputedRef<boolean | "">;
     exactRoute: import("vue").ComputedRef<boolean | "">;
     onClick: () => void;
+    onSpace: () => Promise<void>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], "click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     /**
      * The href of the link, this can be an internal (relative or absolute) or an external link.

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@aotearoan/neon",
   "description": "Neon is a lightweight design library of Vue 3 components with minimal dependencies.",
-  "version": "9.3.4",
+  "version": "9.3.6",
   "main": "./dist/neon.cjs.js",
   "module": "./dist/neon.es.js",
   "types": "./dist/src/neon.d.ts",

package/src/sass/components/_link.scss

@@ -35,8 +35,14 @@ a[href]:not(.neon-link--no-style) {
 @mixin link {
   .neon-link {
     position: relative;
+    display: inline-flex;
     @include outline.focus-outline-styles(var(--neon-rgb-link));
 
+    .neon-link__label {
+      display: inline-flex;
+      align-items: center;
+    }
+
     &:not(.neon-link--no-style) {
       @extend %neon-link-no-style;
 

package/src/sass/palette.scss

@@ -37,26 +37,26 @@
   --neon-rgb-high-contrast-d3: 38, 38, 38;
   --neon-rgb-high-contrast-d4: 27, 27, 27;
   --neon-rgb-high-contrast-d5: 17, 17, 17;
-  --neon-rgb-brand-l5: 250, 240, 255;
-  --neon-rgb-brand-l4: 243, 208, 255;
-  --neon-rgb-brand-l3: 233, 176, 255;
-  --neon-rgb-brand-l2: 217, 145, 255;
+  --neon-rgb-brand-l5: 251, 240, 255;
+  --neon-rgb-brand-l4: 243, 207, 255;
+  --neon-rgb-brand-l3: 232, 175, 255;
+  --neon-rgb-brand-l2: 216, 144, 255;
   --neon-rgb-brand-l1: 199, 114, 255;
-  --neon-rgb-brand-d1: 102, 19, 206;
-  --neon-rgb-brand-d2: 91, 30, 171;
-  --neon-rgb-brand-d3: 72, 28, 126;
-  --neon-rgb-brand-d4: 49, 25, 78;
-  --neon-rgb-brand-d5: 32, 25, 38;
-  --neon-rgb-primary-l5: 254, 242, 224;
-  --neon-rgb-primary-l4: 250, 220, 170;
-  --neon-rgb-primary-l3: 241, 199, 120;
-  --neon-rgb-primary-l2: 227, 179, 77;
-  --neon-rgb-primary-l1: 211, 159, 29;
-  --neon-rgb-primary-d1: 128, 89, 0;
-  --neon-rgb-primary-d2: 110, 76, 0;
-  --neon-rgb-primary-d3: 84, 58, 0;
-  --neon-rgb-primary-d4: 56, 38, 0;
-  --neon-rgb-primary-d5: 34, 26, 12;
+  --neon-rgb-brand-d1: 136, 55, 192;
+  --neon-rgb-brand-d2: 115, 51, 160;
+  --neon-rgb-brand-d3: 87, 40, 119;
+  --neon-rgb-brand-d4: 56, 30, 74;
+  --neon-rgb-brand-d5: 33, 25, 37;
+  --neon-rgb-primary-l5: 245, 241, 255;
+  --neon-rgb-primary-l4: 222, 214, 255;
+  --neon-rgb-primary-l3: 197, 187, 255;
+  --neon-rgb-primary-l2: 171, 162, 255;
+  --neon-rgb-primary-l1: 143, 138, 255;
+  --neon-rgb-primary-d1: 79, 83, 194;
+  --neon-rgb-primary-d2: 70, 72, 163;
+  --neon-rgb-primary-d3: 54, 55, 123;
+  --neon-rgb-primary-d4: 38, 37, 77;
+  --neon-rgb-primary-d5: 28, 26, 39;
   --neon-rgb-info-l5: 230, 245, 255;
   --neon-rgb-info-l4: 182, 224, 255;
   --neon-rgb-info-l3: 137, 201, 255;
@@ -67,34 +67,34 @@
   --neon-rgb-info-d3: 0, 60, 123;
   --neon-rgb-info-d4: 4, 40, 78;
   --neon-rgb-info-d5: 21, 27, 41;
-  --neon-rgb-success-l5: 227, 249, 236;
-  --neon-rgb-success-l4: 178, 234, 204;
-  --neon-rgb-success-l3: 130, 218, 173;
-  --neon-rgb-success-l2: 84, 200, 146;
-  --neon-rgb-success-l1: 18, 181, 121;
-  --neon-rgb-success-d1: 0, 111, 58;
-  --neon-rgb-success-d2: 0, 96, 51;
-  --neon-rgb-success-d3: 0, 73, 38;
-  --neon-rgb-success-d4: 0, 48, 27;
-  --neon-rgb-success-d5: 15, 31, 22;
-  --neon-rgb-warn-l5: 255, 241, 225;
-  --neon-rgb-warn-l4: 255, 217, 173;
-  --neon-rgb-warn-l3: 255, 193, 124;
-  --neon-rgb-warn-l2: 246, 171, 82;
-  --neon-rgb-warn-l1: 233, 151, 39;
-  --neon-rgb-warn-d1: 147, 80, 0;
-  --neon-rgb-warn-d2: 126, 69, 0;
-  --neon-rgb-warn-d3: 95, 53, 0;
-  --neon-rgb-warn-d4: 63, 35, 0;
-  --neon-rgb-warn-d5: 36, 26, 13;
-  --neon-rgb-error-l5: 255, 238, 233;
-  --neon-rgb-error-l4: 255, 204, 191;
-  --neon-rgb-error-l3: 255, 170, 153;
-  --neon-rgb-error-l2: 255, 139, 120;
-  --neon-rgb-error-l1: 247, 108, 90;
-  --neon-rgb-error-d1: 178, 47, 39;
-  --neon-rgb-error-d2: 151, 44, 35;
-  --neon-rgb-error-d3: 115, 34, 27;
-  --neon-rgb-error-d4: 74, 26, 20;
-  --neon-rgb-error-d5: 40, 23, 20;
+  --neon-rgb-success-l5: 222, 249, 244;
+  --neon-rgb-success-l4: 176, 241, 230;
+  --neon-rgb-success-l3: 131, 231, 215;
+  --neon-rgb-success-l2: 90, 218, 201;
+  --neon-rgb-success-l1: 44, 205, 187;
+  --neon-rgb-success-d1: 0, 110, 96;
+  --neon-rgb-success-d2: 0, 95, 83;
+  --neon-rgb-success-d3: 0, 73, 63;
+  --neon-rgb-success-d4: 0, 48, 42;
+  --neon-rgb-success-d5: 8, 31, 28;
+  --neon-rgb-warn-l5: 254, 242, 224;
+  --neon-rgb-warn-l4: 255, 226, 171;
+  --neon-rgb-warn-l3: 255, 211, 122;
+  --neon-rgb-warn-l2: 252, 197, 77;
+  --neon-rgb-warn-l1: 243, 183, 18;
+  --neon-rgb-warn-d1: 131, 89, 0;
+  --neon-rgb-warn-d2: 112, 76, 0;
+  --neon-rgb-warn-d3: 86, 58, 0;
+  --neon-rgb-warn-d4: 57, 38, 0;
+  --neon-rgb-warn-d5: 34, 26, 12;
+  --neon-rgb-error-l5: 255, 237, 237;
+  --neon-rgb-error-l4: 255, 203, 203;
+  --neon-rgb-error-l3: 255, 168, 171;
+  --neon-rgb-error-l2: 255, 134, 143;
+  --neon-rgb-error-l1: 255, 98, 118;
+  --neon-rgb-error-d1: 197, 0, 54;
+  --neon-rgb-error-d2: 166, 6, 48;
+  --neon-rgb-error-d3: 125, 16, 37;
+  --neon-rgb-error-d4: 79, 20, 26;
+  --neon-rgb-error-d5: 41, 23, 23;
 }

package/src/sass/variables.scss

@@ -77,13 +77,13 @@
   --neon-font-weight-semi-bold: 500;
   --neon-font-weight-bold: 600;
 
-  --neon-h6-weight: var(--neon-font-weight-semi-bold);
-  --neon-h5-weight: var(--neon-font-weight-semi-bold);
-  --neon-h4-weight: var(--neon-font-weight-semi-bold);
+  --neon-h6-weight: var(--neon-font-weight-normal);
+  --neon-h5-weight: var(--neon-font-weight-normal);
+  --neon-h4-weight: var(--neon-font-weight-normal);
   --neon-h3-weight: var(--neon-font-weight-semi-bold);
   --neon-h2-weight: var(--neon-font-weight-semi-bold);
-  --neon-h1-weight: var(--neon-font-weight-semi-bold);
-  --neon-h0-weight: var(--neon-font-weight-semi-bold);
+  --neon-h1-weight: var(--neon-font-weight-bold);
+  --neon-h0-weight: var(--neon-font-weight-bold);
 
   --neon-font-weight-em: var(--neon-font-weight-lighter);
   --neon-font-weight-strong: var(--neon-font-weight-bold);

package/dist/components/navigation/link/NeonLink.ts_vue_type_script_src_5a48e750_lang.cjs.js

@@ -1,2 +0,0 @@
-"use strict";var e=require("vue"),f=require("../../../common/enums/NeonOutlineStyle.cjs.js"),d=require("../../presentation/icon/NeonIcon.cjs.js"),m=require("vue-router"),v=e.defineComponent({name:"NeonLink",components:{NeonIcon:d},props:{href:{type:String,default:null},noStyle:{type:Boolean,default:!1},outlineStyle:{type:String,default:f.NeonOutlineStyle.Text},externalIndicator:{type:Boolean,default:!1}},emits:["click"],setup(t,{emit:r}){const i=e.useAttrs(),o=m.useRoute(),c=e.computed(()=>{var n;return((n=t.href)==null?void 0:n.indexOf("//"))===-1?t.href:void 0}),u=e.computed(()=>t.href&&t.href.indexOf(o.fullPath)===0),l=e.computed(()=>u.value&&t.href===o.fullPath),s=e.computed(()=>{const{onClick:n,...a}=i;return a});return{routerUrl:c,sanitizedAttributes:s,activeRoute:u,exactRoute:l,onClick:()=>{r("click")}}}});module.exports=v;
-//# sourceMappingURL=NeonLink.ts_vue_type_script_src_5a48e750_lang.cjs.js.map

package/dist/components/navigation/link/NeonLink.ts_vue_type_script_src_5a48e750_lang.cjs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"NeonLink.ts_vue_type_script_src_5a48e750_lang.cjs.js","sources":["../../../../src/components/navigation/link/NeonLink.ts?vue&type=script&src=5a48e750&lang.ts"],"sourcesContent":["import { computed, defineComponent, useAttrs } from 'vue';\nimport { NeonOutlineStyle } from '@/common/enums/NeonOutlineStyle';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { useRoute } from 'vue-router';\n\n/**\n * An HTML anchor component which handles VueRouter links (internal), href links (external) and clickable links (no href).\n */\nexport default defineComponent({\n  name: 'NeonLink',\n  components: {\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The href of the link, this can be an internal (relative or absolute) or an external link.\n     */\n    href: { type: String, default: null },\n    /**\n     * set to true if you would like a completely unstyled link. This is useful for creating a complex component which may use NeonLink.\n     */\n    noStyle: { type: Boolean, default: false },\n    /**\n     * Style of the outline to use when the link has focus, use <em>text</em> for wrapping text content and\n     * <em>border</em> for tooltips wrapping \"block\" elements, e.g. buttons.\n     */\n    outlineStyle: { type: String as () => NeonOutlineStyle, default: NeonOutlineStyle.Text },\n    /**\n     * Display an external link icon to the right of the link indicating clicking it will take the user to another site.\n     */\n    externalIndicator: { type: Boolean, default: false },\n  },\n  emits: [\n    /**\n     * Emitted when the user triggers the link by clicking on it or hitting Enter when the link has focus.\n     * @type {void}\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const route = useRoute();\n    const routerUrl = computed(() => (props.href?.indexOf('//') === -1 ? props.href : undefined));\n\n    const activeRoute = computed(() => props.href && props.href.indexOf(route.fullPath) === 0);\n    const exactRoute = computed(() => activeRoute.value && props.href === route.fullPath);\n\n    const sanitizedAttributes = computed(() => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { onClick, ...sanitized } = attrs;\n      return sanitized;\n    });\n\n    const onClick = () => {\n      emit('click');\n    };\n\n    return {\n      routerUrl,\n      sanitizedAttributes,\n      activeRoute,\n      exactRoute,\n      onClick,\n    };\n  },\n});\n"],"names":["_sfc_main","defineComponent","NeonIcon","NeonOutlineStyle","props","emit","attrs","useAttrs","route","useRoute","routerUrl","computed","_a","activeRoute","exactRoute","sanitizedAttributes","onClick","sanitized"],"mappings":"0KAQAA,EAAeC,kBAAgB,CAC7B,KAAM,WACN,WAAY,CACV,SAAAC,CACF,EACA,MAAO,CAIL,KAAM,CAAE,KAAM,OAAQ,QAAS,IAAK,EAIpC,QAAS,CAAE,KAAM,QAAS,QAAS,EAAM,EAKzC,aAAc,CAAE,KAAM,OAAkC,QAASC,EAAAA,iBAAiB,IAAK,EAIvF,kBAAmB,CAAE,KAAM,QAAS,QAAS,EAAM,CACrD,EACA,MAAO,CAKL,OACF,EACA,MAAMC,EAAO,CAAE,KAAAC,GAAQ,CACrB,MAAMC,EAAQC,EAAAA,WACRC,EAAQC,EAAAA,WACRC,EAAYC,EAAS,SAAA,WAAO,QAAAC,EAAAR,EAAM,OAAN,YAAAQ,EAAY,QAAQ,SAAU,GAAKR,EAAM,KAAO,OAAU,EAEtFS,EAAcF,EAAAA,SAAS,IAAMP,EAAM,MAAQA,EAAM,KAAK,QAAQI,EAAM,QAAQ,IAAM,CAAC,EACnFM,EAAaH,WAAS,IAAME,EAAY,OAAST,EAAM,OAASI,EAAM,QAAQ,EAE9EO,EAAsBJ,EAAAA,SAAS,IAAM,CAEzC,KAAM,CAAE,QAAAK,KAAYC,CAAA,EAAcX,EAC3B,OAAAW,CAAA,CACR,EAMM,MAAA,CACL,UAAAP,EACA,oBAAAK,EACA,YAAAF,EACA,WAAAC,EACA,QATc,IAAM,CACpBT,EAAK,OAAO,CAAA,CAQZ,CAEJ,CACF,CAAC"}

package/dist/components/navigation/link/NeonLink.ts_vue_type_script_src_5a48e750_lang.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"NeonLink.ts_vue_type_script_src_5a48e750_lang.es.js","sources":["../../../../src/components/navigation/link/NeonLink.ts?vue&type=script&src=5a48e750&lang.ts"],"sourcesContent":["import { computed, defineComponent, useAttrs } from 'vue';\nimport { NeonOutlineStyle } from '@/common/enums/NeonOutlineStyle';\nimport NeonIcon from '@/components/presentation/icon/NeonIcon.vue';\nimport { useRoute } from 'vue-router';\n\n/**\n * An HTML anchor component which handles VueRouter links (internal), href links (external) and clickable links (no href).\n */\nexport default defineComponent({\n  name: 'NeonLink',\n  components: {\n    NeonIcon,\n  },\n  props: {\n    /**\n     * The href of the link, this can be an internal (relative or absolute) or an external link.\n     */\n    href: { type: String, default: null },\n    /**\n     * set to true if you would like a completely unstyled link. This is useful for creating a complex component which may use NeonLink.\n     */\n    noStyle: { type: Boolean, default: false },\n    /**\n     * Style of the outline to use when the link has focus, use <em>text</em> for wrapping text content and\n     * <em>border</em> for tooltips wrapping \"block\" elements, e.g. buttons.\n     */\n    outlineStyle: { type: String as () => NeonOutlineStyle, default: NeonOutlineStyle.Text },\n    /**\n     * Display an external link icon to the right of the link indicating clicking it will take the user to another site.\n     */\n    externalIndicator: { type: Boolean, default: false },\n  },\n  emits: [\n    /**\n     * Emitted when the user triggers the link by clicking on it or hitting Enter when the link has focus.\n     * @type {void}\n     */\n    'click',\n  ],\n  setup(props, { emit }) {\n    const attrs = useAttrs();\n    const route = useRoute();\n    const routerUrl = computed(() => (props.href?.indexOf('//') === -1 ? props.href : undefined));\n\n    const activeRoute = computed(() => props.href && props.href.indexOf(route.fullPath) === 0);\n    const exactRoute = computed(() => activeRoute.value && props.href === route.fullPath);\n\n    const sanitizedAttributes = computed(() => {\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      const { onClick, ...sanitized } = attrs;\n      return sanitized;\n    });\n\n    const onClick = () => {\n      emit('click');\n    };\n\n    return {\n      routerUrl,\n      sanitizedAttributes,\n      activeRoute,\n      exactRoute,\n      onClick,\n    };\n  },\n});\n"],"names":["onClick"],"mappings":";;;;AAQA,IAAA,YAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,IACV;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IAIL,MAAM,EAAE,MAAM,QAAQ,SAAS,KAAK;AAAA,IAIpC,SAAS,EAAE,MAAM,SAAS,SAAS,MAAM;AAAA,IAKzC,cAAc,EAAE,MAAM,QAAkC,SAAS,iBAAiB,KAAK;AAAA,IAIvF,mBAAmB,EAAE,MAAM,SAAS,SAAS,MAAM;AAAA,EACrD;AAAA,EACA,OAAO;AAAA,IAKL;AAAA,EACF;AAAA,EACA,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,QAAQ;AACd,UAAM,QAAQ;AACR,UAAA,YAAY,SAAS;;AAAO,0BAAM,SAAN,mBAAY,QAAQ,WAAU,KAAK,MAAM,OAAO;AAAA,KAAU;AAEtF,UAAA,cAAc,SAAS,MAAM,MAAM,QAAQ,MAAM,KAAK,QAAQ,MAAM,QAAQ,MAAM,CAAC;AACnF,UAAA,aAAa,SAAS,MAAM,YAAY,SAAS,MAAM,SAAS,MAAM,QAAQ;AAE9E,UAAA,sBAAsB,SAAS,MAAM;AAEzC,YAAM,EAAE,SAAAA,aAAY,UAAA,IAAc;AAC3B,aAAA;AAAA,IAAA,CACR;AAED,UAAM,UAAU,MAAM;AACpB,WAAK,OAAO;AAAA,IAAA;AAGP,WAAA;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,EAEJ;AACF,CAAC;;"}