@synergy-design-system/components 2.73.0 → 2.74.0

package/dist/components/tooltip/tooltip.js

@@ -1,10 +1,10 @@
 import {
   tooltip_default
-} from "../../chunks/chunk.PXNNJTOT.js";
-import "../../chunks/chunk.WSRQ5GP4.js";
+} from "../../chunks/chunk.TNIGL6QM.js";
+import "../../chunks/chunk.R55JK3BP.js";
 import "../../chunks/chunk.E7LBPRDC.js";
 import "../../chunks/chunk.O644HRW3.js";
-import "../../chunks/chunk.ZCB6UEMT.js";
+import "../../chunks/chunk.56USGF2W.js";
 import "../../chunks/chunk.36EHOOOO.js";
 import "../../chunks/chunk.AZ3N5IOO.js";
 import "../../chunks/chunk.C2ENQBPM.js";
@@ -14,7 +14,7 @@ import "../../chunks/chunk.OAQRCZOO.js";
 import "../../chunks/chunk.X7XPEYAM.js";
 import "../../chunks/chunk.BVZQ6QSY.js";
 import "../../chunks/chunk.NLYVOJGK.js";
-import "../../chunks/chunk.FJREQCBR.js";
+import "../../chunks/chunk.EXWGH7UL.js";
 import "../../chunks/chunk.Z4XV3SMG.js";
 export {
   tooltip_default as default

package/dist/components/validate/utility.d.ts

@@ -1,3 +1,4 @@
+import SynergyElement from '../../internal/synergy-element.js';
 /**
  * Check if the provided event name is a blur event
  * @param eventName The event name to check
@@ -13,6 +14,12 @@ export declare const isChangeEvent: (eventName: string) => boolean;
  * @param eventName The event name to check
  */
 export declare const isInvalidEvent: (eventName: string) => boolean;
+/**
+ * Check if the provided element is a synergy element
+ * @param element The element to check for
+ * @returns True if the element is a synergy element, false otherwise
+ */
+export declare const isSynergyElement: (element?: HTMLElement) => element is SynergyElement;
 /**
  * Get a list of event names from the provided attribute string
  * @param events The events string
@@ -25,3 +32,9 @@ export declare const normalizeEventAttribute: (events?: string) => string[];
  * @param eventName The event name to get
  */
 export declare const getEventNameForElement: (element: HTMLElement, eventName: string) => string;
+/**
+ * Check the size that the alert should use based on the provided element
+ * @param element The html element to check for
+ * @returns The size that the alert should use
+ */
+export declare const alertSizeForInput: (element?: HTMLElement) => "small" | "medium" | "large" | undefined;

package/dist/components/validate/utility.js

@@ -1,17 +1,21 @@
 import {
+  alertSizeForInput,
   getEventNameForElement,
   isBlurEvent,
   isChangeEvent,
   isInvalidEvent,
+  isSynergyElement,
   normalizeEventAttribute
-} from "../../chunks/chunk.47OCXPC2.js";
-import "../../chunks/chunk.FJREQCBR.js";
+} from "../../chunks/chunk.LHPV5KQH.js";
+import "../../chunks/chunk.EXWGH7UL.js";
 import "../../chunks/chunk.Z4XV3SMG.js";
 export {
+  alertSizeForInput,
   getEventNameForElement,
   isBlurEvent,
   isChangeEvent,
   isInvalidEvent,
+  isSynergyElement,
   normalizeEventAttribute
 };
 //# sourceMappingURL=utility.js.map

package/dist/components/validate/validate.component.d.ts

@@ -1,5 +1,6 @@
 import type { CSSResultGroup, PropertyValues } from 'lit';
 import SynergyElement from '../../internal/synergy-element.js';
