@dubai-design-system/components-js 3.12.10 → 3.12.11

package/dist/collection/components/dda-header-menu/dda-header-menu.js

@@ -1,222 +0,0 @@
-import { Host, h } from "@stencil/core";
-export class DdaHeaderMenu {
-    constructor() {
-        this.useNavigator = 'false';
-        this.quickLinks = [];
-        this.openIndex = null;
-        this.openSubIndex = null;
-        this.handleClickOutside = (event) => {
-            const target = event.target;
-            if (!this.el.contains(target)) {
-                this.openIndex = null;
-                this.openSubIndex = null;
-            }
-        };
-    }
-    get parsedMenuItems() {
-        if (typeof this.quickLinks === 'string') {
-            try {
-                return JSON.parse(this.quickLinks);
-            }
-            catch (_a) {
-                console.warn('Invalid JSON in quickLinks');
-                return [];
-            }
-        }
-        return this.quickLinks;
-    }
-    handleToggle(index, hasSubmenu, event, item) {
-        if (hasSubmenu) {
-            event.preventDefault();
-            this.openIndex = this.openIndex === index ? null : index;
-            this.openSubIndex = null;
-        }
-        else {
-            if (this.useNavigator == "true") {
-                this.navigatorClick.emit(item.url);
-            }
-        }
-    }
-    connectedCallback() {
-        document.addEventListener('click', this.handleClickOutside);
-    }
-    disconnectedCallback() {
-        document.removeEventListener('click', this.handleClickOutside);
-    }
-    handleKeydown(event) {
-        if (event.key === 'Escape') {
-            this.openIndex = null;
-            this.openSubIndex = null;
-        }
-    }
-    renderDefaultSubmenu(children, isOpen, submenuId, headerMenuLabel) {
-        return (h("div", { class: {
-                'dda-default-submenu': true,
-                'is-visible': isOpen,
-            }, id: submenuId, "aria-label": `${headerMenuLabel} Submenu` }, h("ul", null, children.map((item, subIndex) => {
-            const hasSubSubmenu = item.children && item.children.length > 0;
-            const subSubmenuId = `subsubmenu-${submenuId}-${subIndex}`;
-            const isSubOpen = this.openSubIndex === subIndex;
-            return (h("li", null, h("a", { href: this.useNavigator == "true" ? 'javascript:void(0)' : item.url, id: item.headerMenuId, "aria-haspopup": hasSubSubmenu ? 'true' : undefined, "aria-expanded": hasSubSubmenu ? String(isSubOpen) : undefined, "aria-controls": hasSubSubmenu ? subSubmenuId : undefined, class: {
-                    'has-submenu': hasSubSubmenu,
-                    'active': isSubOpen,
-                }, onClick: e => {
-                    if (hasSubSubmenu) {
-                        e.preventDefault();
-                        this.openSubIndex = this.openSubIndex === subIndex ? null : subIndex;
-                    }
-                    else {
-                        if (this.useNavigator == "true") {
-                            this.navigatorClick.emit(item.url);
-                        }
-                    }
-                } }, item.headerMenuLabel), hasSubSubmenu && (h("div", { class: {
-                    'dda-default-subsubmenu': true,
-                    'is-visible': isSubOpen,
-                }, id: subSubmenuId, "aria-label": `${item.headerMenuLabel} Sub Submenu` }, h("div", { class: "dda-default-subsubmenu-content" }, h("span", { class: "dda-submenu-title" }, item.defaultSubMenuTitle || item.headerMenuLabel), h("ul", null, item.children.map((subItem, subItemIndex) => (h("li", null, h("a", {
-                // href={subItem.url}
-                href: this.useNavigator == "true" ? 'javascript:void(0)' : subItem.url, id: `${subSubmenuId}-${subItemIndex}`, onClick: () => this.useNavigator == "true" ? this.navigatorClick.emit(subItem.url) : ""
-            }, subItem.headerMenuLabel))))))))));
-        }))));
-    }
-    renderMegaMenu(children, isOpen, submenuId, headerMenuLabel) {
-        return (h("div", { class: {
-                'dda-main-megamenu': true,
-                'is-visible': isOpen,
-            }, id: submenuId, "aria-label": `${headerMenuLabel} Mega Menu` }, h("div", { class: "dda-megamenu-wrap" }, h("div", { class: "dda-megamenu-content" }, h("div", { class: "dda-row" }, children.map((col, colIndex) => (h("div", { class: "dda-col-md-3", key: `col-${colIndex}` }, col.title && h("h6", { "aria-label": `${col.title} section`, class: "megamemu-sub-title" }, col.title), h("ul", null, col.items.map((item, itemIndex) => (h("li", { key: `item-${itemIndex}` }, h("a", { class: "dda-mega-menu-link",
-            // href={item.url}
-            href: this.useNavigator == "true" ? 'javascript:void(0)' : item.url, onClick: () => this.useNavigator == "true" ? this.navigatorClick.emit(item.url) : "" }, this.showQuickLinksIcon ? (h("span", { class: "dda-mega-menu-icon", "aria-hidden": "true" }, h("i", { class: "material-icons material-symbols-outlined" }, item.quickLinksIcon ? item.quickLinksIcon : "sentiment_satisfied"))) : "", h("span", { class: "text-wrap" }, h("span", { class: "dda-mega-menu-text" }, item.headerMenuLabel), item.description && (h("span", { class: "dda-mega-menu-desc" }, item.description))))))))))))))));
-    }
-    render() {
-        return (h(Host, { key: '7e41be72169fa2897048141d19c1e2bf103ed9c6' }, h("nav", { key: '4c2d25193433e9aea37e8ec8f1417198a56e1d39', "aria-label": "Main navigation", class: "dda-header-menu" }, h("ul", { key: 'c806f126eb949d8d64171a99f014777d9bf3478e', class: "dda-mega-menu" }, this.parsedMenuItems.map((item, index) => {
-            const isOpen = this.openIndex === index;
-            const hasSubmenu = item.children && item.children.length > 0;
-            const submenuId = `submenu-${index}`;
-            const type = item.type;
-            return (h("li", { key: `top-${index}` }, h("a", {
-                // href={item.url}
-                href: this.useNavigator == "true" ? 'javascript:void(0)' : item.url, "aria-haspopup": hasSubmenu ? 'true' : undefined, "aria-expanded": hasSubmenu ? String(isOpen) : undefined, "aria-controls": hasSubmenu ? submenuId : undefined,
-                // class={isOpen ? 'active' : ''}
-                class: {
-                    'active': item.active === 'true' || isOpen, // from props OR open state
-                }, onClick: e => this.handleToggle(index, hasSubmenu, e, item)
-            }, item.headerMenuLabel), hasSubmenu && type === 'dda_default_submenu' &&
-                this.renderDefaultSubmenu(item.children, isOpen, submenuId, item.headerMenuLabel), hasSubmenu && type === 'dda_main_megamenu' &&
-                this.renderMegaMenu(item.children, isOpen, submenuId, item.headerMenuLabel)));
-        })))));
-    }
-    static get is() { return "dda-header-menu"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["dda-header-menu.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["dda-header-menu.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "showQuickLinksIcon": {
-                "type": "boolean",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "show-quick-links-icon",
-                "reflect": false
-            },
-            "useNavigator": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'true' | 'false'",
-                    "resolved": "\"false\" | \"true\"",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "use-navigator",
-                "reflect": false,
-                "defaultValue": "'false'"
-            },
-            "quickLinks": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string | Array<{\r\n      headerMenuLabel: string;\r\n      headerMenuId: string;\r\n      description: string;\r\n      url: string;\r\n      quickLinksIcon: string;\r\n      type?: 'dda_default_submenu' | 'dda_main_megamenu';\r\n      children?: any;\r\n  }>",
-                    "resolved": "string | { headerMenuLabel: string; headerMenuId: string; description: string; url: string; quickLinksIcon: string; type?: \"dda_default_submenu\" | \"dda_main_megamenu\"; children?: any; }[]",
-                    "references": {
-                        "Array": {
-                            "location": "global",
-                            "id": "global::Array"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "quick-links",
-                "reflect": false,
-                "defaultValue": "[]"
-            }
-        };
-    }
-    static get states() {
-        return {
-            "openIndex": {},
-            "openSubIndex": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "navigatorClick",
-                "name": "navigatorClick",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                }
-            }];
-    }
-    static get elementRef() { return "el"; }
-    static get listeners() {
-        return [{
-                "name": "keydown",
-                "method": "handleKeydown",
-                "target": "window",
-                "capture": false,
-                "passive": false
-            }];
-    }
-}
-//# sourceMappingURL=dda-header-menu.js.map

