npm - @govtechsg/sgds-web-component - Versions diffs - 3.6.0-rc.2 → 3.6.0 - Mend

@govtechsg/sgds-web-component 3.6.0-rc.2 → 3.6.0

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.

Files changed (233) hide show

package/react/components/Footer/footer.cjs.js CHANGED Viewed

@@ -5,7 +5,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var lit = require('lit');
-var css_248z = lit.css`.footer{background-color:var(--sgds-bg-fixed-dark);container:footer/inline-size;height:auto;padding:var(--sgds-padding-none) var(--sgds-padding-lg)}.footer-top{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-default);display:flex;flex-direction:column;padding:var(--sgds-padding-2-xl) var(--sgds-padding-none)}.footer-top.has-content{gap:var(--sgds-gap-2-xl)}.footer-header{display:flex;flex-direction:column;gap:var(--sgds-gap-sm)}slot[name=title]::slotted(*){color:var(--sgds-color-fixed-light)!important;font-size:var(--sgds-font-size-4)!important;font-weight:var(--sgds-font-weight-semibold);letter-spacing:var(--sgds-letter-spacing-tight);line-height:var(--sgds-line-height-32)!important;margin-bottom:var(--sgds-margin-none)!important;margin-top:var(--sgds-margin-none)}slot:not([name])::slotted(*),slot[name=description]::slotted(*){color:var(--sgds-color-fixed-light);margin-bottom:var(--sgds-margin-none)!important;margin-top:var(--sgds-margin-none)}.footer-items{display:grid;gap:var(--sgds-gap-md) var(--sgds-gap-lg);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.footer ul{margin:0;padding:0}.footer ul li{list-style-type:none}.footer-bottom{display:flex;flex-direction:column;gap:var(--sgds-gap-md);padding:var(--sgds-padding-2-xl) var(--sgds-padding-none)}.footer-mandatory-links{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--sgds-gap-xl);justify-content:space-between}.footer-mandatory-links ul{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--sgds-gap-sm)}.footer-mandatory-links ul li a{text-decoration:none}.footer-mandatory-links ul li a,.footer-mandatory-links ul li a:focus,.footer-mandatory-links ul li a:hover{color:var(--sgds-color-fixed-light)}.footer-mandatory-links ul li a:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.footer-copyrights{color:var(--sgds-color-fixed-light);font-size:var(--sgds-font-size-1)}@container footer (min-width: 512px){.footer{padding:var(--sgds-padding-none) var(--sgds-padding-xl)}.footer-bottom,.footer-top{padding:var(--sgds-padding-2-xl) var(--sgds-padding-none)}}@container footer (min-width: 768px){.footer{padding:var(--sgds-padding-none) var(--sgds-padding-2-xl)}.footer-mandatory-links ul{flex-direction:row;gap:var(--sgds-gap-sm) var(--sgds-gap-xl)}}@container footer (min-width: 1024px){.footer{padding:var(--sgds-padding-none)}.footer-top{margin:auto;max-width:var(--sgds-dimension-888);padding:var(--sgds-padding-3-xl) var(--sgds-padding-none);width:100%}.footer-top.has-content{gap:var(--sgds-gap-3-xl)}slot[name=title]::slotted(*){font-size:var(--sgds-font-size-5)!important;line-height:var(--sgds-line-height-36)!important}.footer-bottom{margin:auto;max-width:var(--sgds-dimension-888);padding:var(--sgds-padding-2-xl) var(--sgds-padding-none);width:100%}.footer-mandatory-links ul{gap:var(--sgds-gap-xl)}}@container footer (min-width: 1280px){.footer-bottom,.footer-top{max-width:var(--sgds-dimension-1168)}.footer-mandatory-links{flex-direction:row}}@container footer (min-width: 1440px){.footer-bottom,.footer-top{max-width:var(--sgds-dimension-1312)}}`;
+var css_248z = lit.css`.footer{background-color:var(--sgds-bg-fixed-dark);container:footer/inline-size;height:auto;padding:var(--sgds-padding-none) var(--sgds-padding-lg)}.footer-top{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-default);display:flex;flex-direction:column;padding:var(--sgds-padding-2-xl) var(--sgds-padding-none)}.footer-top.has-content{gap:var(--sgds-gap-2-xl)}.footer-header{display:flex;flex-direction:column;gap:var(--sgds-gap-sm)}slot[name=title]::slotted(*){color:var(--sgds-color-fixed-light)!important;font-size:var(--sgds-font-size-4)!important;font-weight:var(--sgds-font-weight-semibold);letter-spacing:var(--sgds-letter-spacing-tight);line-height:var(--sgds-line-height-32)!important;margin-bottom:var(--sgds-margin-none)!important;margin-top:var(--sgds-margin-none)}slot:not([name])::slotted(*),slot[name=description]::slotted(*){color:var(--sgds-color-fixed-light);margin-bottom:var(--sgds-margin-none)!important;margin-top:var(--sgds-margin-none)}.footer-items{display:grid;gap:var(--sgds-gap-md) var(--sgds-gap-lg);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.footer ul{margin:0;padding:0}.footer ul li{list-style-type:none}.footer-bottom{display:flex;flex-direction:column;gap:var(--sgds-gap-md);padding:var(--sgds-padding-2-xl) var(--sgds-padding-none)}.footer-mandatory-links{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--sgds-gap-xl);justify-content:space-between}.footer-mandatory-links ul{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--sgds-gap-sm)}.footer-mandatory-links ul li a,.footer-mandatory-links ul li a:focus,.footer-mandatory-links ul li a:hover{color:var(--sgds-color-fixed-light)}.footer-mandatory-links ul li a:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.footer-copyrights{color:var(--sgds-color-fixed-light);font-size:var(--sgds-font-size-1)}@container footer (min-width: 512px){.footer{padding:var(--sgds-padding-none) var(--sgds-padding-xl)}.footer-bottom,.footer-top{padding:var(--sgds-padding-2-xl) var(--sgds-padding-none)}}@container footer (min-width: 768px){.footer{padding:var(--sgds-padding-none) var(--sgds-padding-2-xl)}.footer-mandatory-links ul{flex-direction:row;gap:var(--sgds-gap-sm) var(--sgds-gap-xl)}}@container footer (min-width: 1024px){.footer{padding:var(--sgds-padding-none)}.footer-top{margin:auto;max-width:var(--sgds-dimension-888);padding:var(--sgds-padding-3-xl) var(--sgds-padding-none);width:100%}.footer-top.has-content{gap:var(--sgds-gap-3-xl)}slot[name=title]::slotted(*){font-size:var(--sgds-font-size-5)!important;line-height:var(--sgds-line-height-36)!important}.footer-bottom{margin:auto;max-width:var(--sgds-dimension-888);padding:var(--sgds-padding-2-xl) var(--sgds-padding-none);width:100%}.footer-mandatory-links ul{gap:var(--sgds-gap-xl)}}@container footer (min-width: 1280px){.footer-bottom,.footer-top{max-width:var(--sgds-dimension-1168)}.footer-mandatory-links{flex-direction:row}}@container footer (min-width: 1440px){.footer-bottom,.footer-top{max-width:var(--sgds-dimension-1312)}}`;
 exports["default"] = css_248z;
 //# sourceMappingURL=footer.cjs.js.map

package/react/components/Footer/footer.js CHANGED Viewed

@@ -1,7 +1,7 @@
 'use client';
 import { css } from 'lit';
-var css_248z = css`.footer{background-color:var(--sgds-bg-fixed-dark);container:footer/inline-size;height:auto;padding:var(--sgds-padding-none) var(--sgds-padding-lg)}.footer-top{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-default);display:flex;flex-direction:column;padding:var(--sgds-padding-2-xl) var(--sgds-padding-none)}.footer-top.has-content{gap:var(--sgds-gap-2-xl)}.footer-header{display:flex;flex-direction:column;gap:var(--sgds-gap-sm)}slot[name=title]::slotted(*){color:var(--sgds-color-fixed-light)!important;font-size:var(--sgds-font-size-4)!important;font-weight:var(--sgds-font-weight-semibold);letter-spacing:var(--sgds-letter-spacing-tight);line-height:var(--sgds-line-height-32)!important;margin-bottom:var(--sgds-margin-none)!important;margin-top:var(--sgds-margin-none)}slot:not([name])::slotted(*),slot[name=description]::slotted(*){color:var(--sgds-color-fixed-light);margin-bottom:var(--sgds-margin-none)!important;margin-top:var(--sgds-margin-none)}.footer-items{display:grid;gap:var(--sgds-gap-md) var(--sgds-gap-lg);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.footer ul{margin:0;padding:0}.footer ul li{list-style-type:none}.footer-bottom{display:flex;flex-direction:column;gap:var(--sgds-gap-md);padding:var(--sgds-padding-2-xl) var(--sgds-padding-none)}.footer-mandatory-links{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--sgds-gap-xl);justify-content:space-between}.footer-mandatory-links ul{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--sgds-gap-sm)}.footer-mandatory-links ul li a{text-decoration:none}.footer-mandatory-links ul li a,.footer-mandatory-links ul li a:focus,.footer-mandatory-links ul li a:hover{color:var(--sgds-color-fixed-light)}.footer-mandatory-links ul li a:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.footer-copyrights{color:var(--sgds-color-fixed-light);font-size:var(--sgds-font-size-1)}@container footer (min-width: 512px){.footer{padding:var(--sgds-padding-none) var(--sgds-padding-xl)}.footer-bottom,.footer-top{padding:var(--sgds-padding-2-xl) var(--sgds-padding-none)}}@container footer (min-width: 768px){.footer{padding:var(--sgds-padding-none) var(--sgds-padding-2-xl)}.footer-mandatory-links ul{flex-direction:row;gap:var(--sgds-gap-sm) var(--sgds-gap-xl)}}@container footer (min-width: 1024px){.footer{padding:var(--sgds-padding-none)}.footer-top{margin:auto;max-width:var(--sgds-dimension-888);padding:var(--sgds-padding-3-xl) var(--sgds-padding-none);width:100%}.footer-top.has-content{gap:var(--sgds-gap-3-xl)}slot[name=title]::slotted(*){font-size:var(--sgds-font-size-5)!important;line-height:var(--sgds-line-height-36)!important}.footer-bottom{margin:auto;max-width:var(--sgds-dimension-888);padding:var(--sgds-padding-2-xl) var(--sgds-padding-none);width:100%}.footer-mandatory-links ul{gap:var(--sgds-gap-xl)}}@container footer (min-width: 1280px){.footer-bottom,.footer-top{max-width:var(--sgds-dimension-1168)}.footer-mandatory-links{flex-direction:row}}@container footer (min-width: 1440px){.footer-bottom,.footer-top{max-width:var(--sgds-dimension-1312)}}`;
+var css_248z = css`.footer{background-color:var(--sgds-bg-fixed-dark);container:footer/inline-size;height:auto;padding:var(--sgds-padding-none) var(--sgds-padding-lg)}.footer-top{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-default);display:flex;flex-direction:column;padding:var(--sgds-padding-2-xl) var(--sgds-padding-none)}.footer-top.has-content{gap:var(--sgds-gap-2-xl)}.footer-header{display:flex;flex-direction:column;gap:var(--sgds-gap-sm)}slot[name=title]::slotted(*){color:var(--sgds-color-fixed-light)!important;font-size:var(--sgds-font-size-4)!important;font-weight:var(--sgds-font-weight-semibold);letter-spacing:var(--sgds-letter-spacing-tight);line-height:var(--sgds-line-height-32)!important;margin-bottom:var(--sgds-margin-none)!important;margin-top:var(--sgds-margin-none)}slot:not([name])::slotted(*),slot[name=description]::slotted(*){color:var(--sgds-color-fixed-light);margin-bottom:var(--sgds-margin-none)!important;margin-top:var(--sgds-margin-none)}.footer-items{display:grid;gap:var(--sgds-gap-md) var(--sgds-gap-lg);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.footer ul{margin:0;padding:0}.footer ul li{list-style-type:none}.footer-bottom{display:flex;flex-direction:column;gap:var(--sgds-gap-md);padding:var(--sgds-padding-2-xl) var(--sgds-padding-none)}.footer-mandatory-links{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--sgds-gap-xl);justify-content:space-between}.footer-mandatory-links ul{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--sgds-gap-sm)}.footer-mandatory-links ul li a,.footer-mandatory-links ul li a:focus,.footer-mandatory-links ul li a:hover{color:var(--sgds-color-fixed-light)}.footer-mandatory-links ul li a:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.footer-copyrights{color:var(--sgds-color-fixed-light);font-size:var(--sgds-font-size-1)}@container footer (min-width: 512px){.footer{padding:var(--sgds-padding-none) var(--sgds-padding-xl)}.footer-bottom,.footer-top{padding:var(--sgds-padding-2-xl) var(--sgds-padding-none)}}@container footer (min-width: 768px){.footer{padding:var(--sgds-padding-none) var(--sgds-padding-2-xl)}.footer-mandatory-links ul{flex-direction:row;gap:var(--sgds-gap-sm) var(--sgds-gap-xl)}}@container footer (min-width: 1024px){.footer{padding:var(--sgds-padding-none)}.footer-top{margin:auto;max-width:var(--sgds-dimension-888);padding:var(--sgds-padding-3-xl) var(--sgds-padding-none);width:100%}.footer-top.has-content{gap:var(--sgds-gap-3-xl)}slot[name=title]::slotted(*){font-size:var(--sgds-font-size-5)!important;line-height:var(--sgds-line-height-36)!important}.footer-bottom{margin:auto;max-width:var(--sgds-dimension-888);padding:var(--sgds-padding-2-xl) var(--sgds-padding-none);width:100%}.footer-mandatory-links ul{gap:var(--sgds-gap-xl)}}@container footer (min-width: 1280px){.footer-bottom,.footer-top{max-width:var(--sgds-dimension-1168)}.footer-mandatory-links{flex-direction:row}}@container footer (min-width: 1440px){.footer-bottom,.footer-top{max-width:var(--sgds-dimension-1312)}}`;
 export { css_248z as default };
 //# sourceMappingURL=footer.js.map

