@cds/core 5.5.8 → 5.6.0

package/custom-elements.legacy.json

@@ -255,10 +255,12 @@
       "properties": [
         {
           "name": "size",
+          "description": "Sets the overall height and width of the alerts inside the alert group",
           "type": "default | sm"
         },
         {
           "name": "type",
+          "description": "Passed down into the alerts inside the alert-group",
           "type": "default | banner | light"
         },
         {
@@ -268,6 +270,7 @@
         },
         {
           "name": "status",
+          "description": "Sets the status of the alerts inside the alert group",
           "type": "neutral | info | success | warning | danger | alt | loading"
         }
       ],
@@ -320,6 +323,7 @@
       "properties": [
         {
           "name": "size",
+          "description": "Sets the overall height and width of the alert and icon based on value",
           "type": "default | sm"
         },
         {
@@ -329,6 +333,7 @@
         },
         {
           "name": "status",
+          "description": "Sets the color of the alert from a predefined list of statuses",
           "type": "neutral | info | success | warning | danger | alt | loading"
         },
         {
@@ -379,6 +384,7 @@
       "properties": [
         {
           "name": "size",
+          "description": "Sets the overall height and width of the alert and icon based on value",
           "type": "default | sm"
         },
         {
@@ -388,6 +394,7 @@
         },
         {
           "name": "status",
+          "description": "Sets the color of the alert from a predefined list of statuses",
           "type": "neutral | info | success | warning | danger | alt | loading"
         },
         {
@@ -459,10 +466,12 @@
       "properties": [
         {
           "name": "size",
+          "description": "Sets the overall height and width of the alerts inside the alert group",
           "type": "default | sm"
         },
         {
           "name": "type",
+          "description": "Passed down into the alerts inside the alert-group",
           "type": "default | banner | light"
         },
         {
@@ -472,6 +481,7 @@
         },
         {
           "name": "status",
+          "description": "Sets the status of the alerts inside the alert group",
           "type": "neutral | info | success | warning | danger | alt | loading"
         }
       ],
@@ -529,6 +539,7 @@
         },
         {
           "name": "status",
+          "description": "Sets the color of the badge",
           "type": "neutral | info | success | warning | danger"
         }
       ],
@@ -580,6 +591,7 @@
         },
         {
           "name": "status",
+          "description": "Sets the color of the badge",
           "type": "neutral | info | success | warning | danger"
         }
       ],
