@carbon/web-components 2.45.0 → 2.46.0

package/es-custom/components/contained-list/contained-list-description.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Copyright IBM Corp. 2022, 2025
+ *
+ * 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 { LitElement } from 'lit';
+/**
+ * Contained list description text.
+ *
+ * @element cds-custom-contained-list-description
+ * @slot - The description text content
+ */
+declare class CDSContainedListDescription extends LitElement {
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: any;
+}
+export default CDSContainedListDescription;

package/es-custom/components/contained-list/contained-list-description.js

@@ -0,0 +1,38 @@
+/**
+ * Copyright IBM Corp. 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 { __decorate } from 'tslib';
+import { LitElement, html } from 'lit';
+import { prefix } from '../../globals/settings.js';
+import styles from './contained-list.scss.js';
+import { carbonElement } from '../../globals/decorators/carbon-element.js';
+
+/**
+ * Copyright IBM Corp. 2022, 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/**
+ * Contained list description text.
+ *
+ * @element cds-custom-contained-list-description
+ * @slot - The description text content
+ */
+let CDSContainedListDescription = class CDSContainedListDescription extends LitElement {
+    render() {
+        return html `<slot></slot>`;
+    }
+};
+CDSContainedListDescription.styles = styles;
+CDSContainedListDescription = __decorate([
+    carbonElement(`${prefix}-contained-list-description`)
+], CDSContainedListDescription);
+var CDSContainedListDescription$1 = CDSContainedListDescription;
+
+export { CDSContainedListDescription$1 as default };
+//# sourceMappingURL=contained-list-description.js.map

package/es-custom/components/contained-list/contained-list-description.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contained-list-description.js","sources":["../../../src/components/contained-list/contained-list-description.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2022, 2025\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 { prefix } from '../../globals/settings';\nimport styles from './contained-list.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Contained list description text.\n *\n * @element cds-custom-contained-list-description\n * @slot - The description text content\n */\n@customElement(`${prefix}-contained-list-description`)\nclass CDSContainedListDescription extends LitElement {\n  render() {\n    return html`<slot></slot>`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSContainedListDescription;\n"],"names":["customElement"],"mappings":";;;;;;;;;;;;;AAAA;;;;;AAKG;AAOH;;;;;AAKG;AAEH,IAAM,2BAA2B,GAAjC,MAAM,2BAA4B,SAAQ,UAAU,CAAA;IAClD,MAAM,GAAA;QACJ,OAAO,IAAI,CAAA,CAAA,aAAA,CAAe;IAC5B;;AAEO,2BAAA,CAAA,MAAM,GAAG,MAAH;AALT,2BAA2B,GAAA,UAAA,CAAA;AADhC,IAAAA,aAAa,CAAC,CAAA,EAAG,MAAM,CAAA,2BAAA,CAA6B;AAC/C,CAAA,EAAA,2BAA2B,CAMhC;AAED,oCAAe,2BAA2B;;;;"}

package/es-custom/components/contained-list/contained-list-item.d.ts

@@ -0,0 +1,43 @@
+/**
+ * Copyright IBM Corp. 2022, 2025
+ *
+ * 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 { LitElement } from 'lit';
+/**
+ * Contained list item.
+ *
+ * @element cds-custom-contained-list-item
+ * @slot - The content of the list item
+ * @slot icon - The icon slot for rendering an icon
+ * @slot action - The action slot for interactive elements
+ * @fires cds-custom-contained-list-item-click - Fires when clickable item is clicked
+ */
+declare class CDSContainedListItem extends LitElement {
+    /**
+     * Whether this item is clickable
+     */
+    clickable: boolean;
+    /**
+     * Whether this item is disabled.
+     */
+    disabled: boolean;
+    /**
+     * Handles slot change for icon
+     */
+    private _handleIconSlotChange;
+    private _hasIcon;
+    /**
+     * Handles click event
+     */
+    private _handleClick;
+    connectedCallback(): void;
+    render(): import("lit-html").TemplateResult<1>;
+    /**
+     * The name of the custom event fired when a clickable item is clicked
+     */
+    static get eventClick(): string;
+    static styles: any;
+}
+export default CDSContainedListItem;

