@carbon/web-components 2.32.0 → 2.33.0-rc.0

package/es/components/feature-flags/index.js

@@ -0,0 +1,118 @@
+/**
+ * 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 { FeatureFlags, createScope } from '../../feature-flags/es/index.js';
+import { carbonElement } from '../../globals/decorators/carbon-element.js';
+import { LitElement, html } from 'lit';
+
+/**
+ * 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.
+ */
+/**
+ * <feature-flags> provides scoped feature flags to child components.
+ *
+ * Usage:
+ * Wrap any child components inside <feature-flags> to provide scoped feature flags like this:
+ * <feature-flags enable-dialog-element="true">
+ *   <component></component>
+ * </feature-flags>
+ *
+ * Available flags:
+ * - enable-dialog-element
+ * - enable-treeview-controllable
+ * - ... (and others listed in observedAttributes)
+ *
+ * How to check a Flag in your component:
+ *   import { isFeatureFlagEnabled } from './feature-flags';
+ *   isFeatureFlagEnabled('enable-dialog-element', this)
+ *   Returns true if the flag is enabled in the nearest <feature-flags> ancestor
+ */
+var FeatureFlagsElement_1;
+let FeatureFlagsElement = FeatureFlagsElement_1 = class FeatureFlagsElement extends LitElement {
+    static get observedAttributes() {
+        return [
+            'enable-v12-tile-default-icons',
+            'enable-v12-tile-radio-icons',
+            'enable-v12-overflowmenu',
+            'enable-treeview-controllable',
+            'enable-experimental-focus-wrap-without-sentinels',
+            'enable-dialog-element',
+            'enable-v12-dynamic-floating-styles',
+        ];
+    }
+    constructor() {
+        super();
+        this.scope = FeatureFlags;
+        this.flags = {};
+        this.attachShadow({ mode: 'open' });
+    }
+    connectedCallback() {
+        super.connectedCallback();
+        this.updateScope();
+    }
+    attributeChangedCallback(name, _oldVal, newVal) {
+        const value = newVal === 'true';
+        this.flags[name] = value;
+        this.updateScope();
+    }
+    getParentScope() {
+        let parent = this.parentNode;
+        while (parent) {
+            if (parent instanceof FeatureFlagsElement_1) {
+                return parent.getScope();
+            }
+            parent = parent.parentNode;
+        }
+        return null;
+    }
+    updateScope() {
+        const newScope = createScope(this.flags);
+        const parentScope = this.getParentScope() || FeatureFlags;
+        if (parentScope) {
+            newScope.mergeWithScope(parentScope);
+        }
+        this.scope = newScope;
+    }
+    render() {
+        return html ` <slot></slot> `;
+    }
+    isFeatureFlagEnabled(flag) {
+        return this.scope.enabled(flag);
+    }
+    getScope() {
+        return this.scope;
+    }
+};
+FeatureFlagsElement = FeatureFlagsElement_1 = __decorate([
+    carbonElement('feature-flags')
+], FeatureFlagsElement);
+var FeatureFlagsElement$1 = FeatureFlagsElement;
+// Utility functions
+// Function to find the nearest parent FeatureFlagsElement
+function findParentFeatureFlags(el) {
+    let parent = el.parentNode;
+    while (parent) {
+        if (parent instanceof FeatureFlagsElement) {
+            return parent;
+        }
+        parent = parent.parentNode;
+    }
+    return null;
+}
+// function to check if a feature flag is enabled in components
+function isFeatureFlagEnabled(flag, context) {
+    var _a;
+    const instance = findParentFeatureFlags(context);
+    return (_a = instance === null || instance === void 0 ? void 0 : instance.isFeatureFlagEnabled(flag)) !== null && _a !== void 0 ? _a : false;
+}
+
+export { FeatureFlagsElement$1 as default, findParentFeatureFlags, isFeatureFlagEnabled };
+//# sourceMappingURL=index.js.map

package/es/components/feature-flags/index.js.map

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

package/es/components/grid/column-hang.d.ts

@@ -0,0 +1,19 @@
+/**
+ * @license
+ *
+ * Copyright IBM Corp. 2024, 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 { LitElement } from 'lit';
+/**
+ * The column component.
+ *
+ * @element cds-column-hang
+ */
+declare class CDSColumnHang extends LitElement {
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: any;
+}
+export default CDSColumnHang;

package/es/components/grid/column-hang.js

@@ -0,0 +1,43 @@
+/**
+ * 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 { carbonElement } from '../../globals/decorators/carbon-element.js';
+import { prefix } from '../../globals/settings.js';
+import styles from './column-hang.scss.js';
+
+/**
+ * @license
+ *
+ * Copyright IBM Corp. 2024, 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.
+ */
+/**
+ * The column component.
+ *
+ * @element cds-column-hang
+ */
+let CDSColumnHang = class CDSColumnHang extends LitElement {
+    render() {
+        // Grid styling added to contained components, allowing CSS Grid
+        // to affect its own slot content.
+        return html `<div part="column-hang">
+      <slot></slot>
+    </div>`;
+    }
+};
+CDSColumnHang.styles = styles;
+CDSColumnHang = __decorate([
+    carbonElement(`${prefix}-column-hang`)
+], CDSColumnHang);
+var CDSColumnHang$1 = CDSColumnHang;
+
+export { CDSColumnHang$1 as default };
+//# sourceMappingURL=column-hang.js.map

