@ukic/web-components 3.0.0 → 3.2.0

package/dist/core/p-de43d375.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icTabPanelCss","IcTabPanelStyle0","TabPanel","constructor","hostRef","this","active","monochrome","theme","connectedCallback","tabPanelCreated","emit","el","render","h","Host","key","class","role"],"sources":["src/components/ic-tab-panel/ic-tab-panel.css?tag=ic-tab-panel&encapsulation=shadow","src/components/ic-tab-panel/ic-tab-panel.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host(.ic-tab-panel-hidden) {\n  display: none;\n}\n\n:host(:not(.ic-tab-panel-hidden)) {\n  display: block;\n}\n\n:host {\n  color: var(--ic-color-text-primary);\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Prop,\n  h,\n} from \"@stencil/core\";\nimport { IcThemeMode } from \"../../utils/types\";\n\n@Component({\n  tag: \"ic-tab-panel\",\n  styleUrl: \"ic-tab-panel.css\",\n  shadow: true,\n})\nexport class TabPanel {\n  @Element() el: HTMLIcTabPanelElement;\n\n  /**\n   * @internal If `true`, the tab panel will be displayed.\n   */\n  @Prop() active: boolean = false;\n\n  /**\n   * @internal Determines whether black variant of the tabs should be displayed.\n   */\n  @Prop() monochrome?: boolean = false;\n\n  /**\n   * @internal The shared ID that links the panel and tab.\n   */\n  @Prop({ reflect: true }) panelId?: string;\n\n  /**\n   * @internal The shared ID of the currently selected tab.\n   */\n  @Prop() selectedTab?: string;\n\n  /**\n   * @internal The position of the tab panel inside the tabs array in context.\n   */\n  @Prop({ reflect: true }) tabPosition?: number;\n\n  /** @internal Determines whether the light or dark variant of the tabs should be displayed. */\n  @Prop() theme?: IcThemeMode = \"inherit\";\n\n  /**\n   * @internal Emitted when a tab panel is dynamically created.\n   */\n  @Event() tabPanelCreated: EventEmitter<HTMLIcTabPanelElement>;\n\n  /**\n   * @internal Emitted when a tab panel is unmounted.\n   */\n  @Event() tabPanelRemoved: EventEmitter<void>;\n\n  connectedCallback(): void {\n    this.tabPanelCreated.emit(this.el);\n  }\n\n  render() {\n    const { active, theme } = this;\n    return (\n      <Host\n        class={{\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n          \"ic-tab-panel-hidden\": !active,\n        }}\n        role=\"tabpanel\"\n        aria-hidden={`${!active}`}\n      >\n        <div>\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"gEAAA,MAAMA,EAAgB,s+EACtB,MAAAC,EAAeD,E,MCeFE,EAAQ,MALrB,WAAAC,CAAAC,G,4GAWUC,KAAAC,OAAkB,MAKlBD,KAAAE,WAAuB,MAkBvBF,KAAAG,MAAsB,S,CAY9B,iBAAAC,GACEJ,KAAKK,gBAAgBC,KAAKN,KAAKO,G,CAGjC,MAAAC,GACE,MAAMP,OAAEA,EAAME,MAAEA,GAAUH,KAC1B,OACES,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,CAAC,YAAYT,KAAUA,IAAU,UACjC,uBAAwBF,GAE1BY,KAAK,WAAU,cACF,IAAIZ,KAEjBQ,EAAA,OAAAE,IAAA,4CACEF,EAAA,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/core/p-e1255160.js

@@ -0,0 +1,2 @@
+const o=()=>{};export{o as g};
+//# sourceMappingURL=p-e1255160.js.map

package/dist/core/p-e1255160.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["globalScripts"],"sources":["@stencil/core/internal/app-globals"],"sourcesContent":["export const globalScripts = () => {};\n"],"mappings":"AAAY,MAACA,EAAgB,c","ignoreList":[]}

package/dist/core/p-e2f893f0.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,H as i,g as n}from"./p-8e4e97b4.js";import{g as o,t as a,i as r,b as c,a as s,d,I as h}from"./p-281ce313.js";const l='/*! 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;background-color:var(--ic-hero-background);--hero-heading-bottom-margin:var(--ic-space-md);--hero-keyline:var(--ic-hero-keyline)}:host(.ic-hero-dark){background-color:var(--ic-brand-color-secondary);--ic-hero-heading:var(--ic-color-text-primary-light);--ic-hero-body:var(--ic-color-text-primary-light);--ic-hero-secondary-heading:var(--ic-color-text-primary-light);--hero-keyline:var(--ic-brand-text-color)}.heading{--ic-typography-color:var(--ic-hero-heading)}.subheading{--ic-typography-color:var(--ic-hero-body)}.secondary-container{--ic-typography-color:var(--ic-hero-secondary-heading);display:flex;flex-direction:column;justify-content:center;border-left:var(--ic-space-xxxs) solid var(--hero-keyline)}:host(.has-background-image){background-repeat:no-repeat;background-position:right -6.25rem;background-size:auto calc(100% + 6.25rem);box-shadow:var(--ic-elevation-inset)}@media (prefers-reduced-motion){:host(.has-background-image){background-position:right -6.25rem !important}}ic-typography.heading-bottom-spacing{margin-bottom:var(--hero-heading-bottom-margin)}.section-container{display:flex;align-items:center;height:100%}.left-container{padding:var(--ic-space-xl) 0}.left-container:not(.left-container-full-width){flex-basis:50%}.left-container-full-width{width:100%}.right-container{flex-basis:50%}.interaction-container{display:flex;gap:var(--ic-space-md);margin-top:var(--ic-space-lg);flex-wrap:wrap}.secondary-subheading{margin-top:var(--ic-space-xxs)}:host([content-aligned="left"]) .left-container,:host([content-aligned="left"]) .interaction-container{justify-content:flex-start;text-align:left}:host([content-aligned="center"]) .left-container,:host([content-aligned="center"]) .interaction-container{justify-content:center;text-align:center}@media (min-width: 992px){.left-container-full-width{width:66.6%}}@media (min-width: 1044px){:host,.section-container{min-height:13rem}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:10.813rem}.left-container:not(.left-container-full-width){flex-basis:66.6%}.left-container{min-height:9rem}.right-container{flex-basis:33.3%;margin-left:3.125rem}.secondary-container{min-height:9rem}.secondary-heading,.secondary-subheading{margin-left:3.938rem}}@media (min-width: 801px) and (max-width: 1043px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:16rem}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:15rem}:host(.secondary-heading),:host(.secondary-heading) .section-container{min-height:14rem}.left-container{min-height:10rem}.secondary-container{min-height:10rem}.secondary-heading,.secondary-subheading{margin-left:5.922rem}.right-container{margin-left:3.125rem}}@media (min-width: 641px) and (max-width: 800px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:16rem}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:15rem}:host(.secondary-heading),:host(.secondary-heading) .section-container{min-height:14rem}.left-container{min-height:10rem}.secondary-container{min-height:10rem}.secondary-heading,.secondary-subheading{margin-left:2.125rem}.right-container{margin-left:3.125rem}}@media (min-width: 481px) and (max-width: 640px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:13rem}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:10.813rem}:host(.secondary-heading),:host(.secondary-heading) .section-container{min-height:17.5rem}:host(.secondary-heading) .section-container,:host(.ic-hero-small) .section-container,.section-container{flex-direction:column;align-items:flex-start}.left-container{height:-moz-fit-content;height:fit-content}.secondary-container{height:-moz-fit-content;height:fit-content;border:none}.right-container{margin-bottom:2.5rem}}@media (max-width: 480px){:host(.has-background-image){background-image:none !important}:host,.section-container{min-height:12rem}:host,.right-container{margin-bottom:var(--ic-space-md)}:host(.ic-hero-small),:host(.ic-hero-small) .section-container{min-height:10.813rem}:host(.secondary-heading),:host(.secondary-heading) .section-container{min-height:16.5rem}:host(.secondary-heading) .section-container,:host(.ic-hero-small) .section-container,.section-container{flex-direction:column;align-items:flex-start}.left-container{height:-moz-fit-content;height:fit-content}.secondary-container{height:-moz-fit-content;height:fit-content;border:none}}';const m=l;const g=class{constructor(t){e(this,t);this.hostMutationObserver=null;this.foregroundColor=o();this.rightContent=false;this.leftContentFullWidth=!this.rightContent&&this.secondaryHeading===undefined;this.scrollFactor="right -100px";this.aligned="left";this.contentAligned="left";this.disableBackgroundParallax=false;this.size="medium"}disconnectedCallback(){var e;(e=this.hostMutationObserver)===null||e===void 0?void 0:e.disconnect()}componentWillLoad(){this.rightContent=a(this.el,"secondary")}componentDidLoad(){!r(this.el,"heading")&&c([{prop:this.heading,propName:"heading"}],"Hero");this.hostMutationObserver=new MutationObserver((e=>s(e,"secondary",this)));this.hostMutationObserver.observe(this.el,{childList:true})}componentWillRender(){this.rightContent=a(this.el,"secondary")}brandChangeHandler(e){this.foregroundColor=e.detail.mode}doScroll(){var e;if(this.disableBackgroundParallax){return}const t=(e=document.scrollingElement)===null||e===void 0?void 0:e.scrollTop;if(t){const e=.4;const i=-100+t*e;this.scrollFactor="right "+i+"px"}}render(){const{aligned:e,size:n,heading:o,subheading:a,secondaryHeading:r,secondarySubheading:c,foregroundColor:s,backgroundImage:l,scrollFactor:m}=this;let g={};if(d(l)){g={"background-image":"url("+l+")","background-position":m}}return t(i,{key:"74dcaf107650373274e01fe04fd1964c3bb62073",class:{[`ic-hero-${h.Dark}`]:s===h.Dark,["has-background-image"]:l!==undefined,["ic-hero-small"]:n==="small",["secondary-heading"]:!!r},style:g},t("ic-section-container",{key:"18df0272497747b6660942829636b2d3225913e9",aligned:e,fullHeight:true,class:"section-container"},t("div",{key:"6ecd484adbcb987f3f90ff58ee6f749c9a3422ed",class:{["left-container"]:true,["left-container-full-width"]:this.leftContentFullWidth}},t("div",{key:"8d4c4b0a35417046b06a2dbfd1e13e40183bd7fb",class:"heading"},t("slot",{key:"fc5aa8fd7b8dcb255d3a9405444b17670e3e9d7b",name:"heading"},t("ic-typography",{key:"360e0e4ff5b9c44a707011abcb33771bb711226b",variant:n==="small"?"h2":"h1",class:{["heading-bottom-spacing"]:n!=="small"}},t("h2",{key:"671b42db7002c2d77d42f8eb087af469910ac4ba"},o)))),t("div",{key:"d967221ce6e889da8a749f7c3deacbed0fb70211",class:"subheading"},t("slot",{key:"3363059a438d470e90a4782f956c838c7394fe16",name:"subheading"},t("ic-typography",{key:"a9e7e665d6f42f14d0b0368e3d437cacfae4edcb",variant:"body"},a))),t("div",{key:"a99a67438d1c017ed7822fcf4b46243e8af300f7",class:"interaction-container"},t("slot",{key:"5f54b40b54fdc5696935d37dfe3ef7ae68599390",name:"interaction"}))),(d(r)||this.rightContent)&&t("div",{key:"89513652cf857ead516f5b16e1a5776b135db42c",class:"right-container"},t("slot",{key:"739e6f69d2466cf001489eea05488b98e2713f12",name:"secondary"},r&&t("div",{key:"41f85c0af629eaa9fb859768b495563edf2cc734",class:"secondary-container"},t("div",{key:"9ef7879d221cbf53e36eda0a99b59bd76bd0476f",class:"secondary-heading"},t("ic-typography",{key:"41787caaf24919d5a7041294d73445f58aa3d724",variant:"h4"},t("h3",{key:"1137fb4ee0e4fe64efed120d0e5ab5d4dc25bd5d"},r))),t("div",{key:"2985066c33994c07e167e59ddff6d64e3713b888",class:"secondary-subheading"},t("ic-typography",{key:"6bee21b6ce698c66dab6c49ab39558373bfec1f8",variant:"subtitle-small"},c)))))))}get el(){return n(this)}};g.style=m;export{g as ic_hero};
+//# sourceMappingURL=p-e2f893f0.entry.js.map

