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

package/es/components/tile/expandable-tile.js

@@ -21,6 +21,7 @@ import FocusMixin from '../../globals/mixins/focus';
 import HostListenerMixin from '../../globals/mixins/host-listener';
 import { TILE_COLOR_SCHEME } from './defs';
 import styles from "././tile.css.js";
+import { classMap } from 'lit/directives/class-map';
 
 /**
  * Expandable tile.
@@ -30,15 +31,7 @@ import styles from "././tile.css.js";
  *   The custom event fired before the expanded state is changed upon a user gesture.
  *   Cancellation of this event stops changing the user-initiated change in expanded state.
  * @fires cds-expandable-tile-toggled - The custom event fired after a the expanded state is changed upon a user gesture.
- */ /**
-     * Expandable tile.
-     *
-     * @element cds-expandable-tile
-     * @fires cds-expandable-tile-beingtoggled
-     *   The custom event fired before the expanded state is changed upon a user gesture.
-     *   Cancellation of this event stops changing the user-initiated change in expanded state.
-     * @fires cds-expandable-tile-toggled - The custom event fired after a the expanded state is changed upon a user gesture.
-     */
+ */
 let BXExpandableTile = _decorate([customElement(`${prefix}-expandable-tile`)], function (_initialize, _HostListenerMixin) {
   class BXExpandableTile extends _HostListenerMixin {
     constructor(...args) {
@@ -74,28 +67,37 @@ let BXExpandableTile = _decorate([customElement(`${prefix}-expandable-tile`)], f
         }, 0);
         this.requestUpdate();
       }
+    }, {
+      kind: "method",
+      key: "_handleExpand",
+      value: function _handleExpand() {
+        const expanded = !this.expanded;
+        this.focus();
+        const init = {
+          bubbles: true,
+          composed: true,
+          detail: {
+            expanded
+          }
+        };
+        const constructor = this.constructor;
+        const beforeChangeEvent = new CustomEvent(constructor.eventBeforeToggle, _objectSpread(_objectSpread({}, init), {}, {
+          cancelable: true
+        }));
+        if (this.dispatchEvent(beforeChangeEvent)) {
+          this.expanded = expanded;
+          const afterChangeEvent = new CustomEvent(constructor.eventToggle, init);
+          this.dispatchEvent(afterChangeEvent);
+        }
+      }
     }, {
       kind: "field",
       decorators: [HostListener('click')],
       key: "_handleClick",
       value() {
         return () => {
-          const expanded = !this.expanded;
-          const init = {
-            bubbles: true,
-            composed: true,
-            detail: {
-              expanded
-            }
-          };
-          const constructor = this.constructor;
-          const beforeChangeEvent = new CustomEvent(constructor.eventBeforeToggle, _objectSpread(_objectSpread({}, init), {}, {
-            cancelable: true
-          }));
-          if (this.dispatchEvent(beforeChangeEvent)) {
-            this.expanded = expanded;
-            const afterChangeEvent = new CustomEvent(constructor.eventToggle, init);
-            this.dispatchEvent(afterChangeEvent);
+          if (!this.withInteractive) {
+            this._handleExpand();
           }
         };
       }
@@ -119,6 +121,17 @@ let BXExpandableTile = _decorate([customElement(`${prefix}-expandable-tile`)], f
       value() {
         return false;
       }
+    }, {
+      kind: "field",
+      decorators: [property({
+        type: Boolean,
+        reflect: true,
+        attribute: 'with-interactive'
+      })],
+      key: "withInteractive",
+      value() {
+        return false;
+      }
     }, {
       kind: "method",
       key: "render",
@@ -129,17 +142,27 @@ let BXExpandableTile = _decorate([customElement(`${prefix}-expandable-tile`)], f
       /**
        * `true` to expand this expandable tile.
        */
+      /**
+       * `true` to expand this expandable tile.
+       */
       function render() {
         const {
           expanded,
+          withInteractive,
           _belowTheContentHeight: belowTheContentHeight,
           _handleSlotChangeBelowTheFoldContent: handleSlotChangeBelowTheFoldContent
         } = this;
+        const classes = classMap({
+          [`${prefix}--tile__chevron`]: true,
+          [`${prefix}--tile__chevron--interactive`]: withInteractive
+        });
         return html(_t || (_t = _`
       <button
-        class="${0}--tile__chevron"
+        class="${0}"
         aria-labelledby="above-the-fold-content"
         aria-controls="below-the-fold-content"
+        tabindex="0"
+        @click="${0}"
         aria-expanded="${0}">
         ${0}
       </button>
@@ -151,7 +174,7 @@ let BXExpandableTile = _decorate([customElement(`${prefix}-expandable-tile`)], f
           <slot @slotchange="${0}"></slot>
         </div>
       </div>
-    `), prefix, String(Boolean(expanded)), ChevronDown16({
+    `), classes, withInteractive ? this._handleExpand : '', String(Boolean(expanded)), ChevronDown16({
           id: 'icon'
         }), prefix, prefix, ifDefined(!expanded ? undefined : `max-height: ${belowTheContentHeight}px`), handleSlotChangeBelowTheFoldContent);
       }
@@ -178,15 +201,6 @@ let BXExpandableTile = _decorate([customElement(`${prefix}-expandable-tile`)], f
       value: function eventToggle() {
         return `${prefix}-expandable-tile-toggled`;
       }
-    }, {
-      kind: "field",
-      static: true,
-      key: "shadowRootOptions",
-      value() {
-        return _objectSpread(_objectSpread({}, LitElement.shadowRootOptions), {}, {
-          delegatesFocus: true
-        });
-      }
     }, {
       kind: "field",
       static: true,

package/es/components/tile/expandable-tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"expandable-tile.js","names":["LitElement","html","property","customElement","ifDefined","ChevronDown16","prefix","HostListener","FocusMixin","HostListenerMixin","TILE_COLOR_SCHEME","styles","BXExpandableTile","_decorate","_initialize","_HostListenerMixin","constructor","args","F","d","kind","key","value","_handleSlotChangeBelowTheFoldContent","event","_belowTheContentHeight","target","assignedNodes","reduce","acc","item","_offsetHeight","offsetHeight","requestUpdate","decorators","expanded","init","bubbles","composed","detail","beforeChangeEvent","CustomEvent","eventBeforeToggle","_objectSpread","cancelable","dispatchEvent","afterChangeEvent","eventToggle","attribute","reflect","REGULAR","type","Boolean","render","belowTheContentHeight","handleSlotChangeBelowTheFoldContent","_t","_","String","id","undefined","static","shadowRootOptions","delegatesFocus"],"sources":["components/tile/expandable-tile.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport ChevronDown16 from '@carbon/icons/lib/chevron--down/16';\nimport { prefix } from '../../globals/settings';\nimport HostListener from '../../globals/decorators/host-listener';\nimport FocusMixin from '../../globals/mixins/focus';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss';\n\n/**\n * Expandable tile.\n *\n * @element cds-expandable-tile\n * @fires cds-expandable-tile-beingtoggled\n *   The custom event fired before the expanded state is changed upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated change in expanded state.\n * @fires cds-expandable-tile-toggled - The custom event fired after a the expanded state is changed upon a user gesture.\n */\n@customElement(`${prefix}-expandable-tile`)\nclass BXExpandableTile extends HostListenerMixin(FocusMixin(LitElement)) {\n  /**\n   * The computed height of the below-the-fold content.\n   */\n  private _belowTheContentHeight = 0;\n\n  /**\n   * Handles `slotchange` event on the below-the-fold content.\n   *\n   * @param event The event.\n   */\n  private _handleSlotChangeBelowTheFoldContent(event: Event) {\n    this._belowTheContentHeight = (event.target as HTMLSlotElement)\n      .assignedNodes()\n      .reduce(\n        (acc, item) => acc + ((item as HTMLElement).offsetHeight ?? 0),\n        0\n      );\n    this.requestUpdate();\n  }\n\n  @HostListener('click')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleClick = () => {\n    const expanded = !this.expanded;\n    const init = {\n      bubbles: true,\n      composed: true,\n      detail: {\n        expanded,\n      },\n    };\n    const constructor = this.constructor as typeof BXExpandableTile;\n    const beforeChangeEvent = new CustomEvent(constructor.eventBeforeToggle, {\n      ...init,\n      cancelable: true,\n    });\n    if (this.dispatchEvent(beforeChangeEvent)) {\n      this.expanded = expanded;\n      const afterChangeEvent = new CustomEvent(constructor.eventToggle, init);\n      this.dispatchEvent(afterChangeEvent);\n    }\n  };\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * `true` to expand this expandable tile.\n   */\n  @property({ type: Boolean, reflect: true })\n  expanded = false;\n\n  render() {\n    const {\n      expanded,\n      _belowTheContentHeight: belowTheContentHeight,\n      _handleSlotChangeBelowTheFoldContent: handleSlotChangeBelowTheFoldContent,\n    } = this;\n    return html`\n      <button\n        class=\"${prefix}--tile__chevron\"\n        aria-labelledby=\"above-the-fold-content\"\n        aria-controls=\"below-the-fold-content\"\n        aria-expanded=\"${String(Boolean(expanded))}\">\n        ${ChevronDown16({\n          id: 'icon',\n        })}\n      </button>\n      <div id=\"content\" class=\"${prefix}--tile-content\">\n        <div><slot name=\"above-the-fold-content\"></slot></div>\n        <div\n          class=\"${prefix}-ce--expandable-tile--below-the-fold-content\"\n          style=\"${ifDefined(\n            !expanded ? undefined : `max-height: ${belowTheContentHeight}px`\n          )}\">\n          <slot @slotchange=\"${handleSlotChangeBelowTheFoldContent}\"></slot>\n        </div>\n      </div>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired before the expanded state is changed upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated change in expanded state.\n   */\n  static get eventBeforeToggle() {\n    return `${prefix}-expandable-tile-beingtoggled`;\n  }\n\n  /**\n   * The name of the custom event fired after a the expanded state is changed upon a user gesture.\n   */\n  static get eventToggle() {\n    return `${prefix}-expandable-tile-toggled`;\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXExpandableTile;\n"],"mappings":"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"}
+{"version":3,"file":"expandable-tile.js","names":["LitElement","html","property","customElement","ifDefined","ChevronDown16","prefix","HostListener","FocusMixin","HostListenerMixin","TILE_COLOR_SCHEME","styles","classMap","BXExpandableTile","_decorate","_initialize","_HostListenerMixin","constructor","args","F","d","kind","key","value","_handleSlotChangeBelowTheFoldContent","event","_belowTheContentHeight","target","assignedNodes","reduce","acc","item","_offsetHeight","offsetHeight","requestUpdate","_handleExpand","expanded","focus","init","bubbles","composed","detail","beforeChangeEvent","CustomEvent","eventBeforeToggle","_objectSpread","cancelable","dispatchEvent","afterChangeEvent","eventToggle","decorators","withInteractive","attribute","reflect","REGULAR","type","Boolean","render","belowTheContentHeight","handleSlotChangeBelowTheFoldContent","classes","_t","_","String","id","undefined","static"],"sources":["components/tile/expandable-tile.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html } from 'lit';\nimport { property, customElement } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport ChevronDown16 from '@carbon/icons/lib/chevron--down/16';\nimport { prefix } from '../../globals/settings';\nimport HostListener from '../../globals/decorators/host-listener';\nimport FocusMixin from '../../globals/mixins/focus';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss';\nimport { classMap } from 'lit/directives/class-map';\n\n/**\n * Expandable tile.\n *\n * @element cds-expandable-tile\n * @fires cds-expandable-tile-beingtoggled\n *   The custom event fired before the expanded state is changed upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated change in expanded state.\n * @fires cds-expandable-tile-toggled - The custom event fired after a the expanded state is changed upon a user gesture.\n */\n@customElement(`${prefix}-expandable-tile`)\nclass BXExpandableTile extends HostListenerMixin(FocusMixin(LitElement)) {\n  /**\n   * The computed height of the below-the-fold content.\n   */\n  private _belowTheContentHeight = 0;\n\n  /**\n   * Handles `slotchange` event on the below-the-fold content.\n   *\n   * @param event The event.\n   */\n  private _handleSlotChangeBelowTheFoldContent(event: Event) {\n    this._belowTheContentHeight = (event.target as HTMLSlotElement)\n      .assignedNodes()\n      .reduce(\n        (acc, item) => acc + ((item as HTMLElement).offsetHeight ?? 0),\n        0\n      );\n    this.requestUpdate();\n  }\n\n  private _handleExpand() {\n    const expanded = !this.expanded;\n    this.focus();\n    const init = {\n      bubbles: true,\n      composed: true,\n      detail: {\n        expanded,\n      },\n    };\n    const constructor = this.constructor as typeof BXExpandableTile;\n    const beforeChangeEvent = new CustomEvent(constructor.eventBeforeToggle, {\n      ...init,\n      cancelable: true,\n    });\n    if (this.dispatchEvent(beforeChangeEvent)) {\n      this.expanded = expanded;\n      const afterChangeEvent = new CustomEvent(constructor.eventToggle, init);\n      this.dispatchEvent(afterChangeEvent);\n    }\n  }\n\n  @HostListener('click')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleClick = () => {\n    if (!this.withInteractive) {\n      this._handleExpand();\n    }\n  };\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * `true` to expand this expandable tile.\n   */\n  @property({ type: Boolean, reflect: true })\n  expanded = false;\n\n  /**\n   * `true` to expand this expandable tile.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'with-interactive' })\n  withInteractive = false;\n\n  render() {\n    const {\n      expanded,\n      withInteractive,\n      _belowTheContentHeight: belowTheContentHeight,\n      _handleSlotChangeBelowTheFoldContent: handleSlotChangeBelowTheFoldContent,\n    } = this;\n\n    const classes = classMap({\n      [`${prefix}--tile__chevron`]: true,\n      [`${prefix}--tile__chevron--interactive`]: withInteractive,\n    });\n    return html`\n      <button\n        class=\"${classes}\"\n        aria-labelledby=\"above-the-fold-content\"\n        aria-controls=\"below-the-fold-content\"\n        tabindex=\"0\"\n        @click=\"${withInteractive ? this._handleExpand : ''}\"\n        aria-expanded=\"${String(Boolean(expanded))}\">\n        ${ChevronDown16({\n          id: 'icon',\n        })}\n      </button>\n      <div id=\"content\" class=\"${prefix}--tile-content\">\n        <div><slot name=\"above-the-fold-content\"></slot></div>\n        <div\n          class=\"${prefix}-ce--expandable-tile--below-the-fold-content\"\n          style=\"${ifDefined(\n            !expanded ? undefined : `max-height: ${belowTheContentHeight}px`\n          )}\">\n          <slot @slotchange=\"${handleSlotChangeBelowTheFoldContent}\"></slot>\n        </div>\n      </div>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired before the expanded state is changed upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated change in expanded state.\n   */\n  static get eventBeforeToggle() {\n    return `${prefix}-expandable-tile-beingtoggled`;\n  }\n\n  /**\n   * The name of the custom event fired after a the expanded state is changed upon a user gesture.\n   */\n  static get eventToggle() {\n    return `${prefix}-expandable-tile-toggled`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXExpandableTile;\n"],"mappings":"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"}

package/es/components/tile/radio-tile.d.ts

@@ -7,358 +7,26 @@
  * LICENSE file in the root directory of this source tree.
  */
 import SelectableTile from './selectable-tile';
-declare const BXRadioTile_base: {
-    new (...args: any[]): {
-        _handles: Set<import("../../globals/internal/handle").default>;
-        connectedCallback(): void;
-        disconnectedCallback(): void;
-        accessKey: string;
-        readonly accessKeyLabel: string;
-        autocapitalize: string;
-        dir: string;
-        draggable: boolean;
-        hidden: boolean;
-        inert: boolean;
-        innerText: string;
-        lang: string;
-        readonly offsetHeight: number;
-        readonly offsetLeft: number;
-        readonly offsetParent: Element | null;
-        readonly offsetTop: number;
-        readonly offsetWidth: number;
-        outerText: string;
-        spellcheck: boolean;
-        title: string;
-        translate: boolean;
-        attachInternals(): ElementInternals;
-        click(): void;
-        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions | undefined): void;
-        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions | undefined): void;
-        removeEventListener<K_1 extends keyof HTMLElementEventMap>(type: K_1, listener: (this: HTMLElement, ev: HTMLElementEventMap[K_1]) => any, options?: boolean | EventListenerOptions | undefined): void;
-        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions | undefined): void;
-        readonly attributes: NamedNodeMap;
-        readonly classList: DOMTokenList;
-        className: string;
-        readonly clientHeight: number;
-        readonly clientLeft: number;
-        readonly clientTop: number;
-        readonly clientWidth: number;
-        id: string;
-        readonly localName: string;
-        readonly namespaceURI: string | null;
-        onfullscreenchange: ((this: Element, ev: Event) => any) | null;
-        onfullscreenerror: ((this: Element, ev: Event) => any) | null;
-        outerHTML: string;
-        readonly ownerDocument: Document;
-        readonly part: DOMTokenList;
-        readonly prefix: string | null;
-        readonly scrollHeight: number;
-        scrollLeft: number;
-        scrollTop: number;
-        readonly scrollWidth: number;
-        readonly shadowRoot: ShadowRoot | null;
-        slot: string;
-        readonly tagName: string;
-        attachShadow(init: ShadowRootInit): ShadowRoot;
-        closest<K_2 extends keyof HTMLElementTagNameMap>(selector: K_2): HTMLElementTagNameMap[K_2] | null;
-        closest<K_3 extends keyof SVGElementTagNameMap>(selector: K_3): SVGElementTagNameMap[K_3] | null;
-        closest<E extends Element = Element>(selectors: string): E | null;
-        getAttribute(qualifiedName: string): string | null;
-        getAttributeNS(namespace: string | null, localName: string): string | null;
-        getAttributeNames(): string[];
-        getAttributeNode(qualifiedName: string): Attr | null;
-        getAttributeNodeNS(namespace: string | null, localName: string): Attr | null;
-        getBoundingClientRect(): DOMRect;
-        getClientRects(): DOMRectList;
-        getElementsByClassName(classNames: string): HTMLCollectionOf<Element>;
-        getElementsByTagName<K_4 extends keyof HTMLElementTagNameMap>(qualifiedName: K_4): HTMLCollectionOf<HTMLElementTagNameMap[K_4]>;
-        getElementsByTagName<K_5 extends keyof SVGElementTagNameMap>(qualifiedName: K_5): HTMLCollectionOf<SVGElementTagNameMap[K_5]>;
-        getElementsByTagName(qualifiedName: string): HTMLCollectionOf<Element>;
-        getElementsByTagNameNS(namespaceURI: "http://www.w3.org/1999/xhtml", localName: string): HTMLCollectionOf<HTMLElement>;
-        getElementsByTagNameNS(namespaceURI: "http://www.w3.org/2000/svg", localName: string): HTMLCollectionOf<SVGElement>;
-        getElementsByTagNameNS(namespace: string | null, localName: string): HTMLCollectionOf<Element>;
-        hasAttribute(qualifiedName: string): boolean;
-        hasAttributeNS(namespace: string | null, localName: string): boolean;
-        hasAttributes(): boolean;
-        hasPointerCapture(pointerId: number): boolean;
-        insertAdjacentElement(where: InsertPosition, element: Element): Element | null;
-        insertAdjacentHTML(position: InsertPosition, text: string): void;
-        insertAdjacentText(where: InsertPosition, data: string): void;
-        matches(selectors: string): boolean;
-        releasePointerCapture(pointerId: number): void;
-        removeAttribute(qualifiedName: string): void;
-        removeAttributeNS(namespace: string | null, localName: string): void;
-        removeAttributeNode(attr: Attr): Attr;
-        requestFullscreen(options?: FullscreenOptions | undefined): Promise<void>;
-        requestPointerLock(): void;
-        scroll(options?: ScrollToOptions | undefined): void;
-        scroll(x: number, y: number): void;
-        scrollBy(options?: ScrollToOptions | undefined): void;
-        scrollBy(x: number, y: number): void;
-        scrollIntoView(arg?: boolean | ScrollIntoViewOptions | undefined): void;
-        scrollTo(options?: ScrollToOptions | undefined): void;
-        scrollTo(x: number, y: number): void;
-        setAttribute(qualifiedName: string, value: string): void;
-        setAttributeNS(namespace: string | null, qualifiedName: string, value: string): void;
-        setAttributeNode(attr: Attr): Attr | null;
-        setAttributeNodeNS(attr: Attr): Attr | null;
-        setPointerCapture(pointerId: number): void;
-        toggleAttribute(qualifiedName: string, force?: boolean | undefined): boolean;
-        webkitMatchesSelector(selectors: string): boolean;
-        readonly baseURI: string;
-        readonly childNodes: NodeListOf<ChildNode>;
-        readonly firstChild: ChildNode | null;
-        readonly isConnected: boolean;
-        readonly lastChild: ChildNode | null;
-        readonly nextSibling: ChildNode | null;
-        readonly nodeName: string;
-        readonly nodeType: number;
-        nodeValue: string | null;
-        readonly parentElement: HTMLElement | null;
-        readonly parentNode: ParentNode | null;
-        readonly previousSibling: ChildNode | null;
-        textContent: string | null;
-        appendChild<T extends Node>(node: T): T;
-        cloneNode(deep?: boolean | undefined): Node;
-        compareDocumentPosition(other: Node): number;
-        contains(other: Node | null): boolean;
-        getRootNode(options?: GetRootNodeOptions | undefined): Node;
-        hasChildNodes(): boolean;
-        insertBefore<T_1 extends Node>(node: T_1, child: Node | null): T_1;
-        isDefaultNamespace(namespace: string | null): boolean;
-        isEqualNode(otherNode: Node | null): boolean;
-        isSameNode(otherNode: Node | null): boolean;
-        lookupNamespaceURI(prefix: string | null): string | null;
-        lookupPrefix(namespace: string | null): string | null;
-        normalize(): void;
-        removeChild<T_2 extends Node>(child: T_2): T_2;
-        replaceChild<T_3 extends Node>(node: Node, child: T_3): T_3;
-        readonly ATTRIBUTE_NODE: number;
-        readonly CDATA_SECTION_NODE: number;
-        readonly COMMENT_NODE: number;
-        readonly DOCUMENT_FRAGMENT_NODE: number;
-        readonly DOCUMENT_NODE: number;
-        readonly DOCUMENT_POSITION_CONTAINED_BY: number;
-        readonly DOCUMENT_POSITION_CONTAINS: number;
-        readonly DOCUMENT_POSITION_DISCONNECTED: number;
-        readonly DOCUMENT_POSITION_FOLLOWING: number;
-        readonly DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: number;
-        readonly DOCUMENT_POSITION_PRECEDING: number;
-        readonly DOCUMENT_TYPE_NODE: number;
-        readonly ELEMENT_NODE: number;
-        readonly ENTITY_NODE: number;
-        readonly ENTITY_REFERENCE_NODE: number;
-        readonly NOTATION_NODE: number;
-        readonly PROCESSING_INSTRUCTION_NODE: number;
-        readonly TEXT_NODE: number;
-        dispatchEvent(event: Event): boolean;
-        ariaAtomic: string | null;
-        ariaAutoComplete: string | null;
-        ariaBusy: string | null;
-        ariaChecked: string | null;
-        ariaColCount: string | null;
-        ariaColIndex: string | null;
-        ariaColSpan: string | null;
-        ariaCurrent: string | null;
-        ariaDisabled: string | null;
-        ariaExpanded: string | null;
-        ariaHasPopup: string | null;
-        ariaHidden: string | null;
-        ariaKeyShortcuts: string | null;
-        ariaLabel: string | null;
-        ariaLevel: string | null;
-        ariaLive: string | null;
-        ariaModal: string | null;
-        ariaMultiLine: string | null;
-        ariaMultiSelectable: string | null;
-        ariaOrientation: string | null;
-        ariaPlaceholder: string | null;
-        ariaPosInSet: string | null;
-        ariaPressed: string | null;
-        ariaReadOnly: string | null;
-        ariaRequired: string | null;
-        ariaRoleDescription: string | null;
-        ariaRowCount: string | null;
-        ariaRowIndex: string | null;
-        ariaRowSpan: string | null;
-        ariaSelected: string | null;
-        ariaSetSize: string | null;
-        ariaSort: string | null;
-        ariaValueMax: string | null;
-        ariaValueMin: string | null;
-        ariaValueNow: string | null;
-        ariaValueText: string | null;
-        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;
-        remove(): void;
-        replaceWith(...nodes: (string | Node)[]): void;
-        innerHTML: string;
-        readonly nextElementSibling: Element | null;
-        readonly previousElementSibling: Element | null;
-        readonly childElementCount: number;
-        readonly children: HTMLCollection;
-        readonly firstElementChild: Element | null;
-        readonly lastElementChild: Element | null;
-        append(...nodes: (string | Node)[]): void;
-        prepend(...nodes: (string | Node)[]): void;
-        querySelector<K_6 extends keyof HTMLElementTagNameMap>(selectors: K_6): HTMLElementTagNameMap[K_6] | null;
-        querySelector<K_7 extends keyof SVGElementTagNameMap>(selectors: K_7): SVGElementTagNameMap[K_7] | null;
-        querySelector<E_1 extends Element = Element>(selectors: string): E_1 | null;
-        querySelectorAll<K_8 extends keyof HTMLElementTagNameMap>(selectors: K_8): NodeListOf<HTMLElementTagNameMap[K_8]>;
-        querySelectorAll<K_9 extends keyof SVGElementTagNameMap>(selectors: K_9): NodeListOf<SVGElementTagNameMap[K_9]>;
-        querySelectorAll<E_2 extends Element = Element>(selectors: string): NodeListOf<E_2>;
-        replaceChildren(...nodes: (string | Node)[]): void;
-        readonly assignedSlot: HTMLSlotElement | null;
-        oncopy: ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any) | null;
-        oncut: ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any) | null;
-        onpaste: ((this: DocumentAndElementEventHandlers, ev: ClipboardEvent) => any) | null;
-        readonly style: CSSStyleDeclaration;
-        contentEditable: string;
-        enterKeyHint: string;
-        inputMode: string;
-        readonly isContentEditable: boolean;
-        onabort: ((this: GlobalEventHandlers, ev: UIEvent) => any) | null;
-        onanimationcancel: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
-        onanimationend: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
-        onanimationiteration: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
-        onanimationstart: ((this: GlobalEventHandlers, ev: AnimationEvent) => any) | null;
-        onauxclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
-        oncanplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        oncanplaythrough: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onclose: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        oncontextmenu: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        oncuechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        ondblclick: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        ondrag: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondragend: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondragenter: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondragleave: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondragover: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondragstart: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondrop: ((this: GlobalEventHandlers, ev: DragEvent) => any) | null;
-        ondurationchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onemptied: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onended: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onerror: OnErrorEventHandler;
-        onfocus: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
-        onformdata: ((this: GlobalEventHandlers, ev: FormDataEvent) => any) | null;
-        ongotpointercapture: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        oninput: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        oninvalid: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onkeydown: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
-        onkeypress: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
-        onkeyup: ((this: GlobalEventHandlers, ev: KeyboardEvent) => any) | null;
-        onload: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onloadeddata: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onloadedmetadata: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onloadstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onlostpointercapture: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onmousedown: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onmouseenter: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onmouseleave: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onmousemove: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onmouseout: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onmouseover: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onmouseup: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
-        onpause: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onplay: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onplaying: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onpointercancel: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointerdown: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointerenter: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointerleave: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointermove: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointerout: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointerover: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onpointerup: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
-        onprogress: ((this: GlobalEventHandlers, ev: ProgressEvent<EventTarget>) => any) | null;
-        onratechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onreset: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onresize: ((this: GlobalEventHandlers, ev: UIEvent) => any) | null;
-        onscroll: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onsecuritypolicyviolation: ((this: GlobalEventHandlers, ev: SecurityPolicyViolationEvent) => any) | null;
-        onseeked: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onseeking: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onselect: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onselectionchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onselectstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onslotchange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onstalled: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onsubmit: ((this: GlobalEventHandlers, ev: SubmitEvent) => any) | null;
-        onsuspend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        ontimeupdate: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        ontoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        ontouchcancel?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
-        ontouchend?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
-        ontouchmove?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
-        ontouchstart?: ((this: GlobalEventHandlers, ev: TouchEvent) => any) | null | undefined;
-        ontransitioncancel: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
-        ontransitionend: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
-        ontransitionrun: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
-        ontransitionstart: ((this: GlobalEventHandlers, ev: TransitionEvent) => any) | null;
-        onvolumechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onwaiting: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onwebkitanimationend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onwebkitanimationiteration: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onwebkitanimationstart: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onwebkittransitionend: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        onwheel: ((this: GlobalEventHandlers, ev: WheelEvent) => any) | null;
-        autofocus: boolean;
-        readonly dataset: DOMStringMap;
-        nonce?: string | undefined;
-        tabIndex: number;
-        blur(): void;
-        focus(options?: FocusOptions | undefined): void;
-    };
-    _hostListeners: {
-        [listenerName: string]: {
-            [type: string]: {
-                options?: boolean | AddEventListenerOptions | undefined;
-            };
-        };
-    };
-} & typeof SelectableTile;
 /**
  * Single-selectable tile.
  *
  * @element cds-radio-tile
  */
-declare class BXRadioTile extends BXRadioTile_base {
-    /**
-     * The radio group manager associated with the radio button.
-     */
-    private _manager;
+declare class CDSRadioTile extends SelectableTile {
     /**
      * The `type` attribute of the `<input>`.
      */
     protected _inputType: string;
-    /**
-     * Attaches the radio button to the radio group manager.
-     */
-    private _attachManager;
-    /**
-     * Detaches the radio button to the radio group manager.
-     */
-    private _detachManager;
-    /**
-     * Handles `keydown` event on this element.
-     */
-    private _handleKeydown;
     /**
      * Handles `change` event on the `<input>` in the shadow DOM.
      */
     protected _handleChange(): void;
-    connectedCallback(): void;
-    disconnectedCallback(): void;
-    shouldUpdate(changedProperties: any): boolean;
-    updated(changedProperties: any): void;
     render(): import("lit-html").TemplateResult<1>;
+    /**
+     * The name of the custom event fired after this selectable tile changes its selected state.
+     */
+    static get eventRadioChange(): string;
 }
-export default BXRadioTile;
+export default CDSRadioTile;
 
 //# sourceMappingURL=radio-tile.d.ts.map

package/es/components/tile/radio-tile.d.ts.map

@@ -1 +1 @@
-{"version":3,"sources":["components/tile/radio-tile.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAYH,OAAO,cAAc,MAAM,mBAAmB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAa/C;;;;GAIG;AACH,cACM,WAAY,SAAQ,gBAAiC;IACzD;;OAEG;IACH,OAAO,CAAC,QAAQ,CAAqB;IAErC;;OAEG;IACH,SAAS,CAAC,UAAU,SAAW;IAE/B;;OAEG;IACH,OAAO,CAAC,cAAc;IAYtB;;OAEG;IACH,OAAO,CAAC,cAAc;IAOtB;;OAEG;IAGH,OAAO,CAAC,cAAc,CAapB;IAEF;;OAEG;IACH,SAAS,CAAC,aAAa;IAOvB,iBAAiB;IAKjB,oBAAoB;IAKpB,YAAY,CAAC,iBAAiB,KAAA;IAO9B,OAAO,CAAC,iBAAiB,KAAA;IAMzB,MAAM;CAsCP;AAED,eAAe,WAAW,CAAC","file":"radio-tile.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, svg } from 'lit';\nimport { classMap } from 'lit-html/directives/class-map';\nimport { ifDefined } from 'lit/directives/if-defined';\nimport { customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport RadioGroupManager, {\n  NAVIGATION_DIRECTION,\n} from '../../globals/internal/radio-group-manager';\nimport SelectableTile from './selectable-tile';\nimport CheckmarkFilled16 from '@carbon/icons/lib/checkmark--filled/16';\n\n/**\n * Map of navigation direction by key.\n */\nconst navigationDirectionForKey = {\n  ArrowUp: NAVIGATION_DIRECTION.BACKWARD,\n  Up: NAVIGATION_DIRECTION.BACKWARD, // IE\n  ArrowDown: NAVIGATION_DIRECTION.FORWARD,\n  Down: NAVIGATION_DIRECTION.FORWARD, // IE\n};\n\n/**\n * Single-selectable tile.\n *\n * @element cds-radio-tile\n */\n@customElement(`${prefix}-radio-tile`)\nclass BXRadioTile extends HostListenerMixin(SelectableTile) {\n  /**\n   * The radio group manager associated with the radio button.\n   */\n  private _manager!: RadioGroupManager;\n\n  /**\n   * The `type` attribute of the `<input>`.\n   */\n  protected _inputType = 'radio';\n\n  /**\n   * Attaches the radio button to the radio group manager.\n   */\n  private _attachManager() {\n    if (!this._manager) {\n      this._manager = RadioGroupManager.get(\n        this.getRootNode({ composed: true }) as Document\n      );\n    }\n    const { name, _inputNode: inputNode, _manager: manager } = this;\n    if (inputNode && name) {\n      manager!.add(inputNode);\n    }\n  }\n\n  /**\n   * Detaches the radio button to the radio group manager.\n   */\n  private _detachManager() {\n    const { _inputNode: inputNode, _manager: manager } = this;\n    if (inputNode && manager) {\n      manager.delete(inputNode);\n    }\n  }\n\n  /**\n   * Handles `keydown` event on this element.\n   */\n  @HostListener('keydown')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleKeydown = (event: KeyboardEvent) => {\n    const { _inputNode: inputNode } = this;\n    const manager = this._manager;\n    if (inputNode && manager) {\n      const navigationDirection = navigationDirectionForKey[event.key];\n      if (navigationDirection) {\n        manager.select(manager.navigate(inputNode, navigationDirection));\n        event.preventDefault(); // Prevent default (scrolling) behavior\n      }\n      if (event.key === ' ' || event.key === 'Enter') {\n        manager.select(inputNode);\n      }\n    }\n  };\n\n  /**\n   * Handles `change` event on the `<input>` in the shadow DOM.\n   */\n  protected _handleChange() {\n    super._handleChange();\n    if (this._manager) {\n      this._manager.select(this._inputNode);\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._attachManager();\n  }\n\n  disconnectedCallback() {\n    this._detachManager();\n    super.disconnectedCallback();\n  }\n\n  shouldUpdate(changedProperties) {\n    if (changedProperties.has('name')) {\n      this._detachManager();\n    }\n    return true;\n  }\n\n  updated(changedProperties) {\n    if (changedProperties.has('name')) {\n      this._attachManager();\n    }\n  }\n\n  render() {\n    const {\n      colorScheme,\n      checkmarkLabel,\n      name,\n      selected,\n      value,\n      _inputType: inputType,\n      _handleChange: handleChange,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--tile`]: true,\n      [`${prefix}--tile--selectable`]: true,\n      [`${prefix}--tile--is-selected`]: selected,\n      [`${prefix}--tile--${colorScheme}`]: colorScheme,\n    });\n    return html`\n      <input\n        type=\"${inputType}\"\n        id=\"input\"\n        class=\"${prefix}--tile-input\"\n        tabindex=\"-1\"\n        name=\"${ifDefined(name)}\"\n        value=\"${ifDefined(value)}\"\n        .checked=${selected}\n        @change=${handleChange} />\n      <label for=\"input\" class=\"${classes}\" tabindex=\"0\">\n        <div class=\"${prefix}--tile__checkmark\">\n          ${CheckmarkFilled16({\n            children: !checkmarkLabel\n              ? undefined\n              : svg`<title>${checkmarkLabel}</title>`,\n          })}\n        </div>\n        <div class=\"${prefix}--tile-content\"><slot></slot></div>\n      </label>\n    `;\n  }\n}\n\nexport default BXRadioTile;\n"]}
+{"version":3,"sources":["components/tile/radio-tile.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAOH,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAG/C;;;;GAIG;AACH,cACM,YAAa,SAAQ,cAAc;IACvC;;OAEG;IACH,SAAS,CAAC,UAAU,SAAW;IAE/B;;OAEG;IACH,SAAS,CAAC,aAAa;IAgBvB,MAAM;IAuCN;;OAEG;IACH,MAAM,KAAK,gBAAgB,WAE1B;CACF;AAED,eAAe,YAAY,CAAC","file":"radio-tile.d.ts","sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, svg } from 'lit';\nimport { classMap } from 'lit-html/directives/class-map';\nimport { ifDefined } from 'lit/directives/if-defined';\nimport { customElement } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport SelectableTile from './selectable-tile';\nimport CheckmarkFilled16 from '@carbon/icons/lib/checkmark--filled/16';\n\n/**\n * Single-selectable tile.\n *\n * @element cds-radio-tile\n */\n@customElement(`${prefix}-radio-tile`)\nclass CDSRadioTile extends SelectableTile {\n  /**\n   * The `type` attribute of the `<input>`.\n   */\n  protected _inputType = 'radio';\n\n  /**\n   * Handles `change` event on the `<input>` in the shadow DOM.\n   */\n  protected _handleChange() {\n    this.selected = true;\n    const { selected, name } = this;\n    const { eventRadioChange } = this.constructor as typeof CDSRadioTile;\n    this.dispatchEvent(\n      new CustomEvent(eventRadioChange, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          selected,\n          name,\n        },\n      })\n    );\n  }\n\n  render() {\n    const {\n      colorScheme,\n      checkmarkLabel,\n      name,\n      selected,\n      value,\n      _inputType: inputType,\n      _handleChange: handleChange,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--tile`]: true,\n      [`${prefix}--tile--selectable`]: true,\n      [`${prefix}--tile--is-selected`]: selected,\n      [`${prefix}--tile--${colorScheme}`]: colorScheme,\n    });\n    return html`\n      <input\n        type=\"${inputType}\"\n        id=\"input\"\n        class=\"${prefix}--tile-input\"\n        tabindex=\"-1\"\n        name=\"${ifDefined(name)}\"\n        value=\"${ifDefined(value)}\"\n        .checked=${selected}\n        @change=${handleChange} />\n      <label for=\"input\" class=\"${classes}\" tabindex=\"0\">\n        <div class=\"${prefix}--tile__checkmark\">\n          ${CheckmarkFilled16({\n            children: !checkmarkLabel\n              ? undefined\n              : svg`<title>${checkmarkLabel}</title>`,\n          })}\n        </div>\n        <div class=\"${prefix}--tile-content\"><slot></slot></div>\n      </label>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired after this selectable tile changes its selected state.\n   */\n  static get eventRadioChange() {\n    return `${prefix}-radio-tile-selected`;\n  }\n}\n\nexport default CDSRadioTile;\n"]}