@universal-material/web 3.0.122 → 3.0.123

package/custom-elements.json

@@ -2718,255 +2718,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/card/card-content.styles.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "styles",
-          "default": "css `\n  :host {\n    display: block;\n  }\n\n  :host(:has(slot > *)) {\n    display: none;\n  }\n\n  :host([has-content]) {\n    padding: var(--u-card-padding, 16px);\n  }\n\n  slot {\n    border-radius: inherit;\n  }\n`"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "styles",
-          "declaration": {
-            "name": "styles",
-            "module": "src/card/card-content.styles.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/card/card-content.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "UmCardContent",
-          "members": [
-            {
-              "kind": "field",
-              "name": "hasContent",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "attribute": "has-content",
-              "reflects": true
-            },
-            {
-              "kind": "method",
-              "name": "handleSlotChange",
-              "privacy": "private",
-              "parameters": [
-                {
-                  "name": "e",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ]
-            }
-          ],
-          "attributes": [
-            {
-              "name": "has-content",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "fieldName": "hasContent"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "u-card-content",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "UmCardContent",
-          "declaration": {
-            "name": "UmCardContent",
-            "module": "src/card/card-content.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "u-card-content",
-          "declaration": {
-            "name": "UmCardContent",
-            "module": "src/card/card-content.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/card/card-media.styles.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "styles",
-          "default": "css `\n  :host {\n    display: block;\n    aspect-ratio: 1;\n    border-radius: var(--u-card-shape-corner, var(--u-shape-corner-medium, 12px));\n  }\n\n  :host([wide]) {\n    aspect-ratio: 16/9;\n  }\n`"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "styles",
-          "declaration": {
-            "name": "styles",
-            "module": "src/card/card-media.styles.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/card/card-media.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "UmCardMedia",
-          "members": [
-            {
-              "kind": "field",
-              "name": "wide",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "attribute": "wide",
-              "reflects": true
-            }
-          ],
-          "attributes": [
-            {
-              "name": "wide",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "fieldName": "wide"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "u-card-media",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "UmCardMedia",
-          "declaration": {
-            "name": "UmCardMedia",
-            "module": "src/card/card-media.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "u-card-media",
-          "declaration": {
-            "name": "UmCardMedia",
-            "module": "src/card/card-media.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/card/card.styles.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "styles",
-          "default": "css `\n  :host {\n    display: block;\n    position: relative;\n    border-radius: var(--u-card-shape-corner, var(--u-shape-corner-medium, 12px));\n  }\n\n  :host([variant=elevated]) {\n    --u-current-bg-color: var(--u-card-elevated-bg-color, var(--u-color-surface-container-low, rgb(247, 242, 250)));\n    background-color: var(--u-current-bg-color);\n  }\n  :host([variant=elevated]) u-elevation {\n    --u-elevation-level: var(--u-elevated-card-elevation-level, 1);\n  }\n\n  :host([variant=filled]) {\n    --u-current-bg-color: var(--u-card-filled-bg-color, var(--u-color-surface-container-highest, rgb(230, 224, 233)));\n    background-color: var(--u-current-bg-color);\n  }\n\n  :host([variant=outlined]) {\n    border: var(--u-outlined-card-outline-width, 1px) solid var(--u-outlined-card-outline-color, var(--u-color-outline-variant, rgb(202, 196, 208)));\n  }\n\n  u-card-content,\n  slot {\n    border-radius: inherit;\n  }\n`"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "styles",
-          "declaration": {
-            "name": "styles",
-            "module": "src/card/card.styles.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/card/card.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "UmCard",
-          "members": [
-            {
-              "kind": "field",
-              "name": "variant",
-              "type": {
-                "text": "UmCardVariant"
-              },
-              "default": "'filled'",
-              "description": "The Card variant to render.",
-              "attribute": "variant",
-              "reflects": true
-            }
-          ],
-          "attributes": [
-            {
-              "name": "variant",
-              "type": {
-                "text": "UmCardVariant"
-              },
-              "default": "'filled'",
-              "description": "The Card variant to render.",
-              "fieldName": "variant"
-            }
-          ],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "u-card",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "UmCard",
-          "declaration": {
-            "name": "UmCard",
-            "module": "src/card/card.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "u-card",
-          "declaration": {
-            "name": "UmCard",
-            "module": "src/card/card.ts"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/checkbox/checkbox-list-item.ts",
@@ -3686,88 +3437,337 @@
               }
             },
             {
-              "name": "disabled",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "disabled",
+              "inheritedFrom": {
+                "name": "UmSelectionControl",
+                "module": "src/shared/selection-control/selection-control.ts"
+              }
+            },
+            {
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "default": "'on'",
+              "description": "The element value to use in form submission when checked.",
+              "fieldName": "value",
+              "inheritedFrom": {
+                "name": "UmSelectionControl",
+                "module": "src/shared/selection-control/selection-control.ts"
+              }
+            },
+            {
+              "name": "checked",
+              "fieldName": "_checkedAttribute",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "inheritedFrom": {
+                "name": "UmSelectionControl",
+                "module": "src/shared/selection-control/selection-control.ts"
+              }
+            }
+          ],
+          "superclass": {
+            "name": "UmSelectionControl",
+            "module": "/src/shared/selection-control/selection-control.js"
+          },
+          "tagName": "u-checkbox",
+          "customElement": true,
+          "events": [
+            {
+              "name": "input",
+              "type": {
+                "text": "InputEvent"
+              },
+              "inheritedFrom": {
+                "name": "UmSelectionControl",
+                "module": "src/shared/selection-control/selection-control.ts"
+              }
+            },
+            {
+              "name": "change",
+              "type": {
+                "text": "Event"
+              },
+              "inheritedFrom": {
+                "name": "UmSelectionControl",
+                "module": "src/shared/selection-control/selection-control.ts"
+              }
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "UmCheckbox",
+          "declaration": {
+            "name": "UmCheckbox",
+            "module": "src/checkbox/checkbox.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "u-checkbox",
+          "declaration": {
+            "name": "UmCheckbox",
+            "module": "src/checkbox/checkbox.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/card/card-content.styles.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "styles",
+          "default": "css `\n  :host {\n    display: block;\n  }\n\n  :host(:has(slot > *)) {\n    display: none;\n  }\n\n  :host([has-content]) {\n    padding: var(--u-card-padding, 16px);\n  }\n\n  slot {\n    border-radius: inherit;\n  }\n`"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "styles",
+          "declaration": {
+            "name": "styles",
+            "module": "src/card/card-content.styles.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/card/card-content.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "UmCardContent",
+          "members": [
+            {
+              "kind": "field",
+              "name": "hasContent",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "has-content",
+              "reflects": true
+            },
+            {
+              "kind": "method",
+              "name": "handleSlotChange",
+              "privacy": "private",
+              "parameters": [
+                {
+                  "name": "e",
+                  "type": {
+                    "text": "Event"
+                  }
+                }
+              ]
+            }
+          ],
+          "attributes": [
+            {
+              "name": "has-content",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "hasContent"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "u-card-content",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "UmCardContent",
+          "declaration": {
+            "name": "UmCardContent",
+            "module": "src/card/card-content.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "u-card-content",
+          "declaration": {
+            "name": "UmCardContent",
+            "module": "src/card/card-content.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/card/card-media.styles.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "styles",
+          "default": "css `\n  :host {\n    display: block;\n    aspect-ratio: 1;\n    border-radius: var(--u-card-shape-corner, var(--u-shape-corner-medium, 12px));\n  }\n\n  :host([wide]) {\n    aspect-ratio: 16/9;\n  }\n`"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "styles",
+          "declaration": {
+            "name": "styles",
+            "module": "src/card/card-media.styles.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/card/card-media.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "UmCardMedia",
+          "members": [
+            {
+              "kind": "field",
+              "name": "wide",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "fieldName": "disabled",
-              "inheritedFrom": {
-                "name": "UmSelectionControl",
-                "module": "src/shared/selection-control/selection-control.ts"
-              }
-            },
-            {
-              "name": "value",
-              "type": {
-                "text": "string"
-              },
-              "default": "'on'",
-              "description": "The element value to use in form submission when checked.",
-              "fieldName": "value",
-              "inheritedFrom": {
-                "name": "UmSelectionControl",
-                "module": "src/shared/selection-control/selection-control.ts"
-              }
-            },
+              "attribute": "wide",
+              "reflects": true
+            }
+          ],
+          "attributes": [
             {
-              "name": "checked",
-              "fieldName": "_checkedAttribute",
+              "name": "wide",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "inheritedFrom": {
-                "name": "UmSelectionControl",
-                "module": "src/shared/selection-control/selection-control.ts"
-              }
+              "fieldName": "wide"
             }
           ],
           "superclass": {
-            "name": "UmSelectionControl",
-            "module": "/src/shared/selection-control/selection-control.js"
+            "name": "LitElement",
+            "package": "lit"
           },
-          "tagName": "u-checkbox",
-          "customElement": true,
-          "events": [
+          "tagName": "u-card-media",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "UmCardMedia",
+          "declaration": {
+            "name": "UmCardMedia",
+            "module": "src/card/card-media.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "u-card-media",
+          "declaration": {
+            "name": "UmCardMedia",
+            "module": "src/card/card-media.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/card/card.styles.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "styles",
+          "default": "css `\n  :host {\n    display: block;\n    position: relative;\n    border-radius: var(--u-card-shape-corner, var(--u-shape-corner-medium, 12px));\n  }\n\n  :host([variant=elevated]) {\n    --u-current-bg-color: var(--u-card-elevated-bg-color, var(--u-color-surface-container-low, rgb(247, 242, 250)));\n    background-color: var(--u-current-bg-color);\n  }\n  :host([variant=elevated]) u-elevation {\n    --u-elevation-level: var(--u-elevated-card-elevation-level, 1);\n  }\n\n  :host([variant=filled]) {\n    --u-current-bg-color: var(--u-card-filled-bg-color, var(--u-color-surface-container-highest, rgb(230, 224, 233)));\n    background-color: var(--u-current-bg-color);\n  }\n\n  :host([variant=outlined]) {\n    border: var(--u-outlined-card-outline-width, 1px) solid var(--u-outlined-card-outline-color, var(--u-color-outline-variant, rgb(202, 196, 208)));\n  }\n\n  u-card-content,\n  slot {\n    border-radius: inherit;\n  }\n`"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "styles",
+          "declaration": {
+            "name": "styles",
+            "module": "src/card/card.styles.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/card/card.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "UmCard",
+          "members": [
             {
-              "name": "input",
+              "kind": "field",
+              "name": "variant",
               "type": {
-                "text": "InputEvent"
+                "text": "UmCardVariant"
               },
-              "inheritedFrom": {
-                "name": "UmSelectionControl",
-                "module": "src/shared/selection-control/selection-control.ts"
-              }
-            },
+              "default": "'filled'",
+              "description": "The Card variant to render.",
+              "attribute": "variant",
+              "reflects": true
+            }
+          ],
+          "attributes": [
             {
-              "name": "change",
+              "name": "variant",
               "type": {
-                "text": "Event"
+                "text": "UmCardVariant"
               },
-              "inheritedFrom": {
-                "name": "UmSelectionControl",
-                "module": "src/shared/selection-control/selection-control.ts"
-              }
+              "default": "'filled'",
+              "description": "The Card variant to render.",
+              "fieldName": "variant"
             }
-          ]
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "u-card",
+          "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "UmCheckbox",
+          "name": "UmCard",
           "declaration": {
-            "name": "UmCheckbox",
-            "module": "src/checkbox/checkbox.ts"
+            "name": "UmCard",
+            "module": "src/card/card.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "u-checkbox",
+          "name": "u-card",
           "declaration": {
-            "name": "UmCheckbox",
-            "module": "src/checkbox/checkbox.ts"
+            "name": "UmCard",
+            "module": "src/card/card.ts"
           }
         }
       ]
@@ -7139,213 +7139,78 @@
               "name": "invalid",
               "type": {
                 "text": "boolean"
-              },
-              "default": "false",
-              "description": "Get or sets where or not the field is in a visually invalid state.",
-              "fieldName": "invalid",
-              "inheritedFrom": {
-                "name": "UmFieldBase",
-                "module": "src/field/field-base.ts"
-              }
-            },
-            {
-              "name": "has-leading-icon",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Whether the field has a leading icon or not\n\n_Note:_ Readonly",
-              "fieldName": "hasLeadingIcon",
-              "inheritedFrom": {
-                "name": "UmFieldBase",
-                "module": "src/field/field-base.ts"
-              }
-            },
-            {
-              "name": "has-trailing-icon",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Whether the field has a trailing icon or not\n\n_Note:_ Readonly",
-              "fieldName": "hasTrailingIcon",
-              "inheritedFrom": {
-                "name": "UmFieldBase",
-                "module": "src/field/field-base.ts"
-              }
-            },
-            {
-              "name": "has-error-text",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Whether the field has an error text or not\n\n_Note:_ Readonly",
-              "fieldName": "hasErrorText",
-              "inheritedFrom": {
-                "name": "UmFieldBase",
-                "module": "src/field/field-base.ts"
-              }
-            }
-          ],
-          "superclass": {
-            "name": "UmFieldBase",
-            "module": "/src/field/field-base.js"
-          },
-          "tagName": "u-field",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "UmField",
-          "declaration": {
-            "name": "UmField",
-            "module": "src/field/field.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "u-field",
-          "declaration": {
-            "name": "UmField",
-            "module": "src/field/field.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/list/list-item.styles.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "styles",
-          "default": "css `\n  :host {\n    position: relative;\n    display: flex;\n    align-items: center;\n    min-height: var(--u-list-item-min-height, 56px);\n    padding-block: var(--u-list-item-block-padding, 8px);\n    padding-inline: var(--u-list-item-inline-padding, 16px);\n    gap: var(--u-list-item-gap, 16px);\n  }\n\n  slot:not([name]) {\n    display: block;\n    margin-inline-end: auto;\n  }\n\n  slot {\n    flex-shrink: 0;\n  }\n\n  .content {\n    flex: 1;\n    min-width: 0;\n  }\n\n  .headline {\n    font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n    line-height: var(--u-list-item-headline-line-height, var(--u-body-l-line-height, 1.5rem));\n    font-size: var(--u-list-item-headline-font-size, var(--u-body-l-font-size, 1rem));\n    letter-spacing: var(--u-list-item-headline-letter-spacing, var(--u-body-l-letter-spacing, 0.03125rem));\n    font-weight: var(--u-list-item-headline-font-weight, var(--u-body-l-font-weight, var(--u-font-weight-regular, 400)));\n  }\n\n  .supporting-text {\n    font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n    line-height: var(--u-list-item-supporting-text-line-height, var(--u-body-m-line-height, 1.25rem));\n    font-size: var(--u-list-item-supporting-text-font-size, var(--u-body-m-font-size, 0.875rem));\n    letter-spacing: var(--u-list-item-supporting-text-letter-spacing, var(--u-body-m-letter-spacing, 0.0178571429rem));\n    font-weight: var(--u-list-item-supporting-text-font-weight, var(--u-body-m-font-weight, var(--u-font-weight-regular, 400)));\n    color: var(--u-list-item-supporting-text-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n  }\n`"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "styles",
-          "declaration": {
-            "name": "styles",
-            "module": "src/list/list-item.styles.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/list/list-item.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "UmListItem",
-          "members": [
+              },
+              "default": "false",
+              "description": "Get or sets where or not the field is in a visually invalid state.",
+              "fieldName": "invalid",
+              "inheritedFrom": {
+                "name": "UmFieldBase",
+                "module": "src/field/field-base.ts"
+              }
+            },
             {
-              "kind": "field",
-              "name": "selectable",
+              "name": "has-leading-icon",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "attribute": "selectable",
-              "reflects": true
-            }
-          ],
-          "attributes": [
+              "description": "Whether the field has a leading icon or not\n\n_Note:_ Readonly",
+              "fieldName": "hasLeadingIcon",
+              "inheritedFrom": {
+                "name": "UmFieldBase",
+                "module": "src/field/field-base.ts"
+              }
+            },
             {
-              "name": "selectable",
+              "name": "has-trailing-icon",
               "type": {
                 "text": "boolean"
               },
               "default": "false",
-              "fieldName": "selectable"
+              "description": "Whether the field has a trailing icon or not\n\n_Note:_ Readonly",
+              "fieldName": "hasTrailingIcon",
+              "inheritedFrom": {
+                "name": "UmFieldBase",
+                "module": "src/field/field-base.ts"
+              }
+            },
+            {
+              "name": "has-error-text",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Whether the field has an error text or not\n\n_Note:_ Readonly",
+              "fieldName": "hasErrorText",
+              "inheritedFrom": {
+                "name": "UmFieldBase",
+                "module": "src/field/field-base.ts"
+              }
             }
           ],
           "superclass": {
-            "name": "LitElement",
-            "package": "lit"
-          },
-          "tagName": "u-list-item",
-          "customElement": true
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "UmListItem",
-          "declaration": {
-            "name": "UmListItem",
-            "module": "src/list/list-item.ts"
-          }
-        },
-        {
-          "kind": "custom-element-definition",
-          "name": "u-list-item",
-          "declaration": {
-            "name": "UmListItem",
-            "module": "src/list/list-item.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/list/list.styles.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "styles",
-          "default": "css `\n  :host {\n    display: block;\n    padding-block: var(--u-list-padding, 8px);\n  }\n`"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "styles",
-          "declaration": {
-            "name": "styles",
-            "module": "src/list/list.styles.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/list/list.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "UmList",
-          "members": [],
-          "superclass": {
-            "name": "LitElement",
-            "package": "lit"
+            "name": "UmFieldBase",
+            "module": "/src/field/field-base.js"
           },
-          "tagName": "u-list",
+          "tagName": "u-field",
           "customElement": true
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "UmList",
+          "name": "UmField",
           "declaration": {
-            "name": "UmList",
-            "module": "src/list/list.ts"
+            "name": "UmField",
+            "module": "src/field/field.ts"
           }
         },
         {
           "kind": "custom-element-definition",
-          "name": "u-list",
+          "name": "u-field",
           "declaration": {
-            "name": "UmList",
-            "module": "src/list/list.ts"
+            "name": "UmField",
+            "module": "src/field/field.ts"
           }
         }
       ]
@@ -8288,6 +8153,141 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/list/list-item.styles.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "styles",
+          "default": "css `\n  :host {\n    position: relative;\n    display: flex;\n    align-items: center;\n    min-height: var(--u-list-item-min-height, 56px);\n    padding-block: var(--u-list-item-block-padding, 8px);\n    padding-inline: var(--u-list-item-inline-padding, 16px);\n    gap: var(--u-list-item-gap, 16px);\n  }\n\n  slot:not([name]) {\n    display: block;\n    margin-inline-end: auto;\n  }\n\n  slot {\n    flex-shrink: 0;\n  }\n\n  .content {\n    flex: 1;\n    min-width: 0;\n  }\n\n  .headline {\n    font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n    line-height: var(--u-list-item-headline-line-height, var(--u-body-l-line-height, 1.5rem));\n    font-size: var(--u-list-item-headline-font-size, var(--u-body-l-font-size, 1rem));\n    letter-spacing: var(--u-list-item-headline-letter-spacing, var(--u-body-l-letter-spacing, 0.03125rem));\n    font-weight: var(--u-list-item-headline-font-weight, var(--u-body-l-font-weight, var(--u-font-weight-regular, 400)));\n  }\n\n  .supporting-text {\n    font-family: var(--u-font-family, var(--u-font-family, system-ui, -apple-system, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"Noto Sans\", \"Liberation Sans\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"));\n    line-height: var(--u-list-item-supporting-text-line-height, var(--u-body-m-line-height, 1.25rem));\n    font-size: var(--u-list-item-supporting-text-font-size, var(--u-body-m-font-size, 0.875rem));\n    letter-spacing: var(--u-list-item-supporting-text-letter-spacing, var(--u-body-m-letter-spacing, 0.0178571429rem));\n    font-weight: var(--u-list-item-supporting-text-font-weight, var(--u-body-m-font-weight, var(--u-font-weight-regular, 400)));\n    color: var(--u-list-item-supporting-text-color, var(--u-color-on-surface-variant, rgb(73, 69, 79)));\n  }\n`"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "styles",
+          "declaration": {
+            "name": "styles",
+            "module": "src/list/list-item.styles.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/list/list-item.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "UmListItem",
+          "members": [
+            {
+              "kind": "field",
+              "name": "selectable",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "attribute": "selectable",
+              "reflects": true
+            }
+          ],
+          "attributes": [
+            {
+              "name": "selectable",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "fieldName": "selectable"
+            }
+          ],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "u-list-item",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "UmListItem",
+          "declaration": {
+            "name": "UmListItem",
+            "module": "src/list/list-item.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "u-list-item",
+          "declaration": {
+            "name": "UmListItem",
+            "module": "src/list/list-item.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/list/list.styles.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "styles",
+          "default": "css `\n  :host {\n    display: block;\n    padding-block: var(--u-list-padding, 8px);\n  }\n`"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "styles",
+          "declaration": {
+            "name": "styles",
+            "module": "src/list/list.styles.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/list/list.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "UmList",
+          "members": [],
+          "superclass": {
+            "name": "LitElement",
+            "package": "lit"
+          },
+          "tagName": "u-list",
+          "customElement": true
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "UmList",
+          "declaration": {
+            "name": "UmList",
+            "module": "src/list/list.ts"
+          }
+        },
+        {
+          "kind": "custom-element-definition",
+          "name": "u-list",
+          "declaration": {
+            "name": "UmList",
+            "module": "src/list/list.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/navigation/drawer-item.styles.ts",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@universal-material/web",
-  "version": "3.0.122",
+  "version": "3.0.123",
   "description": "Material web components",
   "type": "module",
   "keywords": [

package/shared/button-wrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"button-wrapper.d.ts","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAC/D,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AASpE,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAE7B,8BAAsB,eAAgB,SAAQ,UAAU;;IAEtD,OAAgB,MAAM,EAAE,cAAc,CAAwB;IAE9D;;OAEG;IACuC,QAAQ,UAAS;IAElD,YAAY,UAAQ;IAE7B;;OAEG;IACS,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAErC;;;OAGG;IACS,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAE3B,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAEnB,QAAQ,CAAC,aAAa,EAAG,WAAW,CAAC;IACpC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAY;IAEtD,SAAS,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE1C,IAAI,QAAQ,IAAI,MAAM,CAErB;cAEkB,MAAM,IAAI,kBAAkB;IAM/C,OAAO,CAAC,YAAY;IAiBpB,OAAO,CAAC,UAAU;IAiBlB,SAAS,CAAC,QAAQ,CAAC,aAAa,IAAI,kBAAkB;IAE7C,iBAAiB;IAMjB,oBAAoB;IAMpB,KAAK;IAIL,IAAI;IAKb,SAAS,CAAC,YAAY,IAAI,MAAM,GAAG,IAAI;IAIvC,OAAO,CAAC,iBAAiB;IA8BzB,SAAS,CAAC,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CAGxC"}
+{"version":3,"file":"button-wrapper.d.ts","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAC;AAC/D,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AASpE,OAAO,2BAA2B,CAAC;AACnC,OAAO,qBAAqB,CAAC;AAE7B,8BAAsB,eAAgB,SAAQ,UAAU;;IACtD,OAAgB,MAAM,EAAE,cAAc,CAAwB;IAE9D;;OAEG;IACyC,QAAQ,UAAS;IAEpD,YAAY,UAAQ;IAE7B;;OAEG;IACS,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAErC;;;OAGG;IACS,MAAM,EAAE,MAAM,GAAG,SAAS,CAAC;IAE3B,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAEnB,QAAQ,CAAC,aAAa,EAAG,WAAW,CAAC;IACpC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAY;IAEtD,SAAS,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,CAAQ;IAE1C,IAAI,QAAQ,IAAI,MAAM,CAErB;cAEkB,MAAM,IAAI,kBAAkB;IAI/C,OAAO,CAAC,YAAY;IAkBpB,OAAO,CAAC,UAAU;IAmBlB,SAAS,CAAC,QAAQ,CAAC,aAAa,IAAI,kBAAkB;IAE7C,iBAAiB;IAMjB,oBAAoB;IAMpB,KAAK;IAIL,IAAI;IAIb,SAAS,CAAC,YAAY,IAAI,MAAM,GAAG,IAAI;IAIvC,OAAO,CAAC,iBAAiB;IA6BzB,SAAS,CAAC,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI;CACxC"}

package/shared/button-wrapper.js

@@ -26,12 +26,11 @@ export class UmButtonWrapper extends LitElement {
         return this.buttonElement?.pathname;
     }
     render() {
-        return typeof this.href === 'string'
-            ? this.renderLink()
-            : this.renderButton();
+        return typeof this.href === 'string' ? this.renderLink() : this.renderButton();
     }
     renderButton() {
         return html `
+      <div class="content">${this.renderContent()}</div>
       <button
         id="button"
         class="button focus-ring"
@@ -44,23 +43,25 @@ export class UmButtonWrapper extends LitElement {
         <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>
         <u-elevation></u-elevation>
       </button>
-      <div class="content">${this.renderContent()}</div>`;
+    `;
     }
     renderLink() {
-        return html `<a
-      id="link"
-      class="button"
-      href=${this.disabled ? nothing : this.href}
-      aria-disabled=${this.disabled || nothing}
-      aria-label=${this.ariaLabel || nothing}
-      aria-labelledby="${this.ariaLabel ? nothing : 'text'}"
-      .role=${this.innerRole}
-      target=${this.target || nothing}
-      @click=${this.#innerClickHandler}>
-      <u-elevation></u-elevation>
-      <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>
-    </a>
-    <div class="content">${this.renderContent()}</div>`;
+        return html `
+      <div class="content">${this.renderContent()}</div>
+      <a
+        id="link"
+        class="button"
+        href=${this.disabled ? nothing : this.href}
+        aria-disabled=${this.disabled || nothing}
+        aria-label=${this.ariaLabel || nothing}
+        aria-labelledby="${this.ariaLabel ? nothing : 'text'}"
+        .role=${this.innerRole}
+        target=${this.target || nothing}
+        @click=${this.#innerClickHandler}>
+        <u-elevation></u-elevation>
+        <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>
+      </a>
+    `;
     }
     connectedCallback() {
         super.connectedCallback();
@@ -81,7 +82,7 @@ export class UmButtonWrapper extends LitElement {
     }
     innerFocusHandler() {
         const tabIndexAttributeValue = this.getAttribute('tabindex');
-        if (tabIndexAttributeValue !== "0") {
+        if (tabIndexAttributeValue !== '0') {
             return;
         }
         this.removeAttribute('tabindex');
@@ -100,8 +101,7 @@ export class UmButtonWrapper extends LitElement {
         }
         this.handleClick(event);
     }
-    handleClick(_) {
-    }
+    handleClick(_) { }
 }
 __decorate([
     property({ type: Boolean, reflect: true })

package/shared/button-wrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-wrapper.js","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"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","sourcesContent":["import { CSSResultGroup } from '@lit/reactive-element/css-tag';\nimport { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from './base.styles.js';\n\nimport { UmRipple } from '../ripple/ripple.js';\nimport { styles } from './button-wrapper.styles';\nimport { redispatchEvent } from './events/redispatch-event.js';\n\nimport '../elevation/elevation.js';\nimport '../ripple/ripple.js';\n\nexport abstract class UmButtonWrapper extends LitElement {\n\n  static override styles: CSSResultGroup = [baseStyles, styles];\n\n  /**\n   * Whether the button is disabled or not.\n   */\n  @property({type: Boolean, reflect: true}) disabled = false;\n\n  @state() renderRipple = true;\n\n  /**\n   * The URL that the link button points to.\n   */\n  @property() href: string | undefined;\n\n  /**\n   * Where to display the linked `href` URL for a link button. Common options\n   * include `_blank` to open in a new tab.\n   */\n  @property() target: string | undefined;\n\n  @property() name: string | undefined;\n\n  @query('.button') readonly buttonElement!: HTMLElement;\n  @query('u-ripple') private readonly ripple!: UmRipple;\n\n  protected innerRole: string | null = null;\n\n  get pathname(): string {\n    return (<HTMLAnchorElement>this.buttonElement)?.pathname\n  }\n\n  protected override render(): HTMLTemplateResult {\n    return typeof this.href === 'string'\n      ? this.renderLink()\n      : this.renderButton();\n  }\n\n  private renderButton() {\n    return html`\n      <button\n        id=\"button\"\n        class=\"button focus-ring\"\n        ?disabled=${this.disabled}\n        aria-label=${this.getAriaLabel() || nothing}\n        aria-labelledby=\"${this.getAriaLabel() ? nothing : 'text'}\"\n        .role=${this.innerRole}\n        type=\"button\"\n        @click=${this.#innerClickHandler}>\n        <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>\n        <u-elevation></u-elevation>\n      </button>\n      <div class=\"content\">${this.renderContent()}</div>`;\n  }\n\n  private renderLink() {\n    return html`<a\n      id=\"link\"\n      class=\"button\"\n      href=${this.disabled ? nothing : this.href}\n      aria-disabled=${this.disabled || nothing}\n      aria-label=${this.ariaLabel || nothing}\n      aria-labelledby=\"${this.ariaLabel ? nothing : 'text'}\"\n      .role=${this.innerRole}\n      target=${this.target || nothing}\n      @click=${this.#innerClickHandler}>\n      <u-elevation></u-elevation>\n      <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>\n    </a>\n    <div class=\"content\">${this.renderContent()}</div>`;\n  }\n\n  protected abstract renderContent(): HTMLTemplateResult;\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.addEventListener('focus', this.innerFocusHandler)\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.removeEventListener('focus', this.innerFocusHandler);\n  }\n\n  override focus() {\n    this.buttonElement?.focus();\n  }\n\n  override blur() {\n\n    this.buttonElement?.blur();\n  }\n\n  protected getAriaLabel(): string | null {\n    return this.ariaLabel;\n  }\n\n  private innerFocusHandler(): void {\n    const tabIndexAttributeValue = this.getAttribute('tabindex');\n\n    if (tabIndexAttributeValue !== \"0\") {\n      return;\n    }\n \n    this.removeAttribute('tabindex');\n    setTimeout(() => this.buttonElement?.focus());\n  }\n\n  #innerClickHandler(event: MouseEvent): void {\n    \n    if (this.disabled) {\n      return;\n    }\n\n    const preventDefault = !redispatchEvent(this, event);\n\n    if (preventDefault) {\n      return;\n    }\n\n    if (!(<PointerEvent>event).pointerType) {\n      this.ripple.createRipple();\n    }\n\n    this.handleClick(event);\n  }\n\n  protected handleClick(_: UIEvent): void {\n\n  }\n}\n"]}
+{"version":3,"file":"button-wrapper.js","sourceRoot":"","sources":["../../src/shared/button-wrapper.ts"],"names":[],"mappings":"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","sourcesContent":["import { CSSResultGroup } from '@lit/reactive-element/css-tag';\nimport { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\n\nimport { styles as baseStyles } from './base.styles.js';\n\nimport { UmRipple } from '../ripple/ripple.js';\nimport { styles } from './button-wrapper.styles';\nimport { redispatchEvent } from './events/redispatch-event.js';\n\nimport '../elevation/elevation.js';\nimport '../ripple/ripple.js';\n\nexport abstract class UmButtonWrapper extends LitElement {\n  static override styles: CSSResultGroup = [baseStyles, styles];\n\n  /**\n   * Whether the button is disabled or not.\n   */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  @state() renderRipple = true;\n\n  /**\n   * The URL that the link button points to.\n   */\n  @property() href: string | undefined;\n\n  /**\n   * Where to display the linked `href` URL for a link button. Common options\n   * include `_blank` to open in a new tab.\n   */\n  @property() target: string | undefined;\n\n  @property() name: string | undefined;\n\n  @query('.button') readonly buttonElement!: HTMLElement;\n  @query('u-ripple') private readonly ripple!: UmRipple;\n\n  protected innerRole: string | null = null;\n\n  get pathname(): string {\n    return (<HTMLAnchorElement>this.buttonElement)?.pathname;\n  }\n\n  protected override render(): HTMLTemplateResult {\n    return typeof this.href === 'string' ? this.renderLink() : this.renderButton();\n  }\n\n  private renderButton() {\n    return html`\n      <div class=\"content\">${this.renderContent()}</div>\n      <button\n        id=\"button\"\n        class=\"button focus-ring\"\n        ?disabled=${this.disabled}\n        aria-label=${this.getAriaLabel() || nothing}\n        aria-labelledby=\"${this.getAriaLabel() ? nothing : 'text'}\"\n        .role=${this.innerRole}\n        type=\"button\"\n        @click=${this.#innerClickHandler}>\n        <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>\n        <u-elevation></u-elevation>\n      </button>\n    `;\n  }\n\n  private renderLink() {\n    return html`\n      <div class=\"content\">${this.renderContent()}</div>\n      <a\n        id=\"link\"\n        class=\"button\"\n        href=${this.disabled ? nothing : this.href}\n        aria-disabled=${this.disabled || nothing}\n        aria-label=${this.ariaLabel || nothing}\n        aria-labelledby=\"${this.ariaLabel ? nothing : 'text'}\"\n        .role=${this.innerRole}\n        target=${this.target || nothing}\n        @click=${this.#innerClickHandler}>\n        <u-elevation></u-elevation>\n        <u-ripple ?disabled=${this.disabled || !this.renderRipple}></u-ripple>\n      </a>\n    `;\n  }\n\n  protected abstract renderContent(): HTMLTemplateResult;\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.addEventListener('focus', this.innerFocusHandler);\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n\n    this.removeEventListener('focus', this.innerFocusHandler);\n  }\n\n  override focus() {\n    this.buttonElement?.focus();\n  }\n\n  override blur() {\n    this.buttonElement?.blur();\n  }\n\n  protected getAriaLabel(): string | null {\n    return this.ariaLabel;\n  }\n\n  private innerFocusHandler(): void {\n    const tabIndexAttributeValue = this.getAttribute('tabindex');\n\n    if (tabIndexAttributeValue !== '0') {\n      return;\n    }\n\n    this.removeAttribute('tabindex');\n    setTimeout(() => this.buttonElement?.focus());\n  }\n\n  #innerClickHandler(event: MouseEvent): void {\n    if (this.disabled) {\n      return;\n    }\n\n    const preventDefault = !redispatchEvent(this, event);\n\n    if (preventDefault) {\n      return;\n    }\n\n    if (!(<PointerEvent>event).pointerType) {\n      this.ripple.createRipple();\n    }\n\n    this.handleClick(event);\n  }\n\n  protected handleClick(_: UIEvent): void {}\n}\n"]}

package/shared/selection-control/selection-control.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"selection-control.d.ts","sourceRoot":"","sources":["../../../src/shared/selection-control/selection-control.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AAGpE,OAAO,wBAAwB,CAAC;AAEhC,8BAAsB,kBAAmB,SAAQ,UAAU;;IACzD,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,OAAgB,iBAAiB,EAAE,cAAc,CAG/C;IAEF,SAAS,CAAC,QAAQ,CAAC,gBAAgB,EAAE,gBAAgB,CAAC;IAEzB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAM;IACf,QAAQ,UAAS;IAC7C,KAAK,EAAG,gBAAgB,CAAC;IAEzC,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAEQ,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY;IAKrC,SAAS,CAAC,SAAS,EAAE,UAAU,GAAG,OAAO,CAAc;IACvD,SAAS,CAAC,YAAY,UAAQ;IAE9B,SAAS,CAAC,QAAQ,CAAC,eAAe,IAAI,kBAAkB;IAExD;;OAEG;IACS,KAAK,SAAQ;IAEzB,IACI,OAAO,IAGU,OAAO,CAD3B;IACD,IAAI,OAAO,CAAC,OAAO,EAAE,OAAO,EAQ3B;IAEkD,OAAO,CAAC,iBAAiB,CAAS;IAErF,SAAS;IAKA,YAAY,CAAC,iBAAiB,EAAE,cAAc;IAM9C,iBAAiB;IAMjB,oBAAoB;cAKV,MAAM,IAAI,kBAAkB;CA4BhD"}
+{"version":3,"file":"selection-control.d.ts","sourceRoot":"","sources":["../../../src/shared/selection-control/selection-control.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAQ,kBAAkB,EAAE,UAAU,EAAW,MAAM,KAAK,CAAC;AAGpE,OAAO,wBAAwB,CAAC;AAEhC,8BAAsB,kBAAmB,SAAQ,UAAU;;IACzD,MAAM,CAAC,QAAQ,CAAC,cAAc,QAAQ;IAEtC,OAAgB,iBAAiB,EAAE,cAAc,CAG/C;IAEF,SAAS,CAAC,QAAQ,CAAC,gBAAgB,EAAE,gBAAgB,CAAC;IAEzB,IAAI,EAAE,MAAM,GAAG,SAAS,CAAM;IACf,QAAQ,UAAS;IAC7C,KAAK,EAAG,gBAAgB,CAAC;IAEzC,IAAI,IAAI,IAAI,eAAe,GAAG,IAAI,CAEjC;IAEQ,KAAK,CAAC,OAAO,CAAC,EAAE,YAAY;IAKrC,SAAS,CAAC,SAAS,EAAE,UAAU,GAAG,OAAO,CAAc;IACvD,SAAS,CAAC,YAAY,UAAQ;IAE9B,SAAS,CAAC,QAAQ,CAAC,eAAe,IAAI,kBAAkB;IAExD;;OAEG;IACS,KAAK,SAAQ;IAEzB,IACI,OAAO,IAGU,OAAO,CAD3B;IACD,IAAI,OAAO,CAAC,OAAO,EAAE,OAAO,EAQ3B;IAEkD,OAAO,CAAC,iBAAiB,CAAS;IAErF,SAAS;IAKA,YAAY,CAAC,iBAAiB,EAAE,cAAc;IAM9C,iBAAiB;IAMjB,oBAAoB;cAKV,MAAM,IAAI,kBAAkB;CA6BhD"}

package/shared/selection-control/selection-control.js

@@ -77,6 +77,7 @@ export class UmSelectionControl extends LitElement {
         if (e.defaultPrevented) {
             return;
         }
+        console.log(e);
         this.checked = this.inputType === 'radio' || !this.checked;
         this.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));
         this.dispatchEvent(new Event('change', { bubbles: true }));

package/shared/selection-control/selection-control.js.map

@@ -1 +1 @@
-{"version":3,"file":"selection-control.js","sourceRoot":"","sources":["../../../src/shared/selection-control/selection-control.ts"],"names":[],"mappings":"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","sourcesContent":["import { PropertyValues } from '@lit/reactive-element';\nimport { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\n\nimport '../../ripple/ripple.js';\n\nexport abstract class UmSelectionControl extends LitElement {\n  static readonly formAssociated = true;\n\n  static override shadowRootOptions: ShadowRootInit = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  protected readonly elementInternals: ElementInternals;\n\n  @property({ reflect: true }) name: string | undefined = '';\n  @property({ type: Boolean, reflect: true }) disabled = false;\n  @query('input') input!: HTMLInputElement;\n\n  get form(): HTMLFormElement | null {\n    return this.elementInternals.form;\n  }\n\n  override focus(options?: FocusOptions) {\n    this.input!.focus(options);\n  }\n\n  #checked = false;\n  protected inputType: 'checkbox' | 'radio' = 'checkbox';\n  protected renderRipple = true;\n\n  protected abstract renderIndicator(): HTMLTemplateResult;\n\n  /**\n   * The element value to use in form submission when checked.\n   */\n  @property() value = 'on';\n\n  @property({ type: Boolean })\n  get checked() {\n    return this.input ? this.input.checked : this.#checked;\n  }\n  set checked(checked: boolean) {\n    this.#checked = checked;\n\n    if (this.input) {\n      this.input.checked = checked;\n    }\n\n    this.elementInternals.setFormValue(checked ? this.value : null);\n  }\n\n  @property({ type: Boolean, attribute: 'checked' }) private _checkedAttribute = false;\n\n  protected constructor() {\n    super();\n    this.elementInternals = this.attachInternals();\n  }\n\n  override firstUpdated(changedProperties: PropertyValues) {\n    super.firstUpdated(changedProperties);\n\n    this.input.checked = this.#checked;\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.addEventListener('click', this.#handleClick);\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.#handleClick);\n  }\n\n  protected override render(): HTMLTemplateResult {\n    const ripple = html`\n      <u-ripple ?disabled=${this.disabled}></u-ripple>\n    `;\n\n    return html`\n      <div class=\"container\">\n        ${this.renderRipple ? ripple : nothing}\n        <input\n          id=\"input\"\n          type=${this.inputType}\n          class=\"focus-ring\"\n          .checked=${this._checkedAttribute}\n          .disabled=${this.disabled} />\n        <div class=\"indicator-container\">${this.renderIndicator()}</div>\n      </div>\n    `;\n  }\n\n  #handleClick(e: Event) {\n    if (e.defaultPrevented) {\n      return;\n    }\n\n    this.checked = this.inputType === 'radio' || !this.checked;\n    this.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));\n    this.dispatchEvent(new Event('change', { bubbles: true }));\n  }\n}\n"]}
+{"version":3,"file":"selection-control.js","sourceRoot":"","sources":["../../../src/shared/selection-control/selection-control.ts"],"names":[],"mappings":"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","sourcesContent":["import { PropertyValues } from '@lit/reactive-element';\nimport { html, HTMLTemplateResult, LitElement, nothing } from 'lit';\nimport { property, query } from 'lit/decorators.js';\n\nimport '../../ripple/ripple.js';\n\nexport abstract class UmSelectionControl extends LitElement {\n  static readonly formAssociated = true;\n\n  static override shadowRootOptions: ShadowRootInit = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  protected readonly elementInternals: ElementInternals;\n\n  @property({ reflect: true }) name: string | undefined = '';\n  @property({ type: Boolean, reflect: true }) disabled = false;\n  @query('input') input!: HTMLInputElement;\n\n  get form(): HTMLFormElement | null {\n    return this.elementInternals.form;\n  }\n\n  override focus(options?: FocusOptions) {\n    this.input!.focus(options);\n  }\n\n  #checked = false;\n  protected inputType: 'checkbox' | 'radio' = 'checkbox';\n  protected renderRipple = true;\n\n  protected abstract renderIndicator(): HTMLTemplateResult;\n\n  /**\n   * The element value to use in form submission when checked.\n   */\n  @property() value = 'on';\n\n  @property({ type: Boolean })\n  get checked() {\n    return this.input ? this.input.checked : this.#checked;\n  }\n  set checked(checked: boolean) {\n    this.#checked = checked;\n\n    if (this.input) {\n      this.input.checked = checked;\n    }\n\n    this.elementInternals.setFormValue(checked ? this.value : null);\n  }\n\n  @property({ type: Boolean, attribute: 'checked' }) private _checkedAttribute = false;\n\n  protected constructor() {\n    super();\n    this.elementInternals = this.attachInternals();\n  }\n\n  override firstUpdated(changedProperties: PropertyValues) {\n    super.firstUpdated(changedProperties);\n\n    this.input.checked = this.#checked;\n  }\n\n  override connectedCallback() {\n    super.connectedCallback();\n\n    this.addEventListener('click', this.#handleClick);\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('click', this.#handleClick);\n  }\n\n  protected override render(): HTMLTemplateResult {\n    const ripple = html`\n      <u-ripple ?disabled=${this.disabled}></u-ripple>\n    `;\n\n    return html`\n      <div class=\"container\">\n        ${this.renderRipple ? ripple : nothing}\n        <input\n          id=\"input\"\n          type=${this.inputType}\n          class=\"focus-ring\"\n          .checked=${this._checkedAttribute}\n          .disabled=${this.disabled} />\n        <div class=\"indicator-container\">${this.renderIndicator()}</div>\n      </div>\n    `;\n  }\n\n  #handleClick(e: Event) {\n    if (e.defaultPrevented) {\n      return;\n    }\n\n    console.log(e);\n    this.checked = this.inputType === 'radio' || !this.checked;\n    this.dispatchEvent(new InputEvent('input', { bubbles: true, composed: true }));\n    this.dispatchEvent(new Event('change', { bubbles: true }));\n  }\n}\n"]}