@nordcraft/core 1.0.77 → 1.0.79

package/src/component/schemas/node-schema.ts

@@ -0,0 +1,259 @@
+import { z } from 'zod'
+import type { StyleTokenCategory } from '../../styling/theme'
+import type { StyleVariant } from '../../styling/variantSelector'
+import type {
+  AnimationKeyframe,
+  ComponentNodeModel,
+  ElementNodeModel,
+  NodeModel,
+  NodeStyleModel,
+  SlotNodeModel,
+  TextNodeModel,
+} from '../component.types'
+import { EventModelSchema } from './event-schema'
+import { FormulaSchema } from './formula-schema'
+import { SCHEMA_DESCRIPTIONS } from './zod-schemas'
+
+// Style and Animation
+const NodeStyleModelSchema: z.ZodType<NodeStyleModel> = z.record(
+  z.string(),
+  z.string(),
+)
+
+const AnimationKeyframeSchema: z.ZodType<AnimationKeyframe> = z.object({
+  position: z
+    .number()
+    .describe(
+      "Value between 0 and 1 representing the keyframe's position in the animation",
+    ),
+  key: z.string().describe('CSS property to be animated'),
+  value: z.string().describe('Value of the CSS property at this keyframe'),
+})
+
+const StyleTokenCategorySchema: z.ZodType<StyleTokenCategory> = z.enum([
+  'spacing',
+  'color',
+  'font-size',
+  'font-weight',
+  'z-index',
+  'border-radius',
+  'shadow',
+])
+
+const StyleVariantSchema: z.ZodType<StyleVariant> = z.object({
+  style: NodeStyleModelSchema,
+  id: z.string().nullish(),
+  className: z.string().nullish(),
+  hover: z.boolean().nullish(),
+  active: z.boolean().nullish(),
+  focus: z.boolean().nullish(),
+  focusWithin: z.boolean().nullish(),
+  disabled: z.boolean().nullish(),
+  empty: z.boolean().nullish(),
+  firstChild: z.boolean().nullish(),
+  lastChild: z.boolean().nullish(),
+  evenChild: z.boolean().nullish(),
+  startingStyle: z.boolean().nullish(),
+  mediaQuery: z
+    .object({
+      'min-width': z.string().nullish(),
+      'max-width': z.string().nullish(),
+      'min-height': z.string().nullish(),
+      'max-height': z.string().nullish(),
+      'prefers-reduced-motion': z.enum(['reduce', 'no-preference']).nullish(),
+    })
+    .nullish(),
+})
+
+// Node Models
+const TextNodeModelSchema: z.ZodType<TextNodeModel> = z
+  .object({
+    type: z.literal('text'),
+    value: FormulaSchema.describe('Formula evaluating to the text content.'),
+    condition: FormulaSchema.nullish().describe(
+      SCHEMA_DESCRIPTIONS.condition('text node'),
+    ),
+    repeat: FormulaSchema.nullish().describe(
+      SCHEMA_DESCRIPTIONS.repeat('text node'),
+    ),
+    repeatKey: FormulaSchema.nullish().describe(
+      SCHEMA_DESCRIPTIONS.repeatKey('text node'),
+    ),
+    slot: z.string().nullish().describe(SCHEMA_DESCRIPTIONS.slot('text node')),
+  })
+  .describe(
+    'Schema defining a Text Node Model. A text node represents text content inside of an element.',
+  )
+
+const SlotNodeModelSchema: z.ZodType<SlotNodeModel> = z
+  .object({
+    type: z.literal('slot'),
+    children: z
+      .array(z.string())
+      .describe(
+        `${SCHEMA_DESCRIPTIONS.children}. These are the default child nodes for the slot. If no content is passed to the slot when used inside a component, these default child nodes will be rendered.`,
+      ),
+    name: z
+      .string()
+      .nullish()
+      .describe(
+        'Name of the slot. This is the name that must be used when passing content to this slot.',
+      ),
+    condition: FormulaSchema.nullish().describe(
+      SCHEMA_DESCRIPTIONS.condition('slot node'),
+    ),
+    slot: z.string().nullish().describe(SCHEMA_DESCRIPTIONS.slot('slot node')),
+  })
+  .describe(
+    'Schema defining a Slot Node Model. A slot is a placeholder for child nodes. Slot nodes can only exist inside components.',
+  )
+
+const ElementNodeModelSchema: z.ZodType<ElementNodeModel> = z
+  .object({
+    type: z.literal('element'),
+    tag: z
+      .string()
+      .describe(
+        'The HTML tag of the element node, such as "div", "span", "img", "a", etc.',
+      ),
+    attrs: z
+      .record(z.string(), FormulaSchema)
+      .describe(
+        'Attributes of the element node such as "src", "alt", "href", or any other attribute that is applicable to the corresponding HTML element.',
+      ),
+    style: NodeStyleModelSchema.describe(
+      SCHEMA_DESCRIPTIONS.style('element node'),
+    ),
+    children: z.array(z.string()).describe(SCHEMA_DESCRIPTIONS.children),
+    events: z
+      .record(z.string(), EventModelSchema)
+      .describe(
+        'Events on the element node such as "click", "hover", or any other event that is applicable to the corresponding HTML element.',
+      ),
+    classes: z
+      .record(
+        z.string().describe('The class name'),
+        z
+          .object({ formula: FormulaSchema.nullish() })
+          .describe(
+            'Formula that will determine when the class is applied. The class is applied when the formula is truthy.',
+          ),
+      )
+      .describe('Classes applied to this element node.'),
+    'style-variables': z
+      .array(
+        z.object({
+          category: StyleTokenCategorySchema.describe(
+            'Category of the style token.',
+          ),
+          name: z.string().describe('Name of the style token.'),
+          formula: FormulaSchema.describe(
+            'Formula defining the value of the token.',
+          ),
+          unit: z
+            .string()
+            .nullish()
+            .describe('Unit of the style token, if applicable.'),
+        }),
+      )
+      .nullish()
+      .describe(
+        'Style variables defined on this element node. Style variables can be used to define design tokens such as colors, spacing, font sizes, and other reusable style values.',
+      ),
+    condition: FormulaSchema.nullish().describe(
+      SCHEMA_DESCRIPTIONS.condition('element node'),
+    ),
+    repeat: FormulaSchema.nullish().describe(
+      SCHEMA_DESCRIPTIONS.repeat('element node'),
+    ),
+    repeatKey: FormulaSchema.nullish().describe(
+      SCHEMA_DESCRIPTIONS.repeatKey('element node'),
+    ),
+    slot: z
+      .string()
+      .nullish()
+      .describe(SCHEMA_DESCRIPTIONS.slot('element node')),
+    variants: z
+      .array(StyleVariantSchema)
+      .nullish()
+      .describe(SCHEMA_DESCRIPTIONS.variants('element node')),
+    animations: z
+      .record(
+        z.string().describe(SCHEMA_DESCRIPTIONS.animationKey),
+        z.record(
+          z.string().describe(SCHEMA_DESCRIPTIONS.animationKeyframeKey),
+          AnimationKeyframeSchema,
+        ),
+      )
+      .nullish()
+      .describe(SCHEMA_DESCRIPTIONS.animations('element node')),
+  })
+  .describe(
+    'Schema defining an Element Node Model. An element is a standard HTML element.',
+  )
+
+const ComponentNodeModelSchema: z.ZodType<ComponentNodeModel> = z
+  .object({
+    type: z.literal('component'),
+    name: z.string().describe('Name of the component to render.'),
+    package: z
+      .string()
+      .nullish()
+      .describe(
+        'Name of the package this component comes from. If empty, it is a component defined in the current project.',
+      ),
+    attrs: z
+      .record(
+        z.string().describe('The name of the attribute'),
+        FormulaSchema.describe(
+          'Formula evaluating to the value of the attribute',
+        ),
+      )
+      .describe('Attributes/props passed to the component.'),
+    children: z.array(z.string()).describe(SCHEMA_DESCRIPTIONS.children),
+    events: z
+      .record(z.string(), EventModelSchema)
+      .describe(
+        'Record of events passed to the component. Only custom events defined by the component can be passed here.',
+      ),
+    style: NodeStyleModelSchema.nullish().describe(
+      SCHEMA_DESCRIPTIONS.style('component node'),
+    ),
+    condition: FormulaSchema.nullish().describe(
+      SCHEMA_DESCRIPTIONS.condition('component node'),
+    ),
+    repeat: FormulaSchema.nullish().describe(
+      SCHEMA_DESCRIPTIONS.repeat('component node'),
+    ),
+    repeatKey: FormulaSchema.nullish().describe(
+      SCHEMA_DESCRIPTIONS.repeatKey('component node'),
+    ),
+    slot: z
+      .string()
+      .nullish()
+      .describe(SCHEMA_DESCRIPTIONS.slot('component node')),
+    variants: z
+      .array(StyleVariantSchema)
+      .nullish()
+      .describe(SCHEMA_DESCRIPTIONS.variants('component node')),
+    animations: z
+      .record(
+        z.string().describe(SCHEMA_DESCRIPTIONS.animationKey),
+        z.record(
+          z.string().describe(SCHEMA_DESCRIPTIONS.animationKeyframeKey),
+          AnimationKeyframeSchema,
+        ),
+      )
+      .nullish()
+      .describe(SCHEMA_DESCRIPTIONS.animations('component node')),
+  })
+  .describe('Schema defining a Component Node Model.')
+
+export const NodeModelSchema: z.ZodType<NodeModel> = z.lazy(() =>
+  z.union([
+    TextNodeModelSchema,
+    SlotNodeModelSchema,
+    ElementNodeModelSchema,
+    ComponentNodeModelSchema,
+  ]),
+)

