@haiilo/catalyst 0.2.3 → 0.3.1
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/dist/catalyst/catalyst.css +1 -1959
- package/dist/catalyst/catalyst.esm.js +1 -131
- package/dist/catalyst/catalyst.esm.js.map +1 -1
- package/dist/catalyst/index.esm.js +1 -2
- package/dist/catalyst/index.esm.js.map +1 -1
- package/dist/catalyst/p-31b500c7.entry.js +10 -0
- package/dist/catalyst/p-31b500c7.entry.js.map +1 -0
- package/dist/catalyst/p-ed826597.js +2 -0
- package/dist/catalyst/p-ed826597.js.map +1 -0
- package/dist/catalyst/p-ef0a8ae9.js +2 -0
- package/dist/catalyst/p-ef0a8ae9.js.map +1 -0
- package/dist/catalyst/p-f151cb13.js +2 -0
- package/dist/catalyst/p-f151cb13.js.map +1 -0
- package/dist/cjs/app-globals-7f2b1f8e.js +173 -0
- package/dist/cjs/app-globals-7f2b1f8e.js.map +1 -0
- package/dist/cjs/cat-alert_8.cjs.entry.js +4450 -0
- package/dist/cjs/cat-alert_8.cjs.entry.js.map +1 -0
- package/dist/cjs/cat-icon-registry-850c538c.js +47 -0
- package/dist/cjs/cat-icon-registry-850c538c.js.map +1 -0
- package/dist/cjs/catalyst.cjs.js +24 -0
- package/dist/cjs/catalyst.cjs.js.map +1 -0
- package/dist/cjs/index-c0881ae0.js +1348 -0
- package/dist/cjs/index-c0881ae0.js.map +1 -0
- package/dist/cjs/index.cjs.js +11 -0
- package/dist/cjs/index.cjs.js.map +1 -0
- package/dist/cjs/loader.cjs.js +26 -0
- package/dist/cjs/loader.cjs.js.map +1 -0
- package/dist/collection/collection-manifest.json +20 -0
- package/dist/collection/components/cat-alert/cat-alert.css +57 -0
- package/dist/collection/components/cat-alert/cat-alert.js +50 -0
- package/dist/collection/components/cat-alert/cat-alert.js.map +1 -0
- package/dist/collection/components/cat-badge/cat-badge.css +154 -0
- package/dist/collection/components/cat-badge/cat-badge.js +142 -0
- package/dist/collection/components/cat-badge/cat-badge.js.map +1 -0
- package/dist/collection/components/cat-button/cat-button.css +323 -0
- package/dist/collection/components/cat-button/cat-button.js +591 -0
- package/dist/collection/components/cat-button/cat-button.js.map +1 -0
- package/dist/collection/components/cat-icon/cat-icon-registry.js +42 -0
- package/dist/collection/components/cat-icon/cat-icon-registry.js.map +1 -0
- package/dist/collection/components/cat-icon/cat-icon.css +50 -0
- package/dist/collection/components/cat-icon/cat-icon.js +90 -0
- package/dist/collection/components/cat-icon/cat-icon.js.map +1 -0
- package/dist/collection/components/cat-menu/cat-menu.css +33 -0
- package/dist/collection/components/cat-menu/cat-menu.js +186 -0
- package/dist/collection/components/cat-menu/cat-menu.js.map +1 -0
- package/dist/collection/components/cat-scrollable/cat-scrollable.css +69 -0
- package/dist/collection/components/cat-scrollable/cat-scrollable.js +309 -0
- package/dist/collection/components/cat-scrollable/cat-scrollable.js.map +1 -0
- package/dist/collection/components/cat-skeleton/cat-skeleton.css +177 -0
- package/dist/collection/components/cat-skeleton/cat-skeleton.js +131 -0
- package/dist/collection/components/cat-skeleton/cat-skeleton.js.map +1 -0
- package/dist/collection/components/cat-spinner/cat-spinner.css +63 -0
- package/dist/collection/components/cat-spinner/cat-spinner.js +65 -0
- package/dist/collection/components/cat-spinner/cat-spinner.js.map +1 -0
- package/dist/collection/index.cdn.js +21 -0
- package/dist/collection/index.js +2 -0
- package/dist/collection/index.js.map +1 -0
- package/dist/collection/init.js +9 -0
- package/dist/collection/init.js.map +1 -0
- package/dist/collection/utils/breakpoints.js +12 -0
- package/dist/collection/utils/breakpoints.js.map +1 -0
- package/dist/collection/utils/media-matcher.js +55 -0
- package/dist/collection/utils/media-matcher.js.map +1 -0
- package/dist/collection/utils/platform.js +50 -0
- package/dist/collection/utils/platform.js.map +1 -0
- package/dist/collection/utils/utils.js +4 -0
- package/dist/collection/utils/utils.js.map +1 -0
- package/dist/{catalyst/cat-alert.entry.js → components/cat-alert.js} +28 -8
- package/dist/components/cat-alert.js.map +1 -0
- package/dist/{catalyst/cat-badge.entry.js → components/cat-badge.js} +32 -8
- package/dist/components/cat-badge.js.map +1 -0
- package/dist/{catalyst/cat-button.entry.js → components/cat-button.js} +60 -41
- package/dist/components/cat-button.js.map +1 -0
- package/dist/components/cat-icon-registry.js +45 -0
- package/dist/components/cat-icon-registry.js.map +1 -0
- package/dist/components/cat-icon.js +8 -0
- package/dist/components/cat-icon.js.map +1 -0
- package/dist/{catalyst/cat-icon.entry.js → components/cat-icon2.js} +28 -9
- package/dist/components/cat-icon2.js.map +1 -0
- package/dist/{catalyst/cat-menu.entry.js → components/cat-menu.js} +34 -642
- package/dist/components/cat-menu.js.map +1 -0
- package/dist/components/cat-scrollable.js +1363 -0
- package/dist/components/cat-scrollable.js.map +1 -0
- package/dist/{catalyst/cat-skeleton.entry.js → components/cat-skeleton.js} +31 -8
- package/dist/components/cat-skeleton.js.map +1 -0
- package/dist/components/cat-spinner.js +8 -0
- package/dist/components/cat-spinner.js.map +1 -0
- package/dist/{catalyst/cat-spinner.entry.js → components/cat-spinner2.js} +26 -8
- package/dist/components/cat-spinner2.js.map +1 -0
- package/dist/components/index.js +173 -0
- package/dist/components/index.js.map +1 -0
- package/dist/esm/app-globals-8af9b2cf.js +171 -0
- package/dist/esm/app-globals-8af9b2cf.js.map +1 -0
- package/dist/esm/cat-alert_8.entry.js +4439 -0
- package/dist/esm/cat-alert_8.entry.js.map +1 -0
- package/dist/{catalyst → esm}/cat-icon-registry-59da2e37.js +0 -0
- package/dist/{catalyst → esm}/cat-icon-registry-59da2e37.js.map +0 -0
- package/dist/esm/catalyst.js +22 -0
- package/dist/esm/catalyst.js.map +1 -0
- package/dist/esm/index-0ff35bca.js +1320 -0
- package/dist/esm/index-0ff35bca.js.map +1 -0
- package/dist/esm/index.js +3 -0
- package/dist/esm/index.js.map +1 -0
- package/dist/esm/loader.js +22 -0
- package/dist/esm/loader.js.map +1 -0
- package/dist/esm/polyfills/core-js.js +11 -0
- package/dist/esm/polyfills/css-shim.js +1 -0
- package/dist/esm/polyfills/dom.js +79 -0
- package/dist/esm/polyfills/es5-html-element.js +1 -0
- package/dist/esm/polyfills/index.js +34 -0
- package/dist/esm/polyfills/system.js +6 -0
- package/dist/index.cjs.js +1 -0
- package/dist/index.js +1 -0
- package/dist/types/index.d.ts +1 -0
- package/package.json +10 -17
- package/dist/catalyst/app-globals-54573336.js +0 -718
- package/dist/catalyst/app-globals-54573336.js.map +0 -1
- package/dist/catalyst/cat-alert.entry.js.map +0 -1
- package/dist/catalyst/cat-badge.entry.js.map +0 -1
- package/dist/catalyst/cat-button.entry.js.map +0 -1
- package/dist/catalyst/cat-icon.entry.js.map +0 -1
- package/dist/catalyst/cat-input.entry.js +0 -55
- package/dist/catalyst/cat-input.entry.js.map +0 -1
- package/dist/catalyst/cat-menu.entry.js.map +0 -1
- package/dist/catalyst/cat-scrollable.entry.js +0 -4523
- package/dist/catalyst/cat-scrollable.entry.js.map +0 -1
- package/dist/catalyst/cat-skeleton.entry.js.map +0 -1
- package/dist/catalyst/cat-spinner.entry.js.map +0 -1
- package/dist/catalyst/css-shim-e6dd2538.js +0 -6
- package/dist/catalyst/css-shim-e6dd2538.js.map +0 -1
- package/dist/catalyst/dom-7fc649b0.js +0 -75
- package/dist/catalyst/dom-7fc649b0.js.map +0 -1
- package/dist/catalyst/index-2df805aa.js +0 -3059
- package/dist/catalyst/index-2df805aa.js.map +0 -1
- package/dist/catalyst/shadow-css-4d56fa31.js +0 -390
- package/dist/catalyst/shadow-css-4d56fa31.js.map +0 -1
- package/dist/components/cat-input.d.ts +0 -11
- package/dist/types/components/cat-input/cat-input.d.ts +0 -70
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Auto-generated file. Do not edit directly.
|
|
3
|
+
*/
|
|
4
|
+
/* stylelint-disable value-keyword-case */
|
|
5
|
+
/* stylelint-enable value-keyword-case */
|
|
6
|
+
:host {
|
|
7
|
+
display: inline-flex;
|
|
8
|
+
vertical-align: middle;
|
|
9
|
+
/* stylelint-disable property-no-vendor-prefix */
|
|
10
|
+
-webkit-user-select: none;
|
|
11
|
+
-ms-user-select: none;
|
|
12
|
+
user-select: none;
|
|
13
|
+
/* stylelint-enable property-no-vendor-prefix */
|
|
14
|
+
}
|
|
15
|
+
:host[hidden] {
|
|
16
|
+
display: none;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
span {
|
|
20
|
+
display: inline-flex;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
svg {
|
|
24
|
+
fill: none;
|
|
25
|
+
stroke: currentColor;
|
|
26
|
+
stroke-dasharray: 135px;
|
|
27
|
+
stroke-dashoffset: 95px;
|
|
28
|
+
stroke-linecap: round;
|
|
29
|
+
stroke-width: 5px;
|
|
30
|
+
transform-origin: center center;
|
|
31
|
+
animation: cat-spinner 0.75s cubic-bezier(0.4, 0.15, 0.6, 0.85) infinite;
|
|
32
|
+
width: 1em;
|
|
33
|
+
height: 1em;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
.cat-spinner-xs svg {
|
|
37
|
+
font-size: 0.75rem;
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
.cat-spinner-s svg {
|
|
41
|
+
font-size: 1rem;
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
.cat-spinner-m svg {
|
|
45
|
+
font-size: 1.25rem;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.cat-spinner-l svg {
|
|
49
|
+
font-size: 1.5rem;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.cat-spinner-xl svg {
|
|
53
|
+
font-size: 1.75rem;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
@keyframes cat-spinner {
|
|
57
|
+
from {
|
|
58
|
+
transform: rotate(0deg);
|
|
59
|
+
}
|
|
60
|
+
to {
|
|
61
|
+
transform: rotate(360deg);
|
|
62
|
+
}
|
|
63
|
+
}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
import { Component, h, Prop } from '@stencil/core';
|
|
2
|
+
/**
|
|
3
|
+
* Spinners are used to indicate users that their action is being processed.
|
|
4
|
+
*/
|
|
5
|
+
export class CatSpinner {
|
|
6
|
+
constructor() {
|
|
7
|
+
/**
|
|
8
|
+
* The size of the spinner.
|
|
9
|
+
*/
|
|
10
|
+
this.size = 'm';
|
|
11
|
+
}
|
|
12
|
+
render() {
|
|
13
|
+
return (h("span", { "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', class: {
|
|
14
|
+
[`cat-spinner-${this.size}`]: this.size !== 'inline'
|
|
15
|
+
} },
|
|
16
|
+
h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48" },
|
|
17
|
+
h("circle", { cx: "24", cy: "24", r: "21.5" }))));
|
|
18
|
+
}
|
|
19
|
+
static get is() { return "cat-spinner"; }
|
|
20
|
+
static get encapsulation() { return "shadow"; }
|
|
21
|
+
static get originalStyleUrls() { return {
|
|
22
|
+
"$": ["cat-spinner.scss"]
|
|
23
|
+
}; }
|
|
24
|
+
static get styleUrls() { return {
|
|
25
|
+
"$": ["cat-spinner.css"]
|
|
26
|
+
}; }
|
|
27
|
+
static get properties() { return {
|
|
28
|
+
"size": {
|
|
29
|
+
"type": "string",
|
|
30
|
+
"mutable": false,
|
|
31
|
+
"complexType": {
|
|
32
|
+
"original": "'xs' | 's' | 'm' | 'l' | 'xl' | 'inline'",
|
|
33
|
+
"resolved": "\"inline\" | \"l\" | \"m\" | \"s\" | \"xl\" | \"xs\"",
|
|
34
|
+
"references": {}
|
|
35
|
+
},
|
|
36
|
+
"required": false,
|
|
37
|
+
"optional": false,
|
|
38
|
+
"docs": {
|
|
39
|
+
"tags": [],
|
|
40
|
+
"text": "The size of the spinner."
|
|
41
|
+
},
|
|
42
|
+
"attribute": "size",
|
|
43
|
+
"reflect": false,
|
|
44
|
+
"defaultValue": "'m'"
|
|
45
|
+
},
|
|
46
|
+
"a11yLabel": {
|
|
47
|
+
"type": "string",
|
|
48
|
+
"mutable": false,
|
|
49
|
+
"complexType": {
|
|
50
|
+
"original": "string",
|
|
51
|
+
"resolved": "string | undefined",
|
|
52
|
+
"references": {}
|
|
53
|
+
},
|
|
54
|
+
"required": false,
|
|
55
|
+
"optional": true,
|
|
56
|
+
"docs": {
|
|
57
|
+
"tags": [],
|
|
58
|
+
"text": "Adds accessible label for the spinner that is only shown for screen\nreaders. The `aria-hidden` attribute will be set if no label is present."
|
|
59
|
+
},
|
|
60
|
+
"attribute": "a11y-label",
|
|
61
|
+
"reflect": false
|
|
62
|
+
}
|
|
63
|
+
}; }
|
|
64
|
+
}
|
|
65
|
+
//# sourceMappingURL=cat-spinner.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"cat-spinner.js","sourceRoot":"","sources":["../../../src/components/cat-spinner/cat-spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AAEnD;;GAEG;AAMH,MAAM,OAAO,UAAU;EALvB;IAME;;OAEG;IACK,SAAI,GAA6C,GAAG,CAAC;GAuB9D;EAfC,MAAM;IACJ,OAAO,CACL,0BACc,IAAI,CAAC,SAAS,iBACb,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,EAC3C,KAAK,EAAE;QACL,CAAC,eAAe,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI,CAAC,IAAI,KAAK,QAAQ;OACrD;MAED,WAAK,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,WAAW;QACzD,cAAQ,EAAE,EAAC,IAAI,EAAC,EAAE,EAAC,IAAI,EAAC,CAAC,EAAC,MAAM,GAAU,CACtC,CACD,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\n\n/**\n * Spinners are used to indicate users that their action is being processed.\n */\n@Component({\n tag: 'cat-spinner',\n styleUrl: 'cat-spinner.scss',\n shadow: true\n})\nexport class CatSpinner {\n /**\n * The size of the spinner.\n */\n @Prop() size: 'xs' | 's' | 'm' | 'l' | 'xl' | 'inline' = 'm';\n\n /**\n * Adds accessible label for the spinner that is only shown for screen\n * readers. The `aria-hidden` attribute will be set if no label is present.\n */\n @Prop({ attribute: 'a11y-label' }) a11yLabel?: string;\n\n render() {\n return (\n <span\n aria-label={this.a11yLabel}\n aria-hidden={this.a11yLabel ? null : 'true'}\n class={{\n [`cat-spinner-${this.size}`]: this.size !== 'inline'\n }}\n >\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 48 48\">\n <circle cx=\"24\" cy=\"24\" r=\"21.5\"></circle>\n </svg>\n </span>\n );\n }\n}\n"]}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
(function (doc) {
|
|
2
|
+
var scriptElm = doc.scripts[doc.scripts.length - 1];
|
|
3
|
+
var warn = ['Discouraged script use, please remove: ' + scriptElm.outerHTML];
|
|
4
|
+
|
|
5
|
+
warn.push('To improve performance it is recommended to set the script in the head as follows:');
|
|
6
|
+
|
|
7
|
+
var parts = scriptElm.src.split('/');
|
|
8
|
+
parts.pop();
|
|
9
|
+
// add subfolder(s) here
|
|
10
|
+
// parts.push('...');
|
|
11
|
+
var url = parts.join('/');
|
|
12
|
+
|
|
13
|
+
scriptElm = doc.createElement('script');
|
|
14
|
+
scriptElm.setAttribute('type', 'module');
|
|
15
|
+
scriptElm.src = url + '/catalyst.esm.js';
|
|
16
|
+
warn.push(scriptElm.outerHTML);
|
|
17
|
+
scriptElm.setAttribute('data-stencil-namespace', 'catalyst');
|
|
18
|
+
doc.head.appendChild(scriptElm);
|
|
19
|
+
|
|
20
|
+
console.warn(warn.join('\n'));
|
|
21
|
+
})(document);
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,yCAAyC,CAAC","sourcesContent":["export { Components, JSX } from './components';\nexport { CatIconRegistry } from './components/cat-icon/cat-icon-registry';\n"]}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { CatIconRegistry } from './components/cat-icon/cat-icon-registry';
|
|
2
|
+
import { ci } from '@haiilo/catalyst-icons';
|
|
3
|
+
function registerIcons() {
|
|
4
|
+
CatIconRegistry.getInstance().addIcons(ci);
|
|
5
|
+
}
|
|
6
|
+
export default function () {
|
|
7
|
+
registerIcons();
|
|
8
|
+
}
|
|
9
|
+
//# sourceMappingURL=init.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"init.js","sourceRoot":"","sources":["../src/init.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,yCAAyC,CAAC;AAC1E,OAAO,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AAE5C,SAAS,aAAa;EACpB,eAAe,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;AAC7C,CAAC;AAED,MAAM,CAAC,OAAO;EACZ,aAAa,EAAE,CAAC;AAClB,CAAC","sourcesContent":["import { CatIconRegistry } from './components/cat-icon/cat-icon-registry';\nimport { ci } from '@haiilo/catalyst-icons';\n\nfunction registerIcons() {\n CatIconRegistry.getInstance().addIcons(ci);\n}\n\nexport default function () {\n registerIcons();\n}\n"]}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
const _breakpoints = ['xs', 's', 'm', 'l', 'xl'];
|
|
2
|
+
export const Breakpoints = {
|
|
3
|
+
xs: '(max-width: 539.98px)',
|
|
4
|
+
s: '(max-width: 767.98px)',
|
|
5
|
+
m: '(max-width: 991.98px)',
|
|
6
|
+
l: '(max-width: 1199.98px)',
|
|
7
|
+
xl: '(max-width: 1399.98px)'
|
|
8
|
+
};
|
|
9
|
+
export function isBreakpoint(value) {
|
|
10
|
+
return typeof value === 'string' && _breakpoints.includes(value);
|
|
11
|
+
}
|
|
12
|
+
//# sourceMappingURL=breakpoints.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"breakpoints.js","sourceRoot":"","sources":["../../src/utils/breakpoints.ts"],"names":[],"mappings":"AAAA,MAAM,YAAY,GAAG,CAAC,IAAI,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,IAAI,CAAU,CAAC;AAI1D,MAAM,CAAC,MAAM,WAAW,GAA2C;EACjE,EAAE,EAAE,uBAAuB;EAC3B,CAAC,EAAE,uBAAuB;EAC1B,CAAC,EAAE,uBAAuB;EAC1B,CAAC,EAAE,wBAAwB;EAC3B,EAAE,EAAE,wBAAwB;CAC7B,CAAC;AAEF,MAAM,UAAU,YAAY,CAAC,KAAc;EACzC,OAAO,OAAO,KAAK,KAAK,QAAQ,IAAI,YAAY,CAAC,QAAQ,CAAC,KAAmB,CAAC,CAAC;AACjF,CAAC","sourcesContent":["const _breakpoints = ['xs', 's', 'm', 'l', 'xl'] as const;\n\nexport type Breakpoint = typeof _breakpoints[number];\n\nexport const Breakpoints: { [breakpoint in Breakpoint]: string } = {\n xs: '(max-width: 539.98px)',\n s: '(max-width: 767.98px)',\n m: '(max-width: 991.98px)',\n l: '(max-width: 1199.98px)',\n xl: '(max-width: 1399.98px)'\n};\n\nexport function isBreakpoint(value: unknown): value is Breakpoint {\n return typeof value === 'string' && _breakpoints.includes(value as Breakpoint);\n}\n"]}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import log from 'loglevel';
|
|
2
|
+
import { Platform } from './platform';
|
|
3
|
+
// https://github.com/angular/components/blob/master/src/cdk/layout/media-matcher.ts
|
|
4
|
+
/** Global registry for all dynamically-created, injected media queries. */
|
|
5
|
+
const mediaQueriesForWebkitCompatibility = new Set();
|
|
6
|
+
/** Style tag that holds all of the dynamically-created media queries. */
|
|
7
|
+
let mediaQueryStyleNode;
|
|
8
|
+
/** A utility for calling matchMedia queries. */
|
|
9
|
+
export class MediaMatcher {
|
|
10
|
+
constructor() {
|
|
11
|
+
this._platform = new Platform();
|
|
12
|
+
this._matchMedia = window.matchMedia.bind(window);
|
|
13
|
+
}
|
|
14
|
+
/**
|
|
15
|
+
* Evaluates the given media query and returns the native MediaQueryList from which results
|
|
16
|
+
* can be retrieved.
|
|
17
|
+
* Confirms the layout engine will trigger for the selector query provided and returns the
|
|
18
|
+
* MediaQueryList for the query provided.
|
|
19
|
+
*/
|
|
20
|
+
matchMedia(query) {
|
|
21
|
+
if (this._platform.WEBKIT || this._platform.BLINK) {
|
|
22
|
+
createEmptyStyleRule(query);
|
|
23
|
+
}
|
|
24
|
+
return this._matchMedia(query);
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* Creates an empty stylesheet that is used to work around browser inconsistencies related to
|
|
29
|
+
* `matchMedia`. At the time of writing, it handles the following cases:
|
|
30
|
+
* 1. On WebKit browsers, a media query has to have at least one rule in order for `matchMedia`
|
|
31
|
+
* to fire. We work around it by declaring a dummy stylesheet with a `@media` declaration.
|
|
32
|
+
* 2. In some cases Blink browsers will stop firing the `matchMedia` listener if none of the rules
|
|
33
|
+
* inside the `@media` match existing elements on the page. We work around it by having one rule
|
|
34
|
+
* targeting the `body`. See https://github.com/angular/components/issues/23546.
|
|
35
|
+
*/
|
|
36
|
+
function createEmptyStyleRule(query) {
|
|
37
|
+
if (mediaQueriesForWebkitCompatibility.has(query)) {
|
|
38
|
+
return;
|
|
39
|
+
}
|
|
40
|
+
try {
|
|
41
|
+
if (!mediaQueryStyleNode) {
|
|
42
|
+
mediaQueryStyleNode = document.createElement('style');
|
|
43
|
+
mediaQueryStyleNode.setAttribute('type', 'text/css');
|
|
44
|
+
document.head.appendChild(mediaQueryStyleNode);
|
|
45
|
+
}
|
|
46
|
+
if (mediaQueryStyleNode.sheet) {
|
|
47
|
+
mediaQueryStyleNode.sheet.insertRule(`@media ${query} {body{ }}`, 0);
|
|
48
|
+
mediaQueriesForWebkitCompatibility.add(query);
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
catch (e) {
|
|
52
|
+
log.error(e);
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
//# sourceMappingURL=media-matcher.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"media-matcher.js","sourceRoot":"","sources":["../../src/utils/media-matcher.ts"],"names":[],"mappings":"AAAA,OAAO,GAAG,MAAM,UAAU,CAAC;AAC3B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAEtC,oFAAoF;AAEpF,2EAA2E;AAC3E,MAAM,kCAAkC,GAAgB,IAAI,GAAG,EAAU,CAAC;AAE1E,yEAAyE;AACzE,IAAI,mBAAiD,CAAC;AAEtD,gDAAgD;AAChD,MAAM,OAAO,YAAY;EAIvB;IACE,IAAI,CAAC,SAAS,GAAG,IAAI,QAAQ,EAAE,CAAC;IAChC,IAAI,CAAC,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;EACpD,CAAC;EAED;;;;;KAKG;EACH,UAAU,CAAC,KAAa;IACtB,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,IAAI,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE;MACjD,oBAAoB,CAAC,KAAK,CAAC,CAAC;KAC7B;IACD,OAAO,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;EACjC,CAAC;CACF;AAED;;;;;;;;GAQG;AACH,SAAS,oBAAoB,CAAC,KAAa;EACzC,IAAI,kCAAkC,CAAC,GAAG,CAAC,KAAK,CAAC,EAAE;IACjD,OAAO;GACR;EAED,IAAI;IACF,IAAI,CAAC,mBAAmB,EAAE;MACxB,mBAAmB,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;MACtD,mBAAmB,CAAC,YAAY,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;MACrD,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,mBAAmB,CAAC,CAAC;KAChD;IACD,IAAI,mBAAmB,CAAC,KAAK,EAAE;MAC7B,mBAAmB,CAAC,KAAK,CAAC,UAAU,CAAC,UAAU,KAAK,YAAY,EAAE,CAAC,CAAC,CAAC;MACrE,kCAAkC,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;KAC/C;GACF;EAAC,OAAO,CAAC,EAAE;IACV,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;GACd;AACH,CAAC","sourcesContent":["import log from 'loglevel';\nimport { Platform } from './platform';\n\n// https://github.com/angular/components/blob/master/src/cdk/layout/media-matcher.ts\n\n/** Global registry for all dynamically-created, injected media queries. */\nconst mediaQueriesForWebkitCompatibility: Set<string> = new Set<string>();\n\n/** Style tag that holds all of the dynamically-created media queries. */\nlet mediaQueryStyleNode: HTMLStyleElement | undefined;\n\n/** A utility for calling matchMedia queries. */\nexport class MediaMatcher {\n private _platform;\n private _matchMedia: (query: string) => MediaQueryList;\n\n constructor() {\n this._platform = new Platform();\n this._matchMedia = window.matchMedia.bind(window);\n }\n\n /**\n * Evaluates the given media query and returns the native MediaQueryList from which results\n * can be retrieved.\n * Confirms the layout engine will trigger for the selector query provided and returns the\n * MediaQueryList for the query provided.\n */\n matchMedia(query: string): MediaQueryList {\n if (this._platform.WEBKIT || this._platform.BLINK) {\n createEmptyStyleRule(query);\n }\n return this._matchMedia(query);\n }\n}\n\n/**\n * Creates an empty stylesheet that is used to work around browser inconsistencies related to\n * `matchMedia`. At the time of writing, it handles the following cases:\n * 1. On WebKit browsers, a media query has to have at least one rule in order for `matchMedia`\n * to fire. We work around it by declaring a dummy stylesheet with a `@media` declaration.\n * 2. In some cases Blink browsers will stop firing the `matchMedia` listener if none of the rules\n * inside the `@media` match existing elements on the page. We work around it by having one rule\n * targeting the `body`. See https://github.com/angular/components/issues/23546.\n */\nfunction createEmptyStyleRule(query: string) {\n if (mediaQueriesForWebkitCompatibility.has(query)) {\n return;\n }\n\n try {\n if (!mediaQueryStyleNode) {\n mediaQueryStyleNode = document.createElement('style');\n mediaQueryStyleNode.setAttribute('type', 'text/css');\n document.head.appendChild(mediaQueryStyleNode);\n }\n if (mediaQueryStyleNode.sheet) {\n mediaQueryStyleNode.sheet.insertRule(`@media ${query} {body{ }}`, 0);\n mediaQueriesForWebkitCompatibility.add(query);\n }\n } catch (e) {\n log.error(e);\n }\n}\n"]}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
// https://github.com/angular/components/blob/master/src/cdk/platform/platform.ts
|
|
2
|
+
// Whether the current platform supports the V8 Break Iterator. The V8 check
|
|
3
|
+
// is necessary to detect all Blink based browsers.
|
|
4
|
+
let hasV8BreakIterator;
|
|
5
|
+
// We need a try/catch around the reference to `Intl`, because accessing it in some cases can
|
|
6
|
+
// cause IE to throw. These cases are tied to particular versions of Windows and can happen if
|
|
7
|
+
// the consumer is providing a polyfilled `Map`. See:
|
|
8
|
+
// https://github.com/Microsoft/ChakraCore/issues/3189
|
|
9
|
+
// https://github.com/angular/components/issues/15687
|
|
10
|
+
try {
|
|
11
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
12
|
+
hasV8BreakIterator = typeof Intl !== 'undefined' && Intl.v8BreakIterator;
|
|
13
|
+
}
|
|
14
|
+
catch (_a) {
|
|
15
|
+
hasV8BreakIterator = false;
|
|
16
|
+
}
|
|
17
|
+
export class Platform {
|
|
18
|
+
constructor() {
|
|
19
|
+
/** Whether the current browser is Microsoft Edge. */
|
|
20
|
+
this.EDGE = /(edge)/i.test(navigator.userAgent);
|
|
21
|
+
/** Whether the current rendering engine is Microsoft Trident. */
|
|
22
|
+
this.TRIDENT = /(msie|trident)/i.test(navigator.userAgent);
|
|
23
|
+
// EdgeHTML and Trident mock Blink specific things and need to be excluded from this check.
|
|
24
|
+
/** Whether the current rendering engine is Blink. */
|
|
25
|
+
this.BLINK =
|
|
26
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
27
|
+
!!(window.chrome || hasV8BreakIterator) && typeof CSS !== 'undefined' && !this.EDGE && !this.TRIDENT;
|
|
28
|
+
// Webkit is part of the userAgent in EdgeHTML, Blink and Trident. Therefore we need to
|
|
29
|
+
// ensure that Webkit runs standalone and is not used as another engine's base.
|
|
30
|
+
/** Whether the current rendering engine is WebKit. */
|
|
31
|
+
this.WEBKIT = /AppleWebKit/i.test(navigator.userAgent) && !this.BLINK && !this.EDGE && !this.TRIDENT;
|
|
32
|
+
/** Whether the current platform is Apple iOS. */
|
|
33
|
+
this.IOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !('MSStream' in window);
|
|
34
|
+
// It's difficult to detect the plain Gecko engine, because most of the browsers identify
|
|
35
|
+
// them self as Gecko-like browsers and modify the userAgent's according to that.
|
|
36
|
+
// Since we only cover one explicit Firefox case, we can simply check for Firefox
|
|
37
|
+
// instead of having an unstable check for Gecko.
|
|
38
|
+
/** Whether the current browser is Firefox. */
|
|
39
|
+
this.FIREFOX = /(firefox|minefield)/i.test(navigator.userAgent);
|
|
40
|
+
/** Whether the current platform is Android. */
|
|
41
|
+
// Trident on mobile adds the android platform to the userAgent to trick detections.
|
|
42
|
+
this.ANDROID = /android/i.test(navigator.userAgent) && !this.TRIDENT;
|
|
43
|
+
// Safari browsers will include the Safari keyword in their userAgent. Some browsers may fake
|
|
44
|
+
// this and just place the Safari keyword in the userAgent. To be more safe about Safari every
|
|
45
|
+
// Safari browser should also use Webkit as its layout engine.
|
|
46
|
+
/** Whether the current browser is Safari. */
|
|
47
|
+
this.SAFARI = /safari/i.test(navigator.userAgent) && this.WEBKIT;
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
//# sourceMappingURL=platform.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"platform.js","sourceRoot":"","sources":["../../src/utils/platform.ts"],"names":[],"mappings":"AAAA,iFAAiF;AAEjF,4EAA4E;AAC5E,mDAAmD;AACnD,IAAI,kBAA2B,CAAC;AAEhC,6FAA6F;AAC7F,8FAA8F;AAC9F,qDAAqD;AACrD,sDAAsD;AACtD,qDAAqD;AACrD,IAAI;EACF,8DAA8D;EAC9D,kBAAkB,GAAG,OAAO,IAAI,KAAK,WAAW,IAAK,IAAY,CAAC,eAAe,CAAC;CACnF;AAAC,WAAM;EACN,kBAAkB,GAAG,KAAK,CAAC;CAC5B;AAED,MAAM,OAAO,QAAQ;EAArB;IACE,qDAAqD;IACrD,SAAI,GAAY,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;IAEpD,iEAAiE;IACjE,YAAO,GAAY,iBAAiB,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;IAE/D,2FAA2F;IAC3F,qDAAqD;IACrD,UAAK;IACH,8DAA8D;IAC9D,CAAC,CAAC,CAAE,MAAc,CAAC,MAAM,IAAI,kBAAkB,CAAC,IAAI,OAAO,GAAG,KAAK,WAAW,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;IAEhH,uFAAuF;IACvF,+EAA+E;IAC/E,sDAAsD;IACtD,WAAM,GAAY,cAAc,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;IAEzG,iDAAiD;IACjD,QAAG,GAAY,kBAAkB,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,UAAU,IAAI,MAAM,CAAC,CAAC;IAEvF,yFAAyF;IACzF,iFAAiF;IACjF,iFAAiF;IACjF,iDAAiD;IACjD,8CAA8C;IAC9C,YAAO,GAAY,sBAAsB,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAC;IAEpE,+CAA+C;IAC/C,oFAAoF;IACpF,YAAO,GAAY,UAAU,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC;IAEzE,6FAA6F;IAC7F,8FAA8F;IAC9F,8DAA8D;IAC9D,6CAA6C;IAC7C,WAAM,GAAY,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,MAAM,CAAC;EACvE,CAAC;CAAA","sourcesContent":["// https://github.com/angular/components/blob/master/src/cdk/platform/platform.ts\n\n// Whether the current platform supports the V8 Break Iterator. The V8 check\n// is necessary to detect all Blink based browsers.\nlet hasV8BreakIterator: boolean;\n\n// We need a try/catch around the reference to `Intl`, because accessing it in some cases can\n// cause IE to throw. These cases are tied to particular versions of Windows and can happen if\n// the consumer is providing a polyfilled `Map`. See:\n// https://github.com/Microsoft/ChakraCore/issues/3189\n// https://github.com/angular/components/issues/15687\ntry {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n hasV8BreakIterator = typeof Intl !== 'undefined' && (Intl as any).v8BreakIterator;\n} catch {\n hasV8BreakIterator = false;\n}\n\nexport class Platform {\n /** Whether the current browser is Microsoft Edge. */\n EDGE: boolean = /(edge)/i.test(navigator.userAgent);\n\n /** Whether the current rendering engine is Microsoft Trident. */\n TRIDENT: boolean = /(msie|trident)/i.test(navigator.userAgent);\n\n // EdgeHTML and Trident mock Blink specific things and need to be excluded from this check.\n /** Whether the current rendering engine is Blink. */\n BLINK: boolean =\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n !!((window as any).chrome || hasV8BreakIterator) && typeof CSS !== 'undefined' && !this.EDGE && !this.TRIDENT;\n\n // Webkit is part of the userAgent in EdgeHTML, Blink and Trident. Therefore we need to\n // ensure that Webkit runs standalone and is not used as another engine's base.\n /** Whether the current rendering engine is WebKit. */\n WEBKIT: boolean = /AppleWebKit/i.test(navigator.userAgent) && !this.BLINK && !this.EDGE && !this.TRIDENT;\n\n /** Whether the current platform is Apple iOS. */\n IOS: boolean = /iPad|iPhone|iPod/.test(navigator.userAgent) && !('MSStream' in window);\n\n // It's difficult to detect the plain Gecko engine, because most of the browsers identify\n // them self as Gecko-like browsers and modify the userAgent's according to that.\n // Since we only cover one explicit Firefox case, we can simply check for Firefox\n // instead of having an unstable check for Gecko.\n /** Whether the current browser is Firefox. */\n FIREFOX: boolean = /(firefox|minefield)/i.test(navigator.userAgent);\n\n /** Whether the current platform is Android. */\n // Trident on mobile adds the android platform to the userAgent to trick detections.\n ANDROID: boolean = /android/i.test(navigator.userAgent) && !this.TRIDENT;\n\n // Safari browsers will include the Safari keyword in their userAgent. Some browsers may fake\n // this and just place the Safari keyword in the userAgent. To be more safe about Safari every\n // Safari browser should also use Webkit as its layout engine.\n /** Whether the current browser is Safari. */\n SAFARI: boolean = /safari/i.test(navigator.userAgent) && this.WEBKIT;\n}\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/utils/utils.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,MAAM,CAAC,KAAa,EAAE,MAAc,EAAE,IAAY;EAChE,OAAO,CAAC,KAAK,IAAI,EAAE,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;AACjF,CAAC","sourcesContent":["export function format(first: string, middle: string, last: string): string {\n return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');\n}\n"]}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
|
|
2
2
|
|
|
3
3
|
const catAlertCss = ":host{display:block;margin-bottom:1rem}:host([hidden]){display:none}.cat-alert{font:inherit;color:rgb(var(--text));background-color:rgba(var(--bg), 0.1);box-shadow:inset 0 0 0 1px rgba(var(--border), 0.2);border-radius:0.25rem;padding:0.75rem 1rem;width:100%}::slotted(:last-child){margin-bottom:0 !important}.cat-alert-primary{--bg:var(--cat-primary-bg, 32, 127, 138);--text:var(--cat-primary-text, 32, 127, 138);--border:var(--cat-primary-text, 32, 127, 138)}.cat-alert-secondary{--bg:105, 118, 135;--text:0, 0, 0;--border:105, 118, 135}.cat-alert-success{--bg:0, 132, 88;--text:0, 132, 88;--border:0, 132, 88}.cat-alert-warning{--bg:255, 206, 128;--text:159, 97, 0;--border:159, 97, 0}.cat-alert-danger{--bg:217, 52, 13;--text:217, 52, 13;--border:217, 52, 13}";
|
|
4
4
|
|
|
5
|
-
const CatAlert = class {
|
|
6
|
-
constructor(
|
|
7
|
-
|
|
5
|
+
const CatAlert$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
6
|
+
constructor() {
|
|
7
|
+
super();
|
|
8
|
+
this.__registerHost();
|
|
9
|
+
this.__attachShadow();
|
|
8
10
|
/**
|
|
9
11
|
* The color palette of the alert.
|
|
10
12
|
*/
|
|
@@ -16,9 +18,27 @@ const CatAlert = class {
|
|
|
16
18
|
[`cat-alert-${this.color}`]: Boolean(this.color)
|
|
17
19
|
} }, h("slot", null)));
|
|
18
20
|
}
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
+
static get style() { return catAlertCss; }
|
|
22
|
+
}, [1, "cat-alert", {
|
|
23
|
+
"color": [1]
|
|
24
|
+
}]);
|
|
25
|
+
function defineCustomElement$1() {
|
|
26
|
+
if (typeof customElements === "undefined") {
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
const components = ["cat-alert"];
|
|
30
|
+
components.forEach(tagName => { switch (tagName) {
|
|
31
|
+
case "cat-alert":
|
|
32
|
+
if (!customElements.get(tagName)) {
|
|
33
|
+
customElements.define(tagName, CatAlert$1);
|
|
34
|
+
}
|
|
35
|
+
break;
|
|
36
|
+
} });
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
const CatAlert = CatAlert$1;
|
|
40
|
+
const defineCustomElement = defineCustomElement$1;
|
|
21
41
|
|
|
22
|
-
export { CatAlert
|
|
42
|
+
export { CatAlert, defineCustomElement };
|
|
23
43
|
|
|
24
|
-
//# sourceMappingURL=cat-alert.
|
|
44
|
+
//# sourceMappingURL=cat-alert.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"cat-alert.js","mappings":";;AAAA,MAAM,WAAW,GAAG,6vBAA6vB;;MCYpwBA,UAAQ;EALrB;;;;;;;IASU,UAAK,GAA+D,SAAS,CAAC;GAevF;EAbC,MAAM;IACJ,QACE,WACE,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE;QACL,WAAW,EAAE,IAAI;QACjB,CAAC,aAAa,IAAI,CAAC,KAAK,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;OACjD,IAED,eAAa,CACT,EACN;GACH;;;;;;;;;;;;;;;;;;;;;;;;","names":["CatAlert"],"sources":["./src/components/cat-alert/cat-alert.scss?tag=cat-alert&encapsulation=shadow","./src/components/cat-alert/cat-alert.tsx"],"sourcesContent":["@use 'variables' as *;\n@use 'mixins' as *;\n\n:host {\n display: block;\n margin-bottom: $cat-body-margin-bottom;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n.cat-alert {\n font: inherit;\n color: cat-token-wrap(var(--text));\n background-color: cat-token-wrap(var(--bg), $alpha: 0.1);\n box-shadow: inset 0 0 0 1px cat-token-wrap(var(--border), $alpha: 0.2);\n border-radius: cat-border-radius('m');\n padding: cat-size('xs') * 0.5 cat-size('s') * 0.5;\n width: 100%;\n}\n\n::slotted(:last-child) {\n margin-bottom: 0 !important;\n}\n\n// ----- theme\n\n@mixin theme($theme) {\n .cat-alert-#{$theme} {\n --bg: #{cat-token('color.theme.#{$theme}.bg', $wrap: false)};\n --text: #{cat-token('color.theme.#{$theme}.text', $wrap: false)};\n @if $theme == 'secondary' {\n --border: #{cat-token('color.theme.#{$theme}.bg', $wrap: false)};\n } @else {\n --border: #{cat-token('color.theme.#{$theme}.text', $wrap: false)};\n }\n }\n}\n\n@include theme('primary');\n@include theme('secondary');\n@include theme('success');\n@include theme('warning');\n@include theme('danger');\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * Alerts are used to display important messages inline.\n *\n * @part alert - The content of the alert.\n */\n@Component({\n tag: 'cat-alert',\n styleUrl: 'cat-alert.scss',\n shadow: true\n})\nexport class CatAlert {\n /**\n * The color palette of the alert.\n */\n @Prop() color: 'primary' | 'secondary' | 'danger' | 'success' | 'warning' = 'primary';\n\n render() {\n return (\n <div\n part=\"alert\"\n class={{\n 'cat-alert': true,\n [`cat-alert-${this.color}`]: Boolean(this.color)\n }}\n >\n <slot></slot>\n </div>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
|
|
2
2
|
|
|
3
3
|
const catBadgeCss = ":host{display:inline-flex;max-width:100%;vertical-align:baseline}:host([hidden]){display:none}.cat-badge{font:inherit;flex:1 1 auto;display:inline-flex;align-items:center;justify-content:center;border-radius:0.125rem;text-decoration:none;width:100%;box-sizing:border-box;line-height:1;white-space:nowrap}.cat-badge slot{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.cat-badge-round{border-radius:10rem}.cat-badge-filled{background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight:600;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale}.cat-badge-outlined{background-color:white;box-shadow:inset 0 0 0 1px rgba(var(--border), 0.2);color:rgb(var(--text))}.cat-badge-primary{--bg:var(--cat-primary-bg, 32, 127, 138);--fill:var(--cat-primary-fill, 255, 255, 255);--text:var(--cat-primary-text, 32, 127, 138);--border:var(--cat-primary-text, 32, 127, 138)}.cat-badge-secondary{--bg:105, 118, 135;--fill:255, 255, 255;--text:0, 0, 0;--border:105, 118, 135}.cat-badge-success{--bg:0, 132, 88;--fill:255, 255, 255;--text:0, 132, 88;--border:0, 132, 88}.cat-badge-warning{--bg:255, 206, 128;--fill:0, 0, 0;--text:159, 97, 0;--border:159, 97, 0}.cat-badge-danger{--bg:217, 52, 13;--fill:255, 255, 255;--text:217, 52, 13;--border:217, 52, 13}.cat-badge-xs{height:0.75rem;min-width:0.75rem;font-size:0.75rem;padding:0 0.1875rem}.cat-badge-s{height:1rem;min-width:1rem;font-size:0.75rem;padding:0 0.25rem}.cat-badge-m{height:1.25rem;min-width:1.25rem;font-size:0.75rem;padding:0 0.3125rem}.cat-badge-l{height:1.5rem;min-width:1.5rem;font-size:0.875rem;padding:0 0.375rem}.cat-badge-xl{height:1.75rem;min-width:1.75rem;font-size:0.9375rem;padding:0 0.4375rem}.cat-badge-pulse.cat-badge-filled{animation:1.5s ease 0s infinite normal none running pulse}.cat-badge-pulse.cat-badge-outlined{animation:1.5s ease 0s infinite normal none running pulse-outlined}@keyframes pulse{0%{box-shadow:0 0 0 0 rgb(var(--bg))}70%{box-shadow:transparent 0 0 0 0.5rem}100%{box-shadow:transparent 0 0 0 0}}@keyframes pulse-outlined{0%{box-shadow:0 0 0 0 rgb(var(--bg)), inset 0 0 0 1px rgba(var(--border), 0.2)}70%{box-shadow:transparent 0 0 0 0.5rem, inset 0 0 0 1px rgba(var(--border), 0.2)}100%{box-shadow:transparent 0 0 0 0, inset 0 0 0 1px rgba(var(--border), 0.2)}}";
|
|
4
4
|
|
|
5
|
-
const CatBadge = class {
|
|
6
|
-
constructor(
|
|
7
|
-
|
|
5
|
+
const CatBadge$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
6
|
+
constructor() {
|
|
7
|
+
super();
|
|
8
|
+
this.__registerHost();
|
|
9
|
+
this.__attachShadow();
|
|
8
10
|
/**
|
|
9
11
|
* The rendering style of the badge.
|
|
10
12
|
*/
|
|
@@ -36,9 +38,31 @@ const CatBadge = class {
|
|
|
36
38
|
[`cat-badge-${this.size}`]: Boolean(this.size)
|
|
37
39
|
} }, h("slot", null)));
|
|
38
40
|
}
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
+
static get style() { return catBadgeCss; }
|
|
42
|
+
}, [1, "cat-badge", {
|
|
43
|
+
"variant": [1],
|
|
44
|
+
"color": [1],
|
|
45
|
+
"size": [1],
|
|
46
|
+
"round": [4],
|
|
47
|
+
"pulse": [4]
|
|
48
|
+
}]);
|
|
49
|
+
function defineCustomElement$1() {
|
|
50
|
+
if (typeof customElements === "undefined") {
|
|
51
|
+
return;
|
|
52
|
+
}
|
|
53
|
+
const components = ["cat-badge"];
|
|
54
|
+
components.forEach(tagName => { switch (tagName) {
|
|
55
|
+
case "cat-badge":
|
|
56
|
+
if (!customElements.get(tagName)) {
|
|
57
|
+
customElements.define(tagName, CatBadge$1);
|
|
58
|
+
}
|
|
59
|
+
break;
|
|
60
|
+
} });
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
const CatBadge = CatBadge$1;
|
|
64
|
+
const defineCustomElement = defineCustomElement$1;
|
|
41
65
|
|
|
42
|
-
export { CatBadge
|
|
66
|
+
export { CatBadge, defineCustomElement };
|
|
43
67
|
|
|
44
|
-
//# sourceMappingURL=cat-badge.
|
|
68
|
+
//# sourceMappingURL=cat-badge.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"cat-badge.js","mappings":";;AAAA,MAAM,WAAW,GAAG,2vEAA2vE;;MCYlwEA,UAAQ;EALrB;;;;;;;IASU,YAAO,GAA0B,QAAQ,CAAC;;;;IAK1C,UAAK,GAA+D,SAAS,CAAC;;;;IAK9E,SAAI,GAAkC,GAAG,CAAC;;;;IAK1C,UAAK,GAAG,KAAK,CAAC;;;;IAKd,UAAK,GAAG,KAAK,CAAC;GAmBvB;EAjBC,MAAM;IACJ,QACE,YACE,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE;QACL,WAAW,EAAE,IAAI;QACjB,iBAAiB,EAAE,IAAI,CAAC,KAAK;QAC7B,iBAAiB,EAAE,IAAI,CAAC,KAAK;QAC7B,CAAC,aAAa,IAAI,CAAC,OAAO,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC;QACpD,CAAC,aAAa,IAAI,CAAC,KAAK,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC;QAChD,CAAC,aAAa,IAAI,CAAC,IAAI,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC;OAC/C,IAED,eAAa,CACR,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["CatBadge"],"sources":["./src/components/cat-badge/cat-badge.scss?tag=cat-badge&encapsulation=shadow","./src/components/cat-badge/cat-badge.tsx"],"sourcesContent":["@use 'variables' as *;\n@use 'mixins' as *;\n\n:host {\n display: inline-flex;\n max-width: 100%;\n vertical-align: baseline;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n.cat-badge {\n font: inherit;\n flex: 1 1 auto;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border-radius: cat-border-radius('s');\n text-decoration: none;\n width: 100%;\n box-sizing: border-box;\n line-height: 1;\n white-space: nowrap;\n\n slot {\n display: inline-block;\n @include cat-ellipsis;\n }\n}\n\n// ----- round\n\n.cat-badge-round {\n border-radius: 10rem;\n}\n\n// ----- theme\n\n.cat-badge-filled {\n background-color: cat-token-wrap(var(--bg));\n color: cat-token-wrap(var(--fill));\n font-weight: 600;\n @include cat-font-smooth;\n}\n\n$-outline: inset 0 0 0 1px cat-token-wrap(var(--border), $alpha: 0.2);\n\n.cat-badge-outlined {\n background-color: cat-token('color.ui.background.body');\n box-shadow: $-outline;\n color: cat-token-wrap(var(--text));\n}\n\n@mixin theme($theme) {\n .cat-badge-#{$theme} {\n --bg: #{cat-token('color.theme.#{$theme}.bg', $wrap: false)};\n --fill: #{cat-token('color.theme.#{$theme}.fill', $wrap: false)};\n --text: #{cat-token('color.theme.#{$theme}.text', $wrap: false)};\n @if $theme == 'secondary' {\n --border: #{cat-token('color.theme.#{$theme}.bg', $wrap: false)};\n } @else {\n --border: #{cat-token('color.theme.#{$theme}.text', $wrap: false)};\n }\n }\n}\n\n@include theme('primary');\n@include theme('secondary');\n@include theme('success');\n@include theme('warning');\n@include theme('danger');\n\n// ----- size\n\n@mixin size($size, $fontSize) {\n .cat-badge-#{$size} {\n height: cat-size($size) * 0.5;\n min-width: cat-size($size) * 0.5;\n font-size: cat-body-font-size($fontSize);\n padding: 0 cat-size($size) * 0.125;\n }\n}\n\n@include size('xs', 'xs');\n@include size('s', 'xs');\n@include size('m', 'xs');\n@include size('l', 's');\n@include size('xl', 'm');\n\n// ----- pulse\n\n$-pulse-0: 0 0 0 0 cat-token-wrap(var(--bg));\n$-pulse-70: transparent 0 0 0 0.5rem;\n$-pulse-100: transparent 0 0 0 0;\n\n.cat-badge-pulse {\n &.cat-badge-filled {\n animation: 1.5s ease 0s infinite normal none running pulse;\n }\n\n &.cat-badge-outlined {\n animation: 1.5s ease 0s infinite normal none running pulse-outlined;\n }\n}\n\n@keyframes pulse {\n 0% {\n box-shadow: $-pulse-0;\n }\n\n 70% {\n box-shadow: $-pulse-70;\n }\n\n 100% {\n box-shadow: $-pulse-100;\n }\n}\n\n@keyframes pulse-outlined {\n 0% {\n box-shadow: $-pulse-0, $-outline;\n }\n\n 70% {\n box-shadow: $-pulse-70, $-outline;\n }\n\n 100% {\n box-shadow: $-pulse-100, $-outline;\n }\n}\n","import { Component, h, Prop } from '@stencil/core';\n\n/**\n * Badges are used to draw attention and display statuses or counts.\n *\n * @part badge - The content of the badge.\n */\n@Component({\n tag: 'cat-badge',\n styleUrl: 'cat-badge.scss',\n shadow: true\n})\nexport class CatBadge {\n /**\n * The rendering style of the badge.\n */\n @Prop() variant: 'filled' | 'outlined' = 'filled';\n\n /**\n * The color palette of the badge.\n */\n @Prop() color: 'primary' | 'secondary' | 'danger' | 'success' | 'warning' = 'primary';\n\n /**\n * The size of the badge.\n */\n @Prop() size: 'xs' | 's' | 'm' | 'l' | 'xl' = 'm';\n\n /**\n * Use round badge edges.\n */\n @Prop() round = false;\n\n /**\n * Draw attention to the badge with a subtle animation.\n */\n @Prop() pulse = false;\n\n render() {\n return (\n <span\n part=\"badge\"\n class={{\n 'cat-badge': true,\n 'cat-badge-round': this.round,\n 'cat-badge-pulse': this.pulse,\n [`cat-badge-${this.variant}`]: Boolean(this.variant),\n [`cat-badge-${this.color}`]: Boolean(this.color),\n [`cat-badge-${this.size}`]: Boolean(this.size)\n }}\n >\n <slot></slot>\n </span>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,44 +1,19 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
|
|
2
|
+
import { d as defineCustomElement$3 } from './cat-icon2.js';
|
|
3
|
+
import { d as defineCustomElement$2 } from './cat-spinner2.js';
|
|
2
4
|
|
|
3
5
|
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
|
|
4
6
|
|
|
5
|
-
function getDefaultExportFromCjs (x) {
|
|
6
|
-
return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
|
|
7
|
-
}
|
|
8
|
-
|
|
9
7
|
function createCommonjsModule(fn, basedir, module) {
|
|
10
8
|
return module = {
|
|
11
9
|
path: basedir,
|
|
12
10
|
exports: {},
|
|
13
11
|
require: function (path, base) {
|
|
14
|
-
return commonjsRequire(
|
|
12
|
+
return commonjsRequire();
|
|
15
13
|
}
|
|
16
14
|
}, fn(module, module.exports), module.exports;
|
|
17
15
|
}
|
|
18
16
|
|
|
19
|
-
function getDefaultExportFromNamespaceIfPresent (n) {
|
|
20
|
-
return n && Object.prototype.hasOwnProperty.call(n, 'default') ? n['default'] : n;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
function getDefaultExportFromNamespaceIfNotNamed (n) {
|
|
24
|
-
return n && Object.prototype.hasOwnProperty.call(n, 'default') && Object.keys(n).length === 1 ? n['default'] : n;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
function getAugmentedNamespace(n) {
|
|
28
|
-
if (n.__esModule) return n;
|
|
29
|
-
var a = Object.defineProperty({}, '__esModule', {value: true});
|
|
30
|
-
Object.keys(n).forEach(function (k) {
|
|
31
|
-
var d = Object.getOwnPropertyDescriptor(n, k);
|
|
32
|
-
Object.defineProperty(a, k, d.get ? d : {
|
|
33
|
-
enumerable: true,
|
|
34
|
-
get: function () {
|
|
35
|
-
return n[k];
|
|
36
|
-
}
|
|
37
|
-
});
|
|
38
|
-
});
|
|
39
|
-
return a;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
17
|
function commonjsRequire () {
|
|
43
18
|
throw new Error('Dynamic requires are not currently supported by @rollup/plugin-commonjs');
|
|
44
19
|
}
|
|
@@ -51,16 +26,12 @@ var loglevel = createCommonjsModule(function (module) {
|
|
|
51
26
|
* Licensed under the MIT license.
|
|
52
27
|
*/
|
|
53
28
|
(function (root, definition) {
|
|
54
|
-
|
|
55
|
-
if (typeof undefined === 'function' && undefined.amd) {
|
|
56
|
-
undefined(definition);
|
|
57
|
-
} else if ('object' === 'object' && module.exports) {
|
|
29
|
+
if (module.exports) {
|
|
58
30
|
module.exports = definition();
|
|
59
31
|
} else {
|
|
60
32
|
root.log = definition();
|
|
61
33
|
}
|
|
62
34
|
}(commonjsGlobal, function () {
|
|
63
|
-
"use strict";
|
|
64
35
|
|
|
65
36
|
// Slightly dubious tricks to cut down minimized file size
|
|
66
37
|
var noop = function() {};
|
|
@@ -460,9 +431,11 @@ function createEmptyStyleRule(query) {
|
|
|
460
431
|
|
|
461
432
|
const catButtonCss = ":host{display:inline-block;max-width:100%;vertical-align:middle;-webkit-user-select:none;-ms-user-select:none;user-select:none;}.cat-button{font:inherit;display:flex;align-items:center;justify-content:center;border:none;border-radius:0.25rem;text-decoration:none;width:100%;box-sizing:border-box;cursor:pointer;transition:color 0.13s linear, border-color 0.13s linear, background-color 0.13s linear, box-shadow 0.13s linear}.cat-button:focus-visible{outline:2px solid #0071ff;outline-offset:1px}.cat-button-ellipsed .cat-button-content{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.cat-button-disabled{cursor:not-allowed;opacity:0.65;filter:grayscale(100%)}.cat-button-round{border-radius:10rem}.cat-button-loading{cursor:default}.cat-button-loading cat-spinner{position:absolute}.cat-button-loading>*:not(cat-spinner){visibility:hidden}.cat-button-filled{background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight:600;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale}.cat-button-outlined{background-color:white;box-shadow:inset 0 0 0 1px rgba(var(--base), 0.2);color:rgb(var(--text))}.cat-button-outlined:hover:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.05)}.cat-button-outlined:active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-text{background-color:transparent;color:rgb(var(--text));text-decoration:none}.cat-button-text:hover:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:underline}.cat-button-primary{--bg:var(--cat-primary-bg, 32, 127, 138);--fill:var(--cat-primary-fill, 255, 255, 255);--text:var(--cat-primary-text, 32, 127, 138);--base:var(--cat-primary-text, 32, 127, 138)}.cat-button-primary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-hover, 28, 112, 122);--fill:var(--cat-primary-fill-hover, 255, 255, 255);--text:var(--cat-primary-text-hover, 28, 112, 122)}.cat-button-primary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-active, 25, 101, 110);--fill:var(--cat-primary-fill-active, 255, 255, 255);--text:var(--cat-primary-text-active, 25, 101, 110)}.cat-button-secondary{--bg:105, 118, 135;--fill:255, 255, 255;--text:0, 0, 0;--base:105, 118, 135}.cat-button-secondary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:105, 118, 135;--fill:255, 255, 255;--text:0, 0, 0}.cat-button-secondary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:105, 118, 135;--fill:255, 255, 255;--text:0, 0, 0}.cat-button-success{--bg:0, 132, 88;--fill:255, 255, 255;--text:0, 132, 88;--base:0, 132, 88}.cat-button-success:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:0, 117, 78;--fill:255, 255, 255;--text:0, 117, 78}.cat-button-success:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:0, 105, 70;--fill:255, 255, 255;--text:0, 105, 70}.cat-button-warning{--bg:255, 206, 128;--fill:0, 0, 0;--text:159, 97, 0;--base:159, 97, 0}.cat-button-warning:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:255, 214, 148;--fill:0, 0, 0;--text:159, 97, 0}.cat-button-warning:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:255, 222, 168;--fill:0, 0, 0;--text:159, 97, 0}.cat-button-danger{--bg:217, 52, 13;--fill:255, 255, 255;--text:217, 52, 13;--base:217, 52, 13}.cat-button-danger:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:194, 46, 11;--fill:255, 255, 255;--text:194, 46, 11}.cat-button-danger:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:174, 42, 10;--fill:255, 255, 255;--text:174, 42, 10}.cat-button-xs{min-width:1.5rem;padding:0.25rem 0.25rem;font-size:0.875rem;line-height:1rem}.cat-button-xs .cat-button-prefix{margin-right:0.25rem}.cat-button-xs .cat-button-suffix{margin-left:0.25rem}.cat-button-xs.cat-button-icon{width:1.5rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-xs{padding-left:1rem;padding-right:1rem}.cat-button-s{min-width:2rem;padding:0.375rem 0.5rem;font-size:0.9375rem;line-height:1.25rem}.cat-button-s .cat-button-prefix{margin-right:0.25rem}.cat-button-s .cat-button-suffix{margin-left:0.25rem}.cat-button-s cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-s.cat-button-icon{width:2rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-s{padding-left:1rem;padding-right:1rem}.cat-button-m{min-width:2.5rem;padding:0.625rem 0.75rem;font-size:0.9375rem;line-height:1.25rem}.cat-button-m .cat-button-prefix{margin-right:0.25rem}.cat-button-m .cat-button-suffix{margin-left:0.25rem}.cat-button-m cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-m.cat-button-icon{width:2.5rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-m{padding-left:1rem;padding-right:1rem}.cat-button-l{min-width:3rem;padding:0.875rem 1rem;font-size:0.9375rem;line-height:1.25rem}.cat-button-l .cat-button-prefix{margin-right:0.25rem}.cat-button-l .cat-button-suffix{margin-left:0.25rem}.cat-button-l cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-l.cat-button-icon{width:3rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-l{padding-left:1rem;padding-right:1rem}.cat-button-xl{min-width:3.5rem;padding:1rem 1.25rem;font-size:1.125rem;line-height:1.5rem}.cat-button-xl .cat-button-prefix{margin-right:0.25rem}.cat-button-xl .cat-button-suffix{margin-left:0.25rem}.cat-button-xl.cat-button-icon{width:3.5rem;padding-left:0;padding-right:0}:host-context(nav) .cat-button-xl{padding-left:1rem;padding-right:1rem}:host-context(nav){width:100%}:host-context(nav) .cat-button{box-shadow:none;border-radius:0}:host-context(nav) .cat-button:focus-visible{outline-offset:-2px}:host-context(nav) .cat-button-content{text-align:left}:host([hidden]){display:none}:host(.cat-text-left) .cat-button{justify-content:left}:host(.cat-text-right) .cat-button{justify-content:right}";
|
|
462
433
|
|
|
463
|
-
const CatButton = class {
|
|
464
|
-
constructor(
|
|
465
|
-
|
|
434
|
+
const CatButton$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
435
|
+
constructor() {
|
|
436
|
+
super();
|
|
437
|
+
this.__registerHost();
|
|
438
|
+
this.__attachShadow();
|
|
466
439
|
this.catClick = createEvent(this, "catClick", 7);
|
|
467
440
|
this.catFocus = createEvent(this, "catFocus", 7);
|
|
468
441
|
this.catBlur = createEvent(this, "catBlur", 7);
|
|
@@ -627,9 +600,55 @@ const CatButton = class {
|
|
|
627
600
|
static get watchers() { return {
|
|
628
601
|
"iconOnly": ["onIconOnlyChanged"]
|
|
629
602
|
}; }
|
|
630
|
-
}
|
|
631
|
-
|
|
603
|
+
static get style() { return catButtonCss; }
|
|
604
|
+
}, [1, "cat-button", {
|
|
605
|
+
"variant": [1],
|
|
606
|
+
"color": [1],
|
|
607
|
+
"size": [1],
|
|
608
|
+
"name": [1],
|
|
609
|
+
"value": [1],
|
|
610
|
+
"disabled": [4],
|
|
611
|
+
"loading": [4],
|
|
612
|
+
"submit": [4],
|
|
613
|
+
"ellipsed": [4],
|
|
614
|
+
"round": [4],
|
|
615
|
+
"url": [1],
|
|
616
|
+
"urlTarget": [1, "url-target"],
|
|
617
|
+
"icon": [1],
|
|
618
|
+
"iconOnly": [8, "icon-only"],
|
|
619
|
+
"iconSuffix": [4, "icon-suffix"],
|
|
620
|
+
"buttonId": [1, "button-id"],
|
|
621
|
+
"a11yLabel": [1, "a11y-label"],
|
|
622
|
+
"_iconOnly": [32],
|
|
623
|
+
"setFocus": [64]
|
|
624
|
+
}, [[0, "click", "haltDisabledEvents"]]]);
|
|
625
|
+
function defineCustomElement$1() {
|
|
626
|
+
if (typeof customElements === "undefined") {
|
|
627
|
+
return;
|
|
628
|
+
}
|
|
629
|
+
const components = ["cat-button", "cat-icon", "cat-spinner"];
|
|
630
|
+
components.forEach(tagName => { switch (tagName) {
|
|
631
|
+
case "cat-button":
|
|
632
|
+
if (!customElements.get(tagName)) {
|
|
633
|
+
customElements.define(tagName, CatButton$1);
|
|
634
|
+
}
|
|
635
|
+
break;
|
|
636
|
+
case "cat-icon":
|
|
637
|
+
if (!customElements.get(tagName)) {
|
|
638
|
+
defineCustomElement$3();
|
|
639
|
+
}
|
|
640
|
+
break;
|
|
641
|
+
case "cat-spinner":
|
|
642
|
+
if (!customElements.get(tagName)) {
|
|
643
|
+
defineCustomElement$2();
|
|
644
|
+
}
|
|
645
|
+
break;
|
|
646
|
+
} });
|
|
647
|
+
}
|
|
648
|
+
|
|
649
|
+
const CatButton = CatButton$1;
|
|
650
|
+
const defineCustomElement = defineCustomElement$1;
|
|
632
651
|
|
|
633
|
-
export { CatButton
|
|
652
|
+
export { CatButton, defineCustomElement };
|
|
634
653
|
|
|
635
|
-
//# sourceMappingURL=cat-button.
|
|
654
|
+
//# sourceMappingURL=cat-button.js.map
|