package/dist/collection/components/dda-header-menu/dda-header-menu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-header-menu.js","sourceRoot":"","sources":["../../../src/components/dda-header-menu/dda-header-menu.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h, Prop, State, Element, Listen, EventEmitter, Event } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'dda-header-menu',\r\n  styleUrls: ['dda-header-menu.css'],\r\n  shadow: false,\r\n})\r\nexport class DdaHeaderMenu {\r\n  @Element() el: HTMLElement;\r\n  \r\n  @Event() navigatorClick?: EventEmitter<string>;\r\n\r\n  @Prop() showQuickLinksIcon: boolean;\r\n\r\n  @Prop() useNavigator: 'true' | 'false' = 'false';\r\n  \r\n  @Prop() quickLinks: string | Array<{\r\n      headerMenuLabel: string;\r\n      headerMenuId: string;\r\n      description: string;\r\n      url: string;\r\n      quickLinksIcon: string;\r\n      type?: 'dda_default_submenu' | 'dda_main_megamenu';\r\n      children?: any;\r\n  }> = [];  @State() openIndex: number | null = null;\r\n  @State() openSubIndex: number | null = null;\r\n\r\n  get parsedMenuItems() {\r\n    if (typeof this.quickLinks === 'string') {\r\n      try {\r\n        return JSON.parse(this.quickLinks);\r\n      } catch {\r\n        console.warn('Invalid JSON in quickLinks');\r\n        return [];\r\n      }\r\n    }\r\n    return this.quickLinks;\r\n  }\r\n\r\n  handleToggle(index: number, hasSubmenu: boolean, event: Event, item: any) {\r\n    if (hasSubmenu) {\r\n      event.preventDefault();\r\n      this.openIndex = this.openIndex === index ? null : index;\r\n      this.openSubIndex = null;\r\n    }else{\r\n      if(this.useNavigator == \"true\"){\r\n\r\n        this.navigatorClick.emit(item.url)\r\n      }\r\n    }\r\n  }\r\n\r\n  handleClickOutside = (event: MouseEvent) => {\r\n    const target = event.target as HTMLElement;\r\n    if (!this.el.contains(target)) {\r\n      this.openIndex = null;\r\n      this.openSubIndex = null;\r\n    }\r\n  };\r\n\r\n  connectedCallback() {\r\n    document.addEventListener('click', this.handleClickOutside);\r\n  }\r\n\r\n  disconnectedCallback() {\r\n    document.removeEventListener('click', this.handleClickOutside);\r\n  }\r\n\r\n  @Listen('keydown', { target: 'window' })\r\n  handleKeydown(event: KeyboardEvent) {\r\n    if (event.key === 'Escape') {\r\n      this.openIndex = null;\r\n      this.openSubIndex = null;\r\n    }\r\n  }\r\n\r\n  renderDefaultSubmenu(children, isOpen, submenuId, headerMenuLabel) {\r\n    return (\r\n      <div\r\n        class={{\r\n          'dda-default-submenu': true,\r\n          'is-visible': isOpen,\r\n        }}\r\n        id={submenuId}\r\n        aria-label={`${headerMenuLabel} Submenu`}\r\n      >\r\n        <ul>\r\n          {children.map((item, subIndex) => {\r\n            const hasSubSubmenu = item.children && item.children.length > 0;\r\n            const subSubmenuId = `subsubmenu-${submenuId}-${subIndex}`;\r\n            const isSubOpen = this.openSubIndex === subIndex;\r\n\r\n            return (\r\n              <li>\r\n                \r\n\r\n                <a\r\n                  href={this.useNavigator == \"true\" ? 'javascript:void(0)' : item.url}\r\n                  id={item.headerMenuId}\r\n                  aria-haspopup={hasSubSubmenu ? 'true' : undefined}\r\n                  aria-expanded={hasSubSubmenu ? String(isSubOpen) : undefined}\r\n                  aria-controls={hasSubSubmenu ? subSubmenuId : undefined}\r\n                  class={{\r\n                    'has-submenu': hasSubSubmenu,\r\n                    'active': isSubOpen,\r\n                  }}\r\n                  onClick={e => {\r\n                    if (hasSubSubmenu) {\r\n                      e.preventDefault();\r\n                      this.openSubIndex = this.openSubIndex === subIndex ? null : subIndex;\r\n                    }else{\r\n                      if(this.useNavigator == \"true\"){\r\n\r\n                        this.navigatorClick.emit(item.url)\r\n                      }\r\n                    }\r\n                  }}\r\n                >\r\n                  {item.headerMenuLabel}\r\n                </a>\r\n\r\n                {hasSubSubmenu && (\r\n                  <div\r\n                    class={{\r\n                      'dda-default-subsubmenu': true,\r\n                      'is-visible': isSubOpen,\r\n                    }}\r\n                    id={subSubmenuId}\r\n                    aria-label={`${item.headerMenuLabel} Sub Submenu`}\r\n                  >\r\n                    <div class=\"dda-default-subsubmenu-content\">\r\n                      <span class=\"dda-submenu-title\">{item.defaultSubMenuTitle || item.headerMenuLabel}</span>\r\n                      <ul>\r\n                        {item.children.map((subItem, subItemIndex) => (\r\n                          <li>\r\n                            <a\r\n                              // href={subItem.url}\r\n                              href={this.useNavigator == \"true\" ? 'javascript:void(0)' : subItem.url}\r\n                              id={`${subSubmenuId}-${subItemIndex}`}\r\n                              onClick={() => this.useNavigator == \"true\" ? this.navigatorClick.emit(subItem.url) : \"\"}\r\n                            >\r\n                              {subItem.headerMenuLabel}\r\n                            </a>\r\n                          </li>\r\n                        ))}\r\n                      </ul>\r\n                    </div>\r\n                  </div>\r\n                )}\r\n              </li>\r\n            );\r\n          })}\r\n        </ul>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  renderMegaMenu(children, isOpen, submenuId, headerMenuLabel) {\r\n    return (\r\n      <div\r\n        class={{\r\n          'dda-main-megamenu': true,\r\n          'is-visible': isOpen,\r\n        }}\r\n        id={submenuId}\r\n        aria-label={`${headerMenuLabel} Mega Menu`}\r\n      >\r\n        <div class=\"dda-megamenu-wrap\">\r\n          <div class=\"dda-megamenu-content\">\r\n            <div class=\"dda-row\">\r\n              {children.map((col, colIndex) => (\r\n                <div class=\"dda-col-md-3\" key={`col-${colIndex}`}>\r\n                  {col.title && <h6 aria-label={`${col.title} section`} class=\"megamemu-sub-title\">{col.title}</h6>}\r\n                  <ul>\r\n                    {col.items.map((item, itemIndex) => (\r\n                      <li key={`item-${itemIndex}`}>\r\n                        \r\n                        <a\r\n                          class=\"dda-mega-menu-link\"\r\n                          // href={item.url}\r\n                          href={this.useNavigator == \"true\" ? 'javascript:void(0)' : item.url}\r\n                          onClick={() => this.useNavigator == \"true\"?  this.navigatorClick.emit(item.url) :\"\"}\r\n                        >\r\n                          {this.showQuickLinksIcon ? (\r\n                            <span class=\"dda-mega-menu-icon\" aria-hidden=\"true\">\r\n                              <i class=\"material-icons material-symbols-outlined\">\r\n                                {item.quickLinksIcon ? item.quickLinksIcon : \"sentiment_satisfied\"}\r\n                              </i>\r\n                            </span>\r\n                          ) : \"\"}\r\n                          <span class=\"text-wrap\">\r\n                            <span class=\"dda-mega-menu-text\">{item.headerMenuLabel}</span>\r\n                            {item.description && (\r\n                              <span class=\"dda-mega-menu-desc\">\r\n                                {item.description}\r\n                              </span>\r\n                            )}\r\n                          </span>\r\n                        </a>\r\n                      </li>\r\n                    ))}\r\n                  </ul>\r\n                </div>\r\n              ))}\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  render() {\r\n    return (\r\n      <Host>\r\n        <nav aria-label=\"Main navigation\" class=\"dda-header-menu\">\r\n          <ul class=\"dda-mega-menu\">\r\n            {this.parsedMenuItems.map((item, index) => {\r\n              const isOpen = this.openIndex === index;\r\n              const hasSubmenu = item.children && item.children.length > 0;\r\n              const submenuId = `submenu-${index}`;\r\n              const type = item.type;\r\n\r\n              return (\r\n                <li key={`top-${index}`}>\r\n                  \r\n                  <a\r\n                    // href={item.url}\r\n                    href={this.useNavigator == \"true\" ? 'javascript:void(0)' : item.url}\r\n                    aria-haspopup={hasSubmenu ? 'true' : undefined}\r\n                    aria-expanded={hasSubmenu ? String(isOpen) : undefined}\r\n                    aria-controls={hasSubmenu ? submenuId : undefined}\r\n                    \r\n                    // class={isOpen ? 'active' : ''}\r\n                    class={{\r\n                      'active': item.active === 'true' || isOpen, // from props OR open state\r\n                    }}\r\n\r\n                    onClick={e => this.handleToggle(index, hasSubmenu, e, item)}\r\n                  >\r\n                    {item.headerMenuLabel}\r\n                  </a>\r\n\r\n                  {hasSubmenu && type === 'dda_default_submenu' &&\r\n                    this.renderDefaultSubmenu(item.children, isOpen, submenuId, item.headerMenuLabel)}\r\n\r\n                  {hasSubmenu && type === 'dda_main_megamenu' &&\r\n                    this.renderMegaMenu(item.children, isOpen, submenuId, item.headerMenuLabel)}\r\n                </li>\r\n              );\r\n            })}\r\n          </ul>\r\n        </nav>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/dda-header-menu/dda-header-menu.stories.js

@@ -1,125 +0,0 @@
-export default {
-    title: 'Components/DDA Header Menu/ DDA Header Menu',
-    component: 'dda-header-menu',
-    argTypes: {
-        quickLinks: {
-            control: 'object',
-            description: 'Array of quick links with optional submenu type and children',
-        },
-    },
-    parameters: {
-        docs: {
-            description: {
-                component: `
-Each menu item can define its own submenu type:
-
-- \`type: 'dda_default_submenu'\` — basic list
-- \`type: 'dda_main_megamenu'\` — 4-column mega menu
-
-\`\`\`ts
-{
-  headerMenuLabel: 'About Us',
-  url: '#',
-  type: 'dda_default_submenu',
-  children: [ { headerMenuLabel: 'Submenu 1', url: '#' }, ... ]
-}
-\`\`\`
-
-\`\`\`ts
-{
-  headerMenuLabel: 'Services',
-  url: '#',
-  type: 'dda_main_megamenu',
-  children: [
-    { title: 'Column 1', items: [{ headerMenuLabel: 'Submenu 1', url: '#' }] },
-    ...
-  ]
-}
-\`\`\`
-        `,
-            },
-        },
-    },
-};
-const Template = args => `
-  <dda-header-menu
-    quick-links='${JSON.stringify(args.quickLinks)}'
-  ></dda-header-menu>
-`;
-export const Default = Template.bind({});
-Default.args = {
-    quickLinks: [
-        { headerMenuLabel: 'Home', active: 'true', url: '#' },
-        // default dropdown menu
-        {
-            headerMenuLabel: 'About Us',
-            url: 'javascript:void(0)',
-            type: 'dda_default_submenu',
-            children: [
-                {
-                    headerMenuLabel: 'Submenu 1',
-                    url: '#',
-                    headerMenuId: 'customeID',
-                    defaultSubMenuTitle: 'Submenu 1 Title',
-                    children: [
-                        { headerMenuLabel: 'SubSubmenu 1', url: '#' },
-                        { headerMenuLabel: 'SubSubmenu 1', url: '#' },
-                    ],
-                },
-                {
-                    headerMenuLabel: 'Submenu 2',
-                    url: '#',
-                    headerMenuId: 'customeID',
-                    defaultSubMenuTitle: 'Submenu 2 Title',
-                    children: [
-                        { headerMenuLabel: 'SubSubmenu 2', url: '#' },
-                        { headerMenuLabel: 'SubSubmenu 2', url: '#' },
-                    ],
-                },
-                {
-                    headerMenuLabel: 'Submenu 3',
-                    url: '#',
-                    headerMenuId: 'customeID',
-                },
-            ],
-        },
-        // mega menu
-        {
-            headerMenuLabel: 'Services',
-            url: 'javascript:void(0)',
-            type: 'dda_main_megamenu',
-            children: [
-                {
-                    title: 'QUICK LINKS 1',
-                    items: [
-                        {
-                            headerMenuLabel: 'Service 1',
-                            url: '#',
-                            description: 'Service Description',
-                        },
-                        { headerMenuLabel: 'Service 2', url: '#' },
-                        { headerMenuLabel: 'Service 3', url: '#' },
-                    ],
-                },
-                {
-                    title: 'QUICK LINKS 2',
-                    items: [
-                        { headerMenuLabel: 'Service 1', url: '#' },
-                        { headerMenuLabel: 'Service 2', url: '#' },
-                        { headerMenuLabel: 'Service 3', url: '#' },
-                    ],
-                },
-                {
-                    title: 'QUICK LINKS 3',
-                    items: [{ headerMenuLabel: 'Service 3', url: '#' }],
-                },
-                {
-                    title: 'QUICK LINKS 4',
-                    items: [{ headerMenuLabel: 'Service 4', url: '#' }],
-                },
-            ],
-        },
-        { headerMenuLabel: 'Contact', url: '#' },
-    ],
-};
-//# sourceMappingURL=dda-header-menu.stories.js.map

package/dist/collection/components/dda-header-menu/dda-header-menu.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-header-menu.stories.js","sourceRoot":"","sources":["../../../src/components/dda-header-menu/dda-header-menu.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["export default {\r\n  title: 'Components/DDA Header Menu/ DDA Header Menu',\r\n  component: 'dda-header-menu',\r\n  argTypes: {\r\n    quickLinks: {\r\n      control: 'object',\r\n      description: 'Array of quick links with optional submenu type and children',\r\n    },\r\n  },\r\n  parameters: {\r\n    docs: {\r\n      description: {\r\n        component: `\r\nEach menu item can define its own submenu type:\r\n\r\n- \\`type: 'dda_default_submenu'\\` — basic list\r\n- \\`type: 'dda_main_megamenu'\\` — 4-column mega menu\r\n\r\n\\`\\`\\`ts\r\n{\r\n  headerMenuLabel: 'About Us',\r\n  url: '#',\r\n  type: 'dda_default_submenu',\r\n  children: [ { headerMenuLabel: 'Submenu 1', url: '#' }, ... ]\r\n}\r\n\\`\\`\\`\r\n\r\n\\`\\`\\`ts\r\n{\r\n  headerMenuLabel: 'Services',\r\n  url: '#',\r\n  type: 'dda_main_megamenu',\r\n  children: [\r\n    { title: 'Column 1', items: [{ headerMenuLabel: 'Submenu 1', url: '#' }] },\r\n    ...\r\n  ]\r\n}\r\n\\`\\`\\`\r\n        `,\r\n      },\r\n    },\r\n  },\r\n};\r\n\r\nconst Template = args => `\r\n  <dda-header-menu\r\n    quick-links='${JSON.stringify(args.quickLinks)}'\r\n  ></dda-header-menu>\r\n`;\r\n\r\nexport const Default = Template.bind({});\r\nDefault.args = {\r\n  quickLinks: [\r\n    { headerMenuLabel: 'Home', active: 'true', url: '#' },\r\n\r\n    // default dropdown menu\r\n    {\r\n      headerMenuLabel: 'About Us',\r\n      url: 'javascript:void(0)',\r\n      type: 'dda_default_submenu',\r\n      children: [\r\n        {\r\n          headerMenuLabel: 'Submenu 1',\r\n          url: '#',\r\n          headerMenuId: 'customeID',\r\n          defaultSubMenuTitle: 'Submenu 1 Title',\r\n          children: [\r\n            { headerMenuLabel: 'SubSubmenu 1', url: '#' },\r\n            { headerMenuLabel: 'SubSubmenu 1', url: '#' },\r\n          ],\r\n        },\r\n        {\r\n          headerMenuLabel: 'Submenu 2',\r\n          url: '#',\r\n          headerMenuId: 'customeID',\r\n          defaultSubMenuTitle: 'Submenu 2 Title',\r\n          children: [\r\n            { headerMenuLabel: 'SubSubmenu 2', url: '#' },\r\n            { headerMenuLabel: 'SubSubmenu 2', url: '#' },\r\n          ],\r\n        },\r\n        {\r\n          headerMenuLabel: 'Submenu 3',\r\n          url: '#',\r\n          headerMenuId: 'customeID',\r\n        },\r\n      ],\r\n    },\r\n\r\n    // mega menu\r\n    {\r\n      headerMenuLabel: 'Services',\r\n      url: 'javascript:void(0)',\r\n      type: 'dda_main_megamenu',\r\n      children: [\r\n        {\r\n          title: 'QUICK LINKS 1',\r\n          items: [\r\n            {\r\n              headerMenuLabel: 'Service 1',\r\n              url: '#',\r\n              description: 'Service Description',\r\n            },\r\n            { headerMenuLabel: 'Service 2', url: '#' },\r\n            { headerMenuLabel: 'Service 3', url: '#' },\r\n          ],\r\n        },\r\n        {\r\n          title: 'QUICK LINKS 2',\r\n          items: [\r\n            { headerMenuLabel: 'Service 1', url: '#' },\r\n            { headerMenuLabel: 'Service 2', url: '#' },\r\n            { headerMenuLabel: 'Service 3', url: '#' },\r\n          ],\r\n        },\r\n        {\r\n          title: 'QUICK LINKS 3',\r\n          items: [{ headerMenuLabel: 'Service 3', url: '#' }],\r\n        },\r\n        {\r\n          title: 'QUICK LINKS 4',\r\n          items: [{ headerMenuLabel: 'Service 4', url: '#' }],\r\n        },\r\n      ],\r\n    },\r\n\r\n    { headerMenuLabel: 'Contact', url: '#' },\r\n  ],\r\n};\r\n"]}

package/dist/collection/components/dda-home-banner/dda-home-banner.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-home-banner.js","sourceRoot":"","sources":["../../../src/components/dda-home-banner/dda-home-banner.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Host, Component, h, State, Element, Prop, Watch } from '@stencil/core';\r\n\r\n@Component({\r\n  tag: 'dda-home-banner',\r\n  styleUrls: ['home-banner.css'],\r\n  shadow: false,\r\n})\r\nexport class DdaHomeBanner {\r\n  @Element() el: HTMLElement;\r\n\r\n  /** Props */\r\n  @Prop() autoplay: boolean = true;\r\n  @Prop() interval: number = 3000;\r\n\r\n  /** States */\r\n  @State() currentSlide: number = 0;\r\n  @State() slides: HTMLElement[] = [];\r\n  @State() autoPlayActive: boolean = true;\r\n\r\n  private autoPlayInterval: any;\r\n  private pausedProgressOffset: number = 0;\r\n  private animationFrameId: number | null = null;\r\n\r\n  // componentDidLoad() {\r\n  //   this.updateSlides();\r\n  //   const slot = this.el.querySelector('slot');\r\n  //   slot?.addEventListener('slotchange', () => this.updateSlides());\r\n\r\n  //   this.autoPlayActive = this.autoplay && this.slides.length > 1;\r\n  //   this.playVideoInCurrentSlide();\r\n\r\n  //   if (this.autoPlayActive) {\r\n  //     this.startAutoplay();\r\n  //     this.animateProgress(); // Initial animation\r\n  //   }\r\n  // }\r\n\r\n  componentDidLoad() {\r\n  this.updateSlides();\r\n  const slot = this.el.querySelector('slot');\r\n  slot?.addEventListener('slotchange', () => this.updateSlides());\r\n\r\n  this.autoPlayActive = this.autoplay && this.slides.length > 1;\r\n  this.playVideoInCurrentSlide();\r\n\r\n  // ✅ Wait for the DOM to fully render slides before animating\r\n  if (this.autoPlayActive) {\r\n    const tryStart = () => {\r\n      const circle = this.el.querySelector('.circle-loader');\r\n      if (circle) {\r\n        this.startAutoplay();\r\n        this.animateProgress();\r\n      } else {\r\n        requestAnimationFrame(tryStart);\r\n      }\r\n    };\r\n    tryStart();\r\n  }\r\n}\r\n\r\n  disconnectedCallback() {\r\n    this.stopAutoplay();\r\n    if (this.animationFrameId) {\r\n      cancelAnimationFrame(this.animationFrameId);\r\n    }\r\n  }\r\n\r\n  componentDidRender() {\r\n    this.slides.forEach((slide, index) => {\r\n      slide.classList.toggle('active', index === this.currentSlide);\r\n    });\r\n  }\r\n\r\n  updateSlides() {\r\n    this.slides = Array.from(this.el.querySelectorAll('.dda-home-banner-slide'));\r\n    if (this.slides.length > 0) {\r\n      this.currentSlide = 0;\r\n    }\r\n\r\n    // Disable autoplay if there's only one slide\r\n    if (this.slides.length <= 1) {\r\n      this.autoPlayActive = false;\r\n      this.stopAutoplay();\r\n    }\r\n  }\r\n\r\n  startAutoplay() {\r\n    this.stopAutoplay();\r\n\r\n    if (this.autoPlayActive && this.slides.length > 1) {\r\n      const slide = this.slides[this.currentSlide];\r\n      const video = slide?.querySelector('video') as HTMLVideoElement;\r\n\r\n      const setupTimer = (durationMs: number) => {\r\n        this.autoPlayInterval = setInterval(() => {\r\n          this.nextSlide();\r\n        }, durationMs);\r\n        this.animateProgress(1); // animate full ring\r\n      };\r\n\r\n      if (video) {\r\n        if (video.readyState >= 1) {\r\n          setupTimer(video.duration * 1000);\r\n        } else {\r\n          video.addEventListener(\r\n            'loadedmetadata',\r\n            () => {\r\n              setupTimer(video.duration * 1000);\r\n            },\r\n            { once: true }\r\n          );\r\n        }\r\n      } else {\r\n        setupTimer(this.interval);\r\n      }\r\n    }\r\n  }\r\n\r\n  stopAutoplay() {\r\n    if (this.autoPlayInterval) {\r\n      clearInterval(this.autoPlayInterval);\r\n      this.autoPlayInterval = null;\r\n    }\r\n  }\r\n\r\n  toggleAutoplay() {\r\n    const circle = this.el.querySelector('.circle-loader') as SVGPathElement;\r\n    const video = this.slides[this.currentSlide]?.querySelector('video') as HTMLVideoElement;\r\n\r\n    this.autoPlayActive = !this.autoPlayActive;\r\n\r\n    if (this.autoPlayActive) {\r\n      this.startAutoplay();\r\n\r\n      const offset = this.pausedProgressOffset;\r\n      const totalLength = circle?.getTotalLength() || 1;\r\n      const startRatio = offset / totalLength;\r\n\r\n      if (video) video.play();\r\n      this.animateProgress(startRatio);\r\n    } else {\r\n      this.stopAutoplay();\r\n\r\n      if (this.animationFrameId) {\r\n        cancelAnimationFrame(this.animationFrameId);\r\n        this.animationFrameId = null;\r\n      }\r\n\r\n      if (circle) {\r\n        const style = window.getComputedStyle(circle);\r\n        const strokeDashoffset = parseFloat(style.strokeDashoffset || '0');\r\n        this.pausedProgressOffset = strokeDashoffset;\r\n      }\r\n\r\n      if (video) video.pause();\r\n    }\r\n  }\r\n\r\n  playVideoInCurrentSlide() {\r\n    this.slides.forEach((slide, index) => {\r\n      const video = slide.querySelector('video') as HTMLVideoElement;\r\n      if (video) {\r\n        if (index === this.currentSlide) {\r\n          video.currentTime = 0;\r\n          video.play();\r\n        } else {\r\n          video.pause();\r\n        }\r\n      }\r\n    });\r\n  }\r\n\r\n  nextSlide() {\r\n    this.currentSlide = (this.currentSlide + 1) % this.slides.length;\r\n  }\r\n\r\n  prevSlide() {\r\n    this.currentSlide = (this.currentSlide - 1 + this.slides.length) % this.slides.length;\r\n  }\r\n\r\n  setSlide(index: number) {\r\n    this.currentSlide = index;\r\n  }\r\n\r\n  @Watch('currentSlide')\r\n  onSlideChanged() {\r\n    this.animateProgress();\r\n    this.playVideoInCurrentSlide();\r\n    this.startAutoplay(); // restart with correct duration\r\n  }\r\n\r\n  animateProgress(startRatio = 1) {\r\n    const circle = this.el.querySelector('.circle-loader') as SVGPathElement;\r\n    if (!circle) return;\r\n\r\n    const length = circle.getTotalLength();\r\n    const slide = this.slides[this.currentSlide];\r\n    const video = slide?.querySelector('video') as HTMLVideoElement;\r\n    const duration = (video && video.duration ? video.duration * 1000 : this.interval) * startRatio;\r\n    const start = performance.now();\r\n    this.pausedProgressOffset = length * startRatio;\r\n\r\n    circle.style.strokeDasharray = `${length}`;\r\n    circle.style.strokeDashoffset = `${this.pausedProgressOffset}`;\r\n    circle.style.transition = 'none';\r\n\r\n    const animate = (now: number) => {\r\n      const elapsed = now - start;\r\n      const progress = Math.min(elapsed / duration, 1);\r\n      const newOffset = length * (1 - progress) * startRatio;\r\n      circle.style.strokeDashoffset = `${newOffset}`;\r\n\r\n      if (progress < 1) {\r\n        this.animationFrameId = requestAnimationFrame(animate);\r\n      }\r\n    };\r\n\r\n    if (this.animationFrameId) {\r\n      cancelAnimationFrame(this.animationFrameId);\r\n    }\r\n    this.animationFrameId = requestAnimationFrame(animate);\r\n  }\r\n\r\n  resetProgress() {\r\n    const circle = this.el.querySelector('.circle-loader') as SVGPathElement;\r\n    if (circle) {\r\n      const length = circle.getTotalLength();\r\n      circle.style.transition = 'none';\r\n      circle.style.strokeDashoffset = `${length}`;\r\n      this.pausedProgressOffset = length;\r\n    }\r\n  }\r\n\r\n  render() {\r\n    const hasMultipleSlides = this.slides.length > 1;\r\n\r\n    return (\r\n      <Host>\r\n        <div class=\"dda-home-banner\" role=\"region\" aria-label=\"Homepage banner with slides\">\r\n          <div class=\"dda-home-slides\" role=\"list\" aria-live=\"polite\" aria-atomic=\"true\">\r\n            <slot></slot>\r\n          </div>\r\n\r\n          <div class=\"dda-home-banner-slider-nav\">\r\n            {hasMultipleSlides && (\r\n              <div class=\"dda-home-banner-slider-nav-content\">\r\n                <button\r\n                  type=\"button\"\r\n                  class=\"dda-home-banner-prev\"\r\n                  onClick={() => this.prevSlide()}\r\n                >\r\n                  <i class=\"material-icons\" aria-hidden=\"true\">chevron_left</i>\r\n                  <span class=\"visually-hidden\">Previous slide</span>\r\n                </button>\r\n\r\n                <button\r\n                  type=\"button\"\r\n                  class=\"dda-home-banner-Pause\"\r\n                  onClick={() => this.toggleAutoplay()}\r\n                  aria-pressed={this.autoPlayActive ? 'true' : 'false'}\r\n                  aria-label={this.autoPlayActive ? 'Pause slideshow autoplay' : 'Play slideshow autoplay'}\r\n                >\r\n                  <span>\r\n                    <svg\r\n                      class=\"main-circle\"\r\n                      width=\"25\"\r\n                      height=\"26\"\r\n                      viewBox=\"0 0 25 26\"\r\n                      fill=\"none\"\r\n                      xmlns=\"http://www.w3.org/2000/svg\"\r\n                      aria-hidden=\"true\"\r\n                    >\r\n                      <path\r\n                        class=\"circle-loader\"\r\n                        d=\"M8.61616 4.62474C9.35885 4.35949 10.4729 3.92017 12.146 3.92017C16.7619 3.92017 21.1489 7.55969 21.1489 12.9247C20.9849 18.8126 16.4271 21.9202 12.146 21.9202C7.78471 21.9202 3.16382 18.5036 3.16382 12.9601C3.16382 11.8748 3.2148 11.4931 3.48806 10.4602\"\r\n                        stroke=\"white\"\r\n                        stroke-width=\"2\"\r\n                        stroke-linecap=\"round\"\r\n                      />\r\n                      <circle class=\"dott\" cx=\"5.17456\" cy=\"6.92017\" r=\"1.44751\" fill=\"white\" />\r\n                    </svg>\r\n                    {this.autoPlayActive ? (\r\n                      <svg\r\n                        class=\"nav-pause-icon\"\r\n                        width=\"7\"\r\n                        height=\"7\"\r\n                        viewBox=\"0 0 7 7\"\r\n                        fill=\"none\"\r\n                        xmlns=\"http://www.w3.org/2000/svg\"\r\n                        aria-hidden=\"true\"\r\n                      >\r\n                        <path d=\"M0.482666 0.548584H2.48267V6.54858H0.482666V0.548584Z\" fill=\"white\" />\r\n                        <path d=\"M4.47974 0.548584H6.47974V6.54858H4.47974V0.548584Z\" fill=\"white\" />\r\n                      </svg>\r\n                    ) : (\r\n                      <svg\r\n                        class=\"nav-play-icon\"\r\n                        width=\"9\"\r\n                        height=\"9\"\r\n                        viewBox=\"0 0 9 9\"\r\n                        fill=\"none\"\r\n                        xmlns=\"http://www.w3.org/2000/svg\"\r\n                        aria-hidden=\"true\"\r\n                      >\r\n                        <path\r\n                          d=\"M7.9682 3.68255C8.63487 4.06745 8.63487 5.0297 7.9682 5.4146L2.31372 8.67922C1.64705 9.06412 0.813721 8.58299 0.813721 7.81319L0.813721 1.28396C0.813721 0.51416 1.64705 0.0330374 2.31372 0.417938L7.9682 3.68255Z\"\r\n                          fill=\"white\"\r\n                        />\r\n                      </svg>\r\n                    )}\r\n                  </span>\r\n                </button>\r\n\r\n                <ul aria-label=\"Select slide\">\r\n                  {this.slides.map((_, index) => (\r\n                    <li key={index}>\r\n                      <button\r\n                        type=\"button\"\r\n                        class={this.currentSlide === index ? 'dots active' : 'dots'}\r\n                        onClick={() => this.setSlide(index)}\r\n                        aria-label={`Go to slide ${index + 1}`}\r\n                        aria-current={this.currentSlide === index ? 'true' : 'false'}\r\n                      ></button>\r\n                    </li>\r\n                  ))}\r\n                </ul>\r\n\r\n                <button\r\n                  type=\"button\"\r\n                  class=\"dda-home-banner-next\"\r\n                  onClick={() => this.nextSlide()}\r\n                  aria-label=\"Next slide\"\r\n                >\r\n                  <i class=\"material-icons\" aria-hidden=\"true\">chevron_right</i>\r\n                  <span class=\"visually-hidden\">Next slide</span>\r\n                </button>\r\n              </div>\r\n            )}\r\n\r\n            <div class=\"dda-mouse-scroll\">\r\n              <dda-scroll-icon\r\n                scroll_icon_size=\"sm\"\r\n                scroll_icon_color=\"white\"\r\n                custom_class=\"\"\r\n                component_mode=\"\"\r\n                class=\"hydrated\"\r\n                aria-hidden=\"true\"\r\n              ></dda-scroll-icon>\r\n            </div>\r\n          </div>\r\n        </div>\r\n      </Host>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/dda-home-banner/dda-home-banner.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dda-home-banner.stories.js","sourceRoot":"","sources":["../../../src/components/dda-home-banner/dda-home-banner.stories.tsx"],"names":[],"mappings":"AAAA,eAAe;IACb,KAAK,EAAE,wBAAwB;IAC/B,SAAS,EAAE,iBAAiB;IAC5B,QAAQ,EAAE;QACR,QAAQ,EAAE;YACR,OAAO,EAAE,SAAS;YAClB,WAAW,EAAE,2CAA2C;YACxD,YAAY,EAAE,IAAI;SACnB;QACD,QAAQ,EAAE;YACR,OAAO,EAAE,QAAQ;YACjB,WAAW,EAAE,iDAAiD;YAC9D,YAAY,EAAE,IAAI;SACnB;KACF;IACD,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EAAE;;;;;;;;;;;;;;;;;;;;SAoBV;aACF;SACF;QACD,QAAQ,EAAE;YACR,QAAQ,EAAE,IAAI;SACf;KACF;CACF,CAAC;AAEF,MAAM,QAAQ,GAAG,CAAC,IAAI,EAAE,EAAE,CACxB,8BAA8B,IAAI,CAAC,QAAQ,eAAe,IAAI,CAAC,QAAQ;;;;qBAIpD,CAAC;AAEtB,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;IACb,QAAQ,EAAE,IAAI;IACd,QAAQ,EAAE,IAAI;CACf,CAAC","sourcesContent":["export default {\r\n  title: 'Components/Home Banner',\r\n  component: 'dda-home-banner',\r\n  argTypes: {\r\n    autoplay: {\r\n      control: 'boolean',\r\n      description: 'Enable or disable autoplay functionality.',\r\n      defaultValue: true,\r\n    },\r\n    interval: {\r\n      control: 'number',\r\n      description: 'Set the autoplay interval time in milliseconds.',\r\n      defaultValue: 3000,\r\n    },\r\n  },\r\n  parameters: {\r\n    docs: {\r\n      description: {\r\n        component: `\r\nThe \\`dda-home-banner\\` component displays a carousel banner with optional autoplay functionality.\r\n\r\n### Usage\r\n\r\n\\`\\`\\`html\r\n<dda-home-banner\r\n  autoplay=\"true\"\r\n  interval=\"3000\"\r\n>\r\n  <div class=\"dda-home-banner-slide\">Slide 1</div>\r\n  <div class=\"dda-home-banner-slide\">Slide 2</div>\r\n  <div class=\"dda-home-banner-slide\">Slide 3</div>\r\n</dda-home-banner>\r\n\\`\\`\\`\r\n\r\n### Props\r\n\r\n- \\`autoplay\\` (boolean): Enables or disables automatic slide transitions.\r\n- \\`interval\\` (number): Duration in milliseconds between slide transitions when autoplay is enabled.\r\n        `,\r\n      },\r\n    },\r\n    controls: {\r\n      expanded: true,\r\n    },\r\n  },\r\n};\r\n\r\nconst Template = (args) =>\r\n  `<dda-home-banner autoplay='${args.autoplay}' interval='${args.interval}'>\r\n    <div class=\"dda-home-banner-slide\">Slide 1</div>\r\n    <div class=\"dda-home-banner-slide\">Slide 2</div>\r\n    <div class=\"dda-home-banner-slide\">Slide 3</div>\r\n  </dda-home-banner>`;\r\n\r\nexport const Default = Template.bind({});\r\nDefault.args = {\r\n  autoplay: true,\r\n  interval: 3000,\r\n};\r\n"]}

package/dist/collection/components/dda-home-carousel/dda-home-carousel.css

@@ -1,126 +0,0 @@
-.dda-home-carousel {
-  width: 100%;
-  overflow: hidden;
-  position: relative;
-}
-
-.dda-home-carousel-track {
-  display: flex;
-  overflow-x: auto;
-  scroll-snap-type: x mandatory;
-  scroll-behavior: smooth;
-  -webkit-overflow-scrolling: touch;
-  scrollbar-width: none;
-  -ms-overflow-style: none;
-}
-
-
-.dda-home-carousel-track::-webkit-scrollbar {
-  display: none;
-}
-
-
-/* Default (Desktop) - using items_in_view via inline style (already applied in component) */
-.dda-home-carousel-item {
-  scroll-snap-align: start;
-  flex-shrink: 0;
-  padding: 0px 2px;
-  padding-top: 30px;
-  overflow: hidden;
-  /* width set via inline style like: style={{ flex: `0 0 ${itemWidth}%` }} */
-}
-
-
-@media (max-width: 1200px) {
-  .dda-home-carousel-item {
-    flex: 0 0 24% !important; 
-  }
-}
-
-
-@media (max-width: 1024px) {
-  .dda-home-carousel-item {
-    flex: 0 0 32% !important;
-  }
-}
-
-
-@media (max-width: 768px) {
-  .dda-home-carousel-item {
-    flex: 0 0 48% !important;
-  }
-}
-
-@media (max-width: 576px) {
-  .dda-home-carousel-item {
-    flex: 0 0 97% !important;
-  }
-}
-
-
-.dda-home-carousel .dda-banner-card {
-    height: 100%;
-    transform: translate(0, 0px);
-    padding-bottom: 24px;
-}
-.dda-home-carousel .dda-banner-card::after{
-  content: "";
-  width: 20px;
-  height: 20px;
-  background-color: var(--dda-surface-100);
-  border-radius: 0px 0px 5px 0px;
-  position: absolute;
-  bottom: 0px;
-  transform: rotate(45deg);
-  left: 50%;
-  margin-left: -10px;
-  /* transition: 0.3s; */
-}
-.dda-home-carousel .dda-banner-card:hover::after,
-.dda-home-carousel .dda-banner-card.active::after{
-  bottom: -9px;
-}
-.dda-home-carousel .dda-banner-card.active {
-    box-shadow: 0px 0px 7px 4px rgba(0, 0, 0, 0.05);
-}
-@media (min-width: 1024px) {
-  .dda-home-carousel-item:hover .dda-banner-card,
-  .dda-home-carousel-item .dda-banner-card.active {
-      transform: translate(0, -25px);
-  }
-}
-@media (max-width: 1024px) {
-  .dda-home-carousel-item .dda-banner-card {
-    border-radius: 16px;
-  }
-}
-
-/*********************Placing style on the home page*************************/
-.dda-home-quick-links-wrap {
-    width: 100%;
-    z-index: 1;
-    position: absolute;
-    bottom: 50px;
-}
-.dda-home-quick-links {
-  width: 90vw;
-  margin: 0 auto;
-  gap: 8px;
-  padding: 0 20px;
-}
-@media screen and (max-width: 1024px) {
-    .dda-home-quick-links-wrap{
-        bottom: 100px;
-        padding-bottom: 0px;
-    }
-    .dda-home-quick-links{
-      width: 100vw;
-    }
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  .dda-home-carousel .dda-banner-card::after{
-    transition: 0.3s;
-  }
-}
-