@dubai-design-system/components-js 3.12.6 → 3.12.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/dda-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/dda-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/dda-header.cjs.entry.js +7 -5
- package/dist/cjs/dda-header.cjs.entry.js.map +1 -1
- package/dist/cjs/dda-home-carousel.cjs.entry.js +19 -2
- package/dist/cjs/dda-home-carousel.cjs.entry.js.map +1 -1
- package/dist/cjs/dda-select.cjs.entry.js +2 -2
- package/dist/cjs/dda-select.cjs.entry.js.map +1 -1
- package/dist/cjs/dda.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/dda-checkbox/dda-checkbox.css +1 -0
- package/dist/collection/components/dda-header/dda-header.js +47 -5
- package/dist/collection/components/dda-header/dda-header.js.map +1 -1
- package/dist/collection/components/dda-header/dda-header.stories.js +6 -0
- package/dist/collection/components/dda-header/dda-header.stories.js.map +1 -1
- package/dist/collection/components/dda-home-carousel/dda-home-carousel.css +7 -2
- package/dist/collection/components/dda-home-carousel/dda-home-carousel.js +18 -1
- package/dist/collection/components/dda-home-carousel/dda-home-carousel.js.map +1 -1
- package/dist/collection/global/global.css +22 -3
- package/dist/collection/global/input.css +8 -1
- package/dist/components/dda-checkbox.js +1 -1
- package/dist/components/dda-checkbox.js.map +1 -1
- package/dist/components/dda-header.js +9 -5
- package/dist/components/dda-header.js.map +1 -1
- package/dist/components/dda-home-carousel.js +19 -2
- package/dist/components/dda-home-carousel.js.map +1 -1
- package/dist/components/dda-select.js +2 -2
- package/dist/components/dda-select.js.map +1 -1
- package/dist/dda/dda.css +2 -2
- package/dist/dda/dda.esm.js +1 -1
- package/dist/dda/dda.esm.js.map +1 -1
- package/dist/dda/p-0905eb60.entry.js +2 -0
- package/dist/dda/p-0905eb60.entry.js.map +1 -0
- package/dist/dda/p-581d9c45.entry.js +2 -0
- package/dist/dda/p-581d9c45.entry.js.map +1 -0
- package/dist/dda/p-7276ea70.entry.js +2 -0
- package/dist/dda/p-7276ea70.entry.js.map +1 -0
- package/dist/dda/p-aefe49c4.entry.js +2 -0
- package/dist/dda/p-aefe49c4.entry.js.map +1 -0
- package/dist/esm/dda-checkbox.entry.js +1 -1
- package/dist/esm/dda-checkbox.entry.js.map +1 -1
- package/dist/esm/dda-header.entry.js +7 -5
- package/dist/esm/dda-header.entry.js.map +1 -1
- package/dist/esm/dda-home-carousel.entry.js +19 -2
- package/dist/esm/dda-home-carousel.entry.js.map +1 -1
- package/dist/esm/dda-select.entry.js +2 -2
- package/dist/esm/dda-select.entry.js.map +1 -1
- package/dist/esm/dda.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/dda-header/dda-header.d.ts +2 -0
- package/dist/types/components/dda-header/dda-header.stories.d.ts +6 -0
- package/dist/types/components.d.ts +4 -0
- package/package.json +2 -2
- package/readme.md +11 -3
- package/www/build/dda.css +2 -2
- package/www/build/dda.esm.js +1 -1
- package/www/build/dda.esm.js.map +1 -1
- package/www/build/p-0905eb60.entry.js +2 -0
- package/www/build/p-0905eb60.entry.js.map +1 -0
- package/www/build/{p-46ac0422.css → p-17691a4c.css} +2 -2
- package/www/build/p-581d9c45.entry.js +2 -0
- package/www/build/p-581d9c45.entry.js.map +1 -0
- package/www/build/p-7276ea70.entry.js +2 -0
- package/www/build/p-7276ea70.entry.js.map +1 -0
- package/www/build/p-aefe49c4.entry.js +2 -0
- package/www/build/p-aefe49c4.entry.js.map +1 -0
- package/dist/dda/p-16812c63.entry.js +0 -2
- package/dist/dda/p-16812c63.entry.js.map +0 -1
- package/dist/dda/p-1a920ab6.entry.js +0 -2
- package/dist/dda/p-1a920ab6.entry.js.map +0 -1
- package/dist/dda/p-3d1bd318.entry.js +0 -2
- package/dist/dda/p-3d1bd318.entry.js.map +0 -1
- package/dist/dda/p-9c090bc6.entry.js +0 -2
- package/dist/dda/p-9c090bc6.entry.js.map +0 -1
- package/www/build/p-16812c63.entry.js +0 -2
- package/www/build/p-16812c63.entry.js.map +0 -1
- package/www/build/p-1a920ab6.entry.js +0 -2
- package/www/build/p-1a920ab6.entry.js.map +0 -1
- package/www/build/p-3d1bd318.entry.js +0 -2
- package/www/build/p-3d1bd318.entry.js.map +0 -1
- package/www/build/p-9c090bc6.entry.js +0 -2
- package/www/build/p-9c090bc6.entry.js.map +0 -1
|
@@ -76,11 +76,16 @@
|
|
|
76
76
|
margin-left: -10px;
|
|
77
77
|
/* transition: 0.3s; */
|
|
78
78
|
}
|
|
79
|
-
.dda-home-carousel .dda-banner-card:hover::after
|
|
79
|
+
.dda-home-carousel .dda-banner-card:hover::after,
|
|
80
|
+
.dda-home-carousel .dda-banner-card.active::after{
|
|
80
81
|
bottom: -9px;
|
|
81
82
|
}
|
|
83
|
+
.dda-home-carousel .dda-banner-card.active {
|
|
84
|
+
box-shadow: 0px 0px 7px 4px rgba(0, 0, 0, 0.05);
|
|
85
|
+
}
|
|
82
86
|
@media (min-width: 1024px) {
|
|
83
|
-
.dda-home-carousel-item:hover .dda-banner-card
|
|
87
|
+
.dda-home-carousel-item:hover .dda-banner-card,
|
|
88
|
+
.dda-home-carousel-item .dda-banner-card.active {
|
|
84
89
|
transform: translate(0, -25px);
|
|
85
90
|
}
|
|
86
91
|
}
|
|
@@ -51,6 +51,17 @@ export class DdaHomeCarousel {
|
|
|
51
51
|
this.containerRef.querySelectorAll('img').forEach((img) => {
|
|
52
52
|
img.addEventListener('dragstart', (e) => e.preventDefault());
|
|
53
53
|
});
|
|
54
|
+
// ===== Add single-active click behavior =====
|
|
55
|
+
// this.containerRef.querySelectorAll('button.dda-banner-card').forEach((btn) => {
|
|
56
|
+
// btn.addEventListener('click', (e) => {
|
|
57
|
+
// // Remove .active from all buttons
|
|
58
|
+
// this.containerRef.querySelectorAll('button.dda-banner-card.active').forEach((activeBtn) => {
|
|
59
|
+
// activeBtn.classList.remove('active');
|
|
60
|
+
// });
|
|
61
|
+
// // Add .active to clicked button
|
|
62
|
+
// (e.currentTarget as HTMLElement).classList.add('active');
|
|
63
|
+
// });
|
|
64
|
+
// });
|
|
54
65
|
}
|
|
55
66
|
disconnectedCallback() {
|
|
56
67
|
var _a, _b;
|
|
@@ -58,7 +69,13 @@ export class DdaHomeCarousel {
|
|
|
58
69
|
(_b = this.containerRef) === null || _b === void 0 ? void 0 : _b.removeEventListener('mouseleave', this.handleMouseLeave);
|
|
59
70
|
}
|
|
60
71
|
handleCardClick(item) {
|
|
72
|
+
var _a, _b;
|
|
61
73
|
console.log('Card clicked from carousel:', item);
|
|
74
|
+
// Remove .active from all banner cards
|
|
75
|
+
(_a = this.containerRef) === null || _a === void 0 ? void 0 : _a.querySelectorAll('button.dda-banner-card.active').forEach((btn) => btn.classList.remove('active'));
|
|
76
|
+
// Add .active to the clicked banner card
|
|
77
|
+
const clickedBtn = (_b = this.containerRef) === null || _b === void 0 ? void 0 : _b.querySelector(`button#${item.banner_card_id}`);
|
|
78
|
+
clickedBtn === null || clickedBtn === void 0 ? void 0 : clickedBtn.classList.add('active');
|
|
62
79
|
this.el.dispatchEvent(new CustomEvent('cardClick', {
|
|
63
80
|
detail: item,
|
|
64
81
|
bubbles: true,
|
|
@@ -70,7 +87,7 @@ export class DdaHomeCarousel {
|
|
|
70
87
|
.filter(Boolean)
|
|
71
88
|
.join(' ');
|
|
72
89
|
const itemWidth = 100 / this.items_in_view;
|
|
73
|
-
return (h(Host, { key: '
|
|
90
|
+
return (h(Host, { key: '832b69a58fb907c8e0bbf08027e4aab4341b23ab' }, h("div", { key: '7d0d1e756a5c145cc945457d1a5343f04e0a65f4', class: cardClass, role: "region", "aria-roledescription": "carousel", "aria-label": "Banner cards carousel" }, h("div", { key: '1e85de80e92acd116c76b2a5269b0c20c40c0386', class: "dda-home-carousel-track", ref: (el) => (this.containerRef = el), role: "list", tabIndex: 0, "aria-live": "polite" }, this.parsedCardList.map((item, index) => (h("div", { class: "dda-home-carousel-item", key: item.banner_card_id || index, style: { flex: `0 0 ${itemWidth}%` }, role: "listitem", tabIndex: -1, "aria-label": `${item.banner_card_title || 'Carousel item'} ${index + 1} of ${this.parsedCardList.length}` }, h("dda-banner-card", { image_src: item.image_src, image_alt: item.image_alt, banner_card_title: item.banner_card_title, banner_card_description: item.banner_card_description, banner_card_id: item.banner_card_id || `card-${index}`, banner_card_value: item.banner_card_value, banner_card_name: item.banner_card_name, custom_class: item.custom_class || '', component_mode: item.component_mode || '', onClick: () => this.handleCardClick(item) }))))))));
|
|
74
91
|
}
|
|
75
92
|
static get is() { return "dda-home-carousel"; }
|
|
76
93
|
static get originalStyleUrls() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dda-home-carousel.js","sourceRoot":"","sources":["../../../src/components/dda-home-carousel/dda-home-carousel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, Host, Element, Watch } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dda-home-carousel',\r\n styleUrls: ['dda-home-carousel.css'],\r\n shadow: false,\r\n})\r\nexport class DdaHomeCarousel {\r\n @Prop() custom_class?: string = '';\r\n @Prop() component_mode?: string;\r\n @Prop() items_in_view: number = 5;\r\n @Prop() bannercardlist: string | any[] = [];\r\n\r\n @Element() el: HTMLElement;\r\n\r\n private containerRef: HTMLElement;\r\n private parsedCardList: any[] = [];\r\n\r\n @Watch('bannercardlist')\r\n parseBannerCardList(newValue: string | any[]) {\r\n if (typeof newValue === 'string') {\r\n try {\r\n this.parsedCardList = JSON.parse(newValue);\r\n } catch (e) {\r\n console.error('Invalid JSON for bannercardlist:', e);\r\n this.parsedCardList = [];\r\n }\r\n } else if (Array.isArray(newValue)) {\r\n this.parsedCardList = newValue;\r\n } else {\r\n this.parsedCardList = [];\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n this.parseBannerCardList(this.bannercardlist);\r\n }\r\n\r\n componentDidLoad() {\r\n this.containerRef = this.el.querySelector('.dda-home-carousel-track');\r\n this.containerRef.addEventListener('mousemove', this.handleMouseMove);\r\n this.containerRef.addEventListener('mouseleave', this.handleMouseLeave);\r\n this.containerRef.querySelectorAll('img').forEach((img) => {\r\n img.addEventListener('dragstart', (e) => e.preventDefault());\r\n });\r\n }\r\n\r\n disconnectedCallback() {\r\n this.containerRef?.removeEventListener('mousemove', this.handleMouseMove);\r\n this.containerRef?.removeEventListener('mouseleave', this.handleMouseLeave);\r\n }\r\n\r\n handleMouseMove = (e: MouseEvent) => {\r\n if (!this.containerRef) return;\r\n\r\n const rect = this.containerRef.getBoundingClientRect();\r\n const mouseX = e.clientX - rect.left;\r\n const percentage = mouseX / rect.width;\r\n const maxScroll = this.containerRef.scrollWidth - this.containerRef.clientWidth;\r\n const isRTL = getComputedStyle(this.containerRef).direction === 'rtl';\r\n\r\n const targetScroll = isRTL\r\n ? maxScroll - percentage * maxScroll\r\n : percentage * maxScroll;\r\n\r\n this.containerRef.scrollLeft = isRTL ? -targetScroll : targetScroll;\r\n };\r\n\r\n handleMouseLeave = () => {\r\n const itemWidth = this.containerRef.scrollWidth / this.parsedCardList.length;\r\n const index = Math.round(this.containerRef.scrollLeft / itemWidth);\r\n this.containerRef.scrollTo({ left: index * itemWidth, behavior: 'smooth' });\r\n };\r\n\r\n handleCardClick(item: any) {\r\n console.log('Card clicked from carousel:', item);\r\n\r\n this.el.dispatchEvent(\r\n new CustomEvent('cardClick', {\r\n detail: item,\r\n bubbles: true,\r\n composed: true,\r\n })\r\n );\r\n }\r\n\r\n render() {\r\n const cardClass = ['dda-home-carousel', this.custom_class, this.component_mode]\r\n .filter(Boolean)\r\n .join(' ');\r\n const itemWidth = 100 / this.items_in_view;\r\n\r\n return (\r\n <Host>\r\n <div\r\n class={cardClass}\r\n role=\"region\"\r\n aria-roledescription=\"carousel\"\r\n aria-label=\"Banner cards carousel\"\r\n >\r\n <div\r\n class=\"dda-home-carousel-track\"\r\n ref={(el) => (this.containerRef = el)}\r\n role=\"list\"\r\n tabIndex={0}\r\n aria-live=\"polite\"\r\n >\r\n {this.parsedCardList.map((item, index) => (\r\n <div\r\n class=\"dda-home-carousel-item\"\r\n key={item.banner_card_id || index}\r\n style={{ flex: `0 0 ${itemWidth}%` }}\r\n role=\"listitem\"\r\n tabIndex={-1}\r\n aria-label={`${item.banner_card_title || 'Carousel item'} ${index + 1} of ${this.parsedCardList.length}`}\r\n >\r\n <dda-banner-card\r\n image_src={item.image_src}\r\n image_alt={item.image_alt}\r\n banner_card_title={item.banner_card_title}\r\n banner_card_description={item.banner_card_description}\r\n banner_card_id={item.banner_card_id || `card-${index}`}\r\n banner_card_value={item.banner_card_value}\r\n banner_card_name={item.banner_card_name}\r\n custom_class={item.custom_class || ''}\r\n component_mode={item.component_mode || ''}\r\n onClick={() => this.handleCardClick(item)}\r\n ></dda-banner-card>\r\n </div>\r\n ))}\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"]}
|
|
1
|
+
{"version":3,"file":"dda-home-carousel.js","sourceRoot":"","sources":["../../../src/components/dda-home-carousel/dda-home-carousel.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, Host, Element, Watch } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dda-home-carousel',\r\n styleUrls: ['dda-home-carousel.css'],\r\n shadow: false,\r\n})\r\nexport class DdaHomeCarousel {\r\n @Prop() custom_class?: string = '';\r\n @Prop() component_mode?: string;\r\n @Prop() items_in_view: number = 5;\r\n @Prop() bannercardlist: string | any[] = [];\r\n\r\n @Element() el: HTMLElement;\r\n\r\n private containerRef: HTMLElement;\r\n private parsedCardList: any[] = [];\r\n\r\n @Watch('bannercardlist')\r\n parseBannerCardList(newValue: string | any[]) {\r\n if (typeof newValue === 'string') {\r\n try {\r\n this.parsedCardList = JSON.parse(newValue);\r\n } catch (e) {\r\n console.error('Invalid JSON for bannercardlist:', e);\r\n this.parsedCardList = [];\r\n }\r\n } else if (Array.isArray(newValue)) {\r\n this.parsedCardList = newValue;\r\n } else {\r\n this.parsedCardList = [];\r\n }\r\n }\r\n\r\n componentWillLoad() {\r\n this.parseBannerCardList(this.bannercardlist);\r\n }\r\n\r\n componentDidLoad() {\r\n this.containerRef = this.el.querySelector('.dda-home-carousel-track');\r\n this.containerRef.addEventListener('mousemove', this.handleMouseMove);\r\n this.containerRef.addEventListener('mouseleave', this.handleMouseLeave);\r\n this.containerRef.querySelectorAll('img').forEach((img) => {\r\n img.addEventListener('dragstart', (e) => e.preventDefault());\r\n });\r\n\r\n // ===== Add single-active click behavior =====\r\n // this.containerRef.querySelectorAll('button.dda-banner-card').forEach((btn) => {\r\n // btn.addEventListener('click', (e) => {\r\n // // Remove .active from all buttons\r\n // this.containerRef.querySelectorAll('button.dda-banner-card.active').forEach((activeBtn) => {\r\n // activeBtn.classList.remove('active');\r\n // });\r\n // // Add .active to clicked button\r\n // (e.currentTarget as HTMLElement).classList.add('active');\r\n // });\r\n // });\r\n }\r\n\r\n disconnectedCallback() {\r\n this.containerRef?.removeEventListener('mousemove', this.handleMouseMove);\r\n this.containerRef?.removeEventListener('mouseleave', this.handleMouseLeave);\r\n }\r\n\r\n handleMouseMove = (e: MouseEvent) => {\r\n if (!this.containerRef) return;\r\n\r\n const rect = this.containerRef.getBoundingClientRect();\r\n const mouseX = e.clientX - rect.left;\r\n const percentage = mouseX / rect.width;\r\n const maxScroll = this.containerRef.scrollWidth - this.containerRef.clientWidth;\r\n const isRTL = getComputedStyle(this.containerRef).direction === 'rtl';\r\n\r\n const targetScroll = isRTL\r\n ? maxScroll - percentage * maxScroll\r\n : percentage * maxScroll;\r\n\r\n this.containerRef.scrollLeft = isRTL ? -targetScroll : targetScroll;\r\n };\r\n\r\n handleMouseLeave = () => {\r\n const itemWidth = this.containerRef.scrollWidth / this.parsedCardList.length;\r\n const index = Math.round(this.containerRef.scrollLeft / itemWidth);\r\n this.containerRef.scrollTo({ left: index * itemWidth, behavior: 'smooth' });\r\n };\r\n\r\n handleCardClick(item: any) {\r\n console.log('Card clicked from carousel:', item);\r\n\r\n\r\n \r\n // Remove .active from all banner cards\r\n this.containerRef\r\n ?.querySelectorAll('button.dda-banner-card.active')\r\n .forEach((btn) => btn.classList.remove('active'));\r\n\r\n // Add .active to the clicked banner card\r\n const clickedBtn = this.containerRef?.querySelector(\r\n `button#${item.banner_card_id}`\r\n );\r\n clickedBtn?.classList.add('active');\r\n\r\n\r\n\r\n this.el.dispatchEvent(\r\n new CustomEvent('cardClick', {\r\n detail: item,\r\n bubbles: true,\r\n composed: true,\r\n })\r\n );\r\n }\r\n\r\n render() {\r\n const cardClass = ['dda-home-carousel', this.custom_class, this.component_mode]\r\n .filter(Boolean)\r\n .join(' ');\r\n const itemWidth = 100 / this.items_in_view;\r\n\r\n return (\r\n <Host>\r\n <div\r\n class={cardClass}\r\n role=\"region\"\r\n aria-roledescription=\"carousel\"\r\n aria-label=\"Banner cards carousel\"\r\n >\r\n <div\r\n class=\"dda-home-carousel-track\"\r\n ref={(el) => (this.containerRef = el)}\r\n role=\"list\"\r\n tabIndex={0}\r\n aria-live=\"polite\"\r\n >\r\n {this.parsedCardList.map((item, index) => (\r\n <div\r\n class=\"dda-home-carousel-item\"\r\n key={item.banner_card_id || index}\r\n style={{ flex: `0 0 ${itemWidth}%` }}\r\n role=\"listitem\"\r\n tabIndex={-1}\r\n aria-label={`${item.banner_card_title || 'Carousel item'} ${index + 1} of ${this.parsedCardList.length}`}\r\n >\r\n <dda-banner-card\r\n image_src={item.image_src}\r\n image_alt={item.image_alt}\r\n banner_card_title={item.banner_card_title}\r\n banner_card_description={item.banner_card_description}\r\n banner_card_id={item.banner_card_id || `card-${index}`}\r\n banner_card_value={item.banner_card_value}\r\n banner_card_name={item.banner_card_name}\r\n custom_class={item.custom_class || ''}\r\n component_mode={item.component_mode || ''}\r\n onClick={() => this.handleCardClick(item)}\r\n ></dda-banner-card>\r\n </div>\r\n ))}\r\n </div>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"]}
|
|
@@ -2514,7 +2514,6 @@ h6.Bold, .h6.Bold, .dda-h6.Bold,
|
|
|
2514
2514
|
border: solid 1px var(--dda-surface-90);
|
|
2515
2515
|
border-radius: 10px;
|
|
2516
2516
|
box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04);
|
|
2517
|
-
|
|
2518
2517
|
}
|
|
2519
2518
|
|
|
2520
2519
|
.dda-table-header,
|
|
@@ -2525,6 +2524,12 @@ h6.Bold, .h6.Bold, .dda-h6.Bold,
|
|
|
2525
2524
|
gap: 16px;
|
|
2526
2525
|
padding: 16px 24px 16px 24px;
|
|
2527
2526
|
}
|
|
2527
|
+
.dda-table-header{
|
|
2528
|
+
border-bottom: solid 1px var(--dda-surface-90);
|
|
2529
|
+
}
|
|
2530
|
+
.dda-table-footer{
|
|
2531
|
+
border-top: solid 1px var(--dda-surface-90);
|
|
2532
|
+
}
|
|
2528
2533
|
|
|
2529
2534
|
.dda-table-header-content {
|
|
2530
2535
|
color: var(--dda-on-surface-0);
|
|
@@ -2534,7 +2539,6 @@ h6.Bold, .h6.Bold, .dda-h6.Bold,
|
|
|
2534
2539
|
gap: 10px;
|
|
2535
2540
|
}
|
|
2536
2541
|
|
|
2537
|
-
|
|
2538
2542
|
.dda-table {
|
|
2539
2543
|
width: 100%;
|
|
2540
2544
|
border-collapse: collapse;
|
|
@@ -2546,8 +2550,10 @@ h6.Bold, .h6.Bold, .dda-h6.Bold,
|
|
|
2546
2550
|
text-align: justify;
|
|
2547
2551
|
padding: 12px 24px;
|
|
2548
2552
|
border: 0px;
|
|
2553
|
+
}
|
|
2554
|
+
|
|
2555
|
+
.dda-table td{
|
|
2549
2556
|
border-top: solid 1px var(--dda-surface-90);
|
|
2550
|
-
border-bottom: solid 1px var(--dda-surface-90);
|
|
2551
2557
|
}
|
|
2552
2558
|
|
|
2553
2559
|
.dda-table th {
|
|
@@ -2556,6 +2562,19 @@ h6.Bold, .h6.Bold, .dda-h6.Bold,
|
|
|
2556
2562
|
font-weight: var(--dda-fw-500);
|
|
2557
2563
|
}
|
|
2558
2564
|
|
|
2565
|
+
.dda-table th:first-child{
|
|
2566
|
+
border-start-start-radius: 9px;
|
|
2567
|
+
}
|
|
2568
|
+
.dda-table th:last-child{
|
|
2569
|
+
border-start-end-radius: 9px;
|
|
2570
|
+
}
|
|
2571
|
+
.dda-table tr:last-child td:first-child{
|
|
2572
|
+
border-end-start-radius: 9px;
|
|
2573
|
+
}
|
|
2574
|
+
.dda-table tr:last-child td:last-child{
|
|
2575
|
+
border-end-end-radius: 9px;
|
|
2576
|
+
}
|
|
2577
|
+
|
|
2559
2578
|
.dda-table-sm th,
|
|
2560
2579
|
.dda-table-sm td {
|
|
2561
2580
|
padding: 8px;
|
|
@@ -635,6 +635,7 @@
|
|
|
635
635
|
}
|
|
636
636
|
|
|
637
637
|
.dda-items {
|
|
638
|
+
width: calc(100% - 30px);
|
|
638
639
|
display: flex;
|
|
639
640
|
align-items: center;
|
|
640
641
|
gap: 8px;
|
|
@@ -649,9 +650,15 @@
|
|
|
649
650
|
font-size: var(--font-caption);
|
|
650
651
|
}
|
|
651
652
|
.dda-file-name {
|
|
653
|
+
width: 100%;
|
|
652
654
|
font-size: var(--font-caption);
|
|
655
|
+
overflow-x: auto;
|
|
656
|
+
-ms-overflow-style: none;
|
|
657
|
+
scrollbar-width: none;
|
|
658
|
+
}
|
|
659
|
+
.dda-file-name::-webkit-scrollbar {
|
|
660
|
+
display: none; /* Chrome, Safari, Opera */
|
|
653
661
|
}
|
|
654
|
-
|
|
655
662
|
.dda-remove-file {
|
|
656
663
|
font-size: 20px;
|
|
657
664
|
background: transparent;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-f6588843.js';
|
|
2
2
|
|
|
3
|
-
const ddaCheckboxCss = ".dda-checkbox-container{display:inline-flex;align-items:center}.dda-checkbox-container input[type=\"checkbox\"]{width:0;height:0;position:absolute;opacity:0}.dda-checkbox-container label{cursor:pointer;display:inline-flex;align-items:flex-start;gap:10px}.dda-checkbox-fill label .dda-check-square{width:24px;height:24px;border:solid 2px var(--dda-color-primary-40);border-radius:6px;position:relative}.dda-checkbox-fill label .dda-check-square::before{content:\"\";width:8px;height:3px;border-left:solid 2px var(--dda-color-primary-40);border-bottom:solid 2px var(--dda-color-primary-40);position:absolute;top:6px;left:5px;transform:rotate(-45deg)}.dda-checkbox-fill input[type=\"checkbox\"]:checked~label .dda-check-square{background-color:var(--dda-color-primary-40)}.dda-checkbox-fill input[type=\"checkbox\"]:checked~label .dda-check-square::before{border-left:solid 2px var(--dda-surface-100);border-bottom:solid 2px var(--dda-surface-100)}.dda-checkbox-fill.dda-checkbox-disabled label .dda-check-square{background:var(--dda-neutral-95);border:solid 2px var(--dda-neutral-95)}.dda-checkbox-fill.dda-checkbox-disabled label .dda-check-square::before{border-left:solid 2px var(--dda-on-surface-40);border-bottom:solid 2px var(--dda-on-surface-40)}.dda-checkbox-stroke label .dda-check-square{width:24px;height:24px;border:solid 2px var(--dda-surface-variant-80);border-radius:6px;position:relative}.dda-checkbox-stroke input[type=\"checkbox\"]:checked~label .dda-check-square{border:solid 2px var(--dda-color-primary-40)}.dda-checkbox-stroke input[type=\"checkbox\"]:checked~label .dda-check-square::before{content:\"\";width:8px;height:3px;border-left:solid 2px var(--dda-color-primary-40);border-bottom:solid 2px var(--dda-color-primary-40);position:absolute;top:6px;left:5px;transform:rotate(-45deg)}.dda-checkbox-fill input[type=\"checkbox\"]:focus-within~label .dda-check-square,.dda-checkbox-stroke input[type=\"checkbox\"]:focus-within~label .dda-check-square{box-shadow:0px 0px 0px 3px var(--dda-primary-variant-95)}.dda-checkbox-stroke.dda-checkbox-disabled label .dda-check-square{background-color:var(--dda-neutral-95);border:solid 2px var(--dda-neutral-95)}.dda-checkbox-container.dda-checkbox-disabled .dda-checkbox-title,.dda-checkbox-container.dda-checkbox-disabled .dda-checkbox-supporting{color:var(--dda-on-surface-40)}.dda-checkbox-container label p{margin:0px}.dda-checkbox-title{font-size:var(--font-body);color:var(--dda-on-surface-0);font-weight:var(--font-weight-regular);display:block}.light-mode .dda-checkbox-title{color:var(--dda-neutral-0)}.dda-checkbox-supporting{display:block;font-size:var(--font-small);font-weight:var(--font-weight-regular);color:var(--dda-on-surface-variant-30)}.light-mode .dda-checkbox-supporting{color:var(--dda-neutral-variant-30)}.dda-checkbox-disabled i,.dda-checkbox-disabled svg{color:var(--dda-neutral-70);border:solid 2px var(--dda-surface-90)}.dda-checkbox-container.dda-checkbox-disabled{pointer-events:none}";
|
|
3
|
+
const ddaCheckboxCss = ".dda-checkbox-container{display:inline-flex;align-items:center}.dda-checkbox-container input[type=\"checkbox\"]{width:0;height:0;position:absolute;opacity:0}.dda-checkbox-container label{cursor:pointer;display:inline-flex;align-items:flex-start;gap:10px}.dda-checkbox-fill label .dda-check-square{width:24px;height:24px;flex-shrink:0;border:solid 2px var(--dda-color-primary-40);border-radius:6px;position:relative}.dda-checkbox-fill label .dda-check-square::before{content:\"\";width:8px;height:3px;border-left:solid 2px var(--dda-color-primary-40);border-bottom:solid 2px var(--dda-color-primary-40);position:absolute;top:6px;left:5px;transform:rotate(-45deg)}.dda-checkbox-fill input[type=\"checkbox\"]:checked~label .dda-check-square{background-color:var(--dda-color-primary-40)}.dda-checkbox-fill input[type=\"checkbox\"]:checked~label .dda-check-square::before{border-left:solid 2px var(--dda-surface-100);border-bottom:solid 2px var(--dda-surface-100)}.dda-checkbox-fill.dda-checkbox-disabled label .dda-check-square{background:var(--dda-neutral-95);border:solid 2px var(--dda-neutral-95)}.dda-checkbox-fill.dda-checkbox-disabled label .dda-check-square::before{border-left:solid 2px var(--dda-on-surface-40);border-bottom:solid 2px var(--dda-on-surface-40)}.dda-checkbox-stroke label .dda-check-square{width:24px;height:24px;border:solid 2px var(--dda-surface-variant-80);border-radius:6px;position:relative}.dda-checkbox-stroke input[type=\"checkbox\"]:checked~label .dda-check-square{border:solid 2px var(--dda-color-primary-40)}.dda-checkbox-stroke input[type=\"checkbox\"]:checked~label .dda-check-square::before{content:\"\";width:8px;height:3px;border-left:solid 2px var(--dda-color-primary-40);border-bottom:solid 2px var(--dda-color-primary-40);position:absolute;top:6px;left:5px;transform:rotate(-45deg)}.dda-checkbox-fill input[type=\"checkbox\"]:focus-within~label .dda-check-square,.dda-checkbox-stroke input[type=\"checkbox\"]:focus-within~label .dda-check-square{box-shadow:0px 0px 0px 3px var(--dda-primary-variant-95)}.dda-checkbox-stroke.dda-checkbox-disabled label .dda-check-square{background-color:var(--dda-neutral-95);border:solid 2px var(--dda-neutral-95)}.dda-checkbox-container.dda-checkbox-disabled .dda-checkbox-title,.dda-checkbox-container.dda-checkbox-disabled .dda-checkbox-supporting{color:var(--dda-on-surface-40)}.dda-checkbox-container label p{margin:0px}.dda-checkbox-title{font-size:var(--font-body);color:var(--dda-on-surface-0);font-weight:var(--font-weight-regular);display:block}.light-mode .dda-checkbox-title{color:var(--dda-neutral-0)}.dda-checkbox-supporting{display:block;font-size:var(--font-small);font-weight:var(--font-weight-regular);color:var(--dda-on-surface-variant-30)}.light-mode .dda-checkbox-supporting{color:var(--dda-neutral-variant-30)}.dda-checkbox-disabled i,.dda-checkbox-disabled svg{color:var(--dda-neutral-70);border:solid 2px var(--dda-surface-90)}.dda-checkbox-container.dda-checkbox-disabled{pointer-events:none}";
|
|
4
4
|
const DdaCheckboxStyle0 = ddaCheckboxCss;
|
|
5
5
|
|
|
6
6
|
const DdaCheckbox$1 = /*@__PURE__*/ proxyCustomElement(class DdaCheckbox extends H {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"dda-checkbox.js","mappings":";;AAAA,MAAM,cAAc,GAAG,
|
|
1
|
+
{"file":"dda-checkbox.js","mappings":";;AAAA,MAAM,cAAc,GAAG,g7FAAg7F,CAAC;AACx8F,0BAAe,cAAc;;MCMhBA,aAAW;IALxB;;;;QAaU,iBAAY,GAAY,EAAE,CAAC;;QAQnC,sBAAiB,GAAG,CAAC,KAAY;YAC/B,MAAM,MAAM,GAAG,KAAK,CAAC,MAA0B,CAAC;YAChD,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;SAC1C,CAAC;KAmCH;IAjCC,MAAM;QACJ,MAAM,aAAa,GAAG;YACpB,wBAAwB;YACxB,IAAI,CAAC,UAAU,GAAG,gBAAgB,IAAI,CAAC,UAAU,EAAE,GAAG,EAAE;YACxD,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,YAAY,GAAG,EAAE;YAC1C,IAAI,CAAC,eAAe,GAAG,gBAAgB,IAAI,CAAC,eAAe,EAAE,GAAG,EAAE;YAClE,IAAI,CAAC,cAAc;SACpB,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;QAE5B,QACE,EAAC,IAAI,uDACH,4DAAK,KAAK,EAAE,aAAa,IACvB,8DACE,IAAI,EAAC,UAAU,EACf,EAAE,EAAE,IAAI,CAAC,QAAQ,EACjB,IAAI,EAAE,IAAI,CAAC,UAAU,gBACT,IAAI,CAAC,UAAU,EAC3B,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,QAAQ,EAAE,IAAI,CAAC,iBAAiB,GAChC,EACF,8DAAO,OAAO,EAAE,IAAI,CAAC,QAAQ,IAC3B,6DAAM,KAAK,EAAC,kBAAkB,GAAQ,EACtC,4DACE,6DAAM,KAAK,EAAC,oBAAoB,IAAE,IAAI,CAAC,UAAU,CAAQ,EACxD,IAAI,CAAC,UAAU,KACd,6DAAM,KAAK,EAAC,yBAAyB,IAAE,IAAI,CAAC,UAAU,CAAQ,CAC/D,CACC,CACE,CACJ,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["DdaCheckbox"],"sources":["src/components/dda-checkbox/dda-checkbox.css?tag=dda-checkbox","src/components/dda-checkbox/dda-checkbox.tsx"],"sourcesContent":[".dda-checkbox-container {\r\n display: inline-flex;\r\n align-items: center;\r\n}\r\n\r\n.dda-checkbox-container input[type=\"checkbox\"] {\r\n width: 0;\r\n height: 0;\r\n position: absolute;\r\n opacity: 0;\r\n}\r\n\r\n.dda-checkbox-container label {\r\n cursor: pointer;\r\n display: inline-flex;\r\n align-items: flex-start;\r\n gap: 10px;\r\n}\r\n\r\n/**/\r\n.dda-checkbox-fill label .dda-check-square{\r\n width: 24px;\r\n height: 24px;\r\n flex-shrink: 0;\r\n border: solid 2px var(--dda-color-primary-40);\r\n border-radius: 6px;\r\n position: relative;\r\n}\r\n.dda-checkbox-fill label .dda-check-square::before{\r\n content: \"\";\r\n width: 8px;\r\n height: 3px;\r\n border-left: solid 2px var(--dda-color-primary-40);\r\n border-bottom: solid 2px var(--dda-color-primary-40);\r\n position: absolute;\r\n top: 6px;\r\n left: 5px;\r\n transform: rotate(-45deg);\r\n}\r\n\r\n.dda-checkbox-fill input[type=\"checkbox\"]:checked~label .dda-check-square{\r\n background-color: var(--dda-color-primary-40);\r\n}\r\n.dda-checkbox-fill input[type=\"checkbox\"]:checked~label .dda-check-square::before{\r\n border-left: solid 2px var(--dda-surface-100);\r\n border-bottom: solid 2px var(--dda-surface-100);\r\n}\r\n.dda-checkbox-fill.dda-checkbox-disabled label .dda-check-square{\r\n background: var(--dda-neutral-95);\r\n border: solid 2px var(--dda-neutral-95);\r\n}\r\n.dda-checkbox-fill.dda-checkbox-disabled label .dda-check-square::before{\r\n border-left: solid 2px var(--dda-on-surface-40);\r\n border-bottom: solid 2px var(--dda-on-surface-40);\r\n}\r\n\r\n/**/\r\n.dda-checkbox-stroke label .dda-check-square{\r\n width: 24px;\r\n height: 24px;\r\n border: solid 2px var(--dda-surface-variant-80);\r\n border-radius: 6px;\r\n position: relative;\r\n}\r\n.dda-checkbox-stroke input[type=\"checkbox\"]:checked~label .dda-check-square{\r\n border: solid 2px var(--dda-color-primary-40);\r\n}\r\n.dda-checkbox-stroke input[type=\"checkbox\"]:checked~label .dda-check-square::before{\r\n content: \"\";\r\n width: 8px;\r\n height: 3px;\r\n border-left: solid 2px var(--dda-color-primary-40);\r\n border-bottom: solid 2px var(--dda-color-primary-40);\r\n position: absolute;\r\n top: 6px;\r\n left: 5px;\r\n transform: rotate(-45deg);\r\n}\r\n.dda-checkbox-fill input[type=\"checkbox\"]:focus-within~label .dda-check-square,\r\n.dda-checkbox-stroke input[type=\"checkbox\"]:focus-within~label .dda-check-square{\r\n box-shadow: 0px 0px 0px 3px var(--dda-primary-variant-95);\r\n}\r\n\r\n.dda-checkbox-stroke.dda-checkbox-disabled label .dda-check-square{\r\n background-color: var(--dda-neutral-95);\r\n border: solid 2px var(--dda-neutral-95);\r\n}\r\n.dda-checkbox-container.dda-checkbox-disabled .dda-checkbox-title,\r\n.dda-checkbox-container.dda-checkbox-disabled .dda-checkbox-supporting{\r\n color: var(--dda-on-surface-40);\r\n}\r\n\r\n\r\n.dda-checkbox-container label p {\r\n margin: 0px;\r\n}\r\n\r\n.dda-checkbox-title {\r\n font-size: var(--font-body);\r\n color: var(--dda-on-surface-0);\r\n font-weight: var(--font-weight-regular);\r\n display: block;\r\n}\r\n\r\n.light-mode .dda-checkbox-title{\r\n color: var(--dda-neutral-0);\r\n}\r\n\r\n.dda-checkbox-supporting {\r\n display: block;\r\n font-size: var(--font-small);\r\n font-weight: var(--font-weight-regular);\r\n color: var(--dda-on-surface-variant-30);\r\n}\r\n\r\n.light-mode .dda-checkbox-supporting {\r\n color: var(--dda-neutral-variant-30);\r\n}\r\n\r\n.dda-checkbox-disabled i,\r\n.dda-checkbox-disabled svg{\r\n color: var(--dda-neutral-70);\r\n border: solid 2px var(--dda-surface-90);\r\n}\r\n.dda-checkbox-container.dda-checkbox-disabled{\r\n pointer-events: none;\r\n}","import { Component, Prop, h, Host, Event, EventEmitter } from '@stencil/core';\r\n\r\n@Component({\r\n tag: 'dda-checkbox',\r\n styleUrls: ['dda-checkbox.css'],\r\n shadow: false,\r\n})\r\nexport class DdaCheckbox {\r\n @Prop() title_text: string;\r\n @Prop() supporting?: string;\r\n @Prop() group_name?: string;\r\n @Prop() input_id?: string;\r\n @Prop() checked: boolean;\r\n @Prop() checkbox_status?: string;\r\n @Prop() style_type?: string;\r\n @Prop() custom_class?: string = ''; \r\n @Prop() component_mode?: string; \r\n @Prop() aria_label?: string;\r\n\r\n /** Emits change event with current checked state */\r\n @Event() checkboxChange: EventEmitter<boolean>;\r\n\r\n /** Handles checkbox change */\r\n handleInputChange = (event: Event) => {\r\n const target = event.target as HTMLInputElement;\r\n this.checkboxChange.emit(target.checked);\r\n };\r\n\r\n render() {\r\n const checkboxClass = [\r\n 'dda-checkbox-container',\r\n this.style_type ? `dda-checkbox-${this.style_type}` : '',\r\n this.custom_class ? this.custom_class : '',\r\n this.checkbox_status ? `dda-checkbox-${this.checkbox_status}` : '',\r\n this.component_mode,\r\n ].filter(Boolean).join(' ');\r\n\r\n return (\r\n <Host>\r\n <div class={checkboxClass}>\r\n <input\r\n type=\"checkbox\"\r\n id={this.input_id}\r\n name={this.group_name}\r\n aria-label={this.aria_label}\r\n checked={this.checked}\r\n onChange={this.handleInputChange}\r\n />\r\n <label htmlFor={this.input_id}>\r\n <span class=\"dda-check-square\"></span>\r\n <p>\r\n <span class=\"dda-checkbox-title\">{this.title_text}</span>\r\n {this.supporting && (\r\n <span class=\"dda-checkbox-supporting\">{this.supporting}</span>\r\n )}\r\n </p>\r\n </label>\r\n </div>\r\n </Host>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -26,6 +26,8 @@ const DdaHeader$1 = /*@__PURE__*/ proxyCustomElement(class DdaHeader extends H {
|
|
|
26
26
|
this.accessibilitymenufunctionality = createEvent(this, "accessibilitymenufunctionality", 7);
|
|
27
27
|
this.searchfunctionality = createEvent(this, "searchfunctionality", 7);
|
|
28
28
|
this.firstLogoHref = '#';
|
|
29
|
+
this.firstLogoTarget = '';
|
|
30
|
+
this.rel = 'noopener noreferrer';
|
|
29
31
|
this.secondLogoHref = '#';
|
|
30
32
|
this.header_default_submenu = false;
|
|
31
33
|
this.loginText = null;
|
|
@@ -330,7 +332,7 @@ const DdaHeader$1 = /*@__PURE__*/ proxyCustomElement(class DdaHeader extends H {
|
|
|
330
332
|
}
|
|
331
333
|
render() {
|
|
332
334
|
const sideMenuItems = this.parseJsonArray(this.sideMenuItems);
|
|
333
|
-
return (h("header", { key: '
|
|
335
|
+
return (h("header", { key: '85d972d2e22a8d2469ff66ca590c27172d3f1a14', class: 'dda-header' }, h("div", { key: '9c611ba457da3c65769a5e76ef2d017aa4d69e85', class: "dda-head-logo" }, h("a", { key: 'c50649133f98632ba56d0e7aaf1d3a3a45dd0950', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.firstLogoHref, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.firstLogoHref) : ''), class: "govt-logo", target: this.firstLogoTarget, rel: "noopener noreferrer" }, h("img", { key: '1f2048b7a3254f33e38cf933890f30ca8f20e785', class: "logo-white", src: this.firstLogoWhiteSrc, alt: `${this.firstLogoAlt} White` }), h("img", { key: '5338c4023d98ee3371a560ce57451383fbcf1d59', class: "logo-colored", src: this.firstLogoSrc, alt: this.firstLogoAlt })), h("a", { key: '6fd018c63cb3d674a51d6d4db13cc8400ef046d7', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.secondLogoHref, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.secondLogoHref) : ''), class: "entt-logo" }, h("img", { key: '9b4da2985b673df530ae91a7627f644dc4056b23', class: "logo-white", src: this.secondLogoWhiteSrc, alt: `${this.secondLogoAlt} White` }), h("img", { key: '11ba9623fc639b61e8b66f5e4fb4d0f99730114c', class: "logo-colored", src: this.secondLogoSrc, alt: this.secondLogoAlt }))), h("div", { key: '4eb46ab04882cb045431db143a3fb73492a58146', class: "dda-menu-container" }, h("div", { key: '92c00f7c8018f23ff4a8848324ffe63ca5ca2783', class: "dda-main-navigation" }, h("div", { key: '9818c0757cba929c6d3a696cf654365b6d9bac79', class: `dda-menu-overley ${this.isMenuOpen ? 'show-overley' : ''}`, onClick: this.toggleMenu }), h("div", { key: '5a639063b0546bafe0c6e980a748d1e35a0fc336', class: "hamburger-menu", onClick: this.toggleMenu }, h("dda-tooltip", { key: '46369a3f0714bbcd3162a0a5120aeb908cd831c9', title_text: this.hamburger_menu_button_name, position: "top", class: "dda-d-block" }, h("button", { key: '0960c8a29a184241a3de1a5555ffd413c4457812', type: "button", class: "hamburger-menu-btn", name: this.hamburger_menu_button_name }, h("span", { key: 'a9782149beab1a64e710d87350d39599588cf362', class: "hamburger-line" }), h("span", { key: 'b8f1b3c59b6c5795030f7730895f42036fa5eedb', class: "hamburger-menu-text" }, this.hamburger_menu_button_name)))), h("div", { key: 'e8504915927404d7b8dce94990241b6d939262ee', class: "dda-sidemenu", style: { display: this.isMenuOpen ? 'block' : '', insetInlineStart: this.isMenuOpen ? '0px' : '' } }, h("div", { key: 'f36d65085f5aaa80e21cb5c080f4d0ba7d87a37e', class: "dda-sidemenu-content" }, h("h6", { key: '3aa347b291af9596d0fc5ca73a32346325dbdc91', class: "dda-side-nav-title" }, this.sideMainMenuTitle), h("ul", { key: 'e10d978f51d0259c866fb42089c77ceedafb8d12', class: "main_side_menu" }, sideMenuItems.map((menu, index) => {
|
|
334
336
|
const currentIndex = `menu-${index}`;
|
|
335
337
|
return (h("li", { key: currentIndex, id: `header_${menu.label}` }, h("a", {
|
|
336
338
|
// href={menu.href}
|
|
@@ -366,11 +368,11 @@ const DdaHeader$1 = /*@__PURE__*/ proxyCustomElement(class DdaHeader extends H {
|
|
|
366
368
|
}
|
|
367
369
|
}
|
|
368
370
|
}, menu.label), this.renderSubMenu(menu.subMenu, currentIndex)));
|
|
369
|
-
})), this.hideOtherMenu == false && h("h6", { key: '
|
|
371
|
+
})), this.hideOtherMenu == false && h("h6", { key: '88e480a1c8e830690365a55d529332fcea632b35', class: "dda-side-nav-title" }, this.sideOtherMenuTitle), !this.hideOtherMenu && (h("ul", { key: '20b70b2c839e58df63c75ec355b07a6bc2bfd3c7', class: "main_side_menu" }, this.parsedOtherMenuItems.map((itemlist, index) => (h("li", { key: `other-${index}` }, h("a", { href: this.useNavigator == 'true' ? 'javascript:void(0)' : itemlist.href, class: {
|
|
370
372
|
active: itemlist['active'] === 'true',
|
|
371
|
-
}, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(itemlist.href) : '') }, itemlist.label))))))), h("div", { key: '
|
|
373
|
+
}, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(itemlist.href) : '') }, itemlist.label))))))), h("div", { key: '3f5f95f384b2e7b3fdb372b979c0b900c0c91cc1', class: "dda-sidemenu-bottom" }, h("div", { key: '3735b34ab580f7bff1a1c1b0bb8cb962d186bd15', class: "dda-sidemenu-gov-logo" }, h("a", { key: 'd058ceda0f5def3282ac20689f683997d71c25ba', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.firstLogoHref, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.firstLogoHref) : ''), class: "govt-logo dda-mb-2" }, h("img", { key: '328a0aa7c7e9ac93a67e41c9bbbe3cf0d57d8dce', class: "", src: this.firstLogoSrc, alt: this.firstLogoAlt }))), h("div", { key: 'bd40ae890c04419ebd6066ee1cb2837ffa8e20ec', class: "dda-toolbar-menu-sidemenu" }, h("ul", { key: '16cc6b18d2cbdbdf98362d1e90363ca4c0617fa8' }, this.accessibility_button_id && (h("li", { key: 'c6d6e514186e7a700538dc345308f66317c4f051' }, h("button", { key: 'f3bbb3caac8d8760ec4e6bca5a27c0b0ab3fab58', name: this.toggle_accessibility_button_name, class: "tool-btn accessibility-btn", type: "button", onClick: this.toggleMobileAccessibilty, id: this.accessibility_button_id }, h("i", { key: '1fa5cbaf215887f36f47e315a4df63d210c117b5', class: this.accessibility_button_icon_family }, this.accessibility_button_icon_name), h("span", { key: 'a096bbc1df6655ab7155a48296114f836825a90f', class: "visually-hidden" }, this.accessibility_button_text)))), this.language_text && (h("li", { key: 'd5de4b816eea811dfd05d7c5c8f6b204dd8a4674' }, h("button", { key: 'c5aa6e9229c792a0d52b6a692a8a27ac12ecc988', name: this.language_button_name, class: "tool-btn", type: "button", onClick: this.languagehandler }, this.language_text))), this.loginText && (h("li", { key: '221f3f047a2feeaf306d2ed027934a5e7077e309' }, h("dda-link-button", { key: '487ae0c124443d46ab8859403133a6f850d70fef', button_color: "onsurface-secondary", start_icon: this.loginIcon, custom_class: "tool-btn login-button", link_button_text: this.loginText, onClick: this.toggleLogin,
|
|
372
374
|
// href={this.loginLink}
|
|
373
|
-
href: this.useLoginPopup ? 'javascript:void(0)' : this.loginLink, button_shape: "circle", size: "sm" })))))), h("button", { key: '
|
|
375
|
+
href: this.useLoginPopup ? 'javascript:void(0)' : this.loginLink, button_shape: "circle", size: "sm" })))))), h("button", { key: 'd2e3df7aa4fada34a26938e33826976563cd338f', type: "button", name: this.close_menu_button_name, class: "close-btn side-nav-close-btn", "aria-label": "Close Sidebar", onClick: this.toggleMenu }, h("i", { key: 'b1240e29f854d3745dc545d61e8fa029e1b2277b', class: "material-icons material-symbols-outlined", "aria-hidden": "true" }, "close")), this.usePredesignedAccessibilityMenu ? (h("div", { class: "dda-accessibility hide-accessibility mobile-accessibility", style: { display: this.isMobileAccessibiltyOpen ? 'block' : 'none' } }, h("div", { class: "mobile-accessibility-content" }, h("div", { class: "dda-row" }, h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.contrast_title), h("form", null, h("fieldset", { class: "dda-theme-list" }, h("legend", null, h("p", { class: "body Regular dda-mb-3" }, this.contrast_description)), this.contrast_noraml_text ? (h("dda-radiobutton", { title_text: this.contrast_noraml_text, checked: this.selected_contrast == 'normal', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "NormalThemeMobile", group_name: "themeselectionMobile", input_id: "NormalThemeMobile", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.normalContrasthandler, class: "hydrated" })) : null, this.contrast_color_blind_text ? (h("dda-radiobutton", { title_text: this.contrast_color_blind_text, checked: this.selected_contrast == 'colorblind', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "ColoursBlindMobile", group_name: "themeselectionMobile", input_id: "ColoursBlindMobile", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.blindContrasthandler, class: "hydrated" })) : null, this.contrast_red_weakness_text ? (h("dda-radiobutton", { title_text: this.contrast_red_weakness_text, checked: this.selected_contrast == 'redweakness', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "RedWeaknessMobile", group_name: "themeselectionMobile", input_id: "RedWeaknessMobile", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.redContrasthandler, class: "hydrated" })) : null, this.contrast_green_weakness_text ? (h("dda-radiobutton", { title_text: this.contrast_green_weakness_text, checked: this.selected_contrast == 'greenweakness', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "GreenWeaknessMobile", group_name: "themeselectionMobile", input_id: "GreenWeaknessMobile", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.greenContrasthandler, class: "hydrated" })) : null))), h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.screen_reader_title), h("p", { class: "body Regular dda-mb-3" }, this.screen_reader_description), h("div", { class: "rs_skip rsbtn rs_preserve rs_mobile", id: "readspeaker_button1" }, h("a", { rel: "nofollow", href: this.read_speaker_link, role: "button", class: "rsbtn_play circle readspeaker", accessKey: "L", "aria-label": "Listen to this page using ReadSpeaker", "data-rsshortcut": "play", "aria-haspopup": "menu", "data-rs-lang": "en_uk" }, h("i", { class: "material-icons material-symbols-outlined", "aria-hidden": "true" }, "volume_up")))), h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.text_size_title), h("p", { class: "body Regular dda-mb-3" }, this.text_size_description), h("div", { class: "dda-d-flex dda-gap-4" }, h("dda-button", { button_color: this.selected_text_size == 'normal' ? 'default-primary' : 'default-secondary', button_text: "A", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.baseTexthandler }), h("dda-button", { button_color: this.selected_text_size == 'large' ? 'default-primary' : 'default-secondary', button_text: "A+", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.lgTexthandler }), h("dda-button", { button_color: this.selected_text_size == 'small' ? 'default-primary' : 'default-secondary', button_text: "A-", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.smTexthandler }))))), h("button", { type: "button", name: this.close_accessibility_button_name, class: "close-btn close_accessibility", "aria-label": "Close Accessibility", onClick: this.toggleMobileAccessibilty }, h("i", { class: "material-icons material-symbols-outlined", "aria-hidden": "true" }, "close")))) : null), this.quickLinks && (h("dda-header-menu", { key: 'd2a4fcc2515dca0c3c8d83c8f8879aaa15fc1b09', "use-navigator": this.useNavigator, "navigator-click": this.navigatorClick, "show-Quick-Links-Icon": this.showQuickLinksIcon, "quick-links": typeof this.quickLinks === 'string' ? this.quickLinks : JSON.stringify(this.quickLinks) }))), h("div", { key: '5ac39abd0bf6cc76bc513c7830ad73cb47f13d81', class: "dda-mobile-entt-logo" }, h("a", { key: 'a7cffa397daead9537fe45672bccb904dd716ae4', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.secondLogoHref, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.secondLogoHref) : ''), class: "entt-logo" }, h("img", { key: '4f8508fdf4b0f1f6c15477f54956d158a56f634c', class: "logo-colored", src: this.secondLogoSrc, alt: this.secondLogoAlt }), h("img", { key: '0f04c5ce301f97d19c765322281eeba33db83c69', class: "logo-white", src: this.secondLogoWhiteSrc, alt: this.secondLogoAlt }))), h("div", { key: '784fc8a9ec206df296d0bc8406a32a3d20678bae', class: "dda-mobile-search" }, this.mobileMenuSearchId && (h("a", { key: '8269fb85bd8726deaf4cf2865c44f1f89c2a1dc0', href: this.useNavigator == 'true' ? 'javascript:void(0)' : this.mobileMenuSearchUrl, onClick: () => (this.useNavigator == 'true' ? this.navigatorClick.emit(this.mobileMenuSearchUrl) : ''), class: "tool-btn", id: this.mobileMenuSearchId }, h("span", { key: 'd17ca044c357b27a053c242453efacfc6a256eca', class: "visualy-hidden" }, this.searchText || 'Search'), h("i", { key: 'ce80aec55c19417fb2de1397f780edfef115b309', class: "material-icons material-symbols-outlined", "aria-hidden": "true" }, "search")))), h("div", { key: '59c75bfc8ccd5a10f150320fd74a31869bef372b', class: "dda-toolbar-menu" }, h("ul", { key: '519da4133f96b7f6541e5df2022b8a3cb654e1ce' }, this.search_input_name && (h("li", { key: '9832fc52dc4810eb42a961f183da28dc7bf9e796' }, h("dda-tooltip", { key: 'edc14b081750c28656912470eff75e1e2bf1f95a', title_text: this.search_tooltip || 'Search', description: "", position: "top" }, h("div", { key: '990c42155a382440db915bc70ecfef2778039872', class: "dda-search dda-header-search" }, h("label", { key: '291329ccd3d91d50cf484829e421338f491bb9fc', id: "ddaSearch-label", class: "visualy-hidden", "aria-hidden": "true" }, this.searchText || 'Search'), h("i", { key: 'd90c2857a0837d2e47151ec3d0a8ca43e8087bba', class: "material-icons material-symbols-outlined", "aria-hidden": "true" }, "search"), h("dda-input", { key: '810a3b3d3e9ac19d17b75b80f1e4e0b43e688565', placeholder: this.search_input_placeholder || 'Search', type: "text", input_id: "ddaSearch", value: this.search_value, input_name: this.search_input_name, aria_label: "input", input_role: "search", error_message: "Error text", validation_type: "normal", validation_id: "validationId", input_status: "normal", size: "default", custom_class: "dda-header-search-input tool-btn", component_mode: "", onInputChanged: (e) => {
|
|
374
376
|
this.searchhandler(e.detail.target.value);
|
|
375
377
|
console.log(e.detail.target.value);
|
|
376
378
|
}, onKeyPress: e => {
|
|
@@ -379,7 +381,7 @@ const DdaHeader$1 = /*@__PURE__*/ proxyCustomElement(class DdaHeader extends H {
|
|
|
379
381
|
console.log(e.target.value);
|
|
380
382
|
// Pass the value to the searchhandler
|
|
381
383
|
}
|
|
382
|
-
} }), h("span", { key: '
|
|
384
|
+
} }), h("span", { key: 'b099d2e7849d053b1e1ba14649c594d06c0e3585', id: "validationId", class: "visually-hidden" }, "Enter keywords to search the site."))))), this.accessibility_button_id && (h("li", { key: 'b36c371ddba19fac392ac9fc5b127e13a8edb9df' }, h("dda-tooltip", { key: '320c1ed592c22f292225664624b2737cb71efd4d', title_text: this.accessibility_tooltip, position: "top" }, h("button", { key: '1d18a368951ab42aa1fe7e028ef59c4d45256ada', name: this.toggle_accessibility_button_name, class: "tool-btn dda-btn btn-color-onsurface-secondary btn-size-sm btn-shape-circle accessibility-btn", type: "button", onClick: this.toggleAccessibilty, id: this.accessibility_button_id }, h("i", { key: 'b805fe2e4480ef85ee4ce682d0c20bc7ee0e1687', class: this.accessibility_button_icon_family }, this.accessibility_button_icon_name), h("span", { key: '231db67ec3143f553c9853a0a043c0866919e13a', class: "visually-hidden" }, this.accessibility_button_text))), this.usePredesignedAccessibilityMenu ? (h("div", { class: "dda-accessibility-wrap" }, h("div", { class: "dda-accessibility hide-accessibility", style: { display: this.isAccessibiltyOpen ? 'block' : 'none' } }, h("div", { class: "dda-row" }, h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.contrast_title), h("form", null, h("fieldset", { class: "dda-theme-list" }, h("legend", null, h("p", { class: "body Regular dda-mb-3" }, this.contrast_description)), this.contrast_noraml_text ? (h("dda-radiobutton", { title_text: this.contrast_noraml_text, checked: this.selected_contrast == 'normal', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "NormalTheme", group_name: "themeselection", input_id: "NormalTheme", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.normalContrasthandler, class: "" })) : null, this.contrast_color_blind_text ? (h("dda-radiobutton", { title_text: this.contrast_color_blind_text, checked: this.selected_contrast == 'colorblind', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "ColoursBlind", group_name: "themeselection", input_id: "ColoursBlind", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.blindContrasthandler, class: "hydrated" })) : null, this.contrast_red_weakness_text ? (h("dda-radiobutton", { title_text: this.contrast_red_weakness_text, checked: this.selected_contrast == 'redweakness', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "RedWeakness", group_name: "themeselection", input_id: "RedWeakness", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.redContrasthandler, class: "hydrated" })) : null, this.contrast_green_weakness_text ? (h("dda-radiobutton", { title_text: this.contrast_green_weakness_text, checked: this.selected_contrast == 'greenweakness', size: "default", variants: "normal", supporting: "", error_message: "", validation_id: "GreenWeakness", group_name: "themeselection", input_id: "GreenWeakness", custom_class: "", component_mode: "", aria_label: "radio-button", validation_type: "normal", onChange: this.greenContrasthandler, class: "hydrated" })) : null))), h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.screen_reader_title), h("p", { class: "body Regular dda-mb-3" }, this.screen_reader_description), h("div", { class: "rs_skip rsbtn rs_preserve rs_mobile", id: "readspeaker_button1" }, h("a", { rel: "nofollow", href: this.read_speaker_link, role: "button", class: "rsbtn_play circle readspeaker", accessKey: "L", "aria-label": "Listen to this page using ReadSpeaker", "data-rsshortcut": "play", "aria-haspopup": "menu", "data-rs-lang": "en_uk" }, h("i", { class: "material-icons material-symbols-outlined", "aria-hidden": "true" }, "volume_up")))), h("div", { class: "dda-col-md-4 dda-accessibility-item" }, h("h6", { class: "h6 Regular dda-mb-1" }, this.text_size_title), h("p", { class: "body Regular dda-mb-3" }, this.text_size_description), h("div", { class: "dda-d-flex dda-gap-4" }, h("dda-button", { button_color: this.selected_text_size == 'normal' ? 'default-primary' : 'default-secondary', button_text: "A", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.baseTexthandler }), h("dda-button", { button_color: this.selected_text_size == 'large' ? 'default-primary' : 'default-secondary', button_text: "A+", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.lgTexthandler }), h("dda-button", { button_color: this.selected_text_size == 'small' ? 'default-primary' : 'default-secondary', button_text: "A-", icon_button_shape: "circle", custom_class: "", size: "lg", onClick: this.smTexthandler })))), h("button", { type: "button", name: this.close_accessibility_button_name, class: "close-btn close_accessibility", "aria-label": "Close Sidebar", onClick: this.toggleAccessibilty }, h("i", { class: "material-icons material-symbols-outlined", "aria-hidden": "true" }, "close"))))) : null)), this.language_text && (h("li", { key: '55e8fc53d0bdbc8916750dab76f964d0af0db281' }, h("dda-tooltip", { key: 'e39c17cb88ea9334aede48556b16fa96448492fd', title_text: this.language_tooltip, position: "top" }, h("dda-button", { key: '0549fc410084074febead4f90cc97b7f4fd05990', button_color: "onsurface-secondary", custom_class: "tool-btn", button_text: this.language_text, button_shape: "circle", size: "sm", onClick: this.languagehandler })))), this.loginText && (h("li", { key: '05b35d24f04b39d233f790eb288a636ccd590868' }, h("dda-tooltip", { key: 'f4480551e90cf2cc1238e77f9061551b69e72de0', title_text: this.login_tooltip, position: "top" }, h("dda-link-button", { key: '19709adbbb8a5e010cb44a75ad5144c56ed930b5', button_color: "onsurface-secondary", start_icon: this.loginIcon, custom_class: "tool-btn login-button", link_button_text: this.loginText, onClick: this.toggleLogin,
|
|
383
385
|
// href={this.loginLink}
|
|
384
386
|
href: this.useLoginPopup ? 'javascript:void(0)' : this.loginLink, button_shape: "circle", size: "sm" })))))), this.useLoginPopup ? (h("div", { class: "dda-login-popup desktop", style: { display: this.isDesktopLoginPopupOpen ? 'block' : 'none' } }, this.renderLoginPopup())) : null, this.useLoginPopup ? (h("div", { class: "dda-login-popup mobile", style: { display: this.isMobileLoginPopupOpen ? 'block' : 'none' } }, this.renderLoginPopup())) : null)));
|
|
385
387
|
}
|
|
@@ -389,6 +391,8 @@ const DdaHeader$1 = /*@__PURE__*/ proxyCustomElement(class DdaHeader extends H {
|
|
|
389
391
|
"firstLogoSrc": [1, "first-logo-src"],
|
|
390
392
|
"firstLogoWhiteSrc": [1, "first-logo-white-src"],
|
|
391
393
|
"firstLogoAlt": [1, "first-logo-alt"],
|
|
394
|
+
"firstLogoTarget": [1, "first-logo-target"],
|
|
395
|
+
"rel": [1],
|
|
392
396
|
"secondLogoHref": [1, "second-logo-href"],
|
|
393
397
|
"secondLogoSrc": [1, "second-logo-src"],
|
|
394
398
|
"secondLogoWhiteSrc": [1, "second-logo-white-src"],
|