+import type SynInput from '../input/input.component.js';
 import SynAlert from '../alert/alert.component.js';
 /**
  * @summary Validate provides form field validation messages in a unified way.
@@ -25,11 +26,13 @@ export default class SynValidate extends SynergyElement {
     };
     controller: AbortController;
     observer: MutationObserver;
+    sizeObserver: MutationObserver;
     private slottedChildren;
     validationMessage: string;
     eagerFirstMount: boolean;
     isInternalTriggeredInvalid: boolean;
     isValid: boolean;
+    alertSize?: SynInput['size'];
     /**
      * The variant that should be used to show validation alerts.
      *
@@ -90,6 +93,7 @@ export default class SynValidate extends SynergyElement {
      * @returns The input element or undefined if not found
      */
     private getInput;
+    private setAlertSize;
     /**
      * Get the event names to listen for.
      * If the input is a synergy element, will use syn- prefixes.

package/dist/components/validate/validate.component.js

@@ -1,18 +1,18 @@
 import {
   SynValidate
-} from "../../chunks/chunk.CKZLY55F.js";
-import "../../chunks/chunk.47OCXPC2.js";
+} from "../../chunks/chunk.AD2MXM4K.js";
+import "../../chunks/chunk.LHPV5KQH.js";
 import "../../chunks/chunk.MVM3NN6Y.js";
-import "../../chunks/chunk.FCBPZVHF.js";
+import "../../chunks/chunk.ZM7CHOP2.js";
 import "../../chunks/chunk.WXVOTRW5.js";
-import "../../chunks/chunk.FNE4UZQR.js";
+import "../../chunks/chunk.63R7LKO6.js";
 import "../../chunks/chunk.DZ7YIR5N.js";
 import "../../chunks/chunk.E3Z62YYT.js";
 import "../../chunks/chunk.C2ENQBPM.js";
 import "../../chunks/chunk.G6ITZTTW.js";
 import "../../chunks/chunk.7JGKUB4A.js";
 import "../../chunks/chunk.WVVQK5TE.js";
-import "../../chunks/chunk.Q4YWD2X6.js";
+import "../../chunks/chunk.H73IAJJE.js";
 import "../../chunks/chunk.ZUQ225FP.js";
 import "../../chunks/chunk.YTEJW7IF.js";
 import "../../chunks/chunk.Y5IKF6ZC.js";
@@ -23,14 +23,14 @@ import "../../chunks/chunk.ZBW4ZSZ7.js";
 import "../../chunks/chunk.OAQRCZOO.js";
 import "../../chunks/chunk.X7XPEYAM.js";
 import "../../chunks/chunk.234ERFCE.js";
-import "../../chunks/chunk.E5UUNP6E.js";
-import "../../chunks/chunk.HC4N72MX.js";
-import "../../chunks/chunk.6QJYD7WX.js";
+import "../../chunks/chunk.HYFCK7MM.js";
+import "../../chunks/chunk.C4JMEKUF.js";
+import "../../chunks/chunk.YBZFYBWC.js";
 import "../../chunks/chunk.RB2JR2ND.js";
 import "../../chunks/chunk.BVZQ6QSY.js";
 import "../../chunks/chunk.NLYVOJGK.js";
-import "../../chunks/chunk.FJREQCBR.js";
-import "../../chunks/chunk.MX72UPWV.js";
+import "../../chunks/chunk.EXWGH7UL.js";
+import "../../chunks/chunk.4GYLPSAW.js";
 import "../../chunks/chunk.BXY667C7.js";
 import "../../chunks/chunk.Z4XV3SMG.js";
 export {

package/dist/components/validate/validate.js

@@ -1,19 +1,19 @@
 import {
   validate_default
-} from "../../chunks/chunk.S7B5DBIP.js";
-import "../../chunks/chunk.CKZLY55F.js";
-import "../../chunks/chunk.47OCXPC2.js";
+} from "../../chunks/chunk.WJDZWQFV.js";
+import "../../chunks/chunk.AD2MXM4K.js";
+import "../../chunks/chunk.LHPV5KQH.js";
 import "../../chunks/chunk.MVM3NN6Y.js";
-import "../../chunks/chunk.FCBPZVHF.js";
+import "../../chunks/chunk.ZM7CHOP2.js";
 import "../../chunks/chunk.WXVOTRW5.js";
-import "../../chunks/chunk.FNE4UZQR.js";
+import "../../chunks/chunk.63R7LKO6.js";
 import "../../chunks/chunk.DZ7YIR5N.js";
 import "../../chunks/chunk.E3Z62YYT.js";
 import "../../chunks/chunk.C2ENQBPM.js";
 import "../../chunks/chunk.G6ITZTTW.js";
 import "../../chunks/chunk.7JGKUB4A.js";
 import "../../chunks/chunk.WVVQK5TE.js";
-import "../../chunks/chunk.Q4YWD2X6.js";
+import "../../chunks/chunk.H73IAJJE.js";
 import "../../chunks/chunk.ZUQ225FP.js";
 import "../../chunks/chunk.YTEJW7IF.js";
 import "../../chunks/chunk.Y5IKF6ZC.js";
@@ -24,14 +24,14 @@ import "../../chunks/chunk.ZBW4ZSZ7.js";
 import "../../chunks/chunk.OAQRCZOO.js";
 import "../../chunks/chunk.X7XPEYAM.js";
 import "../../chunks/chunk.234ERFCE.js";
-import "../../chunks/chunk.E5UUNP6E.js";
-import "../../chunks/chunk.HC4N72MX.js";
-import "../../chunks/chunk.6QJYD7WX.js";
+import "../../chunks/chunk.HYFCK7MM.js";
+import "../../chunks/chunk.C4JMEKUF.js";
+import "../../chunks/chunk.YBZFYBWC.js";
 import "../../chunks/chunk.RB2JR2ND.js";
 import "../../chunks/chunk.BVZQ6QSY.js";
 import "../../chunks/chunk.NLYVOJGK.js";
-import "../../chunks/chunk.FJREQCBR.js";
-import "../../chunks/chunk.MX72UPWV.js";
+import "../../chunks/chunk.EXWGH7UL.js";
+import "../../chunks/chunk.4GYLPSAW.js";
 import "../../chunks/chunk.BXY667C7.js";
 import "../../chunks/chunk.Z4XV3SMG.js";
 export {

package/dist/custom-elements.json

@@ -144,6 +144,82 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "components/badge/badge.js",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "SynBadge",
+          "cssParts": [
+            {
+              "description": "The component's base wrapper.",
+              "name": "base"
+            }
+          ],
+          "slots": [
+            {
+              "description": "The badge's content.",
+              "name": ""
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "localize",
+              "privacy": "private",
+              "readonly": true,
+              "default": "new LocalizeController(this)"
+            },
+            {
+              "kind": "field",
+              "name": "variant",
+              "type": {
+                "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
+              },
+              "default": "'primary'",
+              "description": "The badge's theme variant.",
+              "attribute": "variant",
+              "reflects": true
+            }
+          ],
+          "attributes": [
+            {
+              "name": "variant",
+              "type": {
+                "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
+              },
+              "default": "'primary'",
+              "description": "The badge's theme variant.",
+              "fieldName": "variant"
+            }
+          ],
+          "superclass": {
+            "name": "SynergyElement",
+            "module": "/src/internal/synergy-element.js"
+          },
+          "summary": "Badges are used to draw attention and display statuses or counts.",
+          "tagNameWithoutPrefix": "badge",
+          "tagName": "syn-badge",
+          "customElement": true,
+          "jsDoc": "/**\n * @summary Badges are used to draw attention and display statuses or counts.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-badge--docs\n * @status stable\n * @since 2.0\n *\n * @slot - The badge's content.\n *\n * @csspart base - The component's base wrapper.\n */",
+          "documentation": "https://synergy-design-system.github.io/?path=/docs/components-syn-badge--docs",
+          "status": "stable",
+          "since": "2.0"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "default",
+          "declaration": {
+            "name": "SynBadge",
+            "module": "components/badge/badge.js"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "components/alert/alert.js",
@@ -302,6 +378,17 @@
               "description": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with\nthe alert before it closes (e.g. moves the mouse over it), the timer will restart. Defaults to `Infinity`, meaning\nthe alert will not close on its own.",
               "attribute": "duration"
             },