package/src/component/schemas/route-schema.ts

@@ -0,0 +1,135 @@
+import { z } from 'zod'
+import type {
+  DynamicPathSegment,
+  MetaEntry,
+  RouteDeclaration,
+  StaticPathSegment,
+} from '../component.types'
+import { FormulaSchema } from './formula-schema'
+import { SCHEMA_DESCRIPTIONS } from './zod-schemas'
+
+const HeadTagTypesSchema: z.ZodType<any> = z
+  .enum(['meta', 'link', 'script', 'noscript', 'style'])
+  .describe('Available head tags.')
+
+const MetaEntrySchema: z.ZodType<MetaEntry> = z
+  .object({
+    tag: HeadTagTypesSchema.describe(
+      'Type of the head tag such as meta, link, script.',
+    ),
+    attrs: z
+      .record(
+        z.string().describe('The name of the head tag attribute'),
+        FormulaSchema.describe(
+          'The Formula evaluating to the value of the head tag attribute',
+        ),
+      )
+      .describe('Attributes for the head tag.'),
+    content: FormulaSchema.describe(
+      'Optional content for the head tag, used for tags like style or script.',
+    ),
+  })
+  .describe('Schema defining a single meta entry for the head of the document.')
+
+// Route Models
+const StaticPathSegmentSchema: z.ZodType<StaticPathSegment> = z
+  .object({
+    type: z.literal('static').describe('Static path segment'),
+    name: z.string().describe('Name of the static path segment'),
+    optional: z
+      .boolean()
+      .nullish()
+      .describe('Indicates if the segment is optional'),
+  })
+  .describe('Schema for static path segments')
+
+const DynamicPathSegmentSchema: z.ZodType<DynamicPathSegment> = z
+  .object({
+    type: z
+      .literal('param')
+      .describe('Dynamic path segment representing a URL parameter'),
+    name: z.string().describe('Name of the URL parameter'),
+    testValue: z
+      .string()
+      .describe(SCHEMA_DESCRIPTIONS.testData('dynamic URL parameter')),
+    optional: z
+      .boolean()
+      .nullish()
+      .describe('Indicates if the URL parameter is optional'),
+  })
+  .describe('Schema for dynamic path segments (URL parameters)')
+
+export const RouteSchema: z.ZodType<RouteDeclaration> = z
+  .object({
+    path: z
+      .array(z.union([StaticPathSegmentSchema, DynamicPathSegmentSchema]))
+      .describe(
+        'Array of path segments defining the route path. Each segment can be static or dynamic (parameterized). Each segment must be unique.',
+      ),
+    query: z.record(
+      z.string().describe('Name of the query parameter. This must be unique.'),
+      z
+        .object({
+          name: z
+            .string()
+            .describe('Name of the query parameter. Same as the key'),
+          testValue: z
+            .any()
+            .describe(
+              'Test value for the query parameter. Test data is only used while building the component in the Nordcraft editor.',
+            ),
+        })
+        .describe(
+          'Schema defining a query parameter. Nordcraft supports having query parameters with multiple values. Defining a query parameter as an array will allow multiple values for that parameter.',
+        ),
+    ),
+    info: z
+      .object({
+        title: z
+          .object({ formula: FormulaSchema })
+          .nullish()
+          .describe(
+            'Title of the page, used in the document title and SEO metadata.',
+          ),
+        description: z
+          .object({ formula: FormulaSchema })
+          .nullish()
+          .describe(
+            'Description of the page, used in SEO metadata and social sharing previews.',
+          ),
+        icon: z
+          .object({ formula: FormulaSchema })
+          .nullish()
+          .describe(
+            'URL to the icon of the page, used in SEO metadata and social sharing previews.',
+          ),
+        language: z
+          .object({ formula: FormulaSchema })
+          .nullish()
+          .describe(
+            'Language of the page, used in the lang attribute of the HTML document.',
+          ),
+        charset: z
+          .object({ formula: FormulaSchema })
+          .nullish()
+          .describe(
+            'Character set of the page, used in the meta charset tag of the HTML document.',
+          ),
+        meta: z
+          .record(
+            z.string().describe('The key of the meta data record.'),
+            MetaEntrySchema,
+          )
+          .nullish()
+          .describe(
+            'Additional meta tags to include in the head of the document. Each entry defines a tag and its attributes.',
+          ),
+      })
+      .nullish()
+      .describe(
+        'Contains additional information for the route such as SEO metadata.',
+      ),
+  })
+  .describe(
+    'Schema defining the route information for a page as well as SEO related metadata.',
+  )