@@ -684,6 +696,7 @@
         },
         {
           "name": "loadingState",
+          "description": "Changes the button content based on the value passed.",
           "type": "default | loading | success | error"
         },
         {
@@ -777,6 +790,7 @@
         },
         {
           "name": "loadingState",
+          "description": "Changes the button content based on the value passed.",
           "type": "default | loading | success | error"
         },
         {
@@ -893,6 +907,7 @@
         },
         {
           "name": "loadingState",
+          "description": "Changes the button content based on the value passed.",
           "type": "default | loading | success | error"
         },
         {
@@ -986,6 +1001,7 @@
         },
         {
           "name": "loadingState",
+          "description": "Changes the button content based on the value passed.",
           "type": "default | loading | success | error"
         },
         {
@@ -1484,6 +1500,7 @@
       "properties": [
         {
           "name": "status",
+          "description": "Set the status of control group validation",
           "type": "neutral | error | success"
         },
         {
@@ -1502,6 +1519,7 @@
         },
         {
           "name": "controlWidth",
+          "description": "Adjust the control from the default full width or the browser default width",
           "type": "stretch | shrink"
         },
         {
@@ -1537,10 +1555,12 @@
         },
         {
           "name": "status",
+          "description": "Set the status of form control validation",
           "type": "neutral | error | success"
         },
         {
           "name": "controlWidth",
+          "description": "Adjust the control from the default full width or the browser default width",
           "type": "stretch | shrink"
         },
         {
@@ -1555,6 +1575,7 @@
         },
         {
           "name": "layout",
+          "description": "Set to adjust the default control layout. When `responsive` is true this will be the largest size to scale to.",
           "type": "vertical | horizontal | compact"
         },
         {
@@ -1610,6 +1631,7 @@
       "properties": [
         {
           "name": "status",
+          "description": "Set the status of form control message validation",
           "type": "neutral | error | success"
         },
         {
@@ -1649,10 +1671,12 @@
       "properties": [
         {
           "name": "status",
+          "description": "Set the status of form control validation",
           "type": "neutral | error | success"
         },
         {
           "name": "controlWidth",
+          "description": "Adjust the control from the default full width or the browser default width",
           "type": "stretch | shrink"
         },
         {
@@ -1667,6 +1691,7 @@
         },
         {
           "name": "layout",
+          "description": "Set to adjust the default control layout. When `responsive` is true this will be the largest size to scale to.",
           "type": "vertical | horizontal | compact"
         },
         {
@@ -1696,10 +1721,12 @@
       "properties": [
         {
           "name": "layout",
+          "description": "Set to adjust the default control layout for all controls within form group.\nWhen `responsive` is true this will be the largest size to scale to.",
           "type": "horizontal | horizontal  -inline | vertical | vertical-inline | compact"
         },
         {
           "name": "controlWidth",
+          "description": "Adjust the control from the default full width or the browser default width",
           "type": "stretch | shrink"
         },
         {
@@ -1732,10 +1759,12 @@
       "properties": [
         {
           "name": "status",
+          "description": "Set the status of form control validation",
           "type": "neutral | error | success"
         },
         {
           "name": "controlWidth",
+          "description": "Adjust the control from the default full width or the browser default width",
           "type": "stretch | shrink"
         },
         {
@@ -1750,6 +1779,7 @@
         },
         {
           "name": "layout",
+          "description": "Set to adjust the default control layout. When `responsive` is true this will be the largest size to scale to.",
           "type": "vertical | horizontal | compact"
         },
         {
@@ -1805,6 +1835,7 @@
       "properties": [
         {
           "name": "status",
+          "description": "Set the status of control group validation",
           "type": "neutral | error | success"
         },
         {
@@ -1823,6 +1854,7 @@
         },
         {
           "name": "controlWidth",
+          "description": "Adjust the control from the default full width or the browser default width",
           "type": "stretch | shrink"
         },
         {
@@ -1858,10 +1890,12 @@
         },
         {
           "name": "status",
+          "description": "Set the status of form control validation",
           "type": "neutral | error | success"
         },
         {
           "name": "controlWidth",
+          "description": "Adjust the control from the default full width or the browser default width",
           "type": "stretch | shrink"
         },
         {
@@ -1876,6 +1910,7 @@
         },
         {
           "name": "layout",
+          "description": "Set to adjust the default control layout. When `responsive` is true this will be the largest size to scale to.",
           "type": "vertical | horizontal | compact"
         },
         {
@@ -1931,6 +1966,7 @@
       "properties": [
         {
           "name": "status",
+          "description": "Set the status of form control message validation",
           "type": "neutral | error | success"
         },
         {
@@ -1970,10 +2006,12 @@
       "properties": [
         {
           "name": "layout",
+          "description": "Set to adjust the default control layout for all controls within form group.\nWhen `responsive` is true this will be the largest size to scale to.",
           "type": "horizontal | horizontal  -inline | vertical | vertical-inline | compact"
         },
         {
           "name": "controlWidth",
+          "description": "Adjust the control from the default full width or the browser default width",
           "type": "stretch | shrink"
         },
         {
@@ -2011,14 +2049,17 @@
         },
         {
           "name": "size",
+          "description": "Apply numerical width-height or a t-shirt-sized CSS classname",
           "type": "string | xs | sm | md | lg | xl | xxl"
         },
         {
           "name": "direction",
+          "description": "Takes a directional value that rotates the icon 90° with the\ntop of the icon pointing in the specified direction.",
           "type": "up | down | left | right"
         },
         {
           "name": "flip",
+          "description": "Takes an orientation value that reverses the orientation of the icon vertically or horizontally'",
           "type": "horizontal | vertical"
         },
         {
@@ -2028,6 +2069,7 @@
         },
         {
           "name": "status",
+          "description": "Changes color of icon fills and outlines",
           "type": "info | success | warning | danger"
         },
         {
@@ -2037,6 +2079,7 @@
         },
         {
           "name": "badge",
+          "description": "Sets the color of the icon decoration that appears in the top-right corner\nof the glyph. The icon decoration is derived from the following predefined types.\n\nThe color of the badge can change according to the following\nlist of statuses:\n'info'  -> blue dot\n'success' -> green dot\n'warning' -> yellow dot\n'danger' -> red dot\n'inherit' -> dot inherits color of full icon glyph\n'warning-triangle' -> yellow triangle\n'inherit-triangle' -> triangle inherits color of full icon glyph\nunrecognized value, empty string, or true -> red dot\n\nBy default, the badge displays a 'danger' dot (a red-colored dot).\n\nSetting the badge to 'false' or removing the attribute will remove the default icon badge.",
           "type": "info | success | warning | danger | inherit | warning  -triangle | inherit-triangle"
         }
       ],
@@ -2061,14 +2104,17 @@
         },
         {
           "name": "size",
+          "description": "Apply numerical width-height or a t-shirt-sized CSS classname",
           "type": "string | xs | sm | md | lg | xl | xxl"
         },
         {
           "name": "direction",
+          "description": "Takes a directional value that rotates the icon 90° with the\ntop of the icon pointing in the specified direction.",
           "type": "up | down | left | right"
         },
         {
           "name": "flip",
+          "description": "Takes an orientation value that reverses the orientation of the icon vertically or horizontally'",
           "type": "horizontal | vertical"
         },
         {
@@ -2078,6 +2124,7 @@
         },
         {
           "name": "status",
+          "description": "Changes color of icon fills and outlines",
           "type": "info | success | warning | danger"
         },
         {
@@ -2087,6 +2134,7 @@
         },
         {
           "name": "badge",
+          "description": "Sets the color of the icon decoration that appears in the top-right corner\nof the glyph. The icon decoration is derived from the following predefined types.\n\nThe color of the badge can change according to the following\nlist of statuses:\n'info'  -> blue dot\n'success' -> green dot\n'warning' -> yellow dot\n'danger' -> red dot\n'inherit' -> dot inherits color of full icon glyph\n'warning-triangle' -> yellow triangle\n'inherit-triangle' -> triangle inherits color of full icon glyph\nunrecognized value, empty string, or true -> red dot\n\nBy default, the badge displays a 'danger' dot (a red-colored dot).\n\nSetting the badge to 'false' or removing the attribute will remove the default icon badge.",
           "type": "info | success | warning | danger | inherit | warning  -triangle | inherit-triangle"
         }
       ],
@@ -3462,6 +3510,7 @@
       "properties": [
         {
           "name": "status",
+          "description": "Sets the color of the badge",
           "type": "neutral | info | success | warning | danger"
         },
         {
@@ -3481,6 +3530,7 @@
         },
         {
           "name": "size",
+          "description": "Apply numerical width-height or a t-shirt-sized CSS classname",
           "type": "string | sm | md | lg | xl | xxl"
         }
       ],
@@ -3506,6 +3556,7 @@
       "properties": [
         {
           "name": "status",
+          "description": "Sets the color of the badge",
           "type": "neutral | info | success | warning | danger"
         },
         {
@@ -3525,6 +3576,7 @@
         },
         {
           "name": "size",
+          "description": "Apply numerical width-height or a t-shirt-sized CSS classname",
           "type": "string | sm | md | lg | xl | xxl"
         }
       ],
@@ -3861,6 +3913,192 @@
         }
       ]
     },
+    {
+      "name": "cds-checkbox",
+      "path": "./selection-panels/checkbox/checkbox-panel.element.d.ts",
+      "description": "Checkbox\n\n```typescript\nimport '@cds/core/checkbox/register.js';\n```\n\n```html\n<cds-checkbox>\n   <label>\n     <div cds-layout=\"vertical align:center\">\n       <span cds-text=\"section\">VM One</span>\n       <cds-icon shape=\"vm\" badge=\"info\"></cds-icon>\n       <p>Machines for orchestration and automation.</p>\n     </div>\n   </label>\n   <input type=\"checkbox\" />\n   <cds-control-message>message text</cds-control-message>\n</cds-checkbox>\n```",
+      "properties": [
+        {
+          "name": "size",
+          "type": "SelectionPanelSizes"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "For projecting checkbox and it's complex label"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--width"
+        },
+        {
+          "name": "--height"
+        },
+        {
+          "name": "--border"
+        },
+        {
+          "name": "--box-shadow"
+        }
+      ]
+    },
+    {
+      "name": "cds-checkbox-panel",
+      "path": "./selection-panels/checkbox/register.d.ts",
+      "description": "Checkbox\n\n```typescript\nimport '@cds/core/checkbox/register.js';\n```\n\n```html\n<cds-checkbox>\n   <label>\n     <div cds-layout=\"vertical align:center\">\n       <span cds-text=\"section\">VM One</span>\n       <cds-icon shape=\"vm\" badge=\"info\"></cds-icon>\n       <p>Machines for orchestration and automation.</p>\n     </div>\n   </label>\n   <input type=\"checkbox\" />\n   <cds-control-message>message text</cds-control-message>\n</cds-checkbox>\n```",
+      "properties": [
+        {
+          "name": "size",
+          "type": "SelectionPanelSizes"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "For projecting checkbox and it's complex label"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--width"
+        },
+        {
+          "name": "--height"
+        },
+        {
+          "name": "--border"
+        },
+        {
+          "name": "--box-shadow"
+        }
+      ]
+    },
+    {
+      "name": "cds-radio",
+      "path": "./selection-panels/radio/radio-panel.element.d.ts",
+      "description": "Checkbox\n\n```typescript\nimport '@cds/core/checkbox/register.js';\n```\n\n```html\n<cds-radio>\n   <label>\n     <div cds-layout=\"vertical align:center\">\n       <span cds-text=\"section\">VM One</span>\n       <cds-icon shape=\"vm\" badge=\"info\"></cds-icon>\n       <p>Machines for orchestration and automation.</p>\n     </div>\n   </label>\n   <input type=\"radio\" />\n   <cds-control-message>message text</cds-control-message>\n</cds-radio>\n```",
+      "properties": [
+        {
+          "name": "size",
+          "type": "SelectionPanelSizes"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "For projecting checkbox and it's complex label"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--width"
+        },
+        {
+          "name": "--height"
+        },
+        {
+          "name": "--border"
+        },
+        {
+          "name": "--box-shadow"
+        }
+      ]
+    },
+    {
+      "name": "cds-radio-panel",
+      "path": "./selection-panels/radio/register.d.ts",
+      "description": "Checkbox\n\n```typescript\nimport '@cds/core/checkbox/register.js';\n```\n\n```html\n<cds-radio>\n   <label>\n     <div cds-layout=\"vertical align:center\">\n       <span cds-text=\"section\">VM One</span>\n       <cds-icon shape=\"vm\" badge=\"info\"></cds-icon>\n       <p>Machines for orchestration and automation.</p>\n     </div>\n   </label>\n   <input type=\"radio\" />\n   <cds-control-message>message text</cds-control-message>\n</cds-radio>\n```",
+      "properties": [
+        {
+          "name": "size",
+          "type": "SelectionPanelSizes"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "For projecting checkbox and it's complex label"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--width"
+        },
+        {
+          "name": "--height"
+        },
+        {
+          "name": "--border"
+        },
+        {
+          "name": "--box-shadow"
+        }
+      ]
+    },
+    {
+      "name": "cds-checkbox-panel",
+      "path": "./selection-panels/register.d.ts",
+      "description": "Checkbox\n\n```typescript\nimport '@cds/core/checkbox/register.js';\n```\n\n```html\n<cds-checkbox>\n   <label>\n     <div cds-layout=\"vertical align:center\">\n       <span cds-text=\"section\">VM One</span>\n       <cds-icon shape=\"vm\" badge=\"info\"></cds-icon>\n       <p>Machines for orchestration and automation.</p>\n     </div>\n   </label>\n   <input type=\"checkbox\" />\n   <cds-control-message>message text</cds-control-message>\n</cds-checkbox>\n```",
+      "properties": [
+        {
+          "name": "size",
+          "type": "SelectionPanelSizes"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "For projecting checkbox and it's complex label"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--width"
+        },
+        {
+          "name": "--height"
+        },
+        {
+          "name": "--border"
+        },
+        {
+          "name": "--box-shadow"
+        }
+      ]
+    },
+    {
+      "name": "cds-radio-panel",
+      "path": "./selection-panels/register.d.ts",
+      "description": "Checkbox\n\n```typescript\nimport '@cds/core/checkbox/register.js';\n```\n\n```html\n<cds-radio>\n   <label>\n     <div cds-layout=\"vertical align:center\">\n       <span cds-text=\"section\">VM One</span>\n       <cds-icon shape=\"vm\" badge=\"info\"></cds-icon>\n       <p>Machines for orchestration and automation.</p>\n     </div>\n   </label>\n   <input type=\"radio\" />\n   <cds-control-message>message text</cds-control-message>\n</cds-radio>\n```",
+      "properties": [
+        {
+          "name": "size",
+          "type": "SelectionPanelSizes"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "For projecting checkbox and it's complex label"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--width"
+        },
+        {
+          "name": "--height"
+        },
+        {
+          "name": "--border"
+        },
+        {
+          "name": "--box-shadow"
+        }
+      ]
+    },
     {
       "name": "cds-tag",
       "path": "./tag/register.d.ts",
@@ -3868,6 +4106,7 @@
       "properties": [
         {
           "name": "status",
+          "description": "Sets the color of the tag (and badge if present) from the following predefined list of statuses:",
           "type": "neutral | info | success | warning | danger"
         },
         {
@@ -3921,6 +4160,7 @@
       "properties": [
         {
           "name": "status",
+          "description": "Sets the color of the tag (and badge if present) from the following predefined list of statuses:",
           "type": "neutral | info | success | warning | danger"
         },
         {

package/forms/control/control.element.d.ts

@@ -29,13 +29,13 @@ export declare const enum ControlLabelLayout {
  */
 export declare class CdsControl extends LitElement {
     /**
-     * @type {neutral | error | success}
      * Set the status of form control validation
+     * @type {neutral | error | success}
      */
     status: ControlStatus;
     /**
-     * @type {stretch | shrink}
      * Adjust the control from the default full width or the browser default width
+     * @type {stretch | shrink}
      */
     controlWidth: ControlWidth;
     /**
@@ -49,8 +49,8 @@ export declare class CdsControl extends LitElement {
      */
     responsive: boolean;
     /**
-     * @type {vertical | horizontal | compact}
      * Set to adjust the default control layout. When `responsive` is true this will be the largest size to scale to.
+     * @type {vertical | horizontal | compact}
      */
     get layout(): ControlLayout;
     set layout(value: ControlLayout);

package/forms/control-group/control-group.element.d.ts

@@ -31,8 +31,8 @@ import { CdsInternalControlLabel } from '../control-label/control-label.element.
  */
 export declare class CdsInternalControlGroup extends LitElement {
     /**
-     * @type {neutral | error | success}
      * Set the status of control group validation
+     * @type {neutral | error | success}
      */
     status: ControlStatus;
     /** @type {horizontal | horizontal-inline | vertical | vertical-inline | compact} */
@@ -42,8 +42,8 @@ export declare class CdsInternalControlGroup extends LitElement {
     /** Disable all controls within a control group or omit and disable controls individually */
     disabled: boolean;
     /**
-     * @type {stretch | shrink}
      * Adjust the control from the default full width or the browser default width
+     * @type {stretch | shrink}
      */
     controlWidth: ControlWidth;
     /**

package/forms/control-inline/control-inline.element.d.ts

@@ -29,6 +29,7 @@ export declare class CdsInternalControlInline extends CdsControl {
     protected checkedChange: EventEmitter<boolean>;
     protected supportsPrefixSuffixActions: boolean;
     static get styles(): import("lit").CSSResultGroup[];
+    protected get internalLabelTemplate(): import("lit-html").TemplateResult<1>;
     render(): import("lit-html").TemplateResult<1>;
     firstUpdated(props: Map<string, any>): void;
     updated(props: Map<string, any>): void;

package/forms/control-inline/control-inline.element.js

@@ -1,2 +1,2 @@
-import{__decorate as e}from"tslib";import{html as t}from"lit";import{getElementUpdates as i,property as s,state as o,event as n}from"@cds/core/internal";import r from"./control-inline.element.scss.js";import{CdsControl as l}from"../control/control.element.js";import{getStatusIcon as c}from"../utils/index.js";class a extends l{constructor(){super(...arguments),this.controlAlign="left",this.checked=!1,this.indeterminate=!1,this.supportsPrefixSuffixActions=!1}static get styles(){return[...super.styles,r]}render(){var e,i;return t`<div class="private-host" cds-layout="${this.isControlGroup?"horizontal align:vertical-center":"vertical"} gap:sm"><div cds-layout="horizontal gap:sm wrap:none align:vertical-center ${"right"===this.controlAlign?"order:reverse":""}"><div role="presentation" class="input" @click="${this.selectInput}"></div><div role="presentation" focusable @click="${this.selectInput}"></div><cds-internal-control-label action="secondary" .disabled="${this.disabled}" cds-layout="align:vertical-center"><slot name="label" @slotchange="${()=>this.associateInputAndLabel()}"></slot></cds-internal-control-label></div>${(null===(e=this.messages)||void 0===e?void 0:e.length)?t`<div cds-layout="horizontal wrap:none ${(null===(i=this.messages)||void 0===i?void 0:i.length)?"gap:sm":""}">${c(this.status)}<div cds-layout="align:vertical-center" class="messages"><slot name="message"></slot></div></div>`:""}</div><div cds-layout="display:screen-reader-only"><slot name="input"></slot></div>`}firstUpdated(e){super.firstUpdated(e),this.inputControl.addEventListener("change",(()=>this.checked=this.inputControl.checked)),this.observers.push(i(this.inputControl,"checked",(e=>this.checked=""===e||e)),i(this.inputControl,"indeterminate",(e=>this.indeterminate=""===e||e)))}updated(e){super.updated(e),e.has("indeterminate")&&e.get("indeterminate")!==this.indeterminate&&this.indeterminate&&(this.checked=!1),e.has("checked")&&e.get("checked")!==this.checked&&this.checked&&(this.indeterminate=!1,this.checkedChange.emit(this.checked,{bubbles:!this.isControlGroup}))}selectInput(e){this.inputControl.click(),e.preventDefault()}}e([s({type:String})],a.prototype,"controlAlign",void 0),e([o()],a.prototype,"isControlGroup",void 0),e([o({type:Boolean,reflect:!0})],a.prototype,"checked",void 0),e([o({type:Boolean,reflect:!0})],a.prototype,"indeterminate",void 0),e([n()],a.prototype,"checkedChange",void 0);export{a as CdsInternalControlInline};
+import{__decorate as e}from"tslib";import{html as t}from"lit";import{getElementUpdates as i,property as s,state as n,event as o}from"@cds/core/internal";import r from"./control-inline.element.scss.js";import{CdsControl as l}from"../control/control.element.js";import{getStatusIcon as a}from"../utils/index.js";class c extends l{constructor(){super(...arguments),this.controlAlign="left",this.checked=!1,this.indeterminate=!1,this.supportsPrefixSuffixActions=!1}static get styles(){return[...super.styles,r]}get internalLabelTemplate(){return t`<cds-internal-control-label action="secondary" .disabled="${this.disabled}" cds-layout="align:vertical-center"><slot name="label" @slotchange="${()=>this.associateInputAndLabel()}"></slot></cds-internal-control-label>`}render(){var e,i;return t`<div class="private-host" cds-layout="${this.isControlGroup?"horizontal align:vertical-center":"vertical"} gap:sm"><div cds-layout="horizontal gap:sm wrap:none align:vertical-center ${"right"===this.controlAlign?"order:reverse":""}"><div role="presentation" class="input" @click="${this.selectInput}"></div><div role="presentation" focusable @click="${this.selectInput}"></div>${this.internalLabelTemplate}</div>${(null===(e=this.messages)||void 0===e?void 0:e.length)?t`<div cds-layout="horizontal wrap:none ${(null===(i=this.messages)||void 0===i?void 0:i.length)?"gap:sm":""}">${a(this.status)}<div cds-layout="align:vertical-center" class="messages"><slot name="message"></slot></div></div>`:""}</div><div cds-layout="display:screen-reader-only"><slot name="input"></slot></div>`}firstUpdated(e){super.firstUpdated(e),this.inputControl.addEventListener("change",(()=>this.checked=this.inputControl.checked)),this.observers.push(i(this.inputControl,"checked",(e=>this.checked=""===e||e)),i(this.inputControl,"indeterminate",(e=>this.indeterminate=""===e||e)))}updated(e){super.updated(e),e.has("indeterminate")&&e.get("indeterminate")!==this.indeterminate&&this.indeterminate&&(this.checked=!1),e.has("checked")&&e.get("checked")!==this.checked&&this.checked&&(this.indeterminate=!1,this.checkedChange.emit(this.checked,{bubbles:!this.isControlGroup}))}selectInput(e){this.inputControl.click(),e.preventDefault()}}e([s({type:String})],c.prototype,"controlAlign",void 0),e([n()],c.prototype,"isControlGroup",void 0),e([n({type:Boolean,reflect:!0})],c.prototype,"checked",void 0),e([n({type:Boolean,reflect:!0})],c.prototype,"indeterminate",void 0),e([o()],c.prototype,"checkedChange",void 0);export{c as CdsInternalControlInline};
 //# sourceMappingURL=control-inline.element.js.map

package/forms/control-inline/control-inline.element.js.map

@@ -1 +1 @@
-{"version":3,"file":"control-inline.element.js","sources":["../../../../src/forms/control-inline/control-inline.element.ts"],"sourcesContent":null,"names":["CdsInternalControlInline","CdsControl","[object Object]","super","arguments","this","controlAlign","checked","indeterminate","supportsPrefixSuffixActions","styles","_a","_b","html","isControlGroup","selectInput","disabled","associateInputAndLabel","messages","length","getStatusIcon","status","props","firstUpdated","inputControl","addEventListener","observers","push","getElementUpdates","value","updated","has","get","checkedChange","emit","bubbles","e","click","preventDefault","__decorate","property","type","String","prototype","state","Boolean","reflect","event"],"mappings":"sTA2BO,MAAMA,UAAiCC,EAC1CC,cACIC,SAASC,WAETC,KAAKC,aAAe,OAEpBD,KAAKE,SAAU,EAEfF,KAAKG,eAAgB,EACrBH,KAAKI,6BAA8B,EAEvCC,oBACI,MAAO,IAAIP,MAAMO,OAAQA,GAE7BR,SACI,IAAIS,EAAIC,EACR,OAAOC,CAAK,yCAGER,KAAKS,eAAiB,mCAAqC,yFAGe,UAAtBT,KAAKC,aACjE,gBACA,sDAE4CD,KAAKU,iEACTV,KAAKU,gFAGlCV,KAAKW,gFAGe,IAAMX,KAAKY,wEAGpB,QAAxBN,EAAKN,KAAKa,gBAA6B,IAAPP,OAAgB,EAASA,EAAGQ,QAC1DN,CAAK,0CAAoE,QAAxBD,EAAKP,KAAKa,gBAA6B,IAAPN,OAAgB,EAASA,EAAGO,QAAU,SAAW,OAChIC,EAAcf,KAAKgB,2GAKrB,wFAOVnB,aAAaoB,GACTnB,MAAMoB,aAAaD,GACnBjB,KAAKmB,aAAaC,iBAAiB,UAAU,IAAOpB,KAAKE,QAAUF,KAAKmB,aAAajB,UACrFF,KAAKqB,UAAUC,KAAKC,EAAkBvB,KAAKmB,aAAc,WAAYK,GAAWxB,KAAKE,QAAoB,KAAVsB,GAAsBA,IAASD,EAAkBvB,KAAKmB,aAAc,iBAAkBK,GAAWxB,KAAKG,cAA0B,KAAVqB,GAAsBA,KAE/O3B,QAAQoB,GACJnB,MAAM2B,QAAQR,GACVA,EAAMS,IAAI,kBAAoBT,EAAMU,IAAI,mBAAqB3B,KAAKG,eAAiBH,KAAKG,gBACxFH,KAAKE,SAAU,GAEfe,EAAMS,IAAI,YAAcT,EAAMU,IAAI,aAAe3B,KAAKE,SAAWF,KAAKE,UACtEF,KAAKG,eAAgB,EACrBH,KAAK4B,cAAcC,KAAK7B,KAAKE,QAAS,CAAE4B,SAAU9B,KAAKS,kBAG/DZ,YAAYkC,GACR/B,KAAKmB,aAAaa,QAClBD,EAAEE,kBAGVC,EAAW,CACPC,EAAS,CAAEC,KAAMC,UAClB1C,EAAyB2C,UAAW,oBAAgB,GACvDJ,EAAW,CACPK,KACD5C,EAAyB2C,UAAW,sBAAkB,GACzDJ,EAAW,CACPK,EAAM,CAAEH,KAAMI,QAASC,SAAS,KACjC9C,EAAyB2C,UAAW,eAAW,GAClDJ,EAAW,CACPK,EAAM,CAAEH,KAAMI,QAASC,SAAS,KACjC9C,EAAyB2C,UAAW,qBAAiB,GACxDJ,EAAW,CACPQ,KACD/C,EAAyB2C,UAAW,qBAAiB"}
+{"version":3,"file":"control-inline.element.js","sources":["../../../../src/forms/control-inline/control-inline.element.ts"],"sourcesContent":null,"names":["CdsInternalControlInline","CdsControl","[object Object]","super","arguments","this","controlAlign","checked","indeterminate","supportsPrefixSuffixActions","styles","internalLabelTemplate","html","disabled","associateInputAndLabel","_a","_b","isControlGroup","selectInput","messages","length","getStatusIcon","status","props","firstUpdated","inputControl","addEventListener","observers","push","getElementUpdates","value","updated","has","get","checkedChange","emit","bubbles","e","click","preventDefault","__decorate","property","type","String","prototype","state","Boolean","reflect","event"],"mappings":"sTA2BO,MAAMA,UAAiCC,EAC1CC,cACIC,SAASC,WAETC,KAAKC,aAAe,OAEpBD,KAAKE,SAAU,EAEfF,KAAKG,eAAgB,EACrBH,KAAKI,6BAA8B,EAEvCC,oBACI,MAAO,IAAIP,MAAMO,OAAQA,GAE7BC,4BACI,OAAOC,CAAK,6DAC8CP,KAAKQ,gFAC9B,IAAMR,KAAKS,iEAIhDZ,SACI,IAAIa,EAAIC,EACR,OAAOJ,CAAK,yCAGEP,KAAKY,eAAiB,mCAAqC,yFAGe,UAAtBZ,KAAKC,aACjE,gBACA,sDAE4CD,KAAKa,iEACTb,KAAKa,sBAC/Cb,KAAKM,+BAEmB,QAAxBI,EAAKV,KAAKc,gBAA6B,IAAPJ,OAAgB,EAASA,EAAGK,QAC1DR,CAAK,0CAAoE,QAAxBI,EAAKX,KAAKc,gBAA6B,IAAPH,OAAgB,EAASA,EAAGI,QAAU,SAAW,OAChIC,EAAchB,KAAKiB,2GAKrB,wFAOVpB,aAAaqB,GACTpB,MAAMqB,aAAaD,GACnBlB,KAAKoB,aAAaC,iBAAiB,UAAU,IAAOrB,KAAKE,QAAUF,KAAKoB,aAAalB,UACrFF,KAAKsB,UAAUC,KAAKC,EAAkBxB,KAAKoB,aAAc,WAAYK,GAAWzB,KAAKE,QAAoB,KAAVuB,GAAsBA,IAASD,EAAkBxB,KAAKoB,aAAc,iBAAkBK,GAAWzB,KAAKG,cAA0B,KAAVsB,GAAsBA,KAE/O5B,QAAQqB,GACJpB,MAAM4B,QAAQR,GACVA,EAAMS,IAAI,kBAAoBT,EAAMU,IAAI,mBAAqB5B,KAAKG,eAAiBH,KAAKG,gBACxFH,KAAKE,SAAU,GAEfgB,EAAMS,IAAI,YAAcT,EAAMU,IAAI,aAAe5B,KAAKE,SAAWF,KAAKE,UACtEF,KAAKG,eAAgB,EACrBH,KAAK6B,cAAcC,KAAK9B,KAAKE,QAAS,CAAE6B,SAAU/B,KAAKY,kBAG/Df,YAAYmC,GACRhC,KAAKoB,aAAaa,QAClBD,EAAEE,kBAGVC,EAAW,CACPC,EAAS,CAAEC,KAAMC,UAClB3C,EAAyB4C,UAAW,oBAAgB,GACvDJ,EAAW,CACPK,KACD7C,EAAyB4C,UAAW,sBAAkB,GACzDJ,EAAW,CACPK,EAAM,CAAEH,KAAMI,QAASC,SAAS,KACjC/C,EAAyB4C,UAAW,eAAW,GAClDJ,EAAW,CACPK,EAAM,CAAEH,KAAMI,QAASC,SAAS,KACjC/C,EAAyB4C,UAAW,qBAAiB,GACxDJ,EAAW,CACPQ,KACDhD,EAAyB4C,UAAW,qBAAiB"}

package/forms/control-message/control-message.element.d.ts

@@ -26,8 +26,8 @@ import { ValidityStateKey } from '../utils/validate.js';
  */
 export declare class CdsControlMessage extends LitElement {
     /**
-     * @type {neutral | error | success}
      * Set the status of form control message validation
+     * @type {neutral | error | success}
      */
     status: ControlStatus;
     /**