@govtechsg/sgds-web-component 1.2.0 → 1.2.2

package/components/Button/sgds-button.cjs.js

@@ -106,7 +106,7 @@ class SgdsButton extends sgdsElement["default"] {
         @focus=${this.handleFocus}
         @blur=${this.handleBlur}
       >
-        <slot class="d-flex align-items-center gap-2"></slot>
+      <slot></slot>
       </${tag}>
     `;
     }

package/components/Button/sgds-button.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-button.cjs.js","sources":["../../../src/components/Button/sgds-button.ts"],"sourcesContent":["import { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { html, literal } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport styles from \"./sgds-button.scss\";\n\nexport type ButtonVariant =\n  | \"primary\"\n  | \"secondary\"\n  | \"success\"\n  | \"danger\"\n  | \"warning\"\n  | \"info\"\n  | \"light\"\n  | \"dark\"\n  | \"link\"\n  | \"outline-primary\"\n  | \"outline-secondary\"\n  | \"outline-success\"\n  | \"outline-danger\"\n  | \"outline-warning\"\n  | \"outline-info\"\n  | \"outline-light\"\n  | \"outline-dark\";\n\n/**\n * @summary Custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.\n *\n * @slot default - The button's label.\n *\n * @event sgds-blur - Emitted when the button is not focused.\n * @event sgds-focus - Emitted when the button is focused.\n */\nexport class SgdsButton extends SgdsElement {\n  static styles = [SgdsElement.styles, styles];\n\n  @query(\".btn\") private button: HTMLButtonElement | HTMLLinkElement;\n\n  /** @internal */\n  private readonly formSubmitController = new FormSubmitController(this, {\n    form: (input: HTMLInputElement) => {\n      // Buttons support a form attribute that points to an arbitrary form, so if this attribute it set we need to query\n      // the form from the same root using its id\n      if (input.hasAttribute(\"form\")) {\n        const doc = input.getRootNode() as Document | ShadowRoot;\n        const formId = input.getAttribute(\"form\");\n        return doc.getElementById(formId) as HTMLFormElement;\n      }\n\n      // Fall back to the closest containing form\n      return input.closest(\"form\");\n    }\n  });\n\n  /** One or more button variant combinations buttons may be one of a variety of visual variants such as: `primary`, `secondary`, `success`, `danger`, `warning`, `info`, `dark`, `light`, `link` as well as \"outline\" versions (prefixed by `outline-*`) */\n  @property({ reflect: true }) variant: ButtonVariant = \"primary\";\n\n  /** Optional for button. Can be used to insert any utility classes such as me-auto **/\n  @property({ reflect: true }) buttonClasses: string;\n\n  /** Specifies a large or small button */\n  @property({ reflect: true }) size: \"sm\" | \"lg\";\n\n  /** Manually set the visual state of the button to `:active` */\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  /** The disabled state of the button */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** The behavior of the button with default as `type='button', `reset` resets all the controls to their initial values and `submit` submits the form data to the server */\n  @property() type: \"button\" | \"submit\" | \"reset\" = \"button\";\n\n  /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */\n  @property() href: string;\n\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @property() target: \"_blank\" | \"_parent\" | \"_self\" | \"_top\";\n\n  /** Tells the browser to download the linked file as this filename. Only used when `href` is set. */\n  @property({ reflect: true }) download: string;\n\n  /**\n   * The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\n   * value of this attribute must be an id of a form in the same document or shadow root as the button.\n   */\n  @property() form: string;\n\n  /** Used to override the form owner's `action` attribute. */\n  @property({ attribute: \"formaction\" }) formAction: string;\n\n  /** Used to override the form owner's `method` attribute.  */\n  @property({ attribute: \"formmethod\" }) formMethod: \"post\" | \"get\";\n\n  /** Used to override the form owner's `novalidate` attribute. */\n  @property({ attribute: \"formnovalidate\", type: Boolean })\n  formNoValidate: boolean;\n\n  /** Used to override the form owner's `target` attribute. */\n  @property({ attribute: \"formtarget\" }) formTarget: \"_self\" | \"_blank\" | \"_parent\" | \"_top\" | string;\n\n  /** Sets focus on the button. */\n  public focus(options?: FocusOptions) {\n    this.button.focus(options);\n  }\n\n  /** Simulates a click on the button. */\n  public click() {\n    this.button.click();\n  }\n\n  /** Removes focus from the button. */\n  public blur() {\n    this.button.blur();\n  }\n\n  handleBlur() {\n    this.emit(\"sgds-blur\");\n  }\n\n  handleFocus() {\n    this.emit(\"sgds-focus\");\n  }\n\n  handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    this.removeEventListener(\"click\", this.clickHandler);\n    this.addEventListener(\"click\", this.clickHandler);\n  }\n\n  /** @internal */\n  clickHandler = () => {\n    if (this.type === \"submit\") {\n      this.formSubmitController.submit(this);\n    }\n    if (this.type === \"reset\") {\n      this.formSubmitController.reset(this);\n    }\n  };\n\n  render() {\n    const isLink = this.href;\n    const tag = isLink ? literal`a` : literal`button`;\n    return html`\n      <${tag}\n        class=\"sgds btn ${classMap({\n          disabled: isLink && this.disabled,\n          active: this.active,\n          [`btn-${this.variant}`]: this.variant,\n          [`btn-${this.size}`]: this.size,\n          [`${this.buttonClasses}`]: this.buttonClasses\n        })}\"\n        ?disabled=${ifDefined(isLink ? undefined : this.disabled)}\n        type=${ifDefined(isLink ? undefined : this.type)}\n        href=${ifDefined(isLink ? this.href : undefined)}\n        target=${ifDefined(isLink ? this.target : undefined)}\n        download=${ifDefined(isLink ? this.download : undefined)}\n        rel=${ifDefined(isLink && this.target === \"_blank\" ? \"noreferrer noopener\" : undefined)}\n        role=${ifDefined(isLink ? \"button\" : undefined)}\n        aria-disabled=${this.disabled ? \"true\" : \"false\"}\n        tabindex=${this.disabled ? \"-1\" : \"0\"}\n        @click=${this.handleClick}\n        @focus=${this.handleFocus}\n        @blur=${this.handleBlur}\n      >\n        <slot class=\"d-flex align-items-center gap-2\"></slot>\n      </${tag}>\n    `;\n  }\n}\n\nexport default SgdsButton;\n"],"names":["SgdsElement","FormSubmitController","literal","html","classMap","ifDefined","styles","__decorate","query","property"],"mappings":"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"}
+{"version":3,"file":"sgds-button.cjs.js","sources":["../../../src/components/Button/sgds-button.ts"],"sourcesContent":["import { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { html, literal } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport styles from \"./sgds-button.scss\";\n\nexport type ButtonVariant =\n  | \"primary\"\n  | \"secondary\"\n  | \"success\"\n  | \"danger\"\n  | \"warning\"\n  | \"info\"\n  | \"light\"\n  | \"dark\"\n  | \"link\"\n  | \"outline-primary\"\n  | \"outline-secondary\"\n  | \"outline-success\"\n  | \"outline-danger\"\n  | \"outline-warning\"\n  | \"outline-info\"\n  | \"outline-light\"\n  | \"outline-dark\";\n\n/**\n * @summary Custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.\n *\n * @slot default - The button's label.\n *\n * @event sgds-blur - Emitted when the button is not focused.\n * @event sgds-focus - Emitted when the button is focused.\n */\nexport class SgdsButton extends SgdsElement {\n  static styles = [SgdsElement.styles, styles];\n\n  @query(\".btn\") private button: HTMLButtonElement | HTMLLinkElement;\n\n  /** @internal */\n  private readonly formSubmitController = new FormSubmitController(this, {\n    form: (input: HTMLInputElement) => {\n      // Buttons support a form attribute that points to an arbitrary form, so if this attribute it set we need to query\n      // the form from the same root using its id\n      if (input.hasAttribute(\"form\")) {\n        const doc = input.getRootNode() as Document | ShadowRoot;\n        const formId = input.getAttribute(\"form\");\n        return doc.getElementById(formId) as HTMLFormElement;\n      }\n\n      // Fall back to the closest containing form\n      return input.closest(\"form\");\n    }\n  });\n\n  /** One or more button variant combinations buttons may be one of a variety of visual variants such as: `primary`, `secondary`, `success`, `danger`, `warning`, `info`, `dark`, `light`, `link` as well as \"outline\" versions (prefixed by `outline-*`) */\n  @property({ reflect: true }) variant: ButtonVariant = \"primary\";\n\n  /** Optional for button. Can be used to insert any utility classes such as me-auto **/\n  @property({ reflect: true }) buttonClasses: string;\n\n  /** Specifies a large or small button */\n  @property({ reflect: true }) size: \"sm\" | \"lg\";\n\n  /** Manually set the visual state of the button to `:active` */\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  /** The disabled state of the button */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** The behavior of the button with default as `type='button', `reset` resets all the controls to their initial values and `submit` submits the form data to the server */\n  @property() type: \"button\" | \"submit\" | \"reset\" = \"button\";\n\n  /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */\n  @property() href: string;\n\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @property() target: \"_blank\" | \"_parent\" | \"_self\" | \"_top\";\n\n  /** Tells the browser to download the linked file as this filename. Only used when `href` is set. */\n  @property({ reflect: true }) download: string;\n\n  /**\n   * The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\n   * value of this attribute must be an id of a form in the same document or shadow root as the button.\n   */\n  @property() form: string;\n\n  /** Used to override the form owner's `action` attribute. */\n  @property({ attribute: \"formaction\" }) formAction: string;\n\n  /** Used to override the form owner's `method` attribute.  */\n  @property({ attribute: \"formmethod\" }) formMethod: \"post\" | \"get\";\n\n  /** Used to override the form owner's `novalidate` attribute. */\n  @property({ attribute: \"formnovalidate\", type: Boolean })\n  formNoValidate: boolean;\n\n  /** Used to override the form owner's `target` attribute. */\n  @property({ attribute: \"formtarget\" }) formTarget: \"_self\" | \"_blank\" | \"_parent\" | \"_top\" | string;\n\n  /** Sets focus on the button. */\n  public focus(options?: FocusOptions) {\n    this.button.focus(options);\n  }\n\n  /** Simulates a click on the button. */\n  public click() {\n    this.button.click();\n  }\n\n  /** Removes focus from the button. */\n  public blur() {\n    this.button.blur();\n  }\n\n  handleBlur() {\n    this.emit(\"sgds-blur\");\n  }\n\n  handleFocus() {\n    this.emit(\"sgds-focus\");\n  }\n\n  handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    this.removeEventListener(\"click\", this.clickHandler);\n    this.addEventListener(\"click\", this.clickHandler);\n  }\n\n  /** @internal */\n  clickHandler = () => {\n    if (this.type === \"submit\") {\n      this.formSubmitController.submit(this);\n    }\n    if (this.type === \"reset\") {\n      this.formSubmitController.reset(this);\n    }\n  };\n\n  render() {\n    const isLink = this.href;\n    const tag = isLink ? literal`a` : literal`button`;\n    return html`\n      <${tag}\n        class=\"sgds btn ${classMap({\n          disabled: isLink && this.disabled,\n          active: this.active,\n          [`btn-${this.variant}`]: this.variant,\n          [`btn-${this.size}`]: this.size,\n          [`${this.buttonClasses}`]: this.buttonClasses\n        })}\"\n        ?disabled=${ifDefined(isLink ? undefined : this.disabled)}\n        type=${ifDefined(isLink ? undefined : this.type)}\n        href=${ifDefined(isLink ? this.href : undefined)}\n        target=${ifDefined(isLink ? this.target : undefined)}\n        download=${ifDefined(isLink ? this.download : undefined)}\n        rel=${ifDefined(isLink && this.target === \"_blank\" ? \"noreferrer noopener\" : undefined)}\n        role=${ifDefined(isLink ? \"button\" : undefined)}\n        aria-disabled=${this.disabled ? \"true\" : \"false\"}\n        tabindex=${this.disabled ? \"-1\" : \"0\"}\n        @click=${this.handleClick}\n        @focus=${this.handleFocus}\n        @blur=${this.handleBlur}\n      >\n      <slot></slot>\n      </${tag}>\n    `;\n  }\n}\n\nexport default SgdsButton;\n"],"names":["SgdsElement","FormSubmitController","literal","html","classMap","ifDefined","styles","__decorate","query","property"],"mappings":"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"}