package/react/components/Footer/sgds-footer-item.cjs.js CHANGED Viewed

@@ -15,12 +15,22 @@ var footerItem = require('./footer-item.cjs.js');
  *
  */
 class SgdsFooterItem extends sgdsElement["default"] {
+    _handleSlotChange(e) {
+        const assignedElements = e.target.assignedElements();
+        assignedElements.forEach(el => {
+            if (el.tagName === "SGDS-LINK") {
+                const sgdsLink = el;
+                sgdsLink.tone = "fixed-light";
+                sgdsLink.size = "sm";
+            }
+        });
+    }
     render() {
         return lit.html `
       <div class="footer-item">
         <slot name="title"></slot>
         <div class="links">
-          <slot></slot>
+          <slot @slotchange=${this._handleSlotChange}></slot>
         </div>
       </div>
     `;

package/react/components/Footer/sgds-footer-item.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sgds-footer-item.cjs.js","sources":["../../../../src/components/Footer/sgds-footer-item.ts"],"sourcesContent":["import { html } from \"lit\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport footerLinkStyle from \"./footer-item.css\";\n\n/*\n @summary The footer item component organizes links under a clear, descriptive title within the footer. It helps users easily navigate to related resources or information, ensuring clarity and accessibility.\n \n @slot default - The slot for the list of link items\n * @slot title - The slot for the title of the list of items\n \n /\nexport class SgdsFooterItem extends SgdsElement {\n static styles = [...SgdsElement.styles, footerLinkStyle];\n\n render() {\n return html`\n <div class=\"footer-item\">\n <slot name=\"title\"></slot>\n <div class=\"links\">\n <slot></slot>\n </div>\n </div>\n `;\n }\n}\n\nexport default SgdsFooterItem;\n"],"names":["SgdsElement","html","footerLinkStyle"],"mappings":";;;;;;;;;~~AAIA~~;;;;;;AAMG;AACG,MAAO,cAAe,SAAQA,sBAAW,CAAA;~~IAG7C~~,MAAM,GAAA;AACJ,QAAA,OAAOC,QAAI,CAAA,CAAA~~;;;;;;;KAOV~~,CAAC;KACH;;~~AAXM~~,cAAM,CAAA,MAAA,GAAG,CAAC,GAAGD,sBAAW,CAAC,MAAM,EAAEE,qBAAe,CAAC;;;;;"}
1	+ {"version":3,"file":"sgds-footer-item.cjs.js","sources":["../../../../src/components/Footer/sgds-footer-item.ts"],"sourcesContent":["import { html } from \"lit\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport footerLinkStyle from \"./footer-item.css\";\nimport type SgdsLink from \"../Link/sgds-link\";\n\n/*\n @summary The footer item component organizes links under a clear, descriptive title within the footer. It helps users easily navigate to related resources or information, ensuring clarity and accessibility.\n \n @slot default - The slot for the list of link items\n * @slot title - The slot for the title of the list of items\n \n /\nexport class SgdsFooterItem extends SgdsElement {\n static styles = [...SgdsElement.styles, footerLinkStyle];\n\n private _handleSlotChange(e: Event) {\n const assignedElements = (e.target as HTMLSlotElement).assignedElements();\n assignedElements.forEach(el => {\n if (el.tagName === \"SGDS-LINK\") {\n const sgdsLink = el as SgdsLink;\n sgdsLink.tone = \"fixed-light\";\n sgdsLink.size = \"sm\";\n }\n });\n }\n render() {\n return html`\n <div class=\"footer-item\">\n <slot name=\"title\"></slot>\n <div class=\"links\">\n <slot @slotchange=${this._handleSlotChange}></slot>\n </div>\n </div>\n `;\n }\n}\n\nexport default SgdsFooterItem;\n"],"names":["SgdsElement","html","footerLinkStyle"],"mappings":";;;;;;;;;AAKA;;;;;;AAMG;AACG,MAAO,cAAe,SAAQA,sBAAW,CAAA;AAGrC,IAAA,iBAAiB,CAAC,CAAQ,EAAA;QAChC,MAAM,gBAAgB,GAAI,CAAC,CAAC,MAA0B,CAAC,gBAAgB,EAAE,CAAC;AAC1E,QAAA,gBAAgB,CAAC,OAAO,CAAC,EAAE,IAAG;AAC5B,YAAA,IAAI,EAAE,CAAC,OAAO,KAAK,WAAW,EAAE;gBAC9B,MAAM,QAAQ,GAAG,EAAc,CAAC;AAChC,gBAAA,QAAQ,CAAC,IAAI,GAAG,aAAa,CAAC;AAC9B,gBAAA,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC;aACtB;AACH,SAAC,CAAC,CAAC;KACJ;IACD,MAAM,GAAA;AACJ,QAAA,OAAOC,QAAI,CAAA,CAAA;;;;AAIe,4BAAA,EAAA,IAAI,CAAC,iBAAiB,CAAA;;;KAG/C,CAAC;KACH;;AArBM,cAAM,CAAA,MAAA,GAAG,CAAC,GAAGD,sBAAW,CAAC,MAAM,EAAEE,qBAAe,CAAC;;;;;"}

package/react/components/Footer/sgds-footer-item.js CHANGED Viewed

@@ -11,12 +11,22 @@ import css_248z from './footer-item.js';
  *
  */
 class SgdsFooterItem extends SgdsElement {
+    _handleSlotChange(e) {
+        const assignedElements = e.target.assignedElements();
+        assignedElements.forEach(el => {
+            if (el.tagName === "SGDS-LINK") {
+                const sgdsLink = el;
+                sgdsLink.tone = "fixed-light";
+                sgdsLink.size = "sm";
+            }
+        });
+    }
     render() {
         return html `
       <div class="footer-item">
         <slot name="title"></slot>
         <div class="links">
-          <slot></slot>
+          <slot @slotchange=${this._handleSlotChange}></slot>
         </div>
       </div>
     `;

package/react/components/Footer/sgds-footer-item.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sgds-footer-item.js","sources":["../../../../src/components/Footer/sgds-footer-item.ts"],"sourcesContent":["import { html } from \"lit\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport footerLinkStyle from \"./footer-item.css\";\n\n/*\n @summary The footer item component organizes links under a clear, descriptive title within the footer. It helps users easily navigate to related resources or information, ensuring clarity and accessibility.\n \n @slot default - The slot for the list of link items\n * @slot title - The slot for the title of the list of items\n \n /\nexport class SgdsFooterItem extends SgdsElement {\n static styles = [...SgdsElement.styles, footerLinkStyle];\n\n render() {\n return html`\n <div class=\"footer-item\">\n <slot name=\"title\"></slot>\n <div class=\"links\">\n <slot></slot>\n </div>\n </div>\n `;\n }\n}\n\nexport default SgdsFooterItem;\n"],"names":["footerLinkStyle"],"mappings":";;;;;~~AAIA~~;;;;;;AAMG;AACG,MAAO,cAAe,SAAQ,WAAW,CAAA;~~IAG7C~~,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA~~;;;;;;;KAOV~~,CAAC;KACH;;~~AAXM~~,cAAM,CAAA,MAAA,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAe,CAAC;;;;"}
1	+ {"version":3,"file":"sgds-footer-item.js","sources":["../../../../src/components/Footer/sgds-footer-item.ts"],"sourcesContent":["import { html } from \"lit\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport footerLinkStyle from \"./footer-item.css\";\nimport type SgdsLink from \"../Link/sgds-link\";\n\n/*\n @summary The footer item component organizes links under a clear, descriptive title within the footer. It helps users easily navigate to related resources or information, ensuring clarity and accessibility.\n \n @slot default - The slot for the list of link items\n * @slot title - The slot for the title of the list of items\n \n /\nexport class SgdsFooterItem extends SgdsElement {\n static styles = [...SgdsElement.styles, footerLinkStyle];\n\n private _handleSlotChange(e: Event) {\n const assignedElements = (e.target as HTMLSlotElement).assignedElements();\n assignedElements.forEach(el => {\n if (el.tagName === \"SGDS-LINK\") {\n const sgdsLink = el as SgdsLink;\n sgdsLink.tone = \"fixed-light\";\n sgdsLink.size = \"sm\";\n }\n });\n }\n render() {\n return html`\n <div class=\"footer-item\">\n <slot name=\"title\"></slot>\n <div class=\"links\">\n <slot @slotchange=${this._handleSlotChange}></slot>\n </div>\n </div>\n `;\n }\n}\n\nexport default SgdsFooterItem;\n"],"names":["footerLinkStyle"],"mappings":";;;;;AAKA;;;;;;AAMG;AACG,MAAO,cAAe,SAAQ,WAAW,CAAA;AAGrC,IAAA,iBAAiB,CAAC,CAAQ,EAAA;QAChC,MAAM,gBAAgB,GAAI,CAAC,CAAC,MAA0B,CAAC,gBAAgB,EAAE,CAAC;AAC1E,QAAA,gBAAgB,CAAC,OAAO,CAAC,EAAE,IAAG;AAC5B,YAAA,IAAI,EAAE,CAAC,OAAO,KAAK,WAAW,EAAE;gBAC9B,MAAM,QAAQ,GAAG,EAAc,CAAC;AAChC,gBAAA,QAAQ,CAAC,IAAI,GAAG,aAAa,CAAC;AAC9B,gBAAA,QAAQ,CAAC,IAAI,GAAG,IAAI,CAAC;aACtB;AACH,SAAC,CAAC,CAAC;KACJ;IACD,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA;;;;AAIe,4BAAA,EAAA,IAAI,CAAC,iBAAiB,CAAA;;;KAG/C,CAAC;KACH;;AArBM,cAAM,CAAA,MAAA,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAe,CAAC;;;;"}

package/react/components/Footer/sgds-footer.cjs.js CHANGED Viewed