+            {
+              "kind": "field",
+              "name": "size",
+              "type": {
+                "text": "'small' | 'medium' | 'large'"
+              },
+              "default": "'medium'",
+              "description": "The alert's size.",
+              "attribute": "size",
+              "reflects": true
+            },
             {
               "kind": "field",
               "name": "countdown",
@@ -424,6 +511,15 @@
               "default": "Infinity",
               "description": "The length of time, in milliseconds, the alert will show before closing itself. If the user interacts with\nthe alert before it closes (e.g. moves the mouse over it), the timer will restart. Defaults to `Infinity`, meaning\nthe alert will not close on its own.",
               "fieldName": "duration"
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "'small' | 'medium' | 'large'"
+              },
+              "default": "'medium'",
+              "description": "The alert's size.",
+              "fieldName": "size"
             }
           ],
           "superclass": {
@@ -464,82 +560,6 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "components/badge/badge.js",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "SynBadge",
-          "cssParts": [
-            {
-              "description": "The component's base wrapper.",
-              "name": "base"
-            }
-          ],
-          "slots": [
-            {
-              "description": "The badge's content.",
-              "name": ""
-            }
-          ],
-          "members": [
-            {
-              "kind": "field",
-              "name": "localize",
-              "privacy": "private",
-              "readonly": true,
-              "default": "new LocalizeController(this)"
-            },
-            {
-              "kind": "field",
-              "name": "variant",
-              "type": {
-                "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
-              },
-              "default": "'primary'",
-              "description": "The badge's theme variant.",
-              "attribute": "variant",
-              "reflects": true
-            }
-          ],
-          "attributes": [
-            {
-              "name": "variant",
-              "type": {
-                "text": "'primary' | 'success' | 'neutral' | 'warning' | 'danger'"
-              },
-              "default": "'primary'",
-              "description": "The badge's theme variant.",
-              "fieldName": "variant"
-            }
-          ],
-          "superclass": {
-            "name": "SynergyElement",
-            "module": "/src/internal/synergy-element.js"
-          },
-          "summary": "Badges are used to draw attention and display statuses or counts.",
-          "tagNameWithoutPrefix": "badge",
-          "tagName": "syn-badge",
-          "customElement": true,
-          "jsDoc": "/**\n * @summary Badges are used to draw attention and display statuses or counts.\n * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-badge--docs\n * @status stable\n * @since 2.0\n *\n * @slot - The badge's content.\n *\n * @csspart base - The component's base wrapper.\n */",
-          "documentation": "https://synergy-design-system.github.io/?path=/docs/components-syn-badge--docs",
-          "status": "stable",
-          "since": "2.0"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "default",
-          "declaration": {
-            "name": "SynBadge",
-            "module": "components/badge/badge.js"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "components/breadcrumb/breadcrumb.js",
@@ -16053,6 +16073,13 @@
                 "text": "MutationObserver"
               }
             },
