From dfdc39bca433fc210e45fd2f4540bf7e19aa4b08 Mon Sep 17 00:00:00 2001
From: Anna Wen <54281166+annawen1@users.noreply.github.com>
Date: Mon, 26 Aug 2024 12:13:22 -0400
Subject: [PATCH] fix(accordion): apply carbon element decorator for accordion
 skeleton (#11989)

### Related Ticket(s)

Closes # {{Provide issue number link(s) to the related ticket(s) that this pull request addresses}}

### Description

Adopter running into issues with accordion component when using the accordion in multiple libraries as the `accordion-skeleton` component is not using the `carbonElement` decorator.

This PR also fixes a couple smaller issues with missing the `select` import in the `pagination/index.js` file and missing stylesheet import for the `dropdown` stackblitz example

### Changelog

**Changed**

- `accordion-skeleton` to use custom `carbonElement` decorator
- add `select` import in the `pagination/index.js` file
- include stylesheet import in the `dropdown` example

<!-- React and Web Component deploy previews are enabled by default. -->
<!-- To enable additional available deploy previews, apply the following -->
<!-- labels for the corresponding package: -->
<!-- *** "test: e2e": Codesandbox examples and e2e integration tests -->
<!-- *** "package: services": Services -->
<!-- *** "package: utilities": Utilities -->
<!-- *** "RTL": React / Web Components (RTL) -->
<!-- *** "feature flag": React / Web Components (experimental) -->
---
 .../examples/codesandbox/basic/components/dropdown/cdn.html | 2 +-
 .../codesandbox/basic/components/dropdown/index.html        | 2 ++
 .../src/components/accordion/accordion-skeleton.ts          | 6 ++++--
 .../src/components/pagination/index.ts                      | 3 ++-
 4 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/packages/carbon-web-components/examples/codesandbox/basic/components/dropdown/cdn.html b/packages/carbon-web-components/examples/codesandbox/basic/components/dropdown/cdn.html
index f7d0ae8507d..2a8c8756733 100644
--- a/packages/carbon-web-components/examples/codesandbox/basic/components/dropdown/cdn.html
+++ b/packages/carbon-web-components/examples/codesandbox/basic/components/dropdown/cdn.html
@@ -14,7 +14,7 @@
   <link rel="stylesheet"
         href="https://1.www.s81c.com/common/carbon-for-ibm-dotcom/tag/v1/latest/plex.css"/>
   <link rel="stylesheet" href="https://1.www.s81c.com/common/carbon/web-components/tag/v2/latest/grid.css" />
-  <link rel="stylesheet" href="https://1.www.s81c.com/common/carbon/web-components/tag/v2/latest/themes.css" /> 
+  <link rel="stylesheet" href="https://1.www.s81c.com/common/carbon/web-components/tag/v2/latest/themes.css" />
   <style>
     /* Suppress custom element until styles are loaded */
     cds-dropdown:not(:defined) {
diff --git a/packages/carbon-web-components/examples/codesandbox/basic/components/dropdown/index.html b/packages/carbon-web-components/examples/codesandbox/basic/components/dropdown/index.html
index bfac44af9b3..1d75f5e281e 100644
--- a/packages/carbon-web-components/examples/codesandbox/basic/components/dropdown/index.html
+++ b/packages/carbon-web-components/examples/codesandbox/basic/components/dropdown/index.html
@@ -13,6 +13,8 @@
   <meta charset="UTF-8" />
   <link rel="stylesheet"
         href="https://1.www.s81c.com/common/carbon-for-ibm-dotcom/tag/v1/latest/plex.css"/>
+
+  <link rel="stylesheet" href="src/styles.scss" />
   <style>
     /* Suppress custom element until styles are loaded */
     cds-dropdown:not(:defined) {
diff --git a/packages/carbon-web-components/src/components/accordion/accordion-skeleton.ts b/packages/carbon-web-components/src/components/accordion/accordion-skeleton.ts
index 750e2a165a7..323137a70bb 100644
--- a/packages/carbon-web-components/src/components/accordion/accordion-skeleton.ts
+++ b/packages/carbon-web-components/src/components/accordion/accordion-skeleton.ts
@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2019, 2023
+ * Copyright IBM Corp. 2019, 2024
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -9,7 +9,7 @@
 
 import { classMap } from 'lit/directives/class-map.js';
 import { LitElement, html } from 'lit';
-import { property, customElement } from 'lit/decorators.js';
+import { property } from 'lit/decorators.js';
 import { prefix } from '../../globals/settings';
 import { ACCORDION_ALIGNMENT } from './accordion';
 import { forEach } from '../../globals/internal/collection-helpers';
@@ -18,6 +18,8 @@ import './accordion-item-skeleton';
 import '../skeleton-text/index';
 import styles from './accordion.scss';
 
+import { carbonElement as customElement } from '../../globals/decorators/carbon-element';
+
 /**
  * Skeleton of code snippet.
  */
diff --git a/packages/carbon-web-components/src/components/pagination/index.ts b/packages/carbon-web-components/src/components/pagination/index.ts
index d44565c18f9..6a7a63e0d74 100644
--- a/packages/carbon-web-components/src/components/pagination/index.ts
+++ b/packages/carbon-web-components/src/components/pagination/index.ts
@@ -1,11 +1,12 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2021, 2023
+ * Copyright IBM Corp. 2021, 2024
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
 import '../select/select-item';
+import '../select/select';
 import './pagination';