@@ -84,29 +84,29 @@ class SgdsFooter extends sgdsElement["default"] {
           <div class="footer-mandatory-links">
             <ul>
               <li>
-                <sgds-link size="sm"><a href=${this.contactHref}>Contact</a></sgds-link>
+                <sgds-link size="sm" tone="fixed-light"><a href=${this.contactHref}>Contact</a></sgds-link>
               </li>
               <li>
-                <sgds-link size="sm"><a href=${this.feedbackHref}>Feedback</a></sgds-link>
+                <sgds-link size="sm" tone="fixed-light"><a href=${this.feedbackHref}>Feedback</a></sgds-link>
               </li>
               <li>
-                <sgds-link size="sm"><a href=${this.faqHref}>FAQ</a></sgds-link>
+                <sgds-link size="sm" tone="fixed-light"><a href=${this.faqHref}>FAQ</a></sgds-link>
               </li>
               <li>
-                <sgds-link size="sm"><a href=${this.sitemapHref}>Sitemap</a></sgds-link>
+                <sgds-link size="sm" tone="fixed-light"><a href=${this.sitemapHref}>Sitemap</a></sgds-link>
               </li>
               <li>
-                <sgds-link size="sm">
+                <sgds-link size="sm" tone="fixed-light">
                   <a href="https://tech.gov.sg/report_vulnerability" target="_blank" rel="noopener noreferrer">
                     Report Vulnerability
                   </a>
                 </sgds-link>
               </li>
               <li>
-                <sgds-link size="sm"><a href=${this.privacyHref}>Privacy Statement</a></sgds-link>
+                <sgds-link size="sm" tone="fixed-light"><a href=${this.privacyHref}>Privacy Statement</a></sgds-link>
               </li>
               <li>
-                <sgds-link size="sm"><a href=${this.termsOfUseHref}>Terms of use</a></sgds-link>
+                <sgds-link size="sm" tone="fixed-light"><a href=${this.termsOfUseHref}>Terms of use</a></sgds-link>
               </li>
             </ul>
             <div class="footer-copyrights">© ${new Date().getFullYear()}, ${this.copyrightLiner}</div>

package/react/components/Footer/sgds-footer.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sgds-footer.cjs.js","sources":["../../../../src/components/Footer/sgds-footer.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsLink from \"../Link/sgds-link\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { HasSlotController } from \"../../utils/slot\";\nimport footerStyle from \"./footer.css\";\n\n/*\n @summary The footer contains supporting information for your service at the bottom of your website. All .gov.sg digital services shall contain a Global Footer Bar across all pages. The Global Footer Bar should include the name of the digital service, contact information, a privacy statement and the terms of use.\n \n @slot default - The slot for footer content. Use this slot if you want full control over the layout or styling. When provided, it replaces the `items` slot layout.\n * @slot title - The slot for title\n * @slot description - The slot for description\n * @slot items - the slot for the list of footer items, styled automatically with `.footer-items`. For custom layouts or styles, use the `default` slot instead.\n /\nexport class SgdsFooter extends SgdsElement {\n static styles = [...SgdsElement.styles, footerStyle];\n\n /* @internal /\n static dependencies = {\n \"sgds-link\": SgdsLink\n };\n\n /* Sets copyrightLiner of SgdsFooter /\n @property({ type: String })\n copyrightLiner = \"Government of Singapore\";\n\n /\thref link for contacts /\n @property({ type: String })\n contactHref = \"#\";\n\n /*\thref link for feedback /\n @property({ type: String })\n feedbackHref = \"#\";\n\n /*\thref link for faq /\n @property({ type: String })\n faqHref = \"#\";\n\n /*\thref link for sitemap /\n @property({ type: String })\n sitemapHref = \"#\";\n\n /*\thref link for privacy statement /\n @property({ type: String })\n privacyHref = \"#\";\n\n /*\thref link for terms of use /\n @property({ type: String })\n termsOfUseHref = \"#\";\n\n /** Used only for SSR to indicate the presence of the `default` slot. /\n @property({ type: Boolean }) hasDefaultSlot = false;\n\n /* Used only for SSR to indicate the presence of the `title` slot. /\n @property({ type: Boolean }) hasTitleSlot = false;\n\n /* Used only for SSR to indicate the presence of the `description` slot. /\n @property({ type: Boolean }) hasDescriptionSlot = false;\n\n /* Used only for SSR to indicate the presence of the `items` slot. */\n @property({ type: Boolean }) hasItemsSlot = false;\n\n private readonly hasSlotController = new HasSlotController(this, \"[default]\", \"title\", \"description\", \"items\");\n\n updated() {\n if (!this.hasDefaultSlot) this.hasDefaultSlot = this.hasSlotController.test(\"[default]\");\n if (!this.hasTitleSlot) this.hasTitleSlot = this.hasSlotController.test(\"title\");\n if (!this.hasDescriptionSlot) this.hasDescriptionSlot = this.hasSlotController.test(\"description\");\n if (!this.hasItemsSlot) this.hasItemsSlot = this.hasSlotController.test(\"items\");\n }\n\n render() {\n return html`\n <footer class=\"footer\">\n <section\n class=\"${classMap({\n \"footer-top\": this.hasDefaultSlot \|\| this.hasTitleSlot \|\| this.hasDescriptionSlot \|\| this.hasItemsSlot,\n \"has-content\": this.hasDefaultSlot \|\| this.hasItemsSlot\n })}\"\n >\n <div class=\"footer-header\">\n <slot name=\"title\"></slot>\n <slot name=\"description\"></slot>\n </div>\n <div>\n ${this.hasDefaultSlot\n ? html`<slot></slot>`\n : html`\n <div class=\"footer-items\">\n <slot name=\"items\"></slot>\n </div>\n `}\n </div>\n </section>\n <section class=\"footer-bottom\">\n <div class=\"footer-mandatory-links\">\n <ul>\n <li>\n <sgds-link size=\"sm\"><a href=${this.contactHref}>Contact</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\"><a href=${this.feedbackHref}>Feedback</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\"><a href=${this.faqHref}>FAQ</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\"><a href=${this.sitemapHref}>Sitemap</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\">\n <a href=\"https://tech.gov.sg/report_vulnerability\" target=\"_blank\" rel=\"noopener noreferrer\">\n Report Vulnerability\n </a>\n </sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\"><a href=${this.privacyHref}>Privacy Statement</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\"><a href=${this.termsOfUseHref}>Terms of use</a></sgds-link>\n </li>\n </ul>\n <div class=\"footer-copyrights\">© ${new Date().getFullYear()}, ${this.copyrightLiner}</div>\n </div>\n </section>\n </footer>\n `;\n }\n}\n\nexport default SgdsFooter;\n"],"names":["SgdsElement","HasSlotController","html","classMap","footerStyle","SgdsLink","__decorate","property"],"mappings":";;;;;;;;;;;;;;AAQA;;;;;;;AAOG;AACG,MAAO,UAAW,SAAQA,sBAAW,CAAA;AAA3C,IAAA,WAAA,GAAA;;;QAUE,IAAc,CAAA,cAAA,GAAG,yBAAyB,CAAC;;QAI3C,IAAW,CAAA,WAAA,GAAG,GAAG,CAAC;;QAIlB,IAAY,CAAA,YAAA,GAAG,GAAG,CAAC;;QAInB,IAAO,CAAA,OAAA,GAAG,GAAG,CAAC;;QAId,IAAW,CAAA,WAAA,GAAG,GAAG,CAAC;;QAIlB,IAAW,CAAA,WAAA,GAAG,GAAG,CAAC;;QAIlB,IAAc,CAAA,cAAA,GAAG,GAAG,CAAC;;QAGQ,IAAc,CAAA,cAAA,GAAG,KAAK,CAAC;;QAGvB,IAAY,CAAA,YAAA,GAAG,KAAK,CAAC;;QAGrB,IAAkB,CAAA,kBAAA,GAAG,KAAK,CAAC;;QAG3B,IAAY,CAAA,YAAA,GAAG,KAAK,CAAC;AAEjC,QAAA,IAAA,CAAA,iBAAiB,GAAG,IAAIC,sBAAiB,CAAC,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,aAAa,EAAE,OAAO,CAAC,CAAC;KAmEhH;IAjEC,OAAO,GAAA;QACL,IAAI,CAAC,IAAI,CAAC,cAAc;YAAE,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QACzF,IAAI,CAAC,IAAI,CAAC,YAAY;YAAE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACjF,IAAI,CAAC,IAAI,CAAC,kBAAkB;YAAE,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QACnG,IAAI,CAAC,IAAI,CAAC,YAAY;YAAE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KAClF;IAED,MAAM,GAAA;AACJ,QAAA,OAAOC,QAAI,CAAA,CAAA;;;AAGI,iBAAA,EAAAC,oBAAQ,CAAC;AAChB,YAAA,YAAY,EAAE,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,kBAAkB,IAAI,IAAI,CAAC,YAAY;AACtG,YAAA,aAAa,EAAE,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,YAAY;SACxD,CAAC,CAAA;;;;;;;AAOE,YAAA,EAAA,IAAI,CAAC,cAAc;cACjBD,QAAI,CAAA,CAAe,aAAA,CAAA;cACnBA,QAAI,CAAA,CAAA;;;;AAIH,gBAAA,CAAA,CAAA;;;;;;;~~AAO8B~~,~~6CAAA~~,EAAA,IAAI,CAAC,WAAW,CAAA;;;AAGhB,~~6CAAA~~,EAAA,IAAI,CAAC,YAAY,CAAA;;;AAGjB,~~6CAAA~~,EAAA,IAAI,CAAC,OAAO,CAAA;;;AAGZ,~~6CAAA~~,EAAA,IAAI,CAAC,WAAW,CAAA;;;;;;;;;;AAUhB,~~6CAAA~~,EAAA,IAAI,CAAC,WAAW,CAAA;;;AAGhB,~~6CAAA~~,EAAA,IAAI,CAAC,cAAc,CAAA;;;+~~CAGnB~~,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE,CAAK,EAAA,EAAA,IAAI,CAAC,cAAc,CAAA;;;;KAI1F,CAAC;KACH;;AAjHM,UAAM,CAAA,MAAA,GAAG,CAAC,GAAGF,sBAAW,CAAC,MAAM,EAAEI,iBAAW,CAAtC,CAAwC;AAErD;AACO,UAAA,CAAA,YAAY,GAAG;AACpB,IAAA,WAAW,EAAEC,iBAAQ;AACtB,CAFkB,CAEjB;AAIFC,gBAAA,CAAA;AADC,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACgB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAI3CD,gBAAA,CAAA;AADC,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACT,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAIlBD,gBAAA,CAAA;AADC,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACR,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAInBD,gBAAA,CAAA;AADC,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACb,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,SAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAIdD,gBAAA,CAAA;AADC,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACT,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAIlBD,gBAAA,CAAA;AADC,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACT,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAIlBD,gBAAA,CAAA;AADC,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACN,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGQD,gBAAA,CAAA;AAA5B,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AAAwB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGvBD,gBAAA,CAAA;AAA5B,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AAAsB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGrBD,gBAAA,CAAA;AAA5B,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AAA4B,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,oBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAG3BD,gBAAA,CAAA;AAA5B,IAAAC,sBAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AAAsB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA;;;;;"}
1	+ {"version":3,"file":"sgds-footer.cjs.js","sources":["../../../../src/components/Footer/sgds-footer.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsLink from \"../Link/sgds-link\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { HasSlotController } from \"../../utils/slot\";\nimport footerStyle from \"./footer.css\";\n\n/*\n @summary The footer contains supporting information for your service at the bottom of your website. All .gov.sg digital services shall contain a Global Footer Bar across all pages. The Global Footer Bar should include the name of the digital service, contact information, a privacy statement and the terms of use.\n \n @slot default - The slot for footer content. Use this slot if you want full control over the layout or styling. When provided, it replaces the `items` slot layout.\n * @slot title - The slot for title\n * @slot description - The slot for description\n * @slot items - the slot for the list of footer items, styled automatically with `.footer-items`. For custom layouts or styles, use the `default` slot instead.\n /\nexport class SgdsFooter extends SgdsElement {\n static styles = [...SgdsElement.styles, footerStyle];\n\n /* @internal /\n static dependencies = {\n \"sgds-link\": SgdsLink\n };\n\n /* Sets copyrightLiner of SgdsFooter /\n @property({ type: String })\n copyrightLiner = \"Government of Singapore\";\n\n /\thref link for contacts /\n @property({ type: String })\n contactHref = \"#\";\n\n /*\thref link for feedback /\n @property({ type: String })\n feedbackHref = \"#\";\n\n /*\thref link for faq /\n @property({ type: String })\n faqHref = \"#\";\n\n /*\thref link for sitemap /\n @property({ type: String })\n sitemapHref = \"#\";\n\n /*\thref link for privacy statement /\n @property({ type: String })\n privacyHref = \"#\";\n\n /*\thref link for terms of use /\n @property({ type: String })\n termsOfUseHref = \"#\";\n\n /** Used only for SSR to indicate the presence of the `default` slot. /\n @property({ type: Boolean }) hasDefaultSlot = false;\n\n /* Used only for SSR to indicate the presence of the `title` slot. /\n @property({ type: Boolean }) hasTitleSlot = false;\n\n /* Used only for SSR to indicate the presence of the `description` slot. /\n @property({ type: Boolean }) hasDescriptionSlot = false;\n\n /* Used only for SSR to indicate the presence of the `items` slot. */\n @property({ type: Boolean }) hasItemsSlot = false;\n\n private readonly hasSlotController = new HasSlotController(this, \"[default]\", \"title\", \"description\", \"items\");\n\n updated() {\n if (!this.hasDefaultSlot) this.hasDefaultSlot = this.hasSlotController.test(\"[default]\");\n if (!this.hasTitleSlot) this.hasTitleSlot = this.hasSlotController.test(\"title\");\n if (!this.hasDescriptionSlot) this.hasDescriptionSlot = this.hasSlotController.test(\"description\");\n if (!this.hasItemsSlot) this.hasItemsSlot = this.hasSlotController.test(\"items\");\n }\n\n render() {\n return html`\n <footer class=\"footer\">\n <section\n class=\"${classMap({\n \"footer-top\": this.hasDefaultSlot \|\| this.hasTitleSlot \|\| this.hasDescriptionSlot \|\| this.hasItemsSlot,\n \"has-content\": this.hasDefaultSlot \|\| this.hasItemsSlot\n })}\"\n >\n <div class=\"footer-header\">\n <slot name=\"title\"></slot>\n <slot name=\"description\"></slot>\n </div>\n <div>\n ${this.hasDefaultSlot\n ? html`<slot></slot>`\n : html`\n <div class=\"footer-items\">\n <slot name=\"items\"></slot>\n </div>\n `}\n </div>\n </section>\n <section class=\"footer-bottom\">\n <div class=\"footer-mandatory-links\">\n <ul>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\"><a href=${this.contactHref}>Contact</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\"><a href=${this.feedbackHref}>Feedback</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\"><a href=${this.faqHref}>FAQ</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\"><a href=${this.sitemapHref}>Sitemap</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\">\n <a href=\"https://tech.gov.sg/report_vulnerability\" target=\"_blank\" rel=\"noopener noreferrer\">\n Report Vulnerability\n </a>\n </sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\"><a href=${this.privacyHref}>Privacy Statement</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\"><a href=${this.termsOfUseHref}>Terms of use</a></sgds-link>\n </li>\n </ul>\n <div class=\"footer-copyrights\">© ${new Date().getFullYear()}, ${this.copyrightLiner}</div>\n </div>\n </section>\n </footer>\n `;\n }\n}\n\nexport default SgdsFooter;\n"],"names":["SgdsElement","HasSlotController","html","classMap","footerStyle","SgdsLink","__decorate","property"],"mappings":"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"}

package/react/components/Footer/sgds-footer.js CHANGED Viewed

@@ -80,29 +80,29 @@ class SgdsFooter extends SgdsElement {
           <div class="footer-mandatory-links">
             <ul>
               <li>
-                <sgds-link size="sm"><a href=${this.contactHref}>Contact</a></sgds-link>
+                <sgds-link size="sm" tone="fixed-light"><a href=${this.contactHref}>Contact</a></sgds-link>
               </li>
               <li>
-                <sgds-link size="sm"><a href=${this.feedbackHref}>Feedback</a></sgds-link>
+                <sgds-link size="sm" tone="fixed-light"><a href=${this.feedbackHref}>Feedback</a></sgds-link>
               </li>
               <li>
-                <sgds-link size="sm"><a href=${this.faqHref}>FAQ</a></sgds-link>
+                <sgds-link size="sm" tone="fixed-light"><a href=${this.faqHref}>FAQ</a></sgds-link>
               </li>
               <li>
-                <sgds-link size="sm"><a href=${this.sitemapHref}>Sitemap</a></sgds-link>
+                <sgds-link size="sm" tone="fixed-light"><a href=${this.sitemapHref}>Sitemap</a></sgds-link>
               </li>
               <li>
-                <sgds-link size="sm">
+                <sgds-link size="sm" tone="fixed-light">
                   <a href="https://tech.gov.sg/report_vulnerability" target="_blank" rel="noopener noreferrer">
                     Report Vulnerability
                   </a>
                 </sgds-link>
               </li>
               <li>
-                <sgds-link size="sm"><a href=${this.privacyHref}>Privacy Statement</a></sgds-link>
+                <sgds-link size="sm" tone="fixed-light"><a href=${this.privacyHref}>Privacy Statement</a></sgds-link>
               </li>
               <li>
-                <sgds-link size="sm"><a href=${this.termsOfUseHref}>Terms of use</a></sgds-link>
+                <sgds-link size="sm" tone="fixed-light"><a href=${this.termsOfUseHref}>Terms of use</a></sgds-link>
               </li>
             </ul>
             <div class="footer-copyrights">© ${new Date().getFullYear()}, ${this.copyrightLiner}</div>

package/react/components/Footer/sgds-footer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sgds-footer.js","sources":["../../../../src/components/Footer/sgds-footer.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsLink from \"../Link/sgds-link\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { HasSlotController } from \"../../utils/slot\";\nimport footerStyle from \"./footer.css\";\n\n/*\n @summary The footer contains supporting information for your service at the bottom of your website. All .gov.sg digital services shall contain a Global Footer Bar across all pages. The Global Footer Bar should include the name of the digital service, contact information, a privacy statement and the terms of use.\n \n @slot default - The slot for footer content. Use this slot if you want full control over the layout or styling. When provided, it replaces the `items` slot layout.\n * @slot title - The slot for title\n * @slot description - The slot for description\n * @slot items - the slot for the list of footer items, styled automatically with `.footer-items`. For custom layouts or styles, use the `default` slot instead.\n /\nexport class SgdsFooter extends SgdsElement {\n static styles = [...SgdsElement.styles, footerStyle];\n\n /* @internal /\n static dependencies = {\n \"sgds-link\": SgdsLink\n };\n\n /* Sets copyrightLiner of SgdsFooter /\n @property({ type: String })\n copyrightLiner = \"Government of Singapore\";\n\n /\thref link for contacts /\n @property({ type: String })\n contactHref = \"#\";\n\n /*\thref link for feedback /\n @property({ type: String })\n feedbackHref = \"#\";\n\n /*\thref link for faq /\n @property({ type: String })\n faqHref = \"#\";\n\n /*\thref link for sitemap /\n @property({ type: String })\n sitemapHref = \"#\";\n\n /*\thref link for privacy statement /\n @property({ type: String })\n privacyHref = \"#\";\n\n /*\thref link for terms of use /\n @property({ type: String })\n termsOfUseHref = \"#\";\n\n /** Used only for SSR to indicate the presence of the `default` slot. /\n @property({ type: Boolean }) hasDefaultSlot = false;\n\n /* Used only for SSR to indicate the presence of the `title` slot. /\n @property({ type: Boolean }) hasTitleSlot = false;\n\n /* Used only for SSR to indicate the presence of the `description` slot. /\n @property({ type: Boolean }) hasDescriptionSlot = false;\n\n /* Used only for SSR to indicate the presence of the `items` slot. */\n @property({ type: Boolean }) hasItemsSlot = false;\n\n private readonly hasSlotController = new HasSlotController(this, \"[default]\", \"title\", \"description\", \"items\");\n\n updated() {\n if (!this.hasDefaultSlot) this.hasDefaultSlot = this.hasSlotController.test(\"[default]\");\n if (!this.hasTitleSlot) this.hasTitleSlot = this.hasSlotController.test(\"title\");\n if (!this.hasDescriptionSlot) this.hasDescriptionSlot = this.hasSlotController.test(\"description\");\n if (!this.hasItemsSlot) this.hasItemsSlot = this.hasSlotController.test(\"items\");\n }\n\n render() {\n return html`\n <footer class=\"footer\">\n <section\n class=\"${classMap({\n \"footer-top\": this.hasDefaultSlot \|\| this.hasTitleSlot \|\| this.hasDescriptionSlot \|\| this.hasItemsSlot,\n \"has-content\": this.hasDefaultSlot \|\| this.hasItemsSlot\n })}\"\n >\n <div class=\"footer-header\">\n <slot name=\"title\"></slot>\n <slot name=\"description\"></slot>\n </div>\n <div>\n ${this.hasDefaultSlot\n ? html`<slot></slot>`\n : html`\n <div class=\"footer-items\">\n <slot name=\"items\"></slot>\n </div>\n `}\n </div>\n </section>\n <section class=\"footer-bottom\">\n <div class=\"footer-mandatory-links\">\n <ul>\n <li>\n <sgds-link size=\"sm\"><a href=${this.contactHref}>Contact</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\"><a href=${this.feedbackHref}>Feedback</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\"><a href=${this.faqHref}>FAQ</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\"><a href=${this.sitemapHref}>Sitemap</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\">\n <a href=\"https://tech.gov.sg/report_vulnerability\" target=\"_blank\" rel=\"noopener noreferrer\">\n Report Vulnerability\n </a>\n </sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\"><a href=${this.privacyHref}>Privacy Statement</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\"><a href=${this.termsOfUseHref}>Terms of use</a></sgds-link>\n </li>\n </ul>\n <div class=\"footer-copyrights\">© ${new Date().getFullYear()}, ${this.copyrightLiner}</div>\n </div>\n </section>\n </footer>\n `;\n }\n}\n\nexport default SgdsFooter;\n"],"names":["footerStyle"],"mappings":";;;;;;;;;;AAQA;;;;;;;AAOG;AACG,MAAO,UAAW,SAAQ,WAAW,CAAA;AAA3C,IAAA,WAAA,GAAA;;;QAUE,IAAc,CAAA,cAAA,GAAG,yBAAyB,CAAC;;QAI3C,IAAW,CAAA,WAAA,GAAG,GAAG,CAAC;;QAIlB,IAAY,CAAA,YAAA,GAAG,GAAG,CAAC;;QAInB,IAAO,CAAA,OAAA,GAAG,GAAG,CAAC;;QAId,IAAW,CAAA,WAAA,GAAG,GAAG,CAAC;;QAIlB,IAAW,CAAA,WAAA,GAAG,GAAG,CAAC;;QAIlB,IAAc,CAAA,cAAA,GAAG,GAAG,CAAC;;QAGQ,IAAc,CAAA,cAAA,GAAG,KAAK,CAAC;;QAGvB,IAAY,CAAA,YAAA,GAAG,KAAK,CAAC;;QAGrB,IAAkB,CAAA,kBAAA,GAAG,KAAK,CAAC;;QAG3B,IAAY,CAAA,YAAA,GAAG,KAAK,CAAC;AAEjC,QAAA,IAAA,CAAA,iBAAiB,GAAG,IAAI,iBAAiB,CAAC,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,aAAa,EAAE,OAAO,CAAC,CAAC;KAmEhH;IAjEC,OAAO,GAAA;QACL,IAAI,CAAC,IAAI,CAAC,cAAc;YAAE,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;QACzF,IAAI,CAAC,IAAI,CAAC,YAAY;YAAE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QACjF,IAAI,CAAC,IAAI,CAAC,kBAAkB;YAAE,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;QACnG,IAAI,CAAC,IAAI,CAAC,YAAY;YAAE,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;KAClF;IAED,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA;;;AAGI,iBAAA,EAAA,QAAQ,CAAC;AAChB,YAAA,YAAY,EAAE,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,kBAAkB,IAAI,IAAI,CAAC,YAAY;AACtG,YAAA,aAAa,EAAE,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,YAAY;SACxD,CAAC,CAAA;;;;;;;AAOE,YAAA,EAAA,IAAI,CAAC,cAAc;cACjB,IAAI,CAAA,CAAe,aAAA,CAAA;cACnB,IAAI,CAAA,CAAA;;;;AAIH,gBAAA,CAAA,CAAA;;;;;;;~~AAO8B~~,~~6CAAA~~,EAAA,IAAI,CAAC,WAAW,CAAA;;;AAGhB,~~6CAAA~~,EAAA,IAAI,CAAC,YAAY,CAAA;;;AAGjB,~~6CAAA~~,EAAA,IAAI,CAAC,OAAO,CAAA;;;AAGZ,~~6CAAA~~,EAAA,IAAI,CAAC,WAAW,CAAA;;;;;;;;;;AAUhB,~~6CAAA~~,EAAA,IAAI,CAAC,WAAW,CAAA;;;AAGhB,~~6CAAA~~,EAAA,IAAI,CAAC,cAAc,CAAA;;;+~~CAGnB~~,IAAI,IAAI,EAAE,CAAC,WAAW,EAAE,CAAK,EAAA,EAAA,IAAI,CAAC,cAAc,CAAA;;;;KAI1F,CAAC;KACH;;AAjHM,UAAM,CAAA,MAAA,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAW,CAAtC,CAAwC;AAErD;AACO,UAAA,CAAA,YAAY,GAAG;AACpB,IAAA,WAAW,EAAE,QAAQ;AACtB,CAFkB,CAEjB;AAIF,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACgB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAI3C,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACT,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAIlB,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACR,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAInB,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACb,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,SAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAId,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACT,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAIlB,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACT,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,aAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAIlB,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;AACN,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGQ,UAAA,CAAA;AAA5B,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AAAwB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGvB,UAAA,CAAA;AAA5B,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AAAsB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGrB,UAAA,CAAA;AAA5B,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AAA4B,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,oBAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAG3B,UAAA,CAAA;AAA5B,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;AAAsB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA;;;;"}
1	+ {"version":3,"file":"sgds-footer.js","sources":["../../../../src/components/Footer/sgds-footer.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsLink from \"../Link/sgds-link\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { HasSlotController } from \"../../utils/slot\";\nimport footerStyle from \"./footer.css\";\n\n/*\n @summary The footer contains supporting information for your service at the bottom of your website. All .gov.sg digital services shall contain a Global Footer Bar across all pages. The Global Footer Bar should include the name of the digital service, contact information, a privacy statement and the terms of use.\n \n @slot default - The slot for footer content. Use this slot if you want full control over the layout or styling. When provided, it replaces the `items` slot layout.\n * @slot title - The slot for title\n * @slot description - The slot for description\n * @slot items - the slot for the list of footer items, styled automatically with `.footer-items`. For custom layouts or styles, use the `default` slot instead.\n /\nexport class SgdsFooter extends SgdsElement {\n static styles = [...SgdsElement.styles, footerStyle];\n\n /* @internal /\n static dependencies = {\n \"sgds-link\": SgdsLink\n };\n\n /* Sets copyrightLiner of SgdsFooter /\n @property({ type: String })\n copyrightLiner = \"Government of Singapore\";\n\n /\thref link for contacts /\n @property({ type: String })\n contactHref = \"#\";\n\n /*\thref link for feedback /\n @property({ type: String })\n feedbackHref = \"#\";\n\n /*\thref link for faq /\n @property({ type: String })\n faqHref = \"#\";\n\n /*\thref link for sitemap /\n @property({ type: String })\n sitemapHref = \"#\";\n\n /*\thref link for privacy statement /\n @property({ type: String })\n privacyHref = \"#\";\n\n /*\thref link for terms of use /\n @property({ type: String })\n termsOfUseHref = \"#\";\n\n /** Used only for SSR to indicate the presence of the `default` slot. /\n @property({ type: Boolean }) hasDefaultSlot = false;\n\n /* Used only for SSR to indicate the presence of the `title` slot. /\n @property({ type: Boolean }) hasTitleSlot = false;\n\n /* Used only for SSR to indicate the presence of the `description` slot. /\n @property({ type: Boolean }) hasDescriptionSlot = false;\n\n /* Used only for SSR to indicate the presence of the `items` slot. */\n @property({ type: Boolean }) hasItemsSlot = false;\n\n private readonly hasSlotController = new HasSlotController(this, \"[default]\", \"title\", \"description\", \"items\");\n\n updated() {\n if (!this.hasDefaultSlot) this.hasDefaultSlot = this.hasSlotController.test(\"[default]\");\n if (!this.hasTitleSlot) this.hasTitleSlot = this.hasSlotController.test(\"title\");\n if (!this.hasDescriptionSlot) this.hasDescriptionSlot = this.hasSlotController.test(\"description\");\n if (!this.hasItemsSlot) this.hasItemsSlot = this.hasSlotController.test(\"items\");\n }\n\n render() {\n return html`\n <footer class=\"footer\">\n <section\n class=\"${classMap({\n \"footer-top\": this.hasDefaultSlot \|\| this.hasTitleSlot \|\| this.hasDescriptionSlot \|\| this.hasItemsSlot,\n \"has-content\": this.hasDefaultSlot \|\| this.hasItemsSlot\n })}\"\n >\n <div class=\"footer-header\">\n <slot name=\"title\"></slot>\n <slot name=\"description\"></slot>\n </div>\n <div>\n ${this.hasDefaultSlot\n ? html`<slot></slot>`\n : html`\n <div class=\"footer-items\">\n <slot name=\"items\"></slot>\n </div>\n `}\n </div>\n </section>\n <section class=\"footer-bottom\">\n <div class=\"footer-mandatory-links\">\n <ul>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\"><a href=${this.contactHref}>Contact</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\"><a href=${this.feedbackHref}>Feedback</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\"><a href=${this.faqHref}>FAQ</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\"><a href=${this.sitemapHref}>Sitemap</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\">\n <a href=\"https://tech.gov.sg/report_vulnerability\" target=\"_blank\" rel=\"noopener noreferrer\">\n Report Vulnerability\n </a>\n </sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\"><a href=${this.privacyHref}>Privacy Statement</a></sgds-link>\n </li>\n <li>\n <sgds-link size=\"sm\" tone=\"fixed-light\"><a href=${this.termsOfUseHref}>Terms of use</a></sgds-link>\n </li>\n </ul>\n <div class=\"footer-copyrights\">© ${new Date().getFullYear()}, ${this.copyrightLiner}</div>\n </div>\n </section>\n </footer>\n `;\n }\n}\n\nexport default SgdsFooter;\n"],"names":["footerStyle"],"mappings":"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"}

package/react/components/IconCard/sgds-icon-card.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sgds-icon-card.cjs.js","sources":["../../../../src/components/IconCard/sgds-icon-card.ts"],"sourcesContent":["import { nothing, PropertyValueMap } from \"lit\";\nimport { html, literal } from \"lit/static-html.js\";\nimport { property, queryAssignedElements, queryAssignedNodes } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport SgdsLink from \"../Link/sgds-link\";\nimport IconCardStyle from \"./icon-card.css\";\n\n/*\n @summary Icon cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.\n * @slot default - The content area of the card, placed directly under the title. Accepts any HTML or custom elements.\n * @slot icon - Accepts an icon element to visually represent the card. Only a single element is allowed to be passed in.\n * @slot upper - Accepts any content to be displayed at the top of the subtitle. Commonly used for badges, status indicators, or decorative elements.\n * @slot subtitle - The subtitle of the card\n * @slot title - The title of the card\n * @slot description - The paragrapher text of the card\n * @slot lower - Accepts any additional content to be displayed below the card description, such as badges, metadata, or supplementary information.\n * @slot footer - Footer area of the card. Accepts links, actions, or any custom content.\n * @slot link - (@deprecated) Deprecated since 3.3.2 in favour of `footer` slot.\n * Legacy slot for anchor elements. Use `footer` instead.\n /\nexport class SgdsIconCard extends CardElement {\n static styles = [...CardElement.styles, IconCardStyle];\n\n /* @internal /\n @queryAssignedNodes({ slot: \"icon\", flatten: true })\n _iconNode!: Array<Node>;\n /* @internal /\n @queryAssignedNodes({ slot: \"upper\", flatten: true })\n _upperNode!: Array<Node>;\n @queryAssignedElements({ slot: \"footer\" })\n private footerNode!: HTMLElement[];\n @queryAssignedElements({ slot: \"link\" })\n private linkNode!: HTMLAnchorElement[] \| SgdsLink[];\n\n /* Removes the card's internal padding when set to true. */\n @property({ type: Boolean, reflect: true }) noPadding = false;\n\n private get linkSlotItems(): HTMLAnchorElement \| null {\n if (!this.linkNode \|\| this.linkNode.length === 0) return null;\n const element = this.linkNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n private get footerSlotItems(): HTMLAnchorElement \| null {\n if (!this.footerNode \|\| this.footerNode.length === 0) return null;\n const element = this.footerNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n protected firstUpdated(changedProperties: PropertyValueMap<this>) {\n super.firstUpdated(changedProperties);\n\n if (this._iconNode.length === 0) {\n if ((this.orientation === \"vertical\" && this._upperNode.length === 0) \|\| this.orientation === \"horizontal\") {\n const media = this.shadowRoot.querySelector(\".card-media\") as HTMLDivElement;\n media.style.display = \"none\";\n\n const body = this.shadowRoot.querySelector(\".card-body\") as HTMLDivElement;\n if (this.noPadding) body.style.padding = \"0px\";\n }\n }\n\n if (this.stretchedLink) {\n const footerHref = this.footerSlotItems?.href;\n const linkHref = this.linkSlotItems?.href;\n\n if (footerHref) {\n this.card.setAttribute(\"href\", footerHref);\n } else if (linkHref) {\n this.card.setAttribute(\"href\", linkHref);\n }\n }\n }\n\n render() {\n const tag = this.stretchedLink ? literal`a` : literal`div`;\n const cardTabIndex = !this.stretchedLink \|\| this.disabled ? -1 : 0;\n\n return html`\n <${tag} \n class=\"${classMap({\n card: true,\n disabled: this.disabled\n })}\"\n tabindex=${cardTabIndex}\n >\n ${this.tinted && !this.noPadding ? html`<div class=\"card-tinted-bg\"></div>` : nothing}\n <div class=\"card-media\">\n <slot name=\"icon\"></slot>\n ${this.orientation === \"vertical\" ? html`<slot name=\"upper\"></slot>` : nothing}\n </div>\n <div class=\"card-body\">\n ${this.orientation === \"horizontal\" ? html`<slot name=\"upper\"></slot>` : nothing}\n <div class=\"card-header-container\">\n <div class=\"card-header\">\n <slot name=\"subtitle\"></slot>\n <h3 class=\"card-title\"><slot name=\"title\" @slotchange=${this.handleTitleSlotChange}></slot></h3>\n </div>\n <slot></slot>\n </div>\n <slot name=\"description\"></slot>\n <slot name=\"lower\"></slot>\n <slot name=\"footer\">\n <slot name=\"link\" @slotchange=${this.warnLinkSlotMisused}></slot>\n </slot>\n </div>\n </${tag}>\n `;\n }\n}\n\nexport default SgdsIconCard;\n"],"names":["CardElement","literal","html","classMap","nothing","IconCardStyle","__decorate","queryAssignedNodes","queryAssignedElements","property"],"mappings":"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"}
1	+ {"version":3,"file":"sgds-icon-card.cjs.js","sources":["../../../../src/components/IconCard/sgds-icon-card.ts"],"sourcesContent":["import { nothing, PropertyValueMap } from \"lit\";\nimport { html, literal } from \"lit/static-html.js\";\nimport { property, queryAssignedElements, queryAssignedNodes } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport type SgdsLink from \"../Link/sgds-link\";\nimport IconCardStyle from \"./icon-card.css\";\n\n/*\n @summary Icon cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.\n * @slot default - The content area of the card, placed directly under the title. Accepts any HTML or custom elements.\n * @slot icon - Accepts an icon element to visually represent the card. Only a single element is allowed to be passed in.\n * @slot upper - Accepts any content to be displayed at the top of the subtitle. Commonly used for badges, status indicators, or decorative elements.\n * @slot subtitle - The subtitle of the card\n * @slot title - The title of the card\n * @slot description - The paragrapher text of the card\n * @slot lower - Accepts any additional content to be displayed below the card description, such as badges, metadata, or supplementary information.\n * @slot footer - Footer area of the card. Accepts links, actions, or any custom content.\n * @slot link - (@deprecated) Deprecated since 3.3.2 in favour of `footer` slot.\n * Legacy slot for anchor elements. Use `footer` instead.\n /\nexport class SgdsIconCard extends CardElement {\n static styles = [...CardElement.styles, IconCardStyle];\n\n /* @internal /\n @queryAssignedNodes({ slot: \"icon\", flatten: true })\n _iconNode!: Array<Node>;\n /* @internal /\n @queryAssignedNodes({ slot: \"upper\", flatten: true })\n _upperNode!: Array<Node>;\n @queryAssignedElements({ slot: \"footer\" })\n private footerNode!: HTMLElement[];\n @queryAssignedElements({ slot: \"link\" })\n private linkNode!: HTMLAnchorElement[] \| SgdsLink[];\n\n /* Removes the card's internal padding when set to true. */\n @property({ type: Boolean, reflect: true }) noPadding = false;\n\n private get linkSlotItems(): HTMLAnchorElement \| null {\n if (!this.linkNode \|\| this.linkNode.length === 0) return null;\n const element = this.linkNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n private get footerSlotItems(): HTMLAnchorElement \| null {\n if (!this.footerNode \|\| this.footerNode.length === 0) return null;\n const element = this.footerNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n protected firstUpdated(changedProperties: PropertyValueMap<this>) {\n super.firstUpdated(changedProperties);\n\n if (this._iconNode.length === 0) {\n if ((this.orientation === \"vertical\" && this._upperNode.length === 0) \|\| this.orientation === \"horizontal\") {\n const media = this.shadowRoot.querySelector(\".card-media\") as HTMLDivElement;\n media.style.display = \"none\";\n\n const body = this.shadowRoot.querySelector(\".card-body\") as HTMLDivElement;\n if (this.noPadding) body.style.padding = \"0px\";\n }\n }\n\n if (this.stretchedLink) {\n const footerHref = this.footerSlotItems?.href;\n const linkHref = this.linkSlotItems?.href;\n\n if (footerHref) {\n this.card.setAttribute(\"href\", footerHref);\n } else if (linkHref) {\n this.card.setAttribute(\"href\", linkHref);\n }\n }\n }\n\n render() {\n const tag = this.stretchedLink ? literal`a` : literal`div`;\n const cardTabIndex = !this.stretchedLink \|\| this.disabled ? -1 : 0;\n\n return html`\n <${tag} \n class=\"${classMap({\n card: true,\n disabled: this.disabled\n })}\"\n tabindex=${cardTabIndex}\n >\n ${this.tinted && !this.noPadding ? html`<div class=\"card-tinted-bg\"></div>` : nothing}\n <div class=\"card-media\">\n <slot name=\"icon\"></slot>\n ${this.orientation === \"vertical\" ? html`<slot name=\"upper\"></slot>` : nothing}\n </div>\n <div class=\"card-body\">\n ${this.orientation === \"horizontal\" ? html`<slot name=\"upper\"></slot>` : nothing}\n <div class=\"card-header-container\">\n <div class=\"card-header\">\n <slot name=\"subtitle\"></slot>\n <h3 class=\"card-title\"><slot name=\"title\" @slotchange=${this.handleTitleSlotChange}></slot></h3>\n </div>\n <slot></slot>\n </div>\n <slot name=\"description\"></slot>\n <slot name=\"lower\"></slot>\n <slot name=\"footer\">\n <slot name=\"link\" @slotchange=${this.warnLinkSlotMisused}></slot>\n </slot>\n </div>\n </${tag}>\n `;\n }\n}\n\nexport default SgdsIconCard;\n"],"names":["CardElement","literal","html","classMap","nothing","IconCardStyle","__decorate","queryAssignedNodes","queryAssignedElements","property"],"mappings":"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"}

package/react/components/IconCard/sgds-icon-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sgds-icon-card.js","sources":["../../../../src/components/IconCard/sgds-icon-card.ts"],"sourcesContent":["import { nothing, PropertyValueMap } from \"lit\";\nimport { html, literal } from \"lit/static-html.js\";\nimport { property, queryAssignedElements, queryAssignedNodes } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport SgdsLink from \"../Link/sgds-link\";\nimport IconCardStyle from \"./icon-card.css\";\n\n/*\n @summary Icon cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.\n * @slot default - The content area of the card, placed directly under the title. Accepts any HTML or custom elements.\n * @slot icon - Accepts an icon element to visually represent the card. Only a single element is allowed to be passed in.\n * @slot upper - Accepts any content to be displayed at the top of the subtitle. Commonly used for badges, status indicators, or decorative elements.\n * @slot subtitle - The subtitle of the card\n * @slot title - The title of the card\n * @slot description - The paragrapher text of the card\n * @slot lower - Accepts any additional content to be displayed below the card description, such as badges, metadata, or supplementary information.\n * @slot footer - Footer area of the card. Accepts links, actions, or any custom content.\n * @slot link - (@deprecated) Deprecated since 3.3.2 in favour of `footer` slot.\n * Legacy slot for anchor elements. Use `footer` instead.\n /\nexport class SgdsIconCard extends CardElement {\n static styles = [...CardElement.styles, IconCardStyle];\n\n /* @internal /\n @queryAssignedNodes({ slot: \"icon\", flatten: true })\n _iconNode!: Array<Node>;\n /* @internal /\n @queryAssignedNodes({ slot: \"upper\", flatten: true })\n _upperNode!: Array<Node>;\n @queryAssignedElements({ slot: \"footer\" })\n private footerNode!: HTMLElement[];\n @queryAssignedElements({ slot: \"link\" })\n private linkNode!: HTMLAnchorElement[] \| SgdsLink[];\n\n /* Removes the card's internal padding when set to true. */\n @property({ type: Boolean, reflect: true }) noPadding = false;\n\n private get linkSlotItems(): HTMLAnchorElement \| null {\n if (!this.linkNode \|\| this.linkNode.length === 0) return null;\n const element = this.linkNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n private get footerSlotItems(): HTMLAnchorElement \| null {\n if (!this.footerNode \|\| this.footerNode.length === 0) return null;\n const element = this.footerNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n protected firstUpdated(changedProperties: PropertyValueMap<this>) {\n super.firstUpdated(changedProperties);\n\n if (this._iconNode.length === 0) {\n if ((this.orientation === \"vertical\" && this._upperNode.length === 0) \|\| this.orientation === \"horizontal\") {\n const media = this.shadowRoot.querySelector(\".card-media\") as HTMLDivElement;\n media.style.display = \"none\";\n\n const body = this.shadowRoot.querySelector(\".card-body\") as HTMLDivElement;\n if (this.noPadding) body.style.padding = \"0px\";\n }\n }\n\n if (this.stretchedLink) {\n const footerHref = this.footerSlotItems?.href;\n const linkHref = this.linkSlotItems?.href;\n\n if (footerHref) {\n this.card.setAttribute(\"href\", footerHref);\n } else if (linkHref) {\n this.card.setAttribute(\"href\", linkHref);\n }\n }\n }\n\n render() {\n const tag = this.stretchedLink ? literal`a` : literal`div`;\n const cardTabIndex = !this.stretchedLink \|\| this.disabled ? -1 : 0;\n\n return html`\n <${tag} \n class=\"${classMap({\n card: true,\n disabled: this.disabled\n })}\"\n tabindex=${cardTabIndex}\n >\n ${this.tinted && !this.noPadding ? html`<div class=\"card-tinted-bg\"></div>` : nothing}\n <div class=\"card-media\">\n <slot name=\"icon\"></slot>\n ${this.orientation === \"vertical\" ? html`<slot name=\"upper\"></slot>` : nothing}\n </div>\n <div class=\"card-body\">\n ${this.orientation === \"horizontal\" ? html`<slot name=\"upper\"></slot>` : nothing}\n <div class=\"card-header-container\">\n <div class=\"card-header\">\n <slot name=\"subtitle\"></slot>\n <h3 class=\"card-title\"><slot name=\"title\" @slotchange=${this.handleTitleSlotChange}></slot></h3>\n </div>\n <slot></slot>\n </div>\n <slot name=\"description\"></slot>\n <slot name=\"lower\"></slot>\n <slot name=\"footer\">\n <slot name=\"link\" @slotchange=${this.warnLinkSlotMisused}></slot>\n </slot>\n </div>\n </${tag}>\n `;\n }\n}\n\nexport default SgdsIconCard;\n"],"names":["IconCardStyle"],"mappings":"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"}
1	+ {"version":3,"file":"sgds-icon-card.js","sources":["../../../../src/components/IconCard/sgds-icon-card.ts"],"sourcesContent":["import { nothing, PropertyValueMap } from \"lit\";\nimport { html, literal } from \"lit/static-html.js\";\nimport { property, queryAssignedElements, queryAssignedNodes } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport type SgdsLink from \"../Link/sgds-link\";\nimport IconCardStyle from \"./icon-card.css\";\n\n/*\n @summary Icon cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.\n * @slot default - The content area of the card, placed directly under the title. Accepts any HTML or custom elements.\n * @slot icon - Accepts an icon element to visually represent the card. Only a single element is allowed to be passed in.\n * @slot upper - Accepts any content to be displayed at the top of the subtitle. Commonly used for badges, status indicators, or decorative elements.\n * @slot subtitle - The subtitle of the card\n * @slot title - The title of the card\n * @slot description - The paragrapher text of the card\n * @slot lower - Accepts any additional content to be displayed below the card description, such as badges, metadata, or supplementary information.\n * @slot footer - Footer area of the card. Accepts links, actions, or any custom content.\n * @slot link - (@deprecated) Deprecated since 3.3.2 in favour of `footer` slot.\n * Legacy slot for anchor elements. Use `footer` instead.\n /\nexport class SgdsIconCard extends CardElement {\n static styles = [...CardElement.styles, IconCardStyle];\n\n /* @internal /\n @queryAssignedNodes({ slot: \"icon\", flatten: true })\n _iconNode!: Array<Node>;\n /* @internal /\n @queryAssignedNodes({ slot: \"upper\", flatten: true })\n _upperNode!: Array<Node>;\n @queryAssignedElements({ slot: \"footer\" })\n private footerNode!: HTMLElement[];\n @queryAssignedElements({ slot: \"link\" })\n private linkNode!: HTMLAnchorElement[] \| SgdsLink[];\n\n /* Removes the card's internal padding when set to true. */\n @property({ type: Boolean, reflect: true }) noPadding = false;\n\n private get linkSlotItems(): HTMLAnchorElement \| null {\n if (!this.linkNode \|\| this.linkNode.length === 0) return null;\n const element = this.linkNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n private get footerSlotItems(): HTMLAnchorElement \| null {\n if (!this.footerNode \|\| this.footerNode.length === 0) return null;\n const element = this.footerNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n protected firstUpdated(changedProperties: PropertyValueMap<this>) {\n super.firstUpdated(changedProperties);\n\n if (this._iconNode.length === 0) {\n if ((this.orientation === \"vertical\" && this._upperNode.length === 0) \|\| this.orientation === \"horizontal\") {\n const media = this.shadowRoot.querySelector(\".card-media\") as HTMLDivElement;\n media.style.display = \"none\";\n\n const body = this.shadowRoot.querySelector(\".card-body\") as HTMLDivElement;\n if (this.noPadding) body.style.padding = \"0px\";\n }\n }\n\n if (this.stretchedLink) {\n const footerHref = this.footerSlotItems?.href;\n const linkHref = this.linkSlotItems?.href;\n\n if (footerHref) {\n this.card.setAttribute(\"href\", footerHref);\n } else if (linkHref) {\n this.card.setAttribute(\"href\", linkHref);\n }\n }\n }\n\n render() {\n const tag = this.stretchedLink ? literal`a` : literal`div`;\n const cardTabIndex = !this.stretchedLink \|\| this.disabled ? -1 : 0;\n\n return html`\n <${tag} \n class=\"${classMap({\n card: true,\n disabled: this.disabled\n })}\"\n tabindex=${cardTabIndex}\n >\n ${this.tinted && !this.noPadding ? html`<div class=\"card-tinted-bg\"></div>` : nothing}\n <div class=\"card-media\">\n <slot name=\"icon\"></slot>\n ${this.orientation === \"vertical\" ? html`<slot name=\"upper\"></slot>` : nothing}\n </div>\n <div class=\"card-body\">\n ${this.orientation === \"horizontal\" ? html`<slot name=\"upper\"></slot>` : nothing}\n <div class=\"card-header-container\">\n <div class=\"card-header\">\n <slot name=\"subtitle\"></slot>\n <h3 class=\"card-title\"><slot name=\"title\" @slotchange=${this.handleTitleSlotChange}></slot></h3>\n </div>\n <slot></slot>\n </div>\n <slot name=\"description\"></slot>\n <slot name=\"lower\"></slot>\n <slot name=\"footer\">\n <slot name=\"link\" @slotchange=${this.warnLinkSlotMisused}></slot>\n </slot>\n </div>\n </${tag}>\n `;\n }\n}\n\nexport default SgdsIconCard;\n"],"names":["IconCardStyle"],"mappings":"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"}