package/src/component/schemas/variable-schema.ts

@@ -0,0 +1,11 @@
+import { z } from 'zod'
+import type { ComponentVariable } from '../component.types'
+import { FormulaSchema } from './formula-schema'
+import { MetadataSchema, SCHEMA_DESCRIPTIONS } from './zod-schemas'
+
+export const ComponentVariableSchema: z.ZodType<ComponentVariable> = z.object({
+  '@nordcraft/metadata': MetadataSchema.nullish().describe(
+    SCHEMA_DESCRIPTIONS.metadata('variable'),
+  ),
+  initialValue: FormulaSchema.describe('Initial value of the variable'),
+})

package/src/component/schemas/workflow-schema.ts

@@ -0,0 +1,30 @@
+import { z } from 'zod'
+import type { ComponentWorkflow } from '../component.types'
+import { ActionModelSchema } from './action-schema'
+import { MetadataSchema, SCHEMA_DESCRIPTIONS } from './zod-schemas'
+
+export const ComponentWorkflowSchema: z.ZodType<ComponentWorkflow> = z
+  .object({
+    '@nordcraft/metadata': MetadataSchema.nullish().describe(
+      SCHEMA_DESCRIPTIONS.metadata('workflow'),
+    ),
+    name: z.string().describe('Name of the workflow'),
+    parameters: z
+      .array(
+        z.object({
+          name: z.string().describe('Name of the workflow parameter'),
+          testValue: z.any().describe('Test value for the workflow parameter'),
+        }),
+      )
+      .describe('Parameters accepted by the workflow'),
+    actions: z
+      .array(ActionModelSchema)
+      .describe('List of actions that make up the workflow'),
+    exposeInContext: z
+      .boolean()
+      .nullish()
+      .describe(
+        'Indicates if the workflow should be exposed in the context for child components to subscribe to.',
+      ),
+  })
+  .describe('Schema defining a workflow.')