package/es-custom/components/contained-list/contained-list-item.js

@@ -0,0 +1,135 @@
+/**
+ * Copyright IBM Corp. 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 { __decorate } from 'tslib';
+import { LitElement, html } from 'lit';
+import { property } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import { prefix } from '../../globals/settings.js';
+import styles from './contained-list.scss.js';
+import { carbonElement } from '../../globals/decorators/carbon-element.js';
+
+/**
+ * Copyright IBM Corp. 2022, 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/**
+ * Contained list item.
+ *
+ * @element cds-custom-contained-list-item
+ * @slot - The content of the list item
+ * @slot icon - The icon slot for rendering an icon
+ * @slot action - The action slot for interactive elements
+ * @fires cds-custom-contained-list-item-click - Fires when clickable item is clicked
+ */
+let CDSContainedListItem = class CDSContainedListItem extends LitElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * Whether this item is clickable
+         */
+        this.clickable = false;
+        /**
+         * Whether this item is disabled.
+         */
+        this.disabled = false;
+        this._hasIcon = false;
+    }
+    /**
+     * Handles slot change for icon
+     */
+    _handleIconSlotChange({ target }) {
+        const slot = target;
+        const hasIcon = slot.assignedElements().length > 0;
+        this._hasIcon = hasIcon;
+        this.requestUpdate();
+    }
+    /**
+     * Handles click event
+     */
+    _handleClick(event) {
+        if (this.disabled) {
+            event.preventDefault();
+            return;
+        }
+        const { eventClick } = this.constructor;
+        this.dispatchEvent(new CustomEvent(eventClick, {
+            bubbles: true,
+            composed: true,
+            detail: { item: this },
+        }));
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        if (!this.hasAttribute('role')) {
+            this.setAttribute('role', 'listitem');
+        }
+    }
+    render() {
+        const { disabled, clickable, _hasIcon } = this;
+        const classes = classMap({
+            [`${prefix}--contained-list-item`]: true,
+            [`${prefix}--contained-list-item--clickable`]: clickable,
+            [`${prefix}--contained-list-item--with-icon`]: _hasIcon,
+        });
+        const contentClasses = `${prefix}--contained-list-item__content`;
+        const content = html `
+      ${_hasIcon
+            ? html `
+            <div class="${prefix}--contained-list-item__icon">
+              <slot
+                name="icon"
+                @slotchange="${this._handleIconSlotChange}"></slot>
+            </div>
+          `
+            : html `<slot
+            name="icon"
+            @slotchange="${this._handleIconSlotChange}"></slot>`}
+      <div><slot></slot></div>
+    `;
+        return html `
+      <div class="${classes}">
+        ${clickable
+            ? html `
+              <button
+                class="${contentClasses}"
+                type="button"
+                ?disabled="${disabled}"
+                @click="${this._handleClick}">
+                ${content}
+              </button>
+            `
+            : html `<div class="${contentClasses}">${content}</div>`}
+        <div class="${prefix}--contained-list-item__action">
+          <slot name="action"></slot>
+        </div>
+      </div>
+    `;
+    }
+    /**
+     * The name of the custom event fired when a clickable item is clicked
+     */
+    static get eventClick() {
+        return `${prefix}-contained-list-item-click`;
+    }
+};
+CDSContainedListItem.styles = styles;
+__decorate([
+    property({ type: Boolean, reflect: true })
+], CDSContainedListItem.prototype, "clickable", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], CDSContainedListItem.prototype, "disabled", void 0);
+CDSContainedListItem = __decorate([
+    carbonElement(`${prefix}-contained-list-item`)
+], CDSContainedListItem);
+var CDSContainedListItem$1 = CDSContainedListItem;
+
+export { CDSContainedListItem$1 as default };
+//# sourceMappingURL=contained-list-item.js.map

