@sebgroup/green-core 1.69.3 → 1.70.0

package/chunks/chunk.QTSIPXV3.js

@@ -0,0 +1,41 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp(target, key, result);
+  return result;
+};
+var __accessCheck = (obj, member, msg) => {
+  if (!member.has(obj))
+    throw TypeError("Cannot " + msg);
+};
+var __privateGet = (obj, member, getter) => {
+  __accessCheck(obj, member, "read from private field");
+  return getter ? getter.call(obj) : member.get(obj);
+};
+var __privateAdd = (obj, member, value) => {
+  if (member.has(obj))
+    throw TypeError("Cannot add the same private member more than once");
+  member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+};
+var __privateSet = (obj, member, value, setter) => {
+  __accessCheck(obj, member, "write to private field");
+  setter ? setter.call(obj, value) : member.set(obj, value);
+  return value;
+};
+var __privateMethod = (obj, member, method) => {
+  __accessCheck(obj, member, "access private method");
+  return method;
+};
+
+export {
+  __decorateClass,
+  __privateGet,
+  __privateAdd,
+  __privateSet,
+  __privateMethod
+};

package/components/badge/badge.component.d.ts

@@ -0,0 +1,49 @@
+import { GdsElement } from '../../gds-element';
+declare const GdsBadge_base: (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").SizeXProps) & (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").MarginProps) & (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").LayoutChildProps) & typeof GdsElement;
+/**
+ * `gds-badge`
+ *
+ * @element gds-badge
+ * @status beta
+ *
+ */
+export declare class GdsBadge extends GdsBadge_base {
+    #private;
+    static styles: (import("lit").CSSResult | import("lit").CSSResult[])[];
+    /**
+     * Controls the variant of the badge.
+     * Supports all valid variants like information, notice, positive, warning, negative.
+     * @property variant
+     */
+    variant: string;
+    /**
+     * Defines the size of the badge.
+     * The default value is `default`.
+     *
+     * @property {string} size - The size of the badge, which can be either 'default' or 'small'.
+     */
+    size: 'default' | 'small';
+    /**
+     * Indicates whether the badge is disabled.
+     * When set to `true`, the badge will appear in a disabled state and will not be interactive.
+     *
+     * @property {boolean} disabled - Controls the disabled state of the badge.
+     */
+    disabled: boolean;
+    /**
+     * Indicates whether the badge is in notification mode.
+     * When set to `true`, the badge will act as a notification badge with only two variants: `positive` or `negative`.
+     *
+     * @property {boolean} notification - Controls the notification mode of the badge.
+     */
+    notification: boolean;
+    /**
+     * Indicates whether the badge is rounded.
+     *
+     * @property {boolean} rounded - Controls the border radius of the badge.
+     */
+    rounded: boolean;
+    mainSlotOccupied: boolean;
+    render(): any;
+}
+export {};

package/components/badge/badge.component.js

@@ -0,0 +1,118 @@
+import {
+  __decorateClass,
+  __privateAdd,
+  __privateMethod
+} from "../../chunks/chunk.QTSIPXV3.js";
+var _renderLeadSlot, renderLeadSlot_fn, _renderMainSlot, renderMainSlot_fn, _handleSlotChange, handleSlotChange_fn, _renderTrailSlot, renderTrailSlot_fn;
+import { property, state } from "lit/decorators.js";
+import { GdsElement } from "../../gds-element";
+import { html } from "../../scoping";
+import { tokens } from "../../tokens.style";
+import { gdsCustomElement } from "../../utils/helpers/custom-element-scoping";
+import {
+  withLayoutChildProps,
+  withMarginProps,
+  withSizeXProps
+} from "../../utils/mixins/declarative-layout-mixins";
+import { GdsFlex } from "../flex/flex.component";
+import BadgeCSS from "./badge.style";
+let GdsBadge = class extends withSizeXProps(
+  withMarginProps(withLayoutChildProps(GdsElement))
+) {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _renderLeadSlot);
+    __privateAdd(this, _renderMainSlot);
+    __privateAdd(this, _handleSlotChange);
+    __privateAdd(this, _renderTrailSlot);
+    this.variant = "information";
+    this.size = "default";
+    this.disabled = false;
+    this.notification = false;
+    this.rounded = false;
+    this.mainSlotOccupied = false;
+  }
+  render() {
+    const background = this.disabled ? "disabled" : this.notification ? this.variant : this.variant + "-badge";
+    const color = this.disabled ? "disabled" : this.notification ? "primary" : this.variant;
+    const padding = this.size === "small" || this.notification ? "2xs" : "xs";
+    const blockSize = this.mainSlotOccupied ? this.size === "small" || this.notification ? "m" : "l" : "xs";
+    return html`<gds-flex
+      level="3"
+      background=${background}
+      color=${color}
+      gap="${this.notification ? "" : "2xs"}"
+      align-items="center"
+      justify-content="flex-start"
+      padding-inline="${padding}"
+      border-radius="${this.notification || this.rounded ? "max" : "2xs"}"
+      block-size="${blockSize}"
+      width="100%"
+      font-size="${this.size === "small" || this.notification ? "detail-xs" : "detail-s"}"
+      pointer-events=${this.disabled ? "none" : "auto"}
+      user-select="${this.disabled ? "none" : "auto"}"
+    >
+      ${__privateMethod(this, _renderLeadSlot, renderLeadSlot_fn).call(this)} ${__privateMethod(this, _renderMainSlot, renderMainSlot_fn).call(this)}
+      ${__privateMethod(this, _renderTrailSlot, renderTrailSlot_fn).call(this)}
+    </gds-flex>`;
+  }
+};
+_renderLeadSlot = new WeakSet();
+renderLeadSlot_fn = function() {
+  if (this.size !== "small" || !this.notification) {
+    return html`<slot name="lead"></slot>`;
+  }
+};
+_renderMainSlot = new WeakSet();
+renderMainSlot_fn = function() {
+  return html`<slot @slotchange=${__privateMethod(this, _handleSlotChange, handleSlotChange_fn)}></slot>`;
+};
+_handleSlotChange = new WeakSet();
+handleSlotChange_fn = function(event) {
+  const slot = event.target;
+  const assignedNodes = slot.assignedNodes({ flatten: true });
+  this.mainSlotOccupied = assignedNodes.length > 0 && assignedNodes.some(
+    (node) => node.nodeType === Node.ELEMENT_NODE || node.nodeType === Node.TEXT_NODE && node.textContent?.trim() !== ""
+  );
+};
+_renderTrailSlot = new WeakSet();
+renderTrailSlot_fn = function() {
+  return html`<slot name="trail"></slot>`;
+};
+GdsBadge.styles = [tokens, BadgeCSS];
+__decorateClass([
+  property()
+], GdsBadge.prototype, "variant", 2);
+__decorateClass([
+  property({ type: String })
+], GdsBadge.prototype, "size", 2);
+__decorateClass([
+  property({
+    attribute: "disabled",
+    type: Boolean,
+    reflect: true
+  })
+], GdsBadge.prototype, "disabled", 2);
+__decorateClass([
+  property({
+    attribute: "notification",
+    type: Boolean,
+    reflect: true
+  })
+], GdsBadge.prototype, "notification", 2);
+__decorateClass([
+  property({
+    attribute: "rounded",
+    type: Boolean,
+    reflect: true
+  })
+], GdsBadge.prototype, "rounded", 2);
+__decorateClass([
+  state()
+], GdsBadge.prototype, "mainSlotOccupied", 2);
+GdsBadge = __decorateClass([
+  gdsCustomElement("gds-badge", { dependsOn: [GdsFlex] })
+], GdsBadge);
+export {
+  GdsBadge
+};

