@platformscode/core 0.0.34 → 0.0.37

package/dist/esm/dga-chip.entry.js

@@ -48,7 +48,7 @@ const DgaChip = class {
         (_a = this.sxStyleManager) === null || _a === void 0 ? void 0 : _a.cleanup();
     }
     render() {
-        return (h(Host, { key: 'b45e82abd297ad28cd4b4c91fc1bd520592c53ee', id: this.componentId, style: this.rootStyles }, h("span", { key: 'a1eba904c424ecf00f6d12fa7d11bbc91b3bf013', tabindex: "0", class: `chip chip--${this.variant} chip--${this.size} ${this.rounded ? 'chip--rounded' : ''} ${this.disabled ? 'disabled' : ''} ${this.pressed ? 'pressed' : ''} ${this.isSelected ? "selected" : ""}`, onMouseDown: () => (this.pressed = true), onMouseUp: () => (this.pressed = false), "aria-disabled": this.disabled, onClick: () => {
+        return (h(Host, { key: 'ee09ba2577425c1ac2afe7254b563cc57935ae64', id: this.componentId, style: this.rootStyles }, h("span", { key: '36dfb7ca4972f51d2fabcb2da806ee1a33afa272', tabindex: "0", class: `chip chip--${this.variant} chip--${this.size} ${this.rounded ? 'chip--rounded' : ''} ${this.disabled ? 'disabled' : ''} ${this.pressed ? 'pressed' : ''} ${this.isSelected ? "selected" : ""}`, onMouseDown: () => (this.pressed = true), onMouseUp: () => (this.pressed = false), "aria-disabled": this.disabled, onClick: () => {
                 if (this.isSelected) {
                     this.isSelectedState = false;
                 }
@@ -56,7 +56,7 @@ const DgaChip = class {
                     this.isSelectedState = true;
                 }
                 this.onChange(this.isSelectedState);
-            } }, this.leadIcon ? h("span", { class: "chip-icon" }, this.renderIcon(this.leadIcon, this.leadIconProps)) : '', this.label, this.trailIcon ? h("span", { class: "chip-icon" }, this.renderIcon(this.trailIcon, this.trailIconProps)) : '', h("slot", { key: 'c3c0fc376ae83a4fbc6fcac51f4f3c59e5a6c038' }))));
+            } }, this.leadIcon ? h("span", { class: "chip-icon" }, this.renderIcon(this.leadIcon, this.leadIconProps)) : '', this.label, this.trailIcon ? h("span", { class: "chip-icon" }, this.renderIcon(this.trailIcon, this.trailIconProps)) : '', h("slot", { key: '8b8433a505dbac68b7635578bd85104dda657a4d' }))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/dga-circle-skeleton_4.entry.js

@@ -9,7 +9,7 @@ const CircleSkeleton = class {
         this.width = '80px';
     }
     render() {
-        return (h("div", { key: 'f11851adf5a25d541cfb5122654a51f1cf6ec9c0', style: { width: this.width, height: this.width }, class: `circle_skeleton type${this.type}` }));
+        return (h("div", { key: 'a6c235982631b4fdaee847f524ef4c64faec0889', style: { width: this.width, height: this.width }, class: `circle_skeleton type${this.type}` }));
     }
 };
 CircleSkeleton.style = styleCss$3;
@@ -23,7 +23,7 @@ const LineSkeleton = class {
         this.type = '1';
     }
     render() {
-        return (h("div", { key: 'a5d9f7f61e4a5503202fa04b8b06b9bb82f3017f', class: `line_text ${this.size} type${this.type}` }));
+        return (h("div", { key: '3387a0e823a08659b101c7a00656711e3898a954', class: `line_text ${this.size} type${this.type}` }));
     }
 };
 LineSkeleton.style = styleCss$2;
@@ -38,7 +38,7 @@ const RectangleSkeleton = class {
         this.width = 'long';
     }
     render() {
-        return (h("div", { key: '6bd03c87bb4301f972037a17dc78f11b37613c40', class: `rectangle_text ${this.size} type${this.type} ${this.width}` }));
+        return (h("div", { key: '8a9d83b35d2014527bd9f9b5d49ee84c95fae0dd', class: `rectangle_text ${this.size} type${this.type} ${this.width}` }));
     }
 };
 RectangleSkeleton.style = styleCss$1;
@@ -64,7 +64,7 @@ const SquareSkeleton = class {
         return borderRadiusMapper[this.width] || '';
     }
     render() {
-        return (h("div", { key: '972e2f4fb0297ad96430c3cccf97f571c07c217f' }, h("div", { key: '18b35ea9910aab4c4e7132c83bea336ba9cca50b', style: { width: this.width, height: this.width }, class: `square_skeleton type${this.type} ${this.getBorderRadius()}` })));
+        return (h("div", { key: '7b34898c6abef2291a6c6d3ef5348a79fa9f7a9d' }, h("div", { key: 'b014a4229f90fe9646b4f6a0bcdde7502bdc4609', style: { width: this.width, height: this.width }, class: `square_skeleton type${this.type} ${this.getBorderRadius()}` })));
     }
 };
 SquareSkeleton.style = styleCss;

package/dist/esm/dga-circular-progress-bar-usage.entry.js