package/dist/core/p-e2f893f0.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icHeroCss","IcHeroStyle0","Hero","constructor","hostRef","this","hostMutationObserver","foregroundColor","getBrandForegroundAppearance","rightContent","leftContentFullWidth","secondaryHeading","undefined","scrollFactor","aligned","contentAligned","disableBackgroundParallax","size","disconnectedCallback","_a","disconnect","componentWillLoad","slotHasContent","el","componentDidLoad","isSlotUsed","onComponentRequiredPropUndefined","prop","heading","propName","MutationObserver","mutationList","renderDynamicChildSlots","observe","childList","componentWillRender","brandChangeHandler","ev","detail","mode","doScroll","scrolltotop","document","scrollingElement","scrollTop","factor","y","render","subheading","secondarySubheading","backgroundImage","style","isPropDefined","h","Host","key","class","IcBrandForegroundEnum","Dark","fullHeight","name","variant"],"sources":["src/components/ic-hero/ic-hero.css?tag=ic-hero&encapsulation=shadow","src/components/ic-hero/ic-hero.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n  background-color: var(--ic-hero-background);\n\n  --hero-heading-bottom-margin: var(--ic-space-md);\n  --hero-keyline: var(--ic-hero-keyline);\n}\n\n:host(.ic-hero-dark) {\n  background-color: var(--ic-brand-color-secondary);\n\n  --ic-hero-heading: var(--ic-color-text-primary-light);\n  --ic-hero-body: var(--ic-color-text-primary-light);\n  --ic-hero-secondary-heading: var(--ic-color-text-primary-light);\n  --hero-keyline: var(--ic-brand-text-color);\n}\n\n.heading {\n  --ic-typography-color: var(--ic-hero-heading);\n}\n\n.subheading {\n  --ic-typography-color: var(--ic-hero-body);\n}\n\n.secondary-container {\n  --ic-typography-color: var(--ic-hero-secondary-heading);\n\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  border-left: var(--ic-space-xxxs) solid var(--hero-keyline);\n}\n\n:host(.has-background-image) {\n  background-repeat: no-repeat;\n  background-position: right -6.25rem;\n  background-size: auto calc(100% + 6.25rem);\n  box-shadow: var(--ic-elevation-inset);\n}\n\n@media (prefers-reduced-motion) {\n  :host(.has-background-image) {\n    background-position: right -6.25rem !important;\n  }\n}\n\nic-typography.heading-bottom-spacing {\n  margin-bottom: var(--hero-heading-bottom-margin);\n}\n\n.section-container {\n  display: flex;\n  align-items: center;\n  height: 100%;\n}\n\n.left-container {\n  padding: var(--ic-space-xl) 0;\n}\n\n.left-container:not(.left-container-full-width) {\n  flex-basis: 50%;\n}\n\n.left-container-full-width {\n  width: 100%;\n}\n\n.right-container {\n  flex-basis: 50%;\n}\n\n.interaction-container {\n  display: flex;\n  gap: var(--ic-space-md);\n  margin-top: var(--ic-space-lg);\n  flex-wrap: wrap;\n}\n\n.secondary-subheading {\n  margin-top: var(--ic-space-xxs);\n}\n\n:host([content-aligned=\"left\"]) .left-container,\n:host([content-aligned=\"left\"]) .interaction-container {\n  justify-content: flex-start;\n  text-align: left;\n}\n\n:host([content-aligned=\"center\"]) .left-container,\n:host([content-aligned=\"center\"]) .interaction-container {\n  justify-content: center;\n  text-align: center;\n}\n\n@media (min-width: 992px) {\n  .left-container-full-width {\n    width: 66.6%;\n  }\n}\n\n@media (min-width: 1044px) {\n  :host,\n  .section-container {\n    min-height: 13rem;\n  }\n\n  :host(.ic-hero-small),\n  :host(.ic-hero-small) .section-container {\n    min-height: 10.813rem;\n  }\n\n  .left-container:not(.left-container-full-width) {\n    flex-basis: 66.6%;\n  }\n\n  .left-container {\n    min-height: 9rem;\n  }\n\n  .right-container {\n    flex-basis: 33.3%;\n    margin-left: 3.125rem;\n  }\n\n  .secondary-container {\n    min-height: 9rem;\n  }\n\n  .secondary-heading,\n  .secondary-subheading {\n    margin-left: 3.938rem;\n  }\n}\n\n@media (min-width: 801px) and (max-width: 1043px) {\n  :host(.has-background-image) {\n    background-image: none !important;\n  }\n\n  :host,\n  .section-container {\n    min-height: 16rem;\n  }\n\n  :host(.ic-hero-small),\n  :host(.ic-hero-small) .section-container {\n    min-height: 15rem;\n  }\n\n  :host(.secondary-heading),\n  :host(.secondary-heading) .section-container {\n    min-height: 14rem;\n  }\n\n  .left-container {\n    min-height: 10rem;\n  }\n\n  .secondary-container {\n    min-height: 10rem;\n  }\n\n  .secondary-heading,\n  .secondary-subheading {\n    margin-left: 5.922rem;\n  }\n\n  .right-container {\n    margin-left: 3.125rem;\n  }\n}\n\n@media (min-width: 641px) and (max-width: 800px) {\n  :host(.has-background-image) {\n    background-image: none !important;\n  }\n\n  :host,\n  .section-container {\n    min-height: 16rem;\n  }\n\n  :host(.ic-hero-small),\n  :host(.ic-hero-small) .section-container {\n    min-height: 15rem;\n  }\n\n  :host(.secondary-heading),\n  :host(.secondary-heading) .section-container {\n    min-height: 14rem;\n  }\n\n  .left-container {\n    min-height: 10rem;\n  }\n\n  .secondary-container {\n    min-height: 10rem;\n  }\n\n  .secondary-heading,\n  .secondary-subheading {\n    margin-left: 2.125rem;\n  }\n\n  .right-container {\n    margin-left: 3.125rem;\n  }\n}\n\n@media (min-width: 481px) and (max-width: 640px) {\n  :host(.has-background-image) {\n    background-image: none !important;\n  }\n\n  :host,\n  .section-container {\n    min-height: 13rem;\n  }\n\n  :host(.ic-hero-small),\n  :host(.ic-hero-small) .section-container {\n    min-height: 10.813rem;\n  }\n\n  :host(.secondary-heading),\n  :host(.secondary-heading) .section-container {\n    min-height: 17.5rem;\n  }\n\n  :host(.secondary-heading) .section-container,\n  :host(.ic-hero-small) .section-container,\n  .section-container {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .left-container {\n    height: fit-content;\n  }\n\n  .secondary-container {\n    height: fit-content;\n    border: none;\n  }\n\n  .right-container {\n    margin-bottom: 2.5rem;\n  }\n}\n\n@media (max-width: 480px) {\n  :host(.has-background-image) {\n    background-image: none !important;\n  }\n\n  :host,\n  .section-container {\n    min-height: 12rem;\n  }\n\n  :host,\n  .right-container {\n    margin-bottom: var(--ic-space-md);\n  }\n\n  :host(.ic-hero-small),\n  :host(.ic-hero-small) .section-container {\n    min-height: 10.813rem;\n  }\n\n  :host(.secondary-heading),\n  :host(.secondary-heading) .section-container {\n    min-height: 16.5rem;\n  }\n\n  :host(.secondary-heading) .section-container,\n  :host(.ic-hero-small) .section-container,\n  .section-container {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .left-container {\n    height: fit-content;\n  }\n\n  .secondary-container {\n    height: fit-content;\n    border: none;\n  }\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  h,\n  State,\n  Listen,\n} from \"@stencil/core\";\nimport {\n  IcAlignment,\n  IcSizesNoLarge,\n  IcBrand,\n  IcBrandForeground,\n  IcBrandForegroundEnum,\n} from \"../../utils/types\";\nimport {\n  slotHasContent,\n  getBrandForegroundAppearance,\n  onComponentRequiredPropUndefined,\n  isPropDefined,\n  isSlotUsed,\n  renderDynamicChildSlots,\n} from \"../../utils/helpers\";\nimport { IcHeroContentAlignments } from \"./ic-hero.types\";\n\n/**\n * @slot heading - Content will be rendered in the title area, in place of the heading.\n * @slot subheading - Content will be rendered in the title area, in place of the subheading.\n * @slot interaction - Content will be rendered in the interaction area, adjacent to the title area.\n * @slot secondary - Content will be rendered in the secondary content area.\n */\n\n@Component({\n  tag: \"ic-hero\",\n  styleUrl: \"ic-hero.css\",\n  shadow: true,\n})\nexport class Hero {\n  private hostMutationObserver: MutationObserver | null = null;\n\n  @Element() el: HTMLIcHeroElement;\n\n  @State() foregroundColor: IcBrandForeground = getBrandForegroundAppearance();\n  @State() rightContent: boolean = false;\n  // set by above state\n  @State() leftContentFullWidth: boolean =\n    !this.rightContent && this.secondaryHeading === undefined;\n  @State() scrollFactor: string = \"right -100px\";\n\n  /**\n   * The alignment of the hero.\n   */\n  @Prop() aligned?: IcAlignment = \"left\";\n\n  /**\n   * The optional background image.\n   */\n  @Prop() backgroundImage?: string;\n\n  /**\n   * The alignment of the hero content.\n   */\n  @Prop() contentAligned?: IcHeroContentAlignments = \"left\";\n\n  /**\n   * If `true`, the background image (if set) will not scroll using a parallax effect.\n   */\n  @Prop() disableBackgroundParallax?: boolean = false;\n\n  /**\n   * The heading of the hero. An <h2> level heading.\n   */\n  @Prop() heading?: string;\n\n  /**\n   * The optional secondary heading, an <h3> level heading. Replaced by slotted right content.\n   */\n  @Prop() secondaryHeading?: string;\n\n  /**\n   * The optional secondary subheading, replaced by slotted right content.\n   */\n  @Prop() secondarySubheading?: string;\n\n  /**\n   * The size of the hero component.\n   */\n  @Prop() size?: IcSizesNoLarge = \"medium\";\n\n  /**\n   * The description for the hero.\n   */\n  @Prop() subheading?: string;\n\n  disconnectedCallback(): void {\n    this.hostMutationObserver?.disconnect();\n  }\n\n  componentWillLoad(): void {\n    this.rightContent = slotHasContent(this.el, \"secondary\");\n  }\n\n  componentDidLoad(): void {\n    !isSlotUsed(this.el, \"heading\") &&\n      onComponentRequiredPropUndefined(\n        [{ prop: this.heading, propName: \"heading\" }],\n        \"Hero\"\n      );\n\n    this.hostMutationObserver = new MutationObserver((mutationList) =>\n      renderDynamicChildSlots(mutationList, \"secondary\", this)\n    );\n    this.hostMutationObserver.observe(this.el, {\n      childList: true,\n    });\n  }\n\n  componentWillRender(): void {\n    this.rightContent = slotHasContent(this.el, \"secondary\");\n  }\n\n  @Listen(\"brandChange\", { target: \"document\" })\n  brandChangeHandler(ev: CustomEvent<IcBrand>): void {\n    this.foregroundColor = ev.detail.mode;\n  }\n\n  @Listen(\"scroll\", { target: \"document\" })\n  doScroll(): void {\n    if (this.disableBackgroundParallax) {\n      return;\n    }\n\n    const scrolltotop = document.scrollingElement?.scrollTop;\n    if (scrolltotop) {\n      const factor = 0.4;\n      const y = -100 + scrolltotop * factor;\n      this.scrollFactor = \"right \" + y + \"px\";\n    }\n  }\n\n  render() {\n    const {\n      aligned,\n      size,\n      heading,\n      subheading,\n      secondaryHeading,\n      secondarySubheading,\n      foregroundColor,\n      backgroundImage,\n      scrollFactor,\n    } = this;\n\n    let style = {};\n\n    if (isPropDefined(backgroundImage)) {\n      style = {\n        \"background-image\": \"url(\" + backgroundImage + \")\",\n        \"background-position\": scrollFactor,\n      };\n    }\n\n    return (\n      <Host\n        class={{\n          [`ic-hero-${IcBrandForegroundEnum.Dark}`]:\n            foregroundColor === IcBrandForegroundEnum.Dark,\n          [\"has-background-image\"]: backgroundImage !== undefined,\n          [\"ic-hero-small\"]: size === \"small\",\n          [\"secondary-heading\"]: !!secondaryHeading,\n        }}\n        style={style}\n      >\n        <ic-section-container\n          aligned={aligned}\n          fullHeight\n          class=\"section-container\"\n        >\n          <div\n            class={{\n              [\"left-container\"]: true,\n              [\"left-container-full-width\"]: this.leftContentFullWidth,\n            }}\n          >\n            <div class=\"heading\">\n              <slot name=\"heading\">\n                <ic-typography\n                  variant={size === \"small\" ? \"h2\" : \"h1\"}\n                  class={{\n                    [\"heading-bottom-spacing\"]: size !== \"small\",\n                  }}\n                >\n                  <h2>{heading}</h2>\n                </ic-typography>\n              </slot>\n            </div>\n            <div class=\"subheading\">\n              <slot name=\"subheading\">\n                <ic-typography variant=\"body\">{subheading}</ic-typography>\n              </slot>\n            </div>\n            <div class=\"interaction-container\">\n              <slot name=\"interaction\"></slot>\n            </div>\n          </div>\n          {(isPropDefined(secondaryHeading) || this.rightContent) && (\n            <div class=\"right-container\">\n              <slot name=\"secondary\">\n                {secondaryHeading && (\n                  <div class=\"secondary-container\">\n                    <div class=\"secondary-heading\">\n                      <ic-typography variant=\"h4\">\n                        <h3>{secondaryHeading}</h3>\n                      </ic-typography>\n                    </div>\n                    <div class=\"secondary-subheading\">\n                      <ic-typography variant=\"subtitle-small\">\n                        {secondarySubheading}\n                      </ic-typography>\n                    </div>\n                  </div>\n                )}\n              </slot>\n            </div>\n          )}\n        </ic-section-container>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/core/p-e56d0db2.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as e,H as s,g as a}from"./p-8e4e97b4.js";import{t as o,r as n,f as r,b as l,q as h}from"./p-281ce313.js";const d='/*! 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-radio-button-input-field-label);--ic-input-label-helper-text-color:var(\n    --ic-radio-button-input-field-subtitle\n  );--ic-input-validation-status-text-color:var(--ic-radio-button-state-text);--ic-input-validation-error:var(--ic-radio-button-state-icon-error)}ic-input-label.error{--ic-input-label-text-color:var(--ic-radio-button-input-field-label-error)}ic-input-label.disabled{--ic-input-label-text-color:var(\n    --ic-radio-button-input-field-label-disabled\n  );--ic-input-label-helper-text-color:var(\n    --ic-radio-button-input-field-subtitle-disabled\n  )}ic-input-validation{margin-top:var(--ic-space-sm)}:host(.ic-radio-group-small) ic-input-validation{margin-top:calc(var(--ic-space-sm) / 2)}ic-input-label ic-typography{margin-bottom:var(--ic-space-sm)}:host(.ic-radio-group-small) ic-input-label ic-typography{margin-bottom:calc(var(--ic-space-sm) / 2)}:host .radio-buttons-container{display:flex;flex-direction:column;gap:var(--ic-space-xxs)}:host(.ic-radio-group-small) .radio-buttons-container{gap:var(--ic-space-xxxs)}:host .radio-buttons-container.horizontal{display:flex;flex-direction:row;gap:calc(var(--ic-space-xl) + var(--ic-space-xs))}:host(.ic-radio-group-small) .radio-buttons-container.horizontal{gap:var(--ic-space-xl)}';const c=d;const b=class{constructor(e){t(this,e);this.icChange=i(this,"icChange",7);this.resizeObserver=null;this.ADDITIONAL_FIELD="additional-field";this.RADIO_HORIZONTAL="horizontal";this.RADIO_VERTICAL="vertical";this.checkedValue="";this.selectedChild=-1;this.disabled=false;this.hideLabel=false;this.orientation="vertical";this.required=false;this.size="medium";this.validationStatus="";this.validationText="";this.theme="inherit";this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{this.checkOrientation()}));this.resizeObserver.observe(this.el)};this.handleKeyDown=t=>{const i=Array.from(this.el.querySelectorAll('ic-text-field[slot="additional-field"]'));const e=document.activeElement;if(i.length>0&&this.radioOptions.map((t=>o(t,this.ADDITIONAL_FIELD)))&&i.map((t=>t==e))){return}t.stopPropagation();switch(t.key){case"ArrowDown":case"ArrowRight":this.radioOptions[this.getNextItemToSelect(this.selectedChild,true)].click();t.preventDefault();break;case"ArrowUp":case"ArrowLeft":this.radioOptions[this.getNextItemToSelect(this.selectedChild,false)].click();t.preventDefault()}};this.getNextItemToSelect=(t,i)=>{const e=this.radioOptions.length-1;if(t<1){t=0}let s=i?t+1:t-1;if(s<0){s=e}else if(s>e){s=0}if(this.radioOptions[s].disabled){s=this.getNextItemToSelect(s,i)}return s};this.addSlotChangeListener=()=>{var t;(t=this.radioContainer)===null||t===void 0?void 0:t.addEventListener("slotchange",this.setRadioOptions)};this.setFirstRadioOptionTabIndex=t=>{this.radioOptions[0].setTabIndex(t)};this.setRadioOptions=()=>{this.selectedChild=-1;this.checkedValue="";this.radioOptions=Array.from(this.el.children).filter((t=>t.tagName==="IC-RADIO-OPTION"));if(this.radioOptions.length>0){this.radioOptions.forEach(((t,i)=>{if(!t.selected){t.selected=this.checkedValue===t.value}t.name=this.name;t.groupLabel=this.label;if(t.selected){this.selectedChild=i;this.checkedValue=t.value}if(this.disabled){t.disabled=true}}));this.setFirstRadioOptionTabIndex(this.selectedChild>0?-1:0);if(this.initialOrientation===this.RADIO_HORIZONTAL&&this.radioOptions!==undefined&&(this.radioOptions.length>2||this.radioOptions.length===2&&(o(this.radioOptions[0],this.ADDITIONAL_FIELD)||o(this.radioOptions[1],this.ADDITIONAL_FIELD)))){this.currentOrientation=this.RADIO_VERTICAL}}}}watchDisabledHandler(t){this.radioOptions.forEach((i=>i.disabled=t));n(this.disabled,this.el)}orientationChangeHandler(){this.initialOrientation=this.orientation;this.checkOrientation()}watchThemeHandler(t){this.radioOptions.forEach((i=>i.theme=t))}disconnectedCallback(){var t,i;(t=this.resizeObserver)===null||t===void 0?void 0:t.disconnect();(i=this.radioContainer)===null||i===void 0?void 0:i.removeEventListener("slotchange",this.setRadioOptions)}componentWillLoad(){n(this.disabled,this.el);this.orientationChangeHandler();this.currentOrientation=this.initialOrientation}componentDidLoad(){this.setRadioOptions();r(this.runResizeObserver);this.addSlotChangeListener();l([{prop:this.label,propName:"label"},{prop:this.name,propName:"name"}],"Radio Group");this.watchThemeHandler(this.theme)}selectHandler({detail:t,target:i}){var e;const s=i;if(s.parentElement===this.el){this.checkedValue=t.value;this.icChange.emit({value:this.checkedValue,selectedOption:{radio:s,textFieldValue:(e=s===null||s===void 0?void 0:s.querySelector("ic-text-field"))===null||e===void 0?void 0:e.value}});if(this.radioOptions!==undefined){this.radioOptions.forEach(((t,i)=>{t.selected=s===t;if(t.selected){this.selectedChild=i}}));this.setFirstRadioOptionTabIndex(this.selectedChild>0?-1:0)}}}changeHandler(){var t;const i=(t=this.radioOptions)===null||t===void 0?void 0:t.findIndex((t=>t.selected));if(i<0){this.setFirstRadioOptionTabIndex(0);this.selectedChild=i}}checkOrientation(){if(this.initialOrientation===this.RADIO_HORIZONTAL){let t=0;if(Array.isArray(this.radioOptions)&&this.radioOptions.length>0){this.radioOptions.forEach((({clientWidth:i},e,s)=>{t+=i;if(e<s.length-1)t+=40}))}else{t=0}if(this.initialOrientation==this.RADIO_HORIZONTAL){if(this.radioOptions!==undefined&&(this.radioOptions.length>2||this.radioOptions.length===2&&(o(this.radioOptions[0],this.ADDITIONAL_FIELD)||o(this.radioOptions[1],this.ADDITIONAL_FIELD)))){this.currentOrientation=this.RADIO_VERTICAL}else{if(this.radioContainer){if(t>=this.radioContainer.clientWidth){this.currentOrientation=this.RADIO_VERTICAL}else if(t<this.radioContainer.clientWidth){this.currentOrientation=this.RADIO_HORIZONTAL}}}}}}render(){const{currentOrientation:t,disabled:i,handleKeyDown:a,helperText:o,hideLabel:n,label:r,required:l,size:d,validationStatus:c,validationText:b,theme:p}=this;return e(s,{key:"db83cc9de43015de4c06e3ed5b35c59262c2058d",onKeyDown:a,class:{"ic-radio-group-small":d==="small",[`ic-theme-${p}`]:p!=="inherit"}},e("div",{key:"e11f551827b7a774965876a1021294411b16f6ec",role:"radiogroup","aria-label":`${r}${l?", required":""}`},!n&&e("ic-input-label",{key:"7e4a2d8f187ab28fa362d55c47eb3d4ae7d784fd",class:{[`${c}`]:true,["disabled"]:!!i},label:r,helperText:o,required:l,disabled:i}),e("div",{key:"b2d6d9845a82f7f10dcaa5dbbed0bf5481dd696f",class:{"radio-buttons-container":true,horizontal:t===this.RADIO_HORIZONTAL},ref:t=>this.radioContainer=t},e("slot",{key:"bab10c5275b6f71de87310c3ec04bacb894be115"}))),h(c,i)&&e("ic-input-validation",{key:"3c6b84cfce970db11c8e958abd82904931654f3d",ariaLiveMode:"polite",status:c,message:b}))}get el(){return a(this)}static get watchers(){return{disabled:["watchDisabledHandler"],orientation:["orientationChangeHandler"],theme:["watchThemeHandler"]}}};b.style=c;export{b as ic_radio_group};
+//# sourceMappingURL=p-e56d0db2.entry.js.map

package/dist/core/p-e56d0db2.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icRadioGroupCss","IcRadioGroupStyle0","RadioGroup","constructor","hostRef","this","resizeObserver","ADDITIONAL_FIELD","RADIO_HORIZONTAL","RADIO_VERTICAL","checkedValue","selectedChild","disabled","hideLabel","orientation","required","size","validationStatus","validationText","theme","runResizeObserver","ResizeObserver","checkOrientation","observe","el","handleKeyDown","event","additionalFields","Array","from","querySelectorAll","activeEl","document","activeElement","length","radioOptions","map","slotHasContent","stopPropagation","key","getNextItemToSelect","click","preventDefault","currentItem","movingDown","numRadios","nextItem","addSlotChangeListener","_a","radioContainer","addEventListener","setRadioOptions","setFirstRadioOptionTabIndex","value","setTabIndex","children","filter","tagName","forEach","radioOption","index","selected","name","groupLabel","label","initialOrientation","undefined","currentOrientation","watchDisabledHandler","newValue","removeDisabledFalse","orientationChangeHandler","watchThemeHandler","disconnectedCallback","disconnect","_b","removeEventListener","componentWillLoad","componentDidLoad","checkResizeObserver","onComponentRequiredPropUndefined","prop","propName","selectHandler","detail","target","selectedOption","parentElement","icChange","emit","radio","textFieldValue","querySelector","changeHandler","findIndex","totalWidth","isArray","clientWidth","i","arr","render","helperText","h","Host","onKeyDown","class","role","horizontal","ref","hasValidationStatus","ariaLiveMode","status","message"],"sources":["src/components/ic-radio-group/ic-radio-group.css?tag=ic-radio-group&encapsulation=shadow","src/components/ic-radio-group/ic-radio-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n\n  --ic-input-label-text-color: var(--ic-radio-button-input-field-label);\n  --ic-input-label-helper-text-color: var(\n    --ic-radio-button-input-field-subtitle\n  );\n  --ic-input-validation-status-text-color: var(--ic-radio-button-state-text);\n  --ic-input-validation-error: var(--ic-radio-button-state-icon-error);\n}\n\nic-input-label.error {\n  --ic-input-label-text-color: var(--ic-radio-button-input-field-label-error);\n}\n\nic-input-label.disabled {\n  --ic-input-label-text-color: var(\n    --ic-radio-button-input-field-label-disabled\n  );\n  --ic-input-label-helper-text-color: var(\n    --ic-radio-button-input-field-subtitle-disabled\n  );\n}\n\nic-input-validation {\n  margin-top: var(--ic-space-sm);\n}\n\n:host(.ic-radio-group-small) ic-input-validation {\n  margin-top: calc(var(--ic-space-sm) / 2);\n}\n\nic-input-label ic-typography {\n  margin-bottom: var(--ic-space-sm);\n}\n\n:host(.ic-radio-group-small) ic-input-label ic-typography {\n  margin-bottom: calc(var(--ic-space-sm) / 2);\n}\n\n:host .radio-buttons-container {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ic-space-xxs);\n}\n\n:host(.ic-radio-group-small) .radio-buttons-container {\n  gap: var(--ic-space-xxxs);\n}\n\n:host .radio-buttons-container.horizontal {\n  display: flex;\n  flex-direction: row;\n  gap: calc(var(--ic-space-xl) + var(--ic-space-xs));\n}\n\n:host(.ic-radio-group-small) .radio-buttons-container.horizontal {\n  gap: var(--ic-space-xl);\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Listen,\n  Element,\n  Event,\n  EventEmitter,\n  Watch,\n} from \"@stencil/core\";\nimport {\n  hasValidationStatus,\n  slotHasContent,\n  onComponentRequiredPropUndefined,\n  removeDisabledFalse,\n  checkResizeObserver,\n} from \"../../utils/helpers\";\nimport {\n  IcInformationStatusOrEmpty,\n  IcOrientation,\n  IcSizesNoLarge,\n  IcThemeMode,\n  IcValueEventDetail,\n} from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-radio-group.types\";\n\n@Component({\n  tag: \"ic-radio-group\",\n  styleUrl: \"ic-radio-group.css\",\n  shadow: true,\n})\nexport class RadioGroup {\n  private radioContainer?: HTMLDivElement;\n  private radioOptions: HTMLIcRadioOptionElement[];\n  private resizeObserver: ResizeObserver | null = null;\n  private ADDITIONAL_FIELD = \"additional-field\";\n  private RADIO_HORIZONTAL: IcOrientation = \"horizontal\";\n  private RADIO_VERTICAL: IcOrientation = \"vertical\";\n\n  @Element() el: HTMLIcRadioGroupElement;\n\n  @State() checkedValue: string = \"\";\n  @State() currentOrientation: IcOrientation;\n  @State() initialOrientation: IcOrientation;\n  @State() selectedChild: number = -1;\n\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled?: boolean = false;\n\n  @Watch(\"disabled\")\n  watchDisabledHandler(newValue: boolean): void {\n    this.radioOptions.forEach(\n      (radioOption) => (radioOption.disabled = newValue)\n    );\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  /**\n   * The helper text that will be displayed for additional field guidance.\n   */\n  @Prop() helperText?: string;\n\n  /**\n   * If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n   */\n  @Prop() hideLabel?: boolean = false;\n\n  /**\n   * The label for the radio group to be displayed.\n   */\n  @Prop() label!: string;\n\n  /**\n   * The name for the radio group to differentiate from other groups.\n   */\n  @Prop() name!: string;\n\n  /**\n   * The orientation of the radio buttons in the radio group. If there are more than two radio buttons in a radio group or either of the radio buttons use the `additional-field` slot, then the orientation will always be vertical.\n   */\n  @Prop() orientation?: IcOrientation = \"vertical\";\n\n  /**\n   * If `true`, the radio group will require a value.\n   */\n  @Prop() required?: boolean = false;\n\n  /**\n   * The size of the radio group component.\n   */\n  @Prop() size?: IcSizesNoLarge = \"medium\";\n\n  /**\n   * The validation status - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() validationStatus?: IcInformationStatusOrEmpty = \"\";\n\n  /**\n   * The text to display as the validation message.\n   */\n  @Prop() validationText?: string = \"\";\n\n  @Watch(\"orientation\")\n  orientationChangeHandler(): void {\n    this.initialOrientation = this.orientation!;\n    this.checkOrientation();\n  }\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() theme?: IcThemeMode = \"inherit\";\n  @Watch(\"theme\")\n  watchThemeHandler(newValue: IcThemeMode): void {\n    this.radioOptions.forEach((radioOption) => (radioOption.theme = newValue));\n  }\n\n  /**\n   * Emitted when a user selects a radio.\n   */\n  @Event() icChange: EventEmitter<IcChangeEventDetail>;\n\n  disconnectedCallback(): void {\n    this.resizeObserver?.disconnect();\n    this.radioContainer?.removeEventListener(\n      \"slotchange\",\n      this.setRadioOptions\n    );\n  }\n\n  componentWillLoad(): void {\n    removeDisabledFalse(this.disabled, this.el);\n\n    this.orientationChangeHandler();\n    this.currentOrientation = this.initialOrientation;\n  }\n\n  componentDidLoad(): void {\n    this.setRadioOptions();\n    checkResizeObserver(this.runResizeObserver);\n    this.addSlotChangeListener();\n\n    onComponentRequiredPropUndefined(\n      [\n        { prop: this.label, propName: \"label\" },\n        { prop: this.name, propName: \"name\" },\n      ],\n      \"Radio Group\"\n    );\n\n    this.watchThemeHandler(this.theme!);\n  }\n\n  @Listen(\"icCheck\")\n  selectHandler({ detail, target }: CustomEvent<IcValueEventDetail>): void {\n    const selectedOption = target as HTMLIcRadioOptionElement;\n    if (selectedOption.parentElement === this.el) {\n      this.checkedValue = detail.value as string;\n      this.icChange.emit({\n        value: this.checkedValue,\n        selectedOption: {\n          radio: selectedOption,\n          textFieldValue: selectedOption?.querySelector(\"ic-text-field\")?.value,\n        },\n      });\n\n      if (this.radioOptions !== undefined) {\n        this.radioOptions.forEach((radioOption, index) => {\n          radioOption.selected = selectedOption === radioOption;\n          if (radioOption.selected) {\n            this.selectedChild = index;\n          }\n        });\n        this.setFirstRadioOptionTabIndex(this.selectedChild > 0 ? -1 : 0);\n      }\n    }\n  }\n\n  @Listen(\"icSelectedChange\")\n  changeHandler(): void {\n    const selectedOption = this.radioOptions?.findIndex(\n      (radioOption) => radioOption.selected\n    );\n    if (selectedOption < 0) {\n      this.setFirstRadioOptionTabIndex(0);\n      this.selectedChild = selectedOption;\n    }\n  }\n\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.checkOrientation();\n    });\n\n    this.resizeObserver.observe(this.el);\n  };\n\n  private checkOrientation() {\n    if (this.initialOrientation === this.RADIO_HORIZONTAL) {\n      let totalWidth = 0;\n      if (Array.isArray(this.radioOptions) && this.radioOptions.length > 0) {\n        this.radioOptions.forEach(({ clientWidth }, i, arr) => {\n          totalWidth += clientWidth;\n          if (i < arr.length - 1) totalWidth += 40;\n        });\n      } else {\n        totalWidth = 0;\n      }\n\n      if (this.initialOrientation == this.RADIO_HORIZONTAL) {\n        if (\n          this.radioOptions !== undefined &&\n          (this.radioOptions.length > 2 ||\n            (this.radioOptions.length === 2 &&\n              (slotHasContent(this.radioOptions[0], this.ADDITIONAL_FIELD) ||\n                slotHasContent(this.radioOptions[1], this.ADDITIONAL_FIELD))))\n        ) {\n          this.currentOrientation = this.RADIO_VERTICAL;\n        } else {\n          if (this.radioContainer) {\n            if (totalWidth >= this.radioContainer.clientWidth) {\n              this.currentOrientation = this.RADIO_VERTICAL;\n            } else if (totalWidth < this.radioContainer.clientWidth) {\n              this.currentOrientation = this.RADIO_HORIZONTAL;\n            }\n          }\n        }\n      }\n    }\n  }\n\n  private handleKeyDown = (event: KeyboardEvent): void => {\n    const additionalFields = Array.from(\n      this.el.querySelectorAll<HTMLElement>(\n        'ic-text-field[slot=\"additional-field\"]'\n      )\n    );\n    const activeEl = document.activeElement;\n    if (\n      additionalFields.length > 0 &&\n      this.radioOptions.map((el) =>\n        slotHasContent(el, this.ADDITIONAL_FIELD)\n      ) &&\n      additionalFields.map((el) => el == activeEl)\n    ) {\n      return;\n    }\n\n    event.stopPropagation();\n    switch (event.key) {\n      case \"ArrowDown\":\n      case \"ArrowRight\":\n        this.radioOptions[\n          this.getNextItemToSelect(this.selectedChild, true)\n        ].click();\n        event.preventDefault();\n        break;\n      case \"ArrowUp\":\n      case \"ArrowLeft\":\n        this.radioOptions[\n          this.getNextItemToSelect(this.selectedChild, false)\n        ].click();\n        event.preventDefault();\n    }\n  };\n\n  private getNextItemToSelect = (\n    currentItem: number,\n    movingDown: boolean\n  ): number => {\n    const numRadios = this.radioOptions.length - 1;\n\n    if (currentItem < 1) {\n      currentItem = 0;\n    }\n\n    let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n\n    //check if wrap around necessary\n    if (nextItem < 0) {\n      nextItem = numRadios;\n    } else if (nextItem > numRadios) {\n      nextItem = 0;\n    }\n\n    //if next item is disabled then find next\n    if (this.radioOptions[nextItem].disabled) {\n      nextItem = this.getNextItemToSelect(nextItem, movingDown);\n    }\n\n    return nextItem;\n  };\n\n  private addSlotChangeListener = () => {\n    this.radioContainer?.addEventListener(\"slotchange\", this.setRadioOptions);\n  };\n\n  private setFirstRadioOptionTabIndex = (value: number) => {\n    this.radioOptions[0].setTabIndex(value);\n  };\n\n  private setRadioOptions = () => {\n    this.selectedChild = -1;\n    this.checkedValue = \"\";\n    this.radioOptions = Array.from(this.el.children).filter(\n      (el) => el.tagName === \"IC-RADIO-OPTION\"\n    ) as HTMLIcRadioOptionElement[];\n    if (this.radioOptions.length > 0) {\n      this.radioOptions.forEach((radioOption, index) => {\n        if (!radioOption.selected) {\n          radioOption.selected = this.checkedValue === radioOption.value;\n        }\n        radioOption.name = this.name;\n        radioOption.groupLabel = this.label;\n        if (radioOption.selected) {\n          this.selectedChild = index;\n          this.checkedValue = radioOption.value;\n        }\n        if (this.disabled) {\n          radioOption.disabled = true;\n        }\n      });\n      this.setFirstRadioOptionTabIndex(this.selectedChild > 0 ? -1 : 0);\n\n      if (\n        this.initialOrientation === this.RADIO_HORIZONTAL &&\n        this.radioOptions !== undefined &&\n        (this.radioOptions.length > 2 ||\n          (this.radioOptions.length === 2 &&\n            (slotHasContent(this.radioOptions[0], this.ADDITIONAL_FIELD) ||\n              slotHasContent(this.radioOptions[1], this.ADDITIONAL_FIELD))))\n      ) {\n        this.currentOrientation = this.RADIO_VERTICAL;\n      }\n    }\n  };\n\n  render() {\n    const {\n      currentOrientation,\n      disabled,\n      handleKeyDown,\n      helperText,\n      hideLabel,\n      label,\n      required,\n      size,\n      validationStatus,\n      validationText,\n      theme,\n    } = this;\n\n    return (\n      <Host\n        onKeyDown={handleKeyDown}\n        class={{\n          \"ic-radio-group-small\": size === \"small\",\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n      >\n        <div\n          role=\"radiogroup\"\n          aria-label={`${label}${required ? \", required\" : \"\"}`}\n        >\n          {!hideLabel && (\n            <ic-input-label\n              class={{\n                [`${validationStatus}`]: true,\n                [\"disabled\"]: !!disabled,\n              }}\n              label={label}\n              helperText={helperText}\n              required={required}\n              disabled={disabled}\n            ></ic-input-label>\n          )}\n          <div\n            class={{\n              \"radio-buttons-container\": true,\n              horizontal: currentOrientation === this.RADIO_HORIZONTAL,\n            }}\n            ref={(el) => (this.radioContainer = el)}\n          >\n            <slot></slot>\n          </div>\n        </div>\n        {hasValidationStatus(validationStatus, disabled) && (\n          <ic-input-validation\n            ariaLiveMode=\"polite\"\n            status={validationStatus}\n            message={validationText!}\n          ></ic-input-validation>\n        )}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/core/p-e586ae7b.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as r,H as t,g as i}from"./p-8e4e97b4.js";import{C as s}from"./p-3b185c32.js";import{i as c,u as a,d as o}from"./p-281ce313.js";const n=`<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M20 11H7.83L13.42 5.41L12 4L4 12L12 20L13.41 18.59L7.83 13H20V11Z" fill="currentColor"/>\n</svg>\n`;const l=':host{display:block;margin:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0}:host .breadcrumb{display:flex;align-items:center;white-space:nowrap;gap:var(--ic-space-xs);min-height:var(--ic-space-lg)}:host .chevron{width:var(--ic-space-lg);height:var(--ic-space-lg)}:host .chevron svg,:host(.ic-breadcrumb-monochrome) .chevron svg{color:var(--ic-breadcrumb-icon-chevron)}:host(:first-child) .chevron{display:none}.back-icon svg{color:var(--ic-breadcrumb-icon)}:host(.ic-breadcrumb-monochrome) .back-icon svg{color:var(--ic-breadcrumb-icon-monochrome)}:host(.ic-breadcrumb-back){display:flex;align-items:center}:host(.ic-breadcrumb-back) .chevron{display:none}ic-link{--breadcrumb-link-display:inline-flex;--breadcrumb-link-align-items:center;--breadcrumb-link-gap:var(--ic-space-xs)}:host([aria-current="page"]){cursor:text}:host([aria-current="page"]) .current-page-container{display:flex;align-items:center;gap:var(--ic-space-xs);color:var(--ic-breadcrumb-text)}:host([aria-current="page"].ic-breadcrumb-monochrome) .current-page-container{color:var(--ic-breadcrumb-text-monochrome)}:host([aria-current="page"]) slot{pointer-events:none}:host(.collapsed-breadcrumb-wrapper){margin-right:var(--ic-space-xs) !important;display:flex;align-items:center;gap:var(--ic-space-xs)}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb){border:none;background-color:transparent;color:var(--ic-color-hyperlink-default);text-decoration:underline;font-weight:var(--ic-font-weight-bold);cursor:pointer}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus){outline:var(--ic-hc-focus-outline);border-bottom:0.25rem solid !important;margin-bottom:-0.25rem !important;text-decoration:none}.hide,:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide){display:none}.slotted-link-container{gap:var(--ic-space-xs);display:flex}.slotted-link-container .back-icon{width:1.5rem;height:1.5rem}.slotted-link-container .link-wrapper{line-height:1.5rem}@media (forced-colors: active){.back-icon svg{color:currentcolor}}@supports (text-underline-offset: 25%){ic-link{--breadcrumb-link-display:flex}:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus){text-decoration-line:underline;text-decoration-thickness:25%;text-underline-offset:25%;border-bottom:0 !important;margin-bottom:0 !important}}';const d=l;const h=class{constructor(t){e(this,t);this.HREF_ATTR="href";this.current=false;this.monochrome=false;this.showBackIcon=false;this.theme="inherit";this.updatedSlottedLinkFocus=()=>{if(this.linkSlotContent){this.linkSlotContent.tabIndex=this.current?-1:0}if(this.slottedLinkEl){if(this.current){this.slottedLinkEl.removeAttribute(this.HREF_ATTR)}else{this.slottedLinkHref&&this.slottedLinkEl.setAttribute(this.HREF_ATTR,this.slottedLinkHref)}}};this.getSlottedLinkEl=()=>{const e=this.linkSlotContent;if(e){const r=e.hasAttribute(this.HREF_ATTR)?e:e.querySelector("[href]");return r}return null};this.renderBackIcon=()=>r("div",{class:"back-icon",innerHTML:n});this.renderDefaultBreadcrumb=(e,t,i,s)=>{const a=t!==null&&o(t)&&t!=="";if(e&&a){return r("span",{class:{"current-page-container":e}},c(this.el,"icon")&&r("slot",{name:"icon"}),t)}return r("ic-link",{theme:this.theme,monochrome:this.monochrome,href:s,class:"breadcrumb-link","aria-describedby":this.showBackIcon&&i&&i},this.showBackIcon&&this.renderBackIcon(),c(this.el,"icon")&&r("slot",{name:"icon"}),t)};this.setSlottedCurrentPageClass=()=>{const e=this.el.querySelector("ic-link");const r="current-page";if(e){e.classList.remove(r);if(this.current){const t=e.classList.contains(r);if(!t){e.classList.add("breadcrumb-link",r)}}}}}watchCurrentHandler(){this.updatedSlottedLinkFocus();this.el.ariaCurrent=this.current?"page":null}componentDidLoad(){var e,r;const t=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector(".link-wrapper");if(t){const e=a(t);if(e){this.linkSlotContent=e[0]}this.slottedLinkEl=this.getSlottedLinkEl();this.slottedLinkHref=(r=this.slottedLinkEl)===null||r===void 0?void 0:r.getAttribute("href");this.updatedSlottedLinkFocus()}}componentWillRender(){this.setSlottedCurrentPageClass()}async setFocus(){var e,r;(r=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("ic-link"))===null||r===void 0?void 0:r.focus()}render(){const{current:e,href:i,pageTitle:c}=this;const a=`${c&&c.toLowerCase().replace(" ","-")}-describedby`;const n=c!==null&&o(c)&&c!=="";const l=i!==null&&o(i)&&i!=="";return r(t,{key:"29422d3d1b30d190d6233a644ad70df833478edd",class:{"ic-breadcrumb-back":!!this.showBackIcon,[`ic-theme-${this.theme}`]:this.theme!=="inherit","ic-breadcrumb-monochrome":!!this.monochrome},"aria-current":e&&"page",role:"listitem"},r("div",{key:"1f8c4f0fca86a3d08df82674e33cabe7419f7616",class:"breadcrumb"},r("span",{key:"9761c21d30b9e55e8cf5d3517ada73fa4d73710b",innerHTML:s,class:"chevron","aria-hidden":"true"}),this.showBackIcon&&a&&r("span",{key:"ad6be34d684a28dd063895c73f35ed65a3741dc9",id:a,class:"hide"},`Back to ${c}`),n&&l?this.renderDefaultBreadcrumb(!!e,c,a,i):r("div",{class:"slotted-link-container"},this.showBackIcon&&this.renderBackIcon(),r("span",{class:"link-wrapper"},r("slot",null)))))}static get delegatesFocus(){return true}get el(){return i(this)}static get watchers(){return{current:["watchCurrentHandler"]}}};h.style=d;export{h as ic_breadcrumb};
+//# sourceMappingURL=p-e586ae7b.entry.js.map

package/dist/core/p-e586ae7b.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icBreadcrumbCss","IcBreadcrumbStyle0","Breadcrumb","constructor","hostRef","this","HREF_ATTR","current","monochrome","showBackIcon","theme","updatedSlottedLinkFocus","linkSlotContent","tabIndex","slottedLinkEl","removeAttribute","slottedLinkHref","setAttribute","getSlottedLinkEl","link","elWithHref","hasAttribute","querySelector","renderBackIcon","h","class","innerHTML","backIcon","renderDefaultBreadcrumb","pageTitle","describedById","href","hasPageTitle","isPropDefined","isSlotUsed","el","name","setSlottedCurrentPageClass","icLink","currentPage","classList","remove","hasCurrentPageClass","contains","add","watchCurrentHandler","ariaCurrent","componentDidLoad","slottedLinkWrapper","_a","shadowRoot","slotEls","getSlotElements","_b","getAttribute","componentWillRender","setFocus","focus","render","toLowerCase","replace","hasHref","Host","key","role","chevronIcon","id"],"sources":["src/components/ic-breadcrumb/ic-breadcrumb.css?tag=ic-breadcrumb&encapsulation=shadow","src/components/ic-breadcrumb/ic-breadcrumb.tsx"],"sourcesContent":[":host {\n  display: block;\n  margin: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;\n}\n\n:host .breadcrumb {\n  display: flex;\n  align-items: center;\n  white-space: nowrap;\n  gap: var(--ic-space-xs);\n  min-height: var(--ic-space-lg);\n}\n\n:host .chevron {\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n}\n\n:host .chevron svg,\n:host(.ic-breadcrumb-monochrome) .chevron svg {\n  color: var(--ic-breadcrumb-icon-chevron);\n}\n\n:host(:first-child) .chevron {\n  display: none;\n}\n\n.back-icon svg {\n  color: var(--ic-breadcrumb-icon);\n}\n\n:host(.ic-breadcrumb-monochrome) .back-icon svg {\n  color: var(--ic-breadcrumb-icon-monochrome);\n}\n\n:host(.ic-breadcrumb-back) {\n  display: flex;\n  align-items: center;\n}\n\n:host(.ic-breadcrumb-back) .chevron {\n  display: none;\n}\n\nic-link {\n  --breadcrumb-link-display: inline-flex;\n  --breadcrumb-link-align-items: center;\n  --breadcrumb-link-gap: var(--ic-space-xs);\n}\n\n:host([aria-current=\"page\"]) {\n  cursor: text;\n}\n\n:host([aria-current=\"page\"]) .current-page-container {\n  display: flex;\n  align-items: center;\n  gap: var(--ic-space-xs);\n  color: var(--ic-breadcrumb-text);\n}\n\n:host([aria-current=\"page\"].ic-breadcrumb-monochrome) .current-page-container {\n  color: var(--ic-breadcrumb-text-monochrome);\n}\n\n:host([aria-current=\"page\"]) slot {\n  pointer-events: none;\n}\n\n:host(.collapsed-breadcrumb-wrapper) {\n  margin-right: var(--ic-space-xs) !important;\n  display: flex;\n  align-items: center;\n  gap: var(--ic-space-xs);\n}\n\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb) {\n  border: none;\n  background-color: transparent;\n  color: var(--ic-color-hyperlink-default);\n  text-decoration: underline;\n  font-weight: var(--ic-font-weight-bold);\n  cursor: pointer;\n}\n\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus) {\n  outline: var(--ic-hc-focus-outline);\n  border-bottom: 0.25rem solid !important;\n  margin-bottom: -0.25rem !important;\n  text-decoration: none;\n}\n\n.hide,\n:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide) {\n  display: none;\n}\n\n.slotted-link-container {\n  gap: var(--ic-space-xs);\n  display: flex;\n}\n\n.slotted-link-container .back-icon {\n  width: 1.5rem;\n  height: 1.5rem;\n}\n\n.slotted-link-container .link-wrapper {\n  line-height: 1.5rem;\n}\n\n@media (forced-colors: active) {\n  .back-icon svg {\n    color: currentcolor;\n  }\n}\n\n@supports (text-underline-offset: 25%) {\n  ic-link {\n    --breadcrumb-link-display: flex;\n  }\n\n  :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),\n  :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus) {\n    text-decoration-line: underline;\n    text-decoration-thickness: 25%;\n    text-underline-offset: 25%;\n    border-bottom: 0 !important;\n    margin-bottom: 0 !important;\n  }\n}\n","import {\n  Component,\n  Host,\n  Prop,\n  h,\n  Element,\n  Method,\n  Watch,\n} from \"@stencil/core\";\nimport { IcBreadcrumbDefault } from \"./ic-breadcrumb.types\";\n\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport backIcon from \"../../assets/back-icon.svg\";\nimport {\n  getSlotElements,\n  isPropDefined,\n  isSlotUsed,\n} from \"../../utils/helpers\";\nimport { IcThemeMode } from \"../../utils/types\";\n\n/**\n * @slot icon - Content will be rendered to the left of the breadcrumb page title.\n */\n@Component({\n  tag: \"ic-breadcrumb\",\n  styleUrl: \"ic-breadcrumb.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class Breadcrumb {\n  private HREF_ATTR = \"href\";\n  private linkSlotContent: HTMLElement;\n  private slottedLinkEl: HTMLElement | null;\n  private slottedLinkHref: string | null | undefined;\n\n  @Element() el: HTMLIcBreadcrumbElement;\n\n  /**\n   * If `true`, aria-current will be set on the breadcrumb.\n   */\n  @Prop() current?: boolean = false;\n  @Watch(\"current\")\n  watchCurrentHandler(): void {\n    this.updatedSlottedLinkFocus();\n    this.el.ariaCurrent = this.current ? \"page\" : null;\n  }\n\n  /**\n   * The URL that the breadcrumb link points to.\n   */\n  @Prop() href?: string;\n\n  /**\n   * @internal If `true`, the breadcrumb will display as black in the light theme, and white in the dark theme.\n   */\n  @Prop() monochrome?: boolean = false;\n\n  /**\n   * The title of the breadcrumb.\n   */\n  @Prop() pageTitle!: string;\n\n  /**\n   * @internal If `true`, back icon will be displayed.\n   */\n  @Prop({ reflect: true }) showBackIcon?: boolean = false;\n\n  /**\n   * @internal 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() theme?: IcThemeMode = \"inherit\";\n\n  // Prevent focus on breadcrumb if current page and contains slotted link\n  private updatedSlottedLinkFocus = (): void => {\n    // Sets tabindex on wrong element in unit test snapshots\n    // - related to known Jest issue: https://github.com/ionic-team/stencil/issues/2830\n    if (this.linkSlotContent) {\n      this.linkSlotContent.tabIndex = this.current ? -1 : 0; // Prevent focus\n    }\n\n    if (this.slottedLinkEl) {\n      if (this.current) {\n        this.slottedLinkEl.removeAttribute(this.HREF_ATTR); // Prevent screen reader announcing breadcrumb as a link\n      } else {\n        this.slottedLinkHref &&\n          this.slottedLinkEl.setAttribute(this.HREF_ATTR, this.slottedLinkHref);\n      }\n    }\n  };\n\n  private getSlottedLinkEl = (): HTMLElement | null => {\n    const link = this.linkSlotContent;\n    if (link) {\n      const elWithHref = link.hasAttribute(this.HREF_ATTR)\n        ? link\n        : link.querySelector(\"[href]\");\n      return elWithHref as HTMLElement;\n    }\n    return null;\n  };\n\n  componentDidLoad(): void {\n    const slottedLinkWrapper =\n      this.el.shadowRoot?.querySelector(\".link-wrapper\");\n\n    if (slottedLinkWrapper) {\n      const slotEls = getSlotElements(slottedLinkWrapper);\n      if (slotEls) {\n        this.linkSlotContent = slotEls[0] as HTMLElement;\n      }\n      this.slottedLinkEl = this.getSlottedLinkEl();\n      this.slottedLinkHref = this.slottedLinkEl?.getAttribute(\"href\");\n      this.updatedSlottedLinkFocus();\n    }\n  }\n\n  componentWillRender(): void {\n    this.setSlottedCurrentPageClass();\n  }\n\n  /**\n   * Sets focus on the breadcrumb.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.el.shadowRoot?.querySelector(\"ic-link\")?.focus();\n  }\n\n  private renderBackIcon = () => (\n    <div class=\"back-icon\" innerHTML={backIcon}></div>\n  );\n\n  private renderDefaultBreadcrumb = (\n    current: boolean,\n    pageTitle: string,\n    describedById: string,\n    href: string | undefined\n  ): IcBreadcrumbDefault => {\n    const hasPageTitle =\n      pageTitle !== null && isPropDefined(pageTitle) && pageTitle !== \"\";\n\n    if (current && hasPageTitle) {\n      return (\n        <span\n          class={{\n            \"current-page-container\": current,\n          }}\n        >\n          {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n          {pageTitle}\n        </span>\n      );\n    }\n\n    return (\n      <ic-link\n        theme={this.theme}\n        monochrome={this.monochrome}\n        href={href}\n        class=\"breadcrumb-link\"\n        aria-describedby={this.showBackIcon && describedById && describedById}\n      >\n        {this.showBackIcon && this.renderBackIcon()}\n        {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n        {pageTitle}\n      </ic-link>\n    );\n  };\n\n  private setSlottedCurrentPageClass = () => {\n    const icLink = this.el.querySelector(\"ic-link\");\n    const currentPage = \"current-page\";\n    if (icLink) {\n      icLink.classList.remove(currentPage);\n      if (this.current) {\n        const hasCurrentPageClass = icLink.classList.contains(currentPage);\n        if (!hasCurrentPageClass) {\n          icLink.classList.add(\"breadcrumb-link\", currentPage);\n        }\n      }\n    }\n  };\n\n  render() {\n    const { current, href, pageTitle } = this;\n    const describedById = `${\n      pageTitle && pageTitle.toLowerCase().replace(\" \", \"-\")\n    }-describedby`;\n\n    const hasPageTitle =\n      pageTitle !== null && isPropDefined(pageTitle) && pageTitle !== \"\";\n    const hasHref = href !== null && isPropDefined(href) && href !== \"\";\n\n    return (\n      <Host\n        class={{\n          \"ic-breadcrumb-back\": !!this.showBackIcon,\n          [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n          \"ic-breadcrumb-monochrome\": !!this.monochrome,\n        }}\n        aria-current={current && \"page\"}\n        role=\"listitem\"\n      >\n        <div class=\"breadcrumb\">\n          <span innerHTML={chevronIcon} class=\"chevron\" aria-hidden=\"true\" />\n          {this.showBackIcon && describedById && (\n            <span\n              id={describedById}\n              class=\"hide\"\n            >{`Back to ${pageTitle}`}</span>\n          )}\n          {hasPageTitle && hasHref ? (\n            this.renderDefaultBreadcrumb(\n              !!current,\n              pageTitle,\n              describedById,\n              href\n            )\n          ) : (\n            <div class=\"slotted-link-container\">\n              {this.showBackIcon && this.renderBackIcon()}\n              <span class=\"link-wrapper\">\n                <slot />\n              </span>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/core/p-ef09b450.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as t,h as i,H as o,g as a}from"./p-8e4e97b4.js";import{r as n,i as s}from"./p-281ce313.js";import{C as r}from"./p-3b185c32.js";const c='/*! 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;border-bottom:var(--ic-space-1px) solid var(--ic-accordion-divider)}:host .expand-chevron{color:var(--ic-accordion-chevron)}:host(.ic-accordion-disabled) .expand-chevron{color:var(--ic-accordion-chevron-disabled)}.section-button.small{padding:var(--ic-space-xxs) var(--ic-space-xs)}.section-button.large{padding:var(--ic-space-sm) var(--ic-space-xs)}:host(:first-of-type){border-top:var(--ic-space-1px) solid var(--ic-accordion-divider)}:focus{outline:none}.section-button{background-color:transparent;display:flex;align-items:center;width:100%;padding:var(--ic-space-xs);font-weight:var(--ic-font-weight-bold);border:none}.section-header{--ic-typography-color:var(--ic-accordion-heading-text);color:var(--ic-accordion-heading-text);text-align:left;flex:1 0}:host(.ic-accordion-disabled) .section-header{--ic-typography-color:var(--ic-accordion-heading-text-disabled);color:var(--ic-accordion-heading-text-disabled)}button:hover{background-color:var(--ic-accordion-background-hover);cursor:pointer}button:active{background-color:var(--ic-accordion-background-pressed)}button:focus{box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);transition:var(--ic-transition-duration-fast)}button:disabled{pointer-events:none}.icon-container{margin:0 var(--ic-space-xs) 0 0;display:flex;align-items:center;width:var(--ic-space-lg);height:var(--ic-space-lg);color:var(--ic-accordion-icon)}:host(.ic-accordion-disabled) .icon-container{color:var(--ic-accordion-icon-disabled)}::slotted(svg){width:var(--ic-space-md);height:var(--ic-space-md)}.expand-chevron{width:var(--ic-space-lg);height:var(--ic-space-lg);margin-left:calc(var(--ic-space-xl) + var(--ic-space-xs));transform:rotate(90deg);justify-self:end}.content-expanded-chevron{transform:rotate(-90deg)}.expanded-content{--ic-typography-color:var(--ic-accordion-body-text);color:var(--ic-accordion-body-text);height:0;overflow:hidden;display:flex;flex-direction:column;visibility:var(--ic-expanded-content-visibility, hidden)}.expanded-content-inner{padding:var(--ic-space-xs)}.expanded-content-opened{overflow:visible}@media (forced-colors: active){button:focus{border:var(--ic-border-hc) !important}}';const d=c;let l=0;const h=class{constructor(i){e(this,i);this.accordionClicked=t(this,"accordionClicked",7);this.accordionId=`ic-accordion-${l++}`;this.CONTENT_VISIBILITY_PROPERTY="--ic-expanded-content-visibility";this.disabled=false;this.expanded=false;this.heading="";this.message="";this.size="medium";this.theme="inherit";this.toggleExpanded=()=>{this.expanded=!this.expanded;this.accordionClicked.emit({id:this.accordionId})};this.setAccordionAnimation=(e,t,i,o)=>{e.style.transitionDuration=`${t}ms`;e.style.transitionProperty=i;e.style.transitionDelay=o};this.setExpandedContentStyle=(e,t)=>{if(e.propertyName==="height"&&t.clientHeight>0){t.classList.add("expanded-content-opened");t.style.height="auto"}};this.hideExpandedContent=(e,t)=>{if(e.propertyName==="height"&&t.clientHeight===0){t.style.setProperty(this.CONTENT_VISIBILITY_PROPERTY,"hidden")}};this.animateExpandedContent=()=>{if(this.expandedContentEl){const e=this.expandedContentEl;const t=e.scrollHeight;if(t>0&&this.expanded){e.style.setProperty(this.CONTENT_VISIBILITY_PROPERTY,"visible");e.style.height=`${t}px`;this.setAccordionAnimation(e,"300","height","ease-out");e.addEventListener("transitionend",(t=>{this.setExpandedContentStyle(t,e)}))}else if(!this.expanded){const e=this.expandedContentEl;e.style.height=`${e.scrollHeight}px`;if(e.scrollHeight>0&&!this.expanded){e.style.height="0";this.setAccordionAnimation(e,"300","height","ease-in");e.classList.remove("expanded-content-opened")}e.addEventListener("transitionend",(t=>{this.hideExpandedContent(t,e)}))}}}}watchDisabledHandler(){n(this.disabled,this.el)}handleExpandedWatch(){this.animateExpandedContent()}async setFocus(){var e;(e=this.accordionBtnHeading)===null||e===void 0?void 0:e.focus()}componentWillLoad(){n(this.disabled,this.el)}disconnectedCallback(){const e=this.expandedContentEl;if(e){e.removeEventListener("transitionend",(t=>this.setExpandedContentStyle(t,e)),true);e.removeEventListener("transitionend",(t=>this.hideExpandedContent(t,e)),true)}}componentDidLoad(){if(this.expanded&&this.expandedContentEl){this.expandedContentEl.style.height="auto";this.expandedContentEl.style.setProperty(this.CONTENT_VISIBILITY_PROPERTY,"visible")}}render(){const{size:e,disabled:t,expanded:a,theme:n}=this;return i(o,{key:"1af99baa1066daa75be1af7329ed0a79a6a7f3cf",id:this.accordionId,class:{["ic-accordion-disabled"]:!!t,[`ic-theme-${n}`]:n!=="inherit"},"aria-disabled":t?"true":"false"},i("button",{key:"95695d5beebac9e84bc55159d8602182698ece75",ref:e=>this.accordionBtnHeading=e,id:`${this.accordionId}-button`,disabled:t,tabindex:t?-1:0,class:{[`${e}`]:true,["section-button"]:true,["section-button-open"]:!!a&&!t},"aria-expanded":`${a}`,"aria-controls":"expanded-content-area",onClick:this.toggleExpanded},s(this.el,"icon")&&i("div",{key:"274fc2d72fefc6b7f52e4c11fb0dec81055aeb1e",class:"icon-container"},i("slot",{key:"b8fb45c64beba9a319776080ea7b764aa4a0b9db",name:"icon"})),i("ic-typography",{key:"c0ca1e3a7f4a8cb7b05a3892eec1db728162db91",variant:"subtitle-large",class:"section-header"},s(this.el,"heading")?i("slot",{name:"heading"}):this.heading),i("span",{key:"c8a70311d3d99114ff1f75c63dbbbbf1077e59c7",class:{["expand-chevron"]:true,["content-expanded-chevron"]:!!a&&!t},"aria-hidden":"true",innerHTML:r})),i("div",{key:"2bbae7f78c0a88f767c64fa0849c6c13bd998128",class:{["expanded-content"]:true},"aria-labelledby":`${this.accordionId}-button`,role:"region","aria-hidden":`${!a}`,id:"expanded-content-area",ref:e=>this.expandedContentEl=e},i("div",{key:"49f53a7ceb1a9a13f50542e93445bacd7d9d9a1e",class:"expanded-content-inner"},this.message?i("ic-typography",{variant:"body"},this.message):i("slot",null))))}get el(){return a(this)}static get watchers(){return{disabled:["watchDisabledHandler"],expanded:["handleExpandedWatch"]}}};h.style=d;export{h as ic_accordion};
+//# sourceMappingURL=p-ef09b450.entry.js.map

package/dist/core/p-ef09b450.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icAccordionCss","IcAccordionStyle0","accordionIds","Accordion","constructor","hostRef","this","accordionId","CONTENT_VISIBILITY_PROPERTY","disabled","expanded","heading","message","size","theme","toggleExpanded","accordionClicked","emit","id","setAccordionAnimation","el","duration","property","delay","style","transitionDuration","transitionProperty","transitionDelay","setExpandedContentStyle","ev","expandedContent","propertyName","clientHeight","classList","add","height","hideExpandedContent","setProperty","animateExpandedContent","expandedContentEl","elementHeight","scrollHeight","addEventListener","e","remove","watchDisabledHandler","removeDisabledFalse","handleExpandedWatch","setFocus","_a","accordionBtnHeading","focus","componentWillLoad","disconnectedCallback","removeEventListener","componentDidLoad","render","h","Host","key","class","ref","tabindex","onClick","isSlotUsed","name","variant","innerHTML","chevronIcon","role"],"sources":["src/components/ic-accordion/ic-accordion.css?tag=ic-accordion&encapsulation=shadow","src/components/ic-accordion/ic-accordion.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n  border-bottom: var(--ic-space-1px) solid var(--ic-accordion-divider);\n}\n\n:host .expand-chevron {\n  color: var(--ic-accordion-chevron);\n}\n\n:host(.ic-accordion-disabled) .expand-chevron {\n  color: var(--ic-accordion-chevron-disabled);\n}\n\n.section-button.small {\n  padding: var(--ic-space-xxs) var(--ic-space-xs);\n}\n\n.section-button.large {\n  padding: var(--ic-space-sm) var(--ic-space-xs);\n}\n\n:host(:first-of-type) {\n  border-top: var(--ic-space-1px) solid var(--ic-accordion-divider);\n}\n\n:focus {\n  outline: none;\n}\n\n.section-button {\n  background-color: transparent;\n  display: flex;\n  align-items: center;\n  width: 100%;\n  padding: var(--ic-space-xs);\n  font-weight: var(--ic-font-weight-bold);\n  border: none;\n}\n\n.section-header {\n  --ic-typography-color: var(--ic-accordion-heading-text);\n\n  color: var(--ic-accordion-heading-text);\n  text-align: left;\n  flex: 1 0;\n}\n\n:host(.ic-accordion-disabled) .section-header {\n  --ic-typography-color: var(--ic-accordion-heading-text-disabled);\n\n  color: var(--ic-accordion-heading-text-disabled);\n}\n\nbutton:hover {\n  background-color: var(--ic-accordion-background-hover);\n  cursor: pointer;\n}\n\nbutton:active {\n  background-color: var(--ic-accordion-background-pressed);\n}\n\nbutton:focus {\n  box-shadow: var(--ic-border-focus);\n  border-radius: var(--ic-border-radius);\n  transition: var(--ic-transition-duration-fast);\n}\n\nbutton:disabled {\n  pointer-events: none;\n}\n\n.icon-container {\n  margin: 0 var(--ic-space-xs) 0 0;\n  display: flex;\n  align-items: center;\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n  color: var(--ic-accordion-icon);\n}\n\n:host(.ic-accordion-disabled) .icon-container {\n  color: var(--ic-accordion-icon-disabled);\n}\n\n::slotted(svg) {\n  width: var(--ic-space-md);\n  height: var(--ic-space-md);\n}\n\n.expand-chevron {\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n  margin-left: calc(var(--ic-space-xl) + var(--ic-space-xs));\n  transform: rotate(90deg);\n  justify-self: end;\n}\n\n.content-expanded-chevron {\n  transform: rotate(-90deg);\n}\n\n.expanded-content {\n  --ic-typography-color: var(--ic-accordion-body-text);\n\n  color: var(--ic-accordion-body-text);\n  height: 0;\n  overflow: hidden;\n  display: flex;\n  flex-direction: column;\n  visibility: var(--ic-expanded-content-visibility, hidden);\n}\n\n.expanded-content-inner {\n  padding: var(--ic-space-xs);\n}\n\n.expanded-content-opened {\n  overflow: visible;\n}\n\n@media (forced-colors: active) {\n  button:focus {\n    border: var(--ic-border-hc) !important;\n  }\n}\n","import {\n  Component,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Watch,\n  Method,\n} from \"@stencil/core\";\nimport { isSlotUsed, removeDisabledFalse } from \"../../utils/helpers\";\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport { IcSizes, IcThemeMode } from \"../../utils/types\";\n\nlet accordionIds = 0;\n\n/**\n * @slot heading - Content is placed as the accordion heading.\n * @slot icon - Content is placed to the left of the heading.\n */\n\n@Component({\n  tag: \"ic-accordion\",\n  styleUrl: \"ic-accordion.css\",\n  shadow: true,\n})\nexport class Accordion {\n  private accordionId = `ic-accordion-${accordionIds++}`;\n  private expandedContentEl?: HTMLDivElement;\n  private accordionBtnHeading?: HTMLButtonElement;\n  private CONTENT_VISIBILITY_PROPERTY = \"--ic-expanded-content-visibility\";\n\n  @Element() el: HTMLIcAccordionElement;\n\n  /**\n   * If `true`, the accordion will be disabled.\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 accordion appears expanded.\n   */\n  @Prop({ mutable: true }) expanded?: boolean = false;\n\n  /**\n   * The section header outlining section content.\n   */\n  @Prop() heading?: string = \"\";\n\n  /**\n   * The main body message of the accordion.\n   */\n  @Prop() message?: string = \"\";\n\n  /**\n   * The size of the accordion.\n   */\n  @Prop() size?: IcSizes = \"medium\";\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() theme?: IcThemeMode = \"inherit\";\n\n  /**\n   * @internal Emitted when accordion is clicked.\n   */\n  @Event() accordionClicked: EventEmitter<{ id: string }>;\n\n  // Every time expanded is set via toggleExpanded or accordionGroup, animate to open or close\n  @Watch(\"expanded\")\n  handleExpandedWatch(): void {\n    this.animateExpandedContent();\n  }\n\n  /**\n   * Sets focus on accordion heading.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.accordionBtnHeading?.focus();\n  }\n\n  componentWillLoad(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  disconnectedCallback(): void {\n    const expandedContentEl = this.expandedContentEl;\n    if (expandedContentEl) {\n      expandedContentEl.removeEventListener(\n        \"transitionend\",\n        (e) => this.setExpandedContentStyle(e, expandedContentEl),\n        true\n      );\n      expandedContentEl.removeEventListener(\n        \"transitionend\",\n        (e) => this.hideExpandedContent(e, expandedContentEl),\n        true\n      );\n    }\n  }\n\n  componentDidLoad(): void {\n    // So accordion opens by default if expanded set to true\n    if (this.expanded && this.expandedContentEl) {\n      this.expandedContentEl.style.height = \"auto\";\n      this.expandedContentEl.style.setProperty(\n        this.CONTENT_VISIBILITY_PROPERTY,\n        \"visible\"\n      );\n    }\n  }\n\n  private toggleExpanded = (): void => {\n    this.expanded = !this.expanded;\n    this.accordionClicked.emit({ id: this.accordionId });\n  };\n\n  // Set accordion animation\n  private setAccordionAnimation = (\n    el: HTMLElement,\n    duration: string,\n    property: string,\n    delay: string\n  ) => {\n    el.style.transitionDuration = `${duration}ms`;\n    el.style.transitionProperty = property;\n    el.style.transitionDelay = delay;\n  };\n\n  private setExpandedContentStyle = (\n    ev: TransitionEvent,\n    expandedContent: HTMLDivElement\n  ) => {\n    if (ev.propertyName === \"height\" && expandedContent.clientHeight > 0) {\n      expandedContent.classList.add(\"expanded-content-opened\");\n      expandedContent.style.height = \"auto\";\n    }\n  };\n\n  private hideExpandedContent = (\n    ev: TransitionEvent,\n    expandedContent: HTMLDivElement\n  ) => {\n    if (ev.propertyName === \"height\" && expandedContent.clientHeight === 0) {\n      expandedContent.style.setProperty(\n        this.CONTENT_VISIBILITY_PROPERTY,\n        \"hidden\"\n      );\n    }\n  };\n\n  private animateExpandedContent = () => {\n    if (this.expandedContentEl) {\n      const expandedContentEl = this.expandedContentEl;\n      const elementHeight = expandedContentEl.scrollHeight;\n      if (elementHeight > 0 && this.expanded) {\n        expandedContentEl.style.setProperty(\n          this.CONTENT_VISIBILITY_PROPERTY,\n          \"visible\"\n        );\n        expandedContentEl.style.height = `${elementHeight}px`;\n        this.setAccordionAnimation(\n          expandedContentEl,\n          \"300\",\n          \"height\",\n          \"ease-out\"\n        );\n\n        expandedContentEl.addEventListener(\n          \"transitionend\",\n          (e: TransitionEvent) => {\n            this.setExpandedContentStyle(e, expandedContentEl);\n          }\n        );\n      } else if (!this.expanded) {\n        const expandedContentEl = this.expandedContentEl;\n        expandedContentEl.style.height = `${expandedContentEl.scrollHeight}px`;\n        if (expandedContentEl.scrollHeight > 0 && !this.expanded) {\n          expandedContentEl.style.height = \"0\";\n          this.setAccordionAnimation(\n            expandedContentEl,\n            \"300\",\n            \"height\",\n            \"ease-in\"\n          );\n          expandedContentEl.classList.remove(\"expanded-content-opened\");\n        }\n        expandedContentEl.addEventListener(\"transitionend\", (e) => {\n          this.hideExpandedContent(e, expandedContentEl);\n        });\n      }\n    }\n  };\n\n  render() {\n    const { size, disabled, expanded, theme } = this;\n    return (\n      <Host\n        id={this.accordionId}\n        class={{\n          [\"ic-accordion-disabled\"]: !!disabled,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n        aria-disabled={disabled ? \"true\" : \"false\"}\n      >\n        <button\n          ref={(el) => (this.accordionBtnHeading = el)}\n          id={`${this.accordionId}-button`}\n          disabled={disabled}\n          tabindex={disabled ? -1 : 0}\n          class={{\n            [`${size}`]: true,\n            [\"section-button\"]: true,\n            [\"section-button-open\"]: !!expanded && !disabled,\n          }}\n          aria-expanded={`${expanded}`}\n          aria-controls=\"expanded-content-area\"\n          onClick={this.toggleExpanded}\n        >\n          {isSlotUsed(this.el, \"icon\") && (\n            <div class=\"icon-container\">\n              <slot name=\"icon\" />\n            </div>\n          )}\n          <ic-typography variant=\"subtitle-large\" class=\"section-header\">\n            {isSlotUsed(this.el, \"heading\") ? (\n              <slot name=\"heading\" />\n            ) : (\n              this.heading\n            )}\n          </ic-typography>\n          <span\n            class={{\n              [\"expand-chevron\"]: true,\n              [\"content-expanded-chevron\"]: !!expanded && !disabled,\n            }}\n            aria-hidden=\"true\"\n            innerHTML={chevronIcon}\n          />\n        </button>\n        <div\n          class={{\n            [\"expanded-content\"]: true,\n          }}\n          aria-labelledby={`${this.accordionId}-button`}\n          role=\"region\"\n          aria-hidden={`${!expanded}`}\n          id=\"expanded-content-area\"\n          ref={(el) => (this.expandedContentEl = el)}\n        >\n          <div class=\"expanded-content-inner\">\n            {this.message ? (\n              <ic-typography variant=\"body\">{this.message}</ic-typography>\n            ) : (\n              <slot />\n            )}\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/core/p-f074ef5b.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":[],"mappings":""}
+{"version":3,"names":[],"sources":[],"mappings":"","ignoreList":[]}

