@carbon/web-components 2.0.0-alpha.0 → 2.0.0-beta.1

package/es/components/list/unordered-list.js

@@ -23,15 +23,15 @@ import styles from "././list.css.js";
  */ /**
      * Ordered list.
      */
-let BXUnorderedList = _decorate([customElement(`${prefix}-unordered-list`)], function (_initialize, _LitElement) {
-  class BXUnorderedList extends _LitElement {
+let CDSUnorderedList = _decorate([customElement(`${prefix}-unordered-list`)], function (_initialize, _LitElement) {
+  class CDSUnorderedList extends _LitElement {
     constructor(...args) {
       super(...args);
       _initialize(this);
     }
   }
   return {
-    F: BXUnorderedList,
+    F: CDSUnorderedList,
     d: [{
       kind: "field",
       decorators: [property({
@@ -57,7 +57,7 @@ let BXUnorderedList = _decorate([customElement(`${prefix}-unordered-list`)], fun
         } else {
           this.removeAttribute('slot');
         }
-        _get(_getPrototypeOf(BXUnorderedList.prototype), "connectedCallback", this).call(this);
+        _get(_getPrototypeOf(CDSUnorderedList.prototype), "connectedCallback", this).call(this);
       }
     }, {
       kind: "method",
@@ -95,5 +95,5 @@ let BXUnorderedList = _decorate([customElement(`${prefix}-unordered-list`)], fun
     }]
   };
 }, LitElement);
-export default BXUnorderedList;
+export default CDSUnorderedList;
 //# sourceMappingURL=unordered-list.js.map

package/es/components/list/unordered-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"unordered-list.js","names":["classMap","LitElement","html","property","customElement","prefix","styles","BXUnorderedList","_decorate","_initialize","_LitElement","constructor","args","F","d","kind","decorators","type","Boolean","reflect","key","value","connectedCallback","closest","selectorListItem","setAttribute","removeAttribute","_get","_getPrototypeOf","prototype","call","render","classes","getAttribute","isExpressive","_t","_","static"],"sources":["components/list/unordered-list.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './list.scss';\n\n/**\n * Ordered list.\n */\n@customElement(`${prefix}-unordered-list`)\nclass BXUnorderedList extends LitElement {\n  /**\n   * `true` if expressive theme enabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  isExpressive = false;\n\n  connectedCallback() {\n    // Uses attribute for lookup from child\n    if (\n      this.closest(\n        (this.constructor as typeof BXUnorderedList).selectorListItem\n      )\n    ) {\n      this.setAttribute('slot', 'nested');\n    } else {\n      this.removeAttribute('slot');\n    }\n    super.connectedCallback();\n  }\n\n  render() {\n    const classes = classMap({\n      [`${prefix}--list--unordered`]: true,\n      [`${prefix}--list--nested`]: this.getAttribute('slot') === 'nested',\n      [`${prefix}--list--expressive`]: this.isExpressive,\n    });\n    return html`\n      <ul class=\"${classes}\">\n        <slot></slot>\n      </ul>\n    `;\n  }\n\n  /**\n   * A selector that will return list item.\n   */\n  static get selectorListItem() {\n    return `${prefix}-list-item`;\n  }\n\n  static styles = styles;\n}\n\nexport default BXUnorderedList;\n"],"mappings":";;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,QAAQ,QAAQ,6BAA6B;AACtD,SAASC,UAAU,EAAEC,IAAI,QAAQ,KAAK;AACtC,SAASC,QAAQ,EAAEC,aAAa,QAAQ,mBAAmB;AAC3D,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,OAAOC,MAAM,MAAM,iBAAa;;AAEhC;AACA;AACA,GAFA;AACA;AACA;AAFA,IAIMC,eAAe,GAAAC,SAAA,EADpBJ,aAAa,CAAE,GAAEC,MAAO,iBAAgB,CAAC,aAAAI,WAAA,EAAAC,WAAA;EAA1C,MACMH,eAAe,SAAAG,WAAA,CAAoB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EA0CzC;EAAC;IAAAI,CAAA,EA1CKN,eAAe;IAAAO,CAAA;MAAAC,IAAA;MAAAC,UAAA,GAIlBb,QAAQ,CAAC;QAAEc,IAAI,EAAEC,OAAO;QAAEC,OAAO,EAAE;MAAK,CAAC,CAAC;MAAAC,GAAA;MAAAC,MAAA;QAAA,OAC5B,KAAK;MAAA;IAAA;MAAAN,IAAA;MAAAK,GAAA;MAAAC,KAAA;MAJpB;AACF;AACA;;MAIE,SAAAC,kBAAA,EAAoB;QAClB;QACA,IACE,IAAI,CAACC,OAAO,CACT,IAAI,CAACZ,WAAW,CAA4Ba,gBAAgB,CAC9D,EACD;UACA,IAAI,CAACC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC;QACrC,CAAC,MAAM;UACL,IAAI,CAACC,eAAe,CAAC,MAAM,CAAC;QAC9B;QACAC,IAAA,CAAAC,eAAA,CAlBErB,eAAe,CAAAsB,SAAA,8BAAAC,IAAA;MAmBnB;IAAC;MAAAf,IAAA;MAAAK,GAAA;MAAAC,KAAA,EAED,SAAAU,OAAA,EAAS;QACP,MAAMC,OAAO,GAAGhC,QAAQ,CAAC;UACvB,CAAE,GAAEK,MAAO,mBAAkB,GAAG,IAAI;UACpC,CAAE,GAAEA,MAAO,gBAAe,GAAG,IAAI,CAAC4B,YAAY,CAAC,MAAM,CAAC,KAAK,QAAQ;UACnE,CAAE,GAAE5B,MAAO,oBAAmB,GAAG,IAAI,CAAC6B;QACxC,CAAC,CAAC;QACF,OAAOhC,IAAI,CAAAiC,EAAA,KAAAA,EAAA,GAAAC,CAAC;AAChB,mBAAiB,CAAU;AAC3B;AACA;AACA,KAAI,GAHeJ,OAAO;MAIxB;;MAEA;AACF;AACA;IAFE;MAAAjB,IAAA;MAAAsB,MAAA;MAAAjB,GAAA;MAAAC,KAAA,EAGA,SAAAG,iBAAA,EAA8B;QAC5B,OAAQ,GAAEnB,MAAO,YAAW;MAC9B;IAAC;MAAAU,IAAA;MAAAsB,MAAA;MAAAjB,GAAA;MAAAC,MAAA;QAAA,OAEef,MAAM;MAAA;IAAA;EAAA;AAAA,GAzCML,UAAU;AA4CxC,eAAeM,eAAe"}
+{"version":3,"file":"unordered-list.js","names":["classMap","LitElement","html","property","customElement","prefix","styles","CDSUnorderedList","_decorate","_initialize","_LitElement","constructor","args","F","d","kind","decorators","type","Boolean","reflect","key","value","connectedCallback","closest","selectorListItem","setAttribute","removeAttribute","_get","_getPrototypeOf","prototype","call","render","classes","getAttribute","isExpressive","_t","_","static"],"sources":["components/list/unordered-list.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './list.scss';\n\n/**\n * Ordered list.\n */\n@customElement(`${prefix}-unordered-list`)\nclass CDSUnorderedList extends LitElement {\n  /**\n   * `true` if expressive theme enabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  isExpressive = false;\n\n  connectedCallback() {\n    // Uses attribute for lookup from child\n    if (\n      this.closest(\n        (this.constructor as typeof CDSUnorderedList).selectorListItem\n      )\n    ) {\n      this.setAttribute('slot', 'nested');\n    } else {\n      this.removeAttribute('slot');\n    }\n    super.connectedCallback();\n  }\n\n  render() {\n    const classes = classMap({\n      [`${prefix}--list--unordered`]: true,\n      [`${prefix}--list--nested`]: this.getAttribute('slot') === 'nested',\n      [`${prefix}--list--expressive`]: this.isExpressive,\n    });\n    return html`\n      <ul class=\"${classes}\">\n        <slot></slot>\n      </ul>\n    `;\n  }\n\n  /**\n   * A selector that will return list item.\n   */\n  static get selectorListItem() {\n    return `${prefix}-list-item`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSUnorderedList;\n"],"mappings":";;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,QAAQ,QAAQ,6BAA6B;AACtD,SAASC,UAAU,EAAEC,IAAI,QAAQ,KAAK;AACtC,SAASC,QAAQ,EAAEC,aAAa,QAAQ,mBAAmB;AAC3D,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,OAAOC,MAAM,MAAM,iBAAa;;AAEhC;AACA;AACA,GAFA;AACA;AACA;AAFA,IAIMC,gBAAgB,GAAAC,SAAA,EADrBJ,aAAa,CAAE,GAAEC,MAAO,iBAAgB,CAAC,aAAAI,WAAA,EAAAC,WAAA;EAA1C,MACMH,gBAAgB,SAAAG,WAAA,CAAoB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EA0C1C;EAAC;IAAAI,CAAA,EA1CKN,gBAAgB;IAAAO,CAAA;MAAAC,IAAA;MAAAC,UAAA,GAInBb,QAAQ,CAAC;QAAEc,IAAI,EAAEC,OAAO;QAAEC,OAAO,EAAE;MAAK,CAAC,CAAC;MAAAC,GAAA;MAAAC,MAAA;QAAA,OAC5B,KAAK;MAAA;IAAA;MAAAN,IAAA;MAAAK,GAAA;MAAAC,KAAA;MAJpB;AACF;AACA;;MAIE,SAAAC,kBAAA,EAAoB;QAClB;QACA,IACE,IAAI,CAACC,OAAO,CACT,IAAI,CAACZ,WAAW,CAA6Ba,gBAAgB,CAC/D,EACD;UACA,IAAI,CAACC,YAAY,CAAC,MAAM,EAAE,QAAQ,CAAC;QACrC,CAAC,MAAM;UACL,IAAI,CAACC,eAAe,CAAC,MAAM,CAAC;QAC9B;QACAC,IAAA,CAAAC,eAAA,CAlBErB,gBAAgB,CAAAsB,SAAA,8BAAAC,IAAA;MAmBpB;IAAC;MAAAf,IAAA;MAAAK,GAAA;MAAAC,KAAA,EAED,SAAAU,OAAA,EAAS;QACP,MAAMC,OAAO,GAAGhC,QAAQ,CAAC;UACvB,CAAE,GAAEK,MAAO,mBAAkB,GAAG,IAAI;UACpC,CAAE,GAAEA,MAAO,gBAAe,GAAG,IAAI,CAAC4B,YAAY,CAAC,MAAM,CAAC,KAAK,QAAQ;UACnE,CAAE,GAAE5B,MAAO,oBAAmB,GAAG,IAAI,CAAC6B;QACxC,CAAC,CAAC;QACF,OAAOhC,IAAI,CAAAiC,EAAA,KAAAA,EAAA,GAAAC,CAAC;AAChB,mBAAiB,CAAU;AAC3B;AACA;AACA,KAAI,GAHeJ,OAAO;MAIxB;;MAEA;AACF;AACA;IAFE;MAAAjB,IAAA;MAAAsB,MAAA;MAAAjB,GAAA;MAAAC,KAAA,EAGA,SAAAG,iBAAA,EAA8B;QAC5B,OAAQ,GAAEnB,MAAO,YAAW;MAC9B;IAAC;MAAAU,IAAA;MAAAsB,MAAA;MAAAjB,GAAA;MAAAC,MAAA;QAAA,OAEef,MAAM;MAAA;IAAA;EAAA;AAAA,GAzCOL,UAAU;AA4CzC,eAAeM,gBAAgB"}

package/es/components/loading/loading.css.js

@@ -8,5 +8,5 @@
  */
 import { css } from 'lit';
 export default css([
-  '.cds--loading,:host(cds-loading){box-sizing:border-box;padding:0;border:0;margin:0;font-family:inherit;font-size:100%;vertical-align:baseline;animation-duration:690ms;animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:rotate;animation-timing-function:linear;width:5.5rem;height:5.5rem}.cds--loading *,.cds--loading ::after,.cds--loading ::before,:host(cds-loading) *,:host(cds-loading) ::after,:host(cds-loading) ::before{box-sizing:inherit}.cds--loading svg circle,:host(cds-loading) svg circle{animation-duration:10ms;animation-name:init-stroke;animation-timing-function:cubic-bezier(.5,0,.1,1)}@media screen and (prefers-reduced-motion:reduce){.cds--loading svg circle,:host(cds-loading) svg circle{animation:none}}.cds--loading__svg{fill:transparent}.cds--loading__svg circle{stroke-dasharray:276.4608 276.4608;stroke-linecap:butt;stroke-width:10}.cds--loading__stroke{stroke:var(--cds-interactive,#0f62fe);stroke-dashoffset:52.527552}.cds--loading--small .cds--loading__stroke,:host(cds-loading[type=small]) .cds--loading__stroke{stroke-dashoffset:143.759616}.cds--loading--stop,:host(cds-loading[inactive]){animation:rotate-end-p1 .7s cubic-bezier(0,0,.25,1) forwards,rotate-end-p2 .7s cubic-bezier(0,0,.25,1) .7s forwards}.cds--loading--stop svg circle,:host(cds-loading[inactive]) svg circle{animation-delay:.7s;animation-duration:.7s;animation-fill-mode:forwards;animation-name:stroke-end;animation-timing-function:cubic-bezier(0,0,.25,1)}@media screen and (prefers-reduced-motion:reduce){.cds--loading--stop svg circle,:host(cds-loading[inactive]) svg circle{animation:none}}.cds--loading--small,:host(cds-loading[type=small]){width:1rem;height:1rem}.cds--loading--small circle,:host(cds-loading[type=small]) circle{stroke-width:16}.cds--loading--small .cds--loading__svg,:host(cds-loading[type=small]) .cds--loading__svg{stroke:var(--cds-interactive,#0f62fe)}.cds--loading__background{stroke:var(--cds-layer-accent);stroke-dashoffset:-22}@media not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent){circle.cds--loading__background{stroke-dasharray:265;stroke-dashoffset:0}}}.cds--loading-overlay,:host(cds-loading[overlay]){position:fixed;z-index:6000;top:0;left:0;display:flex;width:100%;height:100%;align-items:center;justify-content:center;background-color:var(--cds-overlay,rgba(22,22,22,.5));transition:background-color .7s cubic-bezier(.4,.14,.3,1)}.cds--loading-overlay--stop{display:none}@keyframes rotate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes rotate-end-p1{100%{transform:rotate(360deg)}}@keyframes rotate-end-p2{100%{transform:rotate(-360deg)}}@keyframes init-stroke{0%{stroke-dashoffset:276.4608}100%{stroke-dashoffset:52.527552}}@keyframes stroke-end{0%{stroke-dashoffset:52.527552}100%{stroke-dashoffset:276.4608}}:host(cds-loading[overlay]){animation:none}.cds--loading__background[hidden]{display:none}',
+  '.cds--loading,:host(cds-loading){box-sizing:border-box;padding:0;border:0;margin:0;font-family:inherit;font-size:100%;vertical-align:baseline;animation-duration:690ms;animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:rotate;animation-timing-function:linear;width:5.5rem;height:5.5rem}.cds--loading *,.cds--loading ::after,.cds--loading ::before,:host(cds-loading) *,:host(cds-loading) ::after,:host(cds-loading) ::before{box-sizing:inherit}.cds--loading svg circle,:host(cds-loading) svg circle{animation-duration:10ms;animation-name:init-stroke;animation-timing-function:cubic-bezier(.5,0,.1,1)}@media screen and (prefers-reduced-motion:reduce){.cds--loading svg circle,:host(cds-loading) svg circle{animation:none}}.cds--loading__svg{fill:transparent}.cds--loading__svg circle{stroke-dasharray:276.4608 276.4608;stroke-linecap:butt;stroke-width:10}.cds--loading__stroke{stroke:var(--cds-interactive,#0f62fe);stroke-dashoffset:52.527552}.cds--loading--small .cds--loading__stroke,:host(cds-loading[type=small]) .cds--loading__stroke{stroke-dashoffset:143.759616}.cds--loading--stop,:host(cds-loading[inactive]){animation:rotate-end-p1 .7s cubic-bezier(0,0,.25,1) forwards,rotate-end-p2 .7s cubic-bezier(0,0,.25,1) .7s forwards}.cds--loading--stop svg circle,:host(cds-loading[inactive]) svg circle{animation-delay:.7s;animation-duration:.7s;animation-fill-mode:forwards;animation-name:stroke-end;animation-timing-function:cubic-bezier(0,0,.25,1)}@media screen and (prefers-reduced-motion:reduce){.cds--loading--stop svg circle,:host(cds-loading[inactive]) svg circle{animation:none}}.cds--loading--small,:host(cds-loading[type=small]){width:1rem;height:1rem}.cds--loading--small circle,:host(cds-loading[type=small]) circle{stroke-width:16}.cds--loading--small .cds--loading__svg,:host(cds-loading[type=small]) .cds--loading__svg{stroke:var(--cds-interactive,#0f62fe)}.cds--loading__background{stroke:var(--cds-layer-accent);stroke-dashoffset:-22}@media not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent){circle.cds--loading__background{stroke-dasharray:265;stroke-dashoffset:0}}}.cds--loading-overlay,:host(cds-loading[overlay]){position:fixed;z-index:6000;top:0;left:0;display:flex;width:100%;height:100%;align-items:center;justify-content:center;background-color:var(--cds-overlay,rgba(22,22,22,.5));transition:background-color .7s cubic-bezier(.4,.14,.3,1)}.cds--loading-overlay--stop{display:none}@keyframes rotate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes rotate-end-p1{100%{transform:rotate(360deg)}}@keyframes rotate-end-p2{100%{transform:rotate(-360deg)}}@keyframes init-stroke{0%{stroke-dashoffset:276.4608}100%{stroke-dashoffset:52.527552}}@keyframes stroke-end{0%{stroke-dashoffset:52.527552}100%{stroke-dashoffset:276.4608}}:host(cds-loading){display:block}:host(cds-loading[overlay]){animation:none}.cds--loading__background[hidden]{display:none}',
 ]);

package/es/components/loading/loading.d.ts

@@ -13,7 +13,7 @@ import { LOADING_TYPE } from './defs';
  *
  * @element cds-loading
  */
-declare class BXLoading extends LitElement {
+declare class CDSLoading extends LitElement {
     /**
      * The assistive text for the spinner icon.
      */
@@ -34,6 +34,6 @@ declare class BXLoading extends LitElement {
     static styles: any;
 }
 export { LOADING_TYPE };
-export default BXLoading;
+export default CDSLoading;
 
 //# sourceMappingURL=loading.d.ts.map

package/es/components/loading/loading.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["components/loading/loading.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAGvC,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAItC;;;;GAIG;AACH,cACM,SAAU,SAAQ,UAAU;IAChC;;OAEG;IAEH,aAAa,SAAa;IAE1B;;OAEG;IAEH,IAAI,eAAwB;IAE5B;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IAEH,QAAQ,UAAS;IAEjB,MAAM;IAWN,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,OAAO,EAAE,YAAY,EAAE,CAAC;AAExB,eAAe,SAAS,CAAC","file":"loading.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { LOADING_TYPE } from './defs';\nimport getLoadingIcon from './loading-icon';\nimport styles from './loading.scss';\n\n/**\n * Spinner indicating loading state.\n *\n * @element cds-loading\n */\n@customElement(`${prefix}-loading`)\nclass BXLoading extends LitElement {\n  /**\n   * The assistive text for the spinner icon.\n   */\n  @property({ attribute: 'assistive-text' })\n  assistiveText = 'Loading';\n\n  /**\n   * Spinner type.\n   */\n  @property()\n  type = LOADING_TYPE.REGULAR;\n\n  /**\n   * `true` if overlay should be applied.\n   */\n  @property({ type: Boolean, reflect: true })\n  overlay = false;\n\n  /**\n   * `true` if spinner should stop.\n   */\n  @property({ type: Boolean, reflect: true })\n  inactive = false;\n\n  render() {\n    const { inactive, assistiveText, type, overlay } = this;\n    const innerClasses = classMap({\n      [`${prefix}--loading`]: true,\n      [`${prefix}--loading--stop`]: inactive,\n      [`${prefix}--loading--small`]: type === LOADING_TYPE.SMALL,\n    });\n    const icon = getLoadingIcon({ assistiveText, type });\n    return overlay ? html`<div class=\"${innerClasses}\">${icon}</div>` : icon;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport { LOADING_TYPE };\n\nexport default BXLoading;\n"]}
+{"version":3,"sources":["components/loading/loading.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAGvC,OAAO,EAAE,YAAY,EAAE,MAAM,QAAQ,CAAC;AAItC;;;;GAIG;AACH,cACM,UAAW,SAAQ,UAAU;IACjC;;OAEG;IAEH,aAAa,SAAa;IAE1B;;OAEG;IAEH,IAAI,eAAwB;IAE5B;;OAEG;IAEH,OAAO,UAAS;IAEhB;;OAEG;IAEH,QAAQ,UAAS;IAEjB,MAAM;IAWN,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,OAAO,EAAE,YAAY,EAAE,CAAC;AAExB,eAAe,UAAU,CAAC","file":"loading.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { LOADING_TYPE } from './defs';\nimport getLoadingIcon from './loading-icon';\nimport styles from './loading.scss';\n\n/**\n * Spinner indicating loading state.\n *\n * @element cds-loading\n */\n@customElement(`${prefix}-loading`)\nclass CDSLoading extends LitElement {\n  /**\n   * The assistive text for the spinner icon.\n   */\n  @property({ attribute: 'assistive-text' })\n  assistiveText = 'Loading';\n\n  /**\n   * Spinner type.\n   */\n  @property()\n  type = LOADING_TYPE.REGULAR;\n\n  /**\n   * `true` if overlay should be applied.\n   */\n  @property({ type: Boolean, reflect: true })\n  overlay = false;\n\n  /**\n   * `true` if spinner should stop.\n   */\n  @property({ type: Boolean, reflect: true })\n  inactive = false;\n\n  render() {\n    const { inactive, assistiveText, type, overlay } = this;\n    const innerClasses = classMap({\n      [`${prefix}--loading`]: true,\n      [`${prefix}--loading--stop`]: inactive,\n      [`${prefix}--loading--small`]: type === LOADING_TYPE.SMALL,\n    });\n    const icon = getLoadingIcon({ assistiveText, type });\n    return overlay ? html`<div class=\"${innerClasses}\">${icon}</div>` : icon;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport { LOADING_TYPE };\n\nexport default CDSLoading;\n"]}

package/es/components/loading/loading.js

@@ -27,15 +27,15 @@ import styles from "././loading.css.js";
      *
      * @element cds-loading
      */
-let BXLoading = _decorate([customElement(`${prefix}-loading`)], function (_initialize, _LitElement) {
-  class BXLoading extends _LitElement {
+let CDSLoading = _decorate([customElement(`${prefix}-loading`)], function (_initialize, _LitElement) {
+  class CDSLoading extends _LitElement {
     constructor(...args) {
       super(...args);
       _initialize(this);
     }
   }
   return {
-    F: BXLoading,
+    F: CDSLoading,
     d: [{
       kind: "field",
       decorators: [property({
@@ -121,5 +121,5 @@ let BXLoading = _decorate([customElement(`${prefix}-loading`)], function (_initi
   };
 }, LitElement);
 export { LOADING_TYPE };
-export default BXLoading;
+export default CDSLoading;
 //# sourceMappingURL=loading.js.map

package/es/components/loading/loading.js.map

@@ -1 +1 @@
-{"version":3,"file":"loading.js","names":["classMap","LitElement","html","property","customElement","prefix","LOADING_TYPE","getLoadingIcon","styles","BXLoading","_decorate","_initialize","_LitElement","constructor","args","F","d","kind","decorators","attribute","key","value","REGULAR","type","Boolean","reflect","render","inactive","assistiveText","overlay","innerClasses","SMALL","icon","_t","_","static"],"sources":["components/loading/loading.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { LOADING_TYPE } from './defs';\nimport getLoadingIcon from './loading-icon';\nimport styles from './loading.scss';\n\n/**\n * Spinner indicating loading state.\n *\n * @element cds-loading\n */\n@customElement(`${prefix}-loading`)\nclass BXLoading extends LitElement {\n  /**\n   * The assistive text for the spinner icon.\n   */\n  @property({ attribute: 'assistive-text' })\n  assistiveText = 'Loading';\n\n  /**\n   * Spinner type.\n   */\n  @property()\n  type = LOADING_TYPE.REGULAR;\n\n  /**\n   * `true` if overlay should be applied.\n   */\n  @property({ type: Boolean, reflect: true })\n  overlay = false;\n\n  /**\n   * `true` if spinner should stop.\n   */\n  @property({ type: Boolean, reflect: true })\n  inactive = false;\n\n  render() {\n    const { inactive, assistiveText, type, overlay } = this;\n    const innerClasses = classMap({\n      [`${prefix}--loading`]: true,\n      [`${prefix}--loading--stop`]: inactive,\n      [`${prefix}--loading--small`]: type === LOADING_TYPE.SMALL,\n    });\n    const icon = getLoadingIcon({ assistiveText, type });\n    return overlay ? html`<div class=\"${innerClasses}\">${icon}</div>` : icon;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport { LOADING_TYPE };\n\nexport default BXLoading;\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,QAAQ,QAAQ,6BAA6B;AACtD,SAASC,UAAU,EAAEC,IAAI,QAAQ,KAAK;AACtC,SAASC,QAAQ,EAAEC,aAAa,QAAQ,mBAAmB;AAC3D,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,YAAY,QAAQ,QAAQ;AACrC,OAAOC,cAAc,MAAM,gBAAgB;AAC3C,OAAOC,MAAM,MAAM,oBAAgB;;AAEnC;AACA;AACA;AACA;AACA,GAJA;AACA;AACA;AACA;AACA;AAJA,IAMMC,SAAS,GAAAC,SAAA,EADdN,aAAa,CAAE,GAAEC,MAAO,UAAS,CAAC,aAAAM,WAAA,EAAAC,WAAA;EAAnC,MACMH,SAAS,SAAAG,WAAA,CAAoB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EAqCnC;EAAC;IAAAI,CAAA,EArCKN,SAAS;IAAAO,CAAA;MAAAC,IAAA;MAAAC,UAAA,GAIZf,QAAQ,CAAC;QAAEgB,SAAS,EAAE;MAAiB,CAAC,CAAC;MAAAC,GAAA;MAAAC,MAAA;QAAA,OAC1B,SAAS;MAAA;IAAA;MAAAJ,IAAA;MAAAC,UAAA,GAKxBf,QAAQ,EAAE;MAAAiB,GAAA;MAAAC,MAAA;QAAA,OACJf,YAAY,CAACgB,OAAO;MAAA;IAAA;MAAAL,IAAA;MAAAC,UAAA,GAK1Bf,QAAQ,CAAC;QAAEoB,IAAI,EAAEC,OAAO;QAAEC,OAAO,EAAE;MAAK,CAAC,CAAC;MAAAL,GAAA;MAAAC,MAAA;QAAA,OACjC,KAAK;MAAA;IAAA;MAAAJ,IAAA;MAAAC,UAAA,GAKdf,QAAQ,CAAC;QAAEoB,IAAI,EAAEC,OAAO;QAAEC,OAAO,EAAE;MAAK,CAAC,CAAC;MAAAL,GAAA;MAAAC,MAAA;QAAA,OAChC,KAAK;MAAA;IAAA;MAAAJ,IAAA;MAAAG,GAAA;MAAAC,KAAA;MAtBhB;AACF;AACA;;MAIE;AACF;AACA;;MAIE;AACF;AACA;;MAIE;AACF;AACA;;MAIE,SAAAK,OAAA,EAAS;QACP,MAAM;UAAEC,QAAQ;UAAEC,aAAa;UAAEL,IAAI;UAAEM;QAAQ,CAAC,GAAG,IAAI;QACvD,MAAMC,YAAY,GAAG9B,QAAQ,CAAC;UAC5B,CAAE,GAAEK,MAAO,WAAU,GAAG,IAAI;UAC5B,CAAE,GAAEA,MAAO,iBAAgB,GAAGsB,QAAQ;UACtC,CAAE,GAAEtB,MAAO,kBAAiB,GAAGkB,IAAI,KAAKjB,YAAY,CAACyB;QACvD,CAAC,CAAC;QACF,MAAMC,IAAI,GAAGzB,cAAc,CAAC;UAAEqB,aAAa;UAAEL;QAAK,CAAC,CAAC;QACpD,OAAOM,OAAO,GAAG3B,IAAI,CAAA+B,EAAA,KAAAA,EAAA,GAAAC,CAAC,eAAY,CAAe,KAAE,CAAO,QAAM,GAA5BJ,YAAY,EAAKE,IAAI,IAAWA,IAAI;MAC1E;IAAC;MAAAf,IAAA;MAAAkB,MAAA;MAAAf,GAAA;MAAAC,MAAA;QAAA,OAEeb,MAAM;MAAA;IAAA;EAAA;AAAA,GApCAP,UAAU;AAuClC,SAASK,YAAY;AAErB,eAAeG,SAAS"}
+{"version":3,"file":"loading.js","names":["classMap","LitElement","html","property","customElement","prefix","LOADING_TYPE","getLoadingIcon","styles","CDSLoading","_decorate","_initialize","_LitElement","constructor","args","F","d","kind","decorators","attribute","key","value","REGULAR","type","Boolean","reflect","render","inactive","assistiveText","overlay","innerClasses","SMALL","icon","_t","_","static"],"sources":["components/loading/loading.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { LOADING_TYPE } from './defs';\nimport getLoadingIcon from './loading-icon';\nimport styles from './loading.scss';\n\n/**\n * Spinner indicating loading state.\n *\n * @element cds-loading\n */\n@customElement(`${prefix}-loading`)\nclass CDSLoading extends LitElement {\n  /**\n   * The assistive text for the spinner icon.\n   */\n  @property({ attribute: 'assistive-text' })\n  assistiveText = 'Loading';\n\n  /**\n   * Spinner type.\n   */\n  @property()\n  type = LOADING_TYPE.REGULAR;\n\n  /**\n   * `true` if overlay should be applied.\n   */\n  @property({ type: Boolean, reflect: true })\n  overlay = false;\n\n  /**\n   * `true` if spinner should stop.\n   */\n  @property({ type: Boolean, reflect: true })\n  inactive = false;\n\n  render() {\n    const { inactive, assistiveText, type, overlay } = this;\n    const innerClasses = classMap({\n      [`${prefix}--loading`]: true,\n      [`${prefix}--loading--stop`]: inactive,\n      [`${prefix}--loading--small`]: type === LOADING_TYPE.SMALL,\n    });\n    const icon = getLoadingIcon({ assistiveText, type });\n    return overlay ? html`<div class=\"${innerClasses}\">${icon}</div>` : icon;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport { LOADING_TYPE };\n\nexport default CDSLoading;\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,QAAQ,QAAQ,6BAA6B;AACtD,SAASC,UAAU,EAAEC,IAAI,QAAQ,KAAK;AACtC,SAASC,QAAQ,EAAEC,aAAa,QAAQ,mBAAmB;AAC3D,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,SAASC,YAAY,QAAQ,QAAQ;AACrC,OAAOC,cAAc,MAAM,gBAAgB;AAC3C,OAAOC,MAAM,MAAM,oBAAgB;;AAEnC;AACA;AACA;AACA;AACA,GAJA;AACA;AACA;AACA;AACA;AAJA,IAMMC,UAAU,GAAAC,SAAA,EADfN,aAAa,CAAE,GAAEC,MAAO,UAAS,CAAC,aAAAM,WAAA,EAAAC,WAAA;EAAnC,MACMH,UAAU,SAAAG,WAAA,CAAoB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EAqCpC;EAAC;IAAAI,CAAA,EArCKN,UAAU;IAAAO,CAAA;MAAAC,IAAA;MAAAC,UAAA,GAIbf,QAAQ,CAAC;QAAEgB,SAAS,EAAE;MAAiB,CAAC,CAAC;MAAAC,GAAA;MAAAC,MAAA;QAAA,OAC1B,SAAS;MAAA;IAAA;MAAAJ,IAAA;MAAAC,UAAA,GAKxBf,QAAQ,EAAE;MAAAiB,GAAA;MAAAC,MAAA;QAAA,OACJf,YAAY,CAACgB,OAAO;MAAA;IAAA;MAAAL,IAAA;MAAAC,UAAA,GAK1Bf,QAAQ,CAAC;QAAEoB,IAAI,EAAEC,OAAO;QAAEC,OAAO,EAAE;MAAK,CAAC,CAAC;MAAAL,GAAA;MAAAC,MAAA;QAAA,OACjC,KAAK;MAAA;IAAA;MAAAJ,IAAA;MAAAC,UAAA,GAKdf,QAAQ,CAAC;QAAEoB,IAAI,EAAEC,OAAO;QAAEC,OAAO,EAAE;MAAK,CAAC,CAAC;MAAAL,GAAA;MAAAC,MAAA;QAAA,OAChC,KAAK;MAAA;IAAA;MAAAJ,IAAA;MAAAG,GAAA;MAAAC,KAAA;MAtBhB;AACF;AACA;;MAIE;AACF;AACA;;MAIE;AACF;AACA;;MAIE;AACF;AACA;;MAIE,SAAAK,OAAA,EAAS;QACP,MAAM;UAAEC,QAAQ;UAAEC,aAAa;UAAEL,IAAI;UAAEM;QAAQ,CAAC,GAAG,IAAI;QACvD,MAAMC,YAAY,GAAG9B,QAAQ,CAAC;UAC5B,CAAE,GAAEK,MAAO,WAAU,GAAG,IAAI;UAC5B,CAAE,GAAEA,MAAO,iBAAgB,GAAGsB,QAAQ;UACtC,CAAE,GAAEtB,MAAO,kBAAiB,GAAGkB,IAAI,KAAKjB,YAAY,CAACyB;QACvD,CAAC,CAAC;QACF,MAAMC,IAAI,GAAGzB,cAAc,CAAC;UAAEqB,aAAa;UAAEL;QAAK,CAAC,CAAC;QACpD,OAAOM,OAAO,GAAG3B,IAAI,CAAA+B,EAAA,KAAAA,EAAA,GAAAC,CAAC,eAAY,CAAe,KAAE,CAAO,QAAM,GAA5BJ,YAAY,EAAKE,IAAI,IAAWA,IAAI;MAC1E;IAAC;MAAAf,IAAA;MAAAkB,MAAA;MAAAf,GAAA;MAAAC,MAAA;QAAA,OAEeb,MAAM;MAAA;IAAA;EAAA;AAAA,GApCCP,UAAU;AAuCnC,SAASK,YAAY;AAErB,eAAeG,UAAU"}

package/es/components/loading/loading.rtl.css.js

@@ -8,5 +8,5 @@
  */
 import { css } from 'lit';
 export default css([
-  '.cds--loading,:host(cds-loading){box-sizing:border-box;padding:0;border:0;margin:0;font-family:inherit;font-size:100%;vertical-align:baseline;animation-duration:690ms;animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:rotate;animation-timing-function:linear;width:5.5rem;height:5.5rem}.cds--loading *,.cds--loading ::after,.cds--loading ::before,:host(cds-loading) *,:host(cds-loading) ::after,:host(cds-loading) ::before{box-sizing:inherit}.cds--loading svg circle,:host(cds-loading) svg circle{animation-duration:10ms;animation-name:init-stroke;animation-timing-function:cubic-bezier(.5,0,.1,1)}@media screen and (prefers-reduced-motion:reduce){.cds--loading svg circle,:host(cds-loading) svg circle{animation:none}}.cds--loading__svg{fill:transparent}.cds--loading__svg circle{stroke-dasharray:276.4608 276.4608;stroke-linecap:butt;stroke-width:10}.cds--loading__stroke{stroke:var(--cds-interactive,#0f62fe);stroke-dashoffset:52.527552}.cds--loading--small .cds--loading__stroke,:host(cds-loading[type=small]) .cds--loading__stroke{stroke-dashoffset:143.759616}.cds--loading--stop,:host(cds-loading[inactive]){animation:rotate-end-p1 .7s cubic-bezier(0,0,.25,1) forwards,rotate-end-p2 .7s cubic-bezier(0,0,.25,1) .7s forwards}.cds--loading--stop svg circle,:host(cds-loading[inactive]) svg circle{animation-delay:.7s;animation-duration:.7s;animation-fill-mode:forwards;animation-name:stroke-end;animation-timing-function:cubic-bezier(0,0,.25,1)}@media screen and (prefers-reduced-motion:reduce){.cds--loading--stop svg circle,:host(cds-loading[inactive]) svg circle{animation:none}}.cds--loading--small,:host(cds-loading[type=small]){width:1rem;height:1rem}.cds--loading--small circle,:host(cds-loading[type=small]) circle{stroke-width:16}.cds--loading--small .cds--loading__svg,:host(cds-loading[type=small]) .cds--loading__svg{stroke:var(--cds-interactive,#0f62fe)}.cds--loading__background{stroke:var(--cds-layer-accent);stroke-dashoffset:-22}@media not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent){circle.cds--loading__background{stroke-dasharray:265;stroke-dashoffset:0}}}.cds--loading-overlay,:host(cds-loading[overlay]){position:fixed;z-index:6000;top:0;right:0;display:flex;width:100%;height:100%;align-items:center;justify-content:center;background-color:var(--cds-overlay,rgba(22,22,22,.5));transition:background-color .7s cubic-bezier(.4,.14,.3,1)}.cds--loading-overlay--stop{display:none}@keyframes rotate{0%{transform:rotate(0)}100%{transform:rotate(-360deg)}}@keyframes rotate-end-p1{100%{transform:rotate(-360deg)}}@keyframes rotate-end-p2{100%{transform:rotate(360deg)}}@keyframes init-stroke{0%{stroke-dashoffset:276.4608}100%{stroke-dashoffset:52.527552}}@keyframes stroke-end{0%{stroke-dashoffset:52.527552}100%{stroke-dashoffset:276.4608}}:host(cds-loading[overlay]){animation:none}.cds--loading__background[hidden]{display:none}',
+  '.cds--loading,:host(cds-loading){box-sizing:border-box;padding:0;border:0;margin:0;font-family:inherit;font-size:100%;vertical-align:baseline;animation-duration:690ms;animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:rotate;animation-timing-function:linear;width:5.5rem;height:5.5rem}.cds--loading *,.cds--loading ::after,.cds--loading ::before,:host(cds-loading) *,:host(cds-loading) ::after,:host(cds-loading) ::before{box-sizing:inherit}.cds--loading svg circle,:host(cds-loading) svg circle{animation-duration:10ms;animation-name:init-stroke;animation-timing-function:cubic-bezier(.5,0,.1,1)}@media screen and (prefers-reduced-motion:reduce){.cds--loading svg circle,:host(cds-loading) svg circle{animation:none}}.cds--loading__svg{fill:transparent}.cds--loading__svg circle{stroke-dasharray:276.4608 276.4608;stroke-linecap:butt;stroke-width:10}.cds--loading__stroke{stroke:var(--cds-interactive,#0f62fe);stroke-dashoffset:52.527552}.cds--loading--small .cds--loading__stroke,:host(cds-loading[type=small]) .cds--loading__stroke{stroke-dashoffset:143.759616}.cds--loading--stop,:host(cds-loading[inactive]){animation:rotate-end-p1 .7s cubic-bezier(0,0,.25,1) forwards,rotate-end-p2 .7s cubic-bezier(0,0,.25,1) .7s forwards}.cds--loading--stop svg circle,:host(cds-loading[inactive]) svg circle{animation-delay:.7s;animation-duration:.7s;animation-fill-mode:forwards;animation-name:stroke-end;animation-timing-function:cubic-bezier(0,0,.25,1)}@media screen and (prefers-reduced-motion:reduce){.cds--loading--stop svg circle,:host(cds-loading[inactive]) svg circle{animation:none}}.cds--loading--small,:host(cds-loading[type=small]){width:1rem;height:1rem}.cds--loading--small circle,:host(cds-loading[type=small]) circle{stroke-width:16}.cds--loading--small .cds--loading__svg,:host(cds-loading[type=small]) .cds--loading__svg{stroke:var(--cds-interactive,#0f62fe)}.cds--loading__background{stroke:var(--cds-layer-accent);stroke-dashoffset:-22}@media not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent){circle.cds--loading__background{stroke-dasharray:265;stroke-dashoffset:0}}}.cds--loading-overlay,:host(cds-loading[overlay]){position:fixed;z-index:6000;top:0;right:0;display:flex;width:100%;height:100%;align-items:center;justify-content:center;background-color:var(--cds-overlay,rgba(22,22,22,.5));transition:background-color .7s cubic-bezier(.4,.14,.3,1)}.cds--loading-overlay--stop{display:none}@keyframes rotate{0%{transform:rotate(0)}100%{transform:rotate(-360deg)}}@keyframes rotate-end-p1{100%{transform:rotate(-360deg)}}@keyframes rotate-end-p2{100%{transform:rotate(360deg)}}@keyframes init-stroke{0%{stroke-dashoffset:276.4608}100%{stroke-dashoffset:52.527552}}@keyframes stroke-end{0%{stroke-dashoffset:52.527552}100%{stroke-dashoffset:276.4608}}:host(cds-loading){display:block}:host(cds-loading[overlay]){animation:none}.cds--loading__background[hidden]{display:none}',
 ]);

package/es/components/modal/modal-footer-button.d.ts

@@ -6,15 +6,15 @@
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-import BXButton from '../button/button';
+import CDSButton from '../button/button';
 /**
  * Modal footer button.
  *
  * @element cds-modal-footer-button
  */
-declare class BXModalFooterButton extends BXButton {
+declare class CDSModalFooterButton extends CDSButton {
     static styles: any[];
 }
-export default BXModalFooterButton;
+export default CDSModalFooterButton;
 
 //# sourceMappingURL=modal-footer-button.d.ts.map

package/es/components/modal/modal-footer-button.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["components/modal/modal-footer-button.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH,OAAO,QAAQ,MAAM,kBAAkB,CAAC;AAIxC;;;;GAIG;AACH,cACM,mBAAoB,SAAQ,QAAQ;IACxC,MAAM,CAAC,MAAM,QAA0B;CACxC;AAED,eAAe,mBAAmB,CAAC","file":"modal-footer-button.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2021, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport BXButton from '../button/button';\nimport buttonStyles from '../button/button.scss';\nimport styles from './modal.scss';\n\n/**\n * Modal footer button.\n *\n * @element cds-modal-footer-button\n */\n@customElement(`${prefix}-modal-footer-button`)\nclass BXModalFooterButton extends BXButton {\n  static styles = [buttonStyles, styles]; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXModalFooterButton;\n"]}
+{"version":3,"sources":["components/modal/modal-footer-button.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAIH,OAAO,SAAS,MAAM,kBAAkB,CAAC;AAIzC;;;;GAIG;AACH,cACM,oBAAqB,SAAQ,SAAS;IAC1C,MAAM,CAAC,MAAM,QAA0B;CACxC;AAED,eAAe,oBAAoB,CAAC","file":"modal-footer-button.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2021, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport CDSButton from '../button/button';\nimport buttonStyles from '../button/button.scss';\nimport styles from './modal.scss';\n\n/**\n * Modal footer button.\n *\n * @element cds-modal-footer-button\n */\n@customElement(`${prefix}-modal-footer-button`)\nclass CDSModalFooterButton extends CDSButton {\n  static styles = [buttonStyles, styles]; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default CDSModalFooterButton;\n"]}

package/es/components/modal/modal-footer-button.js

@@ -10,7 +10,7 @@ import _decorate from "@babel/runtime/helpers/esm/decorate";
 
 import { customElement } from 'lit/decorators.js';
 import { prefix } from '../../globals/settings';
-import BXButton from '../button/button';
+import CDSButton from '../button/button';
 import buttonStyles from "./../button/button.css.js";
 import styles from "././modal.css.js";
 
@@ -23,15 +23,15 @@ import styles from "././modal.css.js";
      *
      * @element cds-modal-footer-button
      */
-let BXModalFooterButton = _decorate([customElement(`${prefix}-modal-footer-button`)], function (_initialize, _BXButton) {
-  class BXModalFooterButton extends _BXButton {
+let CDSModalFooterButton = _decorate([customElement(`${prefix}-modal-footer-button`)], function (_initialize, _CDSButton) {
+  class CDSModalFooterButton extends _CDSButton {
     constructor(...args) {
       super(...args);
       _initialize(this);
     }
   }
   return {
-    F: BXModalFooterButton,
+    F: CDSModalFooterButton,
     d: [{
       kind: "field",
       static: true,
@@ -41,6 +41,6 @@ let BXModalFooterButton = _decorate([customElement(`${prefix}-modal-footer-butto
       }
     }]
   };
-}, BXButton);
-export default BXModalFooterButton;
+}, CDSButton);
+export default CDSModalFooterButton;
 //# sourceMappingURL=modal-footer-button.js.map

package/es/components/modal/modal-footer-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal-footer-button.js","names":["customElement","prefix","BXButton","buttonStyles","styles","BXModalFooterButton","_decorate","_initialize","_BXButton","constructor","args","F","d","kind","static","key","value"],"sources":["components/modal/modal-footer-button.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2021, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport BXButton from '../button/button';\nimport buttonStyles from '../button/button.scss';\nimport styles from './modal.scss';\n\n/**\n * Modal footer button.\n *\n * @element cds-modal-footer-button\n */\n@customElement(`${prefix}-modal-footer-button`)\nclass BXModalFooterButton extends BXButton {\n  static styles = [buttonStyles, styles]; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXModalFooterButton;\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,aAAa,QAAQ,mBAAmB;AACjD,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,OAAOC,QAAQ,MAAM,kBAAkB;AACvC,OAAOC,YAAY,MAAM,2BAAuB;AAChD,OAAOC,MAAM,MAAM,kBAAc;;AAEjC;AACA;AACA;AACA;AACA,GAJA;AACA;AACA;AACA;AACA;AAJA,IAMMC,mBAAmB,GAAAC,SAAA,EADxBN,aAAa,CAAE,GAAEC,MAAO,sBAAqB,CAAC,aAAAM,WAAA,EAAAC,SAAA;EAA/C,MACMH,mBAAmB,SAAAG,SAAA,CAAkB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EAE3C;EAAC;IAAAI,CAAA,EAFKN,mBAAmB;IAAAO,CAAA;MAAAC,IAAA;MAAAC,MAAA;MAAAC,GAAA;MAAAC,MAAA;QAAA,OACP,CAACb,YAAY,EAAEC,MAAM,CAAC;MAAA;IAAA;EAAA;AAAA,GADNF,QAAQ;AAI1C,eAAeG,mBAAmB"}
+{"version":3,"file":"modal-footer-button.js","names":["customElement","prefix","CDSButton","buttonStyles","styles","CDSModalFooterButton","_decorate","_initialize","_CDSButton","constructor","args","F","d","kind","static","key","value"],"sources":["components/modal/modal-footer-button.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2021, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport CDSButton from '../button/button';\nimport buttonStyles from '../button/button.scss';\nimport styles from './modal.scss';\n\n/**\n * Modal footer button.\n *\n * @element cds-modal-footer-button\n */\n@customElement(`${prefix}-modal-footer-button`)\nclass CDSModalFooterButton extends CDSButton {\n  static styles = [buttonStyles, styles]; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default CDSModalFooterButton;\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,aAAa,QAAQ,mBAAmB;AACjD,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,OAAOC,SAAS,MAAM,kBAAkB;AACxC,OAAOC,YAAY,MAAM,2BAAuB;AAChD,OAAOC,MAAM,MAAM,kBAAc;;AAEjC;AACA;AACA;AACA;AACA,GAJA;AACA;AACA;AACA;AACA;AAJA,IAMMC,oBAAoB,GAAAC,SAAA,EADzBN,aAAa,CAAE,GAAEC,MAAO,sBAAqB,CAAC,aAAAM,WAAA,EAAAC,UAAA;EAA/C,MACMH,oBAAoB,SAAAG,UAAA,CAAmB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EAE7C;EAAC;IAAAI,CAAA,EAFKN,oBAAoB;IAAAO,CAAA;MAAAC,IAAA;MAAAC,MAAA;MAAAC,GAAA;MAAAC,MAAA;QAAA,OACR,CAACb,YAAY,EAAEC,MAAM,CAAC;MAAA;IAAA;EAAA;AAAA,GADLF,SAAS;AAI5C,eAAeG,oBAAoB"}

package/es/components/modal/modal-footer.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["components/modal/modal-footer.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC;;;;GAIG;AACH,cACM,aAAc,SAAQ,UAAU;IACpC;;OAEG;IACH,OAAO,CAAC,sBAAsB,CAAS;IAEvC;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAazB,MAAM;IAgBN;;OAEG;IACH,MAAM,KAAK,eAAe,WAEzB;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,aAAa,CAAC","file":"modal-footer.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './modal.scss';\n\n/**\n * Modal footer.\n *\n * @element cds-modal-footer\n */\n@customElement(`${prefix}-modal-footer`)\nclass BXModalFooter extends LitElement {\n  /**\n   * `true` if this modal footer has more than two buttons.\n   */\n  private _hasMoreThanTwoButtons = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  private _handleSlotChange(event: Event) {\n    const { selectorButtons } = this.constructor as typeof BXModalFooter;\n    this._hasMoreThanTwoButtons =\n      (event.target as HTMLSlotElement)\n        .assignedNodes()\n        .filter(\n          (node) =>\n            node.nodeType === Node.ELEMENT_NODE &&\n            (node as Element).matches(selectorButtons)\n        ).length > 2;\n    this.requestUpdate();\n  }\n\n  render() {\n    const {\n      _hasMoreThanTwoButtons: hasMoreThanTwoButtons,\n      _handleSlotChange: handleSlotChange,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--modal-footer`]: true,\n      [`${prefix}--modal-footer--three-button`]: hasMoreThanTwoButtons,\n    });\n    return html`\n      <div class=\"${classes}\">\n        <slot @slotchange=\"${handleSlotChange}\"></slot>\n      </div>\n    `;\n  }\n\n  /**\n   * A selector that selects the child buttons.\n   */\n  static get selectorButtons() {\n    return `${prefix}-btn,${prefix}-modal-footer-button`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXModalFooter;\n"]}
+{"version":3,"sources":["components/modal/modal-footer.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC;;;;GAIG;AACH,cACM,aAAc,SAAQ,UAAU;IACpC;;OAEG;IACH,OAAO,CAAC,sBAAsB,CAAS;IAEvC;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAazB,MAAM;IAgBN;;OAEG;IACH,MAAM,KAAK,eAAe,WAEzB;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,aAAa,CAAC","file":"modal-footer.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './modal.scss';\n\n/**\n * Modal footer.\n *\n * @element cds-modal-footer\n */\n@customElement(`${prefix}-modal-footer`)\nclass BXModalFooter extends LitElement {\n  /**\n   * `true` if this modal footer has more than two buttons.\n   */\n  private _hasMoreThanTwoButtons = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  private _handleSlotChange(event: Event) {\n    const { selectorButtons } = this.constructor as typeof BXModalFooter;\n    this._hasMoreThanTwoButtons =\n      (event.target as HTMLSlotElement)\n        .assignedNodes()\n        .filter(\n          (node) =>\n            node.nodeType === Node.ELEMENT_NODE &&\n            (node as Element).matches(selectorButtons)\n        ).length > 2;\n    this.requestUpdate();\n  }\n\n  render() {\n    const {\n      _hasMoreThanTwoButtons: hasMoreThanTwoButtons,\n      _handleSlotChange: handleSlotChange,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--modal-footer`]: true,\n      [`${prefix}--modal-footer--three-button`]: hasMoreThanTwoButtons,\n    });\n    return html`\n      <div class=\"${classes}\">\n        <slot @slotchange=\"${handleSlotChange}\"></slot>\n      </div>\n    `;\n  }\n\n  /**\n   * A selector that selects the child buttons.\n   */\n  static get selectorButtons() {\n    return `${prefix}-button,${prefix}-modal-footer-button`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXModalFooter;\n"]}

package/es/components/modal/modal-footer.js

@@ -85,7 +85,7 @@ let BXModalFooter = _decorate([customElement(`${prefix}-modal-footer`)], functio
       static: true,
       key: "selectorButtons",
       value: function selectorButtons() {
-        return `${prefix}-btn,${prefix}-modal-footer-button`;
+        return `${prefix}-button,${prefix}-modal-footer-button`;
       }
     }, {
       kind: "field",

package/es/components/modal/modal-footer.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal-footer.js","names":["classMap","LitElement","html","customElement","prefix","styles","BXModalFooter","_decorate","_initialize","_LitElement","constructor","args","F","d","kind","key","value","_handleSlotChange","event","selectorButtons","_hasMoreThanTwoButtons","target","assignedNodes","filter","node","nodeType","Node","ELEMENT_NODE","matches","length","requestUpdate","render","hasMoreThanTwoButtons","handleSlotChange","classes","_t","_","static"],"sources":["components/modal/modal-footer.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './modal.scss';\n\n/**\n * Modal footer.\n *\n * @element cds-modal-footer\n */\n@customElement(`${prefix}-modal-footer`)\nclass BXModalFooter extends LitElement {\n  /**\n   * `true` if this modal footer has more than two buttons.\n   */\n  private _hasMoreThanTwoButtons = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  private _handleSlotChange(event: Event) {\n    const { selectorButtons } = this.constructor as typeof BXModalFooter;\n    this._hasMoreThanTwoButtons =\n      (event.target as HTMLSlotElement)\n        .assignedNodes()\n        .filter(\n          (node) =>\n            node.nodeType === Node.ELEMENT_NODE &&\n            (node as Element).matches(selectorButtons)\n        ).length > 2;\n    this.requestUpdate();\n  }\n\n  render() {\n    const {\n      _hasMoreThanTwoButtons: hasMoreThanTwoButtons,\n      _handleSlotChange: handleSlotChange,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--modal-footer`]: true,\n      [`${prefix}--modal-footer--three-button`]: hasMoreThanTwoButtons,\n    });\n    return html`\n      <div class=\"${classes}\">\n        <slot @slotchange=\"${handleSlotChange}\"></slot>\n      </div>\n    `;\n  }\n\n  /**\n   * A selector that selects the child buttons.\n   */\n  static get selectorButtons() {\n    return `${prefix}-btn,${prefix}-modal-footer-button`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXModalFooter;\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,QAAQ,QAAQ,6BAA6B;AACtD,SAASC,UAAU,EAAEC,IAAI,QAAQ,KAAK;AACtC,SAASC,aAAa,QAAQ,mBAAmB;AACjD,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,OAAOC,MAAM,MAAM,kBAAc;;AAEjC;AACA;AACA;AACA;AACA,GAJA;AACA;AACA;AACA;AACA;AAJA,IAMMC,aAAa,GAAAC,SAAA,EADlBJ,aAAa,CAAE,GAAEC,MAAO,eAAc,CAAC,aAAAI,WAAA,EAAAC,WAAA;EAAxC,MACMH,aAAa,SAAAG,WAAA,CAAoB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EA8CvC;EAAC;IAAAI,CAAA,EA9CKN,aAAa;IAAAO,CAAA;MAAAC,IAAA;MAAAC,GAAA;MAAAC,MAAA;QAAA,OAIgB,KAAK;MAAA;IAAA;MAAAF,IAAA;MAAAC,GAAA;MAAAC,KAAA;MAHtC;AACF;AACA;;MAGE;AACF;AACA;MACE,SAAAC,kBAA0BC,KAAY,EAAE;QACtC,MAAM;UAAEC;QAAgB,CAAC,GAAG,IAAI,CAACT,WAAmC;QACpE,IAAI,CAACU,sBAAsB,GACxBF,KAAK,CAACG,MAAM,CACVC,aAAa,EAAE,CACfC,MAAM,CACJC,IAAI,IACHA,IAAI,CAACC,QAAQ,KAAKC,IAAI,CAACC,YAAY,IAClCH,IAAI,CAAaI,OAAO,CAACT,eAAe,CAAC,CAC7C,CAACU,MAAM,GAAG,CAAC;QAChB,IAAI,CAACC,aAAa,EAAE;MACtB;IAAC;MAAAhB,IAAA;MAAAC,GAAA;MAAAC,KAAA,EAED,SAAAe,OAAA,EAAS;QACP,MAAM;UACJX,sBAAsB,EAAEY,qBAAqB;UAC7Cf,iBAAiB,EAAEgB;QACrB,CAAC,GAAG,IAAI;QACR,MAAMC,OAAO,GAAGlC,QAAQ,CAAC;UACvB,CAAE,GAAEI,MAAO,gBAAe,GAAG,IAAI;UACjC,CAAE,GAAEA,MAAO,8BAA6B,GAAG4B;QAC7C,CAAC,CAAC;QACF,OAAO9B,IAAI,CAAAiC,EAAA,KAAAA,EAAA,GAAAC,CAAC;AAChB,oBAAkB,CAAU;AAC5B,6BAA2B,CAAmB;AAC9C;AACA,KAAI,GAHgBF,OAAO,EACED,gBAAgB;MAG3C;;MAEA;AACF;AACA;IAFE;MAAAnB,IAAA;MAAAuB,MAAA;MAAAtB,GAAA;MAAAC,KAAA,EAGA,SAAAG,gBAAA,EAA6B;QAC3B,OAAQ,GAAEf,MAAO,QAAOA,MAAO,sBAAqB;MACtD;IAAC;MAAAU,IAAA;MAAAuB,MAAA;MAAAtB,GAAA;MAAAC,MAAA;QAAA,OAEeX,MAAM;MAAA;IAAA;EAAA;AAAA,GA7CIJ,UAAU;AAgDtC,eAAeK,aAAa"}
+{"version":3,"file":"modal-footer.js","names":["classMap","LitElement","html","customElement","prefix","styles","BXModalFooter","_decorate","_initialize","_LitElement","constructor","args","F","d","kind","key","value","_handleSlotChange","event","selectorButtons","_hasMoreThanTwoButtons","target","assignedNodes","filter","node","nodeType","Node","ELEMENT_NODE","matches","length","requestUpdate","render","hasMoreThanTwoButtons","handleSlotChange","classes","_t","_","static"],"sources":["components/modal/modal-footer.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './modal.scss';\n\n/**\n * Modal footer.\n *\n * @element cds-modal-footer\n */\n@customElement(`${prefix}-modal-footer`)\nclass BXModalFooter extends LitElement {\n  /**\n   * `true` if this modal footer has more than two buttons.\n   */\n  private _hasMoreThanTwoButtons = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  private _handleSlotChange(event: Event) {\n    const { selectorButtons } = this.constructor as typeof BXModalFooter;\n    this._hasMoreThanTwoButtons =\n      (event.target as HTMLSlotElement)\n        .assignedNodes()\n        .filter(\n          (node) =>\n            node.nodeType === Node.ELEMENT_NODE &&\n            (node as Element).matches(selectorButtons)\n        ).length > 2;\n    this.requestUpdate();\n  }\n\n  render() {\n    const {\n      _hasMoreThanTwoButtons: hasMoreThanTwoButtons,\n      _handleSlotChange: handleSlotChange,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--modal-footer`]: true,\n      [`${prefix}--modal-footer--three-button`]: hasMoreThanTwoButtons,\n    });\n    return html`\n      <div class=\"${classes}\">\n        <slot @slotchange=\"${handleSlotChange}\"></slot>\n      </div>\n    `;\n  }\n\n  /**\n   * A selector that selects the child buttons.\n   */\n  static get selectorButtons() {\n    return `${prefix}-button,${prefix}-modal-footer-button`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXModalFooter;\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,QAAQ,QAAQ,6BAA6B;AACtD,SAASC,UAAU,EAAEC,IAAI,QAAQ,KAAK;AACtC,SAASC,aAAa,QAAQ,mBAAmB;AACjD,SAASC,MAAM,QAAQ,wBAAwB;AAC/C,OAAOC,MAAM,MAAM,kBAAc;;AAEjC;AACA;AACA;AACA;AACA,GAJA;AACA;AACA;AACA;AACA;AAJA,IAMMC,aAAa,GAAAC,SAAA,EADlBJ,aAAa,CAAE,GAAEC,MAAO,eAAc,CAAC,aAAAI,WAAA,EAAAC,WAAA;EAAxC,MACMH,aAAa,SAAAG,WAAA,CAAoB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EA8CvC;EAAC;IAAAI,CAAA,EA9CKN,aAAa;IAAAO,CAAA;MAAAC,IAAA;MAAAC,GAAA;MAAAC,MAAA;QAAA,OAIgB,KAAK;MAAA;IAAA;MAAAF,IAAA;MAAAC,GAAA;MAAAC,KAAA;MAHtC;AACF;AACA;;MAGE;AACF;AACA;MACE,SAAAC,kBAA0BC,KAAY,EAAE;QACtC,MAAM;UAAEC;QAAgB,CAAC,GAAG,IAAI,CAACT,WAAmC;QACpE,IAAI,CAACU,sBAAsB,GACxBF,KAAK,CAACG,MAAM,CACVC,aAAa,EAAE,CACfC,MAAM,CACJC,IAAI,IACHA,IAAI,CAACC,QAAQ,KAAKC,IAAI,CAACC,YAAY,IAClCH,IAAI,CAAaI,OAAO,CAACT,eAAe,CAAC,CAC7C,CAACU,MAAM,GAAG,CAAC;QAChB,IAAI,CAACC,aAAa,EAAE;MACtB;IAAC;MAAAhB,IAAA;MAAAC,GAAA;MAAAC,KAAA,EAED,SAAAe,OAAA,EAAS;QACP,MAAM;UACJX,sBAAsB,EAAEY,qBAAqB;UAC7Cf,iBAAiB,EAAEgB;QACrB,CAAC,GAAG,IAAI;QACR,MAAMC,OAAO,GAAGlC,QAAQ,CAAC;UACvB,CAAE,GAAEI,MAAO,gBAAe,GAAG,IAAI;UACjC,CAAE,GAAEA,MAAO,8BAA6B,GAAG4B;QAC7C,CAAC,CAAC;QACF,OAAO9B,IAAI,CAAAiC,EAAA,KAAAA,EAAA,GAAAC,CAAC;AAChB,oBAAkB,CAAU;AAC5B,6BAA2B,CAAmB;AAC9C;AACA,KAAI,GAHgBF,OAAO,EACED,gBAAgB;MAG3C;;MAEA;AACF;AACA;IAFE;MAAAnB,IAAA;MAAAuB,MAAA;MAAAtB,GAAA;MAAAC,KAAA,EAGA,SAAAG,gBAAA,EAA6B;QAC3B,OAAQ,GAAEf,MAAO,WAAUA,MAAO,sBAAqB;MACzD;IAAC;MAAAU,IAAA;MAAAuB,MAAA;MAAAtB,GAAA;MAAAC,MAAA;QAAA,OAEeX,MAAM;MAAA;IAAA;EAAA;AAAA,GA7CIJ,UAAU;AAgDtC,eAAeK,aAAa"}

package/es/components/modal/modal.css.js

@@ -8,5 +8,5 @@
  */
 import { css } from 'lit';
 export default css([
-  '@keyframes hide-feedback{0%{opacity:1;visibility:inherit}100%{opacity:0;visibility:hidden}}@keyframes show-feedback{0%{opacity:0;visibility:hidden}100%{opacity:1;visibility:inherit}}@keyframes skeleton{0%{opacity:.3;transform:scaleX(0);transform-origin:left}20%{opacity:1;transform:scaleX(1);transform-origin:left}28%{transform:scaleX(1);transform-origin:right}51%{transform:scaleX(0);transform-origin:right}58%{transform:scaleX(0);transform-origin:right}82%{transform:scaleX(1);transform-origin:right}83%{transform:scaleX(1);transform-origin:left}96%{transform:scaleX(0);transform-origin:left}100%{opacity:.3;transform:scaleX(0);transform-origin:left}}.cds--assistive-text,.cds--visually-hidden{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip:rect(0,0,0,0);visibility:inherit;white-space:nowrap}.cds--btn{box-sizing:border-box;padding:0;border:0;margin:0;font-family:inherit;font-size:100%;vertical-align:baseline;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);line-height:var(--cds-body-compact-01-line-height,1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);position:relative;display:inline-flex;width:-moz-max-content;width:max-content;max-width:20rem;min-height:3rem;flex-shrink:0;align-items:center;justify-content:space-between;padding:calc(.875rem - 3px) 63px calc(.875rem - 3px) 15px;margin:0;border-radius:0;cursor:pointer;outline:0;text-align:left;text-decoration:none;transition:background 70ms cubic-bezier(0,0,.38,.9),box-shadow 70ms cubic-bezier(0,0,.38,.9),border-color 70ms cubic-bezier(0,0,.38,.9),outline 70ms cubic-bezier(0,0,.38,.9);vertical-align:top}.cds--btn *,.cds--btn ::after,.cds--btn ::before{box-sizing:inherit}.cds--btn.cds--btn--disabled,.cds--btn.cds--btn--disabled:focus,.cds--btn.cds--btn--disabled:hover,.cds--btn:disabled,.cds--btn:focus:disabled,.cds--btn:hover:disabled{border-color:var(--cds-button-disabled,#c6c6c6);background:var(--cds-button-disabled,#c6c6c6);box-shadow:none;color:var(--cds-text-on-color-disabled,#8d8d8d);cursor:not-allowed}.cds--btn .cds--btn__icon{position:absolute;right:1rem;width:1rem;height:1rem;flex-shrink:0}.cds--btn::-moz-focus-inner{padding:0;border:0}.cds--btn--primary{border-width:1px;border-style:solid;border-color:transparent;background-color:var(--cds-button-primary,#0f62fe);color:var(--cds-text-on-color,#fff)}.cds--btn--primary:hover{background-color:var(--cds-button-primary-hover,#0050e6)}.cds--btn--primary:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--primary:active{background-color:var(--cds-button-primary-active,#002d9c)}.cds--btn--primary .cds--btn__icon,.cds--btn--primary .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--primary:hover{color:var(--cds-text-on-color,#fff)}.cds--btn--secondary{border-width:1px;border-style:solid;border-color:transparent;background-color:var(--cds-button-secondary,#393939);color:var(--cds-text-on-color,#fff)}.cds--btn--secondary:hover{background-color:var(--cds-button-secondary-hover,#474747)}.cds--btn--secondary:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--secondary:active{background-color:var(--cds-button-secondary-active,#6f6f6f)}.cds--btn--secondary .cds--btn__icon,.cds--btn--secondary .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--secondary:focus,.cds--btn--secondary:hover{color:var(--cds-text-on-color,#fff)}.cds--btn--tertiary{border-width:1px;border-style:solid;border-color:var(--cds-button-tertiary,#0f62fe);background-color:transparent;color:var(--cds-button-tertiary,#0f62fe)}.cds--btn--tertiary:hover{background-color:var(--cds-button-tertiary-hover,#0050e6)}.cds--btn--tertiary:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--tertiary:active{background-color:var(--cds-button-tertiary-active,#002d9c)}.cds--btn--tertiary .cds--btn__icon,.cds--btn--tertiary .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--tertiary:hover{color:var(--cds-text-inverse,#fff)}.cds--btn--tertiary:focus{background-color:var(--cds-button-tertiary,#0f62fe);color:var(--cds-text-inverse,#fff)}.cds--btn--tertiary:active{border-color:transparent;background-color:var(--cds-button-tertiary-active,#002d9c);color:var(--cds-text-inverse,#fff)}.cds--btn--tertiary.cds--btn--disabled,.cds--btn--tertiary.cds--btn--disabled:focus,.cds--btn--tertiary.cds--btn--disabled:hover,.cds--btn--tertiary:disabled,.cds--btn--tertiary:focus:disabled,.cds--btn--tertiary:hover:disabled{background:0 0;color:var(--cds-text-on-color-disabled,#8d8d8d);outline:0}.cds--btn--ghost{border-width:1px;border-style:solid;border-color:transparent;background-color:transparent;color:var(--cds-link-primary,#0f62fe);padding:calc(.875rem - 3px) 16px}.cds--btn--ghost:hover{background-color:var(--cds-layer-hover)}.cds--btn--ghost:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--ghost:active{background-color:var(--cds-layer-active)}.cds--btn--ghost .cds--btn__icon,.cds--btn--ghost .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--ghost .cds--btn__icon{position:static;margin-left:.5rem}.cds--btn--ghost:active,.cds--btn--ghost:hover{color:var(--cds-link-primary-hover,#0043ce)}.cds--btn--ghost:active{background-color:var(--cds-background-active,rgba(141,141,141,.5))}.cds--btn--ghost.cds--btn--disabled,.cds--btn--ghost.cds--btn--disabled:focus,.cds--btn--ghost.cds--btn--disabled:hover,.cds--btn--ghost:disabled,.cds--btn--ghost:focus:disabled,.cds--btn--ghost:hover:disabled{border-color:transparent;background:0 0;color:var(--cds-text-on-color-disabled,#8d8d8d);outline:0}.cds--btn--ghost.cds--btn--sm{padding:calc(.375rem - 3px) 16px}.cds--btn--ghost.cds--btn--field,.cds--btn--ghost.cds--btn--md{padding:calc(.675rem - 3px) 16px}.cds--btn--ghost:not([disabled]) svg{fill:var(--cds-icon-primary,#161616)}.cds--btn--icon-only{padding-right:.9375rem;padding-left:.9375rem}.cds--btn--icon-only .cds--btn__icon{position:static}.cds--btn--icon-only.cds--btn--danger--ghost .cds--btn__icon,.cds--btn--icon-only.cds--btn--ghost .cds--btn__icon{margin:0}.cds--btn--icon-only.cds--btn--selected{background:var(--cds-background-selected,rgba(141,141,141,.2))}.cds--btn path[data-icon-path=inner-path]{fill:none}.cds--btn--ghost.cds--btn--icon-only .cds--btn__icon,.cds--btn--ghost.cds--btn--icon-only .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:var(--cds-icon-primary,#161616)}.cds--btn--ghost.cds--btn--icon-only[disabled] .cds--btn__icon,.cds--btn--ghost.cds--btn--icon-only[disabled] .cds--btn__icon path:not([data-icon-path]):not([fill=none]),.cds--btn.cds--btn--icon-only.cds--btn--ghost[disabled]:hover .cds--btn__icon{fill:var(--cds-icon-on-color-disabled,#8d8d8d)}.cds--btn--ghost.cds--btn--icon-only[disabled]{cursor:not-allowed}.cds--btn--field.cds--btn--icon-only,.cds--btn--md.cds--btn--icon-only{padding-right:.6875rem;padding-left:.6875rem}.cds--btn--sm.cds--btn--icon-only{padding-right:.4375rem;padding-left:.4375rem}.cds--btn--danger{border-width:1px;border-style:solid;border-color:transparent;background-color:var(--cds-button-danger-primary,#da1e28);color:var(--cds-text-on-color,#fff)}.cds--btn--danger:hover{background-color:var(--cds-button-danger-hover,#b81921)}.cds--btn--danger:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--danger:active{background-color:var(--cds-button-danger-active,#750e13)}.cds--btn--danger .cds--btn__icon,.cds--btn--danger .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--danger:hover{color:var(--cds-text-on-color,#fff)}.cds--btn--danger--tertiary{border-width:1px;border-style:solid;border-color:var(--cds-button-danger-secondary,#da1e28);background-color:transparent;color:var(--cds-button-danger-secondary,#da1e28)}.cds--btn--danger--tertiary:hover{background-color:var(--cds-button-danger-hover,#b81921)}.cds--btn--danger--tertiary:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--danger--tertiary:active{background-color:var(--cds-button-danger-active,#750e13)}.cds--btn--danger--tertiary .cds--btn__icon,.cds--btn--danger--tertiary .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--danger--tertiary:hover{border-color:var(--cds-button-danger-hover,#b81921);color:var(--cds-text-on-color,#fff)}.cds--btn--danger--tertiary:focus{background-color:var(--cds-button-danger-primary,#da1e28);color:var(--cds-text-on-color,#fff)}.cds--btn--danger--tertiary:active{border-color:var(--cds-button-danger-active,#750e13);background-color:var(--cds-button-danger-active,#750e13);color:var(--cds-text-on-color,#fff)}.cds--btn--danger--tertiary.cds--btn--disabled,.cds--btn--danger--tertiary.cds--btn--disabled:focus,.cds--btn--danger--tertiary.cds--btn--disabled:hover,.cds--btn--danger--tertiary:disabled,.cds--btn--danger--tertiary:focus:disabled,.cds--btn--danger--tertiary:hover:disabled{background:0 0;color:var(--cds-text-on-color-disabled,#8d8d8d);outline:0}.cds--btn--danger--ghost{border-width:1px;border-style:solid;border-color:transparent;background-color:transparent;color:var(--cds-button-danger-secondary,#da1e28);padding:calc(.875rem - 3px) 16px}.cds--btn--danger--ghost:hover{background-color:var(--cds-button-danger-hover,#b81921)}.cds--btn--danger--ghost:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--danger--ghost:active{background-color:var(--cds-button-danger-active,#750e13)}.cds--btn--danger--ghost .cds--btn__icon,.cds--btn--danger--ghost .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--danger--ghost .cds--btn__icon{position:static;margin-left:.5rem}.cds--btn--danger--ghost:active,.cds--btn--danger--ghost:hover{color:var(--cds-text-on-color,#fff)}.cds--btn--danger--ghost.cds--btn--disabled,.cds--btn--danger--ghost.cds--btn--disabled:focus,.cds--btn--danger--ghost.cds--btn--disabled:hover,.cds--btn--danger--ghost:disabled,.cds--btn--danger--ghost:focus:disabled,.cds--btn--danger--ghost:hover:disabled{border-color:transparent;background:0 0;color:var(--cds-text-disabled,rgba(22,22,22,.25));outline:0}.cds--btn--danger--ghost.cds--btn--sm{padding:calc(.375rem - 3px) 16px}.cds--btn--danger--ghost.cds--btn--field,.cds--btn--danger--ghost.cds--btn--md{padding:calc(.675rem - 3px) 16px}.cds--btn--sm{min-height:2rem;padding:calc(.375rem - 3px) 60px calc(.375rem - 3px) 12px}.cds--btn--2xl:not(.cds--btn--icon-only){align-items:baseline;padding-top:1rem;padding-right:4rem;padding-left:1rem;min-height:5rem}.cds--btn--xl:not(.cds--btn--icon-only){align-items:baseline;padding-top:1rem;padding-right:4rem;padding-left:1rem;min-height:4rem}.cds--btn--field,.cds--btn--md{min-height:2.5rem;padding:calc(.675rem - 3px) 60px calc(.675rem - 3px) 12px}.cds--btn--expressive{font-size:var(--cds-body-compact-02-font-size,1rem);font-weight:var(--cds-body-compact-02-font-weight,400);line-height:var(--cds-body-compact-02-line-height,1.375);letter-spacing:var(--cds-body-compact-02-letter-spacing,0);min-height:3rem}.cds--btn--icon-only.cds--btn--expressive{padding:12px 13px}.cds--btn.cds--btn--expressive .cds--btn__icon{width:1.25rem;height:1.25rem}.cds--btn-set .cds--btn.cds--btn--expressive{max-width:20rem}.cds--btn.cds--skeleton{position:relative;padding:0;border:none;background:var(--cds-skeleton-background,#e8e8e8);box-shadow:none;pointer-events:none;width:9.375rem}.cds--btn.cds--skeleton:active,.cds--btn.cds--skeleton:focus,.cds--btn.cds--skeleton:hover{border:none;cursor:default;outline:0}.cds--btn.cds--skeleton::before{position:absolute;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-element,#c6c6c6);content:"";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.cds--btn.cds--skeleton::before{animation:none}}.cds--btn-set{display:flex}.cds--btn-set--stacked{flex-direction:column}.cds--btn-set .cds--btn{width:100%;max-width:12.25rem}.cds--btn-set .cds--btn:not(:focus){box-shadow:-.0625rem 0 0 0 var(--cds-button-separator,#e0e0e0)}.cds--btn-set .cds--btn:first-of-type:not(:focus){box-shadow:inherit}.cds--btn-set .cds--btn:focus+.cds--btn{box-shadow:inherit}.cds--btn-set--stacked .cds--btn:not(:focus){box-shadow:0 -.0625rem 0 0 var(--cds-button-separator,#e0e0e0)}.cds--btn-set--stacked .cds--btn:first-of-type:not(:focus){box-shadow:inherit}.cds--btn-set .cds--btn.cds--btn--disabled{box-shadow:-.0625rem 0 0 0 var(--cds-icon-on-color-disabled,#8d8d8d)}.cds--btn-set .cds--btn.cds--btn--disabled:first-of-type{box-shadow:none}.cds--btn-set--stacked .cds--btn.cds--btn--disabled{box-shadow:0 -.0625rem 0 0 var(--cds-layer-selected-disabled,#8d8d8d)}.cds--btn-set--stacked .cds--btn.cds--btn--disabled:first-of-type{box-shadow:none}@media screen and (-ms-high-contrast:active),(forced-colors:active){.cds--btn:focus{color:Highlight;outline:1px solid Highlight}}@media screen and (-ms-high-contrast:active),(forced-colors:active){.cds--btn--ghost.cds--btn--icon-only .cds--btn__icon,.cds--btn--ghost.cds--btn--icon-only .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:ButtonText}}.cds--modal,:host(cds-modal[open]){position:fixed;z-index:9000;top:0;left:0;display:flex;width:100vw;height:100vh;align-items:center;justify-content:center;background-color:var(--cds-overlay,rgba(22,22,22,.5));content:"";opacity:0;transition:opacity 240ms cubic-bezier(.4,.14,1,1),visibility 0s linear 240ms;visibility:hidden}.cds--modal.is-visible,:host(cds-modal[open]){opacity:1;transition:opacity 240ms cubic-bezier(0,0,.3,1),visibility 0s linear;visibility:inherit}@media screen and (prefers-reduced-motion:reduce){.cds--modal.is-visible,:host(cds-modal[open]){transition:none}}.cds--modal .cds--date-picker__input,.cds--modal .cds--dropdown,.cds--modal .cds--dropdown-list,.cds--modal .cds--multi-select,.cds--modal .cds--number input[type=number],.cds--modal .cds--number__control-btn::after,.cds--modal .cds--number__control-btn::before,.cds--modal .cds--pagination,.cds--modal .cds--pagination__control-buttons,.cds--modal .cds--search-input,.cds--modal .cds--select-input,.cds--modal .cds--text-area,.cds--modal .cds--text-input,:host(cds-modal[open]) .cds--date-picker__input,:host(cds-modal[open]) .cds--dropdown,:host(cds-modal[open]) .cds--dropdown-list,:host(cds-modal[open]) .cds--multi-select,:host(cds-modal[open]) .cds--number input[type=number],:host(cds-modal[open]) .cds--number__control-btn::after,:host(cds-modal[open]) .cds--number__control-btn::before,:host(cds-modal[open]) .cds--pagination,:host(cds-modal[open]) .cds--pagination__control-buttons,:host(cds-modal[open]) .cds--search-input,:host(cds-modal[open]) .cds--select-input,:host(cds-modal[open]) .cds--text-area,:host(cds-modal[open]) .cds--text-input{background-color:var(--cds-field-02,#fff)}.cds--modal .cds--number__rule-divider,:host(cds-modal[open]) .cds--number__rule-divider{background-color:var(--cds-border-subtle-02,#e0e0e0)}.cds--modal.is-visible .cds--modal-container,:host(cds-modal[open]) .cds--modal-container{transform:translate3d(0,0,0);transition:transform 240ms cubic-bezier(0,0,.3,1)}.cds--modal-container{position:fixed;top:0;display:grid;overflow:hidden;width:100%;height:100%;max-height:100%;background-color:var(--cds-layer);grid-template-columns:100%;grid-template-rows:auto 1fr auto;outline:3px solid transparent;outline-offset:-3px;transform:translate3d(0,-24px,0);transform-origin:top center;transition:transform 240ms cubic-bezier(.4,.14,1,1)}@media (min-width:42rem){.cds--modal-container{position:static;width:84%;height:auto;max-height:90%}}@media (min-width:66rem){.cds--modal-container{width:60%;max-height:84%}}@media (min-width:82rem){.cds--modal-container{width:48%}}.cds--modal-container .cds--modal-container-body{display:contents}.cds--modal-content,:host(cds-modal-body){font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);line-height:var(--cds-body-01-line-height,1.42857);letter-spacing:var(--cds-body-01-letter-spacing,.16px);position:relative;padding-top:.5rem;padding-right:1rem;padding-left:1rem;margin-bottom:3rem;color:var(--cds-text-primary,#161616);font-weight:400;grid-column:1/-1;grid-row:2/-2;overflow-y:auto}.cds--modal-content:focus,:focus:host(cds-modal-body){outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--modal-content:focus,:focus:host(cds-modal-body){outline-style:dotted}}.cds--modal-content>p,.cds--modal-content__regular-content,:host(cds-modal-body)>p{font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);line-height:var(--cds-body-01-line-height,1.42857);letter-spacing:var(--cds-body-01-letter-spacing,.16px);padding-right:calc(20% - 2rem)}.cds--modal-content--with-form{padding-right:1rem}.cds--modal-header,:host(cds-modal-header){padding-top:1rem;padding-right:3rem;padding-left:1rem;margin-bottom:.5rem;grid-column:1/-1;grid-row:1/1}.cds--modal-header__label,:host(cds-modal-label){font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333);letter-spacing:var(--cds-label-01-letter-spacing,.32px);margin-bottom:.25rem;color:var(--cds-text-secondary,#525252)}.cds--modal-header__heading,:host(cds-modal-heading){font-size:var(--cds-heading-03-font-size,1.25rem);font-weight:var(--cds-heading-03-font-weight,400);line-height:var(--cds-heading-03-line-height,1.4);letter-spacing:var(--cds-heading-03-letter-spacing,0);color:var(--cds-text-primary,#161616)}.cds--modal-container--xs .cds--modal-content__regular-content{padding-right:1rem}.cds--modal-container--xs .cds--modal-content>p,.cds--modal-container--xs :host(cds-modal-body)>p{padding-right:0}@media (min-width:42rem){.cds--modal-container--xs{width:48%}}@media (min-width:66rem){.cds--modal-container--xs{width:32%;max-height:48%}}@media (min-width:82rem){.cds--modal-container--xs{width:24%}}.cds--modal-container--sm .cds--modal-content__regular-content{padding-right:1rem}.cds--modal-container--sm .cds--modal-content>p,.cds--modal-container--sm :host(cds-modal-body)>p{padding-right:0}@media (min-width:42rem){.cds--modal-container--sm{width:60%}}@media (min-width:66rem){.cds--modal-container--sm{width:42%;max-height:72%}.cds--modal-container--sm .cds--modal-content>p,.cds--modal-container--sm .cds--modal-content__regular-content,.cds--modal-container--sm :host(cds-modal-body)>p{padding-right:20%}}@media (min-width:82rem){.cds--modal-container--sm{width:36%}}@media (min-width:42rem){.cds--modal-container--lg{width:96%}}@media (min-width:66rem){.cds--modal-container--lg{width:84%;max-height:96%}}@media (min-width:82rem){.cds--modal-container--lg{width:72%}}.cds--modal-scroll-content>:last-child{padding-bottom:2rem}.cds--modal-content--overflow-indicator{position:absolute;bottom:3rem;left:0;width:100%;height:2rem;background-image:linear-gradient(to bottom,transparent,var(--cds-layer));content:"";grid-column:1/-1;grid-row:2/-2;pointer-events:none}@media not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent){.cds--modal-content--overflow-indicator{background-image:linear-gradient(to bottom,rgba(var(--cds-layer),0),var(--cds-layer))}}}.cds--modal-content:focus~.cds--modal-content--overflow-indicator,:focus:host(cds-modal-body)~.cds--modal-content--overflow-indicator{width:calc(100% - 4px);margin:0 2px 2px}@media screen and (-ms-high-contrast:active){.cds--modal-scroll-content>:last-child{padding-bottom:0}.cds--modal-content--overflow-indicator{display:none}}.cds--modal-footer{display:flex;height:4rem;justify-content:flex-end;margin-top:auto;grid-column:1/-1;grid-row:-1/-1}.cds--modal-footer .cds--btn{max-width:none;height:4rem;flex:0 1 50%;padding-top:1rem;padding-bottom:2rem;margin:0}.cds--modal-footer--three-button .cds--btn{flex:0 1 25%;align-items:flex-start}.cds--modal-close{position:absolute;z-index:2;top:0;right:0;overflow:hidden;width:3rem;height:3rem;padding:.75rem;border:2px solid transparent;background-color:transparent;cursor:pointer;transition:background-color 110ms cubic-bezier(.2,0,.38,.9)}.cds--modal-close:hover{background-color:var(--cds-layer-hover)}.cds--modal-close:focus{border-color:var(--cds-focus,#0f62fe);outline:0}.cds--modal-close::-moz-focus-inner{border:0}.cds--modal-close__icon{width:1.25rem;height:1.25rem;fill:var(--cds-icon-primary,#161616)}.cds--body--with-modal-open{overflow:hidden}.cds--body--with-modal-open .cds--modal .cds--overflow-menu-options,.cds--body--with-modal-open .cds--modal .cds--tooltip,.cds--body--with-modal-open :host(cds-modal[open]) .cds--overflow-menu-options,.cds--body--with-modal-open :host(cds-modal[open]) .cds--tooltip{z-index:9000}.cds--modal-container--full-width .cds--modal-content,.cds--modal-container--full-width :host(cds-modal-body){padding:0;margin:0}@media screen and (-ms-high-contrast:active),(forced-colors:active){.cds--modal-close__icon{fill:ButtonText}}@media screen and (-ms-high-contrast:active),(forced-colors:active){.cds--modal-close:focus{color:Highlight;outline:1px solid Highlight}}:host(cds-modal){position:fixed;top:0;bottom:0;width:100vw;height:100vh;z-index:z("modal");display:flex;align-items:center;justify-content:center;content:"";background-color:var(--cds-overlay,rgba(22,22,22,.5));opacity:0;visibility:hidden;transition:background-color .7s cubic-bezier(.4,.14,1,1),opacity 240ms cubic-bezier(.4,.14,1,1),z-index .7s cubic-bezier(.4,.14,1,1),visibility 240ms cubic-bezier(.4,.14,1,1)}:host(cds-modal) .cds--select-input,:host(cds-modal) .cds--text-input{background-color:var(--cds-field-02,#fff)}@media (min-width:42rem){:host(cds-modal) .cds--modal-container ::slotted(cds-modal-body),:host(cds-modal) .cds--modal-container ::slotted(cds-modal-header){padding-right:20%}}:host(cds-modal) .cds--modal-container--sm ::slotted(cds-modal-header),:host(cds-modal) .cds--modal-container--xl ::slotted(cds-modal-header),:host(cds-modal) .cds--modal-container--xs ::slotted(cds-modal-header){padding-right:3rem}:host(cds-modal) .cds--modal-container--sm ::slotted(cds-modal-body),:host(cds-modal) .cds--modal-container--xl ::slotted(cds-modal-body),:host(cds-modal) .cds--modal-container--xs ::slotted(cds-modal-body){padding-right:1rem}@media (min-width:82rem){:host(cds-modal) .cds--modal-container--sm ::slotted(cds-modal-body),:host(cds-modal) .cds--modal-container--sm ::slotted(cds-modal-header){padding-right:20%}}@media (min-width:42rem){:host(cds-modal) .cds--modal-container--lg ::slotted(cds-modal-body),:host(cds-modal) .cds--modal-container--lg ::slotted(cds-modal-header){padding-right:20%}}:host(cds-modal[open]){opacity:1;visibility:inherit}:host(cds-modal-close-button){outline:0}:host(cds-modal-heading),:host(cds-modal-label){display:block}:host(cds-modal-footer) .cds--modal-footer--three-button ::slotted(cds-btn),:host(cds-modal-footer) .cds--modal-footer--three-button ::slotted(cds-modal-footer-button){flex:0 1 25%}:host(cds-modal-footer) ::slotted(cds-btn),:host(cds-modal-footer-button){flex:0 1 50%;max-width:none;width:50%;height:4rem;margin:0;padding-bottom:2rem}:host(cds-modal-footer-button) .cds--btn{padding-top:1rem;padding-bottom:2rem;box-shadow:-.0625rem 0 0 0 var(--cds-button-separator,#e0e0e0)}:host(cds-modal-footer-button:first-of-type) .cds--btn{box-shadow:inherit}:host(cds-modal-footer-button) .cds--btn:focus,:host(cds-modal-footer-button):first-of-type .cds--btn:focus{box-shadow:inset 0 0 0 1px var(--cds-focus,#0f62fe),inset 0 0 0 2px var(--cds-background,#fff)}',
+  '@keyframes hide-feedback{0%{opacity:1;visibility:inherit}100%{opacity:0;visibility:hidden}}@keyframes show-feedback{0%{opacity:0;visibility:hidden}100%{opacity:1;visibility:inherit}}@keyframes skeleton{0%{opacity:.3;transform:scaleX(0);transform-origin:left}20%{opacity:1;transform:scaleX(1);transform-origin:left}28%{transform:scaleX(1);transform-origin:right}51%{transform:scaleX(0);transform-origin:right}58%{transform:scaleX(0);transform-origin:right}82%{transform:scaleX(1);transform-origin:right}83%{transform:scaleX(1);transform-origin:left}96%{transform:scaleX(0);transform-origin:left}100%{opacity:.3;transform:scaleX(0);transform-origin:left}}.cds--assistive-text,.cds--visually-hidden{position:absolute;overflow:hidden;width:1px;height:1px;padding:0;border:0;margin:-1px;clip:rect(0,0,0,0);visibility:inherit;white-space:nowrap}.cds--btn{box-sizing:border-box;padding:0;border:0;margin:0;font-family:inherit;font-size:100%;vertical-align:baseline;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);line-height:var(--cds-body-compact-01-line-height,1.28572);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);position:relative;display:inline-flex;width:-moz-max-content;width:max-content;max-width:20rem;min-height:3rem;flex-shrink:0;align-items:center;justify-content:space-between;padding:calc(.875rem - 3px) calc(4rem - 1px) calc(.875rem - 3px) calc(1rem - 1px);margin:0;border-radius:0;cursor:pointer;outline:0;text-align:left;text-decoration:none;transition:background 70ms cubic-bezier(0,0,.38,.9),box-shadow 70ms cubic-bezier(0,0,.38,.9),border-color 70ms cubic-bezier(0,0,.38,.9),outline 70ms cubic-bezier(0,0,.38,.9);vertical-align:top}.cds--btn *,.cds--btn ::after,.cds--btn ::before{box-sizing:inherit}.cds--btn.cds--btn--disabled,.cds--btn.cds--btn--disabled:focus,.cds--btn.cds--btn--disabled:hover,.cds--btn:disabled,.cds--btn:focus:disabled,.cds--btn:hover:disabled{border-color:var(--cds-button-disabled,#c6c6c6);background:var(--cds-button-disabled,#c6c6c6);box-shadow:none;color:var(--cds-text-on-color-disabled,#8d8d8d);cursor:not-allowed}.cds--btn .cds--btn__icon{position:absolute;right:1rem;width:1rem;height:1rem;flex-shrink:0}.cds--btn::-moz-focus-inner{padding:0;border:0}.cds--btn--primary{border-width:1px;border-style:solid;border-color:transparent;background-color:var(--cds-button-primary,#0f62fe);color:var(--cds-text-on-color,#fff)}.cds--btn--primary:hover{background-color:var(--cds-button-primary-hover,#0050e6)}.cds--btn--primary:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--primary:active{background-color:var(--cds-button-primary-active,#002d9c)}.cds--btn--primary .cds--btn__icon,.cds--btn--primary .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--primary:hover{color:var(--cds-text-on-color,#fff)}.cds--btn--secondary{border-width:1px;border-style:solid;border-color:transparent;background-color:var(--cds-button-secondary,#393939);color:var(--cds-text-on-color,#fff)}.cds--btn--secondary:hover{background-color:var(--cds-button-secondary-hover,#474747)}.cds--btn--secondary:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--secondary:active{background-color:var(--cds-button-secondary-active,#6f6f6f)}.cds--btn--secondary .cds--btn__icon,.cds--btn--secondary .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--secondary:focus,.cds--btn--secondary:hover{color:var(--cds-text-on-color,#fff)}.cds--btn--tertiary{border-width:1px;border-style:solid;border-color:var(--cds-button-tertiary,#0f62fe);background-color:transparent;color:var(--cds-button-tertiary,#0f62fe)}.cds--btn--tertiary:hover{background-color:var(--cds-button-tertiary-hover,#0050e6)}.cds--btn--tertiary:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--tertiary:active{background-color:var(--cds-button-tertiary-active,#002d9c)}.cds--btn--tertiary .cds--btn__icon,.cds--btn--tertiary .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--tertiary:hover{color:var(--cds-text-inverse,#fff)}.cds--btn--tertiary:focus{background-color:var(--cds-button-tertiary,#0f62fe);color:var(--cds-text-inverse,#fff)}.cds--btn--tertiary:active{border-color:transparent;background-color:var(--cds-button-tertiary-active,#002d9c);color:var(--cds-text-inverse,#fff)}.cds--btn--tertiary.cds--btn--disabled,.cds--btn--tertiary.cds--btn--disabled:focus,.cds--btn--tertiary.cds--btn--disabled:hover,.cds--btn--tertiary:disabled,.cds--btn--tertiary:focus:disabled,.cds--btn--tertiary:hover:disabled{background:0 0;color:var(--cds-text-on-color-disabled,#8d8d8d);outline:0}.cds--btn--ghost{border-width:1px;border-style:solid;border-color:transparent;background-color:transparent;color:var(--cds-link-primary,#0f62fe);padding:calc(.875rem - 3px) 1rem}.cds--btn--ghost:hover{background-color:var(--cds-layer-hover)}.cds--btn--ghost:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--ghost:active{background-color:var(--cds-layer-active)}.cds--btn--ghost .cds--btn__icon,.cds--btn--ghost .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--ghost .cds--btn__icon{position:static;margin-left:.5rem}.cds--btn--ghost:active,.cds--btn--ghost:hover{color:var(--cds-link-primary-hover,#0043ce)}.cds--btn--ghost:active{background-color:var(--cds-background-active,rgba(141,141,141,.5))}.cds--btn--ghost.cds--btn--disabled,.cds--btn--ghost.cds--btn--disabled:focus,.cds--btn--ghost.cds--btn--disabled:hover,.cds--btn--ghost:disabled,.cds--btn--ghost:focus:disabled,.cds--btn--ghost:hover:disabled{border-color:transparent;background:0 0;color:var(--cds-text-on-color-disabled,#8d8d8d);outline:0}.cds--btn--ghost.cds--btn--sm{padding:calc(.375rem - 3px) 1rem}.cds--btn--ghost.cds--btn--field,.cds--btn--ghost.cds--btn--md{padding:calc(.675rem - 3px) 1rem}.cds--btn--ghost:not([disabled]) svg{fill:var(--cds-icon-primary,#161616)}.cds--btn--icon-only{padding-right:.9375rem;padding-left:.9375rem}.cds--btn--icon-only .cds--btn__icon{position:static}.cds--btn--icon-only.cds--btn--danger--ghost .cds--btn__icon,.cds--btn--icon-only.cds--btn--ghost .cds--btn__icon{margin:0}.cds--btn--icon-only.cds--btn--selected{background:var(--cds-background-selected,rgba(141,141,141,.2))}.cds--btn path[data-icon-path=inner-path]{fill:none}.cds--btn--ghost.cds--btn--icon-only .cds--btn__icon,.cds--btn--ghost.cds--btn--icon-only .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:var(--cds-icon-primary,#161616)}.cds--btn--ghost.cds--btn--icon-only[disabled] .cds--btn__icon,.cds--btn--ghost.cds--btn--icon-only[disabled] .cds--btn__icon path:not([data-icon-path]):not([fill=none]),.cds--btn.cds--btn--icon-only.cds--btn--ghost[disabled]:hover .cds--btn__icon{fill:var(--cds-icon-on-color-disabled,#8d8d8d)}.cds--btn--ghost.cds--btn--icon-only[disabled]{cursor:not-allowed}.cds--btn--field.cds--btn--icon-only,.cds--btn--md.cds--btn--icon-only{padding-right:.6875rem;padding-left:.6875rem}.cds--btn--sm.cds--btn--icon-only{padding-right:.4375rem;padding-left:.4375rem}.cds--btn--danger{border-width:1px;border-style:solid;border-color:transparent;background-color:var(--cds-button-danger-primary,#da1e28);color:var(--cds-text-on-color,#fff)}.cds--btn--danger:hover{background-color:var(--cds-button-danger-hover,#b81921)}.cds--btn--danger:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--danger:active{background-color:var(--cds-button-danger-active,#750e13)}.cds--btn--danger .cds--btn__icon,.cds--btn--danger .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--danger:hover{color:var(--cds-text-on-color,#fff)}.cds--btn--danger--tertiary{border-width:1px;border-style:solid;border-color:var(--cds-button-danger-secondary,#da1e28);background-color:transparent;color:var(--cds-button-danger-secondary,#da1e28)}.cds--btn--danger--tertiary:hover{background-color:var(--cds-button-danger-hover,#b81921)}.cds--btn--danger--tertiary:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--danger--tertiary:active{background-color:var(--cds-button-danger-active,#750e13)}.cds--btn--danger--tertiary .cds--btn__icon,.cds--btn--danger--tertiary .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--danger--tertiary:hover{border-color:var(--cds-button-danger-hover,#b81921);color:var(--cds-text-on-color,#fff)}.cds--btn--danger--tertiary:focus{background-color:var(--cds-button-danger-primary,#da1e28);color:var(--cds-text-on-color,#fff)}.cds--btn--danger--tertiary:active{border-color:var(--cds-button-danger-active,#750e13);background-color:var(--cds-button-danger-active,#750e13);color:var(--cds-text-on-color,#fff)}.cds--btn--danger--tertiary.cds--btn--disabled,.cds--btn--danger--tertiary.cds--btn--disabled:focus,.cds--btn--danger--tertiary.cds--btn--disabled:hover,.cds--btn--danger--tertiary:disabled,.cds--btn--danger--tertiary:focus:disabled,.cds--btn--danger--tertiary:hover:disabled{background:0 0;color:var(--cds-text-on-color-disabled,#8d8d8d);outline:0}.cds--btn--danger--ghost{border-width:1px;border-style:solid;border-color:transparent;background-color:transparent;color:var(--cds-button-danger-secondary,#da1e28);padding:calc(.875rem - 3px) 1rem}.cds--btn--danger--ghost:hover{background-color:var(--cds-button-danger-hover,#b81921)}.cds--btn--danger--ghost:focus{border-color:var(--cds-button-focus-color,var(--cds-focus,#0f62fe));box-shadow:inset 0 0 0 1px var(--cds-button-focus-color,var(--cds-focus,#0f62fe)),inset 0 0 0 2px var(--cds-background,#fff)}.cds--btn--danger--ghost:active{background-color:var(--cds-button-danger-active,#750e13)}.cds--btn--danger--ghost .cds--btn__icon,.cds--btn--danger--ghost .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:currentColor}.cds--btn--danger--ghost .cds--btn__icon{position:static;margin-left:.5rem}.cds--btn--danger--ghost:active,.cds--btn--danger--ghost:hover{color:var(--cds-text-on-color,#fff)}.cds--btn--danger--ghost.cds--btn--disabled,.cds--btn--danger--ghost.cds--btn--disabled:focus,.cds--btn--danger--ghost.cds--btn--disabled:hover,.cds--btn--danger--ghost:disabled,.cds--btn--danger--ghost:focus:disabled,.cds--btn--danger--ghost:hover:disabled{border-color:transparent;background:0 0;color:var(--cds-text-disabled,rgba(22,22,22,.25));outline:0}.cds--btn--danger--ghost.cds--btn--sm{padding:calc(.375rem - 3px) 1rem}.cds--btn--danger--ghost.cds--btn--field,.cds--btn--danger--ghost.cds--btn--md{padding:calc(.675rem - 3px) 1rem}.cds--btn--sm{min-height:2rem;padding:calc(.375rem - 3px) calc(4rem - 4px) calc(.375rem - 3px) calc(1rem - 4px)}.cds--btn--2xl:not(.cds--btn--icon-only){align-items:baseline;padding-top:1rem;padding-right:4rem;padding-left:1rem;min-height:5rem}.cds--btn--xl:not(.cds--btn--icon-only){align-items:baseline;padding-top:1rem;padding-right:4rem;padding-left:1rem;min-height:4rem}.cds--btn--field,.cds--btn--md{min-height:2.5rem;padding:calc(.675rem - 3px) calc(4rem - 4px) calc(.675rem - 3px) calc(1rem - 4px)}.cds--btn--expressive{font-size:var(--cds-body-compact-02-font-size,1rem);font-weight:var(--cds-body-compact-02-font-weight,400);line-height:var(--cds-body-compact-02-line-height,1.375);letter-spacing:var(--cds-body-compact-02-letter-spacing,0);min-height:3rem}.cds--btn--icon-only.cds--btn--expressive{padding:12px 13px}.cds--btn.cds--btn--expressive .cds--btn__icon{width:1.25rem;height:1.25rem}.cds--btn-set .cds--btn.cds--btn--expressive{max-width:20rem}.cds--btn.cds--skeleton{position:relative;padding:0;border:none;background:var(--cds-skeleton-background,#e8e8e8);box-shadow:none;pointer-events:none;width:9.375rem}.cds--btn.cds--skeleton:active,.cds--btn.cds--skeleton:focus,.cds--btn.cds--skeleton:hover{border:none;cursor:default;outline:0}.cds--btn.cds--skeleton::before{position:absolute;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-element,#c6c6c6);content:"";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.cds--btn.cds--skeleton::before{animation:none}}.cds--btn-set{display:flex}.cds--btn-set--stacked{flex-direction:column}.cds--btn-set .cds--btn{width:100%;max-width:12.25rem}.cds--btn-set .cds--btn:not(:focus){box-shadow:-.0625rem 0 0 0 var(--cds-button-separator,#e0e0e0)}.cds--btn-set .cds--btn:first-of-type:not(:focus){box-shadow:inherit}.cds--btn-set .cds--btn:focus+.cds--btn{box-shadow:inherit}.cds--btn-set--stacked .cds--btn:not(:focus){box-shadow:0 -.0625rem 0 0 var(--cds-button-separator,#e0e0e0)}.cds--btn-set--stacked .cds--btn:first-of-type:not(:focus){box-shadow:inherit}.cds--btn-set .cds--btn.cds--btn--disabled{box-shadow:-.0625rem 0 0 0 var(--cds-icon-on-color-disabled,#8d8d8d)}.cds--btn-set .cds--btn.cds--btn--disabled:first-of-type{box-shadow:none}.cds--btn-set--stacked .cds--btn.cds--btn--disabled{box-shadow:0 -.0625rem 0 0 var(--cds-layer-selected-disabled,#8d8d8d)}.cds--btn-set--stacked .cds--btn.cds--btn--disabled:first-of-type{box-shadow:none}@media screen and (-ms-high-contrast:active),(forced-colors:active){.cds--btn:focus{color:Highlight;outline:1px solid Highlight}}@media screen and (-ms-high-contrast:active),(forced-colors:active){.cds--btn--ghost.cds--btn--icon-only .cds--btn__icon,.cds--btn--ghost.cds--btn--icon-only .cds--btn__icon path:not([data-icon-path]):not([fill=none]){fill:ButtonText}}.cds--modal,:host(cds-modal[open]){position:fixed;z-index:9000;top:0;left:0;display:flex;width:100vw;height:100vh;align-items:center;justify-content:center;background-color:var(--cds-overlay,rgba(22,22,22,.5));content:"";opacity:0;transition:opacity 240ms cubic-bezier(.4,.14,1,1),visibility 0s linear 240ms;visibility:hidden}.cds--modal.is-visible,:host(cds-modal[open]){opacity:1;transition:opacity 240ms cubic-bezier(0,0,.3,1),visibility 0s linear;visibility:inherit}@media screen and (prefers-reduced-motion:reduce){.cds--modal.is-visible,:host(cds-modal[open]){transition:none}}.cds--modal .cds--date-picker__input,.cds--modal .cds--dropdown,.cds--modal .cds--dropdown-list,.cds--modal .cds--multi-select,.cds--modal .cds--number input[type=number],.cds--modal .cds--number__control-btn::after,.cds--modal .cds--number__control-btn::before,.cds--modal .cds--pagination,.cds--modal .cds--pagination__control-buttons,.cds--modal .cds--search-input,.cds--modal .cds--select-input,.cds--modal .cds--text-area,.cds--modal .cds--text-input,:host(cds-modal[open]) .cds--date-picker__input,:host(cds-modal[open]) .cds--dropdown,:host(cds-modal[open]) .cds--dropdown-list,:host(cds-modal[open]) .cds--multi-select,:host(cds-modal[open]) .cds--number input[type=number],:host(cds-modal[open]) .cds--number__control-btn::after,:host(cds-modal[open]) .cds--number__control-btn::before,:host(cds-modal[open]) .cds--pagination,:host(cds-modal[open]) .cds--pagination__control-buttons,:host(cds-modal[open]) .cds--search-input,:host(cds-modal[open]) .cds--select-input,:host(cds-modal[open]) .cds--text-area,:host(cds-modal[open]) .cds--text-input{background-color:var(--cds-field-02,#fff)}.cds--modal .cds--number__rule-divider,:host(cds-modal[open]) .cds--number__rule-divider{background-color:var(--cds-border-subtle-02,#e0e0e0)}.cds--modal .cds--date-picker--fluid .ccdsds--date-picker-input__wrapper .cds--date-picker__input,.cds--modal .cds--list-box__wrapper--fluid .cds--list-box,.cds--modal .cds--list-box__wrapper--fluid.cds--list-box__wrapper,.cds--modal .cds--number-input--fluid .cds--number__control-btn::after,.cds--modal .cds--number-input--fluid .cds--number__control-btn::before,.cds--modal .cds--number-input--fluid input[type=number],.cds--modal .cds--search--fluid .cds--search-input,.cds--modal .cds--select--fluid .cds--select-input,.cds--modal .cds--text-area--fluid .cds--text-area,.cds--modal .cds--text-area--fluid .cds--text-area__wrapper,.cds--modal .cds--text-area--fluid .cds--text-area__wrapper[data-invalid] .cds--text-area__divider+.cds--form-requirement,.cds--modal .cds--text-input--fluid .cds--text-input,:host(cds-modal[open]) .cds--date-picker--fluid .ccdsds--date-picker-input__wrapper .cds--date-picker__input,:host(cds-modal[open]) .cds--list-box__wrapper--fluid .cds--list-box,:host(cds-modal[open]) .cds--list-box__wrapper--fluid.cds--list-box__wrapper,:host(cds-modal[open]) .cds--number-input--fluid .cds--number__control-btn::after,:host(cds-modal[open]) .cds--number-input--fluid .cds--number__control-btn::before,:host(cds-modal[open]) .cds--number-input--fluid input[type=number],:host(cds-modal[open]) .cds--search--fluid .cds--search-input,:host(cds-modal[open]) .cds--select--fluid .cds--select-input,:host(cds-modal[open]) .cds--text-area--fluid .cds--text-area,:host(cds-modal[open]) .cds--text-area--fluid .cds--text-area__wrapper,:host(cds-modal[open]) .cds--text-area--fluid .cds--text-area__wrapper[data-invalid] .cds--text-area__divider+.cds--form-requirement,:host(cds-modal[open]) .cds--text-input--fluid .cds--text-input{background-color:var(--cds-field-01,#f4f4f4)}.cds--modal .cds--number-input--fluid .cds--number__control-btn:hover::after,.cds--modal .cds--number-input--fluid .cds--number__control-btn:hover::before,:host(cds-modal[open]) .cds--number-input--fluid .cds--number__control-btn:hover::after,:host(cds-modal[open]) .cds--number-input--fluid .cds--number__control-btn:hover::before{background-color:var(--cds-field-hover)}.cds--modal .cds--number-input--fluid .cds--number__control-btn:focus::after,.cds--modal .cds--number-input--fluid .cds--number__control-btn:focus::before,:host(cds-modal[open]) .cds--number-input--fluid .cds--number__control-btn:focus::after,:host(cds-modal[open]) .cds--number-input--fluid .cds--number__control-btn:focus::before{border-left:2px solid var(--cds-focus,#0f62fe)}.cds--modal.is-visible .cds--modal-container,:host(cds-modal[open]) .cds--modal-container{transform:translate3d(0,0,0);transition:transform 240ms cubic-bezier(0,0,.3,1)}.cds--modal-container{position:fixed;top:0;display:grid;overflow:hidden;width:100%;height:100%;max-height:100%;background-color:var(--cds-layer);grid-template-columns:100%;grid-template-rows:auto 1fr auto;outline:3px solid transparent;outline-offset:-3px;transform:translate3d(0,-24px,0);transform-origin:top center;transition:transform 240ms cubic-bezier(.4,.14,1,1)}@media (min-width:42rem){.cds--modal-container{position:static;width:84%;height:auto;max-height:90%}}@media (min-width:66rem){.cds--modal-container{width:60%;max-height:84%}}@media (min-width:82rem){.cds--modal-container{width:48%}}.cds--modal-container .cds--modal-container-body{display:contents}.cds--modal-content,:host(cds-modal-body){font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);line-height:var(--cds-body-01-line-height,1.42857);letter-spacing:var(--cds-body-01-letter-spacing,.16px);position:relative;padding-top:.5rem;padding-right:1rem;padding-left:1rem;margin-bottom:3rem;color:var(--cds-text-primary,#161616);font-weight:400;grid-column:1/-1;grid-row:2/-2;overflow-y:auto}.cds--modal-content:focus,:focus:host(cds-modal-body){outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--modal-content:focus,:focus:host(cds-modal-body){outline-style:dotted}}.cds--modal-content .cds--form--fluid,:host(cds-modal-body) .cds--form--fluid{margin-right:-1rem;margin-left:-1rem}.cds--modal-content>p,.cds--modal-content__regular-content,:host(cds-modal-body)>p{font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);line-height:var(--cds-body-01-line-height,1.42857);letter-spacing:var(--cds-body-01-letter-spacing,.16px);padding-right:calc(20% - 2rem)}.cds--modal-content--with-form{padding-right:1rem}.cds--modal-header,:host(cds-modal-header){padding-top:1rem;padding-right:3rem;padding-left:1rem;margin-bottom:.5rem;grid-column:1/-1;grid-row:1/1}.cds--modal-header__label,:host(cds-modal-label){font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333);letter-spacing:var(--cds-label-01-letter-spacing,.32px);margin-bottom:.25rem;color:var(--cds-text-secondary,#525252)}.cds--modal-header__heading,:host(cds-modal-heading){font-size:var(--cds-heading-03-font-size,1.25rem);font-weight:var(--cds-heading-03-font-weight,400);line-height:var(--cds-heading-03-line-height,1.4);letter-spacing:var(--cds-heading-03-letter-spacing,0);padding-right:calc(20% - 3rem);color:var(--cds-text-primary,#161616)}.cds--modal-container--xs .cds--modal-content__regular-content{padding-right:1rem}.cds--modal-container--xs .cds--modal-content>p,.cds--modal-container--xs :host(cds-modal-body)>p{padding-right:0}@media (min-width:42rem){.cds--modal-container--xs{width:48%}}@media (min-width:66rem){.cds--modal-container--xs{width:32%;max-height:48%}}@media (min-width:82rem){.cds--modal-container--xs{width:24%}}.cds--modal-container--sm .cds--modal-content__regular-content{padding-right:1rem}.cds--modal-container--sm .cds--modal-content>p,.cds--modal-container--sm :host(cds-modal-body)>p{padding-right:0}@media (min-width:42rem){.cds--modal-container--sm{width:60%}}@media (min-width:66rem){.cds--modal-container--sm{width:42%;max-height:72%}.cds--modal-container--sm .cds--modal-content>p,.cds--modal-container--sm .cds--modal-content__regular-content,.cds--modal-container--sm :host(cds-modal-body)>p{padding-right:20%}}@media (min-width:82rem){.cds--modal-container--sm{width:36%}}@media (min-width:42rem){.cds--modal-container--lg{width:96%}}@media (min-width:66rem){.cds--modal-container--lg{width:84%;max-height:96%}}@media (min-width:82rem){.cds--modal-container--lg{width:72%}}.cds--modal-scroll-content>:last-child{padding-bottom:2rem}.cds--modal-content--overflow-indicator{position:absolute;bottom:3rem;left:0;width:100%;height:2rem;background-image:linear-gradient(to bottom,transparent,var(--cds-layer));content:"";grid-column:1/-1;grid-row:2/-2;pointer-events:none}@media not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent){.cds--modal-content--overflow-indicator{background-image:linear-gradient(to bottom,rgba(var(--cds-layer),0),var(--cds-layer))}}}.cds--modal-content:focus~.cds--modal-content--overflow-indicator,:focus:host(cds-modal-body)~.cds--modal-content--overflow-indicator{width:calc(100% - 4px);margin:0 2px 2px}@media screen and (-ms-high-contrast:active){.cds--modal-scroll-content>:last-child{padding-bottom:0}.cds--modal-content--overflow-indicator{display:none}}.cds--modal-footer{display:flex;height:4rem;justify-content:flex-end;margin-top:auto;grid-column:1/-1;grid-row:-1/-1}.cds--modal-footer .cds--btn{max-width:none;height:4rem;flex:0 1 50%;align-items:baseline;padding-top:.875rem;padding-bottom:2rem;margin:0}.cds--modal-footer--three-button .cds--btn{flex:0 1 25%;align-items:flex-start}.cds--modal-close{position:absolute;z-index:2;top:0;right:0;overflow:hidden;width:3rem;height:3rem;padding:.75rem;border:2px solid transparent;background-color:transparent;cursor:pointer;transition:background-color 110ms cubic-bezier(.2,0,.38,.9)}.cds--modal-close:hover{background-color:var(--cds-layer-hover)}.cds--modal-close:focus{border-color:var(--cds-focus,#0f62fe);outline:0}.cds--modal-close::-moz-focus-inner{border:0}.cds--modal-close__icon{width:1.25rem;height:1.25rem;fill:var(--cds-icon-primary,#161616)}.cds--body--with-modal-open{overflow:hidden}.cds--body--with-modal-open .cds--modal .cds--overflow-menu-options,.cds--body--with-modal-open .cds--modal .cds--tooltip,.cds--body--with-modal-open :host(cds-modal[open]) .cds--overflow-menu-options,.cds--body--with-modal-open :host(cds-modal[open]) .cds--tooltip{z-index:9000}.cds--modal-container--full-width .cds--modal-content,.cds--modal-container--full-width :host(cds-modal-body){padding:0;margin:0}@media screen and (-ms-high-contrast:active),(forced-colors:active){.cds--modal-close__icon{fill:ButtonText}}@media screen and (-ms-high-contrast:active),(forced-colors:active){.cds--modal-close:focus{color:Highlight;outline:1px solid Highlight}}:host(cds-modal){position:fixed;top:0;bottom:0;width:100vw;height:100vh;z-index:z("modal");display:flex;align-items:center;justify-content:center;content:"";background-color:var(--cds-overlay,rgba(22,22,22,.5));opacity:0;visibility:hidden;transition:background-color .7s cubic-bezier(.4,.14,1,1),opacity 240ms cubic-bezier(.4,.14,1,1),z-index .7s cubic-bezier(.4,.14,1,1),visibility 240ms cubic-bezier(.4,.14,1,1)}:host(cds-modal) .cds--select-input,:host(cds-modal) .cds--text-input{background-color:var(--cds-field-02,#fff)}@media (min-width:42rem){:host(cds-modal) .cds--modal-container ::slotted(cds-modal-body),:host(cds-modal) .cds--modal-container ::slotted(cds-modal-header){padding-right:20%}}:host(cds-modal) .cds--modal-container--sm ::slotted(cds-modal-header),:host(cds-modal) .cds--modal-container--xl ::slotted(cds-modal-header),:host(cds-modal) .cds--modal-container--xs ::slotted(cds-modal-header){padding-right:3rem}:host(cds-modal) .cds--modal-container--sm ::slotted(cds-modal-body),:host(cds-modal) .cds--modal-container--xl ::slotted(cds-modal-body),:host(cds-modal) .cds--modal-container--xs ::slotted(cds-modal-body){padding-right:1rem}@media (min-width:82rem){:host(cds-modal) .cds--modal-container--sm ::slotted(cds-modal-body),:host(cds-modal) .cds--modal-container--sm ::slotted(cds-modal-header){padding-right:20%}}@media (min-width:42rem){:host(cds-modal) .cds--modal-container--lg ::slotted(cds-modal-body),:host(cds-modal) .cds--modal-container--lg ::slotted(cds-modal-header){padding-right:20%}}:host(cds-modal[open]){opacity:1;visibility:inherit}:host(cds-modal-close-button){outline:0}:host(cds-modal-heading),:host(cds-modal-label){display:block}:host(cds-modal-footer) .cds--modal-footer--three-button ::slotted(cds-button),:host(cds-modal-footer) .cds--modal-footer--three-button ::slotted(cds-modal-footer-button){flex:0 1 25%}:host(cds-modal-footer) ::slotted(cds-button),:host(cds-modal-footer-button){flex:0 1 50%;max-width:none;width:50%;height:4rem;margin:0;padding-bottom:2rem}:host(cds-modal-footer-button) .cds--btn{padding-top:1rem;padding-bottom:2rem;box-shadow:-.0625rem 0 0 0 var(--cds-button-separator,#e0e0e0)}:host(cds-modal-footer-button:first-of-type) .cds--btn{box-shadow:inherit}:host(cds-modal-footer-button) .cds--btn:focus,:host(cds-modal-footer-button):first-of-type .cds--btn:focus{box-shadow:inset 0 0 0 1px var(--cds-focus,#0f62fe),inset 0 0 0 2px var(--cds-background,#fff)}',
 ]);

package/es/components/modal/modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["components/modal/modal.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAIpC,OAAO,EAAE,UAAU,EAAE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCtB;;;;;;;;;GASG;AACH,cACM,OAAQ,SAAQ,YAA6B;IACjD;;OAEG;IACH,OAAO,CAAC,SAAS,CAAwB;IAEzC;;OAEG;IAEH,OAAO,CAAC,kBAAkB,CAAqB;IAE/C;;OAEG;IAEH,OAAO,CAAC,gBAAgB,CAAqB;IAE7C;;;;OAIG;IAGH,OAAO,CAAC,YAAY,CAIlB;IAEF;;;;OAIG;IAGH,OAAO,CAAC,WAAW,CA+CjB;IAIF,OAAO,CAAC,cAAc,CAIpB;IAEF;;;;OAIG;IACH,OAAO,CAAC,qBAAqB;IAU7B;;;;OAIG;IACH,OAAO,CAAC,yBAAyB;IA0BjC;;OAEG;IAEH,cAAc,SAAM;IAEpB;;OAEG;IAEH,IAAI,UAAS;IAEb;;OAEG;IAEH,IAAI,aAAsB;IAE1B,MAAM;IAiCA,OAAO,CAAC,iBAAiB,KAAA;IAgC/B;;;OAGG;IACH,OAAO,CAAC,MAAM,CAAC,MAAM;IAMrB;;OAEG;IACH,MAAM,KAAK,mBAAmB,WAE7B;IAED;;OAEG;IACH,MAAM,KAAK,gBAAgB,WAE1B;IAED;;OAEG;IACH,MAAM,KAAK,oBAAoB,WAE9B;IAED;;;OAGG;IACH,MAAM,KAAK,gBAAgB,WAE1B;IAED;;OAEG;IACH,MAAM,KAAK,UAAU,WAEpB;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,OAAO,CAAC","file":"modal.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, customElement, query } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { MODAL_SIZE } from './defs';\nimport styles from './modal.scss';\nimport { selectorTabbable } from '../../globals/settings';\n\nexport { MODAL_SIZE };\n\n// eslint-disable-next-line no-bitwise\nconst PRECEDING =\n  Node.DOCUMENT_POSITION_PRECEDING | Node.DOCUMENT_POSITION_CONTAINS;\n// eslint-disable-next-line no-bitwise\nconst FOLLOWING =\n  Node.DOCUMENT_POSITION_FOLLOWING | Node.DOCUMENT_POSITION_CONTAINED_BY;\n\n/**\n * Tries to focus on the given elements and bails out if one of them is successful.\n *\n * @param elems The elements.\n * @param reverse `true` to go through the list in reverse order.\n * @returns `true` if one of the attempts is successful, `false` otherwise.\n */\nfunction tryFocusElems(\n  elems: NodeListOf<HTMLElement>,\n  reverse: boolean = false\n) {\n  if (!reverse) {\n    for (let i = 0; i < elems.length; ++i) {\n      const elem = elems[i];\n      elem.focus();\n      if (elem.ownerDocument!.activeElement === elem) {\n        return true;\n      }\n    }\n  } else {\n    for (let i = elems.length - 1; i >= 0; --i) {\n      const elem = elems[i];\n      elem.focus();\n      if (elem.ownerDocument!.activeElement === elem) {\n        return true;\n      }\n    }\n  }\n  return false;\n}\n\n/**\n * Modal.\n *\n * @element cds-modal\n * @csspart dialog The dialog.\n * @fires cds-modal-beingclosed\n *   The custom event fired before this modal is being closed upon a user gesture.\n *   Cancellation of this event stops the user-initiated action of closing this modal.\n * @fires cds-modal-closed - The custom event fired after this modal is closed upon a user gesture.\n */\n@customElement(`${prefix}-modal`)\nclass BXModal extends HostListenerMixin(LitElement) {\n  /**\n   * The element that had focus before this modal gets open.\n   */\n  private _launcher: Element | null = null;\n\n  /**\n   * Node to track focus going outside of modal content.\n   */\n  @query('#start-sentinel')\n  private _startSentinelNode!: HTMLAnchorElement;\n\n  /**\n   * Node to track focus going outside of modal content.\n   */\n  @query('#end-sentinel')\n  private _endSentinelNode!: HTMLAnchorElement;\n\n  /**\n   * Handles `click` event on this element.\n   *\n   * @param event The event.\n   */\n  @HostListener('click')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleClick = (event: MouseEvent) => {\n    if (event.composedPath().indexOf(this.shadowRoot!) < 0) {\n      this._handleUserInitiatedClose(event.target);\n    }\n  };\n\n  /**\n   * Handles `blur` event on this element.\n   *\n   * @param event The event.\n   */\n  @HostListener('shadowRoot:focusout')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleBlur = async ({ target, relatedTarget }: FocusEvent) => {\n    const {\n      open,\n      _startSentinelNode: startSentinelNode,\n      _endSentinelNode: endSentinelNode,\n    } = this;\n    const oldContains = target !== this && this.contains(target as Node);\n    const currentContains =\n      relatedTarget !== this &&\n      (this.contains(relatedTarget as Node) ||\n        (this.shadowRoot?.contains(relatedTarget as Node) &&\n          relatedTarget !== (endSentinelNode as Node)));\n\n    // Performs focus wrapping if _all_ of the following is met:\n    // * This modal is open\n    // * The viewport still has focus\n    // * Modal body used to have focus but no longer has focus\n    const { selectorTabbable: selectorTabbableForModal } = this\n      .constructor as typeof BXModal;\n    if (open && relatedTarget && oldContains && !currentContains) {\n      const comparisonResult = (target as Node).compareDocumentPosition(\n        relatedTarget as Node\n      );\n      // eslint-disable-next-line no-bitwise\n      if (relatedTarget === startSentinelNode || comparisonResult & PRECEDING) {\n        await (this.constructor as typeof BXModal)._delay();\n        if (\n          !tryFocusElems(\n            this.querySelectorAll(selectorTabbableForModal),\n            true\n          ) &&\n          relatedTarget !== this\n        ) {\n          this.focus();\n        }\n      }\n      // eslint-disable-next-line no-bitwise\n      else if (\n        relatedTarget === endSentinelNode ||\n        comparisonResult & FOLLOWING\n      ) {\n        await (this.constructor as typeof BXModal)._delay();\n        if (!tryFocusElems(this.querySelectorAll(selectorTabbableForModal))) {\n          this.focus();\n        }\n      }\n    }\n  };\n\n  @HostListener('document:keydown')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleKeydown = ({ key, target }: KeyboardEvent) => {\n    if (key === 'Esc' || key === 'Escape') {\n      this._handleUserInitiatedClose(target);\n    }\n  };\n\n  /**\n   * Handles `click` event on the modal container.\n   *\n   * @param event The event.\n   */\n  private _handleClickContainer(event: MouseEvent) {\n    if (\n      (event.target as Element).matches(\n        (this.constructor as typeof BXModal).selectorCloseButton\n      )\n    ) {\n      this._handleUserInitiatedClose(event.target);\n    }\n  }\n\n  /**\n   * Handles user-initiated close request of this modal.\n   *\n   * @param triggeredBy The element that triggered this close request.\n   */\n  private _handleUserInitiatedClose(triggeredBy: EventTarget | null) {\n    if (this.open) {\n      const init = {\n        bubbles: true,\n        cancelable: true,\n        composed: true,\n        detail: {\n          triggeredBy,\n        },\n      };\n      if (\n        this.dispatchEvent(\n          new CustomEvent(\n            (this.constructor as typeof BXModal).eventBeforeClose,\n            init\n          )\n        )\n      ) {\n        this.open = false;\n        this.dispatchEvent(\n          new CustomEvent((this.constructor as typeof BXModal).eventClose, init)\n        );\n      }\n    }\n  }\n\n  /**\n   * The additional CSS class names for the container <div> of the element.\n   */\n  @property({ attribute: 'container-class' })\n  containerClass = '';\n\n  /**\n   * `true` if the modal should be open.\n   */\n  @property({ type: Boolean, reflect: true })\n  open = false;\n\n  /**\n   * Modal size.\n   */\n  @property({ reflect: true })\n  size = MODAL_SIZE.REGULAR;\n\n  render() {\n    const { size } = this;\n    const containerClass = this.containerClass\n      .split(' ')\n      .filter(Boolean)\n      .reduce((acc, item) => ({ ...acc, [item]: true }), {});\n    const containerClasses = classMap({\n      [`${prefix}--modal-container`]: true,\n      [`${prefix}--modal-container--${size}`]: size,\n      ...containerClass,\n    });\n    return html`\n      <a\n        id=\"start-sentinel\"\n        class=\"${prefix}--visually-hidden\"\n        href=\"javascript:void 0\"\n        role=\"navigation\"></a>\n      <div\n        part=\"dialog\"\n        class=${containerClasses}\n        role=\"dialog\"\n        tabindex=\"-1\"\n        @click=${this._handleClickContainer}>\n        <slot></slot>\n      </div>\n      <a\n        id=\"end-sentinel\"\n        class=\"${prefix}--visually-hidden\"\n        href=\"javascript:void 0\"\n        role=\"navigation\"></a>\n    `;\n  }\n\n  async updated(changedProperties) {\n    if (changedProperties.has('open')) {\n      if (this.open) {\n        this._launcher = this.ownerDocument!.activeElement;\n        const primaryFocusNode = this.querySelector(\n          (this.constructor as typeof BXModal).selectorPrimaryFocus\n        );\n        await (this.constructor as typeof BXModal)._delay();\n        if (primaryFocusNode) {\n          // For cases where a `carbon-web-components` component (e.g. `<cds-btn>`) being `primaryFocusNode`,\n          // where its first update/render cycle that makes it focusable happens after `<cds-modal>`'s first update/render cycle\n          (primaryFocusNode as HTMLElement).focus();\n        } else if (\n          !tryFocusElems(\n            this.querySelectorAll(\n              (this.constructor as typeof BXModal).selectorTabbable\n            ),\n            true\n          )\n        ) {\n          this.focus();\n        }\n      } else if (\n        this._launcher &&\n        typeof (this._launcher as HTMLElement).focus === 'function'\n      ) {\n        (this._launcher as HTMLElement).focus();\n        this._launcher = null;\n      }\n    }\n  }\n\n  /**\n   * @param ms The number of milliseconds.\n   * @returns A promise that is resolves after the given milliseconds.\n   */\n  private static _delay(ms: number = 0) {\n    return new Promise((resolve) => {\n      setTimeout(resolve, ms);\n    });\n  }\n\n  /**\n   * A selector selecting buttons that should close this modal.\n   */\n  static get selectorCloseButton() {\n    return `[data-modal-close],${prefix}-modal-close-button`;\n  }\n\n  /**\n   * A selector selecting tabbable nodes.\n   */\n  static get selectorTabbable() {\n    return selectorTabbable;\n  }\n\n  /**\n   * A selector selecting the nodes that should be focused when modal gets open.\n   */\n  static get selectorPrimaryFocus() {\n    return `[data-modal-primary-focus],${prefix}-modal-footer ${prefix}-btn[kind=\"primary\"]`;\n  }\n\n  /**\n   * The name of the custom event fired before this modal is being closed upon a user gesture.\n   * Cancellation of this event stops the user-initiated action of closing this modal.\n   */\n  static get eventBeforeClose() {\n    return `${prefix}-modal-beingclosed`;\n  }\n\n  /**\n   * The name of the custom event fired after this modal is closed upon a user gesture.\n   */\n  static get eventClose() {\n    return `${prefix}-modal-closed`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXModal;\n"]}
+{"version":3,"sources":["components/modal/modal.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAGH,OAAO,EAAE,UAAU,EAAQ,MAAM,KAAK,CAAC;AAKvC,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAC;AAIpC,OAAO,EAAE,UAAU,EAAE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCtB;;;;;;;;;GASG;AACH,cACM,OAAQ,SAAQ,YAA6B;IACjD;;OAEG;IACH,OAAO,CAAC,SAAS,CAAwB;IAEzC;;OAEG;IAEH,OAAO,CAAC,kBAAkB,CAAqB;IAE/C;;OAEG;IAEH,OAAO,CAAC,gBAAgB,CAAqB;IAE7C;;;;OAIG;IAGH,OAAO,CAAC,YAAY,CAIlB;IAEF;;;;OAIG;IAGH,OAAO,CAAC,WAAW,CA+CjB;IAIF,OAAO,CAAC,cAAc,CAIpB;IAEF;;;;OAIG;IACH,OAAO,CAAC,qBAAqB;IAU7B;;;;OAIG;IACH,OAAO,CAAC,yBAAyB;IA0BjC;;OAEG;IAEH,cAAc,SAAM;IAEpB;;OAEG;IAEH,IAAI,UAAS;IAEb;;OAEG;IAEH,IAAI,aAAsB;IAE1B,MAAM;IAiCA,OAAO,CAAC,iBAAiB,KAAA;IAgC/B;;;OAGG;IACH,OAAO,CAAC,MAAM,CAAC,MAAM;IAMrB;;OAEG;IACH,MAAM,KAAK,mBAAmB,WAE7B;IAED;;OAEG;IACH,MAAM,KAAK,gBAAgB,WAE1B;IAED;;OAEG;IACH,MAAM,KAAK,oBAAoB,WAE9B;IAED;;;OAGG;IACH,MAAM,KAAK,gBAAgB,WAE1B;IAED;;OAEG;IACH,MAAM,KAAK,UAAU,WAEpB;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAED,eAAe,OAAO,CAAC","file":"modal.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property, customElement, query } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { MODAL_SIZE } from './defs';\nimport styles from './modal.scss';\nimport { selectorTabbable } from '../../globals/settings';\n\nexport { MODAL_SIZE };\n\n// eslint-disable-next-line no-bitwise\nconst PRECEDING =\n  Node.DOCUMENT_POSITION_PRECEDING | Node.DOCUMENT_POSITION_CONTAINS;\n// eslint-disable-next-line no-bitwise\nconst FOLLOWING =\n  Node.DOCUMENT_POSITION_FOLLOWING | Node.DOCUMENT_POSITION_CONTAINED_BY;\n\n/**\n * Tries to focus on the given elements and bails out if one of them is successful.\n *\n * @param elems The elements.\n * @param reverse `true` to go through the list in reverse order.\n * @returns `true` if one of the attempts is successful, `false` otherwise.\n */\nfunction tryFocusElems(\n  elems: NodeListOf<HTMLElement>,\n  reverse: boolean = false\n) {\n  if (!reverse) {\n    for (let i = 0; i < elems.length; ++i) {\n      const elem = elems[i];\n      elem.focus();\n      if (elem.ownerDocument!.activeElement === elem) {\n        return true;\n      }\n    }\n  } else {\n    for (let i = elems.length - 1; i >= 0; --i) {\n      const elem = elems[i];\n      elem.focus();\n      if (elem.ownerDocument!.activeElement === elem) {\n        return true;\n      }\n    }\n  }\n  return false;\n}\n\n/**\n * Modal.\n *\n * @element cds-modal\n * @csspart dialog The dialog.\n * @fires cds-modal-beingclosed\n *   The custom event fired before this modal is being closed upon a user gesture.\n *   Cancellation of this event stops the user-initiated action of closing this modal.\n * @fires cds-modal-closed - The custom event fired after this modal is closed upon a user gesture.\n */\n@customElement(`${prefix}-modal`)\nclass BXModal extends HostListenerMixin(LitElement) {\n  /**\n   * The element that had focus before this modal gets open.\n   */\n  private _launcher: Element | null = null;\n\n  /**\n   * Node to track focus going outside of modal content.\n   */\n  @query('#start-sentinel')\n  private _startSentinelNode!: HTMLAnchorElement;\n\n  /**\n   * Node to track focus going outside of modal content.\n   */\n  @query('#end-sentinel')\n  private _endSentinelNode!: HTMLAnchorElement;\n\n  /**\n   * Handles `click` event on this element.\n   *\n   * @param event The event.\n   */\n  @HostListener('click')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleClick = (event: MouseEvent) => {\n    if (event.composedPath().indexOf(this.shadowRoot!) < 0) {\n      this._handleUserInitiatedClose(event.target);\n    }\n  };\n\n  /**\n   * Handles `blur` event on this element.\n   *\n   * @param event The event.\n   */\n  @HostListener('shadowRoot:focusout')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleBlur = async ({ target, relatedTarget }: FocusEvent) => {\n    const {\n      open,\n      _startSentinelNode: startSentinelNode,\n      _endSentinelNode: endSentinelNode,\n    } = this;\n    const oldContains = target !== this && this.contains(target as Node);\n    const currentContains =\n      relatedTarget !== this &&\n      (this.contains(relatedTarget as Node) ||\n        (this.shadowRoot?.contains(relatedTarget as Node) &&\n          relatedTarget !== (endSentinelNode as Node)));\n\n    // Performs focus wrapping if _all_ of the following is met:\n    // * This modal is open\n    // * The viewport still has focus\n    // * Modal body used to have focus but no longer has focus\n    const { selectorTabbable: selectorTabbableForModal } = this\n      .constructor as typeof BXModal;\n    if (open && relatedTarget && oldContains && !currentContains) {\n      const comparisonResult = (target as Node).compareDocumentPosition(\n        relatedTarget as Node\n      );\n      // eslint-disable-next-line no-bitwise\n      if (relatedTarget === startSentinelNode || comparisonResult & PRECEDING) {\n        await (this.constructor as typeof BXModal)._delay();\n        if (\n          !tryFocusElems(\n            this.querySelectorAll(selectorTabbableForModal),\n            true\n          ) &&\n          relatedTarget !== this\n        ) {\n          this.focus();\n        }\n      }\n      // eslint-disable-next-line no-bitwise\n      else if (\n        relatedTarget === endSentinelNode ||\n        comparisonResult & FOLLOWING\n      ) {\n        await (this.constructor as typeof BXModal)._delay();\n        if (!tryFocusElems(this.querySelectorAll(selectorTabbableForModal))) {\n          this.focus();\n        }\n      }\n    }\n  };\n\n  @HostListener('document:keydown')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleKeydown = ({ key, target }: KeyboardEvent) => {\n    if (key === 'Esc' || key === 'Escape') {\n      this._handleUserInitiatedClose(target);\n    }\n  };\n\n  /**\n   * Handles `click` event on the modal container.\n   *\n   * @param event The event.\n   */\n  private _handleClickContainer(event: MouseEvent) {\n    if (\n      (event.target as Element).matches(\n        (this.constructor as typeof BXModal).selectorCloseButton\n      )\n    ) {\n      this._handleUserInitiatedClose(event.target);\n    }\n  }\n\n  /**\n   * Handles user-initiated close request of this modal.\n   *\n   * @param triggeredBy The element that triggered this close request.\n   */\n  private _handleUserInitiatedClose(triggeredBy: EventTarget | null) {\n    if (this.open) {\n      const init = {\n        bubbles: true,\n        cancelable: true,\n        composed: true,\n        detail: {\n          triggeredBy,\n        },\n      };\n      if (\n        this.dispatchEvent(\n          new CustomEvent(\n            (this.constructor as typeof BXModal).eventBeforeClose,\n            init\n          )\n        )\n      ) {\n        this.open = false;\n        this.dispatchEvent(\n          new CustomEvent((this.constructor as typeof BXModal).eventClose, init)\n        );\n      }\n    }\n  }\n\n  /**\n   * The additional CSS class names for the container <div> of the element.\n   */\n  @property({ attribute: 'container-class' })\n  containerClass = '';\n\n  /**\n   * `true` if the modal should be open.\n   */\n  @property({ type: Boolean, reflect: true })\n  open = false;\n\n  /**\n   * Modal size.\n   */\n  @property({ reflect: true })\n  size = MODAL_SIZE.REGULAR;\n\n  render() {\n    const { size } = this;\n    const containerClass = this.containerClass\n      .split(' ')\n      .filter(Boolean)\n      .reduce((acc, item) => ({ ...acc, [item]: true }), {});\n    const containerClasses = classMap({\n      [`${prefix}--modal-container`]: true,\n      [`${prefix}--modal-container--${size}`]: size,\n      ...containerClass,\n    });\n    return html`\n      <a\n        id=\"start-sentinel\"\n        class=\"${prefix}--visually-hidden\"\n        href=\"javascript:void 0\"\n        role=\"navigation\"></a>\n      <div\n        part=\"dialog\"\n        class=${containerClasses}\n        role=\"dialog\"\n        tabindex=\"-1\"\n        @click=${this._handleClickContainer}>\n        <slot></slot>\n      </div>\n      <a\n        id=\"end-sentinel\"\n        class=\"${prefix}--visually-hidden\"\n        href=\"javascript:void 0\"\n        role=\"navigation\"></a>\n    `;\n  }\n\n  async updated(changedProperties) {\n    if (changedProperties.has('open')) {\n      if (this.open) {\n        this._launcher = this.ownerDocument!.activeElement;\n        const primaryFocusNode = this.querySelector(\n          (this.constructor as typeof BXModal).selectorPrimaryFocus\n        );\n        await (this.constructor as typeof BXModal)._delay();\n        if (primaryFocusNode) {\n          // For cases where a `carbon-web-components` component (e.g. `<cds-button>`) being `primaryFocusNode`,\n          // where its first update/render cycle that makes it focusable happens after `<cds-modal>`'s first update/render cycle\n          (primaryFocusNode as HTMLElement).focus();\n        } else if (\n          !tryFocusElems(\n            this.querySelectorAll(\n              (this.constructor as typeof BXModal).selectorTabbable\n            ),\n            true\n          )\n        ) {\n          this.focus();\n        }\n      } else if (\n        this._launcher &&\n        typeof (this._launcher as HTMLElement).focus === 'function'\n      ) {\n        (this._launcher as HTMLElement).focus();\n        this._launcher = null;\n      }\n    }\n  }\n\n  /**\n   * @param ms The number of milliseconds.\n   * @returns A promise that is resolves after the given milliseconds.\n   */\n  private static _delay(ms: number = 0) {\n    return new Promise((resolve) => {\n      setTimeout(resolve, ms);\n    });\n  }\n\n  /**\n   * A selector selecting buttons that should close this modal.\n   */\n  static get selectorCloseButton() {\n    return `[data-modal-close],${prefix}-modal-close-button`;\n  }\n\n  /**\n   * A selector selecting tabbable nodes.\n   */\n  static get selectorTabbable() {\n    return selectorTabbable;\n  }\n\n  /**\n   * A selector selecting the nodes that should be focused when modal gets open.\n   */\n  static get selectorPrimaryFocus() {\n    return `[data-modal-primary-focus],${prefix}-modal-footer ${prefix}-button[kind=\"primary\"]`;\n  }\n\n  /**\n   * The name of the custom event fired before this modal is being closed upon a user gesture.\n   * Cancellation of this event stops the user-initiated action of closing this modal.\n   */\n  static get eventBeforeClose() {\n    return `${prefix}-modal-beingclosed`;\n  }\n\n  /**\n   * The name of the custom event fired after this modal is closed upon a user gesture.\n   */\n  static get eventClose() {\n    return `${prefix}-modal-closed`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXModal;\n"]}

package/es/components/modal/modal.js

@@ -306,7 +306,7 @@ let BXModal = _decorate([customElement(`${prefix}-modal`)], function (_initializ
             const primaryFocusNode = this.querySelector(this.constructor.selectorPrimaryFocus);
             await this.constructor._delay();
             if (primaryFocusNode) {
-              // For cases where a `carbon-web-components` component (e.g. `<cds-btn>`) being `primaryFocusNode`,
+              // For cases where a `carbon-web-components` component (e.g. `<cds-button>`) being `primaryFocusNode`,
               // where its first update/render cycle that makes it focusable happens after `<cds-modal>`'s first update/render cycle
               primaryFocusNode.focus();
             } else if (!tryFocusElems(this.querySelectorAll(this.constructor.selectorTabbable), true)) {
@@ -363,7 +363,7 @@ let BXModal = _decorate([customElement(`${prefix}-modal`)], function (_initializ
       static: true,
       key: "selectorPrimaryFocus",
       value: function selectorPrimaryFocus() {
-        return `[data-modal-primary-focus],${prefix}-modal-footer ${prefix}-btn[kind="primary"]`;
+        return `[data-modal-primary-focus],${prefix}-modal-footer ${prefix}-button[kind="primary"]`;
       }
 
       /**