package/es/components/grid/column-hang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"column-hang.js","sources":["../../../src/components/grid/column-hang.ts"],"sourcesContent":[null],"names":["customElement"],"mappings":";;;;;;;;;;;;;AAAA;;;;;;;AAOG;AAOH;;;;AAIG;AAEH,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU,CAAA;IACpC,MAAM,GAAA;;;AAGJ,QAAA,OAAO,IAAI,CAAA,CAAA;;WAEJ,CAAC;KACT;;AAEM,aAAM,CAAA,MAAA,GAAG,MAAH,CAAU;AATnB,aAAa,GAAA,UAAA,CAAA;AADlB,IAAAA,aAAa,CAAC,CAAA,EAAG,MAAM,CAAA,YAAA,CAAc,CAAC;AACjC,CAAA,EAAA,aAAa,CAUlB,CAAA;AAED,sBAAe,aAAa;;;;"}

package/es/components/grid/column-hang.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([":root{--cds-grid-gutter:2rem;--cds-grid-columns:4;--cds-grid-margin:0}@media (min-width:42rem){:root{--cds-grid-columns:8;--cds-grid-margin:1rem}}@media (min-width:66rem){:root{--cds-grid-columns:16}}@media (min-width:99rem){:root{--cds-grid-margin:1.5rem}}.cds--css-grid{--cds-grid-gutter-start:calc(var(--cds-grid-gutter)/2);--cds-grid-gutter-end:calc(var(--cds-grid-gutter)/2);--cds-grid-column-hang:calc(var(--cds-grid-gutter)/2);display:grid;grid-template-columns:repeat(var(--cds-grid-columns),minmax(0,1fr));inline-size:100%;margin-inline:auto;max-inline-size:99rem;padding-inline:var(--cds-grid-margin)}.cds--css-grid--full-width{max-inline-size:100%}.cds--css-grid-column{--cds-grid-mode-start:var(--cds-grid-gutter-start);--cds-grid-mode-end:var(--cds-grid-gutter-end);margin-inline:var(--cds-grid-gutter-start) var(--cds-grid-gutter-end)}[dir=rtl] .cds--css-grid-column{margin-inline:var(--cds-grid-gutter-end) var(--cds-grid-gutter-start)}.cds--css-grid--narrow{--cds-grid-gutter-start:0rem}.cds--css-grid--condensed{--cds-grid-gutter:0.0625rem;--cds-grid-column-hang:0.96875rem}.cds--css-grid--start{margin-inline-start:0}.cds--css-grid--end{margin-inline-end:0}.cds--subgrid{display:grid;grid-template-columns:repeat(var(--cds-grid-columns),minmax(0,1fr));margin-inline:calc(var(--cds-grid-mode-start)*-1) calc(var(--cds-grid-mode-end)*-1)}[dir=rtl] .cds--subgrid{margin-inline:calc(var(--cds-grid-mode-end)*-1) calc(var(--cds-grid-mode-start)*-1)}.cds--subgrid--wide{--cds-grid-gutter-start:1rem;--cds-grid-gutter-end:1rem;--cds-grid-column-hang:0}.cds--subgrid--narrow{--cds-grid-gutter-start:0rem;--cds-grid-gutter-end:1rem;--cds-grid-column-hang:1rem}.cds--subgrid--condensed{--cds-grid-gutter-start:0.03125rem;--cds-grid-gutter-end:0.03125rem;--cds-grid-column-hang:0.96875rem}.cds--grid-column-hang,:host(cds-column-hang){margin-inline-start:var(--cds-grid-column-hang)}[dir=rtl] .cds--grid-column-hang,[dir=rtl] :host(cds-column-hang){margin-inline:initial var(--cds-grid-column-hang)}.cds--col-span-0{display:none}.cds--col-span-1{--cds-grid-columns:1;display:block;grid-column:span 1/span 1}.cds--col-span-2{--cds-grid-columns:2;display:block;grid-column:span 2/span 2}.cds--col-span-3{--cds-grid-columns:3;display:block;grid-column:span 3/span 3}.cds--col-span-4{--cds-grid-columns:4;display:block;grid-column:span 4/span 4}.cds--col-span-5{--cds-grid-columns:5;display:block;grid-column:span 5/span 5}.cds--col-span-6{--cds-grid-columns:6;display:block;grid-column:span 6/span 6}.cds--col-span-7{--cds-grid-columns:7;display:block;grid-column:span 7/span 7}.cds--col-span-8{--cds-grid-columns:8;display:block;grid-column:span 8/span 8}.cds--col-span-9{--cds-grid-columns:9;display:block;grid-column:span 9/span 9}.cds--col-span-10{--cds-grid-columns:10;display:block;grid-column:span 10/span 10}.cds--col-span-11{--cds-grid-columns:11;display:block;grid-column:span 11/span 11}.cds--col-span-12{--cds-grid-columns:12;display:block;grid-column:span 12/span 12}.cds--col-span-13{--cds-grid-columns:13;display:block;grid-column:span 13/span 13}.cds--col-span-14{--cds-grid-columns:14;display:block;grid-column:span 14/span 14}.cds--col-span-15{--cds-grid-columns:15;display:block;grid-column:span 15/span 15}.cds--col-span-16{--cds-grid-columns:16;display:block;grid-column:span 16/span 16}.cds--sm\\:col-span-0{display:none}.cds--sm\\:col-span-1{--cds-grid-columns:1;display:block;grid-column:span 1/span 1}.cds--sm\\:col-span-2{--cds-grid-columns:2;display:block;grid-column:span 2/span 2}.cds--sm\\:col-span-3{--cds-grid-columns:3;display:block;grid-column:span 3/span 3}.cds--sm\\:col-span-4{--cds-grid-columns:4;display:block;grid-column:span 4/span 4}.cds--sm\\:col-span-auto{grid-column:auto}.cds--sm\\:col-span-100{grid-column:1/-1}.cds--sm\\:col-span-75{--cds-grid-columns:3;grid-column:span 3/span 3}.cds--sm\\:col-span-50{--cds-grid-columns:2;grid-column:span 2/span 2}.cds--sm\\:col-span-25{--cds-grid-columns:1;grid-column:span 1/span 1}@media (min-width:42rem){.cds--md\\:col-span-0{display:none}.cds--md\\:col-span-1{--cds-grid-columns:1;display:block;grid-column:span 1/span 1}.cds--md\\:col-span-2{--cds-grid-columns:2;display:block;grid-column:span 2/span 2}.cds--md\\:col-span-3{--cds-grid-columns:3;display:block;grid-column:span 3/span 3}.cds--md\\:col-span-4{--cds-grid-columns:4;display:block;grid-column:span 4/span 4}.cds--md\\:col-span-5{--cds-grid-columns:5;display:block;grid-column:span 5/span 5}.cds--md\\:col-span-6{--cds-grid-columns:6;display:block;grid-column:span 6/span 6}.cds--md\\:col-span-7{--cds-grid-columns:7;display:block;grid-column:span 7/span 7}.cds--md\\:col-span-8{--cds-grid-columns:8;display:block;grid-column:span 8/span 8}.cds--md\\:col-span-auto{grid-column:auto}.cds--md\\:col-span-100{grid-column:1/-1}.cds--md\\:col-span-75{--cds-grid-columns:6;grid-column:span 6/span 6}.cds--md\\:col-span-50{--cds-grid-columns:4;grid-column:span 4/span 4}.cds--md\\:col-span-25{--cds-grid-columns:2;grid-column:span 2/span 2}}@media (min-width:66rem){.cds--lg\\:col-span-0{display:none}.cds--lg\\:col-span-1{--cds-grid-columns:1;display:block;grid-column:span 1/span 1}.cds--lg\\:col-span-2{--cds-grid-columns:2;display:block;grid-column:span 2/span 2}.cds--lg\\:col-span-3{--cds-grid-columns:3;display:block;grid-column:span 3/span 3}.cds--lg\\:col-span-4{--cds-grid-columns:4;display:block;grid-column:span 4/span 4}.cds--lg\\:col-span-5{--cds-grid-columns:5;display:block;grid-column:span 5/span 5}.cds--lg\\:col-span-6{--cds-grid-columns:6;display:block;grid-column:span 6/span 6}.cds--lg\\:col-span-7{--cds-grid-columns:7;display:block;grid-column:span 7/span 7}.cds--lg\\:col-span-8{--cds-grid-columns:8;display:block;grid-column:span 8/span 8}.cds--lg\\:col-span-9{--cds-grid-columns:9;display:block;grid-column:span 9/span 9}.cds--lg\\:col-span-10{--cds-grid-columns:10;display:block;grid-column:span 10/span 10}.cds--lg\\:col-span-11{--cds-grid-columns:11;display:block;grid-column:span 11/span 11}.cds--lg\\:col-span-12{--cds-grid-columns:12;display:block;grid-column:span 12/span 12}.cds--lg\\:col-span-13{--cds-grid-columns:13;display:block;grid-column:span 13/span 13}.cds--lg\\:col-span-14{--cds-grid-columns:14;display:block;grid-column:span 14/span 14}.cds--lg\\:col-span-15{--cds-grid-columns:15;display:block;grid-column:span 15/span 15}.cds--lg\\:col-span-16{--cds-grid-columns:16;display:block;grid-column:span 16/span 16}.cds--lg\\:col-span-auto{grid-column:auto}.cds--lg\\:col-span-100{grid-column:1/-1}.cds--lg\\:col-span-75{--cds-grid-columns:12;grid-column:span 12/span 12}.cds--lg\\:col-span-50{--cds-grid-columns:8;grid-column:span 8/span 8}.cds--lg\\:col-span-25{--cds-grid-columns:4;grid-column:span 4/span 4}}@media (min-width:82rem){.cds--xlg\\:col-span-0{display:none}.cds--xlg\\:col-span-1{--cds-grid-columns:1;display:block;grid-column:span 1/span 1}.cds--xlg\\:col-span-2{--cds-grid-columns:2;display:block;grid-column:span 2/span 2}.cds--xlg\\:col-span-3{--cds-grid-columns:3;display:block;grid-column:span 3/span 3}.cds--xlg\\:col-span-4{--cds-grid-columns:4;display:block;grid-column:span 4/span 4}.cds--xlg\\:col-span-5{--cds-grid-columns:5;display:block;grid-column:span 5/span 5}.cds--xlg\\:col-span-6{--cds-grid-columns:6;display:block;grid-column:span 6/span 6}.cds--xlg\\:col-span-7{--cds-grid-columns:7;display:block;grid-column:span 7/span 7}.cds--xlg\\:col-span-8{--cds-grid-columns:8;display:block;grid-column:span 8/span 8}.cds--xlg\\:col-span-9{--cds-grid-columns:9;display:block;grid-column:span 9/span 9}.cds--xlg\\:col-span-10{--cds-grid-columns:10;display:block;grid-column:span 10/span 10}.cds--xlg\\:col-span-11{--cds-grid-columns:11;display:block;grid-column:span 11/span 11}.cds--xlg\\:col-span-12{--cds-grid-columns:12;display:block;grid-column:span 12/span 12}.cds--xlg\\:col-span-13{--cds-grid-columns:13;display:block;grid-column:span 13/span 13}.cds--xlg\\:col-span-14{--cds-grid-columns:14;display:block;grid-column:span 14/span 14}.cds--xlg\\:col-span-15{--cds-grid-columns:15;display:block;grid-column:span 15/span 15}.cds--xlg\\:col-span-16{--cds-grid-columns:16;display:block;grid-column:span 16/span 16}.cds--xlg\\:col-span-auto{grid-column:auto}.cds--xlg\\:col-span-100{grid-column:1/-1}.cds--xlg\\:col-span-75{--cds-grid-columns:12;grid-column:span 12/span 12}.cds--xlg\\:col-span-50{--cds-grid-columns:8;grid-column:span 8/span 8}.cds--xlg\\:col-span-25{--cds-grid-columns:4;grid-column:span 4/span 4}}@media (min-width:99rem){.cds--max\\:col-span-0{display:none}.cds--max\\:col-span-1{--cds-grid-columns:1;display:block;grid-column:span 1/span 1}.cds--max\\:col-span-2{--cds-grid-columns:2;display:block;grid-column:span 2/span 2}.cds--max\\:col-span-3{--cds-grid-columns:3;display:block;grid-column:span 3/span 3}.cds--max\\:col-span-4{--cds-grid-columns:4;display:block;grid-column:span 4/span 4}.cds--max\\:col-span-5{--cds-grid-columns:5;display:block;grid-column:span 5/span 5}.cds--max\\:col-span-6{--cds-grid-columns:6;display:block;grid-column:span 6/span 6}.cds--max\\:col-span-7{--cds-grid-columns:7;display:block;grid-column:span 7/span 7}.cds--max\\:col-span-8{--cds-grid-columns:8;display:block;grid-column:span 8/span 8}.cds--max\\:col-span-9{--cds-grid-columns:9;display:block;grid-column:span 9/span 9}.cds--max\\:col-span-10{--cds-grid-columns:10;display:block;grid-column:span 10/span 10}.cds--max\\:col-span-11{--cds-grid-columns:11;display:block;grid-column:span 11/span 11}.cds--max\\:col-span-12{--cds-grid-columns:12;display:block;grid-column:span 12/span 12}.cds--max\\:col-span-13{--cds-grid-columns:13;display:block;grid-column:span 13/span 13}.cds--max\\:col-span-14{--cds-grid-columns:14;display:block;grid-column:span 14/span 14}.cds--max\\:col-span-15{--cds-grid-columns:15;display:block;grid-column:span 15/span 15}.cds--max\\:col-span-16{--cds-grid-columns:16;display:block;grid-column:span 16/span 16}.cds--max\\:col-span-auto{grid-column:auto}.cds--max\\:col-span-100{grid-column:1/-1}.cds--max\\:col-span-75{--cds-grid-columns:12;grid-column:span 12/span 12}.cds--max\\:col-span-50{--cds-grid-columns:8;grid-column:span 8/span 8}.cds--max\\:col-span-25{--cds-grid-columns:4;grid-column:span 4/span 4}}.cds--col-span-auto{grid-column:auto}.cds--col-span-100{grid-column:1/-1}.cds--col-span-75{--cds-grid-columns:3;grid-column:span 3/span 3}@media (min-width:42rem){.cds--col-span-75{--cds-grid-columns:6;grid-column:span 6/span 6}}@media (min-width:66rem){.cds--col-span-75{--cds-grid-columns:12;grid-column:span 12/span 12}}.cds--col-span-50{--cds-grid-columns:2;grid-column:span 2/span 2}@media (min-width:42rem){.cds--col-span-50{--cds-grid-columns:4;grid-column:span 4/span 4}}@media (min-width:66rem){.cds--col-span-50{--cds-grid-columns:8;grid-column:span 8/span 8}}.cds--col-span-25{--cds-grid-columns:1;grid-column:span 1/span 1}@media (min-width:42rem){.cds--col-span-25{--cds-grid-columns:2;grid-column:span 2/span 2}}@media (min-width:66rem){.cds--col-span-25{--cds-grid-columns:4;grid-column:span 4/span 4}}.cds--col-start-1{grid-column-start:1}.cds--col-start-2{grid-column-start:2}.cds--col-start-3{grid-column-start:3}.cds--col-start-4{grid-column-start:4}.cds--col-start-5{grid-column-start:5}.cds--col-start-6{grid-column-start:6}.cds--col-start-7{grid-column-start:7}.cds--col-start-8{grid-column-start:8}.cds--col-start-9{grid-column-start:9}.cds--col-start-10{grid-column-start:10}.cds--col-start-11{grid-column-start:11}.cds--col-start-12{grid-column-start:12}.cds--col-start-13{grid-column-start:13}.cds--col-start-14{grid-column-start:14}.cds--col-start-15{grid-column-start:15}.cds--col-start-16{grid-column-start:16}.cds--col-end-2{grid-column-end:2}.cds--col-end-3{grid-column-end:3}.cds--col-end-4{grid-column-end:4}.cds--col-end-5{grid-column-end:5}.cds--col-end-6{grid-column-end:6}.cds--col-end-7{grid-column-end:7}.cds--col-end-8{grid-column-end:8}.cds--col-end-9{grid-column-end:9}.cds--col-end-10{grid-column-end:10}.cds--col-end-11{grid-column-end:11}.cds--col-end-12{grid-column-end:12}.cds--col-end-13{grid-column-end:13}.cds--col-end-14{grid-column-end:14}.cds--col-end-15{grid-column-end:15}.cds--col-end-16{grid-column-end:16}.cds--col-end-17{grid-column-end:17}.cds--col-start-auto{grid-column-start:auto}.cds--col-end-auto{grid-column-end:auto}.cds--sm\\:col-start-1{grid-column-start:1}.cds--sm\\:col-start-2{grid-column-start:2}.cds--sm\\:col-start-3{grid-column-start:3}.cds--sm\\:col-start-4{grid-column-start:4}.cds--sm\\:col-start-5{grid-column-start:5}.cds--sm\\:col-start-6{grid-column-start:6}.cds--sm\\:col-start-7{grid-column-start:7}.cds--sm\\:col-start-8{grid-column-start:8}.cds--sm\\:col-start-9{grid-column-start:9}.cds--sm\\:col-start-10{grid-column-start:10}.cds--sm\\:col-start-11{grid-column-start:11}.cds--sm\\:col-start-12{grid-column-start:12}.cds--sm\\:col-start-13{grid-column-start:13}.cds--sm\\:col-start-14{grid-column-start:14}.cds--sm\\:col-start-15{grid-column-start:15}.cds--sm\\:col-start-16{grid-column-start:16}.cds--sm\\:col-end-2{grid-column-end:2}.cds--sm\\:col-end-3{grid-column-end:3}.cds--sm\\:col-end-4{grid-column-end:4}.cds--sm\\:col-end-5{grid-column-end:5}.cds--sm\\:col-end-6{grid-column-end:6}.cds--sm\\:col-end-7{grid-column-end:7}.cds--sm\\:col-end-8{grid-column-end:8}.cds--sm\\:col-end-9{grid-column-end:9}.cds--sm\\:col-end-10{grid-column-end:10}.cds--sm\\:col-end-11{grid-column-end:11}.cds--sm\\:col-end-12{grid-column-end:12}.cds--sm\\:col-end-13{grid-column-end:13}.cds--sm\\:col-end-14{grid-column-end:14}.cds--sm\\:col-end-15{grid-column-end:15}.cds--sm\\:col-end-16{grid-column-end:16}.cds--sm\\:col-end-17{grid-column-end:17}.cds--sm\\:col-start-auto{grid-column-start:auto}.cds--sm\\:col-end-auto{grid-column-end:auto}@media (min-width:42rem){.cds--md\\:col-start-1{grid-column-start:1}.cds--md\\:col-start-2{grid-column-start:2}.cds--md\\:col-start-3{grid-column-start:3}.cds--md\\:col-start-4{grid-column-start:4}.cds--md\\:col-start-5{grid-column-start:5}.cds--md\\:col-start-6{grid-column-start:6}.cds--md\\:col-start-7{grid-column-start:7}.cds--md\\:col-start-8{grid-column-start:8}.cds--md\\:col-start-9{grid-column-start:9}.cds--md\\:col-start-10{grid-column-start:10}.cds--md\\:col-start-11{grid-column-start:11}.cds--md\\:col-start-12{grid-column-start:12}.cds--md\\:col-start-13{grid-column-start:13}.cds--md\\:col-start-14{grid-column-start:14}.cds--md\\:col-start-15{grid-column-start:15}.cds--md\\:col-start-16{grid-column-start:16}.cds--md\\:col-end-2{grid-column-end:2}.cds--md\\:col-end-3{grid-column-end:3}.cds--md\\:col-end-4{grid-column-end:4}.cds--md\\:col-end-5{grid-column-end:5}.cds--md\\:col-end-6{grid-column-end:6}.cds--md\\:col-end-7{grid-column-end:7}.cds--md\\:col-end-8{grid-column-end:8}.cds--md\\:col-end-9{grid-column-end:9}.cds--md\\:col-end-10{grid-column-end:10}.cds--md\\:col-end-11{grid-column-end:11}.cds--md\\:col-end-12{grid-column-end:12}.cds--md\\:col-end-13{grid-column-end:13}.cds--md\\:col-end-14{grid-column-end:14}.cds--md\\:col-end-15{grid-column-end:15}.cds--md\\:col-end-16{grid-column-end:16}.cds--md\\:col-end-17{grid-column-end:17}.cds--md\\:col-start-auto{grid-column-start:auto}.cds--md\\:col-end-auto{grid-column-end:auto}}@media (min-width:66rem){.cds--lg\\:col-start-1{grid-column-start:1}.cds--lg\\:col-start-2{grid-column-start:2}.cds--lg\\:col-start-3{grid-column-start:3}.cds--lg\\:col-start-4{grid-column-start:4}.cds--lg\\:col-start-5{grid-column-start:5}.cds--lg\\:col-start-6{grid-column-start:6}.cds--lg\\:col-start-7{grid-column-start:7}.cds--lg\\:col-start-8{grid-column-start:8}.cds--lg\\:col-start-9{grid-column-start:9}.cds--lg\\:col-start-10{grid-column-start:10}.cds--lg\\:col-start-11{grid-column-start:11}.cds--lg\\:col-start-12{grid-column-start:12}.cds--lg\\:col-start-13{grid-column-start:13}.cds--lg\\:col-start-14{grid-column-start:14}.cds--lg\\:col-start-15{grid-column-start:15}.cds--lg\\:col-start-16{grid-column-start:16}.cds--lg\\:col-end-2{grid-column-end:2}.cds--lg\\:col-end-3{grid-column-end:3}.cds--lg\\:col-end-4{grid-column-end:4}.cds--lg\\:col-end-5{grid-column-end:5}.cds--lg\\:col-end-6{grid-column-end:6}.cds--lg\\:col-end-7{grid-column-end:7}.cds--lg\\:col-end-8{grid-column-end:8}.cds--lg\\:col-end-9{grid-column-end:9}.cds--lg\\:col-end-10{grid-column-end:10}.cds--lg\\:col-end-11{grid-column-end:11}.cds--lg\\:col-end-12{grid-column-end:12}.cds--lg\\:col-end-13{grid-column-end:13}.cds--lg\\:col-end-14{grid-column-end:14}.cds--lg\\:col-end-15{grid-column-end:15}.cds--lg\\:col-end-16{grid-column-end:16}.cds--lg\\:col-end-17{grid-column-end:17}.cds--lg\\:col-start-auto{grid-column-start:auto}.cds--lg\\:col-end-auto{grid-column-end:auto}}@media (min-width:82rem){.cds--xlg\\:col-start-1{grid-column-start:1}.cds--xlg\\:col-start-2{grid-column-start:2}.cds--xlg\\:col-start-3{grid-column-start:3}.cds--xlg\\:col-start-4{grid-column-start:4}.cds--xlg\\:col-start-5{grid-column-start:5}.cds--xlg\\:col-start-6{grid-column-start:6}.cds--xlg\\:col-start-7{grid-column-start:7}.cds--xlg\\:col-start-8{grid-column-start:8}.cds--xlg\\:col-start-9{grid-column-start:9}.cds--xlg\\:col-start-10{grid-column-start:10}.cds--xlg\\:col-start-11{grid-column-start:11}.cds--xlg\\:col-start-12{grid-column-start:12}.cds--xlg\\:col-start-13{grid-column-start:13}.cds--xlg\\:col-start-14{grid-column-start:14}.cds--xlg\\:col-start-15{grid-column-start:15}.cds--xlg\\:col-start-16{grid-column-start:16}.cds--xlg\\:col-end-2{grid-column-end:2}.cds--xlg\\:col-end-3{grid-column-end:3}.cds--xlg\\:col-end-4{grid-column-end:4}.cds--xlg\\:col-end-5{grid-column-end:5}.cds--xlg\\:col-end-6{grid-column-end:6}.cds--xlg\\:col-end-7{grid-column-end:7}.cds--xlg\\:col-end-8{grid-column-end:8}.cds--xlg\\:col-end-9{grid-column-end:9}.cds--xlg\\:col-end-10{grid-column-end:10}.cds--xlg\\:col-end-11{grid-column-end:11}.cds--xlg\\:col-end-12{grid-column-end:12}.cds--xlg\\:col-end-13{grid-column-end:13}.cds--xlg\\:col-end-14{grid-column-end:14}.cds--xlg\\:col-end-15{grid-column-end:15}.cds--xlg\\:col-end-16{grid-column-end:16}.cds--xlg\\:col-end-17{grid-column-end:17}.cds--xlg\\:col-start-auto{grid-column-start:auto}.cds--xlg\\:col-end-auto{grid-column-end:auto}}@media (min-width:99rem){.cds--max\\:col-start-1{grid-column-start:1}.cds--max\\:col-start-2{grid-column-start:2}.cds--max\\:col-start-3{grid-column-start:3}.cds--max\\:col-start-4{grid-column-start:4}.cds--max\\:col-start-5{grid-column-start:5}.cds--max\\:col-start-6{grid-column-start:6}.cds--max\\:col-start-7{grid-column-start:7}.cds--max\\:col-start-8{grid-column-start:8}.cds--max\\:col-start-9{grid-column-start:9}.cds--max\\:col-start-10{grid-column-start:10}.cds--max\\:col-start-11{grid-column-start:11}.cds--max\\:col-start-12{grid-column-start:12}.cds--max\\:col-start-13{grid-column-start:13}.cds--max\\:col-start-14{grid-column-start:14}.cds--max\\:col-start-15{grid-column-start:15}.cds--max\\:col-start-16{grid-column-start:16}.cds--max\\:col-end-2{grid-column-end:2}.cds--max\\:col-end-3{grid-column-end:3}.cds--max\\:col-end-4{grid-column-end:4}.cds--max\\:col-end-5{grid-column-end:5}.cds--max\\:col-end-6{grid-column-end:6}.cds--max\\:col-end-7{grid-column-end:7}.cds--max\\:col-end-8{grid-column-end:8}.cds--max\\:col-end-9{grid-column-end:9}.cds--max\\:col-end-10{grid-column-end:10}.cds--max\\:col-end-11{grid-column-end:11}.cds--max\\:col-end-12{grid-column-end:12}.cds--max\\:col-end-13{grid-column-end:13}.cds--max\\:col-end-14{grid-column-end:14}.cds--max\\:col-end-15{grid-column-end:15}.cds--max\\:col-end-16{grid-column-end:16}.cds--max\\:col-end-17{grid-column-end:17}.cds--max\\:col-start-auto{grid-column-start:auto}.cds--max\\:col-end-auto{grid-column-end:auto}}:host(cds-column-hang){display:block}"]);
+
+export { styles as default };
+//# sourceMappingURL=column-hang.scss.js.map

