@m3e/badge 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

@@ -1176,25 +1176,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",
@@ -1492,6 +1473,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",
@@ -2028,6 +2020,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",
@@ -2077,16 +2074,6 @@
               },
               "description": "The label elements that the element is associated with.",
               "readonly": true
-            },
-            {
-              "kind": "method",
-              "name": "[_updateLabels]",
-              "privacy": "private",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              }
             }
           ],
           "parameters": [
@@ -2101,6 +2088,14 @@
         }
       ],
       "exports": [
+        {
+          "kind": "js",
+          "name": "updateLabels",
+          "declaration": {
+            "name": "updateLabels",
+            "module": "../core/src/shared/mixins/Labelled.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "isLabelledMixin",

package/dist/src/BadgeElement.d.ts

@@ -0,0 +1,74 @@
+import { CSSResultGroup, LitElement, PropertyValues } from "lit";
+import { BadgeSize } from "./BadgeSize";
+import { BadgePosition } from "./BadgePosition";
+declare const M3eBadgeElement_base: import("node_modules/@m3e/core/dist/src/shared/mixins/Constructor").Constructor<import("@m3e/core").HtmlForMixin> & typeof LitElement;
+/**
+ * A visual indicator used to label content.
+ *
+ * @description
+ * The `m3e-badge` component is a compact visual indicator used to label content. Designed
+ * according to Material Design 3 guidelines, it can display counts, presence, or semantic
+ * emphasis, and is attachable to icons, buttons, or other components. Badges support dynamic
+ * sizing, color, and shape, ensuring clarity and accessibility while maintaining a consistent,
+ * expressive appearance across surfaces.
+ *
+ * @example
+ * The following example illustrates attaching a `m3e-badge` to another element using the `for` attribute.
+ * ```html
+ * <m3e-button id="button">Button</m3e-button>
+ * <m3e-badge for="button">10</m3e-badge>
+ * ```
+ *
+ * @tag m3e-badge
+ *
+ * @slot - Renders the content of the badge.
+ *
+ * @attr size - The size of the badge.
+ *
+ * @cssprop --m3e-badge-shape - Corner radius of the badge.
+ * @cssprop --m3e-badge-color - Foreground color of badge content.
+ * @cssprop --m3e-badge-container-color - Background color of the badge.
+ * @cssprop --m3e-badge-small-size - Fixed dimensions for small badge. Used for minimal indicators (e.g. dot).
+ * @cssprop --m3e-badge-medium-size - Height and min-width for medium badge.
+ * @cssprop --m3e-badge-medium-font-size - Font size for medium badge label.
+ * @cssprop --m3e-badge-medium-font-weight - Font weight for medium badge label.
+ * @cssprop --m3e-badge-medium-line-height - Line height for medium badge label.
+ * @cssprop --m3e-badge-medium-tracking - Letter spacing for medium badge label.
+ * @cssprop --m3e-badge-large-size - Height and min-width for large badge.
+ * @cssprop --m3e-badge-large-font-size - Font size for large badge label.
+ * @cssprop --m3e-badge-large-font-weight - Font weight for large badge label.
+ * @cssprop --m3e-badge-large-line-height - Line height for large badge label.
+ * @cssprop --m3e-badge-large-tracking - Letter spacing for large badge label.
+ */
+export declare class M3eBadgeElement extends M3eBadgeElement_base {
+    #private;
+    /** The styles of the element. */
+    static styles: CSSResultGroup;
+    /**
+     * The size of the badge.
+     * @default "medium"
+     */
+    size: BadgeSize;
+    /**
+     * The position of the badge, when attached to another element.
+     * @default "above-after"
+     */
+    position: BadgePosition;
+    /** @inheritdoc */
+    detach(): void;
+    /** @inheritdoc */
+    connectedCallback(): void;
+    /** @inheritdoc */
+    disconnectedCallback(): void;
+    /** @inheritdoc */
+    protected update(changedProperties: PropertyValues<this>): void;
+    /** @inheritdoc */
+    protected render(): unknown;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "m3e-badge": M3eBadgeElement;
+    }
+}
+export {};
+//# sourceMappingURL=BadgeElement.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BadgeElement.d.ts","sourceRoot":"","sources":["../../src/BadgeElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAO,cAAc,EAAQ,UAAU,EAAE,cAAc,EAAE,MAAM,KAAK,CAAC;AAO5E,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;;AAEhD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,qBACa,eAAgB,SAAQ,oBAAmB;;IACtD,iCAAiC;IACjC,OAAgB,MAAM,EAAE,cAAc,CAqEpC;IAKF;;;OAGG;IAC0B,IAAI,EAAE,SAAS,CAAY;IAExD;;;OAGG;IAC0B,QAAQ,EAAE,aAAa,CAAiB;IAErE,kBAAkB;IACT,MAAM,IAAI,IAAI;IAKvB,kBAAkB;IACT,iBAAiB,IAAI,IAAI;IAKlC,kBAAkB;IACT,oBAAoB,IAAI,IAAI;IAKrC,kBAAkB;cACC,MAAM,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAQxE,kBAAkB;cACC,MAAM,IAAI,OAAO;CA0ErC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,WAAW,EAAE,eAAe,CAAC;KAC9B;CACF"}

package/dist/src/BadgePosition.d.ts

@@ -0,0 +1,3 @@
+/** Specifies the possible positions of a badge, when attached to another element. */
+export type BadgePosition = "above-after" | "above-before" | "below-before" | "below-after" | "before" | "after" | "above" | "below";
+//# sourceMappingURL=BadgePosition.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BadgePosition.d.ts","sourceRoot":"","sources":["../../src/BadgePosition.ts"],"names":[],"mappings":"AAAA,qFAAqF;AACrF,MAAM,MAAM,aAAa,GACrB,aAAa,GACb,cAAc,GACd,cAAc,GACd,aAAa,GACb,QAAQ,GACR,OAAO,GACP,OAAO,GACP,OAAO,CAAC"}

package/dist/src/BadgeSize.d.ts

@@ -0,0 +1,3 @@
+/** Specifies the possible size variants for a badge. */
+export type BadgeSize = "small" | "medium" | "large";
+//# sourceMappingURL=BadgeSize.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"BadgeSize.d.ts","sourceRoot":"","sources":["../../src/BadgeSize.ts"],"names":[],"mappings":"AAAA,wDAAwD;AACxD,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC"}

package/dist/src/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./BadgeElement";
+export * from "./BadgeSize";
+//# 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,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m3e/badge",
-  "version": "1.0.0-rc.2",
+  "version": "1.0.0-rc.4",
   "description": "Badge 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": {