@@ -10,7 +10,7 @@ const DgaCircularProgressBarUsage = class {
         this.percentage = Number(target.value); // Convert the string value to a number
     }
     render() {
-        return (h("div", { key: '22c98cf756bc87e7563008d1d8d8dbf83702d367' }, h("h1", { key: '810402d359af1616f647cbfc9bb77a501951d8af' }, "Circular Progress Bar Example"), h("div", { key: '1ddeba7b25c67e24b72cd64edfff42f722fc5bbf', style: { padding: '50px', gap: '20px' } }, h("div", { key: '3568b23d5f0fee9da25a822fa85fa90721ebb3bf', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-circular-progress-bar", { key: 'cdc9ec98604a2c27ef6878d34c6ec17b4d309991', size: "200px", percentage: this.percentage, text: "Active users" }), h("dga-circular-progress-bar", { key: '64505edf28276a31a2acd2b2e2c42c9b7ad48173', size: "160px", percentage: this.percentage, variant: "success", text: "Active users" }), h("dga-circular-progress-bar", { key: 'ce08bd869f33d3b166e66641197e7a78d24e96ca', size: "120px", percentage: this.percentage, text: "Active users" }), h("dga-circular-progress-bar", { key: 'fe485191812c189f9b279011dc1a256595bfb9bd', size: "80px", percentage: this.percentage, text: "Active users" }), h("dga-circular-progress-bar", { key: '08d01feb95494cae5c3fa934481f8e28a6bcda73', size: "64px", percentage: this.percentage }), h("div", { key: '7365f460d0f82b342399d7b79fcab7a4c175e0c8', style: { display: 'flex', flexDirection: 'row', gap: '20px' } }, h("dga-circular-progress-bar", { key: '6183ed77d03b8d6742175b8bfdc377aba1becf8b', RTL: true, size: "200px", percentage: this.percentage, variant: "success", text: "Active users" }), h("dga-circular-progress-bar", { key: 'dcc3c86b8cd812c798b5778f06631ea398159e09', RTL: true, size: "160px", percentage: this.percentage, variant: "success", text: "Active users" }), h("dga-circular-progress-bar", { key: '1df72c28de7517fd6abb85c97278060b2dd35595', RTL: true, size: "120px", percentage: this.percentage, variant: "success", text: "Active users" }), h("dga-circular-progress-bar", { key: '10312a01436c9e33247418c77347b3cbfde969e8', RTL: true, size: "80px", percentage: this.percentage, variant: "success", text: "Active users" }), h("dga-circular-progress-bar", { key: 'f5473a3fd42021511c0c7f40ac3ac0d59f83a897', RTL: true, size: "64px", percentage: this.percentage, variant: "success", text: "Active users" })), h("div", { key: '88f6f63a2a7454e0f4061d64514b68314fdeae16', style: { display: 'flex', flexDirection: 'row', gap: '20px' } }, h("dga-circular-progress-bar", { key: 'f849c8bb3fefa7acaa42b12342ab152402513e95', RTL: true, size: "200px", percentage: this.percentage, variant: "error", text: "Active users" }), h("dga-circular-progress-bar", { key: 'b71c866fa0a3db91e393c0a58e722b1888772896', RTL: true, size: "160px", percentage: this.percentage, variant: "error", text: "Active users" }), h("dga-circular-progress-bar", { key: '072f980eb0620f8ff2b38e57c577b3b783e6dab6', RTL: true, size: "120px", percentage: this.percentage, variant: "error", text: "Active users" }), h("dga-circular-progress-bar", { key: '4f05250796ef3aa618b98490a2b83bd1d15e5465', RTL: true, size: "80px", percentage: this.percentage, variant: "error", text: "Active users" }), h("dga-circular-progress-bar", { key: 'bd04dcd2bcce80fc56a358376822ff4b34e73444', RTL: true, size: "64px", percentage: this.percentage, variant: "error", text: "Active users" })), h("input", { key: '08939c24feddd7e3b80e6b63e6a34746bba0da46', type: "range", min: "0", max: "100", value: this.percentage, onInput: e => this.handleInputChange(e) })), h("div", { key: 'c415997cfe01f481f5aa022931f2cdb11482c252', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+        return (h("div", { key: 'f9577fad9e085af78375575d2ce795156b21bf72' }, h("h1", { key: '861aa66156207f5adc2302a4c264c0390ab3d742' }, "Circular Progress Bar Example"), h("div", { key: 'fb00ea5d6040e2298aebde05a35853a818def505', style: { padding: '50px', gap: '20px' } }, h("div", { key: '8f39abd1783bba020dfd94975c5375b7ad16848b', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-circular-progress-bar", { key: 'cdf80cd37320efe15440cc5173581e33e72a5e32', size: "200px", percentage: this.percentage, text: "Active users" }), h("dga-circular-progress-bar", { key: '0342658adabf45f1cee4d0a03c83ea975d384646', size: "160px", percentage: this.percentage, variant: "success", text: "Active users" }), h("dga-circular-progress-bar", { key: '019afb6bdbb4824f3afb1d047a9283b0ee526473', size: "120px", percentage: this.percentage, text: "Active users" }), h("dga-circular-progress-bar", { key: '7121f41be5bdb35b4b9f508a012db7eda7c7c8ab', size: "80px", percentage: this.percentage, text: "Active users" }), h("dga-circular-progress-bar", { key: '9d72c71b97e373ece837ef315e8d57eab2f56e1d', size: "64px", percentage: this.percentage }), h("div", { key: '0326321207b5bbf54f0fe6bf360ee8e801f3ab35', style: { display: 'flex', flexDirection: 'row', gap: '20px' } }, h("dga-circular-progress-bar", { key: 'e2700f5f423a3edfa24d7a197d4720f29863cdc9', RTL: true, size: "200px", percentage: this.percentage, variant: "success", text: "Active users" }), h("dga-circular-progress-bar", { key: '96251560b2373deb2fcb28538f3eaea30507d871', RTL: true, size: "160px", percentage: this.percentage, variant: "success", text: "Active users" }), h("dga-circular-progress-bar", { key: 'd589e8cec7c951bf1681ad909e077deb5999b063', RTL: true, size: "120px", percentage: this.percentage, variant: "success", text: "Active users" }), h("dga-circular-progress-bar", { key: '7cee4d167a1c02bd5332431657c582c3e0c0f47f', RTL: true, size: "80px", percentage: this.percentage, variant: "success", text: "Active users" }), h("dga-circular-progress-bar", { key: '200cdad08c8297f08a195427ca7654a786a49b59', RTL: true, size: "64px", percentage: this.percentage, variant: "success", text: "Active users" })), h("div", { key: '0ba442a3bb329bfe3072c816f87e2014157b810c', style: { display: 'flex', flexDirection: 'row', gap: '20px' } }, h("dga-circular-progress-bar", { key: '13ffaeaf27525a5cfa90ddb9cafc239f6d5cc0aa', RTL: true, size: "200px", percentage: this.percentage, variant: "error", text: "Active users" }), h("dga-circular-progress-bar", { key: '17e853dae3e52705fbc0f6611b3abcef09b66846', RTL: true, size: "160px", percentage: this.percentage, variant: "error", text: "Active users" }), h("dga-circular-progress-bar", { key: '50442db3ff50a0651211719e38843bfdf57fb669', RTL: true, size: "120px", percentage: this.percentage, variant: "error", text: "Active users" }), h("dga-circular-progress-bar", { key: '4d96f217f587dfa9b85b4e55a9cbe482a14b4992', RTL: true, size: "80px", percentage: this.percentage, variant: "error", text: "Active users" }), h("dga-circular-progress-bar", { key: 'f86b05b02b309ce59a5d3949aaa18822e464e983', RTL: true, size: "64px", percentage: this.percentage, variant: "error", text: "Active users" })), h("input", { key: '58c08f8ec8bdbdcf3b22b6f1d64890655450a2c7', type: "range", min: "0", max: "100", value: this.percentage, onInput: e => this.handleInputChange(e) })), h("div", { key: 'e4576d8a8521e2674a4c8e192e608cae92ca6ea4', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
 };
 

package/dist/esm/dga-circular-progress-bar.entry.js

@@ -1,4 +1,5 @@
 import { r as registerInstance, h } from './index-B4CGwdkg.js';
+import { c as checkmarkCircle02SolidRoundedIcon, m as multiplicationSignCircleSolidRoundedIcon } from './index-BYA91_SW.js';
 
 const dgaCircularProgressBarCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap\"); @import url(\"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@100;200;300;400;500;600;700&display=swap\"); html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}:focus{outline:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:\"\";content:none}table{border-collapse:collapse;border-spacing:0}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none;-moz-appearance:none}input[type=search]{-webkit-appearance:none;-moz-appearance:none;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}textarea{overflow:auto;vertical-align:top;resize:vertical}audio,canvas,video{display:inline-block;zoom:1;max-width:100%}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}a:active,a:hover{outline:0}img{border:0;-ms-interpolation-mode:bicubic;}figure{margin:0}form{margin:0}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0;white-space:normal;*margin-left:-7px;}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle;}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer;*overflow:visible;}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0;*height:13px;*width:13px;}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0}html,button,input,select,textarea{color:#222}::-moz-selection{background:#b3d4fc;text-shadow:none}::selection{background:#b3d4fc;text-shadow:none}img{vertical-align:middle}fieldset{border:0;margin:0;padding:0}textarea{resize:vertical}.chromeframe{margin:0.2em 0;background:#ccc;color:#000;padding:0.2em 0}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}*{box-sizing:border-box}body{margin:0}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}@font-face{font-family:\"IBMPlexSansArabic\";src:url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-Regular.woff2\") format(\"woff2\"), url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-Regular.woff\") format(\"woff\");font-weight:400;font-style:normal}@font-face{font-family:\"IBMPlexSansArabic\";src:url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-Medium.woff2\") format(\"woff2\"), url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-Medium.woff\") format(\"woff\");font-weight:500;font-style:normal}@font-face{font-family:\"IBMPlexSansArabic\";src:url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-SemiBold.woff2\") format(\"woff2\"), url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-SemiBold.woff\") format(\"woff\");font-weight:600;font-style:normal}@font-face{font-family:\"IBMPlexSansArabic\";src:url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-Bold.woff2\") format(\"woff2\"), url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-Bold.woff\") format(\"woff\");font-weight:700;font-style:normal;font-display:auto}body{font-family:\"IBMPlexSansArabic\"}a,a:active,a:focus{color:inherit;text-decoration:none}.display-2xl-regular{font:400 72px/90px \"IBMPlexSansArabic\"}.display-xl-regular{font:400 60px/72px \"IBMPlexSansArabic\"}.display-lg-regular{font:400 48px/60px \"IBMPlexSansArabic\"}.display-md-regular{font:400 36px/44px \"IBMPlexSansArabic\"}.display-sm-regular{font:400 30px/38px \"IBMPlexSansArabic\"}.display-xs-regular{font:400 24px/32px \"IBMPlexSansArabic\"}.text-xl-regular,.circular-progress-bar[aria-size=\"200px\"] .circular-progress-bar__label--text{font:400 20px/30px \"IBMPlexSansArabic\"}.text-lg-regular,.circular-progress-bar[aria-size=\"80px\"] .circular-progress-bar__label--percentage{font:400 18px/28px \"IBMPlexSansArabic\"}.text-md-regular,.circular-progress-bar[aria-size=\"160px\"] .circular-progress-bar__label--text{font:400 16px/24px \"IBMPlexSansArabic\"}.text-sm-regular,.circular-progress-bar[aria-size=\"120px\"] .circular-progress-bar__label--text{font:400 14px/20px \"IBMPlexSansArabic\"}.text-xs-regular{font:400 12px/18px \"IBMPlexSansArabic\"}.text-2xs-regular{font:400 10px/14px \"IBMPlexSansArabic\"}.display-2xl-medium{font:500 72px/90px \"IBMPlexSansArabic\"}.display-xl-medium{font:500 60px/72px \"IBMPlexSansArabic\"}.display-lg-medium{font:500 48px/60px \"IBMPlexSansArabic\"}.display-md-medium{font:500 36px/44px \"IBMPlexSansArabic\"}.display-sm-medium{font:500 30px/38px \"IBMPlexSansArabic\"}.display-xs-medium{font:500 24px/32px \"IBMPlexSansArabic\"}.text-xl-medium{font:500 20px/30px \"IBMPlexSansArabic\"}.text-lg-medium{font:500 18px/28px \"IBMPlexSansArabic\"}.text-md-medium{font:500 16px/24px \"IBMPlexSansArabic\"}.text-sm-medium{font:500 14px/20px \"IBMPlexSansArabic\"}.text-xs-medium{font:500 12px/18px \"IBMPlexSansArabic\"}.text-2xs-medium{font:500 10px/14px \"IBMPlexSansArabic\"}.display-2xl-semibold{font:600 72px/90px \"IBMPlexSansArabic\"}.display-xl-semibold{font:600 60px/72px \"IBMPlexSansArabic\"}.display-lg-semibold{font:600 48px/60px \"IBMPlexSansArabic\"}.display-md-semibold{font:600 36px/44px \"IBMPlexSansArabic\"}.display-sm-semibold{font:600 30px/38px \"IBMPlexSansArabic\"}.display-xs-semibold{font:600 24px/32px \"IBMPlexSansArabic\"}.text-xl-semibold{font:600 20px/30px \"IBMPlexSansArabic\"}.text-lg-semibold{font:600 18px/28px \"IBMPlexSansArabic\"}.text-md-semibold{font:600 16px/24px \"IBMPlexSansArabic\"}.text-sm-semibold{font:600 14px/20px \"IBMPlexSansArabic\"}.text-xs-semibold{font:600 12px/18px \"IBMPlexSansArabic\"}.text-2xs-semibold{font:600 10px/14px \"IBMPlexSansArabic\"}.display-2xl-bold{font:700 72px/90px \"IBMPlexSansArabic\"}.display-xl-bold{font:700 60px/72px \"IBMPlexSansArabic\"}.display-lg-bold{font:700 48px/60px \"IBMPlexSansArabic\"}.display-md-bold,.circular-progress-bar[aria-size=\"200px\"] .circular-progress-bar__label--percentage{font:700 36px/44px \"IBMPlexSansArabic\"}.display-sm-bold,.circular-progress-bar[aria-size=\"160px\"] .circular-progress-bar__label--percentage{font:700 30px/38px \"IBMPlexSansArabic\"}.display-xs-bold,.circular-progress-bar[aria-size=\"120px\"] .circular-progress-bar__label--percentage{font:700 24px/32px \"IBMPlexSansArabic\"}.text-xl-bold{font:700 20px/30px \"IBMPlexSansArabic\"}.text-lg-bold{font:700 18px/28px \"IBMPlexSansArabic\"}.text-md-bold{font:700 16px/24px \"IBMPlexSansArabic\"}.text-sm-bold,.circular-progress-bar[aria-size=\"64px\"] .circular-progress-bar__label--percentage{font:700 14px/20px \"IBMPlexSansArabic\"}.text-xs-bold{font:700 12px/18px \"IBMPlexSansArabic\"}.text-2xs-bold{font:700 10px/14px \"IBMPlexSansArabic\"}.dga-spacing-hor-0{height:0px}.dga-spacing-vert-0{width:0px}.dga-p-0{padding:0px}.dga-px-0{padding-inline:0px}.dga-py-0{padding-block:0px}.dga-pl-0{padding-left:0px}.dga-pr-0{padding-right:0px}.dga-pt-0{padding-top:0px}.dga-pb-0{padding-bottom:0px}.dga-mx-0{margin-inline:0px}.dga-my-0{margin-block:0px}.dga-ml-0{margin-left:0px}.dga-mr-0{margin-right:0px}.dga-mt-0{margin-top:0px}.dga-mb-0{margin-bottom:0px}.dga-spacing-hor-2{height:8px}.dga-spacing-vert-2{width:8px}.dga-p-2{padding:8px}.dga-px-2{padding-inline:8px}.dga-py-2{padding-block:8px}.dga-pl-2{padding-left:8px}.dga-pr-2{padding-right:8px}.dga-pt-2{padding-top:8px}.dga-pb-2{padding-bottom:8px}.dga-mx-2{margin-inline:8px}.dga-my-2{margin-block:8px}.dga-ml-2{margin-left:8px}.dga-mr-2{margin-right:8px}.dga-mt-2{margin-top:8px}.dga-mb-2{margin-bottom:8px}.dga-spacing-hor-4{height:16px}.dga-spacing-vert-4{width:16px}.dga-p-4{padding:16px}.dga-px-4{padding-inline:16px}.dga-py-4{padding-block:16px}.dga-pl-4{padding-left:16px}.dga-pr-4{padding-right:16px}.dga-pt-4{padding-top:16px}.dga-pb-4{padding-bottom:16px}.dga-mx-4{margin-inline:16px}.dga-my-4{margin-block:16px}.dga-ml-4{margin-left:16px}.dga-mr-4{margin-right:16px}.dga-mt-4{margin-top:16px}.dga-mb-4{margin-bottom:16px}.dga-spacing-hor-8{height:32px}.dga-spacing-vert-8{width:32px}.dga-p-8{padding:32px}.dga-px-8{padding-inline:32px}.dga-py-8{padding-block:32px}.dga-pl-8{padding-left:32px}.dga-pr-8{padding-right:32px}.dga-pt-8{padding-top:32px}.dga-pb-8{padding-bottom:32px}.dga-mx-8{margin-inline:32px}.dga-my-8{margin-block:32px}.dga-ml-8{margin-left:32px}.dga-mr-8{margin-right:32px}.dga-mt-8{margin-top:32px}.dga-mb-8{margin-bottom:32px}.dga-spacing-hor-12{height:48px}.dga-spacing-vert-12{width:48px}.dga-p-12{padding:48px}.dga-px-12{padding-inline:48px}.dga-py-12{padding-block:48px}.dga-pl-12{padding-left:48px}.dga-pr-12{padding-right:48px}.dga-pt-12{padding-top:48px}.dga-pb-12{padding-bottom:48px}.dga-mx-12{margin-inline:48px}.dga-my-12{margin-block:48px}.dga-ml-12{margin-left:48px}.dga-mr-12{margin-right:48px}.dga-mt-12{margin-top:48px}.dga-mb-12{margin-bottom:48px}.dga-spacing-hor-16{height:64px}.dga-spacing-vert-16{width:64px}.dga-p-16{padding:64px}.dga-px-16{padding-inline:64px}.dga-py-16{padding-block:64px}.dga-pl-16{padding-left:64px}.dga-pr-16{padding-right:64px}.dga-pt-16{padding-top:64px}.dga-pb-16{padding-bottom:64px}.dga-mx-16{margin-inline:64px}.dga-my-16{margin-block:64px}.dga-ml-16{margin-left:64px}.dga-mr-16{margin-right:64px}.dga-mt-16{margin-top:64px}.dga-mb-16{margin-bottom:64px}.dga-spacing-hor-24{height:96px}.dga-spacing-vert-24{width:96px}.dga-p-24{padding:96px}.dga-px-24{padding-inline:96px}.dga-py-24{padding-block:96px}.dga-pl-24{padding-left:96px}.dga-pr-24{padding-right:96px}.dga-pt-24{padding-top:96px}.dga-pb-24{padding-bottom:96px}.dga-mx-24{margin-inline:96px}.dga-my-24{margin-block:96px}.dga-ml-24{margin-left:96px}.dga-mr-24{margin-right:96px}.dga-mt-24{margin-top:96px}.dga-mb-24{margin-bottom:96px}.dga-spacing-hor-32{height:128px}.dga-spacing-vert-32{width:128px}.dga-p-32{padding:128px}.dga-px-32{padding-inline:128px}.dga-py-32{padding-block:128px}.dga-pl-32{padding-left:128px}.dga-pr-32{padding-right:128px}.dga-pt-32{padding-top:128px}.dga-pb-32{padding-bottom:128px}.dga-mx-32{margin-inline:128px}.dga-my-32{margin-block:128px}.dga-ml-32{margin-left:128px}.dga-mr-32{margin-right:128px}.dga-mt-32{margin-top:128px}.dga-mb-32{margin-bottom:128px}.dga-spacing-hor-40{height:160px}.dga-spacing-vert-40{width:160px}.dga-p-40{padding:160px}.dga-px-40{padding-inline:160px}.dga-py-40{padding-block:160px}.dga-pl-40{padding-left:160px}.dga-pr-40{padding-right:160px}.dga-pt-40{padding-top:160px}.dga-pb-40{padding-bottom:160px}.dga-mx-40{margin-inline:160px}.dga-my-40{margin-block:160px}.dga-ml-40{margin-left:160px}.dga-mr-40{margin-right:160px}.dga-mt-40{margin-top:160px}.dga-mb-40{margin-bottom:160px}.dga-spacing-hor-48{height:192px}.dga-spacing-vert-48{width:192px}.dga-p-48{padding:192px}.dga-px-48{padding-inline:192px}.dga-py-48{padding-block:192px}.dga-pl-48{padding-left:192px}.dga-pr-48{padding-right:192px}.dga-pt-48{padding-top:192px}.dga-pb-48{padding-bottom:192px}.dga-mx-48{margin-inline:192px}.dga-my-48{margin-block:192px}.dga-ml-48{margin-left:192px}.dga-mr-48{margin-right:192px}.dga-mt-48{margin-top:192px}.dga-mb-48{margin-bottom:192px}.dga-spacing-hor-56{height:224px}.dga-spacing-vert-56{width:224px}.dga-p-56{padding:224px}.dga-px-56{padding-inline:224px}.dga-py-56{padding-block:224px}.dga-pl-56{padding-left:224px}.dga-pr-56{padding-right:224px}.dga-pt-56{padding-top:224px}.dga-pb-56{padding-bottom:224px}.dga-mx-56{margin-inline:224px}.dga-my-56{margin-block:224px}.dga-ml-56{margin-left:224px}.dga-mr-56{margin-right:224px}.dga-mt-56{margin-top:224px}.dga-mb-56{margin-bottom:224px}.dga-spacing-hor-64{height:256px}.dga-spacing-vert-64{width:256px}.dga-p-64{padding:256px}.dga-px-64{padding-inline:256px}.dga-py-64{padding-block:256px}.dga-pl-64{padding-left:256px}.dga-pr-64{padding-right:256px}.dga-pt-64{padding-top:256px}.dga-pb-64{padding-bottom:256px}.dga-mx-64{margin-inline:256px}.dga-my-64{margin-block:256px}.dga-ml-64{margin-left:256px}.dga-mr-64{margin-right:256px}.dga-mt-64{margin-top:256px}.dga-mb-64{margin-bottom:256px}.dga-spacing-hor-72{height:288px}.dga-spacing-vert-72{width:288px}.dga-p-72{padding:288px}.dga-px-72{padding-inline:288px}.dga-py-72{padding-block:288px}.dga-pl-72{padding-left:288px}.dga-pr-72{padding-right:288px}.dga-pt-72{padding-top:288px}.dga-pb-72{padding-bottom:288px}.dga-mx-72{margin-inline:288px}.dga-my-72{margin-block:288px}.dga-ml-72{margin-left:288px}.dga-mr-72{margin-right:288px}.dga-mt-72{margin-top:288px}.dga-mb-72{margin-bottom:288px}.dga-spacing-hor-80{height:320px}.dga-spacing-vert-80{width:320px}.dga-p-80{padding:320px}.dga-px-80{padding-inline:320px}.dga-py-80{padding-block:320px}.dga-pl-80{padding-left:320px}.dga-pr-80{padding-right:320px}.dga-pt-80{padding-top:320px}.dga-pb-80{padding-bottom:320px}.dga-mx-80{margin-inline:320px}.dga-my-80{margin-block:320px}.dga-ml-80{margin-left:320px}.dga-mr-80{margin-right:320px}.dga-mt-80{margin-top:320px}.dga-mb-80{margin-bottom:320px}.dga-spacing-hor-88{height:352px}.dga-spacing-vert-88{width:352px}.dga-p-88{padding:352px}.dga-px-88{padding-inline:352px}.dga-py-88{padding-block:352px}.dga-pl-88{padding-left:352px}.dga-pr-88{padding-right:352px}.dga-pt-88{padding-top:352px}.dga-pb-88{padding-bottom:352px}.dga-mx-88{margin-inline:352px}.dga-my-88{margin-block:352px}.dga-ml-88{margin-left:352px}.dga-mr-88{margin-right:352px}.dga-mt-88{margin-top:352px}.dga-mb-88{margin-bottom:352px}.dga-spacing-hor-96{height:384px}.dga-spacing-vert-96{width:384px}.dga-p-96{padding:384px}.dga-px-96{padding-inline:384px}.dga-py-96{padding-block:384px}.dga-pl-96{padding-left:384px}.dga-pr-96{padding-right:384px}.dga-pt-96{padding-top:384px}.dga-pb-96{padding-bottom:384px}.dga-mx-96{margin-inline:384px}.dga-my-96{margin-block:384px}.dga-ml-96{margin-left:384px}.dga-mr-96{margin-right:384px}.dga-mt-96{margin-top:384px}.dga-mb-96{margin-bottom:384px}.dga-spacing-hor-104{height:416px}.dga-spacing-vert-104{width:416px}.dga-p-104{padding:416px}.dga-px-104{padding-inline:416px}.dga-py-104{padding-block:416px}.dga-pl-104{padding-left:416px}.dga-pr-104{padding-right:416px}.dga-pt-104{padding-top:416px}.dga-pb-104{padding-bottom:416px}.dga-mx-104{margin-inline:416px}.dga-my-104{margin-block:416px}.dga-ml-104{margin-left:416px}.dga-mr-104{margin-right:416px}.dga-mt-104{margin-top:416px}.dga-mb-104{margin-bottom:416px}.dga-spacing-hor-112{height:448px}.dga-spacing-vert-112{width:448px}.dga-p-112{padding:448px}.dga-px-112{padding-inline:448px}.dga-py-112{padding-block:448px}.dga-pl-112{padding-left:448px}.dga-pr-112{padding-right:448px}.dga-pt-112{padding-top:448px}.dga-pb-112{padding-bottom:448px}.dga-mx-112{margin-inline:448px}.dga-my-112{margin-block:448px}.dga-ml-112{margin-left:448px}.dga-mr-112{margin-right:448px}.dga-mt-112{margin-top:448px}.dga-mb-112{margin-bottom:448px}.dga-spacing-hor-120{height:480px}.dga-spacing-vert-120{width:480px}.dga-p-120{padding:480px}.dga-px-120{padding-inline:480px}.dga-py-120{padding-block:480px}.dga-pl-120{padding-left:480px}.dga-pr-120{padding-right:480px}.dga-pt-120{padding-top:480px}.dga-pb-120{padding-bottom:480px}.dga-mx-120{margin-inline:480px}.dga-my-120{margin-block:480px}.dga-ml-120{margin-left:480px}.dga-mr-120{margin-right:480px}.dga-mt-120{margin-top:480px}.dga-mb-120{margin-bottom:480px}.dga-radius-small{border-radius:2px}.dga-radius-small-t{border-radius:2px 2px 0 0}.dga-radius-small-tl{border-radius:2px 0px 0 0}.dga-radius-small-tr{border-radius:0px 2px 0 0}.dga-radius-small-b{border-radius:0 0 2px 2px}.dga-radius-small-bl{border-radius:0 0 2px 0px}.dga-radius-small-br{border-radius:0 0 0px 2px}.dga-radius-medium{border-radius:4px}.dga-radius-medium-t{border-radius:4px 4px 0 0}.dga-radius-medium-tl{border-radius:4px 0px 0 0}.dga-radius-medium-tr{border-radius:0px 4px 0 0}.dga-radius-medium-b{border-radius:0 0 4px 4px}.dga-radius-medium-bl{border-radius:0 0 4px 0px}.dga-radius-medium-br{border-radius:0 0 0px 4px}.dga-radius-large{border-radius:8px}.dga-radius-large-t{border-radius:8px 8px 0 0}.dga-radius-large-tl{border-radius:8px 0px 0 0}.dga-radius-large-tr{border-radius:0px 8px 0 0}.dga-radius-large-b{border-radius:0 0 8px 8px}.dga-radius-large-bl{border-radius:0 0 8px 0px}.dga-radius-large-br{border-radius:0 0 0px 8px}.dga-radius-xlarge{border-radius:12px}.dga-radius-xlarge-t{border-radius:12px 12px 0 0}.dga-radius-xlarge-tl{border-radius:12px 0px 0 0}.dga-radius-xlarge-tr{border-radius:0px 12px 0 0}.dga-radius-xlarge-b{border-radius:0 0 12px 12px}.dga-radius-xlarge-bl{border-radius:0 0 12px 0px}.dga-radius-xlarge-br{border-radius:0 0 0px 12px}.dga-radius-none{border-radius:0px}.dga-radius-circular{border-radius:100%}.dga-flex{display:flex}.dga-flex-column{display:flex;flex-direction:column}.dga-flex-center{display:flex;align-items:center;justify-content:center}.dga-flex-center-y{display:flex;align-items:center}.dga-flex-center-x{display:flex;justify-content:center}.dga-flex-between{display:flex;justify-content:space-between}.dga-flex-wrap{flex-wrap:wrap}.dga-flex-align-stretch{align-items:stretch}.dga-flex-align-start{align-items:flex-start}.dga-flex-align-end{align-items:flex-end}.dga-flex-justify-end{justify-content:flex-end}.dga-flex-justify-start{justify-content:flex-start}.dga-text-right{text-align:right}.dga-text-left{text-align:left}.dga-text-center{text-align:center}.dga-shadow-xs{box-shadow:var(--shadow-xs)}.dga-shadow-sm{box-shadow:var(--shadow-sm)}.dga-shadow-md{box-shadow:var(--shadow-md)}.dga-shadow-lg{box-shadow:var(--shadow-lg)}.dga-shadow-xl{box-shadow:var(--shadow-xl)}.dga-shadow-2xl{box-shadow:var(--shadow-2xl)}.dga-shadow-3xl{box-shadow:var(--shadow-3xl)}.dga-ver-divider{width:1px;height:48px;background:var(--colors-alpha-alpha-black-20);margin-inline:var(--spacing-xl)}@media only screen and (max-width: 37.5em){.dga-xs-hide{display:none}}.dga-flex-justify-start{justify-content:start}.dga-flex-justify-end{justify-content:end}.dga-flex-justify-center{justify-content:center}.dga-flex-justify-between{justify-content:between}.dga-flex-justify-around{justify-content:around}.dga-flex-align-start{align-items:start}.dga-flex-align-end{align-items:end}.dga-flex-align-center{align-items:center}.dga-flex-align-stretch{align-items:stretch}.circular-progress-bar{position:relative;width:fit-content}.circular-progress-bar .circular-progress-bar__label{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:max-content}.circular-progress-bar .circular-progress-bar__label--text{color:var(--text-primary-paragraph);text-align:center}.circular-progress-bar .circular-progress-bar__label--text.success{color:var(--text-success) !important}.circular-progress-bar .circular-progress-bar__label--text.error{color:var(--text-error) !important}.circular-progress-bar .circular-progress-bar__label--icon.hgi-checkmark-circle-02{color:var(--icon-success)}.circular-progress-bar .circular-progress-bar__label--icon.hgi-multiplication-sign-circle{color:var(--icon-error)}.circular-progress-bar[aria-size=\"200px\"] .circular-progress-bar__label{text-align:center}.circular-progress-bar[aria-size=\"200px\"] .circular-progress-bar__label--percentage{color:var(--text-primary-paragraph)}.circular-progress-bar[aria-size=\"200px\"] .circular-progress-bar__label--text{text-align:center}.circular-progress-bar[aria-size=\"200px\"] .circular-progress-bar__label--icon{font-size:64px}.circular-progress-bar[aria-size=\"160px\"] .circular-progress-bar__label{text-align:center}.circular-progress-bar[aria-size=\"160px\"] .circular-progress-bar__label--percentage{color:var(--text-primary-paragraph)}.circular-progress-bar[aria-size=\"160px\"] .circular-progress-bar__label--icon{font-size:48px}.circular-progress-bar[aria-size=\"120px\"] .circular-progress-bar__label{text-align:center}.circular-progress-bar[aria-size=\"120px\"] .circular-progress-bar__label--percentage{color:var(--text-primary-paragraph)}.circular-progress-bar[aria-size=\"120px\"] .circular-progress-bar__label--icon{font-size:40px}.circular-progress-bar[aria-size=\"80px\"] .circular-progress-bar__label{text-align:center}.circular-progress-bar[aria-size=\"80px\"] .circular-progress-bar__label--percentage{color:var(--text-primary-paragraph)}.circular-progress-bar[aria-size=\"80px\"] .circular-progress-bar__label--text{display:none}.circular-progress-bar[aria-size=\"80px\"] .circular-progress-bar__label--icon{font-size:32px}.circular-progress-bar[aria-size=\"64px\"] .circular-progress-bar__label{text-align:center}.circular-progress-bar[aria-size=\"64px\"] .circular-progress-bar__label--percentage{color:var(--text-primary-paragraph)}.circular-progress-bar[aria-size=\"64px\"] .circular-progress-bar__label--text{display:none}.circular-progress-bar[aria-size=\"64px\"] .circular-progress-bar__label--icon{font-size:24px}.track{stroke:var(--background-neutral-100)}.tail--primary,.tail--success{stroke:var(--background-primary) !important}.tail--error{stroke:var(--background-error) !important}.tail--neutral{stroke:var(--button-background-black-selected) !important}";
 
@@ -22,7 +23,7 @@ const DgaCircularProgressBar = class {
         const radius = (this.sizes[this.size] - strokeWidth) / 2;
         const dashArray = 2 * Math.PI * radius;
         const dashOffset = dashArray * (1 - this.percentage / 100);
-        return (h("div", { key: 'e37e0ea67750fef5535663a11ea279db7fa26454', class: "circular-progress-bar", "aria-size": this.size, dir: this.RTL ? 'rtl' : 'ltr' }, h("div", { key: '026b717cfa4615502652e44fd2ac505ad73aefef', class: "circular-progress-bar__label" }, this.variant === 'success' && h("dga-icon", { key: 'd84686dbccc514155d5b3be72cf2a9d313f29d1a', name: "checkmark-circle-02", variant: "solid", size: 20 }), this.variant === 'error' && h("dga-icon", { key: 'c43a9bd393964b007a0912f5a740be20211036b3', name: "multiplication-sign-circle", variant: "solid", size: 20 }), this.variant !== 'success' && this.variant !== 'error' && h("h4", { key: 'be8f41389df617410af3e2010ba4997e2119d599', class: "circular-progress-bar__label--percentage" }, this.percentage, "%"), this.text && h("h5", { key: '229ba0e2f5a8c79775f459227509860482cfe3aa', class: `circular-progress-bar__label--text ${this.variant}` }, this.text)), h("svg", { key: '0a549076968dd040d85725fa197e864cba53a56c', width: this.sizes[this.size], height: this.sizes[this.size], viewBox: `0 0 ${this.sizes[this.size]} ${this.sizes[this.size]}` }, h("circle", { key: '90ef67df6cd8c18e7f55ab975eab24c54ad6a5bb', class: "track", fill: "none", stroke: "#e6e6e6", r: radius, cx: this.sizes[this.size] / 2, cy: this.sizes[this.size] / 2, "stroke-width": strokeWidth }), h("circle", { key: '66e5dfedb38baf33bf96a30ad6f3381dfea390b8', 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(-180 ${this.sizes[this.size] / 2} ${this.sizes[this.size] / 2})`, style: {
+        return (h("div", { key: 'e19eea82b29577b3b5a10744310baeb68bd065f4', class: "circular-progress-bar", "aria-size": this.size, dir: this.RTL ? 'rtl' : 'ltr' }, h("div", { key: '4debad3d859108b85e7aabfb13dc070f78aa22a5', class: "circular-progress-bar__label" }, this.variant === 'success' && h("dga-icon", { key: '04e3531bdb853df778c2fd9baa460ef4eb1b5e63', icon: checkmarkCircle02SolidRoundedIcon, size: 20 }), this.variant === 'error' && h("dga-icon", { key: 'fff85de7aa2b8805f077809d7c0380c1ac517d1d', icon: multiplicationSignCircleSolidRoundedIcon, size: 20 }), this.variant !== 'success' && this.variant !== 'error' && h("h4", { key: 'd261b201b5fb077a67afc7c6a24206aa1e9ea4f8', class: "circular-progress-bar__label--percentage" }, this.percentage, "%"), this.text && h("h5", { key: '41561b7f2b2610e8e24da433dc56e5e6f3297c2f', class: `circular-progress-bar__label--text ${this.variant}` }, this.text)), h("svg", { key: '904e53f8b7a900e66d33eaa0da2604ea9e6fa10d', width: this.sizes[this.size], height: this.sizes[this.size], viewBox: `0 0 ${this.sizes[this.size]} ${this.sizes[this.size]}` }, h("circle", { key: 'e11d4f89a63659d2fb29f9b49a07453bfac3a519', class: "track", fill: "none", stroke: "#e6e6e6", r: radius, cx: this.sizes[this.size] / 2, cy: this.sizes[this.size] / 2, "stroke-width": strokeWidth }), h("circle", { key: '58ce3b502c3a46420b12ce66690f82dc2dff5bce', 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(-180 ${this.sizes[this.size] / 2} ${this.sizes[this.size] / 2})`, style: {
                 transition: 'stroke-dashoffset 0.5s ease',
             } }))));
     }

package/dist/esm/dga-codesnippet-usage.entry.js

@@ -42,7 +42,7 @@ h1 {
         };
     }
     render() {
-        return (h("div", { key: '2495952fc099cd49bbe9c944a0c72cbe361f95c2', style: { width: '743px', display: 'flex', flexDirection: 'column', gap: '123px', margin: "10px" } }, h("dga-codesnippet", { key: '0e44856df146301250293886bf7f72559a307945', showButton: true, type: "multi-line", showSidebar: true, showTabList: true, snippets: this.snippets }), h("dga-codesnippet", { key: '506281976e85130c5579ddc514b32efdea08a60b', showButton: false, type: "single", showSidebar: false, showTabList: false, snippets: this.snippetLine })));
+        return (h("div", { key: 'abf10905425e4a5e0c12f9e93c313b307eefa880', style: { width: '743px', display: 'flex', flexDirection: 'column', gap: '123px', margin: "10px" } }, h("dga-codesnippet", { key: '74ccaca04097c1a01655d67153b28c75b841476a', showButton: true, type: "multi-line", showSidebar: true, showTabList: true, snippets: this.snippets }), h("dga-codesnippet", { key: 'd2a4a47ae4cc603834ee0b87961b71ba03d66066', showButton: false, type: "single", showSidebar: false, showTabList: false, snippets: this.snippetLine })));
     }
 };
 

package/dist/esm/dga-codesnippet.entry.js

@@ -39,17 +39,17 @@ const CodeSnippet = class {
         }
     }
     render() {
-        return (h("div", { key: 'c8b8f6966d3a5697d391710ec7c49a7c7812d6dc', class: "code-snippet-container" }, this.showTabList && (h("div", { key: 'e12158c24ef3271e4d42ae37d59b3295d59bcb6b', class: "code-snippet-tabs" }, h("dga-tabs", { key: 'b34b729e67baf2ebf06059bda346422a07e73604', divider: true, orientation: "horizontal", size: "lg", tabsList: Object.keys(this.snippets).map(tab => ({
+        return (h("div", { key: 'e7653cd02a9bfef1e634bcde97ca4071ad053903', class: "code-snippet-container" }, this.showTabList && (h("div", { key: 'eeb88c21e84685c1a0962df44b57cf9b84d9a196', class: "code-snippet-tabs" }, h("dga-tabs", { key: 'd957965b304b1f5f795bcee249574adeb211e5c2', divider: true, orientation: "horizontal", size: "lg", tabsList: Object.keys(this.snippets).map(tab => ({
                 label: tab,
                 onClick: () => this.handleTabClick(tab),
-            })) }))), h("pre", { key: 'c27a625639f0331d7d062de7867d58baa7b5f343', class: "code-snippet-code-display" }, h("dga-button-v2", { key: 'c3e27261b30dbe7f50636a5f2dea31fc9dc7c9b0', size: "lg", iconOnly: true, variant: 'subtle', leadIcon: true, leadIconProps: {
+            })) }))), h("pre", { key: '80a8983dcf3e98ce0d751c8e1a548b5ef75c89be', class: "code-snippet-code-display" }, h("dga-button-v2", { key: '7d4215c943bb965eb46116b6e832e53bbf318bf3', size: "lg", iconOnly: true, variant: 'subtle', leadIcon: true, leadIconProps: {
                 name: 'copy-01',
                 size: 24,
                 color: '#161616',
                 variant: 'stroke',
-            }, class: `code-snippet-icon ${this.type}`, onClick: () => this.handleCopy(), onColor: false }), h("code", { key: 'cf5a2a615b327b37e1e1cbd29ad9fedc6b78b2d9', style: {
+            }, class: `code-snippet-icon ${this.type}`, onClick: () => this.handleCopy(), onColor: false }), h("code", { key: 'b3b0132873647ca920fdd88f0060b31d7e562018', style: {
                 height: this.showButton && this.type === 'multi-line' && !this.showMore ? '150px' : 'auto',
-            } }, this.renderWithLineNumbers(this.snippets[this.activeTab])), this.showButton && this.type === 'multi-line' && (h("div", { key: '5935a319d08f6d09a09aedd0d92dcda804d27885', class: "code-snippet-wrapper" }, h("dga-button-v2", { key: '5b6a869a8930a807c2a4f95b8a5c4cba95643b4a', label: this.showMore ? 'Show Less' : 'Show More', size: "md", trailIcon: true, variant: 'subtle', trailIconProps: { name: !this.showMore ? 'arrow-down-01' : 'arrow-up-01', size: 20, color: '#161616', variant: 'stroke' }, onClick: () => (this.showMore = !this.showMore), onColor: false }))))));
+            } }, this.renderWithLineNumbers(this.snippets[this.activeTab])), this.showButton && this.type === 'multi-line' && (h("div", { key: 'be3fc5e867acc53320f6015ea85b92b6f3715230', class: "code-snippet-wrapper" }, h("dga-button-v2", { key: '102edbfd001741c2913ef59bd7708454b428ac6c', label: this.showMore ? 'Show Less' : 'Show More', size: "md", trailIcon: true, variant: 'subtle', trailIconProps: { name: !this.showMore ? 'arrow-down-01' : 'arrow-up-01', size: 20, color: '#161616', variant: 'stroke' }, onClick: () => (this.showMore = !this.showMore), onColor: false }))))));
     }
 };
 CodeSnippet.style = styleCss;

package/dist/esm/dga-collapse-usage.entry.js

@@ -7,7 +7,7 @@ const DgaCollapseUsage = class {
         this.open = false;
     }
     render() {
-        return (h("div", { key: 'd3b2e5298745abc5b3beaeeb41f77d9927bc545c' }, h("h1", { key: 'c879a0a0e2dc04a4720b814d5be4af91b21bb756' }, "Collapse Example"), h("div", { key: 'a4f762ca7357b88015ef502777a4468f0d02d146', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: 'd3a7c6b9dfe4deb6d2a4aa84c4ee07abd21d07c7', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("div", { key: '0ddbc4f3c06045813e1947b1b62ba8aee81edbbb', style: { display: "flex", justifyContent: "center" } }, h("button", { key: 'a0dd15348658675b591c091fed9fc0183673fa36', onClick: () => this.open = true }, "open"), h("button", { key: '89b988db7137e841f014f08a826dc9d4a409bb23', onClick: () => this.open = false }, "close"))), h("dga-collapse", { key: '74136f23c5fee4fe783b2d612972364fe285b19d', open: this.open, "transition-duration": "0.1s" }, h("div", { key: 'ed0c18aabf300cf8aefc5c19bf18d72e4ba4e28c' }, "Your content here")), h("div", { key: '2e2f4fa69bc78c5c7939540e17c4a064bf28fe08', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+        return (h("div", { key: 'e3bee751f056ea024d448e6d3d6de84648ec0f87' }, h("h1", { key: 'aabf8052cb17f6933e3e4ba6f90bf0f9aaddb718' }, "Collapse Example"), h("div", { key: '4befebde255ad9a58e6cbc63b02876b1e778b26e', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: 'd83ee2ed4d85b6febc0a8f0bc8979df674c7909c', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("div", { key: 'e718b88c384153ab0f5affe656e442677a12e4f6', style: { display: "flex", justifyContent: "center" } }, h("button", { key: '8f1ed1190335950e939a6b1dfb3a8c114d5c2ab2', onClick: () => this.open = true }, "open"), h("button", { key: '8ddc2e84fc3ffe2ce1c07da88edf4adee22d215f', onClick: () => this.open = false }, "close"))), h("dga-collapse", { key: 'a48c933c61c2ceb142ffd6ad7c36e229f14825cb', open: this.open, "transition-duration": "0.1s" }, h("div", { key: '49ec3f0b4def0c80d3668e04d2ed35c53a73ca92' }, "Your content here")), h("div", { key: '18da42c79de9fa051dcfef9796358796c10c31f3', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
 };
 

package/dist/esm/dga-collapse.entry.js

@@ -37,7 +37,7 @@ const DgaCollapse = class {
     }
     render() {
         const styles = Object.assign(Object.assign({ overflow: 'hidden', transition: `height ${this.transitionDuration} ${this.transitionType}`, height: `${this.height}px` }, (this.height === 'auto' ? { height: 'auto' } : {})), this.customStyle);
-        return (h("div", { key: '9715bed0f6b0c892fc33ea1264b010a47e8876c3', ref: (el) => this.containerRef = el, "aria-hidden": !this.open, style: styles }, h("slot", { key: '2b7465b46183841607468dd39d13ec3d4b356ca6' })));
+        return (h("div", { key: 'b9bac899c18eaaed83b77a6a806c3cfb6b01aa7f', ref: (el) => this.containerRef = el, "aria-hidden": !this.open, style: styles }, h("slot", { key: '2686d02d09c2c6a5b83ff4aee5820d1d8660df6f' })));
     }
     static get watchers() { return {
         "open": ["watchOpen"]

package/dist/esm/dga-content-switcher-usage.entry.js

@@ -6,7 +6,7 @@ const DgaContentSwitcherUsage = class {
         this.value = 0;
     }
     render() {
-        return (h("div", { key: 'e5104b4d630d3b118f6dd30b1da276fcce84c50a' }, h("h1", { key: 'd98541cf5388f924495f708e1f846a9aca031ccd' }, "Content Switcher Example"), h("dga-content-switcher", { key: '49eb8f30e1e3ceae5a624ba3115d53687b64180b', size: 'lg' }, h("dga-content-switcher-item", { key: 'b4364a84a75f274b20a6f8eee862447da688781e', label: "Option 1", content: "This is Option 1 content." }), h("dga-content-switcher-item", { key: '056e135b85921fddfe040b11b66dd231c572bfe6', label: "Option 2", content: "This is Option 2 content." }), h("dga-content-switcher-item", { key: 'ef7a3ec077e5035a70ae31e25d1d2f5edaf77b16', label: "Option 3", content: "This is Option 3 content." })), h("dga-content-switcher", { key: 'a45ef152bc369395dff8be6755797b2a2871fe5f', size: 'md' }, h("dga-content-switcher-item", { key: '62a8ed8a115307a013b923722b058c0c34663639', label: "Option 1", content: "This is Option 1 content." }), h("dga-content-switcher-item", { key: '2f0c5788b2c0869f1b99f977ed1a3a9f5dd21f63', label: "Option 2", content: "This is Option 2 content." }), h("dga-content-switcher-item", { key: '6e5786df4d0d99c1acc48282fb2c1bf882287379', label: "Option 3", content: "This is Option 3 content." })), h("dga-content-switcher", { key: '16c7d72a429714b729e0e1ba9738a49632f322ba', size: 'sm', onColor: true }, h("dga-content-switcher-item", { key: 'b8c13063709014c4fb2d4656c564a12b70494c72', label: "Option 1", content: "This is Option 1 content." }), h("dga-content-switcher-item", { key: 'e0cab2e632b7dd3b2ce2fb395cbb7c58f1496d8d', label: "Option 2", content: "This is Option 2 content." }), h("dga-content-switcher-item", { key: '5d4ee6abef8fc26a6cabef5c3ecb61bc04b9dcd7', label: "Option 3", content: "This is Option 3 content." })), h("h1", { key: '0a34fb11392c13d107312bed18ec5b9c54a19cd3' }, this.value), h("dga-content-switcher", { key: 'e5ed548f151f676e8452d81dab191c10d930b65e', size: 'lg', value: this.value, onChange: (val) => this.value = val }), h("dga-content-switcher-panel", { key: '9f9851a92492052703233663285cf35f34e5cc7e', value: this.value, index: 0 }, h("div", { key: 'a56ae2a23480a8a8314205fa1df631a856c8051c' }, "Content 111111111111111")), h("dga-content-switcher-panel", { key: 'bd8d627d3c96b4195701a4a883f757834a73d946', value: this.value, index: 1 }, h("div", { key: '12874ec6da27e1f27e3974259c66bfb0bf9313ea' }, "Content 2")), h("dga-content-switcher-panel", { key: '031145a1f5447e1145ea6d0bd8f8d4b8e2ab5b08', value: this.value, index: 2 }, h("div", { key: 'e00c1d9a5e3f8809874602da3ada8fa0cd773a7d' }, "Content 3"))));
+        return (h("div", { key: 'ff6f06a48beb31f77b03b29c94c20aaf15839fe4' }, h("h1", { key: 'a859e1607df51e4ae47823d1998b6423a5d77f12' }, "Content Switcher Example"), h("dga-content-switcher", { key: '898b87f7cf50186962387ca79901fa6fc26600f9', size: 'lg' }, h("dga-content-switcher-item", { key: '7d3937fa841f9b36fd6863bf82b3b0b00e4d0e45', label: "Option 1", content: "This is Option 1 content." }), h("dga-content-switcher-item", { key: '10887340f0b9195043b46eee51e187477493f64c', label: "Option 2", content: "This is Option 2 content." }), h("dga-content-switcher-item", { key: '86bbd190d86ee92f990a71d5765eb83a46d04c28', label: "Option 3", content: "This is Option 3 content." })), h("dga-content-switcher", { key: '5f7b9a50667c7a2079cc9c130dbe7953c6caf13f', size: 'md' }, h("dga-content-switcher-item", { key: '6f04f9b712e1938c3e1eca7cfae5c8a657475194', label: "Option 1", content: "This is Option 1 content." }), h("dga-content-switcher-item", { key: '8f661c3bf7d322c9991ddcfef274c287f9b53a91', label: "Option 2", content: "This is Option 2 content." }), h("dga-content-switcher-item", { key: '10c097a416a2db374581b33e4c252a1b958483de', label: "Option 3", content: "This is Option 3 content." })), h("dga-content-switcher", { key: '55f8a866107735d2724935d748964b77d973d9ab', size: 'sm', onColor: true }, h("dga-content-switcher-item", { key: '3c55a8c5e96ac68d5b67fd8ad9a8412a61735849', label: "Option 1", content: "This is Option 1 content." }), h("dga-content-switcher-item", { key: '7b07f707c790fdb350a36e9d250c68a05068d443', label: "Option 2", content: "This is Option 2 content." }), h("dga-content-switcher-item", { key: '135a88646d6166c8f66e6c2121b5eadd89fbcaa2', label: "Option 3", content: "This is Option 3 content." })), h("h1", { key: '7e6104390c9a4259ddda9e33fb0909b794ca109f' }, this.value), h("dga-content-switcher", { key: 'f01419a1297d52354c46baf43cc08a89674715e1', size: 'lg', value: this.value, onChange: (val) => this.value = val }), h("dga-content-switcher-panel", { key: '2762412766a32675af8d8b7d037595b38e2acac8', value: this.value, index: 0 }, h("div", { key: '9c6fa488524742f2752f5377dfdcef3bf6e62778' }, "Content 111111111111111")), h("dga-content-switcher-panel", { key: '52c04bae89f1abd16c7e3e366a397ab759f076e4', value: this.value, index: 1 }, h("div", { key: 'de919c0313389d9d8e4c5de838ba9abcb8cc18bd' }, "Content 2")), h("dga-content-switcher-panel", { key: '56594477da9c7b46b7e2c99316e49d9d38c4c8c9', value: this.value, index: 2 }, h("div", { key: '98ddec066302ff88661834e83d1d29090987307f' }, "Content 3"))));
     }
 };
 

package/dist/esm/dga-content-switcher_3.entry.js

@@ -28,7 +28,7 @@ const DgaContentSwitcher = class {
         };
     }
     render() {
-        return (h("div", { key: '224b50a52ff908b5ac25889adbb2447314ee83e0', class: "content-switcher" }, h("div", { key: 'c09f715a4127180acc5a47d7a4a3a1e4cabeedaf', class: "content-switcher__items" }, this.items.map((item, index) => {
+        return (h("div", { key: '8eeaed1bb66e6030793111fa46c14032ba1056fd', class: "content-switcher" }, h("div", { key: '7a9d7bcb4aba55703e6a7b16b7903007a0f87238', class: "content-switcher__items" }, this.items.map((item, index) => {
             const selected = index === this.selected;
             const itemType = index === 0 ? 'first' : index === this.items.length - 1 ? 'last' : 'mid';
             const className = `content-switcher__item content-switcher__item--${itemType} ${this.onColor ? 'content-switcher__item--on-color' : ''} content-switcher__item--${this.size} ${selected ? 'content-switcher__item--selected' : ''}`;
@@ -42,7 +42,7 @@ const DgaContentSwitcherItem = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return h("slot", { key: '98721cdda8e2c8e9386f1d1bf5f67c5745f580b1' });
+        return h("slot", { key: '44990e27f2aad3127b4df028976b38ec87ec92c5' });
     }
 };
 
@@ -51,7 +51,7 @@ const DgaContentSwitcherPanel = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h("div", { key: 'dc4acdb1cb410fa9b98033c237a3512f36feaebf', class: "content-switcher-panel", hidden: this.value !== this.index }, h("slot", { key: 'da6642b7fb04e23668b84593d70f1d6881f63d8b' })));
+        return (h("div", { key: 'a22c2f91076dd8135722c0f1e618b769af067cb7', class: "content-switcher-panel", hidden: this.value !== this.index }, h("slot", { key: 'dbb50bb83bb6770d1714280ff30ea6e858c31a2e' })));
     }
 };
 

package/dist/esm/dga-data-table-usage.entry.js

@@ -6,7 +6,7 @@ const DgaDateFieldUsage = class {
         this.value = '';
     }
     render() {
-        return (h("div", { key: '4a966af0678e0aeae7ca40589118f49d2104dff7' }, h("h1", { key: '827019410828d74f2b637573baaa82b5333df531' }, "Date Field Example"), h("div", { key: '748a2518c18cb0bf5d1b6f88eca3b7f3fd7e996c', style: { padding: '50px' } }, h("div", { key: 'b6b94257b16fd991b83ab83a70635a13514606ec', style: { display: 'flex', flexDirection: 'column', gap: '16px' } }, h("dga-data-table", { key: '88c3f44778987104bee445643c1331aec4a86c84', cells: [
+        return (h("div", { key: '810bae158ef077da2ee827fd53fe55b09c46cc36' }, h("h1", { key: '54b812c6333913cb0b4b4c1c097e155e5929043b' }, "Date Field Example"), h("div", { key: 'ea62559b37226897da2b0f5f3ba1957fb8059317', style: { padding: '50px' } }, h("div", { key: 'feef0a2caaca75a5c2fd0a6a07f8274ae2efdd41', style: { display: 'flex', flexDirection: 'column', gap: '16px' } }, h("dga-data-table", { key: '32767430dda85dcfaeed3316c3455aa5df79e7d3', cells: [
                 {
                     colSpan: 1,
                     isFilter: true,

package/dist/esm/dga-data-table.entry.js

@@ -1,4 +1,5 @@
 import { r as registerInstance, h } from './index-B4CGwdkg.js';
+import { s as sortByUp02StrokeRoundedIcon, b as sortByDown02StrokeRoundedIcon, f as filterStrokeRoundedIcon } from './index-BYA91_SW.js';
 
 var __rest = (undefined && undefined.__rest) || function (s, e) {
     var t = {};
@@ -180,10 +181,10 @@ const DgaDataTable = class {
     //     };
     render() {
         console.log(this.sortedData, "this.sortedData");
-        return (h("div", { key: 'c5ea921d3d6e2e2243580ecdad7fccdd33c9006c', class: `table-wrapper ${this.contained ? 'table-contained' : ''}` }, h("table", { key: '3199bd207fa5b6380a7a81a25aa88b145994780a', class: ` azm-table ${this.contained ? 'table-contained' : ''}`, style: { direction: this.direction ? 'rtl' : 'ltr' } }, h("thead", { key: 'fd721a77cc6a1317ff7cfe51accb891d45b347cc' }, h("tr", { key: '2f512fed798c1dd2eba7bcd3b809e707beab30fe', class: `${this.rowDivider ? 'row-divider' : ''}` }, this.showSelectCheckBox && (h("th", { key: '8c7333bac1364db924628b7038de8ead3c7afb3d', style: { width: '20px' } }, h("dga-checkbox", { key: '87544b9e54f65d526f67970fb3c2ef75e28a39ee', showBorderOnFocusAndFocusOute: false, value: 'true', onChange: (event) => this.selectAll(event.target.checked) }))), this.cells.map((_a, index) => {
+        return (h("div", { key: 'ca80ee05b1e8811160d8b85bbb54f0208f77bfed', class: `table-wrapper ${this.contained ? 'table-contained' : ''}` }, h("table", { key: 'a8d003be75250e95b99ca4b3d1607e9401475556', class: ` azm-table ${this.contained ? 'table-contained' : ''}`, style: { direction: this.direction ? 'rtl' : 'ltr' } }, h("thead", { key: '53afb8f7b61363f1d562fa7085c87f1be580f5a2' }, h("tr", { key: 'dc7c8ff4a0f35ef093760750e82f6354e19d607e', class: `${this.rowDivider ? 'row-divider' : ''}` }, this.showSelectCheckBox && (h("th", { key: 'c00258e111a02335c07974e47aa5cc13d52a0dab', style: { width: '20px' } }, h("dga-checkbox", { key: '69b172e3261ed1cb4a6b1aa77cedf72ad03c3b20', showBorderOnFocusAndFocusOute: false, value: 'true', onChange: (event) => this.selectAll(event.target.checked) }))), this.cells.map((_a, index) => {
             var { sort, isSort, propertyName, type } = _a, header = __rest(_a, ["sort", "isSort", "propertyName", "type"]);
-            return (h("th", { key: index }, h("span", null, h("span", { class: "text" }, header.title), h("span", { class: "icon-wrapper" }, isSort && sort == 'up' && type == 'propertyName' && (h("button", { class: "dga-btn dga-btn--sort dga-btn--icon dga-btn--md", onClick: () => this.sortData('up', propertyName, index) }, h("dga-icon", { name: "sort-by-up-02", variant: 'stroke', type: 'rounded', size: 16 }))), isSort && (!sort || sort == 'down') && type == 'propertyName' && (h("button", { class: "dga-btn dga-btn--sort dga-btn--icon dga-btn--md", onClick: () => this.sortData('down', propertyName, index) }, h("dga-icon", { name: "sort-by-down-02", variant: 'stroke', type: 'rounded', size: 16 }))), header.isFilter && (h("button", { class: "dga-btn dga-btn--sort dga-btn--icon dga-btn--md ", onClick: () => this.pressOnFilter && this.pressOnFilter(propertyName) }, h("dga-icon", { name: "filter", variant: 'stroke', type: 'rounded', size: 16 })))))));
-        }))), h("tbody", { key: 'e9f5104ca53e1066cfa55957b23ff8c10004fd79' }, this.sortedData.map((row, rowIndex) => (h("tr", { class: `${this.rowDivider ? 'row-divider' : ''} ${this.alternate ? 'alternate' : ''} ${row.selected ? 'row-selected' : ''} `, key: rowIndex }, this.showSelectCheckBox && (h("td", null, h("dga-checkbox", { name: rowIndex + 'checkboxSelection', value: row.selected, id: rowIndex + 'checkboxSelection', showBorderOnFocusAndFocusOute: false, onChange: event => this.handleSelectedRowChanges(event.target.checked, rowIndex), checked: row.selected }))), this.cells.map((_a, cellIndex) => {
+            return (h("th", { key: index }, h("span", null, h("span", { class: "text" }, header.title), h("span", { class: "icon-wrapper" }, isSort && sort == 'up' && type == 'propertyName' && (h("button", { class: "dga-btn dga-btn--sort dga-btn--icon dga-btn--md", onClick: () => this.sortData('up', propertyName, index) }, h("dga-icon", { icon: sortByUp02StrokeRoundedIcon, size: 16 }))), isSort && (!sort || sort == 'down') && type == 'propertyName' && (h("button", { class: "dga-btn dga-btn--sort dga-btn--icon dga-btn--md", onClick: () => this.sortData('down', propertyName, index) }, h("dga-icon", { icon: sortByDown02StrokeRoundedIcon, size: 16 }))), header.isFilter && (h("button", { class: "dga-btn dga-btn--sort dga-btn--icon dga-btn--md ", onClick: () => this.pressOnFilter && this.pressOnFilter(propertyName) }, h("dga-icon", { icon: filterStrokeRoundedIcon, size: 16 })))))));
+        }))), h("tbody", { key: 'cc476bc9fc8888f2466bfdbef2711523b17e3de7' }, this.sortedData.map((row, rowIndex) => (h("tr", { class: `${this.rowDivider ? 'row-divider' : ''} ${this.alternate ? 'alternate' : ''} ${row.selected ? 'row-selected' : ''} `, key: rowIndex }, this.showSelectCheckBox && (h("td", null, h("dga-checkbox", { name: rowIndex + 'checkboxSelection', value: row.selected, id: rowIndex + 'checkboxSelection', showBorderOnFocusAndFocusOute: false, onChange: event => this.handleSelectedRowChanges(event.target.checked, rowIndex), checked: row.selected }))), this.cells.map((_a, cellIndex) => {
             var { El } = _a, cell = __rest(_a, ["El"]);
             return (h("td", { key: cellIndex, colSpan: cell.colSpan ? cell.colSpan : 1 }, cell.type === "element" && El ? (typeof El === 'string' ? (
             // Create element dynamically with props

package/dist/esm/dga-date-field-usage.entry.js

@@ -6,7 +6,7 @@ const DgaDateFieldUsage = class {
         this.value = '';
     }
     render() {
-        return (h("div", { key: 'fba1d4005b36659cc661e0570bd75f6dfb574800' }, h("h1", { key: 'a7cff21c850c63bc87f8a85d427e310b2051fb2f' }, "Date Field Example"), h("div", { key: 'a1054f44427d423ba41c16e33a705f5874ba3fcb', style: { padding: '50px' } }, h("div", { key: '03be4959e3469b462a13a387ece64396b95276cb', style: { display: "flex", flexDirection: "column", gap: "16px" } }, h("input", { key: '90a387e56cb47d5fc5896cc22381d81df2e31cff', type: "date", value: this.value, onChange: (e) => this.value = e.target.value }), h("dga-date-field", { key: '9b693c14042c18b7cc72b0513593ec09aa56bc1a', value: this.value, onChange: (e) => this.value = e.target.value })))));
+        return (h("div", { key: '65d405bc1f0e94a8ba70d819a62ccaf2d53f205d' }, h("h1", { key: 'd9dd3c1908d8b1cd70c0af078a68c71c05a4720a' }, "Date Field Example"), h("div", { key: '9d0aa0de8dc68b7890fbc1a541b8579f2a91242e', style: { padding: '50px' } }, h("div", { key: 'ed0d390b3ee39ec8959ef72391e7c20a29d9cc4d', style: { display: "flex", flexDirection: "column", gap: "16px" } }, h("input", { key: 'fb9574659d66cc7a87cefb85f397eb5a129fab1b', type: "date", value: this.value, onChange: (e) => this.value = e.target.value }), h("dga-date-field", { key: 'a2319a369cbc86d2990c7f256337587bc44bf66d', value: this.value, onChange: (e) => this.value = e.target.value })))));
     }
 };
 

package/dist/esm/dga-date-field.entry.js

@@ -1,6 +1,7 @@
 import { r as registerInstance, h } from './index-B4CGwdkg.js';
-import { g as guid } from './index-DEtoWGOc.js';
+import { g as guid } from './index-OZG1OajU.js';
 import { i as isValidDate, f as formatDate } from './dateUtils-BCtEZsUO.js';
+import { d as alertCircleSolidRoundedIcon } from './index-BYA91_SW.js';
 
 const dgaDateFieldCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,100..700;1,100..700&display=swap\"); @import url(\"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@100;200;300;400;500;600;700&display=swap\"); html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}:focus{outline:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:\"\";content:none}table{border-collapse:collapse;border-spacing:0}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{-webkit-appearance:none;-moz-appearance:none}input[type=search]{-webkit-appearance:none;-moz-appearance:none;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}textarea{overflow:auto;vertical-align:top;resize:vertical}audio,canvas,video{display:inline-block;zoom:1;max-width:100%}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}a:active,a:hover{outline:0}img{border:0;-ms-interpolation-mode:bicubic;}figure{margin:0}form{margin:0}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{border:0;padding:0;white-space:normal;*margin-left:-7px;}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align:middle;}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer;*overflow:visible;}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0;*height:13px;*width:13px;}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0}html,button,input,select,textarea{color:#222}::-moz-selection{background:#b3d4fc;text-shadow:none}::selection{background:#b3d4fc;text-shadow:none}img{vertical-align:middle}fieldset{border:0;margin:0;padding:0}textarea{resize:vertical}.chromeframe{margin:0.2em 0;background:#ccc;color:#000;padding:0.2em 0}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}*{box-sizing:border-box}body{margin:0}main{display:block}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}@font-face{font-family:\"IBMPlexSansArabic\";src:url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-Regular.woff2\") format(\"woff2\"), url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-Regular.woff\") format(\"woff\");font-weight:400;font-style:normal}@font-face{font-family:\"IBMPlexSansArabic\";src:url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-Medium.woff2\") format(\"woff2\"), url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-Medium.woff\") format(\"woff\");font-weight:500;font-style:normal}@font-face{font-family:\"IBMPlexSansArabic\";src:url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-SemiBold.woff2\") format(\"woff2\"), url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-SemiBold.woff\") format(\"woff\");font-weight:600;font-style:normal}@font-face{font-family:\"IBMPlexSansArabic\";src:url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-Bold.woff2\") format(\"woff2\"), url(\"/assets/fonts/IBM-Plex-Sans-Arabic/IBMPlexSansArabic-Bold.woff\") format(\"woff\");font-weight:700;font-style:normal;font-display:auto}body{font-family:\"IBMPlexSansArabic\"}a,a:active,a:focus{color:inherit;text-decoration:none}.display-2xl-regular{font:400 72px/90px \"IBMPlexSansArabic\"}.display-xl-regular{font:400 60px/72px \"IBMPlexSansArabic\"}.display-lg-regular{font:400 48px/60px \"IBMPlexSansArabic\"}.display-md-regular{font:400 36px/44px \"IBMPlexSansArabic\"}.display-sm-regular{font:400 30px/38px \"IBMPlexSansArabic\"}.display-xs-regular{font:400 24px/32px \"IBMPlexSansArabic\"}.text-xl-regular{font:400 20px/30px \"IBMPlexSansArabic\"}.text-lg-regular{font:400 18px/28px \"IBMPlexSansArabic\"}.text-md-regular,.input--lg .input__prefix-label,.input--lg .input__suffix-label,.input__prefix-label,.input__prefix-icon,.input__prefix-chevron,.input__suffix-label,.input__suffix-icon,.input__suffix-chevron,.input__field::placeholder,.input__field{font:400 16px/24px \"IBMPlexSansArabic\"}.text-sm-regular,.breadcrumb-dropdown-item,.input--md .input__prefix-label,.input--md .input__suffix-label,.input--md .input__field,.input--md .input__field::placeholder,.input--lg .input__field,.input--lg .input__field::placeholder,.input__prefix .dropdown__label--selection,.input__suffix .dropdown__label--selection,.dga-form-control>.dga-label{font:400 14px/20px \"IBMPlexSansArabic\"}.text-xs-regular{font:400 12px/18px \"IBMPlexSansArabic\"}.text-2xs-regular{font:400 10px/14px \"IBMPlexSansArabic\"}.display-2xl-medium{font:500 72px/90px \"IBMPlexSansArabic\"}.display-xl-medium{font:500 60px/72px \"IBMPlexSansArabic\"}.display-lg-medium{font:500 48px/60px \"IBMPlexSansArabic\"}.display-md-medium{font:500 36px/44px \"IBMPlexSansArabic\"}.display-sm-medium{font:500 30px/38px \"IBMPlexSansArabic\"}.display-xs-medium{font:500 24px/32px \"IBMPlexSansArabic\"}.text-xl-medium{font:500 20px/30px \"IBMPlexSansArabic\"}.text-lg-medium{font:500 18px/28px \"IBMPlexSansArabic\"}.text-md-medium{font:500 16px/24px \"IBMPlexSansArabic\"}.text-sm-medium{font:500 14px/20px \"IBMPlexSansArabic\"}.text-xs-medium{font:500 12px/18px \"IBMPlexSansArabic\"}.text-2xs-medium{font:500 10px/14px \"IBMPlexSansArabic\"}.display-2xl-semibold{font:600 72px/90px \"IBMPlexSansArabic\"}.display-xl-semibold{font:600 60px/72px \"IBMPlexSansArabic\"}.display-lg-semibold{font:600 48px/60px \"IBMPlexSansArabic\"}.display-md-semibold{font:600 36px/44px \"IBMPlexSansArabic\"}.display-sm-semibold{font:600 30px/38px \"IBMPlexSansArabic\"}.display-xs-semibold{font:600 24px/32px \"IBMPlexSansArabic\"}.text-xl-semibold{font:600 20px/30px \"IBMPlexSansArabic\"}.text-lg-semibold{font:600 18px/28px \"IBMPlexSansArabic\"}.text-md-semibold{font:600 16px/24px \"IBMPlexSansArabic\"}.text-sm-semibold{font:600 14px/20px \"IBMPlexSansArabic\"}.text-xs-semibold{font:600 12px/18px \"IBMPlexSansArabic\"}.text-2xs-semibold{font:600 10px/14px \"IBMPlexSansArabic\"}.display-2xl-bold{font:700 72px/90px \"IBMPlexSansArabic\"}.display-xl-bold{font:700 60px/72px \"IBMPlexSansArabic\"}.display-lg-bold{font:700 48px/60px \"IBMPlexSansArabic\"}.display-md-bold{font:700 36px/44px \"IBMPlexSansArabic\"}.display-sm-bold{font:700 30px/38px \"IBMPlexSansArabic\"}.display-xs-bold{font:700 24px/32px \"IBMPlexSansArabic\"}.text-xl-bold{font:700 20px/30px \"IBMPlexSansArabic\"}.text-lg-bold{font:700 18px/28px \"IBMPlexSansArabic\"}.text-md-bold{font:700 16px/24px \"IBMPlexSansArabic\"}.text-sm-bold{font:700 14px/20px \"IBMPlexSansArabic\"}.text-xs-bold{font:700 12px/18px \"IBMPlexSansArabic\"}.text-2xs-bold{font:700 10px/14px \"IBMPlexSansArabic\"}.dga-spacing-hor-0{height:0px}.dga-spacing-vert-0{width:0px}.dga-p-0{padding:0px}.dga-px-0{padding-inline:0px}.dga-py-0{padding-block:0px}.dga-pl-0{padding-left:0px}.dga-pr-0{padding-right:0px}.dga-pt-0{padding-top:0px}.dga-pb-0{padding-bottom:0px}.dga-mx-0{margin-inline:0px}.dga-my-0{margin-block:0px}.dga-ml-0{margin-left:0px}.dga-mr-0{margin-right:0px}.dga-mt-0{margin-top:0px}.dga-mb-0{margin-bottom:0px}.dga-spacing-hor-2{height:8px}.dga-spacing-vert-2{width:8px}.dga-p-2{padding:8px}.dga-px-2{padding-inline:8px}.dga-py-2{padding-block:8px}.dga-pl-2{padding-left:8px}.dga-pr-2{padding-right:8px}.dga-pt-2{padding-top:8px}.dga-pb-2{padding-bottom:8px}.dga-mx-2{margin-inline:8px}.dga-my-2{margin-block:8px}.dga-ml-2{margin-left:8px}.dga-mr-2{margin-right:8px}.dga-mt-2{margin-top:8px}.dga-mb-2{margin-bottom:8px}.dga-spacing-hor-4{height:16px}.dga-spacing-vert-4{width:16px}.dga-p-4{padding:16px}.dga-px-4{padding-inline:16px}.dga-py-4{padding-block:16px}.dga-pl-4{padding-left:16px}.dga-pr-4{padding-right:16px}.dga-pt-4{padding-top:16px}.dga-pb-4{padding-bottom:16px}.dga-mx-4{margin-inline:16px}.dga-my-4{margin-block:16px}.dga-ml-4{margin-left:16px}.dga-mr-4{margin-right:16px}.dga-mt-4{margin-top:16px}.dga-mb-4{margin-bottom:16px}.dga-spacing-hor-8{height:32px}.dga-spacing-vert-8{width:32px}.dga-p-8{padding:32px}.dga-px-8{padding-inline:32px}.dga-py-8{padding-block:32px}.dga-pl-8{padding-left:32px}.dga-pr-8{padding-right:32px}.dga-pt-8{padding-top:32px}.dga-pb-8{padding-bottom:32px}.dga-mx-8{margin-inline:32px}.dga-my-8{margin-block:32px}.dga-ml-8{margin-left:32px}.dga-mr-8{margin-right:32px}.dga-mt-8{margin-top:32px}.dga-mb-8{margin-bottom:32px}.dga-spacing-hor-12{height:48px}.dga-spacing-vert-12{width:48px}.dga-p-12{padding:48px}.dga-px-12{padding-inline:48px}.dga-py-12{padding-block:48px}.dga-pl-12{padding-left:48px}.dga-pr-12{padding-right:48px}.dga-pt-12{padding-top:48px}.dga-pb-12{padding-bottom:48px}.dga-mx-12{margin-inline:48px}.dga-my-12{margin-block:48px}.dga-ml-12{margin-left:48px}.dga-mr-12{margin-right:48px}.dga-mt-12{margin-top:48px}.dga-mb-12{margin-bottom:48px}.dga-spacing-hor-16{height:64px}.dga-spacing-vert-16{width:64px}.dga-p-16{padding:64px}.dga-px-16{padding-inline:64px}.dga-py-16{padding-block:64px}.dga-pl-16{padding-left:64px}.dga-pr-16{padding-right:64px}.dga-pt-16{padding-top:64px}.dga-pb-16{padding-bottom:64px}.dga-mx-16{margin-inline:64px}.dga-my-16{margin-block:64px}.dga-ml-16{margin-left:64px}.dga-mr-16{margin-right:64px}.dga-mt-16{margin-top:64px}.dga-mb-16{margin-bottom:64px}.dga-spacing-hor-24{height:96px}.dga-spacing-vert-24{width:96px}.dga-p-24{padding:96px}.dga-px-24{padding-inline:96px}.dga-py-24{padding-block:96px}.dga-pl-24{padding-left:96px}.dga-pr-24{padding-right:96px}.dga-pt-24{padding-top:96px}.dga-pb-24{padding-bottom:96px}.dga-mx-24{margin-inline:96px}.dga-my-24{margin-block:96px}.dga-ml-24{margin-left:96px}.dga-mr-24{margin-right:96px}.dga-mt-24{margin-top:96px}.dga-mb-24{margin-bottom:96px}.dga-spacing-hor-32{height:128px}.dga-spacing-vert-32{width:128px}.dga-p-32{padding:128px}.dga-px-32{padding-inline:128px}.dga-py-32{padding-block:128px}.dga-pl-32{padding-left:128px}.dga-pr-32{padding-right:128px}.dga-pt-32{padding-top:128px}.dga-pb-32{padding-bottom:128px}.dga-mx-32{margin-inline:128px}.dga-my-32{margin-block:128px}.dga-ml-32{margin-left:128px}.dga-mr-32{margin-right:128px}.dga-mt-32{margin-top:128px}.dga-mb-32{margin-bottom:128px}.dga-spacing-hor-40{height:160px}.dga-spacing-vert-40{width:160px}.dga-p-40{padding:160px}.dga-px-40{padding-inline:160px}.dga-py-40{padding-block:160px}.dga-pl-40{padding-left:160px}.dga-pr-40{padding-right:160px}.dga-pt-40{padding-top:160px}.dga-pb-40{padding-bottom:160px}.dga-mx-40{margin-inline:160px}.dga-my-40{margin-block:160px}.dga-ml-40{margin-left:160px}.dga-mr-40{margin-right:160px}.dga-mt-40{margin-top:160px}.dga-mb-40{margin-bottom:160px}.dga-spacing-hor-48{height:192px}.dga-spacing-vert-48{width:192px}.dga-p-48{padding:192px}.dga-px-48{padding-inline:192px}.dga-py-48{padding-block:192px}.dga-pl-48{padding-left:192px}.dga-pr-48{padding-right:192px}.dga-pt-48{padding-top:192px}.dga-pb-48{padding-bottom:192px}.dga-mx-48{margin-inline:192px}.dga-my-48{margin-block:192px}.dga-ml-48{margin-left:192px}.dga-mr-48{margin-right:192px}.dga-mt-48{margin-top:192px}.dga-mb-48{margin-bottom:192px}.dga-spacing-hor-56{height:224px}.dga-spacing-vert-56{width:224px}.dga-p-56{padding:224px}.dga-px-56{padding-inline:224px}.dga-py-56{padding-block:224px}.dga-pl-56{padding-left:224px}.dga-pr-56{padding-right:224px}.dga-pt-56{padding-top:224px}.dga-pb-56{padding-bottom:224px}.dga-mx-56{margin-inline:224px}.dga-my-56{margin-block:224px}.dga-ml-56{margin-left:224px}.dga-mr-56{margin-right:224px}.dga-mt-56{margin-top:224px}.dga-mb-56{margin-bottom:224px}.dga-spacing-hor-64{height:256px}.dga-spacing-vert-64{width:256px}.dga-p-64{padding:256px}.dga-px-64{padding-inline:256px}.dga-py-64{padding-block:256px}.dga-pl-64{padding-left:256px}.dga-pr-64{padding-right:256px}.dga-pt-64{padding-top:256px}.dga-pb-64{padding-bottom:256px}.dga-mx-64{margin-inline:256px}.dga-my-64{margin-block:256px}.dga-ml-64{margin-left:256px}.dga-mr-64{margin-right:256px}.dga-mt-64{margin-top:256px}.dga-mb-64{margin-bottom:256px}.dga-spacing-hor-72{height:288px}.dga-spacing-vert-72{width:288px}.dga-p-72{padding:288px}.dga-px-72{padding-inline:288px}.dga-py-72{padding-block:288px}.dga-pl-72{padding-left:288px}.dga-pr-72{padding-right:288px}.dga-pt-72{padding-top:288px}.dga-pb-72{padding-bottom:288px}.dga-mx-72{margin-inline:288px}.dga-my-72{margin-block:288px}.dga-ml-72{margin-left:288px}.dga-mr-72{margin-right:288px}.dga-mt-72{margin-top:288px}.dga-mb-72{margin-bottom:288px}.dga-spacing-hor-80{height:320px}.dga-spacing-vert-80{width:320px}.dga-p-80{padding:320px}.dga-px-80{padding-inline:320px}.dga-py-80{padding-block:320px}.dga-pl-80{padding-left:320px}.dga-pr-80{padding-right:320px}.dga-pt-80{padding-top:320px}.dga-pb-80{padding-bottom:320px}.dga-mx-80{margin-inline:320px}.dga-my-80{margin-block:320px}.dga-ml-80{margin-left:320px}.dga-mr-80{margin-right:320px}.dga-mt-80{margin-top:320px}.dga-mb-80{margin-bottom:320px}.dga-spacing-hor-88{height:352px}.dga-spacing-vert-88{width:352px}.dga-p-88{padding:352px}.dga-px-88{padding-inline:352px}.dga-py-88{padding-block:352px}.dga-pl-88{padding-left:352px}.dga-pr-88{padding-right:352px}.dga-pt-88{padding-top:352px}.dga-pb-88{padding-bottom:352px}.dga-mx-88{margin-inline:352px}.dga-my-88{margin-block:352px}.dga-ml-88{margin-left:352px}.dga-mr-88{margin-right:352px}.dga-mt-88{margin-top:352px}.dga-mb-88{margin-bottom:352px}.dga-spacing-hor-96{height:384px}.dga-spacing-vert-96{width:384px}.dga-p-96{padding:384px}.dga-px-96{padding-inline:384px}.dga-py-96{padding-block:384px}.dga-pl-96{padding-left:384px}.dga-pr-96{padding-right:384px}.dga-pt-96{padding-top:384px}.dga-pb-96{padding-bottom:384px}.dga-mx-96{margin-inline:384px}.dga-my-96{margin-block:384px}.dga-ml-96{margin-left:384px}.dga-mr-96{margin-right:384px}.dga-mt-96{margin-top:384px}.dga-mb-96{margin-bottom:384px}.dga-spacing-hor-104{height:416px}.dga-spacing-vert-104{width:416px}.dga-p-104{padding:416px}.dga-px-104{padding-inline:416px}.dga-py-104{padding-block:416px}.dga-pl-104{padding-left:416px}.dga-pr-104{padding-right:416px}.dga-pt-104{padding-top:416px}.dga-pb-104{padding-bottom:416px}.dga-mx-104{margin-inline:416px}.dga-my-104{margin-block:416px}.dga-ml-104{margin-left:416px}.dga-mr-104{margin-right:416px}.dga-mt-104{margin-top:416px}.dga-mb-104{margin-bottom:416px}.dga-spacing-hor-112{height:448px}.dga-spacing-vert-112{width:448px}.dga-p-112{padding:448px}.dga-px-112{padding-inline:448px}.dga-py-112{padding-block:448px}.dga-pl-112{padding-left:448px}.dga-pr-112{padding-right:448px}.dga-pt-112{padding-top:448px}.dga-pb-112{padding-bottom:448px}.dga-mx-112{margin-inline:448px}.dga-my-112{margin-block:448px}.dga-ml-112{margin-left:448px}.dga-mr-112{margin-right:448px}.dga-mt-112{margin-top:448px}.dga-mb-112{margin-bottom:448px}.dga-spacing-hor-120{height:480px}.dga-spacing-vert-120{width:480px}.dga-p-120{padding:480px}.dga-px-120{padding-inline:480px}.dga-py-120{padding-block:480px}.dga-pl-120{padding-left:480px}.dga-pr-120{padding-right:480px}.dga-pt-120{padding-top:480px}.dga-pb-120{padding-bottom:480px}.dga-mx-120{margin-inline:480px}.dga-my-120{margin-block:480px}.dga-ml-120{margin-left:480px}.dga-mr-120{margin-right:480px}.dga-mt-120{margin-top:480px}.dga-mb-120{margin-bottom:480px}.dga-radius-small{border-radius:2px}.dga-radius-small-t{border-radius:2px 2px 0 0}.dga-radius-small-tl{border-radius:2px 0px 0 0}.dga-radius-small-tr{border-radius:0px 2px 0 0}.dga-radius-small-b{border-radius:0 0 2px 2px}.dga-radius-small-bl{border-radius:0 0 2px 0px}.dga-radius-small-br{border-radius:0 0 0px 2px}.dga-radius-medium{border-radius:4px}.dga-radius-medium-t{border-radius:4px 4px 0 0}.dga-radius-medium-tl{border-radius:4px 0px 0 0}.dga-radius-medium-tr{border-radius:0px 4px 0 0}.dga-radius-medium-b{border-radius:0 0 4px 4px}.dga-radius-medium-bl{border-radius:0 0 4px 0px}.dga-radius-medium-br{border-radius:0 0 0px 4px}.dga-radius-large{border-radius:8px}.dga-radius-large-t{border-radius:8px 8px 0 0}.dga-radius-large-tl{border-radius:8px 0px 0 0}.dga-radius-large-tr{border-radius:0px 8px 0 0}.dga-radius-large-b{border-radius:0 0 8px 8px}.dga-radius-large-bl{border-radius:0 0 8px 0px}.dga-radius-large-br{border-radius:0 0 0px 8px}.dga-radius-xlarge{border-radius:12px}.dga-radius-xlarge-t{border-radius:12px 12px 0 0}.dga-radius-xlarge-tl{border-radius:12px 0px 0 0}.dga-radius-xlarge-tr{border-radius:0px 12px 0 0}.dga-radius-xlarge-b{border-radius:0 0 12px 12px}.dga-radius-xlarge-bl{border-radius:0 0 12px 0px}.dga-radius-xlarge-br{border-radius:0 0 0px 12px}.dga-radius-none{border-radius:0px}.dga-radius-circular{border-radius:100%}.dga-flex{display:flex}.dga-flex-column{display:flex;flex-direction:column}.dga-flex-center{display:flex;align-items:center;justify-content:center}.dga-flex-center-y{display:flex;align-items:center}.dga-flex-center-x{display:flex;justify-content:center}.dga-flex-between{display:flex;justify-content:space-between}.dga-flex-wrap{flex-wrap:wrap}.dga-flex-align-stretch{align-items:stretch}.dga-flex-align-start{align-items:flex-start}.dga-flex-align-end{align-items:flex-end}.dga-flex-justify-end{justify-content:flex-end}.dga-flex-justify-start{justify-content:flex-start}.dga-text-right{text-align:right}.dga-text-left{text-align:left}.dga-text-center{text-align:center}.dga-shadow-xs{box-shadow:var(--shadow-xs)}.dga-shadow-sm{box-shadow:var(--shadow-sm)}.dga-shadow-md,.input.focus{box-shadow:var(--shadow-md)}.dga-shadow-lg{box-shadow:var(--shadow-lg)}.dga-shadow-xl,.breadcrumb-dropdown{box-shadow:var(--shadow-xl)}.dga-shadow-2xl{box-shadow:var(--shadow-2xl)}.dga-shadow-3xl{box-shadow:var(--shadow-3xl)}.dga-ver-divider{width:1px;height:48px;background:var(--colors-alpha-alpha-black-20);margin-inline:var(--spacing-xl)}@media only screen and (max-width: 37.5em){.dga-xs-hide{display:none}}.dga-flex-justify-start{justify-content:start}.dga-flex-justify-end{justify-content:end}.dga-flex-justify-center{justify-content:center}.dga-flex-justify-between{justify-content:between}.dga-flex-justify-around{justify-content:around}.dga-flex-align-start{align-items:start}.dga-flex-align-end{align-items:end}.dga-flex-align-center{align-items:center}.dga-flex-align-stretch{align-items:stretch}.dga-form-control{display:flex;flex-direction:column;gap:8px;position:relative;width:320px;min-width:200px}.dga-form-control--fullwidth{width:100%}.dga-form-control>.dga-label{margin-bottom:8px;color:var(--form-field-text-label)}.input{display:flex;height:40px;width:100%;justify-content:flex-start;align-items:center;padding:var(--spacing-none) var(--spacing-2);border-radius:var(--radius-sm);gap:var(--spacing-xs);border:1px solid var(--form-field-border-default);background:var(--form-field-background-default);position:relative}.input:hover{border-color:var(--form-field-border-hovered)}.input::after{content:\"\";position:absolute;bottom:0;left:50%;width:0%;height:2px;transform:translateX(-50%);background-color:var(--form-field-border-pressed);transition:width 0.2s ease-in-out}.input__field{background-color:transparent;border:0;outline:0;height:100%;width:100%;color:var(--form-field-text-focused)}.input__field::placeholder{color:var(--form-field-text-placeholder);font-size:16px;font-style:normal;font-weight:400;line-height:24px}.input.focus::after{width:100%}.input.active::after{width:50%}.input--readonly,.input--readonly:hover,.input--disabled,.input--disabled:hover{border-color:var(--border-neutral-primary);box-shadow:none !important}.input--readonly::after,.input--disabled::after{display:none}.input--readonly .input__field,.input--readonly .input__field::placeholder,.input--disabled .input__field,.input--disabled .input__field::placeholder{color:var(--form-field-text-readonly)}.input--disabled{border-color:var(--border-disabled)}.input--disabled .input__field{color:var(--text-default-disabled)}.input--disabled .input__field,.input--disabled .input__field::placeholder{color:var(--text-default-disabled)}.input--disabled .input__icon span,.input--disabled .input__prefix--subtle-text,.input--disabled .input__prefix--solid-text{color:var(--text-default-disabled)}.input__icon{height:100%;display:inline-flex;align-items:center}.input__icon span{color:var(--form-field-border-hovered);font-size:20px}.input__feedback-icon{height:100%;display:inline-flex;align-items:center}.input__feedback-icon span{font-size:20px;position:relative;z-index:0}.input__feedback-icon--success{color:var(--text-success)}.input__feedback-icon--success span::after{background-color:var(--colors-brand-100)}.input__feedback-icon--error{color:var(--text-error)}.input__feedback-icon--error span::after{background-color:var(--text-error-100)}.input__feedback-icon--warning{color:var(--text-warning)}.input__feedback-icon--warning span::after{background-color:var(--colors-warning-100)}.input__feedback-icon--warning-triangle{color:var(--text-warning)}.input__feedback-icon--warning-triangle span::after{width:0 !important;height:0 !important;transform:scale(1) !important;border:12px solid rgba(0, 0, 0, 0);border-top:0;border-bottom:20px solid var(--colors-warning-100);border-radius:0px !important;left:-2px !important;top:-1px !important}.input__feedback-icon--ring span::after{content:\"\";display:block;width:100%;height:100%;transform:scale(1.16);position:absolute;top:0;left:0;border-radius:var(--radius-full);z-index:-1}.input__prefix,.input__suffix{display:inline-flex;height:100%;padding:var(--spacing-xxs) var(--spacing-2);justify-content:center;align-items:center;gap:var(--spacing-xs);mix-blend-mode:multiply;margin-left:calc(-1 * var(--spacing-2));margin-right:var(--spacing-2);border:0}.input__prefix-label,.input__prefix-icon,.input__prefix-chevron,.input__suffix-label,.input__suffix-icon,.input__suffix-chevron{color:var(--colors-text-primary)}.input__prefix .dropdown__label,.input__suffix .dropdown__label{display:none}.input__prefix .dropdown__label--selection,.input__suffix .dropdown__label--selection{display:inline-block;white-space:nowrap}.input__prefix .dropdown__label--selection~.input__prefix-label,.input__suffix .dropdown__label--selection~.input__prefix-label{display:none}.input__prefix-chevron,.input__suffix-chevron{font-size:30px !important;transform:rotate(0);transition:all 0.3s ease-in-out}.input__prefix.active,.input__suffix.active{background-color:var(--colors-gray-neutral-300)}.input__prefix--solid,.input__suffix--solid{background-color:var(--background-neutral-50)}.input__prefix--solid-text,.input__suffix--solid-text{background-color:var(--background-neutral-50)}.input__prefix--solid-text .input__prefix-label,.input__suffix--solid-text .input__prefix-label{color:var(--colors-text-quarterary)}.input__prefix--solid:hover,.input__suffix--solid:hover{background-color:var(--colors-gray-neutral-200)}.input__prefix--solid:focus,.input__suffix--solid:focus{background-color:transparent;border:4px solid var(--colors-base-black);border-radius:0}.input__prefix--solid.active,.input__suffix--solid.active{background-color:var(--colors-gray-neutral-300);border:0}.input__prefix--solid:disabled,.input__suffix--solid:disabled{background-color:var(--background-neutral-50)}.input__prefix--solid:disabled .input__prefix-label,.input__prefix--solid:disabled .input__prefix-icon,.input__prefix--solid:disabled .input__prefix-chevron,.input__suffix--solid:disabled .input__prefix-label,.input__suffix--solid:disabled .input__prefix-icon,.input__suffix--solid:disabled .input__prefix-chevron{color:var(--colors-gray-neutral-300)}.input__prefix--subtle,.input__suffix--subtle{background-color:transparent}.input__prefix--subtle-text,.input__suffix--subtle-text{background-color:transparent}.input__prefix--subtle-text .input__prefix-label,.input__suffix--subtle-text .input__prefix-label{color:var(--colors-text-quarterary)}.input__prefix--subtle:hover,.input__suffix--subtle:hover{background-color:var(--colors-gray-neutral-50)}.input__prefix--subtle:focus,.input__suffix--subtle:focus{background-color:transparent;border:4px solid var(--colors-base-black)}.input__prefix--subtle.active,.input__suffix--subtle.active{background-color:var(--colors-gray-neutral-200);border:0}.input__prefix--subtle:disabled .input__prefix-label,.input__prefix--subtle:disabled .input__prefix-icon,.input__prefix--subtle:disabled .input__prefix-chevron,.input__suffix--subtle:disabled .input__prefix-label,.input__suffix--subtle:disabled .input__prefix-icon,.input__suffix--subtle:disabled .input__prefix-chevron{color:var(--colors-gray-neutral-300)}.input__prefix.selected,.input__suffix.selected{background-color:var(--form-field-border-hovered)}.input__prefix.selected .input__prefix-icon,.input__prefix.selected .input__prefix-label,.input__prefix.selected .input__prefix-chevron,.input__suffix.selected .input__prefix-icon,.input__suffix.selected .input__prefix-label,.input__suffix.selected .input__prefix-chevron{color:var(--colors-text-primary_on-brand)}.input__prefix.selected .dropdown__label,.input__suffix.selected .dropdown__label{color:var(--colors-text-primary_on-brand)}.input__dropdown-btn.open+.input__dropdown-list{z-index:2;opacity:1;padding-block:var(--spacing-md);max-height:376px;pointer-events:auto;overflow-y:auto}.input__dropdown-btn.open .input__dropdown .input__prefix-chevron,.input__dropdown-btn.open .input__dropdown .input__suffix-chevron{transform:rotate(180deg)}.input__prefix{border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.input__suffix{margin-right:calc(-1 * var(--spacing-2));margin-left:var(--spacing-xl);border-radius:0 var(--radius-sm) var(--radius-sm) 0}.input--lighter{border:0;background:var(--form-field-background-lighter, #fcfcfd)}.input--lighter:hover{border:1px solid var(--form-field-border-default)}.input--lighter.focus{border:1px solid var(--form-field-border-default)}.input--lighter.active{border:1px solid var(--form-field-border-default)}.input--darker{border:0;background-color:var(--form-field-background-darker, #f3f4f6)}.input--darker:hover{border:1px solid var(--form-field-border-default)}.input--darker.focus{border:1px solid var(--form-field-border-default);background-color:var(--form-field-background-default) !important}.input--darker.active{border:1px solid var(--form-field-border-default);background-color:var(--form-field-background-default) !important}.input.readOnly{border:1px solid var(--border-neutral-primary) !important;background-color:var(--form-field-background-default) !important;box-shadow:none !important}.input.readOnly::after{content:none}.input--error,.input--error:hover{border:1px solid var(--form-field-border-error) !important}.input--error::after{background-color:var(--form-field-border-error)}.input--lg{height:40px}.input--lg .input__field,.input--lg .input__field::placeholder{font-size:16px;font-style:normal;font-weight:400;line-height:24px}.input--lg__feedback-icon span{font-size:20px}.input--lg .input__prefix-icon,.input--lg .input__suffix-icon{font-size:24px}.input--lg .input__prefix-chevron,.input--lg .input__suffix-chevron{font-size:20px}.input--md{height:32px}.input--md .input__field,.input--md .input__field::placeholder{font-size:16px;font-style:normal;font-weight:400;line-height:24px}.input--md__feedback-icon span{font-size:16px}.input--md .input__prefix-icon,.input--md .input__suffix-icon{font-size:20px}.input--md .input__prefix-chevron,.input--md .input__suffix-chevron{font-size:16px}.breadcrumb-dropdown{display:flex;flex-direction:column;list-style:none;width:153px;padding:var(--spacing-xs, 4px);flex-direction:column;align-items:flex-start;position:absolute;left:0;top:calc(100% + 4px);border-radius:var(--radius-sm);border:1px solid var(--border-neutral-secondary, #E5E7EB);background:var(--background-white, #FFF)}.breadcrumb-dropdown-item{display:flex;padding:var(--spacing-md, 8px);flex-direction:column;justify-content:center;align-items:flex-start;gap:var(--spacing-md, 8px);align-self:stretch;border-radius:var(--radius-sm, 4px);color:var(--link-neutral, #384250)}.breadcrumb-dropdown-item:hover{border-radius:var(--radius-xs);background:var(--button-background-neutral-hovered);mix-blend-mode:multiply}.breadcrumb-dropdown-item:active{border-radius:var(--radius-xs);background:var(--button-background-neutral-pressed, #E5E7EB);mix-blend-mode:multiply}.date-picker-dropdown{width:fit-content}";
 
@@ -111,10 +112,10 @@ const DgaDateField = class {
             'input--disabled': this.disabled,
             'readOnly': this.readonly
         };
-        return (h("div", { key: '1e2e5f5355b2699eca2cd78dbcd1add24a068d41', class: { "dga-form-control": true, "dga-form-control--fullwidth": this.fullwidth } }, this.label &&
-            h("dga-label", { key: '6b89aab074716fe6bc8bbcc5b616eec5bc0f020b', label: this.label, size: this.size, required: this.required, disabled: this.disabled }), h("div", { key: '26f9f2079286b18003a3a538b1e38d62242bcfcb', class: Object.keys(inputClasses).filter(key => inputClasses[key]).join(' '), ref: el => this.inputContainerRef = el }, this.icon && (h("span", { key: '487674f71c2582041e940b7f5159c1dd74ae8e7b', class: "input__icon" }, h("dga-icon", { key: 'f7ce4772c9864456ae135286723e2f3f2e068a9b', name: this.icon.name, variant: this.icon.variant, type: this.icon.type, size: 20 }))), h("input", { key: '1dcfc477ec0ce375bcb083b451d1254c5d3108b2', ref: (el) => (this.inputEl = el), name: this.name, value: this.inputValue, type: "text", class: "input__field", placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, onFocus: this.handleFocus, onBlur: this.handleBlur, onInput: this.handleInput, onMouseDown: () => this.isActive = true, onMouseUp: () => this.isActive = false, onMouseOut: () => this.isActive = false }), h("dga-button-v2", { key: 'd8b0c1056641f1d07423c0d96190e08d7b7fd136', variant: "transparent", iconOnly: true, leadIcon: true, leadIconProps: { name: 'calendar-03', variant: 'stroke', type: 'rounded' }, onClick: this.handleOpenDatepickerPopup }), this.error && (h("span", { key: '075cd959b934124150470113674940e123f4aeb8', class: "input__feedback-icon input__feedback-icon--error" }, h("dga-icon", { key: '92b45d0c15db5f2eaf6896c27316f04306afd4d8', name: "alert-circle", variant: "solid" })))), (this.errorMessage || this.helperText) &&
-            h("dga-helper-text", { key: '7a2dc1258b3cbe5670b97efd94570803d23c1738', helperText: this.errorMessage || this.helperText, error: this.error }), this.isDatepickerOpen &&
-            h("div", { key: '8aa4c831076f7fd368f5909ee44954d8d7645e1c', class: "date-picker-dropdown", ref: el => this.datepickerRef = el }, h("dga-datepicker", Object.assign({ key: '4f44033e5003db01b15b5b1377fcf88f761399e3' }, this.datepickerOptions, { value: this.selectedDate, onChange: this.handleDatepickerChange, style: { width: "fit-content", display: "block" } })))));
+        return (h("div", { key: 'ac304baaf8ec1f5286a4be53a0c27704e620d269', class: { "dga-form-control": true, "dga-form-control--fullwidth": this.fullwidth } }, this.label &&
+            h("dga-label", { key: 'd344f92666daf85ecd35ccde15062b8b7880a7a5', label: this.label, size: this.size, required: this.required, disabled: this.disabled }), h("div", { key: '780e5814287987da88862d34d711c4c7cbc99ca8', class: Object.keys(inputClasses).filter(key => inputClasses[key]).join(' '), ref: el => this.inputContainerRef = el }, this.icon && (h("span", { key: 'a6c322f7d04489ae651f215cd1d1a2d9a8516274', class: "input__icon" }, h("dga-icon", { key: '6353b218fcdefa15e192a68aecfa9efcd802773b', name: this.icon.name, variant: this.icon.variant, type: this.icon.type, size: 20 }))), h("input", { key: '58273bef7c00b54fa1946a11623e36d8c0ae8fd9', ref: (el) => (this.inputEl = el), name: this.name, value: this.inputValue, type: "text", class: "input__field", placeholder: this.placeholder, disabled: this.disabled, readOnly: this.readonly, required: this.required, onFocus: this.handleFocus, onBlur: this.handleBlur, onInput: this.handleInput, onMouseDown: () => this.isActive = true, onMouseUp: () => this.isActive = false, onMouseOut: () => this.isActive = false }), h("dga-button-v2", { key: 'c2816fa5c44e50a140db53a8074c90ae9923da30', variant: "transparent", iconOnly: true, leadIcon: true, leadIconProps: { name: 'calendar-03', variant: 'stroke', type: 'rounded' }, onClick: this.handleOpenDatepickerPopup }), this.error && (h("span", { key: '1073913a48e3f71726455f44507ec7eafbcf9964', class: "input__feedback-icon input__feedback-icon--error" }, h("dga-icon", { key: '63f3b2bd2bc1f7bc33e37a27051638686aa76f5d', icon: alertCircleSolidRoundedIcon })))), (this.errorMessage || this.helperText) &&
+            h("dga-helper-text", { key: 'ef17a1f66dbbe5d99701ea4380f67ba6ccf334ab', helperText: this.errorMessage || this.helperText, error: this.error }), this.isDatepickerOpen &&
+            h("div", { key: '464184bd4b93a54410994cb564b4bff4205b0302', class: "date-picker-dropdown", ref: el => this.datepickerRef = el }, h("dga-datepicker", Object.assign({ key: '8166078360cf22e4f197ae0fb674d37f5610237a' }, this.datepickerOptions, { value: this.selectedDate, onChange: this.handleDatepickerChange, style: { width: "fit-content", display: "block" } })))));
     }
     static get watchers() { return {
         "value": ["valueChanged"]

package/dist/esm/dga-datepicker-usage.entry.js

@@ -5,7 +5,7 @@ const DgaPickerUsage = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h("div", { key: '2a3a50940d1ec402c6738fee021c77cb4a0f5a18' }, h("h1", { key: '415cf1eca41f3d3244d53b06e3b4bd1e1b077380' }, "Datepicker Example"), h("div", { key: 'a1d5c2ffcca55b1ac54adc25ba2896afb0416039', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: 'd0fde0095475455a0118eb4d30dbf75e87702f45', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-datepicker", { key: 'c62403471841260291fb548996faea70da03df49', inputField: false, qickOptions: true }), h("dga-datepicker", { key: '7c195165accc1c65a04d63f81041f6c95d3fa8fe', RTL: true, inputField: true, range: true, qickOptions: true }), h("dga-datepicker", { key: 'bb4de4e628ba294ad18c5d79cc17a9a18da9c717', range: true })), h("div", { key: 'c9b0fcce26cb9f1babd859d6b232a5d265696161', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+        return (h("div", { key: 'fbcbc060965934ebb20a3a0fdcb67565c24b8e42' }, h("h1", { key: '7ac0043599c31bc9739ea31abb6f3d2eea951923' }, "Datepicker Example"), h("div", { key: 'ec75b642bbc6926ee788dd6b4a523b8ac47ebbfb', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: 'c736092459f994c2449d2b9adbcf8aac95c0066e', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-datepicker", { key: 'e31baf3ec5aaa21a3b4d5d5786f76966a7066267', inputField: false, qickOptions: true }), h("dga-datepicker", { key: 'e041ac56fad390dbe8476299ae92eadcc8106f45', RTL: true, inputField: true, range: true, qickOptions: true }), h("dga-datepicker", { key: 'fd911a8f875f789ba134fcba78d752f73000fd24', range: true })), h("div", { key: '57f0c922ab386a5d8ed794bade8f27a73c1d295b', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
 };
 

package/dist/esm/dga-digital-signature-usage.entry.js

@@ -5,7 +5,7 @@ const DgaDigitalSignatureUsage = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h("div", { key: '93cc9a933a6905c9484c01f15b1391434ed11ed5', style: { width: '100%' } }, h("dga-digital-signature", { key: '91bb28b2c8b6e3ea4cda8f06a1366ff011d96619', language: "en", extension: ".gov.sa" })));
+        return (h("div", { key: '8f80c13f23807eee16d266545c8e62058b08b2dd', style: { width: '100%' } }, h("dga-digital-signature", { key: '16e854edbd767022bbfc13bd0fcd8d65bbb39187', language: "en", extension: ".gov.sa" })));
     }
 };