@nordcraft/runtime 1.0.58 → 1.0.60

package/dist/styles/CustomPropertyStyleSheet.test.js

@@ -35,7 +35,10 @@ describe('CustomPropertyStyleSheet', () => {
             mediaQuery: { 'max-width': '600px' },
         })('256px');
         expect(instance.getStyleSheet().cssRules.length).toBe(1);
-        expect(instance.getStyleSheet().cssRules[0].cssText).toBe('@media (max-width: 600px) { .my-class { --my-property: 256px; } }');
+        expect(instance.getStyleSheet().cssRules[0].cssText).toBe(`\
+@media (max-width: 600px) {
+  .my-class { --my-property: 256px; }
+}`);
     });
     test('it unregisters a property', () => {
         const instance = new CustomPropertyStyleSheet(document);
@@ -56,11 +59,17 @@ describe('CustomPropertyStyleSheet', () => {
         });
         setter('256px');
         expect(instance.getStyleSheet().cssRules.length).toBe(1);
-        expect(instance.getStyleSheet().cssRules[0].cssText).toBe('@media (max-width: 600px) { .my-class-with-media { --my-property-with-media: 256px; } }');
+        expect(instance.getStyleSheet().cssRules[0].cssText).toBe(`\
+@media (max-width: 600px) {
+  .my-class-with-media { --my-property-with-media: 256px; }
+}`);
         instance.unregisterProperty('.my-class-with-media', '--my-property-with-media', {
             mediaQuery: { 'max-width': '600px' },
         });
-        expect(instance.getStyleSheet().cssRules[0].cssText).toBe('@media (max-width: 600px) { .my-class-with-media {  } }');
+        expect(instance.getStyleSheet().cssRules[0].cssText).toBe(`\
+@media (max-width: 600px) {
+  .my-class-with-media {  }
+}`);
     });
 });
 //# sourceMappingURL=CustomPropertyStyleSheet.test.js.map