package/dist/core/p-f34eee68.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as i,h as s,g as h}from"./p-8e4e97b4.js";const e="context-id";const a=class{constructor(s){t(this,s);this.icTabSelect=i(this,"icTabSelect",3);this.newTabPanels=[];this.newTabs=[];this.activationType="automatic";this.contextId="default";this.monochrome=false;this.theme="inherit";this.linkTabs=()=>{this.tabs.forEach(((t,i)=>{const s=`ic-tab-${i}-context-${this.contextId}`;const h=`ic-tab-panel-${i}-context-${this.contextId}`;t.setAttribute("id",s);t.tabId=`ic-tab--${i}-context-${this.contextId}`;t.tabPosition=i;t.setAttribute("aria-controls",h);this.tabPanels[i].setAttribute("id",h);this.tabPanels[i].setAttribute("aria-labelledby",s);if(this.contextId){t.setAttribute(e,this.contextId);this.tabGroup&&this.tabGroup.setAttribute(e,this.contextId);this.tabPanels[i].setAttribute(e,this.contextId)}t.theme=this.theme;this.tabPanels[i].theme=this.theme;this.tabGroup&&(this.tabGroup.theme=this.theme)}))};this.getChildren=()=>{var t;this.tabGroup=this.el.querySelector("ic-tab-group");this.tabs=Array.from(((t=this.tabGroup)===null||t===void 0?void 0:t.querySelectorAll("ic-tab"))||[]);this.tabPanels=Array.from(this.el.children).filter((t=>t.tagName==="IC-TAB-PANEL"));this.enabledTabs=this.getEnabledTabs()};this.keydownHandler=t=>{const i=this.activationType==="manual";const s=this.enabledTabs.findIndex((t=>t.tabId===this.tabs[i?this.focusedTabIndex:this.selectedTab||0].tabId));const h=i?this.keyboardFocusTab:this.keyboardSelectTab;let e=true;switch(t.key){case"Home":h(0);break;case"End":h(this.enabledTabs.length-1);break;case"ArrowRight":h(s<this.enabledTabs.length-1?s+1:0);break;case"ArrowLeft":h((s>0?s:this.enabledTabs.length)-1);break;default:if(i&&(t.key==="Enter"||t.key===" ")){this.keyboardSelectTab(this.focusedTabIndex)}else{e=false}}if(e)t.preventDefault()};this.setInitialTab=()=>{if(this.selectedTabIndex!==undefined){this.selectedTab=this.selectedTabIndex;this.focusedTabIndex=this.selectedTabIndex}else{const t=this.tabs.findIndex((t=>t.tabId===this.enabledTabs[0].tabId));this.selectedTab=t;this.focusedTabIndex=t}};this.configureTabs=()=>{this.enabledTabs.forEach((t=>{t.selected=t.tabPosition===this.selectedTab}));this.tabPanels.forEach(((t,i)=>{t.active=i===this.selectedTab}))};this.getEnabledTabs=()=>Array.from(this.tabs).filter((t=>!t.disabled));this.keyboardSelectTab=t=>{var i,s;const h=this.tabs.findIndex((i=>i.tabId===this.enabledTabs[t].tabId));this.enabledTabs[t].focus();if(this.selectedTabIndex===undefined){this.selectedTab=h}else{this.icTabSelect.emit({tabIndex:h,tabLabel:((s=(i=this.el.querySelectorAll("ic-tab")[h])===null||i===void 0?void 0:i.textContent)===null||s===void 0?void 0:s.trim())||""})}};this.keyboardFocusTab=t=>{this.enabledTabs[t].focus();this.focusedTabIndex=this.tabs.findIndex((i=>i.tabId===this.enabledTabs[t].tabId))}}updateSelectedTab(t){this.selectedTab=t}watchMonochromeHandler(){this.tabs.forEach(((t,i)=>{t.monochrome=this.monochrome;this.tabPanels[i].monochrome=this.monochrome}));this.tabGroup&&(this.tabGroup.monochrome=this.monochrome)}watchThemeHandler(){this.tabs.forEach(((t,i)=>{t.theme=this.theme;this.tabPanels[i].theme=this.theme}));this.tabGroup&&(this.tabGroup.theme=this.theme)}componentDidLoad(){if(this.selectedTabIndex!==undefined){this.selectedTab=this.selectedTabIndex}this.getChildren();this.linkTabs();this.tabGroup&&this.tabGroup.addEventListener("keydown",this.keydownHandler);this.setInitialTab();this.configureTabs()}componentWillUpdate(){this.configureTabs()}disconnectedCallback(){var t;(t=this.tabGroup)===null||t===void 0?void 0:t.removeEventListener("keydown",this.keydownHandler)}tabClickHandler(t){var i,s;if(this.selectedTabIndex===undefined&&t.detail.contextId===this.contextId){this.selectedTab=t.detail.position}this.icTabSelect.emit({tabIndex:t.detail.position,tabLabel:((s=(i=this.el.querySelectorAll("ic-tab")[t.detail.position])===null||i===void 0?void 0:i.textContent)===null||s===void 0?void 0:s.trim())||""});t.stopImmediatePropagation()}tabCreatedHandler(t){if(this.tabs&&this.tabPanels){(t.detail.setFocus?this.newTabs:this.newTabPanels).push(t.detail);if(this.newTabs.length===this.newTabPanels.length){this.tabs.push(...this.newTabs);this.tabPanels.push(...this.newTabPanels);this.enabledTabs=this.getEnabledTabs();this.linkTabs();if(this.selectedTab&&(!this.tabs[this.selectedTab]||!this.tabPanels[this.selectedTab]))this.setInitialTab();this.configureTabs();this.newTabs=[];this.newTabPanels=[]}}}tabEnabledHandler(){this.enabledTabs=this.getEnabledTabs()}async tabRemovedHandler(t){this.getChildren();this.linkTabs();if(this.selectedTab&&this.tabs[this.selectedTab]&&this.tabPanels[this.selectedTab]){this.tabs[this.selectedTab].selected=true}else{this.setInitialTab()}if(t&&this.selectedTab){this.tabs[this.selectedTab].setFocus()}}render(){return s("slot",{key:"0df9be3f91695a070675c0809d85e94e4d64ec3b"})}get el(){return h(this)}static get watchers(){return{selectedTabIndex:["updateSelectedTab"],monochrome:["watchMonochromeHandler"],theme:["watchThemeHandler"]}}};export{a as ic_tab_context};
+//# sourceMappingURL=p-f34eee68.entry.js.map

