@platformscode/core 0.0.31 → 0.0.32

package/dist/cjs/dga-notification-toast-usage.cjs.entry.js

@@ -9,7 +9,7 @@ const DgaNotificationToastUsage = class {
         this.open = false;
     }
     render() {
-        return (index.h("div", { key: 'f01b4e12be40add9703e56106c05aa080333c5e6' }, index.h("h1", { key: 'b4f8e10301b04d7a79b4a5be2e4cbdde3c4b37ae' }, "Notification Toast Example"), index.h("div", { key: '5d722e5cdcae04ba65d9d84e48014354ec90d85e', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: 'f64bab8222bf8a0da818db8cf0c0e2dd4ffb598a', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("div", { key: 'db56fe53ed2843edd97b199cddc4c60d7ed60cf0', style: { display: "flex", justifyContent: "center" } }, index.h("button", { key: 'f9c86c3153cc796df2a18ee2376b767f3bb58a91', onClick: () => this.open = true }, "open"), index.h("button", { key: 'd8da63a18a6e2af370d25861576e2ebb4e5ab6c1', onClick: () => this.open = false }, "close")), index.h("dga-notification-toast", { key: '1e2df39cbc68898f0141b25c912803b590ed78a9', type: this.type, open: this.open, leadText: "Notification/Alert message title", hasHelperText: true, helperText: "When a Notification/Alert needs a further detailed explanation, it goes here.", action: true, buttonsList: [
+        return (index.h("div", { key: '9ae51b2b4d4ceb7eb4df4ba7dad131f23978543d' }, index.h("h1", { key: '4a1e1b273d502b4bf73c79c27e13c75fbf813209' }, "Notification Toast Example"), index.h("div", { key: '22228ceddff128bd1defdcb3a525c5fa3f272bba', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: '467ede341a921ce8e0ca2fa4c163098bcca9d73f', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("div", { key: '5318990216e2a2db52c81dab5a330091a684f2c4', style: { display: "flex", justifyContent: "center" } }, index.h("button", { key: '37aca750d7fd8ba30e023031845ae9fcad58dc0b', onClick: () => this.open = true }, "open"), index.h("button", { key: '8e972d116488723109d7acddcbf0c798fd065a54', onClick: () => this.open = false }, "close")), index.h("dga-notification-toast", { key: 'dc2609f34d857cc4972cde82210df86440b6ac7b', type: this.type, open: this.open, leadText: "Notification/Alert message title", hasHelperText: true, helperText: "When a Notification/Alert needs a further detailed explanation, it goes here.", action: true, buttonsList: [
                 {
                     label: 'Button',
                     onClick: () => { },
@@ -20,7 +20,7 @@ const DgaNotificationToastUsage = class {
                     onClick: () => { },
                     title: 'Button',
                 },
-            ], closeButton: true, vPostion: 'top', hPostion: 'left', onClose: () => this.open = false }), index.h("dga-notification-toast", { key: '6333a507b783a75e301b0b5db2b346ec31d0b71e', type: this.type, open: this.open, leadText: "Notification/Alert message title", hasHelperText: true, helperText: "When a Notification/Alert needs a further detailed explanation, it goes here.", action: true, buttonsList: [
+            ], closeButton: true, vPostion: 'top', hPostion: 'left', onClose: () => this.open = false }), index.h("dga-notification-toast", { key: '9c7a333b227020f135d5f44fd25a589aaef1eb20', type: this.type, open: this.open, leadText: "Notification/Alert message title", hasHelperText: true, helperText: "When a Notification/Alert needs a further detailed explanation, it goes here.", action: true, buttonsList: [
                 {
                     label: 'Button',
                     onClick: () => { },
@@ -31,7 +31,7 @@ const DgaNotificationToastUsage = class {
                     onClick: () => { },
                     title: 'Button',
                 },
-            ], closeButton: true, vPostion: 'bottom', hPostion: 'left', onClose: () => this.open = false })), index.h("div", { key: '31b3b14d12d5d1c8583fdeb4cd13ba4c4ecf0b98', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+            ], closeButton: true, vPostion: 'bottom', hPostion: 'left', onClose: () => this.open = false })), index.h("div", { key: '677fd59739cd18213440eb2fcb5ba012ed4bd457', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
 };
 

package/dist/cjs/dga-notification-toast.cjs.entry.js

@@ -43,8 +43,8 @@ const DgaNotificationToast = class {
         };
     }
     render() {
-        return (index.h("div", { key: '1a4f1b6476867746d88781e4c26f7241ce98f36f', class: `notification-toast notification-toast--${this.type} dga-vpostion-${this.vPostion} dga-hpostion-${this.hPostion} ${this.open ? 'active' : ''}` }, index.h("div", { key: '75f4f5eeea72164de86093911e9d3819b6476d7b', class: `notification-toast__header ${this.hasHelperText ? '' : 'dga-flex-center-y'}` }, index.h("dga-featured-icon", { key: '6952bfe52540347d0e469afb89af94521cf7f69c', icon: Object.assign(Object.assign({}, this.icons[this.type]), { size: 20 }), color: this.type, size: "lg" }), index.h("div", { key: '3ab5ed31f539b2b9c231be95a01e8fdfec918d3d', class: "notification-toast__body" }, index.h("h4", { key: 'f8a981a242880ec536b8607fa278cd02c4b93cad', class: "notification-toast__title text-md-semibold" }, this.leadText), this.hasHelperText && this.helperText && index.h("p", { key: '41f671d6be0fdada364973cb27fcd787c1336dea', class: "notification-toast__content text-sm-regular" }, this.helperText)), this.closeButton && (index.h("div", { key: '4d4c84358973b0a8306a687fd727facc53aa5b88', class: "notification-toast__close-btn" }, index.h("button", { key: '417f431696013950501f6c53d5e77e6abe434774', class: "dga-btn dga-btn--close dga-btn--icon dga-btn--md", onClick: e => { var _a; return (_a = this.onClose) === null || _a === void 0 ? void 0 : _a.call(this, e); } }, index.h("span", { key: '2e3e4f92064f845f5107749ba8a2bba709242e85', class: "dga-btn-icon" }, index.h("dga-icon-v2", { key: 'eefa5fa3e61893b766b56af4c46cdf02dac027cc', name: "multiplication-sign", variant: "stroke", type: "sharp", size: 20 })))))), this.action && (index.h(index.Fragment, { key: '5111fab134811c314baaef9b7193ed4ea3c8bdaf' }, index.h("div", { key: 'd91375cba3e91324d6a2da36e383fc7927504f4e', class: "notification-toast__action" }, this.buttonsList.length > 0 &&
-            this.buttonsList.map(({ id, onClick, extraClasses, title, label }) => (index.h("button", Object.assign({ key: id ? id : index$1.guid(), id: id ? id : index$1.guid(), onClick: e => onClick(e), class: `dga-btn dga-btn--subtle dga-btn--md ${extraClasses}` }, (title && { title: title })), label)))), index.h("div", { key: '0d4d4c5932f290df2997abaa753d13fac389e315', class: "notification-toast__action-mobile" }, this.buttonsList.length > 0 &&
+        return (index.h("div", { key: '3b838ec4a9c4e9db92f6771795333e11218c645a', class: `notification-toast notification-toast--${this.type} dga-vpostion-${this.vPostion} dga-hpostion-${this.hPostion} ${this.open ? 'active' : ''}` }, index.h("div", { key: 'c7e22f02450538250bca75ee7b79ed326d1079aa', class: `notification-toast__header ${this.hasHelperText ? '' : 'dga-flex-center-y'}` }, index.h("dga-featured-icon", { key: '87078311718ceee7fcba0d4acfde988b757a45d8', icon: Object.assign(Object.assign({}, this.icons[this.type]), { size: 20 }), color: this.type, size: "lg" }), index.h("div", { key: '9be8f0fdba9b593221f4a41fed7298f62d232d54', class: "notification-toast__body" }, index.h("h4", { key: '43bbabdc3eb4c22ca6998b1d9a342ece4a846c60', class: "notification-toast__title text-md-semibold" }, this.leadText), this.hasHelperText && this.helperText && index.h("p", { key: 'ecd684c5731d4a27392ffe98c7b37fcd870cf385', class: "notification-toast__content text-sm-regular" }, this.helperText)), this.closeButton && (index.h("div", { key: '54cf33585674b09909595c60ff2f8b8e655ce575', class: "notification-toast__close-btn" }, index.h("button", { key: '557224282f1df150b371abfaeb40f39f4c7921f0', class: "dga-btn dga-btn--close dga-btn--icon dga-btn--md", onClick: e => { var _a; return (_a = this.onClose) === null || _a === void 0 ? void 0 : _a.call(this, e); } }, index.h("span", { key: 'abf8c5b259f833236fcdd5057a8c2a1845338f1c', class: "dga-btn-icon" }, index.h("dga-icon-v2", { key: '9c023c12fef82ea2222595ff0c15d9b801461d85', name: "multiplication-sign", variant: "stroke", type: "sharp", size: 20 })))))), this.action && (index.h(index.Fragment, { key: '5126ca46db0f023696e03d84285a08ffe10c6873' }, index.h("div", { key: '52472e32b8c853ec2f8bfbf05e1dcf48fbc5ea1f', class: "notification-toast__action" }, this.buttonsList.length > 0 &&
+            this.buttonsList.map(({ id, onClick, extraClasses, title, label }) => (index.h("button", Object.assign({ key: id ? id : index$1.guid(), id: id ? id : index$1.guid(), onClick: e => onClick(e), class: `dga-btn dga-btn--subtle dga-btn--md ${extraClasses}` }, (title && { title: title })), label)))), index.h("div", { key: '5a8a9cf8696f95c9ee3ed0e14c03c925cad8f3c1', class: "notification-toast__action-mobile" }, this.buttonsList.length > 0 &&
             this.buttonsList.map(({ id, onClick, extraClasses, title, label }) => (index.h("button", Object.assign({ key: id ? id : index$1.guid(), id: id ? id : index$1.guid(), onClick: e => onClick(e), class: `dga-btn dga-btn--secondary dga-btn--lg ${extraClasses}` }, (title && { title: title })), label))))))));
     }
 };

package/dist/cjs/dga-notification-usage.cjs.entry.js

@@ -8,7 +8,7 @@ const DgaNotificationUsage = class {
         this.variant = 'neutral';
     }
     render() {
-        return (index.h("div", { key: '6fb16de5cf3c0919cf25b360389c764085ee7dfe' }, index.h("h1", { key: '4fa8073247ecaac5b8b68b9423e6de59903ee1cc' }, "Notification Example"), index.h("div", { key: '48453184d413386c4ef15022b5d1d24ad5de30a8', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: '5d78c50c536e9f8f40992dff2a86653fc6ad8f5d', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("dga-notification", { key: '7da9c699e47178734393647a55c3263d2f22de05', leadText: "This is a very important banner message that requires attention", variant: this.variant, dismissable: true }), index.h("dga-notification", { key: '4fe04836c2b8e4848370e39ee9ab37a1f21b40e9', leadText: "This is a very important banner message that requires attention", variant: "critical", dismissable: true }), index.h("dga-notification", { key: '01b09061a31904c09049ae8cd7d499ae9b391583', leadText: "This is a very important banner message that requires attention", variant: "info", dismissable: true }), index.h("dga-notification", { key: 'ee82eca14d7c19bf7ff382d8cc8e41f22f8787bc', leadText: "This is a very important banner message that requires attention", variant: "success", dismissable: true }), index.h("dga-notification", { key: '9af496e959d30e4cccb47847a8415f0cb653141d', leadText: "This is a very important banner message that requires attention", variant: "warning", dismissable: true })), index.h("div", { key: 'c6e2e2d2b73f574755524fa8aab06dd1191b8bd1', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+        return (index.h("div", { key: '4891cf0b6639a986a06c18d21ff9273abba6fd0b' }, index.h("h1", { key: '3216fe429d181a853964803c46d0d29020146c0b' }, "Notification Example"), index.h("div", { key: 'c7d199b3767239ed8da945e31d281a04a6637065', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: 'd979851d545984f8d3c4219a9c7c49d259a1bf4f', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("dga-notification", { key: '2e6c0e77e9dafff01d17ff33236ecef240f489d4', leadText: "This is a very important banner message that requires attention", variant: this.variant, dismissable: true }), index.h("dga-notification", { key: '6159d7a052b2f95d43934ff671f129dcdba19933', leadText: "This is a very important banner message that requires attention", variant: "critical", dismissable: true }), index.h("dga-notification", { key: 'c22b7d44b57b0aadeb292c43844dbc40ae7ab23a', leadText: "This is a very important banner message that requires attention", variant: "info", dismissable: true }), index.h("dga-notification", { key: '32e9536891259a9853c1c3177f2379d7750f8049', leadText: "This is a very important banner message that requires attention", variant: "success", dismissable: true }), index.h("dga-notification", { key: 'fc0bd6027e90f4c463e0bec4ad062e2182d01a87', leadText: "This is a very important banner message that requires attention", variant: "warning", dismissable: true })), index.h("div", { key: '5964f202a8cd477298ba90be2ec86ae9ac59a8dc', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
 };
 

package/dist/cjs/dga-notification.cjs.entry.js

@@ -71,11 +71,11 @@ const DgaNotification = class {
         (_a = this.sxStyleManager) === null || _a === void 0 ? void 0 : _a.cleanup();
     }
     render() {
-        return (index.h(index.Host, { key: '2c3b1752091f30f334fc3e3418961f01598c4613', id: this.componentId, style: this.rootStyles }, index.h("div", { key: 'eddcf9ee0fc07c8fc7c7b32ba32045001e9d138c', class: `notification notification--${this.variant}`, role: "alert" }, index.h("div", { key: '7726501fe6832c4124c995c42e3e80c595095e58', class: "notification__content" }, this.icon && index.h("div", { key: '6c309ac12539be755c3dafd6770bd108de146288', class: "notification__icon" }, index.h("dga-icon-v2", { key: '50a5232c665386fcefe50cdeff7b8eec4c567446', name: this.icons[this.variant].name, variant: this.icons[this.variant].variant, type: this.icons[this.variant].type, size: 24 })), this.leadText && index.h("strong", { key: '022e92ada1f26ebde1846fdecde570d4bf381629', class: "notification__lead-text" }, this.leadText, ": "), index.h("p", { key: '2e9f585f4d43faee6a52e3fe2211c54e0ae84ffa' }, this.content), this.link && (index.h("a", { key: 'e5d6b05478e4de18189ef5179e98c0da882902f5', onClick: () => {
+        return (index.h(index.Host, { key: 'c5df38cd0e0b487cfdec2aa723798f484ad0bf9b', id: this.componentId, style: this.rootStyles }, index.h("div", { key: '98ee5aff4ba045741a385779affef9891e2f3b26', class: `notification notification--${this.variant}`, role: "alert" }, index.h("div", { key: '7595599a852baf4a09cdc3b5ea54a0bdd44811ed', class: "notification__content" }, this.icon && index.h("div", { key: 'ea54d17491402a3261e934b50f9ee32b1a9f9771', class: "notification__icon" }, index.h("dga-icon-v2", { key: '72db0526e963cbbc01bda00cafbe05bcfb94490f', name: this.icons[this.variant].name, variant: this.icons[this.variant].variant, type: this.icons[this.variant].type, size: 24 })), this.leadText && index.h("strong", { key: 'b459cacf8b34b2a45d200a5bb9156a7570043712', class: "notification__lead-text" }, this.leadText, ": "), index.h("p", { key: '8e3c51cc430a0d2f2825d0f876a2c0b019ca117d' }, this.content), this.link && (index.h("a", { key: 'db7154c0138d2366641e04b5f44f0e9ed58a07e8', onClick: () => {
                 this.navigateTo && this.navigateTo(this.setNavigateTo);
-            }, class: "notification__link link link--md link--neutral link--inline" }, index.h("span", { key: 'ffd075f0a3f9e25b0b268538437f8ac7c5d63ce0', class: "link__label" }, this.textLink)))), this.dismissable && (index.h("div", { key: 'af29afd7d1bb209a94d31d23ca1bebe562fa44b0', class: "notification__dismiss" }, index.h("button", { key: '610803be38c0e0f0ff96886cf6eae92c7e4ea70a', class: "dga-btn dga-btn--close dga-btn--icon dga-btn--md", onClick: () => {
+            }, class: "notification__link link link--md link--neutral link--inline" }, index.h("span", { key: '4bbb707a159de830d633b4efef9d9a0de00c0343', class: "link__label" }, this.textLink)))), this.dismissable && (index.h("div", { key: 'f4f75e78077492b852f5ca5878488028dcfd4e92', class: "notification__dismiss" }, index.h("button", { key: 'e0fbf6afe05ec25f69285bbc0ff46dfb042494d2', class: "dga-btn dga-btn--close dga-btn--icon dga-btn--md", onClick: () => {
                 this.dismmissed && this.dismmissed();
-            } }, index.h("span", { key: '386acaaa7397e7dfa82601709c4b7d856ab467fa', class: "dga-btn-icon" }, index.h("dga-icon-v2", { key: '603a3cb477f402bd65d29890f51b63270bd0ad53', name: "multiplication-sign", variant: 'stroke', size: 20 }))))))));
+            } }, index.h("span", { key: '5c61c1763a0ec3d9b31910b5700a12245ae6e694', class: "dga-btn-icon" }, index.h("dga-icon-v2", { key: 'f07266a23ab886b1676839e73e44c1d7949c1ad8', name: "multiplication-sign", variant: 'stroke', size: 20 }))))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/dga-number-input-usage.cjs.entry.js

@@ -8,13 +8,13 @@ const DgaNumberInputUsage = class {
         this.value = '';
     }
     render() {
-        return (index.h("div", { key: 'bbda4140f9fc9daa0c01458923870a2888b1ddd4' }, index.h("h1", { key: '5608cec94ee62246d90a77de0afae844d261f14f' }, "Number Input Example"), index.h("div", { key: '14df0aebb82838685238d5d0de42b8735c4b615f', style: { padding: '50px' } }, index.h("div", { key: '846c0608c431534ce69334b2b4bd7a78050f2923', style: { display: 'flex', flexDirection: 'column', gap: '16px' } }, index.h("dga-number-input", { key: '6875e24c800986534a37e9ffdaff2427f9edb7c4', size: "lg", variant: "default", label: "Label", value: 0, required: true, helperText: "test" }), index.h("dga-number-input", { key: '50d57fb2f8d6eeb7f9d8ba6f6d1e35d56f23b264', size: "lg", variant: "darker", label: "Label", value: 0, required: true,
+        return (index.h("div", { key: '3984910797d8fa0d70fd9d8d6707e61fbd5f0d7b' }, index.h("h1", { key: '61f0b2c3cd6e789528d7c8f4b75751d83e67fd70' }, "Number Input Example"), index.h("div", { key: 'b23d80a0c44b3fde7a8a6a5bc60a396f9e5314f7', style: { padding: '50px' } }, index.h("div", { key: '4aeebdfc54599c5767f597fecf6deb05a1e538df', style: { display: 'flex', flexDirection: 'column', gap: '16px' } }, index.h("dga-number-input", { key: '90cc423d6b4c6c09cf310f6cf6ac185df77f7853', size: "lg", variant: "default", label: "Label", value: 0, required: true, helperText: "test" }), index.h("dga-number-input", { key: '11fd46fb231f7dceb556889a8ffa85fe301e0bdc', size: "lg", variant: "darker", label: "Label", value: 0, required: true,
             // feedbackIcon
-            helperText: "test" }), index.h("dga-number-input", { key: 'd028a8bfdb29a65f34df4e430ca5774435377e3c', size: "lg", variant: "lighter", label: "Label", value: 0, required: true,
+            helperText: "test" }), index.h("dga-number-input", { key: '5eb69b19e277a0b18db1b2427bafd23491586b35', size: "lg", variant: "lighter", label: "Label", value: 0, required: true,
             // feedbackIcon
-            helperText: "test" }), index.h("dga-number-input", { key: 'ec9fb59b8f08dd4fcfc82be2a9cb3ccb76e196c3', size: "lg", variant: "darker", label: "Label", value: 0, required: true,
+            helperText: "test" }), index.h("dga-number-input", { key: '275bb1ddc83dccfdcde60a31bf6197cba6d920b0', size: "lg", variant: "darker", label: "Label", value: 0, required: true,
             // feedbackIcon
-            helperText: "test" }), index.h("dga-label", { key: 'bd4975ed975b9ec52455f4367d3d6d1f8b62e023', label: "Mandatory Text Input" }), index.h("dga-label", { key: '2e495f933999bdc1b012586ab5e1536f60ccecd7', label: "Mandatory Text Input", required: true })))));
+            helperText: "test" }), index.h("dga-label", { key: 'f1ba3f2d9c718cec3b73e659d0b6af6139872fe3', label: "Mandatory Text Input" }), index.h("dga-label", { key: '1235e27d2f470c498596ba85761981eae8d5cbbd', label: "Mandatory Text Input", required: true })))));
     }
 };
 

package/dist/cjs/dga-number-input.cjs.entry.js

@@ -71,12 +71,12 @@ const DgaNumberInput = class {
         (_a = this.sxStyleManager) === null || _a === void 0 ? void 0 : _a.cleanup();
     }
     render() {
-        return (index.h(index.Host, { key: 'f5bdaa59b58f1f829d798b558dbac602fe5117f9', id: this.componentId, style: this.rootStyles }, index.h("div", { key: '7db80d23339daf4beab8f0c2eba0d9d86cd36c53', class: "dga-form-control" }, this.label && index.h("dga-label", { key: '057607b6fe032d3b4306ac9d46d9f61307527485', label: this.label, size: this.size, required: this.required, disabled: this.disabled }), index.h("div", { key: 'eaffaedc94003b3c34c7f5891eebfc395f453dad', class: `dga-number-input dga-number-input--${this.size} ${this.error ? 'dga-number-input--error' : ''} ${this.fullwidth ? 'dga-number-input--full-width' : ''} ${this.variant !== 'default' ? `dga-number-input--${this.variant}` : ''} ${this.isActive ? 'active' : ''} ${this.isFocused ? 'focus' : ''} ${this.disabled ? 'dga-number-input--disabled' : ''} ${this.readonly ? 'readOnly' : ''}`, ref: el => (this.inputContainerRef = el) }, index.h("button", { key: '6f4cc28f61fa2e3672565abc388e6edd6e941097', class: `dga-number-input__prefix`, onClick: this.handleIncrement, disabled: this.disabled || this.readonly }, index.h("span", { key: 'fd9bd43c62d8e64ec09ad6a78160971aab163f77', class: "dga-number-input__prefix-icon" }, index.h("dga-icon", { key: 'a052b44a7ebbf78b664e0363e01e4281774094bf', icon: "plus-sign", variant: "stroke", type: "rounded" }))), index.h("input", { key: '0078eed2af7970e2bc7e44fb54eaa4bbbced7629',
+        return (index.h(index.Host, { key: 'ac7042b0cf9ca6518cef4f5582265592ca1bd7a7', id: this.componentId, style: this.rootStyles }, index.h("div", { key: '8eff24790cd968e7ba765df15eb474e8d7eb296e', class: "dga-form-control" }, this.label && index.h("dga-label", { key: '8bf8722f3c7044b74e0477430fb945c352b9cc79', label: this.label, size: this.size, required: this.required, disabled: this.disabled }), index.h("div", { key: 'a6d9377ad54a50b0372509c36a8bf802801c3b09', class: `dga-number-input dga-number-input--${this.size} ${this.error ? 'dga-number-input--error' : ''} ${this.fullwidth ? 'dga-number-input--full-width' : ''} ${this.variant !== 'default' ? `dga-number-input--${this.variant}` : ''} ${this.isActive ? 'active' : ''} ${this.isFocused ? 'focus' : ''} ${this.disabled ? 'dga-number-input--disabled' : ''} ${this.readonly ? 'readOnly' : ''}`, ref: el => (this.inputContainerRef = el) }, index.h("button", { key: 'c6aed914bf4eb8286189a67e96940a7166488e52', class: `dga-number-input__prefix`, onClick: this.handleIncrement, disabled: this.disabled || this.readonly }, index.h("span", { key: '220c351643aa74be341fd26942950b608fc84918', class: "dga-number-input__prefix-icon" }, index.h("dga-icon", { key: '08ccd1277a3b1ce5e521ee4b9e455ca71dded482', icon: "plus-sign", variant: "stroke", type: "rounded" }))), index.h("input", { key: '183c99edb238dff2f9824b056123e52c028f111d',
             // id={id}
             value: this.value, name: this.name, type: 'number', onFocus: () => (this.isFocused = true), onBlur: e => {
                 this.isFocused = false;
                 this.onBlur(e);
-            }, class: "dga-number-input__field", placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, onMouseDown: () => (this.isActive = true), onMouseUp: () => (this.isActive = false), onMouseOut: () => (this.isActive = false), onChange: this.onChange, onInput: this.onInput }), index.h("button", { key: 'c0cf4b1775ebc48d632eb804c3f57cdab65ceb1d', class: `dga-number-input__suffix`, onClick: this.handleDecrement, disabled: this.disabled || this.readonly }, index.h("span", { key: 'e7749fefebc37305323b8f3a4104c0965be7b50a', class: "dga-number-input__suffix-icon" }, index.h("dga-icon", { key: 'a0339f89ccf78e20baf67baa4b6b9a5f9f785004', icon: "minus-sign", variant: "stroke", type: "rounded" })))), this.helperText && index.h("dga-helper-text", { key: 'cdfda5eb65940b57dd74627e1d7f8b803686ef9f', helperText: this.helperText, helperTextIcon: this.helperTextIcon, error: this.error }))));
+            }, class: "dga-number-input__field", placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, onMouseDown: () => (this.isActive = true), onMouseUp: () => (this.isActive = false), onMouseOut: () => (this.isActive = false), onChange: this.onChange, onInput: this.onInput }), index.h("button", { key: 'edd8d39e93cdbc53ef1b89ebbf66827a6edb3a55', class: `dga-number-input__suffix`, onClick: this.handleDecrement, disabled: this.disabled || this.readonly }, index.h("span", { key: '691b6f8785fbaa252c8bc89400f89e6af28e6637', class: "dga-number-input__suffix-icon" }, index.h("dga-icon", { key: '75348ec384698035996434d34e9fd04e1fdb72ca', icon: "minus-sign", variant: "stroke", type: "rounded" })))), this.helperText && index.h("dga-helper-text", { key: '8f31efdd3f9ec1b955999008b453ef44f5af3886', helperText: this.helperText, helperTextIcon: this.helperTextIcon, error: this.error }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/dga-pagination-usage.cjs.entry.js

@@ -8,7 +8,7 @@ const DgaPaginationUsage = class {
         this.variant = 'neutral';
     }
     render() {
-        return (index.h("div", { key: 'b24e876ad888243d62c450ea523f2cbea298c3b0' }, index.h("h1", { key: '6b5b9e6b1283d6cda563482de0e9952b0fb7f984' }, "Pagination Example"), index.h("div", { key: '238ebdc1247ebc5c36c8de022e9ae99169ea3505', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: '03f3214063f9d2f98e8c793447ff113c298b835d', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("dga-pagination", { key: 'f3f975f64a5f2d29d1977e25dcd0aba1d726db39', totalPageCount: 10, size: 'large', onChange: (page) => console.log(page, "page changed") }), index.h("dga-pagination", { key: 'e99aa4bcdce87c9312c8669a2af562062fe13d05', totalPageCount: 10, size: 'medium' }), index.h("dga-pagination", { key: '9ee92abd63d1f66358fa9225f8fc1730a21357cf', totalPageCount: 10, size: 'small' })), index.h("div", { key: '5ecff2d487b0631000e3e444139d31d569dd1091', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+        return (index.h("div", { key: 'cb9aa8d97dc4e4babbccc42e1f35b27fbbc10252' }, index.h("h1", { key: 'ac96099d8e5cf7d530ce0c7d1857009fe586c365' }, "Pagination Example"), index.h("div", { key: 'd5a4a55e96102454630d2ca031fbb16be44e2f88', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: 'e704950aef38e4f1dd20062b7414b6399bf7143c', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("dga-pagination", { key: '0d9576afd9302a8ef29dba8ddd286495ffe29773', totalPageCount: 10, size: 'large', onChange: (page) => console.log(page, "page changed") }), index.h("dga-pagination", { key: '099d061efadb8f9b454bf0449ac3be367b9fe3e8', totalPageCount: 10, size: 'medium' }), index.h("dga-pagination", { key: 'b38ba26dead1dc9cf2c8fed966d54df31a013859', totalPageCount: 10, size: 'small' })), index.h("div", { key: '9460d012c019245ddda33cfb84e65e4ff37b67c4', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
 };
 

package/dist/cjs/dga-pagination.cjs.entry.js

@@ -83,7 +83,7 @@ const DgaPagination = class {
         this.sxHandler.cleanup();
     }
     render() {
-        return (index.h("ul", { key: '1ae4b4f2727f92483bbfc074a53bb18c691291e4', dir: rtlUtils.isElementRTL(this.el) ? 'rtl' : 'ltr', class: `pagination pagination--${this.size}` }, index.h("li", { key: 'c5c6ecce90a724491c9eb6f55bf28ed25d01ecd9', class: "pagination__item pagination__arrow" }, index.h("button", { key: '84f96391a0e523114eccf672e97b080e99217c83', onClick: this.onPrevious, disabled: this.currentPage === 1 }, index.h("svg", { key: 'b6b9ff3c23a6ce5f974835e9df260e2736826a95', width: "17", height: "16", viewBox: "0 0 17 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("g", { key: '61da851369cea1d22909932b008c0422fd0a1790', id: "Leading Icon" }, index.h("path", { key: 'a911f53793bd2debb26f4d4d3e824030cd6a42d1', id: "Icon", d: "M10.5 12L6.5 8L10.5 4", stroke: "#161616", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), this.paginationRange &&
+        return (index.h("ul", { key: '9a1c30a26f4720842bff56e7eec8a1de257b0619', dir: rtlUtils.isElementRTL(this.el) ? 'rtl' : 'ltr', class: `pagination pagination--${this.size}` }, index.h("li", { key: '82f55d0d50842765232259dcc0197d3eed33c5cc', class: "pagination__item pagination__arrow" }, index.h("button", { key: 'bd7d8d264097dfad7073d4e16a05b9af82d0f831', onClick: this.onPrevious, disabled: this.currentPage === 1 }, index.h("svg", { key: 'f323d4bf784ad8293a61212faf0728a55e65359c', width: "17", height: "16", viewBox: "0 0 17 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("g", { key: 'a297b50dec28ffcf64ae207ac1bc8a0dfa4b0702', id: "Leading Icon" }, index.h("path", { key: 'd983c7a6af068f55e66f83d00ad3a6c8eda8dd04', id: "Icon", d: "M10.5 12L6.5 8L10.5 4", stroke: "#161616", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" }))))), this.paginationRange &&
             this.paginationRange.map(pageNumber => {
                 if (pageNumber === DOTS) {
                     return (index.h("li", { key: index$1.guid(), class: "pagination__item" }, "\u2026"));
@@ -91,7 +91,7 @@ const DgaPagination = class {
                 return (index.h("li", { key: index$1.guid(), class: `pagination__item ${this.currentPage === pageNumber ? 'pagination__item--active' : ''}` }, index.h("button", { onClick: () => {
                         this.handelPageChange(pageNumber);
                     } }, pageNumber)));
-            }), index.h("li", { key: '290801d4a8dd49290d99faab2340429054711624', class: "pagination__item pagination__arrow" }, index.h("button", { key: 'a928db70d3d1c458ae4b58f255a2bbf322dcdcd1', onClick: this.onNext, disabled: this.currentPage === this.totalPageCount }, index.h("svg", { key: 'ba532a2a85527a8fbd92111b76efe653637f5f16', width: "17", height: "16", viewBox: "0 0 17 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("g", { key: 'e2566dc3704b6686737ae92043c27637fe0a37ac', id: "Leading Icon" }, index.h("path", { key: '888b7862713eb8d0a61a332fb51d40497f673390', id: "Icon", d: "M6.5 12L10.5 8L6.5 4", stroke: "#161616", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))))));
+            }), index.h("li", { key: '27c8ee1b28d8cf86a29c6db39d848263fccff54d', class: "pagination__item pagination__arrow" }, index.h("button", { key: 'e66037e46b82a5cd5d99b31b7398257ea28df37c', onClick: this.onNext, disabled: this.currentPage === this.totalPageCount }, index.h("svg", { key: 'c978edae30ecbf41222100017e8dd9060e70da37', width: "17", height: "16", viewBox: "0 0 17 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("g", { key: 'ae8d88a1881a83ecd729977d57576c5e95ae932e', id: "Leading Icon" }, index.h("path", { key: '0abdf461b8dc76f707fafd087eb05a52e17bfea1', id: "Icon", d: "M6.5 12L10.5 8L6.5 4", stroke: "#161616", "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/dga-progress-indicator-step-v3.cjs.entry.js

@@ -73,7 +73,7 @@ const DgaProgressIndicatorStep = class {
         return currentStep.toString();
     }
     render() {
-        return (index.h("div", { key: '0b3880284791a4b0714512be41dd0259a40ac9b8', class: "progress-indicator__step", onMouseDown: this.handleFocus, onMouseUp: this.handleFocusOut }, index.h("div", { key: '5e0eff774e639788c688b796a2248e86c5ca3ad9', class: "progress-indicator__step-content dga-flex-column", ref: el => (this.stepContentRef = el) }, index.h("div", { key: '3df2da922c9d20601b45047f1a0e981498d07e7d', class: "step-label", "data-state": this.labelState }, index.h("span", { key: '73bdf3313205c8c9728e326cdefb96f754f80ca4', class: `step-label--${this.labelStyle}` }, this.labelStyle === 'circle' && this.labelChildren(this.currentStep))), index.h("div", { key: 'eabd41e9d4e8874d1ea652e81b1d6d6957a9128c', class: "step-text dga-flex-column" }, this.showStepName && index.h("span", { key: 'ff2b1ff6ee3b552ca9015425b47a617f72322d4b', class: this.isActive ? 'text-md-medium' : 'text-md-regular' }, this.title), this.showStepDescription && index.h("p", { key: 'ce360370fa4906872f30367120692dd18254506c', class: "text-sm-regular" }, this.description))), this.nextStep && index.h("span", { key: 'c1b14f4e03fb9279a1d45153ae678d126a0a188c', class: `progress-indicator__step-connector ${this.isActive ? 'progress-indicator__step-connector--active' : ''}` })));
+        return (index.h("div", { key: '57b7bb3e3d81aeb14c50ef43451be15923bffc47', class: "progress-indicator__step", onMouseDown: this.handleFocus, onMouseUp: this.handleFocusOut }, index.h("div", { key: '482f9736271cc8e01eaa696257643ebb1c37e650', class: "progress-indicator__step-content dga-flex-column", ref: el => (this.stepContentRef = el) }, index.h("div", { key: '4308fafeba56d200c0e8637197fbcb287ec7022f', class: "step-label", "data-state": this.labelState }, index.h("span", { key: 'ff9d82aa709beafacf083dc101d8444eedf5acda', class: `step-label--${this.labelStyle}` }, this.labelStyle === 'circle' && this.labelChildren(this.currentStep))), index.h("div", { key: '73328a45feecc8c83fe07d77d4b8e467196c4c1f', class: "step-text dga-flex-column" }, this.showStepName && index.h("span", { key: '03f012f9d1335edc20b12154cfa0ef22d844643b', class: this.isActive ? 'text-md-medium' : 'text-md-regular' }, this.title), this.showStepDescription && index.h("p", { key: '6a5c96fbb8eacf9b98bafb5dc75dce301f1006a1', class: "text-sm-regular" }, this.description))), this.nextStep && index.h("span", { key: '2be50ec43d6b6ea5837b1393b0295f779625c67d', class: `progress-indicator__step-connector ${this.isActive ? 'progress-indicator__step-connector--active' : ''}` })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/dga-progress-indicator-usage.cjs.entry.js

@@ -10,7 +10,7 @@ const DgaProgressIndicatorUsage = class {
     }
     render() {
         console.log(this.activeStep);
-        return (index.h("div", { key: '0606780bf8b9753c16036e862f0b5691b8d4b540' }, index.h("h1", { key: '8b12ef78863c0f3584a7d26059a13d61b48762de' }, "Progress Indicator Example"), index.h("div", { key: 'cd82c2eaae2abfb50ce2357894d8fc3602080510', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: '25ceb56aa79b892474d0633c1a4c1adf2211da46', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("button", { key: '475315575ad80679a56e842a0d27ad5290fea008', onClick: () => (this.activeStep = this.activeStep - 1) }, "prev"), index.h("button", { key: 'fab243e63694de6ad116201709a02dd510cb57d4', onClick: () => (this.activeStep = this.activeStep + 1) }, "next"), index.h("button", { key: 'ff57c24ade0fb502a22871261a1f89352f4880b2', onClick: () => (this.activeStep2 = this.activeStep2 - 1) }, "prev 2"), index.h("button", { key: 'd9bd55f5a921039d095727d41b1ac40af8b62196', onClick: () => (this.activeStep2 = this.activeStep2 + 1) }, "next 2"), "activeStep: ", this.activeStep, index.h("dga-progress-indicator", { key: 'a2b27c499a76c06d706770d8e451bacfdcf9dc28', activeStep: this.activeStep, alignment: 'vertical' }, index.h("dga-progress-indicator-step", { key: '4194461fbaebfc1fe7275af6333f3aaf755c1589', title: "Step One", description: "this is step description", currentStep: 1 }), index.h("dga-progress-indicator-step", { key: '1a3cb676ba768f5ac422fe9fa03b459aaa4dc94f', title: "Step Two", description: "this is step description", currentStep: 2 }), index.h("dga-progress-indicator-step", { key: '04c2a9c3df17aae7d8ed7a04707aa166af6e2d81', title: "Step Three", description: "this is step description", nextStep: false, currentStep: 3 })), index.h("dga-progress-indicator", { key: '7cdf7c51a1c18ff9aa22fba0ce152b6880ddb546', activeStep: this.activeStep2, alignment: 'vertical' }, index.h("dga-progress-indicator-step", { key: '09920e09f8c7092090a8cf8c61d5d0e70df2349d', title: "Step One", description: "this is step description", currentStep: 1 }), index.h("dga-progress-indicator-step", { key: '5e3d0e01eab654d64ca2b9f0e4c621d6398c897d', title: "Step Two", description: "this is step description", currentStep: 2 }), index.h("dga-progress-indicator-step", { key: '9c8f799243214919f0c99d249e67698c06a09c25', title: "Step Three", description: "this is step description", nextStep: false, currentStep: 3 }))), index.h("div", { key: '7b4eca4fc52612c0195c0e6642ab29c1f3a74921', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+        return (index.h("div", { key: 'e40057b4aa6094055d831b65f69513ad57ee771b' }, index.h("h1", { key: '6667fd0577a21ff69f5eaae94d4da57d06a7f742' }, "Progress Indicator Example"), index.h("div", { key: '72c006da05814407e8b94b86f97d81895b9c475c', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: 'e4b668436703a2642ee49f360582c1b9ebf1c0f4', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("button", { key: '72f4088c852e2fce03b2288b99d99a867030fc53', onClick: () => (this.activeStep = this.activeStep - 1) }, "prev"), index.h("button", { key: 'cb40e66ef1b117c810ce9db0276a6e6802e87dad', onClick: () => (this.activeStep = this.activeStep + 1) }, "next"), index.h("button", { key: '892f618922a1c302c3e072699646e449fd50b7ff', onClick: () => (this.activeStep2 = this.activeStep2 - 1) }, "prev 2"), index.h("button", { key: '7d67e223169c86e4f4f1c8d4419932ce0d82c1fa', onClick: () => (this.activeStep2 = this.activeStep2 + 1) }, "next 2"), "activeStep: ", this.activeStep, index.h("dga-progress-indicator", { key: 'bdd09c4d8b1fe495737bc8e4a08ae41ef1b08952', activeStep: this.activeStep, alignment: 'vertical' }, index.h("dga-progress-indicator-step", { key: '1fa40a7ffa4fc01abfa36dcbaeafa6a7d9b170e7', title: "Step One", description: "this is step description", currentStep: 1 }), index.h("dga-progress-indicator-step", { key: '000303b7f14d7b985d7d241272636826c3bdc78a', title: "Step Two", description: "this is step description", currentStep: 2 }), index.h("dga-progress-indicator-step", { key: 'f36c9ce2e5285e111602911e18585d9e36180617', title: "Step Three", description: "this is step description", nextStep: false, currentStep: 3 })), index.h("dga-progress-indicator", { key: '901163a5ccbc9cb48d380a7e221a6c43230b3fc3', activeStep: this.activeStep2, alignment: 'vertical' }, index.h("dga-progress-indicator-step", { key: '2f47f53f4640437a45b04727e7c41dab81634d68', title: "Step One", description: "this is step description", currentStep: 1 }), index.h("dga-progress-indicator-step", { key: '6195f65005e1d92e7e8740557a61c181be0c82f2', title: "Step Two", description: "this is step description", currentStep: 2 }), index.h("dga-progress-indicator-step", { key: '8d8ba1e37c6d88cf782b5c59d1aea63120e1064c', title: "Step Three", description: "this is step description", nextStep: false, currentStep: 3 }))), index.h("div", { key: '9766c0ae839dfe331f247efa1072b848df64427e', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
 };
 

package/dist/cjs/dga-progress-indicator-v3-usage.cjs.entry.js

@@ -10,7 +10,7 @@ const DgaProgressIndicatorUsage = class {
     }
     render() {
         console.log(this.activeStep);
-        return (index.h("div", { key: '97e698313cb254e9815976e253989d4597685108' }, index.h("h1", { key: '676a26ff8e00660b8950a16bdc8b7ab618356f33' }, "Progress Indicator Example"), index.h("div", { key: 'd0a72bcf1b8ae4c5ec285f28271dda4737308201', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: 'e0c76b8f41d62b7b1689f1fc6c4a46d77d971a21', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("button", { key: '512e672c5d0d01990d08d301b41acefd8ad48045', onClick: () => (this.activeStep = this.activeStep - 1) }, "prev"), index.h("button", { key: 'e5d04a22d125236a4d8aeaf4f108d60f9621c859', onClick: () => (this.activeStep = this.activeStep + 1) }, "next"), index.h("button", { key: '02b455776243ecb2dd5bd1bcb209788bf54134cd', onClick: () => (this.activeStep2 = this.activeStep2 - 1) }, "prev 2"), index.h("button", { key: '86e7693c9dd9249c772df79734152f7ed0e46302', onClick: () => (this.activeStep2 = this.activeStep2 + 1) }, "next 2"), "activeStep: ", this.activeStep, index.h("dga-progress-indicator", { key: 'b8c12031280c1603857bb9965a0af91b4bf22f94', activeStep: this.activeStep, alignment: 'vertical' }, index.h("dga-progress-indicator-step", { key: 'e2d31394119e953b70311ddfde664ed404addb9a', title: "Step One", description: "this is step description", currentStep: 1 }), index.h("dga-progress-indicator-step", { key: '9c7986cfbedaf32e5c3ef1b7ac8298127e1f1cfb', title: "Step Two", description: "this is step description", currentStep: 2 }), index.h("dga-progress-indicator-step", { key: '69cc6eadc5832d24e7ce2500a0ad330256905a2b', title: "Step Three", description: "this is step description", nextStep: false, currentStep: 3 })), index.h("dga-progress-indicator", { key: 'f5905872730a9453e5bf7d6753af0e41c1f44f9c', activeStep: this.activeStep2, alignment: 'vertical' }, index.h("dga-progress-indicator-step", { key: 'af858d7624c4232cbcbab274db42638483a58056', title: "Step One", description: "this is step description", currentStep: 1 }), index.h("dga-progress-indicator-step", { key: '927840992499aff8e8661a20a2590f1a36cdfab3', title: "Step Two", description: "this is step description", currentStep: 2 }), index.h("dga-progress-indicator-step", { key: 'db875fc797be817a940403cb126985b2a555187a', title: "Step Three", description: "this is step description", nextStep: false, currentStep: 3 }))), index.h("div", { key: '2ac9c3edea686875891b144b98edb84a6100248f', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+        return (index.h("div", { key: 'a337250bbd65a4b8e960e41e288c688a63b1e1c3' }, index.h("h1", { key: 'cef22a77c58e3f82497f63306072ffa572100a66' }, "Progress Indicator Example"), index.h("div", { key: '008ad571880f5db73f4087ebd34fe776ef335939', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: 'f4bd2ad2c0f3dc8c5958925ba3c8f770374889b4', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("button", { key: '8a1431d81db57ca7b7cd2c0c297033f4b3b41df3', onClick: () => (this.activeStep = this.activeStep - 1) }, "prev"), index.h("button", { key: 'fe7569b9b41836d1e3e43053a8a4be2a9a0ee158', onClick: () => (this.activeStep = this.activeStep + 1) }, "next"), index.h("button", { key: 'be43881855560693ba888fe958028d23ad91d906', onClick: () => (this.activeStep2 = this.activeStep2 - 1) }, "prev 2"), index.h("button", { key: 'edcb7c2e0d6f01a903b28597afd59790335a3b6a', onClick: () => (this.activeStep2 = this.activeStep2 + 1) }, "next 2"), "activeStep: ", this.activeStep, index.h("dga-progress-indicator", { key: 'b526773a9e89ac16817a56282c8c82ea91fa4419', activeStep: this.activeStep, alignment: 'vertical' }, index.h("dga-progress-indicator-step", { key: 'c1f3d6b6efdc0b5ed87688f50c2a94aeef7976ac', title: "Step One", description: "this is step description", currentStep: 1 }), index.h("dga-progress-indicator-step", { key: '3c88d3390d35500a19abddc579267e909a6a39b2', title: "Step Two", description: "this is step description", currentStep: 2 }), index.h("dga-progress-indicator-step", { key: 'e6b1985a8188d01d91deb94447f9fbd45aabfe22', title: "Step Three", description: "this is step description", nextStep: false, currentStep: 3 })), index.h("dga-progress-indicator", { key: '2d01e140a5d7dd2a4958f78cf81125b977df7eb4', activeStep: this.activeStep2, alignment: 'vertical' }, index.h("dga-progress-indicator-step", { key: 'b092938f317c3636f24fb90a05be4a4c69431bc0', title: "Step One", description: "this is step description", currentStep: 1 }), index.h("dga-progress-indicator-step", { key: '7a822aa16320248a4e10ff46d1d93ca21ca3f608', title: "Step Two", description: "this is step description", currentStep: 2 }), index.h("dga-progress-indicator-step", { key: 'dd7f2b999d76e8d0a5943d4931c51f40aed21257', title: "Step Three", description: "this is step description", nextStep: false, currentStep: 3 }))), index.h("div", { key: 'ae324cad10ea6807cc40cdc3f2507fb6a078e620', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
 };
 

package/dist/cjs/dga-progress-indicator-v3.cjs.entry.js

@@ -43,7 +43,7 @@ const DgaProgressIndicator = class {
     }
     render() {
         // console.log(this.activeStep , "<= active step")
-        return (index.h("div", { key: 'b9835c5da618944163c794c3fb62ae302bfa1bb1', class: "progress-indicator dga-flex", "data-alignment": this.alignment }, index.h("slot", { key: '3907a21a9f1c5d6f0bc8b6a880612d94047cc02c', name: 'progress-indicator-step' })));
+        return (index.h("div", { key: '26a4dc3493f4c40e1c0cb86db486aa3586e50f56', class: "progress-indicator dga-flex", "data-alignment": this.alignment }, index.h("slot", { key: '488c5476eae8799a0fc9990219e35424cb9d84bb', name: 'progress-indicator-step' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/dga-progress-indicator_2.cjs.entry.js

@@ -30,7 +30,7 @@ const DgaProgressIndicator = class {
         this.updateInternalActiveStep();
     }
     render() {
-        return (index.h("div", { key: '9aac6756fbcd96576c6fa53e1b65fa41cb71e2ac', class: "progress-indicator dga-flex", "data-alignment": this.alignment, "data-progress-key": this.componentKey }, index.h("slot", { key: '8ab20e00781e8adbdd500dc66c777accede2cb6a', name: 'progress-indicator-step' })));
+        return (index.h("div", { key: '4d620f48659d8142b0ea5f819d6a31ceb1b4d2a0', class: "progress-indicator dga-flex", "data-alignment": this.alignment, "data-progress-key": this.componentKey }, index.h("slot", { key: '77ad12a823fb5063a56be0ce891b081f7ac75da0', name: 'progress-indicator-step' })));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -103,7 +103,7 @@ const DgaProgressIndicatorStep = class {
         return currentStep.toString();
     }
     render() {
-        return (index.h("div", { key: 'aa2b391709be61ff1473bcb8f93fdb63f4a36fad', class: "progress-indicator__step", onMouseDown: this.handleFocus, onMouseUp: this.handleFocusOut }, index.h("div", { key: '5ba08654a25a057153ae10d3184d98f731037747', class: "progress-indicator__step-content dga-flex-column", ref: el => (this.stepContentRef = el) }, index.h("div", { key: '05a7c51dd95dbacac231ce7074d19af8e0c3f99d', class: "step-label", "data-state": this.labelState }, index.h("span", { key: 'a4cdc98da09dd99d27d3a8fb264902b1d2b1e4ab', class: `step-label--${this.labelStyle}` }, this.labelStyle === 'circle' && this.labelChildren(this.currentStep))), index.h("div", { key: '1b0337ecc12a3a7b8f8ab69257eb021d0f2492aa', class: "step-text dga-flex-column" }, this.showStepName && index.h("span", { key: '9ce21a3e31430c593f0fdcd7a3bd9fd5a32a91f4', class: this.isActive ? 'text-md-medium' : 'text-md-regular' }, this.title), this.showStepDescription && index.h("p", { key: '6b766b90fe43b6e5c31fd1a5d073a4876ea68ba3', class: "text-sm-regular" }, this.description))), this.nextStep && index.h("span", { key: '3ea208356da35d3ce26ef659d676ad4ae793dc5c', class: `progress-indicator__step-connector ${this.isActive ? 'progress-indicator__step-connector--active' : ''}` })));
+        return (index.h("div", { key: '8c7cf1023072a547caa1fe4141923308577f776f', class: "progress-indicator__step", onMouseDown: this.handleFocus, onMouseUp: this.handleFocusOut }, index.h("div", { key: 'b070ea33b5c8190f2034ff0fbba68d019cca4072', class: "progress-indicator__step-content dga-flex-column", ref: el => (this.stepContentRef = el) }, index.h("div", { key: 'dc623d3db99ad8ccf77b939cd917ad84cb15f259', class: "step-label", "data-state": this.labelState }, index.h("span", { key: '15e5f19d88914db4edf27615bb17e09262409dd1', class: `step-label--${this.labelStyle}` }, this.labelStyle === 'circle' && this.labelChildren(this.currentStep))), index.h("div", { key: '6c91a3334887f9b645d9aed12f60606c271ba2eb', class: "step-text dga-flex-column" }, this.showStepName && index.h("span", { key: '9e7059ff6ebabf1d1071d6e36ea07c4efa4f83aa', class: this.isActive ? 'text-md-medium' : 'text-md-regular' }, this.title), this.showStepDescription && index.h("p", { key: 'e9bbcdb2962f6f507923b7abc920405ec1dcb05e', class: "text-sm-regular" }, this.description))), this.nextStep && index.h("span", { key: 'e8569448d21c97c1db9067b50833f742ab6e34ea', class: `progress-indicator__step-connector ${this.isActive ? 'progress-indicator__step-connector--active' : ''}` })));
     }
     get el() { return index.getElement(this); }
 };

package/dist/cjs/dga-quote-usage.cjs.entry.js

@@ -8,7 +8,7 @@ const DgaQuoteUsage = class {
         this.activeStep = 1;
     }
     render() {
-        return (index.h("div", { key: 'c0644440fc4311d691e2e4b5c9e11f0c481ae6ac' }, index.h("h1", { key: '69c4d22d89feb14d1f5f92b126aa82a2d66af5ee' }, "Quote Example"), index.h("div", { key: '588d57aa2e44ffaa18882e8d86228e7a25c180dd', style: { padding: "50px", display: "flex", gap: "20px" } }, index.h("div", { key: '7badfa284280d544336c619df25784415c190631', style: { display: "flex", flexDirection: "column", gap: "20px" } }, index.h("dga-quote", { key: '169baf12973f7701a5aae619e61aee8c4f94ba81', quoteTitle: 'Title of quote', quoteDescription: 'The quote is placed here to highlight a specific saying or to present a brief quote that expresses an important idea or concept.', authorName: "Author's name", authorDescription: 'brief or description.' }), index.h("dga-quote", { key: 'af5189fae798ac3439347d0e3dff97fff93b5a55', quoteTitle: 'Title of quote', quoteDescription: 'The quote is placed here to highlight a specific saying or to present a brief quote that expresses an important idea or concept.', authorName: "Author's name", authorDescription: 'brief or description.', whiteBackground: true })), index.h("div", { key: '3a942fc8f14dd83aa074a1e7e91cfa6811d02241', style: { display: "flex", flexDirection: "column", gap: "20px" } }))));
+        return (index.h("div", { key: '8f4988acd8543e868f6d0608ea52afc320b4288c' }, index.h("h1", { key: '64c1df5abb62ff297725ce334004c159e5f6d115' }, "Quote Example"), index.h("div", { key: 'd1fca9e5f7c0d9df5c58b8bc3d4131fb74fff68a', style: { padding: "50px", display: "flex", gap: "20px" } }, index.h("div", { key: '77ac8bac8ed07a0c9547e2a606aacffed892cbb2', style: { display: "flex", flexDirection: "column", gap: "20px" } }, index.h("dga-quote", { key: 'e34c50a28d5423906abe922e8dbc94c6708428bd', quoteTitle: 'Title of quote', quoteDescription: 'The quote is placed here to highlight a specific saying or to present a brief quote that expresses an important idea or concept.', authorName: "Author's name", authorDescription: 'brief or description.' }), index.h("dga-quote", { key: 'aa0b232a95fdc39c09212a9458a122813ad605c5', quoteTitle: 'Title of quote', quoteDescription: 'The quote is placed here to highlight a specific saying or to present a brief quote that expresses an important idea or concept.', authorName: "Author's name", authorDescription: 'brief or description.', whiteBackground: true })), index.h("div", { key: '38fce22e8e8a32cb6123c882e5b1ca03b6f18ed0', style: { display: "flex", flexDirection: "column", gap: "20px" } }))));
     }
 };
 

package/dist/cjs/dga-quote.cjs.entry.js

@@ -33,7 +33,7 @@ const DgaQuote = class {
         this.sxHandler.cleanup();
     }
     render() {
-        return (index.h("div", { key: 'fb35ac80585c933c25a5cb58d3087fdb5b8cd218', class: { 'dga-quote': true, 'dga-quote--white-bg': this.whiteBackground } }, index.h("div", { key: '463af797b482e462b7f6570b9b8c0e721f3310d3', class: "dga-quote__body" }, index.h("dga-flex", { key: '8d937c83d18bdc5904ba1eeb5a3f704ee9028cdc', spacing: 9 }, index.h("span", { key: '5401fb11a7e8c8f0f6dcd2990e7795d57d56d299', class: "quote-icon" }, "\u201D"), index.h("dga-flex", { key: '2d4f3441f4023ce7108979324cfbb12449584036', direction: "column", spacing: 16 }, this.showQuoteTitle && index.h("h2", { key: '7f3227d2a44ddf9849cdf0ec7fcff3f1abc8f4f6', class: "dga-quote__body-title" }, this.quoteTitle), this.showQuoteDescription && index.h("p", { key: 'b634b2084f309df61fb87136e1adacab787f45e9', class: "dga-quote__body-desc" }, this.quoteDescription)))), this.showAuthorDetails && (index.h("div", { key: '028cf1b9344eed5a37b60b7e079d13d63c1da9ba', class: "dga-quote__auther-details" }, index.h("dga-flex", { key: '197fb592768e52bf9b8917867f61d3eebf1658a1', direction: "row", spacing: 16, align: "center" }, this.showAvatar && index.h("dga-avatar", { key: 'af2a50edc81b2801db58b4e6843da7aa2d4d2c80', size: 80, type: "image", border: false }), index.h("dga-flex", { key: '870414b47d7f3530ca20711f25fd995182418558', direction: "column", spacing: 8 }, index.h("h3", { key: '0e786bdce329d14770327ca820f700476f2f397a', class: "auther-title" }, this.authorName), index.h("p", { key: '07fb34ce45805ac1d3861d29cef065095fee5f89', class: "auther-desc" }, this.authorDescription))), index.h("span", { key: 'd497031042b388dfaa7d6bd791d7c3356cc20ca0', class: "quote-icon" }, "\u201C")))));
+        return (index.h("div", { key: 'db41b1c99264f6c94e62102b2149236e6e5aa8f7', class: { 'dga-quote': true, 'dga-quote--white-bg': this.whiteBackground } }, index.h("div", { key: '18ba901087a87b25c3a6e1ed292501b0e1112609', class: "dga-quote__body" }, index.h("dga-flex", { key: 'd12c22fe82a2b310f6bf18c5e8c2d4cbee8420ff', spacing: 9 }, index.h("span", { key: 'c3dc37befd849bc9801c4a4bbd55d23098406676', class: "quote-icon" }, "\u201D"), index.h("dga-flex", { key: '47f1b667b642a8f6ab586c2cf344d0ae12053ac7', direction: "column", spacing: 16 }, this.showQuoteTitle && index.h("h2", { key: '7e0cb2f9955d4c4eb8adff9ecd7940a2f0a6810f', class: "dga-quote__body-title" }, this.quoteTitle), this.showQuoteDescription && index.h("p", { key: 'f0117edd7c617f675c43432f1b211f59793f1040', class: "dga-quote__body-desc" }, this.quoteDescription)))), this.showAuthorDetails && (index.h("div", { key: '5e3829cd7d2b29ccb40218c9d225412ff9f01ab6', class: "dga-quote__auther-details" }, index.h("dga-flex", { key: '2e5daf0ab46c90219118e209043d2a4d913fe45d', direction: "row", spacing: 16, align: "center" }, this.showAvatar && index.h("dga-avatar", { key: '0d52604792aeb5c5853ae3d16ca996447beb5e09', size: 80, type: "image", border: false }), index.h("dga-flex", { key: '8b95245603a27c5493e76cb610f5a8281f327a3b', direction: "column", spacing: 8 }, index.h("h3", { key: '684c79736aace10d6c2558c3e8191c996297cc30', class: "auther-title" }, this.authorName), index.h("p", { key: '2e109dced594126d107c0627a7409b5be5378e88', class: "auther-desc" }, this.authorDescription))), index.h("span", { key: '48a21e46c22541b073966f9f58e597a8943ae28b', class: "quote-icon" }, "\u201C")))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/dga-radial-stepper-usage.cjs.entry.js

@@ -17,7 +17,7 @@ const DgaRadialStepperUsage = class {
         this.activeStep = Number(target.value); // Convert the string value to a number
     }
     render() {
-        return (index.h("div", { key: '225909e0fc6b4f157462fdc2510e5f0ab61802f8' }, index.h("h1", { key: '17b13be9ea34eb0f687dcb33c999a571fe139587' }, "Radial Stepper Example"), index.h("div", { key: '60f71c33aacac76ffb8a14a18babd6e898942916', style: { padding: '50px', gap: '20px' } }, index.h("div", { key: '4e170acecbfc921beaa24431326ad07403f91be7', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("dga-radial-stepper", { key: '0b172106431e8a54d3ef55df270b5259024ebfdd', size: "120px", activeStep: this.activeStep, steps: [
+        return (index.h("div", { key: '8d29de9d51421028cf2c92552cb4b8591f4f4ba2' }, index.h("h1", { key: '133afab67aea31647a8337a9139eee9cd6dfc31d' }, "Radial Stepper Example"), index.h("div", { key: '2a78e5b1fc0a0ccaa60ffffb612a79be146fbb2d', style: { padding: '50px', gap: '20px' } }, index.h("div", { key: 'f1142e70941c62f3a9e618833c2d1eb0c6a09a23', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("dga-radial-stepper", { key: '3915ac7506281602438630e1f18140fbd0d63bc1', size: "120px", activeStep: this.activeStep, steps: [
                 {
                     stepName: "Step One",
                     stepDescription: "this is step one description",
@@ -42,7 +42,7 @@ const DgaRadialStepperUsage = class {
                     showPreStep: true,
                     showNextStep: true
                 }
-            ] }), index.h("dga-radial-stepper", { key: 'ede7817fb337a4fb33e2bdb75c8ebf6a7eeca771', size: "80px", color: "success", activeStep: this.activeStep, steps: [
+            ] }), index.h("dga-radial-stepper", { key: 'b6c8e6826adccd6cd08b9715029ae76fe3946014', size: "80px", color: "success", activeStep: this.activeStep, steps: [
                 {
                     stepName: "Step One",
                     stepDescription: "this is step one description",
@@ -67,7 +67,7 @@ const DgaRadialStepperUsage = class {
                     showPreStep: true,
                     showNextStep: true
                 }
-            ] }), index.h("dga-radial-stepper", { key: '7e82c042e0594077b1a6ea80032a42bb57626dfd', variant: 'neutral', size: "64px", activeStep: this.activeStep, steps: [
+            ] }), index.h("dga-radial-stepper", { key: 'ba5dd9c331fbbdb87a66f357477203c24cf28889', variant: 'neutral', size: "64px", activeStep: this.activeStep, steps: [
                 {
                     stepName: "Step One",
                     stepDescription: "this is step one description",
@@ -92,7 +92,7 @@ const DgaRadialStepperUsage = class {
                     showPreStep: true,
                     showNextStep: true
                 }
-            ] }), index.h("dga-radial-stepper", { key: '19b50ec10da95fd59d77595ac2bcaee6ef3df981', size: "48px", activeStep: this.activeStep, steps: [
+            ] }), index.h("dga-radial-stepper", { key: '4fa58965edbcda8b0dab5937206bfd5db1b7ff4a', size: "48px", activeStep: this.activeStep, steps: [
                 {
                     stepName: "Step One",
                     stepDescription: "this is step one description",
@@ -117,7 +117,7 @@ const DgaRadialStepperUsage = class {
                     showPreStep: true,
                     showNextStep: true
                 }
-            ] }), index.h("dga-radial-stepper", { key: '55f72adae590c4892c36529d53a92cbb86d42e89', size: "40px", activeStep: this.activeStep, steps: [
+            ] }), index.h("dga-radial-stepper", { key: '7abbfa7137f82a755ce757fe013a7b8c0ad2ba35', size: "40px", activeStep: this.activeStep, steps: [
                 {
                     stepName: "Step One",
                     stepDescription: "this is step one description",
@@ -142,10 +142,10 @@ const DgaRadialStepperUsage = class {
                     showPreStep: true,
                     showNextStep: true
                 }
-            ] }), index.h("div", { key: '7d6dd3ae897dc783a1572325edd5212d9e4a899a', style: {
+            ] }), index.h("div", { key: '258cabc94a6606fdc5671938ef62704281b838fc', style: {
                 backgroundColor: "#1B8354",
                 padding: "40px"
-            } }, index.h("dga-radial-stepper", { key: '3c79bfc419203a325d003f5ed3e3ab8d7b6a5178', variant: "on-color", size: "120px", activeStep: this.activeStep, steps: [
+            } }, index.h("dga-radial-stepper", { key: 'b5f95ea6e627101add5f1b4c86f405048c9959eb', variant: "on-color", size: "120px", activeStep: this.activeStep, steps: [
                 {
                     stepName: "Step One",
                     stepDescription: "this is step one description",
@@ -182,7 +182,7 @@ const DgaRadialStepperUsage = class {
                     showPreStep: true,
                     showNextStep: true
                 }
-            ], RTL: true })), index.h("button", { key: '9e8a0658b35542947e028cb1eb271a7d1bb30bf5', onClick: () => (this.activeStep += 1) }, "Next"), index.h("button", { key: '88be7367e365a688a3d65da197cd8e63552fdea5', onClick: () => (this.activeStep -= 1) }, "Prev"), index.h("input", { key: '772d5d1e3fc60977ef43a98b9687592bae568fbe', type: "range", min: "0", max: "100", value: this.percentage, onInput: e => this.handleInputChange(e) })))));
+            ], RTL: true })), index.h("button", { key: '577f669c962dc0e3b018089e793cb330b5a298f8', onClick: () => (this.activeStep += 1) }, "Next"), index.h("button", { key: '50ae132ed64dffe58980f09d473261871a65e55e', onClick: () => (this.activeStep -= 1) }, "Prev"), index.h("input", { key: 'b80aa02b6d9828e491073e8dde762224de6b3e04', type: "range", min: "0", max: "100", value: this.percentage, onInput: e => this.handleInputChange(e) })))));
     }
 };
 

package/dist/cjs/dga-radial-stepper.cjs.entry.js

@@ -39,12 +39,12 @@ const DgaRadialStepper = class {
         const radius = (this.sizes[this.size] - strokeWidth) / 2;
         const dashArray = 2 * Math.PI * radius;
         const dashOffset = (this.RTL ? 1 : -1) * dashArray * (1 - this.internalPercentage / 100);
-        return (index.h(index.Host, { key: '64ed9b018cc60a6df620a01c6407ed0b91fb386f' }, index.h("dga-flex", { key: '6e97c1979c02957f59c8e7648de03997e264e71d', spacing: 8, align: 'center', dir: this.RTL ? "rtl" : "ltr", class: `dga-radial-stepper--${this.size} dga-radial-stepper--${this.variant}`, "aria-size": this.size }, index.h("div", { key: '0bdc1f4abc89c6b9db6d6cafb7ae39033fae9be6', class: "dga-circular-stepper", "aria-size": this.size }, index.h("div", { key: 'd1b21815ead4687ea17e1d191bb8c6fb7ecd21d0', class: "dga-circular-stepper__label" }, this.showText && this.steps.length > 0 && index.h("h4", { key: '71e155fc8b6dd10065a6bfdda2065f4da2a105d5', class: `dga-circular-stepper__label--text ${this.variant}` }, this.RTL ? `${this.internalActiveStep} من ${this.steps.length}` : `${this.internalActiveStep} of ${this.steps.length}`)), index.h("svg", { key: 'ba0e123d3016ad6e29bb19cb781c6dd2d4f46c42', width: this.sizes[this.size], height: this.sizes[this.size], viewBox: `0 0 ${this.sizes[this.size]} ${this.sizes[this.size]}` }, index.h("circle", { key: 'fab4d864d6e356192c329e5f53304e0ce0cbb063', class: `track track--${this.variant}`, fill: "none", stroke: "#e6e6e6",
+        return (index.h(index.Host, { key: 'd601d1e0bdf9efa319caba637e5ba05d543ca454' }, index.h("dga-flex", { key: '149bc159858c693c3b5886799ba0d0d3daa54944', spacing: 8, align: 'center', dir: this.RTL ? "rtl" : "ltr", class: `dga-radial-stepper--${this.size} dga-radial-stepper--${this.variant}`, "aria-size": this.size }, index.h("div", { key: '469440ef80a6632a8c74879a994aee0dfa0309f8', class: "dga-circular-stepper", "aria-size": this.size }, index.h("div", { key: '886ee4d15355c0d9468bbc36b75f7c0e11311cf0', class: "dga-circular-stepper__label" }, this.showText && this.steps.length > 0 && index.h("h4", { key: '9f2bc43ecc6e77ebfc62eb6ccdb41bace54ee98b', class: `dga-circular-stepper__label--text ${this.variant}` }, this.RTL ? `${this.internalActiveStep} من ${this.steps.length}` : `${this.internalActiveStep} of ${this.steps.length}`)), index.h("svg", { key: 'bf587649a96a8f76a89872f2581efb0694cb06a7', width: this.sizes[this.size], height: this.sizes[this.size], viewBox: `0 0 ${this.sizes[this.size]} ${this.sizes[this.size]}` }, index.h("circle", { key: 'c6a1a856efca52269099423d5d1e4fd13467b24a', class: `track track--${this.variant}`, fill: "none", stroke: "#e6e6e6",
             // stroke="currentColor"
-            r: radius, cx: this.sizes[this.size] / 2, cy: this.sizes[this.size] / 2, "stroke-width": strokeWidth }), index.h("circle", { key: '19b203de05f2ef9051437a6f74fefbfe45c38928', class: `tail tail--${this.variant}`, fill: "none", stroke: "currentColor", r: radius, cx: this.sizes[this.size] / 2, cy: this.sizes[this.size] / 2, "stroke-width": strokeWidth, "stroke-linecap": 'round', "stroke-dasharray": dashArray, "stroke-dashoffset": dashOffset, transform: `rotate(-90 ${this.sizes[this.size] / 2} ${this.sizes[this.size] / 2})`, style: {
+            r: radius, cx: this.sizes[this.size] / 2, cy: this.sizes[this.size] / 2, "stroke-width": strokeWidth }), index.h("circle", { key: '8350b172d9e63e8b5d0f138313ab71a3f8f4e4ce', class: `tail tail--${this.variant}`, fill: "none", stroke: "currentColor", r: radius, cx: this.sizes[this.size] / 2, cy: this.sizes[this.size] / 2, "stroke-width": strokeWidth, "stroke-linecap": 'round', "stroke-dasharray": dashArray, "stroke-dashoffset": dashOffset, transform: `rotate(-90 ${this.sizes[this.size] / 2} ${this.sizes[this.size] / 2})`, style: {
                 transition: 'stroke-dashoffset 0.5s ease',
-            } }))), index.h("dga-flex", { key: '85b855c467c5418e95b6ebf94e143e7e29b48723', direction: 'column', spacing: 4 }, ((_a = this.steps[this.internalActiveStep - 1]) === null || _a === void 0 ? void 0 : _a.showPreStep) && index.h("span", { key: '88fe0e0bb5265377a581517c98cc9bdc6b2337a1', class: "dga-radial-stepper__pre-name" }, "Previous: ", (_b = this.steps[this.internalActiveStep - 1]) === null || _b === void 0 ? void 0 :
-            _b.stepName), this.showStepName && ((_c = this.steps[this.internalActiveStep - 1]) === null || _c === void 0 ? void 0 : _c.stepName) && index.h("h3", { key: '19c5390d637e90fe754b171a671a37c877a657f1', class: "dga-radial-stepper__name" }, (_d = this.steps[this.internalActiveStep - 1]) === null || _d === void 0 ? void 0 : _d.stepName), this.showStepDescription && ((_e = this.steps[this.internalActiveStep - 1]) === null || _e === void 0 ? void 0 : _e.stepDescription) && index.h("h5", { key: 'ac296823e7dafc242f2f7e430796b67121b61b3c', class: "dga-radial-stepper__desc" }, (_f = this.steps[this.internalActiveStep - 1]) === null || _f === void 0 ? void 0 : _f.stepDescription), ((_g = this.steps[this.internalActiveStep - 1]) === null || _g === void 0 ? void 0 : _g.showNextStep) && index.h("span", { key: 'f996e0a11cf7ac90fcf4b15a1619b8186178b7e9', class: "dga-radial-stepper__next-name" }, "Next: ", (_h = this.steps[this.internalActiveStep]) === null || _h === void 0 ? void 0 :
+            } }))), index.h("dga-flex", { key: '638af7003ed048eefc26d847f88b52e16b859e14', direction: 'column', spacing: 4 }, ((_a = this.steps[this.internalActiveStep - 1]) === null || _a === void 0 ? void 0 : _a.showPreStep) && index.h("span", { key: '4380d0d2e6b7c03329f99d449a29fa22b178d50c', class: "dga-radial-stepper__pre-name" }, "Previous: ", (_b = this.steps[this.internalActiveStep - 1]) === null || _b === void 0 ? void 0 :
+            _b.stepName), this.showStepName && ((_c = this.steps[this.internalActiveStep - 1]) === null || _c === void 0 ? void 0 : _c.stepName) && index.h("h3", { key: '7dfd5d944bdba170239a6d356535d8c7a477725d', class: "dga-radial-stepper__name" }, (_d = this.steps[this.internalActiveStep - 1]) === null || _d === void 0 ? void 0 : _d.stepName), this.showStepDescription && ((_e = this.steps[this.internalActiveStep - 1]) === null || _e === void 0 ? void 0 : _e.stepDescription) && index.h("h5", { key: 'd400a5e2df898aba8ca1762fc3d61167dd4b051e', class: "dga-radial-stepper__desc" }, (_f = this.steps[this.internalActiveStep - 1]) === null || _f === void 0 ? void 0 : _f.stepDescription), ((_g = this.steps[this.internalActiveStep - 1]) === null || _g === void 0 ? void 0 : _g.showNextStep) && index.h("span", { key: '4bb5db7d6032db7b328094419728e14867f80282', class: "dga-radial-stepper__next-name" }, "Next: ", (_h = this.steps[this.internalActiveStep]) === null || _h === void 0 ? void 0 :
             _h.stepName)))));
     }
     static get watchers() { return {

package/dist/cjs/dga-radio-button-usage.cjs.entry.js

@@ -9,11 +9,11 @@ const DgaRadioButtonUsage = class {
         this.activeRadio = "radion-1";
     }
     render() {
-        return (index.h("div", { key: '18695efa11be59259cb34e11d7b6dc0b89f8452f' }, index.h("h1", { key: '7df20f3dca257f57d4409beccadad714ae23e34e' }, "RadioButton Example"), index.h("div", { key: '5ff0731c6a2d856dcbeeb2a2d73170414a09e358', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: '55d4133053872420f28344236f980cea96865e4c', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("dga-radio-button", { key: '9f55938dde881dba11d4575401d1281df0fe8adf',
+        return (index.h("div", { key: '59ba56e78ae9fd6fccffcd9dbbce8c5cfc105902' }, index.h("h1", { key: 'e5322c7f911cc26c10cc59b329c79b876681dcaf' }, "RadioButton Example"), index.h("div", { key: '3e150f3ed7a26c9d89c5b807a7d63f65581117be', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: '8982c08881a26f9f7b110ac0f0f444265e3d5977', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("dga-radio-button", { key: 'fb41a0bc910961fc1dd5aeb960cb057ffcdcdd63',
             // id="radio1"
-            label: "Radio Label 1", hasHelperText: true, helperText: "When a selection needs a further detailed explanation, it goes here.", alertMessage: true, alertText: "Error/Warning message", name: "radio", value: 'radion-1', checked: this.activeRadio === 'radion-1', onChange: (e) => this.activeRadio = e.target.value }), index.h("dga-radio-button", { key: '6c29704392561bce8b83e81f3c4976e31245431a',
+            label: "Radio Label 1", hasHelperText: true, helperText: "When a selection needs a further detailed explanation, it goes here.", alertMessage: true, alertText: "Error/Warning message", name: "radio", value: 'radion-1', checked: this.activeRadio === 'radion-1', onChange: (e) => this.activeRadio = e.target.value }), index.h("dga-radio-button", { key: 'd6c48b2d5c44be2306e44539dd6deb05d9c3c506',
             // id="radio2"
-            label: "Radio Label 2", hasHelperText: true, helperText: "When a selection needs a further detailed explanation, it goes here.", alertMessage: true, alertText: "Error/Warning message", name: "radio", value: 'radion-2', checked: this.activeRadio === 'radion-2', onChange: (e) => this.activeRadio = e.target.value })), index.h("div", { key: 'acdd470e36366bff6c2a335219b8778505bc60bf', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+            label: "Radio Label 2", hasHelperText: true, helperText: "When a selection needs a further detailed explanation, it goes here.", alertMessage: true, alertText: "Error/Warning message", name: "radio", value: 'radion-2', checked: this.activeRadio === 'radion-2', onChange: (e) => this.activeRadio = e.target.value })), index.h("div", { key: '281cc70182db804879f28e352eeb8377814e00da', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
 };
 

package/dist/cjs/dga-radio-button.cjs.entry.js

@@ -123,12 +123,12 @@ const RadioButton = class {
                 inlineStyles[key] = value;
             }
         }
-        return (index.h("label", { key: '9a755b8617511153cd0a885dad357de5fbf592b5', ref: el => (this.radioLabelRef = el), id: this.id, class: `radio ${this.color ? 'radio--' + this.color : ''}`, style: inlineStyles, onMouseDown: this.handleActive, onMouseUp: this.handleRemoveActive, onMouseOut: this.handleRemoveActive, onChange: this.handleRemoveActive }, index.h("div", { key: 'c7d2c762ba9493b9a84eeb2214ee4464c5f610cd', class: "radio-main" }, index.h("div", { key: '39e5cbe65ee62831302baad96b4c0a38632f11ed', class: "radio-main__content" }, index.h("input", { key: '5ebb2aeb712ffa3c721da54cddd1a109ddf5926c', type: "radio", name: this.name, value: this.value,
+        return (index.h("label", { key: 'b407f60557bd12a3d6f2dd836147fe24cfe59ea3', ref: el => (this.radioLabelRef = el), id: this.id, class: `radio ${this.color ? 'radio--' + this.color : ''}`, style: inlineStyles, onMouseDown: this.handleActive, onMouseUp: this.handleRemoveActive, onMouseOut: this.handleRemoveActive, onChange: this.handleRemoveActive }, index.h("div", { key: 'ce81bc4d86e9f982337facbf3ffadfdc38e9eb4d', class: "radio-main" }, index.h("div", { key: 'c4395d2a5106f961bc361357a737576fcb5e9462', class: "radio-main__content" }, index.h("input", { key: '2104a7eadca2a1c07be42757ab6c6d79e8b55249', type: "radio", name: this.name, value: this.value,
             // id={this.id}
             onChange: this.onChange, onInput: this.onInput, disabled: this.disabled,
             // onFocus={this.handleFocus}
             // onBlur={this.handleFocusOut}
-            checked: this.checked }), index.h("div", { key: '1d9eae662de9eadb522924c2532f2e31503d773f', class: "radio-container" }), (this.label || this.hasHelperText) && index.h("div", { key: 'bb763cadd2c195c4a5fddbfdda9e636eef9be74b', class: "dga-flex-column" }, this.label && index.h("span", { key: '0b418223e1f88bae0576bce5b7b771252a18c6e9', class: "radio__label" }, this.label), this.hasHelperText && this.helperText && index.h("span", { key: 'f1ec4b5ce0c7ed21e14b0d14acabae8c14dccffc', class: "radio__helper-text" }, this.helperText))), this.alertMessage && this.alertText && (index.h("div", { key: '5bca517fe1f30df010a6c4df382f8ef10e8c307c', class: "radio__warning" }, index.h("span", { key: '33dc678c28b43fab6acf69f4750f71e579507665', class: "radio__warning-icon" }, index.h("i", { key: '27629f21c6d473f6962ea8c26314d605b0b0bfaa', class: 'hgi-stroke hgi-alert-circle', style: { fontSize: "16px" } })), index.h("span", { key: 'b931b654501164a157ce9ef4c5f30e3d31b92095', class: "radio__warning-text" }, this.alertText))))));
+            checked: this.checked }), index.h("div", { key: '1ba13ed41a40979e17cb2c8c52c6b7e06f5a2817', class: "radio-container" }), (this.label || this.hasHelperText) && index.h("div", { key: 'de04c1801b3a6edb48cbb61dd366129ab553740d', class: "dga-flex-column" }, this.label && index.h("span", { key: '46fc8bcf04202d4d0db7a029e6e9e3a69fd2308a', class: "radio__label" }, this.label), this.hasHelperText && this.helperText && index.h("span", { key: 'd3c706ac82f303d31a3355aa66ea2c6675dd53a7', class: "radio__helper-text" }, this.helperText))), this.alertMessage && this.alertText && (index.h("div", { key: 'af169c48a60b57a56e065bdab7a64cd22cce8e28', class: "radio__warning" }, index.h("span", { key: '9a4840d38e2165cc6208c58e3281cae6e6b64bc6', class: "radio__warning-icon" }, index.h("i", { key: '5f247c2af62865bf2f5fadf1f90179422f61e530', class: 'hgi-stroke hgi-alert-circle', style: { fontSize: "16px" } })), index.h("span", { key: 'e76bcecbf0a7bdc739a6251879990a66459afcb5', class: "radio__warning-text" }, this.alertText))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/dga-rating-usage.cjs.entry.js

@@ -9,9 +9,9 @@ const DgaRatingUsage = class {
         this.rating = 2.5;
     }
     render() {
-        return (index.h("div", { key: '18fc93aae128fbf0d6d03bd620dc530174c70984', dir: "rtl" }, index.h("h1", { key: '4a158e082ad5882ac72cbaccaa633f7e404d308c' }, "Rating Example"), index.h("div", { key: 'c69b59565b14f8cd26afb61503be1afe14d420a1', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: '8c584d2f690271a5d14cad348d2516b6c2a6df0a', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("button", { key: 'a2becee8bb5cfab71c9c18a69ed53f0c5af07ccd', onClick: () => (this.rating += 1) }, "Increase ", this.rating), index.h("dga-rating", { key: '48d53f9c8f2d3fbe6f2354e8f32627cd3d207cf1', onChange: val => {
+        return (index.h("div", { key: 'f7184b61a4d253ba152378f5351a202594425923', dir: "rtl" }, index.h("h1", { key: 'acbac8ddd578ccac931983a2aeecf2f2010fe922' }, "Rating Example"), index.h("div", { key: '70e196e85539a5c20eaa2022990f8ba52a5804a1', style: { padding: '50px', display: 'flex', gap: '20px' } }, index.h("div", { key: 'd09cc40054e86ce6118c8f95e854924ce61ddf88', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, index.h("button", { key: 'f9b9fd64d25a115c1bff68828b1a35c6d38ddeea', onClick: () => (this.rating += 1) }, "Increase ", this.rating), index.h("dga-rating", { key: 'dd7731a72899cbc74608b3e3112c57beca756934', onChange: val => {
                 this.rating = val;
-            }, value: this.rating, size: "lg" }), index.h("dga-rating", { key: 'e20cd039904af1900be8296f25d60b634e1c0fbe', onChange: val => (this.rating = val), value: 2.5, size: "md" }), index.h("dga-rating", { key: '5ad3a83e36bef5f643ee89cfed91a07d40e4b594', onChange: val => (this.rating = val), value: this.rating, size: "sm" })), index.h("div", { key: 'ced84fabed122af37d5ced01d5326e94e1fde080', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+            }, value: this.rating, size: "lg" }), index.h("dga-rating", { key: 'ed2b827650cc9b1a4cbd9e82875242975d32d010', onChange: val => (this.rating = val), value: 2.5, size: "md" }), index.h("dga-rating", { key: '3ff22e835659ff9731ca114b5654ec4ee407c82e', onChange: val => (this.rating = val), value: this.rating, size: "sm" })), index.h("div", { key: 'dba2ca8ca0b0299adc0fd4c109a2cb72c3100077', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
 };
 

package/dist/cjs/dga-rating.cjs.entry.js

@@ -86,7 +86,7 @@ const DgaRating = class {
         }
     }
     render() {
-        return (index.h(index.Host, { key: 'cd38dc21ae1deeddce0086424231dfeb30329ed3' }, index.h("span", { key: 'c7ae687c27cd5ea89480a653edf27ea035a5b25b', class: `dga-rating dga-rating--${this.size}`, ref: el => (this.rootRef = el), onMouseMove: (event) => this.handleMouseMove(event), onMouseLeave: (event) => this.handleClear(event), dir: rtlUtils.isElementRTL(this.el) ? 'rtl' : 'ltr' }, Array.from({ length: this.max }, (_, index) => index + 1).map(value => {
+        return (index.h(index.Host, { key: '38833a21774b705e64503a3bf5818ee22b22bec5' }, index.h("span", { key: '68611dbf4fad4e54d37dcd5849c282a5637eba6a', class: `dga-rating dga-rating--${this.size}`, ref: el => (this.rootRef = el), onMouseMove: (event) => this.handleMouseMove(event), onMouseLeave: (event) => this.handleClear(event), dir: rtlUtils.isElementRTL(this.el) ? 'rtl' : 'ltr' }, Array.from({ length: this.max }, (_, index) => index + 1).map(value => {
             const colorMapper = {
                 default: 'var(--background-secondary)',
                 brand: 'var(--background-primary)',

package/dist/cjs/dga-search-box-usage.cjs.entry.js

@@ -8,7 +8,7 @@ const DgaSearchBoxUsage = class {
         this.value = 'test';
     }
     render() {
-        return (index.h("div", { key: '9e8a512454bc7fc623f01e46995e54011ee86023' }, index.h("h1", { key: 'bb78ccd378d9c3dc99b7137015e8e6cb28a3666a' }, "Search Box Example"), index.h("div", { key: '6c85eee430116e1ce1a42a9d63eb55cb3cd5d4c4', style: { padding: '50px' } }, index.h("div", { key: '82d82020d04bcd36fc40d917861e81c3769d6e03', style: { display: "flex", flexDirection: "column", gap: "16px" } }, index.h("dga-search-box", { key: '1994b0a546b11cb8a7f60ebf97e42b46ae48d7af', variant: 'default', value: this.value, placeholder: 'test placeholder', onChange: (e) => {
+        return (index.h("div", { key: 'a0fd32ce19eb357c35b9b68e806c1aaf73dd0257' }, index.h("h1", { key: 'f0de4d9d187977fd091b441c664657e803071b16' }, "Search Box Example"), index.h("div", { key: '64c4011f6f7b1d2bbfa83896072cdf5398563f95', style: { padding: '50px' } }, index.h("div", { key: 'b97ce8ed9f808c2991c06fd07488884d2a8ba7c6', style: { display: "flex", flexDirection: "column", gap: "16px" } }, index.h("dga-search-box", { key: '2753f93da36381860997c5f98d3d9cef58163555', variant: 'default', value: this.value, placeholder: 'test placeholder', onChange: (e) => {
                 const target = e.target;
                 console.log("search changed");
                 this.value = target.value;

package/dist/cjs/dga-search-box_2.cjs.entry.js

@@ -113,12 +113,12 @@ const DgaSearchBox = class {
         // this.value = event.target.value;
     }
     render() {
-        return (index.h(index.Host, { key: 'd21b4458f8c9b555c7ce371ac71bf2ccfcaa1168' }, index.h("div", { key: '0a4b9a8c0e1de31656028c371b76a162c0d1bfdb', class: { 'dga-form-control': true, 'dga-form-control--fullwidth': this.fullwidth } }, this.label && index.h("label", { key: '68594bf29d5a56f3684b9787bf1c9719d835f8f8', class: "dga-label" }, this.label), index.h("div", { key: '2a593deed76fb0923b74362da6cb4e95c999da80', class: `dga-search-box dga-search-box--${this.size} ${this.error ? 'dga-search-box--error' : ''} ${this.variant !== 'default' ? `dga-search-box--${this.variant}` : ''} ${this.isActive ? 'active' : ''} ${this.isFocused ? 'focus' : ''} ${this.disabled ? 'dga-search-box--disabled' : ''} ${this.readonly ? 'readOnly' : ''}`, ref: el => (this.inputContainerRef = el) }, this.icon && (index.h("span", { key: '1fccb81711b7d06805e8bbec21e8c600d33de876', class: "dga-search-box__icon" }, index.h("svg", { key: '33079c68d16857ac3033c7d8ca5d5ca77412b367', width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '1fe8349b54e4c6fb2892261b8ed7a6b92d037cec', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M9.16675 1.04163C4.67943 1.04163 1.04175 4.67931 1.04175 9.16663C1.04175 13.6539 4.67943 17.2916 9.16675 17.2916C11.1854 17.2916 13.0322 16.5554 14.4531 15.3369L17.8915 18.7752C18.1356 19.0193 18.5313 19.0193 18.7754 18.7752C19.0194 18.5312 19.0194 18.1354 18.7754 17.8914L15.337 14.453C16.5556 13.032 17.2917 11.1853 17.2917 9.16663C17.2917 4.67931 13.6541 1.04163 9.16675 1.04163ZM2.29175 9.16663C2.29175 5.36967 5.36979 2.29163 9.16675 2.29163C12.9637 2.29163 16.0417 5.36967 16.0417 9.16663C16.0417 12.9636 12.9637 16.0416 9.16675 16.0416C5.36979 16.0416 2.29175 12.9636 2.29175 9.16663Z", fill: "#161616" })))), index.h("input", { key: '24b015346e4a09df97919115e3fabcae2a56dff9', value: this.value, name: this.name, type: "text", onFocus: () => (this.isFocused = true), onBlur: e => {
+        return (index.h(index.Host, { key: '88a9d2d6940ac86ed8f21570459dccabbf37633d' }, index.h("div", { key: 'eca3ea2f1d4804b18d7171e1f6dd254cff5cd600', class: { 'dga-form-control': true, 'dga-form-control--fullwidth': this.fullwidth } }, this.label && index.h("label", { key: '4f05ea95aea67c9729aae2894e88635c5facc32c', class: "dga-label" }, this.label), index.h("div", { key: '76e16af074ca388111f407bcfa82929d9e8d1d3e', class: `dga-search-box dga-search-box--${this.size} ${this.error ? 'dga-search-box--error' : ''} ${this.variant !== 'default' ? `dga-search-box--${this.variant}` : ''} ${this.isActive ? 'active' : ''} ${this.isFocused ? 'focus' : ''} ${this.disabled ? 'dga-search-box--disabled' : ''} ${this.readonly ? 'readOnly' : ''}`, ref: el => (this.inputContainerRef = el) }, this.icon && (index.h("span", { key: '942c3de63476bd1e8c614d06a42c02e42d9fcabf', class: "dga-search-box__icon" }, index.h("svg", { key: '46fcb4dd3da9dcd3164d6b4c72682cdcb3dc24e6', width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { key: '5a5830806bb872f277770c062e149b9907f41137', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M9.16675 1.04163C4.67943 1.04163 1.04175 4.67931 1.04175 9.16663C1.04175 13.6539 4.67943 17.2916 9.16675 17.2916C11.1854 17.2916 13.0322 16.5554 14.4531 15.3369L17.8915 18.7752C18.1356 19.0193 18.5313 19.0193 18.7754 18.7752C19.0194 18.5312 19.0194 18.1354 18.7754 17.8914L15.337 14.453C16.5556 13.032 17.2917 11.1853 17.2917 9.16663C17.2917 4.67931 13.6541 1.04163 9.16675 1.04163ZM2.29175 9.16663C2.29175 5.36967 5.36979 2.29163 9.16675 2.29163C12.9637 2.29163 16.0417 5.36967 16.0417 9.16663C16.0417 12.9636 12.9637 16.0416 9.16675 16.0416C5.36979 16.0416 2.29175 12.9636 2.29175 9.16663Z", fill: "#161616" })))), index.h("input", { key: '4a838dbe715fd93ea440728c6a71390667e0c251', value: this.value, name: this.name, type: "text", onFocus: () => (this.isFocused = true), onBlur: e => {
                 this.isFocused = false;
                 this.onBlur.emit(e);
             }, class: "dga-search-box__field", placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, onMouseDown: () => (this.isActive = true), onMouseUp: () => (this.isActive = false), onMouseOut: () => (this.isActive = false), onInput: event => {
                 this.handleInputChange(event);
-            } }), index.h("div", { key: '7456fa0bacbcfc924570d49ba03aee643634b03f', class: "dga-search-box__actions" }, this.value.length > 0 && (index.h(index.Fragment, { key: '18f2c1e4f650f34fb6b7b46834a00ec14aa8f512' }, index.h("button", { key: '83dcf8bb7af691e5f6e56c3c9a0264aa06b6c4c5', class: "dga-search-box__action-btn", onClick: this.handleResetInput }, index.h("dga-icon-v2", { key: 'b136b525a8fa02744b392fefbfac56b6a97874f0', name: "cancel-01", variant: "stroke", size: 20 })), index.h("svg", { key: '5b27a74e77217ea046915d954c4cd6edbee76420', xmlns: "http://www.w3.org/2000/svg", width: "1", height: "26", viewBox: "0 0 1 26", fill: "none" }, index.h("rect", { key: '85ebe6952fe5768f483dc3f74f3d5729144a5be5', x: "1", y: "0.5", width: "25", height: "1", transform: "rotate(90 1 0.5)", fill: "#D2D6DB" })))), this.showTrailingIcon && (index.h("dga-tooltip", { key: '0df6d0c2f889c4d74fcb8ca2666716e2d85bd6f6', tooltipTitle: "Search by voice", direction: "bottom", beakAlignment: "center", beakPlacement: "top" }, index.h("button", { key: '4223f5040e05237265ea15bedc197d8012190243', class: "dga-search-box__search-btn", onClick: () => this.startListening(), disabled: this.isListening }, this.isListening ? (index.h("span", { class: "dga-search-box__icon" }, index.h("dga-icon-v2", { name: "mic-01", variant: "stroke", size: 20 }))) : (index.h("span", { class: "dga-search-box__icon" }, index.h("dga-icon-v2", { name: "mic-01", variant: "stroke", size: 20 })))))))))));
+            } }), index.h("div", { key: '775b97d96ac19cd57ba1241d95ace86067ff2d47', class: "dga-search-box__actions" }, this.value.length > 0 && (index.h(index.Fragment, { key: '02bf3cbe1096ca48cf2c9ae0b153f0f608edd166' }, index.h("button", { key: '0ba8303fc60a0fb48339ddbe4b9b5642ee0758aa', class: "dga-search-box__action-btn", onClick: this.handleResetInput }, index.h("dga-icon-v2", { key: '36157c809c2e9710292abad34a6ee895cb40fe79', name: "cancel-01", variant: "stroke", size: 20 })), index.h("svg", { key: '8e2b58354cf88f37baf09f6b1833be45c5fe1e3d', xmlns: "http://www.w3.org/2000/svg", width: "1", height: "26", viewBox: "0 0 1 26", fill: "none" }, index.h("rect", { key: '635603ce26b7b2b0c8443bc631ffc05ee5eeaa98', x: "1", y: "0.5", width: "25", height: "1", transform: "rotate(90 1 0.5)", fill: "#D2D6DB" })))), this.showTrailingIcon && (index.h("dga-tooltip", { key: '6a0823c46da1192e80d203558855c980c81f06ae', tooltipTitle: "Search by voice", direction: "bottom", beakAlignment: "center", beakPlacement: "top" }, index.h("button", { key: '756c24b2e194cfdb822a5f7df89e81fb5af083f9', class: "dga-search-box__search-btn", onClick: () => this.startListening(), disabled: this.isListening }, this.isListening ? (index.h("span", { class: "dga-search-box__icon" }, index.h("dga-icon-v2", { name: "mic-01", variant: "stroke", size: 20 }))) : (index.h("span", { class: "dga-search-box__icon" }, index.h("dga-icon-v2", { name: "mic-01", variant: "stroke", size: 20 })))))))))));
     }
 };
 DgaSearchBox.style = dgaSearchBoxCss;
@@ -188,7 +188,7 @@ const DgaTooltip = class {
         this.sxHandler.cleanup();
     }
     render() {
-        return (index.h(index.Host, { key: 'dac010cf2949f3a2bb55f4a04db412518c7881a7', id: this.sxHandler.getId(), style: this.sxHandler.getStyles() }, index.h("div", { key: '5638f89d9b5fc1e89b4453513f2065b795afef38', class: "dga-tooltip", "data-theme": this.theme, "data-beak-direction": `${this.beakPlacement}-${this.beakAlignment}` }, this.isHovered && (index.h("div", { key: '7f897fd2fe2bfe6e8dbf5b73da12619b16f9de74', class: "dga-tooltip-main", "data-direction": this.direction }, index.h("div", { key: 'd60d1a78d88557e5b74b236025bcee97e9649fdb', class: "dga-tooltip-main__wrapper" }, this.beakPlacement !== 'none' && index.h("span", { key: '5006b4c69d9d321c612e924ebb8b81135001ce4a', class: "dga-tooltip-main__beak", "data-beak-direction": `${this.beakPlacement}-${this.beakAlignment}` }), this.icon && (index.h("span", { key: '34458cddbee70eacd42be9c52fb6b30d9142ae8f', class: "dga-tooltip-main__icon" }, index.h("i", { key: '0cc42460234f3181ebc03482ddb4d063f6a5a76f', class: `${this.feedbackIcon.style === 'icon-only' ? 'hgi-stroke' : 'hgi-solid'} ${this.icons[this.feedbackIcon.type].icon}`, style: { color: this.icons[this.feedbackIcon.type].color, fontSize: `${this.feedbackIcon.size}px` } }))), index.h("div", { key: '3a07d704cc3e0159e2512cc4437678b4979aff8b', class: "dga-tooltip-main__content" }, this.tooltipTitle && index.h("span", { key: '26f43b95813f6dc0421bc10c77759fc4a2bcdd66', class: "dga-tooltip-main__content__title" }, this.tooltipTitle), this.helperText && index.h("span", { key: 'a97ce2ff26adee4dea840ef372a613b2c087c9ed', class: "dga-tooltip-main__content__helper-text" }, this.helperText))))), index.h("div", { key: '713a91f9198fa6c9ff5695fa651ffd26a69a14b5', class: "dga-tooltip-item", onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, index.h("slot", { key: '022ccaf8b9b97bde444700784a1a40a41435684b' })))));
+        return (index.h(index.Host, { key: 'e29a4d738bd9c43f6aa896abf80ccba62581610b', id: this.sxHandler.getId(), style: this.sxHandler.getStyles() }, index.h("div", { key: 'ca911edf359a03f46303195ed36268534be32c18', class: "dga-tooltip", "data-theme": this.theme, "data-beak-direction": `${this.beakPlacement}-${this.beakAlignment}` }, this.isHovered && (index.h("div", { key: '9faebf82e1b7af0f34764763fae6e4c91caf6c1e', class: "dga-tooltip-main", "data-direction": this.direction }, index.h("div", { key: '8f187c76d39bcbc5b21dc38bee07c10bca330317', class: "dga-tooltip-main__wrapper" }, this.beakPlacement !== 'none' && index.h("span", { key: '66ba75c47827d991b2588ec5f5ca99344e2075d9', class: "dga-tooltip-main__beak", "data-beak-direction": `${this.beakPlacement}-${this.beakAlignment}` }), this.icon && (index.h("span", { key: '27c7cd47b525e0acec5542be3996aea319b6fb97', class: "dga-tooltip-main__icon" }, index.h("i", { key: '6778c5aa44731a3e6f771300ac2c68d0b7294e6e', class: `${this.feedbackIcon.style === 'icon-only' ? 'hgi-stroke' : 'hgi-solid'} ${this.icons[this.feedbackIcon.type].icon}`, style: { color: this.icons[this.feedbackIcon.type].color, fontSize: `${this.feedbackIcon.size}px` } }))), index.h("div", { key: '624a40ea6733e01fe1f615856e36e5335b7d289c', class: "dga-tooltip-main__content" }, this.tooltipTitle && index.h("span", { key: '1e9c4685764bce7e99160f7f2773e714ce257533', class: "dga-tooltip-main__content__title" }, this.tooltipTitle), this.helperText && index.h("span", { key: '54179ff7e6eba94304f8f311d7e3f959ad40e4aa', class: "dga-tooltip-main__content__helper-text" }, this.helperText))))), index.h("div", { key: '652b3c1eaee1be7617c51b724f779cca14ab01d9', class: "dga-tooltip-item", onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, index.h("slot", { key: '33eec2e23b084c16f5bf1845c9fd624048b7c592' })))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {