npm - @ukic/web-components - Versions diffs - 2.1.0-beta.16 → 2.1.0-beta.18 - Mend

@ukic/web-components 2.1.0-beta.16 → 2.1.0-beta.18

Files changed (1033) hide show

package/dist/esm/ic-dialog.entry.js CHANGED Viewed

@@ -1,25 +1,25 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-a77644e1.js';
 import { c as closeIcon } from './close-icon-2f02b42a.js';
-import { c as checkResizeObserver, i as isSlotUsed } from './helpers-8e57082b.js';
+import { c as checkResizeObserver, i as isSlotUsed } from './helpers-85903813.js';
 import './types-dd515332.js';
-const icDialogCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{position:fixed;top:0;left:0;bottom:0;right:0;display:flex;align-items:center;justify-content:center;min-height:100% !important;background:rgb(0 0 0 / 60%);z-index:var(--ic-z-index-dialog);opacity:0;transition:opacity var(--ic-easing-transition-slow)}:host(.fade-in){opacity:1;transition:opacity var(--ic-easing-transition-slow)}:host(.hidden){display:none}.dialog{background-color:var(--ic-architectural-white);border:var(--ic-border-default);border-radius:var(--ic-border-radius);padding:var(--ic-space-xs) var(--ic-space-md);transform:translateY(-3rem);transition:transform 1000s;display:flex;flex-direction:column;box-sizing:border-box}:host(.fade-in) .dialog{transform:translateY(0);transition:transform var(--ic-easing-transition-slow)}.small{width:50%;max-width:25rem;min-height:11rem;max-height:70vh}.medium{width:70vw;max-width:44rem;min-height:12.5rem;max-height:70vh}.large{width:90vw;max-width:62.5rem;min-height:12.5rem;max-height:90vh}.heading-area{display:flex;margin-bottom:var(--ic-space-xs)}.close-icon{margin-left:auto}.close-icon-svg{display:flex;align-items:center}.content-area{-ms-overflow-style:none;scrollbar-width:none;padding:0 var(--ic-space-xs);margin:0 calc(-1 * var(--ic-space-xs))}:host([data-overflow=\"false\"]) .content-area{overflow-y:visible}:host([data-overflow=\"true\"]) .content-area{overflow-y:scroll}:host([data-overflow=\"false\"]) .dialog{overflow:visible}.content-area::-webkit-scrollbar{display:none}#dialog-content{margin-bottom:var(--ic-space-sm)}.status-alert{margin-bottom:var(--ic-space-xs)}.dialog-controls{margin-top:auto;padding-top:var(--ic-space-xs);display:flex;justify-content:flex-end;gap:var(--ic-space-md)}.dialog-control-button{width:-moz-fit-content;width:fit-content}@media (min-width: 800px){:host([size=\"large\"]) .content-area{width:75%}}@media (max-width: 576px){.dialog{width:100vw;height:100vh;transform:translateY(-5rem);max-width:none;max-height:none;box-sizing:border-box}}@media (max-width: 364px){.triple-button{flex-direction:column;gap:var(--ic-space-xs)}.dialog-control-button{width:unset}}";
+const icDialogCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;min-height:100% !important;background:rgb(0 0 0 / 60%);z-index:var(--ic-z-index-dialog);opacity:0;transition:opacity var(--ic-easing-transition-slow)}:host(.fade-in){opacity:1;transition:opacity var(--ic-easing-transition-slow)}:host(.hidden){display:none}.dialog{background-color:var(--ic-architectural-white);border:var(--ic-border-default);border-radius:var(--ic-border-radius);padding:var(--ic-space-xs) var(--ic-space-md);transform:translateY(-3rem);transition:transform 1000s;display:flex;flex-direction:column;box-sizing:border-box}:host(.fade-in) .dialog{transform:translateY(0);transition:transform var(--ic-easing-transition-slow)}.small{width:50%;max-width:25rem;min-height:11rem;max-height:70vh}.medium{width:70vw;max-width:44rem;min-height:12.5rem;max-height:70vh}.large{width:90vw;max-width:62.5rem;min-height:12.5rem;max-height:90vh}.heading-area{display:flex;margin-bottom:var(--ic-space-xs)}.close-icon{margin-left:auto}.close-icon-svg{display:flex;align-items:center}.content-area{-ms-overflow-style:none;scrollbar-width:none;padding:0 var(--ic-space-xs);margin:0 calc(-1 * var(--ic-space-xs))}:host([data-overflow=\"false\"]) .content-area{overflow-y:visible}:host([data-overflow=\"true\"]) .content-area{overflow-y:scroll}:host([data-overflow=\"false\"]) .dialog{overflow:visible}.content-area::-webkit-scrollbar{display:none}#dialog-content{margin-bottom:var(--ic-space-sm)}.status-alert{margin-bottom:var(--ic-space-xs)}.dialog-controls{margin-top:auto;padding-top:var(--ic-space-xs);display:flex;justify-content:flex-end;gap:var(--ic-space-md)}.dialog-control-button{width:-moz-fit-content;width:fit-content}@media (min-width: 800px){:host([size=\"large\"]) .content-area{width:75%}}@media (max-width: 576px){.dialog{width:100vw;height:100vh;transform:translateY(-5rem);max-width:none;max-height:none;box-sizing:border-box}}@media (max-width: 364px){.triple-button{flex-direction:column;gap:var(--ic-space-xs)}.dialog-control-button{width:unset}}";
 const Dialog = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
-    this.icDialogOpened = createEvent(this, "icDialogOpened", 7);
+    this.icDialogCancelled = createEvent(this, "icDialogCancelled", 7);
     this.icDialogClosed = createEvent(this, "icDialogClosed", 7);
     this.icDialogConfirmed = createEvent(this, "icDialogConfirmed", 7);
-    this.icDialogCancelled = createEvent(this, "icDialogCancelled", 7);
-    this.focusedElementIndex = 0;
+    this.icDialogOpened = createEvent(this, "icDialogOpened", 7);
     this.DATA_OVERFLOW = "data-overflow";
     this.DATA_GETS_FOCUS = "data-gets-focus";
     this.DATA_GETS_FOCUS_SELECTOR = "[data-gets-focus]";
     this.DIALOG_CONTROLS = "dialog-controls";
+    this.dialogHeight = 0;
+    this.focusedElementIndex = 0;
     this.IC_TEXT_FIELD = "IC-TEXT-FIELD";
     this.resizeObserver = null;
-    this.dialogHeight = 0;
     this.setContentOverflow = () => {
       if (this.dialogEl.clientHeight < this.dialogEl.scrollHeight) {
         this.el.setAttribute(this.DATA_OVERFLOW, "true");
@@ -78,9 +78,9 @@ const Dialog = class {
     this.getInteractiveElements = () => {
       this.interactiveElementList = Array.from(this.el.shadowRoot.querySelectorAll("ic-button"));
       const slottedInteractiveElements = Array.from(this.el.querySelectorAll(`a[href], button, input:not(.ic-input), textarea, select, details, [tabindex]:not([tabindex="-1"]),
-        ic-button, ic-checkbox, ic-select, ic-search-bar, ic-tab-group, ic-radio-group,
-        ic-back-to-top, ic-breadcrumb, ic-chip[dismissible="true"], ic-footer-link, ic-link, ic-navigation-button,
-        ic-navigation-item, ic-switch, ic-text-field`));
+          ic-button, ic-checkbox, ic-select, ic-search-bar, ic-tab-group, ic-radio-group,
+          ic-back-to-top, ic-breadcrumb, ic-chip[dismissible="true"], ic-footer-link, ic-link, ic-navigation-button,
+          ic-navigation-item, ic-switch, ic-text-field`));
       if (slottedInteractiveElements.length > 0) {
         if (slottedInteractiveElements[0].slot !== this.DIALOG_CONTROLS) {
           slottedInteractiveElements[0].setAttribute(this.DATA_GETS_FOCUS, "");
@@ -155,16 +155,18 @@ const Dialog = class {
         }
       }
     };
-    this.size = "small";
-    this.heading = undefined;
-    this.label = undefined;
-    this.dismissLabel = "Dismiss";
-    this.status = undefined;
+    this.dialogRendered = false;
+    this.fadeIn = false;
     this.alertHeading = undefined;
     this.alertMessage = undefined;
     this.buttons = true;
-    this.destructive = false;
     this.closeOnBackdropClick = true;
+    this.destructive = false;
+    this.dismissLabel = "Dismiss";
+    this.heading = undefined;
+    this.label = undefined;
+    this.size = "small";
+    this.status = undefined;
     this.buttonProps = [
       {
         label: "Cancel",
@@ -172,10 +174,45 @@ const Dialog = class {
       },
       { label: "Confirm", onclick: "this.confirmDialog();" },
     ];
-    this.dialogRendered = false;
-    this.fadeIn = false;
   }
-  /* eslint-enable */
+  watchPropHandler() {
+    this.setButtonOnClick();
+  }
+  componentWillLoad() {
+    this.setButtonOnClick();
+  }
+  componentDidLoad() {
+    this.getInteractiveElements();
+    this.setAlertVariant();
+  }
+  handleKeyboard(ev) {
+    if (this.dialogRendered) {
+      switch (ev.key) {
+        case "Tab":
+          ev.preventDefault();
+          this.focusNextInteractiveElement(ev.shiftKey);
+          break;
+        case "Escape":
+          !ev.repeat && this.hideDialog();
+          ev.stopImmediatePropagation();
+          break;
+      }
+    }
+  }
+  handleClick(ev) {
+    const dialogElement = this.el.shadowRoot.querySelector("dialog");
+    if (this.closeOnBackdropClick &&
+      ev.composedPath().indexOf(dialogElement) <= 0) {
+      const rect = this.dialogEl.getBoundingClientRect();
+      const isInDialog = rect.top <= ev.clientY &&
+        ev.clientY <= rect.top + rect.height &&
+        rect.left <= ev.clientX &&
+        ev.clientX <= rect.left + rect.width;
+      if (!isInDialog) {
+        this.hideDialog();
+      }
+    }
+  }
   /**
    * Use to show the dialog.
    */
@@ -225,44 +262,6 @@ const Dialog = class {
   async confirmDialog() {
     this.icDialogConfirmed.emit();
   }
-  watchPropHandler() {
-    this.setButtonOnClick();
-  }
-  handleKeyboard(ev) {
-    if (this.dialogRendered) {
-      switch (ev.key) {
-        case "Tab":
-          ev.preventDefault();
-          this.focusNextInteractiveElement(ev.shiftKey);
-          break;
-        case "Escape":
-          !ev.repeat && this.hideDialog();
-          ev.stopImmediatePropagation();
-          break;
-      }
-    }
-  }
-  handleClick(ev) {
-    const dialogElement = this.el.shadowRoot.querySelector("dialog");
-    if (this.closeOnBackdropClick &&
-      ev.composedPath().indexOf(dialogElement) <= 0) {
-      const rect = this.dialogEl.getBoundingClientRect();
-      const isInDialog = rect.top <= ev.clientY &&
-        ev.clientY <= rect.top + rect.height &&
-        rect.left <= ev.clientX &&
-        ev.clientX <= rect.left + rect.width;
-      if (!isInDialog) {
-        this.hideDialog();
-      }
-    }
-  }
-  componentWillLoad() {
-    this.setButtonOnClick();
-  }
-  componentDidLoad() {
-    this.getInteractiveElements();
-    this.setAlertVariant();
-  }
   render() {
     const { alertHeading, alertMessage, buttons, buttonProps, size, heading, label, status, destructive, dismissLabel, } = this;
     return (h(Host, { class: { ["hidden"]: !this.dialogRendered, ["fade-in"]: this.fadeIn } }, h("dialog", { class: { ["dialog"]: true, [`${size}`]: true }, "aria-labelledby": "dialog-label dialog-heading", "aria-describedby": "dialog-alert dialog-content", ref: (el) => (this.dialogEl = el) }, h("div", { class: "heading-area" }, h("div", { class: "heading-content" }, h("div", { class: "label" }, h("slot", { name: "label" }, h("ic-typography", { variant: "label", id: "dialog-label" }, label))), h("div", { class: "heading" }, h("slot", { name: "heading" }, h("ic-typography", { variant: "h4", id: "dialog-heading" }, heading)))), h("ic-button", { class: "close-icon", variant: "icon", "aria-label": dismissLabel, onClick: this.closeIconClick, "data-gets-focus": destructive || !buttons ? "" : null }, h("span", { class: "close-icon-svg", slot: "icon", innerHTML: closeIcon }))), h("div", { class: "content-area" }, status && (h("ic-alert", { variant: status, heading: alertHeading, message: alertMessage, "title-above": true, class: "status-alert", id: "dialog-alert" })), h("div", { id: "dialog-content" }, h("slot", null))), (buttons || isSlotUsed(this.el, this.DIALOG_CONTROLS)) && (h("div", { class: {

package/dist/esm/ic-dialog.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-dialog.entry.js","mappings":"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","names":[],"sources":["./src/components/ic-dialog/ic-dialog.css?tag=ic-dialog&encapsulation=shadow","./src/components/ic-dialog/ic-dialog.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/*\n @prop --ic-z-index-dialog: z-index of dialog \n /\n\n:host {\n position: fixed;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 100% !important;\n background: rgb(0 0 0 / 60%);\n z-index: var(--ic-z-index-dialog);\n opacity: 0;\n transition: opacity var(--ic-easing-transition-slow);\n}\n\n:host(.fade-in) {\n opacity: 1;\n transition: opacity var(--ic-easing-transition-slow);\n}\n\n:host(.hidden) {\n display: none;\n}\n\n.dialog {\n background-color: var(--ic-architectural-white);\n border: var(--ic-border-default);\n border-radius: var(--ic-border-radius);\n padding: var(--ic-space-xs) var(--ic-space-md);\n transform: translateY(-3rem);\n transition: transform 1000s;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n}\n\n:host(.fade-in) .dialog {\n transform: translateY(0);\n transition: transform var(--ic-easing-transition-slow);\n}\n\n.small {\n width: 50%;\n max-width: 25rem;\n min-height: 11rem;\n max-height: 70vh;\n}\n\n.medium {\n width: 70vw;\n max-width: 44rem;\n min-height: 12.5rem;\n max-height: 70vh;\n}\n\n.large {\n width: 90vw;\n max-width: 62.5rem;\n min-height: 12.5rem;\n max-height: 90vh;\n}\n\n.heading-area {\n display: flex;\n margin-bottom: var(--ic-space-xs);\n}\n\n.close-icon {\n margin-left: auto;\n}\n\n.close-icon-svg {\n display: flex;\n align-items: center;\n}\n\n.content-area {\n -ms-overflow-style: none;\n scrollbar-width: none;\n padding: 0 var(--ic-space-xs);\n margin: 0 calc(-1 var(--ic-space-xs));\n}\n\n:host([data-overflow=\"false\"]) .content-area {\n overflow-y: visible;\n}\n\n:host([data-overflow=\"true\"]) .content-area {\n overflow-y: scroll;\n}\n\n:host([data-overflow=\"false\"]) .dialog {\n overflow: visible;\n}\n\n.content-area::-webkit-scrollbar {\n display: none;\n}\n\n#dialog-content {\n margin-bottom: var(--ic-space-sm);\n}\n\n.status-alert {\n margin-bottom: var(--ic-space-xs);\n}\n\n.dialog-controls {\n margin-top: auto;\n padding-top: var(--ic-space-xs);\n display: flex;\n justify-content: flex-end;\n gap: var(--ic-space-md);\n}\n\n.dialog-control-button {\n width: fit-content;\n}\n\n@media (min-width: 800px) {\n :host([size=\"large\"]) .content-area {\n width: 75%;\n }\n}\n\n@media (max-width: 576px) {\n .dialog {\n width: 100vw;\n height: 100vh;\n transform: translateY(-5rem);\n max-width: none;\n max-height: none;\n box-sizing: border-box;\n }\n}\n\n@media (max-width: 364px) {\n .triple-button {\n flex-direction: column;\n gap: var(--ic-space-xs);\n }\n\n .dialog-control-button {\n width: unset;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Prop,\n State,\n Method,\n Listen,\n Watch,\n h,\n} from \"@stencil/core\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport { isSlotUsed, checkResizeObserver } from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-dialog\",\n styleUrl: \"ic-dialog.css\",\n shadow: true,\n})\nexport class Dialog {\n /*\n @slot dialog-controls - Content will be place at the bottom of the dialog.\n * @slot heading - Content will be placed at the top of the dialog.\n * @slot label - Content will be placed above the dialog heading.\n /\n @Element() el: HTMLIcDialogElement;\n\n /\n Sets the maximum and minimum height and width for the dialog.\n /\n @Prop() size?: \"small\" \| \"medium\" \| \"large\" = \"small\";\n\n /\n Sets the heading for the dialog.\n /\n @Prop() heading!: string;\n\n /\n Sets the optional label for the dialog which appears above the heading.\n /\n @Prop() label?: string;\n\n /\n Sets the dismiss label tooltip and aria label.\n /\n @Prop() dismissLabel?: string = \"Dismiss\";\n\n /\n If set, displays an alert of the corresponding variant below the heading.\n /\n @Prop() status?: \"neutral\" \| \"info\" \| \"warning\" \| \"error\" \| \"success\";\n\n /\n If a status is set, sets the heading for the displayed alert.\n /\n @Prop() alertHeading?: string;\n /\n If a status is set, sets the message for the displayed alert.\n /\n @Prop() alertMessage?: string;\n\n /\n If set to `false`, dialog controls will not be displayed overriding buttonProps or slotted dialog controls.\n /\n @Prop() buttons?: boolean = true;\n /\n If default buttons are displayed, sets the 'primary' or rightmost button to the destructive variant. Stops initial focus being set on the 'primary' or rightmost default or slotted button.\n /\n @Prop() destructive?: boolean = false;\n\n /\n If set to `true`, the dialog will not close when the backdrop is clicked.\n /\n @Prop() closeOnBackdropClick?: boolean = true;\n\n /\n Sets the label and onclick functions for default buttons.\n /\n @Prop() buttonProps?: { label: string; onclick: string }[] = [\n {\n label: \"Cancel\",\n onclick: \"this.cancelDialog();\",\n },\n { label: \"Confirm\", onclick: \"this.confirmDialog();\" },\n ];\n\n @State() dialogRendered: boolean = false;\n\n @State() fadeIn: boolean = false;\n\n /\n Emitted when dialog has opened.\n /\n @Event() icDialogOpened: EventEmitter<void>;\n\n /\n Emitted when dialog has closed.\n /\n @Event() icDialogClosed: EventEmitter<void>;\n\n /\n Confirmation event emitted when default 'Confirm' primary button clicked or 'confirmDialog' method is called.\n /\n @Event() icDialogConfirmed: EventEmitter<void>;\n\n /\n Cancelation event emitted when default 'Cancel' button clicked or 'cancelDialog' method is called.\n /\n @Event() icDialogCancelled: EventEmitter<void>;\n\n private sourceElement: HTMLElement;\n private interactiveElementList: HTMLElement[];\n private dialogEl: HTMLDialogElement;\n private focusedElementIndex = 0;\n private DATA_OVERFLOW: string = \"data-overflow\";\n private DATA_GETS_FOCUS: string = \"data-gets-focus\";\n private DATA_GETS_FOCUS_SELECTOR: string = \"[data-gets-focus]\";\n private DIALOG_CONTROLS: string = \"dialog-controls\";\n private IC_TEXT_FIELD: string = \"IC-TEXT-FIELD\";\n private resizeObserver: ResizeObserver = null;\n private resizeTimeout: number;\n private dialogHeight: number = 0;\n\n / eslint-disable /\n\n private buttonOnclick0: Function;\n private buttonOnclick1: Function;\n private buttonOnclick2: Function;\n\n / eslint-enable /\n\n /\n Use to show the dialog.\n /\n @Method()\n async showDialog() {\n this.dialogRendered = true;\n this.dialogEl.showModal();\n setTimeout(() => {\n this.fadeIn = true;\n }, 10);\n setTimeout(() => {\n this.setInitialFocus();\n checkResizeObserver(this.runResizeObserver);\n }, 75);\n setTimeout(() => {\n this.getFocusedElementIndex();\n this.icDialogOpened.emit();\n }, 80);\n }\n\n /\n Use to hide the dialog.\n /\n @Method()\n async hideDialog() {\n this.fadeIn = false;\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n setTimeout(() => {\n this.dialogRendered = false;\n this.dialogEl.close();\n this.sourceElement?.focus();\n this.el.removeAttribute(this.DATA_OVERFLOW);\n this.dialogHeight = 0;\n this.icDialogClosed.emit();\n }, 80);\n }\n\n /\n Cancels the dialog. Used by the default 'Cancel' button or can be called manually to trigger cancelling of dialog.\n /\n @Method()\n async cancelDialog(): Promise<void> {\n this.icDialogCancelled.emit();\n this.hideDialog();\n }\n\n /\n Confirms the dialog. Used by the default 'Confirm' button or can be called manually to trigger confirming of dialog.\n */\n @Method()\n async confirmDialog(): Promise<void> {\n this.icDialogConfirmed.emit();\n }\n\n @Watch(\"buttonProps\")\n watchPropHandler(): void {\n this.setButtonOnClick();\n }\n\n @Listen(\"keydown\", { target: \"document\" })\n handleKeyboard(ev: KeyboardEvent): void {\n if (this.dialogRendered) {\n switch (ev.key) {\n case \"Tab\":\n ev.preventDefault();\n this.focusNextInteractiveElement(ev.shiftKey);\n break;\n case \"Escape\":\n !ev.repeat && this.hideDialog();\n ev.stopImmediatePropagation();\n break;\n }\n }\n }\n\n @Listen(\"click\")\n handleClick(ev: MouseEvent): void {\n const dialogElement = this.el.shadowRoot.querySelector(\"dialog\");\n if (\n this.closeOnBackdropClick &&\n ev.composedPath().indexOf(dialogElement) <= 0\n ) {\n const rect = this.dialogEl.getBoundingClientRect();\n const isInDialog =\n rect.top <= ev.clientY &&\n ev.clientY <= rect.top + rect.height &&\n rect.left <= ev.clientX &&\n ev.clientX <= rect.left + rect.width;\n if (!isInDialog) {\n this.hideDialog();\n }\n }\n }\n\n private setContentOverflow = (): void => {\n if (this.dialogEl.clientHeight < this.dialogEl.scrollHeight) {\n this.el.setAttribute(this.DATA_OVERFLOW, \"true\");\n } else {\n this.el.setAttribute(this.DATA_OVERFLOW, \"false\");\n }\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n clearTimeout(this.resizeTimeout);\n this.resizeTimeout = window.setTimeout(this.resizeObserverCallback, 80);\n });\n this.resizeObserver.observe(this.dialogEl);\n };\n\n private resizeObserverCallback = () => {\n if (this.dialogEl.clientHeight !== this.dialogHeight) {\n this.el.setAttribute(this.DATA_OVERFLOW, \"false\");\n this.setContentOverflow();\n this.dialogHeight = this.dialogEl.clientHeight;\n }\n };\n\n private setInitialFocus = () => {\n this.sourceElement = document.activeElement as HTMLElement;\n\n let focusedElement;\n\n if (this.el.querySelector(this.DATA_GETS_FOCUS_SELECTOR) !== null) {\n focusedElement = this.el.querySelector(\n this.DATA_GETS_FOCUS_SELECTOR\n ) as HTMLElement;\n } else {\n focusedElement = this.el.shadowRoot.querySelector(\n this.DATA_GETS_FOCUS_SELECTOR\n ) as HTMLElement;\n }\n if (focusedElement.tagName === this.IC_TEXT_FIELD) {\n (focusedElement as HTMLIcTextFieldElement).setFocus();\n } else {\n focusedElement.focus();\n }\n };\n\n private getFocusedElementIndex = () => {\n for (let i = 0; i < this.interactiveElementList.length; i++) {\n if (\n (this.interactiveElementList[i] as HTMLElement) ===\n (this.el.shadowRoot.activeElement \|\| document.activeElement)\n ) {\n this.focusedElementIndex = i;\n }\n }\n };\n\n private setAlertVariant = () => {\n if (this.status !== undefined && this.status !== null) {\n const alert = this.el.shadowRoot.querySelector(\"ic-alert\");\n alert.setAttribute(\"variant\", this.status);\n }\n };\n\n private closeIconClick = () => {\n this.hideDialog();\n };\n\n private getInteractiveElements = () => {\n this.interactiveElementList = Array.from(\n this.el.shadowRoot.querySelectorAll(\"ic-button\")\n );\n const slottedInteractiveElements = Array.from(\n this.el.querySelectorAll(\n `a[href], button, input:not(.ic-input), textarea, select, details, [tabindex]:not([tabindex=\"-1\"]), \n ic-button, ic-checkbox, ic-select, ic-search-bar, ic-tab-group, ic-radio-group, \n ic-back-to-top, ic-breadcrumb, ic-chip[dismissible=\"true\"], ic-footer-link, ic-link, ic-navigation-button, \n ic-navigation-item, ic-switch, ic-text-field`\n )\n );\n if (slottedInteractiveElements.length > 0) {\n if (slottedInteractiveElements[0].slot !== this.DIALOG_CONTROLS) {\n slottedInteractiveElements[0].setAttribute(this.DATA_GETS_FOCUS, \"\");\n } else if (!this.destructive) {\n slottedInteractiveElements[\n slottedInteractiveElements.length - 1\n ].setAttribute(this.DATA_GETS_FOCUS, \"\");\n }\n }\n for (let i = 0; i < slottedInteractiveElements.length; i++) {\n this.interactiveElementList.splice(\n 1 + i,\n 0,\n slottedInteractiveElements[i] as HTMLElement\n );\n }\n };\n\n private focusNextInteractiveElement = (shiftKey: boolean) => {\n this.getFocusedElementIndex();\n\n if (shiftKey) {\n this.focusedElementIndex -= 1;\n } else {\n this.focusedElementIndex += 1;\n }\n\n if (this.focusedElementIndex > this.interactiveElementList.length - 1)\n this.focusedElementIndex = 0;\n else if (this.focusedElementIndex < 0) {\n this.focusedElementIndex = this.interactiveElementList.length - 1;\n }\n\n const nextFocusEl = this.interactiveElementList[this.focusedElementIndex];\n if (nextFocusEl.tagName === this.IC_TEXT_FIELD) {\n (nextFocusEl as HTMLIcTextFieldElement).setFocus();\n } else {\n (nextFocusEl as HTMLElement).focus();\n }\n };\n\n private setButtonOnClick = () => {\n if (this.buttons) {\n this.buttonOnclick0 = new Function(this.buttonProps[0]?.onclick);\n this.buttonOnclick1 = new Function(this.buttonProps[1]?.onclick);\n this.buttonOnclick2 = new Function(this.buttonProps[2]?.onclick);\n }\n };\n\n private getButtonOnclick = (index: number) => {\n if (index === 0) {\n return this.buttonOnclick0();\n } else if (index === 1) {\n return this.buttonOnclick1();\n } else {\n return this.buttonOnclick2();\n }\n };\n\n private getButtonVariant = (index: number) => {\n const mainVariant = this.destructive ? \"destructive\" : \"primary\";\n if (this.buttonProps.length === 1) {\n return mainVariant;\n } else if (this.buttonProps.length === 2) {\n if (index === 0) {\n return \"tertiary\";\n } else {\n return mainVariant;\n }\n } else {\n if (index === 2) {\n return mainVariant;\n } else {\n return \"secondary\";\n }\n }\n };\n\n componentWillLoad(): void {\n this.setButtonOnClick();\n }\n\n componentDidLoad(): void {\n this.getInteractiveElements();\n this.setAlertVariant();\n }\n\n render() {\n const {\n alertHeading,\n alertMessage,\n buttons,\n buttonProps,\n size,\n heading,\n label,\n status,\n destructive,\n dismissLabel,\n } = this;\n\n return (\n <Host\n class={{ [\"hidden\"]: !this.dialogRendered, [\"fade-in\"]: this.fadeIn }}\n >\n <dialog\n class={{ [\"dialog\"]: true, [`${size}`]: true }}\n aria-labelledby=\"dialog-label dialog-heading\"\n aria-describedby=\"dialog-alert dialog-content\"\n ref={(el) => (this.dialogEl = el)}\n >\n <div class=\"heading-area\">\n <div class=\"heading-content\">\n <div class=\"label\">\n <slot name=\"label\">\n <ic-typography variant=\"label\" id=\"dialog-label\">\n {label}\n </ic-typography>\n </slot>\n </div>\n <div class=\"heading\">\n <slot name=\"heading\">\n <ic-typography variant=\"h4\" id=\"dialog-heading\">\n {heading}\n </ic-typography>\n </slot>\n </div>\n </div>\n <ic-button\n class=\"close-icon\"\n variant=\"icon\"\n aria-label={dismissLabel}\n onClick={this.closeIconClick}\n data-gets-focus={destructive \|\| !buttons ? \"\" : null}\n >\n <span class=\"close-icon-svg\" slot=\"icon\" innerHTML={closeIcon} />\n </ic-button>\n </div>\n <div class=\"content-area\">\n {status && (\n <ic-alert\n variant={status}\n heading={alertHeading}\n message={alertMessage}\n title-above\n class=\"status-alert\"\n id=\"dialog-alert\"\n ></ic-alert>\n )}\n <div id=\"dialog-content\">\n <slot></slot>\n </div>\n </div>\n {(buttons \|\| isSlotUsed(this.el, this.DIALOG_CONTROLS)) && (\n <div\n class={{\n [this.DIALOG_CONTROLS]: true,\n [\"triple-button\"]: buttonProps.length === 3,\n }}\n >\n <slot name={this.DIALOG_CONTROLS}>\n {!isSlotUsed(this.el, this.DIALOG_CONTROLS) &&\n buttonProps.map((props, index) => {\n if (index > 2) {\n return;\n } else {\n return (\n <ic-button\n variant={this.getButtonVariant(index)}\n onClick={() => this.getButtonOnclick(index)}\n class=\"dialog-control-button\"\n full-width={buttonProps.length === 3}\n data-gets-focus={\n this.getButtonVariant(index) === \"primary\"\n ? \"\"\n : null\n }\n >\n {props.label}\n </ic-button>\n );\n }\n })}\n </slot>\n </div>\n )}\n </dialog>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-dialog.entry.js","mappings":"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","names":[],"sources":["./src/components/ic-dialog/ic-dialog.css?tag=ic-dialog&encapsulation=shadow","./src/components/ic-dialog/ic-dialog.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/*\n @prop --ic-z-index-dialog: z-index of dialog \n /\n\n:host {\n position: fixed;\n inset: 0;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 100% !important;\n background: rgb(0 0 0 / 60%);\n z-index: var(--ic-z-index-dialog);\n opacity: 0;\n transition: opacity var(--ic-easing-transition-slow);\n}\n\n:host(.fade-in) {\n opacity: 1;\n transition: opacity var(--ic-easing-transition-slow);\n}\n\n:host(.hidden) {\n display: none;\n}\n\n.dialog {\n background-color: var(--ic-architectural-white);\n border: var(--ic-border-default);\n border-radius: var(--ic-border-radius);\n padding: var(--ic-space-xs) var(--ic-space-md);\n transform: translateY(-3rem);\n transition: transform 1000s;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n}\n\n:host(.fade-in) .dialog {\n transform: translateY(0);\n transition: transform var(--ic-easing-transition-slow);\n}\n\n.small {\n width: 50%;\n max-width: 25rem;\n min-height: 11rem;\n max-height: 70vh;\n}\n\n.medium {\n width: 70vw;\n max-width: 44rem;\n min-height: 12.5rem;\n max-height: 70vh;\n}\n\n.large {\n width: 90vw;\n max-width: 62.5rem;\n min-height: 12.5rem;\n max-height: 90vh;\n}\n\n.heading-area {\n display: flex;\n margin-bottom: var(--ic-space-xs);\n}\n\n.close-icon {\n margin-left: auto;\n}\n\n.close-icon-svg {\n display: flex;\n align-items: center;\n}\n\n.content-area {\n -ms-overflow-style: none;\n scrollbar-width: none;\n padding: 0 var(--ic-space-xs);\n margin: 0 calc(-1 var(--ic-space-xs));\n}\n\n:host([data-overflow=\"false\"]) .content-area {\n overflow-y: visible;\n}\n\n:host([data-overflow=\"true\"]) .content-area {\n overflow-y: scroll;\n}\n\n:host([data-overflow=\"false\"]) .dialog {\n overflow: visible;\n}\n\n.content-area::-webkit-scrollbar {\n display: none;\n}\n\n#dialog-content {\n margin-bottom: var(--ic-space-sm);\n}\n\n.status-alert {\n margin-bottom: var(--ic-space-xs);\n}\n\n.dialog-controls {\n margin-top: auto;\n padding-top: var(--ic-space-xs);\n display: flex;\n justify-content: flex-end;\n gap: var(--ic-space-md);\n}\n\n.dialog-control-button {\n width: fit-content;\n}\n\n@media (min-width: 800px) {\n :host([size=\"large\"]) .content-area {\n width: 75%;\n }\n}\n\n@media (max-width: 576px) {\n .dialog {\n width: 100vw;\n height: 100vh;\n transform: translateY(-5rem);\n max-width: none;\n max-height: none;\n box-sizing: border-box;\n }\n}\n\n@media (max-width: 364px) {\n .triple-button {\n flex-direction: column;\n gap: var(--ic-space-xs);\n }\n\n .dialog-control-button {\n width: unset;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Prop,\n State,\n Method,\n Listen,\n Watch,\n h,\n} from \"@stencil/core\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport { isSlotUsed, checkResizeObserver } from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-dialog\",\n styleUrl: \"ic-dialog.css\",\n shadow: true,\n})\nexport class Dialog {\n private DATA_OVERFLOW: string = \"data-overflow\";\n private DATA_GETS_FOCUS: string = \"data-gets-focus\";\n private DATA_GETS_FOCUS_SELECTOR: string = \"[data-gets-focus]\";\n private DIALOG_CONTROLS: string = \"dialog-controls\";\n private dialogEl: HTMLDialogElement;\n private dialogHeight: number = 0;\n private focusedElementIndex = 0;\n private IC_TEXT_FIELD: string = \"IC-TEXT-FIELD\";\n private interactiveElementList: HTMLElement[];\n private resizeObserver: ResizeObserver = null;\n private resizeTimeout: number;\n private sourceElement: HTMLElement;\n\n /* eslint-disable /\n\n private buttonOnclick0: Function;\n private buttonOnclick1: Function;\n private buttonOnclick2: Function;\n\n / eslint-enable /\n\n @Element() el: HTMLIcDialogElement;\n\n @State() dialogRendered: boolean = false;\n @State() fadeIn: boolean = false;\n\n /\n @slot dialog-controls - Content will be place at the bottom of the dialog.\n * @slot heading - Content will be placed at the top of the dialog.\n * @slot label - Content will be placed above the dialog heading.\n /\n\n /\n If a status is set, sets the heading for the displayed alert.\n /\n @Prop() alertHeading?: string;\n\n /\n If a status is set, sets the message for the displayed alert.\n /\n @Prop() alertMessage?: string;\n\n /\n If set to `false`, dialog controls will not be displayed overriding buttonProps or slotted dialog controls.\n /\n @Prop() buttons?: boolean = true;\n\n /\n If set to `true`, the dialog will not close when the backdrop is clicked.\n /\n @Prop() closeOnBackdropClick?: boolean = true;\n\n /\n If default buttons are displayed, sets the 'primary' or rightmost button to the destructive variant. Stops initial focus being set on the 'primary' or rightmost default or slotted button.\n /\n @Prop() destructive?: boolean = false;\n\n /\n Sets the dismiss label tooltip and aria label.\n /\n @Prop() dismissLabel?: string = \"Dismiss\";\n\n /\n Sets the heading for the dialog.\n /\n @Prop() heading!: string;\n\n /\n Sets the optional label for the dialog which appears above the heading.\n /\n @Prop() label?: string;\n\n /\n Sets the maximum and minimum height and width for the dialog.\n /\n @Prop() size?: \"small\" \| \"medium\" \| \"large\" = \"small\";\n\n /\n If set, displays an alert of the corresponding variant below the heading.\n /\n @Prop() status?: \"neutral\" \| \"info\" \| \"warning\" \| \"error\" \| \"success\";\n\n /\n Sets the label and onclick functions for default buttons.\n /\n @Prop() buttonProps?: { label: string; onclick: string }[] = [\n {\n label: \"Cancel\",\n onclick: \"this.cancelDialog();\",\n },\n { label: \"Confirm\", onclick: \"this.confirmDialog();\" },\n ];\n\n @Watch(\"buttonProps\")\n watchPropHandler(): void {\n this.setButtonOnClick();\n }\n\n /\n Cancelation event emitted when default 'Cancel' button clicked or 'cancelDialog' method is called.\n /\n @Event() icDialogCancelled: EventEmitter<void>;\n\n /\n Emitted when dialog has closed.\n /\n @Event() icDialogClosed: EventEmitter<void>;\n\n /\n Confirmation event emitted when default 'Confirm' primary button clicked or 'confirmDialog' method is called.\n /\n @Event() icDialogConfirmed: EventEmitter<void>;\n\n /\n Emitted when dialog has opened.\n /\n @Event() icDialogOpened: EventEmitter<void>;\n\n componentWillLoad(): void {\n this.setButtonOnClick();\n }\n\n componentDidLoad(): void {\n this.getInteractiveElements();\n this.setAlertVariant();\n }\n\n @Listen(\"keydown\", { target: \"document\" })\n handleKeyboard(ev: KeyboardEvent): void {\n if (this.dialogRendered) {\n switch (ev.key) {\n case \"Tab\":\n ev.preventDefault();\n this.focusNextInteractiveElement(ev.shiftKey);\n break;\n case \"Escape\":\n !ev.repeat && this.hideDialog();\n ev.stopImmediatePropagation();\n break;\n }\n }\n }\n\n @Listen(\"click\", {})\n handleClick(ev: MouseEvent): void {\n const dialogElement = this.el.shadowRoot.querySelector(\"dialog\");\n if (\n this.closeOnBackdropClick &&\n ev.composedPath().indexOf(dialogElement) <= 0\n ) {\n const rect = this.dialogEl.getBoundingClientRect();\n const isInDialog =\n rect.top <= ev.clientY &&\n ev.clientY <= rect.top + rect.height &&\n rect.left <= ev.clientX &&\n ev.clientX <= rect.left + rect.width;\n if (!isInDialog) {\n this.hideDialog();\n }\n }\n }\n\n /\n Use to show the dialog.\n /\n @Method()\n async showDialog(): Promise<void> {\n this.dialogRendered = true;\n this.dialogEl.showModal();\n setTimeout(() => {\n this.fadeIn = true;\n }, 10);\n setTimeout(() => {\n this.setInitialFocus();\n checkResizeObserver(this.runResizeObserver);\n }, 75);\n setTimeout(() => {\n this.getFocusedElementIndex();\n this.icDialogOpened.emit();\n }, 80);\n }\n\n /\n Use to hide the dialog.\n /\n @Method()\n async hideDialog(): Promise<void> {\n this.fadeIn = false;\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n setTimeout(() => {\n this.dialogRendered = false;\n this.dialogEl.close();\n this.sourceElement?.focus();\n this.el.removeAttribute(this.DATA_OVERFLOW);\n this.dialogHeight = 0;\n this.icDialogClosed.emit();\n }, 80);\n }\n\n /\n Cancels the dialog. Used by the default 'Cancel' button or can be called manually to trigger cancelling of dialog.\n /\n @Method()\n async cancelDialog(): Promise<void> {\n this.icDialogCancelled.emit();\n this.hideDialog();\n }\n\n /\n Confirms the dialog. Used by the default 'Confirm' button or can be called manually to trigger confirming of dialog.\n */\n @Method()\n async confirmDialog(): Promise<void> {\n this.icDialogConfirmed.emit();\n }\n\n private setContentOverflow = (): void => {\n if (this.dialogEl.clientHeight < this.dialogEl.scrollHeight) {\n this.el.setAttribute(this.DATA_OVERFLOW, \"true\");\n } else {\n this.el.setAttribute(this.DATA_OVERFLOW, \"false\");\n }\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n clearTimeout(this.resizeTimeout);\n this.resizeTimeout = window.setTimeout(this.resizeObserverCallback, 80);\n });\n this.resizeObserver.observe(this.dialogEl);\n };\n\n private resizeObserverCallback = () => {\n if (this.dialogEl.clientHeight !== this.dialogHeight) {\n this.el.setAttribute(this.DATA_OVERFLOW, \"false\");\n this.setContentOverflow();\n this.dialogHeight = this.dialogEl.clientHeight;\n }\n };\n\n private setInitialFocus = () => {\n this.sourceElement = document.activeElement as HTMLElement;\n\n let focusedElement;\n\n if (this.el.querySelector(this.DATA_GETS_FOCUS_SELECTOR) !== null) {\n focusedElement = this.el.querySelector(\n this.DATA_GETS_FOCUS_SELECTOR\n ) as HTMLElement;\n } else {\n focusedElement = this.el.shadowRoot.querySelector(\n this.DATA_GETS_FOCUS_SELECTOR\n ) as HTMLElement;\n }\n if (focusedElement.tagName === this.IC_TEXT_FIELD) {\n (focusedElement as HTMLIcTextFieldElement).setFocus();\n } else {\n focusedElement.focus();\n }\n };\n\n private getFocusedElementIndex = () => {\n for (let i = 0; i < this.interactiveElementList.length; i++) {\n if (\n (this.interactiveElementList[i] as HTMLElement) ===\n (this.el.shadowRoot.activeElement \|\| document.activeElement)\n ) {\n this.focusedElementIndex = i;\n }\n }\n };\n\n private setAlertVariant = () => {\n if (this.status !== undefined && this.status !== null) {\n const alert = this.el.shadowRoot.querySelector(\"ic-alert\");\n alert.setAttribute(\"variant\", this.status);\n }\n };\n\n private closeIconClick = () => {\n this.hideDialog();\n };\n\n private getInteractiveElements = () => {\n this.interactiveElementList = Array.from(\n this.el.shadowRoot.querySelectorAll(\"ic-button\")\n );\n const slottedInteractiveElements = Array.from(\n this.el.querySelectorAll(\n `a[href], button, input:not(.ic-input), textarea, select, details, [tabindex]:not([tabindex=\"-1\"]), \n ic-button, ic-checkbox, ic-select, ic-search-bar, ic-tab-group, ic-radio-group, \n ic-back-to-top, ic-breadcrumb, ic-chip[dismissible=\"true\"], ic-footer-link, ic-link, ic-navigation-button, \n ic-navigation-item, ic-switch, ic-text-field`\n )\n );\n if (slottedInteractiveElements.length > 0) {\n if (slottedInteractiveElements[0].slot !== this.DIALOG_CONTROLS) {\n slottedInteractiveElements[0].setAttribute(this.DATA_GETS_FOCUS, \"\");\n } else if (!this.destructive) {\n slottedInteractiveElements[\n slottedInteractiveElements.length - 1\n ].setAttribute(this.DATA_GETS_FOCUS, \"\");\n }\n }\n for (let i = 0; i < slottedInteractiveElements.length; i++) {\n this.interactiveElementList.splice(\n 1 + i,\n 0,\n slottedInteractiveElements[i] as HTMLElement\n );\n }\n };\n\n private focusNextInteractiveElement = (shiftKey: boolean) => {\n this.getFocusedElementIndex();\n\n if (shiftKey) {\n this.focusedElementIndex -= 1;\n } else {\n this.focusedElementIndex += 1;\n }\n\n if (this.focusedElementIndex > this.interactiveElementList.length - 1)\n this.focusedElementIndex = 0;\n else if (this.focusedElementIndex < 0) {\n this.focusedElementIndex = this.interactiveElementList.length - 1;\n }\n\n const nextFocusEl = this.interactiveElementList[this.focusedElementIndex];\n if (nextFocusEl.tagName === this.IC_TEXT_FIELD) {\n (nextFocusEl as HTMLIcTextFieldElement).setFocus();\n } else {\n (nextFocusEl as HTMLElement).focus();\n }\n };\n\n private setButtonOnClick = () => {\n if (this.buttons) {\n this.buttonOnclick0 = new Function(this.buttonProps[0]?.onclick);\n this.buttonOnclick1 = new Function(this.buttonProps[1]?.onclick);\n this.buttonOnclick2 = new Function(this.buttonProps[2]?.onclick);\n }\n };\n\n private getButtonOnclick = (index: number) => {\n if (index === 0) {\n return this.buttonOnclick0();\n } else if (index === 1) {\n return this.buttonOnclick1();\n } else {\n return this.buttonOnclick2();\n }\n };\n\n private getButtonVariant = (index: number) => {\n const mainVariant = this.destructive ? \"destructive\" : \"primary\";\n if (this.buttonProps.length === 1) {\n return mainVariant;\n } else if (this.buttonProps.length === 2) {\n if (index === 0) {\n return \"tertiary\";\n } else {\n return mainVariant;\n }\n } else {\n if (index === 2) {\n return mainVariant;\n } else {\n return \"secondary\";\n }\n }\n };\n\n render() {\n const {\n alertHeading,\n alertMessage,\n buttons,\n buttonProps,\n size,\n heading,\n label,\n status,\n destructive,\n dismissLabel,\n } = this;\n\n return (\n <Host\n class={{ [\"hidden\"]: !this.dialogRendered, [\"fade-in\"]: this.fadeIn }}\n >\n <dialog\n class={{ [\"dialog\"]: true, [`${size}`]: true }}\n aria-labelledby=\"dialog-label dialog-heading\"\n aria-describedby=\"dialog-alert dialog-content\"\n ref={(el) => (this.dialogEl = el)}\n >\n <div class=\"heading-area\">\n <div class=\"heading-content\">\n <div class=\"label\">\n <slot name=\"label\">\n <ic-typography variant=\"label\" id=\"dialog-label\">\n {label}\n </ic-typography>\n </slot>\n </div>\n <div class=\"heading\">\n <slot name=\"heading\">\n <ic-typography variant=\"h4\" id=\"dialog-heading\">\n {heading}\n </ic-typography>\n </slot>\n </div>\n </div>\n <ic-button\n class=\"close-icon\"\n variant=\"icon\"\n aria-label={dismissLabel}\n onClick={this.closeIconClick}\n data-gets-focus={destructive \|\| !buttons ? \"\" : null}\n >\n <span class=\"close-icon-svg\" slot=\"icon\" innerHTML={closeIcon} />\n </ic-button>\n </div>\n <div class=\"content-area\">\n {status && (\n <ic-alert\n variant={status}\n heading={alertHeading}\n message={alertMessage}\n title-above\n class=\"status-alert\"\n id=\"dialog-alert\"\n ></ic-alert>\n )}\n <div id=\"dialog-content\">\n <slot></slot>\n </div>\n </div>\n {(buttons \|\| isSlotUsed(this.el, this.DIALOG_CONTROLS)) && (\n <div\n class={{\n [this.DIALOG_CONTROLS]: true,\n [\"triple-button\"]: buttonProps.length === 3,\n }}\n >\n <slot name={this.DIALOG_CONTROLS}>\n {!isSlotUsed(this.el, this.DIALOG_CONTROLS) &&\n buttonProps.map((props, index) => {\n if (index > 2) {\n return;\n } else {\n return (\n <ic-button\n variant={this.getButtonVariant(index)}\n onClick={() => this.getButtonOnclick(index)}\n class=\"dialog-control-button\"\n full-width={buttonProps.length === 3}\n data-gets-focus={\n this.getButtonVariant(index) === \"primary\"\n ? \"\"\n : null\n }\n >\n {props.label}\n </ic-button>\n );\n }\n })}\n </slot>\n </div>\n )}\n </dialog>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/esm/ic-divider.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host } from './index-a77644e1.js';
-import { l as getThemeForegroundColor } from './helpers-8e57082b.js';
+import { l as getThemeForegroundColor } from './helpers-85903813.js';
 import { I as IcThemeForegroundEnum } from './types-dd515332.js';
 const icDividerCss = "hr.sc-ic-divider{padding:0;margin:0;border:none;height:var(--ic-space-1px);background-color:var(--ic-keyline-darken-rgb)}hr.light.sc-ic-divider{background-color:var(--ic-keyline-lighten-rgb)}";

package/dist/esm/ic-footer-link-group.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-a77644e1.js';
-import { l as getThemeForegroundColor, D as DEVICE_SIZES, a as onComponentRequiredPropUndefined } from './helpers-8e57082b.js';
+import { D as DEVICE_SIZES, l as getThemeForegroundColor, a as onComponentRequiredPropUndefined } from './helpers-85903813.js';
 import './types-dd515332.js';
 const icFooterLinkGroupCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host(.footer-link-group-sparse){--footer-link-group-margin-right:5.938rem;--footer-link-group-border-bottom:0 solid transparent;--footer-link-group-title-margin-top:0;--footer-link-group-title-margin-bottom:var(--ic-space-md)}:host(.footer-link-group-small){--footer-link-group-margin-right:0;--footer-link-group-title-margin-top:var(--ic-space-md);--footer-link-group-title-margin-bottom:var(--ic-space-md);--footer-link-group-links-padding-left:var(--ic-space-md);--footer-link-group-links-padding-bottom:var(--ic-space-md)}:host(.footer-link-group-light.footer-link-group-small){--footer-link-group-border-bottom:var(--ic-keyline-lighten)}:host(.footer-link-group-dark.footer-link-group-small){--footer-link-group-border-bottom:var(--ic-keyline-darken)}:host(.footer-link-group){margin-right:var(--footer-link-group-margin-right);border-bottom:var(--footer-link-group-border-bottom)}:host(.footer-link-group-small.footer-link-group-light:hover){background-color:var(--ic-action-light-bg-hover);cursor:pointer}:host(.footer-link-group-small.footer-link-group-dark:hover){background-color:var(--ic-action-dark-bg-hover);cursor:pointer}:host(.footer-link-group-sparse:focus){box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);outline:var(--ic-hc-focus-outline);z-index:1}:host(.footer-link-group-small:focus){box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset);outline:var(--ic-hc-focus-outline);z-index:1}:host(.footer-link-group-small.footer-link-group-light:active){background-color:var(--ic-action-light-bg-active)}:host(.footer-link-group-small.footer-link-group-dark:active){background-color:var(--ic-action-dark-bg-active)}.footer-link-group-title{margin-top:var(--footer-link-group-title-margin-top);margin-bottom:var(--footer-link-group-title-margin-bottom);flex-grow:1}.footer-link-group-toggle{fill:white !important}.footer-link-group-links{display:flex;flex-direction:column}.footer-link-group-header{display:flex;align-items:center}";
@@ -15,11 +15,24 @@ const FooterLinkGroup = class {
     this.toggleExpanded = () => {
       this.expanded = !this.expanded;
     };
-    this.groupTitle = undefined;
-    this.small = false;
     this.expanded = false;
-    this.dropdownIconStyle = getThemeForegroundColor();
     this.deviceSize = DEVICE_SIZES.XL;
+    this.dropdownIconStyle = getThemeForegroundColor();
+    this.small = false;
+    this.groupTitle = undefined;
+  }
+  componentWillLoad() {
+    this.small = this.isSmall(this.el);
+  }
+  componentDidLoad() {
+    onComponentRequiredPropUndefined([{ prop: this.groupTitle, propName: "group-title" }], "Footer Link Group");
+  }
+  footerResizeHandler() {
+    this.small = this.isSmall(this.el);
+  }
+  footerThemeChangeHandler(ev) {
+    const theme = ev.detail;
+    this.dropdownIconStyle = theme.mode;
   }
   isSmall(e) {
     if (e.parentElement !== null) {
@@ -34,19 +47,6 @@ const FooterLinkGroup = class {
       return false;
     }
   }
-  footerResizeHandler() {
-    this.small = this.isSmall(this.el);
-  }
-  footerThemeChangeHandler(ev) {
-    const theme = ev.detail;
-    this.dropdownIconStyle = theme.mode;
-  }
-  componentWillLoad() {
-    this.small = this.isSmall(this.el);
-  }
-  componentDidLoad() {
-    onComponentRequiredPropUndefined([{ prop: this.groupTitle, propName: "group-title" }], "Footer Link Group");
-  }
   render() {
     const { small, groupTitle } = this;
     return !small ? (h(Host, { class: {

package/dist/esm/ic-footer-link-group.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-footer-link-group.entry.js","mappings":";;;;AAAA,MAAM,oBAAoB,GAAG,41IAA41I;;MCuB52I,eAAe;;;~~IA4BlB~~,kBAAa,GAAG,CAAC,KAAoB;MAC3C,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,EAAE;QAC9C,IAAI,CAAC,cAAc,EAAE,CAAC;OACvB;KACF,CAAC;IAEM,mBAAc,GAAG;MACvB,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;KAChC,CAAC~~;;iBA5BwB,KAAK~~;~~oBAEF~~,KAAK;~~6BAEL~~,~~uBAAuB,EAAE;sBAExB,~~YAAY,CAAC,EAAE~~;;EAErC~~,~~OAAO~~,~~CAAC,CAAc~~;~~IAC5B~~,~~IAAI,CAAC,CAAC,aAAa,~~KAAK,~~IAAI,EAAE~~;~~MAC5B~~,IAAI,CAAC,~~CAAC~~,~~aAAa~~,~~CAAC~~,~~SAAS,~~CAAC,~~QAAQ~~,CAAC,~~QAAQ~~,CAAC,EAAE~~;QAChD~~,~~OAAO,~~CAAC,CAAC,~~aAAa~~,~~CAAC~~,~~SAAS~~,CAAC,~~QAAQ~~,~~CAAC~~,~~cAAc~~,~~CAAC,CAAC;OAC3D;WAAM;QACL,OAAO,~~IAAI,CAAC,~~OAAO~~,~~CAAC~~,~~CAAC~~,~~CAAC~~,aAAa,~~CAAC~~,CAAC~~;OACtC;KACF;SAAM;MACL~~,~~OAAO~~,~~KAAK~~,CAAC;~~KACd~~;~~GACF;EAaD~~,mBAAmB;IACjB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;GACpC;EAGD,wBAAwB,CAAC,EAAe;IACtC,MAAM,KAAK,GAAY,EAAE,CAAC,MAAM,CAAC;IACjC,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC,IAAI,CAAC;GACrC;~~EAED~~,~~iBAAiB~~;~~IACf~~,IAAI,CAAC,KAAK,~~GAAG~~,IAAI,CAAC,~~OAAO~~,CAAC,~~IAAI~~,CAAC,~~EAAE~~,CAAC,CAAC~~;GACpC;EAED~~,~~gBAAgB~~;~~IACd~~,~~gCAAgC~~,~~CAC9B~~,CAAC,~~EAAE~~,~~IAAI~~,~~EAAE~~,IAAI,CAAC,~~UAAU~~,~~EAAE~~,~~QAAQ~~,~~EAAE~~,aAAa,~~EAAE~~,CAAC,~~EACpD~~,~~mBAAmB~~,~~CACpB,~~CAAC;~~GACH~~;~~EAED~~,MAAM;IACJ,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;IAEnC,OAAO,CAAC,KAAK,IACX,EAAC,IAAI,IACH,KAAK,EAAE;QACL,CAAC,4CAA4C,GAAG,IAAI;QACpD,CAAC,qBAAqB,IAAI,CAAC,iBAAiB,EAAE,GAAG,IAAI;OACtD,IAED,WAAK,KAAK,EAAC,yBAAyB,IAClC,qBAAe,OAAO,EAAC,gBAAgB,IAAE,UAAU,CAAiB,CAChE,EACN,WAAK,KAAK,EAAC,yBAAyB,IAClC,eAAQ,CACJ,CACD,KAEP,EAAC,IAAI,IACH,KAAK,EAAE;QACL,CAAC,2CAA2C,GAAG,IAAI;QACnD,CAAC,qBAAqB,IAAI,CAAC,iBAAiB,EAAE,GAAG,IAAI;OACtD,EACD,QAAQ,EAAC,GAAG,EACZ,OAAO,EAAE,IAAI,CAAC,cAAc,EAC5B,SAAS,EAAE,IAAI,CAAC,aAAa,mBACf,MAAM,mBACL,IAAI,CAAC,QAAQ,IAE5B,4BAAsB,UAAU,EAAE,IAAI,IACpC,WAAK,KAAK,EAAC,0BAA0B,IACnC,WAAK,KAAK,EAAC,yBAAyB,IAClC,qBAAe,OAAO,EAAC,OAAO,IAAE,UAAU,CAAiB,CACvD,EACL,IAAI,CAAC,QAAQ,IACZ,WACE,KAAK,EAAC,0BAA0B,EAChC,KAAK,EAAC,4BAA4B,iBACtB,MAAM,EAClB,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,KAAK,EACX,MAAM,EAAC,KAAK,EACZ,mBAAmB,EAAC,eAAe,EACnC,OAAO,EAAC,eAAe,IAEvB,YACE,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,0IAA0I,GAC5I,CACE,KAEN,WACE,KAAK,EAAC,0BAA0B,EAChC,KAAK,EAAC,4BAA4B,iBACtB,MAAM,EAClB,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,KAAK,EACX,MAAM,EAAC,KAAK,EACZ,mBAAmB,EAAC,eAAe,EACnC,OAAO,EAAC,eAAe,IAEvB,SAAG,SAAS,EAAC,+BAA+B,IAC1C,YACE,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,0IAA0I,GAC5I,CACA,CACA,CACP,CACG,EACL,IAAI,CAAC,QAAQ,KACZ,WAAK,KAAK,EAAC,yBAAyB,IAClC,eAAQ,CACJ,CACP,CACoB,CAClB,CACR,CAAC;GACH;;;;;;;;","names":[],"sources":["./src/components/ic-footer-link-group/ic-footer-link-group.css?tag=ic-footer-link-group&encapsulation=shadow","./src/components/ic-footer-link-group/ic-footer-link-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.footer-link-group-sparse) {\n --footer-link-group-margin-right: 5.938rem;\n --footer-link-group-border-bottom: 0 solid transparent;\n --footer-link-group-title-margin-top: 0;\n --footer-link-group-title-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-group-small) {\n --footer-link-group-margin-right: 0;\n --footer-link-group-title-margin-top: var(--ic-space-md);\n --footer-link-group-title-margin-bottom: var(--ic-space-md);\n --footer-link-group-links-padding-left: var(--ic-space-md);\n --footer-link-group-links-padding-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-group-light.footer-link-group-small) {\n --footer-link-group-border-bottom: var(--ic-keyline-lighten);\n}\n\n:host(.footer-link-group-dark.footer-link-group-small) {\n --footer-link-group-border-bottom: var(--ic-keyline-darken);\n}\n\n:host(.footer-link-group) {\n margin-right: var(--footer-link-group-margin-right);\n border-bottom: var(--footer-link-group-border-bottom);\n}\n\n:host(.footer-link-group-small.footer-link-group-light:hover) {\n background-color: var(--ic-action-light-bg-hover);\n cursor: pointer;\n}\n\n:host(.footer-link-group-small.footer-link-group-dark:hover) {\n background-color: var(--ic-action-dark-bg-hover);\n cursor: pointer;\n}\n\n:host(.footer-link-group-sparse:focus) {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n outline: var(--ic-hc-focus-outline);\n z-index: 1;\n}\n\n:host(.footer-link-group-small:focus) {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n outline: var(--ic-hc-focus-outline);\n z-index: 1;\n}\n\n:host(.footer-link-group-small.footer-link-group-light:active) {\n background-color: var(--ic-action-light-bg-active);\n}\n\n:host(.footer-link-group-small.footer-link-group-dark:active) {\n background-color: var(--ic-action-dark-bg-active);\n}\n\n.footer-link-group-title {\n margin-top: var(--footer-link-group-title-margin-top);\n margin-bottom: var(--footer-link-group-title-margin-bottom);\n flex-grow: 1;\n}\n\n.footer-link-group-toggle {\n fill: white !important;\n}\n\n.footer-link-group-links {\n display: flex;\n flex-direction: column;\n}\n\n.footer-link-group-header {\n display: flex;\n align-items: center;\n}\n","import {\n Component,\n Host,\n Element,\n Listen,\n Prop,\n h,\n State,\n} from \"@stencil/core\";\nimport {\n DEVICE_SIZES,\n getThemeForegroundColor,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcTheme } from \"../../utils/types\";\n\n@Component({\n tag: \"ic-footer-link-group\",\n styleUrl: \"ic-footer-link-group.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class FooterLinkGroup {\n @Element() el: HTMLIcFooterLinkGroupElement;\n\n ~~/*\n The title of the link group to be displayed.\n */\n~~ @~~Prop() groupTitle!: string;\n\n @~~State() ~~small~~: boolean = false;\n\n @State() ~~expanded~~: ~~boolean~~ = ~~false~~;\n\n @State() dropdownIconStyle = getThemeForegroundColor();\n\n @State() ~~deviceSize~~: ~~number~~ = ~~DEVICE_SIZES.XL~~;\n\n ~~private~~ ~~isSmall(e:~~ ~~HTMLElement):~~ ~~boolean~~ ~~{\n if~~ ~~(e.parentElement~~ ~~!==~~ ~~null)~~ {\n if (~~e.parentElement.classList.contains(\"footer\"~~)) {\n ~~return e.parentElement.classList.contains~~(~~\"footer-small\"~~)~~;\n }~~ ~~else~~ {\n ~~return~~ this.isSmall(e.~~parentElement~~);\n ~~}\n } else {\n return false;\n }\n~~ }\n\n ~~private handleKeydown =~~ (~~event: KeyboardEvent~~): void => {\n if (~~event.key ===~~ \" \" ~~\|\| event~~.~~key~~ ~~===~~ \"~~Enter~~\") {\n ~~this.toggleExpanded();\n }~~\~~n };\n\n private~~ ~~toggleExpanded~~ ~~= (): void => {~~\n ~~this.expanded = !this.expanded~~;\n };\n\n @Listen(\"footerResized\", { target: \"document\" })\n footerResizeHandler(): void {\n this.small = this.isSmall(this.el);\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n footerThemeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.dropdownIconStyle = theme.mode;\n }\n\n ~~componentWillLoad~~(): ~~void~~ {\n ~~this~~.small = this.isSmall(~~this~~.el);\n }\n\n ~~componentDidLoad~~(): void {\n ~~onComponentRequiredPropUndefined~~(\~~n [{~~ ~~prop:~~ ~~this~~.~~groupTitle,~~ ~~propName:~~ \"~~group-title~~\" ~~}],\~~n \~~"Footer~~ ~~Link~~ ~~Group~~\"\n );\n }\n\n render() {\n const { small, groupTitle } = this;\n\n return !small ? (\n <Host\n class={{\n [\"footer-link-group footer-link-group-sparse\"]: true,\n [`footer-link-group-${this.dropdownIconStyle}`]: true,\n }}\n >\n <div class=\"footer-link-group-title\">\n <ic-typography variant=\"subtitle-small\">{groupTitle}</ic-typography>\n </div>\n <div class=\"footer-link-group-links\">\n <slot />\n </div>\n </Host>\n ) : (\n <Host\n class={{\n [\"footer-link-group footer-link-group-small\"]: true,\n [`footer-link-group-${this.dropdownIconStyle}`]: true,\n }}\n tabIndex=\"1\"\n onClick={this.toggleExpanded}\n onKeydown={this.handleKeydown}\n aria-haspopup=\"true\"\n aria-expanded={this.expanded}\n >\n <ic-section-container fullHeight={true}>\n <div class=\"footer-link-group-header\">\n <div class=\"footer-link-group-title\">\n <ic-typography variant=\"label\">{groupTitle}</ic-typography>\n </div>\n {this.expanded ? (\n <svg\n class=\"footer-link-group-toggle\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n role=\"img\"\n width=\"1em\"\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n viewBox=\"0 0 1200 1200\"\n >\n <path\n fill=\"currentColor\"\n d=\"M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z\"\n />\n </svg>\n ) : (\n <svg\n class=\"footer-link-group-toggle\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n role=\"img\"\n width=\"1em\"\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n viewBox=\"0 0 1200 1200\"\n >\n <g transform=\"translate(0 1200) scale(1 -1)\">\n <path\n fill=\"currentColor\"\n d=\"M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z\"\n />\n </g>\n </svg>\n )}\n </div>\n {this.expanded && (\n <div class=\"footer-link-group-links\">\n <slot />\n </div>\n )}\n </ic-section-container>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-footer-link-group.entry.js","mappings":"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","names":[],"sources":["./src/components/ic-footer-link-group/ic-footer-link-group.css?tag=ic-footer-link-group&encapsulation=shadow","./src/components/ic-footer-link-group/ic-footer-link-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.footer-link-group-sparse) {\n --footer-link-group-margin-right: 5.938rem;\n --footer-link-group-border-bottom: 0 solid transparent;\n --footer-link-group-title-margin-top: 0;\n --footer-link-group-title-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-group-small) {\n --footer-link-group-margin-right: 0;\n --footer-link-group-title-margin-top: var(--ic-space-md);\n --footer-link-group-title-margin-bottom: var(--ic-space-md);\n --footer-link-group-links-padding-left: var(--ic-space-md);\n --footer-link-group-links-padding-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-group-light.footer-link-group-small) {\n --footer-link-group-border-bottom: var(--ic-keyline-lighten);\n}\n\n:host(.footer-link-group-dark.footer-link-group-small) {\n --footer-link-group-border-bottom: var(--ic-keyline-darken);\n}\n\n:host(.footer-link-group) {\n margin-right: var(--footer-link-group-margin-right);\n border-bottom: var(--footer-link-group-border-bottom);\n}\n\n:host(.footer-link-group-small.footer-link-group-light:hover) {\n background-color: var(--ic-action-light-bg-hover);\n cursor: pointer;\n}\n\n:host(.footer-link-group-small.footer-link-group-dark:hover) {\n background-color: var(--ic-action-dark-bg-hover);\n cursor: pointer;\n}\n\n:host(.footer-link-group-sparse:focus) {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n outline: var(--ic-hc-focus-outline);\n z-index: 1;\n}\n\n:host(.footer-link-group-small:focus) {\n box-shadow: var(--ic-border-focus-inset);\n border-radius: var(--ic-border-radius-inset);\n outline: var(--ic-hc-focus-outline);\n z-index: 1;\n}\n\n:host(.footer-link-group-small.footer-link-group-light:active) {\n background-color: var(--ic-action-light-bg-active);\n}\n\n:host(.footer-link-group-small.footer-link-group-dark:active) {\n background-color: var(--ic-action-dark-bg-active);\n}\n\n.footer-link-group-title {\n margin-top: var(--footer-link-group-title-margin-top);\n margin-bottom: var(--footer-link-group-title-margin-bottom);\n flex-grow: 1;\n}\n\n.footer-link-group-toggle {\n fill: white !important;\n}\n\n.footer-link-group-links {\n display: flex;\n flex-direction: column;\n}\n\n.footer-link-group-header {\n display: flex;\n align-items: center;\n}\n","import {\n Component,\n Host,\n Element,\n Listen,\n Prop,\n h,\n State,\n} from \"@stencil/core\";\nimport {\n DEVICE_SIZES,\n getThemeForegroundColor,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcTheme } from \"../../utils/types\";\n\n@Component({\n tag: \"ic-footer-link-group\",\n styleUrl: \"ic-footer-link-group.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class FooterLinkGroup {\n @Element() el: HTMLIcFooterLinkGroupElement;\n\n @State() expanded: boolean = false;\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() dropdownIconStyle = getThemeForegroundColor();\n @State() small: boolean = false;\n\n /*\n The title of the link group to be displayed.\n */\n @Prop() groupTitle!: string;\n\n componentWillLoad(): void {\n this.small = this.isSmall(this.el);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.groupTitle, propName: \"group-title\" }],\n \"Footer Link Group\"\n );\n }\n\n @Listen(\"footerResized\", { target: \"document\" })\n footerResizeHandler(): void {\n this.small = this.isSmall(this.el);\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n footerThemeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.dropdownIconStyle = theme.mode;\n }\n\n private isSmall(e: HTMLElement): boolean {\n if (e.parentElement !== null) {\n if (e.parentElement.classList.contains(\"footer\")) {\n return e.parentElement.classList.contains(\"footer-small\");\n } else {\n return this.isSmall(e.parentElement);\n }\n } else {\n return false;\n }\n }\n\n private handleKeydown = (event: KeyboardEvent): void => {\n if (event.key === \" \" \|\| event.key === \"Enter\") {\n this.toggleExpanded();\n }\n };\n\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n };\n\n render() {\n const { small, groupTitle } = this;\n\n return !small ? (\n <Host\n class={{\n [\"footer-link-group footer-link-group-sparse\"]: true,\n [`footer-link-group-${this.dropdownIconStyle}`]: true,\n }}\n >\n <div class=\"footer-link-group-title\">\n <ic-typography variant=\"subtitle-small\">{groupTitle}</ic-typography>\n </div>\n <div class=\"footer-link-group-links\">\n <slot />\n </div>\n </Host>\n ) : (\n <Host\n class={{\n [\"footer-link-group footer-link-group-small\"]: true,\n [`footer-link-group-${this.dropdownIconStyle}`]: true,\n }}\n tabIndex=\"1\"\n onClick={this.toggleExpanded}\n onKeydown={this.handleKeydown}\n aria-haspopup=\"true\"\n aria-expanded={this.expanded}\n >\n <ic-section-container fullHeight={true}>\n <div class=\"footer-link-group-header\">\n <div class=\"footer-link-group-title\">\n <ic-typography variant=\"label\">{groupTitle}</ic-typography>\n </div>\n {this.expanded ? (\n <svg\n class=\"footer-link-group-toggle\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n role=\"img\"\n width=\"1em\"\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n viewBox=\"0 0 1200 1200\"\n >\n <path\n fill=\"currentColor\"\n d=\"M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z\"\n />\n </svg>\n ) : (\n <svg\n class=\"footer-link-group-toggle\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n role=\"img\"\n width=\"1em\"\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n viewBox=\"0 0 1200 1200\"\n >\n <g transform=\"translate(0 1200) scale(1 -1)\">\n <path\n fill=\"currentColor\"\n d=\"M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z\"\n />\n </g>\n </svg>\n )}\n </div>\n {this.expanded && (\n <div class=\"footer-link-group-links\">\n <slot />\n </div>\n )}\n </ic-section-container>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/esm/ic-footer-link.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, H as Host, g as getElement } from './index-a77644e1.js';
-import { D as DEVICE_SIZES, l as getThemeForegroundColor } from './helpers-8e57082b.js';
+import { D as DEVICE_SIZES, l as getThemeForegroundColor } from './helpers-85903813.js';
 import { O as OpenInNew } from './OpenInNew-67a881e0.js';
 import './types-dd515332.js';
@@ -8,15 +8,25 @@ const icFooterLinkCss = "/*! normalize.css v8.0.1 | MIT License | github.com/nec
 const FooterLink = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
+    this.deviceSize = DEVICE_SIZES.XL;
+    this.footerConfig = { small: false, grouped: false };
+    this.foregroundColor = getThemeForegroundColor();
+    this.download = false;
     this.href = null;
     this.hreflang = undefined;
     this.referrerpolicy = undefined;
     this.rel = undefined;
     this.target = undefined;
-    this.download = false;
-    this.footerConfig = { small: false, grouped: false };
-    this.deviceSize = DEVICE_SIZES.XL;
-    this.foregroundColor = getThemeForegroundColor();
+  }
+  componentWillLoad() {
+    this.footerConfig = this.inferConfig(this.el);
+  }
+  footerResizeHandler() {
+    this.footerConfig = this.inferConfig(this.el);
+  }
+  footerThemeChangeHandler(ev) {
+    const theme = ev.detail;
+    this.foregroundColor = theme.mode;
   }
   inferConfig(e) {
     if (e.parentElement !== null) {
@@ -34,16 +44,6 @@ const FooterLink = class {
       return { small: false, grouped: false };
     }
   }
-  footerResizeHandler() {
-    this.footerConfig = this.inferConfig(this.el);
-  }
-  footerThemeChangeHandler(ev) {
-    const theme = ev.detail;
-    this.foregroundColor = theme.mode;
-  }
-  componentWillLoad() {
-    this.footerConfig = this.inferConfig(this.el);
-  }
   render() {
     const { footerConfig, href, hreflang, referrerpolicy, rel, target, download, } = this;
     const { small, grouped } = footerConfig;

package/dist/esm/ic-footer-link.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-footer-link.entry.js","mappings":";;;;;AAAA,MAAM,eAAe,GAAG,0iMAA0iM;;MCuBrjM,UAAU;;;~~gBAMG~~,~~IAAI;;;;;oBAyBU~~,~~KAAK~~;~~wBAEL~~,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE;~~sBAExC~~,YAAY,CAAC,EAAE;~~2BAEC~~,~~uBAAuB~~,EAAE~~;;EAE~~/D,WAAW,CAAC,CAAc;IAChC,IAAI,CAAC,CAAC,aAAa,KAAK,IAAI,EAAE;MAC5B,IAAI,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;QAChD,OAAO;UACL,KAAK,EAAE,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC;UACzD,OAAO,EAAE,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,gBAAgB,CAAC;SAC9D,CAAC;OACH;WAAM;QACL,OAAO,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;OAC1C;KACF;SAAM;MACL,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;KACzC;GACF;EAGD,mBAAmB;IACjB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;GAC/C;EAGD,wBAAwB,CAAC,EAAe;IACtC,MAAM,KAAK,GAAY,EAAE,CAAC,MAAM,CAAC;IACjC,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC;GACnC;EAED,~~iBAAiB;IACf,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;GAC/C;EAED,~~MAAM;IACJ,MAAM,EACJ,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,cAAc,EACd,GAAG,EACH,MAAM,EACN,QAAQ,GACT,GAAG,IAAI,CAAC;IACT,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,YAAY,CAAC;IAExC,QACE,EAAC,IAAI,IACH,KAAK,EAAE;QACL,aAAa,EAAE,IAAI;QACnB,CAAC,eAAe,OAAO,GAAG,SAAS,GAAG,WAAW,IAC/C,KAAK,GAAG,OAAO,GAAG,QACpB,EAAE,GAAG,IAAI;QACT,CAAC,eAAe,IAAI,CAAC,eAAe,EAAE,GAAG,IAAI;OAC9C,IAED,SACE,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,KAAK,KAAK,GAAG,QAAQ,GAAG,IAAI,EAC9C,MAAM,EAAE,MAAM,IAEd,eAAQ,EACP,MAAM,KAAK,QAAQ,KAClB,YAAM,KAAK,EAAC,kBAAkB,EAAC,SAAS,EAAE,SAAS,GAAI,CACxD,CACC,CACC,EACP;GACH;;;;;;;;","names":[],"sources":["./src/components/ic-footer-link/ic-footer-link.css?tag=ic-footer-link&encapsulation=shadow","./src/components/ic-footer-link/ic-footer-link.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.footer-link-ungrouped-sparse) {\n --footer-link-margin-left: 0;\n --footer-link-margin-right: 2.5rem;\n --footer-link-margin-bottom: 0;\n}\n\n:host(.footer-link-ungrouped-small) {\n --footer-link-margin-left: 0;\n --footer-link-margin-right: 0;\n --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-grouped-sparse) {\n --footer-link-margin-left: 0;\n --footer-link-margin-right: 0;\n --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-grouped-small) {\n --footer-link-margin-left: var(--ic-space-md);\n --footer-link-margin-right: 0;\n --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link) {\n margin-left: var(--footer-link-margin-left);\n margin-right: var(--footer-link-margin-right);\n margin-bottom: var(--footer-link-margin-bottom);\n}\n\n/* Link styling /\n\n:host(.footer-link) a,\n:host(.footer-link) a ::slotted(a) {\n display: flex;\n align-items: flex-end;\n font-weight: var(--ic-font-weight-bold);\n color: inherit;\n width: fit-content;\n font-size: var(--ic-font-size-regular);\n}\n\n:host(.footer-link) a:link,\n:host(.footer-link) a ::slotted(a:link) {\n color: inherit;\n text-decoration: underline;\n font-weight: var(--ic-font-weight-bold);\n}\n\n:host(.footer-link) a:link > ::slotted(svg),\n:host(.footer-link) a:link > ::slotted(img),\n:host(.footer-link) a ::slotted(a:link > ::slotted(svg)),\n:host(.footer-link) a ::slotted(a:link > ::slotted(img)) {\n padding: var(--ic-space-xxxs);\n pointer-events: none;\n transition: var(--ic-easing-transition-fast);\n}\n\n/\nThere's an apparent defect in Chrome that means this isn't always re-rendered if changed.\nNot an issue in Safari. Line 73-79 implement the same function but less clean.\n\na:link > ::slotted(svg) ,\na:link:visited > ::slotted(svg) {\n fill: var(--ic-theme-text);\n}\n/\n\n:host(.footer-link-light) ::slotted(svg) {\n fill: var(--ic-architectural-white);\n}\n\n:host(.footer-link-dark) ::slotted(svg) {\n fill: var(--ic-architectural-black);\n}\n\n:host(.footer-link) a:link:hover,\n:host(.footer-link) a:link:focus,\n:host(.footer-link) a ::slotted(a:link:hover),\n:host(.footer-link) a ::slotted(a:link:focus) {\n border-bottom: 0.25rem solid !important;\n margin-bottom: -0.25rem !important;\n text-decoration: none;\n}\n\n@supports (text-decoration-thickness: 25%) {\n :host(.footer-link) a:link:hover,\n :host(.footer-link) a:link:focus,\n :host(.footer-link) a ::slotted(a:link:hover),\n :host(.footer-link) a ::slotted(a:link:focus) {\n text-decoration-line: underline;\n text-decoration-thickness: 25%;\n text-underline-offset: 25%;\n border-bottom: 0 !important;\n margin-bottom: 0 !important;\n }\n}\n\n:host(.footer-link) a:link:hover,\n:host(.footer-link) a ::slotted(a:link:hover) {\n outline: none;\n}\n\n:host(.footer-link) a:link:focus,\n:host(.footer-link) a ::slotted(a:link:focus) {\n outline: var(--ic-hc-focus-outline);\n}\n\n:host(.footer-link) a:link:focus > ::slotted(svg),\n:host(.footer-link) a:link:focus > ::slotted(img),\n:host(.footer-link) a ::slotted(a:link:focus > ::slotted(svg)),\n:host(.footer-link) a ::slotted(a:link:focus > ::slotted(img)) {\n box-shadow: var(--ic-border-focus);\n border-radius: var(--ic-border-radius);\n}\n\n:host(.footer-link) a:focus,\n:host(.footer-link) a ::slotted(a:focus) {\n border-radius: var(--ic-border-radius);\n outline: var(--ic-hc-focus-outline);\n transition: var(--ic-transition-duration-fast);\n}\n\n:host(.footer-link) a:link:active,\n:host(.footer-link) a:link:focus:active,\n:host(.footer-link) a:link:visited:active,\n:host(.footer-link) a ::slotted(a:link:active),\n:host(.footer-link) a ::slotted(a:link:focus:active),\n:host(.footer-link) a ::slotted(a:link:visited:active) {\n color: inherit;\n text-decoration: none;\n}\n\n:host(.footer-link) a:hover,\n:host(.footer-link) a ::slotted(a:hover) {\n text-decoration: none;\n}\n\n.open-in-new-icon {\n padding-left: var(--ic-space-xxs);\n}\n\n.open-in-new-icon,\n.open-in-new-icon svg {\n height: var(--ic-space-md);\n width: var(--ic-space-md);\n}\n\n:host(.footer-link-light) .open-in-new-icon svg {\n fill: var(--ic-architectural-white);\n}\n\n:host(.footer-link-dark) .open-in-new-icon svg {\n fill: var(--ic-architectural-black);\n}\n\n@media screen and (min-width: 769px) {\n :host(.footer-link.footer-link-ungrouped-sparse:last-of-type) {\n margin-right: 0;\n }\n}\n\n@media (forced-colors: active) {\n :host(.footer-link-light) ::slotted(svg),\n :host(.footer-link-dark) ::slotted(svg) {\n fill: currentcolor;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Listen,\n Prop,\n h,\n State,\n} from \"@stencil/core\";\nimport { DEVICE_SIZES, getThemeForegroundColor } from \"../../utils/helpers\";\nimport { IcTheme, IcThemeForeground } from \"../../utils/types\";\n\nimport OpenInNew from \"../../assets/OpenInNew.svg\";\n\ntype FooterConfig = { small: boolean; grouped: boolean };\n\n@Component({\n tag: \"ic-footer-link\",\n styleUrl: \"ic-footer-link.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class FooterLink {\n @Element() el: HTMLIcFooterLinkElement;\n\n /\n The URL that the link points to.\n /\n @Prop() href?: string = null;\n\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string;\n\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n\n /\n The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n /\n @Prop() target?: string;\n\n /\n If ~~`true`,~~ ~~the~~ ~~user~~ ~~can~~ ~~save~~ ~~the~~ ~~linked URL instead of navigating to it.\~~n */\n ~~@Prop~~() ~~download?:~~ ~~string~~ ~~\| boolean~~ = ~~false~~;\n\n @~~State~~() ~~footerConfig: FooterConfig =~~ { ~~small~~: ~~false,~~ ~~grouped: false~~ }~~;\n~~\n ~~@State~~() ~~deviceSize~~: ~~number~~ = ~~DEVICE_SIZES~~.XL;\n~~\n @State()~~ foregroundColor: ~~IcThemeForeground~~ = ~~getThemeForegroundColor()~~;\n\n private inferConfig(e: HTMLElement): FooterConfig {\n if (e.parentElement !== null) {\n if (e.parentElement.classList.contains(\"footer\")) {\n return {\n small: e.parentElement.classList.contains(\"footer-small\"),\n grouped: e.parentElement.classList.contains(\"footer-grouped\"),\n };\n } else {\n return this.inferConfig(e.parentElement);\n }\n } else {\n return { small: false, grouped: false };\n }\n }\n\n @Listen(\"footerResized\", { target: \"document\" })\n footerResizeHandler(): void {\n this.footerConfig = this.inferConfig(this.el);\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n footerThemeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.foregroundColor = theme.mode;\n }\n\n componentWillLoad(): void {\n this.footerConfig = this.inferConfig(this.el);\n }\n\n render() {\n const {\n footerConfig,\n href,\n hreflang,\n referrerpolicy,\n rel,\n target,\n download,\n } = this;\n const { small, grouped } = footerConfig;\n\n return (\n <Host\n class={{\n \"footer-link\": true,\n [`footer-link-${grouped ? \"grouped\" : \"ungrouped\"}-${\n small ? \"small\" : \"sparse\"\n }`]: true,\n [`footer-link-${this.foregroundColor}`]: true,\n }}\n >\n <a\n href={href}\n hreflang={hreflang}\n referrerPolicy={referrerpolicy}\n rel={rel}\n download={download !== false ? download : null}\n target={target}\n >\n <slot />\n {target === \"_blank\" && (\n <span class=\"open-in-new-icon\" innerHTML={OpenInNew} />\n )}\n </a>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-footer-link.entry.js","mappings":";;;;;AAAA,MAAM,eAAe,GAAG,0iMAA0iM;;MCuBrjM,UAAU;;;sBAGS,YAAY,CAAC,EAAE;wBACP,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE;2BACxB,uBAAuB,EAAE;oBAKjC,KAAK;gBAKnB,IAAI;;;;;;EAsB5B,iBAAiB;IACf,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;GAC/C;EAGD,mBAAmB;IACjB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;GAC/C;EAGD,wBAAwB,CAAC,EAAe;IACtC,MAAM,KAAK,GAAY,EAAE,CAAC,MAAM,CAAC;IACjC,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC;GACnC;EAEO,WAAW,CAAC,CAAc;IAChC,IAAI,CAAC,CAAC,aAAa,KAAK,IAAI,EAAE;MAC5B,IAAI,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE;QAChD,OAAO;UACL,KAAK,EAAE,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,cAAc,CAAC;UACzD,OAAO,EAAE,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,gBAAgB,CAAC;SAC9D,CAAC;OACH;WAAM;QACL,OAAO,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;OAC1C;KACF;SAAM;MACL,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;KACzC;GACF;EAED,MAAM;IACJ,MAAM,EACJ,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,cAAc,EACd,GAAG,EACH,MAAM,EACN,QAAQ,GACT,GAAG,IAAI,CAAC;IACT,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,YAAY,CAAC;IAExC,QACE,EAAC,IAAI,IACH,KAAK,EAAE;QACL,aAAa,EAAE,IAAI;QACnB,CAAC,eAAe,OAAO,GAAG,SAAS,GAAG,WAAW,IAC/C,KAAK,GAAG,OAAO,GAAG,QACpB,EAAE,GAAG,IAAI;QACT,CAAC,eAAe,IAAI,CAAC,eAAe,EAAE,GAAG,IAAI;OAC9C,IAED,SACE,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,KAAK,KAAK,GAAG,QAAQ,GAAG,IAAI,EAC9C,MAAM,EAAE,MAAM,IAEd,eAAQ,EACP,MAAM,KAAK,QAAQ,KAClB,YAAM,KAAK,EAAC,kBAAkB,EAAC,SAAS,EAAE,SAAS,GAAI,CACxD,CACC,CACC,EACP;GACH;;;;;;;;","names":[],"sources":["./src/components/ic-footer-link/ic-footer-link.css?tag=ic-footer-link&encapsulation=shadow","./src/components/ic-footer-link/ic-footer-link.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.footer-link-ungrouped-sparse) {\n --footer-link-margin-left: 0;\n --footer-link-margin-right: 2.5rem;\n --footer-link-margin-bottom: 0;\n}\n\n:host(.footer-link-ungrouped-small) {\n --footer-link-margin-left: 0;\n --footer-link-margin-right: 0;\n --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-grouped-sparse) {\n --footer-link-margin-left: 0;\n --footer-link-margin-right: 0;\n --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link-grouped-small) {\n --footer-link-margin-left: var(--ic-space-md);\n --footer-link-margin-right: 0;\n --footer-link-margin-bottom: var(--ic-space-md);\n}\n\n:host(.footer-link) {\n margin-left: var(--footer-link-margin-left);\n margin-right: var(--footer-link-margin-right);\n margin-bottom: var(--footer-link-margin-bottom);\n}\n\n/* Link styling /\n\n:host(.footer-link) a,\n:host(.footer-link) a ::slotted(a) {\n display: flex;\n align-items: flex-end;\n font-weight: var(--ic-font-weight-bold);\n color: inherit;\n width: fit-content;\n font-size: var(--ic-font-size-regular);\n}\n\n:host(.footer-link) a:link,\n:host(.footer-link) a ::slotted(a:link) {\n color: inherit;\n text-decoration: underline;\n font-weight: var(--ic-font-weight-bold);\n}\n\n:host(.footer-link) a:link > ::slotted(svg),\n:host(.footer-link) a:link > ::slotted(img),\n:host(.footer-link) a ::slotted(a:link > ::slotted(svg)),\n:host(.footer-link) a ::slotted(a:link > ::slotted(img)) {\n padding: var(--ic-space-xxxs);\n pointer-events: none;\n transition: var(--ic-easing-transition-fast);\n}\n\n/\nThere's an apparent defect in Chrome that means this isn't always re-rendered if changed.\nNot an issue in Safari. Line 73-79 implement the same function but less clean.\n\na:link > ::slotted(svg) ,\na:link:visited > ::slotted(svg) {\n fill: var(--ic-theme-text);\n}\n/\n\n:host(.footer-link-light) ::slotted(svg) {\n fill: var(--ic-architectural-white);\n}\n\n:host(.footer-link-dark) ::slotted(svg) {\n fill: var(--ic-architectural-black);\n}\n\n:host(.footer-link) a:link:hover,\n:host(.footer-link) a:link:focus,\n:host(.footer-link) a ::slotted(a:link:hover),\n:host(.footer-link) a ::slotted(a:link:focus) {\n border-bottom: 0.25rem solid !important;\n margin-bottom: -0.25rem !important;\n text-decoration: none;\n}\n\n@supports (text-decoration-thickness: 25%) {\n :host(.footer-link) a:link:hover,\n :host(.footer-link) a:link:focus,\n :host(.footer-link) a ::slotted(a:link:hover),\n :host(.footer-link) a ::slotted(a:link:focus) {\n text-decoration-line: underline;\n text-decoration-thickness: 25%;\n text-underline-offset: 25%;\n border-bottom: 0 !important;\n margin-bottom: 0 !important;\n }\n}\n\n:host(.footer-link) a:link:hover,\n:host(.footer-link) a ::slotted(a:link:hover) {\n outline: none;\n}\n\n:host(.footer-link) a:link:focus,\n:host(.footer-link) a ::slotted(a:link:focus) {\n outline: var(--ic-hc-focus-outline);\n}\n\n:host(.footer-link) a:link:focus > ::slotted(svg),\n:host(.footer-link) a:link:focus > ::slotted(img),\n:host(.footer-link) a ::slotted(a:link:focus > ::slotted(svg)),\n:host(.footer-link) a ::slotted(a:link:focus > ::slotted(img)) {\n box-shadow: var(--ic-border-focus);\n border-radius: var(--ic-border-radius);\n}\n\n:host(.footer-link) a:focus,\n:host(.footer-link) a ::slotted(a:focus) {\n border-radius: var(--ic-border-radius);\n outline: var(--ic-hc-focus-outline);\n transition: var(--ic-transition-duration-fast);\n}\n\n:host(.footer-link) a:link:active,\n:host(.footer-link) a:link:focus:active,\n:host(.footer-link) a:link:visited:active,\n:host(.footer-link) a ::slotted(a:link:active),\n:host(.footer-link) a ::slotted(a:link:focus:active),\n:host(.footer-link) a ::slotted(a:link:visited:active) {\n color: inherit;\n text-decoration: none;\n}\n\n:host(.footer-link) a:hover,\n:host(.footer-link) a ::slotted(a:hover) {\n text-decoration: none;\n}\n\n.open-in-new-icon {\n padding-left: var(--ic-space-xxs);\n}\n\n.open-in-new-icon,\n.open-in-new-icon svg {\n height: var(--ic-space-md);\n width: var(--ic-space-md);\n}\n\n:host(.footer-link-light) .open-in-new-icon svg {\n fill: var(--ic-architectural-white);\n}\n\n:host(.footer-link-dark) .open-in-new-icon svg {\n fill: var(--ic-architectural-black);\n}\n\n@media screen and (min-width: 769px) {\n :host(.footer-link.footer-link-ungrouped-sparse:last-of-type) {\n margin-right: 0;\n }\n}\n\n@media (forced-colors: active) {\n :host(.footer-link-light) ::slotted(svg),\n :host(.footer-link-dark) ::slotted(svg) {\n fill: currentcolor;\n }\n}\n","import {\n Component,\n Element,\n Host,\n Listen,\n Prop,\n h,\n State,\n} from \"@stencil/core\";\nimport { DEVICE_SIZES, getThemeForegroundColor } from \"../../utils/helpers\";\nimport { IcTheme, IcThemeForeground } from \"../../utils/types\";\n\nimport OpenInNew from \"../../assets/OpenInNew.svg\";\n\ntype FooterConfig = { small: boolean; grouped: boolean };\n\n@Component({\n tag: \"ic-footer-link\",\n styleUrl: \"ic-footer-link.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class FooterLink {\n @Element() el: HTMLIcFooterLinkElement;\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() footerConfig: FooterConfig = { small: false, grouped: false };\n @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n\n /\n If `true`, the user can save the linked URL instead of navigating to it.\n /\n @Prop() download?: string \| boolean = false;\n\n /\n The URL that the link points to.\n /\n @Prop() href?: string = null;\n\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string;\n\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n\n /\n The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n */\n @Prop() target?: string;\n\n componentWillLoad(): void {\n this.footerConfig = this.inferConfig(this.el);\n }\n\n @Listen(\"footerResized\", { target: \"document\" })\n footerResizeHandler(): void {\n this.footerConfig = this.inferConfig(this.el);\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n footerThemeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.foregroundColor = theme.mode;\n }\n\n private inferConfig(e: HTMLElement): FooterConfig {\n if (e.parentElement !== null) {\n if (e.parentElement.classList.contains(\"footer\")) {\n return {\n small: e.parentElement.classList.contains(\"footer-small\"),\n grouped: e.parentElement.classList.contains(\"footer-grouped\"),\n };\n } else {\n return this.inferConfig(e.parentElement);\n }\n } else {\n return { small: false, grouped: false };\n }\n }\n\n render() {\n const {\n footerConfig,\n href,\n hreflang,\n referrerpolicy,\n rel,\n target,\n download,\n } = this;\n const { small, grouped } = footerConfig;\n\n return (\n <Host\n class={{\n \"footer-link\": true,\n [`footer-link-${grouped ? \"grouped\" : \"ungrouped\"}-${\n small ? \"small\" : \"sparse\"\n }`]: true,\n [`footer-link-${this.foregroundColor}`]: true,\n }}\n >\n <a\n href={href}\n hreflang={hreflang}\n referrerPolicy={referrerpolicy}\n rel={rel}\n download={download !== false ? download : null}\n target={target}\n >\n <slot />\n {target === \"_blank\" && (\n <span class=\"open-in-new-icon\" innerHTML={OpenInNew} />\n )}\n </a>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/esm/ic-footer.entry.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-a77644e1.js';
-import { g as getCurrentDeviceSize, I as IC_DEVICE_SIZES, l as getThemeForegroundColor, c as checkResizeObserver, i as isSlotUsed, m as hasClassificationBanner } from './helpers-8e57082b.js';
+import { g as getCurrentDeviceSize, I as IC_DEVICE_SIZES, l as getThemeForegroundColor, c as checkResizeObserver, i as isSlotUsed, m as hasClassificationBanner } from './helpers-85903813.js';
 import { I as IcThemeForegroundEnum } from './types-dd515332.js';
 const icFooterCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host{display:block;--footer-compliance-padding:1rem 0}:host(.footer-sparse){--footer-links-padding:1.5rem 0;--footer-logo-margin-bottom:var(--ic-space-lg);--footer-link-inner-flex-direction:row}:host(.footer-small){--footer-links-padding:0 0;--footer-logo-margin-bottom:var(--ic-space-md);--footer-link-inner-flex-direction:column}:host(.footer-light){--footer-theme-secondary:var(--ic-theme-secondary);--footer-theme-tertiary:var(--ic-theme-tertiary);--footer-keyline:var(--ic-keyline-lighten)}:host(.footer-dark){--footer-theme-secondary:var(--ic-theme-secondary-light);--footer-theme-tertiary:var(--ic-theme-tertiary-light);--footer-keyline:var(--ic-keyline-darken)}:host(.footer-small.footer-ungrouped){--footer-links-padding:var(--ic-space-md) 0 0 0}footer{display:flex;flex-direction:column;width:100%}.footer-description{background-color:var(--footer-theme-secondary);color:var(--ic-theme-text);border-bottom:var(--footer-keyline)}.footer-description-inner{padding:1rem 0}.footer-links{padding:var(--footer-links-padding);background-color:var(--footer-theme-secondary);color:var(--ic-theme-text)}.footer-links-inner{display:flex;flex-direction:var(--footer-link-inner-flex-direction)}.footer-compliance{background-color:var(--footer-theme-tertiary);color:var(--ic-theme-text)}.footer-compliance-inner{padding:var(--footer-compliance-padding)}.footer-logo{margin-bottom:var(--footer-logo-margin-bottom);display:flex;gap:var(--ic-space-xxl)}.footer-logo>::slotted(){margin-right:var(--ic-space-md)}.footer-caption{margin-bottom:var(--ic-space-md)}.classification-spacing{margin-bottom:var(--ic-space-lg)}@media (forced-colors: active){footer{border-top:var(--ic-hc-border)}}";
@@ -21,14 +21,27 @@ const Footer = class {
       });
       this.resizeObserver.observe(this.footerEl);
     };
-    this.description = undefined;
+    this.deviceSize = IC_DEVICE_SIZES.XL;
+    this.foregroundColor = getThemeForegroundColor();
     this.aligned = "left";
     this.breakpoint = "medium";
-    this.groupLinks = false;
     this.caption = undefined;
     this.copyright = true;
-    this.deviceSize = IC_DEVICE_SIZES.XL;
-    this.foregroundColor = getThemeForegroundColor();
+    this.description = undefined;
+    this.groupLinks = false;
+  }
+  disconnectedCallback() {
+    this.resizeObserver.disconnect();
+  }
+  componentWillLoad() {
+    this.deviceSize = getCurrentDeviceSize();
+  }
+  componentDidLoad() {
+    checkResizeObserver(this.runResizeObserver);
+  }
+  themeChangeHandler(ev) {
+    const theme = ev.detail;
+    this.foregroundColor = theme.mode;
   }
   isSmall() {
     const bp = this.breakpoint;
@@ -44,19 +57,6 @@ const Footer = class {
               ? this.deviceSize < IC_DEVICE_SIZES.XL
               : false;
   }
-  themeChangeHandler(ev) {
-    const theme = ev.detail;
-    this.foregroundColor = theme.mode;
-  }
-  componentWillLoad() {
-    this.deviceSize = getCurrentDeviceSize();
-  }
-  componentDidLoad() {
-    checkResizeObserver(this.runResizeObserver);
-  }
-  disconnectedCallback() {
-    this.resizeObserver.disconnect();
-  }
   render() {
     const { aligned, caption, copyright, description, groupLinks, foregroundColor, } = this;
     const small = this.isSmall();