package/dist/core/p-f34eee68.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["CONTEXT_ID_ATTR","TabContext","constructor","hostRef","this","newTabPanels","newTabs","activationType","contextId","monochrome","theme","linkTabs","tabs","forEach","tab","index","tabId","tabPanelId","setAttribute","tabPosition","tabPanels","tabGroup","getChildren","el","querySelector","Array","from","_a","querySelectorAll","children","filter","child","tagName","enabledTabs","getEnabledTabs","keydownHandler","event","isManual","enabledTabIndex","findIndex","focusedTabIndex","selectedTab","keyboardFunction","keyboardFocusTab","keyboardSelectTab","preventDefault","key","length","setInitialTab","selectedTabIndex","undefined","firstEnabledTabIndex","configureTabs","selected","tabPanel","active","disabled","newIndex","focus","icTabSelect","emit","tabIndex","tabLabel","_b","textContent","trim","updateSelectedTab","newValue","watchMonochromeHandler","watchThemeHandler","componentDidLoad","addEventListener","componentWillUpdate","disconnectedCallback","removeEventListener","tabClickHandler","detail","position","stopImmediatePropagation","tabCreatedHandler","ev","setFocus","push","tabEnabledHandler","tabRemovedHandler","hadFocus","render","h"],"sources":["src/components/ic-tab-context/ic-tab-context.tsx"],"sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Listen,\n  Prop,\n  State,\n  h,\n  Watch,\n  Method,\n} from \"@stencil/core\";\nimport { IcActivationTypes, IcThemeMode } from \"../../utils/types\";\n\nimport {\n  IcTabClickEventDetail,\n  IcTabSelectEventDetail,\n} from \"../ic-tab/ic-tab.types\";\n\nconst CONTEXT_ID_ATTR = \"context-id\";\n\n@Component({\n  tag: \"ic-tab-context\",\n})\nexport class TabContext {\n  private enabledTabs: HTMLIcTabElement[];\n  private focusedTabIndex: number;\n  private newTabPanels: HTMLIcTabPanelElement[] = [];\n  private newTabs: HTMLIcTabElement[] = [];\n  private tabs: HTMLIcTabElement[];\n  private tabGroup: HTMLIcTabGroupElement | null;\n  private tabPanels: HTMLIcTabPanelElement[];\n\n  @Element() el: HTMLIcTabContextElement;\n\n  @State() selectedTab: number | null;\n\n  /**\n   * Determines whether tabs have to be manually activated (by pressing 'Enter' or 'Space') when they receive focus using keyboard navigation.\n   */\n  @Prop() activationType?: IcActivationTypes = \"automatic\";\n\n  /**\n   * The unique context needed if using multiple tabs inside one another i.e. rendering another set of tabs inside a tab panel.\n   */\n  @Prop({ reflect: true }) contextId?: string = \"default\";\n\n  /**\n   * The selected tab to be controlled by the user. Must be used alongside the icTabSelect event to manage tab selection.\n   */\n  @Prop() selectedTabIndex?: number;\n\n  @Watch(\"selectedTabIndex\")\n  updateSelectedTab(newValue: number): void {\n    this.selectedTab = newValue;\n  }\n\n  /**\n   * If `true`, the tabs will display as black in the light theme.\n   */\n  @Prop() monochrome?: boolean = false;\n  @Watch(\"monochrome\")\n  watchMonochromeHandler(): void {\n    this.tabs.forEach((tab, index) => {\n      tab.monochrome = this.monochrome;\n      this.tabPanels[index].monochrome = this.monochrome;\n    });\n    this.tabGroup && (this.tabGroup.monochrome = this.monochrome);\n  }\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() theme?: IcThemeMode = \"inherit\";\n  @Watch(\"theme\")\n  watchThemeHandler(): void {\n    this.tabs.forEach((tab, index) => {\n      tab.theme = this.theme;\n      this.tabPanels[index].theme = this.theme;\n    });\n    this.tabGroup && (this.tabGroup.theme = this.theme);\n  }\n\n  /**\n   * Emitted when a user selects a tab.\n   */\n  @Event({ bubbles: false }) icTabSelect: EventEmitter<IcTabSelectEventDetail>;\n\n  componentDidLoad(): void {\n    if (this.selectedTabIndex !== undefined) {\n      this.selectedTab = this.selectedTabIndex;\n    }\n    this.getChildren();\n    this.linkTabs();\n    this.tabGroup &&\n      this.tabGroup.addEventListener(\"keydown\", this.keydownHandler);\n    this.setInitialTab();\n    this.configureTabs();\n  }\n\n  componentWillUpdate(): void {\n    this.configureTabs();\n  }\n\n  disconnectedCallback(): void {\n    this.tabGroup?.removeEventListener(\"keydown\", this.keydownHandler);\n  }\n\n  @Listen(\"tabClick\")\n  tabClickHandler(event: CustomEvent<IcTabClickEventDetail>): void {\n    if (\n      this.selectedTabIndex === undefined &&\n      event.detail.contextId === this.contextId\n    ) {\n      this.selectedTab = event.detail.position;\n    }\n    /* eslint-disable no-unexpected-multiline */\n    this.icTabSelect.emit({\n      tabIndex: event.detail.position,\n      tabLabel:\n        this.el\n          .querySelectorAll(\"ic-tab\")\n          [event.detail.position]?.textContent?.trim() || \"\",\n    });\n    /* eslint-enable no-unexpected-multiline */\n    event.stopImmediatePropagation();\n  }\n\n  @Listen(\"tabCreated\")\n  @Listen(\"tabPanelCreated\")\n  tabCreatedHandler(ev: CustomEvent): void {\n    if (this.tabs && this.tabPanels) {\n      (ev.detail.setFocus ? this.newTabs : this.newTabPanels).push(ev.detail);\n      if (this.newTabs.length === this.newTabPanels.length) {\n        this.tabs.push(...this.newTabs);\n        this.tabPanels.push(...this.newTabPanels);\n        this.enabledTabs = this.getEnabledTabs();\n        this.linkTabs();\n        if (\n          this.selectedTab &&\n          (!this.tabs[this.selectedTab] || !this.tabPanels[this.selectedTab])\n        )\n          this.setInitialTab();\n        this.configureTabs();\n        this.newTabs = [];\n        this.newTabPanels = [];\n      }\n    }\n  }\n\n  @Listen(\"tabEnabled\")\n  tabEnabledHandler(): void {\n    this.enabledTabs = this.getEnabledTabs();\n  }\n\n  /**\n   * @internal Used to set tab/tab panel IDs when a tab/tab panel has been removed\n   */\n  @Method()\n  async tabRemovedHandler(hadFocus?: boolean): Promise<void> {\n    this.getChildren();\n    this.linkTabs();\n    if (\n      this.selectedTab &&\n      this.tabs[this.selectedTab] &&\n      this.tabPanels[this.selectedTab]\n    ) {\n      this.tabs[this.selectedTab].selected = true;\n    } else {\n      this.setInitialTab();\n    }\n\n    if (hadFocus && this.selectedTab) {\n      this.tabs[this.selectedTab].setFocus();\n    }\n  }\n\n  /** Sets attributes to link tab-group, tabs and tab-panels */\n  private linkTabs = () => {\n    this.tabs.forEach((tab, index) => {\n      const tabId = `ic-tab-${index}-context-${this.contextId}`;\n      const tabPanelId = `ic-tab-panel-${index}-context-${this.contextId}`;\n      tab.setAttribute(\"id\", tabId);\n      tab.tabId = `ic-tab--${index}-context-${this.contextId}`;\n      tab.tabPosition = index;\n      tab.setAttribute(\"aria-controls\", tabPanelId);\n      this.tabPanels[index].setAttribute(\"id\", tabPanelId);\n      this.tabPanels[index].setAttribute(\"aria-labelledby\", tabId);\n\n      if (this.contextId) {\n        tab.setAttribute(CONTEXT_ID_ATTR, this.contextId);\n        this.tabGroup &&\n          this.tabGroup.setAttribute(CONTEXT_ID_ATTR, this.contextId);\n        this.tabPanels[index].setAttribute(CONTEXT_ID_ATTR, this.contextId);\n      }\n\n      tab.theme = this.theme;\n      this.tabPanels[index].theme = this.theme;\n      this.tabGroup && (this.tabGroup.theme = this.theme);\n    });\n  };\n\n  /**\n   * Gets tabs and tabpanels with the same context ID using querySelector to selector the children in relation to the host\n   */\n  private getChildren = (): void => {\n    this.tabGroup = this.el.querySelector(\"ic-tab-group\");\n    this.tabs = Array.from(this.tabGroup?.querySelectorAll(\"ic-tab\") || []);\n    this.tabPanels = Array.from(this.el.children).filter(\n      (child) => child.tagName === \"IC-TAB-PANEL\"\n    ) as HTMLIcTabPanelElement[];\n    this.enabledTabs = this.getEnabledTabs();\n  };\n\n  private keydownHandler = (event: KeyboardEvent) => {\n    const isManual = this.activationType === \"manual\";\n    const enabledTabIndex = this.enabledTabs.findIndex(\n      (tab) =>\n        tab.tabId ===\n        this.tabs[isManual ? this.focusedTabIndex : this.selectedTab || 0].tabId\n    );\n    const keyboardFunction = isManual\n      ? this.keyboardFocusTab\n      : this.keyboardSelectTab;\n    let preventDefault = true;\n    switch (event.key) {\n      case \"Home\":\n        keyboardFunction(0);\n        break;\n      case \"End\":\n        keyboardFunction(this.enabledTabs.length - 1);\n        break;\n      case \"ArrowRight\":\n        keyboardFunction(\n          enabledTabIndex < this.enabledTabs.length - 1\n            ? enabledTabIndex + 1\n            : 0\n        );\n        break;\n      case \"ArrowLeft\":\n        keyboardFunction(\n          (enabledTabIndex > 0 ? enabledTabIndex : this.enabledTabs.length) - 1\n        );\n        break;\n      default:\n        if (isManual && (event.key === \"Enter\" || event.key === \" \")) {\n          this.keyboardSelectTab(this.focusedTabIndex);\n        } else {\n          preventDefault = false;\n        }\n    }\n    if (preventDefault) event.preventDefault();\n  };\n\n  /** Sets the tab that is selected on initial render */\n  private setInitialTab = (): void => {\n    if (this.selectedTabIndex !== undefined) {\n      this.selectedTab = this.selectedTabIndex;\n      this.focusedTabIndex = this.selectedTabIndex;\n    } else {\n      const firstEnabledTabIndex = this.tabs.findIndex(\n        (tab) => tab.tabId === this.enabledTabs[0].tabId\n      );\n      this.selectedTab = firstEnabledTabIndex;\n      this.focusedTabIndex = firstEnabledTabIndex;\n    }\n  };\n\n  /** Passes the selected tab to the tab and tab panel components */\n  private configureTabs = () => {\n    this.enabledTabs.forEach((tab) => {\n      tab.selected = tab.tabPosition === this.selectedTab;\n    });\n    this.tabPanels.forEach((tabPanel, index) => {\n      tabPanel.active = index === this.selectedTab;\n    });\n  };\n\n  private getEnabledTabs = () =>\n    Array.from(this.tabs).filter((child) => !child.disabled);\n\n  /** Sets focus on tab and selects it */\n  private keyboardSelectTab = (enabledTabIndex: number) => {\n    const newIndex = this.tabs.findIndex(\n      (tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId\n    );\n    this.enabledTabs[enabledTabIndex].focus();\n    if (this.selectedTabIndex === undefined) {\n      this.selectedTab = newIndex;\n    } else {\n      /* eslint-disable no-unexpected-multiline */\n      this.icTabSelect.emit({\n        tabIndex: newIndex,\n        tabLabel:\n          this.el.querySelectorAll(\"ic-tab\")[newIndex]?.textContent?.trim() ||\n          \"\",\n      });\n    }\n  };\n\n  /** Sets focus on tab without selecting it (for manual activation) */\n  private keyboardFocusTab = (enabledTabIndex: number) => {\n    this.enabledTabs[enabledTabIndex].focus();\n    this.focusedTabIndex = this.tabs.findIndex(\n      (tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId\n    );\n  };\n\n  render() {\n    return <slot></slot>;\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/core/p-f3c72ffb.entry.js

