npm - @ukic/web-components - Versions diffs - 3.0.0-alpha.6 → 3.0.0-alpha.8 - Mend

@ukic/web-components 3.0.0-alpha.6 → 3.0.0-alpha.8

Files changed (385) hide show

package/dist/cjs/ic-card-vertical.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-f982899d.js');
-const helpers = require('./helpers-dd569d97.js');
+const helpers = require('./helpers-8ca38600.js');
 const chevronIcon = require('./chevron-icon-3bf07531.js');
 const icCardVerticalCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n     ========================================================================== */\n\n/**\n   * Remove the margin in all browsers.\n   */\n\nbody {\n  margin: 0;\n}\n\n/**\n   * Render the `main` element consistently in IE.\n   */\n\nmain {\n  display: block;\n}\n\n/**\n   * Correct the font size and margin on `h1` elements within `section` and\n   * `article` contexts in Chrome, Firefox, and Safari.\n   */\n\nh1 {\n  font-size: 2em;\n  margin: 0.67em 0;\n}\n\n/* Grouping content\n     ========================================================================== */\n\n/**\n   * 1. Add the correct box sizing in Firefox.\n   * 2. Show the overflow in Edge and IE.\n   */\n\nhr {\n  box-sizing: content-box; /* 1 */\n  height: 0; /* 1 */\n  overflow: visible; /* 2 */\n}\n\n/**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\npre {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n     ========================================================================== */\n\n/**\n   * Remove the gray background on active links in IE 10.\n   */\n\na {\n  background-color: transparent;\n}\n\n/**\n   * 1. Remove the bottom border in Chrome 57-\n   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n   */\n\nabbr[title] {\n  border-bottom: none; /* 1 */\n  text-decoration: underline; /* 2 */\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted; /* 2 */\n}\n\n/**\n   * Add the correct font weight in Chrome, Edge, and Safari.\n   */\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\ncode,\nkbd,\nsamp {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\n   * Add the correct font size in all browsers.\n   */\n\nsmall {\n  font-size: 80%;\n}\n\n/**\n   * Prevent `sub` and `sup` elements from affecting the line height in\n   * all browsers.\n   */\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/* Embedded content\n     ========================================================================== */\n\n/**\n   * Remove the border on images inside links in IE 10.\n   */\n\nimg {\n  border-style: none;\n}\n\n/* Forms\n     ========================================================================== */\n\n/**\n   * 1. Change the font styles in all browsers.\n   * 2. Remove the margin in Firefox and Safari.\n   */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\n   * Show the overflow in IE.\n   * 1. Show the overflow in Edge.\n   */\n\nbutton,\ninput {\n  /* 1 */\n  overflow: visible;\n}\n\n/**\n   * Remove the inheritance of text transform in Edge, Firefox, and IE.\n   * 1. Remove the inheritance of text transform in Firefox.\n   */\n\nbutton,\nselect {\n  /* 1 */\n  text-transform: none;\n}\n\n/**\n   * Correct the inability to style clickable types in iOS and Safari.\n   */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button;\n}\n\n/**\n   * Remove the inner border and padding in Firefox.\n   */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n  border-style: none;\n  padding: 0;\n}\n\n/**\n   * Restore the focus styles unset by the previous rule.\n   */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n  outline: 1px dotted ButtonText;\n}\n\n/**\n   * Correct the padding in Firefox.\n   */\n\nfieldset {\n  padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n   * 1. Correct the text wrapping in Edge and IE.\n   * 2. Correct the color inheritance from `fieldset` elements in IE.\n   * 3. Remove the padding so developers are not caught out when they zero out\n   *    `fieldset` elements in all browsers.\n   */\n\nlegend {\n  box-sizing: border-box; /* 1 */\n  color: inherit; /* 2 */\n  display: table; /* 1 */\n  max-width: 100%; /* 1 */\n  padding: 0; /* 3 */\n  white-space: normal; /* 1 */\n}\n\n/**\n   * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n   */\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\n   * Remove the default vertical scrollbar in IE 10+.\n   */\n\ntextarea {\n  overflow: auto;\n}\n\n/**\n   * 1. Add the correct box sizing in IE 10.\n   * 2. Remove the padding in IE 10.\n   */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n  box-sizing: border-box; /* 1 */\n  padding: 0; /* 2 */\n}\n\n/**\n   * Correct the cursor style of increment and decrement buttons in Chrome.\n   */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/**\n   * 1. Correct the odd appearance in Chrome and Safari.\n   * 2. Correct the outline style in Safari.\n   */\n\n[type=\"search\"] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\n   * Remove the inner padding in Chrome and Safari on macOS.\n   */\n\n[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/**\n   * 1. Correct the inability to style clickable types in iOS and Safari.\n   * 2. Change font properties to `inherit` in Safari.\n   */\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button; /* 1 */\n  font: inherit; /* 2 */\n}\n\n/* Interactive\n     ========================================================================== */\n\n/*\n   * Add the correct display in Edge, IE 10+, and Firefox.\n   */\n\ndetails {\n  display: block;\n}\n\n/*\n   * Add the correct display in all browsers.\n   */\n\nsummary {\n  display: list-item;\n}\n\n/* Misc\n     ========================================================================== */\n\n/**\n   * Add the correct display in IE 10+.\n   */\n\ntemplate {\n  display: none;\n}\n\n/**\n   * Add the correct display in IE 10.\n   */\n\n[hidden] {\n  display: none;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n  margin: 0;\n  padding: 0;\n  border: 0;\n  font-size: 100%;\n  font-style: inherit;\n  vertical-align: baseline;\n}\n\n\n:host {\n  display: flex;\n}\n\na {\n  text-decoration: none !important;\n  color: var(--ic-card-text-primary) !important;\n}\n\na:visited {\n  color: var(--ic-card-link-action-dark) !important;\n}\n\nbutton {\n  border: none;\n  background-color: transparent;\n  outline: var(--ic-hc-focus-outline);\n}\n\n.card {\n  display: flex;\n  flex-direction: column;\n  border: var(--ic-space-1px) solid var(--ic-card-border-primary);\n  border-radius: var(--ic-border-radius);\n  box-sizing: border-box;\n  padding: var(--ic-space-md);\n  text-align: left;\n  color: var(--ic-card-text-primary);\n  transition: var(--ic-easing-transition-fast);\n  position: relative;\n  width: inherit;\n  min-width: -moz-fit-content;\n  min-width: fit-content;\n  height: -moz-fit-content;\n  height: fit-content;\n  min-height: 100%;\n\n  ::slotted(svg) {\n    fill: var(--ic-card-icon);\n  }\n  &.monochrome {\n    border: var(--ic-border-width) solid var(--ic-card-border-monochrome);\n  }\n  &.fullwidth {\n    width: 100%;\n  }\n  &.clickable {\n    &:hover {\n      background-color: var(--ic-card-background-hover);\n      border: var(--ic-space-1px) solid var(--ic-card-hover-border-color);\n      cursor: pointer;\n    }\n    &.focussed,\n    &:focus {\n      background-color: var(--ic-card-background-hover);\n      box-shadow: var(--ic-border-focus);\n      outline: var(--ic-hc-focus-outline);\n      border: var(--ic-space-1px) solid var(--ic-card-pressed-border-color);\n    }\n    &:active {\n      background-color: var(--ic-card-background-pressed);\n      box-shadow: var(--ic-border-focus);\n\n      .card-title {\n        text-decoration: none;\n      }\n    }\n    .card-title {\n      --ic-typography-color: var(--ic-card-clickable-text);\n\n      color: var(--ic-card-clickable-text);\n      text-decoration: underline;\n      text-decoration-thickness: var(--ic-space-1px);\n    }\n  }\n  &.disabled {\n    border: var(--ic-space-1px) dashed var(--ic-card-disabled-border-color);\n\n    .card-message,\n    .subheading,\n    .card-title {\n      --ic-typography-color: var(--ic-card-disabled-text);\n    }\n    .card-title {\n      text-decoration: underline;\n      text-decoration-thickness: var(--ic-space-1px);\n      text-decoration-color: var(--ic-card-disabled-text);\n      color: var(--ic-card-disabled-text);\n    }\n    ::slotted(svg) {\n      fill: var(--ic-card-disabled-text);\n    }\n  }\n}\n\n.card-header {\n  display: flex;\n  align-items: center;\n}\n\n.icon {\n  display: flex;\n  align-items: center;\n  padding-right: var(--ic-space-xs);\n}\n\n.card.clickable:hover .card-title,\n.card.clickable:focus .card-title,\n.card.clickable.focussed .card-title {\n  display: inline-block;\n  border-bottom: 0.25rem solid !important;\n  margin-bottom: -0.25rem !important;\n  text-decoration: none;\n}\n\n@supports (text-underline-offset: 25%) {\n  .card.clickable:hover .card-title,\n  .card.clickable:focus .card-title,\n  .card.clickable.focussed .card-title {\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.subheading {\n  margin-top: var(--ic-space-xxs);\n}\n\n.adornment {\n  margin-top: var(--ic-space-xxs);\n}\n\n.card-message {\n  margin-top: var(--ic-space-md);\n  align-items: left;\n}\n\n.interaction-button {\n  margin-left: auto;\n}\n\n.image-top {\n  margin-bottom: var(--ic-space-md);\n  display: flex;\n  justify-content: center;\n}\n\n.image-mid {\n  margin-top: var(--ic-space-md);\n  display: flex;\n  justify-content: center;\n}\n\n.interaction-area {\n  display: flex;\n  flex-grow: 1;\n  gap: var(--ic-space-md);\n  margin-top: var(--ic-space-md);\n  align-items: flex-end;\n}\n\n.interaction-controls {\n  display: flex;\n  align-items: center;\n  flex-wrap: wrap;\n  gap: var(--ic-space-sm);\n}\n\n.toggle-button {\n  width: 2.5rem;\n  height: 2.5rem;\n  padding: var(--ic-space-xs);\n  margin: var(--ic-space-1px) 0;\n  min-width: 0;\n  cursor: pointer;\n  transition: var(--ic-easing-transition-fast);\n  border-radius: var(--ic-border-radius);\n  display: inline-flex;\n  flex-direction: row;\n  justify-content: center;\n  align-items: center;\n  background: none;\n  border: none;\n  box-sizing: border-box;\n  white-space: nowrap;\n  vertical-align: middle;\n\n  &:hover {\n    background-color: var(--ic-card-background-hover);\n  }\n  &:focus {\n    box-shadow: var(--ic-border-focus);\n  }\n  &:active:not(:focus) {\n    background-color: var(--ic-card-background-pressed);\n  }\n\n  svg {\n    pointer-events: none;\n    width: 100% !important;\n    height: 100% !important;\n    fill: currentcolor !important;\n  }\n}\n\n#ic-tooltip-expand-button {\n  margin-left: auto;\n  position: relative;\n}\n\n.toggle-button-closed svg {\n  transform: rotate(90deg);\n}\n\n.toggle-button-expanded svg {\n  transform: rotate(-90deg);\n}\n\n.expanded-content {\n  margin-top: var(--ic-space-md);\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n  .card {\n    ::slotted(svg) {\n      fill: currentcolor;\n    }\n    &.disabled {\n      border-color: GrayText !important;\n\n      ::slotted(svg) {\n        fill: GrayText !important;\n      }\n      .card-message,\n      .subheading,\n      .card-title {\n        color: GrayText;\n\n        --ic-typography-color: GrayText;\n      }\n    }\n  }\n}\n";
@@ -21,23 +21,6 @@ const CardVertical = class {
         this.toggleExpanded = () => {
             this.areaExpanded = !this.areaExpanded;
         };
-        this.hostMutationCallback = (mutationList) => {
-            if (mutationList.some(({ type, addedNodes, removedNodes }) => type === "childList"
-                ? helpers.checkSlotInChildMutations(addedNodes, removedNodes, [
-                    "message",
-                    "adornment",
-                    "expanded-content",
-                    "image-top",
-                    "image-mid",
-                    "icon",
-                    "interaction-button",
-                    "badge",
-                    "interaction-controls",
-                ])
-                : false)) {
-                index.forceUpdate(this);
-            }
-        };
         this.areaExpanded = false;
         this.isFocussed = false;
         this.monochrome = false;
@@ -83,7 +66,17 @@ const CardVertical = class {
         !helpers.isSlotUsed(this.el, "heading") &&
             helpers.onComponentRequiredPropUndefined([{ prop: this.heading, propName: "heading" }], "Card");
         this.updateTheme();
-        this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);
+        this.hostMutationObserver = new MutationObserver((mutationList) => helpers.renderDynamicChildSlots(mutationList, [
+            "message",
+            "adornment",
+            "expanded-content",
+            "image-top",
+            "image-mid",
+            "icon",
+            "interaction-button",
+            "badge",
+            "interaction-controls",
+        ], this));
         this.hostMutationObserver.observe(this.el, {
             childList: true,
         });

package/dist/cjs/ic-card-vertical.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-card-vertical.entry.cjs.js","mappings":"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","names":["checkSlotInChildMutations","forceUpdate","removeDisabledFalse","isSlotUsed","onComponentRequiredPropUndefined","getBrandFromContext","IcBrandForegroundEnum","h","Host","chevronIcon"],"sources":["src/components/ic-card-vertical/ic-card-vertical.css?tag=ic-card-vertical&encapsulation=shadow","src/components/ic-card-vertical/ic-card-vertical.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: flex;\n}\n\na {\n text-decoration: none !important;\n color: var(--ic-card-text-primary) !important;\n}\n\na:visited {\n color: var(--ic-card-link-action-dark) !important;\n}\n\nbutton {\n border: none;\n background-color: transparent;\n outline: var(--ic-hc-focus-outline);\n}\n\n.card {\n display: flex;\n flex-direction: column;\n border: var(--ic-space-1px) solid var(--ic-card-border-primary);\n border-radius: var(--ic-border-radius);\n box-sizing: border-box;\n padding: var(--ic-space-md);\n text-align: left;\n color: var(--ic-card-text-primary);\n transition: var(--ic-easing-transition-fast);\n position: relative;\n width: inherit;\n min-width: fit-content;\n height: fit-content;\n min-height: 100%;\n\n ::slotted(svg) {\n fill: var(--ic-card-icon);\n }\n &.monochrome {\n border: var(--ic-border-width) solid var(--ic-card-border-monochrome);\n }\n &.fullwidth {\n width: 100%;\n }\n &.clickable {\n &:hover {\n background-color: var(--ic-card-background-hover);\n border: var(--ic-space-1px) solid var(--ic-card-hover-border-color);\n cursor: pointer;\n }\n &.focussed,\n &:focus {\n background-color: var(--ic-card-background-hover);\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n border: var(--ic-space-1px) solid var(--ic-card-pressed-border-color);\n }\n &:active {\n background-color: var(--ic-card-background-pressed);\n box-shadow: var(--ic-border-focus);\n\n .card-title {\n text-decoration: none;\n }\n }\n .card-title {\n --ic-typography-color: var(--ic-card-clickable-text);\n\n color: var(--ic-card-clickable-text);\n text-decoration: underline;\n text-decoration-thickness: var(--ic-space-1px);\n }\n }\n &.disabled {\n border: var(--ic-space-1px) dashed var(--ic-card-disabled-border-color);\n\n .card-message,\n .subheading,\n .card-title {\n --ic-typography-color: var(--ic-card-disabled-text);\n }\n .card-title {\n text-decoration: underline;\n text-decoration-thickness: var(--ic-space-1px);\n text-decoration-color: var(--ic-card-disabled-text);\n color: var(--ic-card-disabled-text);\n }\n ::slotted(svg) {\n fill: var(--ic-card-disabled-text);\n }\n }\n}\n\n.card-header {\n display: flex;\n align-items: center;\n}\n\n.icon {\n display: flex;\n align-items: center;\n padding-right: var(--ic-space-xs);\n}\n\n.card.clickable:hover .card-title,\n.card.clickable:focus .card-title,\n.card.clickable.focussed .card-title {\n display: inline-block;\n border-bottom: 0.25rem solid !important;\n margin-bottom: -0.25rem !important;\n text-decoration: none;\n}\n\n@supports (text-underline-offset: 25%) {\n .card.clickable:hover .card-title,\n .card.clickable:focus .card-title,\n .card.clickable.focussed .card-title {\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.subheading {\n margin-top: var(--ic-space-xxs);\n}\n\n.adornment {\n margin-top: var(--ic-space-xxs);\n}\n\n.card-message {\n margin-top: var(--ic-space-md);\n align-items: left;\n}\n\n.interaction-button {\n margin-left: auto;\n}\n\n.image-top {\n margin-bottom: var(--ic-space-md);\n display: flex;\n justify-content: center;\n}\n\n.image-mid {\n margin-top: var(--ic-space-md);\n display: flex;\n justify-content: center;\n}\n\n.interaction-area {\n display: flex;\n flex-grow: 1;\n gap: var(--ic-space-md);\n margin-top: var(--ic-space-md);\n align-items: flex-end;\n}\n\n.interaction-controls {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: var(--ic-space-sm);\n}\n\n.toggle-button {\n width: 2.5rem;\n height: 2.5rem;\n padding: var(--ic-space-xs);\n margin: var(--ic-space-1px) 0;\n min-width: 0;\n cursor: pointer;\n transition: var(--ic-easing-transition-fast);\n border-radius: var(--ic-border-radius);\n display: inline-flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n background: none;\n border: none;\n box-sizing: border-box;\n white-space: nowrap;\n vertical-align: middle;\n\n &:hover {\n background-color: var(--ic-card-background-hover);\n }\n &:focus {\n box-shadow: var(--ic-border-focus);\n }\n &:active:not(:focus) {\n background-color: var(--ic-card-background-pressed);\n }\n\n svg {\n pointer-events: none;\n width: 100% !important;\n height: 100% !important;\n fill: currentcolor !important;\n }\n}\n\n#ic-tooltip-expand-button {\n margin-left: auto;\n position: relative;\n}\n\n.toggle-button-closed svg {\n transform: rotate(90deg);\n}\n\n.toggle-button-expanded svg {\n transform: rotate(-90deg);\n}\n\n.expanded-content {\n margin-top: var(--ic-space-md);\n}\n\n/ High Contrast /\n@media (forced-colors: active) {\n .card {\n ::slotted(svg) {\n fill: currentcolor;\n }\n &.disabled {\n border-color: GrayText !important;\n\n ::slotted(svg) {\n fill: GrayText !important;\n }\n .card-message,\n .subheading,\n .card-title {\n color: GrayText;\n\n --ic-typography-color: GrayText;\n }\n }\n }\n}\n","import {\n Component,\n Element,\n Listen,\n Prop,\n State,\n h,\n Method,\n forceUpdate,\n Host,\n Watch,\n} from \"@stencil/core\";\nimport {\n onComponentRequiredPropUndefined,\n isSlotUsed,\n getBrandFromContext,\n removeDisabledFalse,\n checkSlotInChildMutations,\n} from \"../../utils/helpers\";\nimport {\n IcBrand,\n IcBrandForeground,\n IcBrandForegroundEnum,\n IcThemeMode,\n} from \"../../utils/types\";\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\n\n/*\n @slot heading - Content will be placed at the top of the card to the right of the icon.\n * @slot message - Content will be placed in the main body of the card.\n * @slot subheading - Content will be placed below the card heading.\n * @slot adornment - Content will be placed below the card subheading.\n * @slot image-top - Content will be placed at the top of the card above all other content.\n * @slot image-mid - Content will be placed below the card heading section.\n * @slot icon - Content will be placed to the left of the card heading.\n * @slot interaction-button - Content will be placed in the top right corner of the heading section.\n * @slot interaction-controls - Content will be placed below the card message.\n * @slot expanded-content - Content will be placed below the interaction controls but will not initially be rendered.\n * @slot badge - Badge component overlaying the top right of the card.\n /\n@Component({\n tag: \"ic-card-vertical\",\n styleUrl: \"ic-card-vertical.css\",\n shadow: true,\n})\nexport class CardVertical {\n private hostMutationObserver: MutationObserver = null;\n\n @Element() el: HTMLIcCardVerticalElement;\n\n @State() areaExpanded: boolean = false;\n @State() isFocussed: boolean = false;\n @State() monochrome: boolean = false;\n @State() parentEl: HTMLElement \| null = null;\n @State() parentIsAnchorTag: boolean = false;\n\n /\n If `true`, the card will be a clickable variant, instead of static.\n /\n @Prop({ mutable: true }) clickable?: boolean = false;\n\n /\n If `true`, the card will be disabled if it is clickable.\n /\n @Prop() disabled?: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n If `true`, the card will have an expandable area and expansion toggle button.\n /\n @Prop() expandable?: boolean = false;\n\n /\n If `true`, the card will fill the width of the container.\n /\n @Prop() fullWidth?: boolean = false;\n\n /\n The heading for the card. This is required, unless a slotted heading is used.\n /\n @Prop() heading?: string;\n\n /\n The URL that the clickable card link points to. If set, the clickable card will render as an \"a\" tag, otherwise it will render as a button.\n /\n @Prop() href?: string;\n\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string = \"\";\n\n /\n The main body message of the card.\n /\n @Prop() message?: 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 subheading for the card.\n /\n @Prop() subheading?: 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 Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n /\n @Prop({ mutable: true }) theme?: IcThemeMode = \"inherit\";\n\n disconnectedCallback(): void {\n if (this.parentIsAnchorTag) {\n this.parentEl.removeEventListener(\"focus\", this.parentFocussed);\n this.parentEl.removeEventListener(\"blur\", this.parentBlurred);\n }\n\n this.hostMutationObserver?.disconnect();\n }\n\n componentWillLoad(): void {\n this.parentEl = this.el.parentElement;\n\n if (this.parentEl.tagName === \"A\") {\n this.clickable = true;\n this.parentIsAnchorTag = true;\n this.parentEl.classList.add(\"ic-card-wrapper-link\");\n this.parentEl.addEventListener(\"focus\", this.parentFocussed);\n this.parentEl.addEventListener(\"blur\", this.parentBlurred);\n }\n removeDisabledFalse(this.disabled, this.el);\n }\n\n componentDidLoad(): void {\n !isSlotUsed(this.el, \"heading\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.heading, propName: \"heading\" }],\n \"Card\"\n );\n this.updateTheme();\n\n this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (this.disabled) {\n event.stopImmediatePropagation();\n }\n }\n\n @Listen(\"brandChange\", { target: \"document\" })\n brandChangeHandler(ev: CustomEvent<IcBrand>): void {\n this.updateTheme(ev.detail.mode);\n }\n\n /\n Sets focus on the card.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.el.shadowRoot.querySelector(\"a\")) {\n this.el.shadowRoot.querySelector(\"a\").focus();\n } else if (this.el.shadowRoot.querySelector(\"button\")) {\n this.el.shadowRoot.querySelector(\"button\").focus();\n }\n }\n\n private parentFocussed = (): void => {\n this.isFocussed = true;\n };\n\n private parentBlurred = (): void => {\n this.isFocussed = false;\n };\n\n private updateTheme(mode: IcBrandForeground = null): void {\n const foregroundColor = getBrandFromContext(this.el, mode);\n\n if (foregroundColor !== IcBrandForegroundEnum.Default) {\n this.monochrome = true;\n this.theme =\n foregroundColor === IcBrandForegroundEnum.Light\n ? IcBrandForegroundEnum.Dark\n : IcBrandForegroundEnum.Light;\n }\n }\n\n private toggleExpanded = (): void => {\n this.areaExpanded = !this.areaExpanded;\n };\n\n private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n if (\n mutationList.some(({ type, addedNodes, removedNodes }) =>\n type === \"childList\"\n ? checkSlotInChildMutations(addedNodes, removedNodes, [\n \"message\",\n \"adornment\",\n \"expanded-content\",\n \"image-top\",\n \"image-mid\",\n \"icon\",\n \"interaction-button\",\n \"badge\",\n \"interaction-controls\",\n ])\n : false\n )\n ) {\n forceUpdate(this);\n }\n };\n\n render() {\n const {\n clickable,\n disabled,\n expandable,\n fullWidth,\n heading,\n isFocussed,\n message,\n monochrome,\n href,\n hreflang,\n parentIsAnchorTag,\n referrerpolicy,\n rel,\n subheading,\n target,\n theme,\n } = this;\n\n const Component =\n parentIsAnchorTag \|\| !clickable\n ? \"div\"\n : href === undefined\n ? \"button\"\n : \"a\";\n\n const attrs = Component == \"a\" && {\n href: href,\n hrefLang: hreflang,\n referrerPolicy: referrerpolicy,\n rel: rel,\n target: target,\n };\n\n return (\n <Host\n class={{\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n <Component\n class={{\n card: true,\n clickable: clickable && !disabled,\n disabled,\n fullwidth: fullWidth,\n focussed: isFocussed,\n monochrome: monochrome,\n }}\n tabindex={clickable && !parentIsAnchorTag ? 0 : null}\n aria-disabled={disabled ? \"true\" : null}\n disabled={disabled ? true : null}\n {...attrs}\n >\n {isSlotUsed(this.el, \"image-top\") && (\n <div class=\"image-top\">\n <slot name=\"image-top\"></slot>\n </div>\n )}\n <div class=\"card-header\">\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon\">\n <slot name=\"icon\" />\n </div>\n )}\n <div class=\"card-title\">\n <slot name=\"heading\">\n <ic-typography variant=\"h4\">\n <p>{heading}</p>\n </ic-typography>\n </slot>\n </div>\n {isSlotUsed(this.el, \"interaction-button\") && (\n <div class=\"interaction-button\">\n <slot name=\"interaction-button\"></slot>\n </div>\n )}\n </div>\n {(subheading \|\| isSlotUsed(this.el, \"subheading\")) && (\n <div class=\"subheading\">\n <slot name=\"subheading\">\n <ic-typography variant=\"subtitle-small\">\n {subheading}\n </ic-typography>\n </slot>\n </div>\n )}\n {isSlotUsed(this.el, \"adornment\") && (\n <div class=\"adornment\">\n <slot name=\"adornment\"></slot>\n </div>\n )}\n {isSlotUsed(this.el, \"image-mid\") && (\n <div class=\"image-mid\">\n <slot name=\"image-mid\"></slot>\n </div>\n )}\n {(message \|\| isSlotUsed(this.el, \"message\")) && (\n <div class=\"card-message\">\n {message && (\n <ic-typography variant=\"body\">{message}</ic-typography>\n )}\n {isSlotUsed(this.el, \"message\") && <slot name=\"message\"></slot>}\n </div>\n )}\n {(isSlotUsed(this.el, \"interaction-controls\") \|\| expandable) && (\n <div class=\"interaction-area\">\n <div class=\"interaction-controls\">\n <slot name=\"interaction-controls\"></slot>\n </div>\n {expandable && (\n <ic-tooltip\n id=\"ic-tooltip-expand-button\"\n label=\"Toggle expandable area\"\n silent\n >\n <button\n class={{\n \"toggle-button\": true,\n [`toggle-button-${\n this.areaExpanded ? \"expanded\" : \"closed\"\n }`]: true,\n }}\n aria-label=\"Toggle expandable area\"\n aria-expanded={`${this.areaExpanded}`}\n aria-controls={\n this.areaExpanded ? \"expanded-content-area\" : null\n }\n onClick={this.toggleExpanded}\n innerHTML={chevronIcon}\n ></button>\n </ic-tooltip>\n )}\n </div>\n )}\n {isSlotUsed(this.el, \"expanded-content\") && this.areaExpanded && (\n <div class=\"expanded-content\" id=\"expanded-content-area\">\n <slot name=\"expanded-content\"></slot>\n </div>\n )}\n {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n </Component>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-card-vertical.entry.cjs.js","mappings":"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","names":["removeDisabledFalse","isSlotUsed","onComponentRequiredPropUndefined","renderDynamicChildSlots","getBrandFromContext","IcBrandForegroundEnum","h","Host","chevronIcon"],"sources":["src/components/ic-card-vertical/ic-card-vertical.css?tag=ic-card-vertical&encapsulation=shadow","src/components/ic-card-vertical/ic-card-vertical.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n display: flex;\n}\n\na {\n text-decoration: none !important;\n color: var(--ic-card-text-primary) !important;\n}\n\na:visited {\n color: var(--ic-card-link-action-dark) !important;\n}\n\nbutton {\n border: none;\n background-color: transparent;\n outline: var(--ic-hc-focus-outline);\n}\n\n.card {\n display: flex;\n flex-direction: column;\n border: var(--ic-space-1px) solid var(--ic-card-border-primary);\n border-radius: var(--ic-border-radius);\n box-sizing: border-box;\n padding: var(--ic-space-md);\n text-align: left;\n color: var(--ic-card-text-primary);\n transition: var(--ic-easing-transition-fast);\n position: relative;\n width: inherit;\n min-width: fit-content;\n height: fit-content;\n min-height: 100%;\n\n ::slotted(svg) {\n fill: var(--ic-card-icon);\n }\n &.monochrome {\n border: var(--ic-border-width) solid var(--ic-card-border-monochrome);\n }\n &.fullwidth {\n width: 100%;\n }\n &.clickable {\n &:hover {\n background-color: var(--ic-card-background-hover);\n border: var(--ic-space-1px) solid var(--ic-card-hover-border-color);\n cursor: pointer;\n }\n &.focussed,\n &:focus {\n background-color: var(--ic-card-background-hover);\n box-shadow: var(--ic-border-focus);\n outline: var(--ic-hc-focus-outline);\n border: var(--ic-space-1px) solid var(--ic-card-pressed-border-color);\n }\n &:active {\n background-color: var(--ic-card-background-pressed);\n box-shadow: var(--ic-border-focus);\n\n .card-title {\n text-decoration: none;\n }\n }\n .card-title {\n --ic-typography-color: var(--ic-card-clickable-text);\n\n color: var(--ic-card-clickable-text);\n text-decoration: underline;\n text-decoration-thickness: var(--ic-space-1px);\n }\n }\n &.disabled {\n border: var(--ic-space-1px) dashed var(--ic-card-disabled-border-color);\n\n .card-message,\n .subheading,\n .card-title {\n --ic-typography-color: var(--ic-card-disabled-text);\n }\n .card-title {\n text-decoration: underline;\n text-decoration-thickness: var(--ic-space-1px);\n text-decoration-color: var(--ic-card-disabled-text);\n color: var(--ic-card-disabled-text);\n }\n ::slotted(svg) {\n fill: var(--ic-card-disabled-text);\n }\n }\n}\n\n.card-header {\n display: flex;\n align-items: center;\n}\n\n.icon {\n display: flex;\n align-items: center;\n padding-right: var(--ic-space-xs);\n}\n\n.card.clickable:hover .card-title,\n.card.clickable:focus .card-title,\n.card.clickable.focussed .card-title {\n display: inline-block;\n border-bottom: 0.25rem solid !important;\n margin-bottom: -0.25rem !important;\n text-decoration: none;\n}\n\n@supports (text-underline-offset: 25%) {\n .card.clickable:hover .card-title,\n .card.clickable:focus .card-title,\n .card.clickable.focussed .card-title {\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.subheading {\n margin-top: var(--ic-space-xxs);\n}\n\n.adornment {\n margin-top: var(--ic-space-xxs);\n}\n\n.card-message {\n margin-top: var(--ic-space-md);\n align-items: left;\n}\n\n.interaction-button {\n margin-left: auto;\n}\n\n.image-top {\n margin-bottom: var(--ic-space-md);\n display: flex;\n justify-content: center;\n}\n\n.image-mid {\n margin-top: var(--ic-space-md);\n display: flex;\n justify-content: center;\n}\n\n.interaction-area {\n display: flex;\n flex-grow: 1;\n gap: var(--ic-space-md);\n margin-top: var(--ic-space-md);\n align-items: flex-end;\n}\n\n.interaction-controls {\n display: flex;\n align-items: center;\n flex-wrap: wrap;\n gap: var(--ic-space-sm);\n}\n\n.toggle-button {\n width: 2.5rem;\n height: 2.5rem;\n padding: var(--ic-space-xs);\n margin: var(--ic-space-1px) 0;\n min-width: 0;\n cursor: pointer;\n transition: var(--ic-easing-transition-fast);\n border-radius: var(--ic-border-radius);\n display: inline-flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n background: none;\n border: none;\n box-sizing: border-box;\n white-space: nowrap;\n vertical-align: middle;\n\n &:hover {\n background-color: var(--ic-card-background-hover);\n }\n &:focus {\n box-shadow: var(--ic-border-focus);\n }\n &:active:not(:focus) {\n background-color: var(--ic-card-background-pressed);\n }\n\n svg {\n pointer-events: none;\n width: 100% !important;\n height: 100% !important;\n fill: currentcolor !important;\n }\n}\n\n#ic-tooltip-expand-button {\n margin-left: auto;\n position: relative;\n}\n\n.toggle-button-closed svg {\n transform: rotate(90deg);\n}\n\n.toggle-button-expanded svg {\n transform: rotate(-90deg);\n}\n\n.expanded-content {\n margin-top: var(--ic-space-md);\n}\n\n/ High Contrast /\n@media (forced-colors: active) {\n .card {\n ::slotted(svg) {\n fill: currentcolor;\n }\n &.disabled {\n border-color: GrayText !important;\n\n ::slotted(svg) {\n fill: GrayText !important;\n }\n .card-message,\n .subheading,\n .card-title {\n color: GrayText;\n\n --ic-typography-color: GrayText;\n }\n }\n }\n}\n","import {\n Component,\n Element,\n Listen,\n Prop,\n State,\n h,\n Method,\n Host,\n Watch,\n} from \"@stencil/core\";\nimport {\n onComponentRequiredPropUndefined,\n isSlotUsed,\n getBrandFromContext,\n removeDisabledFalse,\n renderDynamicChildSlots,\n} from \"../../utils/helpers\";\nimport {\n IcBrand,\n IcBrandForeground,\n IcBrandForegroundEnum,\n IcThemeMode,\n} from \"../../utils/types\";\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\n\n/*\n @slot heading - Content will be placed at the top of the card to the right of the icon.\n * @slot message - Content will be placed in the main body of the card.\n * @slot subheading - Content will be placed below the card heading.\n * @slot adornment - Content will be placed below the card subheading.\n * @slot image-top - Content will be placed at the top of the card above all other content.\n * @slot image-mid - Content will be placed below the card heading section.\n * @slot icon - Content will be placed to the left of the card heading.\n * @slot interaction-button - Content will be placed in the top right corner of the heading section.\n * @slot interaction-controls - Content will be placed below the card message.\n * @slot expanded-content - Content will be placed below the interaction controls but will not initially be rendered.\n * @slot badge - Badge component overlaying the top right of the card.\n /\n@Component({\n tag: \"ic-card-vertical\",\n styleUrl: \"ic-card-vertical.css\",\n shadow: true,\n})\nexport class CardVertical {\n private hostMutationObserver: MutationObserver = null;\n\n @Element() el: HTMLIcCardVerticalElement;\n\n @State() areaExpanded: boolean = false;\n @State() isFocussed: boolean = false;\n @State() monochrome: boolean = false;\n @State() parentEl: HTMLElement \| null = null;\n @State() parentIsAnchorTag: boolean = false;\n\n /\n If `true`, the card will be a clickable variant, instead of static.\n /\n @Prop({ mutable: true }) clickable?: boolean = false;\n\n /\n If `true`, the card will be disabled if it is clickable.\n /\n @Prop() disabled?: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n If `true`, the card will have an expandable area and expansion toggle button.\n /\n @Prop() expandable?: boolean = false;\n\n /\n If `true`, the card will fill the width of the container.\n /\n @Prop() fullWidth?: boolean = false;\n\n /\n The heading for the card. This is required, unless a slotted heading is used.\n /\n @Prop() heading?: string;\n\n /\n The URL that the clickable card link points to. If set, the clickable card will render as an \"a\" tag, otherwise it will render as a button.\n /\n @Prop() href?: string;\n\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string = \"\";\n\n /\n The main body message of the card.\n /\n @Prop() message?: 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 subheading for the card.\n /\n @Prop() subheading?: 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 Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n /\n @Prop({ mutable: true }) theme?: IcThemeMode = \"inherit\";\n\n disconnectedCallback(): void {\n if (this.parentIsAnchorTag) {\n this.parentEl.removeEventListener(\"focus\", this.parentFocussed);\n this.parentEl.removeEventListener(\"blur\", this.parentBlurred);\n }\n\n this.hostMutationObserver?.disconnect();\n }\n\n componentWillLoad(): void {\n this.parentEl = this.el.parentElement;\n\n if (this.parentEl.tagName === \"A\") {\n this.clickable = true;\n this.parentIsAnchorTag = true;\n this.parentEl.classList.add(\"ic-card-wrapper-link\");\n this.parentEl.addEventListener(\"focus\", this.parentFocussed);\n this.parentEl.addEventListener(\"blur\", this.parentBlurred);\n }\n removeDisabledFalse(this.disabled, this.el);\n }\n\n componentDidLoad(): void {\n !isSlotUsed(this.el, \"heading\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.heading, propName: \"heading\" }],\n \"Card\"\n );\n this.updateTheme();\n\n this.hostMutationObserver = new MutationObserver((mutationList) =>\n renderDynamicChildSlots(\n mutationList,\n [\n \"message\",\n \"adornment\",\n \"expanded-content\",\n \"image-top\",\n \"image-mid\",\n \"icon\",\n \"interaction-button\",\n \"badge\",\n \"interaction-controls\",\n ],\n this\n )\n );\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (this.disabled) {\n event.stopImmediatePropagation();\n }\n }\n\n @Listen(\"brandChange\", { target: \"document\" })\n brandChangeHandler(ev: CustomEvent<IcBrand>): void {\n this.updateTheme(ev.detail.mode);\n }\n\n /\n Sets focus on the card.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.el.shadowRoot.querySelector(\"a\")) {\n this.el.shadowRoot.querySelector(\"a\").focus();\n } else if (this.el.shadowRoot.querySelector(\"button\")) {\n this.el.shadowRoot.querySelector(\"button\").focus();\n }\n }\n\n private parentFocussed = (): void => {\n this.isFocussed = true;\n };\n\n private parentBlurred = (): void => {\n this.isFocussed = false;\n };\n\n private updateTheme(mode: IcBrandForeground = null): void {\n const foregroundColor = getBrandFromContext(this.el, mode);\n\n if (foregroundColor !== IcBrandForegroundEnum.Default) {\n this.monochrome = true;\n this.theme =\n foregroundColor === IcBrandForegroundEnum.Light\n ? IcBrandForegroundEnum.Dark\n : IcBrandForegroundEnum.Light;\n }\n }\n\n private toggleExpanded = (): void => {\n this.areaExpanded = !this.areaExpanded;\n };\n\n render() {\n const {\n clickable,\n disabled,\n expandable,\n fullWidth,\n heading,\n isFocussed,\n message,\n monochrome,\n href,\n hreflang,\n parentIsAnchorTag,\n referrerpolicy,\n rel,\n subheading,\n target,\n theme,\n } = this;\n\n const Component =\n parentIsAnchorTag \|\| !clickable\n ? \"div\"\n : href === undefined\n ? \"button\"\n : \"a\";\n\n const attrs = Component == \"a\" && {\n href: href,\n hrefLang: hreflang,\n referrerPolicy: referrerpolicy,\n rel: rel,\n target: target,\n };\n\n return (\n <Host\n class={{\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n <Component\n class={{\n card: true,\n clickable: clickable && !disabled,\n disabled,\n fullwidth: fullWidth,\n focussed: isFocussed,\n monochrome: monochrome,\n }}\n tabindex={clickable && !parentIsAnchorTag ? 0 : null}\n aria-disabled={disabled ? \"true\" : null}\n disabled={disabled ? true : null}\n {...attrs}\n >\n {isSlotUsed(this.el, \"image-top\") && (\n <div class=\"image-top\">\n <slot name=\"image-top\"></slot>\n </div>\n )}\n <div class=\"card-header\">\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon\">\n <slot name=\"icon\" />\n </div>\n )}\n <div class=\"card-title\">\n <slot name=\"heading\">\n <ic-typography variant=\"h4\">\n <p>{heading}</p>\n </ic-typography>\n </slot>\n </div>\n {isSlotUsed(this.el, \"interaction-button\") && (\n <div class=\"interaction-button\">\n <slot name=\"interaction-button\"></slot>\n </div>\n )}\n </div>\n {(subheading \|\| isSlotUsed(this.el, \"subheading\")) && (\n <div class=\"subheading\">\n <slot name=\"subheading\">\n <ic-typography variant=\"subtitle-small\">\n {subheading}\n </ic-typography>\n </slot>\n </div>\n )}\n {isSlotUsed(this.el, \"adornment\") && (\n <div class=\"adornment\">\n <slot name=\"adornment\"></slot>\n </div>\n )}\n {isSlotUsed(this.el, \"image-mid\") && (\n <div class=\"image-mid\">\n <slot name=\"image-mid\"></slot>\n </div>\n )}\n {(message \|\| isSlotUsed(this.el, \"message\")) && (\n <div class=\"card-message\">\n {message && (\n <ic-typography variant=\"body\">{message}</ic-typography>\n )}\n {isSlotUsed(this.el, \"message\") && <slot name=\"message\"></slot>}\n </div>\n )}\n {(isSlotUsed(this.el, \"interaction-controls\") \|\| expandable) && (\n <div class=\"interaction-area\">\n <div class=\"interaction-controls\">\n <slot name=\"interaction-controls\"></slot>\n </div>\n {expandable && (\n <ic-tooltip\n id=\"ic-tooltip-expand-button\"\n label=\"Toggle expandable area\"\n silent\n >\n <button\n class={{\n \"toggle-button\": true,\n [`toggle-button-${\n this.areaExpanded ? \"expanded\" : \"closed\"\n }`]: true,\n }}\n aria-label=\"Toggle expandable area\"\n aria-expanded={`${this.areaExpanded}`}\n aria-controls={\n this.areaExpanded ? \"expanded-content-area\" : null\n }\n onClick={this.toggleExpanded}\n innerHTML={chevronIcon}\n ></button>\n </ic-tooltip>\n )}\n </div>\n )}\n {isSlotUsed(this.el, \"expanded-content\") && this.areaExpanded && (\n <div class=\"expanded-content\" id=\"expanded-content-area\">\n <slot name=\"expanded-content\"></slot>\n </div>\n )}\n {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n </Component>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/cjs/ic-checkbox-group.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-f982899d.js');
-const helpers = require('./helpers-dd569d97.js');
+const helpers = require('./helpers-8ca38600.js');
 const icCheckboxGroupCss = "/*! 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;--ic-input-label-text-color:var(--ic-checkbox-group-label);--ic-input-label-helper-text-color:var(--ic-checkbox-group-subtitle);--ic-input-validation-error:var(--ic-checkbox-state-icon-error);--ic-input-validation-status-text-color:var(--ic-checkbox-state-text)}:host(.ic-checkbox-group-disabled){--ic-input-label-text-color:var(--ic-checkbox-group-label-disabled);--ic-input-label-helper-text-color:var(\n    --ic-checkbox-group-subtitle-disabled\n  )}ic-input-label.error{color:var(--ic-checkbox-group-label-error);--ic-typography-color:var(--ic-checkbox-group-label-error);--ic-input-label-helper-text-color:var(--ic-checkbox-group-subtitle-error)}ic-input-label ic-typography{margin-bottom:var(--ic-space-sm)}:host(.ic-checkbox-group-small) ic-input-label ic-typography{margin-bottom:calc(var(--ic-space-sm) / 2)}ic-input-validation{margin-top:var(--ic-space-sm)}:host(.ic-checkbox-group-small) ic-input-validation{margin-top:calc(var(--ic-space-sm) / 2)}.checkboxes-container{margin-bottom:calc(-1 * var(--ic-space-xxs))}:host(.ic-checkbox-group-small) .checkboxes-container{margin-bottom:calc(-1 * var(--ic-space-xxxs))}.screen-reader-only-text{position:absolute;left:-9999px;background-color:#fff;color:#000;text-transform:none}";

package/dist/cjs/ic-checkbox.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-f982899d.js');
-const helpers = require('./helpers-dd569d97.js');
+const helpers = require('./helpers-8ca38600.js');
 const icCheckboxCss = "/*! 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(.ic-checkbox-disabled){pointer-events:none}.container{display:flex;width:-moz-fit-content;width:fit-content;padding:var(--ic-space-xxs) 0 var(--ic-space-xxs) var(--ic-space-xxs);margin-bottom:var(--ic-space-xxs);align-items:center}:host(.ic-checkbox-small) .container{margin-bottom:var(--ic-space-xxxs)}.checkbox{-webkit-appearance:none;-moz-appearance:none;appearance:none;display:block;position:relative;top:0;left:0;height:var(--ic-space-lg);width:var(--ic-space-lg);background-color:var(--ic-checkbox-background-unselected);border:var(--ic-border-width) solid var(--ic-checkbox-border-unselected);border-radius:var(--ic-border-radius);outline:none;cursor:pointer;transition:var(--ic-easing-transition-fast);flex-shrink:0}:host .container svg{width:var(--ic-space-lg);height:var(--ic-space-lg)}:host(.ic-checkbox-small) .checkbox,:host(.ic-checkbox-small) .container svg{width:var(--ic-space-md);height:var(--ic-space-md)}:host(.ic-checkbox-large) .checkbox,:host(.ic-checkbox-large) .container svg{width:var(--ic-space-xl);height:var(--ic-space-xl)}.checkbox:checked{background-color:var(--ic-checkbox-background-selected);border:var(--ic-border-width) solid var(--ic-checkbox-background-selected);transition:var(--ic-easing-transition-slow)}.checkbox:checked:disabled{background-color:var(--ic-checkbox-background-selected-disabled);border:var(--ic-border-width) solid\n    var(--ic-checkbox-background-selected-disabled)}.checkbox:indeterminate,.checkbox.indeterminate:checked{background-color:var(--ic-checkbox-background-indeterminate);border:0.125rem solid var(--ic-checkbox-background-indeterminate)}.checkbox:indeterminate:disabled,.checkbox.indeterminate:checked:disabled{background-color:var(--ic-checkbox-background-indeterminate-disabled);border:0.125rem solid var(--ic-checkbox-background-indeterminate-disabled)}.checkbox:checked:hover{background-color:var(--ic-checkbox-background-selected-hover)}.checkbox:indeterminate:hover,.checkbox.indeterminate:checked:hover{background-color:var(--ic-checkbox-background-indeterminate-hover);border:0.125rem solid var(--ic-checkbox-background-indeterminate-hover)}.checkbox:checked:active{background-color:var(--ic-checkbox-background-selected-pressed)}.checkbox:indeterminate:active,.checkbox.indeterminate:checked:active{background-color:var(--ic-checkbox-background-indeterminate-pressed);border:0.125rem solid var(--ic-checkbox-background-indeterminate-pressed)}.checkbox:hover{box-shadow:0 0 0 0.25rem var(--ic-checkbox-action-background-hover);border:var(--ic-border-width) solid\n    var(--ic-checkbox-border-unselected-hover)}.checkbox:active{box-shadow:0 0 0 0.25rem var(--ic-checkbox-action-background-pressed);border:var(--ic-border-width) solid\n    var(--ic-checkbox-border-unselected-pressed)}.checkbox:focus{box-shadow:var(--ic-border-focus)}.checkbox:disabled{border:var(--ic-border-width) dashed\n    var(--ic-checkbox-border-unselected-disabled)}.checkbox-label{padding-left:var(--ic-space-sm);color:var(--ic-checkbox-text);--ic-typography-color:var(--ic-checkbox-text)}:host(.ic-checkbox-disabled) .checkbox-label{color:var(--ic-checkbox-text-disabled);--ic-typography-color:var(--ic-checkbox-text-disabled)}.checkbox-label:hover{cursor:pointer}.checkmark{position:relative;right:calc(-1 * var(--ic-space-lg));margin-left:calc(-1 * var(--ic-space-lg));fill:var(--ic-checkbox-icon-pressed);z-index:1;background-color:transparent;pointer-events:none;flex-shrink:0}:host(.ic-checkbox-small) .checkmark{margin-left:calc(-1 * var(--ic-space-md));right:calc(-1 * var(--ic-space-md))}:host(.ic-checkbox-large) .checkmark{margin-left:calc(-1 * var(--ic-space-xl));right:calc(-1 * var(--ic-space-xl))}.indeterminate-symbol{position:relative;width:0.875rem;height:var(--ic-space-xxxs);right:-1.188rem;margin-left:-0.875rem;z-index:1;background-color:var(--ic-checkbox-icon-indeterminate);pointer-events:none;flex-shrink:0}:host(.ic-checkbox-small) .indeterminate-symbol{width:0.6rem;right:-0.8rem;margin-left:-0.6rem}:host(.ic-checkbox-large) .indeterminate-symbol{width:1.25rem;right:-1.625rem;margin-left:-1.25rem}.additional-field-wrapper{margin-left:calc(var(--ic-space-md) + var(--ic-space-lg));margin-top:calc(var(--ic-space-sm) / 2)}.branch-corner{height:var(--ic-space-md);width:var(--ic-space-xl);border-radius:0 0 0 0.188rem;border-bottom:0.125rem solid var(--ic-checkbox-required-bar);border-left:0.125rem solid var(--ic-checkbox-required-bar)}.dynamic-container{display:flex;position:relative;margin:var(--ic-space-xxxs) 0 var(--ic-space-xxs) var(--ic-space-md);gap:var(--ic-space-xs)}.dynamic-text{color:var(--ic-checkbox-required-text);--ic-typography-color:var(--ic-checkbox-required-text);margin-top:calc(var(--ic-space-sm) / 2);margin-bottom:var(--ic-space-xs);border-radius:2%}@media (max-width: 576px){::slotted(ic-text-field){--input-width:100%}}@media (forced-colors: active){.checkbox{-webkit-appearance:revert;-moz-appearance:revert;appearance:revert;transition:none}.checkbox:checked{transition:none}.checkbox:focus-visible{outline:0.125rem solid highlight}.checkbox:disabled:not(:checked){-webkit-appearance:none;-moz-appearance:none;appearance:none;border-color:GrayText}.checkmark{fill:none}.indeterminate-symbol{display:none}}";

package/dist/cjs/ic-chip.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-f982899d.js');
-const helpers = require('./helpers-dd569d97.js');
+const helpers = require('./helpers-8ca38600.js');
 const dismissIcon = `<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path d="M10 0C4.47 0 0 4.47 0 10C0 15.53 4.47 20 10 20C15.53 20 20 15.53 20 10C20 4.47 15.53 0 10 0ZM15 13.59L13.59 15L10 11.41L6.41 15L5 13.59L8.59 10L5 6.41L6.41 5L10 8.59L13.59 5L15 6.41L11.41 10L15 13.59Z" fill="currentColor"/>

package/dist/cjs/ic-data-row.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-f982899d.js');
-const helpers = require('./helpers-dd569d97.js');
+const helpers = require('./helpers-8ca38600.js');
 const icDataRowCss = "/*! 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:relative;display:block}.data{display:flex;align-items:center}.text-cells{display:flex;flex-grow:1;min-width:0;--ic-typography-color:var(--ic-data-list-text-cell)}.label{width:12.5rem;min-width:12.5rem;margin-right:var(--ic-space-md);--ic-typography-color:var(--ic-data-list-text-label)}.value{flex-grow:1}slot[name=\"value\"]::slotted(ic-text-field[readonly][hide-label]){margin-top:calc(var(--ic-space-xs) * -1)}slot[name=\"value\"]::slotted(ic-text-field[small][readonly][hide-label]){margin-top:calc(var(--ic-space-xxs) * -1)}slot[name=\"value\"]::slotted(ic-text-field[readonly][hide-label][rows]){margin-top:calc(var(--ic-space-xxs) * -1 - var(--ic-space-xxxs))}.end-component{width:-moz-fit-content;width:fit-content;margin-left:3.5rem}.divider{margin-top:var(--ic-space-md);height:var(--ic-border-width);background-color:var(--ic-data-list-keyline-cell)}:host(.ic-data-row-small) .divider{margin-top:var(--ic-space-xs)}:host(.breakpoint-medium) .label{width:10rem;min-width:10rem}:host(.breakpoint-xs) .text-cells{flex-direction:column}:host(.breakpoint-xs) .label{width:8rem;margin-bottom:var(--ic-space-xs)}:host(.breakpoint-xs) .value{max-width:95%}:host(.breakpoint-xs) .end-component{margin-left:0}@media (forced-colors: active){.divider{background-color:canvastext}}";

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

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-f982899d.js');
 const closeIcon = require('./close-icon-7f6ef8e4.js');
-const helpers = require('./helpers-dd569d97.js');
+const helpers = require('./helpers-8ca38600.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;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}:host(.ic-dialog-fade-in){opacity:1}:host(.disable-height-constraint){background:none;justify-content:unset;align-items:unset}.dialog.disable-height-constraint{max-height:none;position:relative}.dialog.disable-height-constraint .content-area{overflow-y:visible}@media (prefers-reduced-motion: no-preference){:host{transition:opacity var(--ic-easing-transition-slow)}.dialog{transform:translateY(-3rem);transition:transform 1000s}:host(.ic-dialog-fade-in) .dialog{transform:translateY(0);transition:transform var(--ic-easing-transition-slow)}}:host(.ic-dialog-hidden){display:none}.dialog{background-color:var(--ic-dialog-background);color:var(--ic-dialog-text-primary);--ic-typography-color:var(--ic-dialog-text-primary);border:var(--ic-space-1px) solid var(--ic-dialog-border);border-radius:var(--ic-border-radius);padding:var(--ic-space-xs) 0 var(--ic-space-md);display:flex;flex-direction:column;box-sizing:border-box;overflow-x:visible}.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);padding:0 var(--ic-space-md)}.heading{overflow-wrap:break-word}.close-icon{margin-left:auto}.close-icon>svg{color:var(--ic-dialog-clear-button)}.content-area{-ms-overflow-style:none;scrollbar-width:none;padding:0 var(--ic-space-md);margin:0;overflow-y:auto}.content-area::-webkit-scrollbar{display:none}#dialog-content{margin-bottom:var(--ic-space-sm)}#dialog-content ::slotted(ic-typography){overflow-wrap:break-word}#dialog-content ::slotted(*){position:relative}.dialog-controls{margin-top:auto;padding:var(--ic-space-xs) var(--ic-space-md) 0;display:flex;justify-content:flex-end;gap:var(--ic-space-md)}.dialog-control-button{width:-moz-fit-content;width:fit-content}.backdrop{overflow-y:auto;position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgb(0 0 0 / 60%);z-index:var(--ic-z-index-dialog);padding-top:16px;padding-bottom:16px}.heading ic-typography{--ic-typography-color:var(--ic-dialog-text-primary)}.label ic-typography{--ic-typography-color:var(--ic-dialog-label)}@media (min-width: 800px){:host([size=\"large\"]) .dialog:not(.disable-width-constraint)>.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}.backdrop{padding:0}.dialog.disable-height-constraint{height:auto;min-height:100vh}}@media (max-width: 364px){.dialog-control-button{width:unset}}";

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-f982899d.js');
-const helpers = require('./helpers-dd569d97.js');
+const helpers = require('./helpers-8ca38600.js');
 const icDividerCss = ".ic-divider-horizontal.sc-ic-divider-h{display:flex;width:var(--ic-divider-horizontal-width, 100%);align-items:center;-moz-column-gap:var(--ic-space-xxs);column-gap:var(--ic-space-xxs)}hr.sc-ic-divider{padding:0;margin:0;border:none;border-bottom:solid var(--ic-space-1px) var(--ic-divider-background);width:inherit}.ic-divider-horizontal.sc-ic-divider-h::before,.ic-divider-horizontal.sc-ic-divider-h::after{border-left:none !important}.ic-divider-horizontal[label-placement=\"right\"].sc-ic-divider-h::before,.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-horizontal[label-placement=\"left\"].sc-ic-divider-h::after,.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h::after{content:\"\";border:none;width:100%}.ic-divider-vertical.sc-ic-divider-h{display:flex;flex-direction:column;height:var(--ic-divider-vertical-height, inherit);width:-moz-max-content;width:max-content;align-items:center;-moz-column-gap:var(--ic-space-xxs);column-gap:var(--ic-space-xxs);border:none}.ic-divider-vertical.sc-ic-divider-h div.vertical-divider.sc-ic-divider{display:flex;height:inherit}.ic-divider-vertical[label-placement=\"bottom\"].sc-ic-divider-h::before,.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-vertical[label-placement=\"top\"].sc-ic-divider-h::after,.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::after{content:\"\";height:100%}hr.sc-ic-divider,.ic-divider-horizontal[label-placement=\"right\"].sc-ic-divider-h::before,.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-horizontal[label-placement=\"left\"].sc-ic-divider-h::after,.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h::after{border-bottom:solid var(--ic-space-1px) var(--ic-divider-background)}.ic-divider-monochrome.sc-ic-divider-h hr.sc-ic-divider,.ic-divider-monochrome.ic-divider-horizontal[label-placement=\"right\"].sc-ic-divider-h::before,.ic-divider-monochrome.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-monochrome.ic-divider-horizontal[label-placement=\"left\"].sc-ic-divider-h::after,.ic-divider-monochrome.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h::after{border-bottom-color:var(--ic-divider-background-monochrome)}.sc-ic-divider-h div.vertical-divider.sc-ic-divider,.ic-divider-vertical[label-placement=\"bottom\"].sc-ic-divider-h::before,.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-vertical[label-placement=\"top\"].sc-ic-divider-h::after,.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::after{border-left:solid var(--ic-space-1px) var(--ic-divider-background)}.ic-divider-monochrome.sc-ic-divider-h div.vertical-divider.sc-ic-divider,.ic-divider-monochrome.ic-divider-vertical[label-placement=\"bottom\"].sc-ic-divider-h::before,.ic-divider-monochrome.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-monochrome.ic-divider-vertical[label-placement=\"top\"].sc-ic-divider-h::after,.ic-divider-monochrome.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::after{border-left-color:var(--ic-divider-background-monochrome)}.ic-side-navigation-keyline.ic-theme-dark.sc-ic-divider-h{--ic-side-navigation-keyline:var(--ic-state-layer-lighten-20)}.ic-side-navigation-keyline.ic-theme-light.sc-ic-divider-h{--ic-side-navigation-keyline:var(--ic-state-layer-darken-20)}.ic-side-navigation-keyline.ic-theme-dark.sc-ic-divider-h hr.sc-ic-divider,.ic-side-navigation-keyline.ic-theme-dark.ic-divider-horizontal[label-placement=\"right\"].sc-ic-divider-h::before,.ic-side-navigation-keyline.ic-theme-dark.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h::before,.ic-side-navigation-keyline.ic-theme-dark.ic-divider-horizontal[label-placement=\"left\"].sc-ic-divider-h::after,.ic-side-navigation-keyline.ic-theme-dark.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h::after{border-bottom-color:var(--ic-side-navigation-keyline)}.ic-side-navigation-keyline.ic-theme-dark.sc-ic-divider-h div.vertical-divider.sc-ic-divider,.ic-side-navigation-keyline.ic-theme-dark.ic-divider-vertical[label-placement=\"bottom\"].sc-ic-divider-h::before,.ic-side-navigation-keyline.ic-theme-dark.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::before,.ic-side-navigation-keyline.ic-theme-dark.ic-divider-vertical[label-placement=\"top\"].sc-ic-divider-h::after,.ic-side-navigation-keyline.ic-theme-dark.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::after{border-left-color:var(--ic-side-navigation-keyline)}.ic-side-navigation-keyline.ic-theme-light.sc-ic-divider-h hr.sc-ic-divider,.ic-side-navigation-keyline.ic-theme-light.ic-divider-horizontal[label-placement=\"right\"].sc-ic-divider-h::before,.ic-side-navigation-keyline.ic-theme-light.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h::before,.ic-side-navigation-keyline.ic-theme-light.ic-divider-horizontal[label-placement=\"left\"].sc-ic-divider-h::after,.ic-side-navigation-keyline.ic-theme-light.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h::after{border-bottom-color:var(--ic-side-navigation-keyline)}.ic-side-navigation-keyline.ic-theme-light.sc-ic-divider-h div.vertical-divider.sc-ic-divider,.ic-side-navigation-keyline.ic-theme-light.ic-divider-vertical[label-placement=\"bottom\"].sc-ic-divider-h::before,.ic-side-navigation-keyline.ic-theme-light.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::before,.ic-side-navigation-keyline.ic-theme-light.ic-divider-vertical[label-placement=\"top\"].sc-ic-divider-h::after,.ic-side-navigation-keyline.ic-theme-light.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::after{border-left-color:var(--ic-divider-background-monochrome)}.ic-divider-very-thick.sc-ic-divider-h hr.sc-ic-divider,.ic-divider-very-thick[label-placement=\"right\"].sc-ic-divider-h::before,.ic-divider-very-thick[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-very-thick[label-placement=\"left\"].sc-ic-divider-h::after,.ic-divider-very-thick[label-placement=\"center\"].sc-ic-divider-h::after{border-bottom-width:var(--ic-space-xs)}.ic-divider-very-thick.sc-ic-divider-h .vertical-divider.sc-ic-divider,.ic-divider-very-thick[label-placement=\"bottom\"].sc-ic-divider-h::before,.ic-divider-very-thick[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-very-thick[label-placement=\"top\"].sc-ic-divider-h::after,.ic-divider-very-thick[label-placement=\"center\"].sc-ic-divider-h::after{border-left-width:var(--ic-space-xs)}.ic-divider-thick.sc-ic-divider-h hr.sc-ic-divider,.ic-divider-thick[label-placement=\"right\"].sc-ic-divider-h::before,.ic-divider-thick[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-thick[label-placement=\"left\"].sc-ic-divider-h::after,.ic-divider-thick[label-placement=\"center\"].sc-ic-divider-h::after{border-bottom-width:var(--ic-space-xxs)}.ic-divider-thick.sc-ic-divider-h .vertical-divider.sc-ic-divider,.ic-divider-thick[label-placement=\"bottom\"].sc-ic-divider-h::before,.ic-divider-thick[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-thick[label-placement=\"top\"].sc-ic-divider-h::after,.ic-divider-thick[label-placement=\"center\"].sc-ic-divider-h::after{border-left-width:var(--ic-space-xxs)}.ic-divider-medium.sc-ic-divider-h hr.sc-ic-divider,.ic-divider-medium[label-placement=\"right\"].sc-ic-divider-h::before,.ic-divider-medium[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-medium[label-placement=\"left\"].sc-ic-divider-h::after,.ic-divider-medium[label-placement=\"center\"].sc-ic-divider-h::after{border-bottom-width:var(--ic-space-xxxs)}.ic-divider-medium.sc-ic-divider-h .vertical-divider.sc-ic-divider,.ic-divider-medium[label-placement=\"bottom\"].sc-ic-divider-h::before,.ic-divider-medium[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-medium[label-placement=\"top\"].sc-ic-divider-h::after,.ic-divider-medium[label-placement=\"center\"].sc-ic-divider-h::after{border-left-width:var(--ic-space-xxxs)}.ic-divider-thin.sc-ic-divider-h hr.sc-ic-divider,.ic-divider-thin[label-placement=\"right\"].sc-ic-divider-h::before,.ic-divider-thin[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-thin[label-placement=\"left\"].sc-ic-divider-h::after,.ic-divider-thin[label-placement=\"center\"].sc-ic-divider-h::after{border-bottom-width:var(--ic-space-1px)}.ic-divider-thin.sc-ic-divider-h .vertical-divider.sc-ic-divider,.ic-divider-thin[label-placement=\"bottom\"].sc-ic-divider-h::before,.ic-divider-thin.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-thin[label-placement=\"top\"].sc-ic-divider-h::after,.ic-divider-thin.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::after{border-left-width:var(--ic-space-1px)}.ic-divider-dashed.sc-ic-divider-h hr.sc-ic-divider,.ic-divider-dashed[label-placement=\"right\"].sc-ic-divider-h::before,.ic-divider-dashed[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-dashed[label-placement=\"left\"].sc-ic-divider-h::after,.ic-divider-dashed[label-placement=\"center\"].sc-ic-divider-h::after{border-bottom-style:dashed}.ic-divider-dashed.sc-ic-divider-h .vertical-divider.sc-ic-divider,.ic-divider-dashed[label-placement=\"bottom\"].sc-ic-divider-h::before,.ic-divider-dashed[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-dashed[label-placement=\"top\"].sc-ic-divider-h::after,.ic-divider-dashed[label-placement=\"center\"].sc-ic-divider-h::after{border-left-style:dashed}.sc-ic-divider-h .ic-divider-label.sc-ic-divider{text-wrap:wrap;text-align:left;width:-moz-max-content;width:max-content;max-width:var(--ic-divider-label-width, max(20rem, 60%))}.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h .ic-divider-label.sc-ic-divider{text-align:center}.ic-divider-vertical.sc-ic-divider-h .ic-divider-label.sc-ic-divider{text-align:center}.sc-ic-divider-h .ic-divider-label-container.sc-ic-divider{width:-moz-max-content;width:max-content;max-width:var(--ic-divider-label-width, max(20rem, 60%))}.ic-divider-vertical.sc-ic-divider-h .ic-divider-label.sc-ic-divider{max-width:var(--ic-divider-label-width, 20rem)}.ic-divider-vertical.sc-ic-divider-h .ic-divider-label-container.sc-ic-divider{max-width:var(--ic-divider-label-width, 20rem)}.sc-ic-divider-h .ic-divider-label.sc-ic-divider p.sc-ic-divider{width:-moz-max-content;width:max-content;max-width:100%}.sc-ic-divider-h .ic-divider-label.sc-ic-divider,.sc-ic-divider-h.sc-ic-divider-s>*,.sc-ic-divider-h .sc-ic-divider-s>*{color:var(--ic-divider-label)}.ic-divider-monochrome.sc-ic-divider-h .ic-divider-label.sc-ic-divider,.sc-ic-divider-h.ic-divider-monochrome.sc-ic-divider-s>*,.sc-ic-divider-h.ic-divider-monochrome .sc-ic-divider-s>*{color:var(--ic-divider-label-monochrome)}@media (forced-colors: active){hr.sc-ic-divider,.ic-divider-horizontal[label-placement=\"right\"].sc-ic-divider-h::before,.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-horizontal[label-placement=\"left\"].sc-ic-divider-h::after,.ic-divider-horizontal[label-placement=\"center\"].sc-ic-divider-h::after{border-bottom-color:transparent}.sc-ic-divider-h div.vertical-divider.sc-ic-divider,.ic-divider-vertical[label-placement=\"bottom\"].sc-ic-divider-h::before,.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::before,.ic-divider-vertical[label-placement=\"top\"].sc-ic-divider-h::after,.ic-divider-vertical[label-placement=\"center\"].sc-ic-divider-h::after{border-left-color:transparent}}";

package/dist/cjs/ic-empty-state.cjs.entry.js CHANGED Viewed

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-f982899d.js');
-const helpers = require('./helpers-dd569d97.js');
+const helpers = require('./helpers-8ca38600.js');
 const icEmptyStateCss = ":host{gap:var(--ic-space-xs);padding:var(--ic-space-xs)}:host,.action-area{display:flex;flex-direction:column}.action-area{gap:var(--ic-space-md)}:host ::slotted(svg),:host ::slotted(img){border-radius:var(--ic-space-xxs)}:host(.ic-empty-state-right),:host(.ic-empty-state-right) .action-area{align-items:flex-end;text-align:right}:host(.ic-empty-state-center),:host(.ic-empty-state-center) .action-area{align-items:center;text-align:center}:host(.image-medium) ::slotted(svg),:host(.image-medium) ::slotted(img){height:calc(3 * var(--ic-space-lg)) !important;width:calc(3 * var(--ic-space-lg)) !important}:host(.image-small) ::slotted(svg),:host(.image-small) ::slotted(img){height:var(--ic-space-xxl) !important;width:var(--ic-space-xxl) !important}:host(.image-large) ::slotted(svg),:host(.image-large) ::slotted(img){height:calc(4 * var(--ic-space-xl)) !important;width:calc(4 * var(--ic-space-xl)) !important}";
@@ -11,16 +11,6 @@ const EmptyState = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
         this.hostMutationObserver = null;
-        this.hostMutationCallback = (mutationList) => {
-            if (mutationList.some(({ type, addedNodes, removedNodes }) => type === "childList"
-                ? helpers.checkSlotInChildMutations(addedNodes, removedNodes, [
-                    "image",
-                    "actions",
-                ])
-                : false)) {
-                index.forceUpdate(this);
-            }
-        };
         this.aligned = "left";
         this.body = undefined;
         this.maxLines = undefined;
@@ -35,7 +25,7 @@ const EmptyState = class {
     componentDidLoad() {
         !helpers.isSlotUsed(this.el, "heading") &&
             helpers.onComponentRequiredPropUndefined([{ prop: this.heading, propName: "heading" }], "Empty State");
-        this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);
+        this.hostMutationObserver = new MutationObserver((mutationList) => helpers.renderDynamicChildSlots(mutationList, ["image", "actions"], this));
         this.hostMutationObserver.observe(this.el, {
             childList: true,
         });

package/dist/cjs/ic-empty-state.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"ic-empty-state.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,o5BAAo5B;;MCsB/5B,UAAU;;;QACb,yBAAoB,GAAqB,IAAI,CAAC;~~QAmD9C~~,yBAAoB,GAAG,CAAC,YAA8B;YAC5D,IACE,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,KACnD,IAAI,KAAK,WAAW;kBAChBA,iCAAyB,CAAC,UAAU,EAAE,YAAY,EAAE;oBAClD,OAAO;oBACP,SAAS;iBACV,CAAC;kBACF,KAAK,CACV,EACD;gBACAC,iBAAW,CAAC,IAAI,CAAC,CAAC;aACnB;SACF,CAAC;uBAzDwC,MAAM;;;;yBAoBlB,QAAQ;;;IAOtC,oBAAoB;;QAClB,MAAA,IAAI,CAAC,oBAAoB,0CAAE,UAAU,EAAE,CAAC;KACzC;IAED,gBAAgB;QACd,~~CAACC~~,kBAAU,CAAC,IAAI,CAAC,EAAE,EAAE,SAAS,CAAC;YAC7BC,wCAAgC,CAC9B,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAC7C,aAAa,CACd,CAAC;QAEJ,IAAI,CAAC,oBAAoB,GAAG,IAAI,gBAAgB,CAAC,~~IAAI~~,CAAC,~~oBAAoB~~,CAAC,CAAC;~~QAC5E~~,IAAI,CAAC,oBAAoB,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,EAAE;YACzC,SAAS,EAAE,IAAI;SAChB,CAAC,CAAC;KACJ;~~IAiBD~~,MAAM;QACJ,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;QACzE,QACEC,QAACC,UAAI,IACH,KAAK,EAAE;gBACL,CAAC,kBAAkB,OAAO,EAAE,GAAG,IAAI;gBACnC,CAAC,SAAS,SAAS,EAAE,~~GAAGH~~,kBAAU,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC;aACrD,IAEAA,kBAAU,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC,~~IAAIE~~,kBAAM,IAAI,EAAC,OAAO,GAAQ,EAC3DA,qBACEA,kBAAM,IAAI,EAAC,SAAS,IAClBA,2BAAe,OAAO,EAAC,IAAI,IAAE,OAAO,CAAiB,CAChD,EACPA,kBAAM,IAAI,EAAC,YAAY,IACrBA,2BAAe,OAAO,EAAC,gBAAgB,IAAE,UAAU,CAAiB,CAC/D,EACPA,kBAAM,IAAI,EAAC,MAAM,IACfA,2BAAe,QAAQ,EAAE,QAAQ,IAAG,IAAI,CAAiB,CACpD,CACH,~~EACLF~~,kBAAU,CAAC,IAAI,CAAC,EAAE,EAAE,SAAS,CAAC,~~KAC7BE~~,iBAAK,KAAK,EAAC,aAAa,IACtBA,kBAAM,IAAI,EAAC,SAAS,GAAG,CACnB,CACP,CACI,EACP;KACH;;;;;;;","names":["~~checkSlotInChildMutations~~","~~forceUpdate~~","~~isSlotUsed~~","~~onComponentRequiredPropUndefined","~~h","Host"],"sources":["src/components/ic-empty-state/ic-empty-state.css?tag=ic-empty-state&encapsulation=shadow","src/components/ic-empty-state/ic-empty-state.tsx"],"sourcesContent":[":host {\n gap: var(--ic-space-xs);\n padding: var(--ic-space-xs);\n}\n\n:host,\n.action-area {\n display: flex;\n flex-direction: column;\n}\n\n.action-area {\n gap: var(--ic-space-md);\n}\n\n:host ::slotted(svg),\n:host ::slotted(img) {\n border-radius: var(--ic-space-xxs);\n}\n\n:host(.ic-empty-state-right),\n:host(.ic-empty-state-right) .action-area {\n align-items: flex-end;\n text-align: right;\n}\n\n:host(.ic-empty-state-center),\n:host(.ic-empty-state-center) .action-area {\n align-items: center;\n text-align: center;\n}\n\n:host(.image-medium) ::slotted(svg),\n:host(.image-medium) ::slotted(img) {\n height: calc(3 * var(--ic-space-lg)) !important;\n width: calc(3 * var(--ic-space-lg)) !important;\n}\n\n:host(.image-small) ::slotted(svg),\n:host(.image-small) ::slotted(img) {\n height: var(--ic-space-xxl) !important;\n width: var(--ic-space-xxl) !important;\n}\n\n:host(.image-large) ::slotted(svg),\n:host(.image-large) ::slotted(img) {\n height: calc(4 * var(--ic-space-xl)) !important;\n width: calc(4 * var(--ic-space-xl)) !important;\n}\n","import { h, Component, Host, Prop, Element, ~~forceUpdate~~ } from \"@stencil/core\";\n\nimport { IcEmptyStateAlignment } from \"./ic-empty-state.types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n ~~checkSlotInChildMutations~~,\n} from \"../../utils/helpers\";\nimport { IcSizes } from \"../../utils/types\";\n\n/*\n @slot image - Content is placed at the top above all other content.\n * @slot actions - Content is placed at the bottom below all other content.\n * @slot heading - Content will be rendered in place of the heading prop.\n * @slot subheading - Content will be rendered in place of the subheading prop.\n * @slot body - Content will be rendered in place of the body prop.\n /\n@Component({\n tag: \"ic-empty-state\",\n styleUrl: \"ic-empty-state.css\",\n shadow: true,\n})\nexport class EmptyState {\n private hostMutationObserver: MutationObserver = null;\n\n @Element() el: HTMLIcEmptyStateElement;\n\n /\n The alignment of the empty state container.\n /\n @Prop() aligned?: IcEmptyStateAlignment = \"left\";\n\n /\n The body text rendered in the empty state container.\n /\n @Prop() body?: string;\n\n /\n The number of lines of body text to display before truncating.\n /\n @Prop() maxLines?: number;\n\n /\n The title rendered in the empty state container.\n /\n @Prop() heading?: string;\n\n /\n The size of the image or icon used in the image slot.\n /\n @Prop() imageSize?: IcSizes = \"medium\";\n\n /\n The subtitle rendered in the empty state container.\n */\n @Prop() subheading?: string;\n\n disconnectedCallback(): void {\n this.hostMutationObserver?.disconnect();\n }\n\n componentDidLoad(): void {\n !isSlotUsed(this.el, \"heading\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.heading, propName: \"heading\" }],\n \"Empty State\"\n );\n\n this.hostMutationObserver = new MutationObserver(~~this.hostMutationCallback);\n this.hostMutationObserver.observe~~(~~this.el, {\n childList: true,\n });\n }\n\n private hostMutationCallback = (~~mutationList~~: MutationRecord[]~~): ~~void => {\~~n if (\n mutationList~~.some(({ type~~, ~~addedNodes, removedNodes }) =>\n type ===~~ \"~~childList~~\"~~\n ? checkSlotInChildMutations(addedNodes~~, ~~removedNodes, [~~\~~n \~~"~~image\",\n \"~~actions\"~~,\n~~ ])\n ~~: false\n~~ )\n ) {\n ~~forceUpdate(this);\~~n }\n };\n\n render() {\n const { aligned, body, maxLines, heading, imageSize, subheading } = this;\n return (\n <Host\n class={{\n [`ic-empty-state-${aligned}`]: true,\n [`image-${imageSize}`]: isSlotUsed(this.el, \"image\"),\n }}\n >\n {isSlotUsed(this.el, \"image\") && <slot name=\"image\"></slot>}\n <div>\n <slot name=\"heading\">\n <ic-typography variant=\"h4\">{heading}</ic-typography>\n </slot>\n <slot name=\"subheading\">\n <ic-typography variant=\"subtitle-small\">{subheading}</ic-typography>\n </slot>\n <slot name=\"body\">\n <ic-typography maxLines={maxLines}>{body}</ic-typography>\n </slot>\n </div>\n {isSlotUsed(this.el, \"actions\") && (\n <div class=\"action-area\">\n <slot name=\"actions\" />\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"ic-empty-state.entry.cjs.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,o5BAAo5B;;MCsB/5B,UAAU;;;QACb,yBAAoB,GAAqB,IAAI,CAAC;uBAOZ,MAAM;;;;yBAoBlB,QAAQ;;;IAOtC,oBAAoB;;QAClB,MAAA,IAAI,CAAC,oBAAoB,0CAAE,UAAU,EAAE,CAAC;KACzC;IAED,gBAAgB;QACd,CAACA,kBAAU,CAAC,IAAI,CAAC,EAAE,EAAE,SAAS,CAAC;YAC7BC,wCAAgC,CAC9B,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAC7C,aAAa,CACd,CAAC;QAEJ,IAAI,CAAC,oBAAoB,GAAG,IAAI,gBAAgB,CAAC,CAAC,YAAY,KAC5DC,+BAAuB,CAAC,YAAY,EAAE,CAAC,OAAO,EAAE,SAAS,CAAC,EAAE,IAAI,CAAC,CAClE,CAAC;QACF,IAAI,CAAC,oBAAoB,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,EAAE;YACzC,SAAS,EAAE,IAAI;SAChB,CAAC,CAAC;KACJ;IAED,MAAM;QACJ,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;QACzE,QACEC,QAACC,UAAI,IACH,KAAK,EAAE;gBACL,CAAC,kBAAkB,OAAO,EAAE,GAAG,IAAI;gBACnC,CAAC,SAAS,SAAS,EAAE,GAAGJ,kBAAU,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC;aACrD,IAEAA,kBAAU,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC,IAAIG,kBAAM,IAAI,EAAC,OAAO,GAAQ,EAC3DA,qBACEA,kBAAM,IAAI,EAAC,SAAS,IAClBA,2BAAe,OAAO,EAAC,IAAI,IAAE,OAAO,CAAiB,CAChD,EACPA,kBAAM,IAAI,EAAC,YAAY,IACrBA,2BAAe,OAAO,EAAC,gBAAgB,IAAE,UAAU,CAAiB,CAC/D,EACPA,kBAAM,IAAI,EAAC,MAAM,IACfA,2BAAe,QAAQ,EAAE,QAAQ,IAAG,IAAI,CAAiB,CACpD,CACH,EACLH,kBAAU,CAAC,IAAI,CAAC,EAAE,EAAE,SAAS,CAAC,KAC7BG,iBAAK,KAAK,EAAC,aAAa,IACtBA,kBAAM,IAAI,EAAC,SAAS,GAAG,CACnB,CACP,CACI,EACP;KACH;;;;;;;","names":["isSlotUsed","onComponentRequiredPropUndefined","renderDynamicChildSlots","h","Host"],"sources":["src/components/ic-empty-state/ic-empty-state.css?tag=ic-empty-state&encapsulation=shadow","src/components/ic-empty-state/ic-empty-state.tsx"],"sourcesContent":[":host {\n gap: var(--ic-space-xs);\n padding: var(--ic-space-xs);\n}\n\n:host,\n.action-area {\n display: flex;\n flex-direction: column;\n}\n\n.action-area {\n gap: var(--ic-space-md);\n}\n\n:host ::slotted(svg),\n:host ::slotted(img) {\n border-radius: var(--ic-space-xxs);\n}\n\n:host(.ic-empty-state-right),\n:host(.ic-empty-state-right) .action-area {\n align-items: flex-end;\n text-align: right;\n}\n\n:host(.ic-empty-state-center),\n:host(.ic-empty-state-center) .action-area {\n align-items: center;\n text-align: center;\n}\n\n:host(.image-medium) ::slotted(svg),\n:host(.image-medium) ::slotted(img) {\n height: calc(3 * var(--ic-space-lg)) !important;\n width: calc(3 * var(--ic-space-lg)) !important;\n}\n\n:host(.image-small) ::slotted(svg),\n:host(.image-small) ::slotted(img) {\n height: var(--ic-space-xxl) !important;\n width: var(--ic-space-xxl) !important;\n}\n\n:host(.image-large) ::slotted(svg),\n:host(.image-large) ::slotted(img) {\n height: calc(4 * var(--ic-space-xl)) !important;\n width: calc(4 * var(--ic-space-xl)) !important;\n}\n","import { h, Component, Host, Prop, Element } from \"@stencil/core\";\n\nimport { IcEmptyStateAlignment } from \"./ic-empty-state.types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n renderDynamicChildSlots,\n} from \"../../utils/helpers\";\nimport { IcSizes } from \"../../utils/types\";\n\n/*\n @slot image - Content is placed at the top above all other content.\n * @slot actions - Content is placed at the bottom below all other content.\n * @slot heading - Content will be rendered in place of the heading prop.\n * @slot subheading - Content will be rendered in place of the subheading prop.\n * @slot body - Content will be rendered in place of the body prop.\n /\n@Component({\n tag: \"ic-empty-state\",\n styleUrl: \"ic-empty-state.css\",\n shadow: true,\n})\nexport class EmptyState {\n private hostMutationObserver: MutationObserver = null;\n\n @Element() el: HTMLIcEmptyStateElement;\n\n /\n The alignment of the empty state container.\n /\n @Prop() aligned?: IcEmptyStateAlignment = \"left\";\n\n /\n The body text rendered in the empty state container.\n /\n @Prop() body?: string;\n\n /\n The number of lines of body text to display before truncating.\n /\n @Prop() maxLines?: number;\n\n /\n The title rendered in the empty state container.\n /\n @Prop() heading?: string;\n\n /\n The size of the image or icon used in the image slot.\n /\n @Prop() imageSize?: IcSizes = \"medium\";\n\n /\n The subtitle rendered in the empty state container.\n */\n @Prop() subheading?: string;\n\n disconnectedCallback(): void {\n this.hostMutationObserver?.disconnect();\n }\n\n componentDidLoad(): void {\n !isSlotUsed(this.el, \"heading\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.heading, propName: \"heading\" }],\n \"Empty State\"\n );\n\n this.hostMutationObserver = new MutationObserver((mutationList) =>\n renderDynamicChildSlots(mutationList, [\"image\", \"actions\"], this)\n );\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n }\n\n render() {\n const { aligned, body, maxLines, heading, imageSize, subheading } = this;\n return (\n <Host\n class={{\n [`ic-empty-state-${aligned}`]: true,\n [`image-${imageSize}`]: isSlotUsed(this.el, \"image\"),\n }}\n >\n {isSlotUsed(this.el, \"image\") && <slot name=\"image\"></slot>}\n <div>\n <slot name=\"heading\">\n <ic-typography variant=\"h4\">{heading}</ic-typography>\n </slot>\n <slot name=\"subheading\">\n <ic-typography variant=\"subtitle-small\">{subheading}</ic-typography>\n </slot>\n <slot name=\"body\">\n <ic-typography maxLines={maxLines}>{body}</ic-typography>\n </slot>\n </div>\n {isSlotUsed(this.el, \"actions\") && (\n <div class=\"action-area\">\n <slot name=\"actions\" />\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-f982899d.js');
-const helpers = require('./helpers-dd569d97.js');
+const helpers = require('./helpers-8ca38600.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-label-margin-top:0;--footer-link-label-margin-bottom:var(--ic-space-md)}:host(.footer-link-group-small){--footer-link-group-margin-right:0;--footer-link-label-margin-top:var(--ic-space-md);--footer-link-label-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-small){--footer-link-group-border-bottom:var(--ic-space-1px) solid\n    var(--ic-footer-keyline)}: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:hover){background-color:var(--ic-footer-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:active){background-color:var(--ic-footer-pressed)}:host ic-section-container{outline:none}.footer-link-label{margin-top:var(--footer-link-label-margin-top);margin-bottom:var(--footer-link-label-margin-bottom);flex-grow:1}.footer-link-group-toggle{fill:var(--ic-footer-chevron-icon) !important}.footer-link-group-links{display:flex;flex-direction:column}.footer-link-group-header{display:flex;align-items:center}ic-typography{--ic-typography-color:var(--ic-footer-link)}";

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-f982899d.js');
-const helpers = require('./helpers-dd569d97.js');
+const helpers = require('./helpers-8ca38600.js');
 const icFooterLinkCss = "/*! 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-ungrouped-sparse){--footer-link-margin-left:0;--footer-link-margin-right:2.5rem;--footer-link-margin-bottom:0}:host(.footer-link-ungrouped-small){--footer-link-margin-left:0;--footer-link-margin-right:0;--footer-link-margin-bottom:var(--ic-space-md)}:host(.footer-link-grouped-sparse){--footer-link-margin-left:0;--footer-link-margin-right:0;--footer-link-margin-bottom:var(--ic-space-md)}:host(.footer-link-grouped-small){--footer-link-margin-left:var(--ic-space-md);--footer-link-margin-right:0;--footer-link-margin-bottom:var(--ic-space-md)}:host(.footer-link){margin-left:var(--footer-link-margin-left);margin-right:var(--footer-link-margin-right);margin-bottom:var(--footer-link-margin-bottom)}.ic-link-open-in-new-icon{vertical-align:middle;margin-left:var(--ic-space-xxs)}.ic-link>.ic-link-open-in-new-icon{fill:var(--ic-color-hyperlink-default)}.ic-link-open-in-new-icon>svg{width:var(--ic-space-md);height:var(--ic-space-md);fill:currentcolor}.ic-link:visited>.ic-link-open-in-new-icon{fill:var(--ic-color-hyperlink-visited)}.ic-link.light:visited>.ic-link-open-in-new-icon{fill:var(--ic-color-hyperlink-contrast-visited)}:host(.breadcrumb-link) .ic-link{display:var(--breadcrumb-link-display);align-items:var(--breadcrumb-link-align-items);gap:var(--breadcrumb-link-gap)}:host(.breadcrumb-link) .ic-link ::slotted(.back-icon){height:var(--ic-space-lg);width:var(--ic-space-lg)}:host(.breadcrumb-link.current-page) a,:host(.breadcrumb-link.current-page) ::slotted(a){font-weight:normal;color:inherit;text-decoration:none;display:flex;align-items:center}:host(.breadcrumb-link.current-page) .ic-link,:host(.breadcrumb-link.current-page) ::slotted(a:focus){outline:var(--ic-hc-focus-outline);text-decoration:none}:host(.breadcrumb-link.current-page) .ic-link:visited{color:var(--ic-color-text-primary)}:host(.footer-link-light) ::part(link),:host(.footer-link-dark) ::part(link){color:var(--ic-footer-link)}:host(.footer-link-light) ::slotted(svg),:host(.footer-link-dark) ::slotted(svg){fill:var(--ic-footer-icon)}@media (forced-colors: active){:host(.footer-link-light) ::slotted(svg),:host(.footer-link-dark) ::slotted(svg){fill:currentcolor}}";

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-f982899d.js');
-const helpers = require('./helpers-dd569d97.js');
+const helpers = require('./helpers-8ca38600.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(.ic-footer-sparse){--footer-links-padding:1.5rem 0;--footer-logo-margin-bottom:calc(var(--ic-space-md) + var(--ic-space-xxs));--footer-link-inner-flex-direction:row}:host(.ic-footer-small){--footer-links-padding:0 0;--footer-logo-margin-bottom:var(--ic-space-md);--footer-link-inner-flex-direction:column}:host(.ic-footer-foreground-dark){--ic-footer-background:var(--ic-brand-color-secondary-light);--ic-footer-bottom-background:var(--ic-brand-color-tertiary-light);--ic-footer-keyline:var(--ic-state-layer-darken-20);--ic-footer-text:var(--ic-color-text-primary-light);--ic-footer-link:var(--ic-color-text-primary-light);--ic-footer-icon:var(--ic-color-icon-neutral);--ic-footer-chevron-icon:var(--ic-color-icon-neutral);--ic-footer-logo:var(--ic-color-icon-neutral);--ic-footer-hover:var(--ic-architectural-700-state-layer-10);--ic-footer-pressed:var(--ic-architectural-700-state-layer-20)}:host(.ic-footer-small.ic-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(--ic-footer-background);color:var(--ic-footer-text);--ic-typography-color:var(--ic-footer-text);border-bottom:var(--ic-space-1px) solid var(--ic-footer-keyline)}.footer-description-inner{padding:1rem 0}.footer-links{padding:var(--footer-links-padding);background-color:var(--ic-footer-background);color:var(--ic-footer-link);--ic-typography-color:var(--ic-footer-link)}.footer-links-inner{display:flex;flex-direction:var(--footer-link-inner-flex-direction)}.footer-compliance{background-color:var(--ic-footer-bottom-background);color:var(--ic-footer-text);--ic-typography-color:var(--ic-footer-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-border-hc)}}";
@@ -12,6 +12,7 @@ const Footer = class {
         index.registerInstance(this, hostRef);
         this.footerResized = index.createEvent(this, "footerResized", 7);
         this.resizeObserver = null;
+        this.hostMutationObserver = null;
         this.resizeObserverCallback = (currSize) => {
             if (currSize !== this.deviceSize) {
                 this.deviceSize = currSize;
@@ -35,15 +36,23 @@ const Footer = class {
         this.groupLinks = false;
     }
     disconnectedCallback() {
+        var _a;
         if (this.resizeObserver !== null) {
             this.resizeObserver.disconnect();
         }
+        (_a = this.hostMutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
     componentWillLoad() {
         this.deviceSize = helpers.getCurrentDeviceSize();
     }
     componentDidLoad() {
         helpers.checkResizeObserver(this.runResizeObserver);
+        this.hostMutationObserver = new MutationObserver((mutationList) => {
+            return helpers.renderDynamicChildSlots(mutationList, "link", this);
+        });
+        this.hostMutationObserver.observe(this.el, {
+            childList: true,
+        });
     }
     brandChangeHandler(ev) {
         this.foregroundColor = ev.detail.mode;
@@ -63,8 +72,12 @@ const Footer = class {
                             : false;
     }
     render() {
-        const { aligned, caption, copyright, description, groupLinks, foregroundColor, } = this;
+        const { aligned, caption, copyright, description, deviceSize, el, foregroundColor, groupLinks, } = this;
         const small = this.isSmall();
+        const showComplianceSection = helpers.isSlotUsed(el, "logo") ||
+            helpers.isSlotUsed(el, "caption") ||
+            caption ||
+            copyright;
         return (index.h(index.Host, { class: {
                 ["ic-footer"]: true,
                 [`ic-footer-${small ? "small" : "sparse"}`]: true,
@@ -73,14 +86,12 @@ const Footer = class {
                 // Slots will be able to infer their own color
                 [`ic-footer-${helpers.IcBrandForegroundEnum.Dark}`]: foregroundColor === helpers.IcBrandForegroundEnum.Dark,
                 [`ic-footer-${helpers.IcBrandForegroundEnum.Light}`]: foregroundColor === helpers.IcBrandForegroundEnum.Light,
-            } }, index.h("footer", { ref: (footerEl) => (this.footerEl = footerEl) }, (helpers.isSlotUsed(this.el, "description") || description) && (index.h("div", { class: "footer-description" }, index.h("ic-section-container", { aligned: aligned, fullHeight: true }, index.h("div", { class: "footer-description-inner" }, index.h("ic-typography", { variant: "body" }, index.h("slot", { name: "description" }, description)))))), helpers.isSlotUsed(this.el, "link") && (index.h("div", { class: "footer-links" }, groupLinks && small ? (index.h("div", { class: "footer-links-inner", role: "list" }, index.h("slot", { name: "link" }))) : (index.h("ic-section-container", { fullHeight: true, aligned: aligned }, index.h("div", { class: "footer-links-inner", role: "list" }, index.h("slot", { name: "link" })))))), index.h("div", { class: "footer-compliance" }, index.h("ic-section-container", { aligned: aligned, fullHeight: true }, index.h("div", { class: "footer-compliance-inner" }, helpers.isSlotUsed(this.el, "logo") && (index.h("div", { class: "footer-logo" }, index.h("slot", { name: "logo" }))), (helpers.isSlotUsed(this.el, "caption") || caption) && (index.h("div", { class: "footer-caption" }, index.h("ic-typography", { variant: this.deviceSize <= helpers.IC_DEVICE_SIZES.M
-                ? "caption"
-                : "body" }, index.h("slot", { name: "caption" }, caption)))), copyright && (index.h("div", { class: {
+            } }, index.h("footer", { ref: (footerEl) => (this.footerEl = footerEl) }, (helpers.isSlotUsed(el, "description") || description) && (index.h("div", { class: "footer-description" }, index.h("ic-section-container", { aligned: aligned, fullHeight: true }, index.h("div", { class: "footer-description-inner" }, index.h("ic-typography", { variant: "body" }, index.h("slot", { name: "description" }, description)))))), helpers.isSlotUsed(el, "link") && (index.h("div", { class: "footer-links" }, groupLinks && small ? (index.h("div", { class: "footer-links-inner", role: "list" }, index.h("slot", { name: "link" }))) : (index.h("ic-section-container", { fullHeight: true, aligned: aligned }, index.h("div", { class: "footer-links-inner", role: "list" }, index.h("slot", { name: "link" })))))), showComplianceSection && (index.h("div", { class: "footer-compliance" }, index.h("ic-section-container", { aligned: aligned, fullHeight: true }, index.h("div", { class: "footer-compliance-inner" }, helpers.isSlotUsed(el, "logo") && (index.h("div", { class: "footer-logo" }, index.h("slot", { name: "logo" }))), (helpers.isSlotUsed(el, "caption") || caption) && (index.h("div", { class: "footer-caption" }, index.h("ic-typography", { variant: deviceSize <= helpers.IC_DEVICE_SIZES.M ? "caption" : "body" }, index.h("slot", { name: "caption" }, caption)))), copyright && (index.h("div", { class: {
                 ["footer-copyright"]: true,
                 ["classification-spacing"]: helpers.hasClassificationBanner(),
-            } }, index.h("ic-typography", { variant: this.deviceSize <= helpers.IC_DEVICE_SIZES.M
+            } }, index.h("ic-typography", { variant: deviceSize <= helpers.IC_DEVICE_SIZES.M
                 ? "caption-uppercase"
-                : "label-uppercase" }, "\u00A9 Crown Copyright")))))))));
+                : "label-uppercase" }, "\u00A9 Crown Copyright"))))))))));
     }
     get el() { return index.getElement(this); }
 };