package/components/Button/sgds-button.js

@@ -102,7 +102,7 @@ class SgdsButton extends SgdsElement {
         @focus=${this.handleFocus}
         @blur=${this.handleBlur}
       >
-        <slot class="d-flex align-items-center gap-2"></slot>
+      <slot></slot>
       </${tag}>
     `;
     }

package/components/Button/sgds-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-button.js","sources":["../../../src/components/Button/sgds-button.ts"],"sourcesContent":["import { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { html, literal } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport styles from \"./sgds-button.scss\";\n\nexport type ButtonVariant =\n  | \"primary\"\n  | \"secondary\"\n  | \"success\"\n  | \"danger\"\n  | \"warning\"\n  | \"info\"\n  | \"light\"\n  | \"dark\"\n  | \"link\"\n  | \"outline-primary\"\n  | \"outline-secondary\"\n  | \"outline-success\"\n  | \"outline-danger\"\n  | \"outline-warning\"\n  | \"outline-info\"\n  | \"outline-light\"\n  | \"outline-dark\";\n\n/**\n * @summary Custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.\n *\n * @slot default - The button's label.\n *\n * @event sgds-blur - Emitted when the button is not focused.\n * @event sgds-focus - Emitted when the button is focused.\n */\nexport class SgdsButton extends SgdsElement {\n  static styles = [SgdsElement.styles, styles];\n\n  @query(\".btn\") private button: HTMLButtonElement | HTMLLinkElement;\n\n  /** @internal */\n  private readonly formSubmitController = new FormSubmitController(this, {\n    form: (input: HTMLInputElement) => {\n      // Buttons support a form attribute that points to an arbitrary form, so if this attribute it set we need to query\n      // the form from the same root using its id\n      if (input.hasAttribute(\"form\")) {\n        const doc = input.getRootNode() as Document | ShadowRoot;\n        const formId = input.getAttribute(\"form\");\n        return doc.getElementById(formId) as HTMLFormElement;\n      }\n\n      // Fall back to the closest containing form\n      return input.closest(\"form\");\n    }\n  });\n\n  /** One or more button variant combinations buttons may be one of a variety of visual variants such as: `primary`, `secondary`, `success`, `danger`, `warning`, `info`, `dark`, `light`, `link` as well as \"outline\" versions (prefixed by `outline-*`) */\n  @property({ reflect: true }) variant: ButtonVariant = \"primary\";\n\n  /** Optional for button. Can be used to insert any utility classes such as me-auto **/\n  @property({ reflect: true }) buttonClasses: string;\n\n  /** Specifies a large or small button */\n  @property({ reflect: true }) size: \"sm\" | \"lg\";\n\n  /** Manually set the visual state of the button to `:active` */\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  /** The disabled state of the button */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** The behavior of the button with default as `type='button', `reset` resets all the controls to their initial values and `submit` submits the form data to the server */\n  @property() type: \"button\" | \"submit\" | \"reset\" = \"button\";\n\n  /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */\n  @property() href: string;\n\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @property() target: \"_blank\" | \"_parent\" | \"_self\" | \"_top\";\n\n  /** Tells the browser to download the linked file as this filename. Only used when `href` is set. */\n  @property({ reflect: true }) download: string;\n\n  /**\n   * The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\n   * value of this attribute must be an id of a form in the same document or shadow root as the button.\n   */\n  @property() form: string;\n\n  /** Used to override the form owner's `action` attribute. */\n  @property({ attribute: \"formaction\" }) formAction: string;\n\n  /** Used to override the form owner's `method` attribute.  */\n  @property({ attribute: \"formmethod\" }) formMethod: \"post\" | \"get\";\n\n  /** Used to override the form owner's `novalidate` attribute. */\n  @property({ attribute: \"formnovalidate\", type: Boolean })\n  formNoValidate: boolean;\n\n  /** Used to override the form owner's `target` attribute. */\n  @property({ attribute: \"formtarget\" }) formTarget: \"_self\" | \"_blank\" | \"_parent\" | \"_top\" | string;\n\n  /** Sets focus on the button. */\n  public focus(options?: FocusOptions) {\n    this.button.focus(options);\n  }\n\n  /** Simulates a click on the button. */\n  public click() {\n    this.button.click();\n  }\n\n  /** Removes focus from the button. */\n  public blur() {\n    this.button.blur();\n  }\n\n  handleBlur() {\n    this.emit(\"sgds-blur\");\n  }\n\n  handleFocus() {\n    this.emit(\"sgds-focus\");\n  }\n\n  handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    this.removeEventListener(\"click\", this.clickHandler);\n    this.addEventListener(\"click\", this.clickHandler);\n  }\n\n  /** @internal */\n  clickHandler = () => {\n    if (this.type === \"submit\") {\n      this.formSubmitController.submit(this);\n    }\n    if (this.type === \"reset\") {\n      this.formSubmitController.reset(this);\n    }\n  };\n\n  render() {\n    const isLink = this.href;\n    const tag = isLink ? literal`a` : literal`button`;\n    return html`\n      <${tag}\n        class=\"sgds btn ${classMap({\n          disabled: isLink && this.disabled,\n          active: this.active,\n          [`btn-${this.variant}`]: this.variant,\n          [`btn-${this.size}`]: this.size,\n          [`${this.buttonClasses}`]: this.buttonClasses\n        })}\"\n        ?disabled=${ifDefined(isLink ? undefined : this.disabled)}\n        type=${ifDefined(isLink ? undefined : this.type)}\n        href=${ifDefined(isLink ? this.href : undefined)}\n        target=${ifDefined(isLink ? this.target : undefined)}\n        download=${ifDefined(isLink ? this.download : undefined)}\n        rel=${ifDefined(isLink && this.target === \"_blank\" ? \"noreferrer noopener\" : undefined)}\n        role=${ifDefined(isLink ? \"button\" : undefined)}\n        aria-disabled=${this.disabled ? \"true\" : \"false\"}\n        tabindex=${this.disabled ? \"-1\" : \"0\"}\n        @click=${this.handleClick}\n        @focus=${this.handleFocus}\n        @blur=${this.handleBlur}\n      >\n        <slot class=\"d-flex align-items-center gap-2\"></slot>\n      </${tag}>\n    `;\n  }\n}\n\nexport default SgdsButton;\n"],"names":["styles"],"mappings":"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"}
+{"version":3,"file":"sgds-button.js","sources":["../../../src/components/Button/sgds-button.ts"],"sourcesContent":["import { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { html, literal } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport styles from \"./sgds-button.scss\";\n\nexport type ButtonVariant =\n  | \"primary\"\n  | \"secondary\"\n  | \"success\"\n  | \"danger\"\n  | \"warning\"\n  | \"info\"\n  | \"light\"\n  | \"dark\"\n  | \"link\"\n  | \"outline-primary\"\n  | \"outline-secondary\"\n  | \"outline-success\"\n  | \"outline-danger\"\n  | \"outline-warning\"\n  | \"outline-info\"\n  | \"outline-light\"\n  | \"outline-dark\";\n\n/**\n * @summary Custom button styles for actions in forms, dialogs, and more with support for multiple sizes, states, and more.\n *\n * @slot default - The button's label.\n *\n * @event sgds-blur - Emitted when the button is not focused.\n * @event sgds-focus - Emitted when the button is focused.\n */\nexport class SgdsButton extends SgdsElement {\n  static styles = [SgdsElement.styles, styles];\n\n  @query(\".btn\") private button: HTMLButtonElement | HTMLLinkElement;\n\n  /** @internal */\n  private readonly formSubmitController = new FormSubmitController(this, {\n    form: (input: HTMLInputElement) => {\n      // Buttons support a form attribute that points to an arbitrary form, so if this attribute it set we need to query\n      // the form from the same root using its id\n      if (input.hasAttribute(\"form\")) {\n        const doc = input.getRootNode() as Document | ShadowRoot;\n        const formId = input.getAttribute(\"form\");\n        return doc.getElementById(formId) as HTMLFormElement;\n      }\n\n      // Fall back to the closest containing form\n      return input.closest(\"form\");\n    }\n  });\n\n  /** One or more button variant combinations buttons may be one of a variety of visual variants such as: `primary`, `secondary`, `success`, `danger`, `warning`, `info`, `dark`, `light`, `link` as well as \"outline\" versions (prefixed by `outline-*`) */\n  @property({ reflect: true }) variant: ButtonVariant = \"primary\";\n\n  /** Optional for button. Can be used to insert any utility classes such as me-auto **/\n  @property({ reflect: true }) buttonClasses: string;\n\n  /** Specifies a large or small button */\n  @property({ reflect: true }) size: \"sm\" | \"lg\";\n\n  /** Manually set the visual state of the button to `:active` */\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  /** The disabled state of the button */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  /** The behavior of the button with default as `type='button', `reset` resets all the controls to their initial values and `submit` submits the form data to the server */\n  @property() type: \"button\" | \"submit\" | \"reset\" = \"button\";\n\n  /** When set, the underlying button will be rendered as an `<a>` with this `href` instead of a `<button>`. */\n  @property() href: string;\n\n  /** Tells the browser where to open the link. Only used when `href` is set. */\n  @property() target: \"_blank\" | \"_parent\" | \"_self\" | \"_top\";\n\n  /** Tells the browser to download the linked file as this filename. Only used when `href` is set. */\n  @property({ reflect: true }) download: string;\n\n  /**\n   * The \"form owner\" to associate the button with. If omitted, the closest containing form will be used instead. The\n   * value of this attribute must be an id of a form in the same document or shadow root as the button.\n   */\n  @property() form: string;\n\n  /** Used to override the form owner's `action` attribute. */\n  @property({ attribute: \"formaction\" }) formAction: string;\n\n  /** Used to override the form owner's `method` attribute.  */\n  @property({ attribute: \"formmethod\" }) formMethod: \"post\" | \"get\";\n\n  /** Used to override the form owner's `novalidate` attribute. */\n  @property({ attribute: \"formnovalidate\", type: Boolean })\n  formNoValidate: boolean;\n\n  /** Used to override the form owner's `target` attribute. */\n  @property({ attribute: \"formtarget\" }) formTarget: \"_self\" | \"_blank\" | \"_parent\" | \"_top\" | string;\n\n  /** Sets focus on the button. */\n  public focus(options?: FocusOptions) {\n    this.button.focus(options);\n  }\n\n  /** Simulates a click on the button. */\n  public click() {\n    this.button.click();\n  }\n\n  /** Removes focus from the button. */\n  public blur() {\n    this.button.blur();\n  }\n\n  handleBlur() {\n    this.emit(\"sgds-blur\");\n  }\n\n  handleFocus() {\n    this.emit(\"sgds-focus\");\n  }\n\n  handleClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n\n    this.removeEventListener(\"click\", this.clickHandler);\n    this.addEventListener(\"click\", this.clickHandler);\n  }\n\n  /** @internal */\n  clickHandler = () => {\n    if (this.type === \"submit\") {\n      this.formSubmitController.submit(this);\n    }\n    if (this.type === \"reset\") {\n      this.formSubmitController.reset(this);\n    }\n  };\n\n  render() {\n    const isLink = this.href;\n    const tag = isLink ? literal`a` : literal`button`;\n    return html`\n      <${tag}\n        class=\"sgds btn ${classMap({\n          disabled: isLink && this.disabled,\n          active: this.active,\n          [`btn-${this.variant}`]: this.variant,\n          [`btn-${this.size}`]: this.size,\n          [`${this.buttonClasses}`]: this.buttonClasses\n        })}\"\n        ?disabled=${ifDefined(isLink ? undefined : this.disabled)}\n        type=${ifDefined(isLink ? undefined : this.type)}\n        href=${ifDefined(isLink ? this.href : undefined)}\n        target=${ifDefined(isLink ? this.target : undefined)}\n        download=${ifDefined(isLink ? this.download : undefined)}\n        rel=${ifDefined(isLink && this.target === \"_blank\" ? \"noreferrer noopener\" : undefined)}\n        role=${ifDefined(isLink ? \"button\" : undefined)}\n        aria-disabled=${this.disabled ? \"true\" : \"false\"}\n        tabindex=${this.disabled ? \"-1\" : \"0\"}\n        @click=${this.handleClick}\n        @focus=${this.handleFocus}\n        @blur=${this.handleBlur}\n      >\n      <slot></slot>\n      </${tag}>\n    `;\n  }\n}\n\nexport default SgdsButton;\n"],"names":["styles"],"mappings":"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"}