@@ -0,0 +1,2 @@
+import{r as t,c as e,h as o,H as i,g as a}from"./p-8e4e97b4.js";import{r as s,i as r}from"./p-281ce313.js";const c='/*! 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{--indicator-initial-color:rgba(23 89 188 / 0%);--focus-indicator:var(--ic-border-focus);display:flex;align-items:center;border-radius:0;color:var(--ic-tab-label);--ic-typography-color:var(--ic-tab-label);height:2.5rem;padding:0 var(--ic-space-md);cursor:pointer;position:relative;border-bottom:var(--ic-space-xxs) solid var(--indicator-initial-color);gap:var(--ic-space-xs);transition:all var(--ic-easing-transition-fast)}::slotted([slot="icon"]){fill:var(--ic-tab-icon)}:host(.ic-tab-disabled) ::slotted([slot="icon"]){fill:var(--ic-tab-icon-disabled)}:host(:focus){box-shadow:var(--focus-indicator);border-radius:var(--ic-border-radius)}:host(:focus-visible){outline:var(--ic-hc-focus-outline)}:host(:hover){background-color:var(--ic-tab-item-hover)}:host(:active){background-color:var(--ic-tab-item-pressed)}:host(.ic-tab-selected){border-bottom:var(--ic-space-xxs) solid var(--ic-tab-item)}:host(.ic-tab-disabled){pointer-events:none;color:var(--ic-architectural-300)}:host(.ic-tab-disabled) ic-typography{--ic-typography-color:var(--ic-tab-label-disabled)}:host(.ic-tab-monochrome){color:var(--ic-tab-label-monochrome)}:host(.ic-tab-monochrome.ic-tab-disabled) ic-typography{color:var(--ic-tab-label-monochrome-disabled)}:host(.ic-tab-monochrome) ::slotted([slot="icon"]){fill:var(--ic-tab-icon-monochrome)}:host(.ic-tab-monochrome.ic-tab-disabled) ::slotted([slot="icon"]){fill:var(--ic-tab-icon-monochrome-disabled)}:host(.ic-tab-monochrome.ic-tab-selected){border-bottom:var(--ic-space-xxs) solid var(--ic-tab-item-monochrome)}:host(.ic-tab-monochrome:hover){background-color:var(--ic-tab-item-hover-monochrome)}:host(.ic-tab-monochrome:active){background-color:var(--ic-tab-item-pressed-monochrome)}@media (prefers-reduced-motion: no-preference){:host(.ic-tab-selected.with-transition){transition:all var(--ic-easing-transition-slow),\n      border-color var(--ic-transition-duration-slow)}}.ic-tab-label{pointer-events:none;text-wrap:nowrap}::slotted(svg){fill:currentcolor}@media (forced-colors: active){:host{border-bottom:var(--ic-space-xxs) solid canvas}:host(.ic-tab-disabled){color:GrayText}:host(.ic-tab-disabled) ic-typography{color:GrayText;--ic-typography-color:GrayText}}';const n=c;const l=class{constructor(o){t(this,o);this.tabClick=e(this,"tabClick",7);this.tabCreated=e(this,"tabCreated",7);this.tabEnabled=e(this,"tabEnabled",7);this.tabFocus=e(this,"tabFocus",7);this.tabRemoved=e(this,"tabRemoved",7);this.focusFromClick=false;this.isInitialRender=true;this.contextId="default";this.disabled=false;this.monochrome=false;this.selected=false;this.theme="inherit";this.handleClick=()=>{this.tabClick.emit({tabId:this.tabId,contextId:this.contextId,position:this.tabPosition});if(this.focusFromClick){this.tabFocus.emit({tabId:this.tabId,contextId:this.contextId,position:this.tabPosition});this.focusFromClick=false}};this.handleFocus=()=>{if(!this.focusFromClick){this.focusTabId=this.tabId;this.tabFocus.emit({tabId:this.tabId,contextId:this.contextId,position:this.tabPosition})}};this.handleMouseDown=()=>{this.focusFromClick=true}}watchDisabledHandler(){s(this.disabled,this.el)}disabledWatchHandler(){this.tabEnabled.emit()}connectedCallback(){this.tabCreated.emit(this.el)}disconnectedCallback(){var t;(t=document.querySelector(`ic-tab-context[context-id=${this.contextId}]`))===null||t===void 0?void 0:t.tabRemovedHandler(!!this.focusTabId)}componentWillLoad(){s(this.disabled,this.el)}componentDidUpdate(){this.isInitialRender=false}async setFocus(){if(this.el){this.el.focus()}}render(){const{disabled:t,selected:e,theme:a,monochrome:s,handleClick:c,handleFocus:n,handleMouseDown:l}=this;return o(i,{key:"1ed05e38ce9bbc72b8ff0c714e5fb2b032252f9f",class:{["with-transition"]:!this.isInitialRender,["ic-tab-selected"]:!!e,["ic-tab-disabled"]:!!t,[`ic-theme-${a}`]:a!=="inherit",["ic-tab-monochrome"]:!!s},role:"tab","aria-selected":`${e}`,onClick:c,onFocus:n,onMouseDown:l,"aria-disabled":`${t}`,tabindex:e?0:-1},r(this.el,"icon")&&o("slot",{key:"33db782cd42b31986cf34a6540d9c4ec42fac4b7",name:"icon"}),o("ic-typography",{key:"2b6dcbcd63858abfd865ffd5c22e8501817b26c7",class:"ic-tab-label",variant:"label"},o("span",{key:"a43a40ddcd00a31ebacf68ed143ce07eb87ac2e9"},o("slot",{key:"35c756071a95bf5a57a0c3389c7bcc3221dbc8f8"}))),r(this.el,"badge")&&o("slot",{key:"56b5d0f259fc8e42cd70e790c3e4b5d2a10a99d9",name:"badge"}))}get el(){return a(this)}static get watchers(){return{disabled:["watchDisabledHandler","disabledWatchHandler"]}}};l.style=n;export{l as ic_tab};
+//# sourceMappingURL=p-f3c72ffb.entry.js.map

