@sebgroup/green-core 2.4.1 → 2.5.0-rc.20250904080437086

package/components/dialog/dialog.component.d.ts

@@ -1,5 +1,5 @@
 import { GdsElement } from '../../gds-element';
-declare const GdsDialog_base: (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").SizeXProps) & (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").SizeYProps) & typeof GdsElement;
+declare const GdsDialog_base: (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").SizeXProps) & (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").SizeYProps) & (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").PaddingProps) & typeof GdsElement;
 /**
  * @element gds-dialog
  *
@@ -34,9 +34,13 @@ export declare class GdsDialog extends GdsDialog_base {
      */
     placement: 'initial' | 'top' | 'bottom' | 'left' | 'right';
     /**
-     * The dialog's padding.
+     * Whether the inner content of the dialog should have scrollable overflow. Scroll will appear if
+     * the content exceeds the dialog's height, which can be controlled using the `height` property.
+     *
+     * This property have no effect if the `dialog` slot is used. In that case, you need to add overflow
+     * styles to the content inside the `dialog` slot.
      */
-    padding?: string;
+    scrollable: boolean;
     private _elDialog;
     private _elTriggerSlot;
     /**

package/components/dialog/dialog.component.js

@@ -7,6 +7,7 @@ import {
 } from "../../chunks/chunk.QU3DSPNU.js";
 var _returnValue, _handleNativeClose, _dispatchCloseEvent, _dispatchShowEvent, _dispatchUiStateEvent, _GdsDialog_instances, handleTriggerSlotChange_fn, _handleTriggerClick, _handleClickOutside;
 import { localized, msg } from "@lit/localize";
+import { nothing } from "lit";
 import { property, query } from "lit/decorators.js";
 import { classMap } from "lit/directives/class-map.js";
 import { ifDefined } from "lit/directives/if-defined.js";
@@ -19,6 +20,7 @@ import {
 } from "../../utils/helpers/custom-element-scoping.js";
 import { isIOS } from "../../utils/helpers/platform.js";
 import {
+  withPaddingProps,
   withSizeXProps,
   withSizeYProps
 } from "../../utils/mixins/declarative-layout-mixins.js";
@@ -34,14 +36,16 @@ import {
   unlockBodyScrolling
 } from "./scroll-lock.js";
 registerGlobalScrollLockStyles();
-let GdsDialog = class extends withSizeXProps(withSizeYProps(GdsElement)) {
+let GdsDialog = class extends withSizeXProps(
+  withSizeYProps(withPaddingProps(GdsElement))
+) {
   constructor() {
     super(...arguments);
     __privateAdd(this, _GdsDialog_instances);
     this.open = false;
     this.variant = "default";
     this.placement = "initial";
-    this.padding = "l";
+    this.scrollable = false;
     __privateAdd(this, _returnValue);
     __privateAdd(this, _handleNativeClose, (e) => {
       const dialog = e.target;
@@ -125,13 +129,10 @@ let GdsDialog = class extends withSizeXProps(withSizeYProps(GdsElement)) {
           >
             <gds-card
               class="card"
-              display="flex"
               variant="secondary"
               box-shadow="xl"
-              padding=${ifDefined(this.padding)}
               gap="l"
               border-radius="s"
-              min-height="min-content"
             >
               <slot name="dialog">
                 <gds-flex justify-content="space-between">
@@ -145,7 +146,11 @@ let GdsDialog = class extends withSizeXProps(withSizeYProps(GdsElement)) {
                     ><gds-icon-cross-small></gds-icon-cross-small
                   ></gds-button>
                 </gds-flex>
-                <gds-div id="content" flex="1">
+                <gds-div
+                  id="content"
+                  flex="1"
+                  overflow=${ifDefined(this.scrollable) ? "auto" : nothing}
+                >
                   <slot></slot>
                 </gds-div>
                 <gds-flex
@@ -210,7 +215,7 @@ handleTriggerSlotChange_fn = function() {
 _handleTriggerClick = new WeakMap();
 _handleClickOutside = new WeakMap();
 GdsDialog.styles = [DialogStyles];
-GdsDialog.styleExpressionBaseSelector = "dialog";
+GdsDialog.styleExpressionBaseSelector = ".card";
 __decorateClass([
   property({ type: Boolean, reflect: true })
 ], GdsDialog.prototype, "open", 2);
@@ -224,8 +229,8 @@ __decorateClass([
   property()
 ], GdsDialog.prototype, "placement", 2);
 __decorateClass([
-  property()
-], GdsDialog.prototype, "padding", 2);
+  property({ type: Boolean })
+], GdsDialog.prototype, "scrollable", 2);
 __decorateClass([
   query("dialog")
 ], GdsDialog.prototype, "_elDialog", 2);

package/gds-element.js

@@ -14,7 +14,7 @@ class GdsElement extends LitElement {
     /**
      * The semantic version of this element. Can be used for troubleshooting to verify the version being used.
      */
-    this.semanticVersion = "2.4.1";
+    this.semanticVersion = "2.5.0-rc.20250904080437086";
     this._isUsingTransitionalStyles = false;
     this._dynamicStylesController = new DynamicStylesController(this);
   }