+            {
+              "kind": "field",
+              "name": "sizeObserver",
+              "type": {
+                "text": "MutationObserver"
+              }
+            },
             {
               "kind": "field",
               "name": "slottedChildren",
@@ -16093,6 +16120,13 @@
               },
               "default": "true"
             },
+            {
+              "kind": "field",
+              "name": "alertSize",
+              "type": {
+                "text": "SynInput['size'] | undefined"
+              }
+            },
             {
               "kind": "field",
               "name": "variant",
@@ -16174,6 +16208,11 @@
                 }
               }
             },
+            {
+              "kind": "method",
+              "name": "setAlertSize",
+              "privacy": "private"
+            },
             {
               "kind": "method",
               "name": "getUsedEventNames",
@@ -16333,7 +16372,7 @@
   "package": {
     "name": "@synergy-design-system/components",
     "description": "",
-    "version": "2.73.0",
+    "version": "2.74.0",
     "author": {
       "name": "SICK Global UX Foundation",
       "url": "https://www.sick.com"

package/dist/styles/index.css

@@ -1,5 +1,5 @@
 /**
- * @synergy-design-system/components version 2.73.0
+ * @synergy-design-system/components version 2.74.0
  * SICK Global UX Foundation
  * 
  * This file is created automatically in the build process!