package/es-custom/components/contained-list/contained-list-item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contained-list-item.js","sources":["../../../src/components/contained-list/contained-list-item.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2022, 2025\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 } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './contained-list.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Contained list item.\n *\n * @element cds-custom-contained-list-item\n * @slot - The content of the list item\n * @slot icon - The icon slot for rendering an icon\n * @slot action - The action slot for interactive elements\n * @fires cds-custom-contained-list-item-click - Fires when clickable item is clicked\n */\n@customElement(`${prefix}-contained-list-item`)\nclass CDSContainedListItem extends LitElement {\n  /**\n   * Whether this item is clickable\n   */\n  @property({ type: Boolean, reflect: true })\n  clickable = false;\n\n  /**\n   * Whether this item is disabled.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Handles slot change for icon\n   */\n  private _handleIconSlotChange({ target }: Event) {\n    const slot = target as HTMLSlotElement;\n    const hasIcon = slot.assignedElements().length > 0;\n    this._hasIcon = hasIcon;\n    this.requestUpdate();\n  }\n\n  private _hasIcon = false;\n\n  /**\n   * Handles click event\n   */\n  private _handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n      return;\n    }\n\n    const { eventClick } = this.constructor as typeof CDSContainedListItem;\n    this.dispatchEvent(\n      new CustomEvent(eventClick, {\n        bubbles: true,\n        composed: true,\n        detail: { item: this },\n      })\n    );\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'listitem');\n    }\n  }\n\n  render() {\n    const { disabled, clickable, _hasIcon } = this;\n\n    const classes = classMap({\n      [`${prefix}--contained-list-item`]: true,\n      [`${prefix}--contained-list-item--clickable`]: clickable,\n      [`${prefix}--contained-list-item--with-icon`]: _hasIcon,\n    });\n\n    const contentClasses = `${prefix}--contained-list-item__content`;\n\n    const content = html`\n      ${_hasIcon\n        ? html`\n            <div class=\"${prefix}--contained-list-item__icon\">\n              <slot\n                name=\"icon\"\n                @slotchange=\"${this._handleIconSlotChange}\"></slot>\n            </div>\n          `\n        : html`<slot\n            name=\"icon\"\n            @slotchange=\"${this._handleIconSlotChange}\"></slot>`}\n      <div><slot></slot></div>\n    `;\n\n    return html`\n      <div class=\"${classes}\">\n        ${clickable\n          ? html`\n              <button\n                class=\"${contentClasses}\"\n                type=\"button\"\n                ?disabled=\"${disabled}\"\n                @click=\"${this._handleClick}\">\n                ${content}\n              </button>\n            `\n          : html`<div class=\"${contentClasses}\">${content}</div>`}\n        <div class=\"${prefix}--contained-list-item__action\">\n          <slot name=\"action\"></slot>\n        </div>\n      </div>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired when a clickable item is clicked\n   */\n  static get eventClick() {\n    return `${prefix}-contained-list-item-click`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSContainedListItem;\n"],"names":["customElement"],"mappings":"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"}

package/es-custom/components/contained-list/contained-list.d.ts

@@ -0,0 +1,37 @@
+/**
+ * Copyright IBM Corp. 2022, 2025
+ *
+ * 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 { LitElement } from 'lit';
+export type Variants = 'on-page' | 'disclosed';
+/**
+ * Contained list.
+ *
+ * @element cds-custom-contained-list
+ * @slot - The list items (cds-custom-contained-list-item elements)
+ * @slot action - The action slot for interactive elements in header
+ * @slot label - The label text
+ */
+declare class CDSContainedList extends LitElement {
+    /**
+     * Specify whether the dividing lines in between list items should be inset.
+     */
+    isInset: boolean;
+    /**
+     * The kind of ContainedList you want to display
+     */
+    kind: Variants;
+    /**
+     * A label describing the contained list.
+     */
+    label: string;
+    /**
+     * Specify the size of the contained list.
+     */
+    size?: 'sm' | 'md' | 'lg' | 'xl';
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: any;
+}
+export default CDSContainedList;