package/es/components/grid/column-hang.scss.js.map

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

package/es/components/grid/column.d.ts

@@ -0,0 +1,35 @@
+/**
+ * @license
+ *
+ * Copyright IBM Corp. 2024, 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 { LitElement } from 'lit';
+export type ColumnSpecSimple = `${number}` | `${number}%`;
+export type ColumnSpec = ColumnSpecSimple | `span:${number} start:${number}` | `span:${number} end:${number}` | `start:${number} end:${number}`;
+/**
+ * The column component.
+ *
+ * @element cds-column
+ */
+declare class CDSColumn extends LitElement {
+    /**
+     * Specify column size
+     * Keys sm, md or lg
+     *
+     * Values
+     * - N, P, { span:N start:S}, { start: S, end: E}
+     * N = number
+     * P = percentage
+     * S = Start column
+     * E = End column (does not reach e.g. start 1 end 3 is same as start 1 span 2)
+     */
+    sm?: ColumnSpec;
+    md?: ColumnSpec;
+    lg?: ColumnSpec;
+    span?: ColumnSpecSimple;
+    createRenderRoot(): this;
+}
+export default CDSColumn;

package/es/components/grid/column.js

@@ -0,0 +1,50 @@
+/**
+ * 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 } from 'lit';
+import { property } from 'lit/decorators.js';
+import { carbonElement } from '../../globals/decorators/carbon-element.js';
+import { prefix } from '../../globals/settings.js';
+
+/**
+ * @license
+ *
+ * Copyright IBM Corp. 2024, 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.
+ */
+/**
+ * The column component.
+ *
+ * @element cds-column
+ */
+let CDSColumn = class CDSColumn extends LitElement {
+    createRenderRoot() {
+        return this;
+    }
+};
+__decorate([
+    property({ reflect: true })
+], CDSColumn.prototype, "sm", void 0);
+__decorate([
+    property({ reflect: true })
+], CDSColumn.prototype, "md", void 0);
+__decorate([
+    property({ reflect: true })
+], CDSColumn.prototype, "lg", void 0);
+__decorate([
+    property({ reflect: true })
+], CDSColumn.prototype, "span", void 0);
+CDSColumn = __decorate([
+    carbonElement(`${prefix}-column`)
+], CDSColumn);
+var CDSColumn$1 = CDSColumn;
+
+export { CDSColumn$1 as default };
+//# sourceMappingURL=column.js.map

