@substrate-system/button 0.0.35 → 0.0.38
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.
- package/README.md +9 -2
- package/dist/client.cjs +16 -9
- package/dist/client.cjs.map +2 -2
- package/dist/client.d.ts +2 -2
- package/dist/client.d.ts.map +1 -1
- package/dist/client.js +16 -9
- package/dist/client.js.map +2 -2
- package/dist/client.min.cjs +1 -1
- package/dist/client.min.cjs.map +2 -2
- package/dist/client.min.js +1 -1
- package/dist/client.min.js.map +2 -2
- package/dist/index.cjs +4 -6
- package/dist/index.cjs.map +2 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +4 -6
- package/dist/index.js.map +2 -2
- package/dist/index.min.cjs +1 -1
- package/dist/index.min.cjs.map +3 -3
- package/dist/index.min.js +2 -2
- package/dist/index.min.js.map +3 -3
- package/dist/meta.json +8 -8
- package/package.json +5 -2
package/README.md
CHANGED
|
@@ -32,7 +32,7 @@ A button web component, with a visual "loading" state.
|
|
|
32
32
|
- [Module format](#module-format)
|
|
33
33
|
* [Bundler](#bundler-1)
|
|
34
34
|
* [pre-built](#pre-built)
|
|
35
|
-
|
|
35
|
+
- [Example](#example)
|
|
36
36
|
* [Attributes](#attributes)
|
|
37
37
|
|
|
38
38
|
<!-- tocstop -->
|
|
@@ -194,11 +194,18 @@ cp ./node_modules/@substrate-system/button/dist/index.min.css ./public/substrate
|
|
|
194
194
|
</body>
|
|
195
195
|
```
|
|
196
196
|
|
|
197
|
+
-------------------
|
|
197
198
|
|
|
198
|
-
|
|
199
|
+
## Example
|
|
199
200
|
|
|
200
201
|
See the example in [./example](./example/).
|
|
201
202
|
|
|
203
|
+
```html
|
|
204
|
+
<substrate-button id="labeled" aria-label="Save your changes">
|
|
205
|
+
Save
|
|
206
|
+
</substrate-button>
|
|
207
|
+
```
|
|
208
|
+
|
|
202
209
|
### Attributes
|
|
203
210
|
|
|
204
211
|
#### spinning
|
package/dist/client.cjs
CHANGED
|
@@ -52,8 +52,11 @@ class SubstrateButton extends import_web_component.WebComponent.create("substrat
|
|
|
52
52
|
return !!this.button?.hasAttribute("disabled");
|
|
53
53
|
}
|
|
54
54
|
set disabled(disabledValue) {
|
|
55
|
+
if (this.hasAttribute("disabled") !== disabledValue) {
|
|
56
|
+
this.toggleAttribute("disabled", disabledValue);
|
|
57
|
+
}
|
|
55
58
|
if (!disabledValue) {
|
|
56
|
-
this.
|
|
59
|
+
this.button?.removeAttribute("disabled");
|
|
57
60
|
this.button?.setAttribute("aria-disabled", "false");
|
|
58
61
|
} else {
|
|
59
62
|
this.button?.setAttribute("disabled", "");
|
|
@@ -91,11 +94,10 @@ class SubstrateButton extends import_web_component.WebComponent.create("substrat
|
|
|
91
94
|
return !!this.button?.hasAttribute("autofocus");
|
|
92
95
|
}
|
|
93
96
|
set autofocus(value) {
|
|
94
|
-
if (value) {
|
|
95
|
-
this.
|
|
96
|
-
} else {
|
|
97
|
-
this._removeAttribute("autofocus");
|
|
97
|
+
if (this.hasAttribute("autofocus") !== value) {
|
|
98
|
+
this.toggleAttribute("autofocus", value);
|
|
98
99
|
}
|
|
100
|
+
this.button?.toggleAttribute("autofocus", value);
|
|
99
101
|
}
|
|
100
102
|
/**
|
|
101
103
|
* Set attributes on the internal button element.
|
|
@@ -132,12 +134,17 @@ class SubstrateButton extends import_web_component.WebComponent.create("substrat
|
|
|
132
134
|
* @param {string} newValue The new attribute value
|
|
133
135
|
*/
|
|
134
136
|
handleChange_autofocus(_oldValue, newValue) {
|
|
135
|
-
this.
|
|
137
|
+
this.button?.toggleAttribute("autofocus", newValue !== null);
|
|
136
138
|
}
|
|
137
139
|
handleChange_disabled(_old, newValue) {
|
|
138
|
-
|
|
139
|
-
if (
|
|
140
|
-
|
|
140
|
+
const isDisabled = newValue !== null;
|
|
141
|
+
if (isDisabled) {
|
|
142
|
+
this.button?.setAttribute("disabled", "");
|
|
143
|
+
this.button?.setAttribute("aria-disabled", "true");
|
|
144
|
+
} else {
|
|
145
|
+
this.button?.removeAttribute("disabled");
|
|
146
|
+
this.button?.setAttribute("aria-disabled", "false");
|
|
147
|
+
}
|
|
141
148
|
}
|
|
142
149
|
handleChange_spinning(_, newValue) {
|
|
143
150
|
if (newValue !== null) {
|
package/dist/client.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/client.ts"],
|
|
4
|
-
"sourcesContent": ["import { WebComponent, define } from '@substrate-system/web-component'\n\n// for docuement.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'substrate-button': SubstrateButton\n }\n}\n\n/**\n * This is the lightweight version for browsers.\n * It \"hydrates\" only, meaining sets up event listeners.\n * It does not know how to render itself.\n */\n\nexport class SubstrateButton extends WebComponent.create('substrate-button') {\n // for `attributeChangedCallback`\n static observedAttributes = ['autofocus', 'disabled', 'spinning']\n static TAG = 'substrate-button'\n _isSpinning:boolean\n\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n constructor () {\n super()\n const disabled = this.getAttribute('disabled')\n if (disabled !== null) {\n setTimeout(() => {\n // need to wait for it to render\n this.disabled = true\n }, 0)\n }\n this.autofocus = (this.getAttribute('autofocus') !== null)\n this._isSpinning = (this.getAttribute('spinning') !== null)\n }\n\n get form ():HTMLFormElement|undefined|null {\n return this.button?.form\n }\n\n get disabled ():boolean {\n return !!(this.button?.hasAttribute('disabled'))\n }\n\n set disabled (disabledValue:boolean) {\n if (!disabledValue) {\n this.
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAAqC;AAe9B,MAAM,wBAAwB,kCAAa,OAAO,kBAAkB,EAAE;AAAA,EAf7E,OAe6E;AAAA;AAAA;AAAA;AAAA,EAEzE,OAAO,qBAAqB,CAAC,aAAa,YAAY,UAAU;AAAA,EAChE,OAAO,MAAM;AAAA,EACb;AAAA,EAEA,OAAO,SAAU;AACb,qCAAO,gBAAgB,KAAK,eAAe;AAAA,EAC/C;AAAA,EAEA,cAAe;AACX,UAAM;AACN,UAAM,WAAW,KAAK,aAAa,UAAU;AAC7C,QAAI,aAAa,MAAM;AACnB,iBAAW,MAAM;AAEb,aAAK,WAAW;AAAA,MACpB,GAAG,CAAC;AAAA,IACR;AACA,SAAK,YAAa,KAAK,aAAa,WAAW,MAAM;AACrD,SAAK,cAAe,KAAK,aAAa,UAAU,MAAM;AAAA,EAC1D;AAAA,EAEA,IAAI,OAAuC;AACvC,WAAO,KAAK,QAAQ;AAAA,EACxB;AAAA,EAEA,IAAI,WAAoB;AACpB,WAAO,CAAC,CAAE,KAAK,QAAQ,aAAa,UAAU;AAAA,EAClD;AAAA,EAEA,IAAI,SAAU,eAAuB;
|
|
4
|
+
"sourcesContent": ["import { WebComponent, define } from '@substrate-system/web-component'\n\n// for docuement.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'substrate-button': SubstrateButton\n }\n}\n\n/**\n * This is the lightweight version for browsers.\n * It \"hydrates\" only, meaining sets up event listeners.\n * It does not know how to render itself.\n */\n\nexport class SubstrateButton extends WebComponent.create('substrate-button') {\n // for `attributeChangedCallback`\n static observedAttributes = ['autofocus', 'disabled', 'spinning']\n static TAG = 'substrate-button'\n _isSpinning:boolean\n\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n constructor () {\n super()\n const disabled = this.getAttribute('disabled')\n if (disabled !== null) {\n setTimeout(() => {\n // need to wait for it to render\n this.disabled = true\n }, 0)\n }\n this.autofocus = (this.getAttribute('autofocus') !== null)\n this._isSpinning = (this.getAttribute('spinning') !== null)\n }\n\n get form ():HTMLFormElement|undefined|null {\n return this.button?.form\n }\n\n get disabled ():boolean {\n return !!(this.button?.hasAttribute('disabled'))\n }\n\n set disabled (disabledValue:boolean) {\n // Reflect to host attribute; guard against re-entrancy\n if (this.hasAttribute('disabled') !== disabledValue) {\n this.toggleAttribute('disabled', disabledValue)\n }\n if (!disabledValue) {\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-disabled', 'false')\n } else {\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-disabled', 'true')\n }\n }\n\n get type ():string|null|undefined {\n return this.button?.getAttribute('type')\n }\n\n get tabindex ():number {\n const i = this.button?.getAttribute('tabindex')\n if (!i) return 0\n return parseInt(i)\n }\n\n get spinning ():boolean {\n return this._isSpinning\n }\n\n set spinning (value:boolean) {\n if (value) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.setAttribute('spinning', '')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.removeAttribute('spinning')\n }\n }\n\n set type (value:string) {\n this._setAttribute('type', value)\n }\n\n get autofocus ():boolean {\n return !!(this.button?.hasAttribute('autofocus'))\n }\n\n set autofocus (value:boolean) {\n // Reflect to host attribute; guard against re-entrancy\n if (this.hasAttribute('autofocus') !== value) {\n this.toggleAttribute('autofocus', value)\n }\n this.button?.toggleAttribute('autofocus', value)\n }\n\n /**\n * Set attributes on the internal button element.\n */\n _setAttribute (name:string, value:boolean|string|null):void {\n if (value === false) {\n // false means remove the attribute\n this._removeAttribute(name)\n this.button?.removeAttribute(name)\n } else {\n if (value === true) {\n // true means set the attribute with no value\n return this.button?.setAttribute(name, '')\n }\n\n if (value === null) {\n // null means remove\n return this._removeAttribute(name)\n }\n\n // else, set value to a string\n this.button?.setAttribute(name, value)\n }\n }\n\n /**\n * Remove from `this` and also button child.\n */\n _removeAttribute (name:string) {\n this.removeAttribute(name)\n this.button?.removeAttribute(name)\n }\n\n get button ():HTMLButtonElement|null {\n return this.querySelector('button')\n }\n\n /**\n * Handle 'autofocus' attribute changes\n * @see {@link https://gomakethings.com/how-to-detect-when-attributes-change-on-a-web-component/#organizing-your-code Go Make Things article}\n *\n * @param {string} oldValue The old attribute value\n * @param {string} newValue The new attribute value\n */\n handleChange_autofocus (_oldValue:string, newValue:string|null) {\n this.button?.toggleAttribute('autofocus', newValue !== null)\n }\n\n handleChange_disabled (_old:string|null, newValue:string|null) {\n const isDisabled = newValue !== null\n if (isDisabled) {\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-disabled', 'true')\n } else {\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-disabled', 'false')\n }\n }\n\n handleChange_spinning (_, newValue:boolean) {\n if (newValue !== null) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-busy', 'true')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-busy', 'false')\n }\n }\n\n connectedCallback () {\n // connect event listeners\n this.render()\n this._setupKeyboardHandlers()\n }\n\n _setupKeyboardHandlers () {\n // Space and Enter should trigger click\n this.button?.addEventListener('keydown', (e:KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n e.preventDefault()\n this.button?.click()\n }\n })\n }\n\n render () {\n // noop\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/client.d.ts
CHANGED
|
@@ -47,8 +47,8 @@ export declare class SubstrateButton extends SubstrateButton_base {
|
|
|
47
47
|
* @param {string} oldValue The old attribute value
|
|
48
48
|
* @param {string} newValue The new attribute value
|
|
49
49
|
*/
|
|
50
|
-
handleChange_autofocus(_oldValue: string, newValue: string): void;
|
|
51
|
-
handleChange_disabled(_old:
|
|
50
|
+
handleChange_autofocus(_oldValue: string, newValue: string | null): void;
|
|
51
|
+
handleChange_disabled(_old: string | null, newValue: string | null): void;
|
|
52
52
|
handleChange_spinning(_: any, newValue: boolean): void;
|
|
53
53
|
connectedCallback(): void;
|
|
54
54
|
_setupKeyboardHandlers(): void;
|
package/dist/client.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../src/client.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAU,MAAM,iCAAiC,CAAA;AAGtE,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,kBAAkB,EAAE,eAAe,CAAA;KACtC;CACJ;;;;;;;AAED;;;;GAIG;AAEH,qBAAa,eAAgB,SAAQ,oBAAuC;IAExE,MAAM,CAAC,kBAAkB,WAAwC;IACjE,MAAM,CAAC,GAAG,SAAqB;IAC/B,WAAW,EAAC,OAAO,CAAA;IAEnB,MAAM,CAAC,MAAM;;IAiBb,IAAI,IAAI,IAAI,eAAe,GAAC,SAAS,GAAC,IAAI,CAEzC;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,QAAQ,CAAE,aAAa,EAAC,OAAO,
|
|
1
|
+
{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../src/client.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAU,MAAM,iCAAiC,CAAA;AAGtE,OAAO,CAAC,MAAM,CAAC;IACX,UAAU,qBAAqB;QAC3B,kBAAkB,EAAE,eAAe,CAAA;KACtC;CACJ;;;;;;;AAED;;;;GAIG;AAEH,qBAAa,eAAgB,SAAQ,oBAAuC;IAExE,MAAM,CAAC,kBAAkB,WAAwC;IACjE,MAAM,CAAC,GAAG,SAAqB;IAC/B,WAAW,EAAC,OAAO,CAAA;IAEnB,MAAM,CAAC,MAAM;;IAiBb,IAAI,IAAI,IAAI,eAAe,GAAC,SAAS,GAAC,IAAI,CAEzC;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,QAAQ,CAAE,aAAa,EAAC,OAAO,EAYlC;IAED,IAAI,IAAI,IAAI,MAAM,GAAC,IAAI,GAAC,SAAS,CAEhC;IAED,IAAI,QAAQ,IAAI,MAAM,CAIrB;IAED,IAAI,QAAQ,IAAI,OAAO,CAEtB;IAED,IAAI,QAAQ,CAAE,KAAK,EAAC,OAAO,EAY1B;IAED,IAAI,IAAI,CAAE,KAAK,EAAC,MAAM,EAErB;IAED,IAAI,SAAS,IAAI,OAAO,CAEvB;IAED,IAAI,SAAS,CAAE,KAAK,EAAC,OAAO,EAM3B;IAED;;OAEG;IACH,aAAa,CAAE,IAAI,EAAC,MAAM,EAAE,KAAK,EAAC,OAAO,GAAC,MAAM,GAAC,IAAI,GAAE,IAAI;IAqB3D;;OAEG;IACH,gBAAgB,CAAE,IAAI,EAAC,MAAM;IAK7B,IAAI,MAAM,IAAI,iBAAiB,GAAC,IAAI,CAEnC;IAED;;;;;;OAMG;IACH,sBAAsB,CAAE,SAAS,EAAC,MAAM,EAAE,QAAQ,EAAC,MAAM,GAAC,IAAI;IAI9D,qBAAqB,CAAE,IAAI,EAAC,MAAM,GAAC,IAAI,EAAE,QAAQ,EAAC,MAAM,GAAC,IAAI;IAW7D,qBAAqB,CAAE,CAAC,KAAA,EAAE,QAAQ,EAAC,OAAO;IAc1C,iBAAiB;IAMjB,sBAAsB;IAUtB,MAAM;CAGT"}
|
package/dist/client.js
CHANGED
|
@@ -30,8 +30,11 @@ class SubstrateButton extends WebComponent.create("substrate-button") {
|
|
|
30
30
|
return !!this.button?.hasAttribute("disabled");
|
|
31
31
|
}
|
|
32
32
|
set disabled(disabledValue) {
|
|
33
|
+
if (this.hasAttribute("disabled") !== disabledValue) {
|
|
34
|
+
this.toggleAttribute("disabled", disabledValue);
|
|
35
|
+
}
|
|
33
36
|
if (!disabledValue) {
|
|
34
|
-
this.
|
|
37
|
+
this.button?.removeAttribute("disabled");
|
|
35
38
|
this.button?.setAttribute("aria-disabled", "false");
|
|
36
39
|
} else {
|
|
37
40
|
this.button?.setAttribute("disabled", "");
|
|
@@ -69,11 +72,10 @@ class SubstrateButton extends WebComponent.create("substrate-button") {
|
|
|
69
72
|
return !!this.button?.hasAttribute("autofocus");
|
|
70
73
|
}
|
|
71
74
|
set autofocus(value) {
|
|
72
|
-
if (value) {
|
|
73
|
-
this.
|
|
74
|
-
} else {
|
|
75
|
-
this._removeAttribute("autofocus");
|
|
75
|
+
if (this.hasAttribute("autofocus") !== value) {
|
|
76
|
+
this.toggleAttribute("autofocus", value);
|
|
76
77
|
}
|
|
78
|
+
this.button?.toggleAttribute("autofocus", value);
|
|
77
79
|
}
|
|
78
80
|
/**
|
|
79
81
|
* Set attributes on the internal button element.
|
|
@@ -110,12 +112,17 @@ class SubstrateButton extends WebComponent.create("substrate-button") {
|
|
|
110
112
|
* @param {string} newValue The new attribute value
|
|
111
113
|
*/
|
|
112
114
|
handleChange_autofocus(_oldValue, newValue) {
|
|
113
|
-
this.
|
|
115
|
+
this.button?.toggleAttribute("autofocus", newValue !== null);
|
|
114
116
|
}
|
|
115
117
|
handleChange_disabled(_old, newValue) {
|
|
116
|
-
|
|
117
|
-
if (
|
|
118
|
-
|
|
118
|
+
const isDisabled = newValue !== null;
|
|
119
|
+
if (isDisabled) {
|
|
120
|
+
this.button?.setAttribute("disabled", "");
|
|
121
|
+
this.button?.setAttribute("aria-disabled", "true");
|
|
122
|
+
} else {
|
|
123
|
+
this.button?.removeAttribute("disabled");
|
|
124
|
+
this.button?.setAttribute("aria-disabled", "false");
|
|
125
|
+
}
|
|
119
126
|
}
|
|
120
127
|
handleChange_spinning(_, newValue) {
|
|
121
128
|
if (newValue !== null) {
|
package/dist/client.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/client.ts"],
|
|
4
|
-
"sourcesContent": ["import { WebComponent, define } from '@substrate-system/web-component'\n\n// for docuement.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'substrate-button': SubstrateButton\n }\n}\n\n/**\n * This is the lightweight version for browsers.\n * It \"hydrates\" only, meaining sets up event listeners.\n * It does not know how to render itself.\n */\n\nexport class SubstrateButton extends WebComponent.create('substrate-button') {\n // for `attributeChangedCallback`\n static observedAttributes = ['autofocus', 'disabled', 'spinning']\n static TAG = 'substrate-button'\n _isSpinning:boolean\n\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n constructor () {\n super()\n const disabled = this.getAttribute('disabled')\n if (disabled !== null) {\n setTimeout(() => {\n // need to wait for it to render\n this.disabled = true\n }, 0)\n }\n this.autofocus = (this.getAttribute('autofocus') !== null)\n this._isSpinning = (this.getAttribute('spinning') !== null)\n }\n\n get form ():HTMLFormElement|undefined|null {\n return this.button?.form\n }\n\n get disabled ():boolean {\n return !!(this.button?.hasAttribute('disabled'))\n }\n\n set disabled (disabledValue:boolean) {\n if (!disabledValue) {\n this.
|
|
5
|
-
"mappings": ";;AAAA,SAAS,cAAc,cAAc;AAe9B,MAAM,wBAAwB,aAAa,OAAO,kBAAkB,EAAE;AAAA,EAf7E,OAe6E;AAAA;AAAA;AAAA;AAAA,EAEzE,OAAO,qBAAqB,CAAC,aAAa,YAAY,UAAU;AAAA,EAChE,OAAO,MAAM;AAAA,EACb;AAAA,EAEA,OAAO,SAAU;AACb,WAAO,gBAAgB,KAAK,eAAe;AAAA,EAC/C;AAAA,EAEA,cAAe;AACX,UAAM;AACN,UAAM,WAAW,KAAK,aAAa,UAAU;AAC7C,QAAI,aAAa,MAAM;AACnB,iBAAW,MAAM;AAEb,aAAK,WAAW;AAAA,MACpB,GAAG,CAAC;AAAA,IACR;AACA,SAAK,YAAa,KAAK,aAAa,WAAW,MAAM;AACrD,SAAK,cAAe,KAAK,aAAa,UAAU,MAAM;AAAA,EAC1D;AAAA,EAEA,IAAI,OAAuC;AACvC,WAAO,KAAK,QAAQ;AAAA,EACxB;AAAA,EAEA,IAAI,WAAoB;AACpB,WAAO,CAAC,CAAE,KAAK,QAAQ,aAAa,UAAU;AAAA,EAClD;AAAA,EAEA,IAAI,SAAU,eAAuB;
|
|
4
|
+
"sourcesContent": ["import { WebComponent, define } from '@substrate-system/web-component'\n\n// for docuement.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'substrate-button': SubstrateButton\n }\n}\n\n/**\n * This is the lightweight version for browsers.\n * It \"hydrates\" only, meaining sets up event listeners.\n * It does not know how to render itself.\n */\n\nexport class SubstrateButton extends WebComponent.create('substrate-button') {\n // for `attributeChangedCallback`\n static observedAttributes = ['autofocus', 'disabled', 'spinning']\n static TAG = 'substrate-button'\n _isSpinning:boolean\n\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n constructor () {\n super()\n const disabled = this.getAttribute('disabled')\n if (disabled !== null) {\n setTimeout(() => {\n // need to wait for it to render\n this.disabled = true\n }, 0)\n }\n this.autofocus = (this.getAttribute('autofocus') !== null)\n this._isSpinning = (this.getAttribute('spinning') !== null)\n }\n\n get form ():HTMLFormElement|undefined|null {\n return this.button?.form\n }\n\n get disabled ():boolean {\n return !!(this.button?.hasAttribute('disabled'))\n }\n\n set disabled (disabledValue:boolean) {\n // Reflect to host attribute; guard against re-entrancy\n if (this.hasAttribute('disabled') !== disabledValue) {\n this.toggleAttribute('disabled', disabledValue)\n }\n if (!disabledValue) {\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-disabled', 'false')\n } else {\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-disabled', 'true')\n }\n }\n\n get type ():string|null|undefined {\n return this.button?.getAttribute('type')\n }\n\n get tabindex ():number {\n const i = this.button?.getAttribute('tabindex')\n if (!i) return 0\n return parseInt(i)\n }\n\n get spinning ():boolean {\n return this._isSpinning\n }\n\n set spinning (value:boolean) {\n if (value) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.setAttribute('spinning', '')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.removeAttribute('spinning')\n }\n }\n\n set type (value:string) {\n this._setAttribute('type', value)\n }\n\n get autofocus ():boolean {\n return !!(this.button?.hasAttribute('autofocus'))\n }\n\n set autofocus (value:boolean) {\n // Reflect to host attribute; guard against re-entrancy\n if (this.hasAttribute('autofocus') !== value) {\n this.toggleAttribute('autofocus', value)\n }\n this.button?.toggleAttribute('autofocus', value)\n }\n\n /**\n * Set attributes on the internal button element.\n */\n _setAttribute (name:string, value:boolean|string|null):void {\n if (value === false) {\n // false means remove the attribute\n this._removeAttribute(name)\n this.button?.removeAttribute(name)\n } else {\n if (value === true) {\n // true means set the attribute with no value\n return this.button?.setAttribute(name, '')\n }\n\n if (value === null) {\n // null means remove\n return this._removeAttribute(name)\n }\n\n // else, set value to a string\n this.button?.setAttribute(name, value)\n }\n }\n\n /**\n * Remove from `this` and also button child.\n */\n _removeAttribute (name:string) {\n this.removeAttribute(name)\n this.button?.removeAttribute(name)\n }\n\n get button ():HTMLButtonElement|null {\n return this.querySelector('button')\n }\n\n /**\n * Handle 'autofocus' attribute changes\n * @see {@link https://gomakethings.com/how-to-detect-when-attributes-change-on-a-web-component/#organizing-your-code Go Make Things article}\n *\n * @param {string} oldValue The old attribute value\n * @param {string} newValue The new attribute value\n */\n handleChange_autofocus (_oldValue:string, newValue:string|null) {\n this.button?.toggleAttribute('autofocus', newValue !== null)\n }\n\n handleChange_disabled (_old:string|null, newValue:string|null) {\n const isDisabled = newValue !== null\n if (isDisabled) {\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-disabled', 'true')\n } else {\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-disabled', 'false')\n }\n }\n\n handleChange_spinning (_, newValue:boolean) {\n if (newValue !== null) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-busy', 'true')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-busy', 'false')\n }\n }\n\n connectedCallback () {\n // connect event listeners\n this.render()\n this._setupKeyboardHandlers()\n }\n\n _setupKeyboardHandlers () {\n // Space and Enter should trigger click\n this.button?.addEventListener('keydown', (e:KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n e.preventDefault()\n this.button?.click()\n }\n })\n }\n\n render () {\n // noop\n }\n}\n"],
|
|
5
|
+
"mappings": ";;AAAA,SAAS,cAAc,cAAc;AAe9B,MAAM,wBAAwB,aAAa,OAAO,kBAAkB,EAAE;AAAA,EAf7E,OAe6E;AAAA;AAAA;AAAA;AAAA,EAEzE,OAAO,qBAAqB,CAAC,aAAa,YAAY,UAAU;AAAA,EAChE,OAAO,MAAM;AAAA,EACb;AAAA,EAEA,OAAO,SAAU;AACb,WAAO,gBAAgB,KAAK,eAAe;AAAA,EAC/C;AAAA,EAEA,cAAe;AACX,UAAM;AACN,UAAM,WAAW,KAAK,aAAa,UAAU;AAC7C,QAAI,aAAa,MAAM;AACnB,iBAAW,MAAM;AAEb,aAAK,WAAW;AAAA,MACpB,GAAG,CAAC;AAAA,IACR;AACA,SAAK,YAAa,KAAK,aAAa,WAAW,MAAM;AACrD,SAAK,cAAe,KAAK,aAAa,UAAU,MAAM;AAAA,EAC1D;AAAA,EAEA,IAAI,OAAuC;AACvC,WAAO,KAAK,QAAQ;AAAA,EACxB;AAAA,EAEA,IAAI,WAAoB;AACpB,WAAO,CAAC,CAAE,KAAK,QAAQ,aAAa,UAAU;AAAA,EAClD;AAAA,EAEA,IAAI,SAAU,eAAuB;AAEjC,QAAI,KAAK,aAAa,UAAU,MAAM,eAAe;AACjD,WAAK,gBAAgB,YAAY,aAAa;AAAA,IAClD;AACA,QAAI,CAAC,eAAe;AAChB,WAAK,QAAQ,gBAAgB,UAAU;AACvC,WAAK,QAAQ,aAAa,iBAAiB,OAAO;AAAA,IACtD,OAAO;AACH,WAAK,QAAQ,aAAa,YAAY,EAAE;AACxC,WAAK,QAAQ,aAAa,iBAAiB,MAAM;AAAA,IACrD;AAAA,EACJ;AAAA,EAEA,IAAI,OAA8B;AAC9B,WAAO,KAAK,QAAQ,aAAa,MAAM;AAAA,EAC3C;AAAA,EAEA,IAAI,WAAmB;AACnB,UAAM,IAAI,KAAK,QAAQ,aAAa,UAAU;AAC9C,QAAI,CAAC,EAAG,QAAO;AACf,WAAO,SAAS,CAAC;AAAA,EACrB;AAAA,EAEA,IAAI,WAAoB;AACpB,WAAO,KAAK;AAAA,EAChB;AAAA,EAEA,IAAI,SAAU,OAAe;AACzB,QAAI,OAAO;AACP,WAAK,UAAU,IAAI,UAAU;AAC7B,WAAK,QAAQ,UAAU,IAAI,UAAU;AACrC,WAAK,QAAQ,aAAa,YAAY,EAAE;AACxC,WAAK,aAAa,YAAY,EAAE;AAAA,IACpC,OAAO;AACH,WAAK,UAAU,OAAO,UAAU;AAChC,WAAK,QAAQ,UAAU,OAAO,UAAU;AACxC,WAAK,QAAQ,gBAAgB,UAAU;AACvC,WAAK,gBAAgB,UAAU;AAAA,IACnC;AAAA,EACJ;AAAA,EAEA,IAAI,KAAM,OAAc;AACpB,SAAK,cAAc,QAAQ,KAAK;AAAA,EACpC;AAAA,EAEA,IAAI,YAAqB;AACrB,WAAO,CAAC,CAAE,KAAK,QAAQ,aAAa,WAAW;AAAA,EACnD;AAAA,EAEA,IAAI,UAAW,OAAe;AAE1B,QAAI,KAAK,aAAa,WAAW,MAAM,OAAO;AAC1C,WAAK,gBAAgB,aAAa,KAAK;AAAA,IAC3C;AACA,SAAK,QAAQ,gBAAgB,aAAa,KAAK;AAAA,EACnD;AAAA;AAAA;AAAA;AAAA,EAKA,cAAe,MAAa,OAAgC;AACxD,QAAI,UAAU,OAAO;AAEjB,WAAK,iBAAiB,IAAI;AAC1B,WAAK,QAAQ,gBAAgB,IAAI;AAAA,IACrC,OAAO;AACH,UAAI,UAAU,MAAM;AAEhB,eAAO,KAAK,QAAQ,aAAa,MAAM,EAAE;AAAA,MAC7C;AAEA,UAAI,UAAU,MAAM;AAEhB,eAAO,KAAK,iBAAiB,IAAI;AAAA,MACrC;AAGA,WAAK,QAAQ,aAAa,MAAM,KAAK;AAAA,IACzC;AAAA,EACJ;AAAA;AAAA;AAAA;AAAA,EAKA,iBAAkB,MAAa;AAC3B,SAAK,gBAAgB,IAAI;AACzB,SAAK,QAAQ,gBAAgB,IAAI;AAAA,EACrC;AAAA,EAEA,IAAI,SAAiC;AACjC,WAAO,KAAK,cAAc,QAAQ;AAAA,EACtC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASA,uBAAwB,WAAkB,UAAsB;AAC5D,SAAK,QAAQ,gBAAgB,aAAa,aAAa,IAAI;AAAA,EAC/D;AAAA,EAEA,sBAAuB,MAAkB,UAAsB;AAC3D,UAAM,aAAa,aAAa;AAChC,QAAI,YAAY;AACZ,WAAK,QAAQ,aAAa,YAAY,EAAE;AACxC,WAAK,QAAQ,aAAa,iBAAiB,MAAM;AAAA,IACrD,OAAO;AACH,WAAK,QAAQ,gBAAgB,UAAU;AACvC,WAAK,QAAQ,aAAa,iBAAiB,OAAO;AAAA,IACtD;AAAA,EACJ;AAAA,EAEA,sBAAuB,GAAG,UAAkB;AACxC,QAAI,aAAa,MAAM;AACnB,WAAK,UAAU,IAAI,UAAU;AAC7B,WAAK,QAAQ,UAAU,IAAI,UAAU;AACrC,WAAK,QAAQ,aAAa,YAAY,EAAE;AACxC,WAAK,QAAQ,aAAa,aAAa,MAAM;AAAA,IACjD,OAAO;AACH,WAAK,UAAU,OAAO,UAAU;AAChC,WAAK,QAAQ,UAAU,OAAO,UAAU;AACxC,WAAK,QAAQ,gBAAgB,UAAU;AACvC,WAAK,QAAQ,aAAa,aAAa,OAAO;AAAA,IAClD;AAAA,EACJ;AAAA,EAEA,oBAAqB;AAEjB,SAAK,OAAO;AACZ,SAAK,uBAAuB;AAAA,EAChC;AAAA,EAEA,yBAA0B;AAEtB,SAAK,QAAQ,iBAAiB,WAAW,CAAC,MAAoB;AAC1D,UAAI,EAAE,QAAQ,OAAO,EAAE,QAAQ,SAAS;AACpC,UAAE,eAAe;AACjB,aAAK,QAAQ,MAAM;AAAA,MACvB;AAAA,IACJ,CAAC;AAAA,EACL;AAAA,EAEA,SAAU;AAAA,EAEV;AACJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/client.min.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var n=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var
|
|
1
|
+
"use strict";var n=Object.defineProperty;var a=Object.getOwnPropertyDescriptor;var l=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var o=(i,t)=>n(i,"name",{value:t,configurable:!0});var h=(i,t)=>{for(var e in t)n(i,e,{get:t[e],enumerable:!0})},g=(i,t,e,b)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of l(t))!d.call(i,s)&&s!==e&&n(i,s,{get:()=>t[s],enumerable:!(b=a(t,s))||b.enumerable});return i};var A=i=>g(n({},"__esModule",{value:!0}),i);var c={};h(c,{SubstrateButton:()=>u});module.exports=A(c);var r=require("@substrate-system/web-component");class u extends r.WebComponent.create("substrate-button"){static{o(this,"SubstrateButton")}static observedAttributes=["autofocus","disabled","spinning"];static TAG="substrate-button";_isSpinning;static define(){(0,r.define)(u.TAG,u)}constructor(){super(),this.getAttribute("disabled")!==null&&setTimeout(()=>{this.disabled=!0},0),this.autofocus=this.getAttribute("autofocus")!==null,this._isSpinning=this.getAttribute("spinning")!==null}get form(){return this.button?.form}get disabled(){return!!this.button?.hasAttribute("disabled")}set disabled(t){this.hasAttribute("disabled")!==t&&this.toggleAttribute("disabled",t),t?(this.button?.setAttribute("disabled",""),this.button?.setAttribute("aria-disabled","true")):(this.button?.removeAttribute("disabled"),this.button?.setAttribute("aria-disabled","false"))}get type(){return this.button?.getAttribute("type")}get tabindex(){const t=this.button?.getAttribute("tabindex");return t?parseInt(t):0}get spinning(){return this._isSpinning}set spinning(t){t?(this.classList.add("spinning"),this.button?.classList.add("spinning"),this.button?.setAttribute("disabled",""),this.setAttribute("spinning","")):(this.classList.remove("spinning"),this.button?.classList.remove("spinning"),this.button?.removeAttribute("disabled"),this.removeAttribute("spinning"))}set type(t){this._setAttribute("type",t)}get autofocus(){return!!this.button?.hasAttribute("autofocus")}set autofocus(t){this.hasAttribute("autofocus")!==t&&this.toggleAttribute("autofocus",t),this.button?.toggleAttribute("autofocus",t)}_setAttribute(t,e){if(e===!1)this._removeAttribute(t),this.button?.removeAttribute(t);else{if(e===!0)return this.button?.setAttribute(t,"");if(e===null)return this._removeAttribute(t);this.button?.setAttribute(t,e)}}_removeAttribute(t){this.removeAttribute(t),this.button?.removeAttribute(t)}get button(){return this.querySelector("button")}handleChange_autofocus(t,e){this.button?.toggleAttribute("autofocus",e!==null)}handleChange_disabled(t,e){e!==null?(this.button?.setAttribute("disabled",""),this.button?.setAttribute("aria-disabled","true")):(this.button?.removeAttribute("disabled"),this.button?.setAttribute("aria-disabled","false"))}handleChange_spinning(t,e){e!==null?(this.classList.add("spinning"),this.button?.classList.add("spinning"),this.button?.setAttribute("disabled",""),this.button?.setAttribute("aria-busy","true")):(this.classList.remove("spinning"),this.button?.classList.remove("spinning"),this.button?.removeAttribute("disabled"),this.button?.setAttribute("aria-busy","false"))}connectedCallback(){this.render(),this._setupKeyboardHandlers()}_setupKeyboardHandlers(){this.button?.addEventListener("keydown",t=>{(t.key===" "||t.key==="Enter")&&(t.preventDefault(),this.button?.click())})}render(){}}
|
|
2
2
|
//# sourceMappingURL=client.min.cjs.map
|
package/dist/client.min.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/client.ts"],
|
|
4
|
-
"sourcesContent": ["import { WebComponent, define } from '@substrate-system/web-component'\n\n// for docuement.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'substrate-button': SubstrateButton\n }\n}\n\n/**\n * This is the lightweight version for browsers.\n * It \"hydrates\" only, meaining sets up event listeners.\n * It does not know how to render itself.\n */\n\nexport class SubstrateButton extends WebComponent.create('substrate-button') {\n // for `attributeChangedCallback`\n static observedAttributes = ['autofocus', 'disabled', 'spinning']\n static TAG = 'substrate-button'\n _isSpinning:boolean\n\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n constructor () {\n super()\n const disabled = this.getAttribute('disabled')\n if (disabled !== null) {\n setTimeout(() => {\n // need to wait for it to render\n this.disabled = true\n }, 0)\n }\n this.autofocus = (this.getAttribute('autofocus') !== null)\n this._isSpinning = (this.getAttribute('spinning') !== null)\n }\n\n get form ():HTMLFormElement|undefined|null {\n return this.button?.form\n }\n\n get disabled ():boolean {\n return !!(this.button?.hasAttribute('disabled'))\n }\n\n set disabled (disabledValue:boolean) {\n if (!disabledValue) {\n this.
|
|
5
|
-
"mappings": "4dAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,qBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAqC,2CAe9B,MAAMC,UAAwB,eAAa,OAAO,kBAAkB,CAAE,CAf7E,MAe6E,CAAAC,EAAA,wBAEzE,OAAO,mBAAqB,CAAC,YAAa,WAAY,UAAU,EAChE,OAAO,IAAM,mBACb,YAEA,OAAO,QAAU,IACb,UAAOD,EAAgB,IAAKA,CAAe,CAC/C,CAEA,aAAe,CACX,MAAM,EACW,KAAK,aAAa,UAAU,IAC5B,MACb,WAAW,IAAM,CAEb,KAAK,SAAW,EACpB,EAAG,CAAC,EAER,KAAK,UAAa,KAAK,aAAa,WAAW,IAAM,KACrD,KAAK,YAAe,KAAK,aAAa,UAAU,IAAM,IAC1D,CAEA,IAAI,MAAuC,CACvC,OAAO,KAAK,QAAQ,IACxB,CAEA,IAAI,UAAoB,CACpB,MAAO,CAAC,CAAE,KAAK,QAAQ,aAAa,UAAU,CAClD,CAEA,IAAI,SAAUE,EAAuB,
|
|
4
|
+
"sourcesContent": ["import { WebComponent, define } from '@substrate-system/web-component'\n\n// for docuement.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'substrate-button': SubstrateButton\n }\n}\n\n/**\n * This is the lightweight version for browsers.\n * It \"hydrates\" only, meaining sets up event listeners.\n * It does not know how to render itself.\n */\n\nexport class SubstrateButton extends WebComponent.create('substrate-button') {\n // for `attributeChangedCallback`\n static observedAttributes = ['autofocus', 'disabled', 'spinning']\n static TAG = 'substrate-button'\n _isSpinning:boolean\n\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n constructor () {\n super()\n const disabled = this.getAttribute('disabled')\n if (disabled !== null) {\n setTimeout(() => {\n // need to wait for it to render\n this.disabled = true\n }, 0)\n }\n this.autofocus = (this.getAttribute('autofocus') !== null)\n this._isSpinning = (this.getAttribute('spinning') !== null)\n }\n\n get form ():HTMLFormElement|undefined|null {\n return this.button?.form\n }\n\n get disabled ():boolean {\n return !!(this.button?.hasAttribute('disabled'))\n }\n\n set disabled (disabledValue:boolean) {\n // Reflect to host attribute; guard against re-entrancy\n if (this.hasAttribute('disabled') !== disabledValue) {\n this.toggleAttribute('disabled', disabledValue)\n }\n if (!disabledValue) {\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-disabled', 'false')\n } else {\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-disabled', 'true')\n }\n }\n\n get type ():string|null|undefined {\n return this.button?.getAttribute('type')\n }\n\n get tabindex ():number {\n const i = this.button?.getAttribute('tabindex')\n if (!i) return 0\n return parseInt(i)\n }\n\n get spinning ():boolean {\n return this._isSpinning\n }\n\n set spinning (value:boolean) {\n if (value) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.setAttribute('spinning', '')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.removeAttribute('spinning')\n }\n }\n\n set type (value:string) {\n this._setAttribute('type', value)\n }\n\n get autofocus ():boolean {\n return !!(this.button?.hasAttribute('autofocus'))\n }\n\n set autofocus (value:boolean) {\n // Reflect to host attribute; guard against re-entrancy\n if (this.hasAttribute('autofocus') !== value) {\n this.toggleAttribute('autofocus', value)\n }\n this.button?.toggleAttribute('autofocus', value)\n }\n\n /**\n * Set attributes on the internal button element.\n */\n _setAttribute (name:string, value:boolean|string|null):void {\n if (value === false) {\n // false means remove the attribute\n this._removeAttribute(name)\n this.button?.removeAttribute(name)\n } else {\n if (value === true) {\n // true means set the attribute with no value\n return this.button?.setAttribute(name, '')\n }\n\n if (value === null) {\n // null means remove\n return this._removeAttribute(name)\n }\n\n // else, set value to a string\n this.button?.setAttribute(name, value)\n }\n }\n\n /**\n * Remove from `this` and also button child.\n */\n _removeAttribute (name:string) {\n this.removeAttribute(name)\n this.button?.removeAttribute(name)\n }\n\n get button ():HTMLButtonElement|null {\n return this.querySelector('button')\n }\n\n /**\n * Handle 'autofocus' attribute changes\n * @see {@link https://gomakethings.com/how-to-detect-when-attributes-change-on-a-web-component/#organizing-your-code Go Make Things article}\n *\n * @param {string} oldValue The old attribute value\n * @param {string} newValue The new attribute value\n */\n handleChange_autofocus (_oldValue:string, newValue:string|null) {\n this.button?.toggleAttribute('autofocus', newValue !== null)\n }\n\n handleChange_disabled (_old:string|null, newValue:string|null) {\n const isDisabled = newValue !== null\n if (isDisabled) {\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-disabled', 'true')\n } else {\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-disabled', 'false')\n }\n }\n\n handleChange_spinning (_, newValue:boolean) {\n if (newValue !== null) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-busy', 'true')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-busy', 'false')\n }\n }\n\n connectedCallback () {\n // connect event listeners\n this.render()\n this._setupKeyboardHandlers()\n }\n\n _setupKeyboardHandlers () {\n // Space and Enter should trigger click\n this.button?.addEventListener('keydown', (e:KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n e.preventDefault()\n this.button?.click()\n }\n })\n }\n\n render () {\n // noop\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["client_exports", "__export", "SubstrateButton", "__toCommonJS", "import_web_component", "SubstrateButton", "__name", "disabledValue", "i", "value", "name", "_oldValue", "newValue", "_old", "_", "e"]
|
|
7
7
|
}
|
package/dist/client.min.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
var _=Object.defineProperty;var s=(i,t)=>_(i,"name",{value:t,configurable:!0});var E=Object.defineProperty,L=s((i,t)=>E(i,"name",{value:t,configurable:!0}),"__name");function b(i){return Object.keys(i).reduce((t,e)=>{let n=i[e];return n?typeof n=="boolean"?n?(t+` ${e}`).trim():t:Array.isArray(n)?t+` ${e}="${n.join(" ")}"`:(t+` ${e}="${n}"`).trim():t},"")}s(b,"toAttributes");L(b,"toAttributes");var y=Object.defineProperty,d=s((i,t)=>y(i,"name",{value:t,configurable:!0}),"__name");function h(i){return document.createElement(i).constructor!==window.HTMLElement}s(h,"isRegistered");d(h,"isRegistered");function w(i,t){window&&"customElements"in window&&(h(i)||window.customElements.define(i,t))}s(w,"define");d(w,"define");var S=document.querySelector.bind(document),q=document.querySelectorAll.bind(document);function l(i,t){return i.matches||(i=i.parentElement),i.matches(t)?i:i.closest(t)}s(l,"match");d(l,"match");var T=Object.defineProperty,a=s((i,t)=>T(i,"name",{value:t,configurable:!0}),"__name"),o=class i extends window.HTMLElement{static{s(this,"WebComponent")}static{a(this,"WebComponent")}static TAG="";TAG="";static match(t){return l(t,this.TAG)}_globalWildcardListeners=new Set;_namespacedWildcardListeners=new Set;static create(t){let e=class extends i{static{s(this,"CreatedClass")}static{a(this,"CreatedClass")}static TAG=t;TAG=t;render(){throw new Error("`render` should be implemented by children")}};return e.define=function(){return i.define.call(this)},e.event=function(n){return i.event.call(this,n)},e}static define(){u(this.TAG,this)}async attributeChangedCallback(t,e,n){let r=this[`handleChange_${t}`];r&&await r.call(this,e,n)}addEventListener(t,e,n){t===i.event.call(this,"*")?this._namespacedWildcardListeners.add({listener:e,options:n}):t==="*"?e&&this._globalWildcardListeners.add({listener:e,options:n}):super.addEventListener(t,e,n)}_notifyNamespacedWildcardListeners(t){if(this._namespacedWildcardListeners.size===0)return;let e=this.TAG;!e||!t.type.startsWith(`${e}:`)||this._namespacedWildcardListeners.forEach(({listener:n})=>{try{typeof n=="function"?n.call(this,t):n&&typeof n.handleEvent=="function"&&n.handleEvent(t)}catch(r){console.error("Error in namespaced wildcard event listener:",r)}})}_notifyGlobalWildcardListeners(t){this._globalWildcardListeners.size!==0&&this._globalWildcardListeners.forEach(({listener:e})=>{try{typeof e=="function"?e.call(this,t):e&&typeof e.handleEvent=="function"&&e.handleEvent(t)}catch(n){console.error("Error in global wildcard event listener:",n)}})}connectedCallback(){this.render()}qs(t){return this.querySelector(t)}qsa(t){return this.querySelectorAll(t)}static event(t){return f(this.TAG,t)}emit(t,e={}){if(t==="*")throw new Error('Do not emit the literal "*"');let{bubbles:n=!0,cancelable:r=!0,detail:p}=e,A=`${this.TAG}:${t}`,c=new CustomEvent(A,{bubbles:n,cancelable:r,detail:p}),v=this.dispatchEvent(c);return this._notifyNamespacedWildcardListeners(c),v}dispatchEvent(t){let e=super.dispatchEvent(t);return this._notifyGlobalWildcardListeners(t),e}dispatch(t,e={}){let n=new CustomEvent(t,{bubbles:e.bubbles===void 0?!0:e.bubbles,cancelable:e.cancelable===void 0?!0:e.cancelable,detail:e.detail});return this.dispatchEvent(n)}on(t,e,n){let r=i.event.call(this,t);this.addEventListener(r,e,n)}removeEventListener(t,e,n){if(t===i.event.call(this,"*")){if(e&&this._namespacedWildcardListeners){for(let r of this._namespacedWildcardListeners)if(r.listener===e){this._namespacedWildcardListeners.delete(r);break}}}else if(t==="*"){if(e&&this._globalWildcardListeners){for(let r of this._globalWildcardListeners)if(r.listener===e){this._globalWildcardListeners.delete(r);break}}}else super.removeEventListener(t,e,n)}};function f(i,t){return`${i}:${t}`}s(f,"eventName");a(f,"eventName");function m(i){return document.createElement(i).constructor!==window.HTMLElement}s(m,"isRegistered");a(m,"isRegistered");function u(i,t){window&&"customElements"in window&&(m(i)||window.customElements.define(i,t))}s(u,"define");a(u,"define");var g=class i extends o.create("substrate-button"){static{s(this,"SubstrateButton")}static observedAttributes=["autofocus","disabled","spinning"];static TAG="substrate-button";_isSpinning;static define(){u(i.TAG,i)}constructor(){super(),this.getAttribute("disabled")!==null&&setTimeout(()=>{this.disabled=!0},0),this.autofocus=this.getAttribute("autofocus")!==null,this._isSpinning=this.getAttribute("spinning")!==null}get form(){return this.button?.form}get disabled(){return!!this.button?.hasAttribute("disabled")}set disabled(t){t?(this.button?.setAttribute("disabled",""),this.button?.setAttribute("aria-disabled","true")):(this.
|
|
1
|
+
var _=Object.defineProperty;var s=(i,t)=>_(i,"name",{value:t,configurable:!0});var E=Object.defineProperty,L=s((i,t)=>E(i,"name",{value:t,configurable:!0}),"__name");function b(i){return Object.keys(i).reduce((t,e)=>{let n=i[e];return n?typeof n=="boolean"?n?(t+` ${e}`).trim():t:Array.isArray(n)?t+` ${e}="${n.join(" ")}"`:(t+` ${e}="${n}"`).trim():t},"")}s(b,"toAttributes");L(b,"toAttributes");var y=Object.defineProperty,d=s((i,t)=>y(i,"name",{value:t,configurable:!0}),"__name");function h(i){return document.createElement(i).constructor!==window.HTMLElement}s(h,"isRegistered");d(h,"isRegistered");function w(i,t){window&&"customElements"in window&&(h(i)||window.customElements.define(i,t))}s(w,"define");d(w,"define");var S=document.querySelector.bind(document),q=document.querySelectorAll.bind(document);function l(i,t){return i.matches||(i=i.parentElement),i.matches(t)?i:i.closest(t)}s(l,"match");d(l,"match");var T=Object.defineProperty,a=s((i,t)=>T(i,"name",{value:t,configurable:!0}),"__name"),o=class i extends window.HTMLElement{static{s(this,"WebComponent")}static{a(this,"WebComponent")}static TAG="";TAG="";static match(t){return l(t,this.TAG)}_globalWildcardListeners=new Set;_namespacedWildcardListeners=new Set;static create(t){let e=class extends i{static{s(this,"CreatedClass")}static{a(this,"CreatedClass")}static TAG=t;TAG=t;render(){throw new Error("`render` should be implemented by children")}};return e.define=function(){return i.define.call(this)},e.event=function(n){return i.event.call(this,n)},e}static define(){u(this.TAG,this)}async attributeChangedCallback(t,e,n){let r=this[`handleChange_${t}`];r&&await r.call(this,e,n)}addEventListener(t,e,n){t===i.event.call(this,"*")?this._namespacedWildcardListeners.add({listener:e,options:n}):t==="*"?e&&this._globalWildcardListeners.add({listener:e,options:n}):super.addEventListener(t,e,n)}_notifyNamespacedWildcardListeners(t){if(this._namespacedWildcardListeners.size===0)return;let e=this.TAG;!e||!t.type.startsWith(`${e}:`)||this._namespacedWildcardListeners.forEach(({listener:n})=>{try{typeof n=="function"?n.call(this,t):n&&typeof n.handleEvent=="function"&&n.handleEvent(t)}catch(r){console.error("Error in namespaced wildcard event listener:",r)}})}_notifyGlobalWildcardListeners(t){this._globalWildcardListeners.size!==0&&this._globalWildcardListeners.forEach(({listener:e})=>{try{typeof e=="function"?e.call(this,t):e&&typeof e.handleEvent=="function"&&e.handleEvent(t)}catch(n){console.error("Error in global wildcard event listener:",n)}})}connectedCallback(){this.render()}qs(t){return this.querySelector(t)}qsa(t){return this.querySelectorAll(t)}static event(t){return f(this.TAG,t)}emit(t,e={}){if(t==="*")throw new Error('Do not emit the literal "*"');let{bubbles:n=!0,cancelable:r=!0,detail:p}=e,A=`${this.TAG}:${t}`,c=new CustomEvent(A,{bubbles:n,cancelable:r,detail:p}),v=this.dispatchEvent(c);return this._notifyNamespacedWildcardListeners(c),v}dispatchEvent(t){let e=super.dispatchEvent(t);return this._notifyGlobalWildcardListeners(t),e}dispatch(t,e={}){let n=new CustomEvent(t,{bubbles:e.bubbles===void 0?!0:e.bubbles,cancelable:e.cancelable===void 0?!0:e.cancelable,detail:e.detail});return this.dispatchEvent(n)}on(t,e,n){let r=i.event.call(this,t);this.addEventListener(r,e,n)}removeEventListener(t,e,n){if(t===i.event.call(this,"*")){if(e&&this._namespacedWildcardListeners){for(let r of this._namespacedWildcardListeners)if(r.listener===e){this._namespacedWildcardListeners.delete(r);break}}}else if(t==="*"){if(e&&this._globalWildcardListeners){for(let r of this._globalWildcardListeners)if(r.listener===e){this._globalWildcardListeners.delete(r);break}}}else super.removeEventListener(t,e,n)}};function f(i,t){return`${i}:${t}`}s(f,"eventName");a(f,"eventName");function m(i){return document.createElement(i).constructor!==window.HTMLElement}s(m,"isRegistered");a(m,"isRegistered");function u(i,t){window&&"customElements"in window&&(m(i)||window.customElements.define(i,t))}s(u,"define");a(u,"define");var g=class i extends o.create("substrate-button"){static{s(this,"SubstrateButton")}static observedAttributes=["autofocus","disabled","spinning"];static TAG="substrate-button";_isSpinning;static define(){u(i.TAG,i)}constructor(){super(),this.getAttribute("disabled")!==null&&setTimeout(()=>{this.disabled=!0},0),this.autofocus=this.getAttribute("autofocus")!==null,this._isSpinning=this.getAttribute("spinning")!==null}get form(){return this.button?.form}get disabled(){return!!this.button?.hasAttribute("disabled")}set disabled(t){this.hasAttribute("disabled")!==t&&this.toggleAttribute("disabled",t),t?(this.button?.setAttribute("disabled",""),this.button?.setAttribute("aria-disabled","true")):(this.button?.removeAttribute("disabled"),this.button?.setAttribute("aria-disabled","false"))}get type(){return this.button?.getAttribute("type")}get tabindex(){let t=this.button?.getAttribute("tabindex");return t?parseInt(t):0}get spinning(){return this._isSpinning}set spinning(t){t?(this.classList.add("spinning"),this.button?.classList.add("spinning"),this.button?.setAttribute("disabled",""),this.setAttribute("spinning","")):(this.classList.remove("spinning"),this.button?.classList.remove("spinning"),this.button?.removeAttribute("disabled"),this.removeAttribute("spinning"))}set type(t){this._setAttribute("type",t)}get autofocus(){return!!this.button?.hasAttribute("autofocus")}set autofocus(t){this.hasAttribute("autofocus")!==t&&this.toggleAttribute("autofocus",t),this.button?.toggleAttribute("autofocus",t)}_setAttribute(t,e){if(e===!1)this._removeAttribute(t),this.button?.removeAttribute(t);else{if(e===!0)return this.button?.setAttribute(t,"");if(e===null)return this._removeAttribute(t);this.button?.setAttribute(t,e)}}_removeAttribute(t){this.removeAttribute(t),this.button?.removeAttribute(t)}get button(){return this.querySelector("button")}handleChange_autofocus(t,e){this.button?.toggleAttribute("autofocus",e!==null)}handleChange_disabled(t,e){e!==null?(this.button?.setAttribute("disabled",""),this.button?.setAttribute("aria-disabled","true")):(this.button?.removeAttribute("disabled"),this.button?.setAttribute("aria-disabled","false"))}handleChange_spinning(t,e){e!==null?(this.classList.add("spinning"),this.button?.classList.add("spinning"),this.button?.setAttribute("disabled",""),this.button?.setAttribute("aria-busy","true")):(this.classList.remove("spinning"),this.button?.classList.remove("spinning"),this.button?.removeAttribute("disabled"),this.button?.setAttribute("aria-busy","false"))}connectedCallback(){this.render(),this._setupKeyboardHandlers()}_setupKeyboardHandlers(){this.button?.addEventListener("keydown",t=>{(t.key===" "||t.key==="Enter")&&(t.preventDefault(),this.button?.click())})}render(){}};export{g as SubstrateButton};
|
|
2
2
|
//# sourceMappingURL=client.min.js.map
|
package/dist/client.min.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../node_modules/@substrate-system/web-component/src/attributes.ts", "../node_modules/@substrate-system/web-component/src/util.ts", "../node_modules/@substrate-system/web-component/src/index.ts", "../src/client.ts"],
|
|
4
|
-
"sourcesContent": ["export type Attrs = Record<string, undefined|null|string|number|boolean|(string|number)[]>\n\n/**\n * Transform an object into an HTML attributes string. The object should be\n * like `{ attributeName: value }`.\n *\n * @param attrs An object for the attributes.\n * @returns {string} A string suitable for use as HTML attributes.\n */\nexport function toAttributes (attrs:Attrs):string {\n return Object.keys(attrs).reduce((acc, k) => {\n const value = attrs[k]\n if (!value) return acc\n\n if (typeof value === 'boolean') {\n if (value) return (acc + ` ${k}`).trim()\n return acc\n }\n\n if (Array.isArray(value)) {\n return (acc + ` ${k}=\"${value.join(' ')}\"`)\n }\n\n return (acc + ` ${k}=\"${value}\"`).trim()\n }, '')\n}\n", "export { toAttributes } from './attributes.js'\n\n/**\n * Check if the given tag name has been registered.\n *\n * @see {@link https://stackoverflow.com/a/28210364 stackoverflow}\n * @param {string} elName The custom element tag name.\n * @returns {boolean} True if the given name has been registered already.\n */\nexport function isRegistered (elName:string):boolean {\n return document.createElement(elName).constructor !== window.HTMLElement\n}\n\nexport function define (name:string, element:CustomElementConstructor) {\n if (!window) return\n if (!('customElements' in window)) return\n\n if (!isRegistered(name)) {\n window.customElements.define(name, element)\n }\n}\n\nexport const qs = document.querySelector.bind(document)\nexport const qsa = document.querySelectorAll.bind(document)\n\n/**\n * Get the closes parent element matching the given selector.\n * @param el Element to start from\n * @param s Selector for an element\n * @returns {HTMLElement|null} The closes parent element that matches.\n */\nexport function match (el:HTMLElement, s:string):HTMLElement|null {\n if (!el.matches) el = el.parentElement!\n return el.matches(s) ? el : el.closest(s)\n}\n", "import { match as _match } from './util.js'\n\ninterface WildcardListenerEntry {\n listener:EventListenerOrEventListenerObject\n options?:boolean|AddEventListenerOptions\n}\n\nexport abstract class WebComponent extends window.HTMLElement {\n static TAG:string = ''\n TAG:string = ''\n\n static match (el:HTMLElement):HTMLElement|null {\n return _match(el, this.TAG)\n }\n\n /**\n * Store global wildcard listeners (listen to all events)\n * Triggered by ALL events dispatched through this element\n * @private\n */\n private _globalWildcardListeners:Set<WildcardListenerEntry> = new Set()\n\n /**\n * Store namespaced wildcard listeners (listen to 'component-name:*')\n * Triggered by events from emit() that match this component's namespace\n * @private\n */\n private _namespacedWildcardListeners:Set<WildcardListenerEntry> = new Set()\n\n static create (elementName:string):typeof WebComponent & {\n new (...args:any[]):WebComponent;\n TAG:string;\n define: typeof WebComponent.define;\n event: typeof WebComponent.event;\n } {\n const CreatedClass = class extends WebComponent {\n static TAG = elementName\n TAG = elementName\n render () {\n throw new Error('`render` should be implemented by children')\n }\n }\n\n // Copy static methods with proper binding\n CreatedClass.define = function () {\n return WebComponent.define.call(this)\n }\n CreatedClass.event = function (evType:string) {\n return WebComponent.event.call(this, evType)\n }\n\n return CreatedClass\n }\n\n static define<T extends {\n new (...args:any[]):WebComponent;\n TAG:string;\n }>(this:T) {\n define(this.TAG, this)\n }\n\n /**\n * Runs when the value of an attribute is changed.\n *\n * Depends on `static observedAttributes`.\n *\n * Should name methods like `handleChange_disabled`.\n *\n * @param {string} name The attribute name\n * @param {string} oldValue The old attribute value\n * @param {string} newValue The new attribute value\n */\n async attributeChangedCallback (\n name:string,\n oldValue:string,\n newValue:string\n ):Promise<void> {\n const handler = this[`handleChange_${name}`]\n if (handler) {\n await handler.call(this, oldValue, newValue)\n }\n }\n\n /**\n * Enhanced addEventListener that supports wildcards:\n * - Component.event('*') - Listen to all namespaced events for this\n * component (e.g., 'my-component:*')\n * - '*' - Listen to ALL events (namespaced and non-namespaced, including\n * normal DOM events)\n *\n * @param type - Event type, Component.event('*') for namespaced wildcard,\n * or '*' for global wildcard\n * @param listener - Event listener function or object\n * @param options - Event listener options\n */\n addEventListener (\n type:string,\n listener:EventListenerOrEventListenerObject,\n options?:boolean|AddEventListenerOptions\n ): void {\n if (type === WebComponent.event.call(this, '*')) {\n // Handle namespaced wildcard listener (component-name:*)\n this._namespacedWildcardListeners.add({ listener, options })\n } else if (type === '*') {\n // Handle global wildcard listener (all events)\n if (listener) {\n this._globalWildcardListeners.add({ listener, options })\n }\n } else {\n // Normal event listener - delegate to native implementation\n super.addEventListener(type, listener, options)\n }\n }\n\n /**\n * Notify namespaced wildcard listeners of an event\n * Only fires for events that match this component's namespace\n *\n * @param event - The event to dispatch to namespaced wildcard listeners\n * @private\n */\n private _notifyNamespacedWildcardListeners (event: Event): void {\n if (this._namespacedWildcardListeners.size === 0) {\n return\n }\n\n const componentName = this.TAG\n\n // Only trigger for events in this component's namespace\n if (!componentName || !event.type.startsWith(`${componentName}:`)) {\n return\n }\n\n // Call each namespaced wildcard listener\n this._namespacedWildcardListeners.forEach(({ listener }) => {\n try {\n if (typeof listener === 'function') {\n listener.call(this, event)\n } else if (listener && typeof listener.handleEvent === 'function') {\n listener.handleEvent(event)\n }\n } catch (error) {\n // Log errors but don't let one listener break others\n console.error(\n 'Error in namespaced wildcard event listener:',\n error\n )\n }\n })\n }\n\n /**\n * Notify global wildcard listeners of an event\n * Fires for ALL events dispatched through this element\n *\n * @param event - The event to dispatch to global wildcard listeners\n * @private\n */\n private _notifyGlobalWildcardListeners (event: Event): void {\n if (this._globalWildcardListeners.size === 0) {\n return\n }\n\n // Call each global wildcard listener\n this._globalWildcardListeners.forEach(({ listener }) => {\n try {\n if (typeof listener === 'function') {\n listener.call(this, event)\n } else if (listener && typeof listener.handleEvent === 'function') {\n listener.handleEvent(event)\n }\n } catch (error) {\n // Log errors but don't let one listener break others\n console.error('Error in global wildcard event listener:', error)\n }\n })\n }\n\n connectedCallback () {\n this.render()\n }\n\n abstract render ():any\n\n qs<K extends keyof HTMLElementTagNameMap>(\n selector:K\n ):HTMLElementTagNameMap[K]|null;\n\n qs<E extends Element = Element>(selector:string):E|null;\n qs (selector:string):Element|null {\n return this.querySelector(selector)\n }\n\n qsa<K extends keyof HTMLElementTagNameMap>(\n selector:K\n ):HTMLElementTagNameMap[K]|null;\n\n qsa<E extends Element = Element>(selector:string):E|null;\n qsa (selector:string):NodeListOf<Element> {\n return this.querySelectorAll(selector)\n }\n\n /**\n * Take a non-namepsaced event name, return namespace event name.\n *\n * @param {string} evType The non-namespace event name\n * @returns {string} Namespaced event name, eg, `my-component:click`\n */\n static event (evType:string):string {\n return eventName(this.TAG, evType)\n }\n\n /**\n * Emit a namespaced event.\n *\n * @param type (non-namespaced) event type string\n * @param opts `bubbles`, `detail`, and `cancelable`. Default is\n * `{ bubbles: true, cancelable: true }`\n * @returns {boolean}\n */\n emit<T = any> (type:string, opts:Partial<{\n bubbles:boolean,\n cancelable:boolean,\n detail:CustomEvent<T>['detail']\n }> = {}):boolean {\n if (type === '*') throw new Error('Do not emit the literal \"*\"')\n\n const { bubbles = true, cancelable = true, detail } = opts\n const namespacedType = `${this.TAG}:${type}`\n\n const event = new CustomEvent(namespacedType, {\n bubbles,\n cancelable,\n detail\n })\n\n // This will trigger both specific listeners and global wildcard\n // listeners (**)\n const result = this.dispatchEvent(event)\n\n // Notify namespaced wildcard listeners (*)\n this._notifyNamespacedWildcardListeners(event)\n\n return result\n }\n\n /**\n * Override dispatchEvent to notify global wildcard listeners\n * This ensures that '**' listeners catch ALL events\n *\n * @param event - The event to dispatch\n * @returns true if the event was not cancelled\n */\n dispatchEvent (event: Event): boolean {\n const result = super.dispatchEvent(event)\n\n // Notify global wildcard listeners for ALL events\n this._notifyGlobalWildcardListeners(event)\n\n return result\n }\n\n /**\n * Create and emit an event, no namespacing.\n */\n dispatch<T> (type:string, opts:Partial<{\n bubbles:boolean,\n cancelable:boolean,\n detail:CustomEvent<T>['detail']\n }> = {}):boolean {\n const event = new CustomEvent(type, {\n bubbles: (opts.bubbles === undefined) ? true : opts.bubbles,\n cancelable: (opts.cancelable === undefined) ? true : opts.cancelable,\n detail: opts.detail\n })\n\n return this.dispatchEvent(event)\n }\n\n /**\n * Listen for namespaced events.\n */\n on<T extends Event = Event> (\n evName:string,\n handler:(ev:T)=>any,\n options?:boolean|AddEventListenerOptions\n ):void;\n\n on (\n evName:string,\n handler:EventListenerObject,\n options?:boolean|AddEventListenerOptions\n ):void;\n\n on (\n evName:string,\n handler:((ev:Event)=>any)|EventListenerObject,\n options?:boolean|AddEventListenerOptions\n ):void {\n const fullEvName = WebComponent.event.call(this, evName)\n this.addEventListener(fullEvName, handler as EventListenerOrEventListenerObject, options)\n }\n\n /**\n * Enhanced removeEventListener that supports wildcards:\n * - Component.event('*') - Remove namespaced wildcard listener\n * - '*' - Remove global wildcard listener\n *\n * @param type - Event type, Component.event('*') for namespaced, or '*'\n * for global\n * @param listener - Event listener function or object to remove\n * @param options - Event listener options\n */\n removeEventListener (\n type:string,\n listener:EventListenerOrEventListenerObject,\n options?: boolean | EventListenerOptions\n ): void {\n if (type === WebComponent.event.call(this, '*')) {\n // Remove namespaced wildcard listener\n if (listener && this._namespacedWildcardListeners) {\n for (const entry of this._namespacedWildcardListeners) {\n if (entry.listener === listener) {\n this._namespacedWildcardListeners.delete(entry)\n break\n }\n }\n }\n } else if (type === '*') {\n // Remove global wildcard listener\n if (listener && this._globalWildcardListeners) {\n for (const entry of this._globalWildcardListeners) {\n if (entry.listener === listener) {\n this._globalWildcardListeners.delete(entry)\n break\n }\n }\n }\n } else {\n // Normal event listener - delegate to native implementation\n super.removeEventListener(type, listener, options)\n }\n }\n}\n\nfunction eventName (namespace:string, evType:string) {\n return `${namespace}:${evType}`\n}\n\n/**\n * Check if the given tag name has been registered.\n *\n * @see {@link https://stackoverflow.com/a/28210364 stackoverflow}\n * @param {string} elName The custom element tag name.\n * @returns {boolean} True if the given name has been registered already.\n */\nexport function isRegistered (elName:string):boolean {\n return document.createElement(elName).constructor !== window.HTMLElement\n}\n\nexport function define (name:string, element:CustomElementConstructor) {\n if (!window) return\n if (!('customElements' in window)) return\n\n if (!isRegistered(name)) {\n window.customElements.define(name, element)\n }\n}\n", "import { WebComponent, define } from '@substrate-system/web-component'\n\n// for docuement.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'substrate-button': SubstrateButton\n }\n}\n\n/**\n * This is the lightweight version for browsers.\n * It \"hydrates\" only, meaining sets up event listeners.\n * It does not know how to render itself.\n */\n\nexport class SubstrateButton extends WebComponent.create('substrate-button') {\n // for `attributeChangedCallback`\n static observedAttributes = ['autofocus', 'disabled', 'spinning']\n static TAG = 'substrate-button'\n _isSpinning:boolean\n\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n constructor () {\n super()\n const disabled = this.getAttribute('disabled')\n if (disabled !== null) {\n setTimeout(() => {\n // need to wait for it to render\n this.disabled = true\n }, 0)\n }\n this.autofocus = (this.getAttribute('autofocus') !== null)\n this._isSpinning = (this.getAttribute('spinning') !== null)\n }\n\n get form ():HTMLFormElement|undefined|null {\n return this.button?.form\n }\n\n get disabled ():boolean {\n return !!(this.button?.hasAttribute('disabled'))\n }\n\n set disabled (disabledValue:boolean) {\n if (!disabledValue) {\n this._removeAttribute('disabled')\n this.button?.setAttribute('aria-disabled', 'false')\n } else {\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-disabled', 'true')\n }\n }\n\n get type ():string|null|undefined {\n return this.button?.getAttribute('type')\n }\n\n get tabindex ():number {\n const i = this.button?.getAttribute('tabindex')\n if (!i) return 0\n return parseInt(i)\n }\n\n get spinning ():boolean {\n return this._isSpinning\n }\n\n set spinning (value:boolean) {\n if (value) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.setAttribute('spinning', '')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.removeAttribute('spinning')\n }\n }\n\n set type (value:string) {\n this._setAttribute('type', value)\n }\n\n get autofocus ():boolean {\n return !!(this.button?.hasAttribute('autofocus'))\n }\n\n set autofocus (value:boolean) {\n if (value) {\n this._setAttribute('autofocus', value)\n } else {\n this._removeAttribute('autofocus')\n }\n }\n\n /**\n * Set attributes on the internal button element.\n */\n _setAttribute (name:string, value:boolean|string|null):void {\n if (value === false) {\n // false means remove the attribute\n this._removeAttribute(name)\n this.button?.removeAttribute(name)\n } else {\n if (value === true) {\n // true means set the attribute with no value\n return this.button?.setAttribute(name, '')\n }\n\n if (value === null) {\n // null means remove\n return this._removeAttribute(name)\n }\n\n // else, set value to a string\n this.button?.setAttribute(name, value)\n }\n }\n\n /**\n * Remove from `this` and also button child.\n */\n _removeAttribute (name:string) {\n this.removeAttribute(name)\n this.button?.removeAttribute(name)\n }\n\n get button ():HTMLButtonElement|null {\n return this.querySelector('button')\n }\n\n /**\n * Handle 'autofocus' attribute changes\n * @see {@link https://gomakethings.com/how-to-detect-when-attributes-change-on-a-web-component/#organizing-your-code Go Make Things article}\n *\n * @param {string} oldValue The old attribute value\n * @param {string} newValue The new attribute value\n */\n handleChange_autofocus (_oldValue:string, newValue:string) {\n this._setAttribute('autofocus', newValue)\n }\n\n handleChange_disabled (_old, newValue:boolean|string) {\n this.disabled = (newValue !== null)\n if (newValue === null) this.button?.removeAttribute('disabled')\n else this.button?.setAttribute('disabled', '' + newValue)\n }\n\n handleChange_spinning (_, newValue:boolean) {\n if (newValue !== null) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-busy', 'true')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-busy', 'false')\n }\n }\n\n connectedCallback () {\n // connect event listeners\n this.render()\n this._setupKeyboardHandlers()\n }\n\n _setupKeyboardHandlers () {\n // Space and Enter should trigger click\n this.button?.addEventListener('keydown', (e:KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n e.preventDefault()\n this.button?.click()\n }\n })\n }\n\n render () {\n // noop\n }\n}\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["export type Attrs = Record<string, undefined|null|string|number|boolean|(string|number)[]>\n\n/**\n * Transform an object into an HTML attributes string. The object should be\n * like `{ attributeName: value }`.\n *\n * @param attrs An object for the attributes.\n * @returns {string} A string suitable for use as HTML attributes.\n */\nexport function toAttributes (attrs:Attrs):string {\n return Object.keys(attrs).reduce((acc, k) => {\n const value = attrs[k]\n if (!value) return acc\n\n if (typeof value === 'boolean') {\n if (value) return (acc + ` ${k}`).trim()\n return acc\n }\n\n if (Array.isArray(value)) {\n return (acc + ` ${k}=\"${value.join(' ')}\"`)\n }\n\n return (acc + ` ${k}=\"${value}\"`).trim()\n }, '')\n}\n", "export { toAttributes } from './attributes.js'\n\n/**\n * Check if the given tag name has been registered.\n *\n * @see {@link https://stackoverflow.com/a/28210364 stackoverflow}\n * @param {string} elName The custom element tag name.\n * @returns {boolean} True if the given name has been registered already.\n */\nexport function isRegistered (elName:string):boolean {\n return document.createElement(elName).constructor !== window.HTMLElement\n}\n\nexport function define (name:string, element:CustomElementConstructor) {\n if (!window) return\n if (!('customElements' in window)) return\n\n if (!isRegistered(name)) {\n window.customElements.define(name, element)\n }\n}\n\nexport const qs = document.querySelector.bind(document)\nexport const qsa = document.querySelectorAll.bind(document)\n\n/**\n * Get the closes parent element matching the given selector.\n * @param el Element to start from\n * @param s Selector for an element\n * @returns {HTMLElement|null} The closes parent element that matches.\n */\nexport function match (el:HTMLElement, s:string):HTMLElement|null {\n if (!el.matches) el = el.parentElement!\n return el.matches(s) ? el : el.closest(s)\n}\n", "import { match as _match } from './util.js'\n\ninterface WildcardListenerEntry {\n listener:EventListenerOrEventListenerObject\n options?:boolean|AddEventListenerOptions\n}\n\nexport abstract class WebComponent extends window.HTMLElement {\n static TAG:string = ''\n TAG:string = ''\n\n static match (el:HTMLElement):HTMLElement|null {\n return _match(el, this.TAG)\n }\n\n /**\n * Store global wildcard listeners (listen to all events)\n * Triggered by ALL events dispatched through this element\n * @private\n */\n private _globalWildcardListeners:Set<WildcardListenerEntry> = new Set()\n\n /**\n * Store namespaced wildcard listeners (listen to 'component-name:*')\n * Triggered by events from emit() that match this component's namespace\n * @private\n */\n private _namespacedWildcardListeners:Set<WildcardListenerEntry> = new Set()\n\n static create (elementName:string):typeof WebComponent & {\n new (...args:any[]):WebComponent;\n TAG:string;\n define: typeof WebComponent.define;\n event: typeof WebComponent.event;\n } {\n const CreatedClass = class extends WebComponent {\n static TAG = elementName\n TAG = elementName\n render () {\n throw new Error('`render` should be implemented by children')\n }\n }\n\n // Copy static methods with proper binding\n CreatedClass.define = function () {\n return WebComponent.define.call(this)\n }\n CreatedClass.event = function (evType:string) {\n return WebComponent.event.call(this, evType)\n }\n\n return CreatedClass\n }\n\n static define<T extends {\n new (...args:any[]):WebComponent;\n TAG:string;\n }>(this:T) {\n define(this.TAG, this)\n }\n\n /**\n * Runs when the value of an attribute is changed.\n *\n * Depends on `static observedAttributes`.\n *\n * Should name methods like `handleChange_disabled`.\n *\n * @param {string} name The attribute name\n * @param {string} oldValue The old attribute value\n * @param {string} newValue The new attribute value\n */\n async attributeChangedCallback (\n name:string,\n oldValue:string,\n newValue:string\n ):Promise<void> {\n const handler = this[`handleChange_${name}`]\n if (handler) {\n await handler.call(this, oldValue, newValue)\n }\n }\n\n /**\n * Enhanced addEventListener that supports wildcards:\n * - Component.event('*') - Listen to all namespaced events for this\n * component (e.g., 'my-component:*')\n * - '*' - Listen to ALL events (namespaced and non-namespaced, including\n * normal DOM events)\n *\n * @param type - Event type, Component.event('*') for namespaced wildcard,\n * or '*' for global wildcard\n * @param listener - Event listener function or object\n * @param options - Event listener options\n */\n addEventListener (\n type:string,\n listener:EventListenerOrEventListenerObject,\n options?:boolean|AddEventListenerOptions\n ): void {\n if (type === WebComponent.event.call(this, '*')) {\n // Handle namespaced wildcard listener (component-name:*)\n this._namespacedWildcardListeners.add({ listener, options })\n } else if (type === '*') {\n // Handle global wildcard listener (all events)\n if (listener) {\n this._globalWildcardListeners.add({ listener, options })\n }\n } else {\n // Normal event listener - delegate to native implementation\n super.addEventListener(type, listener, options)\n }\n }\n\n /**\n * Notify namespaced wildcard listeners of an event\n * Only fires for events that match this component's namespace\n *\n * @param event - The event to dispatch to namespaced wildcard listeners\n * @private\n */\n private _notifyNamespacedWildcardListeners (event: Event): void {\n if (this._namespacedWildcardListeners.size === 0) {\n return\n }\n\n const componentName = this.TAG\n\n // Only trigger for events in this component's namespace\n if (!componentName || !event.type.startsWith(`${componentName}:`)) {\n return\n }\n\n // Call each namespaced wildcard listener\n this._namespacedWildcardListeners.forEach(({ listener }) => {\n try {\n if (typeof listener === 'function') {\n listener.call(this, event)\n } else if (listener && typeof listener.handleEvent === 'function') {\n listener.handleEvent(event)\n }\n } catch (error) {\n // Log errors but don't let one listener break others\n console.error(\n 'Error in namespaced wildcard event listener:',\n error\n )\n }\n })\n }\n\n /**\n * Notify global wildcard listeners of an event\n * Fires for ALL events dispatched through this element\n *\n * @param event - The event to dispatch to global wildcard listeners\n * @private\n */\n private _notifyGlobalWildcardListeners (event: Event): void {\n if (this._globalWildcardListeners.size === 0) {\n return\n }\n\n // Call each global wildcard listener\n this._globalWildcardListeners.forEach(({ listener }) => {\n try {\n if (typeof listener === 'function') {\n listener.call(this, event)\n } else if (listener && typeof listener.handleEvent === 'function') {\n listener.handleEvent(event)\n }\n } catch (error) {\n // Log errors but don't let one listener break others\n console.error('Error in global wildcard event listener:', error)\n }\n })\n }\n\n connectedCallback () {\n this.render()\n }\n\n abstract render ():any\n\n qs<K extends keyof HTMLElementTagNameMap>(\n selector:K\n ):HTMLElementTagNameMap[K]|null;\n\n qs<E extends Element = Element>(selector:string):E|null;\n qs (selector:string):Element|null {\n return this.querySelector(selector)\n }\n\n qsa<K extends keyof HTMLElementTagNameMap>(\n selector:K\n ):HTMLElementTagNameMap[K]|null;\n\n qsa<E extends Element = Element>(selector:string):E|null;\n qsa (selector:string):NodeListOf<Element> {\n return this.querySelectorAll(selector)\n }\n\n /**\n * Take a non-namepsaced event name, return namespace event name.\n *\n * @param {string} evType The non-namespace event name\n * @returns {string} Namespaced event name, eg, `my-component:click`\n */\n static event (evType:string):string {\n return eventName(this.TAG, evType)\n }\n\n /**\n * Emit a namespaced event.\n *\n * @param type (non-namespaced) event type string\n * @param opts `bubbles`, `detail`, and `cancelable`. Default is\n * `{ bubbles: true, cancelable: true }`\n * @returns {boolean}\n */\n emit<T = any> (type:string, opts:Partial<{\n bubbles:boolean,\n cancelable:boolean,\n detail:CustomEvent<T>['detail']\n }> = {}):boolean {\n if (type === '*') throw new Error('Do not emit the literal \"*\"')\n\n const { bubbles = true, cancelable = true, detail } = opts\n const namespacedType = `${this.TAG}:${type}`\n\n const event = new CustomEvent(namespacedType, {\n bubbles,\n cancelable,\n detail\n })\n\n // This will trigger both specific listeners and global wildcard\n // listeners (**)\n const result = this.dispatchEvent(event)\n\n // Notify namespaced wildcard listeners (*)\n this._notifyNamespacedWildcardListeners(event)\n\n return result\n }\n\n /**\n * Override dispatchEvent to notify global wildcard listeners\n * This ensures that '**' listeners catch ALL events\n *\n * @param event - The event to dispatch\n * @returns true if the event was not cancelled\n */\n dispatchEvent (event: Event): boolean {\n const result = super.dispatchEvent(event)\n\n // Notify global wildcard listeners for ALL events\n this._notifyGlobalWildcardListeners(event)\n\n return result\n }\n\n /**\n * Create and emit an event, no namespacing.\n */\n dispatch<T> (type:string, opts:Partial<{\n bubbles:boolean,\n cancelable:boolean,\n detail:CustomEvent<T>['detail']\n }> = {}):boolean {\n const event = new CustomEvent(type, {\n bubbles: (opts.bubbles === undefined) ? true : opts.bubbles,\n cancelable: (opts.cancelable === undefined) ? true : opts.cancelable,\n detail: opts.detail\n })\n\n return this.dispatchEvent(event)\n }\n\n /**\n * Listen for namespaced events.\n */\n on<T extends Event = Event> (\n evName:string,\n handler:(ev:T)=>any,\n options?:boolean|AddEventListenerOptions\n ):void;\n\n on (\n evName:string,\n handler:EventListenerObject,\n options?:boolean|AddEventListenerOptions\n ):void;\n\n on (\n evName:string,\n handler:((ev:Event)=>any)|EventListenerObject,\n options?:boolean|AddEventListenerOptions\n ):void {\n const fullEvName = WebComponent.event.call(this, evName)\n this.addEventListener(fullEvName, handler as EventListenerOrEventListenerObject, options)\n }\n\n /**\n * Enhanced removeEventListener that supports wildcards:\n * - Component.event('*') - Remove namespaced wildcard listener\n * - '*' - Remove global wildcard listener\n *\n * @param type - Event type, Component.event('*') for namespaced, or '*'\n * for global\n * @param listener - Event listener function or object to remove\n * @param options - Event listener options\n */\n removeEventListener (\n type:string,\n listener:EventListenerOrEventListenerObject,\n options?: boolean | EventListenerOptions\n ): void {\n if (type === WebComponent.event.call(this, '*')) {\n // Remove namespaced wildcard listener\n if (listener && this._namespacedWildcardListeners) {\n for (const entry of this._namespacedWildcardListeners) {\n if (entry.listener === listener) {\n this._namespacedWildcardListeners.delete(entry)\n break\n }\n }\n }\n } else if (type === '*') {\n // Remove global wildcard listener\n if (listener && this._globalWildcardListeners) {\n for (const entry of this._globalWildcardListeners) {\n if (entry.listener === listener) {\n this._globalWildcardListeners.delete(entry)\n break\n }\n }\n }\n } else {\n // Normal event listener - delegate to native implementation\n super.removeEventListener(type, listener, options)\n }\n }\n}\n\nfunction eventName (namespace:string, evType:string) {\n return `${namespace}:${evType}`\n}\n\n/**\n * Check if the given tag name has been registered.\n *\n * @see {@link https://stackoverflow.com/a/28210364 stackoverflow}\n * @param {string} elName The custom element tag name.\n * @returns {boolean} True if the given name has been registered already.\n */\nexport function isRegistered (elName:string):boolean {\n return document.createElement(elName).constructor !== window.HTMLElement\n}\n\nexport function define (name:string, element:CustomElementConstructor) {\n if (!window) return\n if (!('customElements' in window)) return\n\n if (!isRegistered(name)) {\n window.customElements.define(name, element)\n }\n}\n", "import { WebComponent, define } from '@substrate-system/web-component'\n\n// for docuement.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'substrate-button': SubstrateButton\n }\n}\n\n/**\n * This is the lightweight version for browsers.\n * It \"hydrates\" only, meaining sets up event listeners.\n * It does not know how to render itself.\n */\n\nexport class SubstrateButton extends WebComponent.create('substrate-button') {\n // for `attributeChangedCallback`\n static observedAttributes = ['autofocus', 'disabled', 'spinning']\n static TAG = 'substrate-button'\n _isSpinning:boolean\n\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n constructor () {\n super()\n const disabled = this.getAttribute('disabled')\n if (disabled !== null) {\n setTimeout(() => {\n // need to wait for it to render\n this.disabled = true\n }, 0)\n }\n this.autofocus = (this.getAttribute('autofocus') !== null)\n this._isSpinning = (this.getAttribute('spinning') !== null)\n }\n\n get form ():HTMLFormElement|undefined|null {\n return this.button?.form\n }\n\n get disabled ():boolean {\n return !!(this.button?.hasAttribute('disabled'))\n }\n\n set disabled (disabledValue:boolean) {\n // Reflect to host attribute; guard against re-entrancy\n if (this.hasAttribute('disabled') !== disabledValue) {\n this.toggleAttribute('disabled', disabledValue)\n }\n if (!disabledValue) {\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-disabled', 'false')\n } else {\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-disabled', 'true')\n }\n }\n\n get type ():string|null|undefined {\n return this.button?.getAttribute('type')\n }\n\n get tabindex ():number {\n const i = this.button?.getAttribute('tabindex')\n if (!i) return 0\n return parseInt(i)\n }\n\n get spinning ():boolean {\n return this._isSpinning\n }\n\n set spinning (value:boolean) {\n if (value) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.setAttribute('spinning', '')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.removeAttribute('spinning')\n }\n }\n\n set type (value:string) {\n this._setAttribute('type', value)\n }\n\n get autofocus ():boolean {\n return !!(this.button?.hasAttribute('autofocus'))\n }\n\n set autofocus (value:boolean) {\n // Reflect to host attribute; guard against re-entrancy\n if (this.hasAttribute('autofocus') !== value) {\n this.toggleAttribute('autofocus', value)\n }\n this.button?.toggleAttribute('autofocus', value)\n }\n\n /**\n * Set attributes on the internal button element.\n */\n _setAttribute (name:string, value:boolean|string|null):void {\n if (value === false) {\n // false means remove the attribute\n this._removeAttribute(name)\n this.button?.removeAttribute(name)\n } else {\n if (value === true) {\n // true means set the attribute with no value\n return this.button?.setAttribute(name, '')\n }\n\n if (value === null) {\n // null means remove\n return this._removeAttribute(name)\n }\n\n // else, set value to a string\n this.button?.setAttribute(name, value)\n }\n }\n\n /**\n * Remove from `this` and also button child.\n */\n _removeAttribute (name:string) {\n this.removeAttribute(name)\n this.button?.removeAttribute(name)\n }\n\n get button ():HTMLButtonElement|null {\n return this.querySelector('button')\n }\n\n /**\n * Handle 'autofocus' attribute changes\n * @see {@link https://gomakethings.com/how-to-detect-when-attributes-change-on-a-web-component/#organizing-your-code Go Make Things article}\n *\n * @param {string} oldValue The old attribute value\n * @param {string} newValue The new attribute value\n */\n handleChange_autofocus (_oldValue:string, newValue:string|null) {\n this.button?.toggleAttribute('autofocus', newValue !== null)\n }\n\n handleChange_disabled (_old:string|null, newValue:string|null) {\n const isDisabled = newValue !== null\n if (isDisabled) {\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-disabled', 'true')\n } else {\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-disabled', 'false')\n }\n }\n\n handleChange_spinning (_, newValue:boolean) {\n if (newValue !== null) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-busy', 'true')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-busy', 'false')\n }\n }\n\n connectedCallback () {\n // connect event listeners\n this.render()\n this._setupKeyboardHandlers()\n }\n\n _setupKeyboardHandlers () {\n // Space and Enter should trigger click\n this.button?.addEventListener('keydown', (e:KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n e.preventDefault()\n this.button?.click()\n }\n })\n }\n\n render () {\n // noop\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["toAttributes", "attrs", "acc", "k", "value", "__name", "isRegistered", "elName", "__name", "define", "name", "element", "qs", "qsa", "match", "el", "s", "WebComponent", "_WebComponent", "__name", "el", "match", "elementName", "CreatedClass", "evType", "define", "name", "oldValue", "newValue", "handler", "type", "listener", "options", "event", "componentName", "error", "selector", "eventName", "opts", "bubbles", "cancelable", "detail", "namespacedType", "result", "evName", "fullEvName", "entry", "namespace", "isRegistered", "elName", "element", "SubstrateButton", "_SubstrateButton", "WebComponent", "__name", "define", "disabledValue", "i", "value", "name", "_oldValue", "newValue", "_old", "_", "e"]
|
|
7
7
|
}
|
package/dist/index.cjs
CHANGED
|
@@ -37,12 +37,10 @@ class SubstrateButton extends import_client.SubstrateButton {
|
|
|
37
37
|
this._setupKeyboardHandlers();
|
|
38
38
|
}
|
|
39
39
|
render() {
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
disabled
|
|
45
|
-
} = this;
|
|
40
|
+
if (this.querySelector("button")) return;
|
|
41
|
+
const { type, tabindex } = this;
|
|
42
|
+
const disabled = this.hasAttribute("disabled");
|
|
43
|
+
const autofocus = this.hasAttribute("autofocus");
|
|
46
44
|
const name = this.getAttribute("name");
|
|
47
45
|
const ariaLabel = this.getAttribute("aria-label");
|
|
48
46
|
const spinning = this.getAttribute("spinning") !== null;
|
package/dist/index.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/index.ts"],
|
|
4
|
-
"sourcesContent": ["import { html } from './html.js'\nimport { define } from '@substrate-system/web-component'\nimport { SubstrateButton as SubstrateButtonLight } from './client.js'\n// import Debug from '@substrate-system/debug'\n// const debug = Debug('button')\n\n/**\n * This is the full-version -- knows how to render itself in the browser.\n */\nexport class SubstrateButton extends SubstrateButtonLight {\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n connectedCallback ():void {\n this.render()\n this._setupKeyboardHandlers()\n }\n\n render () {\n const {\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAqB;AACrB,2BAAuB;AACvB,oBAAwD;AAOjD,MAAM,wBAAwB,cAAAA,gBAAqB;AAAA,EAT1D,OAS0D;AAAA;AAAA;AAAA,EACtD,OAAO,SAAU;AACb,qCAAO,gBAAgB,KAAK,eAAe;AAAA,EAC/C;AAAA,EAEA,oBAA0B;AACtB,SAAK,OAAO;AACZ,SAAK,uBAAuB;AAAA,EAChC;AAAA,EAEA,SAAU;AACN,
|
|
4
|
+
"sourcesContent": ["import { html } from './html.js'\nimport { define } from '@substrate-system/web-component'\nimport { SubstrateButton as SubstrateButtonLight } from './client.js'\n// import Debug from '@substrate-system/debug'\n// const debug = Debug('button')\n\n/**\n * This is the full-version -- knows how to render itself in the browser.\n */\nexport class SubstrateButton extends SubstrateButtonLight {\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n connectedCallback ():void {\n this.render()\n this._setupKeyboardHandlers()\n }\n\n render () {\n if (this.querySelector('button')) return\n const { type, tabindex } = this\n // Read directly from host attributes: the inner button does not\n // exist yet when render() first runs, so the getters (which\n // read from the inner button) would return false.\n const disabled = this.hasAttribute('disabled')\n const autofocus = this.hasAttribute('autofocus')\n const name = this.getAttribute('name')\n const ariaLabel = this.getAttribute('aria-label')\n\n const spinning = this.getAttribute('spinning') !== null\n\n const classes:(string|null)[] = [\n 'substrate-button',\n this.getAttribute('class'),\n spinning ? 'spinning' : null\n ]\n const text = this.innerHTML\n\n const btnProps = {\n classes: classes.filter(Boolean),\n disabled,\n autofocus,\n tabindex,\n type,\n name,\n ariaLabel,\n }\n\n this.innerHTML = html(btnProps, text)\n }\n}\n\ndefine('substrate-button', SubstrateButton)\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAqB;AACrB,2BAAuB;AACvB,oBAAwD;AAOjD,MAAM,wBAAwB,cAAAA,gBAAqB;AAAA,EAT1D,OAS0D;AAAA;AAAA;AAAA,EACtD,OAAO,SAAU;AACb,qCAAO,gBAAgB,KAAK,eAAe;AAAA,EAC/C;AAAA,EAEA,oBAA0B;AACtB,SAAK,OAAO;AACZ,SAAK,uBAAuB;AAAA,EAChC;AAAA,EAEA,SAAU;AACN,QAAI,KAAK,cAAc,QAAQ,EAAG;AAClC,UAAM,EAAE,MAAM,SAAS,IAAI;AAI3B,UAAM,WAAW,KAAK,aAAa,UAAU;AAC7C,UAAM,YAAY,KAAK,aAAa,WAAW;AAC/C,UAAM,OAAO,KAAK,aAAa,MAAM;AACrC,UAAM,YAAY,KAAK,aAAa,YAAY;AAEhD,UAAM,WAAW,KAAK,aAAa,UAAU,MAAM;AAEnD,UAAM,UAA0B;AAAA,MAC5B;AAAA,MACA,KAAK,aAAa,OAAO;AAAA,MACzB,WAAW,aAAa;AAAA,IAC5B;AACA,UAAM,OAAO,KAAK;AAElB,UAAM,WAAW;AAAA,MACb,SAAS,QAAQ,OAAO,OAAO;AAAA,MAC/B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACJ;AAEA,SAAK,gBAAY,kBAAK,UAAU,IAAI;AAAA,EACxC;AACJ;AAAA,IAEA,6BAAO,oBAAoB,eAAe;",
|
|
6
6
|
"names": ["SubstrateButtonLight"]
|
|
7
7
|
}
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,IAAI,oBAAoB,EAAE,MAAM,aAAa,CAAA;AAIrE;;GAEG;AACH,qBAAa,eAAgB,SAAQ,oBAAoB;IACrD,MAAM,CAAC,MAAM;IAIb,iBAAiB,IAAI,IAAI;IAKzB,MAAM;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,IAAI,oBAAoB,EAAE,MAAM,aAAa,CAAA;AAIrE;;GAEG;AACH,qBAAa,eAAgB,SAAQ,oBAAoB;IACrD,MAAM,CAAC,MAAM;IAIb,iBAAiB,IAAI,IAAI;IAKzB,MAAM;CAgCT"}
|
package/dist/index.js
CHANGED
|
@@ -15,12 +15,10 @@ class SubstrateButton extends SubstrateButtonLight {
|
|
|
15
15
|
this._setupKeyboardHandlers();
|
|
16
16
|
}
|
|
17
17
|
render() {
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
disabled
|
|
23
|
-
} = this;
|
|
18
|
+
if (this.querySelector("button")) return;
|
|
19
|
+
const { type, tabindex } = this;
|
|
20
|
+
const disabled = this.hasAttribute("disabled");
|
|
21
|
+
const autofocus = this.hasAttribute("autofocus");
|
|
24
22
|
const name = this.getAttribute("name");
|
|
25
23
|
const ariaLabel = this.getAttribute("aria-label");
|
|
26
24
|
const spinning = this.getAttribute("spinning") !== null;
|
package/dist/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/index.ts"],
|
|
4
|
-
"sourcesContent": ["import { html } from './html.js'\nimport { define } from '@substrate-system/web-component'\nimport { SubstrateButton as SubstrateButtonLight } from './client.js'\n// import Debug from '@substrate-system/debug'\n// const debug = Debug('button')\n\n/**\n * This is the full-version -- knows how to render itself in the browser.\n */\nexport class SubstrateButton extends SubstrateButtonLight {\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n connectedCallback ():void {\n this.render()\n this._setupKeyboardHandlers()\n }\n\n render () {\n const {\n
|
|
5
|
-
"mappings": ";;AAAA,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,mBAAmB,4BAA4B;AAOjD,MAAM,wBAAwB,qBAAqB;AAAA,EAT1D,OAS0D;AAAA;AAAA;AAAA,EACtD,OAAO,SAAU;AACb,WAAO,gBAAgB,KAAK,eAAe;AAAA,EAC/C;AAAA,EAEA,oBAA0B;AACtB,SAAK,OAAO;AACZ,SAAK,uBAAuB;AAAA,EAChC;AAAA,EAEA,SAAU;AACN,
|
|
4
|
+
"sourcesContent": ["import { html } from './html.js'\nimport { define } from '@substrate-system/web-component'\nimport { SubstrateButton as SubstrateButtonLight } from './client.js'\n// import Debug from '@substrate-system/debug'\n// const debug = Debug('button')\n\n/**\n * This is the full-version -- knows how to render itself in the browser.\n */\nexport class SubstrateButton extends SubstrateButtonLight {\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n connectedCallback ():void {\n this.render()\n this._setupKeyboardHandlers()\n }\n\n render () {\n if (this.querySelector('button')) return\n const { type, tabindex } = this\n // Read directly from host attributes: the inner button does not\n // exist yet when render() first runs, so the getters (which\n // read from the inner button) would return false.\n const disabled = this.hasAttribute('disabled')\n const autofocus = this.hasAttribute('autofocus')\n const name = this.getAttribute('name')\n const ariaLabel = this.getAttribute('aria-label')\n\n const spinning = this.getAttribute('spinning') !== null\n\n const classes:(string|null)[] = [\n 'substrate-button',\n this.getAttribute('class'),\n spinning ? 'spinning' : null\n ]\n const text = this.innerHTML\n\n const btnProps = {\n classes: classes.filter(Boolean),\n disabled,\n autofocus,\n tabindex,\n type,\n name,\n ariaLabel,\n }\n\n this.innerHTML = html(btnProps, text)\n }\n}\n\ndefine('substrate-button', SubstrateButton)\n"],
|
|
5
|
+
"mappings": ";;AAAA,SAAS,YAAY;AACrB,SAAS,cAAc;AACvB,SAAS,mBAAmB,4BAA4B;AAOjD,MAAM,wBAAwB,qBAAqB;AAAA,EAT1D,OAS0D;AAAA;AAAA;AAAA,EACtD,OAAO,SAAU;AACb,WAAO,gBAAgB,KAAK,eAAe;AAAA,EAC/C;AAAA,EAEA,oBAA0B;AACtB,SAAK,OAAO;AACZ,SAAK,uBAAuB;AAAA,EAChC;AAAA,EAEA,SAAU;AACN,QAAI,KAAK,cAAc,QAAQ,EAAG;AAClC,UAAM,EAAE,MAAM,SAAS,IAAI;AAI3B,UAAM,WAAW,KAAK,aAAa,UAAU;AAC7C,UAAM,YAAY,KAAK,aAAa,WAAW;AAC/C,UAAM,OAAO,KAAK,aAAa,MAAM;AACrC,UAAM,YAAY,KAAK,aAAa,YAAY;AAEhD,UAAM,WAAW,KAAK,aAAa,UAAU,MAAM;AAEnD,UAAM,UAA0B;AAAA,MAC5B;AAAA,MACA,KAAK,aAAa,OAAO;AAAA,MACzB,WAAW,aAAa;AAAA,IAC5B;AACA,UAAM,OAAO,KAAK;AAElB,UAAM,WAAW;AAAA,MACb,SAAS,QAAQ,OAAO,OAAO;AAAA,MAC/B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACJ;AAEA,SAAK,YAAY,KAAK,UAAU,IAAI;AAAA,EACxC;AACJ;AAEA,OAAO,oBAAoB,eAAe;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/index.min.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var o=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var A=Object.getOwnPropertyNames;var x=Object.prototype.hasOwnProperty;var u=(s,t)=>o(s,"name",{value:t,configurable:!0});var L=(s,t)=>{for(var n in t)o(s,n,{get:t[n],enumerable:!0})},y=(s,t,n,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let e of A(t))!x.call(s,e)&&e!==n&&o(s,e,{get:()=>t[e],enumerable:!(r=m(t,e))||r.enumerable});return s};var H=s=>y(o({},"__esModule",{value:!0}),s);var T={};L(T,{SubstrateButton:()=>i});module.exports=H(T);var l=require("./html.js"),a=require("@substrate-system/web-component"),b=require("./client.js");class i extends b.SubstrateButton{static{u(this,"SubstrateButton")}static define(){(0,a.define)(i.TAG,i)}connectedCallback(){this.render(),this._setupKeyboardHandlers()}render(){if(this.querySelector("button"))return;const{type:t,tabindex:n}=this,r=this.hasAttribute("disabled"),e=this.hasAttribute("autofocus"),c=this.getAttribute("name"),h=this.getAttribute("aria-label"),d=this.getAttribute("spinning")!==null,p=["substrate-button",this.getAttribute("class"),d?"spinning":null],f=this.innerHTML,g={classes:p.filter(Boolean),disabled:r,autofocus:e,tabindex:n,type:t,name:c,ariaLabel:h};this.innerHTML=(0,l.html)(g,f)}}(0,a.define)("substrate-button",i);
|
|
2
2
|
//# sourceMappingURL=index.min.cjs.map
|
package/dist/index.min.cjs.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/index.ts"],
|
|
4
|
-
"sourcesContent": ["import { html } from './html.js'\nimport { define } from '@substrate-system/web-component'\nimport { SubstrateButton as SubstrateButtonLight } from './client.js'\n// import Debug from '@substrate-system/debug'\n// const debug = Debug('button')\n\n/**\n * This is the full-version -- knows how to render itself in the browser.\n */\nexport class SubstrateButton extends SubstrateButtonLight {\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n connectedCallback ():void {\n this.render()\n this._setupKeyboardHandlers()\n }\n\n render () {\n const {\n
|
|
5
|
-
"mappings": "4dAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,qBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAqB,qBACrBC,EAAuB,2CACvBC,EAAwD,uBAOjD,MAAMC,UAAwB,EAAAC,eAAqB,CAT1D,MAS0D,CAAAC,EAAA,wBACtD,OAAO,QAAU,IACb,UAAOF,EAAgB,IAAKA,CAAe,CAC/C,CAEA,mBAA0B,CACtB,KAAK,OAAO,EACZ,KAAK,uBAAuB,CAChC,CAEA,QAAU,CACN,
|
|
6
|
-
"names": ["index_exports", "__export", "SubstrateButton", "__toCommonJS", "import_html", "import_web_component", "import_client", "SubstrateButton", "SubstrateButtonLight", "__name", "type", "
|
|
4
|
+
"sourcesContent": ["import { html } from './html.js'\nimport { define } from '@substrate-system/web-component'\nimport { SubstrateButton as SubstrateButtonLight } from './client.js'\n// import Debug from '@substrate-system/debug'\n// const debug = Debug('button')\n\n/**\n * This is the full-version -- knows how to render itself in the browser.\n */\nexport class SubstrateButton extends SubstrateButtonLight {\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n connectedCallback ():void {\n this.render()\n this._setupKeyboardHandlers()\n }\n\n render () {\n if (this.querySelector('button')) return\n const { type, tabindex } = this\n // Read directly from host attributes: the inner button does not\n // exist yet when render() first runs, so the getters (which\n // read from the inner button) would return false.\n const disabled = this.hasAttribute('disabled')\n const autofocus = this.hasAttribute('autofocus')\n const name = this.getAttribute('name')\n const ariaLabel = this.getAttribute('aria-label')\n\n const spinning = this.getAttribute('spinning') !== null\n\n const classes:(string|null)[] = [\n 'substrate-button',\n this.getAttribute('class'),\n spinning ? 'spinning' : null\n ]\n const text = this.innerHTML\n\n const btnProps = {\n classes: classes.filter(Boolean),\n disabled,\n autofocus,\n tabindex,\n type,\n name,\n ariaLabel,\n }\n\n this.innerHTML = html(btnProps, text)\n }\n}\n\ndefine('substrate-button', SubstrateButton)\n"],
|
|
5
|
+
"mappings": "4dAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,qBAAAE,IAAA,eAAAC,EAAAH,GAAA,IAAAI,EAAqB,qBACrBC,EAAuB,2CACvBC,EAAwD,uBAOjD,MAAMC,UAAwB,EAAAC,eAAqB,CAT1D,MAS0D,CAAAC,EAAA,wBACtD,OAAO,QAAU,IACb,UAAOF,EAAgB,IAAKA,CAAe,CAC/C,CAEA,mBAA0B,CACtB,KAAK,OAAO,EACZ,KAAK,uBAAuB,CAChC,CAEA,QAAU,CACN,GAAI,KAAK,cAAc,QAAQ,EAAG,OAClC,KAAM,CAAE,KAAAG,EAAM,SAAAC,CAAS,EAAI,KAIrBC,EAAW,KAAK,aAAa,UAAU,EACvCC,EAAY,KAAK,aAAa,WAAW,EACzCC,EAAO,KAAK,aAAa,MAAM,EAC/BC,EAAY,KAAK,aAAa,YAAY,EAE1CC,EAAW,KAAK,aAAa,UAAU,IAAM,KAE7CC,EAA0B,CAC5B,mBACA,KAAK,aAAa,OAAO,EACzBD,EAAW,WAAa,IAC5B,EACME,EAAO,KAAK,UAEZC,EAAW,CACb,QAASF,EAAQ,OAAO,OAAO,EAC/B,SAAAL,EACA,UAAAC,EACA,SAAAF,EACA,KAAAD,EACA,KAAAI,EACA,UAAAC,CACJ,EAEA,KAAK,aAAY,QAAKI,EAAUD,CAAI,CACxC,CACJ,IAEA,UAAO,mBAAoBX,CAAe",
|
|
6
|
+
"names": ["index_exports", "__export", "SubstrateButton", "__toCommonJS", "import_html", "import_web_component", "import_client", "SubstrateButton", "SubstrateButtonLight", "__name", "type", "tabindex", "disabled", "autofocus", "name", "ariaLabel", "spinning", "classes", "text", "btnProps"]
|
|
7
7
|
}
|
package/dist/index.min.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
var T=Object.defineProperty;var s=(
|
|
1
|
+
var T=Object.defineProperty;var s=(i,t)=>T(i,"name",{value:t,configurable:!0});function y(i,t){let{type:e,autofocus:n,tabindex:r,disabled:u,classes:d,name:a,ariaLabel:l}=i,c=new Set(d);c.add("substrate-button btn");let h=Array.from(c),v=[h.length?`class="${h.filter(Boolean).join(" ")}"`:"",u?"disabled":"",n?"autofocus":"",e?`type="${e}"`:"",a?`name=${a}`:"",r?`tabindex="${r}"`:'tabindex="0"','role="button"',l?`aria-label="${l}"`:"",'aria-live="polite"'].filter(Boolean).join(" ");return typeof window>"u"?`<substrate-button${u?" disabled":""}>
|
|
2
2
|
<button ${v}><span class="btn-content">${t}</span></button>
|
|
3
3
|
</substrate-button>`:`<button ${v}>
|
|
4
4
|
<span class="btn-content">${t}</span>
|
|
5
|
-
</button>`}s(
|
|
5
|
+
</button>`}s(y,"html");var $=Object.defineProperty,W=s((i,t)=>$(i,"name",{value:t,configurable:!0}),"__name");function L(i){return Object.keys(i).reduce((t,e)=>{let n=i[e];return n?typeof n=="boolean"?n?(t+` ${e}`).trim():t:Array.isArray(n)?t+` ${e}="${n.join(" ")}"`:(t+` ${e}="${n}"`).trim():t},"")}s(L,"toAttributes");W(L,"toAttributes");var x=Object.defineProperty,g=s((i,t)=>x(i,"name",{value:t,configurable:!0}),"__name");function _(i){return document.createElement(i).constructor!==window.HTMLElement}s(_,"isRegistered");g(_,"isRegistered");function C(i,t){window&&"customElements"in window&&(_(i)||window.customElements.define(i,t))}s(C,"define");g(C,"define");var j=document.querySelector.bind(document),N=document.querySelectorAll.bind(document);function p(i,t){return i.matches||(i=i.parentElement),i.matches(t)?i:i.closest(t)}s(p,"match");g(p,"match");var G=Object.defineProperty,b=s((i,t)=>G(i,"name",{value:t,configurable:!0}),"__name"),f=class i extends window.HTMLElement{static{s(this,"WebComponent")}static{b(this,"WebComponent")}static TAG="";TAG="";static match(t){return p(t,this.TAG)}_globalWildcardListeners=new Set;_namespacedWildcardListeners=new Set;static create(t){let e=class extends i{static{s(this,"CreatedClass")}static{b(this,"CreatedClass")}static TAG=t;TAG=t;render(){throw new Error("`render` should be implemented by children")}};return e.define=function(){return i.define.call(this)},e.event=function(n){return i.event.call(this,n)},e}static define(){o(this.TAG,this)}async attributeChangedCallback(t,e,n){let r=this[`handleChange_${t}`];r&&await r.call(this,e,n)}addEventListener(t,e,n){t===i.event.call(this,"*")?this._namespacedWildcardListeners.add({listener:e,options:n}):t==="*"?e&&this._globalWildcardListeners.add({listener:e,options:n}):super.addEventListener(t,e,n)}_notifyNamespacedWildcardListeners(t){if(this._namespacedWildcardListeners.size===0)return;let e=this.TAG;!e||!t.type.startsWith(`${e}:`)||this._namespacedWildcardListeners.forEach(({listener:n})=>{try{typeof n=="function"?n.call(this,t):n&&typeof n.handleEvent=="function"&&n.handleEvent(t)}catch(r){console.error("Error in namespaced wildcard event listener:",r)}})}_notifyGlobalWildcardListeners(t){this._globalWildcardListeners.size!==0&&this._globalWildcardListeners.forEach(({listener:e})=>{try{typeof e=="function"?e.call(this,t):e&&typeof e.handleEvent=="function"&&e.handleEvent(t)}catch(n){console.error("Error in global wildcard event listener:",n)}})}connectedCallback(){this.render()}qs(t){return this.querySelector(t)}qsa(t){return this.querySelectorAll(t)}static event(t){return E(this.TAG,t)}emit(t,e={}){if(t==="*")throw new Error('Do not emit the literal "*"');let{bubbles:n=!0,cancelable:r=!0,detail:u}=e,d=`${this.TAG}:${t}`,a=new CustomEvent(d,{bubbles:n,cancelable:r,detail:u}),l=this.dispatchEvent(a);return this._notifyNamespacedWildcardListeners(a),l}dispatchEvent(t){let e=super.dispatchEvent(t);return this._notifyGlobalWildcardListeners(t),e}dispatch(t,e={}){let n=new CustomEvent(t,{bubbles:e.bubbles===void 0?!0:e.bubbles,cancelable:e.cancelable===void 0?!0:e.cancelable,detail:e.detail});return this.dispatchEvent(n)}on(t,e,n){let r=i.event.call(this,t);this.addEventListener(r,e,n)}removeEventListener(t,e,n){if(t===i.event.call(this,"*")){if(e&&this._namespacedWildcardListeners){for(let r of this._namespacedWildcardListeners)if(r.listener===e){this._namespacedWildcardListeners.delete(r);break}}}else if(t==="*"){if(e&&this._globalWildcardListeners){for(let r of this._globalWildcardListeners)if(r.listener===e){this._globalWildcardListeners.delete(r);break}}}else super.removeEventListener(t,e,n)}};function E(i,t){return`${i}:${t}`}s(E,"eventName");b(E,"eventName");function w(i){return document.createElement(i).constructor!==window.HTMLElement}s(w,"isRegistered");b(w,"isRegistered");function o(i,t){window&&"customElements"in window&&(w(i)||window.customElements.define(i,t))}s(o,"define");b(o,"define");var m=class i extends f.create("substrate-button"){static{s(this,"SubstrateButton")}static observedAttributes=["autofocus","disabled","spinning"];static TAG="substrate-button";_isSpinning;static define(){o(i.TAG,i)}constructor(){super(),this.getAttribute("disabled")!==null&&setTimeout(()=>{this.disabled=!0},0),this.autofocus=this.getAttribute("autofocus")!==null,this._isSpinning=this.getAttribute("spinning")!==null}get form(){return this.button?.form}get disabled(){return!!this.button?.hasAttribute("disabled")}set disabled(t){this.hasAttribute("disabled")!==t&&this.toggleAttribute("disabled",t),t?(this.button?.setAttribute("disabled",""),this.button?.setAttribute("aria-disabled","true")):(this.button?.removeAttribute("disabled"),this.button?.setAttribute("aria-disabled","false"))}get type(){return this.button?.getAttribute("type")}get tabindex(){let t=this.button?.getAttribute("tabindex");return t?parseInt(t):0}get spinning(){return this._isSpinning}set spinning(t){t?(this.classList.add("spinning"),this.button?.classList.add("spinning"),this.button?.setAttribute("disabled",""),this.setAttribute("spinning","")):(this.classList.remove("spinning"),this.button?.classList.remove("spinning"),this.button?.removeAttribute("disabled"),this.removeAttribute("spinning"))}set type(t){this._setAttribute("type",t)}get autofocus(){return!!this.button?.hasAttribute("autofocus")}set autofocus(t){this.hasAttribute("autofocus")!==t&&this.toggleAttribute("autofocus",t),this.button?.toggleAttribute("autofocus",t)}_setAttribute(t,e){if(e===!1)this._removeAttribute(t),this.button?.removeAttribute(t);else{if(e===!0)return this.button?.setAttribute(t,"");if(e===null)return this._removeAttribute(t);this.button?.setAttribute(t,e)}}_removeAttribute(t){this.removeAttribute(t),this.button?.removeAttribute(t)}get button(){return this.querySelector("button")}handleChange_autofocus(t,e){this.button?.toggleAttribute("autofocus",e!==null)}handleChange_disabled(t,e){e!==null?(this.button?.setAttribute("disabled",""),this.button?.setAttribute("aria-disabled","true")):(this.button?.removeAttribute("disabled"),this.button?.setAttribute("aria-disabled","false"))}handleChange_spinning(t,e){e!==null?(this.classList.add("spinning"),this.button?.classList.add("spinning"),this.button?.setAttribute("disabled",""),this.button?.setAttribute("aria-busy","true")):(this.classList.remove("spinning"),this.button?.classList.remove("spinning"),this.button?.removeAttribute("disabled"),this.button?.setAttribute("aria-busy","false"))}connectedCallback(){this.render(),this._setupKeyboardHandlers()}_setupKeyboardHandlers(){this.button?.addEventListener("keydown",t=>{(t.key===" "||t.key==="Enter")&&(t.preventDefault(),this.button?.click())})}render(){}};var A=class i extends m{static{s(this,"SubstrateButton")}static define(){o(i.TAG,i)}connectedCallback(){this.render(),this._setupKeyboardHandlers()}render(){if(this.querySelector("button"))return;let{type:t,tabindex:e}=this,n=this.hasAttribute("disabled"),r=this.hasAttribute("autofocus"),u=this.getAttribute("name"),d=this.getAttribute("aria-label"),a=this.getAttribute("spinning")!==null,l=["substrate-button",this.getAttribute("class"),a?"spinning":null],c=this.innerHTML,h={classes:l.filter(Boolean),disabled:n,autofocus:r,tabindex:e,type:t,name:u,ariaLabel:d};this.innerHTML=y(h,c)}};o("substrate-button",A);export{A as SubstrateButton};
|
|
6
6
|
//# sourceMappingURL=index.min.js.map
|
package/dist/index.min.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../src/html.ts", "../node_modules/@substrate-system/web-component/src/attributes.ts", "../node_modules/@substrate-system/web-component/src/util.ts", "../node_modules/@substrate-system/web-component/src/index.ts", "../src/client.ts", "../src/index.ts"],
|
|
4
|
-
"sourcesContent": ["export type Attrs = {\n type:string|null;\n autofocus:boolean;\n tabindex:string|number;\n disabled:boolean;\n name:string|null;\n classes:string[]|Set<string>;\n ariaLabel:string|null;\n}\n\nexport function html (attrs:Partial<Attrs>, textContent:string) {\n const {\n type,\n autofocus,\n tabindex,\n disabled,\n classes,\n name,\n ariaLabel\n } = attrs\n\n const _classes = new Set(classes)\n _classes.add('substrate-button btn')\n const arr = Array.from(_classes)\n\n const btnProps = ([\n arr.length ? `class=\"${arr.filter(Boolean).join(' ')}\"` : '',\n disabled ? 'disabled' : '',\n autofocus ? 'autofocus' : '',\n type ? `type=\"${type}\"` : '',\n name ? `name=${name}` : '',\n tabindex ? `tabindex=\"${tabindex}\"` : 'tabindex=\"0\"',\n 'role=\"button\"',\n ariaLabel ? `aria-label=\"${ariaLabel}\"` : '',\n 'aria-live=\"polite\"'\n ]).filter(Boolean).join(' ')\n\n // rendering in node?\n return typeof window === 'undefined' ?\n `<substrate-button${disabled ? ' disabled' : ''}>\n <button ${btnProps}><span class=\"btn-content\">${textContent}</span></button>\n </substrate-button>` :\n `<button ${btnProps}>\n <span class=\"btn-content\">${textContent}</span>\n </button>`\n}\n", "export type Attrs = Record<string, undefined|null|string|number|boolean|(string|number)[]>\n\n/**\n * Transform an object into an HTML attributes string. The object should be\n * like `{ attributeName: value }`.\n *\n * @param attrs An object for the attributes.\n * @returns {string} A string suitable for use as HTML attributes.\n */\nexport function toAttributes (attrs:Attrs):string {\n return Object.keys(attrs).reduce((acc, k) => {\n const value = attrs[k]\n if (!value) return acc\n\n if (typeof value === 'boolean') {\n if (value) return (acc + ` ${k}`).trim()\n return acc\n }\n\n if (Array.isArray(value)) {\n return (acc + ` ${k}=\"${value.join(' ')}\"`)\n }\n\n return (acc + ` ${k}=\"${value}\"`).trim()\n }, '')\n}\n", "export { toAttributes } from './attributes.js'\n\n/**\n * Check if the given tag name has been registered.\n *\n * @see {@link https://stackoverflow.com/a/28210364 stackoverflow}\n * @param {string} elName The custom element tag name.\n * @returns {boolean} True if the given name has been registered already.\n */\nexport function isRegistered (elName:string):boolean {\n return document.createElement(elName).constructor !== window.HTMLElement\n}\n\nexport function define (name:string, element:CustomElementConstructor) {\n if (!window) return\n if (!('customElements' in window)) return\n\n if (!isRegistered(name)) {\n window.customElements.define(name, element)\n }\n}\n\nexport const qs = document.querySelector.bind(document)\nexport const qsa = document.querySelectorAll.bind(document)\n\n/**\n * Get the closes parent element matching the given selector.\n * @param el Element to start from\n * @param s Selector for an element\n * @returns {HTMLElement|null} The closes parent element that matches.\n */\nexport function match (el:HTMLElement, s:string):HTMLElement|null {\n if (!el.matches) el = el.parentElement!\n return el.matches(s) ? el : el.closest(s)\n}\n", "import { match as _match } from './util.js'\n\ninterface WildcardListenerEntry {\n listener:EventListenerOrEventListenerObject\n options?:boolean|AddEventListenerOptions\n}\n\nexport abstract class WebComponent extends window.HTMLElement {\n static TAG:string = ''\n TAG:string = ''\n\n static match (el:HTMLElement):HTMLElement|null {\n return _match(el, this.TAG)\n }\n\n /**\n * Store global wildcard listeners (listen to all events)\n * Triggered by ALL events dispatched through this element\n * @private\n */\n private _globalWildcardListeners:Set<WildcardListenerEntry> = new Set()\n\n /**\n * Store namespaced wildcard listeners (listen to 'component-name:*')\n * Triggered by events from emit() that match this component's namespace\n * @private\n */\n private _namespacedWildcardListeners:Set<WildcardListenerEntry> = new Set()\n\n static create (elementName:string):typeof WebComponent & {\n new (...args:any[]):WebComponent;\n TAG:string;\n define: typeof WebComponent.define;\n event: typeof WebComponent.event;\n } {\n const CreatedClass = class extends WebComponent {\n static TAG = elementName\n TAG = elementName\n render () {\n throw new Error('`render` should be implemented by children')\n }\n }\n\n // Copy static methods with proper binding\n CreatedClass.define = function () {\n return WebComponent.define.call(this)\n }\n CreatedClass.event = function (evType:string) {\n return WebComponent.event.call(this, evType)\n }\n\n return CreatedClass\n }\n\n static define<T extends {\n new (...args:any[]):WebComponent;\n TAG:string;\n }>(this:T) {\n define(this.TAG, this)\n }\n\n /**\n * Runs when the value of an attribute is changed.\n *\n * Depends on `static observedAttributes`.\n *\n * Should name methods like `handleChange_disabled`.\n *\n * @param {string} name The attribute name\n * @param {string} oldValue The old attribute value\n * @param {string} newValue The new attribute value\n */\n async attributeChangedCallback (\n name:string,\n oldValue:string,\n newValue:string\n ):Promise<void> {\n const handler = this[`handleChange_${name}`]\n if (handler) {\n await handler.call(this, oldValue, newValue)\n }\n }\n\n /**\n * Enhanced addEventListener that supports wildcards:\n * - Component.event('*') - Listen to all namespaced events for this\n * component (e.g., 'my-component:*')\n * - '*' - Listen to ALL events (namespaced and non-namespaced, including\n * normal DOM events)\n *\n * @param type - Event type, Component.event('*') for namespaced wildcard,\n * or '*' for global wildcard\n * @param listener - Event listener function or object\n * @param options - Event listener options\n */\n addEventListener (\n type:string,\n listener:EventListenerOrEventListenerObject,\n options?:boolean|AddEventListenerOptions\n ): void {\n if (type === WebComponent.event.call(this, '*')) {\n // Handle namespaced wildcard listener (component-name:*)\n this._namespacedWildcardListeners.add({ listener, options })\n } else if (type === '*') {\n // Handle global wildcard listener (all events)\n if (listener) {\n this._globalWildcardListeners.add({ listener, options })\n }\n } else {\n // Normal event listener - delegate to native implementation\n super.addEventListener(type, listener, options)\n }\n }\n\n /**\n * Notify namespaced wildcard listeners of an event\n * Only fires for events that match this component's namespace\n *\n * @param event - The event to dispatch to namespaced wildcard listeners\n * @private\n */\n private _notifyNamespacedWildcardListeners (event: Event): void {\n if (this._namespacedWildcardListeners.size === 0) {\n return\n }\n\n const componentName = this.TAG\n\n // Only trigger for events in this component's namespace\n if (!componentName || !event.type.startsWith(`${componentName}:`)) {\n return\n }\n\n // Call each namespaced wildcard listener\n this._namespacedWildcardListeners.forEach(({ listener }) => {\n try {\n if (typeof listener === 'function') {\n listener.call(this, event)\n } else if (listener && typeof listener.handleEvent === 'function') {\n listener.handleEvent(event)\n }\n } catch (error) {\n // Log errors but don't let one listener break others\n console.error(\n 'Error in namespaced wildcard event listener:',\n error\n )\n }\n })\n }\n\n /**\n * Notify global wildcard listeners of an event\n * Fires for ALL events dispatched through this element\n *\n * @param event - The event to dispatch to global wildcard listeners\n * @private\n */\n private _notifyGlobalWildcardListeners (event: Event): void {\n if (this._globalWildcardListeners.size === 0) {\n return\n }\n\n // Call each global wildcard listener\n this._globalWildcardListeners.forEach(({ listener }) => {\n try {\n if (typeof listener === 'function') {\n listener.call(this, event)\n } else if (listener && typeof listener.handleEvent === 'function') {\n listener.handleEvent(event)\n }\n } catch (error) {\n // Log errors but don't let one listener break others\n console.error('Error in global wildcard event listener:', error)\n }\n })\n }\n\n connectedCallback () {\n this.render()\n }\n\n abstract render ():any\n\n qs<K extends keyof HTMLElementTagNameMap>(\n selector:K\n ):HTMLElementTagNameMap[K]|null;\n\n qs<E extends Element = Element>(selector:string):E|null;\n qs (selector:string):Element|null {\n return this.querySelector(selector)\n }\n\n qsa<K extends keyof HTMLElementTagNameMap>(\n selector:K\n ):HTMLElementTagNameMap[K]|null;\n\n qsa<E extends Element = Element>(selector:string):E|null;\n qsa (selector:string):NodeListOf<Element> {\n return this.querySelectorAll(selector)\n }\n\n /**\n * Take a non-namepsaced event name, return namespace event name.\n *\n * @param {string} evType The non-namespace event name\n * @returns {string} Namespaced event name, eg, `my-component:click`\n */\n static event (evType:string):string {\n return eventName(this.TAG, evType)\n }\n\n /**\n * Emit a namespaced event.\n *\n * @param type (non-namespaced) event type string\n * @param opts `bubbles`, `detail`, and `cancelable`. Default is\n * `{ bubbles: true, cancelable: true }`\n * @returns {boolean}\n */\n emit<T = any> (type:string, opts:Partial<{\n bubbles:boolean,\n cancelable:boolean,\n detail:CustomEvent<T>['detail']\n }> = {}):boolean {\n if (type === '*') throw new Error('Do not emit the literal \"*\"')\n\n const { bubbles = true, cancelable = true, detail } = opts\n const namespacedType = `${this.TAG}:${type}`\n\n const event = new CustomEvent(namespacedType, {\n bubbles,\n cancelable,\n detail\n })\n\n // This will trigger both specific listeners and global wildcard\n // listeners (**)\n const result = this.dispatchEvent(event)\n\n // Notify namespaced wildcard listeners (*)\n this._notifyNamespacedWildcardListeners(event)\n\n return result\n }\n\n /**\n * Override dispatchEvent to notify global wildcard listeners\n * This ensures that '**' listeners catch ALL events\n *\n * @param event - The event to dispatch\n * @returns true if the event was not cancelled\n */\n dispatchEvent (event: Event): boolean {\n const result = super.dispatchEvent(event)\n\n // Notify global wildcard listeners for ALL events\n this._notifyGlobalWildcardListeners(event)\n\n return result\n }\n\n /**\n * Create and emit an event, no namespacing.\n */\n dispatch<T> (type:string, opts:Partial<{\n bubbles:boolean,\n cancelable:boolean,\n detail:CustomEvent<T>['detail']\n }> = {}):boolean {\n const event = new CustomEvent(type, {\n bubbles: (opts.bubbles === undefined) ? true : opts.bubbles,\n cancelable: (opts.cancelable === undefined) ? true : opts.cancelable,\n detail: opts.detail\n })\n\n return this.dispatchEvent(event)\n }\n\n /**\n * Listen for namespaced events.\n */\n on<T extends Event = Event> (\n evName:string,\n handler:(ev:T)=>any,\n options?:boolean|AddEventListenerOptions\n ):void;\n\n on (\n evName:string,\n handler:EventListenerObject,\n options?:boolean|AddEventListenerOptions\n ):void;\n\n on (\n evName:string,\n handler:((ev:Event)=>any)|EventListenerObject,\n options?:boolean|AddEventListenerOptions\n ):void {\n const fullEvName = WebComponent.event.call(this, evName)\n this.addEventListener(fullEvName, handler as EventListenerOrEventListenerObject, options)\n }\n\n /**\n * Enhanced removeEventListener that supports wildcards:\n * - Component.event('*') - Remove namespaced wildcard listener\n * - '*' - Remove global wildcard listener\n *\n * @param type - Event type, Component.event('*') for namespaced, or '*'\n * for global\n * @param listener - Event listener function or object to remove\n * @param options - Event listener options\n */\n removeEventListener (\n type:string,\n listener:EventListenerOrEventListenerObject,\n options?: boolean | EventListenerOptions\n ): void {\n if (type === WebComponent.event.call(this, '*')) {\n // Remove namespaced wildcard listener\n if (listener && this._namespacedWildcardListeners) {\n for (const entry of this._namespacedWildcardListeners) {\n if (entry.listener === listener) {\n this._namespacedWildcardListeners.delete(entry)\n break\n }\n }\n }\n } else if (type === '*') {\n // Remove global wildcard listener\n if (listener && this._globalWildcardListeners) {\n for (const entry of this._globalWildcardListeners) {\n if (entry.listener === listener) {\n this._globalWildcardListeners.delete(entry)\n break\n }\n }\n }\n } else {\n // Normal event listener - delegate to native implementation\n super.removeEventListener(type, listener, options)\n }\n }\n}\n\nfunction eventName (namespace:string, evType:string) {\n return `${namespace}:${evType}`\n}\n\n/**\n * Check if the given tag name has been registered.\n *\n * @see {@link https://stackoverflow.com/a/28210364 stackoverflow}\n * @param {string} elName The custom element tag name.\n * @returns {boolean} True if the given name has been registered already.\n */\nexport function isRegistered (elName:string):boolean {\n return document.createElement(elName).constructor !== window.HTMLElement\n}\n\nexport function define (name:string, element:CustomElementConstructor) {\n if (!window) return\n if (!('customElements' in window)) return\n\n if (!isRegistered(name)) {\n window.customElements.define(name, element)\n }\n}\n", "import { WebComponent, define } from '@substrate-system/web-component'\n\n// for docuement.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'substrate-button': SubstrateButton\n }\n}\n\n/**\n * This is the lightweight version for browsers.\n * It \"hydrates\" only, meaining sets up event listeners.\n * It does not know how to render itself.\n */\n\nexport class SubstrateButton extends WebComponent.create('substrate-button') {\n // for `attributeChangedCallback`\n static observedAttributes = ['autofocus', 'disabled', 'spinning']\n static TAG = 'substrate-button'\n _isSpinning:boolean\n\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n constructor () {\n super()\n const disabled = this.getAttribute('disabled')\n if (disabled !== null) {\n setTimeout(() => {\n // need to wait for it to render\n this.disabled = true\n }, 0)\n }\n this.autofocus = (this.getAttribute('autofocus') !== null)\n this._isSpinning = (this.getAttribute('spinning') !== null)\n }\n\n get form ():HTMLFormElement|undefined|null {\n return this.button?.form\n }\n\n get disabled ():boolean {\n return !!(this.button?.hasAttribute('disabled'))\n }\n\n set disabled (disabledValue:boolean) {\n if (!disabledValue) {\n this._removeAttribute('disabled')\n this.button?.setAttribute('aria-disabled', 'false')\n } else {\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-disabled', 'true')\n }\n }\n\n get type ():string|null|undefined {\n return this.button?.getAttribute('type')\n }\n\n get tabindex ():number {\n const i = this.button?.getAttribute('tabindex')\n if (!i) return 0\n return parseInt(i)\n }\n\n get spinning ():boolean {\n return this._isSpinning\n }\n\n set spinning (value:boolean) {\n if (value) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.setAttribute('spinning', '')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.removeAttribute('spinning')\n }\n }\n\n set type (value:string) {\n this._setAttribute('type', value)\n }\n\n get autofocus ():boolean {\n return !!(this.button?.hasAttribute('autofocus'))\n }\n\n set autofocus (value:boolean) {\n if (value) {\n this._setAttribute('autofocus', value)\n } else {\n this._removeAttribute('autofocus')\n }\n }\n\n /**\n * Set attributes on the internal button element.\n */\n _setAttribute (name:string, value:boolean|string|null):void {\n if (value === false) {\n // false means remove the attribute\n this._removeAttribute(name)\n this.button?.removeAttribute(name)\n } else {\n if (value === true) {\n // true means set the attribute with no value\n return this.button?.setAttribute(name, '')\n }\n\n if (value === null) {\n // null means remove\n return this._removeAttribute(name)\n }\n\n // else, set value to a string\n this.button?.setAttribute(name, value)\n }\n }\n\n /**\n * Remove from `this` and also button child.\n */\n _removeAttribute (name:string) {\n this.removeAttribute(name)\n this.button?.removeAttribute(name)\n }\n\n get button ():HTMLButtonElement|null {\n return this.querySelector('button')\n }\n\n /**\n * Handle 'autofocus' attribute changes\n * @see {@link https://gomakethings.com/how-to-detect-when-attributes-change-on-a-web-component/#organizing-your-code Go Make Things article}\n *\n * @param {string} oldValue The old attribute value\n * @param {string} newValue The new attribute value\n */\n handleChange_autofocus (_oldValue:string, newValue:string) {\n this._setAttribute('autofocus', newValue)\n }\n\n handleChange_disabled (_old, newValue:boolean|string) {\n this.disabled = (newValue !== null)\n if (newValue === null) this.button?.removeAttribute('disabled')\n else this.button?.setAttribute('disabled', '' + newValue)\n }\n\n handleChange_spinning (_, newValue:boolean) {\n if (newValue !== null) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-busy', 'true')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-busy', 'false')\n }\n }\n\n connectedCallback () {\n // connect event listeners\n this.render()\n this._setupKeyboardHandlers()\n }\n\n _setupKeyboardHandlers () {\n // Space and Enter should trigger click\n this.button?.addEventListener('keydown', (e:KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n e.preventDefault()\n this.button?.click()\n }\n })\n }\n\n render () {\n // noop\n }\n}\n", "import { html } from './html.js'\nimport { define } from '@substrate-system/web-component'\nimport { SubstrateButton as SubstrateButtonLight } from './client.js'\n// import Debug from '@substrate-system/debug'\n// const debug = Debug('button')\n\n/**\n * This is the full-version -- knows how to render itself in the browser.\n */\nexport class SubstrateButton extends SubstrateButtonLight {\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n connectedCallback ():void {\n this.render()\n this._setupKeyboardHandlers()\n }\n\n render () {\n const {\n type,\n autofocus,\n tabindex,\n disabled,\n } = this\n const name = this.getAttribute('name')\n const ariaLabel = this.getAttribute('aria-label')\n\n const spinning = this.getAttribute('spinning') !== null\n\n const classes:(string|null)[] = [\n 'substrate-button',\n this.getAttribute('class'),\n spinning ? 'spinning' : null\n ]\n const text = this.innerHTML\n\n const btnProps = {\n classes: classes.filter(Boolean),\n disabled,\n autofocus,\n tabindex,\n type,\n name,\n ariaLabel,\n }\n\n this.innerHTML = html(btnProps, text)\n }\n}\n\ndefine('substrate-button', SubstrateButton)\n"],
|
|
5
|
-
"mappings": "+EAUO,SAASA,EAAMC,EAAsBC,EAAoB,CAC5D,GAAM,CACF,KAAAC,EACA,UAAAC,EACA,SAAAC,EACA,SAAAC,EACA,QAAAC,EACA,KAAAC,EACA,UAAAC,CACJ,EAAIR,EAEES,EAAW,IAAI,IAAIH,CAAO,EAChCG,EAAS,IAAI,sBAAsB,EACnC,IAAMC,EAAM,MAAM,KAAKD,CAAQ,EAEzBE,EAAY,CACdD,EAAI,OAAS,UAAUA,EAAI,OAAO,OAAO,EAAE,KAAK,GAAG,CAAC,IAAM,GAC1DL,EAAW,WAAa,GACxBF,EAAY,YAAc,GAC1BD,EAAO,SAASA,CAAI,IAAM,GAC1BK,EAAO,QAAQA,CAAI,GAAK,GACxBH,EAAW,aAAaA,CAAQ,IAAM,eACtC,gBACAI,EAAY,eAAeA,CAAS,IAAM,GAC1C,oBACJ,EAAG,OAAO,OAAO,EAAE,KAAK,GAAG,EAG3B,OAAO,OAAO,OAAW,IACrB,oBAAoBH,EAAW,YAAc,EAAE;AAAA,sBACjCM,CAAQ,8BAA8BV,CAAW;AAAA,6BAE/D,WAAWU,CAAQ;AAAA,wCACaV,CAAW;AAAA,kBAEnD,CAnCgBW,EAAAb,EAAA,+FCDT,SAASc,EAAcC,EAAoB,CAC9C,OAAO,OAAO,KAAKA,CAAK,EAAE,OAAO,CAACC,EAAKC,IAAM,CACzC,IAAMC,EAAQH,EAAME,CAAC,EACrB,OAAKC,EAED,OAAOA,GAAU,UACbA,GAAeF,EAAM,IAAIC,CAAC,IAAI,KAAK,EAChCD,EAGP,MAAM,QAAQE,CAAK,EACXF,EAAM,IAAIC,CAAC,KAAKC,EAAM,KAAK,GAAG,CAAC,KAGnCF,EAAM,IAAIC,CAAC,KAAKC,CAAK,KAAK,KAAK,EAXpBF,CAYvB,EAAG,EAAE,CACT,CAhBgBG,EAAAL,EAAA,gBAAAK,EAAAL,EAAA,cAAA,yFCAT,SAASM,EAAcC,EAAuB,CACjD,OAAO,SAAS,cAAcA,CAAM,EAAE,cAAgB,OAAO,WACjE,CAFgBC,EAAAF,EAAA,gBAAAE,EAAAF,EAAA,cAAA,EAIT,SAASG,EAAQC,EAAaC,EAAkC,CAC9D,QACC,mBAAoB,SAErBL,EAAaI,CAAI,GAClB,OAAO,eAAe,OAAOA,EAAMC,CAAO,EAElD,CAPgBH,EAAAC,EAAA,UAAAD,EAAAC,EAAA,QAAA,EAST,IAAMG,EAAK,SAAS,cAAc,KAAK,QAAQ,EACzCC,EAAM,SAAS,iBAAiB,KAAK,QAAQ,EAQnD,SAASC,EAAOC,EAAgBC,EAA2B,CAC9D,OAAKD,EAAG,UAASA,EAAKA,EAAG,eAClBA,EAAG,QAAQC,CAAC,EAAID,EAAKA,EAAG,QAAQC,CAAC,CAC5C,CAHgBR,EAAAM,EAAA,SAAAN,EAAAM,EAAA,OAAA,yFCxBMG,EAAf,MAAeC,UAAqB,OAAO,WAAY,OAAA,CAAAC,EAAA,qBAP9D,MAO8D,CAAAA,EAAA,KAAA,cAAA,CAAA,CAC1D,OAAO,IAAa,GACpB,IAAa,GAEb,OAAO,MAAOC,EAAiC,CAC3C,OAAOC,EAAOD,EAAI,KAAK,GAAG,CAC9B,CAOQ,yBAAsD,IAAI,IAO1D,6BAA0D,IAAI,IAEtE,OAAO,OAAQE,EAKb,CACE,IAAMC,EAAe,cAAcL,CAAa,OAAA,CAAAC,EAAA,qBAnCxD,MAmCwD,CAAAA,EAAA,KAAA,cAAA,CAAA,CAC5C,OAAO,IAAMG,EACb,IAAMA,EACN,QAAU,CACN,MAAM,IAAI,MAAM,4CAA4C,CAChE,CACJ,EAGA,OAAAC,EAAa,OAAS,UAAY,CAC9B,OAAOL,EAAa,OAAO,KAAK,IAAI,CACxC,EACAK,EAAa,MAAQ,SAAUC,EAAe,CAC1C,OAAON,EAAa,MAAM,KAAK,KAAMM,CAAM,CAC/C,EAEOD,CACX,CAEA,OAAO,QAGI,CACPE,EAAO,KAAK,IAAK,IAAI,CACzB,CAaA,MAAM,yBACFC,EACAC,EACAC,EACY,CACZ,IAAMC,EAAU,KAAK,gBAAgBH,CAAI,EAAE,EACvCG,GACA,MAAMA,EAAQ,KAAK,KAAMF,EAAUC,CAAQ,CAEnD,CAcA,iBACIE,EACAC,EACAC,EACI,CACAF,IAASZ,EAAa,MAAM,KAAK,KAAM,GAAG,EAE1C,KAAK,6BAA6B,IAAI,CAAE,SAAAa,EAAU,QAAAC,CAAQ,CAAC,EACpDF,IAAS,IAEZC,GACA,KAAK,yBAAyB,IAAI,CAAE,SAAAA,EAAU,QAAAC,CAAQ,CAAC,EAI3D,MAAM,iBAAiBF,EAAMC,EAAUC,CAAO,CAEtD,CASQ,mCAAoCC,EAAoB,CAC5D,GAAI,KAAK,6BAA6B,OAAS,EAC3C,OAGJ,IAAMC,EAAgB,KAAK,IAGvB,CAACA,GAAiB,CAACD,EAAM,KAAK,WAAW,GAAGC,CAAa,GAAG,GAKhE,KAAK,6BAA6B,QAAQ,CAAC,CAAE,SAAAH,CAAS,IAAM,CACxD,GAAI,CACI,OAAOA,GAAa,WACpBA,EAAS,KAAK,KAAME,CAAK,EAClBF,GAAY,OAAOA,EAAS,aAAgB,YACnDA,EAAS,YAAYE,CAAK,CAElC,OAASE,EAAO,CAEZ,QAAQ,MACJ,+CACAA,CACJ,CACJ,CACJ,CAAC,CACL,CASQ,+BAAgCF,EAAoB,CACpD,KAAK,yBAAyB,OAAS,GAK3C,KAAK,yBAAyB,QAAQ,CAAC,CAAE,SAAAF,CAAS,IAAM,CACpD,GAAI,CACI,OAAOA,GAAa,WACpBA,EAAS,KAAK,KAAME,CAAK,EAClBF,GAAY,OAAOA,EAAS,aAAgB,YACnDA,EAAS,YAAYE,CAAK,CAElC,OAASE,EAAO,CAEZ,QAAQ,MAAM,2CAA4CA,CAAK,CACnE,CACJ,CAAC,CACL,CAEA,mBAAqB,CACjB,KAAK,OAAO,CAChB,CASA,GAAIC,EAA8B,CAC9B,OAAO,KAAK,cAAcA,CAAQ,CACtC,CAOA,IAAKA,EAAqC,CACtC,OAAO,KAAK,iBAAiBA,CAAQ,CACzC,CAQA,OAAO,MAAOZ,EAAsB,CAChC,OAAOa,EAAU,KAAK,IAAKb,CAAM,CACrC,CAUA,KAAeM,EAAaQ,EAIvB,CAAC,EAAW,CACb,GAAIR,IAAS,IAAK,MAAM,IAAI,MAAM,6BAA6B,EAE/D,GAAM,CAAE,QAAAS,EAAU,GAAM,WAAAC,EAAa,GAAM,OAAAC,CAAO,EAAIH,EAChDI,EAAiB,GAAG,KAAK,GAAG,IAAIZ,CAAI,GAEpCG,EAAQ,IAAI,YAAYS,EAAgB,CAC1C,QAAAH,EACA,WAAAC,EACA,OAAAC,CACJ,CAAC,EAIKE,EAAS,KAAK,cAAcV,CAAK,EAGvC,YAAK,mCAAmCA,CAAK,EAEtCU,CACX,CASA,cAAeV,EAAuB,CAClC,IAAMU,EAAS,MAAM,cAAcV,CAAK,EAGxC,YAAK,+BAA+BA,CAAK,EAElCU,CACX,CAKA,SAAab,EAAaQ,EAIrB,CAAC,EAAW,CACb,IAAML,EAAQ,IAAI,YAAYH,EAAM,CAChC,QAAUQ,EAAK,UAAY,OAAa,GAAOA,EAAK,QACpD,WAAaA,EAAK,aAAe,OAAa,GAAOA,EAAK,WAC1D,OAAQA,EAAK,MACjB,CAAC,EAED,OAAO,KAAK,cAAcL,CAAK,CACnC,CAiBA,GACIW,EACAf,EACAG,EACG,CACH,IAAMa,EAAa3B,EAAa,MAAM,KAAK,KAAM0B,CAAM,EACvD,KAAK,iBAAiBC,EAAYhB,EAA+CG,CAAO,CAC5F,CAYA,oBACIF,EACAC,EACAC,EACI,CACJ,GAAIF,IAASZ,EAAa,MAAM,KAAK,KAAM,GAAG,GAE1C,GAAIa,GAAY,KAAK,8BACjB,QAAWe,KAAS,KAAK,6BACrB,GAAIA,EAAM,WAAaf,EAAU,CAC7B,KAAK,6BAA6B,OAAOe,CAAK,EAC9C,KACJ,WAGDhB,IAAS,KAEhB,GAAIC,GAAY,KAAK,0BACjB,QAAWe,KAAS,KAAK,yBACrB,GAAIA,EAAM,WAAaf,EAAU,CAC7B,KAAK,yBAAyB,OAAOe,CAAK,EAC1C,KACJ,QAKR,MAAM,oBAAoBhB,EAAMC,EAAUC,CAAO,CAEzD,CACJ,EAEA,SAASK,EAAWU,EAAkBvB,EAAe,CACjD,MAAO,GAAGuB,CAAS,IAAIvB,CAAM,EACjC,CAFSL,EAAAkB,EAAA,aAAAlB,EAAAkB,EAAA,WAAA,EAWF,SAASW,EAAcC,EAAuB,CACjD,OAAO,SAAS,cAAcA,CAAM,EAAE,cAAgB,OAAO,WACjE,CAFgB9B,EAAA6B,EAAA,gBAAA7B,EAAA6B,EAAA,cAAA,EAIT,SAASvB,EAAQC,EAAawB,EAAkC,CAC9D,QACC,mBAAoB,SAErBF,EAAatB,CAAI,GAClB,OAAO,eAAe,OAAOA,EAAMwB,CAAO,EAElD,CAPgB/B,EAAAM,EAAA,UAAAN,EAAAM,EAAA,QAAA,ECzVT,IAAM0B,EAAN,MAAMC,UAAwBC,EAAa,OAAO,kBAAkB,CAAE,CAf7E,MAe6E,CAAAC,EAAA,wBAEzE,OAAO,mBAAqB,CAAC,YAAa,WAAY,UAAU,EAChE,OAAO,IAAM,mBACb,YAEA,OAAO,QAAU,CACbC,EAAOH,EAAgB,IAAKA,CAAe,CAC/C,CAEA,aAAe,CACX,MAAM,EACW,KAAK,aAAa,UAAU,IAC5B,MACb,WAAW,IAAM,CAEb,KAAK,SAAW,EACpB,EAAG,CAAC,EAER,KAAK,UAAa,KAAK,aAAa,WAAW,IAAM,KACrD,KAAK,YAAe,KAAK,aAAa,UAAU,IAAM,IAC1D,CAEA,IAAI,MAAuC,CACvC,OAAO,KAAK,QAAQ,IACxB,CAEA,IAAI,UAAoB,CACpB,MAAO,CAAC,CAAE,KAAK,QAAQ,aAAa,UAAU,CAClD,CAEA,IAAI,SAAUI,EAAuB,
|
|
6
|
-
"names": ["html", "attrs", "textContent", "type", "autofocus", "tabindex", "disabled", "classes", "name", "ariaLabel", "_classes", "arr", "btnProps", "__name", "toAttributes", "attrs", "acc", "k", "value", "__name", "isRegistered", "elName", "__name", "define", "name", "element", "qs", "qsa", "match", "el", "s", "WebComponent", "_WebComponent", "__name", "el", "match", "elementName", "CreatedClass", "evType", "define", "name", "oldValue", "newValue", "handler", "type", "listener", "options", "event", "componentName", "error", "selector", "eventName", "opts", "bubbles", "cancelable", "detail", "namespacedType", "result", "evName", "fullEvName", "entry", "namespace", "isRegistered", "elName", "element", "SubstrateButton", "_SubstrateButton", "WebComponent", "__name", "define", "disabledValue", "i", "value", "name", "_oldValue", "newValue", "_old", "_", "e", "SubstrateButton", "_SubstrateButton", "__name", "define", "type", "
|
|
4
|
+
"sourcesContent": ["export type Attrs = {\n type:string|null;\n autofocus:boolean;\n tabindex:string|number;\n disabled:boolean;\n name:string|null;\n classes:string[]|Set<string>;\n ariaLabel:string|null;\n}\n\nexport function html (attrs:Partial<Attrs>, textContent:string) {\n const {\n type,\n autofocus,\n tabindex,\n disabled,\n classes,\n name,\n ariaLabel\n } = attrs\n\n const _classes = new Set(classes)\n _classes.add('substrate-button btn')\n const arr = Array.from(_classes)\n\n const btnProps = ([\n arr.length ? `class=\"${arr.filter(Boolean).join(' ')}\"` : '',\n disabled ? 'disabled' : '',\n autofocus ? 'autofocus' : '',\n type ? `type=\"${type}\"` : '',\n name ? `name=${name}` : '',\n tabindex ? `tabindex=\"${tabindex}\"` : 'tabindex=\"0\"',\n 'role=\"button\"',\n ariaLabel ? `aria-label=\"${ariaLabel}\"` : '',\n 'aria-live=\"polite\"'\n ]).filter(Boolean).join(' ')\n\n // rendering in node?\n return typeof window === 'undefined' ?\n `<substrate-button${disabled ? ' disabled' : ''}>\n <button ${btnProps}><span class=\"btn-content\">${textContent}</span></button>\n </substrate-button>` :\n `<button ${btnProps}>\n <span class=\"btn-content\">${textContent}</span>\n </button>`\n}\n", "export type Attrs = Record<string, undefined|null|string|number|boolean|(string|number)[]>\n\n/**\n * Transform an object into an HTML attributes string. The object should be\n * like `{ attributeName: value }`.\n *\n * @param attrs An object for the attributes.\n * @returns {string} A string suitable for use as HTML attributes.\n */\nexport function toAttributes (attrs:Attrs):string {\n return Object.keys(attrs).reduce((acc, k) => {\n const value = attrs[k]\n if (!value) return acc\n\n if (typeof value === 'boolean') {\n if (value) return (acc + ` ${k}`).trim()\n return acc\n }\n\n if (Array.isArray(value)) {\n return (acc + ` ${k}=\"${value.join(' ')}\"`)\n }\n\n return (acc + ` ${k}=\"${value}\"`).trim()\n }, '')\n}\n", "export { toAttributes } from './attributes.js'\n\n/**\n * Check if the given tag name has been registered.\n *\n * @see {@link https://stackoverflow.com/a/28210364 stackoverflow}\n * @param {string} elName The custom element tag name.\n * @returns {boolean} True if the given name has been registered already.\n */\nexport function isRegistered (elName:string):boolean {\n return document.createElement(elName).constructor !== window.HTMLElement\n}\n\nexport function define (name:string, element:CustomElementConstructor) {\n if (!window) return\n if (!('customElements' in window)) return\n\n if (!isRegistered(name)) {\n window.customElements.define(name, element)\n }\n}\n\nexport const qs = document.querySelector.bind(document)\nexport const qsa = document.querySelectorAll.bind(document)\n\n/**\n * Get the closes parent element matching the given selector.\n * @param el Element to start from\n * @param s Selector for an element\n * @returns {HTMLElement|null} The closes parent element that matches.\n */\nexport function match (el:HTMLElement, s:string):HTMLElement|null {\n if (!el.matches) el = el.parentElement!\n return el.matches(s) ? el : el.closest(s)\n}\n", "import { match as _match } from './util.js'\n\ninterface WildcardListenerEntry {\n listener:EventListenerOrEventListenerObject\n options?:boolean|AddEventListenerOptions\n}\n\nexport abstract class WebComponent extends window.HTMLElement {\n static TAG:string = ''\n TAG:string = ''\n\n static match (el:HTMLElement):HTMLElement|null {\n return _match(el, this.TAG)\n }\n\n /**\n * Store global wildcard listeners (listen to all events)\n * Triggered by ALL events dispatched through this element\n * @private\n */\n private _globalWildcardListeners:Set<WildcardListenerEntry> = new Set()\n\n /**\n * Store namespaced wildcard listeners (listen to 'component-name:*')\n * Triggered by events from emit() that match this component's namespace\n * @private\n */\n private _namespacedWildcardListeners:Set<WildcardListenerEntry> = new Set()\n\n static create (elementName:string):typeof WebComponent & {\n new (...args:any[]):WebComponent;\n TAG:string;\n define: typeof WebComponent.define;\n event: typeof WebComponent.event;\n } {\n const CreatedClass = class extends WebComponent {\n static TAG = elementName\n TAG = elementName\n render () {\n throw new Error('`render` should be implemented by children')\n }\n }\n\n // Copy static methods with proper binding\n CreatedClass.define = function () {\n return WebComponent.define.call(this)\n }\n CreatedClass.event = function (evType:string) {\n return WebComponent.event.call(this, evType)\n }\n\n return CreatedClass\n }\n\n static define<T extends {\n new (...args:any[]):WebComponent;\n TAG:string;\n }>(this:T) {\n define(this.TAG, this)\n }\n\n /**\n * Runs when the value of an attribute is changed.\n *\n * Depends on `static observedAttributes`.\n *\n * Should name methods like `handleChange_disabled`.\n *\n * @param {string} name The attribute name\n * @param {string} oldValue The old attribute value\n * @param {string} newValue The new attribute value\n */\n async attributeChangedCallback (\n name:string,\n oldValue:string,\n newValue:string\n ):Promise<void> {\n const handler = this[`handleChange_${name}`]\n if (handler) {\n await handler.call(this, oldValue, newValue)\n }\n }\n\n /**\n * Enhanced addEventListener that supports wildcards:\n * - Component.event('*') - Listen to all namespaced events for this\n * component (e.g., 'my-component:*')\n * - '*' - Listen to ALL events (namespaced and non-namespaced, including\n * normal DOM events)\n *\n * @param type - Event type, Component.event('*') for namespaced wildcard,\n * or '*' for global wildcard\n * @param listener - Event listener function or object\n * @param options - Event listener options\n */\n addEventListener (\n type:string,\n listener:EventListenerOrEventListenerObject,\n options?:boolean|AddEventListenerOptions\n ): void {\n if (type === WebComponent.event.call(this, '*')) {\n // Handle namespaced wildcard listener (component-name:*)\n this._namespacedWildcardListeners.add({ listener, options })\n } else if (type === '*') {\n // Handle global wildcard listener (all events)\n if (listener) {\n this._globalWildcardListeners.add({ listener, options })\n }\n } else {\n // Normal event listener - delegate to native implementation\n super.addEventListener(type, listener, options)\n }\n }\n\n /**\n * Notify namespaced wildcard listeners of an event\n * Only fires for events that match this component's namespace\n *\n * @param event - The event to dispatch to namespaced wildcard listeners\n * @private\n */\n private _notifyNamespacedWildcardListeners (event: Event): void {\n if (this._namespacedWildcardListeners.size === 0) {\n return\n }\n\n const componentName = this.TAG\n\n // Only trigger for events in this component's namespace\n if (!componentName || !event.type.startsWith(`${componentName}:`)) {\n return\n }\n\n // Call each namespaced wildcard listener\n this._namespacedWildcardListeners.forEach(({ listener }) => {\n try {\n if (typeof listener === 'function') {\n listener.call(this, event)\n } else if (listener && typeof listener.handleEvent === 'function') {\n listener.handleEvent(event)\n }\n } catch (error) {\n // Log errors but don't let one listener break others\n console.error(\n 'Error in namespaced wildcard event listener:',\n error\n )\n }\n })\n }\n\n /**\n * Notify global wildcard listeners of an event\n * Fires for ALL events dispatched through this element\n *\n * @param event - The event to dispatch to global wildcard listeners\n * @private\n */\n private _notifyGlobalWildcardListeners (event: Event): void {\n if (this._globalWildcardListeners.size === 0) {\n return\n }\n\n // Call each global wildcard listener\n this._globalWildcardListeners.forEach(({ listener }) => {\n try {\n if (typeof listener === 'function') {\n listener.call(this, event)\n } else if (listener && typeof listener.handleEvent === 'function') {\n listener.handleEvent(event)\n }\n } catch (error) {\n // Log errors but don't let one listener break others\n console.error('Error in global wildcard event listener:', error)\n }\n })\n }\n\n connectedCallback () {\n this.render()\n }\n\n abstract render ():any\n\n qs<K extends keyof HTMLElementTagNameMap>(\n selector:K\n ):HTMLElementTagNameMap[K]|null;\n\n qs<E extends Element = Element>(selector:string):E|null;\n qs (selector:string):Element|null {\n return this.querySelector(selector)\n }\n\n qsa<K extends keyof HTMLElementTagNameMap>(\n selector:K\n ):HTMLElementTagNameMap[K]|null;\n\n qsa<E extends Element = Element>(selector:string):E|null;\n qsa (selector:string):NodeListOf<Element> {\n return this.querySelectorAll(selector)\n }\n\n /**\n * Take a non-namepsaced event name, return namespace event name.\n *\n * @param {string} evType The non-namespace event name\n * @returns {string} Namespaced event name, eg, `my-component:click`\n */\n static event (evType:string):string {\n return eventName(this.TAG, evType)\n }\n\n /**\n * Emit a namespaced event.\n *\n * @param type (non-namespaced) event type string\n * @param opts `bubbles`, `detail`, and `cancelable`. Default is\n * `{ bubbles: true, cancelable: true }`\n * @returns {boolean}\n */\n emit<T = any> (type:string, opts:Partial<{\n bubbles:boolean,\n cancelable:boolean,\n detail:CustomEvent<T>['detail']\n }> = {}):boolean {\n if (type === '*') throw new Error('Do not emit the literal \"*\"')\n\n const { bubbles = true, cancelable = true, detail } = opts\n const namespacedType = `${this.TAG}:${type}`\n\n const event = new CustomEvent(namespacedType, {\n bubbles,\n cancelable,\n detail\n })\n\n // This will trigger both specific listeners and global wildcard\n // listeners (**)\n const result = this.dispatchEvent(event)\n\n // Notify namespaced wildcard listeners (*)\n this._notifyNamespacedWildcardListeners(event)\n\n return result\n }\n\n /**\n * Override dispatchEvent to notify global wildcard listeners\n * This ensures that '**' listeners catch ALL events\n *\n * @param event - The event to dispatch\n * @returns true if the event was not cancelled\n */\n dispatchEvent (event: Event): boolean {\n const result = super.dispatchEvent(event)\n\n // Notify global wildcard listeners for ALL events\n this._notifyGlobalWildcardListeners(event)\n\n return result\n }\n\n /**\n * Create and emit an event, no namespacing.\n */\n dispatch<T> (type:string, opts:Partial<{\n bubbles:boolean,\n cancelable:boolean,\n detail:CustomEvent<T>['detail']\n }> = {}):boolean {\n const event = new CustomEvent(type, {\n bubbles: (opts.bubbles === undefined) ? true : opts.bubbles,\n cancelable: (opts.cancelable === undefined) ? true : opts.cancelable,\n detail: opts.detail\n })\n\n return this.dispatchEvent(event)\n }\n\n /**\n * Listen for namespaced events.\n */\n on<T extends Event = Event> (\n evName:string,\n handler:(ev:T)=>any,\n options?:boolean|AddEventListenerOptions\n ):void;\n\n on (\n evName:string,\n handler:EventListenerObject,\n options?:boolean|AddEventListenerOptions\n ):void;\n\n on (\n evName:string,\n handler:((ev:Event)=>any)|EventListenerObject,\n options?:boolean|AddEventListenerOptions\n ):void {\n const fullEvName = WebComponent.event.call(this, evName)\n this.addEventListener(fullEvName, handler as EventListenerOrEventListenerObject, options)\n }\n\n /**\n * Enhanced removeEventListener that supports wildcards:\n * - Component.event('*') - Remove namespaced wildcard listener\n * - '*' - Remove global wildcard listener\n *\n * @param type - Event type, Component.event('*') for namespaced, or '*'\n * for global\n * @param listener - Event listener function or object to remove\n * @param options - Event listener options\n */\n removeEventListener (\n type:string,\n listener:EventListenerOrEventListenerObject,\n options?: boolean | EventListenerOptions\n ): void {\n if (type === WebComponent.event.call(this, '*')) {\n // Remove namespaced wildcard listener\n if (listener && this._namespacedWildcardListeners) {\n for (const entry of this._namespacedWildcardListeners) {\n if (entry.listener === listener) {\n this._namespacedWildcardListeners.delete(entry)\n break\n }\n }\n }\n } else if (type === '*') {\n // Remove global wildcard listener\n if (listener && this._globalWildcardListeners) {\n for (const entry of this._globalWildcardListeners) {\n if (entry.listener === listener) {\n this._globalWildcardListeners.delete(entry)\n break\n }\n }\n }\n } else {\n // Normal event listener - delegate to native implementation\n super.removeEventListener(type, listener, options)\n }\n }\n}\n\nfunction eventName (namespace:string, evType:string) {\n return `${namespace}:${evType}`\n}\n\n/**\n * Check if the given tag name has been registered.\n *\n * @see {@link https://stackoverflow.com/a/28210364 stackoverflow}\n * @param {string} elName The custom element tag name.\n * @returns {boolean} True if the given name has been registered already.\n */\nexport function isRegistered (elName:string):boolean {\n return document.createElement(elName).constructor !== window.HTMLElement\n}\n\nexport function define (name:string, element:CustomElementConstructor) {\n if (!window) return\n if (!('customElements' in window)) return\n\n if (!isRegistered(name)) {\n window.customElements.define(name, element)\n }\n}\n", "import { WebComponent, define } from '@substrate-system/web-component'\n\n// for docuement.querySelector\ndeclare global {\n interface HTMLElementTagNameMap {\n 'substrate-button': SubstrateButton\n }\n}\n\n/**\n * This is the lightweight version for browsers.\n * It \"hydrates\" only, meaining sets up event listeners.\n * It does not know how to render itself.\n */\n\nexport class SubstrateButton extends WebComponent.create('substrate-button') {\n // for `attributeChangedCallback`\n static observedAttributes = ['autofocus', 'disabled', 'spinning']\n static TAG = 'substrate-button'\n _isSpinning:boolean\n\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n constructor () {\n super()\n const disabled = this.getAttribute('disabled')\n if (disabled !== null) {\n setTimeout(() => {\n // need to wait for it to render\n this.disabled = true\n }, 0)\n }\n this.autofocus = (this.getAttribute('autofocus') !== null)\n this._isSpinning = (this.getAttribute('spinning') !== null)\n }\n\n get form ():HTMLFormElement|undefined|null {\n return this.button?.form\n }\n\n get disabled ():boolean {\n return !!(this.button?.hasAttribute('disabled'))\n }\n\n set disabled (disabledValue:boolean) {\n // Reflect to host attribute; guard against re-entrancy\n if (this.hasAttribute('disabled') !== disabledValue) {\n this.toggleAttribute('disabled', disabledValue)\n }\n if (!disabledValue) {\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-disabled', 'false')\n } else {\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-disabled', 'true')\n }\n }\n\n get type ():string|null|undefined {\n return this.button?.getAttribute('type')\n }\n\n get tabindex ():number {\n const i = this.button?.getAttribute('tabindex')\n if (!i) return 0\n return parseInt(i)\n }\n\n get spinning ():boolean {\n return this._isSpinning\n }\n\n set spinning (value:boolean) {\n if (value) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.setAttribute('spinning', '')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.removeAttribute('spinning')\n }\n }\n\n set type (value:string) {\n this._setAttribute('type', value)\n }\n\n get autofocus ():boolean {\n return !!(this.button?.hasAttribute('autofocus'))\n }\n\n set autofocus (value:boolean) {\n // Reflect to host attribute; guard against re-entrancy\n if (this.hasAttribute('autofocus') !== value) {\n this.toggleAttribute('autofocus', value)\n }\n this.button?.toggleAttribute('autofocus', value)\n }\n\n /**\n * Set attributes on the internal button element.\n */\n _setAttribute (name:string, value:boolean|string|null):void {\n if (value === false) {\n // false means remove the attribute\n this._removeAttribute(name)\n this.button?.removeAttribute(name)\n } else {\n if (value === true) {\n // true means set the attribute with no value\n return this.button?.setAttribute(name, '')\n }\n\n if (value === null) {\n // null means remove\n return this._removeAttribute(name)\n }\n\n // else, set value to a string\n this.button?.setAttribute(name, value)\n }\n }\n\n /**\n * Remove from `this` and also button child.\n */\n _removeAttribute (name:string) {\n this.removeAttribute(name)\n this.button?.removeAttribute(name)\n }\n\n get button ():HTMLButtonElement|null {\n return this.querySelector('button')\n }\n\n /**\n * Handle 'autofocus' attribute changes\n * @see {@link https://gomakethings.com/how-to-detect-when-attributes-change-on-a-web-component/#organizing-your-code Go Make Things article}\n *\n * @param {string} oldValue The old attribute value\n * @param {string} newValue The new attribute value\n */\n handleChange_autofocus (_oldValue:string, newValue:string|null) {\n this.button?.toggleAttribute('autofocus', newValue !== null)\n }\n\n handleChange_disabled (_old:string|null, newValue:string|null) {\n const isDisabled = newValue !== null\n if (isDisabled) {\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-disabled', 'true')\n } else {\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-disabled', 'false')\n }\n }\n\n handleChange_spinning (_, newValue:boolean) {\n if (newValue !== null) {\n this.classList.add('spinning')\n this.button?.classList.add('spinning')\n this.button?.setAttribute('disabled', '')\n this.button?.setAttribute('aria-busy', 'true')\n } else {\n this.classList.remove('spinning')\n this.button?.classList.remove('spinning')\n this.button?.removeAttribute('disabled')\n this.button?.setAttribute('aria-busy', 'false')\n }\n }\n\n connectedCallback () {\n // connect event listeners\n this.render()\n this._setupKeyboardHandlers()\n }\n\n _setupKeyboardHandlers () {\n // Space and Enter should trigger click\n this.button?.addEventListener('keydown', (e:KeyboardEvent) => {\n if (e.key === ' ' || e.key === 'Enter') {\n e.preventDefault()\n this.button?.click()\n }\n })\n }\n\n render () {\n // noop\n }\n}\n", "import { html } from './html.js'\nimport { define } from '@substrate-system/web-component'\nimport { SubstrateButton as SubstrateButtonLight } from './client.js'\n// import Debug from '@substrate-system/debug'\n// const debug = Debug('button')\n\n/**\n * This is the full-version -- knows how to render itself in the browser.\n */\nexport class SubstrateButton extends SubstrateButtonLight {\n static define () {\n define(SubstrateButton.TAG, SubstrateButton)\n }\n\n connectedCallback ():void {\n this.render()\n this._setupKeyboardHandlers()\n }\n\n render () {\n if (this.querySelector('button')) return\n const { type, tabindex } = this\n // Read directly from host attributes: the inner button does not\n // exist yet when render() first runs, so the getters (which\n // read from the inner button) would return false.\n const disabled = this.hasAttribute('disabled')\n const autofocus = this.hasAttribute('autofocus')\n const name = this.getAttribute('name')\n const ariaLabel = this.getAttribute('aria-label')\n\n const spinning = this.getAttribute('spinning') !== null\n\n const classes:(string|null)[] = [\n 'substrate-button',\n this.getAttribute('class'),\n spinning ? 'spinning' : null\n ]\n const text = this.innerHTML\n\n const btnProps = {\n classes: classes.filter(Boolean),\n disabled,\n autofocus,\n tabindex,\n type,\n name,\n ariaLabel,\n }\n\n this.innerHTML = html(btnProps, text)\n }\n}\n\ndefine('substrate-button', SubstrateButton)\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["html", "attrs", "textContent", "type", "autofocus", "tabindex", "disabled", "classes", "name", "ariaLabel", "_classes", "arr", "btnProps", "__name", "toAttributes", "attrs", "acc", "k", "value", "__name", "isRegistered", "elName", "__name", "define", "name", "element", "qs", "qsa", "match", "el", "s", "WebComponent", "_WebComponent", "__name", "el", "match", "elementName", "CreatedClass", "evType", "define", "name", "oldValue", "newValue", "handler", "type", "listener", "options", "event", "componentName", "error", "selector", "eventName", "opts", "bubbles", "cancelable", "detail", "namespacedType", "result", "evName", "fullEvName", "entry", "namespace", "isRegistered", "elName", "element", "SubstrateButton", "_SubstrateButton", "WebComponent", "__name", "define", "disabledValue", "i", "value", "name", "_oldValue", "newValue", "_old", "_", "e", "SubstrateButton", "_SubstrateButton", "__name", "define", "type", "tabindex", "disabled", "autofocus", "name", "ariaLabel", "spinning", "classes", "text", "btnProps", "html"]
|
|
7
7
|
}
|
package/dist/meta.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"inputs": {
|
|
3
3
|
"src/client.ts": {
|
|
4
|
-
"bytes":
|
|
4
|
+
"bytes": 5996,
|
|
5
5
|
"imports": [],
|
|
6
6
|
"format": "esm"
|
|
7
7
|
},
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
"format": "esm"
|
|
12
12
|
},
|
|
13
13
|
"src/index.ts": {
|
|
14
|
-
"bytes":
|
|
14
|
+
"bytes": 1665,
|
|
15
15
|
"imports": [],
|
|
16
16
|
"format": "esm"
|
|
17
17
|
}
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"imports": [],
|
|
22
22
|
"exports": [],
|
|
23
23
|
"inputs": {},
|
|
24
|
-
"bytes":
|
|
24
|
+
"bytes": 9346
|
|
25
25
|
},
|
|
26
26
|
"dist/client.js": {
|
|
27
27
|
"imports": [
|
|
@@ -37,10 +37,10 @@
|
|
|
37
37
|
"entryPoint": "src/client.ts",
|
|
38
38
|
"inputs": {
|
|
39
39
|
"src/client.ts": {
|
|
40
|
-
"bytesInOutput":
|
|
40
|
+
"bytesInOutput": 4478
|
|
41
41
|
}
|
|
42
42
|
},
|
|
43
|
-
"bytes":
|
|
43
|
+
"bytes": 4672
|
|
44
44
|
},
|
|
45
45
|
"dist/html.js.map": {
|
|
46
46
|
"imports": [],
|
|
@@ -65,7 +65,7 @@
|
|
|
65
65
|
"imports": [],
|
|
66
66
|
"exports": [],
|
|
67
67
|
"inputs": {},
|
|
68
|
-
"bytes":
|
|
68
|
+
"bytes": 2587
|
|
69
69
|
},
|
|
70
70
|
"dist/index.js": {
|
|
71
71
|
"imports": [
|
|
@@ -91,10 +91,10 @@
|
|
|
91
91
|
"entryPoint": "src/index.ts",
|
|
92
92
|
"inputs": {
|
|
93
93
|
"src/index.ts": {
|
|
94
|
-
"bytesInOutput":
|
|
94
|
+
"bytesInOutput": 1196
|
|
95
95
|
}
|
|
96
96
|
},
|
|
97
|
-
"bytes":
|
|
97
|
+
"bytes": 1389
|
|
98
98
|
}
|
|
99
99
|
}
|
|
100
100
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@substrate-system/button",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.38",
|
|
4
4
|
"description": "A button component with a visual \"loading\" state",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/index.js",
|
|
@@ -50,18 +50,21 @@
|
|
|
50
50
|
},
|
|
51
51
|
"devDependencies": {
|
|
52
52
|
"@substrate-system/debug": "^0.9.52",
|
|
53
|
-
"@substrate-system/tapout": "^0.0.35",
|
|
54
53
|
"@substrate-system/dom": "^0.1.13",
|
|
54
|
+
"@substrate-system/tapout": "^0.0.37",
|
|
55
55
|
"@substrate-system/tapzero": "^0.10.16",
|
|
56
56
|
"@typescript-eslint/eslint-plugin": "^8.7.0",
|
|
57
57
|
"@typescript-eslint/parser": "^8.7.0",
|
|
58
58
|
"auto-changelog": "^2.4.0",
|
|
59
|
+
"browserslist": "^4.28.1",
|
|
59
60
|
"esbuild": "^0.27.0",
|
|
60
61
|
"eslint": "^8.57.0",
|
|
61
62
|
"eslint-config-standard": "^17.1.0",
|
|
63
|
+
"htm": "^3.1.1",
|
|
62
64
|
"lightningcss": "^1.31.1",
|
|
63
65
|
"lightningcss-cli": "^1.31.1",
|
|
64
66
|
"markdown-toc": "^1.2.0",
|
|
67
|
+
"preact": "^10.29.0",
|
|
65
68
|
"stylelint": "^17.3.0",
|
|
66
69
|
"stylelint-config-standard": "^40.0.0",
|
|
67
70
|
"tap-spec": "^5.0.0",
|