package/es-custom/components/contained-list/contained-list.js

@@ -0,0 +1,95 @@
+/**
+ * Copyright IBM Corp. 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 { __decorate } from 'tslib';
+import { LitElement, html } from 'lit';
+import { property } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import { prefix } from '../../globals/settings.js';
+import styles from './contained-list.scss.js';
+import { carbonElement } from '../../globals/decorators/carbon-element.js';
+
+/**
+ * Copyright IBM Corp. 2022, 2025
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+/**
+ * Contained list.
+ *
+ * @element cds-custom-contained-list
+ * @slot - The list items (cds-custom-contained-list-item elements)
+ * @slot action - The action slot for interactive elements in header
+ * @slot label - The label text
+ */
+let CDSContainedList = class CDSContainedList extends LitElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * Specify whether the dividing lines in between list items should be inset.
+         */
+        this.isInset = false;
+        /**
+         * The kind of ContainedList you want to display
+         */
+        this.kind = 'on-page';
+        /**
+         * A label describing the contained list.
+         */
+        this.label = '';
+    }
+    render() {
+        const { isInset, kind, label, size } = this;
+        const classes = classMap({
+            [`${prefix}--contained-list`]: true,
+            [`${prefix}--contained-list--${kind}`]: true,
+            [`${prefix}--contained-list--inset-rulers`]: isInset,
+            [`${prefix}--layout--size-${size}`]: !!size,
+        });
+        const hasLabelSlot = this.querySelector('[slot="label"]') !== null;
+        return html `
+      <div class="${classes}">
+        ${label || hasLabelSlot
+            ? html `
+              <div class="${prefix}--contained-list__header">
+                <div class="${prefix}--contained-list__label">
+                  ${hasLabelSlot ? html `<slot name="label"></slot>` : label}
+                </div>
+                <div class="${prefix}--contained-list__action">
+                  <slot name="action"></slot>
+                </div>
+              </div>
+            `
+            : ''}
+        <ul role="list">
+          <slot></slot>
+        </ul>
+      </div>
+    `;
+    }
+};
+CDSContainedList.styles = styles;
+__decorate([
+    property({ type: Boolean, reflect: true, attribute: 'is-inset' })
+], CDSContainedList.prototype, "isInset", void 0);
+__decorate([
+    property({ reflect: true })
+], CDSContainedList.prototype, "kind", void 0);
+__decorate([
+    property({ reflect: true })
+], CDSContainedList.prototype, "label", void 0);
+__decorate([
+    property({ reflect: true })
+], CDSContainedList.prototype, "size", void 0);
+CDSContainedList = __decorate([
+    carbonElement(`${prefix}-contained-list`)
+], CDSContainedList);
+var CDSContainedList$1 = CDSContainedList;
+
+export { CDSContainedList$1 as default };
+//# sourceMappingURL=contained-list.js.map

