@nordcraft/core 1.0.74 → 1.0.76

package/src/formula/formula.ts

@@ -5,6 +5,7 @@ import type {
   FormulaHandler,
   FormulaLookup,
   NordcraftMetadata,
+  Nullable,
   Runtime,
   Toddle,
 } from '../types'
@@ -16,7 +17,7 @@ declare const document: Document | undefined
 type ShadowRoot = DocumentFragment
 
 interface BaseOperation extends NordcraftMetadata {
-  label?: string
+  label?: Nullable<string>
 }
 
 export interface PathOperation extends BaseOperation {
@@ -25,20 +26,20 @@ export interface PathOperation extends BaseOperation {
 }
 
 export interface FunctionArgument {
-  name?: string
-  isFunction?: boolean
+  name?: Nullable<string>
+  isFunction?: Nullable<boolean>
   formula: Formula
-  type?: any
-  testValue?: any
+  type?: Nullable<any>
+  testValue?: Nullable<any>
 }
 
 export interface FunctionOperation extends BaseOperation {
   type: 'function'
   name: string
-  display_name?: string | null
-  package?: string
+  display_name?: Nullable<string>
+  package?: Nullable<string>
   arguments: FunctionArgument[]
-  variableArguments?: boolean
+  variableArguments?: Nullable<boolean>
 }
 
 export interface RecordOperation extends BaseOperation {
@@ -48,7 +49,7 @@ export interface RecordOperation extends BaseOperation {
 
 export interface ObjectOperation extends BaseOperation {
   type: 'object'
-  arguments?: FunctionArgument[]
+  arguments?: Nullable<FunctionArgument[]>
 }
 
 export interface ArrayOperation extends BaseOperation {
@@ -102,16 +103,18 @@ export type Formula =
 
 export type FormulaContext = {
   component: Component | undefined
-  formulaCache?: Record<
-    string,
-    {
-      get: (data: ComponentData) => any
-      set: (data: ComponentData, result: any) => void
-    }
+  formulaCache?: Nullable<
+    Record<
+      string,
+      {
+        get: (data: ComponentData) => any
+        set: (data: ComponentData, result: any) => void
+      }
+    >
   >
   data: ComponentData
-  root?: Document | ShadowRoot | null
-  package: string | undefined
+  root?: Nullable<Document | ShadowRoot>
+  package: Nullable<string>
   toddle: {
     getFormula: FormulaLookup
     getCustomFormula: CustomFormulaHandler
@@ -225,7 +228,7 @@ export function applyFormula(
         return true
       }
       case 'function': {
-        const packageName = formula.package ?? ctx.package
+        const packageName = formula.package ?? ctx.package ?? undefined
         const newFunc = (
           ctx.toddle ??
           ((globalThis as any).toddle as Toddle<unknown, unknown> | undefined)

package/src/formula/formulaTypes.ts

@@ -1,16 +1,17 @@
+import type { Nullable } from '../types'
 import type { Formula } from './formula'
 
 export interface BaseFormula {
   name: string
-  description?: string
+  description?: Nullable<string>
   arguments: Array<{
     name: string
-    formula?: Formula | null
-    testValue?: unknown
+    formula?: Nullable<Formula>
+    testValue?: Nullable<unknown>
   }>
   // exported indicates that a formula is exported in a package
-  exported?: boolean
-  variableArguments?: boolean | null
+  exported?: Nullable<boolean>
+  variableArguments?: Nullable<boolean>
 }
 
 export interface ToddleFormula extends BaseFormula {
@@ -21,7 +22,7 @@ export interface ToddleFormula extends BaseFormula {
  * The Handler generic is a string server side, but a function client side
  */
 export interface CodeFormula<Handler = string | Function> extends BaseFormula {
-  version?: 2 | never
+  version?: Nullable<2 | never>
   handler: Handler
 }
 
@@ -30,8 +31,10 @@ export type PluginFormula<Handler = string | Function> =
   | CodeFormula<Handler>
 
 export interface GlobalFormulas<Handler = string | Function> {
-  formulas?: Record<string, PluginFormula<Handler>>
-  packages?: Partial<
-    Record<string, { formulas?: Record<string, PluginFormula<Handler>> }>
+  formulas?: Nullable<Record<string, PluginFormula<Handler>>>
+  packages?: Nullable<
+    Partial<
+      Record<string, { formulas?: Record<string, PluginFormula<Handler>> }>
+    >
   >
 }

package/src/formula/formulaUtils.ts

@@ -1,4 +1,5 @@
 import type { ActionModel } from '../component/component.types'
+import type { Nullable } from '../types'
 import { isDefined } from '../utils/util'
 import type {
   Formula,
@@ -35,15 +36,15 @@ export const functionFormula = (
 export function* getFormulasInFormula<Handler>({
   formula,
   globalFormulas,
-  path = [],
-  visitedFormulas = new Set<string>(),
-  packageName,
+  path: _path,
+  visitedFormulas: _visitedFormulas,
+  packageName: _packageName,
 }: {
-  formula: Formula | undefined | null
+  formula: Nullable<Formula>
   globalFormulas: GlobalFormulas<Handler>
-  path?: (string | number)[]
-  visitedFormulas?: Set<string>
-  packageName?: string
+  path?: Nullable<(string | number)[]>
+  visitedFormulas?: Nullable<Set<string>>
+  packageName?: Nullable<string>
 }): Generator<{
   path: (string | number)[]
   formula: Formula
@@ -52,6 +53,9 @@ export function* getFormulasInFormula<Handler>({
   if (!isDefined(formula)) {
     return
   }
+  const path = _path ?? []
+  let packageName = _packageName ?? undefined
+  const visitedFormulas = _visitedFormulas ?? new Set<string>()
 
   yield {
     path,
@@ -168,15 +172,15 @@ export function* getFormulasInFormula<Handler>({
 export function* getFormulasInAction<Handler>({
   action,
   globalFormulas,
-  path = [],
+  path: _path,
   visitedFormulas = new Set<string>(),
-  packageName,
+  packageName: _packageName,
 }: {
-  action: ActionModel | null
+  action: Nullable<ActionModel>
   globalFormulas: GlobalFormulas<Handler>
-  path?: (string | number)[]
-  visitedFormulas?: Set<string>
-  packageName?: string
+  path?: Nullable<(string | number)[]>
+  visitedFormulas?: Nullable<Set<string>>
+  packageName?: Nullable<string>
 }): Generator<{
   path: (string | number)[]
   formula: Formula
@@ -185,6 +189,8 @@ export function* getFormulasInAction<Handler>({
   if (!isDefined(action)) {
     return
   }
+  const path = _path ?? []
+  let packageName = _packageName ?? undefined
 
   switch (action.type) {
     case 'Fetch':
@@ -227,6 +233,7 @@ export function* getFormulasInAction<Handler>({
       break
     case 'Custom':
     case undefined:
+    case null:
       packageName = action.package ?? packageName
       if (isFormula(action.data)) {
         yield* getFormulasInFormula({

package/src/styling/customProperty.ts

@@ -1,4 +1,5 @@
 import type { CustomPropertyName } from '../component/component.types'
+import type { Nullable } from '../types'
 import { isDefined } from '../utils/util'
 import type { CustomPropertyDefinition, Theme } from './theme'
 
@@ -115,7 +116,7 @@ const FALLBACK_VALUES: Record<CssSyntax, string> = {
   integer: '0',
 }
 
-export const appendUnit = (value: any, unit: string | null | undefined) =>
+export const appendUnit = (value: any, unit: Nullable<string>) =>
   isDefined(value) && isDefined(unit) && !String(value).endsWith(unit)
     ? `${value}${unit}`
     : value

package/src/styling/style.css.ts

@@ -5,6 +5,7 @@ import type {
   ElementNodeModel,
   NodeStyleModel,
 } from '../component/component.types'
+import type { Nullable } from '../types'
 import { omitKeys } from '../utils/collections'
 import { isDefined } from '../utils/util'
 import { getClassName, toValidClassName } from './className'
@@ -144,7 +145,7 @@ export const createStylesheet = (
       const renderVariant = (
         selector: string,
         style: NodeStyleModel,
-        options?: { startingStyle?: boolean },
+        options?: Nullable<{ startingStyle?: Nullable<boolean> }>,
       ) => {
         const scrollbarStyles = Object.entries(style).filter(
           ([key]) => key === 'scrollbar-width',
@@ -312,7 +313,7 @@ export const getAllFonts = (components: Component[]) => {
   return new Set(
     components
       .flatMap((component) => {
-        return Object.values(component.nodes).flatMap((node) => {
+        return Object.values(component.nodes ?? {}).flatMap((node) => {
           if (node.type === 'element') {
             return [
               node.style?.fontFamily,
@@ -325,6 +326,8 @@ export const getAllFonts = (components: Component[]) => {
           return []
         })
       })
-      .map((f) => f.replace('var(', '').replace(')', '').replace(/'/g, '')),
+      .map((f) =>
+        String(f).replace('var(', '').replace(')', '').replaceAll("'", ''),
+      ),
   )
 }

package/src/styling/theme.ts

@@ -1,4 +1,5 @@
 import type { CustomPropertyName } from '../component/component.types'
+import type { Nullable } from '../types'
 import { isDefined } from '../utils/util'
 import { renderSyntaxDefinition, type CssSyntaxNode } from './customProperty'
 import { RESET_STYLES } from './theme.const'
@@ -99,11 +100,11 @@ export type Theme = {
 export type CustomPropertyDefinition = {
   syntax: CssSyntaxNode
   inherits: boolean
-  initialValue: string | null // Required by CSS specs for default-theme, but we can do a fallback so null is allowed
+  initialValue: Nullable<string> // Required by CSS specs for default-theme, but we can do a fallback so null is allowed
   description: string
   // Values mapped to theme names.
   // Values are not required, if left out, the default theme value will be used. If no default theme value exists, initialValue will be used.
-  values: Record<string, string | null>
+  values: Record<string, Nullable<string>>
 }
 
 export const getThemeCss = (

package/src/styling/variantSelector.ts

@@ -3,6 +3,7 @@ import type {
   CustomPropertyName,
   NodeStyleModel,
 } from '../component/component.types'
+import type { Nullable } from '../types'
 
 export type Shadow = {
   x: number
@@ -24,45 +25,45 @@ export type Filter =
     }
 
 type MediaQuery = {
-  'min-width'?: string
-  'max-width'?: string
-  'min-height'?: string
-  'max-height'?: string
+  'min-width'?: Nullable<string>
+  'max-width'?: Nullable<string>
+  'min-height'?: Nullable<string>
+  'max-height'?: Nullable<string>
 }
 
 export interface StyleVariant {
-  'even-child'?: boolean
-  'first-child'?: boolean
-  'first-of-type'?: boolean
-  'focus-visible'?: boolean
-  'focus-within'?: boolean
-  'last-child'?: boolean
-  'last-of-type'?: boolean
-  'nth-child(even)'?: boolean
-  'popover-open'?: boolean
-  active?: boolean
-  autofill?: boolean
-  breakpoint: 'small' | 'medium' | 'large'
-  checked?: boolean
-  class?: string
-  className?: string
-  customProperties?: Record<CustomPropertyName, CustomProperty>
-  disabled?: boolean
-  empty?: boolean
-  evenChild?: boolean
-  firstChild?: boolean
-  focus?: boolean
-  focusWithin?: boolean
-  hover?: boolean
-  id?: string
-  invalid?: boolean
-  lastChild?: boolean
-  link?: boolean
-  mediaQuery?: MediaQuery
-  pseudoElement?: string
-  startingStyle?: boolean
+  'even-child'?: Nullable<boolean>
+  'first-child'?: Nullable<boolean>
+  'first-of-type'?: Nullable<boolean>
+  'focus-visible'?: Nullable<boolean>
+  'focus-within'?: Nullable<boolean>
+  'last-child'?: Nullable<boolean>
+  'last-of-type'?: Nullable<boolean>
+  'nth-child(even)'?: Nullable<boolean>
+  'popover-open'?: Nullable<boolean>
+  active?: Nullable<boolean>
+  autofill?: Nullable<boolean>
+  breakpoint?: Nullable<'small' | 'medium' | 'large'>
+  checked?: Nullable<boolean>
+  class?: Nullable<string>
+  className?: Nullable<string>
+  customProperties?: Nullable<Record<CustomPropertyName, CustomProperty>>
+  disabled?: Nullable<boolean>
+  empty?: Nullable<boolean>
+  evenChild?: Nullable<boolean>
+  firstChild?: Nullable<boolean>
+  focus?: Nullable<boolean>
+  focusWithin?: Nullable<boolean>
+  hover?: Nullable<boolean>
+  id?: Nullable<string>
+  invalid?: Nullable<boolean>
+  lastChild?: Nullable<boolean>
+  link?: Nullable<boolean>
+  mediaQuery?: Nullable<MediaQuery>
+  pseudoElement?: Nullable<string>
+  startingStyle?: Nullable<boolean>
   style: NodeStyleModel
-  visited?: boolean
+  visited?: Nullable<boolean>
 }
 
 export const variantSelector = (variant: StyleVariant) =>

package/src/types.ts

@@ -15,10 +15,14 @@ export type ActionHandlerV2 = (
   // For v2 of actions
   args: Record<string, unknown>,
   ctx: {
-    triggerActionEvent: (trigger: string, data: any, event?: Event) => void
+    triggerActionEvent: (
+      trigger: string,
+      data: any,
+      event?: Nullable<Event>,
+    ) => void
     root: Document | ShadowRoot
   },
-  event?: Event,
+  event?: Nullable<Event>,
   // If the action returns a function, that function will be called
   // from our abort signal (for cleanup)
 ) => void | (() => void) | Promise<void> | Promise<() => void>
@@ -26,11 +30,15 @@ export type ActionHandlerV2 = (
 export type ActionHandler<Args = unknown[]> = (
   args: Args,
   ctx: {
-    triggerActionEvent: (trigger: string, data: any, event?: Event) => void
+    triggerActionEvent: (
+      trigger: string,
+      data: any,
+      event?: Nullable<Event>,
+    ) => void
     env: ToddleEnv
     abortSignal: AbortSignal
   },
-  event?: Event,
+  event?: Nullable<Event>,
 ) => void
 
 export type FormulaHandler<T = void> = (
@@ -45,21 +53,23 @@ export type FormulaHandler<T = void> = (
 
 interface PluginActionBase {
   name: string
-  description?: string
-  arguments?: Array<{
-    name: string
-    formula: Formula
-  }> | null
+  description?: Nullable<string>
+  arguments?: Nullable<
+    Array<{
+      name: string
+      formula: Formula
+    }>
+  >
   // eslint-disable-next-line inclusive-language/use-inclusive-words
-  events?: Record<string, { dummyEvent?: any }>
-  variableArguments: boolean | null
+  events?: Nullable<Record<string, { dummyEvent?: any }>>
+  variableArguments: Nullable<boolean>
 }
 
 export interface PluginActionV2 extends PluginActionBase {
   handler: ActionHandlerV2
   version: 2
   // exported indicates that an action is exported in a package
-  exported?: boolean
+  exported?: Nullable<boolean>
 }
 
 export interface LegacyPluginAction extends PluginActionBase {
@@ -148,15 +158,17 @@ export interface Comment {
 }
 
 export interface NordcraftMetadata {
-  '@nordcraft/metadata'?: {
-    comments: Record<string, Comment & { index: number }> | null
-  } | null
+  '@nordcraft/metadata'?: Nullable<{
+    comments: Nullable<Partial<Record<string, Comment & { index: number }>>>
+  }>
 }
 
 export type RequireFields<T, K extends keyof T> = Omit<T, K> & {
   [P in K]-?: NonNullable<T[P]>
 }
 
+export type Nullable<T> = T | null | undefined
+
 export type NestedOmit<
   Schema,
   Path extends string,

package/src/utils/collections.ts

@@ -1,3 +1,4 @@
+import type { Nullable } from '../types'
 import { isDefined } from './util'
 
 export const isObject = (input: any): input is Record<string, any> =>
@@ -118,7 +119,7 @@ export const easySort = <T>(
 
 export const deepSortObject = (
   obj: any,
-): Record<string, any> | Array<any> | undefined | null => {
+): Nullable<Record<string, any> | Array<any>> => {
   if (!isDefined(obj)) {
     return obj
   }

package/src/utils/getNodeSelector.ts

@@ -1,15 +1,16 @@
 import { variantSelector, type StyleVariant } from '../styling/variantSelector'
+import type { Nullable } from '../types'
 
 type NodeSelectorOptions =
   | {
       componentName: string
-      nodeId: string | undefined
-      variant?: StyleVariant
+      nodeId: Nullable<string>
+      variant?: Nullable<StyleVariant>
     }
   | {
       componentName?: never
       nodeId?: never
-      variant?: StyleVariant
+      variant?: Nullable<StyleVariant>
     }
 
 export function getNodeSelector(