@biggive/components 202308241036.0.0 → 202308250924.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -202,7 +202,11 @@ const BiggiveButton = class {
202
202
  this.buttonId = undefined;
203
203
  }
204
204
  render() {
205
- return (index.h("div", { class: 'container space-below-' + this.spaceBelow + ' centered-' + this.centered }, index.h("a", { href: this.url, target: this.openInNewTab ? '_blank' : '_self', id: this.buttonId, class: 'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString() }, index.h("span", { onClick: this.handleButtonClick }, this.label))));
205
+ // We always want to have a href so that browsers will see this as a link and allow clicking with keybard.
206
+ // If there's no or an empty href then it isn't possible to click by keyboard and we would have to handle keyboard
207
+ // interaction separately.
208
+ const href = this.url || 'javascript:void(0);';
209
+ return (index.h("div", { class: 'container space-below-' + this.spaceBelow + ' centered-' + this.centered }, index.h("a", { role: "button", href: href, target: this.openInNewTab ? '_blank' : '_self', id: this.buttonId, class: 'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString() }, index.h("span", { onClick: this.handleButtonClick }, this.label))));
206
210
  }
207
211
  };
208
212
  BiggiveButton.style = biggiveButtonCss;
@@ -16,7 +16,11 @@ export class BiggiveButton {
16
16
  this.buttonId = undefined;
17
17
  }
18
18
  render() {
19
- return (h("div", { class: 'container space-below-' + this.spaceBelow + ' centered-' + this.centered }, h("a", { href: this.url, target: this.openInNewTab ? '_blank' : '_self', id: this.buttonId, class: 'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString() }, h("span", { onClick: this.handleButtonClick }, this.label))));
19
+ // We always want to have a href so that browsers will see this as a link and allow clicking with keybard.
20
+ // If there's no or an empty href then it isn't possible to click by keyboard and we would have to handle keyboard
21
+ // interaction separately.
22
+ const href = this.url || 'javascript:void(0);';
23
+ return (h("div", { class: 'container space-below-' + this.spaceBelow + ' centered-' + this.centered }, h("a", { role: "button", href: href, target: this.openInNewTab ? '_blank' : '_self', id: this.buttonId, class: 'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString() }, h("span", { onClick: this.handleButtonClick }, this.label))));
20
24
  }
21
25
  static get is() { return "biggive-button"; }
22
26
  static get encapsulation() { return "shadow"; }
@@ -90,8 +94,8 @@ export class BiggiveButton {
90
94
  "type": "string",
91
95
  "mutable": false,
92
96
  "complexType": {
93
- "original": "string",
94
- "resolved": "string",
97
+ "original": "string | undefined",
98
+ "resolved": "string | undefined",
95
99
  "references": {}
96
100
  },
97
101
  "required": false,
@@ -23,7 +23,11 @@ const BiggiveButton = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
23
23
  this.buttonId = undefined;
24
24
  }
25
25
  render() {
26
- return (h("div", { class: 'container space-below-' + this.spaceBelow + ' centered-' + this.centered }, h("a", { href: this.url, target: this.openInNewTab ? '_blank' : '_self', id: this.buttonId, class: 'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString() }, h("span", { onClick: this.handleButtonClick }, this.label))));
26
+ // We always want to have a href so that browsers will see this as a link and allow clicking with keybard.
27
+ // If there's no or an empty href then it isn't possible to click by keyboard and we would have to handle keyboard
28
+ // interaction separately.
29
+ const href = this.url || 'javascript:void(0);';
30
+ return (h("div", { class: 'container space-below-' + this.spaceBelow + ' centered-' + this.centered }, h("a", { role: "button", href: href, target: this.openInNewTab ? '_blank' : '_self', id: this.buttonId, class: 'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString() }, h("span", { onClick: this.handleButtonClick }, this.label))));
27
31
  }
28
32
  static get style() { return biggiveButtonCss; }
29
33
  }, [1, "biggive-button", {
@@ -198,7 +198,11 @@ const BiggiveButton = class {
198
198
  this.buttonId = undefined;
199
199
  }
200
200
  render() {
201
- return (h("div", { class: 'container space-below-' + this.spaceBelow + ' centered-' + this.centered }, h("a", { href: this.url, target: this.openInNewTab ? '_blank' : '_self', id: this.buttonId, class: 'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString() }, h("span", { onClick: this.handleButtonClick }, this.label))));
201
+ // We always want to have a href so that browsers will see this as a link and allow clicking with keybard.
202
+ // If there's no or an empty href then it isn't possible to click by keyboard and we would have to handle keyboard
203
+ // interaction separately.
204
+ const href = this.url || 'javascript:void(0);';
205
+ return (h("div", { class: 'container space-below-' + this.spaceBelow + ' centered-' + this.centered }, h("a", { role: "button", href: href, target: this.openInNewTab ? '_blank' : '_self', id: this.buttonId, class: 'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString() }, h("span", { onClick: this.handleButtonClick }, this.label))));
202
206
  }
203
207
  };
204
208
  BiggiveButton.style = biggiveButtonCss;
@@ -19,7 +19,7 @@ export declare class BiggiveButton {
19
19
  /**
20
20
  * URL
21
21
  */
22
- url: string;
22
+ url: string | undefined;
23
23
  /**
24
24
  * New Tab
25
25
  */
@@ -195,7 +195,7 @@ export namespace Components {
195
195
  /**
196
196
  * URL
197
197
  */
198
- "url": string;
198
+ "url": string | undefined;
199
199
  }
200
200
  interface BiggiveCallToAction {
201
201
  /**
@@ -1724,7 +1724,7 @@ declare namespace LocalJSX {
1724
1724
  /**
1725
1725
  * URL
1726
1726
  */
1727
- "url"?: string;
1727
+ "url"?: string | undefined;
1728
1728
  }
1729
1729
  interface BiggiveCallToAction {
1730
1730
  /**
package/hydrate/index.js CHANGED
@@ -6623,7 +6623,11 @@ class BiggiveButton {
6623
6623
  this.buttonId = undefined;
6624
6624
  }
6625
6625
  render() {
6626
- return (hAsync("div", { class: 'container space-below-' + this.spaceBelow + ' centered-' + this.centered }, hAsync("a", { href: this.url, target: this.openInNewTab ? '_blank' : '_self', id: this.buttonId, class: 'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString() }, hAsync("span", { onClick: this.handleButtonClick }, this.label))));
6626
+ // We always want to have a href so that browsers will see this as a link and allow clicking with keybard.
6627
+ // If there's no or an empty href then it isn't possible to click by keyboard and we would have to handle keyboard
6628
+ // interaction separately.
6629
+ const href = this.url || 'javascript:void(0);';
6630
+ return (hAsync("div", { class: 'container space-below-' + this.spaceBelow + ' centered-' + this.centered }, hAsync("a", { role: "button", href: href, target: this.openInNewTab ? '_blank' : '_self', id: this.buttonId, class: 'button button-' + this.colourScheme + ' full-width-' + this.fullWidth.toString() + ' size-' + this.size + ' rounded-' + this.rounded.toString() }, hAsync("span", { onClick: this.handleButtonClick }, this.label))));
6627
6631
  }
6628
6632
  static get style() { return biggiveButtonCss; }
6629
6633
  static get cmpMeta() { return {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@biggive/components",
3
3
  "_comment": "Version number below is automatically replaced during CircleCI build.",
4
- "version": "202308241036.0.0",
4
+ "version": "202308250924.0.0",
5
5
  "description": "Big Give Components",
6
6
  "main": "dist/index.cjs.js",
7
7
  "module": "dist/index.js",