package/es/components/grid/column.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"column.js","sources":["../../../src/components/grid/column.ts"],"sourcesContent":[null],"names":["customElement"],"mappings":";;;;;;;;;;;;;AAAA;;;;;;;AAOG;AAeH;;;;AAIG;AAEH,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU,CAAA;IAwBhC,gBAAgB,GAAA;AACd,QAAA,OAAO,IAAI,CAAC;KACb;CACF,CAAA;AAdC,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AACZ,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,IAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGhB,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AACZ,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,IAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGhB,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AACZ,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,IAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAGhB,UAAA,CAAA;AADC,IAAA,QAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AACJ,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,MAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAtBpB,SAAS,GAAA,UAAA,CAAA;AADd,IAAAA,aAAa,CAAC,CAAA,EAAG,MAAM,CAAA,OAAA,CAAS,CAAC;AAC5B,CAAA,EAAA,SAAS,CA2Bd,CAAA;AAED,kBAAe,SAAS;;;;"}

package/es/components/grid/defs.d.ts

@@ -0,0 +1,35 @@
+/**
+ * Button size.
+ */
+export declare enum GRID_ALIGNMENT {
+    /**
+     * Align to start.
+     */
+    START = "start",
+    /**
+     * Align in center
+     */
+    CENTER = "center",
+    /**
+     * Align to end
+     */
+    END = "end"
+}
+export type GridAlignmentType = Record<GRID_ALIGNMENT, string>;
+/**
+ * Button type.
+ */
+export declare enum SUB_GRID_MODE {
+    /**
+     * Default sug-grid mode.
+     */
+    WIDE = "wide",
+    /**
+     * Condensed sub-grid (should match hosting grid).
+     */
+    CONDENSED = "condensed",
+    /**
+     * Narrow sub-grid (should match hosting grid).
+     */
+    NARROW = "narrow"
+}