package/es-custom/components/contained-list/contained-list.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contained-list.js","sources":["../../../src/components/contained-list/contained-list.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2022, 2025\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 } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport styles from './contained-list.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport type Variants = 'on-page' | 'disclosed';\n\n/**\n * Contained list.\n *\n * @element cds-custom-contained-list\n * @slot - The list items (cds-custom-contained-list-item elements)\n * @slot action - The action slot for interactive elements in header\n * @slot label - The label text\n */\n@customElement(`${prefix}-contained-list`)\nclass CDSContainedList extends LitElement {\n  /**\n   * Specify whether the dividing lines in between list items should be inset.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'is-inset' })\n  isInset = false;\n\n  /**\n   * The kind of ContainedList you want to display\n   */\n  @property({ reflect: true })\n  kind: Variants = 'on-page';\n\n  /**\n   * A label describing the contained list.\n   */\n  @property({ reflect: true })\n  label = '';\n\n  /**\n   * Specify the size of the contained list.\n   */\n  @property({ reflect: true })\n  size?: 'sm' | 'md' | 'lg' | 'xl';\n\n  render() {\n    const { isInset, kind, label, size } = this;\n\n    const classes = classMap({\n      [`${prefix}--contained-list`]: true,\n      [`${prefix}--contained-list--${kind}`]: true,\n      [`${prefix}--contained-list--inset-rulers`]: isInset,\n      [`${prefix}--layout--size-${size}`]: !!size,\n    });\n\n    const hasLabelSlot = this.querySelector('[slot=\"label\"]') !== null;\n\n    return html`\n      <div class=\"${classes}\">\n        ${label || hasLabelSlot\n          ? html`\n              <div class=\"${prefix}--contained-list__header\">\n                <div class=\"${prefix}--contained-list__label\">\n                  ${hasLabelSlot ? html`<slot name=\"label\"></slot>` : label}\n                </div>\n                <div class=\"${prefix}--contained-list__action\">\n                  <slot name=\"action\"></slot>\n                </div>\n              </div>\n            `\n          : ''}\n        <ul role=\"list\">\n          <slot></slot>\n        </ul>\n      </div>\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSContainedList;\n"],"names":["customElement"],"mappings":";;;;;;;;;;;;;;;AAAA;;;;;AAKG;AAWH;;;;;;;AAOG;AAEH,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,UAAU,CAAA;AAAzC,IAAA,WAAA,GAAA;;AACE;;AAEG;QAEH,IAAA,CAAA,OAAO,GAAG,KAAK;AAEf;;AAEG;QAEH,IAAA,CAAA,IAAI,GAAa,SAAS;AAE1B;;AAEG;QAEH,IAAA,CAAA,KAAK,GAAG,EAAE;IA0CZ;IAlCE,MAAM,GAAA;QACJ,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,IAAI;QAE3C,MAAM,OAAO,GAAG,QAAQ,CAAC;AACvB,YAAA,CAAC,CAAA,EAAG,MAAM,CAAA,gBAAA,CAAkB,GAAG,IAAI;AACnC,YAAA,CAAC,GAAG,MAAM,CAAA,kBAAA,EAAqB,IAAI,CAAA,CAAE,GAAG,IAAI;AAC5C,YAAA,CAAC,CAAA,EAAG,MAAM,CAAA,8BAAA,CAAgC,GAAG,OAAO;YACpD,CAAC,CAAA,EAAG,MAAM,CAAA,eAAA,EAAkB,IAAI,EAAE,GAAG,CAAC,CAAC,IAAI;AAC5C,SAAA,CAAC;QAEF,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,CAAC,gBAAgB,CAAC,KAAK,IAAI;AAElE,QAAA,OAAO,IAAI,CAAA;oBACK,OAAO,CAAA;AACjB,QAAA,EAAA,KAAK,IAAI;cACP,IAAI,CAAA;4BACY,MAAM,CAAA;8BACJ,MAAM,CAAA;oBAChB,YAAY,GAAG,IAAI,CAAA,CAAA,0BAAA,CAA4B,GAAG,KAAK;;8BAE7C,MAAM,CAAA;;;;AAIvB,YAAA;AACH,cAAE,EAAE;;;;;KAKT;IACH;;AAEO,gBAAA,CAAA,MAAM,GAAG,MAAH;AArDb,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,UAAU,EAAE;AACjD,CAAA,EAAA,gBAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAMhB,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE;AACA,CAAA,EAAA,gBAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAM3B,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE;AAChB,CAAA,EAAA,gBAAA,CAAA,SAAA,EAAA,OAAA,EAAA,MAAA,CAAA;AAMX,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE;AACM,CAAA,EAAA,gBAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAvB7B,gBAAgB,GAAA,UAAA,CAAA;AADrB,IAAAA,aAAa,CAAC,CAAA,EAAG,MAAM,CAAA,eAAA,CAAiB;AACnC,CAAA,EAAA,gBAAgB,CA2DrB;AAED,yBAAe,gBAAgB;;;;"}