@carbon/ibm-products-web-components 0.27.0 → 0.28.0-rc.0

package/es/components/user-avatar/user-avatar.d.ts

@@ -16,6 +16,7 @@ declare const CDSUseravatar_base: {
         accessKey: string;
         readonly accessKeyLabel: string;
         autocapitalize: string;
+        autocorrect: boolean;
         dir: string;
         draggable: boolean;
         hidden: boolean;
@@ -37,13 +38,14 @@ declare const CDSUseravatar_base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean): boolean;
+        togglePopover(options?: boolean): boolean;
         addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
         removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
         removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
         readonly attributes: NamedNodeMap;
-        readonly classList: DOMTokenList;
+        get classList(): DOMTokenList;
+        set classList(value: string): any;
         className: string;
         readonly clientHeight: number;
         readonly clientLeft: number;
@@ -58,7 +60,8 @@ declare const CDSUseravatar_base: {
         onfullscreenerror: ((this: Element, ev: Event) => any) | null;
         outerHTML: string;
         readonly ownerDocument: Document;
-        readonly part: DOMTokenList;
+        get part(): DOMTokenList;
+        set part(value: string): any;
         readonly prefix: string | null;
         readonly scrollHeight: number;
         scrollLeft: number;
@@ -121,6 +124,8 @@ declare const CDSUseravatar_base: {
         setPointerCapture(pointerId: number): void;
         toggleAttribute(qualifiedName: string, force?: boolean): boolean;
         webkitMatchesSelector(selectors: string): boolean;
+        get textContent(): string;
+        set textContent(value: string | null): any;
         readonly baseURI: string;
         readonly childNodes: NodeListOf<ChildNode>;
         readonly firstChild: ChildNode | null;
@@ -133,9 +138,8 @@ declare const CDSUseravatar_base: {
         readonly parentElement: HTMLElement | null;
         readonly parentNode: ParentNode | null;
         readonly previousSibling: ChildNode | null;
-        textContent: string | null;
         appendChild<T_1 extends Node>(node: T_1): T_1;
-        cloneNode(deep?: boolean): Node;
+        cloneNode(subtree?: boolean): Node;
         compareDocumentPosition(other: Node): number;
         contains(other: Node | null): boolean;
         getRootNode(options?: GetRootNodeOptions): Node;
@@ -168,6 +172,7 @@ declare const CDSUseravatar_base: {
         readonly DOCUMENT_POSITION_CONTAINED_BY: 16;
         readonly DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: 32;
         dispatchEvent(event: Event): boolean;
+        ariaActiveDescendantElement: Element | null;
         ariaAtomic: string | null;
         ariaAutoComplete: string | null;
         ariaBrailleLabel: string | null;
@@ -178,25 +183,33 @@ declare const CDSUseravatar_base: {
         ariaColIndex: string | null;
         ariaColIndexText: string | null;
         ariaColSpan: string | null;
+        ariaControlsElements: ReadonlyArray<Element> | null;
         ariaCurrent: string | null;
+        ariaDescribedByElements: ReadonlyArray<Element> | null;
         ariaDescription: string | null;
+        ariaDetailsElements: ReadonlyArray<Element> | null;
         ariaDisabled: string | null;
+        ariaErrorMessageElements: ReadonlyArray<Element> | null;
         ariaExpanded: string | null;
+        ariaFlowToElements: ReadonlyArray<Element> | null;
         ariaHasPopup: string | null;
         ariaHidden: string | null;
         ariaInvalid: string | null;
         ariaKeyShortcuts: string | null;
         ariaLabel: string | null;
+        ariaLabelledByElements: ReadonlyArray<Element> | null;
         ariaLevel: string | null;
         ariaLive: string | null;
         ariaModal: string | null;
         ariaMultiLine: string | null;
         ariaMultiSelectable: string | null;
         ariaOrientation: string | null;
+        ariaOwnsElements: ReadonlyArray<Element> | null;
         ariaPlaceholder: string | null;
         ariaPosInSet: string | null;
         ariaPressed: string | null;
         ariaReadOnly: string | null;
+        ariaRelevant: string | null;
         ariaRequired: string | null;
         ariaRoleDescription: string | null;
         ariaRowCount: string | null;
@@ -238,7 +251,8 @@ declare const CDSUseravatar_base: {
         replaceChildren(...nodes: (Node | string)[]): void;
         readonly assignedSlot: HTMLSlotElement | null;
         readonly attributeStyleMap: StylePropertyMap;
-        readonly style: CSSStyleDeclaration;
+        get style(): CSSStyleDeclaration;
+        set style(cssText: string): any;
         contentEditable: string;
         enterKeyHint: string;
         inputMode: string;
@@ -248,18 +262,19 @@ declare const CDSUseravatar_base: {
         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;
+        onauxclick: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
-        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+        onbeforematch: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: ToggleEvent) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => 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;
+        onclick: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
         onclose: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncontextlost: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        oncontextmenu: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+        oncontextmenu: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
         oncontextrestored: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncopy: ((this: GlobalEventHandlers, ev: ClipboardEvent) => any) | null;
         oncuechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -307,6 +322,7 @@ declare const CDSUseravatar_base: {
         onpointermove: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
         onpointerout: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
         onpointerover: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
+        onpointerrawupdate: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onpointerup: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
         onprogress: ((this: GlobalEventHandlers, ev: ProgressEvent) => any) | null;
         onratechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -325,7 +341,7 @@ declare const CDSUseravatar_base: {
         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;
+        ontoggle: ((this: GlobalEventHandlers, ev: ToggleEvent) => 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;

package/es/components/user-avatar/user-avatar.figma.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Copyright IBM Corp. 2025, 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 './user-avatar';

package/es/components/user-avatar/user-avatar.figma.js

@@ -0,0 +1,136 @@
+/**
+ * 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 figma, { html } from '@figma/code-connect/html';
+import './user-avatar.js';
+
+/**
+ * Copyright IBM Corp. 2025, 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.
+ */
+const sharedProps = {
+    name: figma.string('Initials text'),
+    size: figma.enum('Size', {
+        'Extra large': 'xl',
+        Large: 'lg',
+        Medium: 'md',
+        Small: 'sm',
+    }),
+    tooltipProps: figma.nestedProps('Tooltip', {
+        text: figma.string('Tooltip text'),
+        tooltipAlignment: figma.enum('🚫 Position', {
+            Top: 'top',
+            Right: 'right',
+            Bottom: 'bottom',
+            Left: 'left',
+        }),
+    }),
+    bgProps: figma.nestedProps('Background', {
+        color: figma.enum('Color', {
+            Cyan: figma.enum('Sequence', {
+                Primary: 'order-1-cyan',
+                Secondary: 'order-7-cyan',
+            }),
+            Gray: figma.enum('Sequence', {
+                Primary: 'order-2-gray',
+                Secondary: 'order-8-gray',
+            }),
+            Green: figma.enum('Sequence', {
+                Primary: 'order-3-green',
+                Secondary: 'order-9-green',
+            }),
+            Magenta: figma.enum('Sequence', {
+                Primary: 'order-4-magenta',
+                Secondary: 'order-10-magenta',
+            }),
+            Purple: figma.enum('Sequence', {
+                Primary: 'order-5-purple',
+                Secondary: 'order-11-purple',
+            }),
+            Teal: figma.enum('Sequence', {
+                Primary: 'order-6-teal',
+                Secondary: 'order-12-teal',
+            }),
+        }),
+    }),
+    Type: figma.enum('Type', {
+        'Single user': 'User',
+        'User group': 'Group',
+    }),
+};
+figma.connect('https://www.figma.com/design/0F9dKH2abAd7gSfvnacfWf/-v11--IBM-Products-%E2%80%93-Carbon-Design-System?node-id=15368-59379&t=lbewdWdJ4JB5izcw-4', {
+    variant: { Type: 'Image' },
+    props: sharedProps,
+    example: ({ tooltipProps, name, size }) => html `<c4p-user-avatar
+        tooltip-alignment=${tooltipProps.tooltipAlignment}
+        tooltip-text=${tooltipProps.text}
+        name=${name}
+        size=${size}
+        image="/path/to/image"
+        image-description="Alt text for image"
+      >
+      </c4p-user-avatar> `,
+    imports: [
+        "import '@carbon/ibm-products-web-components/es/components/user-avatar/index.js'",
+    ],
+});
+figma.connect('https://www.figma.com/design/0F9dKH2abAd7gSfvnacfWf/-v11--IBM-Products-%E2%80%93-Carbon-Design-System?node-id=15368-59379&t=lbewdWdJ4JB5izcw-4', {
+    variant: { Type: 'Initials' },
+    props: sharedProps,
+    example: ({ tooltipProps, name, size, bgProps }) => html `<c4p-user-avatar
+        tooltip-alignment=${tooltipProps.tooltipAlignment}
+        tooltip-text=${tooltipProps.text}
+        name=${name}
+        size=${size}
+        background-color=${bgProps.color}
+      >
+      </c4p-user-avatar> `,
+    imports: [
+        "import '@carbon/ibm-products-web-components/es/components/user-avatar/index.js'",
+    ],
+});
+figma.connect('https://www.figma.com/design/0F9dKH2abAd7gSfvnacfWf/-v11--IBM-Products-%E2%80%93-Carbon-Design-System?node-id=15368-59379&t=lbewdWdJ4JB5izcw-4', {
+    variant: { Type: 'Single user' },
+    props: sharedProps,
+    example: ({ tooltipProps, name, size, bgProps, Type }) => html `<c4p-user-avatar
+        tooltip-alignment=${tooltipProps.tooltipAlignment}
+        tooltip-text=${tooltipProps.text}
+        name=${name}
+        size=${size}
+        background-color=${bgProps.color}
+      >
+        <!-- Icon loaded via iconLoader helper from '@carbon/web-components' -->
+        \${iconLoader(${Type}, { slot: 'rendericon' })}
+      </c4p-user-avatar> `,
+    imports: [
+        "import '@carbon/ibm-products-web-components/es/components/user-avatar/index.js'",
+        "import iconLoader from '@carbon/web-components/es/globals/internal/icon-loader.js'",
+        "import User from '@carbon/icons/es/user/16'",
+    ],
+});
+figma.connect('https://www.figma.com/design/0F9dKH2abAd7gSfvnacfWf/-v11--IBM-Products-%E2%80%93-Carbon-Design-System?node-id=15368-59379&t=lbewdWdJ4JB5izcw-4', {
+    variant: { Type: 'User group' },
+    props: sharedProps,
+    example: ({ tooltipProps, name, size, bgProps, Type }) => html `<c4p-user-avatar
+        tooltip-alignment=${tooltipProps.tooltipAlignment}
+        tooltip-text=${tooltipProps.text}
+        name=${name}
+        size=${size}
+        background-color=${bgProps.color}
+      >
+        <!-- Icon loaded via iconLoader helper from '@carbon/web-components' -->
+        \${iconLoader(${Type}, { slot: 'rendericon' })}
+      </c4p-user-avatar> `,
+    imports: [
+        "import '@carbon/ibm-products-web-components/es/components/user-avatar/index.js'",
+        "import iconLoader from '@carbon/web-components/es/globals/internal/icon-loader.js'",
+        "import Group from '@carbon/icons/es/group/16'",
+    ],
+});
+//# sourceMappingURL=user-avatar.figma.js.map

package/es/components/user-avatar/user-avatar.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-avatar.figma.js","sources":["../../../src/components/user-avatar/user-avatar.figma.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/es/node_modules/@carbon/layout/es/index.js

@@ -0,0 +1,44 @@
+/**
+ * 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.
+ */
+
+/**
+ * Copyright IBM Corp. 2018, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+
+/**
+ * Copyright IBM Corp. 2018, 2023
+ *
+ * This source code is licensed under the Apache-2.0 license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+
+// Convert
+// Default, Use with em() and rem() functions
+var baseFontSize = 16;
+
+/**
+ * Convert a given px unit to a rem unit
+ * @param {number} px
+ * @returns {string}
+ */
+function rem(px) {
+  return "".concat(px / baseFontSize, "rem");
+}
+
+// Breakpoint
+// Initial map of our breakpoints and their values
+var breakpoints = {
+  lg: {
+    width: rem(1056)}};
+
+export { baseFontSize, breakpoints, rem };
+//# sourceMappingURL=index.js.map

package/es/node_modules/@carbon/layout/es/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../../../../../node_modules/@carbon/layout/es/index.js"],"sourcesContent":["/**\n * Copyright IBM Corp. 2018, 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\nvar unstable_tokens = [\n// Spacing\n'spacing01', 'spacing02', 'spacing03', 'spacing04', 'spacing05', 'spacing06', 'spacing07', 'spacing08', 'spacing09', 'spacing10', 'spacing11', 'spacing12', 'spacing13',\n// Fluid spacing\n'fluidSpacing01', 'fluidSpacing02', 'fluidSpacing03', 'fluidSpacing04',\n// Containers\n'container01', 'container02', 'container03', 'container04', 'container05', 'sizeXSmall', 'sizeSmall', 'sizeMedium', 'sizeLarge', 'sizeXLarge', 'size2XLarge',\n// Icon sizes\n'iconSize01', 'iconSize02',\n// Layout\n// Deprecated\n'layout01', 'layout02', 'layout03', 'layout04', 'layout05', 'layout06', 'layout07'];\n\n/**\n * Copyright IBM Corp. 2018, 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\n\n// Convert\n// Default, Use with em() and rem() functions\nvar baseFontSize = 16;\n\n/**\n * Convert a given px unit to a rem unit\n * @param {number} px\n * @returns {string}\n */\nfunction rem(px) {\n  return \"\".concat(px / baseFontSize, \"rem\");\n}\n\n/**\n * Convert a given px unit to a em unit\n * @param {number} px\n * @returns {string}\n */\nfunction em(px) {\n  return \"\".concat(px / baseFontSize, \"em\");\n}\n\n/**\n * Convert a given px unit to its string representation\n * @param {number} value - number of pixels\n * @returns {string}\n */\nfunction px(value) {\n  return \"\".concat(value, \"px\");\n}\n\n// Breakpoint\n// Initial map of our breakpoints and their values\nvar breakpoints = {\n  sm: {\n    width: rem(320),\n    columns: 4,\n    margin: '0'\n  },\n  md: {\n    width: rem(672),\n    columns: 8,\n    margin: rem(16)\n  },\n  lg: {\n    width: rem(1056),\n    columns: 16,\n    margin: rem(16)\n  },\n  xlg: {\n    width: rem(1312),\n    columns: 16,\n    margin: rem(16)\n  },\n  max: {\n    width: rem(1584),\n    columns: 16,\n    margin: rem(24)\n  }\n};\nfunction breakpointUp(name) {\n  return \"@media (min-width: \".concat(breakpoints[name].width, \")\");\n}\nfunction breakpointDown(name) {\n  return \"@media (max-width: \".concat(breakpoints[name].width, \")\");\n}\nfunction breakpoint() {\n  return breakpointUp.apply(void 0, arguments);\n}\n\n// Mini-unit\nvar miniUnit = 8;\nfunction miniUnits(count) {\n  return rem(miniUnit * count);\n}\n\n// Spacing\nvar spacing01 = miniUnits(0.25);\nvar spacing02 = miniUnits(0.5);\nvar spacing03 = miniUnits(1);\nvar spacing04 = miniUnits(1.5);\nvar spacing05 = miniUnits(2);\nvar spacing06 = miniUnits(3);\nvar spacing07 = miniUnits(4);\nvar spacing08 = miniUnits(5);\nvar spacing09 = miniUnits(6);\nvar spacing10 = miniUnits(8);\nvar spacing11 = miniUnits(10);\nvar spacing12 = miniUnits(12);\nvar spacing13 = miniUnits(20);\nvar spacing = [spacing01, spacing02, spacing03, spacing04, spacing05, spacing06, spacing07, spacing08, spacing09, spacing10, spacing11, spacing12, spacing13];\n\n// Fluid spacing\nvar fluidSpacing01 = 0;\nvar fluidSpacing02 = '2vw';\nvar fluidSpacing03 = '5vw';\nvar fluidSpacing04 = '10vw';\nvar fluidSpacing = [fluidSpacing01, fluidSpacing02, fluidSpacing03, fluidSpacing04];\n\n// Layout\n// Deprecated\nvar layout01 = miniUnits(2);\nvar layout02 = miniUnits(3);\nvar layout03 = miniUnits(4);\nvar layout04 = miniUnits(6);\nvar layout05 = miniUnits(8);\nvar layout06 = miniUnits(12);\nvar layout07 = miniUnits(20);\nvar layout = [layout01, layout02, layout03, layout04, layout05, layout06, layout07];\n\n// Container\nvar container01 = miniUnits(3);\nvar container02 = miniUnits(4);\nvar container03 = miniUnits(5);\nvar container04 = miniUnits(6);\nvar container05 = miniUnits(8);\nvar container = [container01, container02, container03, container04, container05];\nvar sizeXSmall = rem(24);\nvar sizeSmall = rem(32);\nvar sizeMedium = rem(40);\nvar sizeLarge = rem(48);\nvar sizeXLarge = rem(64);\nvar size2XLarge = rem(80);\nvar sizes = {\n  XSmall: sizeXSmall,\n  Small: sizeSmall,\n  Medium: sizeMedium,\n  Large: sizeLarge,\n  XLarge: sizeXLarge,\n  '2XLarge': size2XLarge\n};\n\n// Icon\nvar iconSize01 = '1rem';\nvar iconSize02 = '1.25rem';\nvar iconSize = [iconSize01, iconSize02];\n\nexport { baseFontSize, breakpoint, breakpointDown, breakpointUp, breakpoints, container, container01, container02, container03, container04, container05, em, fluidSpacing, fluidSpacing01, fluidSpacing02, fluidSpacing03, fluidSpacing04, iconSize, iconSize01, iconSize02, layout, layout01, layout02, layout03, layout04, layout05, layout06, layout07, miniUnit, miniUnits, px, rem, size2XLarge, sizeLarge, sizeMedium, sizeSmall, sizeXLarge, sizeXSmall, sizes, spacing, spacing01, spacing02, spacing03, spacing04, spacing05, spacing06, spacing07, spacing08, spacing09, spacing10, spacing11, spacing12, spacing13, unstable_tokens };\n"],"names":[],"mappings":";;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;;;AAeA;AACA;AACA;AACA;AACA;AACA;;;AAGA;AACA;AACG,IAAC,YAAY,GAAG;;AAEnB;AACA;AACA;AACA;AACA;AACA,SAAS,GAAG,CAAC,EAAE,EAAE;AACjB,EAAE,OAAO,EAAE,CAAC,MAAM,CAAC,EAAE,GAAG,YAAY,EAAE,KAAK,CAAC;AAC5C;;AAoBA;AACA;AACG,IAAC,WAAW,GAAG;AAClB,EAUE,EAAE,EAAE;AACN,IAAI,KAAK,EAAE,GAAG,CAAC,IAAI,CAGjB,CAWF;;;;","x_google_ignoreList":[0]}

package/es/packages/ibm-products-web-components/package.json.js

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-var version = "0.27.0-rc.0";
+var version = "0.27.0";
 var packageJson = {
 	version: version};
 

package/es-custom/components/about-modal/about-modal.d.ts

@@ -17,6 +17,7 @@ declare const CDSAboutModal_base: {
         accessKey: string;
         readonly accessKeyLabel: string;
         autocapitalize: string;
+        autocorrect: boolean;
         dir: string;
         draggable: boolean;
         hidden: boolean;
@@ -38,17 +39,14 @@ declare const CDSAboutModal_base: {
         click(): void;
         hidePopover(): void;
         showPopover(): void;
-        togglePopover(force?: boolean): boolean;
-        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options
-        /**
-         * Determines if About Modal is open or not.
-         */
-        ?: boolean | AddEventListenerOptions): void;
+        togglePopover(options?: boolean): boolean;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
         removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
         removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
         readonly attributes: NamedNodeMap;
-        readonly classList: DOMTokenList;
+        get classList(): DOMTokenList;
+        set classList(value: string): any;
         className: string;
         readonly clientHeight: number;
         readonly clientLeft: number;
@@ -63,7 +61,8 @@ declare const CDSAboutModal_base: {
         onfullscreenerror: ((this: Element, ev: Event) => any) | null;
         outerHTML: string;
         readonly ownerDocument: Document;
-        readonly part: DOMTokenList;
+        get part(): DOMTokenList;
+        set part(value: string): any;
         readonly prefix: string | null;
         readonly scrollHeight: number;
         scrollLeft: number;
@@ -126,6 +125,8 @@ declare const CDSAboutModal_base: {
         setPointerCapture(pointerId: number): void;
         toggleAttribute(qualifiedName: string, force?: boolean): boolean;
         webkitMatchesSelector(selectors: string): boolean;
+        get textContent(): string;
+        set textContent(value: string | null): any;
         readonly baseURI: string;
         readonly childNodes: NodeListOf<ChildNode>;
         readonly firstChild: ChildNode | null;
@@ -138,9 +139,8 @@ declare const CDSAboutModal_base: {
         readonly parentElement: HTMLElement | null;
         readonly parentNode: ParentNode | null;
         readonly previousSibling: ChildNode | null;
-        textContent: string | null;
         appendChild<T_1 extends Node>(node: T_1): T_1;
-        cloneNode(deep?: boolean): Node;
+        cloneNode(subtree?: boolean): Node;
         compareDocumentPosition(other: Node): number;
         contains(other: Node | null): boolean;
         getRootNode(options?: GetRootNodeOptions): Node;
@@ -173,6 +173,7 @@ declare const CDSAboutModal_base: {
         readonly DOCUMENT_POSITION_CONTAINED_BY: 16;
         readonly DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC: 32;
         dispatchEvent(event: Event): boolean;
+        ariaActiveDescendantElement: Element | null;
         ariaAtomic: string | null;
         ariaAutoComplete: string | null;
         ariaBrailleLabel: string | null;
@@ -183,25 +184,33 @@ declare const CDSAboutModal_base: {
         ariaColIndex: string | null;
         ariaColIndexText: string | null;
         ariaColSpan: string | null;
+        ariaControlsElements: ReadonlyArray<Element> | null;
         ariaCurrent: string | null;
+        ariaDescribedByElements: ReadonlyArray<Element> | null;
         ariaDescription: string | null;
+        ariaDetailsElements: ReadonlyArray<Element> | null;
         ariaDisabled: string | null;
+        ariaErrorMessageElements: ReadonlyArray<Element> | null;
         ariaExpanded: string | null;
+        ariaFlowToElements: ReadonlyArray<Element> | null;
         ariaHasPopup: string | null;
         ariaHidden: string | null;
         ariaInvalid: string | null;
         ariaKeyShortcuts: string | null;
         ariaLabel: string | null;
+        ariaLabelledByElements: ReadonlyArray<Element> | null;
         ariaLevel: string | null;
         ariaLive: string | null;
         ariaModal: string | null;
         ariaMultiLine: string | null;
         ariaMultiSelectable: string | null;
         ariaOrientation: string | null;
+        ariaOwnsElements: ReadonlyArray<Element> | null;
         ariaPlaceholder: string | null;
         ariaPosInSet: string | null;
         ariaPressed: string | null;
         ariaReadOnly: string | null;
+        ariaRelevant: string | null;
         ariaRequired: string | null;
         ariaRoleDescription: string | null;
         ariaRowCount: string | null;
@@ -243,7 +252,8 @@ declare const CDSAboutModal_base: {
         replaceChildren(...nodes: (Node | string)[]): void;
         readonly assignedSlot: HTMLSlotElement | null;
         readonly attributeStyleMap: StylePropertyMap;
-        readonly style: CSSStyleDeclaration;
+        get style(): CSSStyleDeclaration;
+        set style(cssText: string): any;
         contentEditable: string;
         enterKeyHint: string;
         inputMode: string;
@@ -253,18 +263,19 @@ declare const CDSAboutModal_base: {
         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;
+        onauxclick: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
         onbeforeinput: ((this: GlobalEventHandlers, ev: InputEvent) => any) | null;
-        onbeforetoggle: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+        onbeforematch: ((this: GlobalEventHandlers, ev: Event) => any) | null;
+        onbeforetoggle: ((this: GlobalEventHandlers, ev: ToggleEvent) => any) | null;
         onblur: ((this: GlobalEventHandlers, ev: FocusEvent) => any) | null;
         oncancel: ((this: GlobalEventHandlers, ev: Event) => 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;
+        onclick: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
         onclose: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncontextlost: ((this: GlobalEventHandlers, ev: Event) => any) | null;
-        oncontextmenu: ((this: GlobalEventHandlers, ev: MouseEvent) => any) | null;
+        oncontextmenu: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
         oncontextrestored: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         oncopy: ((this: GlobalEventHandlers, ev: ClipboardEvent) => any) | null;
         oncuechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -312,6 +323,7 @@ declare const CDSAboutModal_base: {
         onpointermove: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
         onpointerout: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
         onpointerover: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
+        onpointerrawupdate: ((this: GlobalEventHandlers, ev: Event) => any) | null;
         onpointerup: ((this: GlobalEventHandlers, ev: PointerEvent) => any) | null;
         onprogress: ((this: GlobalEventHandlers, ev: ProgressEvent) => any) | null;
         onratechange: ((this: GlobalEventHandlers, ev: Event) => any) | null;
@@ -330,7 +342,7 @@ declare const CDSAboutModal_base: {
         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;
+        ontoggle: ((this: GlobalEventHandlers, ev: ToggleEvent) => 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;

package/es-custom/components/about-modal/about-modal.figma.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Copyright IBM Corp. 2025, 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.
+ */
+export {};

package/es-custom/components/about-modal/about-modal.figma.js

@@ -0,0 +1,52 @@
+/**
+ * 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 figma, { html } from '@figma/code-connect/html';
+
+/**
+ * Copyright IBM Corp. 2025, 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.
+ */
+figma.connect('https://www.figma.com/design/0F9dKH2abAd7gSfvnacfWf/-v11--IBM-Products-%E2%80%93-Carbon-Design-System?node-id=9478%3A404998', {
+    props: {
+        aboutModalContentProps: figma.nestedProps('_About modal content', {
+            title: figma.string('Title text'),
+            version: figma.string('Version'),
+            content: figma.boolean('Content', {
+                true: figma.string('Content text'),
+                false: undefined,
+            }),
+            copyrightText: figma.string('Copyright text'),
+            links: figma.children(['Link group']),
+        }),
+        footerBaseProps: figma.boolean('Powered by logos', {
+            true: figma.nestedProps('_About modal footer base', {
+                additionalInfo: figma.children('Slot'),
+            }),
+            false: {
+                additionalInfo: undefined,
+            },
+        }),
+    },
+    example: (props) => html `<c4p-about-modal
+        closeIconDescription="close"
+        copyrightText=${props.aboutModalContentProps.copyrightText}
+        .logo=${props.aboutModalContentProps.logo}
+        .title=${props.aboutModalContentProps.title}
+        .version=${props.aboutModalContentProps.version}
+        .additionalInfo=${props.aboutModalContentProps.additionalInfo}
+        .content=${props.aboutModalContentProps.content}
+        .links=${props.aboutModalContentProps.links}
+        aria-label=""
+      ></c4p-about-modal>`,
+    imports: [
+        "import '@carbon/ibm-products-web-components/es/components/about-modal/index.js'",
+    ],
+});
+//# sourceMappingURL=about-modal.figma.js.map

package/es-custom/components/about-modal/about-modal.figma.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"about-modal.figma.js","sources":["../../../src/components/about-modal/about-modal.figma.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;AAAA;;;;;AAKG;AAIH,KAAK,CAAC,OAAO,CACX,6HAA6H,EAC7H;AACE,IAAA,KAAK,EAAE;AACL,QAAA,sBAAsB,EAAE,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE;AAChE,YAAA,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC;AACjC,YAAA,OAAO,EAAE,KAAK,CAAC,MAAM,CAAC,SAAS,CAAC;AAChC,YAAA,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,SAAS,EAAE;AAChC,gBAAA,IAAI,EAAE,KAAK,CAAC,MAAM,CAAC,cAAc,CAAC;AAClC,gBAAA,KAAK,EAAE,SAAS;aACjB,CAAC;AACF,YAAA,aAAa,EAAE,KAAK,CAAC,MAAM,CAAC,gBAAgB,CAAC;YAC7C,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC,YAAY,CAAC,CAAC;SACtC,CAAC;AAEF,QAAA,eAAe,EAAE,KAAK,CAAC,OAAO,CAAC,kBAAkB,EAAE;AACjD,YAAA,IAAI,EAAE,KAAK,CAAC,WAAW,CAAC,0BAA0B,EAAE;AAClD,gBAAA,cAAc,EAAE,KAAK,CAAC,QAAQ,CAAC,MAAM,CAAC;aACvC,CAAC;AACF,YAAA,KAAK,EAAE;AACL,gBAAA,cAAc,EAAE,SAAS;AAC1B,aAAA;SACF,CAAC;AACH,KAAA;AACD,IAAA,OAAO,EAAE,CAAC,KAAK,KACb,IAAI,CAAA,CAAA;;wBAEc,KAAK,CAAC,sBAAsB,CAAC,aAAa;gBAClD,KAAK,CAAC,sBAAsB,CAAC,IAAI;iBAChC,KAAK,CAAC,sBAAsB,CAAC,KAAK;mBAChC,KAAK,CAAC,sBAAsB,CAAC,OAAO;0BAC7B,KAAK,CAAC,sBAAsB,CAAC,cAAc;mBAClD,KAAK,CAAC,sBAAsB,CAAC,OAAO;iBACtC,KAAK,CAAC,sBAAsB,CAAC,KAAK;;AAEzB,yBAAA,CAAA;AACtB,IAAA,OAAO,EAAE;QACP,iFAAiF;AAClF,KAAA;AACF,CAAA,CACF"}