package/es/components/grid/defs.js

@@ -0,0 +1,46 @@
+/**
+ * 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.
+ */
+
+/**
+ * Button size.
+ */
+var GRID_ALIGNMENT;
+(function (GRID_ALIGNMENT) {
+    /**
+     * Align to start.
+     */
+    GRID_ALIGNMENT["START"] = "start";
+    /**
+     * Align in center
+     */
+    GRID_ALIGNMENT["CENTER"] = "center";
+    /**
+     * Align to end
+     */
+    GRID_ALIGNMENT["END"] = "end";
+})(GRID_ALIGNMENT || (GRID_ALIGNMENT = {}));
+/**
+ * Button type.
+ */
+var SUB_GRID_MODE;
+(function (SUB_GRID_MODE) {
+    /**
+     * Default sug-grid mode.
+     */
+    SUB_GRID_MODE["WIDE"] = "wide";
+    /**
+     * Condensed sub-grid (should match hosting grid).
+     */
+    SUB_GRID_MODE["CONDENSED"] = "condensed";
+    /**
+     * Narrow sub-grid (should match hosting grid).
+     */
+    SUB_GRID_MODE["NARROW"] = "narrow";
+})(SUB_GRID_MODE || (SUB_GRID_MODE = {}));
+
+export { GRID_ALIGNMENT, SUB_GRID_MODE };
+//# sourceMappingURL=defs.js.map

