chore(core): remove 1st-gen type references from 2nd-gen core

2nd-gen/packages/core/components/alert-banner/AlertBanner.types.ts

@@ -19,9 +19,3 @@ export const ALERT_BANNER_VALID_VARIANTS = [
 export type AlertBannerVariant =
   | (typeof ALERT_BANNER_VALID_VARIANTS)[number]
   | '';
-
-/**
- * @deprecated Use `AlertBannerVariant` instead.
- * Kept as `string` for backward compatibility with 1st-gen.
- */
-export type AlertBannerVariants = string;

2nd-gen/packages/core/components/badge/Badge.base.ts

@@ -106,6 +106,20 @@ export abstract class BadgeBase extends SizedMixin(
   @property({ type: String, reflect: true })
   public fixed?: FixedValues;
 
+  /**
+   * Whether the badge is subtle.
+   */
+  @property({ type: Boolean, reflect: true })
+  public subtle: boolean = false;
+
+  /**
+   * Whether the badge is outlined.
+   *
+   * Can only be used with semantic variants.
+   */
+  @property({ type: Boolean, reflect: true })
+  public outline: boolean = false;
+
   // ──────────────────────
   //     IMPLEMENTATION
   // ──────────────────────

2nd-gen/packages/core/components/badge/Badge.types.ts

@@ -10,10 +10,6 @@
  * governing permissions and limitations under the License.
  */
 
-/*
- * @todo The S1 types can be removed once we are no longer maintaining 1st-gen.
- */
-
 import type { ElementSize } from '@spectrum-web-components/core/mixins/index.js';
 
 // ──────────────────
@@ -65,32 +61,6 @@ export const FIXED_VALUES = [
   'inline-end',
 ] as const;
 
-// ──────────────────────────────────────────
-//     S1-ONLY (remove with 1st-gen)
-// ──────────────────────────────────────────
-
-export const BADGE_VARIANTS_COLOR_S1 = [
-  'fuchsia',
-  'indigo',
-  'magenta',
-  'purple',
-  'seafoam',
-  'yellow',
-  'gray',
-  'red',
-  'orange',
-  'chartreuse',
-  'celery',
-  'green',
-  'cyan',
-  'blue',
-] as const satisfies readonly BadgeColorVariant[];
-
-export const BADGE_VARIANTS_S1 = [
-  ...BADGE_VARIANTS_SEMANTIC,
-  ...BADGE_VARIANTS_COLOR_S1,
-] as const;
-
 // ──────────────────
 //     CANONICAL
 // ──────────────────
@@ -109,10 +79,6 @@ export type FixedValues = (typeof FIXED_VALUES)[number];
 export type BadgeSize = (typeof BADGE_VALID_SIZES)[number];
 export type BadgeSemanticVariant = (typeof BADGE_VARIANTS_SEMANTIC)[number];
 
-// S1-only (remove with 1st-gen)
-export type BadgeColorVariantS1 = (typeof BADGE_VARIANTS_COLOR_S1)[number]; // remove with 1st-gen
-export type BadgeVariantS1 = (typeof BADGE_VARIANTS_S1)[number]; // remove with 1st-gen
-
 // Canonical
 export type BadgeColorVariant = (typeof BADGE_VARIANTS_COLOR)[number];
 export type BadgeVariant = (typeof BADGE_VARIANTS)[number];

2nd-gen/packages/core/components/progress-circle/ProgressCircle.types.ts

@@ -17,16 +17,7 @@ export const PROGRESS_CIRCLE_VALID_SIZES = [
   'm',
   'l',
 ] as const satisfies ElementSize[];
-export const PROGRESS_CIRCLE_STATIC_COLORS_S1 = ['white'] as const;
-export const PROGRESS_CIRCLE_STATIC_COLORS_S2 = [
-  ...PROGRESS_CIRCLE_STATIC_COLORS_S1,
-  'black',
-] as const;
+export const PROGRESS_CIRCLE_STATIC_COLORS = ['white', 'black'] as const;
 
-export type ProgressCircleStaticColorS1 =
-  (typeof PROGRESS_CIRCLE_STATIC_COLORS_S1)[number];
-export type ProgressCircleStaticColorS2 =
-  (typeof PROGRESS_CIRCLE_STATIC_COLORS_S2)[number];
 export type ProgressCircleStaticColor =
-  | ProgressCircleStaticColorS1
-  | ProgressCircleStaticColorS2;
+  (typeof PROGRESS_CIRCLE_STATIC_COLORS)[number];

2nd-gen/packages/core/components/status-light/StatusLight.base.ts

@@ -16,7 +16,7 @@ import { SpectrumElement } from '@spectrum-web-components/core/element/index.js'
 import { SizedMixin } from '@spectrum-web-components/core/mixins/index.js';
 
 import {
-  STATUS_LIGHT_VALID_SIZES,
+  STATUSLIGHT_VALID_SIZES,
   type StatusLightVariant,
 } from './StatusLight.types.js';
 
@@ -27,7 +27,7 @@ import {
  * @attribute {ElementSize} size - The size of the status light.
  */
 export abstract class StatusLightBase extends SizedMixin(SpectrumElement, {
-  validSizes: STATUS_LIGHT_VALID_SIZES,
+  validSizes: STATUSLIGHT_VALID_SIZES,
   noDefaultSize: true,
 }) {
   // ─────────────────────────
@@ -91,31 +91,20 @@ export abstract class StatusLightBase extends SizedMixin(SpectrumElement, {
   //     IMPLEMENTATION
   // ──────────────────────
 
-  protected override update(changedProperties: PropertyValues): void {
+  protected override updated(changes: PropertyValues): void {
+    super.updated(changes);
     if (window.__swc?.DEBUG) {
       const constructor = this.constructor as typeof StatusLightBase;
       if (!constructor.VARIANTS.includes(this.variant)) {
         window.__swc.warn(
           this,
           `<${this.localName}> element expects the "variant" attribute to be one of the following:`,
-          'https://opensource.adobe.com/spectrum-web-components/second-gen/?path=/docs/components-status-light--docs',
+          'https://opensource.adobe.com/spectrum-web-components/components/status-light/#variants',
           {
             issues: [...constructor.VARIANTS],
           }
         );
       }
-      // Check disabled property if it exists (S1 only)
-      if (this.hasAttribute('disabled') && !('disabled' in this)) {
-        window.__swc.warn(
-          this,
-          `<${this.localName}> element does not support the disabled state.`,
-          'https://opensource.adobe.com/spectrum-web-components/second-gen/?path=/docs/components-status-light--docs',
-          {
-            issues: ['disabled is not a supported property in Spectrum 2'],
-          }
-        );
-      }
     }
-    super.update(changedProperties);
   }
 }

2nd-gen/packages/core/components/status-light/StatusLight.types.ts

@@ -10,45 +10,28 @@
  * governing permissions and limitations under the License.
  */
 
-/*
- * @todo The S1 types can be removed once we are no longer maintaining 1st-gen.
+/**
+ * @todo Rename STATUSLIGHT_ prefix to STATUS_LIGHT_ to align with type prefix
+ * naming convention (use underscore separators for multi-word names).
  */
-
 import type { ElementSize } from '@spectrum-web-components/core/mixins/index.js';
 
-// ──────────────────
-//     SHARED
-// ──────────────────
-
-export const STATUS_LIGHT_VALID_SIZES = [
+export const STATUSLIGHT_VALID_SIZES = [
   's',
   'm',
   'l',
   'xl',
 ] as const satisfies readonly ElementSize[];
 
-export const STATUS_LIGHT_VARIANTS_SEMANTIC = [
+export const STATUSLIGHT_VARIANTS_SEMANTIC = [
   'neutral',
   'info',
   'positive',
   'negative',
   'notice',
 ] as const;
 
-export const STATUS_LIGHT_VARIANTS_SEMANTIC_S2 = [
-  ...STATUS_LIGHT_VARIANTS_SEMANTIC,
-] as const;
-
-// ──────────────────────────────────────────
-//     S1-ONLY (remove with 1st-gen)
-// ──────────────────────────────────────────
-
-export const STATUS_LIGHT_VARIANTS_SEMANTIC_S1 = [
-  ...STATUS_LIGHT_VARIANTS_SEMANTIC,
-  'accent',
-] as const;
-
-export const STATUS_LIGHT_VARIANTS_COLOR_S1 = [
+export const STATUSLIGHT_VARIANTS_COLOR = [
   'fuchsia',
   'indigo',
   'magenta',
@@ -58,56 +41,22 @@ export const STATUS_LIGHT_VARIANTS_COLOR_S1 = [
   'chartreuse',
   'celery',
   'cyan',
-] as const;
-
-export const STATUS_LIGHT_VARIANTS_S1 = [
-  ...STATUS_LIGHT_VARIANTS_SEMANTIC_S1,
-  ...STATUS_LIGHT_VARIANTS_COLOR_S1,
-] as const;
-
-// ──────────────────
-//     CANONICAL
-// ──────────────────
-
-export const STATUS_LIGHT_VARIANTS_COLOR_S2 = [
-  ...STATUS_LIGHT_VARIANTS_COLOR_S1,
   'pink',
   'turquoise',
   'brown',
   'cinnamon',
   'silver',
 ] as const;
 
-export const STATUS_LIGHT_VARIANTS_S2 = [
-  ...STATUS_LIGHT_VARIANTS_SEMANTIC_S2,
-  ...STATUS_LIGHT_VARIANTS_COLOR_S2,
+export const STATUSLIGHT_VARIANTS = [
+  ...STATUSLIGHT_VARIANTS_SEMANTIC,
+  ...STATUSLIGHT_VARIANTS_COLOR,
 ] as const;
 
-// ──────────────────
-//     TYPES
-// ──────────────────
-
-// S1-only (remove with 1st-gen)
-export type StatusLightSemanticVariantS1 =
-  (typeof STATUS_LIGHT_VARIANTS_SEMANTIC_S1)[number];
-export type StatusLightColorVariantS1 =
-  (typeof STATUS_LIGHT_VARIANTS_COLOR_S1)[number];
-export type StatusLightVariantS1 = (typeof STATUS_LIGHT_VARIANTS_S1)[number];
-
-// Canonical (S2)
-export type StatusLightSemanticVariantS2 =
-  (typeof STATUS_LIGHT_VARIANTS_SEMANTIC_S2)[number];
-export type StatusLightColorVariantS2 =
-  (typeof STATUS_LIGHT_VARIANTS_COLOR_S2)[number];
-export type StatusLightVariantS2 = (typeof STATUS_LIGHT_VARIANTS_S2)[number];
-
-// Base class (S1 | S2)
 export type StatusLightSemanticVariant =
-  | StatusLightSemanticVariantS1
-  | StatusLightSemanticVariantS2;
+  (typeof STATUSLIGHT_VARIANTS_SEMANTIC)[number];
+
 export type StatusLightColorVariant =
-  | StatusLightColorVariantS1
-  | StatusLightColorVariantS2;
-export type StatusLightVariant = StatusLightVariantS1 | StatusLightVariantS2;
+  (typeof STATUSLIGHT_VARIANTS_COLOR)[number];
 
-export type StatusLightSize = (typeof STATUS_LIGHT_VALID_SIZES)[number];
+export type StatusLightVariant = (typeof STATUSLIGHT_VARIANTS)[number];

2nd-gen/packages/swc/components/badge/Badge.ts

@@ -66,32 +66,11 @@ export class Badge extends BadgeBase {
    * The variant of the badge.
    *
    * @todo - Implement new badge variants (notification, indicator) introduced in S2. Jira ticket: SWC-1831
+   * Implement as separate component based on React https://github.com/adobe/react-spectrum/blob/main/packages/%40react-spectrum/s2/src/NotificationBadge.tsx
    */
   @property({ type: String, reflect: true })
   public override variant: BadgeVariant = 'neutral';
 
-  // ───────────────────
-  //     API ADDITIONS
-  // ───────────────────
-
-  /**
-   * Whether the badge is subtle.
-   *
-   * @todo This can be moved to the base class once we are no longer maintaining 1st-gen.
-   */
-  @property({ type: Boolean, reflect: true })
-  public subtle: boolean = false;
-
-  /**
-   * Whether the badge is outlined.
-   *
-   * Can only be used with semantic variants.
-   *
-   * @todo This can be moved to the base class once we are no longer maintaining 1st-gen.
-   */
-  @property({ type: Boolean, reflect: true })
-  public outline: boolean = false;
-
   // ──────────────────────────────
   //     RENDERING & STYLING
   // ──────────────────────────────

2nd-gen/packages/swc/components/progress-circle/ProgressCircle.ts

@@ -15,9 +15,9 @@ import { property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 
 import {
-  PROGRESS_CIRCLE_STATIC_COLORS_S2,
+  PROGRESS_CIRCLE_STATIC_COLORS,
   ProgressCircleBase,
-  type ProgressCircleStaticColorS2,
+  type ProgressCircleStaticColor,
 } from '@spectrum-web-components/core/components/progress-circle';
 import { capitalize } from '@spectrum-web-components/core/utils/index.js';
 
@@ -53,7 +53,7 @@ export class ProgressCircle extends ProgressCircleBase {
   /**
    * @internal
    */
-  static override readonly STATIC_COLORS = PROGRESS_CIRCLE_STATIC_COLORS_S2;
+  static override readonly STATIC_COLORS = PROGRESS_CIRCLE_STATIC_COLORS;
 
   /**
    * Static color variant for use on different backgrounds.
@@ -63,7 +63,7 @@ export class ProgressCircle extends ProgressCircleBase {
    * When set to 'black', the component uses black styling for images with a light tinted background.
    */
   @property({ reflect: true, attribute: 'static-color' })
-  public override staticColor?: ProgressCircleStaticColorS2;
+  public override staticColor?: ProgressCircleStaticColor;
 
   // ──────────────────────────────
   //     RENDERING & STYLING

2nd-gen/packages/swc/components/status-light/StatusLight.ts

@@ -15,11 +15,11 @@ import { property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 
 import {
-  STATUS_LIGHT_VARIANTS_COLOR_S2,
-  STATUS_LIGHT_VARIANTS_S2,
-  STATUS_LIGHT_VARIANTS_SEMANTIC_S2,
+  STATUSLIGHT_VARIANTS,
+  STATUSLIGHT_VARIANTS_COLOR,
+  STATUSLIGHT_VARIANTS_SEMANTIC,
   StatusLightBase,
-  type StatusLightVariantS2 as StatusLightVariant,
+  type StatusLightVariant,
 } from '@spectrum-web-components/core/components/status-light';
 
 import styles from './status-light.css';
@@ -32,7 +32,6 @@ import styles from './status-light.css';
  * @since 0.0.1
  *
  * @property {string} variant - Semantic or non-semantic color variant for the status dot.
- * @attribute {ElementSize} size - The size of the status light.
  *
  * @example
  * <swc-status-light variant="positive">Approved</swc-status-light>
@@ -48,18 +47,17 @@ export class StatusLight extends StatusLightBase {
   /**
    * @internal
    */
-  static override readonly VARIANTS_COLOR = STATUS_LIGHT_VARIANTS_COLOR_S2;
+  static override readonly VARIANTS_COLOR = STATUSLIGHT_VARIANTS_COLOR;
 
   /**
    * @internal
    */
-  static override readonly VARIANTS_SEMANTIC =
-    STATUS_LIGHT_VARIANTS_SEMANTIC_S2;
+  static override readonly VARIANTS_SEMANTIC = STATUSLIGHT_VARIANTS_SEMANTIC;
 
   /**
    * @internal
    */
-  static override readonly VARIANTS = STATUS_LIGHT_VARIANTS_S2;
+  static override readonly VARIANTS = STATUSLIGHT_VARIANTS;
 
   /**
    * Changes the color of the status dot. The variant list includes both semantic and non-semantic options.