package/dist/core/p-f3c72ffb.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icTabCss","IcTabStyle0","Tab","constructor","hostRef","this","focusFromClick","isInitialRender","contextId","disabled","monochrome","selected","theme","handleClick","tabClick","emit","tabId","position","tabPosition","tabFocus","handleFocus","focusTabId","handleMouseDown","watchDisabledHandler","removeDisabledFalse","el","disabledWatchHandler","tabEnabled","connectedCallback","tabCreated","disconnectedCallback","_a","document","querySelector","tabRemovedHandler","componentWillLoad","componentDidUpdate","setFocus","focus","render","h","Host","key","class","role","onClick","onFocus","onMouseDown","tabindex","isSlotUsed","name","variant"],"sources":["src/components/ic-tab/ic-tab.css?tag=ic-tab&encapsulation=shadow","src/components/ic-tab/ic-tab.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  --indicator-initial-color: rgba(23 89 188 / 0%);\n  --focus-indicator: var(--ic-border-focus);\n\n  display: flex;\n  align-items: center;\n  border-radius: 0;\n  color: var(--ic-tab-label);\n\n  --ic-typography-color: var(--ic-tab-label);\n\n  height: 2.5rem;\n  padding: 0 var(--ic-space-md);\n  cursor: pointer;\n  position: relative;\n  border-bottom: var(--ic-space-xxs) solid var(--indicator-initial-color);\n  gap: var(--ic-space-xs);\n  transition: all var(--ic-easing-transition-fast);\n}\n\n::slotted([slot=\"icon\"]) {\n  fill: var(--ic-tab-icon);\n}\n\n:host(.ic-tab-disabled) ::slotted([slot=\"icon\"]) {\n  fill: var(--ic-tab-icon-disabled);\n}\n\n:host(:focus) {\n  box-shadow: var(--focus-indicator);\n  border-radius: var(--ic-border-radius);\n}\n\n:host(:focus-visible) {\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host(:hover) {\n  background-color: var(--ic-tab-item-hover);\n}\n\n:host(:active) {\n  background-color: var(--ic-tab-item-pressed);\n}\n\n:host(.ic-tab-selected) {\n  border-bottom: var(--ic-space-xxs) solid var(--ic-tab-item);\n}\n\n:host(.ic-tab-disabled) {\n  pointer-events: none;\n  color: var(--ic-architectural-300);\n}\n\n:host(.ic-tab-disabled) ic-typography {\n  --ic-typography-color: var(--ic-tab-label-disabled);\n}\n\n:host(.ic-tab-monochrome) {\n  color: var(--ic-tab-label-monochrome);\n}\n\n:host(.ic-tab-monochrome.ic-tab-disabled) ic-typography {\n  color: var(--ic-tab-label-monochrome-disabled);\n}\n\n:host(.ic-tab-monochrome) ::slotted([slot=\"icon\"]) {\n  fill: var(--ic-tab-icon-monochrome);\n}\n\n:host(.ic-tab-monochrome.ic-tab-disabled) ::slotted([slot=\"icon\"]) {\n  fill: var(--ic-tab-icon-monochrome-disabled);\n}\n\n:host(.ic-tab-monochrome.ic-tab-selected) {\n  border-bottom: var(--ic-space-xxs) solid var(--ic-tab-item-monochrome);\n}\n\n:host(.ic-tab-monochrome:hover) {\n  background-color: var(--ic-tab-item-hover-monochrome);\n}\n\n:host(.ic-tab-monochrome:active) {\n  background-color: var(--ic-tab-item-pressed-monochrome);\n}\n\n@media (prefers-reduced-motion: no-preference) {\n  :host(.ic-tab-selected.with-transition) {\n    transition: all var(--ic-easing-transition-slow),\n      border-color var(--ic-transition-duration-slow);\n  }\n}\n\n.ic-tab-label {\n  pointer-events: none;\n  text-wrap: nowrap;\n}\n\n::slotted(svg) {\n  fill: currentcolor;\n}\n\n@media (forced-colors: active) {\n  :host {\n    border-bottom: var(--ic-space-xxs) solid canvas;\n  }\n\n  :host(.ic-tab-disabled) {\n    color: GrayText;\n  }\n\n  :host(.ic-tab-disabled) ic-typography {\n    color: GrayText;\n\n    --ic-typography-color: GrayText;\n  }\n}\n\n/* Add back in after storybook has the `color-scheme: light dark` code */\n\n/* @media (prefers-color-scheme: dark) and (not (forced-colors: active)) {\n  :host(ic-tab) .ic-tab-label {\n    color: var(--ic-architectural-white);\n  }\n  :host(ic-tab.ic-tab-disabled) .ic-tab-label {\n    color: inherit;\n  }\n} */\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Prop,\n  h,\n  Method,\n  Watch,\n} from \"@stencil/core\";\n\nimport { IcTabClickEventDetail } from \"./ic-tab.types\";\nimport { IcThemeMode } from \"../../utils/types\";\nimport { isSlotUsed, removeDisabledFalse } from \"../../utils/helpers\";\n\n/**\n * @slot icon - Content will be rendered next to the tab label.\n * @slot badge - Badge component displayed inline with the tab.\n */\n@Component({\n  tag: \"ic-tab\",\n  styleUrl: \"ic-tab.css\",\n  shadow: true,\n})\nexport class Tab {\n  private focusFromClick: boolean = false;\n  private focusTabId: string;\n  private isInitialRender: boolean = true;\n\n  @Element() el: HTMLIcTabElement;\n\n  /** @internal The unique context needed if using multiple tabs inside one another i.e. rendering another tabs inside a tab panel. */\n  @Prop({ reflect: true }) contextId?: string = \"default\";\n\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled?: boolean = false;\n  @Watch(\"disabled\")\n  watchDisabledHandler(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  /** @internal Determines whether black variant of the tabs should be displayed. */\n  @Prop() monochrome?: boolean = false;\n\n  /** @internal If `true`, the tab will display with a selected indicator and tabIndex will be set. */\n  @Prop({ reflect: true }) selected?: boolean = false;\n\n  /** @internal The shared ID between panel and tab. */\n  @Prop({ reflect: true }) tabId!: string;\n\n  /** @internal The position of the tab inside the tabs array in context. */\n  @Prop() tabPosition!: number;\n\n  /** @internal Determines whether the light or dark variant of the tabs should be displayed. */\n  @Prop() theme?: IcThemeMode = \"inherit\";\n\n  @Watch(\"disabled\")\n  disabledWatchHandler(): void {\n    this.tabEnabled.emit();\n  }\n\n  /**\n   * @internal Emitted when a tab is selected.\n   */\n  @Event() tabClick: EventEmitter<IcTabClickEventDetail>;\n\n  /**\n   * @internal Emitted when a tab is dynamically created.\n   */\n  @Event() tabCreated: EventEmitter<HTMLIcTabElement>;\n\n  /**\n   * @internal Emitted when a tab's disabled prop changes\n   */\n  @Event() tabEnabled: EventEmitter<void>;\n\n  /**\n   * @internal Emitted when a tab is focussed.\n   */\n  @Event() tabFocus: EventEmitter<IcTabClickEventDetail>;\n\n  /**\n   * @internal Emitted when a tab is unmounted.\n   */\n  @Event() tabRemoved: EventEmitter<void>;\n\n  connectedCallback(): void {\n    this.tabCreated.emit(this.el);\n  }\n\n  disconnectedCallback(): void {\n    document\n      .querySelector<HTMLIcTabContextElement>(\n        `ic-tab-context[context-id=${this.contextId}]`\n      )\n      ?.tabRemovedHandler(!!this.focusTabId);\n  }\n\n  componentWillLoad(): void {\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  componentDidUpdate(): void {\n    this.isInitialRender = false;\n  }\n\n  /**\n   * Sets focus on the tab.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.el) {\n      this.el.focus();\n    }\n  }\n\n  private handleClick = () => {\n    this.tabClick.emit({\n      tabId: this.tabId,\n      contextId: this.contextId!,\n      position: this.tabPosition,\n    });\n    if (this.focusFromClick) {\n      this.tabFocus.emit({\n        tabId: this.tabId,\n        contextId: this.contextId!,\n        position: this.tabPosition,\n      });\n      this.focusFromClick = false;\n    }\n  };\n\n  private handleFocus = () => {\n    if (!this.focusFromClick) {\n      this.focusTabId = this.tabId;\n\n      this.tabFocus.emit({\n        tabId: this.tabId,\n        contextId: this.contextId!,\n        position: this.tabPosition,\n      });\n    }\n  };\n\n  private handleMouseDown = () => {\n    //set flag so that focus gets handled after click\n    //there is a timing issue where a long click only causes focus to happen & not the click\n    //the focus does need to be a separate event though to handle focus from keyboard\n    this.focusFromClick = true;\n  };\n\n  render() {\n    const {\n      disabled,\n      selected,\n      theme,\n      monochrome,\n      handleClick,\n      handleFocus,\n      handleMouseDown,\n    } = this;\n    return (\n      <Host\n        class={{\n          [\"with-transition\"]: !this.isInitialRender,\n          [\"ic-tab-selected\"]: !!selected,\n          [\"ic-tab-disabled\"]: !!disabled,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n          [\"ic-tab-monochrome\"]: !!monochrome,\n        }}\n        role=\"tab\"\n        aria-selected={`${selected}`}\n        onClick={handleClick}\n        onFocus={handleFocus}\n        onMouseDown={handleMouseDown}\n        aria-disabled={`${disabled}`}\n        tabindex={selected ? 0 : -1}\n      >\n        {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n        <ic-typography class=\"ic-tab-label\" variant=\"label\">\n          <span>\n            <slot></slot>\n          </span>\n        </ic-typography>\n        {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n      </Host>\n    );\n  }\n}\n"],"mappings":"2GAAA,MAAMA,EAAW,0/IACjB,MAAAC,EAAeD,E,MCwBFE,EAAG,MALhB,WAAAC,CAAAC,G,qMAMUC,KAAAC,eAA0B,MAE1BD,KAAAE,gBAA2B,KAKVF,KAAAG,UAAqB,UAKtCH,KAAAI,SAAqB,MAOrBJ,KAAAK,WAAuB,MAGNL,KAAAM,SAAqB,MAStCN,KAAAO,MAAsB,UA8DtBP,KAAAQ,YAAc,KACpBR,KAAKS,SAASC,KAAK,CACjBC,MAAOX,KAAKW,MACZR,UAAWH,KAAKG,UAChBS,SAAUZ,KAAKa,cAEjB,GAAIb,KAAKC,eAAgB,CACvBD,KAAKc,SAASJ,KAAK,CACjBC,MAAOX,KAAKW,MACZR,UAAWH,KAAKG,UAChBS,SAAUZ,KAAKa,cAEjBb,KAAKC,eAAiB,K,GAIlBD,KAAAe,YAAc,KACpB,IAAKf,KAAKC,eAAgB,CACxBD,KAAKgB,WAAahB,KAAKW,MAEvBX,KAAKc,SAASJ,KAAK,CACjBC,MAAOX,KAAKW,MACZR,UAAWH,KAAKG,UAChBS,SAAUZ,KAAKa,a,GAKbb,KAAAiB,gBAAkB,KAIxBjB,KAAKC,eAAiB,IAAI,C,CA/G5B,oBAAAiB,GACEC,EAAoBnB,KAAKI,SAAUJ,KAAKoB,G,CAmB1C,oBAAAC,GACErB,KAAKsB,WAAWZ,M,CA4BlB,iBAAAa,GACEvB,KAAKwB,WAAWd,KAAKV,KAAKoB,G,CAG5B,oBAAAK,G,OACEC,EAAAC,SACGC,cACC,6BAA6B5B,KAAKG,iBACnC,MAAAuB,SAAA,SAAAA,EACCG,oBAAoB7B,KAAKgB,W,CAG/B,iBAAAc,GACEX,EAAoBnB,KAAKI,SAAUJ,KAAKoB,G,CAG1C,kBAAAW,GACE/B,KAAKE,gBAAkB,K,CAOzB,cAAM8B,GACJ,GAAIhC,KAAKoB,GAAI,CACXpB,KAAKoB,GAAGa,O,EAuCZ,MAAAC,GACE,MAAM9B,SACJA,EAAQE,SACRA,EAAQC,MACRA,EAAKF,WACLA,EAAUG,YACVA,EAAWO,YACXA,EAAWE,gBACXA,GACEjB,KACJ,OACEmC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,CAAC,oBAAqBtC,KAAKE,gBAC3B,CAAC,qBAAsBI,EACvB,CAAC,qBAAsBF,EACvB,CAAC,YAAYG,KAAUA,IAAU,UACjC,CAAC,uBAAwBF,GAE3BkC,KAAK,MAAK,gBACK,GAAGjC,IAClBkC,QAAShC,EACTiC,QAAS1B,EACT2B,YAAazB,EAAe,gBACb,GAAGb,IAClBuC,SAAUrC,EAAW,GAAK,GAEzBsC,EAAW5C,KAAKoB,GAAI,SAAWe,EAAA,QAAAE,IAAA,2CAAMQ,KAAK,SAC3CV,EAAA,iBAAAE,IAAA,2CAAeC,MAAM,eAAeQ,QAAQ,SAC1CX,EAAA,QAAAE,IAAA,4CACEF,EAAA,QAAAE,IAAA,+CAGHO,EAAW5C,KAAKoB,GAAI,UAAYe,EAAA,QAAAE,IAAA,2CAAMQ,KAAK,U","ignoreList":[]}

package/dist/core/{p-a0e4d6bd.entry.js → p-f815f8c9.entry.js}

@@ -1,2 +1,2 @@
-import{r as e,h as t,H as i,g as o}from"./p-6b5e91e2.js";const a='/*! 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}.rows{display:flex;flex-direction:column;gap:var(--ic-space-md)}:host(.ic-data-list-small) .rows{gap:var(--ic-space-xs)}.divider{margin-top:var(--ic-space-lg);margin-bottom:var(--ic-space-md);height:var(--ic-border-width);background-color:var(--ic-architectural-300)}:host(.ic-data-list-small) .divider{margin-top:var(--ic-space-sm);margin-bottom:var(--ic-space-xs)}@media (forced-colors: active){.divider{background-color:canvastext}}';const n=class{constructor(t){e(this,t);this.heading=undefined;this.size="default"}render(){const{el:e,heading:o,size:a}=this;if(a==="small"){Array.from(e.children).forEach((e=>e.setAttribute("size","small")))}return t(i,{class:{"ic-data-list-small":a==="small"}},t("div",{class:"heading",id:"data-list-heading"},t("slot",{name:"heading"},t("ic-typography",{variant:"h3"},o))),t("div",{class:"divider"}),t("ul",{"aria-labelledby":"data-list-heading",class:"rows"},t("slot",null)))}get el(){return o(this)}};n.style=a;export{n as ic_data_list};
-//# sourceMappingURL=p-a0e4d6bd.entry.js.map
+import{r as e,h as t,H as i,g as a}from"./p-8e4e97b4.js";const o='/*! 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}.heading{--ic-typography-color:var(--ic-data-list-text-heading)}.rows{display:flex;flex-direction:column;gap:var(--ic-space-md)}:host(.ic-data-list-small) .rows{gap:var(--ic-space-xs)}.divider{margin-top:var(--ic-space-lg);margin-bottom:var(--ic-space-md);height:var(--ic-border-width);background-color:var(--ic-data-list-keyline-heading)}:host(.ic-data-list-small) .divider{margin-top:var(--ic-space-sm);margin-bottom:var(--ic-space-xs)}@media (forced-colors: active){.divider{background-color:canvastext}}';const n=o;const s=class{constructor(t){e(this,t);this.size="medium";this.theme="inherit"}render(){const{el:e,heading:a,size:o,theme:n}=this;if(o==="small"){Array.from(e.children).forEach((e=>e.setAttribute("size","small")))}return t(i,{key:"c66609f65612dca067e70b5762d7eeb797dd2121",class:{"ic-data-list-small":o==="small",[`ic-theme-${n}`]:n!=="inherit"}},t("div",{key:"685663251c565cb665c03e9bd39e1d5b2f7ef73b",class:"heading",id:"data-list-heading"},t("slot",{key:"e81970054a2053f05f6c0ef378e2509bb602da65",name:"heading"},t("ic-typography",{key:"860b07bd25a11f7f6a938aab5cbae0c5802bea3e",variant:"h3"},a))),t("div",{key:"c004429938c7c71ac70ee106486f75193cffc2ca",class:"divider"}),t("ul",{key:"b9e010a5703ecaf75ce3b1cf396901b26618a34a","aria-labelledby":"data-list-heading",class:"rows"},t("slot",{key:"684b99425193c3a5e306b67e235b7d85e1802fce"})))}get el(){return a(this)}};s.style=n;export{s as ic_data_list};
+//# sourceMappingURL=p-f815f8c9.entry.js.map

package/dist/core/p-f815f8c9.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icDataListCss","IcDataListStyle0","DataList","constructor","hostRef","this","size","theme","render","el","heading","Array","from","children","forEach","child","setAttribute","h","Host","key","class","id","name","variant"],"sources":["src/components/ic-data-list/ic-data-list.css?tag=ic-data-list&encapsulation=shadow","src/components/ic-data-list/ic-data-list.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n}\n\n.heading {\n  --ic-typography-color: var(--ic-data-list-text-heading);\n}\n\n.rows {\n  display: flex;\n  flex-direction: column;\n  gap: var(--ic-space-md);\n}\n\n:host(.ic-data-list-small) .rows {\n  gap: var(--ic-space-xs);\n}\n\n.divider {\n  margin-top: var(--ic-space-lg);\n  margin-bottom: var(--ic-space-md);\n  height: var(--ic-border-width);\n  background-color: var(--ic-data-list-keyline-heading);\n}\n\n:host(.ic-data-list-small) .divider {\n  margin-top: var(--ic-space-sm);\n  margin-bottom: var(--ic-space-xs);\n}\n\n@media (forced-colors: active) {\n  .divider {\n    background-color: canvastext;\n  }\n}\n","import { Component, Element, Host, h, Prop } from \"@stencil/core\";\nimport { IcSizesNoLarge, IcThemeMode } from \"../../utils/types\";\n\n/**\n * @slot heading - Content will be placed at the top of the data list.\n */\n@Component({\n  tag: \"ic-data-list\",\n  styleUrl: \"ic-data-list.css\",\n  shadow: true,\n})\nexport class DataList {\n  @Element() el: HTMLIcDataListElement;\n\n  /**\n   * The title for the data list.\n   */\n  @Prop() heading?: string;\n\n  /**\n   * The size of the data list component.\n   */\n  @Prop() size?: IcSizesNoLarge = \"medium\";\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() theme?: IcThemeMode = \"inherit\";\n\n  render() {\n    const { el, heading, size, theme } = this;\n\n    if (size === \"small\") {\n      Array.from(el.children).forEach((child) =>\n        child.setAttribute(\"size\", \"small\")\n      );\n    }\n\n    return (\n      <Host\n        class={{\n          \"ic-data-list-small\": size === \"small\",\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n      >\n        <div class=\"heading\" id=\"data-list-heading\">\n          <slot name=\"heading\">\n            <ic-typography variant=\"h3\">{heading}</ic-typography>\n          </slot>\n        </div>\n        <div class=\"divider\" />\n        <ul aria-labelledby=\"data-list-heading\" class=\"rows\">\n          <slot></slot>\n        </ul>\n      </Host>\n    );\n  }\n}\n"],"mappings":"yDAAA,MAAMA,EAAgB,m3FACtB,MAAAC,EAAeD,E,MCUFE,EAAQ,MALrB,WAAAC,CAAAC,G,UAgBUC,KAAAC,KAAwB,SAKxBD,KAAAE,MAAsB,S,CAE9B,MAAAC,GACE,MAAMC,GAAEA,EAAEC,QAAEA,EAAOJ,KAAEA,EAAIC,MAAEA,GAAUF,KAErC,GAAIC,IAAS,QAAS,CACpBK,MAAMC,KAAKH,EAAGI,UAAUC,SAASC,GAC/BA,EAAMC,aAAa,OAAQ,U,CAI/B,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,qBAAsBd,IAAS,QAC/B,CAAC,YAAYC,KAAUA,IAAU,YAGnCU,EAAA,OAAAE,IAAA,2CAAKC,MAAM,UAAUC,GAAG,qBACtBJ,EAAA,QAAAE,IAAA,2CAAMG,KAAK,WACTL,EAAA,iBAAAE,IAAA,2CAAeI,QAAQ,MAAMb,KAGjCO,EAAA,OAAAE,IAAA,2CAAKC,MAAM,YACXH,EAAA,MAAAE,IAAA,6DAAoB,oBAAoBC,MAAM,QAC5CH,EAAA,QAAAE,IAAA,8C","ignoreList":[]}