package/es/components/grid/defs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"defs.js","sources":["../../../src/components/grid/defs.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;AAAA;;AAEG;IACS,eAeX;AAfD,CAAA,UAAY,cAAc,EAAA;AACxB;;AAEG;AACH,IAAA,cAAA,CAAA,OAAA,CAAA,GAAA,OAAe,CAAA;AAEf;;AAEG;AACH,IAAA,cAAA,CAAA,QAAA,CAAA,GAAA,QAAiB,CAAA;AAEjB;;AAEG;AACH,IAAA,cAAA,CAAA,KAAA,CAAA,GAAA,KAAW,CAAA;AACb,CAAC,EAfW,cAAc,KAAd,cAAc,GAezB,EAAA,CAAA,CAAA,CAAA;AAID;;AAEG;IACS,cAeX;AAfD,CAAA,UAAY,aAAa,EAAA;AACvB;;AAEG;AACH,IAAA,aAAA,CAAA,MAAA,CAAA,GAAA,MAAa,CAAA;AAEb;;AAEG;AACH,IAAA,aAAA,CAAA,WAAA,CAAA,GAAA,WAAuB,CAAA;AAEvB;;AAEG;AACH,IAAA,aAAA,CAAA,QAAA,CAAA,GAAA,QAAiB,CAAA;AACnB,CAAC,EAfW,aAAa,KAAb,aAAa,GAexB,EAAA,CAAA,CAAA;;;;"}

