@umbraco-ui/uui-form-layout-item 0.0.1 → 0.1.1

package/README.md

@@ -4,6 +4,10 @@
 
 Umbraco style uui-form-layout-item component.
 
+### See it in action
+
+Preview the component on [Storybook](https://uui.umbraco.com/?path=/story/uui-form-layout-item)
+
 ## Installation
 
 ### ES imports

package/custom-elements.json

@@ -30,6 +30,14 @@
         {
           "name": "message",
           "description": "for extras in the messages container"
+        },
+        {
+          "name": "description",
+          "description": "for extras in the description container"
+        },
+        {
+          "name": "label",
+          "description": "for label contents"
         }
       ]
     }

package/lib/index.js

@@ -1,6 +1,7 @@
+import { defineElement } from '@umbraco-ui/uui-base/lib/registration';
+import { demandCustomElement } from '@umbraco-ui/uui-base/lib/utils';
 import { css, LitElement, html } from 'lit';
 import { property, state } from 'lit/decorators.js';
-import { defineElement } from '@umbraco-ui/uui-base/lib/registration';
 
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
@@ -26,6 +27,10 @@ let UUIFormLayoutItemElement = class extends LitElement {
       this._descriptionSlotHasContent = e.target.assignedNodes({ flatten: true }).length > 0;
     };
   }
+  connectedCallback() {
+    super.connectedCallback();
+    demandCustomElement(this, "uui-form-validation-message");
+  }
   render() {
     return html`
       <div id="label" style=${this._labelSlotHasContent ? "" : "display: none"}>

package/lib/uui-form-layout-item.element.d.ts

@@ -4,10 +4,13 @@ import { LitElement } from 'lit';
  * @description - Form item composes label, input and validation-messages in a proper layout.
  * @slot - for button contents
  * @slot message - for extras in the messages container
+ * @slot description - for extras in the description container
+ * @slot label - for label contents
  */
 export declare class UUIFormLayoutItemElement extends LitElement {
     static styles: import("lit").CSSResult[];
     description: string | null;
+    connectedCallback(): void;
     private _labelSlotHasContent;
     private _labelSlotChanged;
     private _descriptionSlotHasContent;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umbraco-ui/uui-form-layout-item",
-  "version": "0.0.1",
+  "version": "0.1.1",
   "license": "MIT",
   "keywords": [
     "Umbraco",
@@ -28,7 +28,8 @@
     "custom-elements.json"
   ],
   "dependencies": {
-    "@umbraco-ui/uui-base": "0.0.16"
+    "@umbraco-ui/uui-base": "0.1.1",
+    "@umbraco-ui/uui-form-validation-message": "0.1.1"
   },
   "scripts": {
     "build": "npm run analyze && tsc --build --force && rollup -c rollup.config.js",
@@ -39,5 +40,5 @@
     "access": "public"
   },
   "homepage": "https://uui.umbraco.com/?path=/story/uui-form-layout-item",
-  "gitHead": "6fbddfc1295e2ea00a532d4f9eb798165b2d39ac"
+  "gitHead": "d91d346a0659f52de2a3c4746065c554f95e6328"
 }