@carbon/ibm-products-web-components 0.28.0 → 0.29.0

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

@@ -14,60 +14,69 @@ import './user-avatar.js';
  * 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',
-            }),
-        }),
+  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',
     }),
-    Type: figma.enum('Type', {
-        'Single user': 'User',
-        'User group': 'Group',
+  }),
+
+  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', {
+
+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
+
+    example: ({ tooltipProps, name, size }) =>
+      html`<c4p-user-avatar
         tooltip-alignment=${tooltipProps.tooltipAlignment}
         tooltip-text=${tooltipProps.text}
         name=${name}
@@ -77,13 +86,18 @@ figma.connect('https://www.figma.com/design/0F9dKH2abAd7gSfvnacfWf/-v11--IBM-Pro
       >
       </c4p-user-avatar> `,
     imports: [
-        "import '@carbon/ibm-products-web-components/es/components/user-avatar/index.js'",
+      "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', {
+  }
+);
+
+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
+    example: ({ tooltipProps, name, size, bgProps }) =>
+      html`<c4p-user-avatar
         tooltip-alignment=${tooltipProps.tooltipAlignment}
         tooltip-text=${tooltipProps.text}
         name=${name}
@@ -92,13 +106,18 @@ figma.connect('https://www.figma.com/design/0F9dKH2abAd7gSfvnacfWf/-v11--IBM-Pro
       >
       </c4p-user-avatar> `,
     imports: [
-        "import '@carbon/ibm-products-web-components/es/components/user-avatar/index.js'",
+      "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', {
+  }
+);
+
+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
+    example: ({ tooltipProps, name, size, bgProps, Type }) =>
+      html`<c4p-user-avatar
         tooltip-alignment=${tooltipProps.tooltipAlignment}
         tooltip-text=${tooltipProps.text}
         name=${name}
@@ -109,15 +128,20 @@ figma.connect('https://www.figma.com/design/0F9dKH2abAd7gSfvnacfWf/-v11--IBM-Pro
         \${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'",
+      "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', {
+  }
+);
+
+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
+    example: ({ tooltipProps, name, size, bgProps, Type }) =>
+      html`<c4p-user-avatar
         tooltip-alignment=${tooltipProps.tooltipAlignment}
         tooltip-text=${tooltipProps.text}
         name=${name}