package/generated/react/dialog/index.d.ts

@@ -5,7 +5,7 @@ export declare const GdsDialog: (props: React.ComponentProps<ReturnType<typeof g
     heading?: string | undefined;
     variant?: "default" | "slide-out" | undefined;
     placement?: "top" | "right" | "bottom" | "left" | "initial" | undefined;
-    padding?: string | undefined;
+    scrollable?: boolean | undefined;
     show?: ((reason?: string) => void) | undefined;
     close?: ((reason: string) => void) | undefined;
     disconnectedCallback?: (() => void) | undefined;
@@ -22,6 +22,9 @@ export declare const GdsDialog: (props: React.ComponentProps<ReturnType<typeof g
     'block-size'?: string | undefined;
     'min-block-size'?: string | undefined;
     'max-block-size'?: string | undefined;
+    padding?: string | undefined;
+    'padding-inline'?: string | undefined;
+    'padding-block'?: string | undefined;
     readonly semanticVersion?: "__GDS_SEM_VER__" | undefined;
     gdsElementName?: string | undefined;
     _isUsingTransitionalStyles?: boolean | undefined;

package/generated/react/index.d.ts

@@ -41,14 +41,19 @@ export * from './theme/index.js';
 export * from './video/index.js';
 export * from './form-control-footer/index.js';
 export * from './form-control-header/index.js';
-export * from './menu-item/index.js';
 export * from './option/index.js';
+export * from './menu-item/index.js';
 export * from './checkbox-group/index.js';
 export * from './icons/icon-details/index.js';
 export * from './filter-chip/index.js';
 export * from './formatted-account/index.js';
 export * from './formatted-date/index.js';
 export * from './formatted-number/index.js';
+export * from './radio-group/index.js';
+export * from './segment/index.js';
+export * from './sensitive-account/index.js';
+export * from './sensitive-number/index.js';
+export * from './sensitive-date/index.js';
 export * from './icons/icon-ai/index.js';
 export * from './icons/icon-airplane-up/index.js';
 export * from './icons/icon-archive/index.js';
@@ -374,8 +379,3 @@ export * from './icons/icon-youtube/index.js';
 export * from './icons/icon-zap/index.js';
 export * from './icons/icon-zoom-in/index.js';
 export * from './icons/icon-zoom-out/index.js';
-export * from './radio-group/index.js';
-export * from './segment/index.js';
-export * from './sensitive-account/index.js';
-export * from './sensitive-date/index.js';
-export * from './sensitive-number/index.js';

package/generated/react/index.js

@@ -41,14 +41,19 @@ export * from "./theme/index.js";
 export * from "./video/index.js";
 export * from "./form-control-footer/index.js";
 export * from "./form-control-header/index.js";
-export * from "./menu-item/index.js";
 export * from "./option/index.js";
+export * from "./menu-item/index.js";
 export * from "./checkbox-group/index.js";
 export * from "./icons/icon-details/index.js";
 export * from "./filter-chip/index.js";
 export * from "./formatted-account/index.js";
 export * from "./formatted-date/index.js";
 export * from "./formatted-number/index.js";
+export * from "./radio-group/index.js";
+export * from "./segment/index.js";
+export * from "./sensitive-account/index.js";
+export * from "./sensitive-number/index.js";
+export * from "./sensitive-date/index.js";
 export * from "./icons/icon-ai/index.js";
 export * from "./icons/icon-airplane-up/index.js";
 export * from "./icons/icon-archive/index.js";
@@ -374,8 +379,3 @@ export * from "./icons/icon-youtube/index.js";
 export * from "./icons/icon-zap/index.js";
 export * from "./icons/icon-zoom-in/index.js";
 export * from "./icons/icon-zoom-out/index.js";
-export * from "./radio-group/index.js";
-export * from "./segment/index.js";
-export * from "./sensitive-account/index.js";
-export * from "./sensitive-date/index.js";
-export * from "./sensitive-number/index.js";

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sebgroup/green-core",
   "description": "A carefully crafted set of Web Components, laying the foundation of the Green Design System.",
-  "version": "2.4.1",
+  "version": "2.5.0-rc.20250904080437086",
   "main": "index.js",
   "module": "index.js",
   "type": "module",

package/utils/helpers/custom-element-scoping.js

@@ -1,6 +1,6 @@
 import "../../chunks/chunk.QU3DSPNU.js";
 import { html as litHtml } from "lit";
-const VER_SUFFIX = "-f0000c";
+const VER_SUFFIX = "-d507c0";
 class ScopedElementRegistry {
   static get instance() {
     if (!globalThis.__gdsElementLookupTable?.[VER_SUFFIX])