package/dist/core/p-fbde763c.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,H as a,g as i}from"./p-8e4e97b4.js";import{D as s,i as n,e as o,f as d}from"./p-281ce313.js";const r='/*! 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;z-index:var(--ic-z-index-page-header)}:host(.ic-page-header-sticky){position:sticky;top:0;box-shadow:var(--ic-elevation-overlay);z-index:var(--ic-z-index-sticky-page-header)}header{background-color:var(--ic-page-header-background)}header.border-bottom{border-bottom:var(--ic-border-default);border-bottom:var(--ic-space-1px) solid var(--ic-page-header-border)}header.tabs{padding-top:var(--ic-space-md)}.breadcrumb-area{margin-bottom:var(--ic-space-md)}.main-content{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"title-area action-area"\n    "input-area action-area";-moz-column-gap:var(--ic-space-md);column-gap:var(--ic-space-md);justify-content:space-between;width:100%}.title-area{display:flex;flex-direction:column;flex:1;min-width:19rem;grid-area:title-area}.header-content{display:flex;align-items:center;width:100%;flex-wrap:wrap;-moz-column-gap:var(--ic-space-md);column-gap:var(--ic-space-md)}.heading{display:inline-block;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.subheading-content{margin-top:var(--ic-space-xs)}.subheading-content.small{margin-top:var(--ic-space-md)}.action-area{display:flex;gap:var(--ic-space-md);flex-flow:row wrap;justify-self:end;justify-content:flex-end;height:-moz-fit-content;height:fit-content;grid-area:action-area}.input-area,.navigation-area{margin-top:var(--ic-space-md);width:100%}.tabs-slot{display:flex;overflow-x:auto;padding:0.5rem;margin:-0.5rem}.tabs-slot::-webkit-scrollbar{display:none}.input-area{grid-area:input-area}@media screen and (max-width: 576px){::slotted(ic-text-field){--input-width:100%;max-width:20rem}.main-content{grid-template-areas:"title-area"\n      "action-area"\n      "input-area";justify-content:flex-start}.title-area{min-width:0}.action-area{min-width:100%;margin-top:var(--ic-space-md);justify-content:start}}@media screen and (min-width: 992px){:host(.ic-page-header-sticky-desktop){position:sticky;top:0;box-shadow:var(--ic-elevation-overlay);z-index:var(--ic-z-index-sticky-page-header)}}';const c=r;const l=class{constructor(t){e(this,t);this.resizeObserver=null;this.areButtonsReversed=false;this.deviceSize=s.XL;this.aligned="left";this.border=true;this.reverseOrder=false;this.size="medium";this.sticky=false;this.stickyDesktopOnly=false;this.theme="inherit";this.resizeObserverCallback=()=>{if(this.reverseOrder&&n(this.el,"actions")){this.applyReverseOrder()}};this.runResizeObserver=()=>{this.resizeObserver=new ResizeObserver((()=>{this.resizeObserverCallback()}));this.resizeObserver.observe(this.el)};this.applyReverseOrder=()=>{var e;const t=o();if(t!==this.deviceSize){this.deviceSize=t}const a=(e=this.el.shadowRoot)===null||e===void 0?void 0:e.querySelector("div.action-area");const i=[];for(let e=0;e<this.actionContent.length;e++){const t=this.actionContent[e];let a=t.offsetHeight;if(a===undefined){a=0}i.push(a)}const n=Math.max(...i);let d=a.offsetHeight;if(d===undefined){d=0}const r=()=>{this.actionContent=this.actionContent.reverse();this.actionContent.forEach((e=>{this.el.append(e)}));this.areButtonsReversed=!this.areButtonsReversed};if(this.deviceSize>s.S&&d<=n&&!this.areButtonsReversed||(this.deviceSize>s.S&&d>n||this.deviceSize<=s.S)&&this.areButtonsReversed){r()}}}disconnectedCallback(){if(this.resizeObserver!==null){this.resizeObserver.disconnect()}}componentWillLoad(){this.actionContent=Array.from(this.el.querySelectorAll(`[slot="actions"]`))}componentDidLoad(){d(this.runResizeObserver)}render(){var e,i;const{size:s,border:o,heading:d,subheading:r,aligned:c,sticky:l,stickyDesktopOnly:b,theme:h}=this;const p=`${n(this.el,"heading")?(i=(e=this.el.querySelector('[slot="heading"]'))===null||e===void 0?void 0:e.textContent)!==null&&i!==void 0?i:"":d!==null&&d!==void 0?d:""} page sections`;return t(a,{key:"2fcb645615bdb75659da17fa9c70b7bf9eb4f38b",class:{["ic-page-header-sticky"]:!!l,["ic-page-header-sticky-desktop"]:!l&&!!b,[`ic-theme-${h}`]:h!=="inherit"},"aria-label":this.el.ariaLabel||"page header"},t("header",{key:"d212bae9378a9f1bdd51f8b178eb294642580502",class:{["border-bottom"]:!!o,["tabs"]:n(this.el,"tabs")},role:"presentation"},t("ic-section-container",{key:"2e4489587b15235b29c0614e9e2cc931f40c5ad2",aligned:c,fullHeight:n(this.el,"tabs")},n(this.el,"breadcrumbs")&&t("div",{key:"c23a12adf1350177092343dd30d5caf6300ddc48",class:"breadcrumb-area"},t("slot",{key:"394a0a3540bf493623eaa893d067adee94d571ed",name:"breadcrumbs"})),t("div",{key:"1549da8b527d9bad2158fbdc0d887468fa878665",class:"main-content"},t("div",{key:"8f16fb6f031722c31b0c8c18ae394cc9df31c259",class:"title-area"},t("div",{key:"9ba2670b6d0f00761e5205f0b1914debf8593188",class:"header-content"},t("slot",{key:"5ded3c04b383d8c2049342b73ed24da15ca1527b",name:"heading"},t("ic-typography",{key:"66051dd3628d19b91dcc5bd2a624c0f02123cce8",variant:s==="small"?"h4":"h2",class:"heading"},t("h2",{key:"3ad38d6e5c92771469ce6aa28bb0ce27ef32a6c0"},d))),t("slot",{key:"bff7dbff751633bac28ecde4270cda02dcd30ea0",name:"heading-adornment"})),t("div",{key:"33013061ded6d3c68872baf73f75e6c1f9c5dc64",class:{["subheading-content"]:!!r||n(this.el,"subheading"),["small"]:s==="small"}},t("slot",{key:"d566acd471748725b57b361a91ad42079d95c3df",name:"subheading"},t("ic-typography",{key:"f964e890a2c587cac5506ec4465a3d504adbd0c8",variant:"body"},r)))),n(this.el,"actions")&&t("div",{key:"4f86300ff2c1b536f85cb1a5f316e5a5648e01f2",class:"action-area"},t("slot",{key:"1ac5c67502ea159d05a2f665d4b9ca95f86ef76e",name:"actions"})),n(this.el,"input")&&t("div",{key:"7df1fb4cfa7661b71b58c0eff30829ae4b1f3c44",class:"input-area"},t("slot",{key:"5dc94dbc8328df27814e276e997d35663ad505ba",name:"input"}))),(n(this.el,"stepper")||n(this.el,"tabs"))&&t("div",{key:"261eb06c04fde9c954573256196e4ad861098150",class:"navigation-area"},n(this.el,"stepper")&&!n(this.el,"tabs")&&t("slot",{key:"b19a74de5783f8b4c4107c7c356a5252eaf69277",name:"stepper"}),n(this.el,"tabs")&&t("nav",{key:"937c01fcb2b06fdccca757fcd8eb439bfe895e69","aria-label":p},t("ic-horizontal-scroll",{key:"088526c19f8be38197d990d6dbef8c002ce20133"},t("ul",{key:"a01caea558dd70436a05e9a2537ff4f006170160",class:"tabs-slot"},t("slot",{key:"b936d5f4b08ceca9ed06d268dcb7a76b5c1aa795",name:"tabs"}))))))))}get el(){return i(this)}};l.style=c;export{l as ic_page_header};
+//# sourceMappingURL=p-fbde763c.entry.js.map

