@carbon/ibmdotcom-web-components 1.30.0-rc.2 → 1.30.0-rc.3

package/es/components/card-section-images/card-section-images.js.map

@@ -1 +1 @@
-{"version":3,"file":"card-section-images.js","names":["_litElement","require","_deprecate","_interopRequireDefault","_settings","_stableSelector","_cardSectionImagesCss","_contentSection","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf2","result","NewTarget","constructor","Reflect","construct","arguments","apply","_possibleConstructorReturn2","sham","Proxy","Boolean","prototype","valueOf","call","e","ddsPrefix","ddsSettings","stablePrefix","DDSCardSectionImages","_decorate2","customElement","concat","_initialize","_StableSelectorMixin","_StableSelectorMixin2","_inherits2","_super","_this","_classCallCheck2","_len","length","args","Array","_key","_assertThisInitialized2","_createClass2","F","d","kind","key","value","stableSelector","styles","StableSelectorMixin","DDSContentSection","_default","deprecate","exports"],"sources":["components/card-section-images/card-section-images.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2022\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-element';\nimport deprecate from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/deprecate/deprecate';\nimport ddsSettings from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings';\nimport StableSelectorMixin from '../../globals/mixins/stable-selector';\n\nimport styles from './card-section-images.scss';\nimport DDSContentSection from '../content-section/content-section';\n\nconst { stablePrefix: ddsPrefix } = ddsSettings;\n\n/**\n * The Card Section Images pattern\n *\n * @element dds-card-section-images\n */\n@customElement(`${ddsPrefix}-card-section-images`)\nclass DDSCardSectionImages extends StableSelectorMixin(DDSContentSection) {\n  static get stableSelector() {\n    return `${ddsPrefix}--card-section-images`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default deprecate(\n  /* @__GENERATE_REACT_CUSTOM_ELEMENT_TYPE__ */\n  DDSCardSectionImages,\n  'The dds-card-section-images component has been merged with the dds-card-section component ' +\n    'See dds-card-section documentation for more information.'\n);\n"],"mappings":";;;;;;;;;;;;;;AASA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,UAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,SAAA,GAAAD,sBAAA,CAAAF,OAAA;AACA,IAAAI,eAAA,GAAAF,sBAAA,CAAAF,OAAA;AAEA,IAAAK,qBAAA,GAAAH,sBAAA,CAAAF,OAAA;AACA,IAAAM,eAAA,GAAAJ,sBAAA,CAAAF,OAAA;AAAmE,SAAAO,aAAAC,OAAA,QAAAC,yBAAA,GAAAC,yBAAA,oBAAAC,qBAAA,QAAAC,KAAA,OAAAC,gBAAA,aAAAL,OAAA,GAAAM,MAAA,MAAAL,yBAAA,QAAAM,SAAA,OAAAF,gBAAA,mBAAAG,WAAA,EAAAF,MAAA,GAAAG,OAAA,CAAAC,SAAA,CAAAN,KAAA,EAAAO,SAAA,EAAAJ,SAAA,YAAAD,MAAA,GAAAF,KAAA,CAAAQ,KAAA,OAAAD,SAAA,gBAAAE,2BAAA,mBAAAP,MAAA;AAAA,SAAAJ,0BAAA,eAAAO,OAAA,qBAAAA,OAAA,CAAAC,SAAA,oBAAAD,OAAA,CAAAC,SAAA,CAAAI,IAAA,2BAAAC,KAAA,oCAAAC,OAAA,CAAAC,SAAA,CAAAC,OAAA,CAAAC,IAAA,CAAAV,OAAA,CAAAC,SAAA,CAAAM,OAAA,8CAAAI,CAAA;AAEnE,IAAsBC,SAAS,GAAKC,oBAAW,CAAvCC,YAAY;;AAEpB;AACA;AACA;AACA;AACA;AAJA,IAMMC,oBAAoB,OAAAC,UAAA,cADzB,IAAAC,yBAAa,KAAAC,MAAA,CAAIN,SAAS,0BAAuB,aAAAO,WAAA,EAAAC,oBAAA;EAAA,IAC5CL,oBAAoB,0BAAAM,qBAAA;IAAA,IAAAC,UAAA,aAAAP,oBAAA,EAAAM,qBAAA;IAAA,IAAAE,MAAA,GAAAjC,YAAA,CAAAyB,oBAAA;IAAA,SAAAA,qBAAA;MAAA,IAAAS,KAAA;MAAA,IAAAC,gBAAA,mBAAAV,oBAAA;MAAA,SAAAW,IAAA,GAAAxB,SAAA,CAAAyB,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAH,IAAA,GAAAI,IAAA,MAAAA,IAAA,GAAAJ,IAAA,EAAAI,IAAA;QAAAF,IAAA,CAAAE,IAAA,IAAA5B,SAAA,CAAA4B,IAAA;MAAA;MAAAN,KAAA,GAAAD,MAAA,CAAAb,IAAA,CAAAP,KAAA,CAAAoB,MAAA,SAAAL,MAAA,CAAAU,IAAA;MAAAT,WAAA,KAAAY,uBAAA,aAAAP,KAAA;MAAA,OAAAA,KAAA;IAAA;IAAA,WAAAQ,aAAA,aAAAjB,oBAAA;EAAA,EAAAK,oBAAA;EAAA;IAAAa,CAAA,EAApBlB,oBAAoB;IAAAmB,CAAA;MAAAC,IAAA;MAAA;MAAAC,GAAA;MAAAC,KAAA,EACxB,SAAAC,eAAA,EAA4B;QAC1B,UAAApB,MAAA,CAAUN,SAAS;MACrB;IAAC;MAAAuB,IAAA;MAAA;MAAAC,GAAA;MAAAC,KAAA,WAAAA,MAAA;QAAA,OAEeE,gCAAM;MAAA;IAAA;EAAA;AAAA,GALW,IAAAC,0BAAmB,EAACC,0BAAiB,CAAC;AAAA,IAAAC,QAAA,GAQ1D,IAAAC,qBAAS,GACtB;AACA5B,oBAAoB,EACpB,4FAA4F,GAC1F,0DAA0D,CAC7D;AAAA6B,OAAA,cAAAF,QAAA"}
+{"version":3,"file":"card-section-images.js","names":["_deprecate","_interopRequireDefault","require","_settings","_stableSelector","_cardSectionImagesCss","_contentSection","_carbonElement","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf2","result","NewTarget","constructor","Reflect","construct","arguments","apply","_possibleConstructorReturn2","sham","Proxy","Boolean","prototype","valueOf","call","e","ddsPrefix","ddsSettings","stablePrefix","DDSCardSectionImages","_decorate2","customElement","concat","_initialize","_StableSelectorMixin","_StableSelectorMixin2","_inherits2","_super","_this","_classCallCheck2","_len","length","args","Array","_key","_assertThisInitialized2","_createClass2","F","d","kind","key","value","stableSelector","styles","StableSelectorMixin","DDSContentSection","_default","deprecate","exports"],"sources":["components/card-section-images/card-section-images.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 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 deprecate from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/deprecate/deprecate';\nimport ddsSettings from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings';\nimport StableSelectorMixin from '../../globals/mixins/stable-selector';\n\nimport styles from './card-section-images.scss';\nimport DDSContentSection from '../content-section/content-section';\nimport { carbonElement as customElement } from '../../internal/vendor/@carbon/web-components/globals/decorators/carbon-element';\n\nconst { stablePrefix: ddsPrefix } = ddsSettings;\n\n/**\n * The Card Section Images pattern\n *\n * @element dds-card-section-images\n */\n@customElement(`${ddsPrefix}-card-section-images`)\nclass DDSCardSectionImages extends StableSelectorMixin(DDSContentSection) {\n  static get stableSelector() {\n    return `${ddsPrefix}--card-section-images`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default deprecate(\n  /* @__GENERATE_REACT_CUSTOM_ELEMENT_TYPE__ */\n  DDSCardSectionImages,\n  'The dds-card-section-images component has been merged with the dds-card-section component ' +\n    'See dds-card-section documentation for more information.'\n);\n"],"mappings":";;;;;;;;;;;;;;AASA,IAAAA,UAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,eAAA,GAAAH,sBAAA,CAAAC,OAAA;AAEA,IAAAG,qBAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,eAAA,GAAAL,sBAAA,CAAAC,OAAA;AACA,IAAAK,cAAA,GAAAL,OAAA;AAAgI,SAAAM,aAAAC,OAAA,QAAAC,yBAAA,GAAAC,yBAAA,oBAAAC,qBAAA,QAAAC,KAAA,OAAAC,gBAAA,aAAAL,OAAA,GAAAM,MAAA,MAAAL,yBAAA,QAAAM,SAAA,OAAAF,gBAAA,mBAAAG,WAAA,EAAAF,MAAA,GAAAG,OAAA,CAAAC,SAAA,CAAAN,KAAA,EAAAO,SAAA,EAAAJ,SAAA,YAAAD,MAAA,GAAAF,KAAA,CAAAQ,KAAA,OAAAD,SAAA,gBAAAE,2BAAA,mBAAAP,MAAA;AAAA,SAAAJ,0BAAA,eAAAO,OAAA,qBAAAA,OAAA,CAAAC,SAAA,oBAAAD,OAAA,CAAAC,SAAA,CAAAI,IAAA,2BAAAC,KAAA,oCAAAC,OAAA,CAAAC,SAAA,CAAAC,OAAA,CAAAC,IAAA,CAAAV,OAAA,CAAAC,SAAA,CAAAM,OAAA,8CAAAI,CAAA;AAEhI,IAAsBC,SAAS,GAAKC,oBAAW,CAAvCC,YAAY;;AAEpB;AACA;AACA;AACA;AACA;AAJA,IAMMC,oBAAoB,OAAAC,UAAA,cADzB,IAAAC,4BAAa,KAAAC,MAAA,CAAIN,SAAS,0BAAuB,aAAAO,WAAA,EAAAC,oBAAA;EAAA,IAC5CL,oBAAoB,0BAAAM,qBAAA;IAAA,IAAAC,UAAA,aAAAP,oBAAA,EAAAM,qBAAA;IAAA,IAAAE,MAAA,GAAAjC,YAAA,CAAAyB,oBAAA;IAAA,SAAAA,qBAAA;MAAA,IAAAS,KAAA;MAAA,IAAAC,gBAAA,mBAAAV,oBAAA;MAAA,SAAAW,IAAA,GAAAxB,SAAA,CAAAyB,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAH,IAAA,GAAAI,IAAA,MAAAA,IAAA,GAAAJ,IAAA,EAAAI,IAAA;QAAAF,IAAA,CAAAE,IAAA,IAAA5B,SAAA,CAAA4B,IAAA;MAAA;MAAAN,KAAA,GAAAD,MAAA,CAAAb,IAAA,CAAAP,KAAA,CAAAoB,MAAA,SAAAL,MAAA,CAAAU,IAAA;MAAAT,WAAA,KAAAY,uBAAA,aAAAP,KAAA;MAAA,OAAAA,KAAA;IAAA;IAAA,WAAAQ,aAAA,aAAAjB,oBAAA;EAAA,EAAAK,oBAAA;EAAA;IAAAa,CAAA,EAApBlB,oBAAoB;IAAAmB,CAAA;MAAAC,IAAA;MAAA;MAAAC,GAAA;MAAAC,KAAA,EACxB,SAAAC,eAAA,EAA4B;QAC1B,UAAApB,MAAA,CAAUN,SAAS;MACrB;IAAC;MAAAuB,IAAA;MAAA;MAAAC,GAAA;MAAAC,KAAA,WAAAA,MAAA;QAAA,OAEeE,gCAAM;MAAA;IAAA;EAAA;AAAA,GALW,IAAAC,0BAAmB,EAACC,0BAAiB,CAAC;AAAA,IAAAC,QAAA,GAQ1D,IAAAC,qBAAS,GACtB;AACA5B,oBAAoB,EACpB,4FAA4F,GAC1F,0DAA0D,CAC7D;AAAA6B,OAAA,cAAAF,QAAA"}

package/es/components/card-section-offset/card-section-offset.d.ts