package/es/components/grid/grid-context.d.ts

@@ -0,0 +1,9 @@
+export type GridContext = {
+    /**
+     * Specifies whether subgrid should be enabled
+     */
+    subgrid?: boolean;
+};
+export declare const gridContext: {
+    __context__: GridContext;
+};

package/es/components/grid/grid-context.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 { createContext } from '@lit/context';
+
+const gridContext = createContext(Symbol('GridContext'));
+
+export { gridContext };
+//# sourceMappingURL=grid-context.js.map

package/es/components/grid/grid-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grid-context.js","sources":["../../../src/components/grid/grid-context.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;AASa,MAAA,WAAW,GAAG,aAAa,CAAc,MAAM,CAAC,aAAa,CAAC;;;;"}

package/es/components/grid/grid.d.ts

@@ -0,0 +1,41 @@
+/**
+ * @license
+ *
+ * Copyright IBM Corp. 2024, 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 { LitElement } from 'lit';
+import { GridContext } from './grid-context';
+import { GridAlignmentType } from './defs';
+export { GRID_ALIGNMENT } from './defs';
+/**
+ * The grid component.
+ *
+ * @element cds-grid
+ */ declare class CDSGrid extends LitElement {
+    /**
+     * Specify grid alignment. Default is center
+     */
+    align?: GridAlignmentType;
+    /**
+     * Collapse the gutter to 1px. Useful for fluid layouts.
+     * Rows have 1px of margin between them to match gutter.
+     */
+    condensed: boolean;
+    /**
+     * Container hangs 16px into the gutter. Useful for
+     * typographic alignment with and without containers.
+     */
+    narrow: boolean;
+    /**
+     * Remove the default max width that the grid has set
+     */
+    fullWidth: boolean;
+    gridContextIn?: GridContext;
+    gridContext: GridContext;
+    render(): import("lit-html").TemplateResult<1>;
+    static styles: any;
+}
+export default CDSGrid;

