@platformscode/core 0.0.34 → 0.0.35

package/dist/collection/usage/dga-card-v2-usage.js

@@ -5,17 +5,17 @@ export class DgaCardV2Usage {
         this.selected = false;
     }
     render() {
-        return (h("div", { key: 'f56c7c0cae876bfc3b8d6a7c12ed1ec254ff8766' }, h("h1", { key: '9fc420f8c2951b37b878f76a8ed2995316303ab7' }, "Card Example"), h("div", { key: '222f0afc60ab3dfcfc3582188e8489b288ef23b9', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: '21341f46d3b598bae90046b3aaba4f22bb095e9e', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-card-v2", { key: 'c8f671ae081648996d7c40784acf562fa1b8bdd6', type: "default", sx: {
+        return (h("div", { key: 'aa2e81ca9e7b8fa11580696582c271be86a617da' }, h("h1", { key: 'a51a817a4464703138520a5f07ddf9c6dc255814' }, "Card Example"), h("div", { key: '2f0fd4bb8ccda49752ded814d78e95d186f754d0', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: 'a2b8f7c5c932d042e6a5f8e94ddbfe306b2a5b66', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-card-v2", { key: '03c2b3a351b81b24664cfc04b8328855e5fed362', type: "default", sx: {
                 "& > .card": {
                     backgroundColor: 'red',
                     height: '400px',
                 }
-            } }, h("dga-card-content", { key: '65df82b0e5cfcc5ee3c4dcb654595b59c6558021' }, h("dga-featured-icon", { key: '91f3c23a3fa8782be077aaafaf332d425753e3b5', color: 'brand', variant: 'light', size: 'lg', icon: {
+            } }, h("dga-card-content", { key: '394dd8e492fdf011504ee9b33e5b4917133cf25e' }, h("dga-featured-icon", { key: '9f09ced740f222f46b6041ec548d41b200533f9d', color: 'brand', variant: 'light', size: 'lg', icon: {
                 name: 'checkmark-circle-02',
                 variant: 'stroke',
                 type: 'sharp',
                 size: 24
-            } }), h("dga-flex", { key: 'e3dafd808c26ab40ec7383109cfd334065d5f933', direction: 'column', spacing: 8 }, h("h4", { key: 'ba9f9fd6442b13f1a5dada1f86864402f033eb0d', class: "text-lg-bold" }, "Card Title test"), h("p", { key: '0dc0574631ce54ca92de55b7f333073c3118ac41', class: "text-md-regular" }, "Card content placeholder text goes here")), h("dga-flex", { key: '620a4a15bc1c624eb6094b77b2336af201b0b036', direction: 'column', spacing: 4 }, h("dga-rating", { key: '2a683169cc916fb968e027657d3ebd5124db6d89', value: 4, size: 'sm' }), h("span", { key: '804631b639332b8a02e2f250c913f4d24142af63', class: "text-xs-regular" }, "12 reviews"))), h("dga-card-actions", { key: '240fee38b3ba7da3c34c1b2cc2af3fd3e97a98db' }, h("dga-button-v2", { key: '81145e9e36c4ca14a5776e67490c532ad13a7939', label: "Primary", size: "lg", variant: "primary", onClick: () => console.log('Primary Action') }), h("dga-button-v2", { key: '0ecbbdda7daba2d09cbf1e71dc234279d0a8be92', label: "Secondary", size: "lg", variant: "secondary-outline", onClick: () => console.log('Secondary Action') })), h("dga-card-expandable-content", { key: 'b8d963c6e17c657f4ec996dfa3e75e45b26f89eb' }, h("div", { key: '2427413f592b0cc96b9643160aaca036dc56b8a9' }, "Expanded Content"), h("p", { key: '443d9e5e5e9b5655d8b602a001499488beb522c7' }, "Lorem ipsum dolor sit amet consectetur, adipisicing elit. Earum voluptatum, facere mollitia quas natus nihil, doloribus repudiandae, quasi vitae nobis deserunt similique magni explicabo. Molestiae unde dolorem expedita aut recusandae.")))), h("div", { key: 'deeabac5769610f260955bf1717a605855713703', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+            } }), h("dga-flex", { key: 'f7e08ddf7bf7483f5e0fdc25dcc0982de422b610', direction: 'column', spacing: 8 }, h("h4", { key: '538eb3d141863e64dd39c9fc4287c11a8c321859', class: "text-lg-bold" }, "Card Title test"), h("p", { key: 'd9743b6088f9328777275b3f12f58ebf37b6d876', class: "text-md-regular" }, "Card content placeholder text goes here")), h("dga-flex", { key: 'a52859227b1a9111b039da07c42ca0828ac270b9', direction: 'column', spacing: 4 }, h("dga-rating", { key: '76e820b45df66d7f8423326679a2d9c4a9e3a68c', value: 4, size: 'sm' }), h("span", { key: '716861ef943b7c88dec8bd271307720c3580168f', class: "text-xs-regular" }, "12 reviews"))), h("dga-card-actions", { key: '15d712a0d2b1bb3ba1fd67a289244d5907fdfc7e' }, h("dga-button-v2", { key: '0a39821141ccc7419239351e6de19e5d78aa2e0e', label: "Primary", size: "lg", variant: "primary", onClick: () => console.log('Primary Action') }), h("dga-button-v2", { key: '192c2b5ad6921b35438608bc2344fa0a3604d0d1', label: "Secondary", size: "lg", variant: "secondary-outline", onClick: () => console.log('Secondary Action') })), h("dga-card-expandable-content", { key: 'df09f7c7413000a18c7cc7e5a3738fd65de44164' }, h("div", { key: 'f834107bd79d0bd3637a1a9d9d70c3da29dcc6cd' }, "Expanded Content"), h("p", { key: '7e25f21e9f32ca6889cacc6cc41302bb297eb333' }, "Lorem ipsum dolor sit amet consectetur, adipisicing elit. Earum voluptatum, facere mollitia quas natus nihil, doloribus repudiandae, quasi vitae nobis deserunt similique magni explicabo. Molestiae unde dolorem expedita aut recusandae.")))), h("div", { key: '756c5d493b18f8aee8699400a7d9fc5ddc6bcaf9', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
     static get is() { return "dga-card-v2-usage"; }
     static get states() {

package/dist/collection/usage/dga-carousel-usage.js

@@ -4,115 +4,115 @@ export class DgaCarouselUsage {
         this.variant = 'neutral';
     }
     render() {
-        return (h("div", { key: '999cf5342086d8e1701411bb56dc5167d33e168e' }, h("h1", { key: 'db328be7dc37f5534ebdf8ac3cd506fe44169a8b' }, "Carousel Example"), h("div", { key: 'f1eea2666ef05e109bcc5b64466ebc4eb8cb19ee', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: 'f816d692977f5d15a2dce38e4310e5705cf7eaa9', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-carousel", { key: '4c59eb3e0f7e3af93080b8e5fba283ec93899fd9', size: 'lg', arrowsVariant: 'primary' }, h("dga-carousel-item", { key: 'eaf2d4a944968ad7121ae1a80499915e84469a05' }, h("img", { key: 'f0907c8e2b596092b8cdd53f5fc55751b6b61843', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
+        return (h("div", { key: '5c4f191063a3da952e6e42f4cd19103c2d715a3b' }, h("h1", { key: 'e0dbbd2edcfb86c2fbbfe547dcd490f00ac70ca4' }, "Carousel Example"), h("div", { key: '4fa719669714950f9d9fc8beb56bb7009aa215fc', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: 'e2af84279a8ce9c95632ff8f7db99f7521996775', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-carousel", { key: '123e46bcbb544322886f75173036e3f73b00d9a6', size: 'lg', arrowsVariant: 'primary' }, h("dga-carousel-item", { key: '6e96cb5449d40b355d628ac69195afc9748d4960' }, h("img", { key: '1cd7447ad28a0c7cb66d2bbe642d33abf5ff86dc', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
-            } })), h("dga-carousel-item", { key: 'af77cec8f0e543f2637a82c541709c81e5bdaa5b' }, h("img", { key: 'c32916121f004694193a67e1cc772ae30f5676ea', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: 'd41b8aa19885d0b04971dcaef7f3219c3962a6c5' }, h("img", { key: 'b58dbc9370456bf5b10504dcdacab0469bbedc7e', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '28d27971828f93705e0062c3330792e741690854' }, h("img", { key: '225585629c79578ffd00f21bf9120be6093ff466', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '949685809aec0a767579989a47a6473e9fd76a8b' }, h("img", { key: 'e39c80ef752e705b2fc6d1d1cc4bf05a467c6a59', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '91a815dfdbcbf1bca34b1e67d218bfc92fb585dd' }, h("img", { key: '7e668ed6227877b8f8f04ae7d2219b6950654fcd', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '24b5db9929035fd46e2ce1cc4c797b168a2ab9a8' }, h("img", { key: '3072a257cd7875ab93177278bf4abff5fe8eb4b1', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '06ccf209d92773a027ba8745b8c696681061f01d' }, h("img", { key: '51d9de0415bd97e20b10b181dd22908d0dde75ee', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: 'a442930d2b9a6d82acd007036efad10fe8a67a18' }, h("img", { key: 'a9b413a1ccda7a7a57485622a3655da0ff92b6fb', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '0e2ea48b48c4f1e7f8f6eed6bde8b4cdef048f63' }, h("img", { key: '92de81bb9730a124a9c85fd8b86a1044d29818fa', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '420484e73d6c166aad1b93dd996571854c73e579' }, h("img", { key: '30a1942c7fa903720132a3afa6c4ce6fd2617212', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: 'ed4b4908906d4afae5c1361855506ff1067d5880' }, h("img", { key: 'b077357fe2ebb87ec6b3c5eb105e7d95367296d9', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: 'a958e9504a61578fa9281245bc1789a90a52684e' }, h("img", { key: 'd5f6faa2c6c757f31178349e293ad48fba3243e5', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } }))), h("dga-carousel", { key: 'b603e939dd5c8a74ae23a7ff7f2bccdc1317bb8f', size: 'lg', arrowsVariant: 'subtle' }, h("dga-carousel-item", { key: 'bf9b5ddff7d463b814f546f7279cce6cdbeff1a4' }, h("img", { key: '63d2176a95e94ad625ced06d6167969b4215613d', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
+            } }))), h("dga-carousel", { key: 'cb182020cd4ed2306c47b9f4476db03a8613d559', size: 'lg', arrowsVariant: 'subtle' }, h("dga-carousel-item", { key: 'fd47971614a2997dd27590b0085ae683ba9e8bd7' }, h("img", { key: '2558ccb9d09e6127e5ae4bba09cddc771c3ab4ad', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
-            } })), h("dga-carousel-item", { key: '9ed281fceb708157d69223519b14245be69599b4' }, h("img", { key: '79f1a7c64163feb28d82be549dc28532152b571b', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '0b84913d49afb0680abb4c34ab21e4468957f1fc' }, h("img", { key: 'e6f25499145bcc4a66d78a49d440769bd960bd8e', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '96f030c6fc5a831e8c3f49c87a7a5bf8e06bc255' }, h("img", { key: '0efe242ebb43ad63a43bd7fd7a5addee1ab2ba36', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '8d842f30488f32405023cdecfb3a060a61e42983' }, h("img", { key: '7aa3b89e397bb0cf819d910fd9edeba6ca66ad75', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '2164ba73ca62dde355f0771be0db5a2cb855a357' }, h("img", { key: '195f3be81b45e810a4f5996c0d4dd1d40eeef650', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '901089733f955a759488b513c4861e32803d8646' }, h("img", { key: '949d05ea24a20b538a9c23bd08d421b64496947a', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '9af98239600eb2f4afc46e3c69da0e8f41c250b9' }, h("img", { key: '5d851965c85f759239023385cb79c3e8cd32dfb0', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '8c129144b60e0d81b1b1f6f8990cd2ea0afd32b8' }, h("img", { key: 'a1d2aedbee127fb4f1513f9385721cd529bb90dd', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '8aad964e85133fca7aee54708860ceca6ae47ad9' }, h("img", { key: '4b111e2753b3be00ecf44ce4a515f4906f512a91', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '18d6d6ff1553d34c744b818ea32084bfb2d1ffab' }, h("img", { key: 'ca0a194502888823e851392e29a11083c0f3f73a', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '30f503c3edc5b7ec9d1eedfea5f86cca7e358ce4' }, h("img", { key: 'd986bfe967541d2be4fa2e3bb976aa317aeaeefe', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '04251fca381ea93a9111e369da385a2129baab38' }, h("img", { key: 'd2405e0bb9e8210279bb2a434a88687d9e652d4c', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } }))), h("dga-carousel", { key: '54a5ea95dc0c742da10132adbf4e052fbca46f2e', size: 'md' }, h("dga-carousel-item", { key: '43a74a34d6326e728e35741da0acb762892efc3e' }, h("img", { key: 'd8593c0d21244d805aeafb6737075a7de4104491', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
+            } }))), h("dga-carousel", { key: '791794e37fdeda3c2e44b9b9c05f70a25b11984c', size: 'md' }, h("dga-carousel-item", { key: '0b1545c5766d9f1aa7f0d7f801e0e8d74a34cfd5' }, h("img", { key: 'b49b679f35e97257d36277fd4628c93f68e47fbb', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
-            } })), h("dga-carousel-item", { key: 'a82ca444b0b21de3d30787409f30bba3c79c5b01' }, h("img", { key: '88f1f5fa2a9a1da3b495e8eb182f40d1f8d1d0a1', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: 'd3764b267c528308840c6af974e900ea8446d418' }, h("img", { key: 'c56797b434247b20d096cae54151187e5aed396e', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: 'f1be2e0ebfd2fe80b6755106d6f78910ce71d4c1' }, h("img", { key: 'a37799436639fb6be0a1d3e88109ea55d68ec305', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '412565f32126dfa34bd71b10e0bead1e45b5dc73' }, h("img", { key: '5a142718e6c75312dab32e712d2902dc07d887a6', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '729a8baff29b6e4630e1063d64782c37aa4e9082' }, h("img", { key: 'b44d76f62c33b53d96dca42cda1a5f538fcc933a', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: 'a8b08cf2e88df3d08b223593cfc2709192114385' }, h("img", { key: '51e428bb3f6e517723f07aa7f7ab45e73e2e07ef', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '820a0f6ee9128044738066f125a84adecc53d88b' }, h("img", { key: '10df7349b84e47e29a8f0c8625bca800c9097b6d', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '91b82af2f701c26986c39ed67bc507c743b8a1fb' }, h("img", { key: '0aab053ebbdc05b6c860f5e98aaf4185cb3e0084', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: 'dcc456f1aa16d9d046fa2a20af08be1f71c56957' }, h("img", { key: '5598a8d27a8ed1d28fc6ba8b3dc44610cb71eb14', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: 'c5b97df00dfb9feb2cf0b82c4ef297ba4d1d4327' }, h("img", { key: 'ddc507f35476a2e56a81027e0d4f2a2cab8c5873', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: 'c861b23d5762a76029bffcea6dd8b5ddbf8cd232' }, h("img", { key: '6754a4a491f364b19a745b3da7ac1ae45b4f6b8b', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: 'df85a9251bddd0451d3a0db1d29be1c4a76c45df' }, h("img", { key: 'e9dc5537705fed110ab896b8d36a24c1a09390c1', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } }))), h("dga-carousel", { key: '5716ff0861dfb7d1a31daf081e5838ab4c4770fc', size: 'sm' }, h("dga-carousel-item", { key: 'dcb17613505193a0788fd27c1409d5a23641dbba' }, h("img", { key: 'b33419099211a2f96d3b5efa4dbfeac98cfbe10e', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
+            } }))), h("dga-carousel", { key: '396dc965f68ffa84e1552682bfb00ba7785279c5', size: 'sm' }, h("dga-carousel-item", { key: '615c2dbe2d121019feeca8f93dc0ede025fc3f8c' }, h("img", { key: '29467aba91e13287a2ba05e9e97870418a6703cb', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
-            } })), h("dga-carousel-item", { key: '2f6ab0be313ada78566ab6fe81fa8b42e2d3a467' }, h("img", { key: '5fd2fe2e798b3afff16b5fbf8b9fa389134cf5b2', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '4e7dde8d3c30d7bf80456bb70cff555c92921e28' }, h("img", { key: '765363ac7de87c3b00ab9dded6ee99f939ab4765', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '2be9790f67b185e485c4e9755c1c3c85a601b2b2' }, h("img", { key: 'bed239ca1653760d4f93be0a249376f311fa9dad', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '0e0b615c68d944c3a10cc30538e55d3767268a8f' }, h("img", { key: 'bc8ef9fbf8e6d432c3546c13ae147d8a1e7cbc07', src: "https://cdn.pixabay.com/photo/2019/11/03/01/56/landscape-4597742_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '6d4bbe1dfa316d66a6093811413bc143c8b6643f' }, h("img", { key: '1276295bbf075690839f2b924fc25a266f98a837', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: 'f8f0bbdc6fcd4f5d7e492a036bb9c6ce0077adbc' }, h("img", { key: '2031d46b29a5002cfdc649fcb2254fcb7558859d', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '09d3024b25a3b75ca3fe3abb6959b73d1561cf63' }, h("img", { key: '2fd2c391bc34279a5fb3e9a14b459ca2281a5016', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '5a26a3e45ea0305dbe667d888cddd53127361ec6' }, h("img", { key: 'df7ad698fe14cbbf5c2067a84adaf12048daa9ca', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: '52c6e397cc01ddb93132feffe40b5ebda9e4a44c' }, h("img", { key: 'cfa1b1715928878e18d30be31432d36ad40a39b1', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '14d6ffca06e1ba5c334e0ba075c6499e2802eae2' }, h("img", { key: '8ffaaf1cb69a4bf6148099e6b1fc73a948eee06a', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })), h("dga-carousel-item", { key: 'a9571bccae3830a00a341c32f70f9664939d3459' }, h("img", { key: 'b144ebbe64781edbef28b5071ca946d8b8194d60', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
+            } })), h("dga-carousel-item", { key: '41243a8f1cd16a4fa3e8983e554fc4bcffe51eb9' }, h("img", { key: '20d11e1c584f72351c7c1f135ea52324f8554347', src: "https://cdn.pixabay.com/photo/2020/07/09/10/31/sea-5386810_1280.jpg", style: {
                 height: '300px',
                 width: '450px',
                 objectFit: 'cover',
-            } })))), h("div", { key: '8e640b23d32f5a16c76d75090a534f31bbce552e', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+            } })))), h("div", { key: '5dc368ef3e35e246d8704849c95c2f09bb1ea61a', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
     static get is() { return "dga-carousel-usage"; }
     static get states() {

package/dist/collection/usage/dga-chart-usage.js

@@ -434,7 +434,7 @@
 import { h } from "@stencil/core";
 export class DgaChartUsage {
     render() {
-        return (h("div", { key: '83fcfefb7ac03770c9725bae73618aa92001ee62' }, h("h1", { key: 'c5bd1d87654d0b5d7e7aa9ea81079945294784df' }, " Chart Example"), h("div", { key: '1c6a23b8465b04b087d23f63a64097ba9cbe544a', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: '6ccbcb7fbfa830ba6a3ae6e63dcc423f701e0608', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-chart", { key: 'd02a6838094bf10c9c118818fe8a688809a17432', type: "donut", series: [44, 55, 13, 33], labels: ['Apple', 'Mango', 'Orange', 'Watermelon'] }), h("dga-chart", { key: 'fb9f0fe560ab9738095cddfa4ef106b645e67c3c', type: "pie", series: [44, 55, 13, 33], labels: ['Apple', 'Mango', 'Orange', 'Watermelon'] }), h("dga-chart", { key: 'cfda6bcbc6056b5774085c6cc6dbc44d771ab2b0', type: 'line', series: [
+        return (h("div", { key: '91054295b8e1075c8f0cfe532107a163d5cd1736' }, h("h1", { key: '8347c6a77c34ff1043acbe5d7275cc0698952605' }, " Chart Example"), h("div", { key: 'b70e42f354aa66b85c563664a2a9e9e17353025a', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: '9ddd8ef9e51cf481f284d8722b1b6f35a491768e', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-chart", { key: 'a00aa0be180d54e27400f3918c6891ffd73fe3d5', type: "donut", series: [44, 55, 13, 33], labels: ['Apple', 'Mango', 'Orange', 'Watermelon'] }), h("dga-chart", { key: '609442d56c96b8da8069c02f26d61b4b3a758622', type: "pie", series: [44, 55, 13, 33], labels: ['Apple', 'Mango', 'Orange', 'Watermelon'] }), h("dga-chart", { key: 'f756f8a16664429297ec264a66e4ec39ebe98d9b', type: 'line', series: [
                 {
                     name: 'Series A',
                     data: [1.4, 2, 2.5, 1.5, 2.5, 2.8, 3.8, 4.6],
@@ -452,7 +452,7 @@ export class DgaChartUsage {
                 title: {
                     text: 'Active users',
                 },
-            } }), h("dga-chart", { key: '3b78cd315613e2d8383015b57b3a04d04de3f44c', series: [
+            } }), h("dga-chart", { key: '5d3fe0e2cf1f707b95da89c78c3493378d85b75b', series: [
                 {
                     name: 'Series A',
                     data: [44, 55, 41, 44, 55, 41],

package/dist/collection/usage/dga-checkbox-usage.js

@@ -4,7 +4,7 @@ export class DgaCheckboxUsage {
         this.variant = 'neutral';
     }
     render() {
-        return (h("div", { key: 'a483cef3cb8e1955e389abe3f53ca4e56d27fa5f' }, h("h1", { key: 'd4eab69e583e72b6030a3a79b5cb7316328cc898' }, "Checkbox Example"), h("div", { key: '187b5c935ce2e3f6b03015e1d7f13b78512a3b9d', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: '2ee93b117824c16d8320383414ad0e7b4efe74f5', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("h1", { key: '626761653edefee15bb9cca6267bf97718c55627' }, "test"), h("dga-checkbox", { key: '482686a7d0a8337d38c2a74589d3df856a438078', label: 'Checkbox Label Checkbox Label Checkbox Label Checkbox Label', Indeterminate: false, alertMessage: true, alertText: "Error/Warning message" }), h("dga-checkbox", { key: '8cab965ec5043a8fd33af2399286ef50abcafa42', size: 'lg' }), h("dga-checkbox", { key: 'f25c38290b8294f33175d1cd0826d9c7427caf26', size: 'md' }), h("dga-checkbox", { key: 'eba658dfc8f3d0e5a539972b6e66fa1968fc380b', size: 'sm' })), h("div", { key: '317445602b2475b1f5faec1a60b616edc59d7d9d', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+        return (h("div", { key: 'c4e540214198e65b5f432db3c5bbc8158c81dd06' }, h("h1", { key: '338bb151722f1f32b745782ccf3ae74af30fe79a' }, "Checkbox Example"), h("div", { key: 'cda273202f63609b6ba5309fc72eec20ab2ca924', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: 'a860342b975c3efe2ad9bb82351160baf52ae1ba', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("h1", { key: '6986b01315fefac2b69e9decc528ee6ca1182e6c' }, "test"), h("dga-checkbox", { key: '7de3fccd35c2d7c14243ae82adb8458c6d3832d8', label: 'Checkbox Label Checkbox Label Checkbox Label Checkbox Label', Indeterminate: false, alertMessage: true, alertText: "Error/Warning message" }), h("dga-checkbox", { key: 'da2dbc3ced0bd9991370a40d80b589d14cc9a80f', size: 'lg' }), h("dga-checkbox", { key: 'a71a5d2e0c963996cfbd4a3d74e66a131651af4a', size: 'md' }), h("dga-checkbox", { key: 'e360f109e741920d24ceffdb8e939877cc4f0523', size: 'sm' })), h("div", { key: 'ad09ab4003870d5b6af75e4c3bf8868bd8748d1f', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
     static get is() { return "dga-checkbox-usage"; }
     static get states() {

package/dist/collection/usage/dga-chip-usage.js

@@ -4,14 +4,14 @@ export class DgaChipUsage {
         this.isSelected = false;
     }
     render() {
-        return (h("div", { key: 'c0cb1834eaaff03ba4cb9b329ec22e9ed3c9cdfb' }, h("h1", { key: '3a05c745d94118fd7002bd63fe3ed62e91e50199' }, "Chip Example"), h("div", { key: '74ea33ae9252d1cae19dbc28c1b97c86efdf1ded', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: '623dac617ae8b9552d5fad9355d7bab9701084c5', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-chip", { key: '2606f54245d558b4dfe24298143608d2a30e0ba5', label: "Label", variant: "neutral",
+        return (h("div", { key: '4f3225eda2ba0964283fcc461a3313e7b5325a55' }, h("h1", { key: '7c93c26c7ec9783ddc162d0b4133217d0e3ba8f9' }, "Chip Example"), h("div", { key: '4c464972bf6f0bebcd19e727e27e69f213819173', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: '925542151aa3e2adc88ad46b9d6a73ee5d9d5945', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-chip", { key: '3c380828ee5f01bbc769e6249e477e40df77bd97', label: "Label", variant: "neutral",
             //   outlined={false}
-            rounded: false, size: "lg" }), h("dga-chip", { key: '255a9afaf7fbdd82a639733fbd46893a26511458', label: "Label", variant: "success", rounded: false, size: "lg", onChange: (isSelected) => {
+            rounded: false, size: "lg" }), h("dga-chip", { key: '2ac92e848223d91f7e8a41eb26e455608e7b2ba4', label: "Label", variant: "success", rounded: false, size: "lg", onChange: (isSelected) => {
                 console.log(isSelected, "hi");
                 this.isSelected = isSelected;
-            }, isSelected: this.isSelected }), h("dga-chip", { key: 'b4a44153371408b2a783933b2279ad441fb6641e', label: "Label", variant: "success", rounded: false, size: "lg", onChange: (isSelected) => {
+            }, isSelected: this.isSelected }), h("dga-chip", { key: '74066d05156ae4b751106842ac0a7a15b6e90ee3', label: "Label", variant: "success", rounded: false, size: "lg", onChange: (isSelected) => {
                 console.log(isSelected, "hi");
-            }, isSelected: false }), h("dga-chip", { key: 'c68b763fd3879f0944c3dfb7beab99726bedee4d', label: "Label", variant: "success", rounded: false, size: "lg", disabled: true }), h("div", { key: '2fe9ec7c64d54558adc8f0983f0afdfa3f73ebf7', style: { display: 'flex', flexDirection: 'column', gap: '20px', backgroundColor: '#074D31' } }, h("dga-chip", { key: 'de3ccba82e10f0f190da26da87a0342623b81717', label: "Label", variant: "on-color", rounded: true, size: "lg", disabled: true }))))));
+            }, isSelected: false }), h("dga-chip", { key: '4ad070b0ed242b87171ab2b2b070aca38737985a', label: "Label", variant: "success", rounded: false, size: "lg", disabled: true }), h("div", { key: '100091c180a352409c696f8894fc3cb6c16c72f5', style: { display: 'flex', flexDirection: 'column', gap: '20px', backgroundColor: '#074D31' } }, h("dga-chip", { key: '9aba190cc90dbe6114f447e1990f7f80dbf27f99', label: "Label", variant: "on-color", rounded: true, size: "lg", disabled: true }))))));
     }
     static get is() { return "dga-chip-usage"; }
     static get states() {

package/dist/collection/usage/dga-circular-progress-bar-usage.js

@@ -8,7 +8,7 @@ export class DgaCircularProgressBarUsage {
         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' } }))));
     }
     static get is() { return "dga-circular-progress-bar-usage"; }
     static get states() {

package/dist/collection/usage/dga-codeSnippet-usage.js

@@ -40,7 +40,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 })));
     }
     static get is() { return "dga-codesnippet-usage"; }
 }

package/dist/collection/usage/dga-collapse-usage.js

@@ -5,7 +5,7 @@ export class DgaCollapseUsage {
         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' } }))));
     }
     static get is() { return "dga-collapse-usage"; }
     static get states() {

package/dist/collection/usage/dga-content-switcher-usage.js

@@ -4,7 +4,7 @@ export class DgaContentSwitcherUsage {
         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"))));
     }
     static get is() { return "dga-content-switcher-usage"; }
     static get properties() {

package/dist/collection/usage/dga-date-field-usage.js

@@ -4,7 +4,7 @@ export class DgaDateFieldUsage {
         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 })))));
     }
     static get is() { return "dga-date-field-usage"; }
     static get states() {

package/dist/collection/usage/dga-datepicker-usage.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class DgaPickerUsage {
     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' } }))));
     }
     static get is() { return "dga-datepicker-usage"; }
 }

package/dist/collection/usage/dga-digitalSignature-usage.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class DgaDigitalSignatureUsage {
     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" })));
     }
     static get is() { return "dga-digital-signature-usage"; }
 }

package/dist/collection/usage/dga-divider-usage.js

@@ -1,10 +1,10 @@
 import { h } from "@stencil/core";
 export class DgaDividerUsage {
     render() {
-        return (h("div", { key: '8a1859d0ba5b835033ecd1dd46db52b8f147ccb8' }, h("h1", { key: 'b330eb58b131b61ed80e2638a5c4818a6fa42091' }, "Divider Example"), h("div", { key: '16cb0d3b4e82ce164738abf94ad29d8619057759', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: '7d164a8e64f13c51c9c53b4285e60a42173af52f', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("div", { key: '77e9bdd41c29907792b64adaae5d8208080aacec', style: {
+        return (h("div", { key: 'ff3ffee2d70a8c778f152859d05a64fde636f100' }, h("h1", { key: 'c915d5860e95872ea8208ee77384c947cb052752' }, "Divider Example"), h("div", { key: '6e0cbfbc0c5328beca2c1ef5c24d414108bb317d', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: '1be28c682c8037dfbdb980879e313371caeba521', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("div", { key: 'a723b61e53c4cb5c6bc15de3ba44e97df6d94066', style: {
                 borderRadius: '20px',
                 background: 'gray',
-            } }, h("div", { key: 'c2b12c8cae3128a77be2b2785dd2e5f23cc8da2f', style: {
+            } }, h("div", { key: '998827d8cee8154fa00768400b7cc3d2dbcdc43b', style: {
                 width: '224px',
                 height: '82px',
                 background: '#fff',
@@ -12,7 +12,7 @@ export class DgaDividerUsage {
                 display: 'flex',
                 flexDirection: 'column',
                 gap: '40px',
-            } }, h("dga-divider", { key: '9be4c72b219943372bcf174a0e0154e0bc209741', color: "neutral" }), h("dga-divider", { key: '4e27c8f1e398593da0550a1f422226ad27ac487f', color: "primary" })), h("div", { key: 'eae2b9a61bfe25c00072b73ed7b23dc4456c69b5', style: {
+            } }, h("dga-divider", { key: '6d4a639c5a84397e9828f387a1952ed4bb37d0cb', color: "neutral" }), h("dga-divider", { key: '59672506be6126b1cc4320904923624b7351c19c', color: "primary" })), h("div", { key: '649700e28f0c39cac33654544529cc7dc43b55af', style: {
                 width: '224px',
                 height: '82px',
                 background: '#fff',
@@ -20,7 +20,7 @@ export class DgaDividerUsage {
                 display: 'flex',
                 // flexDirection: 'column',
                 gap: '40px',
-            } }, h("dga-divider", { key: '0edde75a3387fa830e6cf4726d853a5f6c271080', color: "neutral", orientation: 'vertical' }), h("dga-divider", { key: '43ee971af5636fc18c1b90d58fd7596d0fffc2a4', color: "primary", orientation: 'vertical' })), h("div", { key: 'b4d30881e0ae1bf65a7d98538041e6533b2f94eb', style: {
+            } }, h("dga-divider", { key: '6caa38e40aa960c2bb8e1a9a6e40717c428d564d', color: "neutral", orientation: 'vertical' }), h("dga-divider", { key: '3a182b9fa671fc31c44376ef710899d8c3af99dd', color: "primary", orientation: 'vertical' })), h("div", { key: '40c3818c30854ce4a0292b248be8d177f25d9abf', style: {
                 width: '224px',
                 height: '82px',
                 background: '#1B8354',
@@ -28,7 +28,7 @@ export class DgaDividerUsage {
                 display: 'flex',
                 flexDirection: 'column',
                 gap: '40px',
-            } }, h("dga-divider", { key: '37c2709ac92a09f3f537e7914c7d0739cdb0721a', color: "alpha-white" }), h("dga-divider", { key: '531b7020dcc2a39c781d94c19321a3e452e08013', color: "white" })), h("div", { key: '8ff73c8b7f9d403dc8b300b14ef7ff1118ec317b', style: {
+            } }, h("dga-divider", { key: 'e0ce8d59aa3b5d452fa039fe81b9307ca3b947a7', color: "alpha-white" }), h("dga-divider", { key: 'a0ccb20131b45e671e8cbf606dab29ba5f47f321', color: "white" })), h("div", { key: 'b3cf90384fda25f8d3ccb586aaebd538b2cc977e', style: {
                 width: '224px',
                 height: '82px',
                 background: '#1B8354',
@@ -36,7 +36,7 @@ export class DgaDividerUsage {
                 display: 'flex',
                 // flexDirection: 'column',
                 gap: '40px',
-            } }, h("dga-divider", { key: 'd98dd4f9f68bbf1fe66f9654dd562930f7e67fee', color: "alpha-white", orientation: 'vertical' }), h("dga-divider", { key: '36781225b7ef0aa8629ef811b02ee687d63a2d20', color: "white", orientation: 'vertical' })))), h("div", { key: 'f2327b4876553c960457dbbff03c209c11c8927d', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+            } }, h("dga-divider", { key: 'fd0895a26c24b3a9986917f492f3a900ae48edff', color: "alpha-white", orientation: 'vertical' }), h("dga-divider", { key: 'e6ca9271afa5fd6666f176e2452e30ace2c4e72c', color: "white", orientation: 'vertical' })))), h("div", { key: 'b5d39e00e08c601b7cc016b2a8ec153630395ff2', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
     static get is() { return "dga-divider-usage"; }
 }

package/dist/collection/usage/dga-drawer-usage.js

@@ -265,12 +265,12 @@ export class DgaDrawerUsage {
         this.open = false;
     }
     render() {
-        return (h("div", { key: '90fe68d5b53b2af40117f381838256fe1c1ade63' }, h("h1", { key: '5fd1da692e28b59afea8b9cce5dc7d2d7bd15cc4' }, "Drawer Example"), h("div", { key: '4aa3e28fe9970a0c19b988ac2f6663a769b1722d', style: { padding: '0px', display: 'flex', gap: '20px' } }, h("div", { key: '4a0333b42311029ae37bb2261874fbb7f837e224', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("div", { key: '143109c062c15fe698be4a3a4db16d9299d45c81', style: { display: "flex", justifyContent: "center", width: "100vw" } }, h("button", { key: 'dac00101efb1ad4be424c8538382af9e22cc1e57', onClick: () => this.open = true }, "open"), h("button", { key: 'ccc00f33c935fb42584c31979861a8707c2c5a82', onClick: () => this.open = false }, "close")), h("dga-drawer", { key: '0160e92401765628c50589c9272016b3fd270fe1', routes: SidePanelRoutes, open: this.open, background: 'gray', headerLogo: "https://casamedia.com/wp-content/uploads/2023/04/adidas-1024x683.png", sx: {
+        return (h("div", { key: 'c7c6784e3533d70c53b5cd0a373cec1f213ed345' }, h("h1", { key: '15cd2fcbd3c1f9d58663140d78050c941290ab94' }, "Drawer Example"), h("div", { key: 'cce6dc2c44f809d06cdf868a4c2498d2bea74b10', style: { padding: '0px', display: 'flex', gap: '20px' } }, h("div", { key: '054478692ae11648f46784d5325c30241c7c764c', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("div", { key: 'e694cd04a3df690f0b15f7418c018c9b32c13967', style: { display: "flex", justifyContent: "center", width: "100vw" } }, h("button", { key: 'b2d01fff0a558884b1bd78638084f6665ceb35e5', onClick: () => this.open = true }, "open"), h("button", { key: 'ba05ca369d159e4a3416862b3448f770ddfd66ff', onClick: () => this.open = false }, "close")), h("dga-drawer", { key: 'c815361864ff6a90d87a652c9b5d36922924500f', routes: SidePanelRoutes, open: this.open, background: 'gray', headerLogo: "https://casamedia.com/wp-content/uploads/2023/04/adidas-1024x683.png", sx: {
                 "& > .sidepanel": {
                     top: "112px",
                     backgroundColor: "red !important",
                 }
-            } })), h("div", { key: '1d2788380e3f8a0a299685bc1dbe55581b957734', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+            } })), h("div", { key: 'e65c91c5c3ced6ccd0dc6c7525d7207c6bb98b29', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
     static get is() { return "dga-drawer-usage"; }
     static get states() {

package/dist/collection/usage/dga-dropdown-usage.js

@@ -5,7 +5,7 @@ export class DgaDropdownUsage {
         this.selectedValue = 'Option-1';
     }
     render() {
-        return (h("div", { key: 'bfbe141563b8e8a50e03cf812162e0e7e8e28b7d' }, h("h1", { key: '018d8b364a8ca113c1d1f73c8161a913139c26fc' }, "Dropdown Example"), h("div", { key: '3f2ec860ddf835844994b004fa46235adf3ef9b9', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: '346faf5095d6c58d751af44fc9e36092f71b3195', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-dropdown", { key: 'e30cc67d44daaff6896148dc28ba960917e23ae8', placeholder: "Placeholder text", variant: "default", optionLabel: "label", trackBy: "value", value: this.selectedValue, options: [
+        return (h("div", { key: '1882688c6b9c91983903879d826e3358a219e5a4' }, h("h1", { key: 'd9d2931815da214c1caa5a476c72220abcda12c6' }, "Dropdown Example"), h("div", { key: 'a35f90af0490a27a3b7303bcfdb9b0711c5b2008', style: { padding: '50px', display: 'flex', gap: '20px' } }, h("div", { key: '126c0ba46a33cb8e927abf88724ef95ac00063c5', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }, h("dga-dropdown", { key: '26952570c0256eb9c030b85f8c8893755e8a213b', placeholder: "Placeholder text", variant: "default", optionLabel: "label", trackBy: "value", value: this.selectedValue, options: [
                 {
                     label: 'Netherlands Antiles',
                     value: 'Option-1',
@@ -18,7 +18,7 @@ export class DgaDropdownUsage {
                     label: 'Option 3',
                     value: 'Option-3',
                 },
-            ], onChange: (value) => this.selectedValue = value }), this.selectedValue, h("dga-dropdown", { key: '9069a5ce187b943c3b4256593d74bea2c2686e37', placeholder: "Placeholder text", variant: "darker", optionLabel: "label", trackBy: "value", options: [
+            ], onChange: (value) => this.selectedValue = value }), this.selectedValue, h("dga-dropdown", { key: '597849e9b5a665d3b6c3ecbd2c210d59d689826d', placeholder: "Placeholder text", variant: "darker", optionLabel: "label", trackBy: "value", options: [
                 {
                     label: 'Option',
                     value: 'Option',
@@ -35,7 +35,7 @@ export class DgaDropdownUsage {
                     label: 'Option',
                     value: 'Option',
                 },
-            ] }), h("dga-dropdown", { key: '85ddb745b3ccadf0cbdc1eb3c6da6ef26f5b0388', placeholder: "Placeholder text", variant: "lighter", optionLabel: "label", trackBy: "value", options: [
+            ] }), h("dga-dropdown", { key: 'a4923bbb563a37f562a6814fd373a4d51851e057', placeholder: "Placeholder text", variant: "lighter", optionLabel: "label", trackBy: "value", options: [
                 {
                     label: 'Option',
                     value: 'Option',
@@ -52,7 +52,7 @@ export class DgaDropdownUsage {
                     label: 'Option',
                     value: 'Option',
                 },
-            ] }), h("dga-dropdown", { key: '7a2c9d308754ea53913f5dfb089220c18881c53c', error: true, placeholder: "Placeholder text", variant: "lighter", optionLabel: "label", trackBy: "value", options: [
+            ] }), h("dga-dropdown", { key: 'fb13b75be207248ea647f5abc65462a006355905', error: true, placeholder: "Placeholder text", variant: "lighter", optionLabel: "label", trackBy: "value", options: [
                 {
                     label: 'Option',
                     value: 'Option',
@@ -86,7 +86,7 @@ export class DgaDropdownUsage {
                     label: 'Option',
                     value: 'Option',
                 },
-            ] }))), h("dga-dropdown", { key: '02553029708b37cc97e39c7109973ba524b9188b', multiSelect: true, placeholder: "Placeholder text", variant: "lighter", optionLabel: "label", trackBy: "value", options: [
+            ] }))), h("dga-dropdown", { key: 'fc62c523c87dc2ace95f9059c6eacac9eb42a823', multiSelect: true, placeholder: "Placeholder text", variant: "lighter", optionLabel: "label", trackBy: "value", options: [
                 {
                     label: 'Option',
                     value: 'Option',
@@ -103,7 +103,7 @@ export class DgaDropdownUsage {
                     label: 'Option',
                     value: 'Option',
                 },
-            ] })), h("div", { key: '08b7ec863d9a00c7a9c98d8f7268719d34a13a7f', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
+            ] })), h("div", { key: '2a3284bbeacb949680d4971d49916ef5327c6974', style: { display: 'flex', flexDirection: 'column', gap: '20px' } }))));
     }
     static get is() { return "dga-dropdown-usage"; }
     static get states() {