@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2020, 2022
+ * Copyright IBM Corp. 2020, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -194,7 +194,7 @@ declare const DDSCardSectionOffset_base: {
         ariaValueMin: string | null;
         ariaValueNow: string | null;
         ariaValueText: string | null;
-        animate(keyframes: PropertyIndexedKeyframes | Keyframe[] | null, options?: number | KeyframeAnimationOptions | undefined): Animation;
+        animate(keyframes: Keyframe[] | PropertyIndexedKeyframes | null, options?: number | KeyframeAnimationOptions | undefined): Animation;
         getAnimations(options?: GetAnimationsOptions | undefined): Animation[];
         after(...nodes: (string | Node)[]): void;
         before(...nodes: (string | Node)[]): void;

package/es/components/card-section-offset/card-section-offset.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["components/card-section-offset/card-section-offset.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAMH,OAAO,eAAe,MAAM,gCAAgC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAM7D;;;;;;;GAOG;AACH,cACM,oBAAqB,SAAQ,yBAAoC;IACrE,SAAS,CAAC,0BAA0B,CAAC,KAAK,EAAE,KAAK;IAqBjD,MAAM;IAYN,MAAM,KAAK,cAAc,WAExB;IAED,MAAM,KAAK,iBAAiB,WAE3B;IAGD,MAAM,KAAK,MAAM,oCAIhB;CACF;AAGD,eAAe,oBAAoB,CAAC","file":"card-section-offset.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2022\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 { css, customElement, html } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings.js';\nimport ddsSettings from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings';\nimport StableSelectorMixin from '../../globals/mixins/stable-selector';\nimport DDSContentBlock from '../content-block/content-block';\nimport styles from './card-section-offset.scss';\n\nconst { prefix } = settings;\nconst { stablePrefix: ddsPrefix } = ddsSettings;\n\n/**\n * Card section offset.\n *\n * @element dds-card-section-offset\n * @slot heading - The heading content.\n * @slot action - The text-cta content.\n * @slot card-group - The L shaped card group content.\n */\n@customElement(`${ddsPrefix}-card-section-offset`)\nclass DDSCardSectionOffset extends StableSelectorMixin(DDSContentBlock) {\n  protected _handleSlotChangeCardGroup(event: Event) {\n    const childItems = (event.target as HTMLSlotElement).assignedNodes();\n\n    childItems.filter((elem) => {\n      if (\n        (elem as HTMLElement).matches(\n          (this.constructor as typeof DDSCardSectionOffset).cardGroupSelector\n        ) &&\n        (elem as HTMLElement).querySelectorAll(`${ddsPrefix}-card-group-item`)\n          .length === 4 &&\n        (elem as HTMLElement)\n          .querySelector(`${ddsPrefix}-card-group-item`)\n          ?.hasAttribute('empty')\n      ) {\n        return true;\n      }\n      this.querySelector('dds-card-group')!.innerHTML = '';\n      return false;\n    });\n  }\n\n  render() {\n    return html`\n      <div class=\"${prefix}--card-section-offset__content\">\n        ${this._renderHeading()}\n        <slot name=\"action\"></slot>\n      </div>\n      <slot\n        name=\"card-group\"\n        @slotchange=\"${this._handleSlotChangeCardGroup}\"></slot>\n    `;\n  }\n\n  static get stableSelector() {\n    return `${ddsPrefix}--card-section-offset`;\n  }\n\n  static get cardGroupSelector() {\n    return `${ddsPrefix}-card-group`;\n  }\n\n  // `styles` here is a `CSSResult` generated by custom WebPack loader\n  static get styles() {\n    return css`\n      ${super.styles}${styles}\n    `;\n  }\n}\n\n/* @__GENERATE_REACT_CUSTOM_ELEMENT_TYPE__ */\nexport default DDSCardSectionOffset;\n"]}
+{"version":3,"sources":["components/card-section-offset/card-section-offset.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAMH,OAAO,eAAe,MAAM,gCAAgC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAO7D;;;;;;;GAOG;AACH,cACM,oBAAqB,SAAQ,yBAAoC;IACrE,SAAS,CAAC,0BAA0B,CAAC,KAAK,EAAE,KAAK;IAqBjD,MAAM;IAYN,MAAM,KAAK,cAAc,WAExB;IAED,MAAM,KAAK,iBAAiB,WAE3B;IAGD,MAAM,KAAK,MAAM,oCAIhB;CACF;AAGD,eAAe,oBAAoB,CAAC","file":"card-section-offset.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 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 { css, html } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings.js';\nimport ddsSettings from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings';\nimport StableSelectorMixin from '../../globals/mixins/stable-selector';\nimport DDSContentBlock from '../content-block/content-block';\nimport styles from './card-section-offset.scss';\nimport { carbonElement as customElement } from '../../internal/vendor/@carbon/web-components/globals/decorators/carbon-element';\n\nconst { prefix } = settings;\nconst { stablePrefix: ddsPrefix } = ddsSettings;\n\n/**\n * Card section offset.\n *\n * @element dds-card-section-offset\n * @slot heading - The heading content.\n * @slot action - The text-cta content.\n * @slot card-group - The L shaped card group content.\n */\n@customElement(`${ddsPrefix}-card-section-offset`)\nclass DDSCardSectionOffset extends StableSelectorMixin(DDSContentBlock) {\n  protected _handleSlotChangeCardGroup(event: Event) {\n    const childItems = (event.target as HTMLSlotElement).assignedNodes();\n\n    childItems.filter((elem) => {\n      if (\n        (elem as HTMLElement).matches(\n          (this.constructor as typeof DDSCardSectionOffset).cardGroupSelector\n        ) &&\n        (elem as HTMLElement).querySelectorAll(`${ddsPrefix}-card-group-item`)\n          .length === 4 &&\n        (elem as HTMLElement)\n          .querySelector(`${ddsPrefix}-card-group-item`)\n          ?.hasAttribute('empty')\n      ) {\n        return true;\n      }\n      this.querySelector('dds-card-group')!.innerHTML = '';\n      return false;\n    });\n  }\n\n  render() {\n    return html`\n      <div class=\"${prefix}--card-section-offset__content\">\n        ${this._renderHeading()}\n        <slot name=\"action\"></slot>\n      </div>\n      <slot\n        name=\"card-group\"\n        @slotchange=\"${this._handleSlotChangeCardGroup}\"></slot>\n    `;\n  }\n\n  static get stableSelector() {\n    return `${ddsPrefix}--card-section-offset`;\n  }\n\n  static get cardGroupSelector() {\n    return `${ddsPrefix}-card-group`;\n  }\n\n  // `styles` here is a `CSSResult` generated by custom WebPack loader\n  static get styles() {\n    return css`\n      ${super.styles}${styles}\n    `;\n  }\n}\n\n/* @__GENERATE_REACT_CUSTOM_ELEMENT_TYPE__ */\nexport default DDSCardSectionOffset;\n"]}

package/es/components/card-section-offset/card-section-offset.js