package/dist/core/p-fbde763c.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icPageHeaderCss","IcPageHeaderStyle0","PageHeader","constructor","hostRef","this","resizeObserver","areButtonsReversed","deviceSize","DEVICE_SIZES","XL","aligned","border","reverseOrder","size","sticky","stickyDesktopOnly","theme","resizeObserverCallback","isSlotUsed","el","applyReverseOrder","runResizeObserver","ResizeObserver","observe","currSize","getCurrentDeviceSize","actionArea","_a","shadowRoot","querySelector","actionHeights","i","actionContent","length","action","actionHeight","offsetHeight","undefined","push","max","Math","actionAreaHeight","appendActionContent","reverse","forEach","btn","append","S","disconnectedCallback","disconnect","componentWillLoad","Array","from","querySelectorAll","componentDidLoad","checkResizeObserver","render","heading","subheading","navAriaLabel","_b","textContent","h","Host","key","class","ariaLabel","role","fullHeight","name","variant"],"sources":["src/components/ic-page-header/ic-page-header.css?tag=ic-page-header&encapsulation=shadow","src/components/ic-page-header/ic-page-header.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-page-header: z-index of page-header\n */\n\n:host {\n  display: block;\n  z-index: var(--ic-z-index-page-header);\n}\n\n:host(.ic-page-header-sticky) {\n  position: sticky;\n  top: 0;\n  box-shadow: var(--ic-elevation-overlay);\n  z-index: var(--ic-z-index-sticky-page-header);\n}\n\nheader {\n  background-color: var(--ic-page-header-background);\n}\n\nheader.border-bottom {\n  border-bottom: var(--ic-border-default);\n  border-bottom: var(--ic-space-1px) solid var(--ic-page-header-border);\n}\n\nheader.tabs {\n  padding-top: var(--ic-space-md);\n}\n\n.breadcrumb-area {\n  margin-bottom: var(--ic-space-md);\n}\n\n.main-content {\n  display: grid;\n  grid-template-columns: auto 1fr;\n  grid-template-areas:\n    \"title-area action-area\"\n    \"input-area action-area\";\n  column-gap: var(--ic-space-md);\n  justify-content: space-between;\n  width: 100%;\n}\n\n.title-area {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-width: 19rem;\n  grid-area: title-area;\n}\n\n.header-content {\n  display: flex;\n  align-items: center;\n  width: 100%;\n  flex-wrap: wrap;\n  column-gap: var(--ic-space-md);\n}\n\n.heading {\n  display: inline-block;\n  overflow-wrap: break-word;\n  hyphens: auto;\n}\n\n.subheading-content {\n  margin-top: var(--ic-space-xs);\n}\n\n.subheading-content.small {\n  margin-top: var(--ic-space-md);\n}\n\n.action-area {\n  display: flex;\n  gap: var(--ic-space-md);\n  flex-flow: row wrap;\n  justify-self: end;\n  justify-content: flex-end;\n  height: fit-content;\n  grid-area: action-area;\n}\n\n.input-area,\n.navigation-area {\n  margin-top: var(--ic-space-md);\n  width: 100%;\n}\n\n.tabs-slot {\n  display: flex;\n  overflow-x: auto;\n  padding: 0.5rem;\n  margin: -0.5rem;\n}\n\n.tabs-slot::-webkit-scrollbar {\n  display: none;\n}\n\n.input-area {\n  grid-area: input-area;\n}\n\n@media screen and (max-width: 576px) {\n  ::slotted(ic-text-field) {\n    --input-width: 100%;\n\n    max-width: 20rem;\n  }\n\n  .main-content {\n    grid-template-areas:\n      \"title-area\"\n      \"action-area\"\n      \"input-area\";\n    justify-content: flex-start;\n  }\n\n  .title-area {\n    min-width: 0;\n  }\n\n  .action-area {\n    min-width: 100%;\n    margin-top: var(--ic-space-md);\n    justify-content: start;\n  }\n}\n\n@media screen and (min-width: 992px) {\n  :host(.ic-page-header-sticky-desktop) {\n    position: sticky;\n    top: 0;\n    box-shadow: var(--ic-elevation-overlay);\n    z-index: var(--ic-z-index-sticky-page-header);\n  }\n}\n","import { Component, Host, h, Prop, Element, State } from \"@stencil/core\";\n\nimport { IcAlignment, IcSizesNoLarge, IcThemeMode } from \"../../utils/types\";\n\nimport {\n  isSlotUsed,\n  DEVICE_SIZES,\n  getCurrentDeviceSize,\n  checkResizeObserver,\n} from \"../../utils/helpers\";\n\n/**\n * @slot breadcrumbs - Content will be rendered in the breadcrumb area, above the title and action areas.\n * @slot heading - Content will be rendered in the title area, in place of the heading.\n * @slot subheading - Content will be rendered in the title area, in place of the subheading.\n * @slot heading-adornment - Content will be rendered in the title area, adjacent to the heading.\n * @slot actions - Content will be rendered in the action area, adjacent to the title area.\n * @slot input - Content will be rendered in the input area, below the title area and adjacent to the action area.\n * @slot stepper - Content will be rendered in the navigation area, below the title and action areas. Note: stepper slot cannot be used when the tabs slot is being used.\n * @slot tabs - Content will be rendered in the navigation area, below the title and action areas. Note: the stepper slot cannot be used when the tabs slot is being used.\n */\n\n@Component({\n  tag: \"ic-page-header\",\n  styleUrl: \"ic-page-header.css\",\n  shadow: true,\n})\nexport class PageHeader {\n  private resizeObserver: ResizeObserver | null = null;\n\n  @Element() el: HTMLIcPageHeaderElement;\n\n  @State() actionContent: Node[];\n  @State() areButtonsReversed: boolean = false;\n  @State() deviceSize: number = DEVICE_SIZES.XL;\n\n  /**\n   * The alignment of the page header.\n   */\n  @Prop() aligned?: IcAlignment = \"left\";\n\n  /**\n   * If `true`, a border will be displayed along the bottom of the page header.\n   */\n  @Prop() border?: boolean = true;\n\n  /**\n   * The title to render on the page header.\n   */\n  @Prop() heading?: string;\n\n  /**\n   * If `true`, the reading pattern and tab order will change in the action area for viewport widths of above 576px and when actions have not wrapped.\n   */\n  @Prop() reverseOrder?: boolean = false;\n\n  /**\n   * The size of the page header component.\n   */\n  @Prop() size?: IcSizesNoLarge = \"medium\";\n\n  /**\n   * If `true`, the page header will be sticky at all breakpoints.\n   */\n  @Prop() sticky?: boolean = false;\n\n  /**\n   *  If `true`, the page header will only be sticky for viewport widths of 992px and above.\n   */\n  @Prop() stickyDesktopOnly?: boolean = false;\n\n  /**\n   * The subtitle to render on the page header.\n   */\n  @Prop() subheading?: 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() theme?: IcThemeMode = \"inherit\";\n\n  disconnectedCallback(): void {\n    if (this.resizeObserver !== null) {\n      this.resizeObserver.disconnect();\n    }\n  }\n\n  componentWillLoad(): void {\n    this.actionContent = Array.from(\n      this.el.querySelectorAll(`[slot=\"actions\"]`)\n    );\n  }\n\n  componentDidLoad(): void {\n    checkResizeObserver(this.runResizeObserver);\n  }\n\n  private resizeObserverCallback = () => {\n    if (this.reverseOrder && isSlotUsed(this.el, \"actions\")) {\n      this.applyReverseOrder();\n    }\n  };\n\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.resizeObserverCallback();\n    });\n    this.resizeObserver.observe(this.el);\n  };\n\n  private applyReverseOrder = (): void => {\n    const currSize = getCurrentDeviceSize();\n    if (currSize !== this.deviceSize) {\n      this.deviceSize = currSize;\n    }\n\n    const actionArea = this.el.shadowRoot?.querySelector(\n      \"div.action-area\"\n    ) as HTMLElement;\n    const actionHeights: number[] = [];\n\n    /* For each button in the actions slot, check the height of the button and push this number into the actionHeights array and then find the greatest number in this array (i.e. find the height of the tallest button) */\n    for (let i = 0; i < this.actionContent.length; i++) {\n      const action = this.actionContent[i] as HTMLElement;\n      let actionHeight = action.offsetHeight;\n      if (actionHeight === undefined) {\n        actionHeight = 0;\n      }\n      actionHeights.push(actionHeight);\n    }\n\n    const max = Math.max(...actionHeights);\n\n    /* The smallest breakpoint displays buttons in the same order the user has slotted them in. When the device size is larger than the small breakpoint then the order of the button reverses due to best practice for reading patterns. If the device size is larger than the small breakpoint and the buttons have started to wrap then they follow the order the user has slotted them in. This logic is programmed based on the height of the action-area div that wraps the actions slot. If the height of the action-area div is taller than the height of the tallest button, then it is assumed that the taller height is caused by the buttons wrapping */\n    let actionAreaHeight = actionArea.offsetHeight;\n\n    if (actionAreaHeight === undefined) {\n      actionAreaHeight = 0;\n    }\n\n    const appendActionContent = () => {\n      this.actionContent = this.actionContent.reverse();\n      this.actionContent.forEach((btn: string | Node) => {\n        this.el.append(btn);\n      });\n      this.areButtonsReversed = !this.areButtonsReversed;\n    };\n\n    if (\n      (this.deviceSize > DEVICE_SIZES.S &&\n        actionAreaHeight <= max &&\n        !this.areButtonsReversed) ||\n      (((this.deviceSize > DEVICE_SIZES.S && actionAreaHeight > max) ||\n        this.deviceSize <= DEVICE_SIZES.S) &&\n        this.areButtonsReversed)\n    ) {\n      appendActionContent();\n    }\n  };\n\n  render() {\n    const {\n      size,\n      border,\n      heading,\n      subheading,\n      aligned,\n      sticky,\n      stickyDesktopOnly,\n      theme,\n    } = this;\n\n    const navAriaLabel = `${\n      isSlotUsed(this.el, \"heading\")\n        ? this.el.querySelector('[slot=\"heading\"]')?.textContent ?? \"\"\n        : heading ?? \"\"\n    } page sections`;\n\n    return (\n      <Host\n        class={{\n          [\"ic-page-header-sticky\"]: !!sticky,\n          [\"ic-page-header-sticky-desktop\"]: !sticky && !!stickyDesktopOnly,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n        aria-label={this.el.ariaLabel || \"page header\"}\n      >\n        <header\n          class={{\n            [\"border-bottom\"]: !!border,\n            [\"tabs\"]: isSlotUsed(this.el, \"tabs\"),\n          }}\n          role=\"presentation\"\n        >\n          <ic-section-container\n            aligned={aligned}\n            fullHeight={isSlotUsed(this.el, \"tabs\")}\n          >\n            {isSlotUsed(this.el, \"breadcrumbs\") && (\n              <div class=\"breadcrumb-area\">\n                <slot name=\"breadcrumbs\" />\n              </div>\n            )}\n            <div class=\"main-content\">\n              <div class=\"title-area\">\n                <div class=\"header-content\">\n                  <slot name=\"heading\">\n                    <ic-typography\n                      variant={size === \"small\" ? \"h4\" : \"h2\"}\n                      class=\"heading\"\n                    >\n                      <h2>{heading}</h2>\n                    </ic-typography>\n                  </slot>\n                  <slot name=\"heading-adornment\" />\n                </div>\n                <div\n                  class={{\n                    [\"subheading-content\"]:\n                      !!subheading || isSlotUsed(this.el, \"subheading\"),\n                    [\"small\"]: size === \"small\",\n                  }}\n                >\n                  <slot name=\"subheading\">\n                    <ic-typography variant=\"body\">{subheading}</ic-typography>\n                  </slot>\n                </div>\n              </div>\n              {isSlotUsed(this.el, \"actions\") && (\n                <div class=\"action-area\">\n                  <slot name=\"actions\" />\n                </div>\n              )}\n              {isSlotUsed(this.el, \"input\") && (\n                <div class=\"input-area\">\n                  <slot name=\"input\" />\n                </div>\n              )}\n            </div>\n\n            {(isSlotUsed(this.el, \"stepper\") ||\n              isSlotUsed(this.el, \"tabs\")) && (\n              <div class=\"navigation-area\">\n                {isSlotUsed(this.el, \"stepper\") &&\n                  !isSlotUsed(this.el, \"tabs\") && <slot name=\"stepper\" />}\n                {isSlotUsed(this.el, \"tabs\") && (\n                  <nav aria-label={navAriaLabel}>\n                    <ic-horizontal-scroll>\n                      <ul class=\"tabs-slot\">\n                        <slot name=\"tabs\" />\n                      </ul>\n                    </ic-horizontal-scroll>\n                  </nav>\n                )}\n              </div>\n            )}\n          </ic-section-container>\n        </header>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/core/p-fc50d582.entry.js

@@ -0,0 +1,2 @@
+import{r as e,c as i,h as t,H as r,g as a}from"./p-8e4e97b4.js";import{c as s}from"./p-f074ef5b.js";import{a as n,i as o,p as c,V as l}from"./p-281ce313.js";const d='/*! 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}:host ::slotted(ic-typography){--ic-typography-color:var(--ic-alert-description)}.container{min-height:var(--ic-alert-min-height);border-radius:var(--ic-space-xxs) var(--ic-space-xxxs) var(--ic-space-xxxs)\n    var(--ic-space-xxs);position:relative;display:flex;align-items:center}.container-neutral{background-color:var(--ic-alert-background-neutral);border:var(--ic-space-xxxs) solid var(--ic-alert-border-neutral)}.container-info{background-color:var(--ic-alert-background-info);border:var(--ic-space-xxxs) solid var(--ic-alert-border-info)}.container-warning{background-color:var(--ic-alert-background-warning);border:var(--ic-space-xxxs) solid var(--ic-alert-border-warning)}.container-error{background-color:var(--ic-alert-background-error);border:var(--ic-space-xxxs) solid var(--ic-alert-border-error)}.container-success{background-color:var(--ic-alert-background-success);border:var(--ic-space-xxxs) solid var(--ic-alert-border-success)}.alert-icon-container{height:100%;display:flex;align-items:center}.divider{height:100%;width:var(--ic-space-xs);border-radius:var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);position:absolute}.divider-neutral{background-color:var(--ic-alert-status-type-neutral)}.divider-info{background-color:var(--ic-alert-status-type-info)}.divider-warning{background-color:var(--ic-alert-status-type-warning)}.divider-error{background-color:var(--ic-alert-status-type-error)}.divider-success{background-color:var(--ic-alert-status-type-success)}.alert-icon{height:var(--ic-space-lg);width:1.375rem;margin-left:1.125rem}.icon-placeholder{margin-left:var(--ic-space-xs)}.alert-icon>svg{height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block}:host([showdefaulticon="false"]) .icon-neutral{visibility:hidden;width:0;margin-left:0.625rem}.icon-neutral>svg,::slotted(svg){height:var(--ic-space-lg);width:var(--ic-space-lg);display:inline-block;fill:var(--ic-alert-icon-neutral)}:host([variant="info"]) .alert-icon svg{fill:var(--ic-alert-icon-info)}:host([variant="warning"]) .alert-icon svg{fill:var(--ic-alert-icon-warning)}:host([variant="error"]) .alert-icon svg{fill:var(--ic-alert-icon-error)}:host([variant="success"]) .alert-icon svg{fill:var(--ic-alert-icon-success)}.alert-content{display:flex;align-items:center;margin-left:0.625rem;width:100%}.alert-message{display:flex;align-items:center;padding:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;flex:1;--ic-typography-color:var(--ic-alert-description)}.alert-message-title-above{display:inline}.alert-title{margin-right:var(--ic-space-xs);--ic-typography-color:var(--ic-alert-title)}.alert-title-above{white-space:normal}.alert-action-container{margin-right:var(--ic-space-xs);display:flex;align-items:center}.dismiss-icon{margin-right:var(--ic-space-xxxs);margin-left:-0.375rem;padding:0.375rem;border:none;border-radius:50%;background-color:inherit;display:flex;align-items:center;justify-content:center}.dismiss-icon>svg{color:var(--ic-alert-icon-dismissible)}.dismiss-icon:hover{cursor:pointer}@media (max-width: 628px){.alert-content{display:flex;flex-direction:column;align-items:flex-start}.alert-message{display:flex;flex-direction:column;align-items:flex-start}.alert-title{white-space:normal}.alert-action-container{margin-bottom:var(--ic-space-xs)}}@media (forced-colors: active){.container{border:var(--ic-border-hc)}}';const h=d;const p=class{constructor(t){e(this,t);this.icDismiss=i(this,"icDismiss",7);this.hostMutationObserver=null;this.systemThemeObserver=null;this.darkMode=false;this.alertTitleWrap=false;this.visible=true;this.announced=true;this.dismissible=false;this.heading="";this.showDefaultIcon=true;this.theme="inherit";this.titleAbove=false;this.variant="neutral";this.dismissAction=()=>{this.icDismiss.emit()};this.calculateMinHeight=()=>{var e;const i=Number((e=this.messageEl)===null||e===void 0?void 0:e.clientHeight);const t=c(`${(i>40?i:52)+(this.darkMode?0:4)}`);if(this.el.style.getPropertyValue("--ic-alert-min-height")!==t)this.el.style.setProperty("--ic-alert-min-height",t)}}themeChangeHandler(){if(this.theme!=="inherit")this.darkMode=this.theme==="dark"}disconnectedCallback(){var e,i;(e=this.hostMutationObserver)===null||e===void 0?void 0:e.disconnect();(i=this.systemThemeObserver)===null||i===void 0?void 0:i.removeEventListener("change",this.darkModeChangeHandler)}componentWillLoad(){if(!this.el.closest("ic-theme")){this.systemThemeObserver=window.matchMedia("(prefers-color-scheme: dark)");this.systemThemeObserver.addEventListener("change",this.darkModeChangeHandler);this.darkMode=this.systemThemeObserver.matches}this.themeChangeHandler()}componentDidLoad(){var e;if(Number((e=this.titleEl)===null||e===void 0?void 0:e.clientHeight)>24)this.alertTitleWrap=true;this.hostMutationObserver=new MutationObserver((e=>n(e,"action",this)));this.hostMutationObserver.observe(this.el,{childList:true});this.calculateMinHeight()}componentDidUpdate(){this.calculateMinHeight()}handleClick(){this.visible=!this.visible}darkModeChangeHandler(e){this.darkMode="detail"in e?e.detail==="dark":e.matches;this.calculateMinHeight()}render(){const{variant:e,heading:i,message:a,titleAbove:n,dismissible:c,announced:d,visible:h,showDefaultIcon:p,theme:u,alertTitleWrap:m,dismissAction:b}=this;const g=()=>{const i={"alert-icon":true,"svg-container":true,[`icon-${e}`]:true};if(e==="neutral"){if(o(this.el,"neutral-icon")){return t("div",{class:i},t("slot",{name:"neutral-icon"}))}else if(!p){return t("div",{class:"icon-placeholder"})}}return t("span",{class:i,innerHTML:l[e].icon})};return h&&t(r,{role:d?"alert":null,class:{[`ic-theme-${u}`]:u!=="inherit"}},t("div",{class:{container:true,[`container-${e}`]:true}},t("div",{class:"alert-icon-container"},t("div",{class:{divider:true,[`divider-${e}`]:true}}),t(g,null)),t("div",{class:"alert-content"},t("div",{class:{"alert-message":true,"alert-message-title-above":n||m},ref:e=>this.messageEl=e},i&&t("ic-typography",{class:{"alert-title":true,"alert-title-above":n||m},variant:"subtitle-large",ref:e=>this.titleEl=e},t("p",null,i)),t("slot",{name:"message"},t("ic-typography",{variant:"body"},a))),o(this.el,"action")&&t("div",{class:"alert-action-container"},t("slot",{name:"action"}))),t("div",{class:"dismiss-icon-container"},c&&t("ic-button",{class:{"svg-container":true,"dismiss-icon":true},innerHTML:s,onClick:b,variant:"icon",theme:"dark",title:"Dismiss"}))))}get el(){return a(this)}static get watchers(){return{theme:["themeChangeHandler"]}}};p.style=h;export{p as ic_alert};
+//# sourceMappingURL=p-fc50d582.entry.js.map

package/dist/core/p-fc50d582.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["icAlertCss","IcAlertStyle0","Alert","constructor","hostRef","this","hostMutationObserver","systemThemeObserver","darkMode","alertTitleWrap","visible","announced","dismissible","heading","showDefaultIcon","theme","titleAbove","variant","dismissAction","icDismiss","emit","calculateMinHeight","contentHeight","Number","_a","messageEl","clientHeight","minHeight","pxToRem","el","style","getPropertyValue","setProperty","themeChangeHandler","disconnectedCallback","disconnect","_b","removeEventListener","darkModeChangeHandler","componentWillLoad","closest","window","matchMedia","addEventListener","matches","componentDidLoad","titleEl","MutationObserver","mutationList","renderDynamicChildSlots","observe","childList","componentDidUpdate","handleClick","ev","detail","render","message","Icon","iconClass","isSlotUsed","h","class","name","innerHTML","VARIANT_ICONS","icon","Host","role","container","divider","ref","closeIcon","onClick","title"],"sources":["src/components/ic-alert/ic-alert.css?tag=ic-alert&encapsulation=shadow","src/components/ic-alert/ic-alert.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n}\n\n:host ::slotted(ic-typography) {\n  --ic-typography-color: var(--ic-alert-description);\n}\n\n.container {\n  min-height: var(--ic-alert-min-height);\n  border-radius: var(--ic-space-xxs) var(--ic-space-xxxs) var(--ic-space-xxxs)\n    var(--ic-space-xxs);\n  position: relative;\n  display: flex;\n  align-items: center;\n}\n\n.container-neutral {\n  background-color: var(--ic-alert-background-neutral);\n  border: var(--ic-space-xxxs) solid var(--ic-alert-border-neutral);\n}\n\n.container-info {\n  background-color: var(--ic-alert-background-info);\n  border: var(--ic-space-xxxs) solid var(--ic-alert-border-info);\n}\n\n.container-warning {\n  background-color: var(--ic-alert-background-warning);\n  border: var(--ic-space-xxxs) solid var(--ic-alert-border-warning);\n}\n\n.container-error {\n  background-color: var(--ic-alert-background-error);\n  border: var(--ic-space-xxxs) solid var(--ic-alert-border-error);\n}\n\n.container-success {\n  background-color: var(--ic-alert-background-success);\n  border: var(--ic-space-xxxs) solid var(--ic-alert-border-success);\n}\n\n.alert-icon-container {\n  height: 100%;\n  display: flex;\n  align-items: center;\n}\n\n.divider {\n  height: 100%;\n  width: var(--ic-space-xs);\n  border-radius: var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs);\n  position: absolute;\n}\n\n.divider-neutral {\n  background-color: var(--ic-alert-status-type-neutral);\n}\n\n.divider-info {\n  background-color: var(--ic-alert-status-type-info);\n}\n\n.divider-warning {\n  background-color: var(--ic-alert-status-type-warning);\n}\n\n.divider-error {\n  background-color: var(--ic-alert-status-type-error);\n}\n\n.divider-success {\n  background-color: var(--ic-alert-status-type-success);\n}\n\n.alert-icon {\n  height: var(--ic-space-lg);\n  width: 1.375rem;\n  margin-left: 1.125rem;\n}\n\n.icon-placeholder {\n  margin-left: var(--ic-space-xs);\n}\n\n.alert-icon > svg {\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  display: inline-block;\n}\n\n/* required for Gatsby as prop does not seem to work when set to false */\n:host([showdefaulticon=\"false\"]) .icon-neutral {\n  visibility: hidden;\n  width: 0;\n  margin-left: 0.625rem;\n}\n\n.icon-neutral > svg,\n::slotted(svg) {\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  display: inline-block;\n  fill: var(--ic-alert-icon-neutral);\n}\n\n:host([variant=\"info\"]) .alert-icon svg {\n  fill: var(--ic-alert-icon-info);\n}\n\n:host([variant=\"warning\"]) .alert-icon svg {\n  fill: var(--ic-alert-icon-warning);\n}\n\n:host([variant=\"error\"]) .alert-icon svg {\n  fill: var(--ic-alert-icon-error);\n}\n\n:host([variant=\"success\"]) .alert-icon svg {\n  fill: var(--ic-alert-icon-success);\n}\n\n.alert-content {\n  display: flex;\n  align-items: center;\n  margin-left: 0.625rem;\n  width: 100%;\n}\n\n.alert-message {\n  display: flex;\n  align-items: center;\n  padding: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;\n  flex: 1;\n\n  --ic-typography-color: var(--ic-alert-description);\n}\n\n.alert-message-title-above {\n  display: inline;\n}\n\n.alert-title {\n  margin-right: var(--ic-space-xs);\n\n  --ic-typography-color: var(--ic-alert-title);\n}\n\n.alert-title-above {\n  white-space: normal;\n}\n\n.alert-action-container {\n  margin-right: var(--ic-space-xs);\n  display: flex;\n  align-items: center;\n}\n\n.dismiss-icon {\n  margin-right: var(--ic-space-xxxs);\n  margin-left: -0.375rem;\n  padding: 0.375rem;\n  border: none;\n  border-radius: 50%;\n  background-color: inherit;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.dismiss-icon > svg {\n  color: var(--ic-alert-icon-dismissible);\n}\n\n.dismiss-icon:hover {\n  cursor: pointer;\n}\n\n@media (max-width: 628px) {\n  .alert-content {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .alert-message {\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .alert-title {\n    white-space: normal;\n  }\n\n  .alert-action-container {\n    margin-bottom: var(--ic-space-xs);\n  }\n}\n\n@media (forced-colors: active) {\n  .container {\n    border: var(--ic-border-hc);\n  }\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  State,\n  Listen,\n  Prop,\n  h,\n  Watch,\n} from \"@stencil/core\";\nimport closeIcon from \"../../assets/close-icon.svg\";\nimport {\n  isSlotUsed,\n  pxToRem,\n  renderDynamicChildSlots,\n} from \"../../utils/helpers\";\nimport {\n  IcStatusVariants,\n  IcThemeMode,\n  IcThemeSettings,\n} from \"../../utils/types\";\nimport { VARIANT_ICONS } from \"../../utils/constants\";\n\n/**\n * @slot message - Content is placed to the right of the title.\n * @slot action - Content is placed to the right of the message.\n * @slot neutral-icon - A custom neutral icon is placed to the left of the title. This will override the default icon if used.\n */\n@Component({\n  tag: \"ic-alert\",\n  styleUrl: \"ic-alert.css\",\n  shadow: true,\n})\nexport class Alert {\n  private hostMutationObserver: MutationObserver | null = null;\n  private systemThemeObserver: MediaQueryList | null = null;\n  private darkMode: boolean = false;\n  private messageEl?: HTMLDivElement;\n  private titleEl?: HTMLIcTypographyElement;\n\n  @Element() el: HTMLIcAlertElement;\n\n  @State() alertTitleWrap: boolean = false;\n  @State() visible: boolean = true;\n\n  /**\n   * If `true`, the alert will have the 'alert' ARIA role and will be announced to screen readers.\n   */\n  @Prop() announced: boolean = true;\n\n  /**\n   * If `true`, the alert will have a close icon at the end to dismiss it.\n   */\n  @Prop() dismissible: boolean = false;\n\n  /**\n   * The optional title to display at the start of the alert.\n   */\n  @Prop() heading: string = \"\";\n\n  /**\n   * The main body message of the alert.\n   */\n  @Prop() message?: string;\n\n  /**\n   * If `true`, the default icon for the neutral variant will appear on the left of the alert.\n   */\n  @Prop() showDefaultIcon: boolean = true;\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() theme: IcThemeMode = \"inherit\";\n  @Watch(\"theme\")\n  themeChangeHandler(): void {\n    if (this.theme !== \"inherit\") this.darkMode = this.theme === \"dark\";\n  }\n\n  /**\n   * If `true`, the title and message will appear above and below instead of inline.\n   */\n  @Prop() titleAbove: boolean = false;\n\n  /**\n   * The variant of the alert which will be rendered.\n   */\n  @Prop() variant: IcStatusVariants = \"neutral\";\n\n  /**\n   * Is emitted when the user dismisses the alert.\n   */\n  @Event() icDismiss: EventEmitter<void>;\n\n  disconnectedCallback(): void {\n    this.hostMutationObserver?.disconnect();\n    this.systemThemeObserver?.removeEventListener(\n      \"change\",\n      this.darkModeChangeHandler\n    );\n  }\n\n  componentWillLoad(): void {\n    if (!this.el.closest(\"ic-theme\")) {\n      this.systemThemeObserver = window.matchMedia(\n        \"(prefers-color-scheme: dark)\"\n      );\n      this.systemThemeObserver.addEventListener(\n        \"change\",\n        this.darkModeChangeHandler\n      );\n      this.darkMode = this.systemThemeObserver.matches;\n    }\n\n    this.themeChangeHandler();\n  }\n\n  componentDidLoad(): void {\n    if (Number(this.titleEl?.clientHeight) > 24) this.alertTitleWrap = true;\n\n    this.hostMutationObserver = new MutationObserver((mutationList) =>\n      renderDynamicChildSlots(mutationList, \"action\", this)\n    );\n    this.hostMutationObserver.observe(this.el, {\n      childList: true,\n    });\n\n    this.calculateMinHeight();\n  }\n\n  componentDidUpdate(): void {\n    this.calculateMinHeight();\n  }\n\n  @Listen(\"icDismiss\", { capture: true })\n  handleClick(): void {\n    this.visible = !this.visible;\n  }\n\n  @Listen(\"icThemeChange\", { target: \"document\", capture: true })\n  darkModeChangeHandler(\n    ev: CustomEvent<IcThemeSettings> | MediaQueryListEvent\n  ): void {\n    this.darkMode = \"detail\" in ev ? ev.detail === \"dark\" : ev.matches;\n\n    this.calculateMinHeight();\n  }\n\n  private dismissAction = (): void => {\n    this.icDismiss.emit();\n  };\n\n  private calculateMinHeight = (): void => {\n    const contentHeight = Number(this.messageEl?.clientHeight);\n\n    const minHeight = pxToRem(\n      `${(contentHeight > 40 ? contentHeight : 52) + (this.darkMode ? 0 : 4)}`\n    );\n\n    if (this.el.style.getPropertyValue(\"--ic-alert-min-height\") !== minHeight)\n      this.el.style.setProperty(\"--ic-alert-min-height\", minHeight);\n  };\n\n  render() {\n    const {\n      variant,\n      heading,\n      message,\n      titleAbove,\n      dismissible,\n      announced,\n      visible,\n      showDefaultIcon,\n      theme,\n      alertTitleWrap,\n      dismissAction,\n    } = this;\n\n    const Icon = () => {\n      const iconClass = {\n        \"alert-icon\": true,\n        \"svg-container\": true,\n        [`icon-${variant}`]: true,\n      };\n\n      if (variant === \"neutral\") {\n        if (isSlotUsed(this.el, \"neutral-icon\")) {\n          return (\n            <div class={iconClass}>\n              <slot name=\"neutral-icon\"></slot>\n            </div>\n          );\n        } else if (!showDefaultIcon) {\n          return <div class=\"icon-placeholder\"></div>;\n        }\n      }\n\n      return (\n        <span class={iconClass} innerHTML={VARIANT_ICONS[variant].icon}></span>\n      );\n    };\n\n    return (\n      visible && (\n        <Host\n          role={announced ? \"alert\" : null}\n          class={{\n            [`ic-theme-${theme}`]: theme !== \"inherit\",\n          }}\n        >\n          <div class={{ container: true, [`container-${variant}`]: true }}>\n            <div class=\"alert-icon-container\">\n              <div\n                class={{ divider: true, [`divider-${variant}`]: true }}\n              ></div>\n              <Icon />\n            </div>\n            <div class=\"alert-content\">\n              <div\n                class={{\n                  \"alert-message\": true,\n                  \"alert-message-title-above\": titleAbove || alertTitleWrap,\n                }}\n                ref={(el) => (this.messageEl = el)}\n              >\n                {heading && (\n                  <ic-typography\n                    class={{\n                      \"alert-title\": true,\n                      \"alert-title-above\": titleAbove || alertTitleWrap,\n                    }}\n                    variant=\"subtitle-large\"\n                    ref={(el) => (this.titleEl = el)}\n                  >\n                    <p>{heading}</p>\n                  </ic-typography>\n                )}\n                <slot name=\"message\">\n                  <ic-typography variant=\"body\">{message}</ic-typography>\n                </slot>\n              </div>\n              {isSlotUsed(this.el, \"action\") && (\n                <div class=\"alert-action-container\">\n                  <slot name=\"action\" />\n                </div>\n              )}\n            </div>\n            <div class=\"dismiss-icon-container\">\n              {dismissible && (\n                <ic-button\n                  class={{ \"svg-container\": true, \"dismiss-icon\": true }}\n                  innerHTML={closeIcon}\n                  onClick={dismissAction}\n                  variant=\"icon\"\n                  theme=\"dark\"\n                  title=\"Dismiss\"\n                ></ic-button>\n              )}\n            </div>\n          </div>\n        </Host>\n      )\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}