package/components/badge/badge.d.ts

@@ -1,51 +1,2 @@
-import { GdsElement } from '../../gds-element';
-import '../flex';
-declare const GdsBadge_base: (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").SizeXProps) & (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").MarginProps) & (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").LayoutChildProps) & typeof GdsElement;
-/**
- * `gds-badge`
- *
- * @element gds-badge
- * @status beta
- *
- */
-export declare class GdsBadge extends GdsBadge_base {
-    #private;
-    static styles: (import("lit").CSSResult | import("lit").CSSResult[])[];
-    /**
-     * Controls the variant of the badge.
-     * Supports all valid variants like information, notice, positive, warning, negative.
-     * @property variant
-     */
-    variant: string;
-    /**
-     * Defines the size of the badge.
-     * The default value is `default`.
-     *
-     * @property {string} size - The size of the badge, which can be either 'default' or 'small'.
-     */
-    size: 'default' | 'small';
-    /**
-     * Indicates whether the badge is disabled.
-     * When set to `true`, the badge will appear in a disabled state and will not be interactive.
-     *
-     * @property {boolean} disabled - Controls the disabled state of the badge.
-     */
-    disabled: boolean;
-    /**
-     * Indicates whether the badge is in notification mode.
-     * When set to `true`, the badge will act as a notification badge with only two variants: `positive` or `negative`.
-     *
-     * @property {boolean} notification - Controls the notification mode of the badge.
-     */
-    notification: boolean;
-    /**
-     * Indicates whether the badge is rounded.
-     *
-     * @property {boolean} rounded - Controls the border radius of the badge.
-     */
-    rounded: boolean;
-    mainSlotOccupied: boolean;
-    constructor();
-    render(): any;
-}
-export {};
+import { GdsBadge } from './badge.component';
+export { GdsBadge };

package/components/badge/badge.figma.js

@@ -1,4 +1,3 @@
-// libs/core/src/components/badge/badge.figma.ts
 import figma, { html } from "@figma/code-connect/html";
 figma.connect(
   "https://www.figma.com/design/56EvebfAdgA7JaDIldZAFK/Green-Design-System?node-id=4780-6005&t=GoP2Nr9edEG4JocW-4",

package/components/badge/badge.js

@@ -1,20 +1,6 @@
-import {
-  GdsBadge
-} from "../../chunks/chunk.PQWJXNCE.js";
-import "../../chunks/chunk.3M4XRCEF.js";
-import "../../chunks/chunk.J4LECY2Q.js";
-import "../../chunks/chunk.M5C2HLKD.js";
-import "../../chunks/chunk.5DQKVTJK.js";
-import "../../chunks/chunk.TWXTKG4B.js";
-import "../../chunks/chunk.76QWARGM.js";
-import "../../chunks/chunk.NUUST5OZ.js";
-import "../../chunks/chunk.ESN5KBOJ.js";
-import "../../chunks/chunk.6QMJ7GQK.js";
-import "../../chunks/chunk.YO24ZYAD.js";
-import "../../chunks/chunk.TMEWQZER.js";
-import "../../chunks/chunk.QK3R23GV.js";
-import "../../chunks/chunk.B7ZOSVCQ.js";
-import "../../chunks/chunk.SEHSDSX2.js";
+import "../../chunks/chunk.QTSIPXV3.js";
+import { GdsBadge } from "./badge.component";
+GdsBadge.define();
 export {
   GdsBadge
 };

package/components/badge/badge.style.js

@@ -0,0 +1,23 @@
+import "../../chunks/chunk.QTSIPXV3.js";
+import { css } from "lit";
+const style = css`
+  :host {
+    display: inline-block;
+  }
+
+  slot[name='lead']::slotted(*) {
+    line-height: var(--gds-space-m);
+  }
+
+  :host([notification]) slot[name='trail']::slotted(*) {
+    line-height: var(--gds-space-s);
+  }
+
+  :host([notification]) slot[name='lead']::slotted(*) {
+    line-height: var(--gds-space-s);
+  }
+`;
+var badge_style_default = style;
+export {
+  badge_style_default as default
+};

package/components/badge/index.js

@@ -1,21 +1 @@
-import "../../chunks/chunk.CK2UGCPG.js";
-import {
-  GdsBadge
-} from "../../chunks/chunk.PQWJXNCE.js";
-import "../../chunks/chunk.3M4XRCEF.js";
-import "../../chunks/chunk.J4LECY2Q.js";
-import "../../chunks/chunk.M5C2HLKD.js";
-import "../../chunks/chunk.5DQKVTJK.js";
-import "../../chunks/chunk.TWXTKG4B.js";
-import "../../chunks/chunk.76QWARGM.js";
-import "../../chunks/chunk.NUUST5OZ.js";
-import "../../chunks/chunk.ESN5KBOJ.js";
-import "../../chunks/chunk.6QMJ7GQK.js";
-import "../../chunks/chunk.YO24ZYAD.js";
-import "../../chunks/chunk.TMEWQZER.js";
-import "../../chunks/chunk.QK3R23GV.js";
-import "../../chunks/chunk.B7ZOSVCQ.js";
-import "../../chunks/chunk.SEHSDSX2.js";
-export {
-  GdsBadge
-};
+export * from "./badge";

package/components/button/button.component.d.ts

@@ -0,0 +1,70 @@
+import { GdsFormControlElement } from '../form/form-control';
+declare class Button extends GdsFormControlElement<any> {
+    #private;
+    static styles: (import("lit").CSSResult | import("lit").CSSResult[])[];
+    /**
+     * @internal
+     */
+    static shadowRootOptions: ShadowRootInit;
+    /**
+     * Whether the button is disabled.
+     */
+    disabled: boolean;
+    /**
+     * The type of the button.
+     */
+    type?: HTMLButtonElement['type'];
+    /**
+     * The rank of the button. Defaults to "primary".
+     */
+    rank: 'primary' | 'secondary' | 'tertiary';
+    /**
+     * Defines which variant the button belongs to. Defaults to "neutral".
+     */
+    variant: 'neutral' | 'positive' | 'negative';
+    /**
+     * Sets the size of the button. Defaults to "small".
+     */
+    size: 'xs' | 'small' | 'medium' | 'large';
+    /**
+     * The label of the button. Use this to add an accessible label to the button when no text is provided in the default slot.
+     */
+    label: string;
+    /**
+     * When set, the underlying button will be rendered as an anchor element.
+     */
+    href: string;
+    /**
+     * Where to display the linked URL. Only used when href is present.
+     */
+    target?: '_self' | '_blank' | '_parent' | '_top';
+    /**
+     * The relationship of the linked URL as space-separated link types. Only used when href is present. Defaults to "noreferrer noopener" for security reasons when target is set.
+     */
+    rel?: string;
+    /**
+     * Causes the browser to treat the linked URL as a download. Can be used with or without a filename value. Only used when href is present.
+     */
+    download?: string;
+    private _mainSlot?;
+    private _button?;
+    connectedCallback(): void;
+    render(): import("lit-html").TemplateResult;
+    protected _getValidityAnchor(): HTMLElement;
+    private _attributeChanged;
+}
+declare const GdsButton_base: (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").SizeXProps) & (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").MarginProps) & (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").LayoutChildProps) & typeof Button;
+/**
+ * @element gds-button
+ * @summary A custom button element that can display a label, lead and trail icons, and a ripple effect on click.
+ * @status stable
+ *
+ * @slot - Content to be displayed as the button label.
+ * @slot lead - An optional slot that allows a `gds-icon-[ICON_NAME]` element to be placed before the label.
+ * @slot trail - An optional slot that allows a `gds-icon-[ICON_NAME]` element to be placed after the label.
+ *
+ * @event click - Fired when the button is clicked.
+ */
+export declare class GdsButton extends GdsButton_base {
+}
+export {};

package/components/button/button.component.js

@@ -0,0 +1,192 @@
+import {
+  __decorateClass,
+  __privateAdd,
+  __privateGet,
+  __privateSet
+} from "../../chunks/chunk.QTSIPXV3.js";
+var _isIconButton, _isLink, isLink_get, _defaultRel, defaultRel_get, _mainSlotChange, _handleClick;
+import { nothing, unsafeCSS } 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";
+import { when } from "lit/directives/when.js";
+import { literal, html as staticHtml } from "lit/static-html.js";
+import { GdsRipple } from "../../primitives/ripple/ripple.component";
+import { html as customElementHtml, gdsCustomElement } from "../../scoping";
+import { tokens } from "../../tokens.style";
+import { TransitionalStyles } from "../../transitional-styles";
+import { observeLightDOM } from "../../utils/decorators";
+import { forwardAttributes } from "../../utils/directives";
+import { stripWhitespace } from "../../utils/helpers/strip-white-space";
+import {
+  withLayoutChildProps,
+  withMarginProps,
+  withSizeXProps
+} from "../../utils/mixins/declarative-layout-mixins";
+import { GdsFormControlElement } from "../form/form-control";
+import style from "./button.style.css.js";
+const ariaForwards = ["aria-label", "aria-haspopup", "aria-expanded"];
+const html = stripWhitespace(customElementHtml);
+class Button extends GdsFormControlElement {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _isLink);
+    __privateAdd(this, _defaultRel);
+    this.disabled = false;
+    this.rank = "primary";
+    this.variant = "neutral";
+    this.size = "medium";
+    this.label = "";
+    this.href = "";
+    __privateAdd(this, _isIconButton, false);
+    // Check if the button is an icon button.
+    __privateAdd(this, _mainSlotChange, () => {
+      const assignedElements = this._mainSlot?.assignedElements() ?? [];
+      __privateSet(this, _isIconButton, assignedElements.length === 1 && assignedElements.some(
+        (element) => element.tagName.toLowerCase().startsWith("gds-icon")
+      ));
+      this.requestUpdate();
+    });
+    __privateAdd(this, _handleClick, (e) => {
+      this.dispatchEvent(
+        new CustomEvent("gds-click", {
+          bubbles: true,
+          composed: true,
+          detail: e
+        })
+      );
+      if (this.form && !__privateGet(this, _isLink, isLink_get)) {
+        if (this.type === "submit") {
+          this.form.requestSubmit();
+        } else if (this.type === "reset") {
+          this.form.reset();
+        }
+      }
+    });
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.setAttribute("role", "none");
+    TransitionalStyles.instance.apply(this, "gds-button");
+  }
+  render() {
+    const buttonClasses = {
+      button: true,
+      circle: __privateGet(this, _isIconButton),
+      icon: __privateGet(this, _isIconButton),
+      xs: this.size === "xs",
+      small: this.size === "small",
+      large: this.size === "large",
+      positive: this.variant === "positive",
+      negative: this.variant === "negative",
+      primary: this.rank === "primary",
+      secondary: this.rank === "secondary",
+      tertiary: this.rank === "tertiary"
+    };
+    const tag = __privateGet(this, _isLink, isLink_get) ? literal`a` : literal`button`;
+    return staticHtml`
+      <${tag}
+        class=${classMap(buttonClasses)}
+        type="${ifDefined(__privateGet(this, _isLink, isLink_get) ? void 0 : this.type)}"
+        ?disabled="${this.disabled}"
+        aria-label=${this.label || nothing}
+        href=${ifDefined(__privateGet(this, _isLink, isLink_get) ? this.href : void 0)}
+        target=${ifDefined(__privateGet(this, _isLink, isLink_get) ? this.target : void 0)}
+        rel=${ifDefined(__privateGet(this, _isLink, isLink_get) ? this.rel || __privateGet(this, _defaultRel, defaultRel_get) : void 0)}
+        download=${ifDefined(__privateGet(this, _isLink, isLink_get) ? this.download : void 0)}
+        part="_button"
+        @click="${__privateGet(this, _handleClick)}"
+        ${forwardAttributes(
+      (attr) => attr.name.startsWith("gds-aria") || attr.name === "gds-role" || ariaForwards.includes(attr.name)
+    )}
+      >
+        <slot name="lead"></slot>
+        <slot @slotchange=${__privateGet(this, _mainSlotChange)}></slot>
+        <slot name="trail"></slot>
+        ${when(
+      !this._isUsingTransitionalStyles,
+      () => html`<gds-ripple part="_ripple"></gds-ripple>`
+    )}
+        </${tag}>
+        `;
+  }
+  _getValidityAnchor() {
+    return this._button;
+  }
+  _attributeChanged() {
+    this.requestUpdate();
+  }
+}
+_isIconButton = new WeakMap();
+_isLink = new WeakSet();
+isLink_get = function() {
+  return this.href.length > 0;
+};
+_defaultRel = new WeakSet();
+defaultRel_get = function() {
+  return this.target === "_blank" ? "noreferrer noopener" : void 0;
+};
+_mainSlotChange = new WeakMap();
+_handleClick = new WeakMap();
+Button.styles = [tokens, unsafeCSS(style)];
+/**
+ * @internal
+ */
+Button.shadowRootOptions = {
+  mode: "open",
+  delegatesFocus: true
+};
+__decorateClass([
+  property({ type: Boolean, reflect: true })
+], Button.prototype, "disabled", 2);
+__decorateClass([
+  property({ reflect: true })
+], Button.prototype, "type", 2);
+__decorateClass([
+  property({ reflect: true })
+], Button.prototype, "rank", 2);
+__decorateClass([
+  property({ reflect: true })
+], Button.prototype, "variant", 2);
+__decorateClass([
+  property({ reflect: true })
+], Button.prototype, "size", 2);
+__decorateClass([
+  property()
+], Button.prototype, "label", 2);
+__decorateClass([
+  property()
+], Button.prototype, "href", 2);
+__decorateClass([
+  property()
+], Button.prototype, "target", 2);
+__decorateClass([
+  property()
+], Button.prototype, "rel", 2);
+__decorateClass([
+  property()
+], Button.prototype, "download", 2);
+__decorateClass([
+  query("slot:not([name])")
+], Button.prototype, "_mainSlot", 2);
+__decorateClass([
+  query(".button")
+], Button.prototype, "_button", 2);
+__decorateClass([
+  observeLightDOM({
+    attributes: true,
+    childList: false,
+    subtree: false,
+    characterData: false
+  })
+], Button.prototype, "_attributeChanged", 1);
+let GdsButton = class extends withSizeXProps(
+  withMarginProps(withLayoutChildProps(Button))
+) {
+};
+GdsButton = __decorateClass([
+  gdsCustomElement("gds-button", { dependsOn: [GdsRipple] })
+], GdsButton);
+export {
+  GdsButton
+};