@@ -20,6 +20,7 @@ var _settings2 = _interopRequireDefault(require("../../internal/vendor/@carbon/i
 var _stableSelector = _interopRequireDefault(require("../../globals/mixins/stable-selector.js"));
 var _contentBlock = _interopRequireDefault(require("../content-block/content-block.js"));
 var _cardSectionOffsetCss = _interopRequireDefault(require("././card-section-offset.css.js"));
+var _carbonElement = require("../../internal/vendor/@carbon/web-components/globals/decorators/carbon-element.js");
 var _templateObject, _templateObject2;
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -34,7 +35,7 @@ var ddsPrefix = _settings2["default"].stablePrefix;
  * @slot action - The text-cta content.
  * @slot card-group - The L shaped card group content.
  */
-var DDSCardSectionOffset = (0, _decorate2["default"])([(0, _litElement.customElement)("".concat(ddsPrefix, "-card-section-offset"))], function (_initialize, _StableSelectorMixin) {
+var DDSCardSectionOffset = (0, _decorate2["default"])([(0, _carbonElement.carbonElement)("".concat(ddsPrefix, "-card-section-offset"))], function (_initialize, _StableSelectorMixin) {
   var DDSCardSectionOffset = /*#__PURE__*/function (_StableSelectorMixin2) {
     (0, _inherits2["default"])(DDSCardSectionOffset, _StableSelectorMixin2);
     var _super = _createSuper(DDSCardSectionOffset);

package/es/components/card-section-offset/card-section-offset.js.map

@@ -1 +1 @@
-{"version":3,"file":"card-section-offset.js","names":["_litElement","require","_settings","_interopRequireDefault","_settings2","_stableSelector","_contentBlock","_cardSectionOffsetCss","_templateObject","_templateObject2","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf2","result","NewTarget","constructor","Reflect","construct","arguments","apply","_possibleConstructorReturn2","sham","Proxy","Boolean","prototype","valueOf","call","e","prefix","settings","ddsPrefix","ddsSettings","stablePrefix","DDSCardSectionOffset","_decorate2","customElement","concat","_initialize","_StableSelectorMixin","_StableSelectorMixin2","_inherits2","_super","_this","_classCallCheck2","_len","length","args","Array","_key","_assertThisInitialized2","_createClass2","F","d","kind","key","value","_handleSlotChangeCardGroup","event","_this2","childItems","target","assignedNodes","filter","elem","_querySelector","matches","cardGroupSelector","querySelectorAll","querySelector","hasAttribute","innerHTML","render","html","_taggedTemplateLiteral2","_renderHeading","stableSelector","styles","css","_get2","StableSelectorMixin","DDSContentBlock","_default","exports"],"sources":["components/card-section-offset/card-section-offset.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2022\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 { css, customElement, html } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings.js';\nimport ddsSettings from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings';\nimport StableSelectorMixin from '../../globals/mixins/stable-selector';\nimport DDSContentBlock from '../content-block/content-block';\nimport styles from './card-section-offset.scss';\n\nconst { prefix } = settings;\nconst { stablePrefix: ddsPrefix } = ddsSettings;\n\n/**\n * Card section offset.\n *\n * @element dds-card-section-offset\n * @slot heading - The heading content.\n * @slot action - The text-cta content.\n * @slot card-group - The L shaped card group content.\n */\n@customElement(`${ddsPrefix}-card-section-offset`)\nclass DDSCardSectionOffset extends StableSelectorMixin(DDSContentBlock) {\n  protected _handleSlotChangeCardGroup(event: Event) {\n    const childItems = (event.target as HTMLSlotElement).assignedNodes();\n\n    childItems.filter((elem) => {\n      if (\n        (elem as HTMLElement).matches(\n          (this.constructor as typeof DDSCardSectionOffset).cardGroupSelector\n        ) &&\n        (elem as HTMLElement).querySelectorAll(`${ddsPrefix}-card-group-item`)\n          .length === 4 &&\n        (elem as HTMLElement)\n          .querySelector(`${ddsPrefix}-card-group-item`)\n          ?.hasAttribute('empty')\n      ) {\n        return true;\n      }\n      this.querySelector('dds-card-group')!.innerHTML = '';\n      return false;\n    });\n  }\n\n  render() {\n    return html`\n      <div class=\"${prefix}--card-section-offset__content\">\n        ${this._renderHeading()}\n        <slot name=\"action\"></slot>\n      </div>\n      <slot\n        name=\"card-group\"\n        @slotchange=\"${this._handleSlotChangeCardGroup}\"></slot>\n    `;\n  }\n\n  static get stableSelector() {\n    return `${ddsPrefix}--card-section-offset`;\n  }\n\n  static get cardGroupSelector() {\n    return `${ddsPrefix}-card-group`;\n  }\n\n  // `styles` here is a `CSSResult` generated by custom WebPack loader\n  static get styles() {\n    return css`\n      ${super.styles}${styles}\n    `;\n  }\n}\n\n/* @__GENERATE_REACT_CUSTOM_ELEMENT_TYPE__ */\nexport default DDSCardSectionOffset;\n"],"mappings":"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"}
+{"version":3,"file":"card-section-offset.js","names":["_litElement","require","_settings","_interopRequireDefault","_settings2","_stableSelector","_contentBlock","_cardSectionOffsetCss","_carbonElement","_templateObject","_templateObject2","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf2","result","NewTarget","constructor","Reflect","construct","arguments","apply","_possibleConstructorReturn2","sham","Proxy","Boolean","prototype","valueOf","call","e","prefix","settings","ddsPrefix","ddsSettings","stablePrefix","DDSCardSectionOffset","_decorate2","customElement","concat","_initialize","_StableSelectorMixin","_StableSelectorMixin2","_inherits2","_super","_this","_classCallCheck2","_len","length","args","Array","_key","_assertThisInitialized2","_createClass2","F","d","kind","key","value","_handleSlotChangeCardGroup","event","_this2","childItems","target","assignedNodes","filter","elem","_querySelector","matches","cardGroupSelector","querySelectorAll","querySelector","hasAttribute","innerHTML","render","html","_taggedTemplateLiteral2","_renderHeading","stableSelector","styles","css","_get2","StableSelectorMixin","DDSContentBlock","_default","exports"],"sources":["components/card-section-offset/card-section-offset.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 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 { css, html } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings.js';\nimport ddsSettings from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings';\nimport StableSelectorMixin from '../../globals/mixins/stable-selector';\nimport DDSContentBlock from '../content-block/content-block';\nimport styles from './card-section-offset.scss';\nimport { carbonElement as customElement } from '../../internal/vendor/@carbon/web-components/globals/decorators/carbon-element';\n\nconst { prefix } = settings;\nconst { stablePrefix: ddsPrefix } = ddsSettings;\n\n/**\n * Card section offset.\n *\n * @element dds-card-section-offset\n * @slot heading - The heading content.\n * @slot action - The text-cta content.\n * @slot card-group - The L shaped card group content.\n */\n@customElement(`${ddsPrefix}-card-section-offset`)\nclass DDSCardSectionOffset extends StableSelectorMixin(DDSContentBlock) {\n  protected _handleSlotChangeCardGroup(event: Event) {\n    const childItems = (event.target as HTMLSlotElement).assignedNodes();\n\n    childItems.filter((elem) => {\n      if (\n        (elem as HTMLElement).matches(\n          (this.constructor as typeof DDSCardSectionOffset).cardGroupSelector\n        ) &&\n        (elem as HTMLElement).querySelectorAll(`${ddsPrefix}-card-group-item`)\n          .length === 4 &&\n        (elem as HTMLElement)\n          .querySelector(`${ddsPrefix}-card-group-item`)\n          ?.hasAttribute('empty')\n      ) {\n        return true;\n      }\n      this.querySelector('dds-card-group')!.innerHTML = '';\n      return false;\n    });\n  }\n\n  render() {\n    return html`\n      <div class=\"${prefix}--card-section-offset__content\">\n        ${this._renderHeading()}\n        <slot name=\"action\"></slot>\n      </div>\n      <slot\n        name=\"card-group\"\n        @slotchange=\"${this._handleSlotChangeCardGroup}\"></slot>\n    `;\n  }\n\n  static get stableSelector() {\n    return `${ddsPrefix}--card-section-offset`;\n  }\n\n  static get cardGroupSelector() {\n    return `${ddsPrefix}-card-group`;\n  }\n\n  // `styles` here is a `CSSResult` generated by custom WebPack loader\n  static get styles() {\n    return css`\n      ${super.styles}${styles}\n    `;\n  }\n}\n\n/* @__GENERATE_REACT_CUSTOM_ELEMENT_TYPE__ */\nexport default DDSCardSectionOffset;\n"],"mappings":"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"}

package/es/components/card-section-simple/card-section-simple.d.ts

@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2020, 2022
+ * Copyright IBM Corp. 2020, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -194,7 +194,7 @@ declare const DDSCardSectionSimple_base: {
         ariaValueMin: string | null;
         ariaValueNow: string | null;
         ariaValueText: string | null;
-        animate(keyframes: PropertyIndexedKeyframes | Keyframe[] | null, options?: number | KeyframeAnimationOptions | undefined): Animation;
+        animate(keyframes: Keyframe[] | PropertyIndexedKeyframes | null, options?: number | KeyframeAnimationOptions | undefined): Animation;
         getAnimations(options?: GetAnimationsOptions | undefined): Animation[];
         after(...nodes: (string | Node)[]): void;
         before(...nodes: (string | Node)[]): void;

package/es/components/card-section-simple/card-section-simple.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["components/card-section-simple/card-section-simple.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAOH,OAAO,iBAAiB,MAAM,oCAAoC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAInE;;;;GAIG;AACH,cACM,oBAAqB,SAAQ,yBAAsC;IACvE,MAAM,KAAK,cAAc,WAExB;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAGD,eAAe,oBAAoB,CAAC","file":"card-section-simple.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2022\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-element';\nimport ddsSettings from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings';\nimport StableSelectorMixin from '../../globals/mixins/stable-selector';\n\nimport styles from './card-section-simple.scss';\nimport DDSContentSection from '../content-section/content-section';\n\nconst { stablePrefix: ddsPrefix } = ddsSettings;\n\n/**\n * The Card Section Simple pattern\n *\n * @element dds-card-section-simple\n */\n@customElement(`${ddsPrefix}-card-section-simple`)\nclass DDSCardSectionSimple extends StableSelectorMixin(DDSContentSection) {\n  static get stableSelector() {\n    return `${ddsPrefix}--card-section-simple`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\n/* @__GENERATE_REACT_CUSTOM_ELEMENT_TYPE__ */\nexport default DDSCardSectionSimple;\n"]}
+{"version":3,"sources":["components/card-section-simple/card-section-simple.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAMH,OAAO,iBAAiB,MAAM,oCAAoC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKnE;;;;GAIG;AACH,cACM,oBAAqB,SAAQ,yBAAsC;IACvE,MAAM,KAAK,cAAc,WAExB;IAED,MAAM,CAAC,MAAM,MAAU;CACxB;AAGD,eAAe,oBAAoB,CAAC","file":"card-section-simple.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 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 ddsSettings from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings';\nimport StableSelectorMixin from '../../globals/mixins/stable-selector';\n\nimport styles from './card-section-simple.scss';\nimport DDSContentSection from '../content-section/content-section';\nimport { carbonElement as customElement } from '../../internal/vendor/@carbon/web-components/globals/decorators/carbon-element';\n\nconst { stablePrefix: ddsPrefix } = ddsSettings;\n\n/**\n * The Card Section Simple pattern\n *\n * @element dds-card-section-simple\n */\n@customElement(`${ddsPrefix}-card-section-simple`)\nclass DDSCardSectionSimple extends StableSelectorMixin(DDSContentSection) {\n  static get stableSelector() {\n    return `${ddsPrefix}--card-section-simple`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\n/* @__GENERATE_REACT_CUSTOM_ELEMENT_TYPE__ */\nexport default DDSCardSectionSimple;\n"]}

package/es/components/card-section-simple/card-section-simple.js

@@ -12,11 +12,11 @@ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/inhe
 var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/possibleConstructorReturn"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/getPrototypeOf"));
 var _decorate2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/decorate"));
-var _litElement = require("lit-element");
 var _settings = _interopRequireDefault(require("../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings.js"));
 var _stableSelector = _interopRequireDefault(require("../../globals/mixins/stable-selector.js"));
 var _cardSectionSimpleCss = _interopRequireDefault(require("././card-section-simple.css.js"));
 var _contentSection = _interopRequireDefault(require("../content-section/content-section.js"));
+var _carbonElement = require("../../internal/vendor/@carbon/web-components/globals/decorators/carbon-element.js");
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 var ddsPrefix = _settings["default"].stablePrefix;
@@ -26,7 +26,7 @@ var ddsPrefix = _settings["default"].stablePrefix;
  *
  * @element dds-card-section-simple
  */
-var DDSCardSectionSimple = (0, _decorate2["default"])([(0, _litElement.customElement)("".concat(ddsPrefix, "-card-section-simple"))], function (_initialize, _StableSelectorMixin) {
+var DDSCardSectionSimple = (0, _decorate2["default"])([(0, _carbonElement.carbonElement)("".concat(ddsPrefix, "-card-section-simple"))], function (_initialize, _StableSelectorMixin) {
   var DDSCardSectionSimple = /*#__PURE__*/function (_StableSelectorMixin2) {
     (0, _inherits2["default"])(DDSCardSectionSimple, _StableSelectorMixin2);
     var _super = _createSuper(DDSCardSectionSimple);

package/es/components/card-section-simple/card-section-simple.js.map

@@ -1 +1 @@
-{"version":3,"file":"card-section-simple.js","names":["_litElement","require","_settings","_interopRequireDefault","_stableSelector","_cardSectionSimpleCss","_contentSection","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf2","result","NewTarget","constructor","Reflect","construct","arguments","apply","_possibleConstructorReturn2","sham","Proxy","Boolean","prototype","valueOf","call","e","ddsPrefix","ddsSettings","stablePrefix","DDSCardSectionSimple","_decorate2","customElement","concat","_initialize","_StableSelectorMixin","_StableSelectorMixin2","_inherits2","_super","_this","_classCallCheck2","_len","length","args","Array","_key","_assertThisInitialized2","_createClass2","F","d","kind","key","value","stableSelector","styles","StableSelectorMixin","DDSContentSection","_default","exports"],"sources":["components/card-section-simple/card-section-simple.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 2022\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-element';\nimport ddsSettings from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings';\nimport StableSelectorMixin from '../../globals/mixins/stable-selector';\n\nimport styles from './card-section-simple.scss';\nimport DDSContentSection from '../content-section/content-section';\n\nconst { stablePrefix: ddsPrefix } = ddsSettings;\n\n/**\n * The Card Section Simple pattern\n *\n * @element dds-card-section-simple\n */\n@customElement(`${ddsPrefix}-card-section-simple`)\nclass DDSCardSectionSimple extends StableSelectorMixin(DDSContentSection) {\n  static get stableSelector() {\n    return `${ddsPrefix}--card-section-simple`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\n/* @__GENERATE_REACT_CUSTOM_ELEMENT_TYPE__ */\nexport default DDSCardSectionSimple;\n"],"mappings":";;;;;;;;;;;;;;AASA,IAAAA,WAAA,GAAAC,OAAA;AACA,IAAAC,SAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,eAAA,GAAAD,sBAAA,CAAAF,OAAA;AAEA,IAAAI,qBAAA,GAAAF,sBAAA,CAAAF,OAAA;AACA,IAAAK,eAAA,GAAAH,sBAAA,CAAAF,OAAA;AAAmE,SAAAM,aAAAC,OAAA,QAAAC,yBAAA,GAAAC,yBAAA,oBAAAC,qBAAA,QAAAC,KAAA,OAAAC,gBAAA,aAAAL,OAAA,GAAAM,MAAA,MAAAL,yBAAA,QAAAM,SAAA,OAAAF,gBAAA,mBAAAG,WAAA,EAAAF,MAAA,GAAAG,OAAA,CAAAC,SAAA,CAAAN,KAAA,EAAAO,SAAA,EAAAJ,SAAA,YAAAD,MAAA,GAAAF,KAAA,CAAAQ,KAAA,OAAAD,SAAA,gBAAAE,2BAAA,mBAAAP,MAAA;AAAA,SAAAJ,0BAAA,eAAAO,OAAA,qBAAAA,OAAA,CAAAC,SAAA,oBAAAD,OAAA,CAAAC,SAAA,CAAAI,IAAA,2BAAAC,KAAA,oCAAAC,OAAA,CAAAC,SAAA,CAAAC,OAAA,CAAAC,IAAA,CAAAV,OAAA,CAAAC,SAAA,CAAAM,OAAA,8CAAAI,CAAA;AAEnE,IAAsBC,SAAS,GAAKC,oBAAW,CAAvCC,YAAY;;AAEpB;AACA;AACA;AACA;AACA;AAJA,IAMMC,oBAAoB,OAAAC,UAAA,cADzB,IAAAC,yBAAa,KAAAC,MAAA,CAAIN,SAAS,0BAAuB,aAAAO,WAAA,EAAAC,oBAAA;EAAA,IAC5CL,oBAAoB,0BAAAM,qBAAA;IAAA,IAAAC,UAAA,aAAAP,oBAAA,EAAAM,qBAAA;IAAA,IAAAE,MAAA,GAAAjC,YAAA,CAAAyB,oBAAA;IAAA,SAAAA,qBAAA;MAAA,IAAAS,KAAA;MAAA,IAAAC,gBAAA,mBAAAV,oBAAA;MAAA,SAAAW,IAAA,GAAAxB,SAAA,CAAAyB,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAH,IAAA,GAAAI,IAAA,MAAAA,IAAA,GAAAJ,IAAA,EAAAI,IAAA;QAAAF,IAAA,CAAAE,IAAA,IAAA5B,SAAA,CAAA4B,IAAA;MAAA;MAAAN,KAAA,GAAAD,MAAA,CAAAb,IAAA,CAAAP,KAAA,CAAAoB,MAAA,SAAAL,MAAA,CAAAU,IAAA;MAAAT,WAAA,KAAAY,uBAAA,aAAAP,KAAA;MAAA,OAAAA,KAAA;IAAA;IAAA,WAAAQ,aAAA,aAAAjB,oBAAA;EAAA,EAAAK,oBAAA;EAAA;IAAAa,CAAA,EAApBlB,oBAAoB;IAAAmB,CAAA;MAAAC,IAAA;MAAA;MAAAC,GAAA;MAAAC,KAAA,EACxB,SAAAC,eAAA,EAA4B;QAC1B,UAAApB,MAAA,CAAUN,SAAS;MACrB;IAAC;MAAAuB,IAAA;MAAA;MAAAC,GAAA;MAAAC,KAAA,WAAAA,MAAA;QAAA,OAEeE,gCAAM;MAAA;IAAA;EAAA;AAAA,GALW,IAAAC,0BAAmB,EAACC,0BAAiB,CAAC;AAQzE;AAAA,IAAAC,QAAA,GACe3B,oBAAoB;AAAA4B,OAAA,cAAAD,QAAA"}
+{"version":3,"file":"card-section-simple.js","names":["_settings","_interopRequireDefault","require","_stableSelector","_cardSectionSimpleCss","_contentSection","_carbonElement","_createSuper","Derived","hasNativeReflectConstruct","_isNativeReflectConstruct","_createSuperInternal","Super","_getPrototypeOf2","result","NewTarget","constructor","Reflect","construct","arguments","apply","_possibleConstructorReturn2","sham","Proxy","Boolean","prototype","valueOf","call","e","ddsPrefix","ddsSettings","stablePrefix","DDSCardSectionSimple","_decorate2","customElement","concat","_initialize","_StableSelectorMixin","_StableSelectorMixin2","_inherits2","_super","_this","_classCallCheck2","_len","length","args","Array","_key","_assertThisInitialized2","_createClass2","F","d","kind","key","value","stableSelector","styles","StableSelectorMixin","DDSContentSection","_default","exports"],"sources":["components/card-section-simple/card-section-simple.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 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 ddsSettings from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings';\nimport StableSelectorMixin from '../../globals/mixins/stable-selector';\n\nimport styles from './card-section-simple.scss';\nimport DDSContentSection from '../content-section/content-section';\nimport { carbonElement as customElement } from '../../internal/vendor/@carbon/web-components/globals/decorators/carbon-element';\n\nconst { stablePrefix: ddsPrefix } = ddsSettings;\n\n/**\n * The Card Section Simple pattern\n *\n * @element dds-card-section-simple\n */\n@customElement(`${ddsPrefix}-card-section-simple`)\nclass DDSCardSectionSimple extends StableSelectorMixin(DDSContentSection) {\n  static get stableSelector() {\n    return `${ddsPrefix}--card-section-simple`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\n/* @__GENERATE_REACT_CUSTOM_ELEMENT_TYPE__ */\nexport default DDSCardSectionSimple;\n"],"mappings":";;;;;;;;;;;;;;AASA,IAAAA,SAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,eAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,qBAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,eAAA,GAAAJ,sBAAA,CAAAC,OAAA;AACA,IAAAI,cAAA,GAAAJ,OAAA;AAAgI,SAAAK,aAAAC,OAAA,QAAAC,yBAAA,GAAAC,yBAAA,oBAAAC,qBAAA,QAAAC,KAAA,OAAAC,gBAAA,aAAAL,OAAA,GAAAM,MAAA,MAAAL,yBAAA,QAAAM,SAAA,OAAAF,gBAAA,mBAAAG,WAAA,EAAAF,MAAA,GAAAG,OAAA,CAAAC,SAAA,CAAAN,KAAA,EAAAO,SAAA,EAAAJ,SAAA,YAAAD,MAAA,GAAAF,KAAA,CAAAQ,KAAA,OAAAD,SAAA,gBAAAE,2BAAA,mBAAAP,MAAA;AAAA,SAAAJ,0BAAA,eAAAO,OAAA,qBAAAA,OAAA,CAAAC,SAAA,oBAAAD,OAAA,CAAAC,SAAA,CAAAI,IAAA,2BAAAC,KAAA,oCAAAC,OAAA,CAAAC,SAAA,CAAAC,OAAA,CAAAC,IAAA,CAAAV,OAAA,CAAAC,SAAA,CAAAM,OAAA,8CAAAI,CAAA;AAEhI,IAAsBC,SAAS,GAAKC,oBAAW,CAAvCC,YAAY;;AAEpB;AACA;AACA;AACA;AACA;AAJA,IAMMC,oBAAoB,OAAAC,UAAA,cADzB,IAAAC,4BAAa,KAAAC,MAAA,CAAIN,SAAS,0BAAuB,aAAAO,WAAA,EAAAC,oBAAA;EAAA,IAC5CL,oBAAoB,0BAAAM,qBAAA;IAAA,IAAAC,UAAA,aAAAP,oBAAA,EAAAM,qBAAA;IAAA,IAAAE,MAAA,GAAAjC,YAAA,CAAAyB,oBAAA;IAAA,SAAAA,qBAAA;MAAA,IAAAS,KAAA;MAAA,IAAAC,gBAAA,mBAAAV,oBAAA;MAAA,SAAAW,IAAA,GAAAxB,SAAA,CAAAyB,MAAA,EAAAC,IAAA,OAAAC,KAAA,CAAAH,IAAA,GAAAI,IAAA,MAAAA,IAAA,GAAAJ,IAAA,EAAAI,IAAA;QAAAF,IAAA,CAAAE,IAAA,IAAA5B,SAAA,CAAA4B,IAAA;MAAA;MAAAN,KAAA,GAAAD,MAAA,CAAAb,IAAA,CAAAP,KAAA,CAAAoB,MAAA,SAAAL,MAAA,CAAAU,IAAA;MAAAT,WAAA,KAAAY,uBAAA,aAAAP,KAAA;MAAA,OAAAA,KAAA;IAAA;IAAA,WAAAQ,aAAA,aAAAjB,oBAAA;EAAA,EAAAK,oBAAA;EAAA;IAAAa,CAAA,EAApBlB,oBAAoB;IAAAmB,CAAA;MAAAC,IAAA;MAAA;MAAAC,GAAA;MAAAC,KAAA,EACxB,SAAAC,eAAA,EAA4B;QAC1B,UAAApB,MAAA,CAAUN,SAAS;MACrB;IAAC;MAAAuB,IAAA;MAAA;MAAAC,GAAA;MAAAC,KAAA,WAAAA,MAAA;QAAA,OAEeE,gCAAM;MAAA;IAAA;EAAA;AAAA,GALW,IAAAC,0BAAmB,EAACC,0BAAiB,CAAC;AAQzE;AAAA,IAAAC,QAAA,GACe3B,oBAAoB;AAAA4B,OAAA,cAAAD,QAAA"}

package/es/components/carousel/carousel.d.ts

@@ -131,11 +131,6 @@ declare const DDSCarousel_base: {
         isSameNode(otherNode: Node | null): boolean;
         lookupNamespaceURI(prefix: string | null): string | null;
         lookupPrefix(namespace: string | null): string | null;
-        /**
-         * Stops the container from scrolling when focusing on a card outside the viewport.
-         *
-         * @param event The event.
-         */
         normalize(): void;
         removeChild<T_3 extends Node>(child: T_3): T_3;
         replaceChild<T_4 extends Node>(node: Node, child: T_4): T_4;
@@ -189,15 +184,14 @@ declare const DDSCarousel_base: {
         ariaRowSpan: string | null;
         ariaSelected: string | null;
         ariaSetSize: string | null;
-        /**
-         * Handles `touchstart` event.
-         */
         ariaSort: string | null;
         ariaValueMax: string | null;
-        ariaValueMin: string | null;
+        ariaValueMin: string | null; /**
+         * Handles `touchstart` event.
+         */
         ariaValueNow: string | null;
         ariaValueText: string | null;
-        animate(keyframes: PropertyIndexedKeyframes | Keyframe[] | null, options?: number | KeyframeAnimationOptions | undefined): Animation;
+        animate(keyframes: Keyframe[] | PropertyIndexedKeyframes | null, options?: number | KeyframeAnimationOptions | undefined): Animation;
         getAnimations(options?: GetAnimationsOptions | undefined): Animation[];
         after(...nodes: (string | Node)[]): void;
         before(...nodes: (string | Node)[]): void;
@@ -518,7 +512,7 @@ declare const DDSCarousel_base: {
         ariaValueMin: string | null;
         ariaValueNow: string | null;
         ariaValueText: string | null;
-        animate(keyframes: PropertyIndexedKeyframes | Keyframe[] | null, options?: number | KeyframeAnimationOptions | undefined): Animation;
+        animate(keyframes: Keyframe[] | PropertyIndexedKeyframes | null, options?: number | KeyframeAnimationOptions | undefined): Animation;
         getAnimations(options?: GetAnimationsOptions | undefined): Animation[];
         after(...nodes: (string | Node)[]): void;
         before(...nodes: (string | Node)[]): void;

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

@@ -1 +1 @@
-{"version":3,"sources":["components/carousel/carousel.ts"],"names":[],"mappings":"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","file":"carousel.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 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 {\n  html,\n  property,\n  state,\n  query,\n  customElement,\n  LitElement,\n} from 'lit-element';\nimport 'wicg-inert';\nimport settings from 'carbon-components/es/globals/js/settings.js';\nimport { slow01 } from '@carbon/motion';\nimport ifNonNull from '../../internal/vendor/@carbon/web-components/globals/directives/if-non-null.js';\nimport CaretLeft20 from '../../internal/vendor/@carbon/web-components/icons/caret--left/20.js';\nimport CaretRight20 from '../../internal/vendor/@carbon/web-components/icons/caret--right/20.js';\nimport HostListener from '../../internal/vendor/@carbon/web-components/globals/decorators/host-listener.js';\nimport HostListenerMixin from '../../internal/vendor/@carbon/web-components/globals/mixins/host-listener.js';\nimport { selectorTabbable } from '../../internal/vendor/@carbon/web-components/globals/settings.js';\nimport ddsSettings from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings';\nimport sameHeight from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/sameHeight/sameHeight';\nimport styles from './carousel.scss';\nimport StableSelectorMixin from '../../globals/mixins/stable-selector';\nimport DDSExpressiveModal from '../expressive-modal/expressive-modal';\n\nconst { prefix } = settings;\nconst { stablePrefix: ddsPrefix } = ddsSettings;\n\nconst MAX_GESTURE_DURATION = 300; // max time allowed to do swipe\nconst MIN_DISTANCE_TRAVELLED = 75; // min distance traveled to be considered swipe\nconst headingBottomMargin = 64; // tag constants used for same height calculations\n\n/**\n * Minimum percentage of a slide being visible for it to be interactable.\n */\nconst minIntersectionRatio = 0.75;\n\n/**\n * Carousel.\n *\n * @element dds-carousel\n * @csspart prev-button The button to go to the previous page.\n * @csspart next-button The button to go to the next page.\n */\n@customElement(`${ddsPrefix}-carousel`)\nclass DDSCarousel extends HostListenerMixin(StableSelectorMixin(LitElement)) {\n  /**\n   * The scrolling contents node.\n   */\n  @query(`.${prefix}--carousel__scroll-contents`)\n  private _contentsNode?: HTMLElement;\n\n  /**\n   * The node whose text content is announced to screen readers on change.\n   */\n  @query('[aria-live]')\n  private _announcementNode!: HTMLElement;\n\n  /**\n   * The width of the scroll contents area node, excluding one of overflowed contents.\n   */\n  @state()\n  private _contentsBaseWidth = 0;\n\n  /**\n   * The gap width between each card.\n   */\n  @state()\n  private _gap = 0;\n\n  /**\n   * Array to hold the card-heading elements within child items.\n   */\n  private _childItems: any[] = [];\n\n  /**\n   * Array to hold the card-heading elements within child items.\n   */\n  private _childItemHeadings: any[] = [];\n\n  /**\n   * Array to hold the card-eyebrow elements within child items.\n   */\n  private _childItemEyebrows: any[] = [];\n\n  /**\n   * Array to hold the tag-group elements within child items.\n   */\n  private _childItemTagGroup: any[] = [];\n\n  /**\n   * Array to hold the paragraph elements within child items.\n   */\n  private _childItemParagraphs: any[] = [];\n\n  /**\n   * Array to hold the card-cta-footer elements within child items.\n   */\n  private _childItemFooters: any[] = [];\n\n  /**\n   * The observer for the resize of the scroll container.\n   */\n  private _observerResizeContainer: any | null = null; // TODO: Wait for `.d.ts` update to support `ResizeObserver`\n\n  /**\n   * The observer for the resize of the viewport.\n   */\n  private _observerResizeRoot: any | null = null; // TODO: Wait for `.d.ts` update to support `ResizeObserver`\n\n  private _intersectionThresholdDifference =\n    Math.max(0.5, minIntersectionRatio) - Math.min(0.5, minIntersectionRatio);\n\n  /**\n   *  IntersectionObserver to watch carousel contents.\n   *  As items cross the minIntersectionRatio `inert` and `aria-hidden` are toggled.\n   */\n  private _intersectionObserver = new IntersectionObserver(\n    this._onIntersect.bind(this),\n    {\n      root: this._contentsNode,\n      threshold: [\n        0.5 + this._intersectionThresholdDifference,\n        0.5 - this._intersectionThresholdDifference,\n      ],\n    }\n  );\n\n  private _intersectionTimeout?;\n\n  /**\n   * IntersectionObserver callback.\n   * Carousel items with more than `minIntersectionRatio` visible will interactable.\n   *\n   * @param {IntersectionObserverEntry[]} entries Array of observed intersections.\n   */\n  private _onIntersect(entries) {\n    const {\n      _announcementNode: announcementNode,\n      formatAnnouncement,\n      _getStatus: status,\n      _intersectionTimeout: timeout,\n    } = this;\n\n    // Mark off-screen slides as [inert]\n    entries.forEach((entry) => {\n      const { target, isIntersecting, intersectionRatio } = entry;\n\n      if (isIntersecting && intersectionRatio > minIntersectionRatio) {\n        target.inert = false;\n        target.setAttribute('aria-hidden', false);\n      } else {\n        target.inert = true;\n        target.setAttribute('aria-hidden', true);\n      }\n    });\n\n    // Wait for slide action to finish, then announce slide information\n    clearTimeout(timeout);\n\n    // Delay should equal the design token in the carousel's styles.\n    const delay = parseInt(slow01, 10);\n\n    this._intersectionTimeout = setTimeout(() => {\n      announcementNode.innerText = formatAnnouncement(status);\n    }, delay);\n  }\n\n  /**\n   * The page size that is explicitly set.\n   */\n  @state()\n  private _pageSize?: number;\n\n  /**\n   * The page size that is automatically calculated upon viewport size\n   * via `--dds--carousel--page-size` CSS custom property.\n   * If `page-size` attribute is set, this value is ignored.\n   */\n  @state()\n  private _pageSizeAuto = 1;\n\n  /**\n   * The default slot.\n   */\n  @query('slot:not([name])')\n  private _slotNode?: HTMLSlotElement;\n\n  /**\n   * The number of total items.\n   */\n  @state()\n  private _total = 0;\n\n  /**\n   * Initial touch position (used to detect swipe gesture)\n   */\n  @state()\n  private _startPos = 0;\n\n  /**\n   * Initial touch time (used to detect swipe gesture)\n   */\n  @state()\n  private _startTime = 0;\n\n  /**\n   * Cleans-up and creates the resize observer for the scrolling container.\n   *\n   * @param [options] The options.\n   * @param [options.create] `true` to create the new resize observer.\n   */\n  private _cleanAndCreateObserverResize({ create }: { create?: boolean } = {}) {\n    const { _contentsNode: contentsNode } = this;\n    if (contentsNode) {\n      if (this._observerResizeContainer) {\n        this._observerResizeContainer.disconnect();\n        this._observerResizeContainer = null;\n      }\n      if (this._observerResizeRoot) {\n        this._observerResizeRoot.disconnect();\n        this._observerResizeRoot = null;\n      }\n      if (create) {\n        // TODO: Wait for `.d.ts` update to support `ResizeObserver`\n        // @ts-ignore\n        this._observerResizeRoot = new ResizeObserver(this._observeResizeRoot);\n        this._observerResizeRoot.observe(this.ownerDocument!.documentElement);\n        // TODO: Wait for `.d.ts` update to support `ResizeObserver`\n        // @ts-ignore\n        this._observerResizeContainer = new ResizeObserver(\n          this._observeResizeContainer\n        );\n        this._observerResizeContainer.observe(contentsNode);\n      }\n    }\n  }\n\n  /**\n   * Stops the container from scrolling when focusing on a card outside the viewport.\n   *\n   * @param event The event.\n   */\n  // eslint-disable-next-line class-methods-use-this\n  private _handleScrollFocus({ target }: Event) {\n    (target as HTMLElement).scrollTo(0, 0);\n  }\n\n  /**\n   * Handles card focus throughout pages.\n   *\n   * @param event The event.\n   */\n  @HostListener('shadowRoot:focusin')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleFocus = async ({ target }: FocusEvent) => {\n    const containsCurrent =\n      target !== this && this.contains(target as HTMLElement);\n    let currentItemIndex = 0;\n    Array.from(this._childItems).forEach((carouselItem, index) => {\n      if (carouselItem.contains(target as HTMLElement)) {\n        currentItemIndex = index;\n      }\n    });\n\n    // Calculates proper page to display if focus is outside the current page\n    if (\n      containsCurrent &&\n      (currentItemIndex < this.start ||\n        currentItemIndex >= this.start + this.pageSize)\n    ) {\n      // The `currentIndex` floored by `pageSize`\n      const nextStart =\n        Math.floor(currentItemIndex / this.pageSize) * this.pageSize;\n      const pageOffset = this.start % this.pageSize;\n\n      // Ensures the page moves by `this.pageSize` in either direction\n      this.start = nextStart + pageOffset;\n    }\n  };\n\n  /**\n   * Handles card with video heading and applies the set same height function.\n   *\n   * @param event The event.\n   */\n  @HostListener(`document:eventVideoTitleUpdated`)\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleVideoTitleUpdate = async (event: FocusEvent) => {\n    if (event) {\n      this._setSameHeight();\n    }\n  };\n\n  /**\n   * Handles `click` event on the next button.\n   */\n  private _handleClickNextButton() {\n    const { pageSize, start, _total: total } = this;\n    this.start = Math.min(start + pageSize, total - 1);\n  }\n\n  /**\n   * Handles `click` event on the prev button.\n   */\n  private _handleClickPrevButton() {\n    const { pageSize, start } = this;\n    this.start = Math.max(start - pageSize, 0);\n  }\n\n  /**\n   * Handles `touchstart` event.\n   */\n  private _handleTouchStartEvent(event: TouchEvent) {\n    this._startPos = event.touches[0].clientX;\n    this._startTime = new Date().getTime();\n  }\n\n  /**\n   * Handles `touchend` event.\n   */\n  private _handleTouchEndEvent(event: TouchEvent) {\n    const { _startPos, _startTime } = this;\n    const { pageSize, start, _total: total } = this;\n\n    const distTravelled = event.changedTouches[0].clientX - _startPos; // distance travelled\n    const elapsedTime = new Date().getTime() - _startTime; // elapsed time\n\n    if (\n      elapsedTime <= MAX_GESTURE_DURATION &&\n      Math.abs(distTravelled) >= MIN_DISTANCE_TRAVELLED\n    ) {\n      if (distTravelled < 0) {\n        this.start = Math.min(start + pageSize, total - 1);\n      } else {\n        this.start = Math.max(start - pageSize, 0);\n      }\n    }\n  }\n\n  /**\n   * Handles `slotchange` event.\n   */\n  private _handleSlotChange(event: Event) {\n    const slot = event.target as HTMLSlotElement;\n    const { name } = slot;\n    if (!name) {\n      this._total = slot\n        .assignedNodes()\n        .filter((node) => node.nodeType === Node.ELEMENT_NODE).length;\n    }\n    this._updateGap();\n\n    this._childItems = (event.target as HTMLSlotElement).assignedElements();\n\n    this._intersectionObserver.disconnect();\n\n    this._childItems.forEach((item) => {\n      this._intersectionObserver.observe(item);\n    });\n\n    // retrieve item heading, eyebrows, and footers to set same height\n    if (this._childItems) {\n      this._childItems\n        .filter((elem) =>\n          (elem as HTMLElement).matches !== undefined\n            ? (elem as HTMLElement).matches(\n                (this.constructor as typeof DDSCarousel).selectorItem\n              ) ||\n              (elem as HTMLElement).matches(\n                (this.constructor as typeof DDSCarousel)\n                  .selectorItemVideoCTAContainer\n              )\n            : false\n        )\n        .forEach((e) => {\n          this._childItemEyebrows.push(\n            (e as HTMLElement).querySelector(\n              (this.constructor as typeof DDSCarousel).selectorItemEyebrow\n            )\n          );\n          this._childItemParagraphs.push(\n            (e as HTMLElement).querySelector(\n              (this.constructor as typeof DDSCarousel).selectorItemParagraph\n            )\n          );\n          this._childItemTagGroup.push(\n            (e as HTMLElement).querySelector(\n              (this.constructor as typeof DDSCarousel).selectorItemTagGroup\n            )\n          );\n          this._childItemHeadings.push(\n            (e as HTMLElement).querySelector(\n              (this.constructor as typeof DDSCarousel).selectorItemHeading\n            )\n          );\n\n          this._childItemHeadings.push(\n            (e as HTMLElement)\n              .querySelector(\n                (this.constructor as typeof DDSCarousel).selectorItemCardCTA\n              )\n              ?.shadowRoot?.querySelector(\n                (this.constructor as typeof DDSCarousel).selectorItemHeading\n              )\n          );\n\n          this._childItemHeadings = this._childItemHeadings.filter(\n            (heading) => heading\n          );\n\n          this._childItemFooters.push(\n            (e as HTMLElement).querySelector(\n              (this.constructor as typeof DDSCarousel).selectorItemFooter\n            )\n          );\n        });\n      this._observeResizeRoot();\n      this.markHiddenAsInert();\n    }\n  }\n\n  /**\n   * The observer for the resize of the scroll container.\n   */\n  private _observeResizeContainer = (records) => {\n    const { contentRect } = records[records.length - 1];\n    const { width: contentsBaseWidth } = contentRect;\n    this._contentsBaseWidth = contentsBaseWidth;\n    this._updateGap();\n  };\n\n  /**\n   * The observer for the resize of the viewport.\n   */\n  private _observeResizeRoot = () => {\n    const { customPropertyPageSize } = this.constructor as typeof DDSCarousel;\n    const { _contentsNode: contentsNode } = this;\n    const { defaultView: w } = this.ownerDocument!;\n    this._pageSizeAuto = Number(\n      w!\n        .getComputedStyle(contentsNode!)\n        .getPropertyValue(customPropertyPageSize)\n    );\n    this._setSameHeight();\n  };\n\n  private get _getStatus() {\n    const { start, pageSize, _total: total } = this;\n    // Copes with the condition where `start % pageSize` is non-zero\n    const pagesBefore = Math.ceil(start / pageSize);\n    const pagesSince = Math.ceil((total - start) / pageSize);\n    return {\n      currentPage: Math.ceil(start / pageSize) + 1,\n      pages: pagesBefore + pagesSince,\n    };\n  }\n\n  private _setSameHeight = () => {\n    // check if items are not null before using sameHeight\n\n    sameHeight(\n      this._childItemEyebrows.filter((item) => item !== null),\n      'sm'\n    );\n    sameHeight(\n      this._childItemHeadings.filter((item) => item !== null),\n      'sm'\n    );\n    sameHeight(\n      this._childItemParagraphs.filter((item) => item !== null),\n      'sm'\n    );\n    sameHeight(\n      this._childItemFooters.filter((item) => item !== null),\n      'sm'\n    );\n\n    let tagGroupHeight: number = 0;\n\n    // Get the tallest height of tag groups.\n    this._childItemTagGroup.forEach((item) => {\n      if (item) {\n        const groupHeight = (item as HTMLElement).offsetHeight;\n        if (groupHeight > tagGroupHeight) {\n          tagGroupHeight = groupHeight;\n        }\n      }\n    });\n\n    this._childItemHeadings.forEach((e) => {\n      // add tag group height to heading to the cards lacking tag group\n      if (\n        e &&\n        !e.nextElementSibling?.matches(\n          (this.constructor as typeof DDSCarousel).selectorItemTagGroup\n        )\n      ) {\n        e.style.marginBottom = `${tagGroupHeight + headingBottomMargin}px`;\n      }\n    });\n  };\n\n  /**\n   * Calculates the width between cards.\n   */\n  private _updateGap() {\n    const { _contentsNode: contentsNode, _slotNode: slotNode } = this;\n    const elems = slotNode!\n      .assignedNodes()\n      .filter((node) => node.nodeType === Node.ELEMENT_NODE);\n    this._gap =\n      elems.length <= 1\n        ? 0\n        : (contentsNode!.scrollWidth -\n            elems.reduce(\n              (acc, elem) => acc + ((elem as HTMLElement).offsetWidth ?? 0),\n              0\n            )) /\n          (elems.length - 1);\n  }\n\n  get focusableElements() {\n    const { selectorTabbable: selectorTabbableForCarousel } = this\n      .constructor as typeof DDSExpressiveModal;\n    return [\n      ...Array.from(\n        (this.shadowRoot?.querySelectorAll(\n          selectorTabbableForCarousel\n        ) as NodeListOf<HTMLElement>) || []\n      ),\n      ...Array.from(\n        this.querySelectorAll(\n          selectorTabbableForCarousel\n        ) as NodeListOf<HTMLElement>\n      ),\n    ];\n  }\n\n  /**\n   * The formatters for the pagination status & aria-live announcement.\n   * Should be changed with the locale in which the UI is rendered.\n   */\n  @property({ attribute: false })\n  formatStatus = ({ currentPage, pages }) => `${currentPage} / ${pages}`;\n\n  @property({ attribute: false })\n  formatAnnouncement = ({ currentPage, pages }) => {\n    const visibleItemsCount = this._childItems.filter(\n      (item) => !item.matches('[inert]')\n    ).length;\n\n    return `Slide ${currentPage} of ${pages}. Showing ${visibleItemsCount} items.`;\n  };\n\n  /**\n   * Number of items per page.\n   * If `--dds--carousel--page-size` CSS custom property is set to `<div class=\"bx--carousel__scroll-container\">`\n   * or its ancestor (e.g. the host `<dds-carousel>`), this is set automatically from `--dds--carousel--page-size`.\n   */\n  @property({ type: Number, attribute: 'page-size' })\n  get pageSize() {\n    const { _pageSize: pageSize, _pageSizeAuto: pageSizeAuto } = this;\n    return pageSize ?? pageSizeAuto;\n  }\n\n  set pageSize(value: number) {\n    this._pageSize = value;\n    // Don't call `.requestUpdate()` here given we track updates via `_pageSize` and `_pageSizeAuto`\n  }\n\n  /**\n   * The assistive text for the button to go to next slide/group.\n   */\n  @property({ attribute: 'next-button-text' })\n  nextButtonText?: string;\n\n  private _defaultNextButtonText = 'next';\n\n  private _defaultPrevButtonText = 'previous';\n\n  /**\n   * The assistive text for the button to go to previous slide/group.\n   */\n  @property({ attribute: 'prev-button-text' })\n  prevButtonText?: string;\n\n  /**\n   * The current zero-based index of the left-most card.\n   */\n  @property({ type: Number })\n  start = 0;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._cleanAndCreateObserverResize({ create: true });\n\n    const containingModal = this.closest(\n      `${ddsPrefix}-expressive-modal`\n    ) as DDSExpressiveModal;\n    if (containingModal) {\n      containingModal.hasFocusableElements.push(this);\n      this.setAttribute('in-modal', '');\n\n      setTimeout(() => {\n        containingModal.modalBody!.style.overflow = 'hidden';\n        containingModal.modalBody!.style.width = 'var(--modal-vw)';\n      }, 0);\n    }\n  }\n\n  markHiddenAsInert() {\n    const { _childItems: childItems, start, pageSize } = this;\n\n    childItems.forEach((item) => {\n      const index = childItems.indexOf(item);\n      item.inert = index < start || index > start + pageSize - 1;\n    });\n  }\n\n  disconnectedCallback() {\n    this._cleanAndCreateObserverResize();\n    super.disconnectedCallback();\n  }\n\n  firstUpdated() {\n    this._cleanAndCreateObserverResize({ create: true });\n  }\n\n  protected updated(changedProperties) {\n    if (changedProperties.has('start')) {\n      this.markHiddenAsInert();\n    }\n  }\n\n  render() {\n    const { customPropertyPageSize } = this.constructor as typeof DDSCarousel;\n    const {\n      nextButtonText,\n      _defaultNextButtonText: defaultNextButtonText,\n      pageSize,\n      prevButtonText,\n      _defaultPrevButtonText: defaultPrevButtonText,\n      start,\n      _contentsBaseWidth: contentsBaseWidth,\n      _gap: gap,\n      _pageSize: pageSizeExplicit,\n      _total: total,\n      _getStatus: status,\n      formatStatus,\n      _handleClickNextButton: handleClickNextButton,\n      _handleClickPrevButton: handleClickPrevButton,\n      _handleScrollFocus: handleScrollFocus,\n      _handleSlotChange: handleSlotChange,\n      _handleTouchStartEvent: handleTouchStartEvent,\n      _handleTouchEndEvent: handleTouchEndEvent,\n    } = this;\n    // Copes with the condition where `start % pageSize` is non-zero\n    const pagesBefore = Math.ceil(start / pageSize);\n    const pagesSince = Math.ceil((total - start) / pageSize);\n    // Use another div from the host `<dds-carousel>` to reflect private state\n    return html`\n      <div role=\"region\" aria-labelledby=\"carousel-title\">\n        <div id=\"carousel-title\">\n          <slot name=\"title\">\n            <span class=\"bx--visually-hidden\">Carousel</span>\n          </slot>\n        </div>\n        <div\n          class=\"${prefix}--carousel__scroll-container\"\n          @scroll=\"${handleScrollFocus}\"\n          @touchstart=\"${handleTouchStartEvent}\"\n          @touchend=\"${handleTouchEndEvent}\"\n          style=\"${ifNonNull(\n            pageSizeExplicit == null\n              ? null\n              : `${customPropertyPageSize}: ${pageSizeExplicit}`\n          )}\">\n          <div\n            class=\"${prefix}--carousel__scroll-contents\"\n            style=\"left:${(-start * (contentsBaseWidth + gap)) / pageSize}px\">\n            <slot @slotchange=\"${handleSlotChange}\"></slot>\n          </div>\n        </div>\n        <nav\n          aria-label=\"Carousel Navigation\"\n          class=\"${prefix}--carousel__navigation\">\n          <button\n            part=\"prev-button\"\n            class=\"${prefix}--btn ${prefix}--btn--tertiary ${prefix}--btn--icon-only ${prefix}--carousel__navigation__btn\"\n            ?disabled=\"${pagesBefore === 0}\"\n            @click=\"${handleClickPrevButton}\"\n            aria-label=\"${prevButtonText || defaultPrevButtonText}\"\n            title=\"${prevButtonText || defaultPrevButtonText}\">\n            ${CaretLeft20()}\n          </button>\n          <span aria-hidden=\"true\">${formatStatus(status)}</span>\n          <span class=\"${prefix}--visually-hidden\" aria-live=\"polite\"></span>\n          <button\n            part=\"next-button\"\n            class=\"${prefix}--btn ${prefix}--btn--tertiary ${prefix}--btn--icon-only ${prefix}--carousel__navigation__btn\"\n            ?disabled=\"${pagesSince <= 1}\"\n            @click=\"${handleClickNextButton}\"\n            aria-label=\"${nextButtonText || defaultNextButtonText}\"\n            title=\"${nextButtonText || defaultNextButtonText}\">\n            ${CaretRight20()}\n          </button>\n        </nav>\n      </div>\n    `;\n  }\n\n  /**\n   * The CSS custom property name for the live page size.\n   * If the CSS custom property is set to `<div class=\"bx--carousel__scroll-container\">`\n   * or its ancestor (e.g. the host `<dds-carousel>`), this is set automatically from the CSS custom property.\n   */\n  static get customPropertyPageSize() {\n    return `--${ddsPrefix}--carousel--page-size`;\n  }\n\n  /**\n   * The name of the custom event fired when the video title is updated\n   */\n  static get eventVideoTitleUpdated() {\n    return `${ddsPrefix}-card-cta-video-title-updated`;\n  }\n\n  /**\n   * The selector for the card component\n   */\n  static get selectorItem() {\n    return `${ddsPrefix}-card`;\n  }\n\n  /**\n   * The selector for the card cta\n   */\n  static get selectorItemCardCTA() {\n    return `${ddsPrefix}-card-cta`;\n  }\n\n  /**\n   * The selector for the video cta container\n   */\n  static get selectorItemVideoCTAContainer() {\n    return `${ddsPrefix}-video-cta-container`;\n  }\n\n  /**\n   * A selector that will return the card item's eyebrow\n   */\n  static get selectorItemEyebrow() {\n    return `${ddsPrefix}-card-eyebrow`;\n  }\n\n  /**\n   * A selector that will return the card item's tag group\n   */\n  static get selectorItemTagGroup() {\n    return `${ddsPrefix}-tag-group`;\n  }\n\n  /**\n   * A selector that will return the card item's tag group\n   */\n  static get selectorItemParagraph() {\n    return `p`;\n  }\n\n  /**\n   * A selector that will return the card item's heading\n   */\n  static get selectorItemHeading() {\n    return `${ddsPrefix}-card-heading`;\n  }\n\n  /**\n   * A selector that will return the card item's footer\n   */\n  static get selectorItemFooter() {\n    return `${ddsPrefix}-card-cta-footer`;\n  }\n\n  static get stableSelector() {\n    return `${ddsPrefix}--carousel`;\n  }\n\n  /**\n   * A selector selecting tabbable nodes.\n   */\n  static get selectorTabbable() {\n    return `\n      ${selectorTabbable}\n    `;\n  }\n\n  static styles = styles;\n}\n\n/* @__GENERATE_REACT_CUSTOM_ELEMENT_TYPE__ */\nexport default DDSCarousel;\n"]}
+{"version":3,"sources":["components/carousel/carousel.ts"],"names":[],"mappings":"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","file":"carousel.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2020, 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 { html, property, state, query, LitElement } from 'lit-element';\nimport { carbonElement as customElement } from '../../internal/vendor/@carbon/web-components/globals/decorators/carbon-element.js';\nimport 'wicg-inert';\nimport settings from 'carbon-components/es/globals/js/settings.js';\nimport { slow01 } from '@carbon/motion';\nimport ifNonNull from '../../internal/vendor/@carbon/web-components/globals/directives/if-non-null.js';\nimport CaretLeft20 from '../../internal/vendor/@carbon/web-components/icons/caret--left/20.js';\nimport CaretRight20 from '../../internal/vendor/@carbon/web-components/icons/caret--right/20.js';\nimport HostListener from '../../internal/vendor/@carbon/web-components/globals/decorators/host-listener.js';\nimport HostListenerMixin from '../../internal/vendor/@carbon/web-components/globals/mixins/host-listener.js';\nimport { selectorTabbable } from '../../internal/vendor/@carbon/web-components/globals/settings.js';\nimport ddsSettings from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/settings/settings';\nimport sameHeight from '../../internal/vendor/@carbon/ibmdotcom-utilities/utilities/sameHeight/sameHeight';\nimport styles from './carousel.scss';\nimport StableSelectorMixin from '../../globals/mixins/stable-selector';\nimport DDSExpressiveModal from '../expressive-modal/expressive-modal';\n\nconst { prefix } = settings;\nconst { stablePrefix: ddsPrefix } = ddsSettings;\n\nconst MAX_GESTURE_DURATION = 300; // max time allowed to do swipe\nconst MIN_DISTANCE_TRAVELLED = 75; // min distance traveled to be considered swipe\nconst headingBottomMargin = 64; // tag constants used for same height calculations\n\n/**\n * Minimum percentage of a slide being visible for it to be interactable.\n */\nconst minIntersectionRatio = 0.75;\n\n/**\n * Carousel.\n *\n * @element dds-carousel\n * @csspart prev-button The button to go to the previous page.\n * @csspart next-button The button to go to the next page.\n */\n@customElement(`${ddsPrefix}-carousel`)\nclass DDSCarousel extends HostListenerMixin(StableSelectorMixin(LitElement)) {\n  /**\n   * The scrolling contents node.\n   */\n  @query(`.${prefix}--carousel__scroll-contents`)\n  private _contentsNode?: HTMLElement;\n\n  /**\n   * The node whose text content is announced to screen readers on change.\n   */\n  @query('[aria-live]')\n  private _announcementNode!: HTMLElement;\n\n  /**\n   * The width of the scroll contents area node, excluding one of overflowed contents.\n   */\n  @state()\n  private _contentsBaseWidth = 0;\n\n  /**\n   * The gap width between each card.\n   */\n  @state()\n  private _gap = 0;\n\n  /**\n   * Array to hold the card-heading elements within child items.\n   */\n  private _childItems: any[] = [];\n\n  /**\n   * Array to hold the card-heading elements within child items.\n   */\n  private _childItemHeadings: any[] = [];\n\n  /**\n   * Array to hold the card-eyebrow elements within child items.\n   */\n  private _childItemEyebrows: any[] = [];\n\n  /**\n   * Array to hold the tag-group elements within child items.\n   */\n  private _childItemTagGroup: any[] = [];\n\n  /**\n   * Array to hold the paragraph elements within child items.\n   */\n  private _childItemParagraphs: any[] = [];\n\n  /**\n   * Array to hold the card-cta-footer elements within child items.\n   */\n  private _childItemFooters: any[] = [];\n\n  /**\n   * The observer for the resize of the scroll container.\n   */\n  private _observerResizeContainer: any | null = null; // TODO: Wait for `.d.ts` update to support `ResizeObserver`\n\n  /**\n   * The observer for the resize of the viewport.\n   */\n  private _observerResizeRoot: any | null = null; // TODO: Wait for `.d.ts` update to support `ResizeObserver`\n\n  private _intersectionThresholdDifference =\n    Math.max(0.5, minIntersectionRatio) - Math.min(0.5, minIntersectionRatio);\n\n  /**\n   *  IntersectionObserver to watch carousel contents.\n   *  As items cross the minIntersectionRatio `inert` and `aria-hidden` are toggled.\n   */\n  private _intersectionObserver = new IntersectionObserver(\n    this._onIntersect.bind(this),\n    {\n      root: this._contentsNode,\n      threshold: [\n        0.5 + this._intersectionThresholdDifference,\n        0.5 - this._intersectionThresholdDifference,\n      ],\n    }\n  );\n\n  private _intersectionTimeout?;\n\n  /**\n   * IntersectionObserver callback.\n   * Carousel items with more than `minIntersectionRatio` visible will interactable.\n   *\n   * @param {IntersectionObserverEntry[]} entries Array of observed intersections.\n   */\n  private _onIntersect(entries) {\n    const {\n      _announcementNode: announcementNode,\n      formatAnnouncement,\n      _getStatus: status,\n      _intersectionTimeout: timeout,\n    } = this;\n\n    // Mark off-screen slides as [inert]\n    entries.forEach((entry) => {\n      const { target, isIntersecting, intersectionRatio } = entry;\n\n      if (isIntersecting && intersectionRatio > minIntersectionRatio) {\n        target.inert = false;\n        target.setAttribute('aria-hidden', false);\n      } else {\n        target.inert = true;\n        target.setAttribute('aria-hidden', true);\n      }\n    });\n\n    // Wait for slide action to finish, then announce slide information\n    clearTimeout(timeout);\n\n    // Delay should equal the design token in the carousel's styles.\n    const delay = parseInt(slow01, 10);\n\n    this._intersectionTimeout = setTimeout(() => {\n      announcementNode.innerText = formatAnnouncement(status);\n    }, delay);\n  }\n\n  /**\n   * The page size that is explicitly set.\n   */\n  @state()\n  private _pageSize?: number;\n\n  /**\n   * The page size that is automatically calculated upon viewport size\n   * via `--dds--carousel--page-size` CSS custom property.\n   * If `page-size` attribute is set, this value is ignored.\n   */\n  @state()\n  private _pageSizeAuto = 1;\n\n  /**\n   * The default slot.\n   */\n  @query('slot:not([name])')\n  private _slotNode?: HTMLSlotElement;\n\n  /**\n   * The number of total items.\n   */\n  @state()\n  private _total = 0;\n\n  /**\n   * Initial touch position (used to detect swipe gesture)\n   */\n  @state()\n  private _startPos = 0;\n\n  /**\n   * Initial touch time (used to detect swipe gesture)\n   */\n  @state()\n  private _startTime = 0;\n\n  /**\n   * Cleans-up and creates the resize observer for the scrolling container.\n   *\n   * @param [options] The options.\n   * @param [options.create] `true` to create the new resize observer.\n   */\n  private _cleanAndCreateObserverResize({ create }: { create?: boolean } = {}) {\n    const { _contentsNode: contentsNode } = this;\n    if (contentsNode) {\n      if (this._observerResizeContainer) {\n        this._observerResizeContainer.disconnect();\n        this._observerResizeContainer = null;\n      }\n      if (this._observerResizeRoot) {\n        this._observerResizeRoot.disconnect();\n        this._observerResizeRoot = null;\n      }\n      if (create) {\n        // TODO: Wait for `.d.ts` update to support `ResizeObserver`\n        // @ts-ignore\n        this._observerResizeRoot = new ResizeObserver(this._observeResizeRoot);\n        this._observerResizeRoot.observe(this.ownerDocument!.documentElement);\n        // TODO: Wait for `.d.ts` update to support `ResizeObserver`\n        // @ts-ignore\n        this._observerResizeContainer = new ResizeObserver(\n          this._observeResizeContainer\n        );\n        this._observerResizeContainer.observe(contentsNode);\n      }\n    }\n  }\n\n  /**\n   * Stops the container from scrolling when focusing on a card outside the viewport.\n   *\n   * @param event The event.\n   */\n  // eslint-disable-next-line class-methods-use-this\n  private _handleScrollFocus({ target }: Event) {\n    (target as HTMLElement).scrollTo(0, 0);\n  }\n\n  /**\n   * Handles card focus throughout pages.\n   *\n   * @param event The event.\n   */\n  @HostListener('shadowRoot:focusin')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleFocus = async ({ target }: FocusEvent) => {\n    const containsCurrent =\n      target !== this && this.contains(target as HTMLElement);\n    let currentItemIndex = 0;\n    Array.from(this._childItems).forEach((carouselItem, index) => {\n      if (carouselItem.contains(target as HTMLElement)) {\n        currentItemIndex = index;\n      }\n    });\n\n    // Calculates proper page to display if focus is outside the current page\n    if (\n      containsCurrent &&\n      (currentItemIndex < this.start ||\n        currentItemIndex >= this.start + this.pageSize)\n    ) {\n      // The `currentIndex` floored by `pageSize`\n      const nextStart =\n        Math.floor(currentItemIndex / this.pageSize) * this.pageSize;\n      const pageOffset = this.start % this.pageSize;\n\n      // Ensures the page moves by `this.pageSize` in either direction\n      this.start = nextStart + pageOffset;\n    }\n  };\n\n  /**\n   * Handles card with video heading and applies the set same height function.\n   *\n   * @param event The event.\n   */\n  @HostListener(`document:eventVideoTitleUpdated`)\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleVideoTitleUpdate = async (event: FocusEvent) => {\n    if (event) {\n      this._setSameHeight();\n    }\n  };\n\n  /**\n   * Handles `click` event on the next button.\n   */\n  private _handleClickNextButton() {\n    const { pageSize, start, _total: total } = this;\n    this.start = Math.min(start + pageSize, total - 1);\n  }\n\n  /**\n   * Handles `click` event on the prev button.\n   */\n  private _handleClickPrevButton() {\n    const { pageSize, start } = this;\n    this.start = Math.max(start - pageSize, 0);\n  }\n\n  /**\n   * Handles `touchstart` event.\n   */\n  private _handleTouchStartEvent(event: TouchEvent) {\n    this._startPos = event.touches[0].clientX;\n    this._startTime = new Date().getTime();\n  }\n\n  /**\n   * Handles `touchend` event.\n   */\n  private _handleTouchEndEvent(event: TouchEvent) {\n    const { _startPos, _startTime } = this;\n    const { pageSize, start, _total: total } = this;\n\n    const distTravelled = event.changedTouches[0].clientX - _startPos; // distance travelled\n    const elapsedTime = new Date().getTime() - _startTime; // elapsed time\n\n    if (\n      elapsedTime <= MAX_GESTURE_DURATION &&\n      Math.abs(distTravelled) >= MIN_DISTANCE_TRAVELLED\n    ) {\n      if (distTravelled < 0) {\n        this.start = Math.min(start + pageSize, total - 1);\n      } else {\n        this.start = Math.max(start - pageSize, 0);\n      }\n    }\n  }\n\n  /**\n   * Handles `slotchange` event.\n   */\n  private _handleSlotChange(event: Event) {\n    const slot = event.target as HTMLSlotElement;\n    const { name } = slot;\n    if (!name) {\n      this._total = slot\n        .assignedNodes()\n        .filter((node) => node.nodeType === Node.ELEMENT_NODE).length;\n    }\n    this._updateGap();\n\n    this._childItems = (event.target as HTMLSlotElement).assignedElements();\n\n    this._intersectionObserver.disconnect();\n\n    this._childItems.forEach((item) => {\n      this._intersectionObserver.observe(item);\n    });\n\n    // retrieve item heading, eyebrows, and footers to set same height\n    if (this._childItems) {\n      this._childItems\n        .filter((elem) =>\n          (elem as HTMLElement).matches !== undefined\n            ? (elem as HTMLElement).matches(\n                (this.constructor as typeof DDSCarousel).selectorItem\n              ) ||\n              (elem as HTMLElement).matches(\n                (this.constructor as typeof DDSCarousel)\n                  .selectorItemVideoCTAContainer\n              )\n            : false\n        )\n        .forEach((e) => {\n          this._childItemEyebrows.push(\n            (e as HTMLElement).querySelector(\n              (this.constructor as typeof DDSCarousel).selectorItemEyebrow\n            )\n          );\n          this._childItemParagraphs.push(\n            (e as HTMLElement).querySelector(\n              (this.constructor as typeof DDSCarousel).selectorItemParagraph\n            )\n          );\n          this._childItemTagGroup.push(\n            (e as HTMLElement).querySelector(\n              (this.constructor as typeof DDSCarousel).selectorItemTagGroup\n            )\n          );\n          this._childItemHeadings.push(\n            (e as HTMLElement).querySelector(\n              (this.constructor as typeof DDSCarousel).selectorItemHeading\n            )\n          );\n\n          this._childItemHeadings.push(\n            (e as HTMLElement)\n              .querySelector(\n                (this.constructor as typeof DDSCarousel).selectorItemCardCTA\n              )\n              ?.shadowRoot?.querySelector(\n                (this.constructor as typeof DDSCarousel).selectorItemHeading\n              )\n          );\n\n          this._childItemHeadings = this._childItemHeadings.filter(\n            (heading) => heading\n          );\n\n          this._childItemFooters.push(\n            (e as HTMLElement).querySelector(\n              (this.constructor as typeof DDSCarousel).selectorItemFooter\n            )\n          );\n        });\n      this._observeResizeRoot();\n      this.markHiddenAsInert();\n    }\n  }\n\n  /**\n   * The observer for the resize of the scroll container.\n   */\n  private _observeResizeContainer = (records) => {\n    const { contentRect } = records[records.length - 1];\n    const { width: contentsBaseWidth } = contentRect;\n    this._contentsBaseWidth = contentsBaseWidth;\n    this._updateGap();\n  };\n\n  /**\n   * The observer for the resize of the viewport.\n   */\n  private _observeResizeRoot = () => {\n    const { customPropertyPageSize } = this.constructor as typeof DDSCarousel;\n    const { _contentsNode: contentsNode } = this;\n    const { defaultView: w } = this.ownerDocument!;\n    this._pageSizeAuto = Number(\n      w!\n        .getComputedStyle(contentsNode!)\n        .getPropertyValue(customPropertyPageSize)\n    );\n    this._setSameHeight();\n  };\n\n  private get _getStatus() {\n    const { start, pageSize, _total: total } = this;\n    // Copes with the condition where `start % pageSize` is non-zero\n    const pagesBefore = Math.ceil(start / pageSize);\n    const pagesSince = Math.ceil((total - start) / pageSize);\n    return {\n      currentPage: Math.ceil(start / pageSize) + 1,\n      pages: pagesBefore + pagesSince,\n    };\n  }\n\n  private _setSameHeight = () => {\n    // check if items are not null before using sameHeight\n\n    sameHeight(\n      this._childItemEyebrows.filter((item) => item !== null),\n      'sm'\n    );\n    sameHeight(\n      this._childItemHeadings.filter((item) => item !== null),\n      'sm'\n    );\n    sameHeight(\n      this._childItemParagraphs.filter((item) => item !== null),\n      'sm'\n    );\n    sameHeight(\n      this._childItemFooters.filter((item) => item !== null),\n      'sm'\n    );\n\n    let tagGroupHeight: number = 0;\n\n    // Get the tallest height of tag groups.\n    this._childItemTagGroup.forEach((item) => {\n      if (item) {\n        const groupHeight = (item as HTMLElement).offsetHeight;\n        if (groupHeight > tagGroupHeight) {\n          tagGroupHeight = groupHeight;\n        }\n      }\n    });\n\n    this._childItemHeadings.forEach((e) => {\n      // add tag group height to heading to the cards lacking tag group\n      if (\n        e &&\n        !e.nextElementSibling?.matches(\n          (this.constructor as typeof DDSCarousel).selectorItemTagGroup\n        )\n      ) {\n        e.style.marginBottom = `${tagGroupHeight + headingBottomMargin}px`;\n      }\n    });\n  };\n\n  /**\n   * Calculates the width between cards.\n   */\n  private _updateGap() {\n    const { _contentsNode: contentsNode, _slotNode: slotNode } = this;\n    const elems = slotNode!\n      .assignedNodes()\n      .filter((node) => node.nodeType === Node.ELEMENT_NODE);\n    this._gap =\n      elems.length <= 1\n        ? 0\n        : (contentsNode!.scrollWidth -\n            elems.reduce(\n              (acc, elem) => acc + ((elem as HTMLElement).offsetWidth ?? 0),\n              0\n            )) /\n          (elems.length - 1);\n  }\n\n  get focusableElements() {\n    const { selectorTabbable: selectorTabbableForCarousel } = this\n      .constructor as typeof DDSExpressiveModal;\n    return [\n      ...Array.from(\n        (this.shadowRoot?.querySelectorAll(\n          selectorTabbableForCarousel\n        ) as NodeListOf<HTMLElement>) || []\n      ),\n      ...Array.from(\n        this.querySelectorAll(\n          selectorTabbableForCarousel\n        ) as NodeListOf<HTMLElement>\n      ),\n    ];\n  }\n\n  /**\n   * The formatters for the pagination status & aria-live announcement.\n   * Should be changed with the locale in which the UI is rendered.\n   */\n  @property({ attribute: false })\n  formatStatus = ({ currentPage, pages }) => `${currentPage} / ${pages}`;\n\n  @property({ attribute: false })\n  formatAnnouncement = ({ currentPage, pages }) => {\n    const visibleItemsCount = this._childItems.filter(\n      (item) => !item.matches('[inert]')\n    ).length;\n\n    return `Slide ${currentPage} of ${pages}. Showing ${visibleItemsCount} items.`;\n  };\n\n  /**\n   * Number of items per page.\n   * If `--dds--carousel--page-size` CSS custom property is set to `<div class=\"bx--carousel__scroll-container\">`\n   * or its ancestor (e.g. the host `<dds-carousel>`), this is set automatically from `--dds--carousel--page-size`.\n   */\n  @property({ type: Number, attribute: 'page-size' })\n  get pageSize() {\n    const { _pageSize: pageSize, _pageSizeAuto: pageSizeAuto } = this;\n    return pageSize ?? pageSizeAuto;\n  }\n\n  set pageSize(value: number) {\n    this._pageSize = value;\n    // Don't call `.requestUpdate()` here given we track updates via `_pageSize` and `_pageSizeAuto`\n  }\n\n  /**\n   * The assistive text for the button to go to next slide/group.\n   */\n  @property({ attribute: 'next-button-text' })\n  nextButtonText?: string;\n\n  private _defaultNextButtonText = 'next';\n\n  private _defaultPrevButtonText = 'previous';\n\n  /**\n   * The assistive text for the button to go to previous slide/group.\n   */\n  @property({ attribute: 'prev-button-text' })\n  prevButtonText?: string;\n\n  /**\n   * The current zero-based index of the left-most card.\n   */\n  @property({ type: Number })\n  start = 0;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._cleanAndCreateObserverResize({ create: true });\n\n    const containingModal = this.closest(\n      `${ddsPrefix}-expressive-modal`\n    ) as DDSExpressiveModal | null;\n    if (containingModal) {\n      containingModal.hasFocusableElements.push(this);\n      this.setAttribute('in-modal', '');\n\n      setTimeout(() => {\n        containingModal.modalBody!.style.overflow = 'hidden';\n        containingModal.modalBody!.style.width = 'var(--modal-vw)';\n      }, 0);\n    }\n  }\n\n  markHiddenAsInert() {\n    const { _childItems: childItems, start, pageSize } = this;\n\n    childItems.forEach((item) => {\n      const index = childItems.indexOf(item);\n      item.inert = index < start || index > start + pageSize - 1;\n    });\n  }\n\n  disconnectedCallback() {\n    this._cleanAndCreateObserverResize();\n    super.disconnectedCallback();\n  }\n\n  firstUpdated() {\n    this._cleanAndCreateObserverResize({ create: true });\n  }\n\n  protected updated(changedProperties) {\n    if (changedProperties.has('start')) {\n      this.markHiddenAsInert();\n    }\n  }\n\n  render() {\n    const { customPropertyPageSize } = this.constructor as typeof DDSCarousel;\n    const {\n      nextButtonText,\n      _defaultNextButtonText: defaultNextButtonText,\n      pageSize,\n      prevButtonText,\n      _defaultPrevButtonText: defaultPrevButtonText,\n      start,\n      _contentsBaseWidth: contentsBaseWidth,\n      _gap: gap,\n      _pageSize: pageSizeExplicit,\n      _total: total,\n      _getStatus: status,\n      formatStatus,\n      _handleClickNextButton: handleClickNextButton,\n      _handleClickPrevButton: handleClickPrevButton,\n      _handleScrollFocus: handleScrollFocus,\n      _handleSlotChange: handleSlotChange,\n      _handleTouchStartEvent: handleTouchStartEvent,\n      _handleTouchEndEvent: handleTouchEndEvent,\n    } = this;\n    // Copes with the condition where `start % pageSize` is non-zero\n    const pagesBefore = Math.ceil(start / pageSize);\n    const pagesSince = Math.ceil((total - start) / pageSize);\n    // Use another div from the host `<dds-carousel>` to reflect private state\n    return html`\n      <div role=\"region\" aria-labelledby=\"carousel-title\">\n        <div id=\"carousel-title\">\n          <slot name=\"title\">\n            <span class=\"bx--visually-hidden\">Carousel</span>\n          </slot>\n        </div>\n        <div\n          class=\"${prefix}--carousel__scroll-container\"\n          @scroll=\"${handleScrollFocus}\"\n          @touchstart=\"${handleTouchStartEvent}\"\n          @touchend=\"${handleTouchEndEvent}\"\n          style=\"${ifNonNull(\n            pageSizeExplicit == null\n              ? null\n              : `${customPropertyPageSize}: ${pageSizeExplicit}`\n          )}\">\n          <div\n            class=\"${prefix}--carousel__scroll-contents\"\n            style=\"left:${(-start * (contentsBaseWidth + gap)) / pageSize}px\">\n            <slot @slotchange=\"${handleSlotChange}\"></slot>\n          </div>\n        </div>\n        <nav\n          aria-label=\"Carousel Navigation\"\n          class=\"${prefix}--carousel__navigation\">\n          <button\n            part=\"prev-button\"\n            class=\"${prefix}--btn ${prefix}--btn--tertiary ${prefix}--btn--icon-only ${prefix}--carousel__navigation__btn\"\n            ?disabled=\"${pagesBefore === 0}\"\n            @click=\"${handleClickPrevButton}\"\n            aria-label=\"${prevButtonText || defaultPrevButtonText}\"\n            title=\"${prevButtonText || defaultPrevButtonText}\">\n            ${CaretLeft20()}\n          </button>\n          <span aria-hidden=\"true\">${formatStatus(status)}</span>\n          <span class=\"${prefix}--visually-hidden\" aria-live=\"polite\"></span>\n          <button\n            part=\"next-button\"\n            class=\"${prefix}--btn ${prefix}--btn--tertiary ${prefix}--btn--icon-only ${prefix}--carousel__navigation__btn\"\n            ?disabled=\"${pagesSince <= 1}\"\n            @click=\"${handleClickNextButton}\"\n            aria-label=\"${nextButtonText || defaultNextButtonText}\"\n            title=\"${nextButtonText || defaultNextButtonText}\">\n            ${CaretRight20()}\n          </button>\n        </nav>\n      </div>\n    `;\n  }\n\n  /**\n   * The CSS custom property name for the live page size.\n   * If the CSS custom property is set to `<div class=\"bx--carousel__scroll-container\">`\n   * or its ancestor (e.g. the host `<dds-carousel>`), this is set automatically from the CSS custom property.\n   */\n  static get customPropertyPageSize() {\n    return `--${ddsPrefix}--carousel--page-size`;\n  }\n\n  /**\n   * The name of the custom event fired when the video title is updated\n   */\n  static get eventVideoTitleUpdated() {\n    return `${ddsPrefix}-card-cta-video-title-updated`;\n  }\n\n  /**\n   * The selector for the card component\n   */\n  static get selectorItem() {\n    return `${ddsPrefix}-card`;\n  }\n\n  /**\n   * The selector for the card cta\n   */\n  static get selectorItemCardCTA() {\n    return `${ddsPrefix}-card-cta`;\n  }\n\n  /**\n   * The selector for the video cta container\n   */\n  static get selectorItemVideoCTAContainer() {\n    return `${ddsPrefix}-video-cta-container`;\n  }\n\n  /**\n   * A selector that will return the card item's eyebrow\n   */\n  static get selectorItemEyebrow() {\n    return `${ddsPrefix}-card-eyebrow`;\n  }\n\n  /**\n   * A selector that will return the card item's tag group\n   */\n  static get selectorItemTagGroup() {\n    return `${ddsPrefix}-tag-group`;\n  }\n\n  /**\n   * A selector that will return the card item's tag group\n   */\n  static get selectorItemParagraph() {\n    return `p`;\n  }\n\n  /**\n   * A selector that will return the card item's heading\n   */\n  static get selectorItemHeading() {\n    return `${ddsPrefix}-card-heading`;\n  }\n\n  /**\n   * A selector that will return the card item's footer\n   */\n  static get selectorItemFooter() {\n    return `${ddsPrefix}-card-cta-footer`;\n  }\n\n  static get stableSelector() {\n    return `${ddsPrefix}--carousel`;\n  }\n\n  /**\n   * A selector selecting tabbable nodes.\n   */\n  static get selectorTabbable() {\n    return `\n      ${selectorTabbable}\n    `;\n  }\n\n  static styles = styles;\n}\n\n/* @__GENERATE_REACT_CUSTOM_ELEMENT_TYPE__ */\nexport default DDSCarousel;\n"]}

package/es/components/carousel/carousel.js

@@ -18,6 +18,7 @@ var _decorate2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/deco
 var _get2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/get"));
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/getPrototypeOf"));
 var _litElement = require("lit-element");
+var _carbonElement = require("../../internal/vendor/@carbon/web-components/globals/decorators/carbon-element.js");
 require("wicg-inert");
 var _settings = _interopRequireDefault(require("carbon-components/es/globals/js/settings.js"));
 var _motion = require("@carbon/motion");
@@ -53,7 +54,7 @@ var minIntersectionRatio = 0.75;
  * @csspart prev-button The button to go to the previous page.
  * @csspart next-button The button to go to the next page.
  */
-var DDSCarousel = (0, _decorate2["default"])([(0, _litElement.customElement)("".concat(ddsPrefix, "-carousel"))], function (_initialize, _HostListenerMixin) {
+var DDSCarousel = (0, _decorate2["default"])([(0, _carbonElement.carbonElement)("".concat(ddsPrefix, "-carousel"))], function (_initialize, _HostListenerMixin) {
   var DDSCarousel = /*#__PURE__*/function (_HostListenerMixin2) {
     (0, _inherits2["default"])(DDSCarousel, _HostListenerMixin2);
     var _super = _createSuper(DDSCarousel);