package/dist/styles/CustomPropertyStyleSheet.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"CustomPropertyStyleSheet.test.js","sourceRoot":"","sources":["../../src/styles/CustomPropertyStyleSheet.test.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"CustomPropertyStyleSheet.test.js","sourceRoot":"","sources":["../../src/styles/CustomPropertyStyleSheet.test.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -4,13 +4,13 @@
 "type": "module",
 "homepage": "https://github.com/nordcraftengine/nordcraft",
 "dependencies": {
-"@nordcraft/core": "1.0.58",
-"@nordcraft/std-lib": "1.0.58",
+"@nordcraft/core": "1.0.60",
+"@nordcraft/std-lib": "1.0.60",
 "fast-deep-equal": "3.1.3",
 "path-to-regexp": "6.3.0"
 },
 "devDependencies": {
-"@happy-dom/global-registrator": "18.0.1"
+"@happy-dom/global-registrator": "20.0.8"
 },
 "scripts": {
 "build": "tsc && bun scripts/build.js",
@@ -21,5 +21,5 @@
 "files": ["dist", "src"],
 "main": "dist/page.main.js",
 "types": "dist/page.main.d.ts",
-"version": "1.0.58"
+"version": "1.0.60"
 }

package/src/components/createElement.ts

@@ -42,7 +42,7 @@ export function createElement({
   }
 
   // Explicitly setting a namespace has precedence over inferring it from the tag
-  if (node.attrs['xmlns'] && node.attrs['xmlns'].type === 'value') {
+  if (node.attrs['xmlns']?.type === 'value') {
     namespace = String(node.attrs['xmlns'].value) as SupportedNamespaces
   }
 

package/src/components/createNode.ts

@@ -216,7 +216,6 @@ export function createNode({
               Key,
             },
           }
-
           let childKey = node.repeatKey
             ? applyFormula(node.repeatKey, {
                 data: childData,

package/src/editor/input.ts

@@ -0,0 +1,17 @@
+export const isInputTarget = (event: Event) => {
+  const target = event.target
+  if (target instanceof HTMLElement) {
+    if (
+      target.tagName === 'INPUT' ||
+      target.tagName === 'TEXTAREA' ||
+      target.tagName === 'SELECT' ||
+      target.tagName === 'STYLE-EDITOR'
+    ) {
+      return true
+    }
+    if (target.contentEditable?.toLocaleLowerCase() === 'true') {
+      return true
+    }
+  }
+  return false
+}

package/src/editor/links.ts

@@ -0,0 +1,16 @@
+import type { Component } from '@nordcraft/core/dist/component/component.types'
+import { valueFormula } from '@nordcraft/core/dist/formula/formulaUtils'
+
+/**
+ * Modifies all link nodes on a component
+ * NOTE: alters in place
+ */
+export const updateComponentLinks = (component: Component) => {
+  // Find all links and add target="_blank" to them
+  Object.entries(component.nodes ?? {}).forEach(([_, node]) => {
+    if (node.type === 'element' && node.tag === 'a') {
+      node.attrs['target'] = valueFormula('_blank')
+    }
+  })
+  return component
+}

package/src/editor/overlay.ts

@@ -0,0 +1,21 @@
+export function getRectData(selectedNode: Element | null | undefined) {
+  if (!selectedNode) {
+    return null
+  }
+
+  const { borderRadius, rotate } = window.getComputedStyle(selectedNode)
+  const rect: DOMRect = selectedNode.getBoundingClientRect()
+
+  return {
+    left: rect.left,
+    right: rect.right,
+    top: rect.top,
+    bottom: rect.bottom,
+    width: rect.width,
+    height: rect.height,
+    x: rect.x,
+    y: rect.y,
+    borderRadius: borderRadius.split(' '),
+    rotate,
+  }
+}

package/src/editor/types.ts

@@ -0,0 +1,271 @@
+import type {
+  AnimationKeyframe,
+  Component,
+  ComponentData,
+} from '@nordcraft/core/dist/component/component.types'
+import type { PluginFormula } from '@nordcraft/core/dist/formula/formulaTypes'
+import type { OldTheme, Theme } from '@nordcraft/core/dist/styling/theme'
+import type {
+  FormulaHandlerV2,
+  PluginAction,
+  PluginActionV2,
+} from '@nordcraft/core/dist/types'
+import type { getRectData } from './overlay'
+
+export type NordcraftPreviewEvent =
+  | {
+      type: 'style_variant_changed'
+      variantIndex: number | null
+    }
+  | {
+      type: 'component'
+      component: Component
+    }
+  | { type: 'components'; components: Component[] }
+  | {
+      type: 'packages'
+      packages: Record<
+        string,
+        {
+          components: Record<string, Component>
+          formulas: Record<
+            string,
+            PluginFormula<FormulaHandlerV2> | PluginFormula<string>
+          >
+          actions: Record<string, PluginActionV2 | PluginAction>
+          manifest: {
+            name: string
+            // commit represents the commit hash (version) of the package
+            commit: string
+          }
+        }
+      >
+    }
+  | {
+      type: 'global_formulas'
+      formulas: Record<
+        string,
+        PluginFormula<FormulaHandlerV2> | PluginFormula<string>
+      >
+    }
+  | {
+      type: 'global_actions'
+      actions: Record<string, PluginActionV2 | PluginAction>
+    }
+  | { type: 'theme'; theme: Record<string, OldTheme | Theme> }
+  | { type: 'mode'; mode: 'design' | 'test' }
+  | { type: 'attrs'; attrs: Record<string, unknown> }
+  | { type: 'selection'; selectedNodeId: string | null }
+  | { type: 'highlight'; highlightedNodeId: string | null }
+  | {
+      type: 'click' | 'mousemove' | 'dblclick'
+      metaKey: boolean
+      x: number
+      y: number
+    }
+  | { type: 'report_document_scroll_size' }
+  | { type: 'update_inner_text'; innerText: string }
+  | { type: 'reload' }
+  | { type: 'fetch_api'; apiKey: string }
+  | { type: 'introspect_qraphql_api'; apiKey: string }
+  | { type: 'drag-started'; x: number; y: number }
+  | { type: 'drag-ended'; canceled?: true }
+  | { type: 'keydown'; key: string; altKey: boolean; metaKey: boolean }
+  | { type: 'keyup'; key: string; altKey: boolean; metaKey: boolean }
+  | {
+      type: 'get_computed_style'
+      styles?: string[]
+    }
+  | {
+      type: 'set_timeline_keyframes'
+      keyframes: Record<string, AnimationKeyframe> | null
+    }
+  | {
+      type: 'set_timeline_time'
+      time: number | null
+      timingFunction:
+        | 'linear'
+        | 'ease'
+        | 'ease-in'
+        | 'ease-out'
+        | 'ease-in-out'
+        | 'step-start'
+        | 'step-end'
+        | string
+        | undefined
+      fillMode: 'none' | 'forwards' | 'backwards' | 'both' | undefined
+    }
+  | {
+      type: 'preview_style'
+      styles: Record<string, string> | null
+      theme?: {
+        key: string
+        value: Theme
+      }
+    }
+  | {
+      type: 'preview_theme'
+      theme: string | null
+    }
+
+export type EditorPostMessageType =
+  | {
+      type: 'textComputedStyle'
+      computedStyle: Record<string, string>
+    }
+  | {
+      type: 'selection'
+      selectedNodeId: string | null
+    }
+  | {
+      type: 'highlight'
+      highlightedNodeId: string | null
+    }
+  | {
+      type: 'navigate'
+      name: string
+    }
+  | {
+      type: 'documentScrollSize'
+      scrollHeight: number
+      scrollWidth: number
+    }
+  | {
+      type: 'nodeMoved'
+      copy: boolean
+      parent?: string | null
+      index?: number
+    }
+  | {
+      type: 'computedStyle'
+      computedStyle: Record<string, string>
+    }
+  | {
+      type: 'style'
+      time: string
+    }
+  | {
+      type: 'component event'
+      event: any
+      time: string
+      data: any
+    }
+  | {
+      type: 'keydown'
+      event: {
+        key: string
+        metaKey: boolean
+        shiftKey: boolean
+        altKey: boolean
+      }
+    }
+  | {
+      type: 'keyup'
+      event: {
+        key: string
+        metaKey: boolean
+        shiftKey: boolean
+        altKey: boolean
+      }
+    }
+  | {
+      type: 'keypress'
+      event: {
+        key: string
+        metaKey: boolean
+        shiftKey: boolean
+        altKey: boolean
+      }
+    }
+  | { type: 'data'; data: ComponentData }
+  | {
+      type: 'selectionRect'
+      rect: ReturnType<typeof getRectData>
+    }
+  | {
+      type: 'highlightRect'
+      rect: ReturnType<typeof getRectData>
+    }
+  | {
+      type: 'introspectionResult'
+      data: any
+      apiKey: string
+    }
+
+export type DragState = {
+  /**
+   * Dragging elements within the initial container is a reorder operation while dragging elements outside the initial container is an insert operation.
+   * While they share some common properties, we need to differentiate between the two to handle them differently.
+   */
+  mode: 'reorder' | 'insert'
+  elementType: 'element' | 'component' | 'text'
+  copy?: HTMLElement
+  element: HTMLElement
+  repeatedNodes: HTMLElement[]
+  offset: Point
+  lastCursorPosition: Point
+  initialContainer: HTMLElement
+  initialNextSibling: Element | null
+  initialRect: DOMRect
+  reorderPermutations: Array<{
+    nextSibling: Node | null
+    rect: DOMRect
+  }>
+  isTransitioning: boolean
+  selectedInsertAreaIndex?: number
+  insertAreas?: Array<InsertArea>
+  destroying: boolean
+}
+
+export type InsertArea = {
+  layout: 'block' | 'inline'
+  parent: Element
+  index: number
+  center: Point
+  size: number
+  direction: 1 | -1
+}
+
+export type Point = { x: number; y: number }
+export type Line = { x1: number; y1: number; x2: number; y2: number }
+
+/**
+ * Styles required for rendering the same exact text again somewhere else (on a overlay rect in the editor)
+ */
+export enum TextNodeComputedStyles {
+  // Caret color is important as it is the only visible part of the text node (when text is not highlighted)
+  CARET_COLOR = 'caret-color',
+  DISPLAY = 'display',
+  FONT_FAMILY = 'font-family',
+  FONT_SIZE = 'font-size',
+  FONT_WEIGHT = 'font-weight',
+  FONT_STYLE = 'font-style',
+  FONT_VARIANT = 'font-variant',
+  FONT_STRETCH = 'font-stretch',
+  LINE_HEIGHT = 'line-height',
+  TEXT_ALIGN = 'text-align',
+  TEXT_TRANSFORM = 'text-transform',
+  LETTER_SPACING = 'letter-spacing',
+  WHITE_SPACE = 'white-space',
+  WORD_SPACING = 'word-spacing',
+  TEXT_INDENT = 'text-indent',
+  TEXT_OVERFLOW = 'text-overflow',
+  TEXT_RENDERING = 'text-rendering',
+  WORD_BREAK = 'word-break',
+  WORD_WRAP = 'word-wrap',
+  DIRECTION = 'direction',
+  UNICODE_BIDI = 'unicode-bidi',
+  VERTICAL_ALIGN = 'vertical-align',
+  FONT_KERNING = 'font-kerning',
+  FONT_FEATURE_SETTINGS = 'font-feature-settings',
+  FONT_VARIATION_SETTINGS = 'font-variation-settings',
+  FONT_SMOOTHING = '-webkit-font-smoothing',
+  ANTI_ALIASING = '-moz-osx-font-smoothing',
+  FONT_OPTICAL_SIZING = 'font-optical-sizing',
+  TAB_SIZE = 'tab-size',
+  HYPHENS = 'hyphens',
+  TEXT_ORIENTATION = 'text-orientation',
+  WRITING_MODE = 'writing-mode',
+  LINE_BREAK = 'line-break',
+  OVERFLOW_WRAP = 'overflow-wrap',
+}