package/es/components/grid/grid.js

@@ -0,0 +1,103 @@
+/**
+ * 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 { consume, provide } from '@lit/context';
+import { gridContext } from './grid-context.js';
+import { property } from 'lit/decorators.js';
+import { carbonElement } from '../../globals/decorators/carbon-element.js';
+import { prefix } from '../../globals/settings.js';
+import styles from './grid.scss.js';
+import { SUB_GRID_MODE } from './defs.js';
+export { GRID_ALIGNMENT } from './defs.js';
+
+/**
+ * @license
+ *
+ * Copyright IBM Corp. 2024, 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.
+ */
+/**
+ * The grid component.
+ *
+ * @element cds-grid
+ */ let CDSGrid = class CDSGrid extends LitElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * Collapse the gutter to 1px. Useful for fluid layouts.
+         * Rows have 1px of margin between them to match gutter.
+         */
+        this.condensed = false;
+        /**
+         * Container hangs 16px into the gutter. Useful for
+         * typographic alignment with and without containers.
+         */
+        this.narrow = false;
+        /**
+         * Remove the default max width that the grid has set
+         */
+        this.fullWidth = false;
+        this.gridContext = {
+            subgrid: false,
+        };
+    }
+    render() {
+        var _a;
+        this.gridContext = { subgrid: true };
+        if ((_a = this.gridContextIn) === null || _a === void 0 ? void 0 : _a.subgrid) {
+            let subMode = SUB_GRID_MODE.WIDE;
+            if (this.narrow) {
+                subMode = SUB_GRID_MODE.NARROW;
+            }
+            else if (this.condensed) {
+                subMode = SUB_GRID_MODE.CONDENSED;
+            }
+            return html `<div subgrid mode=${subMode} part="grid">
+        <slot></slot>
+      </div> `;
+        }
+        else {
+            // Grid styling added to contained components, allowing CSS Grid
+            // to affect its own slot content.
+            return html `<div grid part="grid">
+        <slot></slot>
+      </div> `;
+        }
+    }
+};
+CDSGrid.styles = styles;
+__decorate([
+    property({ reflect: true, type: String })
+], CDSGrid.prototype, "align", void 0);
+__decorate([
+    property({ reflect: true, type: Boolean })
+], CDSGrid.prototype, "condensed", void 0);
+__decorate([
+    property({ reflect: true, type: Boolean })
+], CDSGrid.prototype, "narrow", void 0);
+__decorate([
+    property({ reflect: true, attribute: 'full-width', type: Boolean })
+], CDSGrid.prototype, "fullWidth", void 0);
+__decorate([
+    consume({ context: gridContext, subscribe: true }),
+    property({ attribute: false })
+], CDSGrid.prototype, "gridContextIn", void 0);
+__decorate([
+    provide({ context: gridContext }),
+    property({ attribute: false })
+], CDSGrid.prototype, "gridContext", void 0);
+CDSGrid = __decorate([
+    carbonElement(`${prefix}-grid`)
+], CDSGrid);
+var CDSGrid$1 = CDSGrid;
+
+export { CDSGrid$1 as default };
+//# sourceMappingURL=grid.js.map

package/es/components/grid/grid.js.map

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