package/react/components/ImageCard/sgds-image-card.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sgds-image-card.cjs.js","sources":["../../../../src/components/ImageCard/sgds-image-card.ts"],"sourcesContent":["import { nothing, PropertyValueMap } from \"lit\";\nimport { html, literal } from \"lit/static-html.js\";\nimport { property, queryAssignedElements, queryAssignedNodes } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport { CardImageAdjustment, CardImagePosition } from \"../Card/types\";\nimport SgdsLink from \"../Link/sgds-link\";\nimport imageCardStyle from \"./image-card.css\";\n\n/*\n @summary Image cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.\n * @slot default - The content area of the card, placed directly under the title. Accepts any HTML or custom elements.\n * @slot image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.\n * @slot image-badge - Accepts an element for a badge, positioned at the top-left corner of the image.\n * @slot image-action - Accepts an element for an overflow or contextual menu, positioned at the top-right corner of the image. Typically used for action menu.\n * @slot upper - Accepts any content to be displayed at the top of the subtitle. Commonly used for badges, status indicators, or decorative elements.\n * @slot subtitle - The subtitle of the card\n * @slot title - The title of the card\n * @slot description - The paragrapher text of the card\n * @slot lower - Accepts any additional content to be displayed below the card description, such as badges, metadata, or supplementary information.\n * @slot footer - Footer area of the card. Accepts links, actions, or any custom content.\n * @slot link - (@deprecated) Deprecated since 3.3.2 in favour of `footer` slot.\n * Legacy slot for anchor elements. Use `footer` instead.\n /\nexport class SgdsImageCard extends CardElement {\n static styles = [...CardElement.styles, imageCardStyle];\n\n /* @internal /\n @queryAssignedNodes({ slot: \"image\", flatten: true })\n _imageNode!: Array<Node>;\n @queryAssignedElements({ slot: \"footer\" })\n private footerNode!: HTMLElement[];\n @queryAssignedElements({ slot: \"link\" })\n private linkNode!: HTMLAnchorElement[] \| SgdsLink[];\n\n /* Removes the card's internal padding when set to true. /\n @property({ type: Boolean, reflect: true }) noPadding = false;\n\n /* Sets the image position of the card. Available options: `before`, `after` /\n @property({ type: String, reflect: true }) imagePosition: CardImagePosition = \"before\";\n\n /* Controls how the image is sized and aligned within the card. Available options: `default`, `padding around`, `aspect ratio` */\n @property({ type: String, reflect: true }) imageAdjustment: CardImageAdjustment = \"default\";\n\n private get linkSlotItems(): HTMLAnchorElement \| null {\n if (!this.linkNode \|\| this.linkNode.length === 0) return null;\n const element = this.linkNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n private get footerSlotItems(): HTMLAnchorElement \| null {\n if (!this.footerNode \|\| this.footerNode.length === 0) return null;\n const element = this.footerNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n protected firstUpdated(changedProperties: PropertyValueMap<this>) {\n super.firstUpdated(changedProperties);\n\n if (this._imageNode.length === 0) {\n const image = this.shadowRoot.querySelector(\".card-image\") as HTMLDivElement;\n const body = this.shadowRoot.querySelector(\".card-body\") as HTMLDivElement;\n image.style.display = \"none\";\n if (this.noPadding) body.style.padding = \"0px\";\n }\n\n if (this.stretchedLink) {\n const footerHref = this.footerSlotItems?.href;\n const linkHref = this.linkSlotItems?.href;\n\n if (footerHref) {\n this.card.setAttribute(\"href\", footerHref);\n } else if (linkHref) {\n this.card.setAttribute(\"href\", linkHref);\n }\n }\n }\n\n handleImgSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLOrSVGImageElement>;\n\n if (childNodes.length > 1) {\n return console.error(\"Multiple elements passed into SgdsCard's image slot\");\n }\n }\n\n render() {\n const tag = this.stretchedLink ? literal`a` : literal`div`;\n const cardTabIndex = !this.stretchedLink \|\| this.disabled ? -1 : 0;\n\n return html`\n <${tag} \n class=\"card ${classMap({\n disabled: this.disabled\n })}\"\n tabindex=${cardTabIndex}\n >\n ${this.tinted && !this.noPadding ? html`<div class=\"card-tinted-bg\"></div>` : nothing}\n <div class=\"card-image\">\n\t\t\t\t\t<slot name=\"image\" @slotchange=${this.handleImgSlotChange}></slot>\n\t\t\t\t\t<slot name=\"image-badge\"></slot>\n\t\t\t\t\t<slot name=\"image-action\"></slot>\n </div>\n <div class=\"card-body\">\n\t\t\t\t\t<slot name=\"upper\"></slot>\n <div class=\"card-header-container\">\n <div class=\"card-header\">\n <slot name=\"subtitle\"></slot>\n <h3 class=\"card-title\"><slot name=\"title\" @slotchange=${this.handleTitleSlotChange}></slot></h3>\n </div>\n <slot></slot>\n </div>\n <slot name=\"description\"></slot>\n <slot name=\"lower\"></slot>\n <slot name=\"footer\">\n <slot name=\"link\" @slotchange=${this.warnLinkSlotMisused}></slot>\n </slot>\n </div>\n </${tag}>\n `;\n }\n}\n\nexport default SgdsImageCard;\n"],"names":["CardElement","literal","html","classMap","nothing","imageCardStyle","__decorate","queryAssignedNodes","queryAssignedElements","property"],"mappings":"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"}
1	+ {"version":3,"file":"sgds-image-card.cjs.js","sources":["../../../../src/components/ImageCard/sgds-image-card.ts"],"sourcesContent":["import { nothing, PropertyValueMap } from \"lit\";\nimport { html, literal } from \"lit/static-html.js\";\nimport { property, queryAssignedElements, queryAssignedNodes } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport { CardImageAdjustment, CardImagePosition } from \"../Card/types\";\nimport type SgdsLink from \"../Link/sgds-link\";\nimport imageCardStyle from \"./image-card.css\";\n\n/*\n @summary Image cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.\n * @slot default - The content area of the card, placed directly under the title. Accepts any HTML or custom elements.\n * @slot image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.\n * @slot image-badge - Accepts an element for a badge, positioned at the top-left corner of the image.\n * @slot image-action - Accepts an element for an overflow or contextual menu, positioned at the top-right corner of the image. Typically used for action menu.\n * @slot upper - Accepts any content to be displayed at the top of the subtitle. Commonly used for badges, status indicators, or decorative elements.\n * @slot subtitle - The subtitle of the card\n * @slot title - The title of the card\n * @slot description - The paragrapher text of the card\n * @slot lower - Accepts any additional content to be displayed below the card description, such as badges, metadata, or supplementary information.\n * @slot footer - Footer area of the card. Accepts links, actions, or any custom content.\n * @slot link - (@deprecated) Deprecated since 3.3.2 in favour of `footer` slot.\n * Legacy slot for anchor elements. Use `footer` instead.\n /\nexport class SgdsImageCard extends CardElement {\n static styles = [...CardElement.styles, imageCardStyle];\n\n /* @internal /\n @queryAssignedNodes({ slot: \"image\", flatten: true })\n _imageNode!: Array<Node>;\n @queryAssignedElements({ slot: \"footer\" })\n private footerNode!: HTMLElement[];\n @queryAssignedElements({ slot: \"link\" })\n private linkNode!: HTMLAnchorElement[] \| SgdsLink[];\n\n /* Removes the card's internal padding when set to true. /\n @property({ type: Boolean, reflect: true }) noPadding = false;\n\n /* Sets the image position of the card. Available options: `before`, `after` /\n @property({ type: String, reflect: true }) imagePosition: CardImagePosition = \"before\";\n\n /* Controls how the image is sized and aligned within the card. Available options: `default`, `padding around`, `aspect ratio` */\n @property({ type: String, reflect: true }) imageAdjustment: CardImageAdjustment = \"default\";\n\n private get linkSlotItems(): HTMLAnchorElement \| null {\n if (!this.linkNode \|\| this.linkNode.length === 0) return null;\n const element = this.linkNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n private get footerSlotItems(): HTMLAnchorElement \| null {\n if (!this.footerNode \|\| this.footerNode.length === 0) return null;\n const element = this.footerNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n protected firstUpdated(changedProperties: PropertyValueMap<this>) {\n super.firstUpdated(changedProperties);\n\n if (this._imageNode.length === 0) {\n const image = this.shadowRoot.querySelector(\".card-image\") as HTMLDivElement;\n const body = this.shadowRoot.querySelector(\".card-body\") as HTMLDivElement;\n image.style.display = \"none\";\n if (this.noPadding) body.style.padding = \"0px\";\n }\n\n if (this.stretchedLink) {\n const footerHref = this.footerSlotItems?.href;\n const linkHref = this.linkSlotItems?.href;\n\n if (footerHref) {\n this.card.setAttribute(\"href\", footerHref);\n } else if (linkHref) {\n this.card.setAttribute(\"href\", linkHref);\n }\n }\n }\n\n handleImgSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLOrSVGImageElement>;\n\n if (childNodes.length > 1) {\n return console.error(\"Multiple elements passed into SgdsCard's image slot\");\n }\n }\n\n render() {\n const tag = this.stretchedLink ? literal`a` : literal`div`;\n const cardTabIndex = !this.stretchedLink \|\| this.disabled ? -1 : 0;\n\n return html`\n <${tag} \n class=\"card ${classMap({\n disabled: this.disabled\n })}\"\n tabindex=${cardTabIndex}\n >\n ${this.tinted && !this.noPadding ? html`<div class=\"card-tinted-bg\"></div>` : nothing}\n <div class=\"card-image\">\n\t\t\t\t\t<slot name=\"image\" @slotchange=${this.handleImgSlotChange}></slot>\n\t\t\t\t\t<slot name=\"image-badge\"></slot>\n\t\t\t\t\t<slot name=\"image-action\"></slot>\n </div>\n <div class=\"card-body\">\n\t\t\t\t\t<slot name=\"upper\"></slot>\n <div class=\"card-header-container\">\n <div class=\"card-header\">\n <slot name=\"subtitle\"></slot>\n <h3 class=\"card-title\"><slot name=\"title\" @slotchange=${this.handleTitleSlotChange}></slot></h3>\n </div>\n <slot></slot>\n </div>\n <slot name=\"description\"></slot>\n <slot name=\"lower\"></slot>\n <slot name=\"footer\">\n <slot name=\"link\" @slotchange=${this.warnLinkSlotMisused}></slot>\n </slot>\n </div>\n </${tag}>\n `;\n }\n}\n\nexport default SgdsImageCard;\n"],"names":["CardElement","literal","html","classMap","nothing","imageCardStyle","__decorate","queryAssignedNodes","queryAssignedElements","property"],"mappings":"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"}

