@m3e/list 1.0.0-rc.2 → 1.0.0-rc.4

package/README.md

@@ -27,7 +27,7 @@ Alternately, you can explicitly reference the `html-custom-data.json` and `css-c
 }
 ```
 
-## 🚀 Browser Usage
+## 🚀 Native Module Support
 
 This package uses [JavaScript Modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules#module_specifiers). To use it directly in a browser without a bundler, use a module script similar to the following.
 

package/dist/custom-elements.json

@@ -1095,25 +1095,6 @@
           "kind": "mixin",
           "description": "Mixin that adds support for custom event attributes.",
           "name": "EventAttribute",
-          "members": [
-            {
-              "kind": "method",
-              "name": "dispatchEvent",
-              "return": {
-                "type": {
-                  "text": "boolean"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "event",
-                  "type": {
-                    "text": "Event"
-                  }
-                }
-              ]
-            }
-          ],
           "parameters": [
             {
               "name": "base",
@@ -1411,6 +1392,17 @@
           "description": "Mixin to augment an element with behavior used to submit a form.",
           "name": "FormSubmitter",
           "members": [
+            {
+              "kind": "field",
+              "name": "formAssociated",
+              "type": {
+                "text": "boolean"
+              },
+              "static": true,
+              "readonly": true,
+              "default": "true",
+              "description": "Indicates that this custom element participates in form submission, validation, and form state restoration."
+            },
             {
               "kind": "field",
               "name": "name",
@@ -1947,6 +1939,11 @@
       "kind": "javascript-module",
       "path": "../core/src/shared/mixins/Labelled.ts",
       "declarations": [
+        {
+          "kind": "variable",
+          "name": "updateLabels",
+          "description": "A symbol through which to update labels to reflect a control's current state."
+        },
         {
           "kind": "function",
           "name": "isLabelledMixin",
@@ -1996,16 +1993,6 @@
               },
               "description": "The label elements that the element is associated with.",
               "readonly": true
-            },
-            {
-              "kind": "method",
-              "name": "[_updateLabels]",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              }
             }
           ],
           "parameters": [
@@ -2020,6 +2007,14 @@
         }
       ],
       "exports": [
+        {
+          "kind": "js",
+          "name": "updateLabels",
+          "declaration": {
+            "name": "updateLabels",
+            "module": "../core/src/shared/mixins/Labelled.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "isLabelledMixin",

package/dist/src/ListElement.d.ts

@@ -0,0 +1,50 @@
+import { CSSResultGroup, LitElement } from "lit";
+declare const M3eListElement_base: import("node_modules/@m3e/core/dist/src/shared/mixins/Constructor").Constructor & typeof LitElement;
+/**
+ * A list of items.
+ *
+ * @description
+ * The `m3e-list` component provides a list container for organizing and displaying
+ * multiple list items. It supports flexible layout, custom padding, and divider insets
+ * via CSS custom properties.
+ *
+ * @example
+ * The following example illustrates a list with a single item using all supported slots.
+ *
+ * Note: This example uses the `@m3e/icon` package to present Material Design symbols, but any icon package can be
+ * substituted depending on your design system or preferences
+ *
+ * ```html
+ * <m3e-list>
+ *  <m3e-list-item>
+ *    <m3e-icon slot="leading-icon" name="person"></m3e-icon>
+ *    <span slot="overline">Overline</span>
+ *    Headline
+ *    <span slot="supporting-text">Supporting text</span>
+ *    <span slot="trailing-supporting-text">100+</span>
+ *    <m3e-icon slot="trailing-icon" name="arrow_right"></m3e-icon>
+ *  </m3e-list-item>
+ * </m3e-list>
+ * ```
+ *
+ * @tag m3e-list
+ *
+ * @slot - Renders the items of the list.
+ *
+ * @cssprop --m3e-list-block-padding - Vertical padding for the list container.
+ * @cssprop --m3e-list-divider-inset-start-size - Start inset for dividers within the list.
+ * @cssprop --m3e-list-divider-inset-end-size - End inset for dividers within the list.
+ */
+export declare class M3eListElement extends M3eListElement_base {
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /** @inheritdoc */
+    protected render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-list": M3eListElement;
+    }
+}
+export {};
+//# sourceMappingURL=ListElement.d.ts.map

package/dist/src/ListElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListElement.d.ts","sourceRoot":"","sources":["../../src/ListElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;;AAK5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,qBACa,cAAe,SAAQ,mBAAwB;IAC1D,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAQpC;IAEF,kBAAkB;cACC,MAAM,IAAI,OAAO;CAGrC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,cAAc,CAAC;KAC5B;CACF"}

package/dist/src/ListItemElement.d.ts

@@ -0,0 +1,74 @@
+import { CSSResultGroup, LitElement } from "lit";
+declare const M3eListItemElement_base: import("node_modules/@m3e/core/dist/src/shared/mixins/Constructor").Constructor & typeof LitElement;
+/**
+ * An item in a list.
+ *
+ * @description
+ * The `m3e-list-item` component represents a single item within a list. It supports rich
+ * content, leading/trailing icons, overline, supporting text, and trailing supporting text
+ * via named slots. The component is highly customizable through CSS custom properties and
+ * is designed for accessibility and flexible layout.
+ *
+ * @example
+ * The following example illustrates a list with a single item using all supported slots.
+ *
+ * Note: This example uses the `@m3e/icon` package to present Material Design symbols, but any icon package can be
+ * substituted depending on your design system or preferences
+ *
+ * ```html
+ * <m3e-list>
+ *  <m3e-list-item>
+ *    <m3e-icon slot="leading-icon" name="person"></m3e-icon>
+ *    <span slot="overline">Overline</span>
+ *    Headline
+ *    <span slot="supporting-text">Supporting text</span>
+ *    <span slot="trailing-supporting-text">100+</span>
+ *    <m3e-icon slot="trailing-icon" name="arrow_right"></m3e-icon>
+ *  </m3e-list-item>
+ * </m3e-list>
+ * ```
+ *
+ * @tag m3e-list-item
+ *
+ * @slot - Renders the content of the list item.
+ * @slot leading-icon - Renders the leading icon of the list item.
+ * @slot overline - Renders the overline of the list item.
+ * @slot supporting-text - Renders the supporting text of the list item.
+ * @slot trailing-supporting-text - Renders the trailing supporting text of the list item.
+ * @slot trailing-icon - Renders the trailing icon of the list item.
+ *
+ * @cssprop --m3e-list-item-spacing - Horizontal gap between elements.
+ * @cssprop --m3e-list-item-padding-inline - Horizontal padding for the list item.
+ * @cssprop --m3e-list-item-padding-block - Vertical padding for the list item.
+ * @cssprop --m3e-list-item-height - Minimum height of the list item.
+ * @cssprop --m3e-list-item-font-size - Font size for main content.
+ * @cssprop --m3e-list-item-font-weight - Font weight for main content.
+ * @cssprop --m3e-list-item-line-height - Line height for main content.
+ * @cssprop --m3e-list-item-tracking - Letter spacing for main content.
+ * @cssprop --m3e-list-item-overline-font-size - Font size for overline slot.
+ * @cssprop --m3e-list-item-overline-font-weight - Font weight for overline slot.
+ * @cssprop --m3e-list-item-overline-line-height - Line height for overline slot.
+ * @cssprop --m3e-list-item-overline-tracking - Letter spacing for overline slot.
+ * @cssprop --m3e-list-item-supporting-text-font-size - Font size for supporting text slot.
+ * @cssprop --m3e-list-item-supporting-text-font-weight - Font weight for supporting text slot.
+ * @cssprop --m3e-list-item-supporting-text-line-height - Line height for supporting text slot.
+ * @cssprop --m3e-list-item-supporting-text-tracking - Letter spacing for supporting text slot.
+ * @cssprop --m3e-list-item-trailing-supporting-text-font-size - Font size for trailing supporting text slot.
+ * @cssprop --m3e-list-item-trailing-supporting-text-font-weight - Font weight for trailing supporting text slot.
+ * @cssprop --m3e-list-item-trailing-supporting-text-line-height - Line height for trailing supporting text slot.
+ * @cssprop --m3e-list-item-trailing-supporting-text-tracking - Letter spacing for trailing supporting text slot.
+ * @cssprop --m3e-list-item-icon-size - Size for leading/trailing icons.
+ */
+export declare class M3eListItemElement extends M3eListItemElement_base {
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /** @inheritdoc */
+    protected render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-list-item": M3eListItemElement;
+    }
+}
+export {};
+//# sourceMappingURL=ListItemElement.d.ts.map

package/dist/src/ListItemElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListItemElement.d.ts","sourceRoot":"","sources":["../../src/ListItemElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,MAAM,KAAK,CAAC;;AAK5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA0DG;AACH,qBACa,kBAAmB,SAAQ,uBAA4B;IAClE,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAoEpC;IAEF,kBAAkB;cACC,MAAM,IAAI,OAAO;CAUrC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,eAAe,EAAE,kBAAkB,CAAC;KACrC;CACF"}

package/dist/src/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./ListElement";
+export * from "./ListItemElement";
+//# sourceMappingURL=index.d.ts.map

package/dist/src/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m3e/list",
-  "version": "1.0.0-rc.2",
+  "version": "1.0.0-rc.4",
   "description": "List for M3E",
   "author": "matraic <matraic@yahoo.com>",
   "license": "MIT",
@@ -27,7 +27,7 @@
     "clean": "rimraf dist"
   },
   "peerDependencies": {
-    "@m3e/core": "1.0.0-rc.2",
+    "@m3e/core": "1.0.0-rc.4",
     "lit": "^3.3.0"
   },
   "devDependencies": {