package/components/button/button.d.ts

@@ -1,72 +1,2 @@
-import { GdsFormControlElement } from '../form/form-control';
-import '../../primitives/ripple';
-declare class Button extends GdsFormControlElement<any> {
-    #private;
-    static styles: (import("lit").CSSResult | import("lit").CSSResult[])[];
-    /**
-     * @internal
-     */
-    static shadowRootOptions: ShadowRootInit;
-    /**
-     * Whether the button is disabled.
-     */
-    disabled: boolean;
-    /**
-     * The type of the button.
-     */
-    type?: HTMLButtonElement['type'];
-    /**
-     * The rank of the button. Defaults to "primary".
-     */
-    rank: 'primary' | 'secondary' | 'tertiary';
-    /**
-     * Defines which variant the button belongs to. Defaults to "neutral".
-     */
-    variant: 'neutral' | 'positive' | 'negative';
-    /**
-     * Sets the size of the button. Defaults to "small".
-     */
-    size: 'xs' | 'small' | 'medium' | 'large';
-    /**
-     * The label of the button. Use this to add an accessible label to the button when no text is provided in the default slot.
-     */
-    label: string;
-    /**
-     * When set, the underlying button will be rendered as an anchor element.
-     */
-    href: string;
-    /**
-     * Where to display the linked URL. Only used when href is present.
-     */
-    target?: '_self' | '_blank' | '_parent' | '_top';
-    /**
-     * The relationship of the linked URL as space-separated link types. Only used when href is present. Defaults to "noreferrer noopener" for security reasons when target is set.
-     */
-    rel?: string;
-    /**
-     * Causes the browser to treat the linked URL as a download. Can be used with or without a filename value. Only used when href is present.
-     */
-    download?: string;
-    private _mainSlot?;
-    private _button?;
-    constructor();
-    connectedCallback(): void;
-    render(): import("lit-html").TemplateResult;
-    protected _getValidityAnchor(): HTMLElement;
-    private _attributeChanged;
-}
-declare const GdsButton_base: (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").SizeXProps) & (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").MarginProps) & (new (...args: any[]) => import("../../utils/mixins/declarative-layout-mixins").LayoutChildProps) & typeof Button;
-/**
- * @element gds-button
- * @summary A custom button element that can display a label, lead and trail icons, and a ripple effect on click.
- * @status stable
- *
- * @slot - Content to be displayed as the button label.
- * @slot lead - An optional slot that allows a `gds-icon-[ICON_NAME]` element to be placed before the label.
- * @slot trail - An optional slot that allows a `gds-icon-[ICON_NAME]` element to be placed after the label.
- *
- * @event click - Fired when the button is clicked.
- */
-export declare class GdsButton extends GdsButton_base {
-}
-export {};
+import { GdsButton } from './button.component';
+export { GdsButton };