package/react/components/ImageCard/sgds-image-card.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"sgds-image-card.js","sources":["../../../../src/components/ImageCard/sgds-image-card.ts"],"sourcesContent":["import { nothing, PropertyValueMap } from \"lit\";\nimport { html, literal } from \"lit/static-html.js\";\nimport { property, queryAssignedElements, queryAssignedNodes } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport { CardImageAdjustment, CardImagePosition } from \"../Card/types\";\nimport SgdsLink from \"../Link/sgds-link\";\nimport imageCardStyle from \"./image-card.css\";\n\n/*\n @summary Image cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.\n * @slot default - The content area of the card, placed directly under the title. Accepts any HTML or custom elements.\n * @slot image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.\n * @slot image-badge - Accepts an element for a badge, positioned at the top-left corner of the image.\n * @slot image-action - Accepts an element for an overflow or contextual menu, positioned at the top-right corner of the image. Typically used for action menu.\n * @slot upper - Accepts any content to be displayed at the top of the subtitle. Commonly used for badges, status indicators, or decorative elements.\n * @slot subtitle - The subtitle of the card\n * @slot title - The title of the card\n * @slot description - The paragrapher text of the card\n * @slot lower - Accepts any additional content to be displayed below the card description, such as badges, metadata, or supplementary information.\n * @slot footer - Footer area of the card. Accepts links, actions, or any custom content.\n * @slot link - (@deprecated) Deprecated since 3.3.2 in favour of `footer` slot.\n * Legacy slot for anchor elements. Use `footer` instead.\n /\nexport class SgdsImageCard extends CardElement {\n static styles = [...CardElement.styles, imageCardStyle];\n\n /* @internal /\n @queryAssignedNodes({ slot: \"image\", flatten: true })\n _imageNode!: Array<Node>;\n @queryAssignedElements({ slot: \"footer\" })\n private footerNode!: HTMLElement[];\n @queryAssignedElements({ slot: \"link\" })\n private linkNode!: HTMLAnchorElement[] \| SgdsLink[];\n\n /* Removes the card's internal padding when set to true. /\n @property({ type: Boolean, reflect: true }) noPadding = false;\n\n /* Sets the image position of the card. Available options: `before`, `after` /\n @property({ type: String, reflect: true }) imagePosition: CardImagePosition = \"before\";\n\n /* Controls how the image is sized and aligned within the card. Available options: `default`, `padding around`, `aspect ratio` */\n @property({ type: String, reflect: true }) imageAdjustment: CardImageAdjustment = \"default\";\n\n private get linkSlotItems(): HTMLAnchorElement \| null {\n if (!this.linkNode \|\| this.linkNode.length === 0) return null;\n const element = this.linkNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n private get footerSlotItems(): HTMLAnchorElement \| null {\n if (!this.footerNode \|\| this.footerNode.length === 0) return null;\n const element = this.footerNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n protected firstUpdated(changedProperties: PropertyValueMap<this>) {\n super.firstUpdated(changedProperties);\n\n if (this._imageNode.length === 0) {\n const image = this.shadowRoot.querySelector(\".card-image\") as HTMLDivElement;\n const body = this.shadowRoot.querySelector(\".card-body\") as HTMLDivElement;\n image.style.display = \"none\";\n if (this.noPadding) body.style.padding = \"0px\";\n }\n\n if (this.stretchedLink) {\n const footerHref = this.footerSlotItems?.href;\n const linkHref = this.linkSlotItems?.href;\n\n if (footerHref) {\n this.card.setAttribute(\"href\", footerHref);\n } else if (linkHref) {\n this.card.setAttribute(\"href\", linkHref);\n }\n }\n }\n\n handleImgSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLOrSVGImageElement>;\n\n if (childNodes.length > 1) {\n return console.error(\"Multiple elements passed into SgdsCard's image slot\");\n }\n }\n\n render() {\n const tag = this.stretchedLink ? literal`a` : literal`div`;\n const cardTabIndex = !this.stretchedLink \|\| this.disabled ? -1 : 0;\n\n return html`\n <${tag} \n class=\"card ${classMap({\n disabled: this.disabled\n })}\"\n tabindex=${cardTabIndex}\n >\n ${this.tinted && !this.noPadding ? html`<div class=\"card-tinted-bg\"></div>` : nothing}\n <div class=\"card-image\">\n\t\t\t\t\t<slot name=\"image\" @slotchange=${this.handleImgSlotChange}></slot>\n\t\t\t\t\t<slot name=\"image-badge\"></slot>\n\t\t\t\t\t<slot name=\"image-action\"></slot>\n </div>\n <div class=\"card-body\">\n\t\t\t\t\t<slot name=\"upper\"></slot>\n <div class=\"card-header-container\">\n <div class=\"card-header\">\n <slot name=\"subtitle\"></slot>\n <h3 class=\"card-title\"><slot name=\"title\" @slotchange=${this.handleTitleSlotChange}></slot></h3>\n </div>\n <slot></slot>\n </div>\n <slot name=\"description\"></slot>\n <slot name=\"lower\"></slot>\n <slot name=\"footer\">\n <slot name=\"link\" @slotchange=${this.warnLinkSlotMisused}></slot>\n </slot>\n </div>\n </${tag}>\n `;\n }\n}\n\nexport default SgdsImageCard;\n"],"names":["imageCardStyle"],"mappings":"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"}
1	+ {"version":3,"file":"sgds-image-card.js","sources":["../../../../src/components/ImageCard/sgds-image-card.ts"],"sourcesContent":["import { nothing, PropertyValueMap } from \"lit\";\nimport { html, literal } from \"lit/static-html.js\";\nimport { property, queryAssignedElements, queryAssignedNodes } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { CardElement } from \"../../base/card-element\";\nimport { CardImageAdjustment, CardImagePosition } from \"../Card/types\";\nimport type SgdsLink from \"../Link/sgds-link\";\nimport imageCardStyle from \"./image-card.css\";\n\n/*\n @summary Image cards can be used for headers and footers, a wide variety of content, contain contextual background colors and images.\n * @slot default - The content area of the card, placed directly under the title. Accepts any HTML or custom elements.\n * @slot image - Accepts an image or svg element of the card. Only a single element is allowed to be passed in.\n * @slot image-badge - Accepts an element for a badge, positioned at the top-left corner of the image.\n * @slot image-action - Accepts an element for an overflow or contextual menu, positioned at the top-right corner of the image. Typically used for action menu.\n * @slot upper - Accepts any content to be displayed at the top of the subtitle. Commonly used for badges, status indicators, or decorative elements.\n * @slot subtitle - The subtitle of the card\n * @slot title - The title of the card\n * @slot description - The paragrapher text of the card\n * @slot lower - Accepts any additional content to be displayed below the card description, such as badges, metadata, or supplementary information.\n * @slot footer - Footer area of the card. Accepts links, actions, or any custom content.\n * @slot link - (@deprecated) Deprecated since 3.3.2 in favour of `footer` slot.\n * Legacy slot for anchor elements. Use `footer` instead.\n /\nexport class SgdsImageCard extends CardElement {\n static styles = [...CardElement.styles, imageCardStyle];\n\n /* @internal /\n @queryAssignedNodes({ slot: \"image\", flatten: true })\n _imageNode!: Array<Node>;\n @queryAssignedElements({ slot: \"footer\" })\n private footerNode!: HTMLElement[];\n @queryAssignedElements({ slot: \"link\" })\n private linkNode!: HTMLAnchorElement[] \| SgdsLink[];\n\n /* Removes the card's internal padding when set to true. /\n @property({ type: Boolean, reflect: true }) noPadding = false;\n\n /* Sets the image position of the card. Available options: `before`, `after` /\n @property({ type: String, reflect: true }) imagePosition: CardImagePosition = \"before\";\n\n /* Controls how the image is sized and aligned within the card. Available options: `default`, `padding around`, `aspect ratio` */\n @property({ type: String, reflect: true }) imageAdjustment: CardImageAdjustment = \"default\";\n\n private get linkSlotItems(): HTMLAnchorElement \| null {\n if (!this.linkNode \|\| this.linkNode.length === 0) return null;\n const element = this.linkNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n private get footerSlotItems(): HTMLAnchorElement \| null {\n if (!this.footerNode \|\| this.footerNode.length === 0) return null;\n const element = this.footerNode[0] as HTMLElement;\n return (element.querySelector(\"a\") \|\| element) as HTMLAnchorElement;\n }\n\n protected firstUpdated(changedProperties: PropertyValueMap<this>) {\n super.firstUpdated(changedProperties);\n\n if (this._imageNode.length === 0) {\n const image = this.shadowRoot.querySelector(\".card-image\") as HTMLDivElement;\n const body = this.shadowRoot.querySelector(\".card-body\") as HTMLDivElement;\n image.style.display = \"none\";\n if (this.noPadding) body.style.padding = \"0px\";\n }\n\n if (this.stretchedLink) {\n const footerHref = this.footerSlotItems?.href;\n const linkHref = this.linkSlotItems?.href;\n\n if (footerHref) {\n this.card.setAttribute(\"href\", footerHref);\n } else if (linkHref) {\n this.card.setAttribute(\"href\", linkHref);\n }\n }\n }\n\n handleImgSlotChange(e: Event) {\n const childNodes = (e.target as HTMLSlotElement).assignedNodes({ flatten: true }) as Array<HTMLOrSVGImageElement>;\n\n if (childNodes.length > 1) {\n return console.error(\"Multiple elements passed into SgdsCard's image slot\");\n }\n }\n\n render() {\n const tag = this.stretchedLink ? literal`a` : literal`div`;\n const cardTabIndex = !this.stretchedLink \|\| this.disabled ? -1 : 0;\n\n return html`\n <${tag} \n class=\"card ${classMap({\n disabled: this.disabled\n })}\"\n tabindex=${cardTabIndex}\n >\n ${this.tinted && !this.noPadding ? html`<div class=\"card-tinted-bg\"></div>` : nothing}\n <div class=\"card-image\">\n\t\t\t\t\t<slot name=\"image\" @slotchange=${this.handleImgSlotChange}></slot>\n\t\t\t\t\t<slot name=\"image-badge\"></slot>\n\t\t\t\t\t<slot name=\"image-action\"></slot>\n </div>\n <div class=\"card-body\">\n\t\t\t\t\t<slot name=\"upper\"></slot>\n <div class=\"card-header-container\">\n <div class=\"card-header\">\n <slot name=\"subtitle\"></slot>\n <h3 class=\"card-title\"><slot name=\"title\" @slotchange=${this.handleTitleSlotChange}></slot></h3>\n </div>\n <slot></slot>\n </div>\n <slot name=\"description\"></slot>\n <slot name=\"lower\"></slot>\n <slot name=\"footer\">\n <slot name=\"link\" @slotchange=${this.warnLinkSlotMisused}></slot>\n </slot>\n </div>\n </${tag}>\n `;\n }\n}\n\nexport default SgdsImageCard;\n"],"names":["imageCardStyle"],"mappings":"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"}