fix: correct @element jsDoc listing across library

packages/accordion/src/Accordion.ts

@@ -26,6 +26,7 @@ import { Focusable, getActiveElement } from '@spectrum-web-components/shared';
 
 /**
  * @element sp-accordion
+ * @slot - The sp-accordion-item children to display.
  */
 export class Accordion extends Focusable {
     public static get styles(): CSSResultArray {

packages/action-bar/src/ActionBar.ts

@@ -22,6 +22,7 @@ export const actionBarVariants = ['sticky', 'fixed'];
 
 /**
  * @element sp-action-bar
+ * @slot - Content to display with the Action Bar
  */
 export class ActionBar extends SpectrumElement {
     public static get styles(): CSSResultArray {

packages/action-group/src/ActionGroup.ts

@@ -26,6 +26,7 @@ const EMPTY_SELECTION: string[] = [];
 
 /**
  * @element sp-action-group
+ * @slot - the sp-action-button elements that make up the group
  */
 export class ActionGroup extends SpectrumElement {
     public static get styles(): CSSResultArray {

packages/avatar/src/Avatar.ts

@@ -22,7 +22,7 @@ import {
 import avatarStyles from './avatar.css.js';
 
 /**
- * Avatar component
+ * @element sp-avatar
  */
 export class Avatar extends SpectrumElement {
     public static get styles(): CSSResultArray {

packages/banner/src/Banner.ts

@@ -21,7 +21,7 @@ import {
 import bannerStyles from './banner.css.js';
 
 /**
- * Banner component
+ * @element sp-banner
  *
  * @attr type - Determines the style, can be "info", "warning", or "error". Default is "info"
  * @attr corner - Determines if banner sets position at upper right corner or not.

packages/button/src/Button.ts

@@ -26,7 +26,6 @@ export type ButtonVariants =
     | 'negative';
 
 /**
- * A Spectrum button control.
  * @element sp-button
  */
 export class Button extends SizedMixin(StyledButton) {

packages/button/src/ClearButton.ts

@@ -21,6 +21,9 @@ import buttonStyles from './clear-button.css.js';
 import '@spectrum-web-components/icons-ui/icons/sp-icon-cross75.js';
 import crossMediumStyles from '@spectrum-web-components/icon/src/spectrum-icon-cross.css.js';
 
+/**
+ * @element sp-clear-button
+ */
 export class ClearButton extends StyledButton {
     public static get styles(): CSSResultArray {
         return [...super.styles, buttonStyles, crossMediumStyles];

packages/checkbox/src/Checkbox.ts

@@ -88,6 +88,9 @@ const dashIcon = {
 
 type CheckboxSize = Exclude<ElementSize, 'xxl'>;
 
+/**
+ * @element sp-checkbox
+ */
 export class Checkbox extends SizedMixin(CheckboxBase) {
     @property({ type: Boolean, reflect: true })
     public indeterminate = false;

packages/dropzone/src/Dropzone.ts

@@ -25,6 +25,8 @@ export type DropzoneEventDetail = DragEvent;
 export type DropEffects = 'copy' | 'move' | 'link' | 'none';
 
 /**
+ * @element sp-dropzone
+ *
  * @slot - The default slot on an `sp-dropzone` is a great place to place upload instructions
  * built with an `sp-illustrated-message` or other information, possibly even built from data
  * provided by the upload, to support users successfully interacting with the drag and drop

packages/icon/src/Icon.ts

@@ -22,6 +22,9 @@ import { IconsetRegistry } from '@spectrum-web-components/iconset/src/iconset-re
 
 import { IconBase } from './IconBase.js';
 
+/**
+ * @element sp-icon
+ */
 export class Icon extends IconBase {
     @property()
     public src?: string;

packages/icons-ui/bin/build.js

@@ -38,7 +38,7 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */`;
 
-glob(`${rootDir}/node_modules/${iconsPath}/**.svg`, (err, icons) => {
+glob(`${rootDir}/node_modules/${iconsPath}/**.svg`, (error, icons) => {
     if (!fs.existsSync(`${rootDir}packages/icons-ui/src`)) {
         fs.mkdirSync(`${rootDir}packages/icons-ui/src`);
     }
@@ -148,6 +148,7 @@ glob(`${rootDir}/node_modules/${iconsPath}/**.svg`, (err, icons) => {
             'utf-8'
         );
 
+        const iconElementName = `sp-icon-${Case.kebab(ComponentName)}`;
         const iconElement = `
         ${disclaimer}
 
@@ -166,6 +167,9 @@ glob(`${rootDir}/node_modules/${iconsPath}/**.svg`, (err, icons) => {
             setCustomTemplateLiteralTag
         } from '../custom-tag.js';
 
+        /**
+         * @element ${iconElementName}
+         */
         export class Icon${ComponentName} extends IconBase {
             protected render(): TemplateResult {
                 setCustomTemplateLiteralTag(html);
@@ -199,7 +203,6 @@ glob(`${rootDir}/node_modules/${iconsPath}/**.svg`, (err, icons) => {
             'utf-8'
         );
 
-        const iconElementName = `sp-icon-${Case.kebab(ComponentName)}`;
         const iconRegistration = `
         ${disclaimer}
 

packages/icons-workflow/bin/build.js

@@ -38,7 +38,7 @@ OF ANY KIND, either express or implied. See the License for the specific languag
 governing permissions and limitations under the License.
 */`;
 
-glob(`${rootDir}/node_modules/${iconsPath}/**.svg`, (err, icons) => {
+glob(`${rootDir}/node_modules/${iconsPath}/**.svg`, (error, icons) => {
     if (!fs.existsSync(`${rootDir}packages/icons-workflow/src`)) {
         fs.mkdirSync(`${rootDir}packages/icons-workflow/src`);
     }
@@ -170,6 +170,7 @@ glob(`${rootDir}/node_modules/${iconsPath}/**.svg`, (err, icons) => {
             'utf-8'
         );
 
+        const iconElementName = `sp-icon-${Case.kebab(ComponentName)}`;
         const iconElement = `
         ${disclaimer}
 
@@ -188,6 +189,9 @@ glob(`${rootDir}/node_modules/${iconsPath}/**.svg`, (err, icons) => {
             setCustomTemplateLiteralTag
         } from '../custom-tag.js';
 
+        /**
+         * @element ${iconElementName}
+         */
         export class Icon${ComponentName} extends IconBase {
             protected render(): TemplateResult {
                 setCustomTemplateLiteralTag(html);
@@ -221,7 +225,6 @@ glob(`${rootDir}/node_modules/${iconsPath}/**.svg`, (err, icons) => {
             'utf-8'
         );
 
-        const iconElementName = `sp-icon-${Case.kebab(ComponentName)}`;
         const iconRegistration = `
         ${disclaimer}
 

packages/icons/src/IconsLarge.ts

@@ -16,6 +16,9 @@ import { IconsetSVG } from '@spectrum-web-components/iconset/src/iconset-svg.js'
 
 import iconsSVG from './icons-large.svg.js';
 
+/**
+ * @element sp-icons-large
+ */
 export class IconsLarge extends IconsetSVG {
     public constructor() {
         super();

packages/icons/src/IconsMedium.ts

@@ -16,6 +16,9 @@ import { IconsetSVG } from '@spectrum-web-components/iconset/src/iconset-svg.js'
 
 import iconsSVG from './icons-medium.svg.js';
 
+/**
+ * @element sp-icons-medium
+ */
 export class IconsMedium extends IconsetSVG {
     public constructor() {
         super();

packages/illustrated-message/src/IllustratedMessage.ts

@@ -23,9 +23,10 @@ import headingStyles from '@spectrum-web-components/styles/heading.js';
 import bodyStyles from '@spectrum-web-components/styles/body.js';
 
 /**
+ * @element sp-illustrated-message
+ *
  * @slot - The SVG that represents the illustration
  */
-
 export class IllustratedMessage extends SpectrumElement {
     public static readonly is = 'sp-illustrated-message';
 

packages/link/src/Link.ts

@@ -22,7 +22,7 @@ import { Focusable } from '@spectrum-web-components/shared/src/focusable.js';
 import linkStyles from './link.css.js';
 
 /**
- * Spectrum Link Component
+ * @element sp-link
  *
  * @attr quiet - uses quiet styles or not
  * @attr over-background - uses over background styles or not

packages/menu/src/Menu.ts

@@ -41,6 +41,7 @@ type RoleType = 'group' | 'menu' | 'listbox' | 'none';
 /**
  * Spectrum Menu Component
  * @element sp-menu
+ *
  * @fires change - Announces that the `value` of the element has changed
  * @attr selects - whether the element has a specific selection algorithm that it applies
  *   to its item descendants. `single` allows only one descendent to be selected at a time.

packages/menu/src/MenuDivider.ts

@@ -15,9 +15,7 @@ import { CSSResultArray, SpectrumElement } from '@spectrum-web-components/base';
 import menuDividerStyles from './menu-divider.css.js';
 
 /**
- * Spectrum Menu Divider Component
  * @element sp-menu-divider
- *
  */
 export class MenuDivider extends SpectrumElement {
     public static get styles(): CSSResultArray {

packages/menu/src/MenuGroup.ts

@@ -22,7 +22,6 @@ import '../sp-menu.js';
 import menuGroupStyles from './menu-group.css.js';
 
 /**
- * Spectrum Menu Group Component
  * @element sp-menu-group
  *
  * @slot header - headline of the menu group

packages/menu/src/MenuItem.ts

@@ -88,8 +88,8 @@ const addOrUpdateEvent = new MenuItemAddedOrUpdatedEvent();
 const removeEvent = new MenuItemRemovedEvent();
 
 /**
- * Spectrum Menu Item Component
  * @element sp-menu-item
+ *
  * @slot value - content placed at the end of the Menu Item like values, keyboard shortcuts, etc.
  * @fires sp-menu-item-added - announces the item has been added so a parent menu can take ownerships
  * @fires sp-menu-item-removed - announces when removed from the DOM so the parent menu can remove ownership and update selected state

packages/overlay/src/ActiveOverlay.ts

@@ -113,6 +113,9 @@ const stateTransition = (
     return stateMachine.states[state].on[event] || state;
 };
 
+/**
+ * @element active-overlay
+ */
 export class ActiveOverlay extends SpectrumElement {
     public overlayContent!: HTMLElement;
     public overlayContentTip?: HTMLElement;

packages/overlay/src/OverlayTrigger.ts

@@ -32,7 +32,6 @@ import overlayTriggerStyles from './overlay-trigger.css.js';
 export type OverlayContentTypes = 'click' | 'hover' | 'longpress';
 
 /**
- * A overlay trigger component for displaying overlays relative to other content.
  * @element overlay-trigger
  *
  * @slot trigger - The content that will trigger the various overlays

packages/popover/src/Popover.ts

@@ -25,10 +25,11 @@ import {
 import popoverStyles from './popover.css.js';
 
 /**
+ * @element sp-popover
+ *
  * @attr {Boolean} open - The open state of the popover
  * @attr {Boolean} dialog - Adds some padding to the popover
  */
-
 export class Popover extends SpectrumElement {
     public static get styles(): CSSResultArray {
         return [popoverStyles];

packages/radio/src/Radio.ts

@@ -24,7 +24,7 @@ import { FocusVisiblePolyfillMixin } from '@spectrum-web-components/shared/src/f
 import radioStyles from './radio.css.js';
 
 /**
- * Spectrum Radio Button Component
+ * @element sp-radio
  *
  * @attr label-below - Moves the label below the radio button
  * @attr invalid - Uses the invalid style

packages/radio/src/RadioGroup.ts

@@ -23,9 +23,9 @@ import { FieldGroup } from '@spectrum-web-components/field-group';
 import { Radio } from './Radio.js';
 
 /**
- * Radio group component
- * @slot - The `sp-radio` elements to display/manage in the group.
+ * @element sp-radio-group
  *
+ * @slot - The `sp-radio` elements to display/manage in the group.
  */
 export class RadioGroup extends FocusVisiblePolyfillMixin(FieldGroup) {
     @property({ type: String })

packages/search/src/Search.ts

@@ -28,6 +28,9 @@ import searchStyles from './search.css.js';
 
 const stopPropagation = (event: Event): void => event.stopPropagation();
 
+/**
+ * @element sp-search
+ */
 export class Search extends Textfield {
     public static get styles(): CSSResultArray {
         return [...super.styles, searchStyles];

packages/sidenav/src/SidenavHeading.ts

@@ -22,6 +22,9 @@ import {
 import sidenavItemStyles from './sidenav-item.css.js';
 import sidenavHeadingStyles from './sidenav-heading.css.js';
 
+/**
+ * @element sp-sidenav-heading
+ */
 export class SideNavHeading extends SpectrumElement {
     @property({ reflect: true })
     public label = '';

packages/sidenav/src/SidenavItem.ts

@@ -25,6 +25,9 @@ import { SidenavSelectDetail, SideNav } from './Sidenav.js';
 
 import sidenavItemStyles from './sidenav-item.css.js';
 
+/**
+ * @element sp-sidenav-item
+ */
 export class SideNavItem extends LikeAnchor(Focusable) {
     public static get styles(): CSSResultArray {
         return [sidenavItemStyles];

packages/slider/src/Slider.ts

@@ -32,6 +32,9 @@ import { SliderHandle } from './SliderHandle.js';
 
 export const variants = ['filled', 'ramp', 'range', 'tick'];
 
+/**
+ * @element sp-slider
+ */
 export class Slider extends ObserveSlotText(SliderHandle, '') {
     public static get styles(): CSSResultArray {
         return [sliderStyles];

packages/slider/src/SliderHandle.ts

@@ -67,6 +67,9 @@ const MaxConverter = {
     },
 };
 
+/**
+ * @element sp-slider-handle
+ */
 export class SliderHandle extends Focusable {
     public handleController?: Controller;
 

packages/split-view/src/SplitView.ts

@@ -40,6 +40,7 @@ const COLLAPSE_THREASHOLD = 50;
 
 /**
  * @element sp-split-view
+ *
  * @slot Two sibling elements to be sized by the element attritubes
  */
 export class SplitView extends SpectrumElement {

packages/status-light/src/StatusLight.ts

@@ -22,7 +22,6 @@ import {
 import statusLightStyles from './status-light.css.js';
 
 /**
- * A Spectrum status light control.
  * @element sp-status-light
  */
 export class StatusLight extends SizedMixin(SpectrumElement) {

packages/switch/src/Switch.ts

@@ -21,6 +21,9 @@ import { CheckboxBase } from '@spectrum-web-components/checkbox/src/CheckboxBase
 import switchStyles from './switch.css.js';
 import legacyStyles from './switch-legacy.css.js';
 
+/**
+ * @element sp-switch
+ */
 export class Switch extends CheckboxBase {
     public static get styles(): CSSResultArray {
         /* c8 ignore next 4 */

packages/tabs/src/Tab.ts

@@ -27,9 +27,10 @@ import {
 import tabItemStyles from './tab.css.js';
 
 /**
+ * @element sp-tab
+ *
  * @slot icon - The icon that appears on the left of the label
  */
-
 export class Tab extends FocusVisiblePolyfillMixin(
     ObserveSlotText(ObserveSlotPresence(SpectrumElement, '[slot="icon"]'), '')
 ) {

packages/tabs/src/TabPanel.ts

@@ -21,6 +21,7 @@ import {
 import panelStyles from './tab-panel.css.js';
 
 /**
+ * @element sp-tab-panel
  */
 export class TabPanel extends SpectrumElement {
     static styles = [panelStyles];

packages/tabs/src/Tabs.ts

@@ -41,6 +41,8 @@ declare global {
 const noSelectionStyle = 'transform: translateX(0px) scaleX(0) scaleY(0)';
 
 /**
+ * @element sp-tabs
+ *
  * @slot - Child tab elements
  * @attr {Boolean} quiet - The tabs border is a lot smaller
  * @attr {Boolean} compact - The collection of tabs take up less space