@aerogel/core 0.1.0 → 0.1.1-next.d86959f8ee7dcf2194447eb424c1095912a5e5f8

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@aerogel/core",
-    "version": "0.1.0",
+    "version": "0.1.1-next.d86959f8ee7dcf2194447eb424c1095912a5e5f8",
     "type": "module",
     "sideEffects": false,
     "exports": {

package/src/directives/index.ts

@@ -3,22 +3,26 @@ import type { Directive } from 'vue';
 import { definePlugin } from '@aerogel/core/plugins';
 
 import measure from './measure';
+import safeHtml from './safe-html';
 
-const builtInDirectives: Record<string, Directive> = {
-    measure: measure,
-};
+export const aerogelDirectives = {
+    'measure': measure,
+    'safe-html': safeHtml,
+} as const satisfies Record<string, Directive>;
+
+export type AerogelDirectives = typeof aerogelDirectives;
 
 export * from './measure';
 
 export default definePlugin({
     install(app, options) {
         const directives = {
-            ...builtInDirectives,
+            ...aerogelDirectives,
             ...options.directives,
         };
 
         for (const [name, directive] of Object.entries(directives)) {
-            app.directive(name, directive);
+            app.directive(name, directive as Directive);
         }
     },
 });
@@ -30,7 +34,5 @@ declare module '@aerogel/core/bootstrap/options' {
 }
 
 declare module 'vue' {
-    interface ComponentCustomDirectives {
-        measure: Directive<string, string>;
-    }
+    interface ComponentCustomDirectives extends AerogelDirectives {}
 }

package/src/directives/safe-html.ts

@@ -0,0 +1,10 @@
+import { safeHtml } from '@aerogel/core/utils';
+import { defineDirective } from '@aerogel/core/utils/vue';
+
+export type SafeHTMLDirectiveValue = string;
+
+export default defineDirective<SafeHTMLDirectiveValue>({
+    mounted(element: HTMLElement, { value }) {
+        element.innerHTML = safeHtml(value);
+    },
+});