@toddledev/core - npm Package Compare versions

Comparing version 0.0.4 to 0.0.5

dist/api/api.js

@@ -1,16 +0,12 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.sortApiEntries = exports.sortApiObjects = exports.createApiEvent = exports.isApiError = exports.requestHash = exports.getBaseUrl = exports.getRequestHeaders = exports.getRequestQueryParams = exports.getRequestPath = exports.applyAbortSignal = exports.getUrl = exports.createApiRequest = exports.isLegacyApi = exports.NON_BODY_RESPONSE_CODES = void 0;
-const formula_1 = require("../formula/formula");
-const collections_1 = require("../utils/collections");
-const hash_1 = require("../utils/hash");
-const util_1 = require("../utils/util");
-const apiTypes_1 = require("./apiTypes");
-const LegacyToddleApi_1 = require("./LegacyToddleApi");
-const ToddleApiV2_1 = require("./ToddleApiV2");
-exports.NON_BODY_RESPONSE_CODES = [101, 204, 205, 304];
-const isLegacyApi = (api) => api instanceof LegacyToddleApi_1.LegacyToddleApi ? true : !('version' in api);
-exports.isLegacyApi = isLegacyApi;
-const createApiRequest = ({ api, formulaContext, baseUrl, defaultHeaders, }) => {
-    const url = (0, exports.getUrl)(api, formulaContext, baseUrl);
+import { applyFormula } from '../formula/formula';
+import { omitKeys, sortObjectEntries } from '../utils/collections';
+import { hash } from '../utils/hash';
+import { isDefined, isObject, toBoolean } from '../utils/util';
+import { ApiMethod } from './apiTypes';
+import { LegacyToddleApi } from './LegacyToddleApi';
+import { ToddleApiV2 } from './ToddleApiV2';
+export const NON_BODY_RESPONSE_CODES = [101, 204, 205, 304];
+export const isLegacyApi = (api) => api instanceof LegacyToddleApi ? true : !('version' in api);
+export const createApiRequest = ({ api, formulaContext, baseUrl, defaultHeaders, }) => {
+    const url = getUrl(api, formulaContext, baseUrl);
     const requestSettings = getRequestSettings({
@@ -23,8 +19,7 @@ api,
 };
-exports.createApiRequest = createApiRequest;
-const getUrl = (api, formulaContext, baseUrl) => {
+export const getUrl = (api, formulaContext, baseUrl) => {
     let urlPathname = '';
     let urlQueryParams = new URLSearchParams();
     let parsedUrl;
-    const url = (0, formula_1.applyFormula)(api.url, formulaContext);
+    const url = applyFormula(api.url, formulaContext);
     if (['string', 'number'].includes(typeof url)) {
@@ -41,3 +36,3 @@ const urlInput = typeof url === 'number' ? String(url) : url;
     }
-    const pathParams = (0, exports.getRequestPath)(api.path, formulaContext);
+    const pathParams = getRequestPath(api.path, formulaContext);
     // Combine potential path parameters from the url declaration with the actual path parameters
@@ -48,3 +43,3 @@ const path = `${urlPathname}${pathParams.length > 0 && !urlPathname.endsWith('/') ? '/' : ''}${pathParams}`;
         ...urlQueryParams,
-        ...(0, exports.getRequestQueryParams)(api.queryParams, formulaContext),
+        ...getRequestQueryParams(api.queryParams, formulaContext),
     ]);
@@ -62,13 +57,12 @@ const queryString = [...queryParams.entries()].length > 0 ? `?${queryParams.toString()}` : '';
 };
-exports.getUrl = getUrl;
 const HttpMethodsWithAllowedBody = [
-    apiTypes_1.ApiMethod.POST,
-    apiTypes_1.ApiMethod.DELETE,
-    apiTypes_1.ApiMethod.PUT,
-    apiTypes_1.ApiMethod.PATCH,
-    apiTypes_1.ApiMethod.OPTIONS,
+    ApiMethod.POST,
+    ApiMethod.DELETE,
+    ApiMethod.PUT,
+    ApiMethod.PATCH,
+    ApiMethod.OPTIONS,
 ];
-const applyAbortSignal = (api, requestSettings, formulaContext) => {
+export const applyAbortSignal = (api, requestSettings, formulaContext) => {
     if (api.timeout) {
-        const timeout = (0, formula_1.applyFormula)(api.timeout.formula, formulaContext);
+        const timeout = applyFormula(api.timeout.formula, formulaContext);
         if (typeof timeout === 'number' && !Number.isNaN(timeout) && timeout > 0) {
@@ -79,8 +73,7 @@ requestSettings.signal = AbortSignal.timeout(timeout);
 };
-exports.applyAbortSignal = applyAbortSignal;
 const getRequestSettings = ({ api, formulaContext, defaultHeaders, }) => {
-    const method = Object.values(apiTypes_1.ApiMethod).includes(api.method)
+    const method = Object.values(ApiMethod).includes(api.method)
         ? api.method
-        : apiTypes_1.ApiMethod.GET;
-    const headers = (0, exports.getRequestHeaders)({
+        : ApiMethod.GET;
+    const headers = getRequestHeaders({
         apiHeaders: api.headers,
@@ -99,14 +92,13 @@ formulaContext,
     };
-    (0, exports.applyAbortSignal)(api, requestSettings, formulaContext);
+    applyAbortSignal(api, requestSettings, formulaContext);
     return requestSettings;
 };
-const getRequestPath = (path, formulaContext) => (0, collections_1.sortObjectEntries)(path ?? {}, ([_, p]) => p.index)
-    .map(([_, p]) => (0, formula_1.applyFormula)(p.formula, formulaContext))
+export const getRequestPath = (path, formulaContext) => sortObjectEntries(path ?? {}, ([_, p]) => p.index)
+    .map(([_, p]) => applyFormula(p.formula, formulaContext))
     .join('/');
-exports.getRequestPath = getRequestPath;
-const getRequestQueryParams = (params, formulaContext) => {
+export const getRequestQueryParams = (params, formulaContext) => {
     const queryParams = new URLSearchParams();
     Object.entries(params ?? {}).forEach(([key, param]) => {
-        const enabled = (0, util_1.isDefined)(param.enabled)
-            ? (0, formula_1.applyFormula)(param.enabled, formulaContext)
+        const enabled = isDefined(param.enabled)
+            ? applyFormula(param.enabled, formulaContext)
             : true;
@@ -116,4 +108,4 @@ if (!enabled) {
         }
-        const value = (0, formula_1.applyFormula)(param.formula, formulaContext);
-        if (!(0, util_1.isDefined)(value)) {
+        const value = applyFormula(param.formula, formulaContext);
+        if (!isDefined(value)) {
             // Ignore null/undefined values
@@ -126,7 +118,7 @@ return;
         }
-        else if ((0, util_1.isObject)(value)) {
+        else if (isObject(value)) {
             // Support encoding (nested) objects, but cast any non-object to a String
             const encodeObject = (obj, prefix) => {
                 Object.entries(obj).forEach(([key, val]) => {
-                    if (!Array.isArray(val) && (0, util_1.isObject)(val)) {
+                    if (!Array.isArray(val) && isObject(val)) {
                         return encodeObject(val, `${prefix}[${key}]`);
@@ -147,12 +139,11 @@ }
 };
-exports.getRequestQueryParams = getRequestQueryParams;
-const getRequestHeaders = ({ apiHeaders, formulaContext, defaultHeaders, }) => {
+export const getRequestHeaders = ({ apiHeaders, formulaContext, defaultHeaders, }) => {
     const headers = new Headers(defaultHeaders);
     Object.entries(apiHeaders ?? {}).forEach(([key, param]) => {
-        const enabled = (0, util_1.isDefined)(param.enabled)
-            ? (0, formula_1.applyFormula)(param.enabled, formulaContext)
+        const enabled = isDefined(param.enabled)
+            ? applyFormula(param.enabled, formulaContext)
             : true;
         if (enabled) {
-            const value = (0, formula_1.applyFormula)(param.formula, formulaContext);
-            if ((0, util_1.isDefined)(value)) {
+            const value = applyFormula(param.formula, formulaContext);
+            if (isDefined(value)) {
                 try {
@@ -168,18 +159,15 @@ headers.set(key.trim(), (typeof value === 'string' ? value : String(value)).trim());
 };
-exports.getRequestHeaders = getRequestHeaders;
-const getBaseUrl = ({ origin, url, }) => !(0, util_1.isDefined)(url) || url === '' || url.startsWith('/') ? origin + url : url;
-exports.getBaseUrl = getBaseUrl;
+export const getBaseUrl = ({ origin, url, }) => !isDefined(url) || url === '' || url.startsWith('/') ? origin + url : url;
 /**
  * Calculate the hash of a Request object based on its properties
  */
-const requestHash = (url, request) => (0, hash_1.hash)(JSON.stringify({
+export const requestHash = (url, request) => hash(JSON.stringify({
     url: url.href,
     method: request.method,
-    headers: (0, collections_1.omitKeys)(Object.fromEntries(Object.entries(request.headers ?? {})), ['host', 'cookie']),
+    headers: omitKeys(Object.fromEntries(Object.entries(request.headers ?? {})), ['host', 'cookie']),
     body: request.body ?? null,
 }));
-exports.requestHash = requestHash;
-const isApiError = ({ apiName, response, formulaContext, errorFormula, performance, }) => {
+export const isApiError = ({ apiName, response, formulaContext, errorFormula, performance, }) => {
     const errorFormulaRes = errorFormula
-        ? (0, formula_1.applyFormula)(errorFormula.formula, {
+        ? applyFormula(errorFormula.formula, {
             component: formulaContext.component,
@@ -211,5 +199,4 @@ package: formulaContext.package,
     }
-    return (0, util_1.toBoolean)(errorFormulaRes);
+    return toBoolean(errorFormulaRes);
 };
-exports.isApiError = isApiError;
 const getRequestBody = ({ api, formulaContext, headers, method, }) => {
@@ -219,3 +206,3 @@ if (!api.body || !HttpMethodsWithAllowedBody.includes(method)) {
     }
-    const body = (0, formula_1.applyFormula)(api.body, formulaContext);
+    const body = applyFormula(api.body, formulaContext);
     if (!body) {
@@ -257,3 +244,3 @@ return;
 };
-const createApiEvent = (eventName, detail) => {
+export const createApiEvent = (eventName, detail) => {
     return new CustomEvent(eventName, {
@@ -263,3 +250,2 @@ detail,
 };
-exports.createApiEvent = createApiEvent;
 const compareApiDependencies = (a, b) => {
@@ -274,3 +260,3 @@ const isADependentOnB = a.apiReferences.has(b.name);
 };
-const sortApiObjects = (apis) => {
+export const sortApiObjects = (apis) => {
     const apiMap = new Map();
@@ -282,3 +268,3 @@ const getApi = (apiObj, key) => {
                 apiObj.version === 2
-                    ? new ToddleApiV2_1.ToddleApiV2(apiObj, key, 
+                    ? new ToddleApiV2(apiObj, key, 
                     // global formulas are not required for sorting
@@ -289,3 +275,3 @@ {
                     })
-                    : new LegacyToddleApi_1.LegacyToddleApi(apiObj, key, 
+                    : new LegacyToddleApi(apiObj, key, 
                     // global formulas are not required for sorting
@@ -306,5 +292,3 @@ {
 };
-exports.sortApiObjects = sortApiObjects;
-const sortApiEntries = (apis) => [...apis].sort(([_, a], [__, b]) => compareApiDependencies(a, b));
-exports.sortApiEntries = sortApiEntries;
+export const sortApiEntries = (apis) => [...apis].sort(([_, a], [__, b]) => compareApiDependencies(a, b));
 //# sourceMappingURL=api.js.map

dist/api/apiTypes.d.ts

 import type { EventModel } from '../component/component.types';
 import type { Formula } from '../formula/formula';
+import type { ToddleMetadata } from '../types';
 export type ComponentAPI = LegacyComponentAPI | ApiRequest;
@@ -45,3 +46,3 @@ export interface LegacyComponentAPI {
 export type RedirectStatusCode = 300 | 301 | 302 | 303 | 304 | 307 | 308;
-export interface ApiBase {
+export interface ApiBase extends ToddleMetadata {
     url?: Formula;
@@ -69,3 +70,3 @@ path?: Record<string, {
     inputs: Record<string, {
-        formula: Formula;
+        formula: Formula | null;
     }>;
@@ -72,0 +73,0 @@ service?: string | null;

dist/api/apiTypes.js

@@ -1,5 +0,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ApiMethod = void 0;
-var ApiMethod;
+export var ApiMethod;
 (function (ApiMethod) {
@@ -13,3 +10,3 @@ ApiMethod["GET"] = "GET";
     ApiMethod["OPTIONS"] = "OPTIONS";
-})(ApiMethod || (exports.ApiMethod = ApiMethod = {}));
+})(ApiMethod || (ApiMethod = {}));
 //# sourceMappingURL=apiTypes.js.map

dist/api/headers.js

@@ -1,4 +0,1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isImageHeader = exports.isJsonStreamHeader = exports.isEventStreamHeader = exports.isTextHeader = exports.isJsonHeader = void 0;
 /**
@@ -9,3 +6,3 @@ * Checks if a header is a json (content-type) header
  */
-const isJsonHeader = (header) => {
+export const isJsonHeader = (header) => {
     if (typeof header !== 'string') {
@@ -16,4 +13,3 @@ return false;
 };
-exports.isJsonHeader = isJsonHeader;
-const isTextHeader = (header) => {
+export const isTextHeader = (header) => {
     if (typeof header !== 'string') {
@@ -24,4 +20,3 @@ return false;
 };
-exports.isTextHeader = isTextHeader;
-const isEventStreamHeader = (header) => {
+export const isEventStreamHeader = (header) => {
     if (typeof header !== 'string') {
@@ -32,4 +27,3 @@ return false;
 };
-exports.isEventStreamHeader = isEventStreamHeader;
-const isJsonStreamHeader = (header) => {
+export const isJsonStreamHeader = (header) => {
     if (typeof header !== 'string') {
@@ -40,4 +34,3 @@ return false;
 };
-exports.isJsonStreamHeader = isJsonStreamHeader;
-const isImageHeader = (header) => {
+export const isImageHeader = (header) => {
     if (typeof header !== 'string') {
@@ -48,3 +41,2 @@ return false;
 };
-exports.isImageHeader = isImageHeader;
 //# sourceMappingURL=headers.js.map

dist/api/LegacyToddleApi.js

@@ -1,8 +0,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.LegacyToddleApi = void 0;
-const formula_1 = require("../formula/formula");
-const formulaUtils_1 = require("../formula/formulaUtils");
-const util_1 = require("../utils/util");
-class LegacyToddleApi {
+import { isFormula } from '../formula/formula';
+import { getFormulasInAction, getFormulasInFormula, } from '../formula/formulaUtils';
+import { isDefined } from '../utils/util';
+export class LegacyToddleApi {
     api;
@@ -24,3 +21,3 @@ key;
         const visitFormulaReference = (formula) => {
-            if (!(0, util_1.isDefined)(formula)) {
+            if (!isDefined(formula)) {
                 return;
@@ -60,3 +57,3 @@ }
         // this is supporting a few legacy cases where the whole header object was set as a formula. This is no longer possible
-        if ((0, formula_1.isFormula)(this.api.headers)) {
+        if (isFormula(this.api.headers)) {
             visitFormulaReference(this.api.headers);
@@ -121,3 +118,3 @@ }
         const apiKey = this.key;
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: api.autoFetch,
@@ -127,3 +124,3 @@ globalFormulas: this.globalFormulas,
         });
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: api.url,
@@ -134,3 +131,3 @@ globalFormulas: this.globalFormulas,
         for (const [pathKey, path] of Object.entries(api.path ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+            yield* getFormulasInFormula({
                 formula: path.formula,
@@ -142,3 +139,3 @@ globalFormulas: this.globalFormulas,
         for (const [queryParamKey, queryParam] of Object.entries(api.queryParams ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+            yield* getFormulasInFormula({
                 formula: queryParam.formula,
@@ -150,4 +147,4 @@ globalFormulas: this.globalFormulas,
         // this is supporting a few legacy cases where the whole header object was set as a formula. This is no longer possible
-        if ((0, formula_1.isFormula)(api.headers)) {
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+        if (isFormula(api.headers)) {
+            yield* getFormulasInFormula({
                 formula: api.headers,
@@ -160,3 +157,3 @@ globalFormulas: this.globalFormulas,
             for (const [headerKey, header] of Object.entries(api.headers ?? {})) {
-                yield* (0, formulaUtils_1.getFormulasInFormula)({
+                yield* getFormulasInFormula({
                     formula: header,
@@ -168,3 +165,3 @@ globalFormulas: this.globalFormulas,
         }
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: api.body,
@@ -175,3 +172,3 @@ globalFormulas: this.globalFormulas,
         for (const [actionKey, action] of Object.entries(api.onCompleted?.actions ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInAction)({
+            yield* getFormulasInAction({
                 action,
@@ -183,3 +180,3 @@ globalFormulas: this.globalFormulas,
         for (const [actionKey, action] of Object.entries(api.onFailed?.actions ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInAction)({
+            yield* getFormulasInAction({
                 action,
@@ -192,3 +189,2 @@ globalFormulas: this.globalFormulas,
 }
-exports.LegacyToddleApi = LegacyToddleApi;
 //# sourceMappingURL=LegacyToddleApi.js.map

dist/api/template.js

@@ -1,8 +0,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.STRING_TEMPLATE = void 0;
-const STRING_TEMPLATE = (type, name) => {
+export const STRING_TEMPLATE = (type, name) => {
     return `{{ ${templateTypes[type]}.${name} }}`;
 };
-exports.STRING_TEMPLATE = STRING_TEMPLATE;
 const templateTypes = {
@@ -9,0 +5,0 @@ cookies: 'cookies',

dist/api/ToddleApiV2.d.ts

@@ -32,3 +32,3 @@ import type { ActionModel } from '../component/component.types';
     get inputs(): Record<string, {
-        formula: Formula;
+        formula: Formula | null;
     }>;
@@ -71,4 +71,9 @@ get queryParams(): Record<string, {
     } | null | undefined;
+    get '@toddle/metadata'(): {
+        comments: Record<string, import("../types").Comment & {
+            index: number;
+        }> | null;
+    } | null | undefined;
     formulasInApi(): Generator<[(string | number)[], Formula]>;
     actionModelsInApi(): Generator<[(string | number)[], ActionModel]>;
 }

dist/api/ToddleApiV2.js

@@ -1,8 +0,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ToddleApiV2 = void 0;
-const actionUtils_1 = require("../component/actionUtils");
-const formulaUtils_1 = require("../formula/formulaUtils");
-const util_1 = require("../utils/util");
-class ToddleApiV2 {
+import { getActionsInAction } from '../component/actionUtils';
+import { getFormulasInAction, getFormulasInFormula, } from '../formula/formulaUtils';
+import { isDefined } from '../utils/util';
+export class ToddleApiV2 {
     api;
@@ -24,3 +21,3 @@ _apiReferences;
         const visitFormulaReference = (formula) => {
-            if (!(0, util_1.isDefined)(formula)) {
+            if (!isDefined(formula)) {
                 return;
@@ -129,2 +126,5 @@ }
     }
+    get '@toddle/metadata'() {
+        return this.api['@toddle/metadata'];
+    }
     *formulasInApi() {
@@ -134,3 +134,3 @@ const api = this.api;
         for (const [input, value] of Object.entries(this.api.inputs)) {
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+            yield* getFormulasInFormula({
                 formula: value.formula,
@@ -141,3 +141,3 @@ globalFormulas: this.globalFormulas,
         }
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: api.autoFetch,
@@ -147,3 +147,3 @@ globalFormulas: this.globalFormulas,
         });
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: api.url,
@@ -154,3 +154,3 @@ globalFormulas: this.globalFormulas,
         for (const [pathKey, path] of Object.entries(api.path ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+            yield* getFormulasInFormula({
                 formula: path.formula,
@@ -162,3 +162,3 @@ globalFormulas: this.globalFormulas,
         for (const [queryParamKey, queryParam] of Object.entries(api.queryParams ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+            yield* getFormulasInFormula({
                 formula: queryParam.formula,
@@ -168,3 +168,3 @@ globalFormulas: this.globalFormulas,
             });
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+            yield* getFormulasInFormula({
                 formula: queryParam.enabled,
@@ -176,3 +176,3 @@ globalFormulas: this.globalFormulas,
         for (const [headerKey, header] of Object.entries(api.headers ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+            yield* getFormulasInFormula({
                 formula: header.formula,
@@ -182,3 +182,3 @@ globalFormulas: this.globalFormulas,
             });
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+            yield* getFormulasInFormula({
                 formula: header.enabled,
@@ -189,3 +189,3 @@ globalFormulas: this.globalFormulas,
         }
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: api.body,
@@ -196,3 +196,3 @@ globalFormulas: this.globalFormulas,
         for (const [actionKey, action] of Object.entries(api.client?.onCompleted?.actions ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInAction)({
+            yield* getFormulasInAction({
                 action,
@@ -204,3 +204,3 @@ globalFormulas: this.globalFormulas,
         for (const [actionKey, action] of Object.entries(api.client?.onFailed?.actions ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInAction)({
+            yield* getFormulasInAction({
                 action,
@@ -211,3 +211,3 @@ globalFormulas: this.globalFormulas,
         }
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: api.client?.debounce?.formula,
@@ -218,3 +218,3 @@ globalFormulas: this.globalFormulas,
         for (const [actionKey, action] of Object.entries(api.client?.onMessage?.actions ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInAction)({
+            yield* getFormulasInAction({
                 action,
@@ -226,3 +226,3 @@ globalFormulas: this.globalFormulas,
         for (const [rule, value] of Object.entries(api.redirectRules ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+            yield* getFormulasInFormula({
                 formula: value.formula,
@@ -233,3 +233,3 @@ globalFormulas: this.globalFormulas,
         }
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: api.isError?.formula,
@@ -239,3 +239,3 @@ globalFormulas: this.globalFormulas,
         });
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: api.timeout?.formula,
@@ -245,3 +245,3 @@ globalFormulas: this.globalFormulas,
         });
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: api.server?.proxy?.enabled.formula,
@@ -251,3 +251,3 @@ globalFormulas: this.globalFormulas,
         });
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: api.server?.ssr?.enabled?.formula,
@@ -260,3 +260,3 @@ globalFormulas: this.globalFormulas,
         for (const [actionKey, action] of Object.entries(this.api.client?.onCompleted?.actions ?? {})) {
-            yield* (0, actionUtils_1.getActionsInAction)(action, [
+            yield* getActionsInAction(action, [
                 'apis',
@@ -271,3 +271,3 @@ this.key,
         for (const [actionKey, action] of Object.entries(this.api.client?.onFailed?.actions ?? {})) {
-            yield* (0, actionUtils_1.getActionsInAction)(action, [
+            yield* getActionsInAction(action, [
                 'apis',
@@ -282,3 +282,3 @@ this.key,
         for (const [actionKey, action] of Object.entries(this.api.client?.onMessage?.actions ?? {})) {
-            yield* (0, actionUtils_1.getActionsInAction)(action, [
+            yield* getActionsInAction(action, [
                 'apis',
@@ -294,3 +294,2 @@ this.key,
 }
-exports.ToddleApiV2 = ToddleApiV2;
 //# sourceMappingURL=ToddleApiV2.js.map

dist/component/actionUtils.js

@@ -1,7 +0,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getActionsInAction = getActionsInAction;
-const util_1 = require("../utils/util");
-function* getActionsInAction(action, path = []) {
-    if (!(0, util_1.isDefined)(action)) {
+import { isDefined } from '../utils/util';
+export function* getActionsInAction(action, path = []) {
+    if (!isDefined(action)) {
         return;
@@ -8,0 +5,0 @@ }

dist/component/component.types.d.ts

 import type { ApiStatus, ComponentAPI, LegacyApiStatus } from '../api/apiTypes';
 import type { Formula } from '../formula/formula';
 import type { StyleTokenCategory } from '../styling/theme';
-import type { RequireFields } from '../types';
+import type { RequireFields, ToddleMetadata } from '../types';
 interface ListItem {
@@ -145,9 +145,4 @@ Item: unknown;
     route?: PageRoute | null;
-    attributes: Record<string, {
-        name: string;
-        testValue: unknown;
-    }>;
-    variables: Record<string, {
-        initialValue: Formula;
-    }>;
+    attributes: Record<string, ComponentAttribute>;
+    variables: Record<string, ComponentVariable>;
     formulas?: Record<string, ComponentFormula>;
@@ -163,3 +158,3 @@ contexts?: Record<string, ComponentContext>;
 }
-export interface ComponentFormula {
+export interface ComponentFormula extends ToddleMetadata {
     name: string;
@@ -174,3 +169,3 @@ arguments: Array<{
 }
-export interface ComponentWorkflow {
+export interface ComponentWorkflow extends ToddleMetadata {
     name: string;
@@ -265,3 +260,3 @@ parameters: Array<{
     inputs?: Record<string, {
-        formula: Formula;
+        formula: Formula | null;
     }>;
@@ -297,6 +292,13 @@ onSuccess: {
 export type ActionModel = VariableActionModel | EventActionModel | SwitchActionModel | FetchActionModel | CustomActionModel | SetURLParameterAction | WorkflowActionModel;
-export interface ComponentEvent {
+export interface ComponentEvent extends ToddleMetadata {
     name: string;
     dummyEvent: any;
 }
+export interface ComponentVariable extends ToddleMetadata {
+    initialValue: Formula;
+}
+export interface ComponentAttribute extends ToddleMetadata {
+    name: string;
+    testValue: unknown;
+}
 export {};

dist/component/component.types.js

@@ -1,5 +0,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.HeadTagTypes = void 0;
-var HeadTagTypes;
+export var HeadTagTypes;
 (function (HeadTagTypes) {
@@ -11,3 +8,3 @@ HeadTagTypes["Meta"] = "meta";
     HeadTagTypes["Style"] = "style";
-})(HeadTagTypes || (exports.HeadTagTypes = HeadTagTypes = {}));
+})(HeadTagTypes || (HeadTagTypes = {}));
 //# sourceMappingURL=component.types.js.map

dist/component/isPageComponent.d.ts

@@ -1,2 +0,2 @@
-import type { Component } from './component.types';
-export declare const isPageComponent: (component: Component) => boolean;
+import type { Component, PageComponent } from './component.types';
+export declare const isPageComponent: (component: Component) => component is PageComponent;

dist/component/isPageComponent.js

@@ -1,7 +0,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isPageComponent = void 0;
-const util_1 = require("../utils/util");
-const isPageComponent = (component) => (0, util_1.isDefined)(component.route);
-exports.isPageComponent = isPageComponent;
+import { isDefined } from '../utils/util';
+export const isPageComponent = (component) => isDefined(component.route);
 //# sourceMappingURL=isPageComponent.js.map

dist/component/ToddleComponent.d.ts

@@ -33,9 +33,4 @@ import { LegacyToddleApi } from '../api/LegacyToddleApi';
     get route(): import("./component.types").PageRoute | null | undefined;
-    get attributes(): Record<string, {
-        name: string;
-        testValue: unknown;
-    }>;
-    get variables(): Record<string, {
-        initialValue: Formula;
-    }>;
+    get attributes(): Record<string, import("./component.types").ComponentAttribute>;
+    get variables(): Record<string, import("./component.types").ComponentVariable>;
     get workflows(): Record<string, import("./component.types").ComponentWorkflow> | undefined;
@@ -42,0 +37,0 @@ get apis(): {

dist/component/ToddleComponent.js

@@ -1,12 +0,9 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ToddleComponent = void 0;
-const api_1 = require("../api/api");
-const LegacyToddleApi_1 = require("../api/LegacyToddleApi");
-const ToddleApiV2_1 = require("../api/ToddleApiV2");
-const formulaUtils_1 = require("../formula/formulaUtils");
-const util_1 = require("../utils/util");
-const actionUtils_1 = require("./actionUtils");
-const isPageComponent_1 = require("./isPageComponent");
-class ToddleComponent {
+import { isLegacyApi } from '../api/api';
+import { LegacyToddleApi } from '../api/LegacyToddleApi';
+import { ToddleApiV2 } from '../api/ToddleApiV2';
+import { getFormulasInAction, getFormulasInFormula, } from '../formula/formulaUtils';
+import { isDefined } from '../utils/util';
+import { getActionsInAction } from './actionUtils';
+import { isPageComponent } from './isPageComponent';
+export class ToddleComponent {
     component;
@@ -49,3 +46,3 @@ globalFormulas;
             .filter((entry) => entry[1].type === 'function')
-            .map(([, f]) => [f.package, f.name].filter(util_1.isDefined).join('/')));
+            .map(([, f]) => [f.package, f.name].filter(isDefined).join('/')));
     }
@@ -55,3 +52,3 @@ get actionReferences() {
             .filter((entry) => entry[1].type === 'Custom' || entry[1].type === undefined)
-            .map(([, a]) => [a.package, a.name].filter(util_1.isDefined).join('/')));
+            .map(([, a]) => [a.package, a.name].filter(isDefined).join('/')));
     }
@@ -67,3 +64,3 @@ /**
                 case 'text':
-                    yield* (0, formulaUtils_1.getFormulasInFormula)({
+                    yield* getFormulasInFormula({
                         formula: node.condition,
@@ -73,3 +70,3 @@ globalFormulas,
                     });
-                    yield* (0, formulaUtils_1.getFormulasInFormula)({
+                    yield* getFormulasInFormula({
                         formula: node.repeat,
@@ -79,3 +76,3 @@ globalFormulas,
                     });
-                    yield* (0, formulaUtils_1.getFormulasInFormula)({
+                    yield* getFormulasInFormula({
                         formula: node.repeatKey,
@@ -85,3 +82,3 @@ globalFormulas,
                     });
-                    yield* (0, formulaUtils_1.getFormulasInFormula)({
+                    yield* getFormulasInFormula({
                         formula: node.value,
@@ -93,3 +90,3 @@ globalFormulas,
                 case 'slot':
-                    yield* (0, formulaUtils_1.getFormulasInFormula)({
+                    yield* getFormulasInFormula({
                         formula: node.condition,
@@ -101,3 +98,3 @@ globalFormulas,
                 case 'component':
-                    yield* (0, formulaUtils_1.getFormulasInFormula)({
+                    yield* getFormulasInFormula({
                         formula: node.condition,
@@ -107,3 +104,3 @@ globalFormulas,
                     });
-                    yield* (0, formulaUtils_1.getFormulasInFormula)({
+                    yield* getFormulasInFormula({
                         formula: node.repeat,
@@ -113,3 +110,3 @@ globalFormulas,
                     });
-                    yield* (0, formulaUtils_1.getFormulasInFormula)({
+                    yield* getFormulasInFormula({
                         formula: node.repeatKey,
@@ -120,3 +117,3 @@ globalFormulas,
                     for (const [attrKey, attr] of Object.entries(node.attrs ?? {})) {
-                        yield* (0, formulaUtils_1.getFormulasInFormula)({
+                        yield* getFormulasInFormula({
                             formula: attr,
@@ -129,3 +126,3 @@ globalFormulas,
                         for (const [actionKey, action] of Object.entries(event?.actions ?? {})) {
-                            yield* (0, formulaUtils_1.getFormulasInAction)({
+                            yield* getFormulasInAction({
                                 action,
@@ -139,3 +136,3 @@ globalFormulas,
                 case 'element':
-                    yield* (0, formulaUtils_1.getFormulasInFormula)({
+                    yield* getFormulasInFormula({
                         formula: node.condition,
@@ -145,3 +142,3 @@ globalFormulas,
                     });
-                    yield* (0, formulaUtils_1.getFormulasInFormula)({
+                    yield* getFormulasInFormula({
                         formula: node.repeat,
@@ -151,3 +148,3 @@ globalFormulas,
                     });
-                    yield* (0, formulaUtils_1.getFormulasInFormula)({
+                    yield* getFormulasInFormula({
                         formula: node.repeatKey,
@@ -158,3 +155,3 @@ globalFormulas,
                     for (const [attrKey, attr] of Object.entries(node.attrs ?? {})) {
-                        yield* (0, formulaUtils_1.getFormulasInFormula)({
+                        yield* getFormulasInFormula({
                             formula: attr,
@@ -167,3 +164,3 @@ globalFormulas,
                         for (const [actionKey, a] of Object.entries(event?.actions ?? {})) {
-                            yield* (0, formulaUtils_1.getFormulasInAction)({
+                            yield* getFormulasInAction({
                                 action: a,
@@ -176,3 +173,3 @@ globalFormulas,
                     for (const [classKey, c] of Object.entries(node.classes ?? {})) {
-                        yield* (0, formulaUtils_1.getFormulasInFormula)({
+                        yield* getFormulasInFormula({
                             formula: c.formula,
@@ -184,3 +181,3 @@ globalFormulas,
                     for (const [styleVariableKey, styleVariable] of Object.entries(node['style-variables'] ?? {})) {
-                        yield* (0, formulaUtils_1.getFormulasInFormula)({
+                        yield* getFormulasInFormula({
                             formula: styleVariable.formula,
@@ -194,3 +191,3 @@ globalFormulas,
         }
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: this.route?.info?.language?.formula,
@@ -200,3 +197,3 @@ globalFormulas,
         });
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: this.route?.info?.title?.formula,
@@ -206,3 +203,3 @@ globalFormulas,
         });
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: this.route?.info?.description?.formula,
@@ -212,3 +209,3 @@ globalFormulas,
         });
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: this.route?.info?.icon?.formula,
@@ -218,3 +215,3 @@ globalFormulas,
         });
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: this.route?.info?.charset?.formula,
@@ -225,3 +222,3 @@ globalFormulas,
         for (const [metaKey, meta] of Object.entries(this.route?.info?.meta ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+            yield* getFormulasInFormula({
                 formula: meta.content,
@@ -232,3 +229,3 @@ globalFormulas,
             for (const [attrKey, a] of Object.entries(meta.attrs)) {
-                yield* (0, formulaUtils_1.getFormulasInFormula)({
+                yield* getFormulasInFormula({
                     formula: a,
@@ -241,3 +238,3 @@ globalFormulas,
         for (const [formulaKey, formula] of Object.entries(this.formulas ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+            yield* getFormulasInFormula({
                 formula: formula.formula,
@@ -249,3 +246,3 @@ globalFormulas,
         for (const [variableKey, variable] of Object.entries(this.variables ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInFormula)({
+            yield* getFormulasInFormula({
                 formula: variable.initialValue,
@@ -258,3 +255,3 @@ globalFormulas,
             for (const [actionKey, action] of workflow.actions.entries()) {
-                yield* (0, formulaUtils_1.getFormulasInAction)({
+                yield* getFormulasInAction({
                     action,
@@ -270,3 +267,3 @@ globalFormulas,
         for (const [actionKey, action] of Object.entries(this.component.onLoad?.actions ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInAction)({
+            yield* getFormulasInAction({
                 action,
@@ -278,3 +275,3 @@ globalFormulas,
         for (const [actionKey, action] of Object.entries(this.component.onAttributeChange?.actions ?? {})) {
-            yield* (0, formulaUtils_1.getFormulasInAction)({
+            yield* getFormulasInAction({
                 action,
@@ -303,3 +300,3 @@ globalFormulas,
                         for (const [actionKey, a] of Object.entries(event?.actions ?? {})) {
-                            yield* (0, actionUtils_1.getActionsInAction)(a, [
+                            yield* getActionsInAction(a, [
                                 ...path,
@@ -318,3 +315,3 @@ 'events',
             for (const [key, a] of Object.entries(workflow?.actions ?? {})) {
-                yield* (0, actionUtils_1.getActionsInAction)(a, ['workflows', workflowKey, 'actions', key]);
+                yield* getActionsInAction(a, ['workflows', workflowKey, 'actions', key]);
             }
@@ -324,3 +321,3 @@ }
         for (const [apiKey, api] of Object.entries(this.apis ?? {})) {
-            if (!(0, api_1.isLegacyApi)(api)) {
+            if (!isLegacyApi(api)) {
                 yield* api.actionModelsInApi();
@@ -331,3 +328,3 @@ continue;
             for (const [actionKey, a] of Object.entries(api.onCompleted?.actions ?? {})) {
-                yield* (0, actionUtils_1.getActionsInAction)(a, [
+                yield* getActionsInAction(a, [
                     'apis',
@@ -341,3 +338,3 @@ apiKey,
             for (const [actionKey, a] of Object.entries(api.onFailed?.actions ?? {})) {
-                yield* (0, actionUtils_1.getActionsInAction)(a, [
+                yield* getActionsInAction(a, [
                     'apis',
@@ -352,6 +349,6 @@ apiKey,
         for (const [actionKey, action] of Object.entries(this.component.onLoad?.actions ?? {})) {
-            yield* (0, actionUtils_1.getActionsInAction)(action, ['onLoad', 'actions', actionKey]);
+            yield* getActionsInAction(action, ['onLoad', 'actions', actionKey]);
         }
         for (const [actionKey, action] of Object.entries(this.component.onAttributeChange?.actions ?? {})) {
-            yield* (0, actionUtils_1.getActionsInAction)(action, [
+            yield* getActionsInAction(action, [
                 'onAttributeChange',
@@ -389,5 +386,5 @@ 'actions',
             key,
-            (0, api_1.isLegacyApi)(api)
-                ? new LegacyToddleApi_1.LegacyToddleApi(api, key, this.globalFormulas)
-                : new ToddleApiV2_1.ToddleApiV2(api, key, this.globalFormulas),
+            isLegacyApi(api)
+                ? new LegacyToddleApi(api, key, this.globalFormulas)
+                : new ToddleApiV2(api, key, this.globalFormulas),
         ]));
@@ -408,3 +405,3 @@ }
     get isPage() {
-        return (0, isPageComponent_1.isPageComponent)(this.component);
+        return isPageComponent(this.component);
     }
@@ -415,3 +412,2 @@ get contexts() {
 }
-exports.ToddleComponent = ToddleComponent;
 //# sourceMappingURL=ToddleComponent.js.map

dist/formula/formula.d.ts

 import type { Component, ComponentData } from '../component/component.types';
-import type { CustomFormulaHandler, FormulaLookup } from '../types';
+import type { CustomFormulaHandler, FormulaLookup, ToddleMetadata } from '../types';
 type ShadowRoot = DocumentFragment;
-export type PathOperation = {
+export interface PathOperation extends ToddleMetadata {
     type: 'path';
     path: string[];
-};
+}
 type FunctionArgument = {
@@ -13,18 +13,19 @@ name?: string;
 };
-export type FunctionOperation = {
+export interface FunctionOperation extends ToddleMetadata {
     type: 'function';
     name: string;
+    display_name?: string | null;
     package?: string;
     arguments: FunctionArgument[];
     variableArguments?: boolean;
-};
-export type RecordOperation = {
+}
+export interface RecordOperation extends ToddleMetadata {
     type: 'record';
     entries: FunctionArgument[];
-};
-export type ObjectOperation = {
+}
+export interface ObjectOperation extends ToddleMetadata {
     type: 'object';
     arguments?: FunctionArgument[];
-};
-export type ArrayOperation = {
+}
+export interface ArrayOperation extends ToddleMetadata {
     type: 'array';
@@ -34,4 +35,4 @@ arguments: Array<{
     }>;
-};
-export type OrOperation = {
+}
+export interface OrOperation extends ToddleMetadata {
     type: 'or';
@@ -41,4 +42,4 @@ arguments: Array<{
     }>;
-};
-export type AndOperation = {
+}
+export interface AndOperation extends ToddleMetadata {
     type: 'and';
@@ -48,14 +49,14 @@ arguments: Array<{
     }>;
-};
-export type ApplyOperation = {
+}
+export interface ApplyOperation extends ToddleMetadata {
     type: 'apply';
     name: string;
     arguments: FunctionArgument[];
-};
-export type ValueOperation = {
+}
+export interface ValueOperation extends ToddleMetadata {
     type: 'value';
-    value: string | number | boolean | null | object;
-};
+    value: ValueOperationValue;
+}
 export type ValueOperationValue = string | number | boolean | null | object;
-export type SwitchOperation = {
+export interface SwitchOperation extends ToddleMetadata {
     type: 'switch';
@@ -67,3 +68,3 @@ cases: Array<{
     default: Formula;
-};
+}
 export type Formula = FunctionOperation | RecordOperation | ObjectOperation | ArrayOperation | PathOperation | SwitchOperation | OrOperation | AndOperation | ValueOperation | ApplyOperation;
@@ -106,3 +107,3 @@ export type FormulaContext = {
 export declare function isFormulaApplyOperation(formula: Formula): formula is ApplyOperation;
-export declare function applyFormula(formula: Formula | string | number | undefined | boolean, ctx: FormulaContext): any;
+export declare function applyFormula(formula: Formula | string | number | undefined | null | boolean, ctx: FormulaContext): any;
 export {};

dist/formula/formula.js

@@ -1,15 +0,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isFormula = isFormula;
-exports.isFormulaApplyOperation = isFormulaApplyOperation;
-exports.applyFormula = applyFormula;
-const util_1 = require("../utils/util");
-const formulaTypes_1 = require("./formulaTypes");
-function isFormula(f) {
+import { isDefined, toBoolean } from '../utils/util';
+import { isToddleFormula } from './formulaTypes';
+export function isFormula(f) {
     return f && typeof f === 'object' && typeof f.type === 'string';
 }
-function isFormulaApplyOperation(formula) {
+export function isFormulaApplyOperation(formula) {
     return formula.type === 'apply';
 }
-function applyFormula(formula, ctx) {
+export function applyFormula(formula, ctx) {
     if (!isFormula(formula)) {
@@ -36,3 +31,3 @@ return formula;
                 for (const branch of formula.cases) {
-                    if ((0, util_1.toBoolean)(applyFormula(branch.condition, ctx))) {
+                    if (toBoolean(applyFormula(branch.condition, ctx))) {
                         return applyFormula(branch.formula, ctx);
@@ -45,3 +40,3 @@ }
                 for (const entry of formula.arguments) {
-                    if ((0, util_1.toBoolean)(applyFormula(entry.formula, ctx))) {
+                    if (toBoolean(applyFormula(entry.formula, ctx))) {
                         return true;
@@ -54,3 +49,3 @@ }
                 for (const entry of formula.arguments) {
-                    if (!(0, util_1.toBoolean)(applyFormula(entry.formula, ctx))) {
+                    if (!toBoolean(applyFormula(entry.formula, ctx))) {
                         return false;
@@ -66,3 +61,3 @@ }
                 const legacyFunc = (ctx.toddle ?? globalThis.toddle).getFormula(formula.name);
-                if ((0, util_1.isDefined)(newFunc)) {
+                if (isDefined(newFunc)) {
                     const args = formula.arguments.reduce((args, arg, i) => ({
@@ -83,3 +78,3 @@ ...args,
                     try {
-                        return (0, formulaTypes_1.isToddleFormula)(newFunc)
+                        return isToddleFormula(newFunc)
                             ? applyFormula(newFunc.formula, {
@@ -86,0 +81,0 @@ ...ctx,

dist/formula/formulaTypes.js

@@ -1,6 +0,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.isToddleFormula = void 0;
-const isToddleFormula = (formula) => Object.hasOwn(formula, 'formula');
-exports.isToddleFormula = isToddleFormula;
+export const isToddleFormula = (formula) => Object.hasOwn(formula, 'formula');
 //# sourceMappingURL=formulaTypes.js.map

dist/formula/formulaUtils.js

@@ -1,20 +0,13 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.functionFormula = exports.pathFormula = exports.valueFormula = void 0;
-exports.getFormulasInFormula = getFormulasInFormula;
-exports.getFormulasInAction = getFormulasInAction;
-const util_1 = require("../utils/util");
-const formula_1 = require("./formula");
-const formulaTypes_1 = require("./formulaTypes");
-const valueFormula = (value) => ({
+import { isDefined } from '../utils/util';
+import { isFormula } from './formula';
+import { isToddleFormula } from './formulaTypes';
+export const valueFormula = (value) => ({
     type: 'value',
     value,
 });
-exports.valueFormula = valueFormula;
-const pathFormula = (path) => ({
+export const pathFormula = (path) => ({
     type: 'path',
     path,
 });
-exports.pathFormula = pathFormula;
-const functionFormula = (name, formula) => ({
+export const functionFormula = (name, formula) => ({
     type: 'function',
@@ -26,5 +19,4 @@ name,
 });
-exports.functionFormula = functionFormula;
-function* getFormulasInFormula({ formula, globalFormulas, path = [], visitedFormulas = new Set(), }) {
-    if (!(0, util_1.isDefined)(formula)) {
+export function* getFormulasInFormula({ formula, globalFormulas, path = [], visitedFormulas = new Set(), }) {
+    if (!isDefined(formula)) {
         return;
@@ -49,3 +41,3 @@ }
             const formulaKey = [formula.package, formula.name]
-                .filter(util_1.isDefined)
+                .filter(isDefined)
                 .join('/');
@@ -68,3 +60,3 @@ const shouldVisitFormula = !visitedFormulas.has(formulaKey);
             if (globalFormula &&
-                (0, formulaTypes_1.isToddleFormula)(globalFormula) &&
+                isToddleFormula(globalFormula) &&
                 shouldVisitFormula) {
@@ -127,4 +119,4 @@ yield* getFormulasInFormula({
 }
-function* getFormulasInAction({ action, globalFormulas, path = [], visitedFormulas = new Set(), }) {
-    if (!(0, util_1.isDefined)(action)) {
+export function* getFormulasInAction({ action, globalFormulas, path = [], visitedFormulas = new Set(), }) {
+    if (!isDefined(action)) {
         return;
@@ -169,3 +161,3 @@ }
         case undefined:
-            if ((0, formula_1.isFormula)(action.data)) {
+            if (isFormula(action.data)) {
                 yield* getFormulasInFormula({
@@ -218,3 +210,3 @@ formula: action.data,
         case 'Switch':
-            if ((0, util_1.isDefined)(action.data) && (0, formula_1.isFormula)(action.data)) {
+            if (isDefined(action.data) && isFormula(action.data)) {
                 yield* getFormulasInFormula({
@@ -221,0 +213,0 @@ formula: action.data,

dist/formula/ToddleFormula.js

@@ -1,6 +0,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.ToddleFormula = void 0;
-const formulaUtils_1 = require("./formulaUtils");
-class ToddleFormula {
+import { getFormulasInFormula } from './formulaUtils';
+export class ToddleFormula {
     formula;
@@ -17,3 +14,3 @@ globalFormulas;
     *formulasInFormula() {
-        yield* (0, formulaUtils_1.getFormulasInFormula)({
+        yield* getFormulasInFormula({
             formula: this.formula,
@@ -24,3 +21,2 @@ globalFormulas: this.globalFormulas,
 }
-exports.ToddleFormula = ToddleFormula;
 //# sourceMappingURL=ToddleFormula.js.map

dist/styling/className.js

@@ -1,4 +0,1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.toValidClassName = exports.getClassName = void 0;
 // cSpell: ignore phash
@@ -36,7 +33,6 @@ const SEED = 5381;
 }
-const getClassName = (object) => {
+export const getClassName = (object) => {
     return generateAlphabeticName(hash(JSON.stringify(object)));
 };
-exports.getClassName = getClassName;
-const toValidClassName = (input, escapeSpecialCharacters = false) => {
+export const toValidClassName = (input, escapeSpecialCharacters = false) => {
     // Replace invalid characters with hyphens
@@ -57,3 +53,2 @@ let className = input
 };
-exports.toValidClassName = toValidClassName;
 //# sourceMappingURL=className.js.map

dist/styling/style.css.js

@@ -1,10 +0,6 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getAllFonts = exports.createStylesheet = void 0;
-exports.kebabCase = kebabCase;
-const collections_1 = require("../utils/collections");
-const util_1 = require("../utils/util");
-const className_1 = require("./className");
-const theme_1 = require("./theme");
-const variantSelector_1 = require("./variantSelector");
+import { omitKeys } from '../utils/collections';
+import { isDefined } from '../utils/util';
+import { getClassName, toValidClassName } from './className';
+import { getThemeCss } from './theme';
+import { variantSelector } from './variantSelector';
 const LEGACY_BREAKPOINTS = {
@@ -15,3 +11,3 @@ large: 1440,
 };
-function kebabCase(string) {
+export function kebabCase(string) {
     return string
@@ -63,8 +59,8 @@ .split('')
 ]);
-const createStylesheet = (root, components, theme, options) => {
+export const createStylesheet = (root, components, theme, options) => {
     const hashes = new Set();
     // Get fonts used on the page
-    const fonts = (0, exports.getAllFonts)(components);
+    const fonts = getAllFonts(components);
     //Exclude fonts that are not used on this page.
-    let stylesheet = (0, theme_1.getThemeCss)('breakpoints' in theme
+    let stylesheet = getThemeCss('breakpoints' in theme
         ? {
@@ -81,3 +77,3 @@ ...theme,
             .map(([property, value]) => {
-            if (!(0, util_1.isDefined)(value)) {
+            if (!isDefined(value)) {
                 // ignore undefined/null values
@@ -98,3 +94,3 @@ return;
         try {
-            const style = (0, collections_1.omitKeys)(node.style ?? {}, [
+            const style = omitKeys(node.style ?? {}, [
                 'variants',
@@ -145,3 +141,3 @@ 'breakpoints',
                 .map((variant) => {
-                const renderedVariant = renderVariant(`.${classHash}${(0, variantSelector_1.variantSelector)(variant)}`, variant.style, {
+                const renderedVariant = renderVariant(`.${classHash}${variantSelector(variant)}`, variant.style, {
                     startingStyle: variant.startingStyle,
@@ -197,3 +193,3 @@ });
                         '\n' +
-                            getNodeStyles(node, (0, className_1.toValidClassName)(`${component.name}:${id}`, true));
+                            getNodeStyles(node, toValidClassName(`${component.name}:${id}`, true));
                     return;
@@ -205,3 +201,3 @@ }
             }
-            const classHash = (0, className_1.getClassName)([node.style, node.variants]);
+            const classHash = getClassName([node.style, node.variants]);
             if (hashes.has(classHash)) {
@@ -217,4 +213,3 @@ return '';
 };
-exports.createStylesheet = createStylesheet;
-const getAllFonts = (components) => {
+export const getAllFonts = (components) => {
     return new Set(components
@@ -228,3 +223,3 @@ .flatMap((component) => {
                     ...(node.variants?.map((v) => v.style.fontFamily ?? v.style['font-family']) ?? []),
-                ].filter(util_1.isDefined);
+                ].filter(isDefined);
             }
@@ -236,3 +231,2 @@ return [];
 };
-exports.getAllFonts = getAllFonts;
 //# sourceMappingURL=style.css.js.map

dist/styling/theme.const.js

@@ -1,5 +0,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.theme = exports.RESET_STYLES = void 0;
-exports.RESET_STYLES = `
+export const RESET_STYLES = `
 @layer reset {
@@ -76,3 +73,3 @@ html {
 }`;
-exports.theme = {
+export const theme = {
     colors: {
@@ -79,0 +76,0 @@ grey: {

dist/styling/theme.js

@@ -1,11 +0,8 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.getOldThemeCss = exports.getThemeCss = void 0;
-const theme_const_1 = require("./theme.const");
-const getThemeCss = (theme, options) => {
+import { RESET_STYLES } from './theme.const';
+export const getThemeCss = (theme, options) => {
     if ('breakpoints' in theme) {
-        return (0, exports.getOldThemeCss)(theme);
+        return getOldThemeCss(theme);
     }
     return `
-${options.includeResetStyle ? theme_const_1.RESET_STYLES : ''}
+${options.includeResetStyle ? RESET_STYLES : ''}
 
@@ -126,4 +123,3 @@ @layer base {
 };
-exports.getThemeCss = getThemeCss;
-const getOldThemeCss = (theme) => {
+export const getOldThemeCss = (theme) => {
     const colorVars = Object.entries(theme.colors).flatMap(([color, { variants }]) => Object.entries(variants).map(([variant, { value }]) => `--${color}-${variant}:${value}`));
@@ -187,3 +183,3 @@ return `
 
-${theme_const_1.RESET_STYLES}
+${RESET_STYLES}
 
@@ -218,3 +214,2 @@ @keyframes animation-spin {
 };
-exports.getOldThemeCss = getOldThemeCss;
 //# sourceMappingURL=theme.js.map

dist/styling/variantSelector.js

@@ -1,5 +0,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.variantSelector = void 0;
-const variantSelector = (variant) => [
+export const variantSelector = (variant) => [
     (variant.className ?? variant['class']) && `.${variant.className}`,
@@ -28,3 +25,2 @@ (variant.evenChild ?? variant['even-child']) && ':nth-child(even)',
     .join('');
-exports.variantSelector = variantSelector;
 //# sourceMappingURL=variantSelector.js.map

dist/types.d.ts

@@ -81,2 +81,12 @@ import type { Component, ComponentData } from './component/component.types';
 }
+export interface Comment {
+    text: string;
+}
+export interface ToddleMetadata {
+    '@toddle/metadata'?: {
+        comments: Record<string, Comment & {
+            index: number;
+        }> | null;
+    } | null;
+}
 export type RequireFields<T, K extends keyof T> = Omit<T, K> & {
@@ -83,0 +93,0 @@ [P in K]-?: NonNullable<T[P]>;

dist/types.js

@@ -1,3 +0,2 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
+export {};
 //# sourceMappingURL=types.js.map

dist/utils/collections.js

@@ -1,17 +0,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.deepSortObject = exports.easySort = exports.sortObjectEntries = exports.set = exports.filterObject = exports.groupBy = exports.omitPaths = exports.omitKeys = exports.omit = exports.mapValues = exports.mapObject = exports.isObject = void 0;
-exports.get = get;
-const util_1 = require("./util");
-const isObject = (input) => typeof input === 'object' && input !== null;
-exports.isObject = isObject;
-const mapObject = (object, f) => Object.fromEntries(Object.entries(object).map(f));
-exports.mapObject = mapObject;
-const mapValues = (object, f) => (0, exports.mapObject)(object, ([key, value]) => [key, f(value)]);
-exports.mapValues = mapValues;
-const omit = (collection, key) => {
+import { isDefined } from './util';
+export const isObject = (input) => typeof input === 'object' && input !== null;
+export const mapObject = (object, f) => Object.fromEntries(Object.entries(object).map(f));
+export const mapValues = (object, f) => mapObject(object, ([key, value]) => [key, f(value)]);
+export const omit = (collection, key) => {
     const [head, ...rest] = key;
     const clone = Array.isArray(collection)
         ? [...collection]
-        : (0, exports.isObject)(collection)
+        : isObject(collection)
             ? { ...collection }
@@ -23,12 +16,9 @@ : {};
     else {
-        clone[head] = (0, exports.omit)(clone[head], rest);
+        clone[head] = omit(clone[head], rest);
     }
     return clone;
 };
-exports.omit = omit;
-const omitKeys = (object, keys) => Object.fromEntries(Object.entries(object).filter(([k]) => !keys.includes(k)));
-exports.omitKeys = omitKeys;
-const omitPaths = (object, keys) => keys.reduce((acc, key) => (0, exports.omit)(acc, key), { ...object });
-exports.omitPaths = omitPaths;
-const groupBy = (items, f) => items.reduce((acc, item) => {
+export const omitKeys = (object, keys) => Object.fromEntries(Object.entries(object).filter(([k]) => !keys.includes(k)));
+export const omitPaths = (object, keys) => keys.reduce((acc, key) => omit(acc, key), { ...object });
+export const groupBy = (items, f) => items.reduce((acc, item) => {
     const key = f(item);
@@ -39,6 +29,4 @@ acc[key] = acc[key] ?? [];
 }, {});
-exports.groupBy = groupBy;
-const filterObject = (object, f) => Object.fromEntries(Object.entries(object).filter(f));
-exports.filterObject = filterObject;
-function get(collection, [head, ...rest]) {
+export const filterObject = (object, f) => Object.fromEntries(Object.entries(object).filter(f));
+export function get(collection, [head, ...rest]) {
     if (rest.length === 0) {
@@ -49,16 +37,14 @@ return collection?.[head];
 }
-const set = (collection, key, value) => {
+export const set = (collection, key, value) => {
     const [head, ...rest] = key;
     const clone = Array.isArray(collection)
         ? [...collection]
-        : (0, exports.isObject)(collection)
+        : isObject(collection)
             ? { ...collection }
             : {};
-    clone[head] = rest.length === 0 ? value : (0, exports.set)(clone[head], rest, value);
+    clone[head] = rest.length === 0 ? value : set(clone[head], rest, value);
     return clone;
 };
-exports.set = set;
-const sortObjectEntries = (object, f, ascending = true) => (0, exports.easySort)(Object.entries(object), f, ascending);
-exports.sortObjectEntries = sortObjectEntries;
-const easySort = (collection, f, ascending = true) => [...collection].sort((a, b) => {
+export const sortObjectEntries = (object, f, ascending = true) => easySort(Object.entries(object), f, ascending);
+export const easySort = (collection, f, ascending = true) => [...collection].sort((a, b) => {
     const keyA = f(a);
@@ -71,13 +57,12 @@ const keyB = f(b);
 });
-exports.easySort = easySort;
-const deepSortObject = (obj) => {
-    if (!(0, util_1.isDefined)(obj)) {
+export const deepSortObject = (obj) => {
+    if (!isDefined(obj)) {
         return obj;
     }
     if (Array.isArray(obj)) {
-        return obj.map((val) => (0, exports.deepSortObject)(val));
+        return obj.map((val) => deepSortObject(val));
     }
     else if (typeof obj === 'object' && Object.keys(obj).length > 0) {
         return [...Object.keys(obj)].sort().reduce((acc, key) => {
-            acc[key] = (0, exports.deepSortObject)(obj[key]);
+            acc[key] = deepSortObject(obj[key]);
             return acc;
@@ -88,3 +73,2 @@ }, {});
 };
-exports.deepSortObject = deepSortObject;
 //# sourceMappingURL=collections.js.map

dist/utils/customElements.js

@@ -1,4 +0,1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.safeCustomElementName = void 0;
 /**
@@ -9,3 +6,3 @@ * Convert a component name to a valid HTML tag name according to the custom-element specs
  */
-const safeCustomElementName = (name) => {
+export const safeCustomElementName = (name) => {
     // Remove any white spaces from the name
@@ -19,3 +16,2 @@ const tag = name.toLocaleLowerCase().replaceAll(' ', '');
 };
-exports.safeCustomElementName = safeCustomElementName;
 //# sourceMappingURL=customElements.js.map

dist/utils/hash.js

@@ -1,8 +0,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.hash = void 0;
 // Based on https://stackoverflow.com/questions/7616461/generate-a-hash-from-string-in-javascript/52171480#52171480
 // This is a simple hash function for strings. It's not secure, but it's fast.
 // It's not suitable for cryptographic purposes, but it's great for hash tables.
-const hash = (data, seed = 0) => {
+export const hash = (data, seed = 0) => {
     let h1 = 0xdeadbeef ^ seed, h2 = 0x41c6ce57 ^ seed;
@@ -20,3 +17,2 @@ for (let i = 0, ch; i < data.length; i++) {
 };
-exports.hash = hash;
 //# sourceMappingURL=hash.js.map

dist/utils/json.js

@@ -1,4 +0,1 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.parseJSONWithDate = parseJSONWithDate;
 const iso8601Regex = /^\d{4}-\d{2}-\d{2}T\d{2}:\d{2}:\d{2}(?:.\d{1,3})?Z$/;
@@ -9,3 +6,3 @@ /**
  */
-function parseJSONWithDate(input) {
+export function parseJSONWithDate(input) {
     return JSON.parse(input, (_, value) => {
@@ -12,0 +9,0 @@ if (typeof value === 'string' &&

dist/utils/sha1.js

@@ -1,9 +0,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.sha1 = exports.stableStringify = void 0;
-const collections_1 = require("./collections");
-const stableStringify = (obj) => JSON.stringify((0, collections_1.deepSortObject)(obj));
-exports.stableStringify = stableStringify;
-const sha1 = async (data) => {
-    const payload = new Uint8Array((0, exports.stableStringify)(data)
+import { deepSortObject } from './collections';
+export const stableStringify = (obj) => JSON.stringify(deepSortObject(obj));
+export const sha1 = async (data) => {
+    const payload = new Uint8Array(stableStringify(data)
         .split('')
@@ -17,3 +13,2 @@ .map(function (c) {
 };
-exports.sha1 = sha1;
 //# sourceMappingURL=sha1.js.map

dist/utils/url.js

@@ -1,10 +0,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.REWRITE_HEADER = exports.PROXY_URL_HEADER = exports.validateUrl = exports.isLocalhostHostname = exports.isLocalhostUrl = void 0;
 const LOCALHOSTS = ['http://localhost:54404', 'http://preview.localhost:54404'];
-const isLocalhostUrl = (hrefOrOrigin) => LOCALHOSTS.some((host) => hrefOrOrigin.startsWith(host));
-exports.isLocalhostUrl = isLocalhostUrl;
-const isLocalhostHostname = (hostname) => hostname === 'localhost' || hostname === '127.0.0.1';
-exports.isLocalhostHostname = isLocalhostHostname;
-const validateUrl = (url, base) => {
+export const isLocalhostUrl = (hrefOrOrigin) => LOCALHOSTS.some((host) => hrefOrOrigin.startsWith(host));
+export const isLocalhostHostname = (hostname) => hostname === 'localhost' || hostname === '127.0.0.1';
+export const validateUrl = (url, base) => {
     if (typeof url !== 'string') {
@@ -26,5 +21,4 @@ return false;
 };
-exports.validateUrl = validateUrl;
-exports.PROXY_URL_HEADER = 'x-toddle-url';
-exports.REWRITE_HEADER = 'x-toddle-rewrite';
+export const PROXY_URL_HEADER = 'x-toddle-url';
+export const REWRITE_HEADER = 'x-toddle-rewrite';
 //# sourceMappingURL=url.js.map

dist/utils/util.js

@@ -1,10 +0,4 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.toBoolean = exports.isObject = exports.isDefined = void 0;
-const isDefined = (value) => value !== null && value !== undefined;
-exports.isDefined = isDefined;
-const isObject = (input) => typeof input === 'object' && input !== null;
-exports.isObject = isObject;
-const toBoolean = (value) => value !== false && value !== undefined && value !== null;
-exports.toBoolean = toBoolean;
+export const isDefined = (value) => value !== null && value !== undefined;
+export const isObject = (input) => typeof input === 'object' && input !== null;
+export const toBoolean = (value) => value !== false && value !== undefined && value !== null;
 //# sourceMappingURL=util.js.map

package.json

 {
 "name": "@toddledev/core",
 "license": "Apache-2.0",
+"type": "module",
 "homepage": "https://github.com/toddledev/toddle",
@@ -16,3 +17,3 @@ "devDependencies": {
 "main": "dist/index.js",
-"version": "0.0.4"
+"version": "0.0.5"
 }

src/api/apiTypes.ts

 import type { EventModel } from '../component/component.types'
 import type { Formula } from '../formula/formula'
+import type { ToddleMetadata } from '../types'
 
@@ -46,3 +47,3 @@ export type ComponentAPI = LegacyComponentAPI | ApiRequest
 
-export interface ApiBase {
+export interface ApiBase extends ToddleMetadata {
   url?: Formula
@@ -65,4 +66,4 @@ path?: Record<string, { formula: Formula; index: number }>
   body?: Formula
-  // inputs for an API request - the server will only accept listed arguments
-  inputs: Record<string, { formula: Formula }>
+  // inputs for an API request
+  inputs: Record<string, { formula: Formula | null }>
   service?: string | null
@@ -69,0 +70,0 @@ servicePath?: string | null

src/api/ToddleApiV2.ts

@@ -168,2 +168,6 @@ import { getActionsInAction } from '../component/actionUtils'
 
+  get '@toddle/metadata'() {
+    return this.api['@toddle/metadata']
+  }
+
   *formulasInApi(): Generator<[(string | number)[], Formula]> {
@@ -170,0 +174,0 @@ const api = this.api

src/component/component.types.ts

 import type { ApiStatus, ComponentAPI, LegacyApiStatus } from '../api/apiTypes'
 import type { Formula } from '../formula/formula'
 import type { StyleTokenCategory } from '../styling/theme'
-import type { RequireFields } from '../types'
+import type { RequireFields, ToddleMetadata } from '../types'
 
@@ -164,4 +164,4 @@ interface ListItem {
   route?: PageRoute | null
-  attributes: Record<string, { name: string; testValue: unknown }>
-  variables: Record<string, { initialValue: Formula }>
+  attributes: Record<string, ComponentAttribute>
+  variables: Record<string, ComponentVariable>
   formulas?: Record<string, ComponentFormula>
@@ -183,3 +183,3 @@ contexts?: Record<
 
-export interface ComponentFormula {
+export interface ComponentFormula extends ToddleMetadata {
   name: string
@@ -192,3 +192,3 @@ arguments: Array<{ name: string; testValue: any }>
 
-export interface ComponentWorkflow {
+export interface ComponentWorkflow extends ToddleMetadata {
   name: string
@@ -299,3 +299,3 @@ parameters: Array<{ name: string; testValue: any }>
   api: string
-  inputs?: Record<string, { formula: Formula }>
+  inputs?: Record<string, { formula: Formula | null }>
   onSuccess: { actions: ActionModel[] }
@@ -334,3 +334,3 @@ onError: { actions: ActionModel[] }
 
-export interface ComponentEvent {
+export interface ComponentEvent extends ToddleMetadata {
   name: string
@@ -340,1 +340,10 @@ // eslint-disable-next-line inclusive-language/use-inclusive-words
 }
+
+export interface ComponentVariable extends ToddleMetadata {
+  initialValue: Formula
+}
+
+export interface ComponentAttribute extends ToddleMetadata {
+  name: string
+  testValue: unknown
+}

src/component/isPageComponent.ts

 import { isDefined } from '../utils/util'
-import type { Component } from './component.types'
+import type { Component, PageComponent } from './component.types'
 
-export const isPageComponent = (component: Component) =>
-  isDefined(component.route)
+export const isPageComponent = (
+  component: Component,
+): component is PageComponent => isDefined(component.route)

src/formula/formula.ts

@@ -7,2 +7,3 @@ import type { Component, ComponentData } from '../component/component.types'
   Toddle,
+  ToddleMetadata,
 } from '../types'
@@ -16,3 +17,3 @@ import { isDefined, toBoolean } from '../utils/util'
 
-export type PathOperation = {
+export interface PathOperation extends ToddleMetadata {
   type: 'path'
@@ -28,5 +29,6 @@ path: string[]
 
-export type FunctionOperation = {
+export interface FunctionOperation extends ToddleMetadata {
   type: 'function'
   name: string
+  display_name?: string | null
   package?: string
@@ -37,3 +39,3 @@ arguments: FunctionArgument[]
 
-export type RecordOperation = {
+export interface RecordOperation extends ToddleMetadata {
   type: 'record'
@@ -43,3 +45,3 @@ entries: FunctionArgument[]
 
-export type ObjectOperation = {
+export interface ObjectOperation extends ToddleMetadata {
   type: 'object'
@@ -49,3 +51,3 @@ arguments?: FunctionArgument[]
 
-export type ArrayOperation = {
+export interface ArrayOperation extends ToddleMetadata {
   type: 'array'
@@ -55,3 +57,3 @@ arguments: Array<{ formula: Formula }>
 
-export type OrOperation = {
+export interface OrOperation extends ToddleMetadata {
   type: 'or'
@@ -61,3 +63,3 @@ arguments: Array<{ formula: Formula }>
 
-export type AndOperation = {
+export interface AndOperation extends ToddleMetadata {
   type: 'and'
@@ -67,3 +69,3 @@ arguments: Array<{ formula: Formula }>
 
-export type ApplyOperation = {
+export interface ApplyOperation extends ToddleMetadata {
   type: 'apply'
@@ -74,5 +76,5 @@ name: string
 
-export type ValueOperation = {
+export interface ValueOperation extends ToddleMetadata {
   type: 'value'
-  value: string | number | boolean | null | object
+  value: ValueOperationValue
 }
@@ -82,3 +84,3 @@
 
-export type SwitchOperation = {
+export interface SwitchOperation extends ToddleMetadata {
   type: 'switch'
@@ -158,3 +160,3 @@ cases: Array<{
 export function applyFormula(
-  formula: Formula | string | number | undefined | boolean,
+  formula: Formula | string | number | undefined | null | boolean,
   ctx: FormulaContext,
@@ -161,0 +163,0 @@ ): any {

src/types.ts

@@ -133,2 +133,12 @@ import type { Component, ComponentData } from './component/component.types'
 
+export interface Comment {
+  text: string
+}
+
+export interface ToddleMetadata {
+  '@toddle/metadata'?: {
+    comments: Record<string, Comment & { index: number }> | null
+  } | null
+}
+
 export type RequireFields<T, K extends keyof T> = Omit<T, K> & {
@@ -135,0 +145,0 @@ [P in K]-?: NonNullable<T[P]>

No alert changes

Improved metrics

Is type module

Yes

NaN

Worsened metrics

Total package byte prevSize

376612

-1.67%

Lines of code

8668

-1.19%

No dependency changes