feat: release design system engine, studio and component contracts

packages/ui/components/checkbox.wrn

@@ -41,7 +41,7 @@ size: string = "default"
     client function preventReadonly(sourceEvent) { if (readonly) sourceEvent.preventDefault() }
   }
   view {
-    <div
+    <div data-wrn-owner="Checkbox" data-wrn-part="root" data-wrn-component="Checkbox" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"
       {...attrs}
       class="wrn-component wrn-component--color-{color} wrn-component--size-{size} wrn-next--choice-field wrn-next--checkbox-field {class}"
       data-inline="{inline}"
@@ -51,7 +51,7 @@ size: string = "default"
       data-list="{list}"
       data-right-aligned="{rightAligned}"
     >
-      <div
+      <div data-wrn-owner="Checkbox" data-wrn-part="heading" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"
         class="wrn-next__field-heading"
       >
         {#if options.length || cornerHint}
@@ -61,7 +61,7 @@ size: string = "default"
             {label}
           </span>
           {#if cornerHint}
-            <span
+            <span data-wrn-owner="Checkbox" data-wrn-part="hint" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"
               class="wrn-next__field-hint"
             >
               {cornerHint}
@@ -82,7 +82,7 @@ size: string = "default"
               data-variant="{variant}"
               data-disabled="{disabled || option.disabled}"
             >
-              <input
+              <input data-wrn-owner="Checkbox" data-wrn-part="control" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"
                 id="{id || name}-{option.value}"
                 type="checkbox"
                 name="{name}"
@@ -98,7 +98,7 @@ size: string = "default"
                 @blur="emitField('blur', event)"
                 @invalid="emitField('invalid', event)"
               />
-              <span
+              <span data-wrn-owner="Checkbox" data-wrn-part="copy" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"
                 class="wrn-next__choice-copy"
               >
                 <strong>{option.label}</strong>
@@ -118,7 +118,7 @@ size: string = "default"
             data-variant="{variant}"
             data-icon-position="{iconPosition}"
           >
-            <input
+            <input data-wrn-owner="Checkbox" data-wrn-part="control" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"
               id="{id || name}"
               type="checkbox"
               name="{name}"
@@ -157,13 +157,13 @@ size: string = "default"
         </div>
       {/if}
       {#if helperText}
-        <small
+        <small data-wrn-owner="Checkbox" data-wrn-part="help" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"
           class="wrn-next__field-help"
         >
           {helperText}
         </small>
       {/if}
-      <small
+      <small data-wrn-owner="Checkbox" data-wrn-part="error" data-wrn-axis-size="{size}" data-wrn-axis-color="{color}" data-wrn-axis-variant="{variant}"
         class="wrn-next__field-error"
         data-error="{name}"
       >