@@ -128,9 +152,10 @@ figma.connect('https://www.figma.com/design/0F9dKH2abAd7gSfvnacfWf/-v11--IBM-Pro
         \${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'",
+      "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-custom/components/user-avatar/user-avatar.figma.js.map

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

package/es-custom/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.28.0-rc.0";
+var version = "0.29.0-rc.0";
 var packageJson = {
 	version: version};
 

package/es-custom/patterns/step-flow/_story-assets/step-full-page.d.ts

@@ -0,0 +1,41 @@
+/**
+ * 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 { LitElement, PropertyValues } from 'lit';
+import '@carbon/web-components/es-custom/components/progress-indicator/index.js';
+import '@carbon/web-components/es-custom/components/stack/index.js';
+import '@carbon/web-components/es-custom/components/code-snippet/index.js';
+import '@carbon/web-components/es-custom/components/button/index.js';
+import '@carbon/web-components/es-custom/components/grid/index';
+import '../step-group';
+declare const StepFullPage_base: typeof LitElement;
+export declare class StepFullPage extends StepFullPage_base {
+    narrow: boolean;
+    private _open;
+    private _email;
+    private _city;
+    private _state;
+    private _trapFocusAPI;
+    private _handleCancelButton;
+    private _handleBackButton;
+    private _handleNextButton;
+    private _handleEmailInput;
+    private _handleCityInput;
+    private _handleStateInput;
+    private _stepInfo;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    protected firstUpdated(_changedProperties: PropertyValues): void;
+    updated(changedProps: Map<string | number | symbol, unknown>): void;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: any;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'step-full-page': StepFullPage;
+    }
+}
+export {};

package/es-custom/patterns/step-flow/_story-assets/step-full-page.js

@@ -0,0 +1,257 @@
+/**
+ * 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, nothing, html } from 'lit';
+import { property, state, customElement } from 'lit/decorators.js';
+import { SignalWatcher } from '@lit-labs/signals';
+import styles from './step-full-page.scss.js';
+import { StepInstance } from '../step-flow-signal.js';
+import '@carbon/web-components/es-custom/components/progress-indicator/index.js';
+import '@carbon/web-components/es-custom/components/stack/index.js';
+import '@carbon/web-components/es-custom/components/code-snippet/index.js';
+import '@carbon/web-components/es-custom/components/button/index.js';
+import '@carbon/web-components/es-custom/components/grid/index';
+import '../step-group.js';
+import { registerFocusableContainers, trapFocus } from '../../../utilities/manageFocusTrap/manageFocusTrap.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.
+ */
+let StepFullPage = class StepFullPage extends SignalWatcher(LitElement) {
+    constructor() {
+        super(...arguments);
+        this.narrow = false;
+        this._open = false;
+        this._email = '';
+        this._city = '';
+        this._state = '';
+        this._trapFocusAPI = null;
+        this._stepInfo = new StepInstance();
+    }
+    _handleCancelButton() {
+        this._open = false;
+        this._stepInfo.reset();
+    }
+    _handleBackButton() {
+        const { currentStep } = this._stepInfo.data;
+        if (currentStep === 0) {
+            return;
+        }
+        return this._stepInfo.handlePrevious();
+    }
+    _handleNextButton() {
+        const { currentStep, totalSteps } = this._stepInfo.data;
+        if (currentStep + 1 === totalSteps) {
+            this._open = false;
+            this._stepInfo.reset();
+            return;
+        }
+        return this._stepInfo.handleNext();
+    }
+    _handleEmailInput(e) {
+        const savedFormState = structuredClone(this._stepInfo.data.formState);
+        savedFormState.email = e.target.value;
+        this._stepInfo.updateFormState = savedFormState;
+    }
+    _handleCityInput(e) {
+        const savedFormState = structuredClone(this._stepInfo.data.formState);
+        savedFormState.city = e.target.value;
+        this._stepInfo.updateFormState = savedFormState;
+    }
+    _handleStateInput(e) {
+        const savedFormState = structuredClone(this._stepInfo.data.formState);
+        savedFormState.state = e.target.value;
+        this._stepInfo.updateFormState = savedFormState;
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this._stepInfo.updateTotalStepCount = 3;
+    }
+    disconnectedCallback() {
+        var _a;
+        (_a = this._trapFocusAPI) === null || _a === void 0 ? void 0 : _a.cleanup();
+    }
+    firstUpdated(_changedProperties) {
+        var _a;
+        registerFocusableContainers((_a = this.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('step-full-page'));
+    }
+    updated(changedProps) {
+        if (changedProps.has('_open')) {
+            const isOpen = this._open;
+            if (isOpen) {
+                // `focusableContainers` holds the containers where we can query DOM elements.
+                // Our strategy here is to let child/slotted components register their containers,
+                // which are then passed to `trapFocus`. This allows the utility to query elements
+                // directly without being blocked by shadow DOM boundaries.
+                this._trapFocusAPI = trapFocus();
+            }
+        }
+    }
+    render() {
+        const { formState, totalSteps, currentStep } = this._stepInfo.data;
+        return html ` <div class=${'step-full-page-with-util'} ?open=${this._open}>
+      <!-- slotted influencer -->
+      <div class="create-influencer" slot="influencer">
+        <cds-custom-progress-indicator
+          vertical
+          class=${`custom-step-util__dummy-content-block`}
+        >
+          <cds-custom-progress-step
+            label="First step"
+            state=${currentStep + 1 === 1 ? 'current' : 'complete'}
+          ></cds-custom-progress-step>
+          <cds-custom-progress-step
+            label="Second step"
+            state=${currentStep + 1 === 2
+            ? 'current'
+            : currentStep + 1 < 2
+                ? 'incomplete'
+                : 'complete'}
+          ></cds-custom-progress-step>
+          <cds-custom-progress-step
+            label="Third step"
+            state=${currentStep + 1 === 3
+            ? 'current'
+            : currentStep + 1 < 3
+                ? 'incomplete'
+                : 'complete'}
+          ></cds-custom-progress-step>
+        </cds-custom-progress-indicator>
+      </div>
+      <cds-custom-layer level="1" class="create-full-page-layer">
+        <div class="create-full-page-wrapper">
+          <div class="upper-step-content">
+            <cds-custom-grid class="sb-grid">
+              <cds-custom-column lg="8" sm="4">
+                <div class="create-full-page-header">
+                  <!-- slotted header label -->
+                  <!-- <span slot="label">Optional label for context</span> -->
+
+                  <!-- slotted header title -->
+                  <h2>Step ${currentStep + 1}</h2>
+                  <p class="create-full-page-subtitle">
+                    Optional subtitle to display on a step
+                  </p>
+
+                  <!-- slotted header description -->
+                  <p class="create-full-page-description">
+                    Optional description to display on a step
+                  </p>
+                </div>
+              </cds-custom-column>
+            </cds-custom-grid>
+
+            <!-- default slotted content -->
+            <step-group>
+              <cds-custom-grid class="sb-grid">
+                <cds-custom-column lg="8" sm="4">
+                  ${currentStep + 1 === 1
+            ? html `<div>
+                        <cds-custom-stack gap="6" orientation="horizontal">
+                          <cds-custom-text-input
+                            label="Email"
+                            id="tearsheet-story-text-input-a"
+                            value=${this._email}
+                            @input="${this._handleEmailInput}"
+                          ></cds-custom-text-input>
+                        </cds-custom-stack>
+                      </div>`
+            : nothing}
+                  ${currentStep + 1 === 2
+            ? html `<div>
+                        <cds-custom-stack gap="6" orientation="horizontal">
+                          <cds-custom-text-input
+                            label="City"
+                            id="tearsheet-story-text-input-city"
+                            value=${this._city}
+                            @input="${this._handleCityInput}"
+                          ></cds-custom-text-input>
+                          <cds-custom-text-input
+                            label="State"
+                            id="tearsheet-story-text-input-state"
+                            value=${this._state}
+                            @input="${this._handleStateInput}"
+                          ></cds-custom-text-input>
+                        </cds-custom-stack>
+                      </div>`
+            : nothing}
+                  ${currentStep + 1 === 3
+            ? html `<div>
+                        <!-- //cspell: disable -->
+                        <cds-custom-code-snippet
+                          type="multi"
+                          copy-text=""
+                          maxcollapsednumberofrows="15"
+                          maxexpandednumberofrows=""
+                          mincollapsednumberofrows="3"
+                          minexpandednumberofrows=""
+                          show-less-text="Show less"
+                          show-more-text="Show more"
+                          feedback=""
+                          feedback-timeout="0"
+                          tooltip-content="Copy to clipboard"
+                        >
+                          ${JSON.stringify(formState, null, 2)}
+                        </cds-custom-code-snippet>
+                        <!-- //cspell: enable -->
+                      </div>`
+            : nothing}
+                </cds-custom-column>
+              </cds-custom-grid>
+            </step-group>
+          </div>
+          <div class="create-full-page-actions">
+            <cds-custom-button
+              slot="actions"
+              kind=${'ghost'}
+              class="create-full-page-action__cancel"
+              @click=${this._handleCancelButton}
+            >
+              Cancel
+            </cds-custom-button>
+            <cds-custom-button
+              slot="actions"
+              kind=${'secondary'}
+              @click=${this._handleBackButton}
+            >
+              Back
+            </cds-custom-button>
+            <cds-custom-button slot="actions" @click=${this._handleNextButton}>
+              ${currentStep + 1 < totalSteps ? 'Next' : 'Submit'}
+            </cds-custom-button>
+          </div>
+        </div>
+      </cds-custom-layer>
+    </div>`;
+    }
+};
+StepFullPage.styles = styles;
+__decorate([
+    property({ type: Boolean })
+], StepFullPage.prototype, "narrow", void 0);
+__decorate([
+    state()
+], StepFullPage.prototype, "_open", void 0);
+__decorate([
+    state()
+], StepFullPage.prototype, "_email", void 0);
+__decorate([
+    state()
+], StepFullPage.prototype, "_city", void 0);
+__decorate([
+    state()
+], StepFullPage.prototype, "_state", void 0);
+StepFullPage = __decorate([
+    customElement('step-full-page')
+], StepFullPage);
+
+export { StepFullPage };
+//# sourceMappingURL=step-full-page.js.map

package/es-custom/patterns/step-flow/_story-assets/step-full-page.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"step-full-page.js","sources":["../../../../src/patterns/step-flow/_story-assets/step-full-page.ts"],"sourcesContent":[null],"names":[],"mappings":"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"}

package/es-custom/patterns/step-flow/_story-assets/step-full-page.scss.js

@@ -0,0 +1,13 @@
+/**
+ * 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 { css } from 'lit';
+
+var styles = css([":host(step-full-page){block-size:100vh;color:var(--cds-text-primary,#161616);display:grid;grid-template-rows:minmax(auto,100%)}:host(step-full-page) .step-full-page-with-util{display:flex;margin:0;max-block-size:100%;overflow:hidden;padding:0}:host(step-full-page) .create-full-page-header{padding-block-end:1.5rem}:host(step-full-page) .create-full-page-header h2{font-size:var(--cds-heading-04-font-size,1.75rem);font-weight:var(--cds-heading-04-font-weight,400);letter-spacing:var(--cds-heading-04-letter-spacing,0);line-height:var(--cds-heading-04-line-height,1.28572)}:host(step-full-page) .create-full-page-wrapper{background-color:var(--cds-layer-01,#f4f4f4);block-size:calc(100% - 1.5rem);color:var(--cds-text-primary,#161616);display:flex;flex-direction:column;flex-grow:1;justify-content:space-between;overflow:auto;overflow-x:hidden;padding-block-start:1.5rem}:host(step-full-page) .create-influencer{border-inline-end:1px solid var(--cds-border-subtle);box-sizing:border-box;inline-size:256px;min-inline-size:256px;padding:1.5rem 2rem}:host(step-full-page) .create-full-page-subtitle{font-size:var(--cds-heading-compact-01-font-size,.875rem);font-weight:var(--cds-heading-compact-01-font-weight,600);letter-spacing:var(--cds-heading-compact-01-letter-spacing,.16px);line-height:var(--cds-heading-compact-01-line-height,1.28572)}:host(step-full-page) .create-full-page-description{font-size:var(--cds-body-01-font-size,.875rem);font-weight:var(--cds-body-01-font-weight,400);letter-spacing:var(--cds-body-01-letter-spacing,.16px);line-height:var(--cds-body-01-line-height,1.42857)}:host(step-full-page) .create-full-page-layer{inline-size:100%}:host(step-full-page) .create-full-page-actions{block-size:64px;border-block-start:1px solid var(--cds-border-subtle);display:grid;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);grid-auto-rows:minmax(auto,auto);grid-template-columns:repeat(6,1fr);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572)}:host(step-full-page) .create-full-page-action__cancel{grid-column:span 4}:host(step-full-page) ::part(grid){max-inline-size:100%}"]);
+
+export { styles as default };
+//# sourceMappingURL=step-full-page.scss.js.map

package/es-custom/patterns/step-flow/_story-assets/step-full-page.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"step-full-page.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}

package/es-custom/{components → patterns}/step-flow/_story-assets/step-tearsheet.d.ts

@@ -9,9 +9,10 @@ import '@carbon/web-components/es-custom/components/progress-indicator/index.js'
 import '@carbon/web-components/es-custom/components/stack/index.js';
 import '@carbon/web-components/es-custom/components/code-snippet/index.js';
 import '../step-group';
-import '../../tearsheet/index.js';
+import '../../../components/tearsheet/index.js';
 declare const StepTearsheet_base: typeof LitElement;
 export declare class StepTearsheet extends StepTearsheet_base {
+    narrow: boolean;
     private _open;
     private _email;
     private _city;

package/es-custom/{components → patterns}/step-flow/_story-assets/step-tearsheet.js

@@ -7,7 +7,7 @@
 
 import { __decorate } from 'tslib';
 import { LitElement, nothing, html } from 'lit';
-import { state, customElement } from 'lit/decorators.js';
+import { property, state, customElement } from 'lit/decorators.js';
 import { SignalWatcher } from '@lit-labs/signals';
 import styles from '../story-styles.scss.js';
 import { StepInstance } from '../step-flow-signal.js';
@@ -15,7 +15,7 @@ import '@carbon/web-components/es-custom/components/progress-indicator/index.js'
 import '@carbon/web-components/es-custom/components/stack/index.js';
 import '@carbon/web-components/es-custom/components/code-snippet/index.js';
 import '../step-group.js';
-import '../../tearsheet/tearsheet.js';
+import '../../../components/tearsheet/tearsheet.js';
 import { registerFocusableContainers, trapFocus } from '../../../utilities/manageFocusTrap/manageFocusTrap.js';
 
 /**
@@ -27,6 +27,7 @@ import { registerFocusableContainers, trapFocus } from '../../../utilities/manag
 let StepTearsheet = class StepTearsheet extends SignalWatcher(LitElement) {
     constructor() {
         super(...arguments);
+        this.narrow = false;
         this._open = false;
         this._email = '';
         this._city = '';
@@ -109,7 +110,7 @@ let StepTearsheet = class StepTearsheet extends SignalWatcher(LitElement) {
         class=${'step-tearsheet-with-util'}
         selector-initial-focus=${'#tearsheet-story-text-input-a'}
         ?open=${this._open}
-        width=${'wide'}
+        width=${this.narrow ? 'narrow' : 'wide'}
         influencer-placement=${'left'}
         prevent-close-on-click-outside
       >
@@ -231,6 +232,9 @@ let StepTearsheet = class StepTearsheet extends SignalWatcher(LitElement) {
     }
 };
 StepTearsheet.styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader
+__decorate([
+    property({ type: Boolean })
+], StepTearsheet.prototype, "narrow", void 0);
 __decorate([
     state()
 ], StepTearsheet.prototype, "_open", void 0);